html[data-hub-theme]{
  --th-bg:#0b1120;--th-bg-soft:#0f172a;--th-panel:#151f32;--th-panel-2:#111c2e;--th-code:#050b16;
  --th-border:#1e293b;--th-text:#e2e8f0;--th-muted:#94a3b8;--th-accent:#38bdf8;--th-accent-2:#818cf8;
  --th-shadow:rgba(14,165,233,.14);--th-radius:.85rem;
  --th-chrome:color-mix(in srgb,var(--th-bg) 94%,transparent);
  --th-card-bg:linear-gradient(145deg,color-mix(in srgb,var(--th-accent) 5%,var(--th-panel)),var(--th-panel));
  --th-wallpaper:radial-gradient(circle at 12% 12%,rgba(56,189,248,.1),transparent 30rem),linear-gradient(to right,rgba(30,41,59,.22) 1px,transparent 1px),linear-gradient(to bottom,rgba(30,41,59,.22) 1px,transparent 1px);
  --th-wallpaper-size:auto,32px 32px,32px 32px;color-scheme:dark
}
html[data-hub-theme=ocean]{
  --th-bg:#041722;--th-bg-soft:#072334;--th-panel:#0b2b3b;--th-panel-2:#082331;--th-code:#021019;
  --th-border:#1b5367;--th-text:#e5f6ff;--th-muted:#95bdca;--th-accent:#22d3ee;--th-accent-2:#60a5fa;
  --th-shadow:rgba(34,211,238,.16);--th-radius:1rem;
  --th-wallpaper:radial-gradient(ellipse at 12% 8%,rgba(34,211,238,.18),transparent 38rem),radial-gradient(ellipse at 90% 45%,rgba(59,130,246,.12),transparent 34rem),repeating-linear-gradient(0deg,rgba(34,211,238,.035) 0 1px,transparent 1px 26px);
  --th-wallpaper-size:auto,auto,100% 26px
}
html[data-hub-theme=violet]{
  --th-bg:#160d28;--th-bg-soft:#21143a;--th-panel:#2a1743;--th-panel-2:#211437;--th-code:#0e081a;
  --th-border:#563b78;--th-text:#f7efff;--th-muted:#bea9d4;--th-accent:#c084fc;--th-accent-2:#f472b6;
  --th-shadow:rgba(192,132,252,.17);--th-radius:1.1rem;
  --th-wallpaper:radial-gradient(circle at 18% 18%,rgba(192,132,252,.18),transparent 28rem),radial-gradient(circle at 82% 72%,rgba(244,114,182,.11),transparent 32rem),repeating-linear-gradient(135deg,rgba(192,132,252,.025) 0 1px,transparent 1px 18px);
  --th-wallpaper-size:auto,auto,25px 25px
}
html[data-hub-theme=forest]{
  --th-bg:#061914;--th-bg-soft:#0a241c;--th-panel:#0f3125;--th-panel-2:#0b281e;--th-code:#03110d;
  --th-border:#245c48;--th-text:#e9fff5;--th-muted:#9bc4b1;--th-accent:#34d399;--th-accent-2:#a3e635;
  --th-shadow:rgba(52,211,153,.15);--th-radius:.75rem;
  --th-wallpaper:radial-gradient(circle at 75% 10%,rgba(163,230,53,.1),transparent 28rem),radial-gradient(circle at 15% 65%,rgba(52,211,153,.14),transparent 34rem),radial-gradient(circle,rgba(52,211,153,.1) 1px,transparent 1.5px);
  --th-wallpaper-size:auto,auto,24px 24px
}
html[data-hub-theme=light]{
  --th-bg:#f6f8fc;--th-bg-soft:#edf2f8;--th-panel:#ffffff;--th-panel-2:#f1f5f9;--th-code:#e8eef6;
  --th-border:#c7d2e0;--th-text:#172033;--th-muted:#52627a;--th-accent:#0284c7;--th-accent-2:#4f46e5;
  --th-shadow:rgba(30,64,175,.1);--th-radius:1rem;
  --th-wallpaper:radial-gradient(circle at 10% 5%,rgba(2,132,199,.1),transparent 30rem),radial-gradient(circle at 90% 40%,rgba(79,70,229,.07),transparent 34rem),linear-gradient(to right,rgba(148,163,184,.13) 1px,transparent 1px),linear-gradient(to bottom,rgba(148,163,184,.13) 1px,transparent 1px);
  --th-wallpaper-size:auto,auto,34px 34px,34px 34px;color-scheme:light
}
html[data-hub-theme=sunset]{
  --th-bg:#28120f;--th-bg-soft:#351714;--th-panel:#411d1a;--th-panel-2:#351714;--th-code:#180a08;
  --th-border:#784139;--th-text:#fff3ed;--th-muted:#d6aaa0;--th-accent:#fb7185;--th-accent-2:#fb923c;
  --th-shadow:rgba(251,113,133,.18);--th-radius:1.25rem;
  --th-wallpaper:radial-gradient(circle at 15% 12%,rgba(251,146,60,.22),transparent 28rem),radial-gradient(circle at 88% 25%,rgba(251,113,133,.17),transparent 34rem),linear-gradient(160deg,rgba(251,191,36,.035),transparent 55%);
  --th-wallpaper-size:auto,auto,auto
}
html[data-hub-theme=rose]{
  --th-bg:#260e1b;--th-bg-soft:#321224;--th-panel:#40182d;--th-panel-2:#341225;--th-code:#17070f;
  --th-border:#75405d;--th-text:#fff0f6;--th-muted:#d7a3b9;--th-accent:#f472b6;--th-accent-2:#fb7185;
  --th-shadow:rgba(244,114,182,.18);--th-radius:1.1rem;
  --th-wallpaper:radial-gradient(circle at 16% 18%,rgba(244,114,182,.19),transparent 30rem),radial-gradient(circle at 82% 70%,rgba(251,113,133,.12),transparent 32rem),repeating-linear-gradient(120deg,rgba(244,114,182,.025) 0 1px,transparent 1px 20px);
  --th-wallpaper-size:auto,auto,30px 30px
}
html[data-hub-theme=amber]{
  --th-bg:#21170a;--th-bg-soft:#2b1e0c;--th-panel:#38270f;--th-panel-2:#2d1f0c;--th-code:#140d05;
  --th-border:#705323;--th-text:#fff8e6;--th-muted:#d1b982;--th-accent:#fbbf24;--th-accent-2:#f97316;
  --th-shadow:rgba(251,191,36,.16);--th-radius:.7rem;
  --th-wallpaper:radial-gradient(circle at 80% 10%,rgba(251,191,36,.18),transparent 30rem),radial-gradient(circle at 10% 80%,rgba(249,115,22,.1),transparent 32rem),radial-gradient(circle,rgba(251,191,36,.09) 1px,transparent 1.4px);
  --th-wallpaper-size:auto,auto,22px 22px
}
html[data-hub-theme=graphite]{
  --th-bg:#0f1115;--th-bg-soft:#15181d;--th-panel:#1b1e24;--th-panel-2:#15181d;--th-code:#080a0d;
  --th-border:#3f444d;--th-text:#f4f4f5;--th-muted:#a1a1aa;--th-accent:#e4e4e7;--th-accent-2:#71717a;
  --th-shadow:rgba(212,212,216,.08);--th-radius:.35rem;
  --th-wallpaper:linear-gradient(140deg,rgba(255,255,255,.035),transparent 28%),repeating-linear-gradient(135deg,rgba(255,255,255,.022) 0 1px,transparent 1px 12px);
  --th-wallpaper-size:auto,18px 18px
}
html[data-hub-theme=cyber]{
  --th-bg:#03050c;--th-bg-soft:#060a14;--th-panel:#0a1020;--th-panel-2:#070c18;--th-code:#010207;
  --th-border:#244133;--th-text:#effff4;--th-muted:#91b6a3;--th-accent:#a3e635;--th-accent-2:#f0abfc;
  --th-shadow:rgba(163,230,53,.18);--th-radius:.15rem;
  --th-wallpaper:radial-gradient(circle at 15% 15%,rgba(163,230,53,.15),transparent 24rem),radial-gradient(circle at 88% 72%,rgba(240,171,252,.13),transparent 28rem),linear-gradient(to right,rgba(163,230,53,.07) 1px,transparent 1px),linear-gradient(to bottom,rgba(163,230,53,.07) 1px,transparent 1px);
  --th-wallpaper-size:auto,auto,30px 30px,30px 30px
}
html[data-hub-theme=nord]{
  --th-bg:#111827;--th-bg-soft:#182235;--th-panel:#202c40;--th-panel-2:#192438;--th-code:#0b111d;
  --th-border:#465873;--th-text:#eceff4;--th-muted:#a7b5c8;--th-accent:#88c0d0;--th-accent-2:#81a1c1;
  --th-shadow:rgba(136,192,208,.14);--th-radius:.8rem;
  --th-wallpaper:radial-gradient(ellipse at 15% 8%,rgba(136,192,208,.18),transparent 34rem),radial-gradient(ellipse at 60% 0%,rgba(163,190,140,.09),transparent 25rem),radial-gradient(ellipse at 92% 18%,rgba(180,142,173,.1),transparent 30rem),repeating-linear-gradient(0deg,rgba(216,222,233,.025) 0 1px,transparent 1px 24px);
  --th-wallpaper-size:auto,auto,auto,100% 24px
}
html[data-hub-theme=sakura]{
  --th-bg:#fff6f9;--th-bg-soft:#fcecf2;--th-panel:#ffffff;--th-panel-2:#fff0f5;--th-code:#f8e8ef;
  --th-border:#efbfd0;--th-text:#3f1d2d;--th-muted:#765267;--th-accent:#db2777;--th-accent-2:#f973a9;
  --th-shadow:rgba(219,39,119,.1);--th-radius:1.35rem;
  --th-wallpaper:radial-gradient(circle at 12% 12%,rgba(244,114,182,.17),transparent 25rem),radial-gradient(circle at 88% 35%,rgba(251,113,133,.1),transparent 30rem),radial-gradient(circle,rgba(219,39,119,.075) 1px,transparent 1.4px);
  --th-wallpaper-size:auto,auto,28px 28px;color-scheme:light
}
html[data-hub-theme=mint]{
  --th-bg:#effcf7;--th-bg-soft:#e4f8ef;--th-panel:#ffffff;--th-panel-2:#eaf8f2;--th-code:#dff3eb;
  --th-border:#b4dfcf;--th-text:#12372c;--th-muted:#4f7368;--th-accent:#059669;--th-accent-2:#14b8a6;
  --th-shadow:rgba(5,150,105,.1);--th-radius:1.1rem;
  --th-wallpaper:radial-gradient(circle at 8% 10%,rgba(20,184,166,.15),transparent 27rem),radial-gradient(circle at 92% 72%,rgba(5,150,105,.1),transparent 32rem),linear-gradient(120deg,rgba(255,255,255,.34),transparent 55%);
  --th-wallpaper-size:auto,auto,auto;color-scheme:light
}
html[data-hub-theme=lavender]{
  --th-bg:#f7f4ff;--th-bg-soft:#eee9fb;--th-panel:#ffffff;--th-panel-2:#f1edfb;--th-code:#e9e3f7;
  --th-border:#d7cced;--th-text:#2f2445;--th-muted:#665a7b;--th-accent:#7c3aed;--th-accent-2:#a855f7;
  --th-shadow:rgba(124,58,237,.1);--th-radius:1.2rem;
  --th-wallpaper:radial-gradient(circle at 15% 12%,rgba(167,139,250,.17),transparent 28rem),radial-gradient(circle at 88% 60%,rgba(216,180,254,.18),transparent 32rem),repeating-linear-gradient(145deg,rgba(124,58,237,.025) 0 1px,transparent 1px 20px);
  --th-wallpaper-size:auto,auto,28px 28px;color-scheme:light
}
html[data-hub-theme=sepia]{
  --th-bg:#f5efe3;--th-bg-soft:#eee4d3;--th-panel:#fffaf0;--th-panel-2:#f5ead8;--th-code:#ede0ca;
  --th-border:#d7c5a5;--th-text:#3b2e20;--th-muted:#74624c;--th-accent:#a16207;--th-accent-2:#c2410c;
  --th-shadow:rgba(120,82,30,.1);--th-radius:.45rem;
  --th-wallpaper:radial-gradient(circle at 82% 12%,rgba(194,65,12,.08),transparent 30rem),repeating-linear-gradient(0deg,rgba(120,82,30,.055) 0 1px,transparent 1px 26px),linear-gradient(90deg,rgba(255,255,255,.2),transparent);
  --th-wallpaper-size:auto,100% 26px,auto;color-scheme:light
}

html[data-hub-theme]:not([data-hub-theme=midnight]) body{
  background-color:var(--th-bg)!important;color:var(--th-text)!important;background-image:var(--th-wallpaper)!important;
  background-size:var(--th-wallpaper-size)!important;background-attachment:fixed!important
}
html[data-hub-theme]:not([data-hub-theme=midnight]) header,
html[data-hub-theme]:not([data-hub-theme=midnight]) footer,
html[data-hub-theme]:not([data-hub-theme=midnight]) #sidebar-container{
  background:var(--th-chrome)!important;border-color:var(--th-border)!important;backdrop-filter:blur(18px)
}
html[data-hub-theme]:not([data-hub-theme=midnight]) .bg-hub-900,
html[data-hub-theme]:not([data-hub-theme=midnight]) [class*="bg-[#0B1120]"],
html[data-hub-theme]:not([data-hub-theme=midnight]) [class*="bg-[#0b1120]"],
html[data-hub-theme]:not([data-hub-theme=midnight]) [class*="bg-[#0d1425]"]{background-color:var(--th-bg)!important}
html[data-hub-theme]:not([data-hub-theme=midnight]) .bg-hub-800,
html[data-hub-theme]:not([data-hub-theme=midnight]) [class*="bg-[#151F32]"],
html[data-hub-theme]:not([data-hub-theme=midnight]) [class*="bg-[#151f32]"],
html[data-hub-theme]:not([data-hub-theme=midnight]) .glass-panel,
html[data-hub-theme]:not([data-hub-theme=midnight]) .panel,
html[data-hub-theme]:not([data-hub-theme=midnight]) .seo-upgrade-card{
  background:var(--th-card-bg)!important;border-color:var(--th-border)!important
}
html[data-hub-theme]:not([data-hub-theme=midnight]) .glass-panel-darker,
html[data-hub-theme]:not([data-hub-theme=midnight]) .metric,
html[data-hub-theme]:not([data-hub-theme=midnight]) .status{background:var(--th-panel-2)!important;border-color:var(--th-border)!important}
html[data-hub-theme]:not([data-hub-theme=midnight]) .border-hub-700,
html[data-hub-theme]:not([data-hub-theme=midnight]) [class*="border-[#1e293b]"]{border-color:var(--th-border)!important}
html[data-hub-theme]:not([data-hub-theme=midnight]) .text-hub-accent{color:var(--th-accent)!important}
html[data-hub-theme]:not([data-hub-theme=midnight]) .panel{--panel:var(--th-panel);--panel2:var(--th-panel-2);--line:var(--th-border);--text:var(--th-text);--muted:var(--th-muted);--accent:var(--th-accent)}
html[data-hub-theme]:not([data-hub-theme=midnight]) :is(.card-hover,.seo-upgrade-card){border-radius:var(--th-radius);box-shadow:0 18px 54px var(--th-shadow)}
html[data-hub-theme]:not([data-hub-theme=midnight]) input:not([type=range]):not([type=checkbox]):not([type=radio]):not([type=color]):not([type=file]),
html[data-hub-theme]:not([data-hub-theme=midnight]) textarea,
html[data-hub-theme]:not([data-hub-theme=midnight]) select{background:var(--th-panel-2)!important;color:var(--th-text)!important;border-color:var(--th-border)!important}
html[data-hub-theme]:not([data-hub-theme=midnight]) :is(input,textarea)::placeholder{color:var(--th-muted)!important}
html[data-hub-theme]:not([data-hub-theme=midnight]) :is(.code,.css-code-display,[class*="bg-[#0f172a]"]){background:var(--th-code)!important;color:var(--th-text)!important;border-color:var(--th-border)!important}

.theme-menu{
  position:fixed;right:1rem;top:4.25rem;z-index:90;width:min(24rem,calc(100vw - 2rem));max-height:min(34rem,calc(100vh - 5.25rem));
  padding:.8rem;overflow:auto;background:color-mix(in srgb,var(--th-panel) 96%,transparent);border:1px solid var(--th-border);
  border-radius:calc(var(--th-radius) + .15rem);box-shadow:0 24px 70px rgba(0,0,0,.38),0 0 38px var(--th-shadow);backdrop-filter:blur(18px)
}
.theme-menu[hidden]{display:none}
.theme-menu-title{display:flex;align-items:center;justify-content:space-between;gap:1rem;color:var(--th-text);font-size:.78rem;font-weight:800;margin-bottom:.7rem}
.theme-menu-title span:last-child{color:var(--th-accent);font-weight:600;text-align:right}
.theme-options{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.theme-option{
  display:flex;align-items:center;gap:.58rem;min-width:0;min-height:2.55rem;padding:.52rem .58rem;border:1px solid var(--th-border);
  border-radius:max(.35rem,calc(var(--th-radius) - .2rem));background:var(--th-panel-2);color:var(--th-muted);
  font-size:.75rem;font-weight:650;line-height:1.2;cursor:pointer;text-align:left;transition:transform .18s ease,border-color .18s ease,color .18s ease,background .18s ease,box-shadow .18s ease
}
.theme-option>span:last-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.theme-option:hover{transform:translateY(-1px);border-color:color-mix(in srgb,var(--th-accent) 72%,var(--th-border));color:var(--th-text)}
.theme-option.active{border-color:var(--th-accent);color:var(--th-text);background:color-mix(in srgb,var(--th-accent) 10%,var(--th-panel-2));box-shadow:0 0 0 2px color-mix(in srgb,var(--th-accent) 15%,transparent),inset 3px 0 0 var(--th-accent)}
.theme-option:focus-visible,.theme-floating-btn:focus-visible{outline:2px solid var(--th-accent);outline-offset:2px}
.theme-swatch{
  flex:0 0 auto;width:1.25rem;height:1.25rem;border-radius:50%;background:linear-gradient(135deg,var(--swatch-a) 0 52%,var(--swatch-b) 52% 100%);
  border:2px solid color-mix(in srgb,var(--th-text) 72%,transparent);box-shadow:0 0 0 1px rgba(0,0,0,.24)
}
.theme-menu.standalone{top:auto;bottom:4.75rem}
.theme-floating-btn{
  position:fixed;right:1rem;bottom:1rem;z-index:91;width:3rem;height:3rem;border-radius:999px;border:1px solid var(--th-border);
  background:var(--th-panel);color:var(--th-text);display:grid;place-items:center;box-shadow:0 12px 35px rgba(0,0,0,.3),0 0 24px var(--th-shadow);cursor:pointer
}
.theme-floating-btn:hover{border-color:var(--th-accent);color:var(--th-accent)}

html[data-hub-tone=light] .text-white,
html[data-hub-tone=light] .text-slate-100,
html[data-hub-tone=light] .text-slate-200,
html[data-hub-tone=light] .text-slate-300{color:var(--th-text)!important}
html[data-hub-tone=light] .text-slate-400,
html[data-hub-tone=light] .text-slate-500,
html[data-hub-tone=light] .text-slate-600{color:var(--th-muted)!important}
html[data-hub-tone=light] .seo-upgrade h2,
html[data-hub-tone=light] .seo-upgrade h3,
html[data-hub-tone=light] .seo-upgrade summary,
html[data-hub-tone=light] .panel h2,
html[data-hub-tone=light] .panel h3,
html[data-hub-tone=light] .hero h1,
html[data-hub-tone=light] .metric b{color:var(--th-text)!important}
html[data-hub-tone=light] .seo-upgrade p,
html[data-hub-tone=light] .seo-upgrade li,
html[data-hub-tone=light] .seo-upgrade-answer{color:var(--th-muted)!important}
html[data-hub-tone=light] #component-header [class*="hover:bg-slate-800"]:hover,
html[data-hub-tone=light] #sidebar-container [class*="hover:bg-slate-800"]:hover{background:color-mix(in srgb,var(--th-accent) 9%,transparent)!important}

@media(max-width:640px){
  .theme-menu{right:.65rem;top:4rem;width:calc(100vw - 1.3rem);max-height:calc(100dvh - 4.7rem);padding:.68rem}
  .theme-option{font-size:.72rem}
}
@media(max-width:350px){.theme-options{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.theme-option{transition:none}}