/* Shared light/dark surfaces; loaded after page-local styles. */
html[data-theme="light"] {
    color-scheme: light;
    --bg:#f7f8fa; --bg-soft:#eef1f5; --card:#fff; --card-2:#f2f4f7; --surface-raised:#fff;
    --text:#101828; --text-dim:#667085; --border:#d0d5dd; --glass-border:#e4e7ec; --border-strong:#98a2b3;
    --primary:#175cd3; --primary-2:#1849a9; --action:#175cd3; --action-hover:#1849a9;
    --primary-soft:#eff4ff; --focus-ring:rgba(23,92,211,.18); --danger:#b42318; --danger-soft:#fef3f2; --warning:#b54708;
    --shadow:0 8px 24px rgba(16,24,40,.06); --glass-blur:none;
}
html[data-theme="dark"] {
    color-scheme: dark;
    --bg:#090e1b; --bg-soft:rgba(118,140,207,.12); --card:rgba(23,31,55,.74); --card-2:rgba(8,15,32,.42); --surface-raised:rgba(23,31,54,.97);
    --text:#e4e9f7; --text-dim:#a2aecb; --border:rgba(166,188,237,.17); --glass-border:rgba(221,232,255,.15); --border-strong:#677ca9;
    --primary:#b1bfff; --primary-2:#d9e1ff; --action:#5164d5; --action-hover:#465acb;
    --primary-soft:rgba(119,137,245,.16); --focus-ring:rgba(153,174,255,.3); --danger:#ffacb4; --danger-soft:rgba(191,68,89,.15); --warning:#edc68c;
    --shadow:0 16px 40px rgba(0,0,0,.22),inset 0 1px 0 rgba(227,235,255,.07); --glass-blur:blur(20px) saturate(130%);
}
html[data-theme] {
    --result-bg:var(--bg); --result-card:var(--card); --result-text:var(--text); --result-muted:var(--text-dim);
    --result-border:var(--glass-border); --result-border-strong:var(--border); --result-primary:var(--primary);
    --result-primary-dark:var(--action-hover); --result-primary-soft:var(--primary-soft); --result-shadow:var(--shadow);
}
body { background:var(--bg); color:var(--text); }
html[data-theme="dark"] body {
    background:radial-gradient(ellipse at 8% 12%,rgba(76,55,137,.27),transparent 46%),radial-gradient(ellipse at 90% 34%,rgba(38,73,141,.26),transparent 48%),radial-gradient(ellipse at 36% 90%,rgba(98,45,99,.18),transparent 52%),var(--bg);
}
.query-page, .result-page { background:transparent; color:var(--text); }
.front-page, .front-main { background:transparent; }
.ambient-scene { display:block !important; }
/* Increase the orbit contrast on light cards without changing the animation. */
html[data-theme="light"] .account:before { background:conic-gradient(from var(--account-orbit),transparent 0deg,transparent 258deg,rgba(43,111,214,.18) 280deg,rgba(27,137,217,.82) 322deg,#3869d8 348deg,transparent 360deg); filter:drop-shadow(0 0 4px rgba(58,112,220,.42)); }
html[data-theme="light"] .account:nth-child(even):before { animation-delay:-2.5s; }
/* Public pages use the workspace's glass material without changing their layout. */
.query-topbar, .result-topbar, .ad-item, .query-field, .account, .copy-quiz-dialog {
    backdrop-filter:var(--glass-blur); -webkit-backdrop-filter:var(--glass-blur);
    box-shadow:var(--shadow);
}
html[data-theme="dark"] .query-topbar,
html[data-theme="dark"] .result-topbar { background:rgba(14,21,40,.78); }
html[data-theme="dark"] .admin-side { background:rgba(14,21,40,.78); }
html[data-theme="light"] .ad-item, html[data-theme="light"] .account { box-shadow:var(--shadow); }
.copy-quiz-dialog { background:var(--surface-raised); }
@media(prefers-reduced-transparency:reduce) {
    html[data-theme="dark"] { --card:#171f37; --card-2:#0c1426; --glass-blur:none; }
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
    html[data-theme="dark"] { --card:#171f37; --card-2:#0c1426; }
}
.admin-side, .login-box, .panel, .stat, .ui-dialog, .query-topbar, .result-topbar, .front-header, .ad-item, .query-field, .account, .empty-tip { background:var(--card); border-color:var(--glass-border); color:var(--text); }
.query-brand small, .ad-copy p, .query-heading p, .query-meta, .query-safety, .query-field>.input-icon { color:var(--text-dim); }
.ad-copy strong, .query-field input { color:var(--text); }
.query-brand-mark, .ad-blue .ad-icon { background:var(--primary-soft); color:var(--primary); }
.query-heading .eyebrow, .query-safety svg { color:var(--primary); }
.clear-card { color:var(--text-dim); }
.clear-card:hover { background:var(--card-2); color:var(--text); }
.query-field:focus-within { border-color:var(--primary); box-shadow:0 0 0 4px var(--focus-ring); }
.query-topbar, .result-topbar {
    position:sticky; top:0; z-index:100;
    backdrop-filter:blur(22px) saturate(145%); -webkit-backdrop-filter:blur(22px) saturate(145%);
    box-shadow:0 1px 0 var(--glass-border),0 6px 22px rgba(16,24,40,.04);
}
html[data-theme="light"] :is(.query-topbar,.result-topbar) { background:rgba(247,249,253,.72); border-color:rgba(120,140,177,.18); }
html[data-theme="dark"] :is(.query-topbar,.result-topbar) { background:rgba(14,21,40,.66); border-color:var(--glass-border); }
.query-brand-mark, .result-brand-mark {
    border:1px solid var(--glass-border); background:var(--primary-soft); color:var(--primary);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.18);
}
.query-brand-text, .result-brand-text { gap:10px; }
.query-brand strong, .result-brand strong { color:var(--text); font-weight:650; }
.purchase-link, .result-buy { box-shadow:0 3px 10px var(--focus-ring); }
@media(prefers-reduced-transparency:reduce) {
    html[data-theme="light"] :is(.query-topbar,.result-topbar) { background:#f7f9fd; }
    html[data-theme="dark"] :is(.query-topbar,.result-topbar) { background:#151e34; }
    .query-topbar, .result-topbar { backdrop-filter:none; -webkit-backdrop-filter:none; }
}
.account:hover, .account:focus-within, .account:active { background:var(--card)!important; color:var(--text)!important; border-color:var(--primary)!important; }
.secret-value, .chip, .country-fallback, .category-button, .category-next { background:var(--card-2); color:var(--text-dim); border-color:var(--border); }
.secret-value:hover { background:var(--primary-soft); }
.acts .mini-btn, .acts .mini-btn:first-child, .acts .mini-btn:last-child { background:var(--card)!important; color:var(--primary)!important; border-color:var(--border)!important; }
.acts .mini-btn:hover, .acts .mini-btn:focus-visible, .acts .mini-btn:active, .acts .mini-btn[data-copying="true"] { background:var(--card-2)!important; color:var(--text)!important; border-color:var(--border-strong)!important; }
.copy-quiz-dialog { background:var(--surface-raised); color:var(--text); border-color:var(--border); }
.copy-quiz-option, .copy-quiz-progress span { background:var(--card); color:var(--text); border-color:var(--border); }
.copy-quiz-dialog .quiz-help, .copy-quiz-kicker, .copy-quiz-shot-instruction { color:var(--text-dim); }
.copy-quiz-option .quiz-letter, .copy-quiz-back { background:var(--card-2); color:var(--text-dim); }
.category-button[aria-pressed="true"], .copy-quiz-progress span.is-current, .copy-quiz-progress span.is-done { background:var(--action); color:#fff; }
.result-buy { background:var(--action); border-color:var(--action); color:#fff; }
html[data-theme="dark"] { --result-success:#8eddb4; --result-success-soft:#243e32; --result-danger:var(--danger); --result-danger-soft:var(--danger-soft); --result-warning:var(--warning); --result-warning-soft:#403629; }
html[data-theme="dark"] .chip.ok, html[data-theme="dark"] .tag.green { background:#243e32; color:#8eddb4; border-color:#3e7257; }
html[data-theme="dark"] .chip.bad { background:var(--danger-soft); color:var(--danger); border-color:#82484b; }
html[data-theme="dark"] .chip.blue { background:var(--primary-soft); color:var(--primary); border-color:#465c80; }
html[data-theme="dark"] .account.status-bad { background:var(--card); border-color:#a65b59; }
html[data-theme="dark"] .result-notice { background:#403629; border-color:#706044; }
html[data-theme="dark"] .result-notice p { color:#efc583; }
html[data-theme="dark"] .copy-quiz-feedback, html[data-theme="dark"] .copy-quiz-option.is-correct { background:#243e32; color:#8eddb4; }
html[data-theme="dark"] .copy-quiz-feedback.is-error, html[data-theme="dark"] .copy-quiz-option.is-wrong { background:var(--danger-soft); color:var(--danger); }
html[data-theme="dark"] .ad-green .ad-icon { background:#243e32; color:#8eddb4; }
html[data-theme="dark"] .ad-orange .ad-icon { background:#403629; color:#efc583; }
.theme-control { display:inline-flex; align-items:center; gap:3px; padding:4px; background:var(--card-2); border:1px solid var(--glass-border); border-radius:8px; flex:none; backdrop-filter:var(--glass-blur); -webkit-backdrop-filter:var(--glass-blur); }
.theme-control button { display:grid; place-items:center; width:32px; height:30px; padding:0; border:1px solid transparent; border-radius:5px; background:transparent; color:var(--text-dim); }
.theme-control button:hover { background:var(--primary-soft); color:var(--primary); }
.theme-control button[aria-pressed="true"] { background:var(--surface-raised); border-color:var(--glass-border); color:var(--primary); box-shadow:0 1px 4px rgba(0,0,0,.16); }
.theme-control button:focus-visible { outline:2px solid var(--primary); outline-offset:2px; }
.theme-control svg { width:17px; height:17px; }
.login-box>.theme-control { margin-bottom:18px; }
.query-topbar, .result-topbar { flex-wrap:wrap; height:auto; min-height:72px; padding-top:12px; padding-bottom:12px; gap:12px; }
.query-brand, .result-brand { margin-right:auto; }
/* Floating capsule headers leave the particle backdrop visible around them. */
.query-topbar, .result-topbar {
    width:min(1120px,calc(100% - 32px)); margin:16px auto 0; top:12px;
    min-height:64px; padding:12px 20px; border:1px solid var(--glass-border); border-radius:999px;
}
.purchase-link, .result-buy, .theme-control { border-radius:999px; }
.theme-control button { border-radius:50%; }
.result-stage { padding-top:24px; }
.result-safety-capsule {
    display:flex; align-items:center; gap:12px; padding:14px 22px; margin-bottom:24px;
    border:1px solid var(--glass-border); border-radius:999px;
    background:var(--card); color:var(--text); box-shadow:var(--shadow);
    backdrop-filter:var(--glass-blur); -webkit-backdrop-filter:var(--glass-blur);
}
.result-safety-capsule>svg { width:22px; height:22px; flex:none; color:var(--primary); }
.result-safety-capsule>div { display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 12px; min-width:0; }
.result-safety-capsule strong { font-size:13px; font-weight:600; }
.result-safety-capsule span { font-size:12px; line-height:1.7; color:var(--text-dim); overflow-wrap:anywhere; }
.result-stage .refresh-status { margin:0 0 18px; }
@media(max-width:760px) {
    .query-topbar, .result-topbar { width:calc(100% - 24px); padding:10px 14px; margin-top:12px; top:8px; border-radius:28px; }
    .result-stage { padding-top:18px; }
    .result-safety-capsule { padding:12px 16px; border-radius:28px; gap:10px; margin-bottom:18px; }
}
@media(max-width:760px) {
    .query-topbar, .result-topbar { height:auto; min-height:56px; overflow:visible; gap:8px; }
    .theme-control { padding:3px; gap:2px; }
    .theme-control button { width:28px; height:28px; }
    .workspace-bar { flex-wrap:wrap; gap:12px; }
}
