:root{color-scheme:dark;--bg:#111715;--panel:#1a2420;--paper:#f3eddb;--muted:#b3bdb4;--red:#ed694f;--line:#3b4940;--gold:#d4b978}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--paper);font:16px/1.55 system-ui,-apple-system,sans-serif}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer;border:1px solid var(--line);padding:12px 18px;background:var(--panel);color:var(--paper);border-radius:5px}button:hover{border-color:var(--gold)}button:disabled{opacity:.45;cursor:wait}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:4px}[hidden]{display:none!important}a{color:inherit}h1,h2,h3,p{margin-top:0}.masthead{max-width:1500px;margin:auto;padding:24px 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:20px}.brand{text-decoration:none;font:900 44px/.9 Georgia,serif;display:flex;align-items:center;gap:12px;color:var(--red)}.brand span{font:700 12px/1.3 system-ui;letter-spacing:2px;color:var(--paper)}.header-tools{display:flex;gap:12px;align-items:center;flex-wrap:wrap}#connection{color:var(--muted);font-size:14px}.quiet{background:transparent;padding:8px 12px;font-size:14px}main{max-width:1400px;margin:auto;padding:48px 5%}.entry{display:grid;grid-template-columns:1.15fr 1fr;gap:8%;align-items:center;min-height:65vh}.eyebrow{color:var(--gold);font-size:13px;font-weight:700;letter-spacing:2px}h1{font:500 clamp(40px,5.6vw,80px)/1.07 Georgia,serif;letter-spacing:-2px;margin-bottom:26px}h1 em{color:var(--red);font-weight:400}.lead{font-size:19px;color:var(--muted)}.stamp{display:inline-block;border:2px solid var(--red);color:var(--red);padding:10px 17px;transform:rotate(-4deg);font-size:13px;letter-spacing:2px;margin:22px 0 30px}.stamp strong{font-size:11px}.small{font-size:14px;color:var(--muted);max-width:440px}.entry-panel,.card{border:1px solid var(--line);background:var(--panel);padding:28px;border-radius:7px}.tabs{display:flex;border-bottom:1px solid var(--line);margin-bottom:26px}.tabs button{border:0;border-radius:0;flex:1;background:none}.tabs .active{border-bottom:3px solid var(--red)}label{display:block;font-size:14px;margin-bottom:18px}input,select{display:block;width:100%;margin-top:8px;border:1px solid #57645a;border-radius:4px;background:var(--bg);color:var(--paper);padding:13px;min-height:48px}.check{display:flex;align-items:center;gap:10px}.check input{width:19px;min-height:19px;margin:0;accent-color:var(--red)}.primary{background:var(--red);color:#171411;border-color:var(--red);font-weight:750}.entry-panel .primary{width:100%;margin-top:6px}.error{color:#ffb6a8;margin:10px 0}.rules{border-top:1px solid var(--line);margin-top:45px;padding-top:20px;color:var(--muted);max-width:1000px}.rules summary{color:var(--paper);cursor:pointer;margin-bottom:12px}footer{padding:24px 5%;color:var(--muted);border-top:1px solid var(--line);font-size:13px;display:flex;justify-content:space-between;gap:20px}.room-top{display:flex;justify-content:space-between;align-items:start;gap:20px;margin-bottom:28px}.room-top h1{font-size:clamp(32px,4vw,56px);margin-bottom:10px}.badge{display:inline-block;font-size:13px;letter-spacing:1px;border:1px solid var(--line);padding:4px 10px;margin:3px 5px 3px 0;color:var(--gold)}.timer{font:400 44px/1 Georgia,serif;font-variant-numeric:tabular-nums;color:var(--gold)}.layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(260px,1fr);gap:24px}.stack{display:grid;gap:20px;align-content:start}.players{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:10px}.person{border:1px solid var(--line);padding:16px;border-radius:4px;background:#15201b}.person strong{display:block;overflow-wrap:anywhere}.person small{display:block;color:var(--muted)}.person.dead{opacity:.6}.person.arrested{border-style:dashed}.avatar{width:35px;height:35px;border:1px solid var(--gold);display:grid;place-items:center;color:var(--gold);font-family:Georgia,serif;margin-bottom:10px}.code{font:700 44px/1.2 monospace;letter-spacing:5px;color:var(--gold)}h2{font:400 29px/1.2 Georgia,serif}h3{font-size:17px}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.notice{border-left:3px solid var(--gold);padding:14px 18px;background:#242b20}.private{border-color:#796039}.camp{font-size:22px;color:var(--red);font-weight:750}.clue{border-top:1px solid var(--line);padding:16px 0}.clue:last-child{padding-bottom:0}.clue p{margin-bottom:10px}.log{border-bottom:1px solid var(--line);padding:14px 0}.log:last-child{border:0}.log small{color:var(--gold)}.log p{margin-bottom:0}.masked{padding:55px 20px;text-align:center;color:var(--muted);border:1px dashed var(--line)}#toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:var(--paper);color:var(--bg);border-radius:6px;max-width:90vw;padding:0;z-index:50}#toast:not(:empty){padding:14px 22px;box-shadow:0 5px 25px #0008}.display .layout{grid-template-columns:1fr}.display .private{display:none}.display .log:first-child{font-size:clamp(20px,3vw,38px)}.display .person{padding:22px}.display .person strong{font-size:23px}.display .timer{font-size:70px}.display-link{overflow-wrap:anywhere}.muted{color:var(--muted)}.compact{margin:0}.phase-title{color:var(--red)}.reveal{display:grid;gap:12px}.reveal>div{padding:15px;border:1px solid var(--line)}
@media(max-width:760px){.masthead{padding:18px 5%;align-items:start}.brand{font-size:34px}.header-tools{justify-content:flex-end;gap:6px}#connection{width:100%;text-align:right;font-size:12px}main{padding-top:28px}.entry{grid-template-columns:1fr;gap:24px;min-height:0}.intro h1{font-size:43px;letter-spacing:-1px}.intro .stamp{display:none}.intro .lead{font-size:17px}.entry-panel,.card{padding:20px}.layout{grid-template-columns:1fr}.room-top{flex-wrap:wrap}.players{grid-template-columns:repeat(2,minmax(0,1fr))}.timer{font-size:34px}footer{flex-direction:column}.display .person strong{font-size:18px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

#qr img{max-width:100%;height:auto;border-radius:4px}select{max-width:100%}

/* Noir illustrated edition */
body{background:#0c1412;isolation:isolate}
.scene-backdrop{position:fixed;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(8,17,15,.9),rgba(8,17,15,.38)),url('art/village-noir.webp') center/cover no-repeat;opacity:.6;pointer-events:none}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(0deg,#0c1412 0%,transparent 85%)}
.masthead{max-width:none;background:#0c1412c9;backdrop-filter:blur(12px)}
.brand{color:#e49d72}.intro .eyebrow{color:#dabc80}.intro h1{font-size:clamp(58px,7vw,104px);letter-spacing:-3px}.intro h1 em{color:#e59576}
.entry{gap:7%;min-height:68vh}.entry-panel{background:#15201def;border:1px solid #67715b;box-shadow:0 25px 80px #0006;padding:32px}
.entry-panel h2{font-size:35px}.entry-panel p{color:#c9d0c2}.entry-panel .eyebrow{color:var(--gold)}
.primary{background:#dca980;border-color:#dca980;color:#182019}.primary:hover{background:#efc099}.button-link{display:block;text-decoration:none;text-align:center;padding:13px 18px;border-radius:4px;margin:10px 0;font-weight:650}
.nav-login{text-decoration:none}.back-link{display:inline-block;margin:20px 0;color:var(--gold)}
.village-window{min-height:360px;margin-top:52px;background:linear-gradient(90deg,#0c1412b0,transparent),url('art/village-noir.webp') center 57%/cover;border:1px solid #5f6550;display:flex;align-items:end;padding:30px}
.village-caption p{font:30px/1.25 Georgia,serif;margin:12px 0 0;color:#fff0d5}
.phase-scene{height:180px;background:linear-gradient(0deg,#0c1412a0,transparent),url('art/village-noir.webp') center 53%/cover;border:1px solid #475447;margin-bottom:28px;transition:filter 1.2s ease}
body[data-phase="night"] .phase-scene{filter:brightness(.48) saturate(.6) hue-rotate(10deg)}
body[data-phase="dawn"] .phase-scene{filter:sepia(.23) brightness(.85)}
body[data-phase="vote"] .phase-scene{filter:sepia(.2) brightness(.65)}
body[data-phase="finished"] .phase-scene{filter:sepia(.3) brightness(1.1)}
.card{background:#15201ef2;border-color:#445449}.private{border-color:#897148}.masked{background:#18231dea}
.person{padding:0 0 14px;overflow:hidden;background:#101c17}.person strong,.person small{padding:0 12px}.person .avatar{margin:15px}
.portrait{display:block;width:100%;aspect-ratio:1;background-image:url('art/characters-noir.webp');background-size:400% 400%;background-repeat:no-repeat;margin-bottom:12px}
.portrait-large{width:112px;height:112px;float:right;margin:0 0 18px 20px;border:1px solid #90754f;border-radius:4px}
.person.arrested .portrait{filter:grayscale(.85)}.person.dead .portrait{filter:grayscale(1) brightness(.55)}
.person.arrested{border-color:#bd9678}.person.dead{opacity:.7}
.sound-panel{position:fixed;right:4%;top:94px;z-index:20;width:320px;max-width:92vw;padding:24px;background:#18241ff7;border:1px solid #99815f;box-shadow:0 20px 80px #0009;border-radius:6px}
.sound-panel input[type="range"]{padding:0;min-height:32px;accent-color:#dca980}
.display .phase-scene{height:38vh}.display .players{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
.display .person{padding:0 0 16px}.display .person strong{font-size:20px}
.display .layout{grid-template-columns:1fr 1fr}.display .room-top{margin-bottom:16px}
.display .stack:empty{display:none}.auth-entry .intro h1{font-size:clamp(54px,6vw,86px)}
@media(max-width:760px){
.masthead{padding:15px 5%;gap:12px}.header-tools{max-width:68%}.header-tools .quiet,.nav-login{font-size:12px;padding:6px 8px}.intro h1{font-size:66px;letter-spacing:-2px}.entry{min-height:0;gap:18px}.entry-panel{padding:23px}.entry-panel h2{font-size:29px}.village-window{min-height:230px;padding:20px;margin-top:28px}.village-caption p{font-size:25px}.phase-scene{height:130px}.portrait-large{width:90px;height:90px}.display .layout{grid-template-columns:1fr}.sound-panel{top:110px}
}
@media(prefers-reduced-motion:reduce){.phase-scene{transition:none}}

.portrait-0{background-position:0.0% 0.0%}
.portrait-1{background-position:33.333333333333336% 0.0%}
.portrait-2{background-position:66.66666666666667% 0.0%}
.portrait-3{background-position:100.0% 0.0%}
.portrait-4{background-position:0.0% 33.333333333333336%}
.portrait-5{background-position:33.333333333333336% 33.333333333333336%}
.portrait-6{background-position:66.66666666666667% 33.333333333333336%}
.portrait-7{background-position:100.0% 33.333333333333336%}
.portrait-8{background-position:0.0% 66.66666666666667%}
.portrait-9{background-position:33.333333333333336% 66.66666666666667%}
.portrait-10{background-position:66.66666666666667% 66.66666666666667%}
.portrait-11{background-position:100.0% 66.66666666666667%}
.portrait-12{background-position:0.0% 100.0%}
.portrait-13{background-position:33.333333333333336% 100.0%}
.portrait-14{background-position:66.66666666666667% 100.0%}
.portrait-15{background-position:100.0% 100.0%}
.reveal-stage{padding:24px 28px;border:1px solid #b79b70;background:#1e2a22f5;margin:0 0 24px;min-height:160px}
.reveal-stage h2{font-size:34px;margin-bottom:10px}.reveal-stage p:last-child{margin:0;max-width:900px}
.reveal-stage.fatal{border-color:#b57767;background:#2b1d1af2}
.display .reveal-stage{font-size:23px}.display .reveal-stage h2{font-size:44px}
@media(max-width:760px){.reveal-stage{padding:20px}.reveal-stage h2{font-size:29px}}

/* Municipal noir: editorial notices, weather and confidential dossiers. */
.weather-veil{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.12;background:repeating-linear-gradient(106deg,transparent 0 79px,#c0d8ce55 80px,transparent 81px 160px);background-size:280px 480px;animation:municipal-rain 18s linear infinite;mask-image:linear-gradient(transparent,#000)}
@keyframes municipal-rain{to{background-position:-280px 480px}}
.municipal-board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-top:64px;background:#e3d9be;color:#222b26;border:1px solid #b5a681;box-shadow:0 18px 50px #0005;transform:rotate(-.35deg)}
.gazette-heading{grid-column:1/-1;padding:26px 30px 18px;border-bottom:4px double #576051;text-align:center}.gazette-heading .eyebrow{color:#5d4230}.gazette-heading h2{font:bold clamp(30px,4vw,49px)/1.1 Georgia,serif;margin:10px 0}.gazette-heading p{margin:0;font-style:italic}
.municipal-notice{padding:28px;border-right:1px solid #acaa92}.municipal-notice:last-child{border:0}.notice-number{font:700 11px/1.4 system-ui;letter-spacing:1.6px;color:#6e4434}.municipal-notice h3{font:700 25px/1.15 Georgia,serif;margin:16px 0}.municipal-notice p{font-size:15px;margin:0}
.phase-scene{position:relative;display:flex;align-items:end;padding:24px;overflow:hidden;background-image:linear-gradient(0deg,#08110ff5,transparent 95%),url('art/village-noir.webp');height:215px}
.phase-caption{font:italic clamp(21px,2.8vw,35px)/1.2 Georgia,serif;color:#fff0d5;max-width:800px;text-shadow:0 2px 8px #000;margin:0;position:relative}
body[data-phase="night"] .phase-scene{filter:none;background-color:#050c16;background-blend-mode:normal,luminosity}.phase-scene::before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent,#c4d5ca0a,transparent);pointer-events:none}
.private{position:relative;border-top:5px solid #b58b56;background:linear-gradient(130deg,#293027,#121d19)}.private>h2{padding-bottom:16px;border-bottom:1px dashed #7e7454}.clue{border-top-style:dashed}.person{box-shadow:0 5px 12px #0003;transition:transform .2s}.person:hover{transform:translateY(-2px)}.person.arrested .portrait{background-blend-mode:luminosity;background-color:#69563d}.person.dead{border-color:#655c55}.person.dead strong{text-decoration:line-through;text-decoration-color:#b98670}
.reveal-stage{border-left:6px solid #b79b70;box-shadow:0 14px 35px #0005}.reveal-stage.fatal{border-left-color:#c0806e;background:radial-gradient(ellipse at top right,#59352c,#211b18 75%)}
.admin-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:30px 0}.admin-metrics strong{display:block;font:52px Georgia,serif;color:var(--gold)}.admin-metrics span{display:block}.admin-section{margin-top:24px}.table-scroll{overflow:auto}table{width:100%;border-collapse:collapse;text-align:left}th,td{padding:14px;border-bottom:1px solid var(--line);overflow-wrap:anywhere}th{color:var(--gold)}hr{border:0;border-top:1px solid var(--line);margin:28px 0}
@media(max-width:760px){.municipal-board{grid-template-columns:1fr;margin-top:36px;transform:none}.municipal-notice{border-right:0;border-bottom:1px solid #acaa92;padding:24px}.gazette-heading{padding:24px 16px}.phase-scene{height:175px;padding:18px}.admin-metrics{grid-template-columns:1fr}.weather-veil{opacity:.06}}
@media(prefers-reduced-motion:reduce){.weather-veil{animation:none}.person{transition:none}.person:hover{transform:none}}
