:root{font-family:system-ui,-apple-system,sans-serif;color:#f7faff;background:#101c31}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at top,#274768,#101c31 65%);min-height:100dvh}#app{max-width:850px;margin:auto;padding-bottom:85px}header{padding:18px 16px;display:flex;align-items:center;justify-content:space-between;gap:8px;background:#0d192c;border-bottom:1px solid #355071}header strong{letter-spacing:1.4px;font-size:15px}header span{font-size:13px;color:#ffdf87}main{padding:16px}h1,h2,h3{margin:12px 0}h2{font-size:23px}.hero{text-align:center;padding:45px 12px}.hero h1{font-size:clamp(30px,8vw,55px);letter-spacing:3px}.logo{font-size:76px}.hero p{color:#bcd1e9}.card{background:#1b304c;border:1px solid #3a5876;border-radius:20px;padding:20px;margin:16px 0;box-shadow:0 12px 30px #07111d55}.center{text-align:center}.big{font-size:100px}button{border:1px solid #54708c;border-radius:13px;padding:14px 17px;min-height:49px;color:#fff;background:#304968;font-weight:750;font-size:15px;cursor:pointer;margin:5px;touch-action:manipulation}button:active{transform:scale(.97)}button.primary,.selected{background:#f2b950;color:#15233b;border-color:#f2b950}button:disabled{opacity:.5;cursor:not-allowed}input,select{display:block;width:100%;margin:8px 0 15px;padding:14px;border-radius:10px;border:1px solid #789;background:#101d31;color:#fff;font-size:16px}.avatars{display:flex;gap:8px}.avatars button{font-size:38px;flex:1}.row{display:flex;flex-wrap:wrap;gap:5px}.row button{flex:1}.map{position:relative;height:clamp(300px,58vw,480px);background:#152a42;border:5px solid #57748a;border-radius:24px;overflow:hidden;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:8px;padding:12px;box-shadow:inset 0 0 0 4px #0b192b}.room{border:3px solid #ffffff44;border-radius:15px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;cursor:pointer;box-shadow:inset 0 -14px #0002;transform:skewY(-3deg)}.room span{font-size:clamp(32px,7vw,65px)}.room b{font-size:clamp(12px,3vw,20px);text-align:center}.room small{font-size:11px}.kitchen{background:#a66747}.rooms{background:#537e96}.lobby{background:#88704b}.hallway{background:#526f63}.player{position:absolute;left:26%;top:73%;font-size:37px;transform:translate(-50%,-50%);filter:drop-shadow(0 5px 3px #0008);pointer-events:none;transition:left .8s ease,top .8s ease;z-index:2}.bar{height:15px;border-radius:20px;background:#0c1a2d;overflow:hidden;margin:12px 0}.bar>div{height:100%;background:linear-gradient(90deg,#50d8a6,#f6d06d);transition:width .2s}.topline{display:flex;align-items:center;justify-content:space-between;gap:10px}.topline small{color:#bcd1e9}.notice{background:#3d3642;padding:13px;border-radius:10px;color:#ffdfaa}.reward{font-size:28px;color:#ffdb70;font-weight:800}#plate{position:relative;width:min(72vw,320px);height:min(72vw,320px);border-radius:50%;background:radial-gradient(circle,#fff 0,#fff 52%,#d8e9ef 53%,#d8e9ef 66%,#fff 67%,#fff 74%,#afc6d0 75%);margin:28px auto;box-shadow:0 15px 30px #0006;touch-action:none;-webkit-user-select:none;user-select:none;cursor:crosshair}.plate-inner{position:absolute;top:17%;right:17%;bottom:17%;left:17%;border-radius:50%;border:3px solid #d0e0e5}.stain{position:absolute;width:13%;height:13%;border-radius:50% 45% 60% 35%;background:#81582b;box-shadow:0 0 0 5px #9a713b55;transform:translate(-50%,-50%);pointer-events:none}nav{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:center;background:#0c182a;padding:8px 8px max(8px,env(safe-area-inset-bottom));border-top:1px solid #355071;z-index:10}nav button{flex:1;max-width:240px;margin:2px;padding:10px 5px;font-size:13px}@media(max-width:380px){header{padding:14px 8px}header strong{font-size:12px}header span{font-size:11px}.card{padding:14px}main{padding:10px}}