:root {
  --page-width: 1120px;
  --text: #25252b;
  --muted: #75757f;
  --line: #e6e6ec;
  --accent: #087af5;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei UI", sans-serif;
  color: var(--text);
  background: #f7f7f9;
  font-synthesis: none;
}
* { box-sizing: border-box; letter-spacing: 0; }
[hidden] { display: none !important; }
body { margin: 0; background: #f7f7f9; color: var(--text); }
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
button:disabled { opacity: .45; cursor: not-allowed; }
button, input, select, .download-button { border-radius: 8px; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible { outline: 3px solid #8ac2fc; outline-offset: 3px; }
svg { width: 20px; height: 20px; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.skip-link { position: fixed; z-index: 100; top: -60px; left: 16px; padding: 12px; background: white; }
.skip-link:focus { top: 8px; }
.site-header { position: sticky; top: 0; z-index: 20; display: flex; justify-content: space-between; width: 100%; max-width: none; height: 72px; min-height: 72px; margin: 0; padding: 0 max(28px, calc((100% - 1120px) / 2)); border-bottom: 1px solid var(--line); background: rgb(255 255 255 / 92%); backdrop-filter: blur(16px); }
.brand { gap: 10px; font-size: 16px; color: #26262c; font-weight: 650; text-decoration: none; }
.brand img { width: 32px; height: 32px; }
.site-actions { gap: 18px; }
.text-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; padding: 0 12px; border: 0; background: transparent; color: #5d5d68; font-size: 13px; text-decoration: none; }
.text-button:hover { color: var(--accent); background: #f0f5fc; }
#account-nav { padding: 0 18px; background: #edf4ff; color: #0673e8; }
main { width: 100%; max-width: none; margin: 0; padding: 0; }
.download-view { position: relative; isolation: isolate; overflow: hidden; display: block; width: 100%; min-height: 500px; height: min(760px, calc(100svh - 180px)); padding: 0; background: #f2f2f6; text-align: center; }
.download-content { position: relative; z-index: 1; padding: 28px 20px 16px; }
.product-scene { position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); width: min(1120px, calc(100% - 48px)); height: calc(100% - 340px); max-width: none; object-fit: contain; object-position: center bottom; }
.product-mark { display: none; }
.release-status { display: inline-flex; gap: 7px; align-items: center; margin: 0 0 14px; padding: 0; background: none; border: 0; color: #6b6b76; font-size: 11px; font-weight: 500; }
.release-status > span { width: 6px; height: 6px; background: #32a174; border-radius: 50%; }
.download-view h1 { margin: 0; font-size: 48px; line-height: 1.2; font-weight: 650; color: #24242b; }
.release-summary { margin: 14px 0 23px; color: #6d6d78; font-size: 19px; line-height: 1.6; }
.download-button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-width: 192px; min-height: 48px; padding: 0 22px; background: #087af5; border: 1px solid #087af5; box-shadow: 0 3px 7px #0979ed17; color: white; font-size: 14px; font-weight: 550; text-decoration: none; }
.download-button:hover { background: #006ce2; transform: translateY(-1px); }
.release-meta { display: flex; justify-content: center; gap: 14px; margin-top: 13px; color: #767681; font-size: 11px; font-variant-numeric: tabular-nums; }
.platform-note { margin: 9px 0 0; font-size: 11px; color: #898995; }
.platform-note span { margin: 0 7px; }
.product-overview { display: grid; grid-template-columns: 1fr 1.15fr; gap: 60px; padding: 64px max(28px, calc((100% - 1040px) / 2)); background: white; }
.section-label { color: #8b8b97; font-size: 11px; font-weight: 550; }
.product-overview h2 { margin: 16px 0 0; font-size: 32px; font-weight: 600; line-height: 1.5; }
.product-overview dl { margin: 0; }
.product-overview dl > div { padding: 19px 0; border-bottom: 1px solid var(--line); }
.product-overview dl > div:first-child { padding-top: 0; }
.product-overview dl > div:last-child { border: 0; padding-bottom: 0; }
.product-overview dt { display: flex; gap: 12px; align-items: center; font-size: 15px; font-weight: 600; }
.product-overview dt svg { color: #087af5; }
.product-overview dl > div:nth-child(2) svg { color: #309b72; }
.product-overview dl > div:nth-child(3) svg { color: #8868c9; }
.product-overview dd { margin: 9px 0 0 32px; color: #80808b; font-size: 13px; line-height: 1.7; }
.release-band { display: grid; grid-template-columns: 1fr 1.15fr; gap: 60px; margin: 0; padding: 48px max(28px, calc((100% - 1040px) / 2)); width: 100%; border-top: 1px solid var(--line); }
.release-band h2 { font-size: 24px; color: #303039; }
.release-band li { color: #70707b; }
.release-band li::before { background: #8a79bb; }
.site-footer { max-width: none; width: 100%; margin: 0; padding: 26px max(28px, calc((100% - 1120px) / 2)); border-top: 1px solid var(--line); background: white; color: #8b8b94; font-size: 11px; }
.site-footer__identity strong { color: #555560; font-size: 12px; }
.site-footer a { color: #8b8b94; }
.auth-backdrop { background: #1a1a294a; backdrop-filter: blur(8px); }
.auth-dialog { width: min(480px, 100%); max-height: calc(100dvh - 40px); overflow: auto; border: 1px solid #ffffff80; box-shadow: 0 28px 100px #19192533; }
.auth-dialog__header { padding: 22px 24px; min-height: 92px; }
.auth-dialog__header h2 { font-size: 17px; font-weight: 600; }
.auth-dialog__header p { font-size: 12px; color: #85858f; }
.auth-close { display: grid; place-items: center; width: 44px; height: 44px; flex-shrink: 0; border-radius: 50%; background: #f2f2f6; color: #72727e; font-size: 28px; }
.auth-close:hover { background: #e8e8ef; }
.auth-dialog .account-form { padding: 24px; gap: 20px; }
.account-mode { display: flex; gap: 3px; padding: 3px; border: 0; background: #f1f1f5; border-radius: 8px; }
.account-mode button { flex: 1; height: auto; min-height: 38px; padding: 6px; border: 0; border-radius: 6px; color: #81818c; font-size: 12px; }
.account-mode button.is-active { color: #30303a; background: white; box-shadow: 0 1px 4px #27273815; }
.account-form input { height: 44px; border-radius: 8px; border-color: #e5e5ed; background: #f8f8fa; }
.account-form input:focus { border-color: #9cc5f6; outline: 3px solid #e9f2ff; }
.account-actions button, .account-fields > button, .profile-form button, .account-member-actions button, .code-input-row button { min-height: 44px; border-color: #087af5; border-radius: 8px; background: #087af5; }
.account-actions button + button { background: #edf4ff; color: #0874e7; border-color: #edf4ff; }
.subscription-page { width: min(1040px, calc(100% - 56px)); margin: 0 auto; padding: 48px 0; border: 0; min-height: 70vh; }
body.is-subscription-view .download-view, body.is-subscription-view .product-overview, body.is-subscription-view .release-band { display: none; }
.subscription-plan { padding: 24px; gap: 16px; border-radius: 8px; border-color: var(--line); box-shadow: none; }
.subscription-plan strong { color: #343440; font-size: 30px; }
.subscription-plan button { background: #087af5; border-color: #087af5; }
.admin-band { position: relative; display: grid; grid-template-columns: 208px minmax(0, 1fr); gap: 0; padding: 0; border: 0; min-height: calc(100dvh - 72px); background: #fff; }
body.is-admin-view main > section:not(#admin-section), body.is-admin-view .site-footer { display: none !important; }
body.is-admin-view .site-header { padding-inline: 28px; }
.admin-sidebar { display: flex; flex-direction: column; padding: 30px 16px; border-right: 1px solid var(--line); background: #f7f7fa; }
.admin-sidebar > p { padding: 0 12px; margin-bottom: 18px; }
.admin-sidebar nav { display: grid; gap: 6px; }
.admin-sidebar button { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 10px 12px; border: 0; text-align: left; color: #74747f; background: transparent; font-size: 13px; }
.admin-sidebar button:hover { background: #ededf3; }
.admin-sidebar button.is-active { color: #087af5; background: #e9f2ff; font-weight: 600; }
.admin-sidebar #admin-back { margin-top: auto; padding-top: 24px; justify-content: flex-start; }
.admin-workspace { min-width: 0; padding: 32px; }
.admin-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 30px; }
.admin-heading h2 { margin: 7px 0 0; font-size: 26px; font-weight: 600; color: #30303a; }
.admin-heading > button { display: grid; place-items: center; width: 42px; height: 42px; padding: 0; border: 1px solid var(--line); background: white; color: #737380; border-radius: 8px; }
#admin-message { margin: 0 0 20px; padding: 12px 16px; background: #edf6ff; color: #2d6da3; border-radius: 6px; font-size: 13px; }
#admin-message.is-error { background: #fff0ef; color: #b94c49; }
.admin-metrics { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; padding: 0 0 30px; margin: 0 0 28px; border-bottom: 1px solid var(--line); }
.admin-metrics > div { display: grid; gap: 14px; padding: 0 20px; background: none; border: 0; border-right: 1px solid var(--line); border-radius: 0; }
.admin-metrics > div:first-child { padding-left: 0; }
.admin-metrics > div:last-child { border: 0; padding-right: 0; }
.admin-metrics span { font-size: 12px; color: #898995; }
.admin-metrics strong { font-size: 25px; font-weight: 600; font-variant-numeric: tabular-nums; color: #34343e; }
.admin-metrics > div:nth-child(2) strong { color: #26926b; }
.admin-metrics > div:nth-child(5) strong { color: #7860b4; }
.admin-grid { display: block; }
.admin-panel { margin: 0; padding: 0; border: 0; border-radius: 0; background: none; min-width: 0; }
.admin-panel > header { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 20px; padding: 0; }
.admin-panel h3 { margin: 0; font-size: 15px; font-weight: 600; }
#admin-user-count { margin-left: 6px; color: #90909b; font-size: 12px; font-weight: 400; }
.admin-panel input, .admin-panel select { min-height: 40px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 8px; background: #fafafb; color: #555561; font-size: 12px; }
#admin-user-search { width: min(300px, 55%); }
.admin-table-scroll { overflow-x: auto; }
.admin-panel table { width: 100%; border-collapse: collapse; font-size: 12px; text-align: left; }
.user-table { min-width: 740px; }
.order-table { min-width: 760px; }
.admin-panel th { padding: 13px 12px; background: #f7f7f9; color: #9898a1; font-size: 11px; font-weight: 500; white-space: nowrap; }
.admin-panel td { padding: 18px 12px; border-bottom: 1px solid #eeeef3; color: #6b6b77; font-variant-numeric: tabular-nums; }
.admin-panel tbody tr:hover { background: #fafbfe; }
.admin-list { display: table-row-group; gap: 0; }
.admin-user { display: table-row; padding: 0; border: 0; background: none; }
.user-identity { display: flex; align-items: center; gap: 12px; }
.admin-user .user-avatar { display: grid; place-items: center; width: 34px; height: 34px; margin: 0; flex-shrink: 0; border-radius: 50%; color: #7d6aad; background: #f1edf9; font-size: 13px; }
.user-identity strong { display: block; max-width: 200px; overflow-wrap: anywhere; color: #45454f; font-size: 12px; font-weight: 600; }
.user-identity small { display: block; max-width: 220px; overflow-wrap: anywhere; margin-top: 4px; color: #93939d; font-size: 11px; }
.admin-user .status-label { display: inline-flex; align-items: center; gap: 6px; margin: 0; color: #309672; white-space: nowrap; }
.status-label::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
.admin-user .status-label.is-muted { color: #9999a3; }
.admin-user-actions { display: flex; align-items: center; gap: 6px; }
.admin-user-actions .icon-button { display: grid; place-items: center; width: 36px; height: 36px; min-height: 36px; padding: 0; border: 1px solid transparent; background: transparent; color: #555563; }
.admin-user-actions .icon-button:hover { background: #edf4ff; border-color: #d9e9fb; color: #0873e6; }
.admin-user-actions .icon-button[aria-expanded="true"] { background: #edf4ff; color: #0873e6; }
.admin-user-actions svg { width: 17px; height: 17px; }
.admin-action-menu { position: fixed; inset: auto; margin: 0; width: 200px; max-width: calc(100vw - 16px); padding: 5px; border: 1px solid var(--line); border-radius: 8px; background: white; color: var(--text); box-shadow: 0 8px 28px #22223324; }
.admin-action-menu button { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 40px; padding: 9px 10px; border: 0; border-radius: 5px; background: transparent; color: #41414d; text-align: left; font-size: 13px; }
.admin-action-menu button:hover, .admin-action-menu button:focus-visible { background: #f0f5fc; }
.admin-action-menu button.is-danger { color: #be3f45; border-top: 1px solid var(--line); border-radius: 0 0 5px 5px; }
.admin-action-menu svg { width: 17px; height: 17px; }
.admin-user-dialog { width: min(460px, calc(100% - 24px)); max-height: calc(100dvh - 24px); margin: auto; padding: 0; overflow-y: auto; border: 1px solid #e1e1e9; border-radius: 8px; background: #fff; color: var(--text); box-shadow: 0 20px 80px #15152233; }
.admin-user-dialog::backdrop { background: #19192455; backdrop-filter: blur(3px); }
.admin-user-dialog header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 22px; border-bottom: 1px solid var(--line); }
.admin-user-dialog h2 { margin: 0; font-size: 18px; font-weight: 600; }
.admin-user-dialog .icon-button { display: grid; place-items: center; width: 32px; height: 32px; padding: 0; background: transparent; border: 0; color: var(--muted); }
.admin-user-dialog-body { padding: 22px; }
.admin-selected-user { display: grid; gap: 5px; overflow-wrap: anywhere; }
.admin-selected-user strong { font-size: 15px; }
.admin-selected-user span { color: var(--muted); font-size: 12px; }
#admin-user-dialog-description { margin: 18px 0 0; color: #747481; font-size: 13px; line-height: 1.8; }
#admin-subscription-fields label { display: block; margin: 18px 0 8px; color: #5d5d69; font-size: 13px; }
#admin-subscription-fields select, #admin-subscription-fields input { width: 100%; min-height: 42px; padding: 8px 12px; border: 1px solid #dcdce5; background: #fff; color: var(--text); font-size: 14px; }
.admin-expiry { margin: 22px 0; font-size: 12px; }
.admin-expiry div { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; }
.admin-expiry dt { color: var(--muted); }
.admin-expiry dd { margin: 0; font-variant-numeric: tabular-nums; }
.admin-expiry-preview { margin-bottom: 0; padding-top: 18px; border-top: 1px solid var(--line); }
.admin-expiry-preview dd { color: #218562; }
.admin-user-error { margin: 18px 0 0; color: #be3f45; font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
.admin-user-dialog footer { display: flex; justify-content: flex-end; gap: 10px; padding: 16px 22px; border-top: 1px solid var(--line); }
.admin-user-dialog footer button { min-height: 40px; padding: 8px 15px; border: 1px solid #dcdce5; background: white; color: #5d5d69; font-size: 13px; }
.admin-user-dialog #admin-user-submit { background: #087af5; border-color: #087af5; color: white; }
.admin-user-dialog #admin-user-submit.is-danger { background: #be3f45; border-color: #be3f45; }
.table-pagination { display: flex; align-items: center; justify-content: space-between; padding: 18px 0; color: #94949f; font-size: 12px; }
.table-pagination > div { display: flex; gap: 8px; }
.table-pagination button { width: 36px; height: 36px; padding: 0; display: grid; place-items: center; border: 1px solid var(--line); background: white; color: #686874; }
.admin-orders { display: table-row-group; }
.admin-orders-panel > header label { color: #898995; font-size: 12px; }
.admin-code-form { display: grid; grid-template-columns: repeat(2, minmax(0, 220px)); align-items: end; gap: 24px; max-width: 620px; margin-top: 30px; }
.admin-code-form label { display: grid; gap: 9px; font-size: 12px; color: #797985; }
.admin-code-form > button { background: #087af5; border-color: #087af5; border-radius: 8px; }
.admin-codes { max-width: 620px; padding: 20px; color: #45454f; background: #f6f6f9; border: 1px solid var(--line); line-height: 1.9; white-space: pre-wrap; overflow-wrap: anywhere; }
#admin-copy-codes { margin-top: 26px; padding: 10px 16px; border: 0; background: #edf4ff; color: #0873e6; }
.empty-state { text-align: center; padding: 48px !important; color: #9595a0; }
@media (max-width: 1050px) {
  .admin-band { grid-template-columns: 172px minmax(0, 1fr); }
  .admin-workspace { padding: 24px; }
  .admin-metrics > div { padding-inline: 12px; }
  .admin-metrics strong { font-size: 20px; }
}
@media (max-width: 700px) {
  .site-header { height: 64px; min-height: 64px; padding: 0 16px; }
  .brand { font-size: 14px; gap: 8px; }
  .brand img { width: 28px; height: 28px; }
  .site-actions { gap: 4px; }
  .site-actions > a { display: none; }
  #account-nav { padding: 0 10px; font-size: 12px; }
  #admin-nav { padding: 0 8px; font-size: 12px; }
  .download-view { height: min(630px, calc(100svh - 180px)); min-height: 460px; }
  .download-content { padding-top: 28px; }
  .download-view h1 { font-size: 36px; }
  .release-summary { font-size: 16px; margin-top: 13px; }
  .product-scene { width: calc(100% - 32px); height: calc(100% - 324px); bottom: 20px; }
  .product-overview, .release-band { grid-template-columns: 1fr; gap: 28px; padding: 36px 24px; }
  .product-overview h2 { font-size: 26px; }
  .product-overview h2 br { display: none; }
  .site-footer { padding: 24px; gap: 20px; align-items: flex-start; }
  .site-footer__identity, .site-footer__legal { align-items: flex-start; gap: 6px; }
  .auth-modal { padding: 12px; }
  .auth-dialog { max-height: calc(100dvh - 24px); }
  .auth-dialog__header { padding: 18px; }
  .auth-dialog__header h2 { font-size: 15px; }
  .auth-dialog .account-form { padding: 18px; }
  .subscription-page { width: calc(100% - 40px); }
  .subscription-plans { grid-template-columns: 1fr; }
  .admin-band { display: block; }
  body.is-admin-view .site-header { padding-inline: 16px; }
  .admin-sidebar { padding: 10px 12px; border-right: 0; border-bottom: 1px solid var(--line); }
  .admin-sidebar > p { display: none; }
  .admin-sidebar nav { display: flex; gap: 4px; }
  .admin-sidebar nav button { justify-content: center; flex: 1; padding: 8px; gap: 6px; font-size: 12px; }
  .admin-sidebar nav svg { width: 16px; height: 16px; }
  .admin-sidebar #admin-back { margin: 4px 0 0; padding: 6px 8px; min-height: 32px; font-size: 11px; }
  .admin-workspace { padding: 24px 16px; }
  .admin-heading { margin-bottom: 24px; }
  .admin-heading h2 { font-size: 23px; }
  .admin-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px 0; padding-bottom: 24px; }
  .admin-metrics > div { padding: 0 12px; gap: 8px; }
  .admin-metrics > div:nth-child(4) { padding-left: 0; }
  .admin-metrics > div:nth-child(3) { border: 0; }
  .admin-metrics strong { font-size: 19px; }
  .admin-metrics span { font-size: 11px; }
  .admin-panel > header { gap: 8px; }
  .admin-panel h3 { font-size: 13px; }
  #admin-user-search { width: 57%; }
  .admin-code-form { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; } }