:root{font-family:system-ui,-apple-system,Segoe UI,sans-serif;background:#101b2d;color:#ecf3ff;font-size:16px}*{box-sizing:border-box}body{margin:0}main{max-width:760px;margin:auto;min-height:100dvh;padding:18px 18px 36px}header,.row,.topline{display:flex;align-items:center;justify-content:space-between;gap:12px}header{padding:6px 0 25px}.brand{letter-spacing:.12em;color:#f7cf63}#code{font-weight:800;letter-spacing:.2em;color:#f7cf63}h1{font-size:2.4rem;margin:0 0 24px;letter-spacing:-.05em}h2{font-size:1.15rem;margin:0 0 14px}.panel{background:#192a42;border:1px solid #304865;border-radius:20px;padding:22px;margin-bottom:16px;box-shadow:0 16px 40px #0002}label{display:block;font-size:.95rem;font-weight:650;margin:18px 0;color:#d8e4f5}input,select,button{font:inherit}input:not([type=range]),select{width:100%;background:#101e33;color:white;border:1px solid #56708f;border-radius:12px;padding:14px;margin-top:8px;min-height:49px}input[type=range]{display:block;width:100%;accent-color:#f7cf63;margin:14px 0}output{float:right;color:#f7cf63}.actions{display:grid;gap:12px;margin:24px 0}.join{display:flex;gap:9px}.join input{margin:0!important;min-width:0;letter-spacing:.15em;text-transform:uppercase}.join button{flex:0 0 auto}button{cursor:pointer;border:0;border-radius:12px;padding:13px 18px;background:#334d69;color:white;font-weight:750;min-height:48px}button:disabled{opacity:.55;cursor:wait}.primary{background:#f7cf63;color:#172134;width:100%}.outline{background:transparent;border:1px solid #6983a2;font-size:.85rem}.topline{margin-bottom:16px}small{text-transform:uppercase;letter-spacing:.13em;color:#9fb6d1;font-weight:750}#timer{font-size:3.2rem;font-weight:850;letter-spacing:-.06em;line-height:1.05;font-variant-numeric:tabular-nums}#banner{margin:0 0 10px;color:#f7cf63;font-weight:700;min-height:24px}#map{position:relative;overflow:hidden;height:min(53vh,430px);min-height:290px;background:#d9e4d2;border-radius:20px;margin-bottom:16px;border:2px solid #3b5874}#tiles,#markers{position:absolute;inset:0}#tiles img{position:absolute;width:256px;height:256px;max-width:none}#circle{position:absolute;border:3px dashed #d97049;background:#d9704927;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none}.marker{position:absolute;transform:translate(-50%,-50%);border-radius:30px;background:#101b2d;color:#fff;border:2px solid white;padding:5px 9px;white-space:nowrap;font-size:.8rem;font-weight:800;box-shadow:0 3px 12px #0006}.marker.me{background:#edb935;color:#101b2d}.marker.seeker{background:#e96064}.credit{position:absolute;bottom:0;right:0;background:#fffd;color:#222;padding:2px 5px;font-size:.65rem}.credit a{color:inherit}.row h2{margin:0}.row span{color:#adc3da;font-size:.8rem}#roster{margin-top:16px}.person{display:flex;align-items:center;gap:11px;padding:12px 0;border-top:1px solid #334860}.dot{height:12px;width:12px;border-radius:50%;background:#4ed18a;flex:0 0 auto}.dot.red{background:#ed6464}.dot.yellow{background:#f7cf63}.person strong{flex:1}.person em{font-size:.76rem;color:#b5c8dd;font-style:normal}.person button{font-size:.8rem;min-height:38px;padding:7px 10px}#incoming>div{margin-top:12px;padding:14px;border-radius:12px;background:#2b405a;color:#f7cf63}#incoming button{margin:10px 6px 0 0}#start{margin-top:16px}#error{color:#ff9999;min-height:24px}footer{font-size:.8rem;color:#a7b9cf;line-height:1.5;margin-top:28px}[hidden]{display:none!important}@media(max-width:400px){main{padding:14px}#map{min-height:270px}#timer{font-size:2.7rem}.panel{padding:18px}}
.person.out strong{color:#ff7474}#wolfPrompt{color:#f7cf63;font-size:.9rem;line-height:1.4}.celebration{position:fixed;inset:0;z-index:30;display:grid;place-items:center;background:#081224df;padding:20px}.celebration-card{width:min(100%,440px);padding:32px 24px;border:2px solid #f7cf63;border-radius:28px;background:radial-gradient(circle at top,#355674,#192a42 70%);text-align:center;box-shadow:0 20px 70px #0009;animation:card-in .55s both}.celebration-card h2{font-size:1.8rem;margin:8px 0}.celebration-card p{line-height:1.5}.celebration-icon{font-size:5rem;line-height:1.3;animation:bounce 1s infinite alternate}.celebration.sheep .celebration-icon{animation:bounce .8s infinite alternate}.celebration.movement .celebration-icon{animation:shake .7s ease-in-out 3}.celebration-card button{margin-top:18px}.celebration.wolf .celebration-card{border-color:#f7cf63}.celebration.sheep .celebration-card{border-color:#7cdda3}.celebration.movement .celebration-card{border-color:#ff7474}@keyframes card-in{from{opacity:0;transform:scale(.65) rotate(-4deg)}to{opacity:1;transform:scale(1) rotate(0)}}@keyframes bounce{from{transform:translateY(12px) rotate(-6deg)}to{transform:translateY(-14px) rotate(6deg)}}@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-15px) rotate(-8deg)}75%{transform:translateX(15px) rotate(8deg)}}@media(prefers-reduced-motion:reduce){.celebration-card,.celebration-icon{animation:none!important}}
.end-actions{display:grid;gap:10px;margin-top:18px}.end-actions p{margin:2px 0;color:#adc3da}.end-actions #leave{background:#334d69}
.late-join{margin-top:16px;padding:18px;background:#263d59;border:1px solid #f7cf63;border-radius:16px}.late-join h2{color:#f7cf63}.late-join button{margin:6px 7px 6px 0}.late-join .primary{width:auto}#cancelSetup,#cancelGame{margin-top:14px}#waitingRoom strong{color:#f7cf63}.celebration.zombies .celebration-card,.celebration.transformed .celebration-card{border-color:#b0e275}.celebration.humans .celebration-card{border-color:#68cae8}

.gps-status{padding:9px 13px;margin:0 0 12px;border-radius:11px;font-size:.87rem;font-weight:700}.gps-status.good{background:#173e34;color:#9ceec2}.gps-status.medium{background:#4a3c19;color:#ffe08e}.gps-status.poor{background:#512d35;color:#ffb8bb}.capture-help{padding:12px;border-radius:10px;background:#2b405a;color:#ffdb87}.person.out strong{color:#f58b8b}

.map-controls{position:absolute;top:10px;right:10px;display:flex;flex-direction:column;gap:6px;z-index:2}.map-controls button{min-height:38px;min-width:40px;padding:5px 9px;background:#192a42e8;color:#fff;border:1px solid #fff8;box-shadow:0 2px 8px #0005}.map-controls button:last-child{font-size:.75rem}.person.out strong{color:#f58b8b}#surrender{margin-top:16px;width:100%}

.movement-warning{background:#8b2e30;color:#fff;border:2px solid #ffbd76;padding:14px;border-radius:12px;margin:0 0 12px;font-weight:800;text-align:center;font-size:1.06rem}