.license-gate {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 28px;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  background:
    radial-gradient(circle at 18% 12%, rgba(63, 115, 220, 0.2), transparent 32%),
    linear-gradient(145deg, #e9eff9 0%, #f8fafc 54%, #e8f1ee 100%);
}

.license-gate[hidden],
.activation-modal[hidden],
.license-loading[hidden],
.license-required[hidden],
.license-error[hidden] {
  display: none !important;
}

body.auth-locked #app-wrapper {
  visibility: hidden;
}

.license-card {
  width: min(520px, 100%);
  padding: 40px 46px 34px;
  border: 1px solid rgba(24, 55, 99, 0.13);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.97);
  box-shadow: 0 22px 70px rgba(24, 46, 82, 0.18);
}

@media (max-width: 600px), (max-height: 700px) {
  .license-gate {
    align-items: flex-start;
    padding: 14px;
  }

  .license-card {
    margin: 0 auto;
    padding: 24px 20px 22px;
    border-radius: 14px;
  }

  .license-brand {
    gap: 11px;
    margin-bottom: 18px;
  }

  .license-logo {
    width: 48px;
    height: 48px;
    border-radius: 11px;
    font-size: 24px;
  }

  .license-brand h1 { font-size: 24px; }
  .license-brand p,
  .activation-modal-card > p,
  .license-required > p { font-size: 14px; }

  .license-form { gap: 12px; margin-top: 16px; }
  .license-form input { height: 44px; }
  .license-primary-btn,
  .license-secondary-btn { min-height: 46px; }
}

.license-brand {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 28px;
}

.license-logo {
  display: grid;
  width: 62px;
  height: 62px;
  place-items: center;
  border-radius: 14px;
  color: #fff;
  background: linear-gradient(145deg, #2458a6, #173b78);
  box-shadow: 0 8px 18px rgba(31, 78, 145, 0.28);
  font-size: 31px;
  font-weight: 800;
}

.license-brand h1,
.activation-modal-card h2,
.license-required h2 {
  margin: 0;
  color: #172b4d;
}

.license-brand h1 { font-size: 29px; }
.license-brand p,
.activation-modal-card > p,
.license-required > p {
  margin: 5px 0 0;
  color: #66758b;
  line-height: 1.55;
  font-size: 15px;
}

.license-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 120px;
  color: #53657d;
}

.license-spinner {
  width: 19px;
  height: 19px;
  border: 2px solid #ced8e8;
  border-top-color: #275ca8;
  border-radius: 50%;
  animation: license-spin 0.8s linear infinite;
}

@keyframes license-spin { to { transform: rotate(360deg); } }

.license-form {
  display: grid;
  gap: 16px;
  margin-top: 20px;
}

.license-form label {
  display: grid;
  gap: 6px;
  color: #35455b;
  font-size: 15px;
  font-weight: 600;
}

.license-form input {
  width: 100%;
  height: 48px;
  padding: 0 14px;
  border: 1px solid #cbd5e3;
  border-radius: 8px;
  outline: none;
  color: #172b4d;
  background: #fff;
  font: inherit;
  box-sizing: border-box;
}

.license-form input:focus {
  border-color: #2e66b5;
  box-shadow: 0 0 0 3px rgba(46, 102, 181, 0.13);
}

.license-field-hint {
  margin-top: -7px;
  color: #78869a;
  font-size: 14px;
  line-height: 1.45;
}

.activation-code-link,
.license-text-link {
  justify-self: start;
  margin-top: -10px;
  padding: 0;
  border: 0;
  color: #2e66b5;
  background: transparent;
  font: inherit;
  font-size: 13px;
  line-height: 1.45;
  text-decoration: none;
  cursor: pointer;
}

.activation-code-link:hover,
.activation-code-link:focus-visible,
.license-text-link:hover,
.license-text-link:focus-visible {
  color: #1d4f96;
  text-decoration: underline;
}

.license-login-note {
  margin-top: 16px;
  padding: 10px 12px;
  border-radius: 7px;
  background: #f4f7fb;
}

.license-primary-btn,
.license-secondary-btn {
  min-height: 50px;
  font-size: 15px;
  border-radius: 8px;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.license-primary-btn {
  border: 1px solid #23569d;
  color: #fff;
  background: linear-gradient(#326bb8, #23569d);
}

.license-secondary-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  margin-top: 10px;
  border: 1px solid #bdcadd;
  color: #314a6d;
  background: #f6f8fb;
  text-decoration: none;
}

.license-secondary-btn:hover,
.license-secondary-btn:focus-visible { background: #edf2f8; }

.license-primary-btn:disabled,
.license-secondary-btn:disabled { opacity: 0.65; cursor: wait; }

.license-error {
  margin: 12px 0 0;
  padding: 9px 11px;
  border: 1px solid #efc2c2;
  border-radius: 7px;
  color: #9e2929;
  background: #fff3f3;
  font-size: 14px;
  line-height: 1.45;
}

.activation-modal {
  position: fixed;
  inset: 0;
  z-index: 11000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(11, 24, 45, 0.58);
}

.activation-modal-card {
  position: relative;
  width: min(500px, 100%);
  padding: 36px 40px;
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.28);
}

.activation-close {
  position: absolute;
  top: 10px;
  right: 12px;
  width: 32px;
  height: 32px;
  border: 0;
  color: #6a778a;
  background: transparent;
  font-size: 25px;
  cursor: pointer;
}

.license-status-button {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 19px;
  padding: 1px 0;
  border: 0;
  color: var(--sidebar-text);
  background: transparent;
  font-size: 12px;
  line-height: 1.35;
  cursor: pointer;
  text-align: left;
  transition: color 0.12s ease;
}

.license-status-button:hover {
  color: #ffffff;
}

.license-status-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #f5b945;
}

.license-status-button[data-state="licensed"] .license-status-dot { background: #52d488; }
.license-status-button[data-state="trial"] .license-status-dot { background: #f5c04d; }
.license-status-button[data-state="required"] .license-status-dot { background: #ff7373; }
.license-status-button[data-state="development"] .license-status-dot { background: #9fb4d0; }

@media (max-width: 1100px) {
  .license-status-button { max-width: 120px; }
  #license-status-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}

/* 个人中心下方的检查更新操作与红点 */
.header-update-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 19px;
  padding: 1px 0;
  border: 0;
  color: var(--sidebar-text);
  background: transparent;
  font-size: 12px;
  line-height: 1.35;
  cursor: pointer;
  text-align: left;
  transition: color 0.12s ease;
}

.header-update-btn:hover {
  color: #ffffff;
}

.update-icon {
  font-size: 11px;
}

.update-badge {
  position: absolute;
  top: -3px;
  right: -3px;
  width: 9px;
  height: 9px;
  border: 2px solid var(--sidebar-bg);
  border-radius: 50%;
  background: #ff4757;
  animation: pulse-badge 1.5s infinite;
}

@keyframes pulse-badge {
  0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(255, 71, 87, 0.7); }
  70% { transform: scale(1.15); box-shadow: 0 0 0 6px rgba(255, 71, 87, 0); }
  100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(255, 71, 87, 0); }
}

/* 更新弹窗样式 */
.update-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(11, 24, 45, 0.58);
}

.update-modal[hidden] {
  display: none !important;
}

.update-modal-card {
  position: relative;
  width: min(520px, 100%);
  padding: 32px 36px;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.28);
}

.update-modal-close {
  position: absolute;
  top: 12px;
  right: 14px;
  width: 32px;
  height: 32px;
  border: 0;
  color: #6a778a;
  background: transparent;
  font-size: 24px;
  cursor: pointer;
}

.update-header {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 20px;
}

.update-badge-icon {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border-radius: 12px;
  background: linear-gradient(135deg, #e0ebff 0%, #cde0ff 100%);
  font-size: 24px;
}

.update-header h2 {
  margin: 0;
  font-size: 20px;
  color: #172b4d;
}

.update-subtitle {
  margin: 4px 0 0;
  font-size: 13px;
  color: #66758b;
}

.update-info-box {
  background: #f4f7fb;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 12px 16px;
  display: grid;
  gap: 8px;
  margin-bottom: 16px;
}

.update-info-row {
  display: flex;
  align-items: center;
  font-size: 13px;
}

.update-info-row .info-label {
  width: 75px;
  color: #64748b;
  font-weight: 500;
}

.update-tag {
  display: inline-block;
  padding: 2px 8px;
  background: #e0f2fe;
  color: #0369a1;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 600;
}

.version-highlight {
  font-weight: 700;
  color: #2563eb;
}

.size-hint {
  margin-left: 8px;
  color: #8da2ba;
  font-size: 12px;
}

.update-changelog-wrapper {
  margin-bottom: 20px;
}

.changelog-title {
  font-size: 13px;
  font-weight: 600;
  color: #334155;
  margin-bottom: 6px;
}

.changelog-content {
  background: #fafbfc;
  border: 1px solid #e6ebf2;
  border-radius: 6px;
  padding: 10px 14px;
  font-size: 13px;
  color: #475569;
  line-height: 1.6;
  max-height: 140px;
  overflow-y: auto;
  white-space: pre-wrap;
  word-break: break-word;
}

.update-progress-section {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 14px 16px;
  margin-bottom: 20px;
}

.progress-info-row, .progress-meta-row {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  color: #64748b;
}

.progress-bar-track {
  width: 100%;
  height: 8px;
  background: #e2e8f0;
  border-radius: 4px;
  overflow: hidden;
  margin: 8px 0;
}

.progress-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, #3b82f6, #10b981);
  border-radius: 4px;
  transition: width 0.2s ease;
}

.update-modal-actions {
  display: flex;
  gap: 12px;
  justify-content: flex-end;
}

.update-primary-btn {
  padding: 9px 20px;
  background: #2563eb;
  color: #fff;
  border: 0;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s ease;
}

.update-primary-btn:hover {
  background: #1d4ed8;
}

.update-restart-btn {
  padding: 9px 20px;
  background: #059669;
  color: #fff;
  border: 0;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  animation: pulse-green 1.5s infinite;
}

@keyframes pulse-green {
  0% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.6); }
  70% { box-shadow: 0 0 0 8px rgba(16, 185, 129, 0); }
  100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); }
}

.update-secondary-btn {
  padding: 9px 16px;
  background: #f1f5f9;
  color: #475569;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  font-size: 14px;
  cursor: pointer;
}

.update-secondary-btn:hover {
  background: #e2e8f0;
}

.update-error {
  color: #dc2626;
  font-size: 13px;
  margin-bottom: 14px;
}

.update-latest-tip {
  text-align: center;
  padding: 20px 0;
}

.latest-check-icon {
  display: inline-flex;
  width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #ecfdf5;
  color: #059669;
  font-size: 22px;
  font-weight: bold;
  margin-bottom: 12px;
}

.version-meta-tags {
  margin-top: 14px;
  display: flex;
  justify-content: center;
  gap: 16px;
  font-size: 13px;
  color: #64748b;
}

.update-loading-view {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 140px;
  color: #53657d;
}

@media print {
  .license-gate,
  .activation-modal,
  .update-modal,
  .header-update-btn,
  .license-status-button { display: none !important; }
}