:root {
  --primary:var(--theme-primary);--secondary:var(--theme-secondary);--primary-dark:var(--theme-primary);
  --bg:var(--theme-bg);--card:var(--theme-surface);--ink:var(--theme-text);--text:var(--theme-text);
  --sub:var(--theme-muted);--mist:var(--theme-muted);--text-secondary:var(--theme-muted);--muted:var(--theme-muted);
  --line:var(--theme-border);--border:var(--theme-border);
  --border-light:color-mix(in srgb,var(--theme-border) 65%,var(--card));
  --tag-bg:color-mix(in srgb,var(--primary) 7%,var(--card));
  --soft:color-mix(in srgb,var(--theme-bg) 55%,var(--card));
  --accent-soft:color-mix(in srgb,var(--primary) 10%,var(--card));
}
body{background:var(--bg);color:var(--text)}
.btn-primary,.card-cta,.ann-btn,.login-box button[type=submit]{background:var(--primary);color:var(--on-primary)}
/* Shared action gradient follows the active preset and custom theme colors. */
.btn-primary,.card-cta,.ann-btn,.login-box button[type=submit]{
  position:relative;
  background-image:radial-gradient(ellipse at 15% 0%,#ffffff24,transparent 60%),linear-gradient(115deg,var(--primary) 0%,color-mix(in oklab,var(--primary) 75%,var(--secondary)) 48%,color-mix(in oklab,var(--primary) 40%,var(--secondary)) 100%);
  border-color:color-mix(in srgb,var(--primary) 55%,transparent);
  box-shadow:inset 0 1px 0 #ffffff45,0 3px 6px #00000008,0 8px 18px -12px color-mix(in srgb,var(--primary) 55%,transparent);
  transition:transform .2s,box-shadow .2s,filter .2s;
}
.card-cta{padding-inline:48px}
.card-cta .ar{
  position:absolute;top:50%;right:13px;transform:translateY(-50%);
  box-sizing:content-box;width:14px;height:14px;padding:4px;
  border:1px solid #ffffff30;border-radius:50%;
  background:color-mix(in srgb,var(--on-primary) 8%,transparent);
  transition:transform .2s,background-color .2s;
}
@media(hover:hover){
  .btn-primary:hover,.card-cta:hover,.ann-btn:hover,.login-box button[type=submit]:hover{transform:translateY(-2px);filter:brightness(1.035);box-shadow:inset 0 1px 0 #ffffff60,0 4px 8px #00000008,0 12px 22px -12px color-mix(in srgb,var(--primary) 60%,transparent)}
  .card-cta:hover .ar{transform:translateY(-50%) translateX(2px);background:color-mix(in srgb,var(--on-primary) 12%,transparent)}
}
.btn-primary:active,.card-cta:active,.ann-btn:active,.login-box button[type=submit]:active{transform:translateY(0) scale(.99);filter:brightness(.98);box-shadow:inset 0 1px 2px #00000010,0 2px 4px #00000008}
.card-cta:active .ar{transform:translateY(-50%)}
button,input,select,textarea{font-family:inherit}
input,select,textarea{accent-color:var(--primary)}
:focus-visible{outline:3px solid var(--primary);outline-offset:3px}
.ann-card,.mascot,.pill,.login-box,.logo-mark{background:var(--card)}
.ann-close{background:var(--card);color:var(--sub)}
.ann-hero{background:linear-gradient(160deg,var(--accent-soft),var(--soft))}
.ann-body{color:var(--text)}
.pill,.btn-outline{
  background-image:linear-gradient(115deg,color-mix(in srgb,var(--primary) 5%,var(--card)),color-mix(in srgb,var(--secondary) 6%,var(--card)));
  box-shadow:inset 0 1px 0 #ffffff20,0 3px 8px #00000004;
}
.card-icon{background:var(--accent-soft)}
.login-box input,.form-control,.filter-bar input,.filter-bar select{background:var(--soft);border-color:var(--border);color:var(--text)}
.login-box input:focus,.form-control:focus{background:var(--card)}
.nav-item.active{background:var(--accent-soft)}
.table th,.table tr:hover td,.filter-bar,.seo-section,.bar-row .bar{background:var(--soft)}
.theme-editor{max-width:1120px}
.theme-presets{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:20px 0 28px}
.theme-preset{font:inherit;text-align:left;cursor:pointer;border:1px solid var(--border);border-radius:14px;padding:12px;background:var(--card);color:var(--text);transition:border-color .2s,box-shadow .2s}
.theme-preset:hover,.theme-preset[aria-pressed=true]{border-color:var(--primary);box-shadow:0 0 0 2px var(--accent-soft)}
.theme-sample{height:78px;padding:12px;display:flex;gap:8px;background:var(--sample-bg);border:1px solid var(--sample-border);border-radius:8px;margin-bottom:12px}
.theme-sample-side{width:22%;background:var(--sample-surface);border-radius:4px}
.theme-sample-main{flex:1;display:flex;flex-direction:column;gap:6px}
.theme-sample-line{height:7px;width:58%;background:var(--sample-text);opacity:.6;border-radius:3px}
.theme-sample-card{flex:1;background:var(--sample-surface);border-radius:4px;display:flex;align-items:center;padding:7px;gap:6px}
.theme-sample-dot{height:13px;width:13px;border-radius:50%;background:var(--sample-primary)}
.theme-sample-dot + .theme-sample-dot{background:var(--sample-secondary)}
.theme-preset strong{display:block;font-size:14px;margin-bottom:4px}
.theme-preset small{font-size:11px;line-height:1.6;color:var(--muted)}
.theme-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 20px;margin:18px 0 24px}
.theme-field label{display:block;font-size:13px;font-weight:600;margin-bottom:8px}
.theme-color-input{display:flex;gap:9px;align-items:center;padding:7px 10px;background:var(--soft);border:1px solid var(--border);border-radius:10px}
.theme-color-input input[type=color]{width:32px;height:32px;padding:0;border:0;background:transparent;cursor:pointer;flex-shrink:0}
.theme-color-input input[type=text]{min-width:0;width:100%;background:transparent;border:0;color:var(--text);font:13px Consolas,monospace;padding:6px}
.theme-color-input:focus-within{outline:2px solid var(--primary);outline-offset:2px}
.theme-preview{background:var(--bg);border:1px solid var(--border);border-radius:14px;padding:20px;display:grid;grid-template-columns:1fr 1fr;gap:20px}
.theme-preview-panel{padding:20px;background:var(--card);border:1px solid var(--border);border-radius:12px;display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.theme-preview-panel p{font-size:13px;color:var(--muted);line-height:1.7}
.theme-preview-label{font-size:11px;font-weight:600;color:var(--muted);letter-spacing:1px;margin-bottom:12px}
.theme-preview-panel h3{font-size:19px}
.theme-preview-metric{font-size:30px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}
.theme-actions{position:sticky;bottom:16px;z-index:20;margin-top:24px;display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:16px;background:var(--card);border:1px solid var(--border);border-radius:12px;box-shadow:0 6px 24px #0000000a}
.theme-status{font-size:12px;color:var(--muted);flex:1;min-width:160px}
.theme-contrast{font-size:12px;color:var(--muted);margin-top:12px;min-height:18px}
@media(max-width:1100px){.theme-presets{grid-template-columns:repeat(2,minmax(0,1fr))}.theme-fields{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.theme-fields,.theme-preview{grid-template-columns:1fr}.theme-preview{padding:12px}.theme-presets{gap:10px}.theme-preset{padding:10px}.theme-actions{bottom:8px}.theme-status{flex-basis:100%}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.page,.login-box,.grid .card{opacity:1!important;transform:none!important}}