:root{
  --blue:#0a74d8;
  --blue-deep:#074a9d;
  --blue-ink:#062f73;
  --sky:#66c8ff;
  --green:#63d33e;
  --green-deep:#2aa827;
  --cream:#fffdf5;
  --paper:#ffffff;
  --line:#8cc7ef;
  --ink:#103968;
  --gold:#ffbf2d;
  --red:#e85b5b;
  --soft:#eaf7ff;
  --shadow:0 14px 35px rgba(3,64,124,.18);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:"Trebuchet MS",Inter,Segoe UI,Arial,sans-serif;color:var(--ink);background:#8ed6ff}
button,input,select{font:inherit}.screen{display:none;min-height:100vh}.screen.active{display:block}.hidden{display:none!important}

/* Login -------------------------------------------------------------- */
.login-screen{position:relative;overflow:hidden;background:
  radial-gradient(circle at 12% 18%,rgba(255,255,255,.9) 0 6%,transparent 6.5%),
  radial-gradient(circle at 85% 13%,rgba(255,255,255,.88) 0 8%,transparent 8.5%),
  linear-gradient(#56c4ff 0 45%,#bcecff 45% 55%,#71d14c 55% 100%)}
.login-screen:before,.login-screen:after{content:"";position:absolute;bottom:-70px;width:52%;height:48%;background:#3db541;border:8px solid #128846;border-radius:60% 60% 0 0;box-shadow:inset 0 18px 0 rgba(255,255,255,.18)}
.login-screen:before{left:-10%;transform:rotate(8deg)}.login-screen:after{right:-12%;transform:rotate(-8deg)}
.login-wrap{position:relative;z-index:2;min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:18px 24px 38px}
.brand-stack{text-align:center;margin:0 auto 10px}.hero-logo{width:min(570px,68vw);max-height:300px;object-fit:contain;filter:drop-shadow(0 8px 8px rgba(0,43,91,.18))}
.build-pill{display:inline-block;margin-top:-24px;padding:8px 22px;border-radius:999px;background:linear-gradient(#fff,#e8f7ff);border:3px solid #2c8ce2;color:#0750a2;font-weight:900;font-size:0.875rem;box-shadow:var(--shadow)}
.game-card{background:linear-gradient(#fffef9,#f7fbff);border:3px solid #1c8ee8;border-radius:22px;box-shadow:var(--shadow)}
.welcome-card{width:min(820px,94vw);padding:24px 30px 20px;border-width:5px;position:relative}.welcome-card:before{content:"";position:absolute;inset:7px;border:1px solid #cbe9ff;border-radius:14px;pointer-events:none}
.welcome-title{text-align:center;font-size:2.125rem;line-height:1.05;color:#0c4388;font-weight:1000}.welcome-subtitle{text-align:center;color:#4773a0;margin:4px 0 20px;font-size:1rem}
.login-fields{display:grid;grid-template-columns:.8fr 1fr 1fr;gap:14px;position:relative;z-index:1}.login-fields label{font-size:0.8125rem;font-weight:900;color:#0e3f7d}.login-fields input,.login-fields select{width:100%;margin-top:7px;padding:12px 13px;border-radius:13px;border:2px solid #b8d3e9;background:#fff;color:#143b66;box-shadow:inset 0 2px 4px rgba(3,55,96,.05)}
.role-fieldset{border:0;margin:18px 0 12px;padding:0;position:relative;z-index:1}.role-fieldset legend{width:100%;text-align:center;color:#0d438a;font-weight:1000;font-size:1.25rem;margin-bottom:9px}.role-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.role{margin:0!important}.role input{display:none}.role span{height:132px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:18px;border:3px solid #b7c9dc;background:#fff;cursor:pointer;transition:.16s;box-shadow:0 4px 0 rgba(9,66,120,.08)}.role span:hover{transform:translateY(-2px)}.role strong{font-size:1.1875rem}.role small{font-size:0.75rem;margin-top:4px;color:#52728f}.role-icon{font-size:2.125rem;line-height:1;margin-bottom:7px}.operator-role span{border-color:#f5a92d;background:#fff8e9}.planner-role span{border-color:#3a9cf1;background:#eef8ff}.analyst-role span{border-color:#42b94d;background:#effeef}.role input:checked+span{outline:5px solid rgba(86,211,64,.18);transform:translateY(-3px)}
.primary,.secondary{border:0;border-radius:14px;padding:12px 18px;font-weight:1000;cursor:pointer;text-decoration:none;text-align:center;display:inline-block;transition:.15s}.primary{color:white;background:linear-gradient(#72db45,#26aa2d);border:3px solid #147b2d;box-shadow:inset 0 2px 0 rgba(255,255,255,.4),0 4px 0 #0b6c27}.primary:hover{filter:brightness(1.05);transform:translateY(-1px)}.primary:active{transform:translateY(2px);box-shadow:inset 0 2px 0 rgba(255,255,255,.2),0 1px 0 #0b6c27}.secondary{background:linear-gradient(#fff,#e7f5ff);color:#0756ac;border:2px solid #6ab5ee}.primary:disabled,.secondary:disabled{opacity:.45;cursor:not-allowed;transform:none}
.join-button{display:block;min-width:390px;margin:12px auto 10px;font-size:1.25rem}.join-button span{font-size:1.8125rem;margin-left:8px}.together-note{text-align:center;color:#47729c;font-size:0.8125rem}.error{color:#c73333;font-weight:900;text-align:center}.dev-ribbon{margin-top:12px;padding:7px 18px;background:rgba(255,255,255,.88);border-radius:999px;color:#0a4d9a;font-size:0.6875rem;font-weight:900;letter-spacing:.08em}

/* Game --------------------------------------------------------------- */
.game-screen{background:linear-gradient(#7fd5ff 0 120px,#dff6ff 120px 100%);min-height:100vh}.topbar{height:84px;padding:8px 18px;background:rgba(255,255,255,.97);border-bottom:4px solid #168ee7;display:flex;align-items:center;gap:16px;position:sticky;top:0;z-index:50;box-shadow:0 4px 18px rgba(0,69,132,.18)}.top-brand{display:flex;align-items:center;gap:6px;min-width:240px}.top-brand img{height:70px;width:180px;object-fit:contain}.build{font-size:0.625rem;font-weight:1000;color:#2c71af;background:#eaf7ff;border-radius:999px;padding:5px 7px}.room-chip{flex:1;max-width:440px;background:#fff;border:2px solid #9fccef;border-radius:15px;padding:11px 18px;font-weight:1000;color:#0c3c77;font-size:1.125rem;box-shadow:0 3px 0 #d3ecfb}.top-actions{display:flex;gap:10px;margin-left:auto}.score-chip,.day-chip{background:white;border:2px solid #9fccef;border-radius:14px;padding:9px 13px;font-weight:900;color:#0b3b79;min-width:130px;text-align:center}.score-chip b{display:block;color:#e58800;font-size:1.25rem}.day-chip small{display:block;color:#5e7d99;font-size:0.625rem;margin-top:2px}
.game-grid{display:grid;grid-template-columns:300px minmax(620px,1fr) 310px;gap:14px;padding:14px;max-width:1750px;margin:auto;min-height:calc(100vh - 84px)}.left-column{display:grid;align-content:start;gap:12px}.sidebar,.feed-panel,.mission-panel{padding:14px}.card-title{font-size:1rem;font-weight:1000;color:#0b3f80;border-bottom:2px solid #dceefb;padding-bottom:9px;margin-bottom:9px}.card-title span{margin-right:5px}.players-list{min-height:56px}.player{display:flex;justify-content:space-between;gap:6px;padding:9px 6px;border-bottom:1px solid #e1edf6;font-size:0.75rem;color:#35566f}.player:before{content:"●";color:#31bf4b;margin-right:4px}.player .role-name{color:#0f69bc;font-weight:1000}.player.offline{opacity:.55}.player.offline:before{color:#aaa}.start-button{width:100%;margin-top:10px;font-size:1.0625rem}.resources{display:grid;grid-template-columns:1fr;gap:5px}.resource{display:flex;align-items:center;justify-content:space-between;background:#eff9ff;border:1px solid #d2e9f8;padding:8px 10px;border-radius:10px;font-size:0.75rem;text-transform:capitalize}.resource b{color:#0c4b98;font-size:0.9375rem}.resource:before{content:"🏙";margin-right:auto;margin-left:0}.role-intel-card{background:linear-gradient(#fffdf1,#fff7d9);border-color:#f0b52d}.intel{background:#fff;border:1px solid #f4d579;border-radius:12px;padding:10px;min-height:86px;font-size:0.75rem;line-height:1.45;color:#4b5d6f}.share-button{width:100%;margin-top:8px}.dev-note{background:#eaf7ff;border-left:4px solid #45b8ef;padding:9px 10px;margin-top:10px;color:#27618f;font-family:Consolas,monospace;text-align:left;border-radius:8px}.dev-note.small{font-size:0.625rem}
.mission-panel{padding:16px 18px}.mission-head{display:flex;justify-content:space-between;gap:16px}.mission-head h1{margin:6px 0 2px;color:#0c3b76;font-size:1.75rem;line-height:1.05}.chips{display:flex;gap:5px;flex-wrap:wrap}.chip{padding:5px 8px;border:1px solid #72bdf0;border-radius:999px;background:#eff9ff;color:#0b5aa5;font-size:0.625rem;font-weight:900}.progress{align-self:start;border-radius:999px;background:#edf8ff;color:#0f62af;border:2px solid #b7ddf5;padding:8px 12px;font-weight:1000;white-space:nowrap}.brief{color:#547290;margin:5px 0 10px;font-size:0.8125rem}
.city-shell{border:3px solid #68baf0;border-radius:18px;overflow:hidden;background:#dff6ff;box-shadow:inset 0 0 0 4px #fff}.city-toolbar{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:8px 12px;background:linear-gradient(#fff,#eef9ff);border-bottom:2px solid #bce4fa;font-size:0.6875rem;color:#2d6799;font-weight:800}.city-toolbar span:first-child{font-weight:1000;color:#0b4f9c}.city-map{position:relative;min-height:510px;overflow:hidden;background:linear-gradient(#8adbf7,#a8e8ff 34%,#70d45b 34%,#6dd255 100%)}
.city-map:before{content:"";position:absolute;inset:auto 0 0;height:42%;background:radial-gradient(ellipse at center,#65bf47 0 55%,transparent 56%);opacity:.45}.road-grid{position:absolute;inset:6% 5%;border-radius:18px;background:
  linear-gradient(90deg,transparent 31%,#5c6470 31% 36%,transparent 36% 64%,#5c6470 64% 69%,transparent 69%),
  linear-gradient(transparent 31%,#5c6470 31% 36%,transparent 36% 64%,#5c6470 64% 69%,transparent 69%);
  opacity:.82;box-shadow:inset 0 0 0 10px rgba(255,255,255,.12)}
.map-place{position:absolute;width:25%;height:31%;border:0;background:transparent;padding:0;cursor:pointer;transition:.17s;filter:drop-shadow(0 6px 4px rgba(0,64,83,.13))}.map-place img{width:100%;height:100%;object-fit:contain;display:block}.map-place span{position:absolute;left:50%;bottom:2%;transform:translateX(-50%);background:white;border:2px solid #1f82d3;border-radius:999px;padding:3px 12px;color:#0c4a93;font-size:0.625rem;font-weight:1000;white-space:nowrap;box-shadow:0 2px 4px rgba(0,62,112,.18)}.map-place:hover,.map-place.selected{transform:translateY(-5px) scale(1.04);z-index:10;filter:drop-shadow(0 10px 7px rgba(0,64,83,.25))}.map-place.selected span{background:#fff5cf;border-color:#ffad23;color:#805000}
.p-house{left:4%;top:3%}.p-hospital{left:37.5%;top:2%}.p-park{right:4%;top:3%}.p-bank{left:4%;top:34%}.p-bus{left:37.5%;top:33%}.p-school{right:4%;top:34%}.p-cafe{left:4%;top:65%}.p-museum{left:37.5%;top:64%}.p-library{right:4%;top:65%}
.question-box{margin-top:12px;border:2px solid #9fd7f5;border-radius:16px;background:#f9fdff;padding:12px}.question-kicker{font-size:0.625rem;font-weight:1000;color:#0e67b8}.question-box h3{margin:5px 0 10px;color:#173f71}.options{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.option{background:white;border:2px solid #abd4ef;color:#123f73;border-radius:12px;padding:11px;text-align:left;cursor:pointer;font-weight:900}.option:hover{border-color:#3b9ee1}.option.selected{border-color:#39ad42;background:#effbea;box-shadow:0 0 0 3px rgba(74,190,73,.13)}.decision-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px}.ready{font-size:0.6875rem;font-weight:900;color:#2c6295}.hint{margin-top:7px;color:#c77800;min-height:16px;font-size:0.6875rem}.complete{text-align:center;padding:28px;border:2px solid #7ed957;border-radius:14px;background:#f2ffed}.complete h2{font-size:1.875rem;color:#258f2c}.report-buttons{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}.warning{color:#9b6800;font-weight:800}.button-link{min-width:220px}
.feed-panel{align-self:start}.feed{height:500px;overflow:auto;background:#f9fdff;border:1px solid #d5eaf8;border-radius:12px;padding:4px}.feed-item{font-size:0.6875rem;line-height:1.35;padding:9px;border-bottom:1px solid #e6eff6;color:#355a78}.feed-item.success{color:#268d37;background:#f1fff1}.feed-item.error{color:#c64646;background:#fff5f5}.feed-item.clue{color:#6f4d00;background:#fff7d9;border:1px solid #ead177;border-radius:9px;margin:5px 0;font-weight:1000;box-shadow:0 2px 6px rgba(148,96,0,.08)}.feed-item.sidequest{color:#986306;background:#fff9e7}.sidequest{margin-top:12px;border:2px solid #ffb62f;padding:10px;border-radius:14px;background:#fff9e5}.sidequest h3{margin:0 0 7px;color:#9a6500}.side-options{display:grid;gap:6px;margin-bottom:8px}.side-option{padding:8px;border-radius:8px;background:white;border:1px solid #e2bf66;color:#4b5865;cursor:pointer}.side-option.selected{border-color:#e89808;background:#fff4ca}.notice{margin-top:8px;color:#c77b00;font-size:0.6875rem;font-weight:800}

/* Teacher ------------------------------------------------------------ */
.teacher-page{min-height:100vh;padding:26px;background:linear-gradient(#74cfff,#dff7ff 42%,#76d14d 42% 100%)}.teacher-shell{max-width:1150px;margin:auto}.teacher-header{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:14px}.teacher-brand{display:flex;align-items:center;gap:14px}.teacher-brand img{width:190px;height:95px;object-fit:contain}.teacher-title h1{margin:0;color:#083f82;font-size:1.875rem}.teacher-title p{margin:3px 0;color:#4a6d8d}.teacher-controls{display:flex;gap:8px;align-items:end}.teacher-controls label{font-size:0.6875rem;font-weight:900;color:#0b4586}.teacher-controls input{display:block;margin-top:4px;padding:10px;border:2px solid #9acceb;border-radius:10px;width:120px}.teacher-dashboard{padding:18px}.roomcard{background:#f8fdff;border:2px solid #a7d5ef;border-radius:15px;padding:14px;margin:10px 0;box-shadow:0 4px 0 #d7edf9}.roomline{display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap}.room-main b{font-size:1.0625rem;color:#0c4383}.room-meta{font-size:0.6875rem;color:#55748f;margin-top:4px}.teacher-empty{padding:24px;text-align:center;background:#f4fbff;border:2px dashed #a8d1ea;border-radius:14px;color:#56768f}

@media(max-width:1220px){.game-grid{grid-template-columns:250px minmax(540px,1fr)}.feed-panel{grid-column:1/-1}.feed{height:230px}.top-actions{display:none}}
@media(max-width:820px){.login-fields,.role-grid{grid-template-columns:1fr}.join-button{min-width:0;width:100%}.game-grid{grid-template-columns:1fr}.left-column{grid-template-columns:1fr 1fr}.top-brand{min-width:0}.top-brand img{width:130px}.room-chip{font-size:0.8125rem}.city-map{min-height:430px}.options{grid-template-columns:1fr}.decision-row{flex-direction:column;align-items:stretch}.hero-logo{width:90vw}.teacher-header{flex-direction:column;align-items:stretch}.teacher-controls{justify-content:flex-start}}
@media(max-width:560px){.left-column{grid-template-columns:1fr}.welcome-card{padding:22px 18px}.city-map{min-height:360px}.map-place{width:29%;height:31%}.p-house,.p-bank,.p-cafe{left:1%}.p-park,.p-school,.p-library{right:1%}.p-hospital,.p-bus,.p-museum{left:35.5%}.map-place span{font-size:0.5rem;padding:2px 5px}.topbar{padding:6px 8px}.build{display:none}}


/* Interaction Build v0.3 --------------------------------------------- */
.city-map{isolation:isolate}.map-place{z-index:2}.map-place.mission-focus:after{content:"";position:absolute;inset:8%;border-radius:18px;border:3px dashed rgba(255,191,45,.0);pointer-events:none;transition:.2s}.map-place.mission-focus:hover:after{border-color:rgba(255,191,45,.78);box-shadow:0 0 18px rgba(255,191,45,.45)}
.place-drawer{position:absolute;right:12px;top:12px;width:min(335px,45%);max-height:calc(100% - 24px);overflow:auto;z-index:30;background:linear-gradient(#ffffff,#f4fbff);border:3px solid #168ee7;border-radius:18px;padding:14px;box-shadow:0 16px 35px rgba(0,53,105,.28);animation:drawerIn .18s ease-out}@keyframes drawerIn{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:none}}.drawer-close{position:absolute;right:8px;top:7px;width:30px;height:30px;border:0;border-radius:50%;background:#e8f5ff;color:#0b5ca8;font-size:1.375rem;font-weight:900;cursor:pointer}.drawer-kicker{font-size:0.5625rem;letter-spacing:.12em;color:#1681d5;font-weight:1000;margin-bottom:6px}.drawer-head{display:flex;align-items:center;gap:9px;padding-right:25px}.drawer-head img{width:92px;height:78px;object-fit:contain;background:#effaff;border-radius:13px}.drawer-head h2{margin:0;color:#0a3f80;font-size:1.3125rem}.status-pill{display:inline-block;margin-top:5px;padding:4px 7px;border-radius:999px;background:#eef5fb;color:#607b92;font-size:0.5rem;font-weight:1000}.status-pill.open{background:#eafbe7;color:#23852c}.place-description{font-size:0.6875rem;line-height:1.4;color:#496987}.location-facts{display:grid;gap:5px}.location-facts div{font-size:0.625rem;background:#eff8ff;border:1px solid #d5eaf8;border-radius:8px;padding:6px;color:#315c82}.role-observation{margin-top:9px;background:#fff8df;border:1px solid #efd376;border-radius:10px;padding:8px}.role-observation b{font-size:0.5625rem;color:#9b6900}.role-observation p{margin:4px 0 0;font-size:0.625rem;line-height:1.4;color:#665425}.use-location{width:100%;margin-top:9px;font-size:0.625rem}
.map-event{position:absolute;z-index:8;border:0;background:transparent;cursor:pointer;padding:0;filter:drop-shadow(0 8px 5px rgba(0,0,0,.18));animation:eventPulse 1.8s ease-in-out infinite}.map-event img{width:100%;height:100%;object-fit:contain}.map-event span{position:absolute;left:50%;bottom:-5px;transform:translateX(-50%);background:#fff3bf;border:2px solid #f0a91e;color:#835500;border-radius:999px;padding:2px 6px;font-size:0.4375rem;font-weight:1000;white-space:nowrap}.event-bike{left:21%;top:26%;width:15%;height:20%}.event-bench{right:15%;top:52%;width:16%;height:18%}@keyframes eventPulse{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
.objective-rail{margin:12px 0 0;border:2px solid #b4dcf4;border-radius:14px;background:linear-gradient(90deg,#f7fcff,#eef9ff);padding:8px 10px}.objective-title{font-size:0.5rem;font-weight:1000;color:#4275a0;letter-spacing:.12em;margin-bottom:6px}.objective-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.objective-step{display:grid;grid-template-columns:25px 1fr;grid-template-rows:auto auto;column-gap:6px;align-items:center;border:1px solid #cee6f5;background:white;border-radius:10px;padding:6px;color:#5d7890}.objective-step>span{grid-row:1/3;width:23px;height:23px;border-radius:50%;display:grid;place-items:center;background:#dfeefa;color:#3d6e99;font-size:0.5625rem;font-weight:1000}.objective-step b{font-size:0.5rem;color:#335f86}.objective-step small{font-size:0.4375rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.objective-step.done{border-color:#8ed47d;background:#f3fff0}.objective-step.done>span{background:#4db947;color:white}.objective-step.done b{color:#27822b}
.resource-toast{position:fixed;left:50%;top:100px;transform:translate(-50%,-20px);opacity:0;z-index:1000;background:#fff;border:3px solid #5dbd4d;border-radius:14px;padding:10px 18px;box-shadow:0 10px 30px rgba(0,0,0,.2);font-weight:1000;color:#2e7831;transition:.25s}.resource-toast.negative{border-color:#e76b62;color:#a43831}.resource-toast.show{opacity:1;transform:translate(-50%,0)}
.resource-happiness b{color:#d94d65}.resource-credits b{color:#d88c00}.resource-population b{color:#7568d8}.resource-energy b{color:#df9d00}
@media(max-width:820px){.place-drawer{width:calc(100% - 24px);max-width:none;max-height:72%;top:auto;bottom:12px}.objective-steps{grid-template-columns:1fr 1fr}}

.teacher-resource-line{margin-top:6px;display:inline-block;background:#eef9ff;border:1px solid #cce8f8;border-radius:999px;padding:4px 9px;font-size:0.625rem;font-weight:900;color:#315e86}

/* -------------------------------------------------------------------------
   v0.4 — 6th Grade Vertical Slice: playable city-action console
   ------------------------------------------------------------------------- */
.objective-steps{grid-template-columns:repeat(5,1fr)}
.action-box{margin-top:12px;border:2px solid #9fd7f5;border-radius:17px;background:linear-gradient(180deg,#fbfeff,#f2faff);padding:13px;box-shadow:0 8px 22px rgba(32,114,174,.08)}
.action-console-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.action-console-head h3{margin:5px 0 8px;color:#173f71}.action-mode-badge{background:#0e67b8;color:#fff;border-radius:999px;padding:6px 9px;font-size:0.5rem;font-weight:1000;letter-spacing:.09em;white-space:nowrap;box-shadow:0 3px 0 #07467f}
.action-workspace{border:1px solid #cce6f6;background:white;border-radius:14px;padding:11px;min-height:108px}.team-draft{margin-top:9px;border:1px solid #badcf2;border-left:5px solid #168ee7;border-radius:10px;background:#eef9ff;padding:8px 10px}.draft-label{font-size:0.5rem;letter-spacing:.11em;font-weight:1000;color:#4b7798}.draft-summary{font-size:0.75rem;color:#173f71;font-weight:900;margin-top:3px}.draft-owner{font-size:0.5rem;color:#7892a9;margin-top:3px}.execute-button{min-width:205px}.hint-drawer{margin-top:8px;border-top:1px dashed #c6dcea;padding-top:6px}.hint-drawer summary{cursor:pointer;font-size:0.5625rem;color:#8c6a19;font-weight:900}.hint-drawer .hint{margin:6px 0 0}
.dispatch-console{display:flex;gap:12px;align-items:center}.console-icon{font-size:2.625rem;width:58px;height:58px;display:grid;place-items:center;border-radius:14px;background:#e9f6ff}.dispatch-console b{color:#0b5ca8}.dispatch-console p{margin:3px 0 8px;font-size:0.625rem;color:#5d7890}.big-readout{border:2px solid #c8e2f4;background:#f5fbff;border-radius:10px;padding:8px 10px;font-size:0.625rem;color:#587590}.big-readout strong{color:#0b5ca8;font-size:0.8125rem}
.report-builder{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.report-builder label{font-size:0.5rem;font-weight:1000;color:#4f7391;letter-spacing:.06em}.report-builder select,.route-console select{display:block;width:100%;margin-top:4px;padding:9px;border:2px solid #c8e2f4;background:#fff;color:#173f71;border-radius:9px;font-weight:800}.language-output{margin-top:9px;background:#fff8df;border:1px solid #efd376;color:#735b1e;border-radius:10px;padding:9px 10px;font-family:Georgia,serif;font-size:0.8125rem;font-weight:700}.evidence-check{margin-top:8px;border-radius:9px;padding:7px 9px;background:#fff0e8;color:#a84d1d;font-size:0.5625rem;font-weight:900}.evidence-check.done{background:#effbea;color:#27822b}
.permit-banner{display:flex;justify-content:space-between;align-items:center;gap:8px;background:#e9f6ff;border-radius:9px;padding:7px 9px;color:#0b5ca8;font-size:0.5625rem;font-weight:1000}.project-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:8px}.project-card{border:2px solid #cce3f3;background:#fff;border-radius:11px;padding:8px 6px;color:#173f71;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:2px;min-height:88px}.project-card:hover{border-color:#64b6e8;transform:translateY(-1px)}.project-card.selected{border-color:#4db947;background:#f2fff0;box-shadow:0 0 0 3px rgba(77,185,71,.10)}.project-card>span{font-size:1.4375rem}.project-card b{font-size:0.625rem}.project-card small{font-size:0.4375rem;color:#6b879e;text-align:center}.project-card strong{font-size:0.5625rem;color:#0b67b2}.budget-meter{display:flex;justify-content:space-between;gap:8px;margin-top:8px;border-radius:9px;background:#effbea;color:#287e2f;padding:7px 9px;font-size:0.5625rem;font-weight:900}.budget-meter.over{background:#ffeceb;color:#a63c36}
.route-console{background:linear-gradient(135deg,#edf8ff,#fff);border-radius:12px}.route-date{font-size:0.5625rem;font-weight:1000;color:#0b67b2;margin-bottom:8px}.route-line{display:grid;grid-template-columns:1fr 28px 1fr 28px 1fr;gap:5px;align-items:end}.route-line label{font-size:0.5rem;color:#54748f;font-weight:900}.route-node{display:block;background:#e9f6ff;padding:5px 7px;border-radius:8px;color:#174f80}.route-arrow{font-size:1.25rem;color:#4c8fbd;text-align:center;padding-bottom:10px}.arrival-card{border:2px solid #c8e2f4;border-radius:10px;padding:7px;background:#f8fbff;display:flex;flex-direction:column;align-items:center;color:#5d7890}.arrival-card span{font-size:0.4375rem;font-weight:1000}.arrival-card b{font-size:1.0625rem;color:#0b5ca8}.arrival-card small{font-size:0.4375rem}.arrival-card.ok{border-color:#7aca70;background:#f1fff0}.arrival-card.ok b{color:#24812c}.arrival-card.late{border-color:#ef9a8f;background:#fff4f2}.arrival-card.late b{color:#bb4d41}
.lostfound-head{font-size:0.625rem;color:#0b5ca8;font-weight:1000;margin-bottom:8px}.lost-builder{margin-bottom:8px}
.map-place.action-selected{filter:drop-shadow(0 0 7px rgba(56,194,72,.75));outline:3px solid rgba(74,190,73,.75);outline-offset:-5px}.map-event.inspected-object{filter:drop-shadow(0 0 8px rgba(126,217,87,.95));border-color:#63c14e!important}.feed-item.city{color:#2f7d32;font-weight:800;background:#effbea}
@media(max-width:1050px){.project-grid{grid-template-columns:repeat(2,1fr)}.route-line{grid-template-columns:1fr 22px 1fr}.route-line .route-arrow:nth-of-type(2){display:none}.arrival-card{grid-column:1/-1}}
@media(max-width:820px){.objective-steps{grid-template-columns:1fr 1fr}.report-builder{grid-template-columns:1fr}.project-grid{grid-template-columns:1fr 1fr}.action-console-head{flex-direction:column}.execute-button{width:100%}.budget-meter{flex-direction:column}.route-line{grid-template-columns:1fr}.route-arrow{transform:rotate(90deg);padding:0}.arrival-card{grid-column:auto}}

/* -------------------------------------------------------------------------
   v0.5 — Multiplayer Build: lobby, presence, reconnect & room resilience
   ------------------------------------------------------------------------- */
.resume-card{margin:12px 0 15px;border:2px solid #168ee7;background:linear-gradient(135deg,#eef9ff,#f7fff1);border-radius:14px;padding:10px 12px;display:flex;justify-content:space-between;gap:12px;align-items:center;box-shadow:0 7px 18px rgba(24,116,184,.11)}
.resume-card b{display:block;color:#0b5ca8;font-size:0.625rem;letter-spacing:.08em}.resume-card span{display:block;margin-top:3px;color:#52748f;font-size:0.625rem}.resume-actions{display:flex;gap:6px;flex-wrap:wrap}.resume-actions button{padding:7px 9px;font-size:0.5rem;white-space:nowrap}
.connection-chip{border-radius:999px;padding:7px 10px;font-size:0.5rem;font-weight:1000;letter-spacing:.08em;border:1px solid rgba(255,255,255,.5);box-shadow:0 2px 8px rgba(0,0,0,.1);white-space:nowrap}.connection-chip.online{background:#eaffdf;color:#247e28;border-color:#7ed957}.connection-chip.connecting{background:#fff8d8;color:#8a6c00;border-color:#f1cc4c}.connection-chip.offline{background:#ffe9e7;color:#a43d34;border-color:#eb8f87}
.room-status{display:flex;gap:6px;flex-wrap:wrap;margin:6px 0 9px}.capacity-pill,.lock-pill{font-size:0.4375rem;font-weight:1000;letter-spacing:.08em;border-radius:999px;padding:4px 7px;background:#eaf7ff;color:#316e9d;border:1px solid #b8dff6}.lock-pill.locked{background:#fff0e9;color:#9a4d2d;border-color:#edb39a}
.player-rich{display:grid!important;grid-template-columns:8px 1fr auto 20px!important;align-items:center;gap:7px!important;padding:7px 8px!important}.player-rich.me{box-shadow:inset 3px 0 #168ee7;background:#f4fbff}.player-rich .connection-dot{width:8px;height:8px;border-radius:50%;background:#62c653;box-shadow:0 0 0 2px rgba(98,198,83,.13)}.player-rich.offline .connection-dot{background:#abb8c3;box-shadow:none}.player-rich.offline{opacity:.62}.player-copy{min-width:0;display:flex;flex-direction:column}.player-copy b{font-size:0.5625rem;color:#214d76;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.player-copy small{font-size:0.4375rem;color:#7690a5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.role-name{font-size:0.4375rem!important;border-radius:999px;padding:3px 5px!important;font-weight:1000}.role-operator{background:#e8f4ff;color:#0960ab}.role-planner{background:#effbe9;color:#347f2f}.role-analyst{background:#fff0ee;color:#aa3d39}.ready-mini{width:18px;height:18px;border-radius:50%;display:grid;place-items:center;background:#e6edf2;color:#7890a1;font-size:0.5625rem;font-weight:1000}.ready-mini.on{background:#60c44f;color:#fff}
.lobby-controls{border-top:1px dashed #c5ddeb;margin-top:8px;padding-top:8px;display:grid;gap:7px}.lobby-controls label{font-size:0.4375rem;letter-spacing:.09em;color:#52728d;font-weight:1000}.lobby-controls select{width:100%;margin-top:4px;padding:7px;border:1px solid #bcdcf0;border-radius:8px;background:#fff;color:#174f80;font-weight:800}.lobby-ready-button{width:100%;font-size:0.5rem}.lobby-ready-button.ready-on{background:#e9fae5;color:#277c29;border-color:#7ed957}.host-hint{font-size:0.4688rem;line-height:1.35;color:#66839b;margin-top:6px;text-align:center;min-height:11px}.start-button:disabled{opacity:.45;cursor:not-allowed;filter:grayscale(.25)}
@media(max-width:900px){.connection-chip{display:none}.resume-card{align-items:flex-start;flex-direction:column}.resume-actions{width:100%}.resume-actions button{flex:1}}

/* v0.5.1 inspection acknowledgement */
.map-place.inspected-location{filter:drop-shadow(0 0 8px rgba(126,217,87,.92))}.map-place.inspected-location span{border-color:#62bd45;background:#f0ffe8;color:#2c6c25}.map-place.inspected-location:before{content:'✓';position:absolute;right:8%;top:8%;z-index:14;width:24px;height:24px;border-radius:999px;display:grid;place-items:center;background:#7ed957;color:#123e1c;font-size:0.9375rem;font-weight:1000;border:2px solid white;box-shadow:0 2px 6px rgba(0,0,0,.22)}

/* -------------------------------------------------------------------------
   v0.7 — Isometric Map Engine 2.0 / Teacher Live Challenge surface
   ------------------------------------------------------------------------- */
.map-view-controls{display:flex;gap:4px;margin-left:auto}.map-view-controls button{border:1px solid #9ccfeb;background:white;color:#0b579e;border-radius:7px;min-width:28px;height:25px;font-weight:1000;cursor:pointer}.map-view-controls #zoomReset{min-width:50px;font-size:0.5625rem}
.city-map.iso-map{min-height:560px;background:linear-gradient(#87d7fb 0 30%,#bcecff 30% 36%,#72d45d 36% 100%);touch-action:none}.city-map.iso-map:before{height:58%;opacity:.3}.iso-viewport{position:absolute;inset:0;overflow:hidden;cursor:grab}.iso-viewport:active{cursor:grabbing}.iso-stage{position:absolute;left:50%;top:2px;transform-origin:center top;transition:transform .08s linear;overflow:visible}.iso-asset{position:absolute;width:184px;height:184px;border:0!important;background:transparent!important;padding:0;margin:0;appearance:none;-webkit-appearance:none;box-shadow:none!important;outline:0;overflow:visible;pointer-events:none;filter:drop-shadow(0 4px 3px rgba(0,50,60,.12))}.iso-asset img{width:100%;height:100%;display:block;object-fit:contain;pointer-events:none;background:transparent}.iso-building,.iso-prop.map-place{pointer-events:auto;cursor:pointer}.iso-road{filter:drop-shadow(0 2px 2px rgba(0,0,0,.09))}.iso-terrain{filter:none}.iso-asset.map-place span{position:absolute;left:50%;bottom:1px;transform:translateX(-50%);background:rgba(255,255,255,.95);border:2px solid #2485d1;border-radius:999px;padding:2px 8px;color:#0b4b92;font-size:0.5rem;font-weight:1000;white-space:nowrap;box-shadow:0 2px 4px rgba(0,62,112,.18)}.iso-asset.map-place:hover,.iso-asset.map-place.selected{transform:translateY(-5px) scale(1.045);filter:drop-shadow(0 10px 7px rgba(0,64,83,.24))}.iso-asset.map-place.mission-focus:after{inset:12%;border-radius:50%;}.iso-asset.map-place.inspected-location:before{content:'✓';position:absolute;right:18px;top:18px;width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:#45b64a;color:white;border:3px solid white;font-size:0.8125rem;font-weight:1000;z-index:5;box-shadow:0 2px 7px rgba(0,0,0,.2)}.iso-asset.map-place.action-selected span{background:#eaffdf;border-color:#4caf50;color:#257a2a}.map-event{z-index:999}
.live-challenge-banner{margin-top:12px;display:grid;grid-template-columns:50px 1fr auto;gap:12px;align-items:center;padding:12px 15px;border:3px solid #f1a91d;border-radius:16px;background:linear-gradient(100deg,#fff8d9,#fffdf5);box-shadow:0 5px 0 #f5dda7}.live-challenge-icon{font-size:1.875rem}.live-challenge-kicker{font-size:0.5625rem;letter-spacing:.12em;font-weight:1000;color:#b46b00}.live-challenge-copy h2{margin:2px 0 3px;color:#7b4b00;font-size:1.1875rem}.live-challenge-copy p{margin:0;color:#6b604d;font-size:0.6875rem;white-space:pre-wrap}.live-challenge-side{text-align:center}.live-reward{font-size:1.25rem;font-weight:1000;color:#278a2f}.live-timer{margin-top:3px;background:#7b4b00;color:white;border-radius:8px;padding:5px 8px;font-family:Consolas,monospace;font-weight:1000}.live-challenge-banner.expired{border-color:#dc6658;background:#fff0ed}.live-challenge-banner.expired .live-timer{background:#ba4035}.live-challenge-banner.completed{border-color:#54ba50;background:#efffec}.live-challenge-banner.completed .live-challenge-kicker:after{content:' • COMPLETED';color:#278a2f}
@media(max-width:820px){.city-map.iso-map{min-height:470px}.live-challenge-banner{grid-template-columns:36px 1fr}.live-challenge-side{grid-column:1/-1;display:flex;gap:8px;justify-content:center;align-items:center}}


/* v0.7.2 — Grounded base-tile hotfix
   Terrain, roads and buildings are alternate BASE sprites for one cell.
   Only props are overlays. Location UI is rendered in a separate HUD layer
   so foreground map cells never cover labels/check marks. */
.iso-building{filter:drop-shadow(0 4px 3px rgba(0,50,60,.12))}
.iso-building.map-place:hover,.iso-building.map-place.selected{transform:none;filter:drop-shadow(0 7px 5px rgba(0,64,83,.23)) brightness(1.035)}
.iso-asset.map-place.inspected-location:before{display:none!important}
.iso-place-label{position:absolute;transform:translate(-50%,-50%);pointer-events:none;background:rgba(255,255,255,.98);border:2px solid #2485d1;border-radius:999px;padding:2px 8px;color:#0b4b92;font-size:0.5rem;font-weight:1000;white-space:nowrap;box-shadow:0 2px 4px rgba(0,62,112,.20),0 0 0 1px rgba(255,255,255,.55)}
.iso-place-label.inspected-location{border-color:#62bd45;background:#f0ffe8;color:#2c6c25}
.iso-place-label.action-selected{border-color:#4caf50;background:#eaffdf;color:#257a2a;box-shadow:0 0 0 3px rgba(76,175,80,.16),0 2px 4px rgba(0,62,112,.18)}
.iso-place-label.mission-focus{box-shadow:0 0 0 3px rgba(255,191,45,.20),0 2px 4px rgba(0,62,112,.18)}
.iso-place-check{position:absolute;pointer-events:none;width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:#45b64a;color:white;border:3px solid white;font-size:0.8125rem;font-weight:1000;box-shadow:0 2px 7px rgba(0,0,0,.2)}
.iso-place-check.hidden{display:none}

/* v0.7.4 — cell-stack painter model + normalized base-tile ground plane */
.iso-cell-stack{position:absolute;overflow:visible;pointer-events:none}
.iso-cell-stack .iso-asset{left:0!important;top:var(--tile-shift-y,0px)!important;z-index:1!important}
.iso-cell-stack .iso-prop{z-index:2!important}
.iso-cell-stack .map-place{pointer-events:auto}
.iso-ui-anchor{position:absolute;width:0;height:0;pointer-events:none;overflow:visible}
.iso-ui-anchor .iso-place-label{left:0;top:0}
.iso-ui-anchor .iso-place-check{left:20px;top:-22px}

/* -------------------------------------------------------------------------
   v0.7.8 — Adaptive Display, readable typography and shared settings
   ------------------------------------------------------------------------- */
:root{
  --civitas-layout-max:1860px;
  --student-map-height:650px;
  --teacher-map-height:700px;
  --student-left-col:300px;
  --student-right-col:315px;
}

/* The workspace now uses the screen instead of leaving a large unused frame.
   The map is deliberately the main elastic region. */
.game-grid{
  width:min(calc(100vw - 20px),var(--civitas-layout-max));
  max-width:var(--civitas-layout-max);
  grid-template-columns:var(--student-left-col) minmax(560px,1fr) var(--student-right-col);
}
.city-map,.city-map.iso-map{min-height:var(--student-map-height);height:var(--student-map-height)}
.teacher-shell{width:min(calc(100vw - 24px),var(--civitas-layout-max));max-width:var(--civitas-layout-max)}
.citylab-workspace .citylab-layout{grid-template-columns:clamp(220px,14vw,285px) minmax(560px,1fr) clamp(315px,21vw,400px)}
.citylab-workspace .lab-canvas-wrap{height:var(--teacher-map-height)!important}

/* The logo is the settings button in both the student and teacher UIs. */
.civitas-settings-trigger{cursor:pointer;position:relative;border-radius:16px;outline:none}
.civitas-settings-trigger:focus-visible{box-shadow:0 0 0 4px rgba(255,191,45,.8)}
.civitas-settings-trigger:after{content:'⚙';position:absolute;right:0;bottom:3px;width:25px;height:25px;display:grid;place-items:center;border-radius:50%;background:#fff;border:2px solid #1789df;color:#0a5ca8;font-size:.7rem;box-shadow:0 3px 8px rgba(0,52,100,.22);pointer-events:none}
.hero-logo.civitas-settings-trigger:after{display:none}

.ui-settings-backdrop{position:fixed;inset:0;z-index:2500;background:rgba(3,28,53,.74);display:none;align-items:center;justify-content:center;padding:20px;overflow:auto}
.ui-settings-backdrop.open{display:flex}
.ui-settings-card{width:min(720px,96vw);background:linear-gradient(#fff,#f0f9ff);border:4px solid #168ee7;border-radius:22px;box-shadow:0 28px 80px rgba(0,0,0,.38);padding:20px;position:relative;color:#173f71}
.ui-settings-close{position:absolute;right:12px;top:10px;width:36px;height:36px;border:0;border-radius:50%;background:#e7f4fd;color:#0b5ba7;font-size:1.25rem;font-weight:1000;cursor:pointer}
.ui-settings-head{display:flex;align-items:center;gap:14px;padding-right:35px;border-bottom:2px solid #d6ebf8;padding-bottom:12px}.ui-settings-head img{width:118px;height:70px;object-fit:contain}.ui-settings-head h2{margin:1px 0 2px;color:#074a9d;font-size:1.55rem}.ui-settings-head p{margin:0;color:#607d95;font-size:.78rem}.ui-settings-kicker{font-size:.62rem;letter-spacing:.1em;color:#1681d5;font-weight:1000}
.ui-settings-grid{display:grid;gap:11px;margin:15px 0}.ui-settings-grid>label,.ui-toggle-row{display:grid;gap:5px;background:#f8fdff;border:1px solid #cce6f5;border-radius:12px;padding:11px}.ui-settings-grid label>b,.ui-toggle-row b{font-size:.78rem;color:#0b4f96}.ui-settings-grid small,.ui-toggle-row small{display:block;color:#627f95;font-size:.68rem;line-height:1.35;margin-top:2px}.ui-settings-grid select{width:100%;padding:9px 10px;border:2px solid #b8dbea;background:#fff;border-radius:9px;color:#173f71;font-weight:800}.ui-toggle-row{grid-template-columns:1fr auto;align-items:center}.ui-toggle-row input{width:23px;height:23px;accent-color:#32ad36}.ui-viewport-readout{background:#eaf7ff;border-left:4px solid #168ee7;padding:8px 10px;border-radius:8px;font-size:.7rem;color:#356681}.ui-settings-actions{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap;margin-top:14px}.ui-settings-actions button{font-size:.72rem;padding:9px 12px}.ui-logout-button{border:2px solid #dc6666;background:#fff3f3;color:#a73535;border-radius:12px;padding:9px 12px;font-weight:1000;cursor:pointer}.ui-settings-foot{text-align:center;color:#7891a5;font-size:.62rem;margin-top:10px}

/* Manual compact profiles intentionally collapse auxiliary panels before the
   map. Auto Fit uses live viewport measurements supplied by ui-settings.js. */
body[data-auto-fit="false"][data-resolution="1280x720"] .game-grid,
body[data-auto-fit="false"][data-resolution="1366x768"] .game-grid{grid-template-columns:240px minmax(520px,1fr)}
body[data-auto-fit="false"][data-resolution="1280x720"] .feed-panel,
body[data-auto-fit="false"][data-resolution="1366x768"] .feed-panel{grid-column:1/-1}

@media(max-width:1320px){
  .game-grid{grid-template-columns:minmax(220px,var(--student-left-col)) minmax(520px,1fr)}
  .feed-panel{grid-column:1/-1}.feed{height:230px}.top-actions{display:none}
  .citylab-workspace .citylab-layout{grid-template-columns:minmax(210px,250px) 1fr}.citylab-workspace .citylab-layout>.lab-panel:last-child{grid-column:1/-1}
}
@media(max-width:860px){
  .game-grid{width:min(calc(100vw - 10px),var(--civitas-layout-max));grid-template-columns:1fr}.left-column{grid-template-columns:1fr 1fr}.city-map,.city-map.iso-map{height:max(340px,min(var(--student-map-height),58vh));min-height:340px}
  .teacher-page{padding:12px}.teacher-shell{width:100%}.citylab-workspace .citylab-layout{grid-template-columns:1fr}.citylab-workspace .citylab-layout>.lab-panel:last-child{grid-column:auto}.citylab-workspace .lab-canvas-wrap{height:max(390px,min(var(--teacher-map-height),60vh))!important}
  .ui-settings-head img{width:86px}.ui-settings-actions{justify-content:stretch}.ui-settings-actions button{flex:1 1 180px}
}
@media(max-width:560px){.left-column{grid-template-columns:1fr}.city-map,.city-map.iso-map{height:max(320px,min(var(--student-map-height),54vh));min-height:320px}.teacher-brand img{width:130px;height:72px}.teacher-title h1{font-size:1.25rem}}
/* v0.7.8 finishing alignment: the teacher shell already lives inside page
   padding, so 100% avoids a horizontal scrollbar on wide displays. */
.teacher-shell{width:100%}
.teacher-brand.civitas-settings-trigger:after{left:158px;right:auto;bottom:6px}
.top-brand.civitas-settings-trigger:after{left:150px;right:auto;bottom:3px}

/* v0.7.14 — Team chat + attention telemetry */
.team-chat-composer{display:grid;grid-template-columns:1fr auto;gap:7px;margin-top:8px;padding-top:8px;border-top:1px solid #d8ebf6}.team-chat-composer input{min-width:0;border:1px solid #b9d9e9;border-radius:9px;padding:9px 10px;background:#fff;color:#24465f}.team-chat-composer button{padding:8px 12px;font-size:.5625rem}.chat-hint{font-size:.4375rem;color:#7890a2;margin:4px 1px 8px}.feed-item.chat{background:#f5fbff;border:1px solid #d6eaf5;border-radius:9px;padding:7px 8px;margin:5px 0;line-height:1.25}.feed-item.chat.teacher_chat{background:#fff7d9;border-color:#ead177}.feed-item.clue::before{content:"SHARED INTEL";display:block;margin-bottom:3px;color:#946000;font-size:.48rem;font-weight:1000;letter-spacing:.06em}.feed-chat-meta{display:flex;justify-content:space-between;gap:8px;margin-bottom:3px;font-size:.4375rem;color:#758da0}.feed-chat-meta b{font-size:.5rem;color:#175d9b}.feed-item.teacher_chat .feed-chat-meta b{color:#946000}.player-rich.screen-away{box-shadow:inset 3px 0 #f0a126;background:#fff8e8}.player-rich.screen-away .connection-dot{background:#f0a126}.player-rich.screen-away .player-copy b{color:#a15e00}

/* =======================================================================
   v0.7.15 — FULL-SCREEN CITY HUD
   The city map is the game surface. Auxiliary information lives as HUD
   overlays around the edges, city-simulator style.
   ======================================================================= */
.game-screen.active{
  position:fixed;inset:0;width:100vw;height:100vh;min-height:0;overflow:hidden;
  background:#69c9f3;
}
.game-screen .topbar-hotzone{
  position:fixed;z-index:181;left:0;right:0;top:0;height:17px;
  display:flex;justify-content:center;align-items:flex-start;pointer-events:auto;
  color:rgba(255,255,255,.72);font-size:.42rem;font-weight:1000;letter-spacing:.12em;
  background:linear-gradient(180deg,rgba(7,91,161,.34),rgba(7,91,161,0));
  text-shadow:0 1px 2px rgba(0,44,91,.55);cursor:n-resize;
}
.game-screen .topbar-hotzone span{opacity:0;transition:opacity .18s ease;padding-top:1px}
.game-screen .topbar-hotzone:hover span{opacity:1}
.game-screen .topbar{
  position:fixed;left:0;right:0;top:0;height:84px;z-index:180;margin:0;
  transform:translateY(calc(-100% + 9px));
  transition:transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .22s ease;
  background:rgba(255,255,255,.94);backdrop-filter:blur(15px) saturate(1.15);
  -webkit-backdrop-filter:blur(15px) saturate(1.15);
  box-shadow:0 8px 30px rgba(0,45,92,.24);
}
.game-screen .topbar-hotzone:hover + .topbar,
.game-screen .topbar:hover,
.game-screen .topbar:focus-within{transform:translateY(0)}

.game-screen .game-grid{
  position:fixed;inset:0;display:block;width:100vw;height:100vh;min-height:0;
  max-width:none;margin:0;padding:0;pointer-events:none;z-index:1;
}
.game-screen .game-grid>*{pointer-events:auto}
.game-screen .mission-panel{
  position:absolute;inset:0;z-index:1;padding:0;margin:0;border:0;border-radius:0;
  background:transparent;box-shadow:none;pointer-events:none;overflow:visible;
}
.game-screen .mission-panel>*{pointer-events:auto}
.game-screen .city-shell{
  position:absolute;inset:0;z-index:0;border:0;border-radius:0;box-shadow:none;
  background:transparent;overflow:hidden;
}
.game-screen .city-map,
.game-screen .city-map.iso-map{
  position:absolute;inset:0;width:100vw;height:100vh!important;min-height:100vh!important;
  border:0;border-radius:0;overflow:hidden;touch-action:none;
  /* Pastoral desktop-wallpaper feel without copying any specific artwork. */
  background:
    radial-gradient(ellipse at 11% 13%,rgba(255,255,255,.97) 0 3.2%,rgba(255,255,255,.78) 3.4% 5.3%,transparent 5.6%),
    radial-gradient(ellipse at 18% 16%,rgba(255,255,255,.92) 0 3.7%,transparent 4.0%),
    radial-gradient(ellipse at 76% 11%,rgba(255,255,255,.94) 0 4.0%,rgba(255,255,255,.68) 4.1% 6.0%,transparent 6.3%),
    radial-gradient(ellipse at 84% 14%,rgba(255,255,255,.93) 0 3.5%,transparent 3.8%),
    linear-gradient(180deg,#4fbaf3 0%,#72cef6 25%,#a7e4fb 45%,#dff7ff 53%,#76cf48 54%,#64c13c 72%,#55ad31 100%);
}
.game-screen .city-map.iso-map:before{
  content:"";position:absolute;inset:auto -8% -13% -8%;height:61%;opacity:1;pointer-events:none;
  background:
    radial-gradient(ellipse at 17% 93%,#7ed44c 0 28%,transparent 28.8%),
    radial-gradient(ellipse at 42% 104%,#67c33e 0 37%,transparent 37.8%),
    radial-gradient(ellipse at 72% 96%,#75cd46 0 31%,transparent 31.8%),
    radial-gradient(ellipse at 92% 103%,#5eb538 0 38%,transparent 38.8%);
  filter:saturate(1.08);
}
.game-screen .city-map.iso-map:after{
  content:"";position:absolute;left:0;right:0;top:47%;height:10%;pointer-events:none;opacity:.34;
  background:linear-gradient(180deg,rgba(255,255,255,.82),rgba(255,255,255,0));
  filter:blur(7px);
}

body[data-sky-phase="dawn"] .game-screen .city-map.iso-map{
  background:
    radial-gradient(circle at 78% 17%,rgba(255,236,183,.96) 0 3.3%,rgba(255,208,133,.52) 3.5% 8.8%,transparent 9.2%),
    radial-gradient(ellipse at 14% 17%,rgba(255,255,255,.95) 0 3.1%,rgba(255,243,226,.6) 3.4% 5.6%,transparent 6%),
    radial-gradient(ellipse at 24% 21%,rgba(255,255,255,.74) 0 3.5%,transparent 4%),
    radial-gradient(ellipse at 72% 11%,rgba(255,241,223,.85) 0 3.7%,transparent 4.1%),
    linear-gradient(180deg,#ffb676 0%,#ffc995 13%,#ffdcb5 24%,#ffe8cf 36%,#d9f1ff 49%,#f4fbff 56%,#8fdb66 57%,#78c94a 75%,#5cae35 100%);
}
body[data-sky-phase="dawn"] .game-screen .city-map.iso-map:before{
  background:
    radial-gradient(ellipse at 13% 92%,rgba(168,232,97,.98) 0 22%,transparent 22.8%),
    radial-gradient(ellipse at 34% 104%,rgba(130,210,73,.92) 0 30%,transparent 30.8%),
    radial-gradient(ellipse at 56% 97%,rgba(116,196,65,.9) 0 28%,transparent 28.8%),
    radial-gradient(ellipse at 78% 106%,rgba(103,186,60,.92) 0 33%,transparent 33.8%),
    radial-gradient(ellipse at 95% 98%,rgba(126,204,71,.92) 0 23%,transparent 23.8%);
  filter:saturate(1.08) brightness(1.03);
}
body[data-sky-phase="dawn"] .game-screen .city-map.iso-map:after{
  top:44%;height:14%;opacity:.5;
  background:linear-gradient(180deg,rgba(255,241,222,.88),rgba(255,255,255,0));
  filter:blur(10px);
}

body[data-sky-phase="day"] .game-screen .city-map.iso-map{
  background:
    radial-gradient(ellipse at 11% 13%,rgba(255,255,255,.97) 0 3.2%,rgba(255,255,255,.78) 3.4% 5.3%,transparent 5.6%),
    radial-gradient(ellipse at 18% 16%,rgba(255,255,255,.92) 0 3.7%,transparent 4.0%),
    radial-gradient(ellipse at 76% 11%,rgba(255,255,255,.94) 0 4.0%,rgba(255,255,255,.68) 4.1% 6.0%,transparent 6.3%),
    radial-gradient(ellipse at 84% 14%,rgba(255,255,255,.93) 0 3.5%,transparent 3.8%),
    radial-gradient(circle at 76% 16%,rgba(255,248,191,.88) 0 2.9%,rgba(255,242,154,.32) 3.1% 7.5%,transparent 7.9%),
    linear-gradient(180deg,#4fbaf3 0%,#69c8f4 18%,#8ad8f8 31%,#bfeefe 46%,#e6fbff 54%,#79d14c 55%,#66c23c 73%,#56af32 100%);
}
body[data-sky-phase="day"] .game-screen .city-map.iso-map:before{
  background:
    radial-gradient(ellipse at 15% 95%,rgba(126,219,77,.98) 0 25%,transparent 25.8%),
    radial-gradient(ellipse at 38% 106%,rgba(103,201,62,.95) 0 34%,transparent 34.8%),
    radial-gradient(ellipse at 67% 98%,rgba(118,210,71,.93) 0 29%,transparent 29.8%),
    radial-gradient(ellipse at 89% 105%,rgba(96,187,56,.95) 0 36%,transparent 36.8%);
  filter:saturate(1.1) brightness(1.01);
}
body[data-sky-phase="day"] .game-screen .city-map.iso-map:after{
  top:47%;height:11%;opacity:.34;
  background:linear-gradient(180deg,rgba(255,255,255,.82),rgba(255,255,255,0));
  filter:blur(8px);
}

body[data-sky-phase="dusk"] .game-screen .city-map.iso-map{
  background:
    radial-gradient(circle at 79% 18%,rgba(255,225,159,.95) 0 3.6%,rgba(255,171,95,.48) 3.8% 9.5%,transparent 10%),
    radial-gradient(ellipse at 17% 17%,rgba(255,255,255,.78) 0 3.4%,rgba(255,221,195,.3) 3.7% 5.5%,transparent 5.9%),
    radial-gradient(ellipse at 87% 16%,rgba(255,229,213,.55) 0 3.8%,transparent 4.3%),
    linear-gradient(180deg,#4f77d6 0%,#7a8de5 13%,#d48a67 31%,#f0b27a 41%,#ffd3a9 51%,#fff0d7 58%,#86ca59 59%,#6ab246 75%,#4f9131 100%);
}
body[data-sky-phase="dusk"] .game-screen .city-map.iso-map:before{
  background:
    radial-gradient(ellipse at 12% 94%,rgba(138,210,82,.94) 0 24%,transparent 24.8%),
    radial-gradient(ellipse at 36% 104%,rgba(115,189,64,.9) 0 31%,transparent 31.8%),
    radial-gradient(ellipse at 60% 98%,rgba(99,169,57,.88) 0 28%,transparent 28.8%),
    radial-gradient(ellipse at 82% 107%,rgba(88,151,50,.9) 0 34%,transparent 34.8%),
    radial-gradient(ellipse at 98% 99%,rgba(111,179,63,.9) 0 23%,transparent 23.8%);
  filter:saturate(1.02) brightness(.97);
}
body[data-sky-phase="dusk"] .game-screen .city-map.iso-map:after{
  top:45%;height:16%;opacity:.58;
  background:linear-gradient(180deg,rgba(255,225,198,.92),rgba(255,255,255,0));
  filter:blur(11px);
}

body[data-sky-phase="night"] .game-screen .city-map.iso-map{
  background:
    radial-gradient(circle at 77% 16%,rgba(252,247,209,.92) 0 2.3%,rgba(255,241,170,.28) 2.5% 6.8%,transparent 7.2%),
    radial-gradient(circle at 10% 11%,rgba(255,255,255,.92) 0 .16%,transparent .3%),
    radial-gradient(circle at 15% 19%,rgba(255,255,255,.66) 0 .13%,transparent .24%),
    radial-gradient(circle at 22% 14%,rgba(255,255,255,.86) 0 .15%,transparent .28%),
    radial-gradient(circle at 31% 9%,rgba(255,255,255,.58) 0 .11%,transparent .22%),
    radial-gradient(circle at 46% 16%,rgba(255,255,255,.8) 0 .15%,transparent .27%),
    radial-gradient(circle at 58% 9%,rgba(255,255,255,.74) 0 .14%,transparent .25%),
    radial-gradient(circle at 67% 13%,rgba(255,255,255,.9) 0 .15%,transparent .27%),
    radial-gradient(circle at 85% 10%,rgba(255,255,255,.68) 0 .13%,transparent .23%),
    linear-gradient(180deg,#0b1735 0%,#11264a 18%,#203d63 34%,#43627d 49%,#7392a3 56%,#7cbf63 57%,#5ba447 74%,#417e33 100%);
}
body[data-sky-phase="night"] .game-screen .city-map.iso-map:before{
  background:
    radial-gradient(ellipse at 15% 95%,rgba(83,161,62,.92) 0 24%,transparent 24.8%),
    radial-gradient(ellipse at 39% 106%,rgba(67,136,49,.9) 0 34%,transparent 34.8%),
    radial-gradient(ellipse at 68% 98%,rgba(76,148,55,.88) 0 29%,transparent 29.8%),
    radial-gradient(ellipse at 89% 105%,rgba(58,117,43,.92) 0 36%,transparent 36.8%);
  opacity:.98;filter:saturate(.9) brightness(.92);
}
body[data-sky-phase="night"] .game-screen .city-map.iso-map:after{
  top:45%;height:13%;opacity:.2;
  background:linear-gradient(180deg,rgba(169,210,243,.28),rgba(255,255,255,0));
  filter:blur(12px);
}

/* Glass HUD cards ------------------------------------------------------ */
.game-screen .game-card{
  background:linear-gradient(150deg,rgba(255,255,255,.93),rgba(242,250,255,.83));
  backdrop-filter:blur(14px) saturate(1.13);-webkit-backdrop-filter:blur(14px) saturate(1.13);
  border:2px solid rgba(34,139,213,.72);box-shadow:0 12px 34px rgba(0,48,82,.2);
}
.game-screen .left-column{
  position:fixed;z-index:110;left:14px;top:26px;bottom:18px;
  width:var(--student-left-col);display:grid;grid-auto-rows:max-content;align-content:start;
  gap:10px;overflow-y:auto;overflow-x:hidden;padding:0 4px 8px 0;
  scrollbar-width:thin;pointer-events:auto;
}
.game-screen .left-column .sidebar{padding:11px;border-radius:17px}
.game-screen .feed-panel{
  position:fixed;z-index:110;right:14px;top:26px;bottom:18px;width:var(--student-right-col);
  padding:11px;border-radius:17px;display:flex;flex-direction:column;min-height:0;overflow:hidden;
  align-self:auto;pointer-events:auto;
}
.game-screen .feed-panel .feed{height:auto!important;min-height:110px;flex:1 1 auto;overflow:auto;background:rgba(249,253,255,.82)}
.game-screen .team-chat-composer{flex:0 0 auto}.game-screen .chat-hint{flex:0 0 auto}
.game-screen .sidequest{flex:0 1 auto;max-height:38vh;overflow:auto}
.game-screen .dev-channel{min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin}
.game-screen .dev-channel:not(.collapsed){flex:0 0 clamp(250px,42vh,440px);height:clamp(250px,42vh,440px);max-height:clamp(250px,42vh,440px)}
.game-screen .dev-channel.collapsed{flex:0 0 auto;height:auto;max-height:none;overflow:hidden}

/* Mission info becomes a compact floating command strip. */
.game-screen .mission-head{
  position:fixed;z-index:105;top:28px;
  left:calc(var(--student-left-col) + 34px);right:calc(var(--student-right-col) + 34px);
  min-height:72px;display:flex;align-items:flex-start;justify-content:space-between;gap:14px;
  padding:10px 14px;border:2px solid rgba(118,187,231,.7);border-radius:16px;
  background:linear-gradient(140deg,rgba(255,255,255,.9),rgba(238,249,255,.78));
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  box-shadow:0 8px 26px rgba(0,55,97,.16);pointer-events:auto;
}
.game-screen .mission-head h1{font-size:1.22rem;margin:3px 0 1px}.game-screen .brief{margin:2px 0 0;line-height:1.25}
.game-screen .chips{gap:4px}.game-screen .chip{padding:3px 7px}.game-screen .progress{padding:6px 10px}

/* Map navigation pill floats below mission info. */
.game-screen .city-toolbar{
  position:fixed;z-index:106;top:112px;right:calc(var(--student-right-col) + 34px);
  width:auto;max-width:min(560px,46vw);display:flex;gap:8px;padding:6px 9px;border:1px solid rgba(135,199,235,.84);
  border-radius:999px;background:rgba(255,255,255,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  box-shadow:0 7px 20px rgba(0,55,97,.13);font-size:.56rem;
}
.game-screen .city-toolbar>span:first-child{display:none}.game-screen .city-toolbar #mapCaption{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:330px}

.game-screen .place-drawer{
  position:fixed;z-index:145;left:auto;right:calc(var(--student-right-col) + 34px);top:151px;
  width:min(350px,calc(100vw - var(--student-left-col) - var(--student-right-col) - 90px));
  max-height:calc(100vh - 175px);background:linear-gradient(150deg,rgba(255,255,255,.97),rgba(242,250,255,.93));
  backdrop-filter:blur(13px);-webkit-backdrop-filter:blur(13px);
}

.game-screen .live-challenge-banner{
  position:fixed;z-index:130;top:150px;
  left:calc(var(--student-left-col) + 34px);right:calc(var(--student-right-col) + 34px);
  margin:0;box-shadow:0 12px 34px rgba(58,44,0,.18);pointer-events:auto;
}
.game-screen .objective-rail{
  position:fixed;z-index:104;left:calc(var(--student-left-col) + 34px);right:calc(var(--student-right-col) + 34px);
  top:150px;margin:0;padding:7px 9px;background:rgba(247,252,255,.83);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);
  box-shadow:0 7px 18px rgba(0,55,97,.11);pointer-events:auto;
}
.game-screen .live-challenge-banner:not(.hidden)~.objective-rail{top:258px}
.game-screen .objective-title{display:none}.game-screen .objective-steps{grid-template-columns:repeat(5,1fr);gap:5px}.game-screen .objective-step{padding:5px}

/* The current mission console floats along the bottom like a strategy-game HUD. */
.game-screen .action-box,
.game-screen .complete{
  position:fixed;z-index:120;left:calc(var(--student-left-col) + 34px);right:calc(var(--student-right-col) + 34px);
  bottom:18px;margin:0;max-height:43vh;overflow:auto;border:2px solid rgba(116,191,234,.78);
  background:linear-gradient(150deg,rgba(255,255,255,.94),rgba(240,250,255,.88));
  backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);box-shadow:0 12px 36px rgba(0,48,82,.2);
}
.game-screen .complete{padding:18px;border-radius:18px;text-align:center}

/* Event markers and map labels must remain above the landscape but below HUD. */
.game-screen .map-event{z-index:80}.game-screen .iso-ui-anchor{z-index:65000!important}

/* Student penalty alert ------------------------------------------------ */
.penalty-overlay{
  position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:20px;
  background:rgba(74,0,0,.68);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);
}
.penalty-card{
  width:min(650px,94vw);text-align:center;padding:26px 30px 24px;border-radius:24px;
  background:linear-gradient(160deg,#fff7f7,#ffe3e3);border:5px solid #c91f28;
  box-shadow:0 28px 90px rgba(78,0,0,.5),inset 0 0 0 2px rgba(255,255,255,.85);
  animation:penaltyPop .22s cubic-bezier(.2,.9,.25,1.15);
}
.penalty-icon{font-size:3.7rem;line-height:1;filter:drop-shadow(0 4px 0 rgba(95,0,0,.12))}
.penalty-kicker{margin-top:9px;color:#a30f17;font-size:.65rem;font-weight:1000;letter-spacing:.14em}
.penalty-card h2{margin:5px 0 10px;color:#a80f17;font-size:2rem;letter-spacing:.045em}
.penalty-card p{margin:0 auto;max-width:520px;color:#5d2226;font-size:1rem;line-height:1.45;font-weight:800;white-space:pre-wrap}
.penalty-meta{margin:14px auto 0;max-width:520px;background:#fff;border:1px solid #efadb1;border-radius:12px;padding:9px;color:#8c2d32;font-size:.68rem}
.penalty-ack{margin-top:18px;border:3px solid #7f0c12;border-radius:14px;background:linear-gradient(#ef4149,#b5121b);color:#fff;padding:12px 26px;font-weight:1000;cursor:pointer;box-shadow:0 4px 0 #770b11}
.penalty-ack:active{transform:translateY(3px);box-shadow:0 1px 0 #770b11}
@keyframes penaltyPop{from{opacity:0;transform:scale(.82) translateY(20px)}to{opacity:1;transform:none}}

/* Responsive HUD: preserve the map as the dominant surface even on small
   school laptops. Side HUDs become narrower before the map itself is touched. */
@media(max-width:1180px){
  .game-screen{--student-left-col:245px;--student-right-col:275px}
  .game-screen .left-column{left:8px}.game-screen .feed-panel{right:8px}
  .game-screen .mission-head,.game-screen .objective-rail,.game-screen .action-box,.game-screen .complete,.game-screen .live-challenge-banner{left:270px;right:300px}
  .game-screen .city-toolbar,.game-screen .place-drawer{right:300px}
  .game-screen .mission-head h1{font-size:1.05rem}.game-screen .brief{font-size:.67rem}
}
@media(max-width:900px){
  .game-screen{--student-left-col:205px;--student-right-col:230px}
  .game-screen .left-column{left:5px;top:22px}.game-screen .feed-panel{right:5px;top:22px}
  .game-screen .left-column .sidebar,.game-screen .feed-panel{padding:8px}
  .game-screen .mission-head,.game-screen .objective-rail,.game-screen .action-box,.game-screen .complete,.game-screen .live-challenge-banner{left:220px;right:245px}
  .game-screen .city-toolbar,.game-screen .place-drawer{right:245px}
  .game-screen .mission-head{padding:8px 10px}.game-screen .mission-head .brief{display:none}
  .game-screen .objective-step small{display:none}.game-screen .objective-step{grid-template-columns:22px 1fr}.game-screen .objective-step>span{width:20px;height:20px}
  .game-screen .action-box{max-height:48vh;padding:9px}
}
@media(max-width:680px){
  .game-screen{--student-left-col:175px;--student-right-col:190px}
  .game-screen .mission-head,.game-screen .objective-rail,.game-screen .action-box,.game-screen .complete,.game-screen .live-challenge-banner{left:185px;right:200px}
  .game-screen .city-toolbar,.game-screen .place-drawer{right:200px}
  .game-screen .mission-head .chips{display:none}.game-screen .room-chip{display:none}
  .game-screen .feed-panel .card-title,.game-screen .left-column .card-title{font-size:.72rem}
}
.game-screen .feed-item.penalty{color:#a3131b;background:#fff0f1;border-color:#efb4b8;font-weight:900}

/* =======================================================================
   v0.8.0 — EDGE DRAWER HUD
   The map remains the whole game surface. Mission, team, chat and action UI
   are now reveal-on-demand drawers instead of permanent overlays.
   ======================================================================= */

/* Edge sensors ---------------------------------------------------------- */
.game-screen .hud-edge-hotzone{
  position:fixed;z-index:190;border:0;margin:0;padding:0;background:transparent;
  color:#fff;font:1000 .48rem/1.1 system-ui,sans-serif;letter-spacing:.09em;
  cursor:pointer;opacity:.82;transition:opacity .18s ease,background .18s ease;
}
.game-screen .hud-edge-hotzone span{
  display:inline-flex;align-items:center;justify-content:center;
  background:rgba(8,82,145,.52);border:1px solid rgba(255,255,255,.38);
  box-shadow:0 3px 12px rgba(0,47,89,.2);backdrop-filter:blur(7px);
  -webkit-backdrop-filter:blur(7px);text-shadow:0 1px 2px rgba(0,43,83,.55);
  transition:opacity .18s ease,transform .18s ease;
}
.game-screen .topbar-hotzone{left:0;right:0;top:0;height:16px;display:flex;justify-content:center;align-items:flex-start}
.game-screen .topbar-hotzone span{padding:2px 14px 3px;border-radius:0 0 10px 10px;transform:translateY(-75%);opacity:.35}
.game-screen .topbar-hotzone:hover span{transform:none;opacity:1}
.game-screen .left-hud-hotzone{left:0;top:18%;bottom:18%;width:16px;display:flex;align-items:center;justify-content:flex-start}
.game-screen .left-hud-hotzone span{writing-mode:vertical-rl;transform:rotate(180deg) translateX(76%);padding:12px 3px;border-radius:0 9px 9px 0;opacity:.42}
.game-screen .left-hud-hotzone:hover span{transform:rotate(180deg);opacity:1}
.game-screen .right-hud-hotzone{right:0;top:18%;bottom:18%;width:16px;display:flex;align-items:center;justify-content:flex-end}
.game-screen .right-hud-hotzone span{writing-mode:vertical-rl;padding:12px 3px;border-radius:9px 0 0 9px;transform:translateX(76%);opacity:.42}
.game-screen .right-hud-hotzone:hover span{transform:none;opacity:1}
.game-screen .bottom-hud-hotzone{left:20%;right:20%;bottom:0;height:17px;display:flex;justify-content:center;align-items:flex-end}
.game-screen .bottom-hud-hotzone span{padding:3px 15px 2px;border-radius:10px 10px 0 0;transform:translateY(72%);opacity:.42}
.game-screen .bottom-hud-hotzone:hover span{transform:none;opacity:1}

/* Keyboard-mode reminder. Hidden in hover mode. */
.game-screen .hud-shortcut-legend{
  display:none;position:fixed;z-index:188;right:18px;bottom:15px;gap:6px;align-items:center;
  padding:6px 8px;border:1px solid rgba(255,255,255,.55);border-radius:12px;
  background:rgba(7,68,119,.62);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  box-shadow:0 5px 18px rgba(0,43,77,.2);color:#fff;font-size:.48rem;font-weight:900;
  pointer-events:none;
}
.game-screen .hud-shortcut-legend span{display:flex;align-items:center;gap:3px;white-space:nowrap}
.game-screen .hud-shortcut-legend kbd{display:inline-grid;place-items:center;min-width:19px;height:19px;padding:0 4px;border:1px solid rgba(255,255,255,.78);border-radius:5px;background:rgba(255,255,255,.16);font:1000 .48rem/1 system-ui,sans-serif;color:#fff;box-shadow:inset 0 -2px rgba(0,0,0,.12)}
body[data-hud-reveal="keyboard"] .game-screen .hud-shortcut-legend{display:flex}
body[data-hud-reveal="keyboard"] .game-screen .hud-edge-hotzone span{opacity:.18}
body[data-hud-reveal="keyboard"] .game-screen .hud-edge-hotzone:hover span{opacity:.7}

/* Top drawer: room + mission are one bar ------------------------------- */
.game-screen .topbar{
  height:104px;padding:8px 14px;gap:12px;transform:translateY(calc(-100% + 8px));
  overflow:visible;
}
.game-screen .top-brand{min-width:188px;flex:0 0 188px}.game-screen .top-brand img{width:142px;height:62px}.game-screen .top-brand .build{font-size:.48rem;padding:4px 5px}
.game-screen .room-chip{flex:0 1 220px;max-width:220px;min-width:150px;padding:8px 10px;font-size:.74rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.game-screen .topbar .mission-head{
  position:static!important;inset:auto!important;top:auto!important;left:auto!important;right:auto!important;
  flex:1 1 520px;min-width:260px;min-height:0;margin:0;padding:6px 10px;display:flex;align-items:center;gap:10px;
  border:0;border-left:1px solid rgba(97,165,211,.48);border-right:1px solid rgba(97,165,211,.48);border-radius:0;
  background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none;pointer-events:auto;
}
.game-screen .topbar .mission-head-copy{min-width:0;flex:1}
.game-screen .topbar .mission-head h1{font-size:1rem;line-height:1.08;margin:2px 0;color:#0c3b76;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.game-screen .topbar .mission-head .brief{font-size:.58rem;line-height:1.15;margin:1px 0 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.game-screen .topbar .mission-head .chips{display:flex;gap:3px;flex-wrap:nowrap;overflow:hidden}
.game-screen .topbar .mission-head .chip{font-size:.45rem;padding:2px 5px;white-space:nowrap}
.game-screen .topbar .mission-head .progress{flex:0 0 auto;padding:5px 8px;font-size:.72rem}
.game-screen .top-actions{flex:0 0 auto;gap:6px}.game-screen .top-actions .connection-chip{font-size:.48rem}.game-screen .score-chip,.game-screen .day-chip{min-width:94px;padding:6px 8px;font-size:.56rem}.game-screen .score-chip b{font-size:.9rem}

/* Top bar reveal rules. */
body[data-hud-reveal="hover"] .game-screen .topbar-hotzone:hover ~ .topbar,
body[data-hud-reveal="hover"] .game-screen .topbar:hover,
body[data-hud-reveal="hover"] .game-screen .topbar:focus-within,
body[data-hud-reveal="keyboard"].hud-top-open .game-screen .topbar{transform:translateY(0)}
/* Cancel the old generic hover reveal in keyboard mode. */
body[data-hud-reveal="keyboard"] .game-screen .topbar:hover,
body[data-hud-reveal="keyboard"] .game-screen .topbar:focus-within{transform:translateY(calc(-100% + 8px))}
body[data-hud-reveal="keyboard"].hud-top-open .game-screen .topbar:hover,
body[data-hud-reveal="keyboard"].hud-top-open .game-screen .topbar:focus-within{transform:translateY(0)}

/* Side drawers --------------------------------------------------------- */
.game-screen .left-column{
  left:10px;top:24px;bottom:18px;transition:transform .24s cubic-bezier(.2,.8,.2,1),opacity .18s ease;
  transform:translateX(calc(-100% - 24px));opacity:.18;
}
.game-screen .feed-panel{
  right:10px;top:24px;bottom:18px;transition:transform .24s cubic-bezier(.2,.8,.2,1),opacity .18s ease;
  transform:translateX(calc(100% + 24px));opacity:.18;
}
body[data-hud-reveal="hover"] .game-screen .left-hud-hotzone:hover ~ .game-grid .left-column,
body[data-hud-reveal="hover"] .game-screen .left-column:hover,
body[data-hud-reveal="hover"] .game-screen .left-column:focus-within,
body[data-hud-reveal="keyboard"].hud-left-open .game-screen .left-column{transform:translateX(0);opacity:1}
body[data-hud-reveal="hover"] .game-screen .right-hud-hotzone:hover ~ .game-grid .feed-panel,
body[data-hud-reveal="hover"] .game-screen .feed-panel:hover,
body[data-hud-reveal="hover"] .game-screen .feed-panel:focus-within,
body[data-hud-reveal="keyboard"].hud-right-open .game-screen .feed-panel{transform:translateX(0);opacity:1}

/* Bottom mission/action drawer ---------------------------------------- */
.game-screen .mission-bottom-drawer{
  position:fixed;z-index:122;left:max(20px,5vw);right:max(20px,5vw);bottom:0;
  max-height:72vh;display:flex;flex-direction:column;gap:7px;padding:0 0 12px;
  transform:translateY(calc(100% - 9px));opacity:.28;transition:transform .25s cubic-bezier(.2,.8,.2,1),opacity .18s ease;
  pointer-events:auto;
}
.game-screen .mission-bottom-drawer::before{
  content:"MISSION ACTIONS";align-self:center;flex:0 0 auto;padding:3px 14px 4px;border-radius:10px 10px 0 0;
  background:rgba(7,89,153,.78);color:#fff;font-size:.46rem;font-weight:1000;letter-spacing:.1em;
  box-shadow:0 -2px 10px rgba(0,45,83,.12);
}
body[data-hud-reveal="hover"] .game-screen .bottom-hud-hotzone:hover ~ .game-grid .mission-bottom-drawer,
body[data-hud-reveal="hover"] .game-screen .mission-bottom-drawer:hover,
body[data-hud-reveal="hover"] .game-screen .mission-bottom-drawer:focus-within,
body[data-hud-reveal="keyboard"].hud-bottom-open .game-screen .mission-bottom-drawer{transform:translateY(0);opacity:1}
.game-screen .mission-bottom-drawer .live-challenge-banner,
.game-screen .mission-bottom-drawer .objective-rail,
.game-screen .mission-bottom-drawer .action-box,
.game-screen .mission-bottom-drawer .complete{
  position:relative!important;inset:auto!important;top:auto!important;left:auto!important;right:auto!important;bottom:auto!important;
  width:100%;margin:0;max-height:none;flex:0 0 auto;
}
.game-screen .mission-bottom-drawer .live-challenge-banner{box-shadow:0 8px 24px rgba(58,44,0,.16)}
.game-screen .mission-bottom-drawer .objective-rail{padding:7px 9px}
.game-screen .mission-bottom-drawer .action-box{max-height:50vh;overflow:auto}
.game-screen .mission-bottom-drawer .complete{max-height:52vh;overflow:auto}

/* Mission info is no longer a permanent central overlay. */
.game-screen .mission-panel>.mission-head{display:none!important}

/* Keep map navigation tiny and unobtrusive; with side drawers collapsed it
   can live close to the upper-right edge of the map. */
.game-screen .city-toolbar{top:22px;right:22px;max-width:min(540px,52vw)}
.game-screen .place-drawer{right:22px;top:62px;width:min(350px,42vw);max-height:calc(100vh - 82px)}
body[data-hud-reveal="hover"] .game-screen .right-hud-hotzone:hover ~ .game-grid .city-toolbar,
body[data-hud-reveal="keyboard"].hud-right-open .game-screen .city-toolbar{right:calc(var(--student-right-col) + 28px)}
body[data-hud-reveal="hover"] .game-screen .right-hud-hotzone:hover ~ .game-grid .mission-panel .place-drawer,
body[data-hud-reveal="keyboard"].hud-right-open .game-screen .place-drawer{right:calc(var(--student-right-col) + 28px)}

/* Prevent legacy responsive rules from re-reserving permanent side gutters. */
@media(max-width:1180px){
  .game-screen .city-toolbar{right:18px}.game-screen .place-drawer{right:18px}
  .game-screen .topbar .mission-head{padding:5px 8px}.game-screen .topbar .mission-head .brief{display:none}
  .game-screen .room-chip{max-width:170px}.game-screen .top-brand{min-width:160px;flex-basis:160px}.game-screen .top-brand img{width:120px}
}
@media(max-width:900px){
  .game-screen .left-column{left:5px;top:20px}.game-screen .feed-panel{right:5px;top:20px}
  .game-screen .topbar{height:94px;padding:6px 8px;gap:7px}
  .game-screen .top-brand{min-width:116px;flex-basis:116px}.game-screen .top-brand img{width:92px;height:50px}.game-screen .top-brand .build{display:none}
  .game-screen .room-chip{display:none}
  .game-screen .topbar .mission-head{min-width:180px}.game-screen .topbar .mission-head .chips{display:none}.game-screen .topbar .mission-head h1{font-size:.82rem}
  .game-screen .score-chip,.game-screen .day-chip{min-width:72px;padding:5px;font-size:.48rem}.game-screen .top-actions .connection-chip{display:none}
  .game-screen .mission-bottom-drawer{left:12px;right:12px}.game-screen .city-toolbar{top:18px;right:14px}.game-screen .place-drawer{right:14px;top:55px;width:min(330px,68vw)}
  .game-screen .hud-shortcut-legend{right:9px;bottom:10px;max-width:calc(100vw - 18px);flex-wrap:wrap;justify-content:flex-end}
}
@media(max-width:680px){
  .game-screen .top-actions .day-chip{display:none}.game-screen .topbar .mission-head .brief{display:none}.game-screen .topbar .mission-head .progress{font-size:.6rem}
  .game-screen .mission-bottom-drawer{left:7px;right:7px}.game-screen .place-drawer{width:min(310px,82vw)}
}

/* ---------------------------------------------------------------------
   v0.8.1 — AMBIENT TRAFFIC HOTFIX
   Lightweight client-side vehicles move through the logical road graph.
   They are intentionally non-interactive and depth-sort with map cells.
   --------------------------------------------------------------------- */
.iso-traffic-layer{position:absolute;inset:0;overflow:visible;pointer-events:none;z-index:62000}
.ambient-vehicle{
  position:absolute;height:auto;pointer-events:none;user-select:none;-webkit-user-drag:none;
  transform:translate(-50%,-58%); transform-origin:50% 68%;will-change:left,top;opacity:.98;
  filter:drop-shadow(0 3px 2px rgba(10,31,43,.28));
}
/* v0.8.1 uses pre-rendered N/E/S/W sprites instead of runtime flips. */
.ambient-vehicle.vehicle-city_bus,.ambient-vehicle.vehicle-fire_truck,.ambient-vehicle.vehicle-delivery_truck,.ambient-vehicle.vehicle-garbage_truck{filter:drop-shadow(0 4px 3px rgba(10,31,43,.3))}
.ambient-vehicle.vehicle-ambulance,.ambient-vehicle.vehicle-fire_truck{filter:drop-shadow(0 3px 3px rgba(10,31,43,.3)) saturate(1.08)}
@media (prefers-reduced-motion:reduce){.ambient-vehicle{display:none!important}}

.ambient-vehicle.vehicle-cyclist{filter:drop-shadow(0 2px 1px rgba(10,31,43,.24))}

/* v0.8.6.1 — Campaign & Training Foundation */
.training-overlay{position:fixed;inset:0;z-index:390;background:rgba(4,28,47,.78);display:grid;place-items:center;padding:22px}.training-overlay.hidden{display:none!important}.training-card{width:min(620px,94vw);background:linear-gradient(180deg,#f8fdff,#e9f7ff);border:3px solid #168ee7;border-radius:18px;box-shadow:0 24px 70px rgba(0,0,0,.4);padding:22px;color:#24465f}.training-card h2{margin:4px 0 10px;color:#0752a0;font-size:1.35rem}.training-kicker{font-size:.6rem;font-weight:1000;letter-spacing:.08em;color:#2182c4}.training-en{font-weight:800;font-size:.86rem;line-height:1.35}.training-pt{background:#fff;border-left:4px solid #7ed957;border-radius:8px;padding:9px 11px;font-size:.78rem;line-height:1.35}.training-subtitles{display:flex;gap:8px;align-items:center;margin:12px 0;font-size:.72rem;font-weight:900}.training-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:14px 0}.training-actions button{padding:12px}.training-card small{display:block;color:#648095;line-height:1.35}.training-foundation-status{margin:12px 0;padding:10px;border-radius:9px;background:#fff4d8;color:#8a6111;font-weight:800}.training-mini{font-size:.38rem;font-weight:1000;border-radius:999px;padding:3px 5px;background:#fff0d4;color:#8b6216;border:1px solid #e6c37c}.training-mini.training-completed{background:#e8f9e2;color:#307434;border-color:#a8dda0}.training-mini.training-skipped{background:#eef3f7;color:#607484;border-color:#ccd8df}


/* =======================================================================
   v0.8.6.1 — Training District Part I + elevated prop overlay
   ======================================================================= */
.iso-prop-layer{position:absolute;inset:0;overflow:visible;pointer-events:none;z-index:61000}
.iso-prop-anchor{position:absolute;overflow:visible;pointer-events:none}
.iso-prop-anchor .map-place{pointer-events:auto}
.training-hotspot-layer{position:absolute;inset:0;overflow:visible;pointer-events:none;z-index:64000}
.training-cell-hotspot{position:absolute;width:76px;height:44px;transform:translate(-50%,-50%);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);border:2px solid rgba(255,255,255,.94);background:rgba(255,196,46,.30);box-shadow:0 0 0 4px rgba(23,134,215,.30),0 5px 18px rgba(0,55,97,.24);cursor:pointer;pointer-events:auto;animation:trainingPulse 1.2s ease-in-out infinite}
.training-cell-hotspot.hidden{display:none!important}
.training-cell-hotspot::after{content:attr(data-label);position:absolute;left:50%;top:-27px;transform:translateX(-50%);white-space:nowrap;padding:3px 7px;border-radius:999px;background:#07579f;color:#fff;font:1000 .45rem/1 system-ui,sans-serif;box-shadow:0 2px 8px rgba(0,0,0,.18)}
@keyframes trainingPulse{50%{background:rgba(126,217,87,.42);box-shadow:0 0 0 7px rgba(23,134,215,.12),0 6px 20px rgba(0,55,97,.22)}}
.training-guide{position:fixed;z-index:220;left:50%;bottom:24px;transform:translateX(-50%);width:min(500px,calc(100vw - 34px));max-height:calc(100vh - 36px);overflow:auto;transition:box-shadow .2s ease,border-color .2s ease;padding:14px 15px;border-radius:17px;border:2px solid rgba(21,137,217,.9);background:linear-gradient(155deg,rgba(250,254,255,.97),rgba(229,247,255,.94));backdrop-filter:blur(13px);-webkit-backdrop-filter:blur(13px);box-shadow:0 15px 42px rgba(0,49,83,.28);color:#24465f}
.training-guide.hidden{display:none!important}.training-guide-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.training-guide h2{font-size:1rem;margin:2px 0;color:#084e96}.training-guide-progress{padding:4px 8px;border-radius:999px;background:#0d76c6;color:#fff;font-size:.56rem;font-weight:1000}.training-guide-en{margin:8px 0 5px;font-size:.76rem;line-height:1.35;font-weight:800}.training-guide-pt{margin:5px 0;padding:7px 9px;border-left:4px solid #7ed957;border-radius:7px;background:#fff;font-size:.69rem;line-height:1.3}.training-guide-hint{font-size:.58rem;color:#53728b;margin-top:7px}.training-guide-action{width:100%;margin-top:9px;padding:8px}.training-part1-active .mission-bottom-drawer{display:none!important}.training-part1-active .place-drawer{display:none!important}
@media(max-width:720px){.training-guide{width:min(500px,calc(100vw - 24px));max-height:calc(100vh - 24px)}}

/* v0.8.6.1 — Training Part II */
.training-certified-card{border-color:#52ad43;background:linear-gradient(180deg,#fbfff7,#e9f9df)}
.training-certified-card h2{color:#2f7b2e;font-size:1.6rem}
body.training-part2-active .training-guide{border-color:#45a94b;box-shadow:0 12px 34px rgba(22,103,45,.28)}
body.training-part2-active .training-guide-progress{background:#e8f8df;color:#2d7230;border-color:#96d38b}

/* v0.8.7 — Official CIVITAS city sector navigator (Teacher only) */
.campaign-sector-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin:5px 0 8px}
.campaign-sector-cell{min-width:0;min-height:58px;border:1.5px solid #8cc8ee;border-radius:10px;background:linear-gradient(180deg,#f9fdff,#eaf7ff);color:#0b4b8d;padding:5px 4px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;cursor:pointer;font:inherit;box-shadow:0 1px 2px rgba(17,79,122,.08)}
.campaign-sector-cell:hover{border-color:#238fda;background:#f4fbff;transform:translateY(-1px)}
.campaign-sector-cell.active{border-color:#0a79c6;background:linear-gradient(180deg,#dff4ff,#ccecff);box-shadow:0 0 0 2px rgba(36,143,215,.18)}
.campaign-sector-cell b{font-size:.57rem;line-height:1;color:#0868b0}.campaign-sector-cell span{font-size:.48rem;font-weight:900;line-height:1.12;margin-top:3px}.campaign-sector-cell small{font-size:.40rem;color:#6a879a;margin-top:3px}.campaign-sector-cell.empty{opacity:.42;border-style:dashed;font-size:.44rem;cursor:default}.campaign-sector-empty{grid-column:1/-1;font-size:.48rem;color:#6c8798;padding:8px}

/* v0.9.0 — Tomorrow City strategic decision console ------------------- */
.strategy-console{border:1.5px solid #91c8e8;border-radius:14px;background:linear-gradient(180deg,rgba(249,253,255,.98),rgba(231,246,255,.98));padding:10px;box-shadow:0 4px 14px rgba(25,91,132,.10)}
.strategy-head{display:flex;align-items:flex-start;gap:10px;margin-bottom:9px}.strategy-head span{background:#0a72bc;color:#fff;border-radius:999px;padding:4px 8px;font-size:.5rem;font-weight:1000;white-space:nowrap;letter-spacing:.03em}.strategy-head b{font-size:.72rem;line-height:1.25;color:#154f83}
.strategy-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.strategy-card{appearance:none;text-align:left;border:1.5px solid #9fcce7;border-radius:11px;background:#fff;color:#174d79;padding:9px;min-height:64px;cursor:pointer;font:inherit;box-shadow:0 2px 5px rgba(30,92,130,.06);transition:.14s ease}.strategy-card:hover{border-color:#2c9ad8;transform:translateY(-1px);background:#f8fdff}.strategy-card.selected{border-color:#168839;background:linear-gradient(180deg,#effff0,#dcf9df);box-shadow:0 0 0 2px rgba(33,162,70,.17)}.strategy-card b{display:block;font-size:.64rem;line-height:1.14}.strategy-card small{display:block;margin-top:4px;font-size:.49rem;line-height:1.25;color:#627f92;font-weight:650}.strategy-card.selected small{color:#3b7051}.strategy-limit{margin-top:8px;border-top:1px solid #cae4f2;padding-top:6px;font-size:.5rem;font-weight:900;color:#54758d;text-align:right}
@media(max-width:760px){.strategy-grid{grid-template-columns:1fr}}

/* v0.9.1+ — Normal Mode / Citywide Administration ---------------------- */
.unlocked-modes{margin:10px 0 4px;padding:10px;border:2px solid #83cfee;border-radius:13px;background:linear-gradient(180deg,#f5fcff,#e7f6ff)}
.unlocked-mode-head{font-size:.56rem;font-weight:1000;letter-spacing:.08em;color:#0c5ca4;margin-bottom:7px}
.unlocked-mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.unlocked-mode-card{border:1px solid #b9deef;border-radius:10px;background:white;padding:9px;text-align:left;color:#244e72;display:grid;gap:3px}
.unlocked-mode-card b{color:#0b5aa2;font-size:.68rem}.unlocked-mode-card small{font-size:.5rem;line-height:1.3;color:#617f96}
.unlocked-button{cursor:pointer}.unlocked-button:hover{border-color:#7ed957;box-shadow:0 0 0 2px rgba(126,217,87,.18)}
.normal-unlock-card{border-color:#7ed957!important;box-shadow:0 24px 80px rgba(4,35,45,.48)!important}
.normal-unlock-achievement{margin:12px 0;padding:11px;border-radius:10px;background:#eefbe8;border:2px solid #7ed957;color:#2b7434;font-weight:1000;text-align:center}
.normal-mode-box{padding:18px;border:2px solid #51b94b;border-radius:16px;background:linear-gradient(180deg,#f7fff4,#e8f9e3);color:#244c42;text-align:center}
.normal-mode-box h2{margin:3px 0 7px;color:#23782a;font-size:1.35rem}.normal-kicker{font-size:.55rem;font-weight:1000;letter-spacing:.12em;color:#3a8b3d}
.normal-mode-statline{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin:10px 0}.normal-mode-statline span{background:white;border:1px solid #b9dfb5;border-radius:999px;padding:5px 9px;font-size:.54rem;font-weight:900;color:#34763b}
.game-screen .mission-bottom-drawer .normal-mode-box{max-height:52vh;overflow:auto}
.citywide-sector-label{position:absolute;transform:translate(-50%,-50%);z-index:88000;pointer-events:none;background:rgba(5,54,93,.88);color:white;border:2px solid rgba(255,255,255,.9);border-radius:12px;padding:6px 10px;text-align:center;box-shadow:0 5px 14px rgba(0,35,65,.25);white-space:nowrap}
.citywide-sector-label b{display:block;font-size:.66rem;letter-spacing:.02em}.citywide-sector-label small{display:block;font-size:.43rem;opacity:.8;margin-top:1px}
.citywide-zoomed-out .iso-place-label,.citywide-zoomed-out .iso-place-check{display:none!important}
.citywide-zoomed-out .citywide-sector-label{transform:translate(-50%,-50%) scale(1.25)}
@media(max-width:720px){.unlocked-mode-grid{grid-template-columns:1fr}.citywide-sector-label b{font-size:.58rem}}

/* v0.10.0 — Grade 7 Incident Reconstruction terminal */
.incident-console{border-color:#9aa7db;background:linear-gradient(180deg,rgba(250,251,255,.98),rgba(236,240,255,.98))}.incident-console .strategy-head span{background:#4858a8}.incident-console .strategy-card:hover{border-color:#697bd2;background:#fafbff}


/* v0.10.0 — Leo/Gabriel Developer Missions */
.dev-channel{margin-top:10px;border:1px solid rgba(112,76,180,.45);background:linear-gradient(180deg,rgba(40,24,73,.96),rgba(22,19,45,.96));border-radius:14px;padding:10px;box-shadow:0 8px 24px rgba(28,8,55,.28);color:#f7f3ff}
.dev-channel-head{display:flex;align-items:center;gap:9px;padding:4px 2px 8px;position:sticky;top:0;z-index:4;background:linear-gradient(180deg,rgba(40,24,73,.99),rgba(40,24,73,.94) 78%,rgba(40,24,73,0));backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.dev-channel-head>span{font-size:1.35rem;flex:0 0 auto}.dev-channel-title{min-width:0;flex:1 1 auto}.dev-channel-head b{display:block;font-size:.78rem;letter-spacing:.08em}.dev-channel-head small{display:block;color:#b9a8de;font-size:.62rem;margin-top:2px}.dev-channel-toggle{flex:0 0 auto;border:1px solid rgba(197,168,255,.58);border-radius:999px;background:rgba(255,255,255,.08);color:#f4ecff;font-size:.5rem;font-weight:1000;letter-spacing:.06em;padding:6px 8px;cursor:pointer}.dev-channel-toggle:hover,.dev-channel-toggle:focus-visible{background:rgba(151,106,224,.34);outline:none;border-color:#d7c1ff}.dev-channel.collapsed .dev-channel-inbox,.dev-channel.collapsed .dev-mission-panel{display:none!important}.dev-channel.collapsed .dev-channel-head{padding-bottom:2px;background:transparent;position:static}
.dev-channel-inbox{display:grid;gap:6px}.dev-inbox-card{width:100%;text-align:left;border:1px solid rgba(170,139,230,.35);background:rgba(115,78,177,.16);color:#fff;border-radius:10px;padding:8px;cursor:pointer}.dev-inbox-card:hover{background:rgba(135,91,205,.28)}.dev-inbox-card.attention{border-color:#e4bc50;box-shadow:0 0 0 1px rgba(228,188,80,.25)}.dev-inbox-card b{display:block;font-size:.72rem}.dev-inbox-card small{display:block;color:#cfc3e7;margin-top:3px}.dev-inbox-card.complete{opacity:.72;border-color:rgba(80,190,120,.42)}
.dev-mission-panel{margin-top:8px;border-top:1px solid rgba(180,160,220,.2);padding-top:9px}.dev-kicker{font-size:.62rem;font-weight:900;letter-spacing:.1em;color:#c8acff}.dev-mission-panel h3{margin:4px 0 7px;font-size:.9rem}.dev-message{font-style:italic;color:#e4d8ff;border-left:3px solid #8b64ce;padding-left:8px}.dev-role-intel{background:rgba(255,255,255,.06);border-radius:9px;padding:8px;margin:8px 0}.dev-role-intel b{font-size:.62rem;letter-spacing:.08em;color:#d6c4ff}.dev-role-intel p{margin:4px 0 0;font-size:.72rem}.dev-question{font-weight:900;font-size:.74rem;margin:8px 0}.dev-options .side-option{display:block;width:100%;text-align:left;margin:5px 0;background:rgba(255,255,255,.07);color:#fff;border-color:rgba(255,255,255,.18)}.dev-options .side-option.selected{background:#6d4ca7;border-color:#c5a8ff}.dev-option-detail{display:block;font-size:.62rem;font-weight:500;opacity:.78;margin-top:2px}.dev-actions{display:flex;gap:6px;margin-top:8px}.dev-actions button{flex:1;font-size:.65rem}.feed-item.developer{background:rgba(111,77,168,.22)!important;border-left:3px solid #9a6ee0!important;font-weight:800}

/* v0.10.1.1 — Playtest hotfix: dynamic DEV CHANNEL sizing.
   The developer drawer may scroll internally, but it can no longer be clipped by
   the HUD bottom edge. Collapsing it gives the recovered height back to Team Feed. */
@media (max-height:760px){
  .game-screen .dev-channel:not(.collapsed){flex-basis:clamp(220px,38vh,330px);height:clamp(220px,38vh,330px);max-height:clamp(220px,38vh,330px)}
  .game-screen .feed-panel .feed{min-height:90px}
}


/* v0.10.3 — TLS Release Candidate: school-lab viewport hardening.
   1366×768 / 1280×720-class screens keep every drawer reachable without
   sacrificing the full-screen city surface. */
@media (max-height:800px) and (min-width:901px){
  .game-screen .left-column,.game-screen .feed-panel{top:16px;bottom:10px}
  .game-screen .left-column{gap:7px}
  .game-screen .left-column .sidebar,.game-screen .feed-panel{padding:8px}
  .game-screen .feed-panel .feed{min-height:78px}
  .game-screen .dev-channel:not(.collapsed){flex:0 0 clamp(205px,35vh,285px);height:clamp(205px,35vh,285px);max-height:clamp(205px,35vh,285px)}
  .game-screen .mission-bottom-drawer{max-height:80vh;padding-bottom:7px}
  .game-screen .mission-bottom-drawer .action-box,.game-screen .mission-bottom-drawer .complete{max-height:58vh}
  .game-screen .place-drawer{max-height:calc(100vh - 72px)}
  .penalty-card{padding:18px 24px}.penalty-icon{font-size:3rem}.penalty-card h2{font-size:1.65rem}.penalty-ack{margin-top:12px}
}
@media (max-height:700px){
  .game-screen .dev-channel:not(.collapsed){flex-basis:190px;height:190px;max-height:190px}
  .game-screen .feed-panel .feed{min-height:64px}
  .game-screen .mission-bottom-drawer{max-height:84vh}
  .game-screen .mission-bottom-drawer .action-box,.game-screen .mission-bottom-drawer .complete{max-height:62vh}
}

/* v0.10.5.3 — Teacher Full Map Editor */
.full-map-button{width:100%;margin:0 0 8px;padding:8px 7px!important;border-style:dashed!important}
.full-map-button.active{background:#0a5e9f!important;color:#fff!important;border-color:#0a5e9f!important;border-style:solid!important}
.lab-sector-badge{position:absolute;transform:translate(-50%,-50%);pointer-events:none;white-space:nowrap;background:rgba(3,42,70,.86);color:white;border:1px solid rgba(255,255,255,.55);border-radius:7px;padding:4px 7px;font-size:.45rem;font-weight:900;box-shadow:0 2px 6px rgba(0,0,0,.2)}
.lab-sector-badge b{color:#9fe6ff;margin-right:3px}
.lab-cell-stack.full-map-boundary::after{content:"";position:absolute;left:31px;top:78px;width:82px;height:46px;box-sizing:border-box;clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);border:2px solid rgba(0,91,160,.28);pointer-events:none;z-index:4}
#labCanonicalSaveButton:disabled,#labRandomButton:disabled,#labClearButton:disabled{opacity:.45;cursor:not-allowed}