/* =========================================================
   Medaka Survey — Admin Theme (CMS 后台)
   深色/浅色双主题，令牌化，对齐 reward.medaka-studio.top
   ========================================================= */

:root, .theme-dark {
    --ink-50:#f4f7fa; --ink-100:#e7ecf0; --ink-200:#d6dbe2; --ink-300:#b5bbc4;
    --ink-400:#88909a; --ink-500:#646c79; --ink-600:#454e5c; --ink-700:#2b3341;
    --ink-800:#181f2d; --ink-850:#0f1623; --ink-900:#080e1a; --ink-950:#030610; --ink-1000:#010308;
    --aqua-300:#76e2e2; --aqua-400:#2bd7d6; --aqua-500:#00c5c2; --aqua-600:#00a1a2;
    --violet-400:#bc9cfe; --violet-500:#a67bf8; --violet-600:#8a5ddf;
    --gold-400:#fac54f; --gold-500:#f0ac27;
    --green-300:#97eebc; --green-500:#24c27d;
    --amber-300:#fed48d; --amber-500:#f2a635;
    --red-300:#ffb8b5; --red-500:#ed4952;

    --canvas:#010308; --surface:#030610; --surface-raised:#080e1a;
    --surface-overlay:#0f1623; --surface-sunken:#010205;
    --surface-hover:rgba(43,215,214,.06);
    --line:rgba(255,255,255,.08); --line-strong:rgba(255,255,255,.17);

    --text:#f4f7fa; --text-muted:#b5bbc4; --text-subtle:#88909a; --text-faint:#646c79;

    --primary:#2bd7d6; --primary-hover:#76e2e2; --primary-contrast:#000b11;
    --primary-soft:rgba(43,215,214,.14); --primary-soft-hover:rgba(43,215,214,.22);
    --primary-ring:rgba(43,215,214,.5); --primary-tint:rgba(43,215,214,.30);
    --violet:#bc9cfe; --violet-soft:rgba(188,156,254,.16);
    --gold:#fac54f; --gold-soft:rgba(250,197,79,.14);
    --success:#97eebc; --success-soft:rgba(36,194,125,.16); --success-tint:rgba(151,238,188,.25);
    --warning:#fed48d; --warning-soft:rgba(242,166,53,.16);
    --danger:#ffb8b5; --danger-strong:#ed4952; --danger-soft:rgba(237,73,82,.16); --danger-tint:rgba(237,73,82,.30);
    --info:#76e2e2; --info-soft:rgba(118,226,226,.16);

    --gradient-brand:linear-gradient(135deg,#2bd7d6 0%,#a67bf8 100%);
    --gradient-brand-soft:linear-gradient(135deg,rgba(43,215,214,.16),rgba(166,123,248,.16));
    --gradient-aurora:
        radial-gradient(58% 55% at 12% 0%, rgba(0,197,194,.22) 0%, transparent 72%),
        radial-gradient(52% 50% at 88% 6%, rgba(166,123,248,.20) 0%, transparent 72%),
        radial-gradient(46% 46% at 62% 100%, rgba(240,172,39,.10) 0%, transparent 72%);
    --gradient-sheen:linear-gradient(180deg, rgba(255,255,255,.05) 0%, rgba(255,255,255,.01) 45%, transparent 100%);

    --elevation-sm:0 2px 6px rgba(0,0,0,.35);
    --elevation-md:0 10px 24px -8px rgba(0,0,0,.6);
    --elevation-lg:0 24px 48px -16px rgba(0,0,0,.7);
    --glow-primary:0 0 0 1px rgba(43,215,214,.30), 0 12px 40px -12px rgba(0,197,194,.50);

    --toggle-track:rgba(255,255,255,.08);
    --sidebar-bg:#030610;

    --radius-xs:.375rem; --radius-sm:.5rem; --radius-md:.75rem;
    --radius-lg:1rem; --radius-xl:1.375rem; --radius-full:999px;

    --font-sans:'Inter','Noto Sans SC','PingFang SC','Microsoft YaHei',system-ui,sans-serif;
    --font-display:'Sora','Noto Sans SC',system-ui,sans-serif;
    --font-mono:'JetBrains Mono',ui-monospace,monospace;

    --ease-out-quint:cubic-bezier(.22,1,.36,1);
    --ease-soft:cubic-bezier(.4,0,.2,1);
    --ease-spring:cubic-bezier(.34,1.46,.64,1);
    --dur-fast:.16s; --dur-normal:.24s;
}

.theme-light {
    --canvas:#f7f8fa; --surface:#ffffff; --surface-raised:#ffffff;
    --surface-overlay:#ffffff; --surface-sunken:#f0f3f7;
    --surface-hover:rgba(0,161,162,.06);
    --line:rgba(3,6,16,.10); --line-strong:rgba(3,6,16,.20);

    --text:#080e1a; --text-muted:#454e5c; --text-subtle:#646c79; --text-faint:#88909a;

    --primary:#00797c; --primary-hover:#005356; --primary-contrast:#ffffff;
    --primary-soft:rgba(0,161,162,.12); --primary-soft-hover:rgba(0,161,162,.20);
    --primary-ring:rgba(0,121,124,.40); --primary-tint:rgba(0,121,124,.30);
    --violet:#653eae; --violet-soft:rgba(101,62,174,.10);
    --gold:#a25f12; --gold-soft:rgba(240,172,39,.16);
    --success:#067d4d; --success-soft:rgba(36,194,125,.12); --success-tint:rgba(6,125,77,.25);
    --warning:#a55d00; --warning-soft:rgba(242,166,53,.14);
    --danger:#be2130; --danger-strong:#be2130; --danger-soft:rgba(237,73,82,.10); --danger-tint:rgba(190,33,48,.28);
    --info:#00797c; --info-soft:rgba(0,161,162,.12);

    --gradient-brand:linear-gradient(135deg,#00a1a2 0%,#653eae 100%);
    --gradient-brand-soft:linear-gradient(135deg,rgba(0,161,162,.10),rgba(101,62,174,.10));
    --gradient-aurora:
        radial-gradient(58% 55% at 12% 0%, rgba(0,197,194,.16) 0%, transparent 72%),
        radial-gradient(52% 50% at 88% 6%, rgba(166,123,248,.12) 0%, transparent 72%),
        radial-gradient(46% 46% at 62% 100%, rgba(240,172,39,.08) 0%, transparent 72%);
    --gradient-sheen:linear-gradient(180deg, rgba(255,255,255,.9) 0%, rgba(255,255,255,.35) 45%, transparent 100%);

    --elevation-sm:0 2px 6px rgba(3,6,16,.07);
    --elevation-md:0 10px 24px -10px rgba(3,6,16,.16);
    --elevation-lg:0 24px 48px -20px rgba(3,6,16,.22);
    --glow-primary:0 0 0 1px rgba(0,121,124,.22), 0 14px 36px -14px rgba(0,121,124,.35);

    --toggle-track:rgba(3,6,16,.09);
    --sidebar-bg:#ffffff;
}

/* ---------- 基础 ---------- */
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body {
    font-family:var(--font-sans); font-size:.9375rem; line-height:1.5;
    background:var(--canvas); color:var(--text); min-height:100vh;
    -webkit-font-smoothing:antialiased;
    transition:background-color var(--dur-normal) var(--ease-soft), color var(--dur-normal) var(--ease-soft);
}
a { color:var(--primary); text-decoration:none; transition:color var(--dur-fast); }
a:hover { color:var(--primary-hover); }
::selection { background:var(--primary-soft-hover); color:var(--text); }
:focus-visible { outline:2px solid var(--primary); outline-offset:2px; border-radius:var(--radius-xs); }
::-webkit-scrollbar { width:10px; height:10px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:var(--line-strong); border-radius:var(--radius-full); border:3px solid transparent; background-clip:content-box; }

.eyebrow { font-size:.6875rem; line-height:1rem; letter-spacing:.14em; text-transform:uppercase; color:var(--text-subtle); font-weight:600; }
.brand-mark { border-radius:.5rem; box-shadow:var(--elevation-sm); flex-shrink:0; }

/* =========================================================
   布局
   ========================================================= */
.admin-layout { display:flex; min-height:100vh; }

/* ---------- 侧栏 ---------- */
.sidebar {
    width:15.5rem; flex-shrink:0;
    background:var(--sidebar-bg); border-right:1px solid var(--line);
    display:flex; flex-direction:column;
    position:fixed; top:0; left:0; bottom:0; z-index:100;
    transition:background-color var(--dur-normal) var(--ease-soft);
}
.sidebar-header { padding:1.25rem 1.125rem; border-bottom:1px solid var(--line); }
.sidebar-brand { display:flex; align-items:center; gap:.625rem; }
.logo-text {
    font-family:var(--font-display); font-size:.9375rem; font-weight:700; letter-spacing:-.02em;
    background:var(--gradient-brand); -webkit-background-clip:text; background-clip:text;
    -webkit-text-fill-color:transparent; color:transparent;
}
.sidebar-nav { flex:1; padding:.75rem 0; overflow-y:auto; }
.sidebar-footer { padding:.5rem 0; border-top:1px solid var(--line); }
.nav-item {
    display:flex; align-items:center; gap:.625rem;
    padding:.6875rem 1.125rem; position:relative;
    font-size:.8125rem; font-weight:500; color:var(--text-subtle);
    transition:background-color var(--dur-fast) var(--ease-soft), color var(--dur-fast) var(--ease-soft);
}
.nav-item:hover { background:var(--surface-hover); color:var(--text); }
.nav-item.active { background:var(--primary-soft); color:var(--text); font-weight:600; }
.nav-item.active::before {
    content:""; position:absolute; left:0; top:.5rem; bottom:.5rem; width:3px;
    background:var(--gradient-brand); border-radius:0 var(--radius-full) var(--radius-full) 0;
}
.nav-icon { font-size:1rem; width:1.375rem; text-align:center; flex-shrink:0; }

/* 侧栏工具区：主题 + 语言 */
.sidebar-tools { padding:.75rem 1.125rem; border-top:1px solid var(--line); display:flex; flex-direction:column; gap:.625rem; }
.sidebar-tool-row { display:flex; align-items:center; justify-content:space-between; gap:.5rem; }
.st-label { font-size:.625rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--text-faint); }

/* =========================================================
   主题切换开关（风格化组件）
   ========================================================= */
.theme-toggle {
    position:relative; flex-shrink:0;
    width:3.25rem; height:1.75rem;
    border:1px solid var(--line); border-radius:var(--radius-full);
    background:var(--toggle-track); cursor:pointer; overflow:hidden;
    transition:border-color var(--dur-normal) var(--ease-soft),
               background-color var(--dur-normal) var(--ease-soft),
               box-shadow var(--dur-normal) var(--ease-soft),
               transform var(--dur-fast) var(--ease-spring);
}
.theme-toggle:hover { border-color:var(--primary-tint); box-shadow:0 0 0 3px var(--primary-soft); }
.theme-toggle:active { transform:scale(.95); }
.tt-track { position:absolute; inset:0; border-radius:inherit; background:var(--gradient-brand-soft); opacity:0; transition:opacity var(--dur-normal) var(--ease-soft); }
.theme-toggle:hover .tt-track { opacity:1; }
.tt-thumb {
    position:absolute; top:50%; left:.1875rem;
    width:1.25rem; height:1.25rem; border-radius:50%;
    transform:translateY(-50%); z-index:2;
    background:var(--gradient-brand);
    box-shadow:0 2px 8px rgba(0,0,0,.35), inset 0 0 0 1px rgba(255,255,255,.14);
    transition:left .34s var(--ease-out-quint), box-shadow var(--dur-normal) var(--ease-soft);
}
.theme-light .tt-thumb { left:calc(100% - 1.4375rem); box-shadow:0 2px 8px rgba(0,121,124,.35), inset 0 0 0 1px rgba(255,255,255,.4); }
.theme-toggle:hover .tt-thumb { box-shadow:0 2px 12px var(--primary-ring), inset 0 0 0 1px rgba(255,255,255,.2); }
.tt-icon {
    position:absolute; top:50%; width:1.25rem; height:1.25rem;
    display:flex; align-items:center; justify-content:center;
    transform:translateY(-50%); pointer-events:none; z-index:1;
    transition:opacity var(--dur-normal) var(--ease-soft), transform .34s var(--ease-out-quint);
}
.tt-moon { left:.1875rem; color:var(--primary-contrast); }
.tt-sun  { right:.1875rem; color:var(--gold); }
.theme-dark  .tt-moon { opacity:1; transform:translateY(-50%) rotate(0) scale(1); }
.theme-dark  .tt-sun  { opacity:.35; transform:translateY(-50%) rotate(60deg) scale(.7); }
.theme-light .tt-moon { opacity:0; transform:translateY(-50%) rotate(-60deg) scale(.7); }
.theme-light .tt-sun  { opacity:1; color:var(--primary-contrast); transform:translateY(-50%) rotate(0) scale(1); }

/* =========================================================
   语言分段控件（风格化组件）
   ========================================================= */
.lang-seg {
    display:inline-flex; align-items:center; gap:.125rem; padding:.1875rem;
    background:var(--toggle-track); border:1px solid var(--line);
    border-radius:var(--radius-full); flex-shrink:0;
    transition:border-color var(--dur-normal) var(--ease-soft);
}
.lang-seg:hover { border-color:var(--line-strong); }
.ls-btn {
    display:inline-flex; align-items:center; gap:.25rem;
    padding:.25rem .625rem; border:none; border-radius:var(--radius-full);
    background:transparent; cursor:pointer;
    font-size:.6875rem; font-weight:600; letter-spacing:.02em; color:var(--text-faint);
    transition:color var(--dur-fast) var(--ease-soft), background var(--dur-fast) var(--ease-soft), box-shadow var(--dur-fast) var(--ease-soft);
}
.ls-btn:hover { color:var(--text-muted); background:var(--surface-hover); }
.ls-btn.active { color:var(--primary-contrast); background:var(--gradient-brand); box-shadow:0 1px 6px var(--primary-ring); }
.ls-flag { display:flex; align-items:center; opacity:.92; }
.ls-label { line-height:1; }

/* =========================================================
   主内容区
   ========================================================= */
.main-content { flex:1; margin-left:15.5rem; padding:1.5rem 2rem 3rem; min-width:0; }
.page-header { display:flex; justify-content:space-between; align-items:center; gap:.75rem; margin-bottom:1.25rem; flex-wrap:wrap; }
.page-header > div { display:flex; gap:.5rem; flex-wrap:wrap; }
.page-header h1 { font-family:var(--font-display); font-size:1.5rem; font-weight:600; letter-spacing:-.025em; }
.header-info { color:var(--text-subtle); font-size:.8125rem; }
.breadcrumb { font-size:.75rem; color:var(--text-subtle); margin-bottom:1rem; }
.breadcrumb a { color:var(--primary); }

/* ---------- 卡片 ---------- */
.card {
    background:var(--surface); border:1px solid var(--line);
    border-radius:var(--radius-lg); position:relative; overflow:hidden;
    box-shadow:var(--elevation-sm);
}
.card::after { content:""; position:absolute; inset:0; background:var(--gradient-sheen); pointer-events:none; }
.card-header {
    padding:1rem 1.25rem; border-bottom:1px solid var(--line);
    display:flex; align-items:center; gap:.75rem; position:relative; z-index:1;
}
.card-header h2 { font-family:var(--font-display); font-size:1rem; font-weight:600; letter-spacing:-.015em; }
.card-body { padding:1.25rem; position:relative; z-index:1; }

/* ---------- 数据卡 ---------- */
.stats-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(12rem,1fr)); gap:1rem; margin-bottom:1.5rem; }
.stat-card {
    background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-lg);
    padding:1.5rem 1.25rem; text-align:center; position:relative; overflow:hidden;
    transition:border-color var(--dur-normal) var(--ease-soft), transform var(--dur-normal) var(--ease-out-quint);
}
.stat-card::after { content:""; position:absolute; inset:0; background:var(--gradient-sheen); pointer-events:none; }
.stat-card:hover { border-color:var(--line-strong); transform:translateY(-2px); }
.stat-number {
    font-family:var(--font-display); font-size:2.25rem; font-weight:800; letter-spacing:-.035em; line-height:1;
    background:var(--gradient-brand); -webkit-background-clip:text; background-clip:text;
    -webkit-text-fill-color:transparent; color:transparent;
}
.stat-active .stat-number { background:linear-gradient(135deg,var(--success),var(--green-500)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.stat-total  .stat-number { background:linear-gradient(135deg,var(--info),var(--aqua-500)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.stat-today  .stat-number { background:linear-gradient(135deg,var(--warning),var(--amber-500)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.stat-label { margin-top:.5rem; font-size:.6875rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--text-subtle); }

/* ---------- 表格 ---------- */
.table-scroll { overflow-x:auto; }
.data-table { width:100%; border-collapse:collapse; }
.data-table th {
    text-align:left; padding:.75rem 1rem;
    font-size:.625rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
    color:var(--text-subtle); border-bottom:1px solid var(--line); white-space:nowrap;
}
.data-table td { padding:.875rem 1rem; border-bottom:1px solid var(--line); font-size:.8125rem; vertical-align:middle; }
.data-table tbody tr { transition:background-color var(--dur-fast) var(--ease-soft); }
.data-table tbody tr:hover td { background:var(--surface-hover); }
.data-table tbody tr:last-child td { border-bottom:none; }
.ua-cell { max-width:15rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-family:var(--font-mono); font-size:.6875rem; color:var(--text-faint); }
.response-count { font-size:.75rem; color:var(--text-subtle); margin-bottom:.75rem; }

/* ---------- 徽章 ---------- */
.badge { display:inline-flex; align-items:center; padding:.1875rem .625rem; border-radius:var(--radius-full); font-size:.625rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; white-space:nowrap; }
.badge-active   { background:var(--success-soft); color:var(--success); border:1px solid var(--success-tint); }
.badge-draft    { background:var(--surface-overlay); color:var(--text-subtle); border:1px solid var(--line); }
.badge-closed   { background:var(--danger-soft); color:var(--danger); border:1px solid var(--danger-tint); }
.badge-type     { background:var(--violet-soft); color:var(--violet); border:1px solid transparent; }
.badge-required { background:var(--warning-soft); color:var(--warning); border:1px solid transparent; }

/* ---------- 按钮 ---------- */
.btn {
    display:inline-flex; align-items:center; justify-content:center; gap:.375rem;
    padding:.5625rem 1.125rem; border:1px solid transparent; border-radius:var(--radius-sm);
    font-size:.8125rem; font-weight:600; letter-spacing:-.01em;
    cursor:pointer; text-decoration:none; white-space:nowrap;
    transition:transform var(--dur-fast) var(--ease-spring), box-shadow var(--dur-normal) var(--ease-soft),
               background-color var(--dur-fast) var(--ease-soft), border-color var(--dur-fast) var(--ease-soft),
               color var(--dur-fast) var(--ease-soft);
}
.btn:hover { transform:translateY(-1px); }
.btn:active { transform:translateY(0); }
.btn-primary { background:var(--gradient-brand); color:var(--primary-contrast); border-color:transparent; }
.btn-primary:hover { color:var(--primary-contrast); box-shadow:var(--glow-primary); }
.btn-secondary { background:var(--surface-overlay); color:var(--text-muted); border-color:var(--line); }
.btn-secondary:hover { color:var(--text); border-color:var(--line-strong); background:var(--surface-raised); }
.btn-success { background:var(--success-soft); color:var(--success); border-color:var(--success-tint); }
.btn-warning { background:var(--warning-soft); color:var(--warning); border-color:transparent; }
.btn-danger  { background:var(--danger-soft); color:var(--danger); border-color:var(--danger-tint); }
.btn-danger:hover { background:var(--danger); color:#fff; }
.btn-info { background:var(--info-soft); color:var(--info); border-color:transparent; }
.btn-sm { padding:.3125rem .6875rem; font-size:.75rem; border-radius:var(--radius-xs); }
.btn-block { width:100%; padding:.8125rem; }
.actions { display:flex; gap:.25rem; flex-wrap:wrap; align-items:center; }
.actions form { display:inline-flex; }

/* ---------- 表单 ---------- */
.form .form-group { margin-bottom:1.125rem; }
.form-group > label {
    display:block; margin-bottom:.375rem;
    font-size:.625rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--text-subtle);
}
.form-row { display:flex; gap:1rem; }
.form-row .form-group { flex:1; min-width:0; }
input[type="text"], input[type="password"], input[type="number"], input[type="email"],
input[type="datetime-local"], input[type="date"], select, textarea {
    width:100%; padding:.6875rem .9375rem;
    border:1px solid var(--line); border-radius:var(--radius-sm);
    background:var(--surface-overlay); color:var(--text);
    font-size:.8125rem; font-family:inherit; outline:none;
    transition:border-color var(--dur-normal) var(--ease-soft), box-shadow var(--dur-normal) var(--ease-soft);
}
.theme-light input[type="text"], .theme-light input[type="password"], .theme-light input[type="number"],
.theme-light input[type="datetime-local"], .theme-light select, .theme-light textarea { background:var(--surface-sunken); }
input:focus, select:focus, textarea:focus { border-color:var(--primary); box-shadow:0 0 0 3px var(--primary-soft); }
input::placeholder, textarea::placeholder { color:var(--text-faint); }
textarea { resize:vertical; min-height:4rem; line-height:1.625; }
select { cursor:pointer; }
input[type="checkbox"] { width:auto; accent-color:var(--primary); cursor:pointer; }
.checkbox-label { display:flex; align-items:center; gap:.5rem; font-size:.8125rem; font-weight:500; color:var(--text-muted); cursor:pointer; padding-top:.5rem; text-transform:none; letter-spacing:0; }
.form-actions { display:flex; gap:.75rem; margin-top:1.5rem; flex-wrap:wrap; }
.filter-form select { width:auto; min-width:13rem; padding:.5rem .875rem; }

/* 选项 / 条件行 */
.option-row, .condition-row { display:flex; gap:.5rem; margin-bottom:.5rem; align-items:center; }
.option-row .opt-label, .condition-row .cond-val { flex:2; min-width:0; }
.option-row .opt-label-en { flex:1.5; min-width:0; }
.option-row .opt-value { flex:1; min-width:0; }
.condition-row .cond-action, .condition-row .cond-target { flex:1; min-width:0; }

/* ---------- 问题列表 ---------- */
.question-list { display:flex; flex-direction:column; gap:.75rem; }
.question-item {
    background:var(--surface-overlay); border:1px solid var(--line);
    border-radius:var(--radius-md); padding:1rem;
    transition:border-color var(--dur-fast) var(--ease-soft);
}
.theme-light .question-item { background:var(--surface-sunken); }
.question-item:hover { border-color:var(--primary-tint); }
.question-header { display:flex; align-items:center; gap:.5rem; margin-bottom:.5rem; flex-wrap:wrap; }
.question-num { font-family:var(--font-mono); font-size:.75rem; font-weight:700; color:var(--primary); }
.question-actions { margin-left:auto; display:flex; gap:.375rem; flex-wrap:wrap; }
.question-actions form { display:inline-flex; }
.question-title { font-size:.9375rem; font-weight:500; line-height:1.5; margin-bottom:.5rem; }
.question-options, .question-conditions { display:flex; flex-wrap:wrap; gap:.375rem; margin-bottom:.375rem; }
.option-tag { background:var(--surface); border:1px solid var(--line); padding:.125rem .5rem; border-radius:var(--radius-full); font-size:.6875rem; color:var(--text-subtle); }
.condition-tag { background:var(--gold-soft); padding:.125rem .5rem; border-radius:var(--radius-full); font-size:.6875rem; color:var(--gold); }

/* ---------- 提示条 ---------- */
.alert { padding:.75rem 1rem; border-radius:var(--radius-sm); margin-bottom:1rem; font-size:.8125rem; font-weight:500; line-height:1.5; }
.alert-error   { background:var(--danger-soft); border:1px solid var(--danger-tint); color:var(--danger); }
.alert-success { background:var(--success-soft); border:1px solid var(--success-tint); color:var(--success); }
.alert-warning { background:var(--warning-soft); border:1px solid transparent; color:var(--warning); }
.empty-state { text-align:center; color:var(--text-subtle); padding:2.5rem 1rem; font-size:.8125rem; }

/* ---------- 详情页 ---------- */
.info-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(13rem,1fr)); gap:1.25rem; }
.info-label { display:block; margin-bottom:.25rem; font-size:.625rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--text-subtle); }
.info-value { font-size:.8125rem; word-break:break-word; }
.answer-item { padding:1.125rem 0; border-bottom:1px solid var(--line); }
.answer-item:last-child { border-bottom:none; }
.answer-header { display:flex; align-items:center; gap:.5rem; margin-bottom:.625rem; flex-wrap:wrap; }
.answer-num { font-family:var(--font-mono); font-size:.75rem; font-weight:700; color:var(--primary); }
.answer-question { font-size:.9375rem; font-weight:500; }
.answer-content { padding-left:.125rem; }
.rating-display { display:flex; align-items:baseline; gap:.25rem; }
.rating-value { font-family:var(--font-display); font-size:2rem; font-weight:800; letter-spacing:-.03em; color:var(--primary); }
.rating-max { font-size:.8125rem; color:var(--text-subtle); }
.text-answer { font-size:.8125rem; line-height:1.7; padding:.75rem .875rem; background:var(--surface-overlay); border:1px solid var(--line); border-radius:var(--radius-sm); }
.theme-light .text-answer { background:var(--surface-sunken); }
.choice-answer { display:flex; flex-wrap:wrap; gap:.375rem; }
.selected-option { background:var(--primary-soft); color:var(--primary); border:1px solid var(--primary-tint); padding:.25rem .75rem; border-radius:var(--radius-full); font-size:.75rem; font-weight:600; }

/* 统计图 */
.stat-summary { display:flex; gap:1rem; margin:.75rem 0 1rem; flex-wrap:wrap; }
.stat-summary-item { flex:1; min-width:7rem; background:var(--surface-overlay); border:1px solid var(--line); padding:.875rem 1rem; border-radius:var(--radius-md); }
.theme-light .stat-summary-item { background:var(--surface-sunken); }
.stat-summary-value { font-family:var(--font-display); font-size:1.5rem; font-weight:800; letter-spacing:-.03em; color:var(--primary); }
.stat-summary-label { margin-top:.25rem; font-size:.625rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--text-subtle); }
.stat-row { display:flex; align-items:center; margin-bottom:.5rem; gap:.75rem; }
.stat-option-label { width:11rem; flex-shrink:0; font-size:.8125rem; color:var(--text-muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.stat-option-bar { flex:1; min-width:0; }
.stat-bar-wrap { position:relative; height:1.5rem; background:var(--surface-overlay); border:1px solid var(--line); border-radius:var(--radius-xs); overflow:hidden; }
.theme-light .stat-bar-wrap { background:var(--surface-sunken); }
.stat-bar { height:100%; background:var(--gradient-brand); border-radius:var(--radius-xs); display:flex; align-items:center; padding-left:.5rem; min-width:2px; transition:width .6s var(--ease-out-quint); }
.stat-bar-label { font-size:.6875rem; font-weight:700; color:var(--primary-contrast); white-space:nowrap; }
.stat-bar-pct { position:absolute; right:.5rem; top:50%; transform:translateY(-50%); font-family:var(--font-mono); font-size:.6875rem; color:var(--text-subtle); }
.text-answer-list { max-height:20rem; overflow-y:auto; border:1px solid var(--line); border-radius:var(--radius-sm); }
.text-answer-item { padding:.625rem .875rem; border-bottom:1px solid var(--line); font-size:.8125rem; color:var(--text-muted); line-height:1.6; }
.text-answer-item:last-child { border-bottom:none; }

/* =========================================================
   登录页
   ========================================================= */
.login-body {
    min-height:100vh; display:flex; align-items:center; justify-content:center;
    padding:2rem 1rem; position:relative; overflow:hidden; background:var(--canvas);
}
.login-aurora { position:absolute; inset:0; background:var(--gradient-aurora); pointer-events:none; }
.login-grid {
    position:absolute; inset:0; pointer-events:none; opacity:.6;
    background-image:linear-gradient(to right, var(--line) 1px, transparent 1px),
                     linear-gradient(to bottom, var(--line) 1px, transparent 1px);
    background-size:56px 56px;
    -webkit-mask-image:radial-gradient(60% 55% at 50% 45%, #000 0%, transparent 80%);
    mask-image:radial-gradient(60% 55% at 50% 45%, #000 0%, transparent 80%);
}
.login-controls { position:fixed; top:1.25rem; right:1.5rem; display:flex; align-items:center; gap:.625rem; z-index:10; }
.login-card {
    position:relative; z-index:2; width:26rem; max-width:100%;
    background:var(--surface); border:1px solid var(--line);
    border-radius:var(--radius-xl); padding:2.25rem 2rem;
    box-shadow:var(--elevation-lg); overflow:hidden;
}
.login-card::after { content:""; position:absolute; inset:0; background:var(--gradient-sheen); pointer-events:none; }
.login-brand { display:flex; align-items:center; gap:.875rem; margin-bottom:1.75rem; position:relative; z-index:1; }
.login-brand h1 {
    font-family:var(--font-display); font-size:1.25rem; font-weight:700; letter-spacing:-.025em;
    background:var(--gradient-brand); -webkit-background-clip:text; background-clip:text;
    -webkit-text-fill-color:transparent; color:transparent;
}
.login-sub { font-size:.6875rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--text-subtle); margin-top:.125rem; }
.login-form { position:relative; z-index:1; }
.login-hint { position:relative; z-index:1; margin-top:1.5rem; text-align:center; font-size:.75rem; }
.login-hint a { color:var(--text-subtle); }
.login-hint a:hover { color:var(--primary); }

/* =========================================================
   响应式
   ========================================================= */
@media (max-width:64rem) {
    .sidebar { width:13.5rem; }
    .main-content { margin-left:13.5rem; padding:1.25rem 1.25rem 2.5rem; }
    .stat-option-label { width:8rem; }
}
@media (max-width:48rem) {
    .sidebar {
        width:100%; height:auto; position:sticky; top:0; bottom:auto;
        flex-direction:row; align-items:center; gap:.5rem;
        border-right:none; border-bottom:1px solid var(--line);
        padding:.5rem .75rem; overflow-x:auto;
    }
    .sidebar-header { padding:0; border-bottom:none; flex-shrink:0; }
    .sidebar-nav { display:flex; padding:0; gap:.25rem; overflow:visible; }
    .sidebar-tools { display:none; }
    .sidebar-footer { display:flex; border-top:none; padding:0; gap:.25rem; margin-left:auto; flex-shrink:0; }
    .nav-item { padding:.4375rem .625rem; font-size:.75rem; white-space:nowrap; }
    .nav-item.active::before { display:none; }
    .admin-layout { flex-direction:column; }
    .main-content { margin-left:0; padding:1rem; }
    .form-row { flex-direction:column; gap:0; }
    .stats-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem; }
    .stat-number { font-size:1.75rem; }
    .page-header { flex-direction:column; align-items:flex-start; }
    .option-row, .condition-row { flex-wrap:wrap; }
    .option-row .opt-label, .option-row .opt-label-en, .option-row .opt-value,
    .condition-row .cond-val, .condition-row .cond-action, .condition-row .cond-target { flex:1 1 100%; }
    .login-card { padding:1.75rem 1.25rem; }
    .login-controls { top:.75rem; right:.75rem; }
    .stat-row { flex-direction:column; align-items:stretch; gap:.25rem; }
    .stat-option-label { width:auto; }
}

/* 蓝图编辑器入口按钮 */
.btn-blueprint {
    background:var(--gradient-brand); color:var(--primary-contrast); border-color:transparent;
    box-shadow:var(--elevation-sm);
}
.btn-blueprint:hover { color:var(--primary-contrast); box-shadow:var(--glow-primary); }

/* =========================================================
   站点设置页专用组件
   ========================================================= */
.card-header-text { display:flex; flex-direction:column; gap:.25rem; }
.hint { font-size:.75rem; color:var(--text-subtle); line-height:1.6; margin-top:.375rem; }
.hint code {
    font-family:var(--font-mono); font-size:.6875rem;
    background:var(--surface-overlay); border:1px solid var(--line);
    padding:.0625rem .375rem; border-radius:var(--radius-xs); color:var(--text-muted);
    word-break:break-all;
}
.form-sep { border:none; border-top:1px solid var(--line); margin:1.5rem 0; }
.row-forms { display:none !important; }

/* Logo 预览 */
.logo-preview-row { display:flex; align-items:center; gap:1.25rem; margin-bottom:1.5rem; flex-wrap:wrap; }
.logo-preview {
    width:5.5rem; height:5.5rem; flex-shrink:0;
    display:flex; align-items:center; justify-content:center;
    background:var(--surface-overlay); border:1px solid var(--line);
    border-radius:var(--radius-md); overflow:hidden;
    transition:border-color var(--dur-normal) var(--ease-soft);
}
.theme-light .logo-preview { background:var(--surface-sunken); }
.logo-preview:hover { border-color:var(--primary-tint); }
.logo-preview img { width:100%; height:100%; object-fit:contain; }
.logo-preview .brand-mark { border-radius:.875rem; }
.logo-preview-info { flex:1; min-width:14rem; display:flex; flex-direction:column; gap:.5rem; align-items:flex-start; }

/* 链接表格 */
.link-table input[type="text"] { padding:.4375rem .625rem; font-size:.75rem; }
.link-table .col-narrow { width:6.5rem; }
.link-table td { padding:.5rem .75rem; }

/* 文件上传控件 */
input[type="file"] {
    width:100%; padding:.5rem .625rem;
    border:1px dashed var(--line-strong); border-radius:var(--radius-sm);
    background:var(--surface-overlay); color:var(--text-muted);
    font-size:.75rem; cursor:pointer;
    transition:border-color var(--dur-normal) var(--ease-soft), background-color var(--dur-normal) var(--ease-soft);
}
.theme-light input[type="file"] { background:var(--surface-sunken); }
input[type="file"]:hover { border-color:var(--primary-tint); background:var(--surface-hover); }
input[type="file"]::file-selector-button {
    margin-right:.75rem; padding:.3125rem .75rem;
    border:1px solid var(--line); border-radius:var(--radius-xs);
    background:var(--surface); color:var(--text-muted);
    font-size:.75rem; font-weight:600; cursor:pointer;
    transition:all var(--dur-fast) var(--ease-soft);
}
input[type="file"]::file-selector-button:hover { border-color:var(--primary-tint); color:var(--primary); }

/* 自定义 Logo（图片形态）在顶栏/页脚的尺寸约束 */
.brand-logo { border-radius:.5625rem; object-fit:contain; background:transparent; box-shadow:none; }