:root{
  --bg:#0b1117;
  --bg-soft:#13222d;
  --panel:rgba(13, 26, 36, 0.84);
  --panel-strong:rgba(15, 30, 41, 0.95);
  --panel-elevated:rgba(16, 31, 43, 0.96);
  --panel-border-strong:rgba(255,255,255,0.1);
  --text:#f4efe2;
  --muted:#9fb2bf;
  --line:rgba(171, 194, 205, 0.16);
  --accent:#f1c874;
  --accent-2:#92d6ff;
  --thinking-across:#92d6ff;
  --thinking-across-soft:rgba(146, 214, 255, 0.16);
  --thinking-down:#ff9cc5;
  --thinking-down-soft:rgba(255, 156, 197, 0.16);
  --good:#5ad28d;
  --bad:#ff7070;
  --cell-size:64px;
  --shadow:0 26px 70px rgba(0, 0, 0, 0.34);
  --panel-shadow:0 26px 60px rgba(0, 0, 0, 0.28);
  --app-vh:1vh;
  --keyboard-offset:0px;
  --safe-top:env(safe-area-inset-top, 0px);
  --safe-right:env(safe-area-inset-right, 0px);
  --safe-bottom:env(safe-area-inset-bottom, 0px);
  --safe-left:env(safe-area-inset-left, 0px);
  --font-body-stack:"Trebuchet MS", "Gill Sans", "Avenir Next", sans-serif;
  --font-display-stack:"Baskerville", "Palatino Linotype", "Book Antiqua", serif;
  --font-mono-stack:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}

*{ box-sizing:border-box; }

html{
  min-height:100%;
  height:100%;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

body{
  margin:0;
  min-height:100vh;
  min-height:100dvh;
  min-height:100svh;
  min-height:calc(var(--app-vh) * 100);
  color:var(--text);
  background:
    linear-gradient(90deg, rgba(255,255,255,0.02) 1px, transparent 1px),
    linear-gradient(rgba(255,255,255,0.02) 1px, transparent 1px),
    radial-gradient(circle at top left, rgba(146, 214, 255, 0.12), transparent 34%),
    radial-gradient(circle at bottom right, rgba(241, 200, 116, 0.14), transparent 28%),
    linear-gradient(180deg, #0a1117, #101d27 58%, #0a1117);
  background-size:26px 26px, 26px 26px, auto, auto, auto;
  font-family:var(--font-body-stack);
  overflow-x:hidden;
  overscroll-behavior-y:none;
}

body.has-modal-open{
  overflow:hidden;
}

body.is-builder-page{
  min-height:100vh;
}

body.is-builder-page .hero,
body.is-builder-page .controls-shell,
body.is-builder-page #playSurface,
body.is-builder-page .mobile-toolbar{
  display:none;
}

body.is-builder-page .container{
  max-width:1140px;
  padding-top:28px;
}

body.is-start-page .container{
  max-width:1120px;
  padding-top:28px;
}

body::before,
body::after{
  content:"";
  position:fixed;
  border-radius:50%;
  pointer-events:none;
  z-index:-1;
}

body::before{
  width:42vw;
  height:42vw;
  top:-10vw;
  left:-6vw;
  background:radial-gradient(circle, rgba(146, 214, 255, 0.16), rgba(146, 214, 255, 0));
  filter:blur(14px);
}

body::after{
  width:34vw;
  height:34vw;
  right:-8vw;
  bottom:-8vw;
  background:radial-gradient(circle, rgba(241, 200, 116, 0.18), rgba(241, 200, 116, 0));
  filter:blur(12px);
}

.container{
  display:flex;
  flex-direction:column;
  max-width:1380px;
  margin:0 auto;
  padding:
    calc(34px + var(--safe-top))
    calc(24px + var(--safe-right))
    calc(46px + var(--safe-bottom) + var(--keyboard-offset))
    calc(24px + var(--safe-left));
  animation:page-rise .55s ease-out both;
}

.site-nav{
  order:99;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0;
  width:100%;
  margin:0 0 12px;
  padding:0;
  border:none;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
}

.site-nav-brand{
  color:rgba(255, 244, 207, 0.5);
  font-size:11px;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
  text-decoration:none;
}

.site-nav-links{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:4px;
}

.site-nav-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:28px;
  padding:4px 8px;
  border:none;
  border-radius:999px;
  background:transparent;
  color:rgba(244, 239, 226, 0.58);
  font-size:11px;
  font-weight:600;
  text-decoration:none;
  transition:background .18s ease, color .18s ease;
}

.site-nav-link:hover,
.site-nav-link:focus-visible{
  background:rgba(146, 214, 255, 0.04);
  color:rgba(244, 239, 226, 0.86);
}

.content-page{
  display:grid;
  gap:18px;
}

.info-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:18px;
}

.info-card{
  display:grid;
  gap:12px;
}

.info-card-head{
  display:grid;
  gap:8px;
}

.page-section-kicker{
  margin:0;
  color:var(--accent-2);
  font-size:11px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.info-pill-row{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:14px;
}

.info-pill{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:4px 10px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:999px;
  background:rgba(255,255,255,0.03);
  color:rgba(244, 239, 226, 0.76);
  font-size:11px;
  font-weight:800;
  letter-spacing:.03em;
}

.checklist-list{
  display:grid;
  gap:10px;
  margin:0;
  padding-left:18px;
}

.link-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.placeholder-note{
  border-color:rgba(241, 200, 116, 0.14);
  background:
    radial-gradient(circle at top right, rgba(241, 200, 116, 0.08), transparent 34%),
    linear-gradient(180deg, rgba(18, 33, 44, 0.9), rgba(10, 20, 28, 0.96));
}

.seed-entry-page{
  gap:18px;
}

.seed-entry-hero{
  display:grid;
  grid-template-columns:minmax(0, 1.25fr) minmax(220px, 0.75fr);
  gap:18px;
  align-items:start;
}

.seed-entry-title{
  margin:6px 0 10px;
  font-size:clamp(2rem, 4vw, 3.2rem);
  line-height:0.96;
  letter-spacing:-0.05em;
}

.seed-entry-subtitle{
  margin:0;
  max-width:62ch;
  color:var(--muted);
  line-height:1.55;
}

.seed-entry-side{
  display:grid;
  gap:10px;
  align-content:start;
  justify-items:start;
}

.seed-entry-status-shell{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}

.seed-entry-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(83, 125, 111, 0.18);
  background:rgba(255,255,255,0.72);
  font-size:0.82rem;
  font-weight:700;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--text);
}

.seed-entry-status-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:86px;
  min-height:32px;
  padding:6px 12px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:999px;
  background:rgba(255,255,255,0.04);
  color:#dff4ff;
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  flex:0 0 auto;
}

.seed-entry-status-badge[data-state="loading"],
.seed-entry-status-badge[data-state="neutral"]{
  border-color:rgba(146, 214, 255, 0.24);
  background:rgba(146, 214, 255, 0.08);
  color:#dff4ff;
}

.seed-entry-status-badge[data-state="good"]{
  border-color:rgba(90, 210, 141, 0.26);
  background:rgba(90, 210, 141, 0.1);
  color:#dff9ea;
}

.seed-entry-status-badge[data-state="warning"]{
  border-color:rgba(241, 200, 116, 0.24);
  background:rgba(241, 200, 116, 0.1);
  color:#fff0b7;
}

.seed-entry-status-badge[data-state="error"]{
  border-color:rgba(255, 112, 112, 0.28);
  background:rgba(255, 112, 112, 0.09);
  color:#ffdada;
}

.seed-entry-status{
  margin:0;
  color:var(--muted);
  line-height:1.55;
}

.seed-entry-status[data-tone="good"]{
  color:#1f6d4d;
}

.seed-entry-status[data-tone="warning"]{
  color:#9a5c17;
}

.seed-entry-status[data-tone="error"]{
  color:#a33a35;
}

.seed-entry-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:14px;
}

.seed-entry-availability{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:14px;
}

.seed-entry-return-row{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:14px;
  align-items:center;
  padding-block:18px;
}

.seed-entry-return-copy{
  display:grid;
  gap:4px;
}

.seed-entry-return-btn{
  white-space:nowrap;
}

.seed-entry-status-card{
  display:grid;
  gap:8px;
}

.seed-entry-status-card-label{
  color:rgba(70, 86, 74, 0.68);
  font-size:0.72rem;
  font-weight:800;
  letter-spacing:0.12em;
  text-transform:uppercase;
}

.seed-entry-status-card-value{
  font-size:1rem;
  line-height:1.2;
  letter-spacing:-0.02em;
}

.seed-entry-status-card-text{
  margin:0;
  color:var(--muted);
  font-size:0.92rem;
  line-height:1.55;
}

.seed-entry-card{
  display:grid;
  gap:12px;
}

.seed-entry-card-primary{
  background:
    linear-gradient(180deg, rgba(255,255,255,0.88), rgba(245, 239, 229, 0.92)),
    var(--card);
}

.seed-entry-kicker{
  margin:0;
  font-size:0.74rem;
  font-weight:800;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:rgba(70, 86, 74, 0.7);
}

.seed-entry-card-title{
  margin:0;
  font-size:1.22rem;
  letter-spacing:-0.03em;
}

.seed-entry-card-text{
  margin:0;
  color:var(--muted);
  line-height:1.55;
}

.seed-entry-form{
  display:grid;
  gap:12px;
  margin-top:6px;
}

.seed-entry-field{
  display:grid;
  gap:6px;
}

.seed-entry-label{
  padding-inline-start:6px;
  font-size:0.86rem;
  font-weight:700;
  color:var(--muted-strong);
}

.seed-entry-input{
  width:100%;
  border:1px solid rgba(255,255,255,0.08);
  background:
    linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.03)),
    rgba(7, 16, 24, 0.76);
  border-radius:16px;
  padding:12px 14px;
  font:inherit;
  color:var(--text);
  transition:border-color 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.seed-entry-input:focus{
  outline:none;
  border-color:rgba(146, 214, 255, 0.34);
  box-shadow:0 0 0 4px rgba(146, 214, 255, 0.12);
  background:
    linear-gradient(180deg, rgba(255,255,255,0.07), rgba(255,255,255,0.04)),
    rgba(10, 20, 29, 0.88);
}

.password-reveal-shell{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:8px;
  align-items:center;
}

.password-reveal-shell .seed-entry-input{
  min-width:0;
}

.password-reveal-toggle{
  min-height:46px;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:14px;
  background:rgba(255,255,255,0.06);
  color:var(--text);
  font:inherit;
  font-size:13px;
  font-weight:800;
  white-space:nowrap;
  cursor:pointer;
  transition:border-color .18s ease, background .18s ease, transform .18s ease;
}

.password-reveal-toggle:hover,
.password-reveal-toggle:focus-visible{
  border-color:rgba(146, 214, 255, 0.28);
  background:rgba(146, 214, 255, 0.1);
}

.password-reveal-toggle:disabled{
  opacity:.55;
  cursor:not-allowed;
}

.seed-entry-btn{
  justify-self:start;
  min-width:184px;
}

.seed-entry-card .seed-entry-btn{
  color:#fffaf1;
}

.seed-entry-note-card{
  display:grid;
  gap:8px;
}

.seed-entry-note-title{
  margin:0;
  font-size:0.9rem;
  font-weight:800;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:rgba(70, 86, 74, 0.68);
}

.seed-entry-note-text{
  margin:0;
  color:var(--muted);
  line-height:1.55;
}

.seed-entry-feedback{
  margin:0;
  min-height:1.4em;
  color:var(--muted);
  line-height:1.5;
}

.seed-entry-feedback[data-tone="error"]{
  color:#a33a35;
}

.seed-entry-feedback[data-tone="neutral"]{
  color:var(--muted-strong);
}

.seed-entry-feedback[data-tone="good"]{
  color:#1f6d4d;
}

.content-card{
  padding:24px;
  border:1px solid var(--line);
  border-radius:28px;
  background:
    linear-gradient(180deg, rgba(18, 33, 44, 0.9), rgba(10, 20, 28, 0.96)),
    linear-gradient(145deg, rgba(255,255,255,0.03), transparent 50%);
  box-shadow:var(--panel-shadow);
}

.content-card h1,
.content-card h2,
.content-card h3{
  margin:0 0 12px;
  font-family:"Baskerville", "Palatino Linotype", "Book Antiqua", serif;
  letter-spacing:-0.02em;
}

.content-card p,
.content-card li{
  color:var(--text);
  line-height:1.7;
}

.content-card ul{
  margin:0;
  padding-left:20px;
}

.resolution-shell{
  display:grid;
  gap:18px;
}

.resolution-summary-panel{
  order:10;
}

.resolution-leaderboard{
  order:20;
}

.resolution-slang-section{
  order:30;
}

.resolution-competition{
  order:40;
}

.resolution-contribution{
  order:50;
}

.resolution-puzzle-card{
  order:60;
}

.resolution-empty{
  order:70;
}

.resolution-summary-panel{
  gap:18px;
}

.resolution-summary-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  grid-column:1 / -1;
}

.resolution-intro{
  padding-bottom:26px;
}

.resolution-data-status{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-top:12px;
}

.resolution-data-status-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:30px;
  padding:6px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,0.08);
  background:rgba(255,255,255,0.035);
  color:var(--text);
  font-size:12px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.resolution-data-status-badge[data-state="loading"]{
  background:rgba(241, 200, 116, 0.08);
  border-color:rgba(241, 200, 116, 0.16);
  color:#f1c874;
}

.resolution-data-status-badge[data-state="local"]{
  background:rgba(255,255,255,0.045);
  border-color:rgba(255,255,255,0.1);
  color:#f2f5f7;
}

.resolution-data-status-badge[data-state="online"]{
  background:rgba(149, 217, 119, 0.11);
  border-color:rgba(149, 217, 119, 0.22);
  color:#b9ed9c;
}

.resolution-data-status-badge[data-state="warning"]{
  background:rgba(159, 211, 255, 0.1);
  border-color:rgba(159, 211, 255, 0.18);
  color:#a9dafd;
}

.resolution-data-status-badge[data-state="missing"]{
  background:rgba(255,255,255,0.03);
  border-color:rgba(255,255,255,0.08);
  color:var(--muted);
}

.resolution-data-status-text{
  color:var(--muted);
  font-size:14px;
  line-height:1.55;
}

.resolution-availability{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:14px;
  margin-top:14px;
}

.resolution-status-card{
  display:grid;
  gap:8px;
}

.resolution-status-card-label{
  color:rgba(70, 86, 74, 0.68);
  font-size:0.72rem;
  font-weight:800;
  letter-spacing:0.12em;
  text-transform:uppercase;
}

.resolution-status-card-value{
  font-size:1rem;
  line-height:1.2;
  letter-spacing:-0.02em;
}

.resolution-status-card-text{
  margin:0;
  color:var(--muted);
  font-size:0.92rem;
  line-height:1.55;
}

.test-prep-page{
  padding-bottom:4rem;
}

.test-prep-hero{
  display:grid;
  gap:1rem;
}

.test-prep-actions{
  display:flex;
  flex-wrap:wrap;
  gap:.75rem;
}

.test-prep-inline-actions{
  display:flex;
  flex-wrap:wrap;
  gap:.65rem;
}

.test-prep-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:1rem;
  margin-top:1rem;
}

.test-prep-card{
  display:grid;
  gap:.55rem;
}

.test-prep-section{
  margin-top:1rem;
  display:grid;
  gap:.8rem;
}

.test-prep-probe-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:1rem;
}

.test-prep-probe-card{
  display:grid;
  gap:.75rem;
}

.test-prep-probe-label{
  font-size:.82rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--accent-2);
}

.test-prep-probe-row{
  display:flex;
  gap:.65rem;
  flex-wrap:wrap;
}

.test-prep-input{
  flex:1 1 220px;
  min-height:44px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(9,12,20,.6);
  color:var(--text);
  padding:0 14px;
  font:inherit;
}

.test-prep-input:focus{
  outline:none;
  border-color:rgba(164,121,255,.72);
  box-shadow:0 0 0 3px rgba(164,121,255,.16);
}

.test-prep-probe-text{
  margin:0;
  color:var(--muted);
  line-height:1.55;
}

.test-prep-inline-links{
  display:flex;
  flex-wrap:wrap;
  gap:.65rem;
}

.test-prep-link-list,
.test-prep-steps{
  margin:0;
  padding-left:1.2rem;
}

.test-prep-link-list li,
.test-prep-steps li{
  margin:.3rem 0;
}

.test-prep-note{
  margin:0;
  color:var(--muted);
}

.resolution-actions{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin-top:12px;
}

.resolution-copy-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  min-height:42px;
  padding-inline:14px;
}

.resolution-copy-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:16px;
  height:16px;
  flex:0 0 16px;
  opacity:.82;
}

.resolution-copy-icon svg{
  width:100%;
  height:100%;
  display:block;
}

.resolution-copy-feedback{
  color:var(--muted);
  font-size:13px;
  line-height:1.45;
  min-height:20px;
}

.resolution-copy-feedback.is-success{
  color:#b9ed9c;
}

.resolution-copy-feedback.is-error{
  color:#f1c874;
}

.resolution-summary-body{
  margin:0;
}

.resolution-leaderboard{
  padding:20px;
}

.resolution-contribution{
  padding:20px;
}

.resolution-competition{
  padding:20px;
}

.resolution-competition-summary{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:14px;
  margin:16px 0 18px;
}

.resolution-competition-card{
  display:grid;
  gap:8px;
}

.resolution-competition-card-label{
  color:var(--accent-2);
  font-size:0.72rem;
  font-weight:900;
  letter-spacing:0.14em;
  text-transform:uppercase;
}

.resolution-competition-card-value{
  font-size:1rem;
  line-height:1.2;
  letter-spacing:-0.02em;
}

.resolution-competition-card-text{
  margin:0;
  color:var(--muted);
  font-size:0.92rem;
  line-height:1.55;
}

.resolution-team-shell{
  display:grid;
  gap:12px;
  margin-top:16px;
  padding-top:16px;
  border-top:1px solid rgba(255,255,255,0.06);
}

.resolution-team-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.resolution-team-title{
  margin:0;
}

.resolution-collab-insight{
  margin:0 0 16px;
  color:var(--text);
  font-size:14px;
  line-height:1.6;
}

.resolution-collab-list{
  display:grid;
  gap:12px;
  margin:0;
  padding:0;
  list-style:none;
}

.resolution-collab-item{
  display:grid;
  gap:12px;
  padding:16px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:18px;
  background:rgba(255,255,255,0.028);
}

.resolution-collab-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}

.resolution-collab-name{
  color:var(--text);
  font-size:15px;
  font-weight:900;
}

.resolution-collab-badge{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:7px 10px;
  border:1px solid rgba(146, 214, 255, 0.16);
  border-radius:999px;
  background:rgba(146, 214, 255, 0.07);
  color:var(--accent-2);
  font-size:12px;
  font-weight:800;
  letter-spacing:.02em;
}

.resolution-collab-metrics{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
}

.resolution-collab-metric{
  display:grid;
  gap:4px;
  padding:12px 13px;
  border-radius:14px;
  background:rgba(255,255,255,0.035);
  border:1px solid rgba(255,255,255,0.05);
}

.resolution-collab-metric-label{
  color:var(--muted);
  font-size:12px;
  font-weight:700;
  letter-spacing:.02em;
}

.resolution-collab-metric-value{
  color:var(--text);
  font-size:20px;
  font-weight:900;
}

.resolution-puzzle-card{
  display:grid;
  gap:18px;
}

.resolution-puzzle-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}

.resolution-scroll-note{
  margin:0;
  max-width:52ch;
  color:var(--muted);
  font-size:14px;
  line-height:1.6;
}

.resolution-board-layout{
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(220px, 320px);
  gap:14px;
  align-items:start;
}

.resolution-board-panel{
  min-height:auto;
}

.resolution-board-area{
  padding-top:0;
}

.resolution-board-stage{
  gap:0;
}

.resolution-grid-shell{
  cursor:default;
  min-height:0;
  max-height:none;
}

.resolution-grid-shell .grid{
  margin:0 auto;
}

.resolution-solution-panel{
  min-height:100%;
}

.resolution-empty{
  max-width:760px;
}

.resolution-empty p{
  margin-bottom:18px;
}

.start-shell{
  display:grid;
  gap:18px;
  margin-top:12px;
}

body.start-intro-open{
  overflow:hidden;
}

.site-nav-start{
  order:0;
  width:100%;
  margin:0 0 8px;
  padding:0;
  border:none;
}

.site-nav-surface{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  align-items:center;
  justify-content:center;
  gap:12px 20px;
  width:100%;
  margin:0 0 10px;
  min-height:92px;
  padding:18px 24px;
  border:1px solid rgba(171, 194, 205, 0.12);
  border-radius:28px;
  background:
    linear-gradient(180deg, rgba(16, 28, 38, 0.96), rgba(8, 16, 22, 0.98)),
    radial-gradient(circle at top left, rgba(146, 214, 255, 0.16), transparent 34%),
    linear-gradient(90deg, rgba(241, 200, 116, 0.08), transparent 42%);
  box-shadow:
    0 26px 50px rgba(0,0,0,0.24),
    inset 0 1px 0 rgba(255,255,255,0.05);
  backdrop-filter:blur(10px);
}

.site-nav-surface::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:180px;
  background:
    linear-gradient(135deg, rgba(241, 200, 116, 0.2), transparent 58%),
    radial-gradient(circle at left center, rgba(146, 214, 255, 0.12), transparent 60%);
  pointer-events:none;
}

.site-nav-surface::after{
  content:"";
  position:absolute;
  top:-36px;
  right:-28px;
  width:148px;
  height:148px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(146, 214, 255, 0.14), transparent 68%);
  pointer-events:none;
}

.site-nav-surface.site-nav-start{
  padding:18px 24px;
  border:1px solid rgba(171, 194, 205, 0.12);
}

.site-nav-title-only .site-nav-brand,
.site-nav-title-only .site-nav-page-title,
.site-nav-title-only .site-nav-links,
.site-nav-title-only .site-nav-theme-toggle{
  display:none !important;
}

.site-nav-heading{
  position:relative;
  display:block;
  margin:0;
  color:#fffaf1;
  font-family:var(--font-display-stack);
  font-size:clamp(30px, 4.2vw, 48px);
  font-weight:900;
  letter-spacing:.01em;
  line-height:1;
  text-shadow:0 10px 28px rgba(0,0,0,0.28);
}

.site-nav-heading-link{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  justify-content:center;
  justify-items:center;
  min-width:min(100%, 620px);
  padding:16px 28px;
  border:1px solid rgba(255,255,255,0.09);
  border-radius:999px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.055), rgba(255,255,255,0.02)),
    radial-gradient(circle at top center, rgba(241, 200, 116, 0.14), transparent 56%),
    radial-gradient(circle at 20% 50%, rgba(146, 214, 255, 0.16), transparent 44%);
  box-shadow:
    0 18px 34px rgba(0,0,0,0.18),
    inset 0 1px 0 rgba(255,255,255,0.06);
  text-decoration:none;
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

.site-nav-heading-link::before{
  content:"";
  position:absolute;
  inset:8px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,0.04);
  pointer-events:none;
}

.site-nav-heading-link:hover,
.site-nav-heading-link:focus-visible{
  transform:translateY(-1px) scale(1.01);
  border-color:rgba(241, 200, 116, 0.24);
  box-shadow:
    0 24px 40px rgba(0,0,0,0.22),
    0 0 0 4px rgba(241, 200, 116, 0.08),
    inset 0 1px 0 rgba(255,255,255,0.08);
  background:
    linear-gradient(180deg, rgba(255,255,255,0.07), rgba(255,255,255,0.03)),
    radial-gradient(circle at top center, rgba(241, 200, 116, 0.2), transparent 56%),
    radial-gradient(circle at 20% 50%, rgba(146, 214, 255, 0.2), transparent 44%);
}


.start-hero-grid{
  display:grid;
  grid-template-columns:minmax(0, 1fr);
  gap:18px;
  align-items:stretch;
}

.start-test-bar{
  position:relative;
  display:grid;
  gap:8px;
  padding:18px 22px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:24px;
  background:
    radial-gradient(circle at top right, rgba(241, 200, 116, 0.12), transparent 32%),
    linear-gradient(135deg, rgba(24, 43, 56, 0.92), rgba(11, 20, 29, 0.98));
  box-shadow:0 16px 34px rgba(0, 0, 0, 0.18);
  color:var(--text);
  text-decoration:none;
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.start-test-bar:hover,
.start-test-bar:focus-visible{
  transform:translateY(-1px);
  border-color:rgba(241, 200, 116, 0.18);
  box-shadow:
    0 20px 40px rgba(0, 0, 0, 0.22),
    0 0 0 1px rgba(241, 200, 116, 0.05);
}

.start-test-kicker{
  color:rgba(255, 243, 201, 0.86);
  font-size:11px;
  font-weight:900;
  letter-spacing:.18em;
  text-transform:uppercase;
}

.start-test-title{
  font-family:"Baskerville", "Palatino Linotype", "Book Antiqua", serif;
  font-size:clamp(24px, 2.3vw, 32px);
  line-height:1;
  letter-spacing:-0.03em;
}

.start-test-text{
  margin:0;
  color:var(--muted);
  font-size:14px;
  line-height:1.65;
  max-width:64ch;
}

.start-hero-card-streamlined{
  display:grid;
  gap:22px;
}

.start-card-divider{
  width:100%;
  height:1px;
  background:linear-gradient(90deg, rgba(255,255,255,0.12), rgba(255,255,255,0.02), rgba(146, 214, 255, 0.12));
}

.start-hero-card{
  position:relative;
  overflow:hidden;
  padding:36px 34px;
  border:1px solid var(--line);
  border-radius:32px;
  background:
    radial-gradient(circle at top right, rgba(241, 200, 116, 0.1), transparent 34%),
    radial-gradient(circle at bottom left, rgba(146, 214, 255, 0.1), transparent 28%),
    linear-gradient(145deg, rgba(18, 35, 47, 0.94), rgba(9, 19, 27, 0.97));
  box-shadow:0 20px 44px rgba(0, 0, 0, 0.24);
}

.start-hero-card::before{
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  height:1px;
  background:linear-gradient(90deg, rgba(255,255,255,0.18), rgba(255,255,255,0));
  pointer-events:none;
}

.start-title{
  margin:0;
  max-width:11ch;
  font-family:"Baskerville", "Palatino Linotype", "Book Antiqua", serif;
  font-size:clamp(40px, 5vw, 68px);
  line-height:.92;
  letter-spacing:-0.04em;
  text-wrap:balance;
}

.start-subtitle{
  max-width:60ch;
  margin:16px 0 0;
  color:var(--muted);
  font-size:17px;
  line-height:1.75;
}

.start-mode-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:16px;
}

.start-mode-card{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:12px;
  min-height:218px;
  padding:26px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:28px;
  background:
    radial-gradient(circle at top right, rgba(146, 214, 255, 0.08), transparent 42%),
    linear-gradient(180deg, rgba(17, 31, 42, 0.88), rgba(9, 19, 27, 0.96));
  box-shadow:0 18px 40px rgba(0, 0, 0, 0.2);
  color:var(--text);
  text-decoration:none;
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

.start-mode-card:hover,
.start-mode-card:focus-visible{
  transform:translateY(-1px);
  border-color:rgba(146, 214, 255, 0.22);
  box-shadow:
    0 22px 44px rgba(0, 0, 0, 0.26),
    0 0 0 1px rgba(146, 214, 255, 0.06);
}

.start-size-panel{
  display:grid;
  gap:14px;
  margin-top:22px;
  padding:18px 18px 16px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:24px;
  background:rgba(255,255,255,0.03);
}

.start-size-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
}

.start-size-kicker{
  margin:0 0 6px;
  color:rgba(255, 243, 201, 0.84);
  font-size:11px;
  font-weight:900;
  letter-spacing:.18em;
  text-transform:uppercase;
}

.start-size-title{
  margin:0;
  max-width:24ch;
  font-family:"Baskerville", "Palatino Linotype", "Book Antiqua", serif;
  font-size:clamp(20px, 2vw, 28px);
  line-height:1.05;
  letter-spacing:-0.03em;
}

.start-size-current{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:6px 10px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:999px;
  background:rgba(255,255,255,0.04);
  color:rgba(244, 239, 226, 0.9);
  font-size:12px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.start-size-options{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:10px;
}

.start-size-options-dual{
  grid-template-columns:repeat(2, minmax(0, 1fr));
}

.start-size-option{
  display:grid;
  gap:5px;
  min-height:78px;
  padding:14px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:18px;
  background:rgba(255,255,255,0.02);
  color:var(--text);
  text-align:left;
  font:inherit;
  cursor:pointer;
  transition:border-color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease;
}

.start-size-option:hover,
.start-size-option:focus-visible{
  outline:none;
  transform:translateY(-1px);
  border-color:rgba(146, 214, 255, 0.18);
  background:rgba(255,255,255,0.045);
}

.start-size-option.is-active{
  border-color:rgba(146, 214, 255, 0.28);
  background:
    radial-gradient(circle at top right, rgba(146, 214, 255, 0.09), transparent 44%),
    rgba(255,255,255,0.055);
  box-shadow:0 0 0 1px rgba(146, 214, 255, 0.08);
}

.start-size-option-label{
  font-size:15px;
  font-weight:800;
  letter-spacing:-0.01em;
}

.start-size-option-meta{
  color:var(--muted);
  font-size:13px;
  line-height:1.45;
}

.start-size-note{
  margin:0;
  color:rgba(244, 239, 226, 0.68);
  font-size:13px;
  line-height:1.55;
}

.start-hero-chips{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:20px;
}

.start-hero-chip{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:4px 8px;
  border:1px solid rgba(255,255,255,0.05);
  border-radius:999px;
  background:rgba(255,255,255,0.02);
  color:rgba(244, 239, 226, 0.72);
  font-size:11px;
  font-weight:700;
  letter-spacing:.02em;
}

.start-tagline{
  margin:18px 0 0;
  color:rgba(255, 243, 201, 0.88);
  font-size:14px;
  font-weight:700;
  letter-spacing:.01em;
}

.start-side-card{
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:28px 24px;
  border:1px solid rgba(146, 214, 255, 0.08);
  border-radius:32px;
  background:
    radial-gradient(circle at top right, rgba(146, 214, 255, 0.1), transparent 38%),
    linear-gradient(180deg, rgba(17, 31, 42, 0.96), rgba(9, 19, 27, 0.98));
  box-shadow:0 18px 40px rgba(0, 0, 0, 0.22);
}

.start-side-card::before{
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  height:1px;
  background:linear-gradient(90deg, rgba(255,255,255,0.18), rgba(255,255,255,0));
  pointer-events:none;
}

.start-side-kicker{
  margin:0 0 10px;
  color:var(--accent-2);
  font-size:11px;
  font-weight:900;
  letter-spacing:.18em;
  text-transform:uppercase;
}

.start-side-title{
  margin:0;
  font-family:"Baskerville", "Palatino Linotype", "Book Antiqua", serif;
  font-size:clamp(26px, 2.3vw, 36px);
  line-height:1.02;
  letter-spacing:-0.03em;
}

.start-side-list{
  display:grid;
  gap:12px;
  margin-top:22px;
}

.start-side-item{
  padding:14px;
  border:1px solid rgba(255,255,255,0.05);
  border-radius:18px;
  background:rgba(255,255,255,0.02);
}

.start-side-item-label{
  display:block;
  color:rgba(255, 243, 201, 0.84);
  font-size:12px;
  font-weight:800;
  letter-spacing:.03em;
  text-transform:uppercase;
}

.start-side-item-text{
  margin:8px 0 0;
  color:var(--muted);
  font-size:14px;
  line-height:1.65;
}

.start-actions{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:18px;
}

.start-actions-inline{
  gap:16px;
}

.start-actions-inline .start-action-card{
  min-height:196px;
}

.start-action-card{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:12px;
  min-height:208px;
  padding:24px;
  border:1px solid var(--line);
  border-radius:28px;
  background:
    linear-gradient(180deg, rgba(17, 31, 42, 0.96), rgba(9, 19, 27, 0.98)),
    linear-gradient(145deg, rgba(255,255,255,0.03), transparent 50%);
  box-shadow:0 18px 40px rgba(0, 0, 0, 0.22);
  color:var(--text);
  text-decoration:none;
  transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease, background .2s ease;
}

.start-action-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:18px;
  height:18px;
  color:rgba(244, 239, 226, 0.8);
  opacity:.84;
}

.start-action-icon svg{
  width:100%;
  height:100%;
  display:block;
}

.start-action-card:hover,
.start-action-card:focus-visible{
  transform:translateY(-1px);
  border-color:rgba(146, 214, 255, 0.18);
  box-shadow:
    0 20px 42px rgba(0, 0, 0, 0.24),
    0 0 0 1px rgba(146, 214, 255, 0.05);
}

.start-action-card-primary{
  grid-column:1 / -1;
  background:
    radial-gradient(circle at top right, rgba(146, 214, 255, 0.1), transparent 40%),
    linear-gradient(180deg, rgba(20, 37, 49, 0.98), rgba(9, 19, 27, 0.98));
}

.start-action-kicker{
  color:var(--accent-2);
  font-size:11px;
  font-weight:900;
  letter-spacing:.18em;
  text-transform:uppercase;
}

.start-action-title{
  font-family:"Baskerville", "Palatino Linotype", "Book Antiqua", serif;
  font-size:clamp(28px, 2.4vw, 36px);
  line-height:1;
  letter-spacing:-0.03em;
}

.start-action-text{
  margin:0;
  color:var(--muted);
  font-size:15px;
  line-height:1.7;
}

.start-action-note{
  margin:0;
  color:rgba(244, 239, 226, 0.68);
  font-size:13px;
  line-height:1.6;
}

.start-action-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.start-action-pill{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:5px 9px;
  border:1px solid rgba(255,255,255,0.05);
  border-radius:999px;
  background:rgba(255,255,255,0.02);
  color:rgba(244, 239, 226, 0.72);
  font-size:11px;
  font-weight:700;
}

.start-action-cta{
  margin-top:auto;
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:38px;
  width:max-content;
  padding:8px 14px;
  border:1px solid rgba(255,255,255,0.1);
  border-radius:999px;
  background:rgba(255,255,255,0.04);
  color:#fff3c9;
  font-size:13px;
  font-weight:800;
}

.start-action-choice-row{
  margin-top:auto;
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

.start-action-choice-row .start-action-cta{
  margin-top:0;
}

.start-action-cta-primary{
  cursor:pointer;
  font:inherit;
}

.start-action-cta-secondary{
  color:rgba(244, 239, 226, 0.88);
  background:rgba(255,255,255,0.02);
}

.start-action-cta-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:13px;
  height:13px;
  opacity:.86;
}

.start-action-cta-icon svg{
  width:100%;
  height:100%;
  display:block;
}

.start-footer-links{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:6px 10px;
  width:100%;
  margin-top:6px;
  padding-top:10px;
  border-top:1px solid rgba(171, 194, 205, 0.08);
}

.page-legal-footer{
  margin-top:18px;
}

.start-footer-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:28px;
  padding:4px 8px;
  color:rgba(244, 239, 226, 0.5);
  font-size:11px;
  font-weight:600;
  text-decoration:none;
  transition:color .18s ease, background .18s ease;
}

.start-footer-link:hover,
.start-footer-link:focus-visible{
  color:rgba(244, 239, 226, 0.82);
  background:rgba(146, 214, 255, 0.04);
  border-radius:999px;
}

.start-intro-modal{
  position:fixed;
  inset:0;
  z-index:120;
}

.start-intro-backdrop{
  position:absolute;
  inset:0;
  background:rgba(5, 11, 18, 0.72);
  backdrop-filter:blur(10px);
}

.start-intro-dialog{
  position:relative;
  z-index:1;
  width:min(920px, calc(100vw - 28px));
  margin:min(7vh, 48px) auto;
  padding:28px;
  border:1px solid rgba(255,255,255,0.09);
  border-radius:30px;
  background:
    radial-gradient(circle at top right, rgba(146, 214, 255, 0.12), transparent 28%),
    radial-gradient(circle at bottom left, rgba(241, 200, 116, 0.11), transparent 26%),
    linear-gradient(150deg, rgba(18, 35, 47, 0.96), rgba(9, 18, 27, 0.98));
  box-shadow:0 28px 72px rgba(0, 0, 0, 0.38);
}

.start-intro-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
}

.start-intro-kicker{
  margin:0 0 8px;
  color:rgba(255, 243, 201, 0.88);
  font-size:11px;
  font-weight:900;
  letter-spacing:.18em;
  text-transform:uppercase;
}

.start-intro-title{
  margin:0;
  max-width:18ch;
  font-family:"Baskerville", "Palatino Linotype", "Book Antiqua", serif;
  font-size:clamp(30px, 4vw, 48px);
  line-height:.96;
  letter-spacing:-0.04em;
}

.start-intro-close{
  min-width:44px;
  min-height:44px;
  padding:0;
  font-size:24px;
  line-height:1;
}

.start-intro-body{
  display:grid;
  gap:14px;
  margin-top:18px;
}

.start-intro-lead{
  margin:0;
  color:rgba(244, 239, 226, 0.9);
  font-size:15px;
  line-height:1.75;
  max-width:72ch;
}

.start-intro-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:14px;
  margin-top:8px;
}

.start-intro-card{
  display:grid;
  gap:8px;
  min-height:118px;
  padding:16px 18px;
  border:1px solid rgba(255,255,255,0.07);
  border-radius:20px;
  background:rgba(255,255,255,0.03);
}

.start-intro-card-title{
  font-size:16px;
  font-weight:800;
  letter-spacing:-0.01em;
}

.start-intro-card-text{
  margin:0;
  color:var(--muted);
  font-size:14px;
  line-height:1.6;
}

.start-intro-actions{
  display:flex;
  justify-content:flex-end;
  margin-top:20px;
}

.print-watermark{
  display:none;
}

.competition-shell{
  display:grid;
  gap:18px;
}

.competition-hero{
  display:grid;
  grid-template-columns:minmax(0, 1.2fr) minmax(260px, 0.8fr);
  gap:18px;
}

.competition-title{
  margin:8px 0 12px;
  font-family:"Baskerville", "Palatino Linotype", "Book Antiqua", serif;
  font-size:clamp(34px, 4.8vw, 58px);
  line-height:.94;
  letter-spacing:-0.04em;
}

.competition-subtitle{
  margin:0;
  max-width:62ch;
  color:var(--muted);
  font-size:16px;
  line-height:1.7;
}

.competition-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:18px;
}

.competition-chip{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:4px 9px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:999px;
  background:rgba(255,255,255,0.03);
  color:rgba(244, 239, 226, 0.76);
  font-size:11px;
  font-weight:800;
  letter-spacing:.03em;
}

.competition-side{
  display:grid;
  gap:12px;
  align-content:start;
}

.competition-side-stat{
  padding:16px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:20px;
  background:rgba(255,255,255,0.03);
}

.competition-side-label{
  display:block;
  color:var(--accent-2);
  font-size:11px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.competition-side-value{
  display:block;
  margin-top:8px;
  color:var(--text);
  font-size:15px;
  line-height:1.5;
}

.competition-card-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:18px;
}

.competition-card{
  display:grid;
  gap:10px;
  padding:22px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:24px;
  background:
    linear-gradient(180deg, rgba(17, 31, 42, 0.96), rgba(9, 19, 27, 0.98)),
    linear-gradient(145deg, rgba(255,255,255,0.03), transparent 50%);
  box-shadow:0 16px 34px rgba(0,0,0,0.18);
}

.competition-card-kicker{
  margin:0;
  color:var(--accent-2);
  font-size:11px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.competition-card h2,
.competition-card h3{
  margin:0;
}

.competition-card p{
  margin:0;
}

.competition-list{
  display:grid;
  gap:8px;
  margin:0;
  padding-left:18px;
}

.competition-rules{
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
  gap:18px;
}

.competition-team-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:14px;
}

.competition-team-card{
  display:grid;
  gap:8px;
  padding:16px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:18px;
  background:rgba(255,255,255,0.03);
}

.competition-color-row{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.competition-color-chip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:28px;
  padding:4px 10px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:999px;
  background:rgba(255,255,255,0.02);
  color:var(--text);
  font-size:12px;
  font-weight:700;
}

.competition-color-dot{
  width:10px;
  height:10px;
  border-radius:999px;
}

.competition-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.competition-room-shell .btn,
.competition-room-shell .btn-ghost{
  min-height:46px;
}

.competition-setup-grid{
  display:grid;
  grid-template-columns:minmax(0, 1fr);
  gap:18px;
}

.competition-form-card{
  display:grid;
  gap:16px;
}

.competition-form{
  display:grid;
  gap:14px;
}

.competition-form-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}

.competition-form-grid-compact{
  grid-template-columns:minmax(0, 0.88fr) minmax(0, 1.12fr);
}

.competition-input{
  min-height:52px;
  resize:none;
}

.competition-time-field .competition-input{
  min-height:48px;
}

.competition-room-code-input{
  text-transform:uppercase;
  letter-spacing:.14em;
  font-weight:900;
}

.competition-room-shell{
  display:grid;
  gap:18px;
}

.competition-setup-grid[hidden],
.competition-room-shell[hidden],
#competitionRoomGrid[hidden],
#competitionParticipantsCard[hidden],
#competitionChatCard[hidden],
#competitionRoomSummary[hidden],
#competitionAdminSection[hidden],
#competitionDataStatus[hidden]{
  display:none !important;
}

.competition-admin-card[hidden]{
  display:none;
}

.competition-room-head{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:center;
  gap:16px;
  order:1;
  overflow:hidden;
  background:
    radial-gradient(circle at 100% 0, rgba(146, 214, 255, 0.12), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02)),
    rgba(10, 18, 26, 0.52);
  border-color:rgba(255,255,255,0.1);
}

.competition-room-head::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:4px;
  background:linear-gradient(180deg, var(--accent), rgba(146, 214, 255, 0.9));
  opacity:.88;
}

.competition-room-head > div:first-child{
  min-width:0;
  padding-left:6px;
}

.competition-room-head h2{
  margin:2px 0 6px;
  font-size:clamp(22px, 3vw, 29px);
  line-height:1.02;
  letter-spacing:-0.03em;
}

.competition-room-head .builder-help{
  margin:0;
  max-width:64ch;
  color:rgba(244, 239, 226, 0.82);
  font-size:14px;
  line-height:1.48;
}

.competition-room-code-stack{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:10px;
  align-self:stretch;
  align-content:flex-start;
}

.competition-room-shell .btn-ghost{
  background:
    linear-gradient(180deg, rgba(255,255,255,0.08), rgba(255,255,255,0.04)),
    rgba(15, 25, 34, 0.72);
  color:#f4efe2;
  border-color:rgba(255,255,255,0.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.05);
}

.competition-room-shell .btn-ghost:hover:not(:disabled){
  background:
    linear-gradient(180deg, rgba(146, 214, 255, 0.16), rgba(146, 214, 255, 0.08)),
    rgba(17, 29, 40, 0.82);
  border-color:rgba(146, 214, 255, 0.28);
  color:#f8fbff;
}

.competition-room-shell .btn:disabled,
.competition-room-shell .btn-ghost:disabled{
  opacity:.62;
  filter:none;
}

.competition-room-code-pill{
  appearance:none;
  cursor:pointer;
  font:inherit;
}

.competition-route-join-modal-dialog{
  width:min(540px, calc(100vw - 28px));
}

.competition-route-join-body{
  gap:14px;
}

.competition-route-join-meta{
  margin:0;
  color:rgba(236, 241, 248, 0.88);
  font-size:14px;
  font-weight:800;
  letter-spacing:0.04em;
  text-transform:uppercase;
}

.competition-invite-stack{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
}

.competition-room-summary{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:14px;
  order:1;
}

.competition-room-summary-compact{
  grid-template-columns:1fr;
  gap:12px;
}

.competition-data-status{
  display:flex;
  align-items:center;
  gap:14px;
  padding:16px 18px;
  order:2;
}

.competition-data-status-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:86px;
  min-height:32px;
  padding:6px 12px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:999px;
  background:rgba(255,255,255,0.04);
  color:#dff4ff;
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  flex:0 0 auto;
}

.competition-data-status-badge[data-state="loading"]{
  border-color:rgba(146, 214, 255, 0.24);
  background:rgba(146, 214, 255, 0.08);
  color:#dff4ff;
}

.competition-data-status-badge[data-state="local"]{
  border-color:rgba(241, 200, 116, 0.24);
  background:rgba(241, 200, 116, 0.1);
  color:#fff0b7;
}

.competition-data-status-badge[data-state="online"]{
  border-color:rgba(90, 210, 141, 0.26);
  background:rgba(90, 210, 141, 0.1);
  color:#dff9ea;
}

.competition-data-status-badge[data-state="warning"]{
  border-color:rgba(255, 112, 112, 0.28);
  background:rgba(255, 112, 112, 0.09);
  color:#ffdada;
}

.competition-data-status-text{
  margin:0;
  color:var(--muted);
  font-size:14px;
  line-height:1.55;
}

.competition-summary-card{
  display:grid;
  gap:8px;
  padding:16px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:18px;
  background:rgba(255,255,255,0.03);
}

.competition-summary-label{
  color:var(--accent-2);
  font-size:11px;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.competition-summary-value{
  font-size:15px;
  line-height:1.5;
}

.competition-room-grid{
  display:grid;
  grid-template-columns:minmax(0, .9fr) minmax(0, 1.1fr);
  gap:18px;
  order:4;
}

.competition-room-card{
  display:grid;
  gap:14px;
}

.competition-room-card-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.competition-room-card-head-sub{
  margin-top:8px;
}

.competition-results-team-shell{
  display:grid;
  gap:12px;
  padding-top:14px;
  border-top:1px solid rgba(255,255,255,0.06);
}

.competition-admin-card{
  order:2;
}

.competition-invite-card{
  order:3;
}

#competitionResultsSection{
  order:5;
}

.competition-results-summary{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:14px;
}

.competition-results-card{
  display:grid;
  gap:8px;
}

.competition-results-card-label{
  color:var(--accent-2);
  font-size:11px;
  font-weight:900;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.competition-results-card-value{
  font-size:15px;
  line-height:1.3;
}

.competition-results-card-text{
  margin:0;
  color:var(--muted);
  font-size:14px;
  line-height:1.55;
}

.competition-generator-shell{
  display:grid;
  min-height:72vh;
  place-items:center;
}

.competition-generator-card{
  width:min(560px, 100%);
  display:grid;
  gap:14px;
  text-align:center;
}

.competition-generator-title{
  margin:0;
  font-family:"Baskerville", "Palatino Linotype", "Book Antiqua", serif;
  font-size:clamp(32px, 5vw, 52px);
  line-height:.96;
  letter-spacing:-0.04em;
}

.competition-generator-status{
  margin:0;
  color:var(--text);
  font-size:16px;
  font-weight:700;
}

.competition-generator-status[data-tone="bad"]{
  color:#ff9a8b;
}

.competition-generator-status[data-tone="good"]{
  color:#98d78e;
}

.competition-generator-meta{
  margin:0;
  color:var(--muted);
  font-size:14px;
  line-height:1.6;
}

.competition-participant-list,
.competition-chat-list{
  display:grid;
  gap:10px;
  margin:0;
  padding:0;
  list-style:none;
}

.competition-participant-item,
.competition-chat-item{
  display:grid;
  gap:6px;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:16px;
  background:rgba(255,255,255,0.03);
}

.competition-participant-item.is-host{
  border-color:rgba(146, 214, 255, 0.16);
  background:
    linear-gradient(180deg, rgba(146, 214, 255, 0.08), rgba(255,255,255,0.02)),
    rgba(255,255,255,0.03);
}

.competition-participant-head{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
}

.competition-participant-name{
  font-size:14px;
}

.competition-participant-badge{
  display:inline-flex;
  align-items:center;
  min-height:22px;
  padding:2px 8px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:999px;
  background:rgba(255,255,255,0.04);
  color:rgba(244, 239, 226, 0.78);
  font-size:10px;
  font-weight:900;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.competition-participant-meta{
  color:var(--muted);
  font-size:12px;
  line-height:1.5;
}

.competition-chat-item-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.competition-chat-name{
  font-size:13px;
}

.competition-chat-time{
  color:var(--muted);
  font-size:11px;
}

.competition-chat-text{
  margin:0;
  color:var(--text);
  font-size:13px;
  line-height:1.6;
  white-space:pre-wrap;
}

.competition-chat-form{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:10px;
}

.hero{
  margin:0 0 18px;
}

.hero-grid{
  display:grid;
  grid-template-columns:minmax(0, 1.3fr) minmax(320px, .85fr);
  gap:16px;
  align-items:stretch;
}

.hero-copy,
.hero-card,
.controls,
.board-panel,
.solution-panel{
  position:relative;
  overflow:hidden;
  transition:transform .22s ease, border-color .22s ease, box-shadow .22s ease, background .22s ease;
}

.hero-copy{
  padding:24px 26px 26px;
  border:1px solid rgba(171, 194, 205, 0.12);
  border-radius:30px;
  background:
    linear-gradient(145deg, rgba(16, 30, 40, 0.94), rgba(9, 19, 27, 0.97)),
    linear-gradient(180deg, rgba(146, 214, 255, 0.03), transparent 52%);
  box-shadow:0 14px 30px rgba(0, 0, 0, 0.18);
  backdrop-filter:blur(10px);
}

.hero-copy::before,
.hero-card::before,
.controls::before,
.board-panel::before,
.solution-panel::before{
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  height:1px;
  background:linear-gradient(90deg, rgba(255,255,255,0.18), rgba(255,255,255,0));
  pointer-events:none;
}

.hero-kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin:0 0 14px;
  padding:7px 11px;
  border:1px solid rgba(241, 200, 116, 0.14);
  border-radius:999px;
  background:rgba(241, 200, 116, 0.04);
  color:rgba(241, 200, 116, 0.86);
  letter-spacing:.18em;
  text-transform:uppercase;
  font-size:11px;
  font-weight:800;
}

.hero-title{
  margin:0;
  max-width:10.5ch;
  font-family:"Baskerville", "Palatino Linotype", "Book Antiqua", serif;
  font-size:clamp(34px, 4vw, 56px);
  line-height:.96;
  letter-spacing:-0.03em;
  text-wrap:balance;
}

.hero-subtitle{
  margin:12px 0 0;
  max-width:62ch;
  color:var(--muted);
  font-size:15px;
  line-height:1.68;
}

.hero-metrics{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:16px;
}

.hero-metric{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:4px 9px;
  border:1px solid rgba(255,255,255,0.05);
  border-radius:999px;
  background:rgba(255,255,255,0.02);
  color:rgba(244, 239, 226, 0.72);
  font-size:11px;
  font-weight:700;
  letter-spacing:.02em;
}

.hero-card{
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:22px 20px;
  border:1px solid rgba(146, 214, 255, 0.06);
  border-radius:30px;
  background:
    radial-gradient(circle at top right, rgba(241, 200, 116, 0.05), transparent 38%),
    linear-gradient(180deg, rgba(15, 28, 38, 0.95), rgba(9, 19, 27, 0.98));
  box-shadow:0 12px 26px rgba(0, 0, 0, 0.16);
}

.hero-card-kicker{
  margin:0 0 10px;
  color:var(--accent-2);
  font-size:11px;
  font-weight:900;
  letter-spacing:.18em;
  text-transform:uppercase;
}

.hero-card-title{
  margin:0 0 10px;
  font-family:"Baskerville", "Palatino Linotype", "Book Antiqua", serif;
  font-size:clamp(24px, 2.1vw, 32px);
  line-height:1.02;
  letter-spacing:-0.03em;
}

.hero-card-text{
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.65;
}

.hero-card-list{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:14px;
  opacity:.8;
}

.hero-card-pill{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:5px 9px;
  border:1px solid rgba(146, 214, 255, 0.08);
  border-radius:999px;
  background:rgba(146, 214, 255, 0.04);
  color:rgba(216, 242, 255, 0.76);
  font-size:11px;
  font-weight:700;
}

.controls-shell{
  display:grid;
  gap:14px;
  margin-bottom:20px;
}

.controls{
  display:grid;
  grid-template-columns:minmax(0, 1fr);
  gap:12px;
  padding:14px;
  border:1px solid rgba(171, 194, 205, 0.1);
  border-radius:24px;
  background:
    linear-gradient(180deg, rgba(19, 36, 49, 0.88), rgba(10, 21, 30, 0.93)),
    linear-gradient(145deg, rgba(146, 214, 255, 0.03), transparent 58%);
  box-shadow:0 16px 34px rgba(0, 0, 0, 0.18);
  backdrop-filter:blur(10px);
}

.controls-group{
  display:flex;
  align-items:center;
  align-content:flex-start;
  gap:10px;
  flex-wrap:wrap;
  min-height:100%;
  padding:12px;
  border:1px solid rgba(255,255,255,0.04);
  border-radius:18px;
  background:rgba(255,255,255,0.018);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.03);
  transition:transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease;
}

.controls-group-play,
.controls-group-status{
  width:100%;
}

.controls-group-play .btn{
  flex:1 1 148px;
}

.controls-group-primary{
  background:
    linear-gradient(180deg, rgba(241, 200, 116, 0.04), rgba(255,255,255,0.015)),
    rgba(255,255,255,0.015);
}

.controls-group-status{
  align-items:stretch;
  justify-content:flex-start;
  background:
    linear-gradient(180deg, rgba(146, 214, 255, 0.04), rgba(255,255,255,0.015)),
    rgba(255,255,255,0.015);
}

.controls-group-primary .select{
  flex:1 1 170px;
}

.controls-group-primary .setup-select-field{
  flex:1 1 170px;
  min-width:min(100%, 170px);
  display:grid;
  gap:8px;
}

.controls-group-primary .setup-select-field .select{
  width:100%;
  min-width:0;
}

.controls-group-primary .btn-generate{
  flex:1 1 240px;
}

.setup-seed-status-card{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:10px;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,0.07);
  border-radius:20px;
  background:
    linear-gradient(180deg, rgba(193, 139, 255, 0.08), rgba(255,255,255,0.02)),
    rgba(255,255,255,0.02);
}

.setup-seed-status-actions{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:10px;
}

.setup-seed-status-card:not([hidden]) ~ .generation-meta,
.setup-seed-status-card:not([hidden]) ~ .result{
  display:none !important;
}

.setup-identity-card{
  width:100%;
  display:grid;
  gap:12px;
  padding:14px 16px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:20px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.035), rgba(255,255,255,0.015)),
    rgba(255,255,255,0.018);
}

.setup-identity-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.setup-identity-kicker{
  margin:0 0 6px;
  color:var(--accent);
  font-size:11px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.setup-identity-title{
  margin:0;
  font-size:18px;
  line-height:1.08;
}

.setup-identity-badge{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:5px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,0.08);
  background:rgba(255,255,255,0.035);
  color:var(--muted);
  font-size:11px;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.setup-identity-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}

.setup-identity-field-wide{
  grid-column:1 / -1;
}

.setup-identity-note{
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.55;
}

.setup-collab-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:18px;
  background:rgba(255,255,255,0.02);
}

.setup-collab-copy{
  min-width:0;
  display:grid;
  gap:4px;
}

.setup-collab-subline{
  color:var(--muted);
  font-size:12px;
  line-height:1.45;
}

.setup-collab-toggle{
  appearance:none;
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  width:64px;
  min-height:40px;
  padding:6px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:999px;
  background:rgba(255,255,255,0.04);
  cursor:pointer;
  transition:border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease;
}

.setup-collab-toggle:hover,
.setup-collab-toggle:focus-visible{
  border-color:rgba(146, 214, 255, 0.24);
  background:rgba(146, 214, 255, 0.08);
  box-shadow:0 12px 22px rgba(0,0,0,0.2);
}

.setup-collab-toggle.is-active{
  justify-content:flex-end;
  border-color:rgba(241, 200, 116, 0.22);
  background:rgba(241, 200, 116, 0.1);
}

.setup-collab-toggle-box{
  position:relative;
  width:26px;
  height:26px;
  border-radius:999px;
  background:rgba(255,255,255,0.2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.14);
  transition:transform .18s ease, background .18s ease, box-shadow .18s ease;
}

.setup-collab-toggle.is-active .setup-collab-toggle-box{
  background:linear-gradient(180deg, rgba(241, 200, 116, 0.98), rgba(193, 139, 255, 0.98));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.18),
    0 0 0 5px rgba(193, 139, 255, 0.12),
    0 0 18px rgba(193, 139, 255, 0.22);
}

.setup-collab-invite-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:12px 14px;
  border:1px dashed rgba(193, 139, 255, 0.24);
  border-radius:18px;
  background:
    linear-gradient(180deg, rgba(193, 139, 255, 0.09), rgba(255,255,255,0.02)),
    rgba(255,255,255,0.02);
}

.setup-collab-invite-row[hidden],
.seed-lobby-section[hidden]{
  display:none;
}

.setup-collab-invite-label{
  color:var(--text);
  font-size:13px;
  font-weight:700;
  line-height:1.5;
}

.btn.is-copied{
  border-color:rgba(107,255,180,0.34) !important;
  background:
    linear-gradient(180deg, rgba(107,255,180,0.16), rgba(107,255,180,0.08)),
    rgba(9, 20, 27, 0.9) !important;
  box-shadow:
    0 0 0 4px rgba(107,255,180,0.12),
    0 16px 28px rgba(0,0,0,0.22);
  animation:copy-feedback-pop .68s ease;
}

.btn.is-copy-failed{
  border-color:rgba(255,123,123,0.34) !important;
  background:
    linear-gradient(180deg, rgba(255,123,123,0.16), rgba(255,123,123,0.08)),
    rgba(9, 20, 27, 0.9) !important;
  box-shadow:
    0 0 0 4px rgba(255,123,123,0.1),
    0 16px 28px rgba(0,0,0,0.22);
  animation:copy-feedback-pop .68s ease;
}

.seed-lobby-section{
  width:100%;
  display:grid;
  gap:14px;
}

.seed-lobby-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:14px;
}

.seed-lobby-card{
  display:grid;
  align-content:start;
  grid-auto-rows:max-content;
  gap:12px;
  padding:16px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:22px;
  background:
    linear-gradient(180deg, rgba(16, 29, 40, 0.94), rgba(9, 18, 26, 0.98)),
    radial-gradient(circle at top right, rgba(193, 139, 255, 0.09), transparent 40%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.05),
    0 18px 30px rgba(0,0,0,0.2);
}

.seed-lobby-chat-card{
  position:relative;
}

.seed-lobby-return-wrap{
  position:absolute;
  right:calc(14px + var(--safe-right));
  top:58px;
  z-index:2;
}

.seed-lobby-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.seed-lobby-kicker{
  margin:0 0 6px;
  color:var(--accent);
  font-size:11px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.seed-lobby-title{
  margin:0;
  font-size:22px;
  line-height:1.06;
}

.seed-lobby-chat-list,
.seed-lobby-participant-list{
  max-height:320px;
  overflow:auto;
  padding-right:4px;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
}

.seed-lobby-chat-list{
  height:180px;
  min-height:180px;
  max-height:180px;
}

.seed-lobby-participant-list{
  min-height:124px;
  display:grid;
  justify-items:stretch;
  align-content:flex-start;
  align-self:start;
  gap:10px;
  margin-top:0;
  padding-top:2px;
}

.seed-lobby-participant-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  width:100%;
  min-height:46px;
  padding:10px 14px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:18px;
  background:rgba(255,255,255,0.04);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.04);
}

.seed-lobby-participant-item.is-you{
  border-color:rgba(193, 139, 255, 0.34);
  background:
    linear-gradient(180deg, rgba(193, 139, 255, 0.14), rgba(255,255,255,0.03)),
    rgba(255,255,255,0.04);
}

.seed-lobby-participant-name{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
  font-size:13px;
  font-weight:800;
  color:var(--text);
}

.seed-lobby-participant-name::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:999px;
  flex:0 0 auto;
  background:rgba(151, 219, 141, 0.9);
  box-shadow:0 0 0 4px rgba(151, 219, 141, 0.12);
}

.seed-lobby-participant-item.is-you .seed-lobby-participant-name::before{
  background:rgba(193, 139, 255, 0.95);
  box-shadow:0 0 0 4px rgba(193, 139, 255, 0.16);
}

.seed-lobby-participant-status{
  color:var(--muted);
  font-size:11px;
  font-weight:700;
  white-space:nowrap;
  text-align:right;
}

.seed-lobby-empty{
  display:flex;
  align-items:center;
  min-height:54px;
  padding:10px 12px;
  border:1px dashed rgba(255,255,255,0.12);
  border-radius:16px;
  color:var(--muted);
  font-size:13px;
}

.seed-lobby-typing-note{
  margin:-2px 0 2px;
  color:var(--muted);
  font-size:12px;
  line-height:1.4;
}

.seed-lobby-jump-wrap{
  position:absolute;
  right:calc(14px + var(--safe-right));
  bottom:58px;
  z-index:2;
}

.seed-lobby-jump-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  padding:0;
  border:1px solid rgba(193, 139, 255, 0.24);
  border-radius:999px;
  background:rgba(14, 26, 38, 0.86);
  color:var(--text);
  font-size:15px;
  font-weight:800;
  cursor:pointer;
  box-shadow:0 10px 18px rgba(0,0,0,0.2);
  position:relative;
}

.seed-lobby-jump-btn:hover{
  transform:translateY(-1px);
  border-color:rgba(193, 139, 255, 0.34);
  background:rgba(193, 139, 255, 0.18);
}

.seed-lobby-jump-btn[data-unread]:not([data-unread=""])::after{
  content:attr(data-unread);
  position:absolute;
  top:-6px;
  right:-7px;
  min-width:16px;
  height:16px;
  padding:0 4px;
  border-radius:999px;
  background:#ff8ab8;
  color:#110b19;
  font-size:10px;
  font-weight:900;
  line-height:16px;
  text-align:center;
  box-shadow:0 6px 12px rgba(0,0,0,0.18);
}

.seed-lobby-chat-item{
  display:grid;
  grid-template-columns:auto minmax(0, 1fr) auto;
  align-items:start;
  column-gap:8px;
  row-gap:0;
  padding:5px 10px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:14px;
  background:rgba(255,255,255,0.03);
}

.seed-lobby-chat-name{
  font-size:13px;
  white-space:nowrap;
}

.seed-lobby-chat-text{
  margin:0;
  min-width:0;
  color:var(--text);
  font-size:14px;
  line-height:1.22;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}

.seed-lobby-chat-time{
  color:var(--muted);
  font-size:10px;
  white-space:nowrap;
}

.seed-lobby-chat-form{
  align-items:stretch;
}

.controls-group-primary .generation-meta,
.controls-group-primary .result{
  width:100%;
}

.setup-pool-preview{
  width:100%;
  display:grid;
  gap:8px;
  padding:12px 14px;
  border-radius:18px;
  border:1px solid rgba(26,40,71,.12);
  background:rgba(248,250,255,.86);
}

.setup-pool-preview-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.setup-pool-preview-kicker{
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--muted);
}

.setup-pool-preview-count{
  font-size:.98rem;
  font-weight:800;
  color:var(--ink);
}

.setup-pool-preview-meta,
.setup-pool-preview-usage{
  margin:0;
  font-size:.92rem;
  line-height:1.45;
  color:var(--muted);
}

.controls-group-status .generation-meta,
.controls-group-status .online-sync-status,
.controls-group-status .result{
  width:100%;
}

body.is-generator-setup-page .controls{
  grid-template-columns:minmax(0, 1fr);
}

body.is-generator-setup-page .controls-group{
  width:100%;
}

body.is-generator-setup-page .controls-group-primary{
  padding:16px;
}

body.is-generator-setup-page .controls-group-status{
  align-items:stretch;
}

body.is-generator-setup-page .controls-group-play{
  display:none;
}

body.is-generator-setup-page .play-surface{
  display:none;
}

body.is-generator-setup-page #generalDifficultyWrap[hidden],
body.is-generator-setup-page #generationMeta[hidden],
body.is-generator-setup-page #result[hidden],
body.is-generator-setup-page #roundControlsGroup[hidden]{
  display:none !important;
}

body.is-puzzle-category-slang #generalDifficultyWrap,
body[data-puzzle-category="slang"] #generalDifficultyWrap{
  display:none !important;
}

.pool-stats-panel{
  display:flex;
  flex-direction:column;
  gap:12px;
  width:100%;
  padding:14px;
  border:1px solid rgba(255,255,255,0.04);
  border-radius:18px;
  background:
    linear-gradient(180deg, rgba(10, 21, 29, 0.86), rgba(9, 18, 25, 0.92)),
    radial-gradient(circle at top right, rgba(146, 214, 255, 0.05), transparent 40%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.03);
}

.round-presence-strip{
  width:100%;
  display:grid;
  gap:10px;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:18px;
  background:
    linear-gradient(180deg, rgba(146, 214, 255, 0.06), rgba(255,255,255,0.015)),
    rgba(255,255,255,0.02);
}

.round-presence-solo-bar{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
  flex-wrap:wrap;
}

.round-presence-solo-bar[hidden],
.round-presence-shared-block[hidden]{
  display:none;
}

.round-presence-shared-block{
  display:grid;
  gap:10px;
}

.round-presence-head{
  display:flex;
  align-items:flex-end;
  gap:10px;
  min-width:0;
}

.round-presence-head-copy{
  display:grid;
  gap:6px;
  flex:0 0 auto;
}

.round-presence-kicker{
  color:var(--muted);
  font-size:10px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.round-presence-seed-badge{
  width:max-content;
}

.round-presence-solo-bar .round-presence-seed-badge{
  flex:0 0 auto;
}

.round-presence-head > .seed-leaderboard-pill{
  flex:0 0 auto;
}

.round-presence-list{
  display:flex;
  flex:1 1 auto;
  min-width:0;
  gap:8px;
  align-items:center;
  flex-wrap:nowrap;
  overflow-x:auto;
  overflow-y:hidden;
  padding:0 2px;
  scrollbar-width:thin;
  scrollbar-color:rgba(193, 139, 255, 0.52) rgba(255,255,255,0.06);
}

.round-presence-actions{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
}

.round-presence-actions .btn{
  width:100%;
}

.round-presence-pill{
  display:inline-flex;
  flex:0 0 auto;
  align-items:center;
  gap:8px;
  min-height:0;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,0.08);
  background:rgba(255,255,255,0.04);
  color:var(--text);
  font-size:0.82rem;
  font-weight:700;
  line-height:1;
}

.round-presence-pill::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:999px;
  background:rgba(151, 219, 141, 0.92);
  box-shadow:0 0 0 4px rgba(151, 219, 141, 0.12);
}

.round-presence-pill.is-remote{
  border-color:var(--presence-border, rgba(146, 214, 255, 0.28));
  background:
    linear-gradient(180deg, var(--presence-surface, rgba(146, 214, 255, 0.14)), rgba(255,255,255,0.03)),
    rgba(255,255,255,0.04);
  color:var(--presence-text, var(--text));
  box-shadow:0 0 0 3px var(--presence-glow, rgba(146, 214, 255, 0.12));
}

.round-presence-pill.is-remote::before{
  background:var(--presence-label, rgba(146, 214, 255, 0.92));
  box-shadow:0 0 0 4px var(--presence-glow, rgba(146, 214, 255, 0.12));
}

.round-presence-pill.is-you{
  border-color:rgba(193, 139, 255, 0.28);
  background:
    linear-gradient(180deg, rgba(193, 139, 255, 0.14), rgba(255,255,255,0.02)),
    rgba(255,255,255,0.04);
}

.round-presence-pill.is-you::before{
  background:rgba(193, 139, 255, 0.95);
  box-shadow:0 0 0 4px rgba(193, 139, 255, 0.16);
}

.round-presence-pill.is-offline{
  color:rgba(216, 242, 255, 0.48);
  border-color:rgba(255,255,255,0.05);
  background:rgba(255,255,255,0.02);
}

.round-presence-pill.is-offline::before{
  background:rgba(180, 193, 204, 0.46);
  box-shadow:0 0 0 4px rgba(180, 193, 204, 0.08);
}

.round-presence-empty{
  flex:0 0 auto;
  color:var(--muted);
  font-size:13px;
}

.round-presence-list::-webkit-scrollbar{
  height:8px;
}

.round-presence-list::-webkit-scrollbar-track{
  border-radius:999px;
  background:rgba(255,255,255,0.05);
}

.round-presence-list::-webkit-scrollbar-thumb{
  border-radius:999px;
  background:linear-gradient(90deg, rgba(193, 139, 255, 0.72), rgba(146, 214, 255, 0.72));
}

.round-presence-list::-webkit-scrollbar-thumb:hover{
  background:linear-gradient(90deg, rgba(193, 139, 255, 0.9), rgba(146, 214, 255, 0.88));
}

.pool-stats-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.pool-stats-actions{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:8px;
}

.pool-stats-kicker{
  margin:0 0 6px;
  color:var(--accent-2);
  font-size:11px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.pool-stats-title{
  margin:0;
  font-size:18px;
  line-height:1.08;
  letter-spacing:-0.02em;
}

.pool-stats-used{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:8px 12px;
  border:1px solid rgba(146, 214, 255, 0.1);
  border-radius:999px;
  background:rgba(146, 214, 255, 0.04);
  color:rgba(146, 214, 255, 0.88);
  font-size:12px;
  font-weight:800;
  letter-spacing:.08em;
}

.pool-stats-reset{
  padding:8px 12px;
  font-size:13px;
  box-shadow:none;
}

.pool-stats-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
}

.pool-stat-card{
  display:flex;
  flex-direction:column;
  gap:4px;
  min-height:84px;
  padding:12px;
  border:1px solid rgba(255,255,255,0.04);
  border-radius:16px;
  background:rgba(255,255,255,0.02);
}

.pool-stat-card-wide{
  grid-column:1 / -1;
}

.pool-stat-label{
  color:var(--muted);
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.pool-stat-value{
  color:var(--text);
  font-size:24px;
  font-weight:900;
  line-height:1.04;
}

.pool-stat-meta{
  color:var(--muted);
  font-size:13px;
  line-height:1.45;
}

.controls-group-label{
  width:100%;
  margin-bottom:2px;
  color:var(--muted);
  font-size:10px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
}

.timer{
  min-width:92px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:16px;
  background:rgba(7, 17, 24, 0.7);
  color:var(--text);
  text-align:center;
  font-size:17px;
  font-weight:900;
  font-variant-numeric:tabular-nums;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.05);
}

.btn{
  padding:11px 14px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:16px;
  background:linear-gradient(135deg, var(--accent), #e9a95e);
  color:#11161b;
  font-size:15px;
  font-weight:900;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  box-shadow:0 8px 20px rgba(241, 200, 116, 0.16);
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease;
}

.btnIcon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:16px;
  height:16px;
  flex:0 0 16px;
  opacity:.82;
}

.btnIcon svg{
  width:100%;
  height:100%;
  display:block;
}

.btn:hover:not(:disabled){
  transform:translateY(-1px);
  box-shadow:0 10px 24px rgba(241, 200, 116, 0.2);
}

.btn-generate,
.btn-with-progress{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
}

.btnProgress{
  position:relative;
  display:none;
  width:18px;
  height:18px;
  flex:0 0 18px;
  border-radius:50%;
  overflow:hidden;
  box-shadow:inset 0 0 0 1px rgba(17, 22, 27, 0.12);
}

.btnProgress::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:50%;
  background:conic-gradient(#11161b 0deg 18deg, rgba(17, 22, 27, 0.14) 18deg 360deg);
  animation:btn-generate-fill 1.1s steps(1, end) infinite;
}

.btn-generate.is-loading,
.btn-with-progress.is-loading{
  opacity:1;
  cursor:progress;
  transform:none;
  pointer-events:none;
}

.btn-generate.is-loading .btnProgress,
.btn-with-progress.is-loading .btnProgress{
  display:block;
}

.btn-generate.is-loading .btnLabel,
.btn-with-progress.is-loading .btnLabel{
  opacity:.9;
}

.btn-generate.is-loading .btnIcon,
.btn-with-progress.is-loading .btnIcon{
  opacity:.3;
}

.btn-with-progress .btnProgress::before{
  animation:btn-progress-spin .92s linear infinite;
}

.btn-with-progress.is-loading[data-phase="checking"]{
  background:linear-gradient(135deg, #f1c874, #dfaa57);
  box-shadow:0 8px 20px rgba(241, 200, 116, 0.2);
}

.btn-with-progress.is-loading[data-phase="saving"]{
  background:linear-gradient(135deg, #9fd3ff, #79b8eb);
  box-shadow:0 8px 20px rgba(121, 184, 235, 0.2);
}

.btn-with-progress.is-loading[data-phase="opening"]{
  background:linear-gradient(135deg, #b9ed9c, #95d977);
  box-shadow:0 8px 20px rgba(149, 217, 119, 0.22);
}

.btn-with-progress.is-loading[data-phase="checking"] .btnProgress::before{
  background:conic-gradient(#11161b 0deg 70deg, rgba(17, 22, 27, 0.12) 70deg 360deg);
}

.btn-with-progress.is-loading[data-phase="saving"] .btnProgress::before{
  background:conic-gradient(#18344a 0deg 70deg, rgba(24, 52, 74, 0.12) 70deg 360deg);
}

.btn-with-progress.is-loading[data-phase="opening"] .btnProgress::before{
  background:conic-gradient(#1d3821 0deg 70deg, rgba(29, 56, 33, 0.12) 70deg 360deg);
}

.btn:disabled{
  opacity:.44;
  cursor:not-allowed;
  box-shadow:none;
}

.btn-ghost{
  background:rgba(255,255,255,0.02);
  color:var(--text);
  border:1px solid var(--line);
  box-shadow:none;
}

.btn-ghost:hover:not(:disabled){
  background:rgba(146, 214, 255, 0.05);
  border-color:rgba(146, 214, 255, 0.16);
}

.btn-ghost.is-active{
  background:rgba(146, 214, 255, 0.16);
  color:#dff4ff;
  border-color:rgba(146, 214, 255, 0.38);
  box-shadow:0 10px 24px rgba(146, 214, 255, 0.12);
}

.result{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  min-width:0;
  min-height:46px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:16px;
  background:rgba(255,255,255,0.02);
  font-size:15px;
  font-weight:900;
  text-align:center;
}

.online-sync-status{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  min-width:0;
  min-height:46px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:16px;
  background:rgba(255,255,255,0.02);
  cursor:pointer;
  transition:border-color .16s ease, background .16s ease, box-shadow .16s ease;
}

.online-sync-status:hover,
.online-sync-status:focus-visible{
  border-color:rgba(146, 214, 255, 0.16);
  background:rgba(255,255,255,0.028);
  box-shadow:0 8px 18px rgba(0,0,0,0.12);
  outline:none;
}

.online-sync-status-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:28px;
  padding:5px 11px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,0.08);
  background:rgba(255,255,255,0.035);
  color:var(--text);
  font-size:11px;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.online-sync-status-badge[data-state="loading"]{
  background:rgba(241, 200, 116, 0.08);
  border-color:rgba(241, 200, 116, 0.16);
  color:#f1c874;
}

.online-sync-status-badge[data-state="local"]{
  background:rgba(255,255,255,0.045);
  border-color:rgba(255,255,255,0.1);
  color:#f2f5f7;
}

.online-sync-status-badge[data-state="online"]{
  background:rgba(149, 217, 119, 0.11);
  border-color:rgba(149, 217, 119, 0.22);
  color:#b9ed9c;
}

.online-sync-status-badge[data-state="warning"]{
  background:rgba(159, 211, 255, 0.1);
  border-color:rgba(159, 211, 255, 0.18);
  color:#a9dafd;
}

.online-sync-status-text{
  color:var(--muted);
  font-size:13px;
  line-height:1.5;
  flex:1 1 220px;
}

.online-sync-status-toggle{
  color:rgba(216, 242, 255, 0.72);
  font-size:11px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.online-sync-status[aria-expanded="true"] .online-sync-status-toggle{
  color:#dff4ff;
}

.online-sync-status-details{
  width:100%;
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
  padding-top:4px;
}

.online-sync-status-detail{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:10px 11px;
  border:1px solid rgba(255,255,255,0.04);
  border-radius:14px;
  background:rgba(255,255,255,0.02);
}

.online-sync-status-detail-label{
  color:var(--muted);
  font-size:10px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.online-sync-status-detail-value{
  color:var(--text);
  font-size:13px;
  font-weight:800;
  line-height:1.45;
  word-break:break-word;
}

.online-sync-status-detail-code{
  font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size:12px;
  word-break:break-word;
}

.online-sync-status-actions{
  grid-column:1 / -1;
  display:flex;
  justify-content:flex-start;
}

.online-sync-now-btn{
  min-height:40px;
  padding-inline:13px;
}

.competition-run-panel{
  display:grid;
  gap:10px;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:18px;
  background:rgba(255,255,255,0.025);
}

.competition-run-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.competition-run-kicker{
  margin:0 0 3px;
  color:var(--muted);
  font-size:10px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.competition-run-title{
  margin:0;
  color:var(--text);
  font-size:16px;
  line-height:1.2;
}

.competition-run-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:32px;
  padding:6px 12px;
  border-radius:999px;
  border:1px solid rgba(146, 214, 255, 0.14);
  background:rgba(146, 214, 255, 0.08);
  color:var(--accent-2);
  font-size:12px;
  font-weight:900;
  letter-spacing:.05em;
}

.competition-run-badge[data-state="warning"]{
  border-color:rgba(241, 200, 116, 0.18);
  background:rgba(241, 200, 116, 0.08);
  color:#f1c874;
}

.competition-run-badge[data-state="critical"]{
  border-color:rgba(255, 154, 122, 0.2);
  background:rgba(255, 154, 122, 0.09);
  color:#ffb39a;
}

.competition-run-badge[data-state="finished"],
.competition-run-badge[data-state="locked"]{
  border-color:rgba(185, 237, 156, 0.18);
  background:rgba(185, 237, 156, 0.08);
  color:#b9ed9c;
}

.competition-run-text,
.competition-run-meta{
  margin:0;
}

.competition-run-text{
  color:var(--text);
  font-size:14px;
  line-height:1.55;
}

.competition-run-meta{
  color:var(--muted);
  font-size:12px;
  line-height:1.5;
}

@media (max-width: 720px){
  .online-sync-status-details{
    grid-template-columns:1fr;
  }
}

.generation-meta{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  min-width:0;
  min-height:46px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:16px;
  background:rgba(255,255,255,0.02);
  color:var(--muted);
  font-size:13px;
  font-weight:800;
  text-align:center;
}

.generation-meta,
.result{
  position:relative;
  overflow:hidden;
  transition:transform .18s ease, border-color .18s ease, background .18s ease, color .18s ease, box-shadow .18s ease;
}

.generation-meta::before,
.result::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:2px;
  background:linear-gradient(180deg, rgba(146, 214, 255, 0.56), rgba(241, 200, 116, 0.36));
  opacity:.56;
}

.result.good{
  color:var(--good);
  background:rgba(90, 210, 141, 0.08);
  border-color:rgba(90, 210, 141, 0.24);
}

.result.bad{
  color:var(--bad);
  background:rgba(255, 112, 112, 0.08);
  border-color:rgba(255, 112, 112, 0.24);
}

.result.info,
.generation-meta.info{
  color:var(--accent-2);
  background:rgba(146, 214, 255, 0.08);
  border-color:rgba(146, 214, 255, 0.22);
}

.result.neutral,
.generation-meta.neutral{
  color:var(--muted);
  background:rgba(255,255,255,0.035);
  border-color:rgba(255,255,255,0.08);
}

.result.loading,
.generation-meta.loading{
  color:var(--accent);
  border-color:rgba(241, 200, 116, 0.24);
  background:
    linear-gradient(90deg, rgba(241, 200, 116, 0.08), rgba(255,255,255,0.03), rgba(241, 200, 116, 0.08));
  background-size:200% 100%;
  animation:status-sheen 1.1s linear infinite;
}

.generation-meta.is-refreshing,
.result.is-refreshing{
  animation:status-pulse .38s ease;
}

.play-surface{
  --board-resized-width:auto;
  --solution-resized-width:390px;
  display:grid;
  grid-template-columns:minmax(0, 1fr);
  gap:6px;
  align-items:start;
}

.board-panel,
.solution-panel{
  position:relative;
  padding:20px 20px 22px;
  border:1px solid var(--line);
  border-radius:28px;
  background:
    linear-gradient(180deg, rgba(18, 33, 44, 0.9), rgba(10, 20, 28, 0.96)),
    linear-gradient(145deg, rgba(255,255,255,0.03), transparent 50%);
  box-shadow:var(--shadow);
}

.board-panel{
  display:flex;
  flex-direction:column;
  min-width:0;
  min-height:640px;
  will-change:width, height;
  background:
    radial-gradient(circle at top, rgba(146, 214, 255, 0.08), transparent 42%),
    linear-gradient(180deg, rgba(18, 33, 44, 0.9), rgba(10, 20, 28, 0.96)),
    linear-gradient(145deg, rgba(255,255,255,0.03), transparent 50%);
}

.solution-panel{
  min-width:0;
  width:100%;
  position:static;
  will-change:width;
  background:
    radial-gradient(circle at top right, rgba(241, 200, 116, 0.12), transparent 34%),
    linear-gradient(180deg, rgba(21, 35, 46, 0.92), rgba(11, 20, 28, 0.97)),
    linear-gradient(145deg, rgba(255,255,255,0.03), transparent 50%);
}

.solution-panel[hidden]{
  display:none;
}

.panel-heading{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
  margin-bottom:16px;
}

.board-heading{
  margin-bottom:6px;
  gap:10px;
}

.board-heading .seed-presence-summary{
  margin-left:auto;
}

.board-heading .panel-kicker{
  margin-bottom:4px;
}

.board-heading .panel-title{
  font-size:clamp(24px, 2.15vw, 31px);
}

.board-puzzle-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:10px;
}

.board-puzzle-meta[hidden]{
  display:none;
}

.board-puzzle-meta-pill{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:6px 11px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:999px;
  background:rgba(255,255,255,0.05);
  color:rgba(245, 249, 255, 0.92);
  font-size:12px;
  font-weight:800;
  letter-spacing:0.01em;
  line-height:1;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.04);
}

.panel-kicker,
.solution-kicker{
  margin:0 0 8px;
  color:var(--accent);
  font-size:11px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.panel-title{
  margin:0;
  font-family:"Baskerville", "Palatino Linotype", "Book Antiqua", serif;
  font-size:clamp(26px, 2.4vw, 34px);
  line-height:1;
  letter-spacing:-0.03em;
}

.panel-copy{
  max-width:54ch;
  margin:0;
  color:var(--muted);
  font-size:14px;
  line-height:1.65;
}

.panel-tag-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:0 0 18px;
}

.panel-tag-row-board{
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:12px;
}

.panel-tag{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:8px 12px;
  border:1px solid rgba(146, 214, 255, 0.14);
  border-radius:999px;
  background:rgba(146, 214, 255, 0.08);
  color:#dff4ff;
  font-size:12px;
  font-weight:800;
}

.panel-tag-muted{
  border-color:rgba(241, 200, 116, 0.18);
  background:rgba(241, 200, 116, 0.08);
  color:var(--accent);
}

.panel-tag-active-clue{
  appearance:none;
  justify-content:flex-start;
  gap:10px;
  min-width:min(100%, 520px);
  max-width:100%;
  text-align:left;
  cursor:pointer;
  transition:transform .22s ease, border-color .22s ease, background .22s ease, box-shadow .22s ease;
}

.panel-tag-active-clue.is-refreshing{
  animation:surface-shift .42s ease;
}

.panel-tag-kicker-inline{
  display:inline-flex;
  align-items:center;
  margin:0;
  color:var(--accent-2);
  font-size:11px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
  flex:0 0 auto;
}

.panel-tag-value{
  margin:0;
  color:var(--text);
  font-size:13px;
  font-weight:800;
  min-width:0;
  line-height:1.35;
  flex:1 1 auto;
}

.active-collab-hint{
  margin:0 0 10px;
  padding-left:2px;
  color:var(--accent-2);
  font-size:12px;
  line-height:1.5;
  opacity:.88;
}

.live-conflict-hint{
  margin:-4px 0 12px;
  padding:8px 12px;
  border:1px solid rgba(241, 200, 116, 0.16);
  border-radius:14px;
  background:rgba(241, 200, 116, 0.08);
  color:#ffe7a7;
  font-size:12px;
  line-height:1.5;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.03);
}

.live-conflict-hint.is-refreshing{
  animation:surface-shift .42s ease;
}

.board-area{
  position:relative;
  display:flex;
  justify-content:center;
  flex:1 1 auto;
  min-height:0;
  padding:6px 0 0;
}

.board-stage{
  --grid-zoom:1;
  --grid-cell-size:calc(var(--cell-size) * var(--grid-zoom));
  display:flex;
  align-items:stretch;
  justify-content:center;
  gap:16px;
  flex:1 1 auto;
  min-height:0;
  width:100%;
  max-width:100%;
}

.board-side-stack{
  display:flex;
  flex:0 0 auto;
  width:0;
  min-width:0;
  flex-direction:column;
  align-items:stretch;
  gap:14px;
}

.board-side-stack.has-visible-panel{
  flex:0 0 290px;
  width:290px;
}

.board-zoom-controls{
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:4px 6px;
  transition:transform .2s ease, border-color .2s ease, background .2s ease, box-shadow .2s ease, opacity .2s ease;
}

.board-zoom-controls:hover,
.board-zoom-controls:focus-within,
.board-zoom-controls.is-engaged{
  border-color:rgba(241, 200, 116, 0.22);
}

.board-zoom-row{
  display:flex;
  align-items:center;
  gap:8px;
}

.seed-presence-summary{
  appearance:none;
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:30px;
  padding:0 10px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:999px;
  background:rgba(255,255,255,0.04);
  color:#dff4ff;
  cursor:pointer;
  transition:transform .14s ease, border-color .14s ease, background .14s ease, box-shadow .14s ease;
}

.seed-presence-summary:hover,
.seed-presence-summary:focus-visible{
  transform:translateY(-1px);
  border-color:rgba(146, 214, 255, 0.26);
  background:rgba(146, 214, 255, 0.08);
  box-shadow:0 12px 24px rgba(0,0,0,0.18);
}

.seed-presence-summary[hidden]{
  display:none;
}

.seed-presence-summary-dot{
  flex:0 0 auto;
  width:8px;
  height:8px;
  border-radius:999px;
  background:rgba(255,255,255,0.24);
  box-shadow:0 0 0 4px rgba(255,255,255,0.03);
}

.seed-presence-summary[data-state="online"] .seed-presence-summary-dot{
  background:#6bffb4;
  box-shadow:0 0 0 4px rgba(107,255,180,0.12), 0 0 14px rgba(107,255,180,0.24);
}

.seed-presence-summary[data-state="idle"] .seed-presence-summary-dot{
  background:rgba(255,255,255,0.26);
}

.seed-presence-summary-count{
  font-size:11px;
  font-weight:900;
  letter-spacing:.04em;
  white-space:nowrap;
}

.board-zoom-btn{
  width:30px;
  height:30px;
  padding:0;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:999px;
  background:linear-gradient(180deg, rgba(28, 47, 61, 0.72), rgba(11, 20, 28, 0.78));
  color:rgba(244, 239, 226, 0.82);
  font-size:16px;
  font-weight:900;
  line-height:1;
  cursor:pointer;
  touch-action:manipulation;
  user-select:none;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.05),
    0 8px 18px rgba(0,0,0,0.16);
  transition:transform .14s ease, border-color .14s ease, background .14s ease, box-shadow .14s ease;
}

.board-zoom-btn:hover:not(:disabled){
  transform:translateY(-1px);
  border-color:rgba(146, 214, 255, 0.26);
  background:linear-gradient(180deg, rgba(35, 58, 75, 0.98), rgba(12, 23, 31, 0.98));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    0 14px 26px rgba(0,0,0,0.24);
}

.board-zoom-btn.is-pressing{
  transform:translateY(0);
  border-color:rgba(241, 200, 116, 0.3);
  background:linear-gradient(180deg, rgba(44, 66, 83, 0.98), rgba(14, 24, 33, 0.98));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    0 8px 18px rgba(0,0,0,0.22);
}

.board-zoom-btn:disabled{
  opacity:.42;
  cursor:not-allowed;
  box-shadow:none;
}

.board-zoom-value{
  min-width:50px;
  min-height:30px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 6px;
  border:none;
  background:transparent;
  color:#dff4ff;
  font-size:11px;
  font-weight:900;
}

.seed-presence-panel,
.seed-leaderboard-panel{
  position:sticky;
  top:178px;
  display:flex;
  flex-direction:column;
  gap:12px;
  padding:16px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:22px;
  background:
    linear-gradient(180deg, rgba(16, 29, 40, 0.96), rgba(8, 17, 24, 0.98)),
    radial-gradient(circle at top right, rgba(241, 200, 116, 0.08), transparent 42%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.05),
    0 18px 32px rgba(0,0,0,0.22);
}

.seed-presence-panel[hidden],
.seed-leaderboard-panel[hidden]{
  display:none;
}

.seed-presence-panel{
  display:none !important;
}

.seed-leaderboard-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.seed-leaderboard-kicker{
  margin:0 0 6px;
  color:var(--accent);
  font-size:11px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.seed-leaderboard-title{
  margin:0;
  font-size:22px;
  line-height:1.04;
  letter-spacing:-0.02em;
}

.seed-leaderboard-pill{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:8px 12px;
  border:1px solid rgba(146, 214, 255, 0.18);
  border-radius:999px;
  background:rgba(146, 214, 255, 0.08);
  color:var(--accent-2);
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
}

.seed-leaderboard-note{
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.55;
}

.seed-leaderboard-list{
  display:grid;
  gap:10px;
  margin:0;
  padding:0;
  list-style:none;
}

.seed-leaderboard-empty{
  padding:14px;
  border:1px dashed rgba(255,255,255,0.1);
  border-radius:16px;
  color:var(--muted);
  font-size:13px;
  line-height:1.55;
  background:rgba(255,255,255,0.02);
}

.seed-presence-list{
  display:grid;
  gap:10px;
  margin:0;
  padding:0;
  list-style:none;
}

.seed-presence-item{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:12px 13px;
  border:1px solid rgba(255,255,255,0.07);
  border-radius:16px;
  background:rgba(255,255,255,0.03);
  transition:border-color .18s ease, background .18s ease, transform .18s ease;
}

.seed-presence-item.is-current{
  border-color:rgba(146, 214, 255, 0.2);
  background:
    linear-gradient(180deg, rgba(146, 214, 255, 0.08), rgba(255,255,255,0.02)),
    rgba(255,255,255,0.03);
}

.seed-presence-dot{
  flex:0 0 auto;
  width:12px;
  height:12px;
  margin-top:4px;
  border-radius:999px;
  box-shadow:0 0 0 4px rgba(255,255,255,0.03);
  background:rgba(255,255,255,0.22);
}

.seed-presence-dot[data-state="active"]{
  background:#6bffb4;
  box-shadow:0 0 0 4px rgba(107,255,180,0.12), 0 0 18px rgba(107,255,180,0.24);
}

.seed-presence-dot[data-state="recent"]{
  background:var(--accent);
  box-shadow:0 0 0 4px rgba(241, 200, 116, 0.12), 0 0 16px rgba(241, 200, 116, 0.18);
}

.seed-presence-dot[data-state="idle"],
.seed-presence-dot[data-state="unknown"]{
  background:rgba(255,255,255,0.24);
}

.seed-presence-main{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.seed-presence-head{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
}

.seed-presence-name{
  color:var(--text);
  font-size:14px;
  line-height:1.35;
}

.seed-presence-badge{
  display:inline-flex;
  align-items:center;
  min-height:22px;
  padding:2px 8px;
  border:1px solid rgba(241, 200, 116, 0.14);
  border-radius:999px;
  background:rgba(241, 200, 116, 0.08);
  color:#ffe5a1;
  font-size:10px;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.seed-presence-meta{
  color:var(--muted);
  font-size:12px;
  line-height:1.5;
}

.seed-presence-modal-dialog{
  width:min(100%, 720px);
}

.seed-presence-modal-body{
  display:grid;
  gap:16px;
}

.seed-presence-modal-topline{
  display:grid;
  gap:10px;
}

.seed-presence-modal-note{
  margin:0;
  color:var(--muted);
  font-size:14px;
  line-height:1.6;
}

.mobile-clue-card{
  display:none;
}

.mobileInput{
  position:fixed;
  bottom:-100vh;
  left:-100vw;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}

.mobile-toolbar{
  display:none;
}

.mobile-entry-list-toggle,
.mobile-entry-list-panel{
  display:none;
}

.mobile-tool-btn{
  flex:1 1 auto;
  min-width:0;
  padding:12px 10px;
  font-size:14px;
  white-space:nowrap;
}

.solution-subtitle{
  margin:0;
  color:var(--muted);
  max-width:54ch;
  font-size:14px;
  line-height:1.6;
}

.solution-badge-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:0 0 16px;
}

.solution-badge{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:8px 12px;
  border:1px solid rgba(241, 200, 116, 0.2);
  border-radius:999px;
  background:rgba(241, 200, 116, 0.08);
  color:var(--accent);
  font-size:12px;
  font-weight:800;
}

.solution-badge-muted{
  border-color:rgba(146, 214, 255, 0.16);
  background:rgba(146, 214, 255, 0.08);
  color:var(--accent-2);
}

.solutionPhrase{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-start;
  gap:12px 14px;
}

.solution-phrase-shell{
  padding:18px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:24px;
  background:
    linear-gradient(180deg, rgba(8, 16, 22, 0.62), rgba(16, 28, 38, 0.44)),
    radial-gradient(circle at top, rgba(241, 200, 116, 0.06), transparent 42%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.04);
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
  touch-action:pan-x pan-y pinch-zoom;
}

.grid-shell,
.solution-phrase-shell,
.seed-lobby-chat-list,
.seed-lobby-participant-list{
  scrollbar-width:thin;
  scrollbar-color:rgba(193, 139, 255, 0.62) rgba(255,255,255,0.07);
}

.grid-shell::-webkit-scrollbar,
.solution-phrase-shell::-webkit-scrollbar,
.seed-lobby-chat-list::-webkit-scrollbar,
.seed-lobby-participant-list::-webkit-scrollbar{
  width:12px;
  height:12px;
}

.grid-shell::-webkit-scrollbar-track,
.solution-phrase-shell::-webkit-scrollbar-track,
.seed-lobby-chat-list::-webkit-scrollbar-track,
.seed-lobby-participant-list::-webkit-scrollbar-track{
  background:rgba(255,255,255,0.06);
  border-radius:999px;
}

.grid-shell::-webkit-scrollbar-thumb,
.solution-phrase-shell::-webkit-scrollbar-thumb,
.seed-lobby-chat-list::-webkit-scrollbar-thumb,
.seed-lobby-participant-list::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg, rgba(193, 139, 255, 0.92), rgba(146, 214, 255, 0.84));
  border:2px solid rgba(7, 16, 24, 0.48);
  border-radius:999px;
}

.grid-shell::-webkit-scrollbar-thumb:hover,
.solution-phrase-shell::-webkit-scrollbar-thumb:hover,
.seed-lobby-chat-list::-webkit-scrollbar-thumb:hover,
.seed-lobby-participant-list::-webkit-scrollbar-thumb:hover{
  background:linear-gradient(180deg, rgba(209, 160, 255, 0.96), rgba(162, 225, 255, 0.88));
}

.solution-panel.is-compact .solutionPhrase{
  flex-wrap:wrap;
  gap:10px 12px;
}

.solution-panel.is-compact .solutionWord{
  flex-direction:row;
  align-items:flex-start;
  width:auto;
  padding:8px 9px;
  gap:6px;
}

.solution-panel.is-compact .solution-phrase-shell{
  padding:12px;
}

.solution-panel.is-compact .solutionSlot{
  width:48px;
  height:48px;
  border-radius:14px;
}

.solution-panel.is-compact .solutionSlotValue{
  font-size:19px;
}

.solution-panel.is-compact .solutionSlot.is-thinking .solutionSlotValue{
  font-size:13px;
}

.solution-panel.is-compact .solutionSlot.is-two .solutionSlotValue{
  font-size:11px;
}

.solution-panel.is-compact .solutionSlot.is-many .solutionSlotValue{
  font-size:10px;
}

.solution-panel.is-ultra-compact .solution-phrase-shell{
  padding:10px 8px;
}

.solution-panel.is-ultra-compact .solutionWord{
  padding:7px 7px;
  gap:5px;
  border-radius:16px;
  flex-direction:row;
  align-items:flex-start;
}

.solution-panel.is-ultra-compact .solutionSlot{
  width:40px;
  height:40px;
  padding:6px 4px 4px;
  border-radius:12px;
}

.solution-panel.is-ultra-compact .solutionSlotNumber{
  top:3px;
  right:4px;
  font-size:8px;
}

.solution-panel.is-ultra-compact .solutionSlotValue{
  font-size:16px;
}

.solution-panel.is-ultra-compact .solutionSlot.is-thinking .solutionSlotValue{
  font-size:11px;
}

.solution-panel.is-ultra-compact .solutionSlot.is-two .solutionSlotValue{
  font-size:10px;
}

.solution-panel.is-ultra-compact .solutionSlot.is-many .solutionSlotValue{
  font-size:9px;
  row-gap:1px;
}

.finish-modal{
  position:fixed;
  inset:0;
  z-index:80;
  display:grid;
  place-items:start center;
  padding:28px 18px;
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-y;
}

.finish-modal[hidden]{
  display:none;
}

.finish-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(4, 8, 12, 0.68);
  backdrop-filter:blur(12px);
}

.builder-modal{
  position:fixed;
  inset:0;
  z-index:85;
  display:grid;
  place-items:center;
  padding:28px 18px;
}

.builder-modal[hidden]{
  display:none;
}

.builder-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(4, 8, 12, 0.76);
  backdrop-filter:blur(12px);
}

.builder-modal-dialog{
  position:relative;
  width:min(100%, 1100px);
  max-height:min(92vh, 940px);
  overflow:auto;
  padding:24px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:30px;
  background:
    radial-gradient(circle at top right, rgba(241, 200, 116, 0.11), transparent 30%),
    radial-gradient(circle at top left, rgba(146, 214, 255, 0.1), transparent 32%),
    linear-gradient(180deg, rgba(14, 26, 35, 0.98), rgba(8, 16, 22, 0.99));
  box-shadow:0 36px 90px rgba(0,0,0,0.42);
}

body.is-builder-page .builder-modal{
  position:relative;
  inset:auto;
  z-index:auto;
  display:block;
  padding:0;
  margin:0;
}

body.is-builder-page .builder-modal-backdrop{
  display:none;
}

body.is-builder-page .builder-modal-dialog{
  width:100%;
  max-height:none;
  overflow:visible;
  padding:26px;
  margin:0 auto;
}

.builder-modal-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:18px;
}

.builder-modal-kicker{
  margin:0 0 8px;
  color:var(--accent);
  font-size:11px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.builder-modal-title{
  margin:0;
  font-family:"Baskerville", "Palatino Linotype", "Book Antiqua", serif;
  font-size:clamp(28px, 3vw, 40px);
  line-height:1;
  letter-spacing:-0.03em;
}

.builder-modal-close{
  flex:0 0 auto;
}

.builder-modal-body{
  display:grid;
  grid-template-columns:minmax(0, 1.35fr) minmax(280px, .82fr);
  gap:18px;
}

.builder-modal-body-stacked{
  grid-template-columns:minmax(0, 1fr);
}

.builder-card{
  display:flex;
  flex-direction:column;
  gap:14px;
  min-width:0;
  padding:20px;
  border:1px solid rgba(255,255,255,0.07);
  border-radius:24px;
  background:
    linear-gradient(180deg, rgba(20, 35, 46, 0.9), rgba(9, 18, 25, 0.96)),
    linear-gradient(145deg, rgba(255,255,255,0.03), transparent 50%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.05);
}

.builder-card-side{
  justify-content:flex-start;
}

.builder-card-settings{
  gap:16px;
}

.builder-field{
  display:flex;
  flex-direction:column;
  gap:8px;
  min-width:0;
}

.builder-quick-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.builder-mini-btn{
  min-height:38px;
  padding:8px 12px;
  font-size:13px;
  border-color:rgba(255,255,255,0.09);
  background:rgba(8, 16, 22, 0.74);
  color:#eef8ff;
}

.builder-mini-btn:hover,
.builder-mini-btn:focus-visible{
  background:rgba(146, 214, 255, 0.14);
  color:#fffaf1;
}

.builder-mini-btn-icon{
  min-width:42px;
  padding-inline:0;
  font-size:18px;
}

.builder-file-btn{
  cursor:pointer;
}

.builder-file-input{
  display:none;
}

.builder-subcard{
  padding:16px 18px;
  border-radius:20px;
  background:rgba(255,255,255,0.03);
}

.builder-range-row{
  display:flex;
  align-items:center;
  gap:14px;
}

.builder-inline-settings{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}

.builder-inline-field{
  min-width:0;
}

.builder-number-input{
  width:100%;
  min-height:46px;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:16px;
  background:rgba(8, 16, 22, 0.7);
  color:var(--text);
  font:inherit;
}

.builder-text-input{
  resize:none;
}

.builder-number-input:focus{
  outline:none;
  border-color:rgba(146, 214, 255, 0.42);
  box-shadow:0 0 0 3px rgba(146, 214, 255, 0.12);
}

.builder-range{
  flex:1 1 auto;
  width:100%;
  accent-color:var(--accent);
}

.builder-range-value{
  min-width:58px;
  color:#fff4cf;
  font-size:18px;
  font-weight:900;
  text-align:right;
}

.builder-label{
  padding-inline-start:6px;
  color:#e8f6ff;
  font-size:14px;
  font-weight:800;
}

.builder-help{
  color:var(--muted);
  font-size:13px;
  line-height:1.5;
}

.builder-help code{
  padding:2px 6px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:8px;
  background:rgba(255,255,255,0.04);
  color:#dff4ff;
  font-family:"SFMono-Regular", "Consolas", monospace;
  font-size:12px;
}

.builder-draft-meta{
  margin:10px 0 0;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,0.07);
  border-radius:16px;
  background:rgba(255,255,255,0.03);
}

.builder-textarea{
  width:100%;
  min-height:120px;
  resize:vertical;
  padding:14px 16px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:18px;
  background:rgba(8, 16, 22, 0.7);
  color:var(--text);
  font:inherit;
  line-height:1.55;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.03);
}

.builder-textarea:focus{
  outline:none;
  border-color:rgba(146, 214, 255, 0.42);
  box-shadow:0 0 0 3px rgba(146, 214, 255, 0.12), inset 0 1px 0 rgba(255,255,255,0.03);
}

.builder-textarea:disabled{
  opacity:.55;
  cursor:not-allowed;
}

.builder-textarea-pool{
  min-height:360px;
}

.builder-textarea-sentence{
  min-height:88px;
  resize:none;
}

.builder-sentence-field[data-has-sentence="true"] .builder-textarea-sentence{
  border-color:rgba(241, 200, 116, 0.24);
  box-shadow:0 0 0 3px rgba(241, 200, 116, 0.08), inset 0 1px 0 rgba(255,255,255,0.03);
}

.builder-toggle{
  display:flex;
  align-items:center;
  gap:12px;
  min-height:46px;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:18px;
  background:rgba(255,255,255,0.03);
  color:#e8f6ff;
  font-size:14px;
  font-weight:800;
}

.builder-toggle input{
  width:18px;
  height:18px;
  accent-color:var(--accent);
}

.builder-preview-block{
  display:grid;
  gap:8px;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:18px;
  background:rgba(255,255,255,0.03);
}

.builder-preview-block-button{
  width:100%;
  text-align:left;
  cursor:pointer;
  font:inherit;
  color:inherit;
}

.builder-preview-block-button:hover,
.builder-preview-block-button:focus-visible{
  border-color:rgba(146, 214, 255, 0.24);
  background:rgba(146, 214, 255, 0.07);
}

.builder-preview-block.is-good{
  border-color:rgba(90, 210, 141, 0.24);
  background:rgba(90, 210, 141, 0.08);
}

.builder-preview-block.is-warn{
  border-color:rgba(241, 200, 116, 0.26);
  background:rgba(241, 200, 116, 0.08);
}

.builder-preview-block.is-info{
  border-color:rgba(146, 214, 255, 0.26);
  background:rgba(146, 214, 255, 0.08);
}

.builder-preview-block.is-bad{
  border-color:rgba(255, 112, 112, 0.28);
  background:rgba(255, 112, 112, 0.08);
}

.builder-preview-title{
  color:#e8f6ff;
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.builder-preview-inline{
  color:var(--text);
  font-size:13px;
  line-height:1.5;
}

.builder-preview-list{
  margin:0;
  padding-left:18px;
  color:var(--muted);
  font-size:13px;
  line-height:1.5;
}

.builder-entry-preview-list{
  display:grid;
  gap:8px;
}

.builder-entry-preview{
  display:grid;
  gap:6px;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:14px;
  background:rgba(7, 16, 22, 0.45);
}

.builder-entry-answer{
  display:inline-flex;
  align-items:center;
  width:max-content;
  max-width:100%;
  padding:4px 8px;
  border:1px solid rgba(241, 200, 116, 0.18);
  border-radius:999px;
  background:rgba(241, 200, 116, 0.08);
  color:var(--accent);
  font-size:12px;
  font-weight:900;
  letter-spacing:.04em;
}

.builder-entry-clue{
  color:var(--text);
  font-size:13px;
  line-height:1.45;
}

.builder-page-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:14px;
}

.builder-list-toolbar{
  display:grid;
  grid-template-columns:minmax(0, 1.1fr) auto;
  gap:14px;
  align-items:end;
  margin-bottom:14px;
}

.builder-list-search{
  margin:0;
}

.builder-list-filters{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:8px;
}

.builder-list-filters .builder-mini-btn.is-active{
  border-color:rgba(146, 214, 255, 0.26);
  background:rgba(146, 214, 255, 0.12);
  color:#fff9ef;
}

.builder-list-summary{
  margin:0 0 14px;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,0.07);
  border-radius:16px;
  background:rgba(255,255,255,0.03);
  color:#dcecf7;
  font-size:13px;
  line-height:1.55;
}

.builder-preview-more{
  justify-self:start;
  min-height:34px;
  padding:6px 12px;
  border-radius:999px;
  font-size:12px;
}

.builder-duplicates{
  display:grid;
  gap:10px;
}

.builder-duplicates:empty{
  display:none;
}

.builder-duplicate-list{
  display:grid;
  gap:8px;
}

.builder-duplicate-item{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:14px;
  background:rgba(7, 16, 22, 0.45);
}

.builder-duplicate-copy{
  display:grid;
  gap:6px;
  min-width:0;
}

.builder-trash-btn{
  position:relative;
  min-width:40px;
  min-height:40px;
  opacity:.14;
  transition:opacity .18s ease, transform .18s ease, border-color .18s ease;
}

.builder-trash-btn::before{
  content:"\1F5D1";
  display:block;
  font-size:18px;
  line-height:1;
}

.builder-duplicate-item:hover .builder-trash-btn,
.builder-duplicate-item:focus-within .builder-trash-btn{
  opacity:1;
  transform:translateY(-1px);
}

.builder-trash-btn:hover,
.builder-trash-btn:focus-visible{
  border-color:rgba(255,112,112,0.28);
  color:#ffd6d6;
}

.builder-entries-view{
  display:grid;
  gap:14px;
  margin-top:18px;
  padding:20px;
  border:1px solid rgba(255,255,255,0.07);
  border-radius:24px;
  background:
    linear-gradient(180deg, rgba(20, 35, 46, 0.9), rgba(9, 18, 25, 0.96)),
    linear-gradient(145deg, rgba(255,255,255,0.03), transparent 50%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.05);
}

.builder-entries-view[hidden]{
  display:none;
}

.builder-entries-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.builder-entries-view-list{
  display:grid;
  gap:10px;
}

.builder-entry-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:16px;
  background:rgba(7, 16, 22, 0.45);
}

.builder-entry-row-sentence{
  margin-bottom:10px;
  border-color:rgba(241, 200, 116, 0.3);
  background:
    linear-gradient(180deg, rgba(44, 31, 8, 0.9), rgba(24, 18, 9, 0.95)),
    linear-gradient(135deg, rgba(241, 200, 116, 0.18), transparent 48%);
  box-shadow:0 18px 34px rgba(8, 7, 2, 0.18);
}

.builder-entry-row-copy{
  display:grid;
  gap:6px;
  min-width:0;
}

.builder-entry-inline-note{
  color:var(--muted);
  font-size:12px;
  line-height:1.45;
}

.builder-entry-row-actions{
  display:flex;
  align-items:center;
  gap:8px;
  opacity:.96;
  transform:none;
  transition:opacity .18s ease, transform .18s ease;
}

.builder-entry-row:hover .builder-entry-row-actions,
.builder-entry-row:focus-within .builder-entry-row-actions{
  opacity:1;
  transform:translateY(0);
}

.builder-entry-action{
  position:relative;
  min-width:40px;
  min-height:40px;
  border-color:rgba(255,255,255,0.09);
  background:rgba(8, 16, 22, 0.8);
  color:#eef8ff;
}

.builder-entry-action:hover,
.builder-entry-action:focus-visible{
  background:rgba(146, 214, 255, 0.14);
  color:#fffaf1;
}

.builder-entry-action::before{
  display:block;
  font-size:18px;
  line-height:1;
}

.builder-entry-action-edit::before{
  content:"\270E";
}

.builder-entry-action-delete::before{
  content:"\1F5D1";
}

.builder-entry-action-hint::before{
  content:"\1F4A1";
}

.builder-entry-action-hint.is-active{
  border-color:rgba(146, 214, 255, 0.22);
  color:#dff4ff;
}

.builder-entry-action-favorite::before{
  content:"\2606";
}

.builder-entry-action-favorite.is-active{
  border-color:rgba(241, 200, 116, 0.22);
  color:#fff0b7;
}

.builder-entry-action-favorite.is-active::before{
  content:"\2605";
}

.builder-status{
  min-height:0;
  margin:0;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:18px;
  background:rgba(255,255,255,0.03);
  color:var(--muted);
  font-size:13px;
  line-height:1.5;
  white-space:pre-line;
}

.builder-status[hidden]{
  display:none;
}

.builder-entry-question{
  color:#fffaf1;
  font-size:16px;
  font-weight:900;
  line-height:1.35;
}

.builder-entry-answer-plain{
  color:#dff4ff;
  font-size:13px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.builder-entry-sentence-label{
  color:#ffd98a;
  font-size:12px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.builder-entry-sentence-value{
  color:#fff7d9;
  font-size:24px;
  font-weight:900;
  line-height:1.15;
  text-wrap:balance;
}

.builder-status.good{
  border-color:rgba(90, 210, 141, 0.26);
  background:rgba(90, 210, 141, 0.09);
  color:#dff9ea;
}

.builder-status.bad{
  border-color:rgba(255, 112, 112, 0.28);
  background:rgba(255, 112, 112, 0.08);
  color:#ffdada;
}

.builder-status.info,
.builder-status.neutral{
  border-color:rgba(146, 214, 255, 0.24);
  background:rgba(146, 214, 255, 0.08);
  color:#dff4ff;
}

.creator-hint-inline{
  margin:0;
  padding:10px 14px;
  border:1px solid rgba(146, 214, 255, 0.18);
  border-radius:16px;
  background:rgba(146, 214, 255, 0.08);
  color:#dff4ff;
  font-size:13px;
  line-height:1.55;
}

.creator-hint-modal-body{
  gap:12px;
}

.creator-hint-modal-clue{
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.5;
}

.creator-hint-modal-hint{
  margin:0;
  padding:14px 16px;
  border:1px solid rgba(146, 214, 255, 0.18);
  border-radius:18px;
  background:rgba(146, 214, 255, 0.08);
  color:var(--text);
  font-size:14px;
  line-height:1.6;
  white-space:pre-line;
}

.creator-hint-modal-meta{
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.55;
}

.builder-modal-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
  margin-top:18px;
}

.interrupt-modal-dialog{
  width:min(100%, 840px);
}

.interrupt-modal-body{
  grid-template-columns:minmax(0, 1.08fr) minmax(240px, 0.72fr);
  align-items:start;
}

.interrupt-modal-card{
  display:grid;
  gap:16px;
}

.interrupt-modal-head{
  display:grid;
  gap:10px;
}

.interrupt-modal-grid{
  display:grid;
  gap:14px;
}

.interrupt-modal-side{
  align-content:start;
}

.interrupt-inline-note{
  display:block;
}

.interrupt-password-summary{
  display:grid;
  gap:10px;
  padding:14px 16px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:18px;
  background:rgba(255,255,255,0.03);
}

.interrupt-password-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.interrupt-password-row{
  display:grid;
  gap:8px;
}

.interrupt-password-value{
  font-size:1.05rem;
  letter-spacing:0.14em;
  color:#fff4cf;
}

.interrupt-password-hint{
  color:var(--muted);
  font-size:13px;
  line-height:1.5;
}

.interrupt-password-toggle{
  min-height:36px;
  padding:8px 12px;
}

.interrupt-modal-actions{
  align-items:center;
}

.seed-share-actions{
  display:grid;
  gap:10px;
}

.seed-join-modal-dialog{
  max-width:780px;
}

.seed-share-side{
  align-content:start;
  gap:16px;
}

.seed-share-mode-row{
  margin:0;
  padding:14px 16px;
  border-radius:20px;
}

.seed-share-mode-toggle{
  min-width:60px;
}

.seed-share-copy-btn{
  width:100%;
}

.seed-entry-card.is-suggested{
  border-color:rgba(146, 214, 255, 0.24);
  box-shadow:0 16px 32px rgba(0, 0, 0, 0.14), inset 0 0 0 1px rgba(146, 214, 255, 0.14);
}

.interrupt-modal-actions .builder-status{
  flex:1 1 260px;
  margin-right:auto;
}

.finish-modal-dialog{
  position:relative;
  width:min(100%, 1040px);
  max-height:min(92vh, 920px);
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-y;
  padding:24px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:30px;
  background:
    radial-gradient(circle at top right, rgba(241, 200, 116, 0.11), transparent 28%),
    radial-gradient(circle at top left, rgba(146, 214, 255, 0.09), transparent 34%),
    linear-gradient(180deg, rgba(14, 26, 35, 0.97), rgba(8, 16, 22, 0.99));
  box-shadow:0 36px 90px rgba(0,0,0,0.38);
  transform:translateY(12px) scale(.985);
  opacity:0;
  animation:finish-modal-in .34s ease forwards;
}

.finish-modal-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:18px;
}

.finish-modal-kicker,
.finish-leaderboard-kicker{
  margin:0 0 8px;
  color:var(--accent);
  font-size:11px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.finish-modal-title,
.finish-leaderboard-title{
  margin:0;
  font-family:"Baskerville", "Palatino Linotype", "Book Antiqua", serif;
  font-size:clamp(28px, 3vw, 40px);
  line-height:1;
  letter-spacing:-0.03em;
}

.finish-modal-close{
  flex:0 0 auto;
}

.finish-modal-body{
  display:grid;
  grid-template-columns:minmax(0, 1.25fr) minmax(280px, .8fr);
  gap:18px;
  margin-bottom:18px;
}

.finish-summary-card,
.finish-meme-card,
.finish-leaderboard{
  border:1px solid rgba(255,255,255,0.07);
  border-radius:24px;
  background:
    linear-gradient(180deg, rgba(20, 35, 46, 0.9), rgba(9, 18, 25, 0.96)),
    linear-gradient(145deg, rgba(255,255,255,0.03), transparent 50%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.05);
}

.finish-summary-card,
.finish-meme-card{
  align-self:start;
}

.finish-summary-card{
  padding:20px;
}

.finish-score-topline{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom:16px;
}

.finish-percent-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:84px;
  min-height:42px;
  padding:8px 14px;
  border:1px solid rgba(241, 200, 116, 0.2);
  border-radius:999px;
  background:rgba(241, 200, 116, 0.08);
  color:var(--accent);
  font-size:18px;
  font-weight:900;
}

.finish-score-label{
  color:var(--muted);
  font-size:15px;
  font-weight:800;
}

.finish-progress-shell{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:center;
  gap:14px;
  margin-bottom:18px;
}

.finish-progress-track{
  position:relative;
  height:18px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:999px;
  background:rgba(255,255,255,0.05);
}

.finish-progress-bar{
  position:absolute;
  inset:0 auto 0 0;
  width:0%;
  border-radius:999px;
  background:
    linear-gradient(90deg, #f1c874, #92d6ff 68%, #9ef7b8);
  box-shadow:0 0 24px rgba(146, 214, 255, 0.24);
}

.finish-progress-value{
  min-width:58px;
  color:var(--text);
  font-size:18px;
  font-weight:900;
  text-align:right;
}

.finish-stats-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}

.finish-stat-card{
  display:flex;
  flex-direction:column;
  gap:6px;
  min-height:92px;
  padding:14px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:18px;
  background:rgba(255,255,255,0.03);
}

.finish-stat-card-accent{
  border-color:rgba(241, 200, 116, 0.16);
  background:rgba(241, 200, 116, 0.08);
}

.finish-stat-label{
  color:var(--muted);
  font-size:12px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.finish-stat-value{
  color:var(--text);
  font-size:24px;
  font-weight:900;
  line-height:1.08;
}

.finish-meme-card{
  display:flex;
  flex-direction:column;
  gap:12px;
  justify-content:flex-end;
  min-height:100%;
  padding:20px;
  background:
    radial-gradient(circle at top right, rgba(241, 200, 116, 0.14), transparent 34%),
    linear-gradient(180deg, rgba(28, 40, 52, 0.92), rgba(10, 19, 27, 0.97));
}

.finish-meme-card[data-tone="zero"]{
  background:
    radial-gradient(circle at top right, rgba(255, 112, 112, 0.16), transparent 32%),
    linear-gradient(180deg, rgba(49, 30, 35, 0.94), rgba(18, 11, 15, 0.98));
}

.finish-meme-card[data-tone="low"]{
  background:
    radial-gradient(circle at top right, rgba(255, 173, 102, 0.14), transparent 32%),
    linear-gradient(180deg, rgba(46, 36, 28, 0.94), rgba(18, 14, 11, 0.98));
}

.finish-meme-card[data-tone="mid"]{
  background:
    radial-gradient(circle at top right, rgba(146, 214, 255, 0.14), transparent 34%),
    linear-gradient(180deg, rgba(28, 40, 52, 0.92), rgba(10, 19, 27, 0.97));
}

.finish-meme-card[data-tone="high"]{
  background:
    radial-gradient(circle at top right, rgba(146, 214, 255, 0.14), transparent 34%),
    linear-gradient(180deg, rgba(21, 43, 56, 0.94), rgba(8, 18, 25, 0.98));
}

.finish-meme-card[data-tone="perfect"]{
  background:
    radial-gradient(circle at top right, rgba(241, 200, 116, 0.18), transparent 34%),
    radial-gradient(circle at bottom left, rgba(158, 247, 184, 0.12), transparent 28%),
    linear-gradient(180deg, rgba(36, 46, 33, 0.94), rgba(12, 19, 14, 0.98));
}

.finish-meme-tier{
  margin:0;
  color:var(--accent-2);
  font-size:12px;
  font-weight:900;
  letter-spacing:.18em;
  text-transform:uppercase;
}

.finish-meme-media-shell{
  overflow:hidden;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:18px;
  background:rgba(255,255,255,0.04);
  aspect-ratio:16 / 10;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.05);
}

.finish-meme-image,
.finish-meme-video{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

.finish-meme-title{
  margin:0;
  font-family:"Baskerville", "Palatino Linotype", "Book Antiqua", serif;
  font-size:clamp(28px, 3vw, 40px);
  line-height:.96;
  letter-spacing:-0.03em;
}

.finish-meme-text{
  margin:0;
  color:var(--muted);
  font-size:15px;
  line-height:1.65;
}

.finish-meme-reaction{
  margin:4px 0 0;
  padding-top:12px;
  border-top:1px solid rgba(255,255,255,0.08);
  color:var(--text);
  font-size:15px;
  line-height:1.6;
  font-weight:700;
}

.finish-leaderboard{
  padding:20px;
}

.resolution-shell .finish-leaderboard{
  position:relative;
  overflow:hidden;
  padding:22px;
  border:1px solid rgba(255,255,255,0.08);
  background:
    radial-gradient(circle at top right, rgba(241, 200, 116, 0.12), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,0.035), rgba(255,255,255,0.018));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.05),
    0 20px 44px rgba(0,0,0,0.18);
}

.resolution-shell .finish-leaderboard::before{
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  height:1px;
  background:linear-gradient(90deg, rgba(241, 200, 116, 0.7), rgba(146, 214, 255, 0.12));
  pointer-events:none;
}

.finish-leaderboard-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  margin-bottom:12px;
}

.finish-seed-pill{
  display:inline-flex;
  align-items:center;
  min-height:36px;
  padding:8px 12px;
  border:1px solid rgba(146, 214, 255, 0.18);
  border-radius:999px;
  background:rgba(146, 214, 255, 0.08);
  color:var(--accent-2);
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
}

.finish-leaderboard-note{
  margin:0 0 14px;
  color:var(--muted);
  font-size:14px;
  line-height:1.55;
}

.finish-leaderboard-list{
  display:grid;
  gap:10px;
  margin:0;
  padding:0;
  list-style:none;
}

.finish-leaderboard-item{
  display:grid;
  grid-template-columns:auto minmax(0, 1fr) auto;
  gap:12px;
  align-items:center;
  padding:14px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:18px;
  background:rgba(255,255,255,0.03);
}

.resolution-shell .finish-leaderboard-item{
  padding:16px 18px;
  border-color:rgba(255,255,255,0.08);
  background:
    linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.02)),
    radial-gradient(circle at top left, rgba(255,255,255,0.04), transparent 44%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.04);
}

.finish-leaderboard-item.is-current{
  border-color:rgba(241, 200, 116, 0.2);
  background:rgba(241, 200, 116, 0.08);
}

.resolution-shell .finish-leaderboard-item.is-current{
  border-color:rgba(241, 200, 116, 0.36);
  background:
    linear-gradient(180deg, rgba(241, 200, 116, 0.18), rgba(241, 200, 116, 0.08)),
    radial-gradient(circle at top left, rgba(241, 200, 116, 0.18), transparent 44%);
}

.finish-leaderboard-rank{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border-radius:999px;
  background:rgba(255,255,255,0.05);
  color:var(--text);
  font-size:14px;
  font-weight:900;
}

.resolution-shell .finish-leaderboard-rank{
  width:46px;
  height:46px;
  border:1px solid rgba(255,255,255,0.1);
  background:linear-gradient(180deg, rgba(255,255,255,0.09), rgba(255,255,255,0.04));
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.04);
  font-size:15px;
}

.resolution-shell .finish-leaderboard-rank[data-rank="1"]{
  border-color:rgba(255, 209, 102, 0.4);
  background:linear-gradient(180deg, rgba(255, 209, 102, 0.35), rgba(255, 185, 77, 0.16));
  color:#fff1c9;
}

.resolution-shell .finish-leaderboard-rank[data-rank="2"]{
  border-color:rgba(198, 210, 221, 0.4);
  background:linear-gradient(180deg, rgba(198, 210, 221, 0.34), rgba(164, 177, 189, 0.16));
  color:#f1f7fd;
}

.resolution-shell .finish-leaderboard-rank[data-rank="3"]{
  border-color:rgba(210, 152, 104, 0.42);
  background:linear-gradient(180deg, rgba(210, 152, 104, 0.34), rgba(170, 108, 68, 0.16));
  color:#ffe8d8;
}

.finish-leaderboard-main{
  min-width:0;
}

.finish-leaderboard-name{
  display:block;
  color:var(--text);
  font-size:15px;
  font-weight:900;
}

.finish-leaderboard-time{
  display:block;
  color:var(--text);
  font-size:18px;
  font-weight:900;
  text-align:right;
  white-space:nowrap;
}

.resolution-shell .finish-leaderboard-time{
  min-width:92px;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:14px;
  background:rgba(7, 15, 22, 0.38);
}

.finish-leaderboard-meta{
  display:block;
  margin-top:4px;
  color:var(--muted);
  font-size:13px;
  line-height:1.45;
}

.resolution-leaderboard-copy-row{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin-top:16px;
}

.finish-leaderboard-badge{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:7px 10px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:999px;
  background:rgba(255,255,255,0.04);
  color:var(--muted);
  font-size:12px;
  font-weight:800;
}

.finish-leaderboard-empty{
  padding:18px;
  border:1px dashed rgba(255,255,255,0.12);
  border-radius:18px;
  color:var(--muted);
  font-size:14px;
  line-height:1.6;
  text-align:center;
}

.resolution-slang-section{
  gap:18px;
}

.resolution-slang-insight{
  margin:0;
  color:var(--text);
  font-size:15px;
  line-height:1.6;
}

.resolution-slang-cards{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:14px;
}

.resolution-slang-card{
  display:grid;
  gap:8px;
}

.resolution-slang-card-label{
  color:var(--muted);
  font-size:11px;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.resolution-slang-card-value{
  color:var(--text);
  font-size:22px;
  font-weight:900;
  line-height:1.1;
}

.resolution-slang-card-text{
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.55;
}

.resolution-slang-list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:12px;
}

.resolution-slang-item{
  padding:14px 16px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:18px;
  background:rgba(255,255,255,0.03);
  display:grid;
  gap:10px;
}

.resolution-slang-item-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.resolution-slang-item-label{
  color:var(--text);
  font-size:15px;
  font-weight:800;
}

.resolution-slang-item-meta{
  color:var(--muted);
  font-size:12px;
  font-weight:700;
  text-align:right;
}

.resolution-slang-track{
  position:relative;
  overflow:hidden;
  height:10px;
  border-radius:999px;
  background:rgba(255,255,255,0.06);
}

.resolution-slang-track-fill{
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg, rgba(241, 200, 116, 0.55), rgba(146, 214, 255, 0.92));
}

.resolution-slang-item-share{
  margin:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.55;
}

.solutionWord{
  display:flex;
  gap:8px;
  align-items:flex-start;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,0.05);
  border-radius:20px;
  background:
    linear-gradient(180deg, rgba(17, 31, 41, 0.7), rgba(9, 17, 23, 0.34)),
    radial-gradient(circle at top left, rgba(255,255,255,0.03), transparent 42%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.04);
  transition:transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}

.solutionWord.is-segment-active{
  border-color:rgba(241, 200, 116, 0.18);
  background:
    linear-gradient(180deg, rgba(40, 53, 31, 0.14), rgba(16, 25, 33, 0.72)),
    radial-gradient(circle at top left, rgba(241, 200, 116, 0.08), transparent 42%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.04),
    0 12px 24px rgba(0,0,0,0.16);
}

.solutionWord.is-sentence-active{
  border-color:rgba(241, 200, 116, 0.16);
  background:
    linear-gradient(180deg, rgba(56, 47, 19, 0.08), rgba(9, 17, 23, 0.34)),
    radial-gradient(circle at top left, rgba(241, 200, 116, 0.05), transparent 42%);
}

.solutionWord.is-thinking-across{
  border-color:rgba(146, 214, 255, 0.16);
  background:
    linear-gradient(180deg, rgba(22, 40, 52, 0.84), rgba(10, 18, 24, 0.36)),
    radial-gradient(circle at top left, rgba(146, 214, 255, 0.08), transparent 42%);
}

.solutionWord.is-thinking-down{
  border-color:rgba(255, 156, 197, 0.16);
  background:
    linear-gradient(180deg, rgba(43, 26, 35, 0.84), rgba(14, 11, 16, 0.4)),
    radial-gradient(circle at top left, rgba(255, 156, 197, 0.08), transparent 42%);
}

.solutionSlot{
  position:relative;
  display:grid;
  place-items:center;
  width:56px;
  height:56px;
  padding:8px 6px 6px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:16px;
  background:linear-gradient(180deg, rgba(21, 36, 47, 0.98), rgba(10, 18, 24, 0.98));
  color:var(--text);
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    0 10px 22px rgba(0,0,0,0.2);
  transition:transform .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease, outline-color .16s ease;
}

.solutionSlot:hover{
  transform:translateY(-1px);
  border-color:rgba(146, 214, 255, 0.22);
}

.solutionSlot.remote-presence-slot{
  border-color:var(--presence-border, rgba(146, 214, 255, 0.24));
  background:
    linear-gradient(180deg, rgba(255,255,255,0.015), rgba(10, 18, 24, 0.98)),
    linear-gradient(180deg, rgba(21, 36, 47, 0.98), rgba(10, 18, 24, 0.98));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 0 0 2px var(--presence-glow, rgba(146, 214, 255, 0.06)),
    0 16px 28px rgba(0,0,0,0.24);
}

.solutionSlot.remote-presence-slot.is-multi{
  background:
    linear-gradient(135deg, rgba(255,255,255,0.015) 0%, rgba(255,255,255,0.015) 47%, rgba(255,255,255,0.03) 53%, rgba(255,255,255,0.03) 100%),
    linear-gradient(180deg, rgba(21, 36, 47, 0.98), rgba(10, 18, 24, 0.98));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 0 0 2px var(--presence-glow, rgba(146, 214, 255, 0.06)),
    0 0 0 4px var(--presence-glow-secondary, rgba(255, 156, 197, 0.04)),
    0 16px 28px rgba(0,0,0,0.24);
}

.solutionSlot.is-active{
  outline:3px solid var(--accent);
  outline-offset:2px;
  border-color:rgba(241, 200, 116, 0.72);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.1),
    0 0 0 6px rgba(241, 200, 116, 0.14),
    0 20px 32px rgba(0,0,0,0.28);
}

.solutionSlot.is-word-active{
  border-color:rgba(241, 200, 116, 0.34);
  background:
    linear-gradient(180deg, rgba(56, 47, 19, 0.12), rgba(10, 18, 24, 0.98)),
    linear-gradient(180deg, rgba(21, 36, 47, 0.98), rgba(10, 18, 24, 0.98));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 0 0 3px rgba(241, 200, 116, 0.08),
    0 16px 28px rgba(0,0,0,0.24);
}

.solutionSlot.is-word-thinking-across{
  border-color:rgba(146, 214, 255, 0.34);
  background:linear-gradient(180deg, rgba(24, 45, 59, 0.98), rgba(10, 18, 24, 0.98));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 0 0 4px var(--thinking-across-soft),
    0 16px 28px rgba(0,0,0,0.24);
}

.solutionSlot.is-word-thinking-down{
  border-color:rgba(255, 156, 197, 0.34);
  background:linear-gradient(180deg, rgba(58, 31, 45, 0.98), rgba(18, 11, 19, 0.98));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 0 0 4px var(--thinking-down-soft),
    0 16px 28px rgba(0,0,0,0.24);
}

.solutionSlot.is-active-thinking-across{
  outline-color:rgba(146, 214, 255, 0.9);
  border-color:rgba(146, 214, 255, 0.72);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.1),
    0 0 0 6px var(--thinking-across-soft),
    0 20px 32px rgba(0,0,0,0.28);
}

.solutionSlot.is-active-thinking-down{
  outline-color:rgba(255, 156, 197, 0.92);
  border-color:rgba(255, 156, 197, 0.74);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.1),
    0 0 0 6px var(--thinking-down-soft),
    0 20px 32px rgba(0,0,0,0.28);
}

.solutionSlotNumber{
  position:absolute;
  top:4px;
  right:6px;
  color:rgba(241, 200, 116, 0.92);
  font-size:9px;
  line-height:1;
  font-weight:900;
  pointer-events:none;
}

.solutionSlotValue{
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
  font-size:22px;
  font-weight:900;
  line-height:1;
  text-transform:uppercase;
  text-align:center;
}

.solutionSlotCandidate{
  display:block;
  line-height:.9;
  white-space:nowrap;
}

.solutionSlotCandidate.thinking-token.thinking-across,
.cellCandidate.thinking-token.thinking-across,
.mobileEntryCandidate.thinking-token.thinking-across{
  color:var(--thinking-across);
}

.solutionSlotCandidate.thinking-token.thinking-down,
.cellCandidate.thinking-token.thinking-down,
.mobileEntryCandidate.thinking-token.thinking-down{
  color:var(--thinking-down);
}

.solutionSlot.is-thinking .solutionSlotValue{
  font-size:15px;
  letter-spacing:-0.04em;
}

.solutionSlot.is-two .solutionSlotValue{
  grid-template-columns:repeat(2, minmax(0, 1fr));
  align-items:center;
  justify-items:center;
  font-size:12px;
  line-height:.92;
  letter-spacing:-0.05em;
}

.solutionSlot.is-many .solutionSlotValue{
  grid-template-columns:repeat(2, minmax(0, 1fr));
  grid-auto-rows:minmax(0, 1fr);
  align-items:center;
  justify-items:center;
  padding:2px 3px;
  font-size:11px;
  line-height:.92;
  letter-spacing:-0.05em;
  row-gap:2px;
}

.board-area::before{
  content:"";
  position:absolute;
  inset:28px 8% auto;
  height:62%;
  background:
    radial-gradient(circle at top, rgba(146, 214, 255, 0.13), transparent 42%),
    radial-gradient(circle at bottom, rgba(241, 200, 116, 0.12), transparent 36%);
  filter:blur(30px);
  pointer-events:none;
  z-index:0;
}

.grid-shell{
  position:relative;
  z-index:1;
  flex:1 1 auto;
  min-width:0;
  min-height:0;
  width:100%;
  max-width:100%;
  overflow:auto;
  cursor:grab;
  padding:18px 20px 24px;
  border:1px solid rgba(255,255,255,0.06);
  border-radius:24px;
  background:
    linear-gradient(180deg, rgba(6, 13, 18, 0.68), rgba(15, 28, 38, 0.5)),
    radial-gradient(circle at top, rgba(146, 214, 255, 0.08), transparent 46%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.04),
    inset 0 0 0 1px rgba(255,255,255,0.02);
  scroll-padding:96px 24px 140px;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  overscroll-behavior-y:auto;
  touch-action:pan-x pan-y pinch-zoom;
  transition:border-color .22s ease, background .22s ease, box-shadow .22s ease;
}

.grid-shell.is-loading,
.solution-phrase-shell.is-loading{
  display:flex;
  align-items:center;
  justify-content:center;
}

.grid-shell.is-loading{
  min-height:420px;
}

.solution-phrase-shell.is-loading{
  min-height:260px;
}

.board-resize-handle{
  display:none !important;
}

.grid-shell.is-loading::before,
.solution-phrase-shell.is-loading::before{
  content:attr(data-loading-label);
  display:block;
  max-width:28ch;
  padding:16px 18px;
  border:1px solid rgba(146, 214, 255, 0.14);
  border-radius:20px;
  background:rgba(146, 214, 255, 0.08);
  color:var(--accent-2);
  font-size:13px;
  font-weight:800;
  line-height:1.55;
  text-align:center;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.05);
}

.grid-shell.is-panning{
  cursor:grabbing;
}

body.is-board-panning{
  user-select:none;
}

.board-resize-handle{
  position:absolute;
  z-index:20;
  padding:0;
  border:none;
  background:transparent;
  opacity:0;
  cursor:pointer;
  touch-action:none;
  transition:opacity .18s ease;
}

.board-panel:hover .board-resize-handle,
.board-panel.is-resizing .board-resize-handle,
.solution-panel:hover .board-resize-handle,
.solution-panel.is-resizing .board-resize-handle,
.board-resize-handle:focus-visible{
  opacity:1;
}

.board-resize-handle::before{
  content:"";
  position:absolute;
  border-radius:999px;
  background:rgba(146, 214, 255, 0.32);
  box-shadow:0 0 0 1px rgba(255,255,255,0.06);
}

.board-panel.is-resizing{
  user-select:none;
  border-color:rgba(146, 214, 255, 0.24);
  box-shadow:
    var(--shadow),
    0 0 0 1px rgba(146, 214, 255, 0.12);
}

.solution-panel.is-resizing{
  user-select:none;
  border-color:rgba(241, 200, 116, 0.24);
  box-shadow:
    var(--shadow),
    0 0 0 1px rgba(241, 200, 116, 0.12);
}

.play-surface.is-board-resizing .solution-panel{
  transition:none !important;
}

.board-resize-handle-right{
  top:26px;
  right:-10px;
  width:22px;
  height:calc(100% - 64px);
  cursor:ew-resize;
}

.board-resize-handle-right::before{
  top:0;
  bottom:0;
  left:8px;
  width:6px;
}

.board-resize-handle-bottom{
  left:26px;
  bottom:-10px;
  width:calc(100% - 64px);
  height:22px;
  cursor:ns-resize;
}

.board-resize-handle-bottom::before{
  left:0;
  right:0;
  top:8px;
  height:6px;
}

.board-resize-handle-corner{
  right:-8px;
  bottom:-8px;
  width:28px;
  height:28px;
  cursor:nwse-resize;
}

.board-resize-handle-corner::before{
  inset:4px;
  border-radius:10px;
  background:
    linear-gradient(135deg, rgba(241, 200, 116, 0.4), rgba(146, 214, 255, 0.44));
}

.solution-resize-handle-left{
  top:26px;
  left:-10px;
  width:22px;
  height:calc(100% - 64px);
  cursor:ew-resize;
}

.solution-resize-handle-left::before{
  top:0;
  bottom:0;
  right:8px;
  width:6px;
}

.grid{
  display:grid;
  gap:6px;
  width:max-content;
  margin-inline:calc(var(--grid-cell-size) * 2);
  padding:0;
  border:none;
  border-radius:0;
  background:transparent;
}

.cell{
  position:relative;
  z-index:1;
  display:grid;
  place-items:center;
  width:var(--grid-cell-size);
  height:var(--grid-cell-size);
  border:1px solid rgba(255,255,255,0.07);
  border-radius:16px;
  background:
    linear-gradient(180deg, rgba(21, 36, 47, 0.98), rgba(10, 18, 24, 0.98));
  color:var(--text);
  font-size:calc(var(--grid-cell-size) * 0.42);
  font-weight:900;
  line-height:1;
  text-transform:uppercase;
  user-select:none;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    0 10px 22px rgba(0,0,0,0.2);
  transition:transform .14s ease, border-color .14s ease, box-shadow .14s ease;
}

.cellLetter{
  position:relative;
  z-index:2;
  display:inline-block;
  line-height:1;
  white-space:nowrap;
  letter-spacing:-0.02em;
  text-align:center;
}

.cellCandidate{
  display:block;
  line-height:.9;
  white-space:nowrap;
}

.cell:not(.block):hover{
  transform:translateY(-1px);
  border-color:rgba(146, 214, 255, 0.22);
}

.cell.block{
  opacity:0;
  background:transparent;
  border-color:transparent;
  pointer-events:none;
  box-shadow:none;
}

.cell.remote-presence-letter{
  border-color:var(--presence-border, rgba(146, 214, 255, 0.24));
  background:
    linear-gradient(180deg, rgba(255,255,255,0.015), rgba(12, 23, 31, 0.98)),
    linear-gradient(180deg, rgba(21, 36, 47, 0.98), rgba(10, 18, 24, 0.98));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 0 0 2px var(--presence-glow, rgba(146, 214, 255, 0.06)),
    0 12px 24px rgba(0,0,0,0.24);
}

.cell.remote-presence-letter.is-multi{
  background:
    linear-gradient(135deg, rgba(255,255,255,0.015) 0%, rgba(255,255,255,0.015) 47%, rgba(255,255,255,0.03) 53%, rgba(255,255,255,0.03) 100%),
    linear-gradient(180deg, rgba(21, 36, 47, 0.98), rgba(10, 18, 24, 0.98));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 0 0 2px var(--presence-glow, rgba(146, 214, 255, 0.06)),
    0 0 0 4px var(--presence-glow-secondary, rgba(255, 156, 197, 0.04)),
    0 12px 24px rgba(0,0,0,0.24);
}

.cell.remote-presence-clue{
  border-color:var(--presence-border, rgba(146, 214, 255, 0.3));
  background:
    linear-gradient(180deg, rgba(255,255,255,0.025), rgba(26, 45, 58, 0.96)),
    linear-gradient(135deg, rgba(255,255,255,0.03), transparent 55%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 0 0 2px var(--presence-glow, rgba(146, 214, 255, 0.06)),
    0 12px 24px rgba(0,0,0,0.24);
}

.cell.remote-presence-clue.is-multi{
  background:
    linear-gradient(135deg, rgba(255,255,255,0.025) 0%, rgba(255,255,255,0.025) 47%, rgba(255,255,255,0.045) 53%, rgba(255,255,255,0.045) 100%),
    linear-gradient(180deg, rgba(26, 45, 58, 0.96), rgba(16, 28, 36, 0.98));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 0 0 2px var(--presence-glow, rgba(146, 214, 255, 0.06)),
    0 0 0 4px var(--presence-glow-secondary, rgba(255, 156, 197, 0.04)),
    0 12px 24px rgba(0,0,0,0.24);
}

.cell.entry-active-letter{
  border-color:rgba(241, 200, 116, 0.46);
  background:
    linear-gradient(180deg, rgba(56, 47, 19, 0.2), rgba(12, 23, 31, 0.98)),
    linear-gradient(180deg, rgba(21, 36, 47, 0.98), rgba(10, 18, 24, 0.98));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 0 0 3px rgba(241, 200, 116, 0.08),
    0 12px 24px rgba(0,0,0,0.24);
}

.cell.entry-active-clue{
  border-color:rgba(241, 200, 116, 0.4);
  background:
    linear-gradient(180deg, rgba(241, 200, 116, 0.26), rgba(26, 45, 58, 0.96)),
    linear-gradient(135deg, rgba(146, 214, 255, 0.12), transparent 55%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 0 0 3px rgba(241, 200, 116, 0.08),
    0 12px 24px rgba(0,0,0,0.24);
}

.cell.active{
  outline:3px solid var(--accent);
  outline-offset:2px;
  border-color:rgba(241, 200, 116, 0.72);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.1),
    0 0 0 6px rgba(241, 200, 116, 0.14),
    0 20px 32px rgba(0,0,0,0.28);
}

.cell.active-thinking{
  outline-color:rgba(146, 214, 255, 0.86);
  border-color:rgba(146, 214, 255, 0.72);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.1),
    0 0 0 6px rgba(146, 214, 255, 0.14),
    0 20px 32px rgba(0,0,0,0.28);
}

.cell.entry-thinking-across{
  border-color:rgba(146, 214, 255, 0.38);
  background:
    linear-gradient(180deg, rgba(27, 50, 65, 0.98), rgba(12, 23, 31, 0.98));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 0 0 3px var(--thinking-across-soft),
    0 12px 24px rgba(0,0,0,0.24);
}

.cell.entry-thinking-down{
  border-color:rgba(255, 156, 197, 0.38);
  background:
    linear-gradient(180deg, rgba(59, 31, 45, 0.98), rgba(21, 12, 18, 0.98));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 0 0 3px var(--thinking-down-soft),
    0 12px 24px rgba(0,0,0,0.24);
}

.cell.active-thinking-across{
  outline-color:rgba(146, 214, 255, 0.9);
  border-color:rgba(146, 214, 255, 0.72);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.1),
    0 0 0 6px var(--thinking-across-soft),
    0 20px 32px rgba(0,0,0,0.28);
}

.cell.active-thinking-down{
  outline-color:rgba(255, 156, 197, 0.92);
  border-color:rgba(255, 156, 197, 0.74);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.1),
    0 0 0 6px var(--thinking-down-soft),
    0 20px 32px rgba(0,0,0,0.28);
}

.cell.cell-thinking .cellLetter{
  font-size:calc(var(--grid-cell-size) * 0.24);
  letter-spacing:-0.05em;
}

.cell.cell-two-candidates .cellLetter{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  align-items:center;
  justify-items:center;
  width:100%;
  padding:0 4px;
  font-size:calc(var(--grid-cell-size) * 0.18);
  line-height:.92;
  letter-spacing:-0.05em;
  column-gap:2px;
}

.cell.cell-ambiguous .cellLetter{
  font-size:calc(var(--grid-cell-size) * 0.15);
  letter-spacing:-0.06em;
}

.cell.cell-many-candidates .cellLetter{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  grid-auto-rows:minmax(0, 1fr);
  align-items:center;
  justify-items:center;
  width:100%;
  padding:4px 5px;
  font-size:calc(var(--grid-cell-size) * 0.16);
  line-height:.92;
  letter-spacing:-0.05em;
  column-gap:2px;
  row-gap:2px;
}

.cell.cell-needs-decision{
  background:linear-gradient(180deg, rgba(113, 44, 44, 0.94), rgba(71, 24, 24, 0.98));
  border-color:rgba(255, 112, 112, 0.82);
  color:var(--bad);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 0 0 4px rgba(255, 112, 112, 0.1),
    0 16px 28px rgba(0,0,0,0.28);
}

.cell.reveal-correct{
  background:linear-gradient(180deg, rgba(46, 103, 71, 0.94), rgba(24, 60, 42, 0.98));
  border-color:rgba(90, 210, 141, 0.74);
  color:var(--good);
}

.cell.reveal-wrong{
  background:linear-gradient(180deg, rgba(113, 44, 44, 0.94), rgba(71, 24, 24, 0.98));
  border-color:rgba(255, 112, 112, 0.74);
  color:var(--bad);
}

.cell.clue{
  z-index:10;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  justify-content:center;
  padding:10px 6px 6px;
  overflow:visible;
  line-height:1;
  text-transform:none;
  font-weight:700;
  background:
    linear-gradient(180deg, rgba(241, 200, 116, 0.18), rgba(22, 38, 50, 0.95)),
    linear-gradient(135deg, rgba(146, 214, 255, 0.08), transparent 55%);
  border-color:rgba(241, 200, 116, 0.22);
}

.cell.clue::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(255,255,255,0.06), transparent 42%);
  pointer-events:none;
}

.cell.clue .clueText{
  width:100%;
  max-width:100%;
  min-height:0;
  flex:1 1 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  z-index:5;
  margin-left:0;
  padding:0 4px;
  color:var(--text);
  overflow:hidden;
  opacity:.95;
}

.cell.clue .clueTextInner{
  display:block;
  width:100%;
  text-align:center;
  white-space:normal;
  hyphens:none;
  overflow-wrap:break-word;
  word-break:normal;
  line-height:1.08;
}

.cell.clue .clueNumber{
  position:absolute;
  z-index:5;
  top:2px;
  right:4px;
  color:rgba(241, 200, 116, 0.92);
  font-size:8px;
  line-height:1;
  font-weight:900;
  opacity:.92;
  pointer-events:none;
}

.cellMarker{
  position:absolute;
  top:4px;
  right:6px;
  z-index:5;
  color:rgba(241, 200, 116, 0.92);
  font-size:9px;
  line-height:1;
  font-weight:900;
  pointer-events:none;
}

.clueArrow{
  position:absolute;
  pointer-events:none;
  z-index:12;
  color:var(--accent);
  filter:drop-shadow(0 1px 2px rgba(0, 0, 0, 0.24));
}

.clueArrow svg{
  display:block;
  width:100%;
  height:100%;
  overflow:visible;
}

.clueArrow.across.from-left{
  left:70%;
  top:38%;
  width:82%;
  height:28%;
}

.clueArrow.down.from-top{
  left:50%;
  top:70%;
  width:28%;
  height:82%;
  transform:translateX(-50%);
}

.clueArrow.down.from-left{
  left:90%;
  top:10%;
  width:68%;
  height:118%;
}

.clueArrow.across.from-top{
  left:10%;
  top:92%;
  width:118%;
  height:68%;
}

.clueArrow.across.from-diag{
  left:72%;
  top:60%;
  width:118%;
  height:60%;
}

.clueArrow.down.from-diag{
  left:60%;
  top:72%;
  width:60%;
  height:118%;
}

.select{
  min-width:180px;
  height:52px;
  padding:16px 18px;
  border:1px solid var(--line);
  border-radius:16px;
  background:rgba(7, 17, 24, 0.72);
  color:var(--text);
  font-size:17px;
  font-weight:900;
  cursor:pointer;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.05);
}

body.is-generator-setup-page.is-setup-lobby-guest .controls-group-primary .select:disabled{
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  background-image:none;
  padding-right:18px;
}

body.is-generator-setup-page.is-setup-lobby-guest #setupCollaborationRow,
body.is-generator-setup-page.is-setup-lobby-guest #setupCollaborationInviteRow{
  display:none;
}

@media (min-width: 1080px){
  .play-surface{
    grid-template-columns:minmax(0, 1fr);
    align-items:stretch;
  }

  .play-surface.is-solution-hidden{
    grid-template-columns:minmax(0, 1fr);
  }

  .play-surface.is-board-wide{
    grid-template-columns:minmax(0, 1fr);
  }

  .board-panel{
    min-height:100%;
  }

  .solution-panel{
    position:static;
    top:auto;
  }
}

@keyframes page-rise{
  from{
    opacity:0;
    transform:translateY(12px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

@keyframes btn-generate-fill{
  0%{
    background:conic-gradient(#11161b 0deg 18deg, rgba(17, 22, 27, 0.14) 18deg 360deg);
  }
  25%{
    background:conic-gradient(#11161b 0deg 110deg, rgba(17, 22, 27, 0.14) 110deg 360deg);
  }
  50%{
    background:conic-gradient(#11161b 0deg 210deg, rgba(17, 22, 27, 0.14) 210deg 360deg);
  }
  75%{
    background:conic-gradient(#11161b 0deg 320deg, rgba(17, 22, 27, 0.14) 320deg 360deg);
  }
  100%{
    background:conic-gradient(#11161b 0deg 18deg, rgba(17, 22, 27, 0.14) 18deg 360deg);
  }
}

@keyframes btn-progress-spin{
  from{
    transform:rotate(0deg);
  }
  to{
    transform:rotate(360deg);
  }
}

@keyframes status-pulse{
  0%{
    transform:translateY(0);
    box-shadow:0 0 0 rgba(0,0,0,0);
  }
  45%{
    transform:translateY(-1px);
    box-shadow:0 10px 24px rgba(0,0,0,0.18);
  }
  100%{
    transform:translateY(0);
    box-shadow:0 0 0 rgba(0,0,0,0);
  }
}

@keyframes status-sheen{
  from{
    background-position:200% 0;
  }
  to{
    background-position:0 0;
  }
}

@keyframes surface-shift{
  0%{
    transform:translateY(0);
    border-color:rgba(255,255,255,0.06);
  }
  50%{
    transform:translateY(-1px);
    border-color:rgba(146, 214, 255, 0.2);
  }
  100%{
    transform:translateY(0);
    border-color:rgba(255,255,255,0.06);
  }
}

@keyframes finish-modal-in{
  from{
    opacity:0;
    transform:translateY(12px) scale(.985);
  }
  to{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}

@media (max-width: 980px){
  :root{
    --cell-size:56px;
  }

  .container{
    padding:
      calc(24px + var(--safe-top))
      calc(16px + var(--safe-right))
      calc(34px + var(--safe-bottom) + var(--keyboard-offset))
      calc(16px + var(--safe-left));
  }

  .hero-grid,
  .start-hero-grid,
  .start-actions,
  .competition-hero,
  .competition-setup-grid,
  .competition-room-summary,
  .competition-room-grid,
  .competition-results-summary,
  .competition-chat-form,
  .competition-card-grid,
  .competition-rules,
  .competition-team-grid,
  .resolution-board-layout,
  .controls{
    grid-template-columns:1fr;
  }

  .competition-room-head{
    grid-template-columns:1fr;
    align-items:flex-start;
  }

  .competition-room-code-stack{
    justify-content:flex-start;
  }

  .play-surface{
    grid-template-columns:1fr;
  }

  .builder-modal-body{
    grid-template-columns:1fr;
  }

  .builder-list-toolbar{
    grid-template-columns:minmax(0, 1fr);
    align-items:stretch;
  }

  .builder-list-filters{
    justify-content:flex-start;
  }

  .interrupt-modal-body{
    grid-template-columns:1fr;
  }

  .setup-identity-grid{
    grid-template-columns:1fr;
  }

  .seed-lobby-grid{
    grid-template-columns:1fr;
  }

  .builder-textarea-pool{
    min-height:260px;
  }

  .board-resize-handle{
    display:none;
  }

  .hero-title{
    max-width:14ch;
  }

  .generation-meta,
  .result{
    width:100%;
    min-width:0;
    justify-content:flex-start;
  }
}

@media (max-width: 720px){
  :root{
    --cell-size:44px;
  }

  .site-nav-start{
    align-items:flex-start;
    flex-direction:column;
    gap:6px;
  }

  .hero-title{
    font-size:clamp(28px, 9vw, 42px);
  }

  .start-title{
    max-width:14ch;
    font-size:clamp(30px, 10vw, 44px);
  }

  .start-size-options{
    grid-template-columns:1fr;
  }

  .start-subtitle{
    font-size:14px;
  }

  .start-mode-grid,
  .start-actions{
    grid-template-columns:1fr;
  }

  .setup-collab-row,
  .setup-collab-invite-row{
    align-items:flex-start;
    flex-direction:column;
  }

  .setup-collab-toggle{
    align-self:flex-end;
  }

  .start-intro-dialog{
    width:min(100vw - 20px, 920px);
    margin:12px auto;
    padding:18px;
    border-radius:24px;
  }

  .start-intro-header{
    gap:12px;
  }

  .start-intro-title{
    max-width:100%;
    font-size:clamp(26px, 9vw, 40px);
  }

  .start-intro-grid{
    grid-template-columns:1fr;
  }

  .start-hero-card,
  .start-side-card,
  .start-action-card,
  .start-mode-card{
    border-radius:22px;
  }

  .hero-subtitle{
    font-size:14px;
  }

  .controls{
    gap:10px;
    padding:12px;
    border-radius:20px;
  }

  .controls-group{
    padding:12px;
    gap:10px;
  }

  .controls-group-play .btn{
    flex:1 1 calc(50% - 6px);
  }

  .controls-group-primary .btn-generate{
    flex-basis:100%;
  }

  .board-stage{
    flex-direction:column;
    align-items:stretch;
  }

  .board-side-stack{
    flex:1 1 auto;
    width:auto;
  }

  .board-zoom-controls{
    padding:8px;
  }

  .panel-tag-row-board{
    width:100%;
    justify-content:flex-start;
  }

  .seed-presence-panel,
  .seed-leaderboard-panel{
    position:static;
    top:auto;
  }

  .hero-metrics,
  .hero-card-list,
  .panel-tag-row,
  .solution-badge-row{
    gap:8px;
  }

  .controls-group,
  .board-panel,
  .solution-panel,
  .hero-copy,
  .hero-card{
    border-radius:22px;
  }

  .pool-stats-head{
    flex-direction:column;
    align-items:flex-start;
  }

  .pool-stats-actions{
    width:100%;
    align-items:flex-start;
  }

  .btn,
  .select,
  .timer{
    font-size:14px;
  }

  .btn{
    padding:10px 12px;
  }

  .select{
    min-width:150px;
    height:46px;
    padding:12px 14px;
  }

  .timer{
    min-width:82px;
  }

  .cell{
    border-radius:12px;
  }

  .cell.clue .clueText{
    font-size:8px;
  }

  .cell.clue .clueNumber{
    font-size:8px;
  }

  .panel-heading{
    margin-bottom:14px;
  }

  .panel-copy,
  .solution-subtitle,
  .hero-card-text{
    font-size:13px;
  }

  .finish-modal{
    padding:14px;
  }

  .builder-modal{
    padding:14px;
  }

  .finish-modal-dialog{
    padding:18px;
    border-radius:24px;
  }

  .builder-modal-dialog{
    padding:18px;
    border-radius:24px;
  }

  .finish-modal-header,
  .finish-modal-body,
  .finish-leaderboard-head{
    gap:12px;
  }

  .builder-modal-header,
  .builder-modal-body{
    gap:12px;
  }

  .finish-modal-body{
    grid-template-columns:1fr;
  }

  .builder-modal-actions{
    margin-top:14px;
  }

  .interrupt-modal-actions .builder-status{
    flex-basis:100%;
    margin-right:0;
  }

  .finish-progress-shell{
    grid-template-columns:1fr;
    gap:10px;
  }

  .finish-progress-value{
    text-align:left;
  }

  .finish-stats-grid{
    grid-template-columns:1fr;
  }

  .resolution-puzzle-head{
    flex-direction:column;
    align-items:flex-start;
  }

  .finish-leaderboard-item{
    grid-template-columns:auto 1fr;
  }

  .finish-leaderboard-badge{
    grid-column:2;
    justify-self:start;
  }

  .resolution-collab-metrics{
    grid-template-columns:1fr;
  }

  .resolution-slang-cards{
    grid-template-columns:1fr;
  }

  .resolution-slang-item-head{
    flex-direction:column;
    align-items:flex-start;
  }

  .resolution-slang-item-meta{
    text-align:left;
  }

  .seed-leaderboard-head{
    flex-direction:column;
    align-items:flex-start;
  }

  .solutionPhrase{
    gap:10px 12px;
  }

  .solutionWord{
    padding:8px 10px;
    border-radius:18px;
    gap:6px;
  }

  .board-zoom-btn{
    width:40px;
    height:40px;
  }

  .solution-phrase-shell{
    padding:14px;
    border-radius:20px;
  }
}

@media (hover:none), (pointer:coarse), (max-width:900px){
  .mobile-clue-card{
    position:sticky;
    top:12px;
    z-index:26;
    display:block;
    margin:0 0 16px;
    padding:14px 16px 16px;
    border:1px solid rgba(255,255,255,0.08);
    border-radius:20px;
    background:
      linear-gradient(180deg, rgba(14, 26, 35, 0.95), rgba(8, 17, 24, 0.98)),
      radial-gradient(circle at top left, rgba(146, 214, 255, 0.08), transparent 42%);
    backdrop-filter:blur(16px);
    box-shadow:0 18px 34px rgba(0,0,0,0.24);
  }

  .mobile-clue-card[hidden]{
    display:none;
  }

  .mobile-clue-card-header{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    margin-bottom:8px;
  }

  .mobile-clue-kicker{
    margin:0;
    color:var(--accent);
    font-size:11px;
    font-weight:900;
    letter-spacing:.16em;
    text-transform:uppercase;
  }

  .mobile-clue-close{
    padding:8px 10px;
    font-size:12px;
  }

  .mobile-clue-text{
    margin:0;
    color:var(--text);
    font-size:16px;
    line-height:1.5;
    text-wrap:balance;
    white-space:pre-line;
  }

  .mobile-toolbar{
    position:sticky;
    bottom:calc(12px + env(safe-area-inset-bottom) + var(--keyboard-offset));
    z-index:30;
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:10px;
    margin-top:18px;
    padding:12px;
    border:1px solid rgba(255,255,255,0.08);
    border-radius:20px;
    background:
      linear-gradient(180deg, rgba(12, 23, 31, 0.94), rgba(8, 17, 24, 0.98)),
      radial-gradient(circle at top, rgba(241, 200, 116, 0.06), transparent 38%);
    backdrop-filter:blur(16px);
    box-shadow:0 18px 36px rgba(0,0,0,0.26);
  }

  .mobile-tool-btn{
    min-height:48px;
    padding:12px 10px;
    border-radius:16px;
    font-size:13px;
    font-weight:800;
  }

  .mobile-entry-list-toggle{
    display:flex;
    justify-content:center;
    width:100%;
    margin-top:14px;
    padding:12px 14px;
    border-radius:18px;
    font-size:13px;
    font-weight:800;
  }

  .mobile-entry-list-toggle[hidden]{
    display:none;
  }

  .mobile-entry-list-panel{
    display:grid;
    gap:14px;
    margin-top:12px;
    padding:14px;
    border:1px solid rgba(255,255,255,0.08);
    border-radius:20px;
    background:
      linear-gradient(180deg, rgba(12, 23, 31, 0.94), rgba(8, 17, 24, 0.98)),
      radial-gradient(circle at top left, rgba(146, 214, 255, 0.06), transparent 42%);
    backdrop-filter:blur(16px);
    box-shadow:0 18px 34px rgba(0,0,0,0.24);
    overscroll-behavior:contain;
  }

  .mobile-entry-list-panel[hidden]{
    display:none;
  }

  .mobile-entry-list-head{
    display:grid;
    gap:4px;
  }

  .mobile-entry-list-kicker{
    margin:0;
    color:var(--accent);
    font-size:11px;
    font-weight:900;
    letter-spacing:.16em;
    text-transform:uppercase;
  }

  .mobile-entry-list-title{
    margin:0;
    font-size:18px;
    line-height:1.2;
    letter-spacing:-0.02em;
  }

  .mobile-entry-list-note{
    color:var(--muted);
    font-size:13px;
    line-height:1.5;
  }

  .mobile-entry-list{
    display:grid;
    gap:10px;
  }

  .mobile-entry-item{
    display:grid;
    gap:10px;
    padding:12px;
    border:1px solid rgba(255,255,255,0.06);
    border-radius:18px;
    background:rgba(255,255,255,0.02);
  }

  .mobile-entry-item.is-active{
    border-color:rgba(146, 214, 255, 0.26);
    box-shadow:0 0 0 3px rgba(146, 214, 255, 0.08);
  }

  .mobile-entry-item.is-correct{
    border-color:rgba(90, 210, 141, 0.24);
  }

  .mobile-entry-item.is-wrong{
    border-color:rgba(255, 112, 112, 0.22);
  }

  .mobile-entry-item.is-partial{
    border-color:rgba(241, 200, 116, 0.2);
  }

  .mobile-entry-line{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    align-items:flex-start;
  }

  .mobile-entry-clue-btn{
    padding:0;
    border:0;
    background:transparent;
    color:var(--text);
    font:inherit;
    font-size:15px;
    font-weight:700;
    line-height:1.55;
    text-align:left;
    cursor:pointer;
  }

  .mobile-entry-answer{
    display:flex;
    flex:1 1 220px;
    flex-wrap:wrap;
    gap:6px;
    min-width:0;
  }

  .mobile-entry-slot{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:34px;
    min-height:40px;
    padding:6px 7px;
    border:1px solid rgba(255,255,255,0.08);
    border-radius:12px;
    background:rgba(255,255,255,0.04);
    color:var(--text);
    font:inherit;
    cursor:pointer;
    overflow:hidden;
  }

  .mobile-entry-slot.has-marker::before{
    content:attr(data-marker);
    position:absolute;
    inset:50% auto auto 50%;
    transform:translate(-50%, -50%);
    font-size:18px;
    font-weight:900;
    color:rgba(255,255,255,0.12);
    pointer-events:none;
  }

  .mobile-entry-slot.is-active{
    border-color:rgba(241, 200, 116, 0.62);
    box-shadow:0 0 0 4px rgba(241, 200, 116, 0.12);
  }

  .mobile-entry-slot.is-empty{
    color:rgba(244, 239, 226, 0.54);
  }

  .mobile-entry-slot.is-thinking{
    border-color:rgba(146, 214, 255, 0.28);
  }

  .mobileEntrySlotValue{
    position:relative;
    z-index:1;
    display:block;
    min-width:1ch;
    text-align:center;
    line-height:1;
    white-space:nowrap;
    letter-spacing:-0.03em;
  }

  .mobileEntryCandidate{
    display:block;
    line-height:.9;
    white-space:nowrap;
  }

  .mobile-entry-slot.is-two .mobileEntrySlotValue,
  .mobile-entry-slot.is-many .mobileEntrySlotValue{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    align-items:center;
    justify-items:center;
    gap:2px;
    font-size:11px;
  }

  .solution-phrase-shell{
    scroll-padding:12px;
  }
}

@media (max-width: 980px){
  .info-grid,
  .seed-entry-hero,
  .seed-entry-return-row,
  .seed-entry-availability,
  .seed-entry-grid,
  .resolution-availability,
  .resolution-competition-summary{
    grid-template-columns:1fr;
  }
}

@media (max-width: 720px){
  .site-nav-surface{
    min-height:78px;
    padding:14px 16px;
  }

  .seed-entry-title{
    font-size:clamp(1.72rem, 8vw, 2.45rem);
  }

  .seed-entry-btn{
    width:100%;
    min-width:0;
  }

  .seed-entry-status-shell{
    align-items:flex-start;
    flex-direction:column;
  }

  .seed-entry-return-btn{
    width:100%;
  }

  .competition-data-status{
    align-items:flex-start;
    flex-direction:column;
  }
}

@media print{
  body{
    background:#fff;
    color:#000;
  }

  body::before,
  body::after,
  .hero,
  .controls-shell,
  .mobile-toolbar,
  .finish-modal,
  .builder-modal,
  .board-resize-handle,
  .seed-presence-panel,
  .seed-leaderboard-panel,
  .panel-tag-row,
  .site-nav,
  .site-tools-font-shell,
  .site-checklist-shell{
    display:none !important;
  }

  .container{
    max-width:none;
    padding:0;
    animation:none;
  }

  .play-surface{
    display:grid;
    grid-template-columns:1fr;
    gap:18px;
  }

  .board-panel,
  .solution-panel{
    background:#fff !important;
    border:1px solid #bbb;
    box-shadow:none;
    color:#000;
  }

  .grid-shell{
    overflow:visible !important;
    max-height:none !important;
  }

  body.has-custom-print-watermark .print-watermark{
    display:block !important;
    position:fixed;
    left:50%;
    bottom:10mm;
    transform:translateX(-50%);
    color:rgba(0, 0, 0, 0.44);
    font-size:10pt;
    font-weight:700;
    letter-spacing:.22em;
    text-transform:uppercase;
  }
}

@media (prefers-reduced-motion: reduce){
  .container,
  .btnProgress::before,
  .generation-meta,
  .result,
  .cell,
  .solutionSlot,
  .btn,
  .controls-group,
  .hero-copy,
  .hero-card,
  .board-panel,
  .solution-panel,
  .grid-shell,
  .mobile-clue-card,
  .mobile-toolbar{
    animation:none !important;
    transition:none !important;
  }
}

body,
button,
input,
select,
textarea{
  font-family:var(--font-body-stack);
}

button,
a,
input,
select,
textarea,
[role="button"]{
  -webkit-tap-highlight-color:transparent;
}

:focus-visible{
  outline:2px solid rgba(146, 214, 255, 0.72);
  outline-offset:2px;
}

button::-moz-focus-inner{
  border:0;
}

html.no-text-wrap-balance .hero-title,
html.no-text-wrap-balance .start-title,
html.no-text-wrap-balance .start-size-title,
html.no-text-wrap-balance .start-action-title,
html.no-text-wrap-balance .hero-card-title,
html.no-text-wrap-balance .panel-title,
html.no-text-wrap-balance .competition-title,
html.no-text-wrap-balance .seed-entry-title,
html.no-text-wrap-balance .mobile-clue-text{
  overflow-wrap:anywhere;
  word-break:normal;
}

html.no-backdrop-filter .content-card,
html.no-backdrop-filter .hero-card,
html.no-backdrop-filter .start-hero-card,
html.no-backdrop-filter .competition-card,
html.no-backdrop-filter .seed-lobby-card,
html.no-backdrop-filter .seed-presence-panel,
html.no-backdrop-filter .seed-leaderboard-panel,
html.no-backdrop-filter .online-sync-status,
html.no-backdrop-filter .mobile-toolbar,
html.no-backdrop-filter .mobile-entry-list-panel,
html.no-backdrop-filter .site-checklist-shell,
html.no-backdrop-filter .site-tools-diagnostics-panel{
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}

@media (pointer: coarse), (max-width: 900px){
  .hero-copy,
  .hero-card,
  .controls,
  .board-panel,
  .solution-panel,
  .online-sync-status,
  .mobile-entry-list-panel{
    -webkit-backdrop-filter:none !important;
    backdrop-filter:none !important;
  }

  .board-area::before{
    display:none;
  }

  .board-panel,
  .solution-panel{
    box-shadow:0 10px 22px rgba(0,0,0,0.16);
  }

  .grid-shell,
  .solution-phrase-shell{
    box-shadow:inset 0 1px 0 rgba(255,255,255,0.04);
  }
}

h1,
h2,
h3,
.hero-title,
.start-title,
.start-size-title,
.start-action-title,
.hero-card-title,
.panel-title,
.competition-title,
.builder-modal-title,
.seed-entry-title{
  font-family:var(--font-display-stack) !important;
}

code,
pre,
.builder-help code,
.online-sync-status-detail-code{
  font-family:var(--font-mono-stack) !important;
}

body[data-font-preset="standard"]{
  --font-body-stack:"Trebuchet MS", "Gill Sans", "Avenir Next", sans-serif;
  --font-display-stack:"Baskerville", "Palatino Linotype", "Book Antiqua", serif;
}

body[data-font-preset="round"]{
  --font-body-stack:"Avenir Next", "Trebuchet MS", "Segoe UI", sans-serif;
  --font-display-stack:"Avenir Next", "Trebuchet MS", "Segoe UI", sans-serif;
}

body[data-font-preset="editorial"]{
  --font-body-stack:"Georgia", "Times New Roman", serif;
  --font-display-stack:"Georgia", "Times New Roman", serif;
}

body[data-font-preset="clean"]{
  --font-body-stack:"Helvetica Neue", Arial, "Segoe UI", sans-serif;
  --font-display-stack:"Helvetica Neue", Arial, "Segoe UI", sans-serif;
}

body[data-font-preset="tech"]{
  --font-body-stack:"Verdana", "Tahoma", "Segoe UI", sans-serif;
  --font-display-stack:"Verdana", "Tahoma", "Segoe UI", sans-serif;
}

.site-tools-font-shell{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:110;
  display:grid;
  gap:10px;
}

.site-tools-font-toggle{
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:42px;
  padding:10px 14px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:999px;
  background:rgba(8, 16, 22, 0.88);
  color:var(--text);
  box-shadow:0 12px 28px rgba(0,0,0,0.24);
  cursor:pointer;
}

.site-tools-font-panel{
  width:min(280px, calc(100vw - 32px));
  padding:14px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:20px;
  background:rgba(8, 16, 22, 0.96);
  box-shadow:0 18px 34px rgba(0,0,0,0.28);
}

.site-tools-font-head{
  display:grid;
  gap:4px;
  margin-bottom:12px;
}

.site-tools-font-head strong{
  font-size:14px;
}

.site-tools-font-head span{
  color:var(--muted);
  font-size:12px;
}

.site-tools-font-options{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:8px;
}

.site-tools-font-option{
  min-height:40px;
  padding:8px 10px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:14px;
  background:rgba(255,255,255,0.03);
  color:var(--text);
  cursor:pointer;
}

.site-tools-font-option.is-active{
  border-color:rgba(146, 214, 255, 0.26);
  background:rgba(146, 214, 255, 0.1);
}

.site-checklist-shell{
  display:grid;
  gap:12px;
}

.site-checklist-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
}

.site-checklist-title{
  margin:0;
  font-size:24px;
  line-height:1.05;
}

.site-checklist-intro,
.site-checklist-meta{
  margin:6px 0 0;
  color:var(--muted);
  font-size:13px;
  line-height:1.55;
}

.site-checklist-list{
  display:grid;
  gap:10px;
}

.site-checklist-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:16px;
  background:rgba(255,255,255,0.03);
}

.site-checklist-item.is-rework{
  border-color:rgba(255, 112, 112, 0.24);
  background:rgba(255, 112, 112, 0.08);
}

.site-checklist-copy{
  color:var(--text);
  font-size:14px;
  line-height:1.55;
}

.site-checklist-actions{
  display:flex;
  align-items:center;
  gap:8px;
}

.site-checklist-action{
  width:34px;
  height:34px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:999px;
  background:rgba(255,255,255,0.03);
  color:var(--text);
  cursor:pointer;
}

.site-checklist-action.is-done{
  color:#dff9ea;
}

.site-checklist-action.is-rework{
  color:#ffd7d7;
}

.site-checklist-empty{
  margin:0;
  color:var(--muted);
  font-size:14px;
  line-height:1.55;
}

@media (max-width: 720px){
  .site-tools-font-shell{
    right:12px;
    bottom:12px;
  }

  .site-checklist-item{
    flex-direction:column;
    align-items:flex-start;
  }

  .site-checklist-actions{
    width:100%;
    justify-content:flex-end;
  }
}

html[data-ui-theme="standard"] body,
html[data-ui-theme="nightshift"] body,
body[data-ui-theme="standard"],
body[data-ui-theme="nightshift"]{
  --bg:#0b1117;
  --bg-soft:#13222d;
  --panel:rgba(13, 26, 36, 0.84);
  --panel-strong:rgba(15, 30, 41, 0.95);
  --panel-elevated:rgba(16, 31, 43, 0.96);
  --panel-border-strong:rgba(255,255,255,0.1);
  --text:#f4efe2;
  --muted:#9fb2bf;
  --line:rgba(171, 194, 205, 0.16);
  --accent:#f1c874;
  --accent-2:#92d6ff;
  --good:#5ad28d;
  --bad:#ff7070;
  --shadow:0 26px 70px rgba(0, 0, 0, 0.34);
  --panel-shadow:0 26px 60px rgba(0, 0, 0, 0.28);
  --font-body-stack:"Trebuchet MS", "Gill Sans", "Avenir Next", sans-serif;
  --font-display-stack:"Baskerville", "Palatino Linotype", "Book Antiqua", serif;
  --font-mono-stack:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
}

html[data-ui-theme="daylight"] body,
body[data-ui-theme="daylight"]{
  --bg:#f2efe6;
  --bg-soft:#ffffff;
  --panel:rgba(255, 255, 255, 0.92);
  --panel-strong:rgba(255, 255, 255, 0.98);
  --panel-elevated:rgba(255, 255, 255, 0.98);
  --panel-border-strong:rgba(23, 41, 54, 0.12);
  --text:#1f2b35;
  --muted:#5f7280;
  --line:rgba(26, 43, 57, 0.12);
  --accent:#2f7df6;
  --accent-2:#f08c3b;
  --thinking-across:#2f7df6;
  --thinking-across-soft:rgba(47, 125, 246, 0.12);
  --thinking-down:#ef6a8f;
  --thinking-down-soft:rgba(239, 106, 143, 0.12);
  --good:#248b5c;
  --bad:#d24b4b;
  --shadow:0 20px 46px rgba(31, 43, 53, 0.08);
  --panel-shadow:0 18px 40px rgba(31, 43, 53, 0.08);
  --font-body-stack:"Avenir Next", "Segoe UI", "Helvetica Neue", sans-serif;
  --font-display-stack:"Iowan Old Style", "Georgia", serif;
  --font-mono-stack:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  background:
    linear-gradient(90deg, rgba(31,43,53,0.035) 1px, transparent 1px),
    linear-gradient(rgba(31,43,53,0.03) 1px, transparent 1px),
    radial-gradient(circle at top left, rgba(47, 125, 246, 0.08), transparent 34%),
    radial-gradient(circle at bottom right, rgba(240, 140, 59, 0.12), transparent 26%),
    linear-gradient(180deg, #f8f5ee, #ece6da 56%, #f7f4ec);
  background-size:28px 28px, 28px 28px, auto, auto, auto;
}

html[data-ui-theme="paper"] body,
body[data-ui-theme="paper"]{
  --bg:#f6eddc;
  --bg-soft:#fff8ec;
  --panel:rgba(255, 248, 236, 0.88);
  --panel-strong:rgba(255, 249, 239, 0.96);
  --panel-elevated:rgba(255, 252, 245, 0.98);
  --panel-border-strong:rgba(84, 57, 28, 0.12);
  --text:#2f2114;
  --muted:#7f6550;
  --line:rgba(84, 57, 28, 0.14);
  --accent:#a35f22;
  --accent-2:#356983;
  --thinking-across:#356983;
  --thinking-across-soft:rgba(53, 105, 131, 0.12);
  --thinking-down:#b45a6b;
  --thinking-down-soft:rgba(180, 90, 107, 0.12);
  --good:#56784b;
  --bad:#b14f43;
  --shadow:0 18px 38px rgba(70, 44, 16, 0.1);
  --panel-shadow:0 16px 34px rgba(70, 44, 16, 0.08);
  --font-body-stack:"Hoefler Text", "Georgia", "Times New Roman", serif;
  --font-display-stack:"Didot", "Bodoni 72", "Times New Roman", serif;
  --font-mono-stack:"Courier Prime", "Courier New", monospace;
  background:
    linear-gradient(rgba(114, 80, 48, 0.045) 1px, transparent 1px),
    radial-gradient(circle at top right, rgba(163, 95, 34, 0.08), transparent 34%),
    radial-gradient(circle at bottom left, rgba(53, 105, 131, 0.08), transparent 30%),
    linear-gradient(180deg, #f8efe0, #efe3cd 60%, #f7eedf);
  background-size:100% 28px, auto, auto, auto;
}

html[data-ui-theme="arcade"] body,
body[data-ui-theme="arcade"]{
  color-scheme:dark;
  --bg:#090312;
  --bg-soft:#140b27;
  --panel:rgba(19, 9, 39, 0.82);
  --panel-strong:rgba(23, 11, 47, 0.96);
  --panel-elevated:rgba(24, 11, 53, 0.98);
  --panel-border-strong:rgba(104, 247, 255, 0.24);
  --text:#fdf2ff;
  --muted:#baa2d3;
  --line:rgba(134, 107, 255, 0.2);
  --accent:#68f7ff;
  --accent-2:#ff66c8;
  --thinking-across:#68f7ff;
  --thinking-across-soft:rgba(104, 247, 255, 0.16);
  --thinking-down:#ff66c8;
  --thinking-down-soft:rgba(255, 102, 200, 0.16);
  --good:#7aff8f;
  --bad:#ff6b9e;
  --shadow:0 26px 80px rgba(0, 0, 0, 0.46);
  --panel-shadow:0 24px 58px rgba(8, 3, 16, 0.5);
  --font-body-stack:"Avenir Next Condensed", "Trebuchet MS", sans-serif;
  --font-display-stack:"Impact", "Haettenschweiler", "Arial Narrow Bold", sans-serif;
  --font-mono-stack:"OCR A Std", "Courier New", monospace;
  --theme-page-background:
    linear-gradient(90deg, rgba(104,247,255,0.08) 1px, transparent 1px),
    linear-gradient(rgba(255,102,200,0.08) 1px, transparent 1px),
    radial-gradient(circle at top left, rgba(104, 247, 255, 0.18), transparent 32%),
    radial-gradient(circle at 80% 20%, rgba(255, 102, 200, 0.16), transparent 24%),
    linear-gradient(180deg, #090312, #130922 58%, #090312);
  background:var(--theme-page-background);
  background-size:24px 24px, 24px 24px, auto, auto, auto;
  background-attachment:fixed, fixed, fixed, fixed, fixed;
  background-color:#090312;
}

html[data-ui-theme="arcade2"] body,
body[data-ui-theme="arcade2"]{
  color-scheme:dark;
  --bg:#08010f;
  --bg-soft:#140321;
  --panel:rgba(26, 8, 46, 0.84);
  --panel-strong:rgba(31, 10, 57, 0.95);
  --panel-elevated:rgba(34, 10, 63, 0.98);
  --panel-border-strong:rgba(173, 102, 255, 0.3);
  --text:#fff2ff;
  --muted:#c7a9e8;
  --line:rgba(174, 112, 255, 0.2);
  --accent:#9d6bff;
  --accent-2:#ff4fd8;
  --thinking-across:#9d6bff;
  --thinking-across-soft:rgba(157, 107, 255, 0.18);
  --thinking-down:#ff4fd8;
  --thinking-down-soft:rgba(255, 79, 216, 0.18);
  --good:#7affb6;
  --bad:#ff749b;
  --shadow:0 30px 92px rgba(0, 0, 0, 0.5);
  --panel-shadow:0 26px 62px rgba(8, 2, 17, 0.56);
  --font-body-stack:"Avenir Next Condensed", "Trebuchet MS", sans-serif;
  --font-display-stack:"Impact", "Haettenschweiler", "Arial Narrow Bold", sans-serif;
  --font-mono-stack:"OCR A Std", "Courier New", monospace;
  --theme-page-background:
    linear-gradient(90deg, rgba(157,107,255,0.08) 1px, transparent 1px),
    linear-gradient(rgba(255,79,216,0.08) 1px, transparent 1px),
    radial-gradient(circle at 16% 18%, rgba(157, 107, 255, 0.28), transparent 26%),
    radial-gradient(circle at 84% 16%, rgba(255, 79, 216, 0.22), transparent 18%),
    radial-gradient(circle at 50% 100%, rgba(104, 247, 255, 0.1), transparent 28%),
    linear-gradient(180deg, #08010f, #140321 48%, #08010f);
  background:var(--theme-page-background);
  background-size:20px 20px, 20px 20px, auto, auto, auto, auto;
  background-attachment:fixed, fixed, fixed, fixed, fixed, fixed;
  background-color:#08010f;
}

html[data-ui-theme="confetti"] body,
body[data-ui-theme="confetti"]{
  --bg:#fff1f4;
  --bg-soft:#ffffff;
  --panel:rgba(255, 255, 255, 0.84);
  --panel-strong:rgba(255, 255, 255, 0.94);
  --panel-elevated:rgba(255, 255, 255, 0.96);
  --panel-border-strong:rgba(255, 115, 156, 0.18);
  --text:#3f2440;
  --muted:#7f627f;
  --line:rgba(122, 86, 126, 0.14);
  --accent:#ff7a59;
  --accent-2:#5a8cff;
  --thinking-across:#5a8cff;
  --thinking-across-soft:rgba(90, 140, 255, 0.13);
  --thinking-down:#ff7db7;
  --thinking-down-soft:rgba(255, 125, 183, 0.14);
  --good:#40a76a;
  --bad:#da5872;
  --shadow:0 24px 54px rgba(160, 84, 129, 0.12);
  --panel-shadow:0 20px 44px rgba(160, 84, 129, 0.12);
  --font-body-stack:"Trebuchet MS", "Avenir Next", sans-serif;
  --font-display-stack:"Cooper Black", "Georgia", serif;
  --font-mono-stack:"Courier Prime", "Courier New", monospace;
  background:
    radial-gradient(circle at 16% 18%, rgba(255, 122, 89, 0.18), transparent 20%),
    radial-gradient(circle at 84% 24%, rgba(90, 140, 255, 0.16), transparent 18%),
    radial-gradient(circle at 78% 82%, rgba(255, 125, 183, 0.18), transparent 22%),
    linear-gradient(180deg, #fff7f9, #ffe8ee 58%, #fff7fa);
}

body[data-ui-theme="daylight"] .site-nav,
body[data-ui-theme="paper"] .site-nav,
body[data-ui-theme="arcade"] .site-nav,
body[data-ui-theme="arcade2"] .site-nav,
body[data-ui-theme="confetti"] .site-nav{
  order:-1;
  margin:0 auto 24px;
}

body[data-ui-theme="daylight"] .site-nav{
  justify-content:space-between;
  padding:10px 14px;
  border:1px solid rgba(31, 43, 53, 0.08);
  border-radius:22px;
  background:rgba(255,255,255,0.75);
  box-shadow:0 16px 38px rgba(31, 43, 53, 0.08);
  backdrop-filter:blur(18px);
}

body[data-ui-theme="daylight"] .site-nav-brand{
  color:#21496d;
  font-size:13px;
}

body[data-ui-theme="daylight"] .site-nav-link{
  min-height:34px;
  padding:6px 12px;
  color:#4e6272;
}

body[data-ui-theme="daylight"] .site-nav-link:hover,
body[data-ui-theme="daylight"] .site-nav-link:focus-visible{
  background:rgba(47, 125, 246, 0.08);
  color:#123452;
}

body[data-ui-theme="paper"] .site-nav{
  justify-content:flex-start;
  gap:10px 18px;
  padding:0 0 10px;
  border-top:none;
  border-bottom:1px solid rgba(84, 57, 28, 0.14);
}

body[data-ui-theme="paper"] .site-nav-links{
  gap:12px;
}

body[data-ui-theme="paper"] .site-nav-link{
  border-radius:0;
  padding:4px 0;
  min-height:30px;
  color:#5e4430;
  font-weight:700;
}

body[data-ui-theme="paper"] .site-nav-link:hover,
body[data-ui-theme="paper"] .site-nav-link:focus-visible{
  background:transparent;
  color:#2f2114;
  box-shadow:inset 0 -2px 0 rgba(163, 95, 34, 0.3);
}

body[data-ui-theme="arcade"] .site-nav{
  padding:10px 14px;
  border:1px solid rgba(104, 247, 255, 0.24);
  border-radius:22px;
  background:linear-gradient(135deg, rgba(16, 7, 31, 0.94), rgba(25, 10, 48, 0.96));
  box-shadow:0 20px 44px rgba(0, 0, 0, 0.36);
}

body[data-ui-theme="arcade2"] .site-nav{
  padding:10px 14px;
  border:1px solid rgba(173, 102, 255, 0.32);
  border-radius:24px;
  background:
    linear-gradient(135deg, rgba(19, 4, 34, 0.96), rgba(38, 9, 67, 0.97)),
    radial-gradient(circle at top right, rgba(255, 79, 216, 0.14), transparent 34%);
  box-shadow:0 22px 48px rgba(0, 0, 0, 0.42), 0 0 0 1px rgba(255, 79, 216, 0.08);
}

body[data-ui-theme="arcade"] .site-nav-brand{
  color:#68f7ff;
  font-size:13px;
}

body[data-ui-theme="arcade2"] .site-nav-brand{
  color:#ff95eb;
  font-size:13px;
  text-shadow:0 0 16px rgba(255, 79, 216, 0.38);
}

body[data-ui-theme="arcade"] .site-nav-link{
  min-height:34px;
  padding:6px 12px;
  border:1px solid rgba(134, 107, 255, 0.18);
  background:rgba(255,255,255,0.03);
  color:#f7ceff;
}

body[data-ui-theme="arcade2"] .site-nav-link{
  min-height:36px;
  padding:7px 12px;
  border:1px solid rgba(173, 102, 255, 0.18);
  background:linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.02));
  color:#ffd7f7;
}

body[data-ui-theme="arcade"] .site-nav-link:hover,
body[data-ui-theme="arcade"] .site-nav-link:focus-visible{
  background:rgba(104, 247, 255, 0.12);
  color:#ffffff;
  box-shadow:0 0 0 1px rgba(104, 247, 255, 0.16), 0 0 22px rgba(104, 247, 255, 0.14);
}

body[data-ui-theme="arcade2"] .site-nav-link:hover,
body[data-ui-theme="arcade2"] .site-nav-link:focus-visible{
  background:rgba(255, 79, 216, 0.12);
  color:#ffffff;
  box-shadow:0 0 0 1px rgba(255, 79, 216, 0.18), 0 0 24px rgba(157, 107, 255, 0.2);
}

body[data-ui-theme="confetti"] .site-nav{
  padding:10px 14px;
  border:1px solid rgba(255, 125, 183, 0.14);
  border-radius:26px;
  background:rgba(255, 255, 255, 0.74);
  box-shadow:0 18px 38px rgba(160, 84, 129, 0.1);
  backdrop-filter:blur(18px);
}

body[data-ui-theme="confetti"] .site-nav-brand{
  color:#cb4f73;
  font-size:13px;
}

body[data-ui-theme="confetti"] .site-nav-link{
  min-height:34px;
  padding:6px 12px;
  background:rgba(255,255,255,0.5);
  color:#6f4d72;
}

body[data-ui-theme="confetti"] .site-nav-link:hover,
body[data-ui-theme="confetti"] .site-nav-link:focus-visible{
  background:rgba(255, 122, 89, 0.12);
  color:#4d2d53;
}

.site-nav-theme-toggle{
  display:none;
  align-items:center;
  gap:8px;
  min-height:36px;
  padding:6px 12px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:999px;
  background:rgba(255,255,255,0.04);
  color:var(--text);
  cursor:pointer;
}

.site-nav-theme-toggle-icon{
  font-size:16px;
  line-height:1;
}

body.theme-drawer-nav .site-nav{
  justify-content:space-between;
}

body.theme-drawer-nav .site-nav-theme-toggle{
  display:inline-flex;
}

body.theme-drawer-nav .site-nav-links{
  width:100%;
  max-height:0;
  overflow:hidden;
  opacity:0;
  transform:translateY(-6px);
  display:grid;
  grid-template-columns:1fr;
  transition:max-height .24s ease, opacity .2s ease, transform .24s ease, margin-top .24s ease;
}

body.theme-drawer-nav.theme-nav-open .site-nav-links{
  max-height:420px;
  margin-top:10px;
  opacity:1;
  transform:translateY(0);
}

body.theme-drawer-nav .site-nav-link{
  width:100%;
}

body[data-ui-theme="daylight"] .content-card,
body[data-ui-theme="paper"] .content-card,
body[data-ui-theme="confetti"] .content-card{
  backdrop-filter:blur(18px);
}

body[data-ui-theme="daylight"] .content-card{
  border-color:rgba(31, 43, 53, 0.08);
}

body[data-ui-theme="paper"] .content-card{
  border-color:rgba(84, 57, 28, 0.1);
  box-shadow:0 14px 28px rgba(70, 44, 16, 0.06);
}

body[data-ui-theme="arcade"] .content-card{
  border-color:rgba(104, 247, 255, 0.2);
  box-shadow:0 0 0 1px rgba(255, 102, 200, 0.08), 0 18px 44px rgba(0, 0, 0, 0.36);
}

body[data-ui-theme="arcade2"] .content-card{
  border-color:rgba(173, 102, 255, 0.26);
  box-shadow:0 0 0 1px rgba(255, 79, 216, 0.1), 0 18px 46px rgba(0, 0, 0, 0.4);
}

body[data-ui-theme="confetti"] .content-card{
  border-color:rgba(255, 122, 89, 0.12);
}

body[data-ui-theme="arcade"] .btn,
body[data-ui-theme="arcade"] .btn-ghost{
  border-radius:14px;
}

body[data-ui-theme="arcade2"] .btn,
body[data-ui-theme="arcade2"] .btn-ghost{
  border-radius:12px;
}

body[data-ui-theme="arcade"] .start-hero-card,
body[data-ui-theme="arcade"] .start-test-bar,
body[data-ui-theme="arcade"] .start-intro-dialog,
body[data-ui-theme="arcade"] .start-intro-card,
body[data-ui-theme="arcade"] .start-mode-card,
body[data-ui-theme="arcade"] .start-action-card,
body[data-ui-theme="arcade"] .hero-copy,
body[data-ui-theme="arcade"] .hero-card,
body[data-ui-theme="arcade"] .controls,
body[data-ui-theme="arcade"] .board-panel,
body[data-ui-theme="arcade"] .solution-panel,
body[data-ui-theme="arcade"] .pool-stats-panel,
body[data-ui-theme="arcade"] .competition-room-head,
body[data-ui-theme="arcade"] .competition-room-card,
body[data-ui-theme="arcade"] .competition-room-summary,
body[data-ui-theme="arcade"] .competition-run-panel,
body[data-ui-theme="arcade"] .resolution-shell > .content-card{
  border-color:rgba(104, 247, 255, 0.2);
  box-shadow:
    0 0 0 1px rgba(255, 102, 200, 0.08),
    0 24px 56px rgba(0, 0, 0, 0.38),
    inset 0 1px 0 rgba(255,255,255,0.05);
}

body[data-ui-theme="arcade"] .start-hero-card,
body[data-ui-theme="arcade"] .start-test-bar,
body[data-ui-theme="arcade"] .start-intro-dialog,
body[data-ui-theme="arcade"] .start-mode-card,
body[data-ui-theme="arcade"] .hero-copy{
  background:
    radial-gradient(circle at 82% 12%, rgba(104, 247, 255, 0.18), transparent 22%),
    radial-gradient(circle at 14% 100%, rgba(255, 102, 200, 0.16), transparent 28%),
    linear-gradient(145deg, rgba(21, 10, 42, 0.96), rgba(10, 4, 21, 0.98));
}

body[data-ui-theme="arcade"] .start-intro-card,
body[data-ui-theme="arcade"] .start-mode-card,
body[data-ui-theme="arcade"] .start-action-card,
body[data-ui-theme="arcade"] .hero-card,
body[data-ui-theme="arcade"] .competition-room-card,
body[data-ui-theme="arcade"] .resolution-shell > .content-card{
  background:
    radial-gradient(circle at top right, rgba(104, 247, 255, 0.12), transparent 26%),
    linear-gradient(180deg, rgba(21, 9, 43, 0.96), rgba(11, 4, 24, 0.98));
}

body[data-ui-theme="arcade"] .controls,
body[data-ui-theme="arcade"] .board-panel,
body[data-ui-theme="arcade"] .solution-panel,
body[data-ui-theme="arcade"] .pool-stats-panel,
body[data-ui-theme="arcade"] .competition-room-head,
body[data-ui-theme="arcade"] .competition-room-summary,
body[data-ui-theme="arcade"] .competition-run-panel{
  background:
    linear-gradient(180deg, rgba(18, 8, 39, 0.96), rgba(9, 3, 21, 0.98)),
    radial-gradient(circle at top, rgba(104, 247, 255, 0.08), transparent 34%);
}

body[data-ui-theme="arcade"] .start-title,
body[data-ui-theme="arcade"] .hero-title,
body[data-ui-theme="arcade"] .panel-title,
body[data-ui-theme="arcade"] .start-action-title{
  text-transform:uppercase;
  text-shadow:0 0 24px rgba(255, 102, 200, 0.18);
}

body[data-ui-theme="arcade"] .hero-kicker,
body[data-ui-theme="arcade"] .panel-tag,
body[data-ui-theme="arcade"] .start-size-current,
body[data-ui-theme="arcade"] .start-action-pill,
body[data-ui-theme="arcade"] .hero-metric{
  border-color:rgba(104, 247, 255, 0.18);
  background:rgba(104, 247, 255, 0.08);
  color:#effbff;
  box-shadow:0 0 18px rgba(104, 247, 255, 0.08);
}

body[data-ui-theme="arcade"] .panel-tag-active-clue,
body[data-ui-theme="arcade"] .board-zoom-controls{
  background:
    linear-gradient(180deg, rgba(104, 247, 255, 0.1), rgba(255, 102, 200, 0.08)),
    rgba(255,255,255,0.03);
  border-color:rgba(104, 247, 255, 0.24);
}

body[data-ui-theme="arcade"] .btn{
  background:linear-gradient(135deg, #68f7ff, #ff66c8);
  color:#17091d;
  box-shadow:0 12px 28px rgba(255, 102, 200, 0.18);
}

body[data-ui-theme="arcade"] .btn-ghost{
  background:rgba(255,255,255,0.04);
  border-color:rgba(104, 247, 255, 0.18);
}

body[data-ui-theme="arcade"] .competition-room-shell .btn-ghost{
  background:
    linear-gradient(180deg, rgba(104, 247, 255, 0.12), rgba(255, 102, 200, 0.06)),
    rgba(18, 8, 39, 0.86);
  border-color:rgba(104, 247, 255, 0.28);
  color:#effbff;
}

body[data-ui-theme="arcade"] .competition-room-shell .btn-ghost:hover:not(:disabled){
  background:
    linear-gradient(180deg, rgba(104, 247, 255, 0.18), rgba(255, 102, 200, 0.1)),
    rgba(21, 10, 42, 0.94);
}

body[data-ui-theme="arcade2"] .start-hero-card,
body[data-ui-theme="arcade2"] .start-test-bar,
body[data-ui-theme="arcade2"] .start-intro-dialog,
body[data-ui-theme="arcade2"] .start-intro-card,
body[data-ui-theme="arcade2"] .start-mode-card,
body[data-ui-theme="arcade2"] .start-action-card,
body[data-ui-theme="arcade2"] .hero-copy,
body[data-ui-theme="arcade2"] .hero-card,
body[data-ui-theme="arcade2"] .controls,
body[data-ui-theme="arcade2"] .board-panel,
body[data-ui-theme="arcade2"] .solution-panel,
body[data-ui-theme="arcade2"] .pool-stats-panel,
body[data-ui-theme="arcade2"] .competition-room-head,
body[data-ui-theme="arcade2"] .competition-room-card,
body[data-ui-theme="arcade2"] .competition-room-summary,
body[data-ui-theme="arcade2"] .competition-run-panel,
body[data-ui-theme="arcade2"] .resolution-shell > .content-card{
  border-color:rgba(173, 102, 255, 0.28);
  box-shadow:
    0 0 0 1px rgba(255, 79, 216, 0.12),
    0 26px 60px rgba(0, 0, 0, 0.42),
    inset 0 0 0 1px rgba(255,255,255,0.02);
}

body[data-ui-theme="arcade2"] .start-hero-card,
body[data-ui-theme="arcade2"] .start-test-bar,
body[data-ui-theme="arcade2"] .start-intro-dialog,
body[data-ui-theme="arcade2"] .start-mode-card,
body[data-ui-theme="arcade2"] .hero-copy{
  background:
    linear-gradient(135deg, rgba(36, 8, 65, 0.98), rgba(12, 2, 25, 0.98)),
    radial-gradient(circle at top right, rgba(255, 79, 216, 0.16), transparent 22%),
    radial-gradient(circle at bottom left, rgba(157, 107, 255, 0.18), transparent 28%);
}

body[data-ui-theme="arcade2"] .start-intro-card,
body[data-ui-theme="arcade2"] .start-mode-card,
body[data-ui-theme="arcade2"] .start-action-card,
body[data-ui-theme="arcade2"] .hero-card,
body[data-ui-theme="arcade2"] .competition-room-card,
body[data-ui-theme="arcade2"] .resolution-shell > .content-card{
  background:
    linear-gradient(180deg, rgba(33, 7, 61, 0.96), rgba(12, 2, 24, 0.98)),
    radial-gradient(circle at 100% 0, rgba(255, 79, 216, 0.12), transparent 26%);
}

body[data-ui-theme="arcade2"] .controls,
body[data-ui-theme="arcade2"] .board-panel,
body[data-ui-theme="arcade2"] .solution-panel,
body[data-ui-theme="arcade2"] .pool-stats-panel,
body[data-ui-theme="arcade2"] .competition-room-head,
body[data-ui-theme="arcade2"] .competition-room-summary,
body[data-ui-theme="arcade2"] .competition-run-panel{
  background:
    linear-gradient(180deg, rgba(29, 7, 53, 0.98), rgba(10, 1, 20, 0.99)),
    linear-gradient(90deg, rgba(157, 107, 255, 0.06) 1px, transparent 1px);
  background-size:auto, 18px 18px;
}

body[data-ui-theme="arcade2"] .start-title,
body[data-ui-theme="arcade2"] .hero-title,
body[data-ui-theme="arcade2"] .panel-title,
body[data-ui-theme="arcade2"] .start-action-title{
  text-transform:uppercase;
  letter-spacing:-0.01em;
  text-shadow:
    0 0 16px rgba(255, 79, 216, 0.22),
    0 0 34px rgba(157, 107, 255, 0.18);
}

body[data-ui-theme="arcade2"] .hero-kicker,
body[data-ui-theme="arcade2"] .panel-tag,
body[data-ui-theme="arcade2"] .start-size-current,
body[data-ui-theme="arcade2"] .start-action-pill,
body[data-ui-theme="arcade2"] .hero-metric{
  border-color:rgba(173, 102, 255, 0.2);
  background:
    linear-gradient(180deg, rgba(255, 79, 216, 0.1), rgba(157, 107, 255, 0.08)),
    rgba(255,255,255,0.03);
  color:#fff0ff;
  box-shadow:0 0 20px rgba(157, 107, 255, 0.08);
}

body[data-ui-theme="arcade2"] .start-size-option,
body[data-ui-theme="arcade2"] .controls-group,
body[data-ui-theme="arcade2"] .pool-stat-card,
body[data-ui-theme="arcade2"] .seed-presence-panel,
body[data-ui-theme="arcade2"] .seed-leaderboard-panel,
body[data-ui-theme="arcade2"] .mobile-entry-list-panel{
  border-color:rgba(173, 102, 255, 0.16);
  background:rgba(255,255,255,0.03);
}

body[data-ui-theme="arcade2"] .panel-tag-active-clue,
body[data-ui-theme="arcade2"] .board-zoom-controls{
  background:
    linear-gradient(180deg, rgba(255, 79, 216, 0.12), rgba(157, 107, 255, 0.12)),
    rgba(255,255,255,0.03);
  border-color:rgba(255, 79, 216, 0.26);
  box-shadow:0 0 22px rgba(255, 79, 216, 0.1);
}

body[data-ui-theme="arcade2"] .btn{
  background:linear-gradient(135deg, #9d6bff, #ff4fd8);
  color:#17061f;
  box-shadow:0 14px 30px rgba(157, 107, 255, 0.24);
}

body[data-ui-theme="arcade2"] .btn-ghost{
  background:rgba(255,255,255,0.04);
  border-color:rgba(173, 102, 255, 0.2);
  color:#ffe8ff;
}

body[data-ui-theme="arcade2"] .competition-room-shell .btn-ghost{
  background:
    linear-gradient(180deg, rgba(173, 102, 255, 0.14), rgba(255, 79, 216, 0.08)),
    rgba(26, 6, 46, 0.9);
  border-color:rgba(173, 102, 255, 0.32);
  color:#f7efff;
}

body[data-ui-theme="arcade2"] .competition-room-shell .btn-ghost:hover:not(:disabled){
  background:
    linear-gradient(180deg, rgba(173, 102, 255, 0.18), rgba(255, 79, 216, 0.12)),
    rgba(31, 7, 54, 0.96);
}

body[data-ui-theme="arcade2"] .start-test-bar:hover,
body[data-ui-theme="arcade2"] .start-test-bar:focus-visible,
body[data-ui-theme="arcade2"] .start-mode-card:hover,
body[data-ui-theme="arcade2"] .start-mode-card:focus-visible,
body[data-ui-theme="arcade2"] .start-action-card:hover,
body[data-ui-theme="arcade2"] .start-action-card:focus-visible,
body[data-ui-theme="arcade2"] .content-card:hover{
  transform:translateY(-2px);
  box-shadow:
    0 0 0 1px rgba(255, 79, 216, 0.14),
    0 28px 64px rgba(0, 0, 0, 0.48),
    0 0 34px rgba(157, 107, 255, 0.14);
}

body[data-ui-theme="arcade"] .select,
body[data-ui-theme="arcade"] .seed-entry-input,
body[data-ui-theme="arcade"] .builder-textarea,
body[data-ui-theme="arcade"] .competition-input,
body[data-ui-theme="arcade"] .competition-room-code-input,
body[data-ui-theme="arcade"] .test-prep-input,
body[data-ui-theme="arcade"] textarea,
body[data-ui-theme="arcade2"] .select,
body[data-ui-theme="arcade2"] .seed-entry-input,
body[data-ui-theme="arcade2"] .builder-textarea,
body[data-ui-theme="arcade2"] .competition-input,
body[data-ui-theme="arcade2"] .competition-room-code-input,
body[data-ui-theme="arcade2"] .test-prep-input,
body[data-ui-theme="arcade2"] textarea{
  color:var(--text);
  -webkit-text-fill-color:var(--text);
  caret-color:var(--accent);
}

body[data-ui-theme="arcade"] .select:disabled,
body[data-ui-theme="arcade"] .seed-entry-input:disabled,
body[data-ui-theme="arcade"] .builder-textarea:disabled,
body[data-ui-theme="arcade"] .competition-input:disabled,
body[data-ui-theme="arcade"] .competition-room-code-input:disabled,
body[data-ui-theme="arcade"] .test-prep-input:disabled,
body[data-ui-theme="arcade2"] .select:disabled,
body[data-ui-theme="arcade2"] .seed-entry-input:disabled,
body[data-ui-theme="arcade2"] .builder-textarea:disabled,
body[data-ui-theme="arcade2"] .competition-input:disabled,
body[data-ui-theme="arcade2"] .competition-room-code-input:disabled,
body[data-ui-theme="arcade2"] .test-prep-input:disabled{
  color:rgba(255, 236, 255, 0.58);
  -webkit-text-fill-color:rgba(255, 236, 255, 0.58);
}

body[data-ui-theme="arcade"] .select option,
body[data-ui-theme="arcade"] .seed-entry-input option,
body[data-ui-theme="arcade"] .competition-input option,
body[data-ui-theme="arcade2"] .select option,
body[data-ui-theme="arcade2"] .seed-entry-input option,
body[data-ui-theme="arcade2"] .competition-input option{
  color:#fff2ff;
  background:#1a0830;
}

body[data-ui-theme="arcade2"] .select option,
body[data-ui-theme="arcade2"] .seed-entry-input option,
body[data-ui-theme="arcade2"] .competition-input option{
  background:#22073c;
}

body[data-ui-theme="arcade"] input::placeholder,
body[data-ui-theme="arcade"] textarea::placeholder,
body[data-ui-theme="arcade2"] input::placeholder,
body[data-ui-theme="arcade2"] textarea::placeholder{
  color:rgba(255, 232, 255, 0.46);
  -webkit-text-fill-color:rgba(255, 232, 255, 0.46);
}

body[data-ui-theme="arcade"] .cellLetter,
body[data-ui-theme="arcade"] .cell.clue .clueText,
body[data-ui-theme="arcade"] .solutionSlotValue,
body[data-ui-theme="arcade"] .mobileEntrySlotValue,
body[data-ui-theme="arcade"] .seed-lobby-chat-name,
body[data-ui-theme="arcade"] .seed-lobby-chat-text,
body[data-ui-theme="arcade"] .seed-lobby-title,
body[data-ui-theme="arcade"] .round-presence-pill,
body[data-ui-theme="arcade2"] .cellLetter,
body[data-ui-theme="arcade2"] .cell.clue .clueText,
body[data-ui-theme="arcade2"] .solutionSlotValue,
body[data-ui-theme="arcade2"] .mobileEntrySlotValue,
body[data-ui-theme="arcade2"] .seed-lobby-chat-name,
body[data-ui-theme="arcade2"] .seed-lobby-chat-text,
body[data-ui-theme="arcade2"] .seed-lobby-title,
body[data-ui-theme="arcade2"] .round-presence-pill{
  color:var(--text);
}

body[data-ui-theme="arcade"] .controls-group-play .btn,
body[data-ui-theme="arcade"] .controls-group-play .btnIcon,
body[data-ui-theme="arcade"] .controls-group-play .timer,
body[data-ui-theme="arcade2"] .controls-group-play .btn,
body[data-ui-theme="arcade2"] .controls-group-play .btnIcon,
body[data-ui-theme="arcade2"] .controls-group-play .timer{
  color:var(--text);
}

body[data-ui-theme="paper"] .btn,
body[data-ui-theme="paper"] .btn-ghost{
  border-radius:12px;
}

body[data-ui-theme="confetti"] .btn,
body[data-ui-theme="confetti"] .btn-ghost{
  border-radius:18px;
}

.site-tools-theme-shell{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:80;
  display:grid;
  gap:10px;
}

.site-tools-diagnostics-shell{
  position:fixed;
  left:18px;
  bottom:18px;
  z-index:79;
  display:grid;
  gap:10px;
}

.site-tools-theme-toggle{
  display:inline-flex;
  align-items:center;
  gap:8px;
  justify-content:center;
  min-height:46px;
  padding:10px 14px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:16px;
  background:rgba(10, 18, 26, 0.78);
  color:var(--text);
  box-shadow:0 16px 32px rgba(0,0,0,0.24);
  backdrop-filter:blur(16px);
  cursor:pointer;
}

.site-tools-diagnostics-toggle{
  display:inline-flex;
  align-items:center;
  gap:10px;
  justify-content:center;
  min-height:46px;
  padding:10px 14px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:16px;
  background:rgba(10, 18, 26, 0.82);
  color:var(--text);
  box-shadow:0 16px 32px rgba(0,0,0,0.24);
  backdrop-filter:blur(16px);
  cursor:pointer;
}

.site-tools-diagnostics-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:24px;
  height:24px;
  padding:0 8px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  color:#08131d;
  background:#9cd6ff;
}

.site-tools-diagnostics-badge[data-state="warning"]{
  background:#f1c874;
}

.site-tools-diagnostics-badge[data-state="ok"]{
  background:#8be7b3;
}

.site-tools-theme-panel{
  width:min(320px, calc(100vw - 24px));
  padding:16px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:24px;
  background:rgba(10, 18, 26, 0.9);
  box-shadow:0 24px 44px rgba(0,0,0,0.34);
  backdrop-filter:blur(18px);
}

.site-tools-diagnostics-panel{
  display:flex;
  flex-direction:column;
  width:min(360px, calc(100vw - 24px));
  max-height:min(72vh, calc(100dvh - 120px));
  min-height:0;
  padding:16px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:24px;
  background:rgba(10, 18, 26, 0.92);
  box-shadow:0 24px 44px rgba(0,0,0,0.34);
  backdrop-filter:blur(18px);
  overflow:hidden;
}

.site-tools-diagnostics-shell[data-open="false"] .site-tools-diagnostics-panel{
  display:none !important;
}

.site-tools-diagnostics-shell[data-open="true"] .site-tools-diagnostics-panel{
  display:flex !important;
}

.site-tools-theme-head{
  display:grid;
  gap:4px;
  margin-bottom:12px;
}

.site-tools-diagnostics-head{
  flex:0 0 auto;
  display:grid;
  gap:10px;
  margin-bottom:12px;
}

.site-tools-diagnostics-head strong{
  display:block;
  font-size:16px;
}

.site-tools-diagnostics-head span{
  color:var(--muted);
  font-size:12px;
}

.site-tools-diagnostics-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.site-tools-diagnostics-action{
  min-height:38px;
  padding-inline:12px;
}

.site-tools-diagnostics-body{
  flex:1 1 auto;
  min-height:0;
  display:grid;
  gap:10px;
  overflow:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  scrollbar-gutter:stable;
  padding-right:4px;
}

.site-tools-diagnostics-item{
  display:grid;
  gap:6px;
  padding:11px 12px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:16px;
  background:rgba(255,255,255,0.03);
}

.site-tools-diagnostics-item-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.site-tools-diagnostics-item-head strong{
  font-size:13px;
}

.site-tools-diagnostics-item-head span{
  color:var(--muted);
  font-size:11px;
}

.site-tools-diagnostics-item-text,
.site-tools-diagnostics-item-meta,
.site-tools-diagnostics-empty{
  margin:0;
}

.site-tools-diagnostics-item-text{
  line-height:1.45;
}

.site-tools-diagnostics-item-meta,
.site-tools-diagnostics-empty{
  color:var(--muted);
  font-size:12px;
  line-height:1.45;
}

.site-tools-theme-head strong{
  font-size:16px;
}

.site-tools-theme-head span{
  color:var(--muted);
  font-size:12px;
}

.site-tools-theme-options{
  display:grid;
  gap:8px;
}

.site-tools-theme-option{
  display:grid;
  gap:3px;
  width:100%;
  padding:11px 12px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:16px;
  background:rgba(255,255,255,0.03);
  color:var(--text);
  text-align:left;
  cursor:pointer;
  transition:transform .18s ease, border-color .18s ease, background .18s ease;
}

.site-tools-theme-option:hover,
.site-tools-theme-option:focus-visible{
  transform:translateY(-1px);
  border-color:rgba(255,255,255,0.14);
  background:rgba(255,255,255,0.06);
}

.site-tools-theme-option.is-active{
  border-color:rgba(255,255,255,0.18);
  background:linear-gradient(135deg, rgba(241, 200, 116, 0.12), rgba(146, 214, 255, 0.12));
}

.site-tools-theme-option-label{
  font-size:14px;
  font-weight:800;
}

.site-tools-theme-option-meta{
  color:var(--muted);
  font-size:12px;
  line-height:1.45;
}

.is-chromium-browser .board-panel,
.is-chromium-browser .solution-panel{
  will-change:auto;
  contain:layout;
  box-shadow:
    0 16px 36px rgba(0,0,0,0.28),
    inset 0 1px 0 rgba(255,255,255,0.04);
}

.is-chromium-browser .board-area::before{
  filter:blur(18px);
  opacity:0.58;
}

.is-chromium-browser .grid-shell,
.is-chromium-browser .solution-phrase-shell{
  contain:layout;
}

.is-chromium-browser .grid-shell{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.03),
    inset 0 0 0 1px rgba(255,255,255,0.015);
}

.is-chromium-browser .cell,
.is-chromium-browser .solutionSlot{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.05),
    0 6px 14px rgba(0,0,0,0.18);
  transition:border-color .12s ease, background .12s ease, box-shadow .12s ease, outline-color .12s ease;
}

.is-chromium-browser .cell:not(.block):hover,
.is-chromium-browser .solutionSlot:hover{
  transform:none;
}

.is-chromium-browser .cell.remote-presence-letter,
.is-chromium-browser .cell.remote-presence-clue,
.is-chromium-browser .solutionSlot.remote-presence-slot{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 0 0 1px var(--presence-glow, rgba(146, 214, 255, 0.08)),
    0 8px 18px rgba(0,0,0,0.2);
}

.is-chromium-browser .cell.remote-presence-letter.is-multi,
.is-chromium-browser .cell.remote-presence-clue.is-multi,
.is-chromium-browser .solutionSlot.remote-presence-slot.is-multi{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 0 0 1px var(--presence-glow, rgba(146, 214, 255, 0.08)),
    0 0 0 2px var(--presence-glow-secondary, rgba(255, 156, 197, 0.06)),
    0 8px 18px rgba(0,0,0,0.2);
}

.is-chromium-browser .cell.entry-active-letter,
.is-chromium-browser .cell.entry-active-clue,
.is-chromium-browser .cell.entry-thinking-across,
.is-chromium-browser .cell.entry-thinking-down,
.is-chromium-browser .solutionSlot.is-word-active,
.is-chromium-browser .solutionSlot.is-word-thinking-across,
.is-chromium-browser .solutionSlot.is-word-thinking-down{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 0 0 2px rgba(241, 200, 116, 0.06),
    0 8px 18px rgba(0,0,0,0.2);
}

.is-chromium-browser .cell.entry-thinking-across,
.is-chromium-browser .solutionSlot.is-word-thinking-across{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 0 0 2px var(--thinking-across-soft),
    0 8px 18px rgba(0,0,0,0.2);
}

.is-chromium-browser .cell.entry-thinking-down,
.is-chromium-browser .solutionSlot.is-word-thinking-down{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 0 0 2px var(--thinking-down-soft),
    0 8px 18px rgba(0,0,0,0.2);
}

.is-chromium-browser .cell.active,
.is-chromium-browser .cell.active-thinking,
.is-chromium-browser .cell.active-thinking-across,
.is-chromium-browser .cell.active-thinking-down,
.is-chromium-browser .solutionSlot.is-active,
.is-chromium-browser .solutionSlot.is-active-thinking-across,
.is-chromium-browser .solutionSlot.is-active-thinking-down{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.1),
    0 0 0 4px rgba(241, 200, 116, 0.12),
    0 12px 24px rgba(0,0,0,0.24);
}

.is-chromium-browser .cell.active-thinking,
.is-chromium-browser .cell.active-thinking-across,
.is-chromium-browser .solutionSlot.is-active-thinking-across{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.1),
    0 0 0 4px var(--thinking-across-soft),
    0 12px 24px rgba(0,0,0,0.24);
}

.is-chromium-browser .cell.active-thinking-down,
.is-chromium-browser .solutionSlot.is-active-thinking-down{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.1),
    0 0 0 4px var(--thinking-down-soft),
    0 12px 24px rgba(0,0,0,0.24);
}

.is-chromium-browser body[data-ui-theme="arcade"] .board-panel,
.is-chromium-browser body[data-ui-theme="arcade"] .solution-panel,
.is-chromium-browser body[data-ui-theme="arcade2"] .board-panel,
.is-chromium-browser body[data-ui-theme="arcade2"] .solution-panel{
  box-shadow:
    0 0 0 1px rgba(255,255,255,0.04),
    0 18px 40px rgba(0,0,0,0.32),
    inset 0 1px 0 rgba(255,255,255,0.04);
}

.is-chromium-browser body[data-ui-theme="arcade"] .grid-shell,
.is-chromium-browser body[data-ui-theme="arcade2"] .grid-shell,
.is-chromium-browser body[data-ui-theme="arcade"] .solution-phrase-shell,
.is-chromium-browser body[data-ui-theme="arcade2"] .solution-phrase-shell{
  background:
    linear-gradient(180deg, rgba(12, 9, 26, 0.82), rgba(15, 10, 32, 0.7)),
    radial-gradient(circle at top, rgba(146, 214, 255, 0.05), transparent 42%);
}

@media print{
  .site-tools-theme-shell,
  .site-tools-diagnostics-shell,
  .site-nav-theme-toggle{
    display:none !important;
  }
}

@media (max-width: 720px){
  .test-prep-grid{
    grid-template-columns:1fr;
  }

  .test-prep-probe-grid{
    grid-template-columns:1fr;
  }

  .test-prep-probe-row{
    flex-direction:column;
  }

  .test-prep-input{
    width:100%;
  }

  .builder-inline-settings{
    grid-template-columns:1fr;
  }

  .site-tools-theme-shell{
    right:12px;
    bottom:12px;
  }

  .site-tools-diagnostics-shell{
    left:12px;
    right:12px;
    bottom:72px;
  }

  .site-tools-diagnostics-panel{
    width:min(100%, calc(100vw - 24px));
    max-height:min(68vh, calc(100dvh - 156px));
  }

  body[data-ui-theme="daylight"] .site-nav,
  body[data-ui-theme="paper"] .site-nav,
  body[data-ui-theme="arcade"] .site-nav,
  body[data-ui-theme="arcade2"] .site-nav,
body[data-ui-theme="confetti"] .site-nav{
    margin-bottom:18px;
  }
}

@keyframes copy-feedback-pop{
  0%{
    transform:scale(1);
  }
  35%{
    transform:scale(1.03);
  }
  100%{
    transform:scale(1);
  }
}
