:root {
  --bg: #eef2f8;
  --panel: rgba(255,255,255,.90);
  --ink: #101828;
  --muted: #667085;
  --line: rgba(15,23,42,.09);
  --brand: #5b5df0;
  --brand-2: #8b5cf6;
  --shadow: 0 24px 70px rgba(15,23,42,.12);
  --soft-shadow: 0 12px 35px rgba(15,23,42,.08);
  --radius: 24px;
}

* { box-sizing: border-box; }
html { width:100%; min-height:100%; scroll-behavior:smooth; }
body {
  width:100%;
  min-height:100%;
  margin:0;
  overflow-x:hidden;
  overflow-y:auto;
  color:var(--ink);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  background:
    radial-gradient(circle at 10% 10%,rgba(99,102,241,.12),transparent 30%),
    radial-gradient(circle at 90% 8%,rgba(244,114,182,.10),transparent 28%),
    linear-gradient(135deg,#f6f8fc 0%,#edf2f8 45%,#f7f8fb 100%);
}
body:not(.ambient-off)::before,
body:not(.ambient-off)::after {
  content:"";
  position:fixed;
  width:360px;
  height:360px;
  border-radius:50%;
  filter:blur(70px);
  opacity:.20;
  pointer-events:none;
  z-index:-1;
  animation:drift 16s ease-in-out infinite alternate;
}
body:not(.ambient-off)::before { background:#6477ff; left:-120px; bottom:-100px; }
body:not(.ambient-off)::after { background:#ff8ec7; right:-90px; top:100px; animation-delay:-7s; }
@keyframes drift { to { transform:translate3d(60px,-45px,0) scale(1.08); } }

button,input,textarea,select { font:inherit; }
button { cursor:pointer; }
button:focus-visible,
textarea:focus-visible,
select:focus-visible,
summary:focus-visible,
a:focus-visible { outline:3px solid rgba(91,93,240,.30); outline-offset:3px; }
[hidden] { display:none !important; }

#fxCanvas {
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  z-index:90;
  pointer-events:none;
}

.topbar {
  height:68px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 28px;
  border-bottom:1px solid rgba(15,23,42,.06);
  background:rgba(255,255,255,.72);
  backdrop-filter:blur(20px);
  position:sticky;
  top:0;
  z-index:20;
}
.brand { color:inherit; text-decoration:none; display:inline-flex; align-items:center; gap:12px; }
.brand-mark {
  width:42px;
  height:42px;
  flex:0 0 auto;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:#fff;
  box-shadow:0 8px 24px rgba(15,23,42,.12),inset 0 0 0 1px rgba(15,23,42,.06);
}
.brand-mark svg { width:38px; height:38px; overflow:visible; }
.brand-copy { display:flex; flex-direction:column; line-height:1; }
.brand-copy strong { font-size:17px; letter-spacing:.09em; font-weight:850; }
.brand-copy small { color:var(--muted); font-size:10px; margin-top:6px; letter-spacing:.04em; }
.top-actions { display:flex; align-items:center; gap:8px; }
.ghost-btn,.icon-btn,.text-btn { border:0; background:transparent; color:#344054; border-radius:12px; transition:.18s ease; }
.ghost-btn { padding:10px 13px; font-weight:650; }
.ghost-btn:hover,.icon-btn:hover,.text-btn:hover { background:rgba(91,93,240,.08); color:var(--brand); }
.icon-btn { width:42px; height:42px; display:grid; place-items:center; }
.icon-btn svg { width:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }

.app-shell {
  height:calc(100dvh - 68px);
  min-height:560px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 390px;
  gap:24px;
  padding:clamp(12px,2vh,22px);
  max-width:1680px;
  margin:0 auto;
  scroll-margin-top:68px;
}
.stage {
  height:100%;
  min-height:0;
  border:1px solid rgba(255,255,255,.75);
  border-radius:30px;
  background:rgba(255,255,255,.50);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8),var(--soft-shadow);
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  padding:clamp(14px,2.2vh,24px);
  position:relative;
  overflow:hidden;
}
.stage::before {
  content:"";
  position:absolute;
  width:78%;
  height:78%;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.95) 0%,rgba(255,255,255,.25) 60%,transparent 72%);
  filter:blur(6px);
  pointer-events:none;
}
.status-pill {
  position:absolute;
  top:24px;
  left:24px;
  padding:9px 13px;
  border-radius:999px;
  background:rgba(255,255,255,.78);
  box-shadow:inset 0 0 0 1px var(--line);
  color:#475467;
  font-size:12px;
  font-weight:700;
  letter-spacing:.04em;
  z-index:3;
}

.wheel-wrap {
  width:clamp(260px,min(58vw,calc(100dvh - 280px)),620px);
  aspect-ratio:1;
  position:relative;
  display:grid;
  place-items:center;
  z-index:2;
}
#wheelCanvas {
  width:100%;
  height:100%;
  display:block;
  filter:drop-shadow(0 28px 36px rgba(15,23,42,.20));
  contain:strict;
}
.pointer {
  position:absolute;
  right:-10px;
  top:50%;
  transform:translateY(-50%);
  z-index:7;
  filter:drop-shadow(0 8px 10px rgba(15,23,42,.20));
}
.pointer span {
  display:block;
  width:0;
  height:0;
  border-top:22px solid transparent;
  border-bottom:22px solid transparent;
  border-right:50px solid #111827;
}
.wheel-center {
  position:absolute;
  width:112px;
  height:112px;
  border-radius:50%;
  border:10px solid rgba(255,255,255,.88);
  background:linear-gradient(145deg,#fff,#eef1f7);
  box-shadow:0 10px 30px rgba(15,23,42,.20),inset 0 2px 0 rgba(255,255,255,.8);
  color:#111827;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  transition:transform .18s ease,box-shadow .18s ease;
  z-index:5;
}
.wheel-center:hover { transform:scale(1.04); }
.wheel-center:active { transform:scale(.98); }
.wheel-center:disabled { cursor:not-allowed; opacity:.72; }
.wheel-center span { font-weight:850; font-size:16px; letter-spacing:.09em; }
.wheel-center small { margin-top:5px; color:var(--muted); font-size:11px; }

.result-card {
  z-index:2;
  width:min(560px,88%);
  margin-top:clamp(7px,1.2vh,12px);
  border:1px solid rgba(255,255,255,.8);
  border-radius:18px;
  background:rgba(255,255,255,.74);
  backdrop-filter:blur(16px);
  box-shadow:var(--soft-shadow);
  padding:clamp(11px,1.5vh,15px) 17px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}
.result-card small { display:block; color:var(--muted); font-size:11px; margin-bottom:4px; }
.result-card strong { font-size:17px; overflow-wrap:anywhere; }
.result-actions { display:flex; gap:8px; }
.mini-btn { border:1px solid var(--line); background:#fff; color:#344054; border-radius:10px; padding:8px 11px; font-weight:700; font-size:12px; }
.mini-btn.danger { color:#b42318; background:#fff5f4; }

.spin-btn {
  z-index:2;
  margin-top:clamp(9px,1.5vh,16px);
  min-width:min(360px,88%);
  border:0;
  border-radius:16px;
  padding:clamp(13px,1.8vh,17px) 24px;
  font-weight:850;
  letter-spacing:.05em;
  color:#fff;
  background:linear-gradient(135deg,var(--brand),var(--brand-2));
  box-shadow:0 16px 34px rgba(91,93,240,.30),inset 0 1px 0 rgba(255,255,255,.28);
  transition:transform .18s ease,box-shadow .18s ease,opacity .18s ease;
}
.spin-btn:hover { transform:translateY(-2px); box-shadow:0 20px 42px rgba(91,93,240,.36); }
.spin-btn:active { transform:translateY(0) scale(.99); }
.spin-btn:disabled { opacity:.55; cursor:not-allowed; transform:none; }
.spin-icon { display:inline-block; margin-right:8px; font-size:20px; vertical-align:-1px; }
.keyboard-hint { z-index:2; margin:clamp(6px,1vh,11px) 0 0; color:#98a2b3; font-size:11px; }

.panel {
  height:100%;
  min-height:0;
  display:flex;
  flex-direction:column;
  border-radius:30px;
  background:var(--panel);
  backdrop-filter:blur(24px);
  border:1px solid rgba(255,255,255,.85);
  box-shadow:var(--shadow);
  overflow:hidden;
}
.panel-tabs { flex:0 0 auto; display:grid; grid-template-columns:repeat(4,1fr); border-bottom:1px solid var(--line); padding:10px 10px 0; gap:4px; }
.tab { border:0; background:transparent; color:#667085; font-size:11px; font-weight:750; padding:13px 6px; border-radius:12px 12px 0 0; position:relative; }
.tab:hover { background:rgba(91,93,240,.04); }
.tab.active { color:var(--brand); background:rgba(91,93,240,.06); }
.tab.active::after { content:""; position:absolute; left:18%; right:18%; bottom:0; height:2px; border-radius:2px; background:var(--brand); }
.panel-body { padding:22px; min-height:0; overflow-y:auto; overscroll-behavior:contain; scrollbar-gutter:stable; }
.tab-panel { animation:fade .18s ease; }
@keyframes fade { from { opacity:0; transform:translateY(4px); } }
.section-heading { display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; }
.section-heading small { color:var(--muted); font-size:11px; }
.section-heading h2 { margin:3px 0 0; font-size:21px; }
.count-badge { min-width:34px; height:28px; padding:0 9px; display:grid; place-items:center; border-radius:999px; background:rgba(91,93,240,.10); color:var(--brand); font-weight:800; font-size:12px; }
.field-label { display:block; font-size:12px; font-weight:750; color:#475467; margin:16px 0 8px; }
.field-label-row { display:flex; align-items:flex-end; justify-content:space-between; gap:10px; }
.field-label-row .field-label { margin-bottom:8px; }
.preview-effect { font-weight:800; padding:7px 9px; font-size:11px; margin-bottom:1px; }
.entries-zone { position:relative; border-radius:16px; }
textarea {
  width:100%;
  min-height:clamp(150px,27vh,238px);
  resize:vertical;
  border:1px solid var(--line);
  border-radius:16px;
  padding:14px 15px;
  outline:none;
  color:var(--ink);
  background:rgba(255,255,255,.80);
  box-shadow:inset 0 1px 2px rgba(15,23,42,.03);
  line-height:1.55;
}
textarea:focus,select:focus { border-color:rgba(91,93,240,.45); box-shadow:0 0 0 4px rgba(91,93,240,.09); }
.file-drop-overlay {
  position:absolute;
  inset:6px;
  display:grid;
  place-items:center;
  border:2px dashed rgba(91,93,240,.45);
  border-radius:13px;
  background:rgba(247,248,255,.94);
  color:var(--brand);
  font-weight:850;
  opacity:0;
  transform:scale(.98);
  pointer-events:none;
  transition:.16s ease;
}
.entries-zone.dragging .file-drop-overlay { opacity:1; transform:scale(1); }
.import-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:10px; }
.import-help { margin:7px 2px 0; color:var(--muted); font-size:9.5px; line-height:1.4; }
.compact-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:10px; }
.soft-btn,.primary-small {
  border:1px solid var(--line);
  background:rgba(255,255,255,.86);
  color:#344054;
  border-radius:12px;
  padding:10px 12px;
  font-weight:750;
  transition:.18s ease;
}
.soft-btn:hover { border-color:rgba(91,93,240,.24); background:#fff; color:var(--brand); }
.soft-btn:active,.primary-small:active { transform:scale(.98); }
.select-wrap { position:relative; }
.select-wrap::after { content:"⌄"; position:absolute; right:14px; top:50%; transform:translateY(-55%); color:var(--muted); pointer-events:none; }
select { width:100%; appearance:none; border:1px solid var(--line); color:var(--ink); background:rgba(255,255,255,.82); padding:12px 40px 12px 14px; border-radius:12px; outline:none; }
.toggle-card { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:15px 0; border-bottom:1px solid var(--line); }
.toggle-card strong { display:block; font-size:13px; }
.toggle-card small { display:block; color:var(--muted); font-size:11px; margin-top:4px; }
.switch { position:relative; flex:0 0 auto; width:46px; height:26px; }
.switch input { position:absolute; opacity:0; pointer-events:none; }
.switch span { position:absolute; inset:0; border-radius:999px; background:#d0d5dd; transition:.18s; box-shadow:inset 0 0 0 1px rgba(15,23,42,.06); }
.switch span::after { content:""; position:absolute; width:20px; height:20px; left:3px; top:3px; border-radius:50%; background:#fff; box-shadow:0 2px 7px rgba(15,23,42,.24); transition:.18s; }
.switch input:checked + span { background:linear-gradient(135deg,var(--brand),var(--brand-2)); }
.switch input:checked + span::after { transform:translateX(20px); }
.switch input:focus-visible + span { outline:3px solid rgba(91,93,240,.25); outline-offset:2px; }
.range-row { display:grid; grid-template-columns:1fr 54px; align-items:center; gap:12px; }
input[type="range"] { accent-color:var(--brand); }
.range-row output { text-align:center; padding:8px 7px; border-radius:10px; background:rgba(91,93,240,.08); color:var(--brand); font-weight:800; font-size:12px; }
.theme-grid { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.theme-card { border:1px solid var(--line); background:rgba(255,255,255,.76); border-radius:14px; padding:9px; text-align:left; transition:.18s; }
.theme-card:hover { transform:translateY(-1px); border-color:rgba(91,93,240,.24); }
.theme-card.active { border-color:rgba(91,93,240,.48); box-shadow:0 0 0 3px rgba(91,93,240,.08); }
.theme-card strong { display:block; margin-top:7px; font-size:11px; }
.swatches { display:block; height:20px; border-radius:7px; }
.swatches.aurora { background:linear-gradient(90deg,#5b5df0 0 25%,#23b5a6 25% 50%,#f7b84b 50% 75%,#f56f8c 75%); }
.swatches.ocean { background:linear-gradient(90deg,#075985 0 25%,#0284c7 25% 50%,#06b6d4 50% 75%,#14b8a6 75%); }
.swatches.tropical { background:linear-gradient(90deg,#00a896 0 25%,#02c39a 25% 50%,#f0f3bd 50% 75%,#ff9f1c 75%); }
.swatches.candy { background:linear-gradient(90deg,#ff4d8d 0 25%,#ff85a1 25% 50%,#8b5cf6 50% 75%,#38bdf8 75%); }
.swatches.forest { background:linear-gradient(90deg,#14532d 0 25%,#16a34a 25% 50%,#84cc16 50% 75%,#a16207 75%); }
.swatches.royal { background:linear-gradient(90deg,#312e81 0 25%,#6d28d9 25% 50%,#c026d3 50% 75%,#f59e0b 75%); }
.swatches.soft { background:linear-gradient(90deg,#a7c7e7 0 25%,#cdb4db 25% 50%,#ffc8dd 50% 75%,#bde0fe 75%); }
.swatches.sunset { background:linear-gradient(90deg,#ff7b54 0 25%,#ffb26b 25% 50%,#f8d49d 50% 75%,#9d4edd 75%); }
.swatches.neon { background:linear-gradient(90deg,#00f5d4 0 25%,#00bbf9 25% 50%,#9b5de5 50% 75%,#f15bb5 75%); }
.swatches.midnight { background:linear-gradient(90deg,#203a71 0 25%,#5f4b8b 25% 50%,#219ebc 50% 75%,#0f172a 75%); }
.history-heading { margin-bottom:8px; }
.text-btn { color:var(--brand); font-weight:800; padding:8px; }
.history-list { margin:0; padding:0; list-style:none; }
.history-list li { display:grid; grid-template-columns:32px 1fr auto; align-items:center; gap:10px; padding:13px 0; border-bottom:1px solid var(--line); }
.history-index { width:28px; height:28px; display:grid; place-items:center; border-radius:9px; background:rgba(91,93,240,.08); color:var(--brand); font-weight:800; font-size:11px; }
.history-copy strong { display:block; font-size:13px; overflow-wrap:anywhere; }
.history-copy small { display:block; color:var(--muted); font-size:10px; margin-top:3px; }
.history-action { color:#98a2b3; font-size:10px; }
.empty-history { min-height:min(390px,48vh); display:flex; align-items:center; justify-content:center; flex-direction:column; text-align:center; color:var(--muted); }
.empty-history span { font-size:38px; color:#c7cbd4; }
.empty-history strong { color:#475467; margin-top:8px; }
.empty-history small { margin-top:4px; }

.toast { position:fixed; left:50%; bottom:28px; transform:translate(-50%,20px); max-width:calc(100vw - 28px); background:#111827; color:#fff; border-radius:999px; padding:11px 16px; font-size:12px; font-weight:700; text-align:center; opacity:0; pointer-events:none; transition:.22s; z-index:110; box-shadow:0 15px 35px rgba(15,23,42,.25); }
.toast.show { opacity:1; transform:translate(-50%,0); }

.winner-scrim { position:fixed; inset:0; z-index:55; background:rgba(15,23,42,.13); backdrop-filter:blur(1.5px); animation:scrim-in .22s ease both; }
@keyframes scrim-in { from { opacity:0; } }
.winner-dialog {
  position:fixed;
  left:50%;
  top:50%;
  z-index:70;
  width:min(460px,calc(100vw - 32px));
  max-height:calc(100dvh - 32px);
  margin:0;
  transform:translate(-50%,-50%);
  border:1px solid rgba(255,255,255,.82);
  border-radius:28px;
  padding:38px 30px 28px;
  text-align:center;
  color:var(--ink);
  background:rgba(255,255,255,.84);
  backdrop-filter:blur(12px);
  box-shadow:0 40px 110px rgba(15,23,42,.30);
  overflow:hidden;
}
.winner-dialog[open] { animation:winner-in .32s cubic-bezier(.2,.9,.2,1.1) both; }
@keyframes winner-in { from { opacity:0; transform:translate(-50%,-46%) scale(.94); } to { opacity:1; transform:translate(-50%,-50%) scale(1); } }
.winner-dialog::backdrop { background:transparent; backdrop-filter:none; }
.dialog-close { position:absolute; right:14px; top:14px; width:36px; height:36px; border:0; border-radius:50%; background:rgba(15,23,42,.06); color:#667085; font-size:24px; }
.winner-glow { position:absolute; width:260px; height:260px; border-radius:50%; background:radial-gradient(circle,rgba(99,102,241,.24),transparent 70%); left:50%; top:-150px; transform:translateX(-50%); }
.winner-dialog small { position:relative; color:var(--muted); text-transform:uppercase; letter-spacing:.14em; font-weight:800; }
.winner-dialog h2 { position:relative; margin:14px 0 6px; font-size:clamp(34px,7vw,56px); line-height:1; overflow-wrap:anywhere; }
.winner-dialog p { position:relative; color:var(--muted); margin:0; }
.dialog-actions { position:relative; display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:28px; }
.primary-small { color:#fff; border-color:transparent; background:linear-gradient(135deg,var(--brand),var(--brand-2)); }

.seo-section {
  border-top:1px solid rgba(15,23,42,.06);
  background:rgba(255,255,255,.62);
  content-visibility:auto;
  contain-intrinsic-size:900px;
}
.seo-container { width:min(1120px,calc(100% - 36px)); margin:0 auto; padding:82px 0 70px; }
.seo-intro { max-width:780px; }
.eyebrow { margin:0 0 12px; color:var(--brand); font-size:12px; font-weight:850; text-transform:uppercase; letter-spacing:.12em; }
.seo-intro h1 { margin:0; font-size:clamp(34px,5vw,62px); line-height:1.06; letter-spacing:-.035em; }
.seo-intro > p:last-child { margin:22px 0 0; color:var(--muted); font-size:17px; line-height:1.75; }
.seo-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:45px; }
.seo-grid article { padding:24px; border:1px solid var(--line); border-radius:20px; background:rgba(255,255,255,.78); box-shadow:var(--soft-shadow); }
.seo-grid h2 { margin:0; font-size:18px; }
.seo-grid p { margin:10px 0 0; color:var(--muted); line-height:1.65; font-size:14px; }
.faq-block { margin-top:58px; max-width:820px; }
.faq-block > h2 { margin:0 0 18px; font-size:28px; }
.faq-block details { border-top:1px solid var(--line); padding:18px 0; }
.faq-block details:last-child { border-bottom:1px solid var(--line); }
.faq-block summary { cursor:pointer; font-weight:800; }
.faq-block p { margin:12px 0 0; color:var(--muted); line-height:1.65; }
.site-footer { min-height:72px; display:flex; align-items:center; justify-content:space-between; gap:20px; width:min(1120px,calc(100% - 36px)); margin:0 auto; color:var(--muted); font-size:13px; }
.site-footer a { color:var(--brand); text-decoration:none; font-weight:800; }
.noscript-message { position:fixed; inset:auto 16px 16px; z-index:120; padding:14px; border-radius:14px; background:#111827; color:#fff; text-align:center; }


.house-ad { width:min(1120px,calc(100% - 36px)); margin:24px auto 0; }
.house-ad-inner { display:flex; align-items:center; gap:18px; padding:15px 18px; border:1px solid var(--line); border-radius:18px; background:rgba(255,255,255,.80); box-shadow:var(--soft-shadow); }
.house-ad img { width:72px; height:54px; object-fit:cover; border-radius:12px; flex:0 0 auto; }
.house-ad-copy { min-width:0; flex:1; }
.house-ad-copy small { display:block; color:var(--muted); font-size:10px; font-weight:850; text-transform:uppercase; letter-spacing:.10em; }
.house-ad-copy strong { display:block; margin-top:4px; font-size:15px; }
.house-ad-copy p { margin:4px 0 0; color:var(--muted); font-size:12px; line-height:1.45; }
.house-ad-link { flex:0 0 auto; border-radius:12px; padding:10px 14px; color:#fff; background:linear-gradient(135deg,var(--brand),var(--brand-2)); text-decoration:none; font-size:12px; font-weight:850; }
.site-footer nav { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:14px; }
.footer-link { border:0; padding:0; color:var(--brand); background:transparent; font:inherit; font-weight:800; cursor:pointer; }
.privacy-scrim { position:fixed; inset:0; z-index:115; background:rgba(15,23,42,.28); backdrop-filter:blur(3px); }
.privacy-dialog { position:fixed; left:50%; top:50%; z-index:120; width:min(620px,calc(100vw - 28px)); max-height:calc(100dvh - 28px); margin:0; transform:translate(-50%,-50%); border:1px solid rgba(255,255,255,.86); border-radius:24px; padding:28px; color:var(--ink); background:rgba(255,255,255,.96); box-shadow:0 42px 120px rgba(15,23,42,.36); overflow:auto; }
.privacy-dialog::backdrop { background:transparent; }
.privacy-dialog > small { color:var(--brand); font-weight:850; text-transform:uppercase; letter-spacing:.10em; }
.privacy-dialog h2 { margin:8px 38px 8px 0; font-size:30px; letter-spacing:-.025em; }
.privacy-dialog > p { color:var(--muted); line-height:1.6; }
.privacy-choice { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-top:12px; padding:15px; border:1px solid var(--line); border-radius:16px; background:#fff; }
.privacy-choice > div { min-width:0; }
.privacy-choice strong { display:block; font-size:14px; }
.privacy-choice small { display:block; color:var(--muted); margin-top:4px; font-size:11px; line-height:1.45; }
.privacy-choice.locked { background:#f8fafc; }
.privacy-choice.locked > span { flex:0 0 auto; color:#067647; font-size:11px; font-weight:850; }
.privacy-actions { display:grid; grid-template-columns:1fr 1.25fr 1fr; gap:9px; margin-top:20px; }
.consent-btn { min-height:44px; border-radius:12px; padding:10px 13px; font-size:12px; font-weight:850; }
.consent-btn.secondary { border:1px solid var(--line); color:#344054; background:#fff; }
.consent-btn.primary { border:1px solid transparent; color:#fff; background:linear-gradient(135deg,var(--brand),var(--brand-2)); }
.consent-btn.decision { border:1px solid var(--brand); color:var(--brand); background:#fff; }
.privacy-more { margin:16px 0 0 !important; text-align:center; font-size:12px; }
.privacy-more a { color:var(--brand); font-weight:750; }
.consent-banner { position:fixed; left:16px; right:16px; bottom:16px; z-index:125; max-width:980px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:22px; padding:18px; border:1px solid rgba(255,255,255,.85); border-radius:20px; color:var(--ink); background:rgba(255,255,255,.97); box-shadow:0 28px 90px rgba(15,23,42,.30); }
.consent-banner strong { display:block; }
.consent-banner p { margin:5px 0 0; color:var(--muted); font-size:12px; line-height:1.5; }
.consent-banner-actions { display:flex; gap:8px; flex:0 0 auto; }

body.theme-midnight {
  --bg:#0c1220;
  --ink:#e9eef9;
  --muted:#9aa8bd;
  --line:rgba(255,255,255,.10);
  --panel:rgba(17,24,39,.86);
  background:radial-gradient(circle at 20% 10%,rgba(99,102,241,.20),transparent 28%),linear-gradient(135deg,#0a1020,#111827);
}
body.theme-midnight .topbar,
body.theme-midnight .stage { background:rgba(15,23,42,.66); border-color:rgba(255,255,255,.08); }
body.theme-midnight .ghost-btn,
body.theme-midnight .icon-btn,
body.theme-midnight .text-btn { color:#cbd5e1; }
body.theme-midnight textarea,
body.theme-midnight select,
body.theme-midnight .toggle-card,
body.theme-midnight .result-card,
body.theme-midnight .theme-card,
body.theme-midnight .soft-btn { color:var(--ink); background:rgba(15,23,42,.64); }
body.theme-midnight .field-label { color:#cbd5e1; }
body.theme-midnight .file-drop-overlay { background:rgba(15,23,42,.94); }
body.theme-midnight .wheel-center { background:linear-gradient(145deg,#202938,#0f172a); color:#fff; border-color:rgba(255,255,255,.12); }
body.theme-midnight .winner-dialog { background:rgba(15,23,42,.88); color:#fff; }
body.theme-midnight .seo-section { background:rgba(4,10,21,.60); border-color:rgba(255,255,255,.08); }
body.theme-midnight .seo-grid article { background:rgba(15,23,42,.62); }
body.theme-midnight .house-ad-inner,
body.theme-midnight .privacy-dialog,
body.theme-midnight .privacy-choice,
body.theme-midnight .consent-banner { background:rgba(15,23,42,.96); color:var(--ink); }
body.theme-midnight .privacy-choice.locked { background:rgba(30,41,59,.88); }
body.theme-midnight .consent-btn.secondary,
body.theme-midnight .consent-btn.decision { background:rgba(30,41,59,.92); color:var(--ink); }
body.theme-midnight .brand-mark { background:#f8fafc; }

@media (min-width:1121px) and (max-height:760px) {
  .topbar { height:62px; }
  .app-shell { height:calc(100dvh - 62px); min-height:500px; padding:12px 16px; gap:16px; }
  .stage,.panel { border-radius:24px; }
  .panel-body { padding:15px 18px; }
  .panel-tabs { padding-top:7px; }
  .tab { padding:10px 5px; }
  .wheel-wrap { width:clamp(240px,min(54vw,calc(100dvh - 238px)),560px); }
  .wheel-center { width:94px; height:94px; border-width:8px; }
  .result-card { border-radius:15px; }
  .keyboard-hint { display:none; }
  .status-pill { top:15px; left:15px; }
  textarea { min-height:130px; }
  .toggle-card { padding:11px 0; }
}

@media (max-width:1120px) {
  .app-shell { height:auto; min-height:calc(100dvh - 68px); grid-template-columns:1fr; }
  .stage { height:auto; min-height:min(690px,calc(100dvh - 92px)); }
  .panel { height:auto; min-height:auto; }
  .panel-body { overflow:visible; }
  .wheel-wrap { width:clamp(280px,min(72vw,calc(100dvh - 270px)),560px); }
}

@media (max-width:720px) {
  .topbar { height:64px; padding:0 14px; }
  .brand-mark { width:38px; height:38px; border-radius:12px; }
  .brand-mark svg { width:35px; height:35px; }
  .brand-copy small { display:none; }
  .ghost-btn { display:none; }
  .app-shell { min-height:calc(100dvh - 64px); padding:10px; gap:12px; }
  .stage,.panel { border-radius:22px; }
  .stage { min-height:min(590px,calc(100dvh - 84px)); padding:18px 12px; }
  .wheel-wrap { width:clamp(250px,min(91vw,calc(100dvh - 255px)),470px); }
  .wheel-center { width:88px; height:88px; border-width:7px; }
  .pointer span { border-top-width:17px; border-bottom-width:17px; border-right-width:38px; }
  .panel-tabs { overflow-x:auto; grid-template-columns:repeat(4,minmax(84px,1fr)); }
  .panel-body { padding:18px; }
  .keyboard-hint { display:none; }
  .status-pill { top:14px; left:14px; }
  .winner-dialog { padding:34px 20px 24px; border-radius:23px; }
  .seo-container { padding:58px 0 48px; }
  .seo-grid { grid-template-columns:1fr; }
  .site-footer { min-height:82px; flex-direction:column; justify-content:center; text-align:center; padding:18px 0; }
  .house-ad-inner { align-items:flex-start; }
  .site-footer nav { justify-content:center; }
  .privacy-dialog { padding:22px 17px; border-radius:20px; }
  .privacy-actions { grid-template-columns:1fr; }
  .consent-banner { align-items:stretch; flex-direction:column; }
  .consent-banner-actions { display:grid; grid-template-columns:1fr 1fr; }
  .consent-banner-actions .decision:last-child { grid-column:1/-1; }
}


@media (max-width:430px) {
  .house-ad-inner { flex-wrap:wrap; }
  .house-ad-link { width:100%; text-align:center; }
  .privacy-choice { align-items:flex-start; }
  .import-actions { grid-template-columns:1fr; }
  .compact-grid { grid-template-columns:1fr 1fr 1fr; }
  .compact-grid .soft-btn { padding-inline:6px; font-size:11px; }
  .dialog-actions { grid-template-columns:1fr; }
}

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  body::before,body::after { display:none; }
}
