:root{color-scheme:dark;--lime:#b6f23a;--blue:#39a8ff;--red:#ff5268;--panel:#0b1713;--line:#29473b}*{box-sizing:border-box}body{margin:0;min-height:100vh;color:#eef8f3;background:radial-gradient(circle at 50% -20%,#174b35,#07120e 48%,#040806);font-family:Inter,Pretendard,"Noto Sans KR",system-ui,sans-serif}.shell{width:min(1220px,100%);margin:auto;padding:20px clamp(12px,3vw,28px) 40px}header{height:58px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:11px;color:#fff;text-decoration:none}.brand img{width:42px;height:42px;border-radius:10px}.brand span{display:grid}.brand b{font-size:17px}.brand small{margin-top:3px;color:#8ea99c;font-size:8px;letter-spacing:.18em}.prototype{padding:7px 11px;border:1px solid #537063;border-radius:99px;color:var(--lime);font-size:9px;letter-spacing:.15em}.setup{min-height:calc(100vh - 130px);display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:55px}.eyebrow{color:var(--lime);font-size:11px;font-weight:900;letter-spacing:.28em}.setup h1{margin:12px 0;font-size:clamp(42px,7vw,76px);line-height:.98;letter-spacing:-.065em;font-style:italic}.setup p{max-width:570px;color:#a4b9af;font-size:14px;line-height:1.8}.setup-card{padding:28px;border:1px solid #365649;border-radius:18px;background:#07130fdd;box-shadow:0 25px 80px #0008}.setup-card h2{margin:0 0 16px}.size-buttons{display:grid;gap:8px}.size-buttons button{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border:1px solid #29473b;border-radius:10px;color:#dbe9e2;background:#0c1d16;font-weight:900;cursor:pointer}.size-buttons button small{color:#819a8f;font-weight:500}.size-buttons button.active{border-color:var(--lime);box-shadow:0 0 0 1px var(--lime) inset;color:var(--lime)}.primary{width:100%;margin-top:16px;padding:15px;border:0;border-radius:10px;background:var(--lime);color:#10200d;font-weight:1000;cursor:pointer}.scorebar{width:min(600px,100%);height:58px;margin:7px auto 12px;display:grid;grid-template-columns:1fr 110px 1fr;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#07110e}.score{display:flex;align-items:center;gap:16px;padding:0 22px;font-size:11px;font-weight:900;letter-spacing:.14em}.score b{font-size:29px}.score.blue{justify-content:flex-end;background:linear-gradient(90deg,transparent,#178adb22)}.score.blue b{color:var(--blue)}.score.red{background:linear-gradient(90deg,#d9384d22,transparent)}.score.red b{color:var(--red)}.turn{display:grid;place-content:center;text-align:center;border-inline:1px solid var(--line)}.turn small{font-size:8px;color:#789084;letter-spacing:.2em}.turn b{font-size:17px}.game-layout{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:14px}.board-wrap{position:relative;border:2px solid #315c49;border-radius:15px;overflow:hidden;background:#155c39;box-shadow:0 20px 60px #0008}canvas{display:block;width:100%;height:auto;aspect-ratio:13/9}.toast{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%) scale(.9);opacity:0;padding:10px 20px;border-radius:8px;background:#06120eee;font-size:30px;font-weight:1000;transition:.2s;pointer-events:none;white-space:nowrap}.toast.show{opacity:1;transform:translate(-50%,-50%) scale(1)}aside{display:grid;align-content:start;gap:9px;padding:14px;border:1px solid var(--line);border-radius:14px;background:#081510}.phase{padding:4px 3px 10px;border-bottom:1px solid #203a30}.phase small,.selected small{color:var(--lime);font-size:8px;font-weight:900;letter-spacing:.18em}.phase b{display:block;margin-top:4px;font-size:17px}.phase p{margin:5px 0 0;color:#829b90;font-size:10px;line-height:1.5}.selected{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid #28473a;border-radius:9px;background:#0d2119}.role-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#1d91dd;font-weight:900}.selected div{display:grid}.selected b{font-size:12px}.actions{display:grid;grid-template-columns:1fr 1fr;gap:6px}.actions button{display:grid;text-align:left;gap:3px;padding:9px;border:1px solid #29463a;border-radius:8px;color:#d8e6df;background:#0b1c15;font-weight:800;cursor:pointer}.actions button small{color:#718a7f;font-size:8px;font-weight:500}.actions button.active{border-color:var(--lime);color:var(--lime)}.orders{padding:9px 3px}.orders>div:first-child{display:flex;justify-content:space-between;font-size:10px}.order-track{height:6px;margin-top:7px;overflow:hidden;border-radius:6px;background:#20372e}.order-track i{display:block;width:0;height:100%;background:var(--lime);transition:.2s}.execute{padding:13px;border:0;border-radius:9px;color:#10200d;background:var(--lime);font-weight:1000;cursor:pointer}.execute:disabled{color:#73857d;background:#22342d;cursor:not-allowed}.reset{border:0;color:#7f978c;background:transparent;font-size:10px;cursor:pointer}.legend{display:flex;justify-content:center;gap:22px;margin-top:11px;color:#82998f;font-size:10px}.dot{display:inline-block;width:8px;height:8px;margin-right:5px;border-radius:50%}.blue-dot{background:var(--blue)}.red-dot{background:var(--red)}@media(max-width:850px){.setup{grid-template-columns:1fr;gap:20px;padding:45px 0}.game-layout{grid-template-columns:1fr}.legend{flex-wrap:wrap;gap:10px}.actions{grid-template-columns:repeat(4,1fr)}.actions button small{display:none}}@media(max-width:520px){.prototype{display:none}.setup h1{font-size:43px}.setup-card{padding:18px}.score{padding:0 9px;font-size:9px}.scorebar{grid-template-columns:1fr 82px 1fr}.actions{grid-template-columns:1fr 1fr}.toast{font-size:22px}}
