:root{--night:#141a2e;--night-2:#1c2440;--night-3:#26304f;--line:#333e63;--moon:#f1ead6;--mist:#9aa3bf;--lantern:#eeaa3f;--lantern-ink:#231602;--wolf:#e0515b;--seer:#a98bf0;--medium:#4cc3b2;--knight:#6aa6f2;--good:#7ad19a;--r-s:10px;--r-l:18px;--font:"M PLUS 1p","Hiragino Sans","Noto Sans JP",system-ui,sans-serif;--display:"Dela Gothic One","Hiragino Sans","Noto Sans JP",sans-serif;box-sizing:border-box;padding-top:env(safe-area-inset-top,0);color-scheme:dark}*,::after,::before{box-sizing:border-box}html{-webkit-text-size-adjust:100%;background:var(--night)}body{margin:0;min-height:100vh;background:radial-gradient(120% 60% at 85% -10%,rgba(241,234,214,.1),transparent 60%),var(--night);color:var(--moon);font-family:var(--font);font-size:16px;line-height:1.6}button,input,select{font:inherit;color:inherit}:focus-visible{outline:3px solid var(--lantern);outline-offset:2px}.bar{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:720px;margin:0 auto;padding:16px 18px 4px}.brand{font-family:var(--font);font-weight:700;font-size:1.05rem;letter-spacing:.08em;display:flex;align-items:center;gap:10px}.brand::before{content:"";width:22px;height:22px;border-radius:50%;background:var(--moon);box-shadow:inset -6px -3px 0 0 var(--night-3),0 0 18px rgba(241,234,214,.35)}.who{font-size:.85rem;color:var(--mist);background:var(--night-2);border:1px solid var(--line);padding:4px 12px;border-radius:999px}.who:empty{display:none}.who strong{color:var(--moon);font-weight:700}.tabs{position:fixed;left:0;right:0;bottom:0;z-index:10;display:flex;justify-content:center;gap:4px;padding:8px 12px calc(8px + env(safe-area-inset-bottom,0px));background:rgba(20,26,46,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--line)}.tabs button{flex:1;max-width:200px;border:0;background:0 0;padding:10px 6px;border-radius:var(--r-s);color:var(--mist);font-weight:700;font-size:.95rem;cursor:pointer}.tabs button[aria-current=page]{color:var(--lantern-ink);background:var(--lantern)}.app{max-width:720px;margin:0 auto;padding:12px 18px 8px}.status{max-width:720px;margin:0 auto;padding:4px 18px calc(96px + env(safe-area-inset-bottom,0px));font-size:.72rem;color:var(--mist);text-align:center}.status.offline{color:var(--wolf);font-weight:700}.status:empty{display:none}h2{font-family:var(--display);font-weight:400;font-size:2rem;line-height:1.2;margin:14px 0 6px;letter-spacing:.02em}h3{font-size:1rem;margin:20px 0 8px;color:var(--moon)}p{margin:6px 0}.muted{color:var(--mist)}.small{font-size:.85rem}.state-line{display:inline-flex;align-items:center;gap:8px;font-size:.85rem;color:var(--mist);margin-bottom:6px}.state-line b{color:var(--night);background:var(--moon);padding:2px 12px;border-radius:999px;font-weight:700}.panel{background:var(--night-2);border:1px solid var(--line);border-radius:var(--r-l);padding:16px;margin:14px 0}.panel h3:first-child{margin-top:0}.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.row.spread{justify-content:space-between}.stack>*+*{margin-top:10px}.btn{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);background:var(--night-3);color:var(--moon);padding:10px 16px;min-height:48px;border-radius:var(--r-s);font-weight:700;cursor:pointer;text-decoration:none}.btn:hover{border-color:var(--mist)}.btn.primary{background:var(--lantern);border-color:var(--lantern);color:var(--lantern-ink);box-shadow:0 6px 24px rgba(238,170,63,.25)}.btn.danger{color:var(--wolf);border-color:rgba(224,81,91,.5);background:0 0}.btn.block{width:100%;min-height:54px;font-size:1.02rem;margin-top:4px}.btn:disabled{opacity:.4;cursor:not-allowed;box-shadow:none}.linkbtn{border:0;background:0 0;color:var(--lantern);padding:6px 2px;cursor:pointer;font-weight:700;font-size:.9rem;white-space:nowrap}input[type=password],input[type=text],select{display:block;width:100%;min-height:48px;padding:10px 12px;background:var(--night);color:var(--moon);border:1px solid var(--line);border-radius:var(--r-s)}select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--mist) 50%),linear-gradient(135deg,var(--mist) 50%,transparent 50%);background-position:calc(100% - 18px) 50%,calc(100% - 13px) 50%;background-size:5px 5px;background-repeat:no-repeat;padding-right:34px}label.field{display:block;font-size:.82rem;color:var(--mist)}label.field>input,label.field>select{margin-top:6px}details summary{cursor:pointer}.games{display:flex;gap:8px;overflow-x:auto;padding:4px 0 6px;scrollbar-width:none}.games::-webkit-scrollbar{display:none}.game-chip{flex:0 0 auto;border:1px solid var(--line);background:var(--night-2);color:var(--moon);border-radius:999px;padding:8px 16px;cursor:pointer;font-weight:700;white-space:nowrap}.game-chip[aria-pressed=true]{background:var(--moon);color:var(--night);border-color:var(--moon)}.game-chip .st{font-weight:500;opacity:.7;font-size:.78rem;margin-left:6px}.list{list-style:none;margin:0;padding:0}.list>li{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line)}.list>li:last-child{border-bottom:0}.seat{flex:0 0 auto;width:38px;height:38px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-family:var(--display);font-size:1rem;font-variant-numeric:tabular-nums;background:var(--night-3);color:var(--moon);border:1px solid var(--line)}.name{flex:1 1 auto;min-width:0;overflow-wrap:anywhere;font-weight:500}.role{flex:0 0 auto;font-size:.82rem;font-weight:700;padding:3px 12px;border-radius:999px;border:1px solid var(--line);color:var(--mist)}.role.werewolf{background:var(--wolf);border-color:var(--wolf);color:#fff}.role.madman{color:var(--wolf);border-color:var(--wolf)}.role.seer{color:var(--seer);border-color:var(--seer)}.role.medium{color:var(--medium);border-color:var(--medium)}.role.knight{color:var(--knight);border-color:var(--knight)}.role.villager{color:var(--moon)}.tag{display:inline-block;font-size:.72rem;font-weight:700;padding:1px 9px;border-radius:999px;border:1px solid currentColor;margin-left:8px;vertical-align:2px;white-space:nowrap}.tag.white{color:var(--night);background:var(--moon);border-color:var(--moon)}.tag.absent{color:var(--mist)}.tag.done{color:var(--good)}.budget{font-family:var(--display);font-size:3.4rem;line-height:1;margin:6px 0 2px;font-variant-numeric:tabular-nums;color:var(--lantern)}.budget small{font-family:var(--font);font-size:.9rem;color:var(--mist);margin-left:8px;font-weight:500}.pips{display:flex;flex-wrap:wrap;gap:7px;margin:12px 0 8px}.pip{width:18px;height:18px;border-radius:50%;background:var(--lantern);box-shadow:0 0 10px rgba(238,170,63,.45)}.pip.used{background:0 0;box-shadow:inset 0 0 0 2px var(--line)}.stepper{display:flex;align-items:center;gap:4px;flex:0 0 auto}.stepper button{width:44px;height:44px;border-radius:12px;border:1px solid var(--line);background:var(--night-3);color:var(--moon);font-size:1.3rem;font-weight:700;cursor:pointer}.stepper button:last-child:not(:disabled){background:var(--lantern);border-color:var(--lantern);color:var(--lantern-ink)}.stepper button:disabled{opacity:.3}.stepper .val{width:2.2ch;text-align:center;font-family:var(--display);font-size:1.35rem;font-variant-numeric:tabular-nums}.stepper .val.zero{color:var(--mist);opacity:.6}.choice{display:flex;align-items:center;gap:12px;padding:10px 14px;margin:8px 0;border:1px solid var(--line);border-radius:var(--r-l);background:var(--night-2);cursor:pointer;transition:border-color .15s,background .15s}.choice input{position:absolute;opacity:0;pointer-events:none}.choice:has(input:checked){border-color:var(--lantern);background:rgba(238,170,63,.12)}.choice:has(input:checked) .seat{background:var(--lantern);color:var(--lantern-ink);border-color:var(--lantern)}.choice:has(input:focus-visible){outline:3px solid var(--lantern);outline-offset:2px}.choice.mine::after{content:"投票中";font-size:.72rem;font-weight:700;color:var(--lantern)}.mvp{position:relative;overflow:hidden;border-radius:var(--r-l);padding:18px 20px;margin:14px 0;background:linear-gradient(135deg,#3a2a0e,#1c2440 70%);border:1px solid rgba(238,170,63,.55)}.mvp::after{content:"MVP";position:absolute;right:-6px;bottom:-22px;font-family:var(--display);font-size:5.5rem;color:rgba(238,170,63,.1);line-height:1;pointer-events:none}.mvp .label{color:var(--lantern);font-weight:700;font-size:.85rem}.mvp .who-mvp{font-family:var(--display);font-size:2rem;line-height:1.3}.scroll{overflow-x:auto}table.results{border-collapse:collapse;width:100%;font-variant-numeric:tabular-nums}table.results td,table.results th{padding:10px 4px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap}table.results th{font-size:.75rem;color:var(--mist);font-weight:700}table.results .l{text-align:left;white-space:normal}table.results .l .s{display:inline-block;min-width:1.8em;font-family:var(--display);color:var(--mist);margin-right:4px}table.results td.total{font-family:var(--display);font-size:1.15rem;color:var(--moon)}table.results tr.is-mvp td{background:rgba(238,170,63,.12)}table.results tr.is-mvp td.total{color:var(--lantern)}table.results .rank{font-family:var(--display);color:var(--mist)}.linkbox{background:var(--night);border:1px dashed var(--line);border-radius:var(--r-s);padding:12px;word-break:break-all;font-size:.85rem;color:var(--moon)}.note{border-left:3px solid var(--lantern);padding:10px 14px;background:var(--night-2);border-radius:0 var(--r-s) var(--r-s) 0}.note.warn{border-left-color:var(--wolf)}.danger-zone{margin-top:32px;padding-top:16px;border-top:1px dashed var(--line)}.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(84px + env(safe-area-inset-bottom,0px));background:var(--moon);color:var(--night);padding:12px 18px;border-radius:var(--r-s);max-width:calc(100% - 32px);z-index:20;font-weight:700;box-shadow:0 10px 30px rgba(0,0,0,.4)}.toast.error{background:var(--wolf);color:#fff}.seat-grid{display:grid;grid-template-columns:38px 1fr;gap:8px 10px;align-items:center}@media (prefers-reduced-motion:reduce){*{transition:none!important}}
/* Black wolf / golden moon. Presentation only; role colours keep their meaning. */
:root {
  --night:#0e0c09; --night-2:#191610; --night-3:#272118;
  --line:#51432b; --moon:#f8f1df; --mist:#bdb29c;
  --lantern:#e6b65e; --lantern-ink:#211607;
  --wolf:#ff9390; --seer:#c7afff; --medium:#81dbc5; --knight:#9fc6ff; --good:#a2dcad;
  --r-s:9px; --r-l:15px;
  --display:"Noto Serif JP","Hiragino Mincho ProN","Yu Mincho",serif;
  --font:"M PLUS 1p","Hiragino Sans","Noto Sans JP",system-ui,sans-serif;
  --gold-line:rgba(230,182,94,.29);
  scrollbar-color:#695331 #100e0a;
}
html {background:#0b0907;scroll-padding-top:90px;scroll-padding-bottom:100px}
body {
  background:radial-gradient(ellipse at 50% 0%,rgba(179,118,34,.16),transparent 660px),
    repeating-linear-gradient(135deg,rgba(220,177,91,.016) 0 1px,transparent 1px 7px),#0e0c09;
  min-height:100svh;
}
body::before {content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;
  background:radial-gradient(ellipse at 0% 42%,rgba(166,107,29,.05),transparent 50%)}
a {color:var(--lantern)}
.bar {max-width:1120px;padding:21px 28px 19px;min-height:84px}
.brand {gap:12px;letter-spacing:.12em;line-height:1.3}
.brand::before {display:none}
.brand-symbol {display:flex;align-items:center;justify-content:center;width:42px;height:42px;
  color:#f2cc81;background:linear-gradient(145deg,rgba(232,183,90,.15),rgba(232,183,90,.025));
  border:1px solid rgba(232,183,90,.5);border-radius:50%;box-shadow:0 0 26px rgba(202,141,43,.08)}
.brand-symbol svg {width:29px;height:29px}
.brand-name {display:flex;flex-direction:column;font-family:var(--display);font-size:1.3rem;font-weight:700}
.brand-caption {font-family:"Cinzel",Georgia,serif;font-size:.56rem;letter-spacing:.24em;
  color:var(--lantern);font-weight:600;margin-top:5px}
.who {font-size:.77rem;background:#19150e;border-color:var(--gold-line);color:#d9c49e;
  padding:6px 15px;box-shadow:inset 0 1px rgba(255,225,165,.04);max-width:55%;overflow-wrap:anywhere}
.theme-hero {isolation:isolate;position:relative;overflow:hidden;max-width:1064px;margin:0 auto;
  min-height:260px;display:flex;align-items:center;justify-content:flex-end;
  background:#171009;border:1px solid rgba(230,182,94,.38);border-radius:3px;
  box-shadow:0 18px 70px rgba(0,0,0,.38),0 0 38px rgba(180,114,28,.05)}
.hero-art {position:absolute;inset:0;z-index:-2;background-image:url("/theme-gold-99786643a02e.webp");
  background-size:cover;background-position:center 41%;}
.theme-hero::before {content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(90deg,rgba(10,8,5,.03) 0%,rgba(10,8,5,.02) 28%,rgba(10,8,5,.73) 54%,rgba(10,8,5,.86) 100%),
    linear-gradient(0deg,rgba(7,6,4,.45),transparent 30%)}
.theme-hero::after {content:"";position:absolute;inset:9px;border:1px solid rgba(250,210,133,.2);pointer-events:none}
.hero-copy {width:47%;padding:30px 40px 32px 16px;text-shadow:0 2px 18px #000}
.hero-eyebrow {font-family:"Cinzel",Georgia,serif;letter-spacing:.26em;font-size:.64rem;
  color:#efd091;margin:0 0 13px;font-weight:600;display:flex;align-items:center;gap:10px}
.hero-eyebrow::before {content:"";width:25px;height:1px;background:var(--lantern);opacity:.8}
.hero-title {font-family:var(--display);font-size:clamp(1.7rem,3.1vw,2.25rem);font-weight:600;
  letter-spacing:.1em;line-height:1.65;margin:0;color:#fff6df}
.hero-title span {color:#f3c771}
.hero-description {font-size:.73rem;line-height:1.9;color:#d7c4a4;margin-top:14px;letter-spacing:.025em}
.tabs {max-width:1064px;position:sticky;top:12px;left:auto;right:auto;bottom:auto;
  margin:18px auto 0;padding:5px;gap:5px;border:1px solid var(--gold-line);border-radius:12px;
  background:rgba(22,18,12,.96);box-shadow:0 7px 25px rgba(0,0,0,.3)}
.tabs[hidden] {display:none}
.tabs button {max-width:none;min-height:49px;display:flex;align-items:center;justify-content:center;
  gap:9px;font-size:.85rem;letter-spacing:.05em;color:#c7bba4;transition:background .15s,color .15s}
.tabs button:hover {background:rgba(233,189,110,.08);color:#f9e6bd}
.tabs button::before {content:"";width:18px;height:18px;display:block;flex:0 0 auto;background:currentColor;
  mask:var(--nav-icon) center/contain no-repeat;-webkit-mask:var(--nav-icon) center/contain no-repeat}
.tabs button[data-tab=run] {--nav-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m9 5 10 7-10 7V5Z' fill='none' stroke='black' stroke-width='1.6' stroke-linejoin='round'/%3E%3Cpath d='M4 5v14' stroke='black' stroke-width='1.6'/%3E%3C/svg%3E")}
.tabs button[data-tab=tournaments] {--nav-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 3h8v6a4 4 0 0 1-8 0V3Zm4 10v7m-4 0h8M8 5H4v2a4 4 0 0 0 4 4m8-6h4v2a4 4 0 0 1-4 4'/%3E%3C/g%3E%3C/svg%3E")}
.tabs button[data-tab=people] {--nav-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'%3E%3Ccircle cx='9' cy='7' r='3'/%3E%3Cpath d='M3 20v-3a6 6 0 0 1 12 0v3M17 4a3 3 0 0 1 0 6m1 4a5 5 0 0 1 3 5'/%3E%3C/g%3E%3C/svg%3E")}
.tabs button[data-tab=connect] {--nav-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'%3E%3Cpath d='m9 15 6-6M7 17l-1 1a4 4 0 0 1-6-6l4-4a4 4 0 0 1 6 0m4 0 1-1a4 4 0 0 1 6 6l-4 4a4 4 0 0 1-6 0' transform='translate(2 -1)'/%3E%3C/g%3E%3C/svg%3E")}
.tabs button[data-tab=results] {--nav-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round'%3E%3Cpath d='M4 20V9h4v11m4 0V4h4v16m4 0V12h2v8M2 20h21'/%3E%3C/g%3E%3C/svg%3E")}
.tabs button[data-tab=score],.tabs button[data-tab=vote] {--nav-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.6' stroke-linejoin='round'%3E%3Cpath d='M5 12H3v9h18v-9h-2M7 5l6-3 4 8-6 3zM7 15h10'/%3E%3C/g%3E%3C/svg%3E")}
.tabs button[data-tab=roles] {--nav-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.6'%3E%3Crect x='4' y='5' width='12' height='16' rx='2'/%3E%3Cpath d='M8 2h10a2 2 0 0 1 2 2v12M8 10h4m-4 5h4'/%3E%3C/g%3E%3C/svg%3E")}
.tabs button[aria-current=page] {background:linear-gradient(130deg,#f0cb7e,#d7a34d);color:#211707;
  box-shadow:0 2px 12px rgba(209,146,45,.15),inset 0 1px rgba(255,246,215,.45)}
.app {max-width:1064px;padding:20px 0 12px}
h2 {font-size:1.8rem;font-weight:700;letter-spacing:.08em;line-height:1.5;margin:10px 0 10px;color:#f9edcf}
.app>h2 {display:flex;align-items:center;gap:13px}
.app>h2::before {content:"";display:block;width:3px;height:1.1em;flex:0 0 auto;
  background:linear-gradient(0deg,#9b7132,#f1cc7e);box-shadow:0 0 13px rgba(225,170,74,.2)}
h3 {letter-spacing:.045em;font-size:1rem;font-weight:700}
.app>p {color:#bdb39f;font-size:.84rem;line-height:1.85}
.panel {background:linear-gradient(130deg,rgba(43,34,22,.45),transparent 60%),#191610;
  border:1px solid var(--gold-line);box-shadow:inset 0 1px rgba(255,218,151,.04),0 8px 28px rgba(0,0,0,.16);
  padding:23px 25px;margin:17px 0}
.panel h3:first-child {font-family:var(--display);font-size:1.15rem;color:#f3d595;margin-bottom:9px}
.panel h3:first-child::after {content:"";display:block;width:32px;height:1px;background:#8f6c35;margin:12px 0}
.panel.stack>*+* {margin-top:15px}
.panel.stack>h3+p {margin-top:0;line-height:1.9}
.btn {background:linear-gradient(150deg,#302719,#241e14);border-color:#6a5330;border-radius:8px;
  min-height:48px;padding:11px 18px;letter-spacing:.015em;box-shadow:inset 0 1px rgba(255,219,153,.045)}
.btn:hover {border-color:#bd9652;background:linear-gradient(150deg,#3b2e1b,#2c2317)}
.btn.primary {background:linear-gradient(120deg,#f1ce85,#dfae54);border-color:#e4b76b;
  color:#211708;box-shadow:0 4px 19px rgba(203,144,43,.14),inset 0 1px rgba(255,248,216,.55)}
.btn.primary:hover {background:linear-gradient(120deg,#ffe2a4,#ecc16e);border-color:#f4d391}
.btn.danger {background:rgba(118,39,35,.09);border-color:rgba(255,147,144,.4);color:var(--wolf)}
.btn:disabled {opacity:.45}
input[type=password],input[type=text],select,textarea {background-color:#0f0e0b;border-color:#54452c;
  color:#fff2d9;border-radius:8px;box-shadow:inset 0 2px 6px rgba(0,0,0,.25);min-height:48px}
input:focus,select:focus,textarea:focus {border-color:#dfb567}
input::placeholder,textarea::placeholder {color:#aa9c82;opacity:1}
input:disabled,select:disabled,textarea:disabled {color:#a89b85;background-color:#16130f;opacity:.6}
label.field {color:#c6b89d;font-size:.78rem;line-height:1.8}
label.field>input,label.field>select {margin-top:7px}
.note {background:#211b12;border-color:#d5a44e;color:#e1cfab;line-height:1.85;font-size:.85rem}
.note.warn {background:#281b16;border-color:#df9f65;color:#ebc7a8}
.note.offline,.status.offline {color:var(--wolf)}
.state-line b,.game-chip[aria-pressed=true] {background:#e7c989;color:#231807;border-color:#e7c989}
.game-chip {background:#211b12;border-color:#665130}
.list>li {border-color:rgba(181,144,78,.2);padding:13px 0}
.seat {font-family:"Cinzel",Georgia,serif;background:#2b2316;border-color:#6b542f;color:#f1d295}
.role.werewolf {background:#8d302e;border-color:#c96c65;color:#fff2eb}
.tag {letter-spacing:.025em;font-size:.68rem;padding:2px 9px}
.budget,.stepper .val {font-family:"Cinzel",Georgia,serif;font-weight:600}
.stepper button {background:#302719;border-color:#6a5330}
.choice {background:#1b1710;border-color:#51432b}
.choice:has(input:checked) {background:#302411;border-color:#dab16b}
.mvp {background:radial-gradient(ellipse at 100% 0%,rgba(192,135,37,.2),transparent 70%),linear-gradient(120deg,#302412,#1a150e);
  border-color:#9c773e;padding:24px 26px;box-shadow:0 10px 32px rgba(0,0,0,.2)}
.mvp::after {font-family:"Cinzel",Georgia,serif;font-size:5.3rem;color:rgba(240,191,95,.09);bottom:-10px}
.mvp .who-mvp {font-size:1.8rem;font-weight:700;letter-spacing:.05em}
table.results th {background:rgba(185,139,61,.06);color:#c5b596;letter-spacing:.04em;padding:13px 10px}
table.results td {padding:13px 10px;border-color:rgba(181,144,78,.22)}
table.results .rank,table.results .l .s {font-family:"Cinzel",Georgia,serif}
table.results td.total {font-family:"Cinzel",Georgia,serif;font-weight:600}
table.results tr.is-mvp td {background:rgba(213,165,75,.1);color:#f7d78e}
.linkbox {background:#100e0a;border-color:#7a6035;color:#e9d8b3}
.toast {background:#f3d79e;color:#211707;border:1px solid #d6ab61;box-shadow:0 10px 35px #000}
.toast.error {background:#7b302d;color:#fff2eb;border-color:#c8736b}
.status {max-width:1064px;padding:14px 20px 40px;font-size:.68rem;letter-spacing:.03em;color:#b4a78e}
.status::before {content:"JINROU CLASSIC";display:block;font-family:"Cinzel",Georgia,serif;
  color:#9b7c46;letter-spacing:.25em;font-size:.61rem;margin:12px 0 6px}
@media(min-width:821px) {
  .app:has(#tournament-name) {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:22px}
  .app:has(#tournament-name)>* {grid-column:1/-1}
  .app:has(#tournament-name)>.panel:has(#tournament-name),
  .app:has(#tournament-name)>.panel:has(#classic-name) {grid-column:auto;align-self:stretch}
}
@media(max-width:1120px) {
  .bar {padding-left:24px;padding-right:24px}
  .theme-hero,.tabs {margin-left:24px;margin-right:24px}
  .app {padding-left:24px;padding-right:24px}
}
@media(max-width:820px) {
  .theme-hero {min-height:230px}
  .hero-copy {width:49%;padding-right:25px}
  .hero-title {font-size:1.65rem}
  .hero-description {font-size:.68rem}
  .tabs button {gap:6px;font-size:.79rem}
  .app {max-width:720px}
}
@media(max-width:600px) {
  html {scroll-padding-top:12px}
  .bar {min-height:70px;padding:14px 18px;gap:8px}
  .brand {gap:9px}
  .brand-symbol {width:35px;height:35px;flex:0 0 auto}
  .brand-symbol svg {width:25px;height:25px}
  .brand-name {font-size:1.1rem}
  .brand-caption {font-size:.48rem;margin-top:4px}
  .who {padding:5px 11px;font-size:.71rem;max-width:49%}
  .theme-hero {margin:0 14px;min-height:184px;border-radius:2px}
  .theme-hero::after {inset:6px}
  .hero-art {background-position:28% 43%}
  .theme-hero::before {background:linear-gradient(90deg,rgba(9,7,4,.02),rgba(9,7,4,.1) 25%,rgba(9,7,4,.77) 52%,rgba(9,7,4,.88))}
  .hero-copy {width:51%;padding:19px 10px 20px 3px}
  .hero-eyebrow {font-size:.43rem;letter-spacing:.12em;gap:6px;margin-bottom:11px}
  .hero-eyebrow::before {width:12px}
  .hero-title {font-size:clamp(1.13rem,4.4vw,1.45rem);letter-spacing:.035em;line-height:1.75}
  .hero-description {font-size:.59rem;line-height:1.85;margin-top:10px;letter-spacing:0}
  .hero-description br {display:none}
  .tabs {position:fixed;top:auto;bottom:0;left:0;right:0;max-width:none;margin:0;padding:7px 9px calc(7px + env(safe-area-inset-bottom,0px));
    border:0;border-top:1px solid rgba(223,175,87,.35);border-radius:0;gap:3px;background:rgba(19,16,11,.97)}
  .tabs button {flex-direction:column;gap:4px;min-width:0;min-height:54px;padding:6px 2px;
    font-size:.61rem;letter-spacing:0;border-radius:8px;white-space:nowrap}
  .tabs button::before {width:18px;height:18px}
  .app {padding:17px 18px 8px}
  h2 {font-size:1.46rem;margin-top:6px;letter-spacing:.045em}
  .app>h2 {gap:10px}
  .app>p {font-size:.77rem}
  .panel {padding:19px 18px;margin:17px 0;border-radius:12px}
  .panel h3:first-child {font-size:1.05rem}
  .panel.stack>*+* {margin-top:14px}
  .small,.note {font-size:.79rem}
  label.field {font-size:.75rem}
  input[type=text],input[type=password],select,textarea {font-size:16px}
  .btn {padding:10px 13px;font-size:.87rem}
  .btn.block {font-size:.94rem}
  .row {gap:8px}
  .status {padding:8px 18px calc(96px + env(safe-area-inset-bottom,0px))}
  .toast {bottom:calc(85px + env(safe-area-inset-bottom,0px))}
  .mvp {padding:20px}
  .mvp .who-mvp {font-size:1.6rem}
  table.results th,table.results td {padding:11px 6px}
}
@media(prefers-reduced-motion:reduce) {* {scroll-behavior:auto!important;transition:none!important}}
@media(forced-colors:active) {
  .tabs button::before {background:ButtonText}
  .btn,.panel,input,select,.tabs {border:1px solid CanvasText}
  .theme-hero {background:Canvas}
}

/* Mobile correction: give the illustration and readable copy their own space. */
@media(max-width:600px) {
  body {background:radial-gradient(ellipse at 50% 0,rgba(163,107,32,.14),transparent 520px),#0e0c09}
  .bar {padding:14px 18px;min-height:68px}
  .theme-hero {display:block;min-height:0;margin:0 16px;border-radius:12px;background:#17130d;
    box-shadow:0 10px 32px rgba(0,0,0,.22)}
  .hero-art {position:relative;inset:auto;z-index:0;width:100%;height:auto;aspect-ratio:1672/941;
    background-position:center;background-size:cover;border-bottom:1px solid rgba(230,182,94,.25)}
  .theme-hero::before,.theme-hero::after {display:none}
  .hero-copy {position:relative;z-index:1;width:100%;padding:18px 20px 20px;text-shadow:none}
  .hero-eyebrow {font-size:.625rem;line-height:1.5;letter-spacing:.15em;gap:9px;margin:0 0 10px}
  .hero-eyebrow::before {width:22px}
  .hero-title {font-size:1.5rem;line-height:1.55;letter-spacing:.045em}
  .hero-description {font-size:.875rem;line-height:1.85;color:#d5c6aa;margin-top:12px}
  .hero-description br {display:initial}
  .app {padding-top:18px}
  .app>p,.small,.note {font-size:.875rem;line-height:1.85}
  h2 {font-size:1.35rem;letter-spacing:.025em;line-height:1.65}
  label.field {font-size:.8125rem}
  .btn {font-size:.9375rem}
  .tabs button {font-size:.6875rem}
  /* Keep the illustrated header compact once the game controls are visible. */
  body:has(#tabs:not([hidden])) .hero-art {height:132px;aspect-ratio:auto;background-position:center 40%}
  body:has(#tabs:not([hidden])) .hero-copy {padding:12px 14px 14px}
  body:has(#tabs:not([hidden])) .hero-eyebrow,
  body:has(#tabs:not([hidden])) .hero-description {display:none}
  body:has(#tabs:not([hidden])) .hero-title {font-size:1.0625rem;line-height:1.65;letter-spacing:.02em}
  body:has(#tabs:not([hidden])) .hero-title br {display:none}
  /* An explicit entry card avoids the floating one-line message on an empty page. */
  .app:has(#setup-secret) {margin:18px 16px 0;padding:20px;max-width:none;
    border:1px solid rgba(230,182,94,.25);border-radius:12px;background:#19150f}
  .app:has(#setup-secret)>h2 {display:block;font-family:var(--font);font-size:1.125rem;
    font-weight:700;line-height:1.65;letter-spacing:0;margin:0 0 10px}
  .app:has(#setup-secret)>h2::before {display:none}
  .app:has(#setup-secret)>p {margin:0;color:#d1c5b0;font-size:.875rem;line-height:1.9}
  .app:has(#setup-secret)>details {margin-top:18px!important;padding-top:10px;border-top:1px solid rgba(230,182,94,.18)}
  .app:has(#setup-secret) summary {padding:12px 0;min-height:48px;font-size:.875rem;line-height:1.7;color:#d7c5a4}
  .app:has(#setup-secret) summary::marker {color:var(--lantern)}
  .app:has(#setup-secret) .panel {padding:16px;margin-bottom:0}
  .app:has(#setup-secret)+.status {display:block;padding:20px 18px calc(24px + env(safe-area-inset-bottom,0px));margin-top:0}
  .app:has(#setup-secret)+.status::before {margin:0;font-size:.625rem}
}
@media(max-width:360px) {
  .hero-copy {padding:16px}
  .hero-title {font-size:1.375rem}
  .hero-description {font-size:.8125rem}
  .app:has(#setup-secret) {padding:18px}
  .tabs button[data-tab=people] {font-size:.5625rem}
}

.classic-entry {max-width:640px;margin:0 auto}
.entry-card.panel {padding:26px;margin-top:0}
.entry-card h2 {font-family:var(--display);font-size:1.55rem;margin:0 0 12px}
.entry-eyebrow {font-family:Georgia,serif;font-size:.7rem;letter-spacing:.18em;color:var(--lantern);margin:0 0 12px}
.entry-card>p:not(.entry-eyebrow) {font-size:.9375rem;line-height:1.85;color:#d1c5b0}
.entry-card form {margin-top:22px}
.entry-card input {width:100%;font-size:16px}
.entry-card .note {margin:0}
.entry-participants {font-size:.875rem;line-height:1.85;color:var(--mist);padding:0 10px}
@media(max-width:600px){
 body:has(.classic-entry) .hero-art {height:132px;aspect-ratio:auto;background-position:center 40%}
 body:has(.classic-entry) .hero-copy {padding:12px 14px 14px}
 body:has(.classic-entry) .hero-eyebrow,body:has(.classic-entry) .hero-description {display:none}
 body:has(.classic-entry) .hero-title {font-size:1.0625rem;line-height:1.65;letter-spacing:.02em}
 body:has(.classic-entry) .hero-title br {display:none}
 .entry-card.panel {padding:22px 20px}
 .entry-card h2 {font-size:1.3rem;letter-spacing:.025em}
 .entry-card>p:not(.entry-eyebrow) {font-size:.875rem}
 .entry-card .field {font-size:.875rem}
 .entry-card .btn {font-size:1rem}
 .entry-participants {font-size:.8125rem}
}
