:root {
    color-scheme: light;
    --bg: #f5f7fa; --surface: #fff; --surface-subtle: #f8fafc; --surface-muted: #eef2f6;
    --text: #17202a; --text-muted: #667085; --line: #dbe2ea; --line-strong: #c5ced8;
    --primary: #3157a4; --primary-hover: #254684; --primary-soft: #e9effb;
    --success: #1e7a52; --success-soft: #e6f4ed; --danger: #b23a48; --danger-soft: #fbeaec;
    --warning: #94600f; --warning-soft: #fff3d7; --organic: #2f63b5; --paid: #a9680c;
    --local: #147a72; --featured: #7750a6; --ai: #a23c68; --unknown: #667085;
    --sidebar: 248px; --topbar: 64px; --radius: 8px;
    font-family: "Noto Sans SC", "Microsoft YaHei UI", "Microsoft YaHei", system-ui, sans-serif;
    font-synthesis: none; letter-spacing: 0;
}

/* Authentication is confirmed in an interactive boundary because prerendering cannot read localStorage. */
.route-auth-gate {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: grid;
    place-items: center;
    background: var(--surface);
}

.route-auth-gate-content {
    display: grid;
    justify-items: center;
    gap: 8px;
    color: var(--text);
}

.route-auth-gate-content small { color: var(--text-muted); }

.route-auth-spinner {
    width: 28px;
    height: 28px;
    border: 3px solid var(--line);
    border-top-color: var(--primary);
    border-radius: 50%;
    animation: route-auth-spin .7s linear infinite;
}

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

@media (prefers-reduced-motion: reduce) {
    .route-auth-spinner { animation: none; }
}
* { box-sizing: border-box; }
html { min-width: 320px; scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--text); font-size: 14px; line-height: 1.55; }
button,input,select,textarea { font: inherit; letter-spacing: 0; } button,a,summary { -webkit-tap-highlight-color: transparent; }
a { color: var(--primary); text-decoration: none; } a:hover { text-decoration: underline; }
h1,h2,h3,p { margin-top: 0; } h1 { font-size: 24px; line-height: 32px; margin-bottom: 6px; } h2 { font-size: 18px; line-height: 26px; margin-bottom: 4px; } h3 { font-size: 15px; line-height: 22px; margin-bottom: 4px; }
:focus-visible { outline: 3px solid rgba(49,87,164,.3); outline-offset: 2px; }
.numeric { font-variant-numeric: tabular-nums; }.muted { color: var(--text-muted); }.nowrap { white-space: nowrap; }.truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.app-shell { min-height: 100vh; display: grid; grid-template-columns: var(--sidebar) minmax(0,1fr); grid-template-rows: var(--topbar) minmax(0,1fr); }
.sidebar { grid-row: 1/3; position: sticky; top: 0; height: 100vh; background: #17263c; color: #f2f6fb; padding: 18px 14px; display: flex; flex-direction: column; z-index: 20; }
.brand { display: flex; align-items: center; gap: 11px; color: #fff; padding: 2px 8px 20px; }.brand:hover { text-decoration: none; }
.brand-mark { width: 34px; height: 34px; display: grid; place-items: center; background: #d6e5ff; color: #17386f; border-radius: 7px; font-size: 18px; font-weight: 800; }
.brand strong,.brand small,.sidebar-foot strong,.sidebar-foot small { display: block; }.brand strong { font-size: 15px; }.brand small,.sidebar-foot small { color: #9eb0c7; font-size: 11px; }
.primary-nav { display: grid; gap: 5px; }.primary-nav a { color: #c9d4e3; min-height: 42px; border-radius: 7px; padding: 0 12px; display: flex; align-items: center; gap: 10px; font-weight: 600; }.primary-nav a svg { font-size: 18px; }.primary-nav a:hover { background: rgba(255,255,255,.07); text-decoration: none; color: #fff; }.primary-nav a.active { background: #e8effd; color: #203f78; }
.sidebar-foot { margin-top: auto; border-top: 1px solid rgba(255,255,255,.1); padding: 15px 8px 2px; display: flex; align-items: center; gap: 10px; }.online-dot { width: 8px; height: 8px; border-radius: 50%; background: #55c58a; box-shadow: 0 0 0 3px rgba(85,197,138,.16); }.sidebar-foot strong { font-size: 12px; }
.topbar { grid-column: 2; background: rgba(255,255,255,.95); border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; padding: 0 24px; position: sticky; top: 0; z-index: 15; }.topbar-context,.topbar-actions,.user-button { display: flex; align-items: center; }.topbar-context { gap: 10px; }.workspace-label { color: var(--text-muted); font-size: 13px; }.demo-pill { color: var(--warning); background: var(--warning-soft); border: 1px solid #eed59e; border-radius: 999px; padding: 2px 8px; font-size: 11px; font-weight: 700; }.topbar-actions { gap: 14px; }
.icon-button { width: 36px; height: 36px; border: 1px solid transparent; border-radius: 6px; background: transparent; color: var(--text-muted); display: grid; place-items: center; cursor: pointer; }.icon-button:hover { background: var(--surface-muted); color: var(--text); }.balance { border-left: 1px solid var(--line); padding-left: 14px; }.balance small,.balance strong { display: block; }.balance small { font-size: 10px; color: var(--text-muted); }.balance strong { font-size: 12px; font-variant-numeric: tabular-nums; }.user-button { gap: 8px; border: 0; background: transparent; padding: 4px; cursor: pointer; color: var(--text); }.avatar { width: 32px; height: 32px; border-radius: 50%; background: #dce7f8; color: #254684; display: grid; place-items: center; font-weight: 700; }.user-copy strong,.user-copy small { display: block; text-align: left; }.user-copy strong { font-size: 12px; }.user-copy small { font-size: 10px; color: var(--text-muted); }.mobile-nav { display: none; }
.main-content { grid-column: 2; min-width: 0; padding: 24px 28px 48px; }.page-container { width: min(100%,1680px); margin: 0 auto; }

.page-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin-bottom: 20px; }.breadcrumb { display: flex; align-items: center; gap: 7px; color: var(--text-muted); font-size: 12px; margin-bottom: 6px; }.breadcrumb a { color: var(--text-muted); }.page-subtitle { color: var(--text-muted); margin: 0; max-width: 780px; }.header-actions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.button { min-height: 38px; border-radius: 6px; border: 1px solid var(--line-strong); background: var(--surface); color: var(--text); padding: 0 13px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; font-weight: 650; cursor: pointer; }.button:hover { background: var(--surface-muted); text-decoration: none; }.button.primary { color: #fff; background: var(--primary); border-color: var(--primary); }.button.primary:hover { background: var(--primary-hover); }.button.ghost { border-color: transparent; background: transparent; color: var(--text-muted); }.button:disabled { cursor: not-allowed; opacity: .55; }
.panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); min-width: 0; }.panel-header { padding: 17px 18px 13px; display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }.panel-header p { color: var(--text-muted); margin: 2px 0 0; font-size: 12px; }.panel-body { padding: 0 18px 18px; min-width: 0; }.section-stack { display: grid; gap: 16px; min-width: 0; }.content-section { padding: 22px 0; border-bottom: 1px solid var(--line); scroll-margin-top: 84px; min-width: 0; }.content-section:last-child { border-bottom: 0; }.section-heading { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; margin-bottom: 14px; }.section-heading p { color: var(--text-muted); margin: 0; font-size: 12px; }
.info-band,.warning-band { padding: 10px 12px; border-radius: 6px; display: flex; gap: 8px; align-items: flex-start; font-size: 12px; }.info-band { background: #edf4ff; border: 1px solid #cdddf6; color: #294c82; }.warning-band { background: var(--warning-soft); border: 1px solid #ead39d; color: #774b0c; }
.empty-request-conditions { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); }.empty-request-conditions h3 { margin-bottom: 12px; }.empty-request-conditions .warning-band { margin-top: 14px; }

.status-badge,.type-badge,.change-badge { display: inline-flex; align-items: center; gap: 5px; border-radius: 999px; padding: 3px 8px; white-space: nowrap; font-size: 11px; font-weight: 700; }.status-completed,.change-up { color: var(--success); background: var(--success-soft); }.status-running,.status-queued { color: var(--primary); background: var(--primary-soft); }.status-failed,.change-down,.change-lost { color: var(--danger); background: var(--danger-soft); }.status-partial,.change-new { color: var(--warning); background: var(--warning-soft); }.status-empty,.change-unchanged { color: var(--unknown); background: var(--surface-muted); }
.type-organic { color: var(--organic); background: #e8f0fc; }.type-paid { color: var(--paid); background: #fff2dd; }.type-local_pack { color: var(--local); background: #e5f5f2; }.type-featured_snippet { color: var(--featured); background: #f2eafa; }.type-ai_overview_reference { color: var(--ai); background: #f9e8ef; }.type-unknown { color: var(--unknown); background: var(--surface-muted); }

.report-header { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); margin-bottom: 14px; }.report-header-main { padding: 18px; display: flex; justify-content: space-between; gap: 20px; }.report-title-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }.report-title-row h1 { margin: 0; overflow-wrap: anywhere; }.report-meta { display: flex; gap: 18px; flex-wrap: wrap; color: var(--text-muted); margin-top: 8px; font-size: 12px; }.report-meta strong { color: var(--text); margin-left: 4px; }.report-actions { display: flex; align-items: flex-start; gap: 8px; }.report-tabs { display: flex; padding: 10px 12px 0; border-top: 1px solid var(--line); overflow-x: auto; }.report-tabs a { color: var(--text-muted); background:var(--surface); padding: 10px 14px 9px; border:1px solid var(--line); border-bottom-width:3px; white-space: nowrap; font-weight: 650; transition:background-color 120ms ease,color 120ms ease,border-color 120ms ease; }.report-tabs a+a{margin-left:-1px}.report-tabs a:first-child{border-radius:4px 0 0 0}.report-tabs a:last-child{border-radius:0 4px 0 0}.report-tabs a:hover { position:relative; z-index:1; text-decoration: none; color: var(--text); background:#f3f6f8; border-color:#aebdca; }.report-tabs a.active { position:relative; z-index:2; color: var(--primary); background:var(--primary-soft); border-color:#8fb5d2; border-bottom-color:var(--primary); font-weight:750; }
.metric-grid { display: grid; grid-template-columns: repeat(6,minmax(140px,1fr)); gap: 10px; min-width: 0; }.metric-card { border: 1px solid var(--line); background: var(--surface); border-radius: var(--radius); padding: 14px; min-height: 105px; min-width: 0; }.metric-card .label { color: var(--text-muted); font-size: 11px; font-weight: 650; }.metric-card .value { display: block; font-size: 23px; line-height: 32px; margin-top: 6px; font-weight: 750; font-variant-numeric: tabular-nums; }.metric-card .note { color: var(--text-muted); font-size: 11px; }

.table-shell { width: 100%; overflow: auto; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); }.data-table { width: 100%; min-width: 940px; border-collapse: separate; border-spacing: 0; font-size: 12px; }.data-table th { position: sticky; top: 0; z-index: 2; background: #f4f7fa; color: #556171; font-weight: 700; text-align: left; white-space: nowrap; }.data-table th,.data-table td { padding: 10px 11px; border-bottom: 1px solid #e7ebf0; vertical-align: middle; }.data-table tbody tr:last-child td { border-bottom: 0; }.data-table tbody tr:hover { background: #f4f8fd; }.data-table .sticky-col { position: sticky; left: 0; background: inherit; z-index: 1; min-width: 210px; }.data-table th.sticky-col { z-index: 3; background: #f4f7fa; }.table-link { display: block; color: var(--text); font-weight: 700; max-width: 320px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.table-link:hover { color: var(--primary); }.cell-sub { color: var(--text-muted); display: block; font-size: 10px; margin-top: 2px; }
.filter-bar { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 12px; display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-bottom: 12px; }.field,.select-field { min-height: 38px; border: 1px solid var(--line-strong); border-radius: 6px; background: #fff; color: var(--text); padding: 7px 10px; }.field { min-width: 220px; }.select-field { min-width: 140px; }.field-group { display: grid; gap: 6px; min-width: 0; }.field-group label { font-size: 12px; font-weight: 700; color: #44505f; }.field-hint { color: var(--text-muted); font-weight: 400; font-size: 11px; margin-left: 6px; }.form-grid { display: grid; grid-template-columns: repeat(12,minmax(0,1fr)); gap: 14px; }.span-12 { grid-column: span 12; }.span-8 { grid-column: span 8; }.span-6 { grid-column: span 6; }.span-4 { grid-column: span 4; }.span-3 { grid-column: span 3; }.span-2 { grid-column: span 2; }.analysis-form-grid .analysis-target-field { max-width: 560px; }.analysis-form-grid .analysis-compact-field { width: 100%; max-width: 220px; }.analysis-form-grid .analysis-compact-field label { white-space: nowrap; }.analysis-form-grid .analysis-target-field .field,.analysis-form-grid .analysis-compact-field .select-field,.analysis-form-grid .analysis-compact-field .segmented,.analysis-form-grid .analysis-compact-field .numeric { width: 100%; min-width: 0; }.analysis-form-grid .analysis-compact-field .segmented button { flex: 1; }.analysis-form-grid .analysis-compact-field .numeric { min-height: 38px; display: flex; align-items: center; }.segmented { display: inline-flex; border: 1px solid var(--line-strong); border-radius: 7px; overflow: hidden; background: #fff; max-width: 100%; overflow-x: auto; }.segmented button,.segmented a { border: 0; border-right: 1px solid var(--line); background: #fff; color: var(--text-muted); padding: 8px 12px; white-space: nowrap; cursor: pointer; }.segmented>:last-child { border-right: 0; }.segmented .active { background: var(--primary-soft); color: var(--primary); font-weight: 700; }.check-grid { display: grid; grid-template-columns: repeat(5,minmax(140px,1fr)); gap: 8px; }.check-option { border: 1px solid var(--line); border-radius: 6px; padding: 10px; display: flex; gap: 8px; align-items: center; background: #fff; }.switch-row { display: flex; justify-content: space-between; gap: 20px; padding: 10px 0; border-top: 1px solid var(--line); }.form-actions { display: flex; justify-content: flex-end; gap: 8px; padding-top: 14px; }
.quote-field { justify-content: space-between; gap: 6px; white-space: nowrap; font-variant-numeric: tabular-nums; }.quote-retry { width: 24px; height: 24px; flex: 0 0 24px; display: grid; place-items: center; border: 0; background: transparent; color: var(--primary); cursor: pointer; }.quote-retry svg { font-size: 15px; }

.matrix-shell { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--radius); }.matrix { min-width: 1120px; width: 100%; border-collapse: separate; border-spacing: 0; font-size: 11px; font-variant-numeric: tabular-nums; }.matrix th,.matrix td { padding: 9px 10px; text-align: right; border-bottom: 1px solid var(--line); }.matrix th { background: #f4f7fa; color: var(--text-muted); white-space: nowrap; }.matrix tr:last-child td { border-bottom: 0; }.matrix th:first-child,.matrix td:first-child { position: sticky; left: 0; text-align: left; background: #fff; z-index: 1; min-width: 150px; }.matrix th:first-child { background: #f4f7fa; z-index: 2; }.matrix td.missing { color: var(--text-muted); font-style: italic; }
.trend-bars { height: 150px; display: flex; align-items: end; gap: 7px; padding: 12px 4px 0; border-bottom: 1px solid var(--line); }.trend-bar { flex: 1; min-width: 12px; background: #7798d1; border-radius: 3px 3px 0 0; position: relative; }.trend-bar:hover { background: var(--primary); }.trend-labels { display: flex; gap: 7px; padding: 6px 4px 0; color: var(--text-muted); font-size: 9px; }.trend-labels span { flex: 1; text-align: center; min-width: 12px; }
.distribution-bars{display:grid;gap:9px}.distribution-row{display:grid;grid-template-columns:minmax(54px,auto) minmax(100px,1fr) 58px;align-items:center;gap:9px;font-size:12px}.distribution-row strong{text-align:right;font-variant-numeric:tabular-nums}.distribution-track{height:9px;background:#e9eef5;border-radius:3px;overflow:hidden}.distribution-track span{display:block;height:100%;background:#3f72af}.audience-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.audience-grid section{min-width:0;border-top:1px solid var(--line);padding-top:12px}.audience-grid h3{font-size:13px;margin-bottom:10px}.compact-control{width:max-content}.compact-table{max-width:560px}.compact-metrics{grid-template-columns:repeat(2,minmax(150px,240px))}.field-error{color:var(--danger)}
.rank-chart{display:grid;gap:12px}.rank-chart-row{display:grid;grid-template-columns:minmax(150px,190px) minmax(160px,1fr) 64px;align-items:center;gap:12px}.rank-chart-row>strong{text-align:right;font-variant-numeric:tabular-nums}.rank-stack{display:flex;height:20px;border-radius:4px;background:#edf1f5}.rank-stack span{position:relative;min-width:2px}.rank-stack span:first-child{border-radius:4px 0 0 4px}.rank-stack span:last-child{border-radius:0 4px 4px 0}.rank-stack span::after{content:attr(data-tooltip);position:absolute;left:50%;bottom:calc(100% + 7px);z-index:20;transform:translate(-50%,3px);width:max-content;max-width:220px;padding:6px 8px;border-radius:4px;background:#17212b;color:#fff;font-size:12px;font-weight:600;line-height:1.25;pointer-events:none;opacity:0;visibility:hidden;transition:opacity 80ms ease,transform 80ms ease,visibility 0s linear 80ms;transition-delay:0ms}.rank-stack span:hover::after,.rank-stack span:focus-visible::after{opacity:1;visibility:visible;transform:translate(-50%,0);transition-delay:80ms}.rank-legend{display:flex;flex-wrap:wrap;gap:7px 12px;color:var(--text-muted);font-size:10px}.rank-legend span{display:flex;align-items:center;gap:4px}.rank-legend i{width:10px;height:10px;border-radius:2px}.bucket-0{background:#245c8f}.bucket-1{background:#3978a8}.bucket-2{background:#4d91ba}.bucket-3{background:#65a7c4}.bucket-4{background:#7bb7c7}.bucket-5{background:#8cc3bd}.bucket-6{background:#a0caa9}.bucket-7{background:#b7cf94}.bucket-8{background:#ccd47f}.bucket-9{background:#ddd372}.bucket-10{background:#e8c866}.bucket-11{background:#e7b45c}
.detail-layout { display: grid; grid-template-columns: minmax(0,1fr) 220px; gap: 22px; align-items: start; }.detail-content { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 0 20px; min-width: 0; }.detail-toc { position: sticky; top: 82px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 10px; }.detail-toc strong { display: block; padding: 5px 7px 8px; font-size: 12px; }.detail-toc a { display: block; color: var(--text-muted); padding: 6px 7px; border-radius: 5px; font-size: 12px; }.detail-toc a:hover { background: var(--surface-muted); color: var(--primary); text-decoration: none; }.definition-grid { display: grid; grid-template-columns: repeat(4,minmax(130px,1fr)); gap: 12px; }.definition-grid>div,.definition-item { min-width: 0; }.definition-item dt { color: var(--text-muted); font-size: 11px; }.definition-grid dd,.definition-item dd { margin: 3px 0 0; font-weight: 650; overflow-wrap: anywhere; word-break: break-word; }
.serp-preview { border-left: 4px solid var(--organic); background: #fbfcfe; padding: 16px; border-radius: 4px; }.serp-preview.paid { border-color: var(--paid); }.serp-preview.local_pack { border-color: var(--local); }.serp-preview.featured_snippet { border-color: var(--featured); }.serp-preview.ai_overview_reference { border-color: var(--ai); }.serp-preview.unknown { border-color: var(--unknown); }.serp-preview .display-url { color: var(--success); overflow-wrap: anywhere; font-size: 12px; }.serp-preview h3 { color: #214f9a; font-size: 17px; margin: 5px 0; }.serp-preview p { color: #4d5968; margin-bottom: 8px; }.nested-links { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; margin-top: 10px; }.nested-link { padding: 8px; border: 1px solid var(--line); border-radius: 5px; }.tag-list { display: flex; flex-wrap: wrap; gap: 6px; }.plain-tag { background: var(--surface-muted); border-radius: 4px; padding: 2px 6px; font-size: 10px; color: var(--text-muted); }
.source-drawer { margin-top: 8px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-subtle); }.source-drawer summary { cursor: pointer; padding: 10px 12px; font-weight: 700; list-style: none; }.source-drawer summary::-webkit-details-marker { display: none; }.source-drawer .source-body { border-top: 1px solid var(--line); padding: 12px; font-size: 12px; }.raw-preview { background: #182435; color: #d9e5f3; border-radius: 5px; padding: 12px; white-space: pre-wrap; overflow-wrap: anywhere; font-family: Consolas,monospace; font-size: 11px; }.pagination { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 12px; color: var(--text-muted); font-size: 12px; }.empty-state { text-align: center; padding: 42px 20px; border: 1px dashed var(--line-strong); border-radius: var(--radius); background: var(--surface); }.empty-state svg { font-size: 30px; color: var(--text-muted); }.empty-state p { color: var(--text-muted); }

.auth-card { width: min(100%, 430px); box-sizing: border-box; background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); padding: 28px; box-shadow: 0 8px 22px rgba(21,34,50,.06); }
.registration-turnstile { min-height: 65px; margin: 0 0 15px; }
.auth-code-row { display: grid; grid-template-columns: minmax(0,1fr) 112px; align-items: start; gap: 10px; }
.auth-code-row .auth-field { min-width: 0; }
.auth-code-button { min-height: 40px; margin: 23px 0 0; white-space: nowrap; }
.auth-terms-error { display: block; margin: 0 0 12px 24px; }
.auth-page-head { margin-bottom: 22px; }.auth-page-head h1 { margin: 3px 0 7px; font-size: 22px; line-height: 1.35; }.auth-page-head p { margin: 0; color: var(--text-muted); font-size: 13px; }.auth-eyebrow { color: var(--primary) !important; font-size: 12px !important; font-weight: 700; }.auth-field { display: grid; gap: 6px; margin-bottom: 15px; }.auth-field label { color: #44505f; font-size: 12px; font-weight: 700; }.auth-field input { width: 100%; min-height: 40px; box-sizing: border-box; border: 1px solid var(--line-strong); border-radius: 6px; background: #fff; color: var(--text); padding: 8px 10px; }.auth-field input:focus { outline: 2px solid rgba(49,87,164,.22); outline-offset: 1px; border-color: var(--primary); }.auth-field input[aria-invalid="true"] { border-color: var(--danger); }.auth-field-hint { color: var(--text-muted); font-size: 11px; }.auth-field-error { color: var(--danger); font-size: 12px; line-height: 1.45; }.password-input-wrap { position: relative; }.password-input-wrap input { padding-right: 46px; }.password-toggle { position: absolute; top: 2px; right: 2px; width: 36px; height: 36px; border: 0; border-radius: 5px; display: grid; place-items: center; background: transparent; color: var(--text-muted); cursor: pointer; }.password-toggle:hover { background: var(--surface-muted); color: var(--text); }.password-toggle:focus-visible { outline: 2px solid var(--primary); outline-offset: 1px; }.auth-options { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 2px 0 18px; font-size: 12px; }.auth-checkbox { display: inline-flex; align-items: flex-start; gap: 8px; color: var(--text-muted); font-size: 12px; line-height: 1.45; cursor: pointer; }.auth-checkbox input { width: 16px; height: 16px; margin: 1px 0 0; accent-color: var(--primary); }.auth-terms { margin: -1px 0 8px; }.auth-submit { width: 100%; min-height: 40px; }.auth-secondary { color: var(--text-muted); text-align: center; font-size: 12px; margin-top: 18px; }.auth-status { display: flex; align-items: flex-start; gap: 8px; border: 1px solid; border-radius: 6px; padding: 10px 11px; margin-bottom: 16px; font-size: 12px; line-height: 1.5; }.auth-status-success { color: var(--success); background: var(--success-soft); border-color: #bee1cb; }.auth-status-error { color: var(--danger); background: var(--danger-soft); border-color: #efc2c8; }.auth-status:focus { outline: 2px solid var(--primary); outline-offset: 2px; }.auth-spinner { width: 13px; height: 13px; border: 2px solid rgba(255,255,255,.45); border-top-color: #fff; border-radius: 50%; animation: auth-spin .7s linear infinite; }@keyframes auth-spin { to { transform: rotate(360deg); } }
@media(max-width:1180px){.metric-grid{grid-template-columns:repeat(3,minmax(140px,1fr))}.definition-grid{grid-template-columns:repeat(2,minmax(130px,1fr))}.check-grid{grid-template-columns:repeat(3,minmax(140px,1fr))}}
@media(max-width:820px){:root{--topbar:56px}.app-shell{grid-template-columns:minmax(0,1fr)}.sidebar{display:none}.topbar,.main-content{grid-column:1}.topbar{padding:0 12px}.mobile-nav{display:block;position:relative}.mobile-nav summary{width:38px;height:38px;display:grid;place-items:center;cursor:pointer;list-style:none;border-radius:6px}.mobile-nav summary::-webkit-details-marker{display:none}.mobile-nav nav{position:absolute;top:43px;left:0;min-width:170px;background:#fff;border:1px solid var(--line);border-radius:7px;box-shadow:0 12px 28px rgba(21,34,50,.15);padding:6px}.mobile-nav nav a{display:block;padding:9px;border-radius:5px;color:var(--text)}.mobile-nav nav a.active{background:var(--primary-soft);color:var(--primary)}.workspace-label,.balance,.user-copy,.user-button>svg{display:none}.main-content{padding:18px 14px 40px}.page-header,.report-header-main{display:block}.header-actions,.report-actions{margin-top:12px;justify-content:flex-start}.form-grid{grid-template-columns:1fr}.span-12,.span-8,.span-6,.span-4,.span-3,.span-2{grid-column:span 1}.analysis-form-grid .analysis-target-field,.analysis-form-grid .analysis-compact-field{width:100%;max-width:none}.check-grid{grid-template-columns:1fr 1fr}.detail-layout{grid-template-columns:1fr}.detail-toc{position:static;order:-1;display:flex;overflow-x:auto}.detail-toc strong{display:none}.detail-toc a{white-space:nowrap}.nested-links{grid-template-columns:1fr}}
@media(max-width:520px){.metric-grid{grid-template-columns:1fr 1fr}.metric-card{min-height:92px}.metric-card .value{font-size:19px}.definition-grid{grid-template-columns:1fr 1fr;gap:10px}.check-grid{grid-template-columns:1fr}.filter-bar{align-items:stretch}.field,.select-field{width:100%;min-width:0}.analysis-form-grid{grid-template-columns:minmax(0,1fr)}.analysis-form-grid>*{grid-column:1/-1;width:100%;max-width:100%;min-width:0}.analysis-form-grid .switch-row{min-width:0}.analysis-form-grid .switch-row>span{min-width:0}.button{min-height:44px}.topbar-actions{gap:5px}.report-meta{display:grid;grid-template-columns:1fr 1fr;gap:7px 12px}.auth-card{padding:22px 18px}.auth-submit,.auth-field input{min-height:44px}.password-toggle{top:4px;right:4px;width:36px;height:36px}.auth-options{align-items:flex-start;flex-direction:column;gap:10px}}
@media(max-width:700px){.audience-grid{grid-template-columns:1fr}.distribution-row{grid-template-columns:48px minmax(80px,1fr) 52px}}
@media(max-width:700px){.rank-chart-row{grid-template-columns:1fr 52px}.rank-chart-row>.serp-type-badge{grid-column:1/-1}.rank-legend{gap:6px 9px}}
.billing-page .info-band{margin-bottom:16px}.billing-balance-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:16px}.billing-balance-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:15px;min-width:0}.billing-balance-card>span{display:flex;align-items:center;gap:3px;color:var(--text-muted);font-size:12px;font-weight:650}.billing-balance-card strong{display:block;margin:5px 0 2px;font-size:24px;line-height:32px;font-variant-numeric:tabular-nums}.billing-balance-card small{color:var(--text-muted);font-size:11px}.billing-balance-card.available{border-top:3px solid var(--primary)}.billing-balance-card.credited{border-top:3px solid var(--success)}.billing-balance-card.reserved{border-top:3px solid var(--warning)}.inline-help{border:0;background:transparent;color:var(--text-muted);padding:0;display:inline-grid;place-items:center;cursor:help}.inline-help svg{font-size:14px}.billing-layout{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:16px;margin-bottom:16px}.billing-redeem-panel .panel-header>svg,.billing-settlement-panel .panel-header>svg{color:var(--primary);font-size:22px}.billing-label{display:block;margin-bottom:6px;color:#44505f;font-size:12px;font-weight:700}.billing-redeem-row{display:flex;gap:8px}.billing-redeem-row .field{width:100%;min-width:0}.billing-redeem-row .button{min-width:88px;white-space:nowrap;writing-mode:horizontal-tb;text-orientation:mixed}.billing-message{display:flex;gap:7px;align-items:flex-start;margin-top:10px;border:1px solid;padding:9px 10px;border-radius:6px;font-size:12px}.billing-message.success{color:var(--success);background:var(--success-soft);border-color:#bee1cb}.billing-message.error{color:var(--danger);background:var(--danger-soft);border-color:#efc2c8}.billing-flow{display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--text-muted);font-size:12px}.billing-flow span{display:grid;gap:3px;justify-items:center;text-align:center}.billing-flow strong{width:22px;height:22px;display:grid;place-items:center;border-radius:50%;background:var(--primary-soft);color:var(--primary)}.billing-flow svg{color:var(--line-strong);flex:0 0 auto}.billing-records .panel-header{align-items:center}.billing-filters{margin-bottom:14px}.billing-table{min-width:1000px}.billing-status{display:inline-flex;padding:3px 8px;border-radius:999px;font-size:11px;font-weight:700;white-space:nowrap}.billing-settled{color:var(--success);background:var(--success-soft)}.billing-pending{color:var(--warning);background:var(--warning-soft)}.billing-released,.billing-refunded{color:var(--primary);background:var(--primary-soft)}.billing-failed{color:var(--danger);background:var(--danger-soft)}.amount-positive{color:var(--success);font-weight:700}.amount-negative{color:var(--danger);font-weight:700}.billing-detail{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;margin-top:14px;padding:16px;border:1px solid #cdddf6;background:#f7faff;border-radius:var(--radius)}.billing-detail h3{margin-bottom:3px}.billing-detail p{margin:0;color:var(--text-muted);font-size:12px}.billing-detail .definition-grid,.billing-detail .warning-band,.billing-detail .button{grid-column:1/-1}.balance{color:inherit;text-decoration:none}.balance:hover{text-decoration:none;background:var(--surface-muted);border-radius:4px}
@media(max-width:820px){.billing-balance-grid,.billing-layout{grid-template-columns:1fr}.billing-balance-card strong{font-size:22px}.billing-flow{align-items:flex-start}.billing-flow svg{margin-top:7px}.billing-detail{grid-template-columns:minmax(0,1fr) auto}}
@media(max-width:520px){.billing-balance-grid{gap:8px}.billing-balance-card{padding:12px}.billing-balance-card strong{font-size:19px;line-height:27px}.billing-balance-card small{line-height:1.35}.billing-redeem-row{display:grid;grid-template-columns:1fr}.billing-redeem-row .button{width:100%}.billing-flow{font-size:11px;gap:4px}.billing-flow svg{font-size:13px}.billing-detail .definition-grid{grid-template-columns:1fr 1fr}.billing-filters .button{width:100%}}
h1:focus{outline:none}.valid.modified:not([type=checkbox]){outline:1px solid var(--success)}.invalid{outline:1px solid var(--danger)}.validation-message{color:var(--danger);font-size:12px}.blazor-error-boundary{background:var(--danger);color:#fff;padding:1rem}.blazor-error-boundary::after{content:"页面发生错误。"}
.account-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.account-grid .panel:first-child{grid-column:1/-1}.account-profile{display:flex;align-items:center;gap:18px}.account-avatar{width:52px;height:52px;display:grid;place-items:center;border-radius:50%;background:var(--primary-soft);color:var(--primary);font-size:22px;font-weight:800}.account-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.account-fields label{display:grid;min-width:0;gap:6px;color:#44505f;font-size:12px;font-weight:700}.account-fields input{width:100%;min-width:0;min-height:40px;border:1px solid var(--line-strong);border-radius:6px;padding:8px 10px}.account-status{margin-top:12px;padding:9px 10px;border:1px solid #bee1cb;border-radius:6px;background:var(--success-soft);color:var(--success);font-size:12px}.key-row{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid var(--line);border-radius:6px;background:var(--surface-subtle);min-width:0}.key-row code{flex:1;min-width:0;overflow-wrap:anywhere;word-break:break-all;font-size:12px}.key-actions{justify-content:flex-start}.danger-outline{border-color:#d88a90;color:var(--danger);background:#fff}.danger-outline:hover{background:var(--danger-soft)}
@media(max-width:820px){.account-grid{grid-template-columns:1fr}.account-grid .panel:first-child{grid-column:auto}.account-fields{grid-template-columns:1fr}.account-profile{align-items:flex-start}}
.user-menu{position:relative}.user-menu>summary{list-style:none}.user-menu>summary::-webkit-details-marker{display:none}.user-menu-panel{position:absolute;right:0;top:46px;z-index:10;min-width:150px;padding:6px;background:#fff;border:1px solid var(--line);border-radius:7px;box-shadow:0 12px 28px rgba(21,34,50,.15)}.user-menu-panel a{display:block;padding:10px;color:var(--text);font-size:12px}.user-menu-panel a:hover{background:var(--surface-muted);text-decoration:none}
.user-menu-panel button{display:block;width:100%;padding:10px;border:0;background:transparent;color:var(--text);font:inherit;font-size:12px;text-align:left;cursor:pointer}.user-menu-panel button:hover{background:var(--surface-muted)}
.switch-row>.select-field{width:220px;max-width:45%;min-width:140px}.switch-number-field{width:120px;min-width:0;text-align:right}
@media(max-width:520px){.switch-row>.select-field{width:160px;max-width:50%;min-width:0}.switch-number-field{width:96px}}
.report-header{border-bottom:1px solid var(--line)}.report-tabs{margin-bottom:0;border-bottom:0;overflow-x:auto;overflow-y:hidden}.report-tabs a{margin-bottom:0;padding-bottom:12px;border-bottom:0;box-shadow:none}.report-tabs a.active{border-bottom:0;box-shadow:inset 0 3px 0 var(--primary)}
.metric-summary-table th:not(:first-child),.metric-summary-table td:not(:first-child){text-align:right;font-variant-numeric:tabular-nums}
.rank-change-table thead tr:first-child th[colspan]{text-align:center}.rank-change-table thead tr:last-child th,.rank-change-table tbody td:not(:first-child){text-align:right;font-variant-numeric:tabular-nums}
.report-center-table th:nth-child(3),.report-center-table td:nth-child(3),.report-center-table th:nth-child(6),.report-center-table td:nth-child(6),.report-center-table th:nth-child(7),.report-center-table td:nth-child(7),.report-center-table th:nth-child(8),.report-center-table td:nth-child(8){text-align:center}.report-center-table th:nth-child(4),.report-center-table td:nth-child(4),.report-center-table th:nth-child(5),.report-center-table td:nth-child(5){text-align:right;font-variant-numeric:tabular-nums}
.data-table th.numeric,.data-table td.numeric{text-align:right;font-variant-numeric:tabular-nums}.data-table th.table-center,.data-table td.table-center{text-align:center}.data-table td.table-center>.tag-list{justify-content:center}
.filter-bar>.source-drawer{min-height:38px;margin-top:0;background:#fff}.filter-bar>.source-drawer>summary{min-height:36px;box-sizing:border-box;padding:7px 10px;display:flex;align-items:center;gap:6px;white-space:nowrap}
.session-account-placeholder{display:flex;align-items:center;gap:10px;min-width:178px;height:40px}.session-placeholder-balance{width:76px;height:28px;border-radius:4px;background:var(--surface-muted)}.session-placeholder-avatar{width:32px;height:32px;border-radius:50%;background:var(--surface-muted)}.session-auth-actions{display:flex;align-items:center;gap:8px}.session-auth-actions .button{min-width:64px}.online-dot.pending{background:#9aa4b2;box-shadow:0 0 0 3px rgba(154,164,178,.16)}.online-dot.offline{background:#9aa4b2;box-shadow:none}.public-shell{min-height:100vh;background:var(--bg)}.public-topbar{min-height:64px;padding:0 24px;border-bottom:1px solid var(--line);background:var(--surface);display:flex;align-items:center;justify-content:space-between;gap:20px}.public-topbar .brand{color:var(--text)}.public-content{max-width:1200px;margin:0 auto;padding:24px}
@media(max-width:520px){.session-account-placeholder{min-width:82px}.session-placeholder-balance{display:none}.session-auth-actions{gap:4px}.session-auth-actions .button{min-width:56px;padding-inline:10px}.public-topbar{padding:0 14px}.public-content{padding:18px 14px}}
