:root{
  --bg:#eef3f7; --panel:#ffffff; --text:#13212d; --muted:#647381; --line:#d6dee5;
  --accent:#285f8e; --accent-soft:#e7f0f8; --accent-dark:#183f60;
  --good:#2e7140; --good-bg:#e5f2e8; --danger:#963333; --danger-bg:#f8e5e5;
  --warn:#7d5e15; --warn-bg:#fff3cb; --shadow:0 8px 26px rgba(31,48,61,.08);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:var(--text);background:var(--bg)}
body{background-image:radial-gradient(circle at 12% 0%,rgba(255,255,255,.9),transparent 28rem)}
button,input,select,textarea{font:inherit} button{cursor:pointer}
.hidden{display:none!important}
.topbar{position:sticky;top:0;z-index:50;min-height:58px;background:#10212f;color:#fff;padding:9px clamp(12px,3vw,24px);display:flex;justify-content:space-between;align-items:center;gap:12px;border-bottom:3px solid var(--accent)}
.brand{font-weight:900;letter-spacing:.01em;font-size:1.05rem}
.status{display:inline-flex;align-items:center;gap:6px;font-size:.8rem;background:#ffffff16;border:1px solid #ffffff30;border-radius:999px;padding:6px 9px}
main{max-width:1240px;margin:0 auto;padding:clamp(10px,2vw,20px)}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:clamp(14px,2vw,20px);box-shadow:var(--shadow)}
h1,h2,h3{color:#112330} h1{font-size:clamp(1.45rem,3vw,2rem)} h2{font-size:1.2rem} h3{font-size:1rem}
label{display:block;font-weight:750;font-size:.88rem;margin:10px 0 5px}
input,select,textarea{width:100%;border:1.5px solid #c8d2da;border-radius:11px;padding:11px 12px;background:#fff;color:var(--text);outline:none}
input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 14%,transparent)}
.btn{border:0;border-radius:11px;padding:10px 14px;font-weight:800;background:#e8edf1;color:var(--text);transition:transform .12s ease,filter .12s ease}
.btn:hover:not(:disabled){filter:brightness(.98);transform:translateY(-1px)}
.btn.primary{background:var(--accent);color:#fff}.btn.good{background:var(--good-bg);color:var(--good)}.btn.danger{background:var(--danger-bg);color:var(--danger)}
.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.space{justify-content:space-between}
.muted{color:var(--muted);font-size:.9rem}
.notice,.error,.success{padding:11px 12px;border-radius:11px;margin:10px 0;font-weight:650}.notice{background:var(--warn-bg);color:var(--warn)}.error{background:var(--danger-bg);color:var(--danger)}.success{background:var(--good-bg);color:var(--good)}

.login-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr);gap:18px;max-width:960px;margin:42px auto}
.join-panel{position:relative;overflow:hidden}
.join-panel::before{content:"";position:absolute;inset:0 0 auto 0;height:7px;background:var(--accent)}
.join-kicker{display:inline-block;padding:5px 9px;border-radius:999px;background:var(--accent-soft);color:var(--accent-dark);font-weight:800;font-size:.78rem;margin-bottom:8px}
.flow-list{display:grid;gap:9px}.flow-item{display:grid;grid-template-columns:38px 1fr;gap:10px;align-items:start;padding:10px;border-radius:12px;background:#f7f9fb;border:1px solid #e2e7eb}.flow-num{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:var(--accent);color:#fff;font-weight:900}.flow-item b{display:block;margin-bottom:2px}

.lobby-list{display:grid;gap:8px}.lobby-row{border:1.5px solid var(--line);border-radius:12px;padding:11px;background:#fff;display:flex;justify-content:space-between;gap:10px;align-items:center}.lobby-row:hover{border-color:var(--accent)}

.phase-shell{position:relative;margin-bottom:14px;background:#fff;border:1px solid var(--line);border-radius:20px;padding:15px;box-shadow:var(--shadow);overflow:hidden}
.phase-shell::before{content:"";position:absolute;inset:0 auto 0 0;width:6px;background:var(--accent)}
.phase-track{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.phase-step{border:1.5px solid var(--line);border-radius:12px;padding:10px 8px;text-align:center;background:#f7f9fb;font-weight:800;color:#586876;transition:.2s}
.phase-step.active{background:var(--accent);color:#fff;border-color:var(--accent);box-shadow:0 5px 16px color-mix(in srgb,var(--accent) 22%,transparent)}
.phase-step.done{background:var(--good-bg);color:var(--good);border-color:#b9d9c1}
.phase-step small{display:block;font-size:.68rem;opacity:.8;letter-spacing:.05em}
.phase-controls{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(210px,auto);gap:14px;align-items:center;margin-top:14px;padding-top:13px;border-top:1px solid #e5eaee}
.phase-name{font-size:1.13rem;font-weight:900;color:var(--accent-dark)}.timer{font-size:1.45rem;font-weight:900;font-variant-numeric:tabular-nums}
.phase-gate{margin-top:6px;display:inline-flex;align-items:center;gap:7px;font-size:.83rem;padding:6px 9px;border-radius:9px;background:#f1f5f8;color:#51616f;font-weight:750}
.end-wrap .btn{min-height:48px;min-width:205px;font-size:.96rem;letter-spacing:.02em}
.waiting-box{margin-top:11px;background:var(--accent-soft);border:1px solid color-mix(in srgb,var(--accent) 30%,white);border-radius:11px;padding:11px;font-weight:800;color:var(--accent-dark)}
.ready-list{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}.ready-chip{font-size:.77rem;padding:5px 8px;border:1px solid var(--line);border-radius:999px;background:#f5f7f9}.ready-chip.ready{background:var(--good-bg);color:var(--good);border-color:#bcdcc3}

.city-heading{background:linear-gradient(135deg,#fff,var(--accent-soft));border:1px solid var(--line);border-radius:16px;padding:12px 14px;margin-bottom:10px}
.score-grid{display:grid;grid-template-columns:repeat(8,minmax(80px,1fr));gap:7px}
.metric{background:#fff;border:1px solid var(--line);border-radius:12px;padding:9px 10px;min-width:0}.metric small{display:block;color:var(--muted);font-size:.7rem;font-weight:800;letter-spacing:.04em}.metric strong{font-size:1.12rem;color:#172a39}
.score-grid .metric:last-child{background:var(--accent);color:#fff;border-color:var(--accent)}.score-grid .metric:last-child small,.score-grid .metric:last-child strong{color:#fff}

.tabs{display:flex;gap:7px;flex-wrap:wrap;margin:14px 0;padding:5px;background:#e6ecf1;border-radius:14px;position:sticky;top:62px;z-index:30}
.tab{border:0;background:transparent;border-radius:10px;padding:9px 12px;font-weight:750;color:#4b5b68}.tab.active{background:#fff;color:var(--accent-dark);box-shadow:0 2px 7px #00000012}.tab.recommended:not(.active){background:var(--accent-soft);color:var(--accent-dark);outline:1px solid color-mix(in srgb,var(--accent) 25%,transparent)}
.content-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(260px,.8fr);gap:14px}
.resources{display:grid;grid-template-columns:repeat(auto-fit,minmax(125px,1fr));gap:8px}.resource{border:1px solid var(--line);border-radius:11px;padding:10px;background:#f9fbfc}.resource strong{font-size:.88rem}.resource div{font-size:1.25rem;font-weight:900;color:var(--accent-dark);margin-top:3px}
.player-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(165px,1fr));gap:8px}.player-card{border:1px solid var(--line);border-radius:12px;padding:11px;background:#fff}.player-card strong{color:var(--accent-dark)}


.store-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}.store-item{border:1px solid var(--line);border-radius:13px;padding:12px;background:#fff;display:flex;flex-direction:column}.store-item .icon{font-size:1.7rem}.store-item .btn{margin-top:auto}.recipe{font-size:.84rem;color:var(--muted);margin:8px 0}
.wheel-layout{display:grid;grid-template-columns:1fr 1fr;gap:20px}.wheel-box{text-align:center}.wheel-wrap{position:relative;max-width:350px;margin:0 auto}.wheel-pointer{position:absolute;z-index:5;left:50%;top:-2px;transform:translateX(-50%);width:0;height:0;border-left:14px solid transparent;border-right:14px solid transparent;border-top:29px solid #122331}canvas.wheel{width:100%;height:auto;display:block;transition:transform 3.2s cubic-bezier(.12,.72,.16,1);filter:drop-shadow(0 5px 7px #0002)}.spin-result{font-size:1.2rem;font-weight:900;margin-top:10px;min-height:28px;color:var(--accent-dark)}
.production-focus,.scenario-focus{max-width:980px;margin:0 auto}

.trade-log{height:330px;overflow:auto;border:1px solid var(--line);border-radius:12px;padding:10px;background:#f7f9fb}
.trade-form-grid{display:grid;grid-template-columns:1fr 76px 1fr 76px;gap:7px;align-items:end}.trade-card{border:1px solid var(--line);border-radius:11px;padding:10px;margin-bottom:8px;background:#fff}.trade-summary{font-size:.9rem;line-height:1.45}.trade-actions{display:flex;gap:7px;margin-top:8px}
.scenario-card{border:1.5px solid #cfd8df;border-radius:16px;padding:17px;background:#fff;margin-top:14px;box-shadow:var(--shadow)}.scenario-card h2{margin-bottom:8px}.response-choice{border:2px solid var(--line);border-radius:13px;padding:13px;margin:10px 0;background:#fff;cursor:pointer;transition:.12s}.response-choice:hover{border-color:var(--accent);transform:translateY(-1px)}.response-choice.selected{border-color:var(--accent);background:var(--accent-soft)}.needs{background:var(--warn-bg);border-radius:8px;padding:8px;font-weight:800;margin:8px 0;color:var(--warn)}
.phase-help{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}.help-chip{padding:9px;border-radius:11px;background:#f7f9fb;border:1px solid var(--line);font-size:.84rem}.help-chip b{display:block;color:var(--accent-dark)}

@media(max-width:920px){
 .login-grid,.content-grid,.wheel-layout{grid-template-columns:1fr}
 .phase-controls{grid-template-columns:1fr auto}.end-wrap{grid-column:1/-1}.end-wrap .btn{width:100%}
}
@media(max-width:590px){
 main{padding:8px}.topbar{padding:8px 10px}.status{display:none}.score-grid{grid-template-columns:repeat(2,1fr)}
 .phase-track{grid-template-columns:repeat(2,1fr)}.tabs{top:57px}.tab{flex:1 1 30%;font-size:.82rem;padding:8px}
}

.store-price{font-size:1.05rem;font-weight:900;color:var(--accent-dark);margin:7px 0}.recipe{line-height:1.45}


/* Five-player start gate + final results */
#game.waiting-mode .phase-shell,#game.waiting-mode .tabs,#game.waiting-mode .tabpage,#game.finished-mode .phase-shell,#game.finished-mode .tabs,#game.finished-mode .tabpage{display:none!important}
.pregame-panel{border-top:6px solid var(--accent);margin-bottom:16px;text-align:center}.pregame-counts{display:grid;grid-template-columns:repeat(2,minmax(150px,220px));justify-content:center;gap:12px;margin:16px 0}.pregame-counts>div{border:1px solid var(--line);border-radius:14px;padding:12px;background:#f8fafc}.pregame-counts small{display:block;color:var(--muted);font-weight:800;letter-spacing:.08em}.pregame-counts strong{display:block;font-size:1.7rem;color:var(--accent-dark);margin-top:3px}.pregame-players{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:14px 0}.pregame-city{border:1px solid var(--line);border-radius:12px;padding:10px;background:#fff;text-align:left}.pregame-city.loaded{border-color:#9ac7a6;background:var(--good-bg)}.pregame-city .load-state{font-size:.74rem;font-weight:900;margin-top:5px}.pregame-city.loaded .load-state{color:var(--good)}.pregame-city.waiting .load-state{color:var(--warn)}
.final-results{border-top:7px solid var(--accent);margin:16px 0}.winner-banner{text-align:center;padding:18px;border-radius:16px;background:linear-gradient(135deg,#fff8d7,#f7eab0);border:1px solid #e8d581;margin-bottom:12px}.winner-banner .trophy{font-size:2.4rem}.winner-banner h2{margin:4px 0}.final-explain{padding:10px 12px;border-radius:10px;background:#f4f7f9;color:#4d5f6b;margin-bottom:12px}.my-final-card{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:12px 0 18px}.my-final-card .metric strong{font-size:1.45rem}.final-leaderboard{display:grid;gap:8px}.final-row{display:grid;grid-template-columns:70px 1.6fr .7fr .8fr .8fr;gap:8px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#fff}.final-row.winner{border-color:#d8bd52;background:#fffbea}.final-place{font-weight:900;font-size:1.15rem}.final-city{font-weight:900;color:var(--accent-dark)}.final-bonus{font-size:.76rem;color:var(--muted);margin-top:3px}.grade-badge{display:inline-grid;place-items:center;min-width:42px;height:42px;border-radius:10px;font-size:1.35rem;font-weight:1000;background:#eef4ff;border:1px solid #cbdaf0}.champ-score{font-weight:1000;font-size:1.05rem}
@media(max-width:900px){.pregame-players{grid-template-columns:1fr 1fr}.my-final-card{grid-template-columns:1fr 1fr}.final-row{grid-template-columns:55px 1fr .55fr .7fr}.final-row .base-col{display:none}}

/* Computer-city support */
.pregame-bot-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:14px 0}.pregame-bot-actions .btn{min-width:230px}.bot-badge{display:inline-block;font-size:.68em;line-height:1;padding:4px 6px;border-radius:999px;background:#eef2f5;border:1px solid #b7c1c9;vertical-align:middle;white-space:nowrap}.pregame-city .bot-badge{margin-left:5px}

/* Student notification center + compact trading */
.btn.compact{padding:7px 10px;font-size:.78rem;border-radius:9px}
.notification-btn{position:relative;border:1px solid #ffffff30;background:#ffffff12;color:#fff;width:40px;height:40px;border-radius:11px;display:grid;place-items:center;font-size:1.08rem}
.notification-btn:hover{background:#ffffff20}.notification-count{position:absolute;right:-5px;top:-6px;min-width:20px;height:20px;border-radius:999px;background:#d95045;color:#fff;display:grid;place-items:center;padding:0 5px;font-size:.68rem;font-weight:900;border:2px solid #10212f}
.notification-panel{position:fixed;right:18px;top:64px;z-index:80;width:min(390px,calc(100vw - 24px));max-height:min(620px,calc(100vh - 82px));overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 18px 50px rgba(15,31,43,.22)}
.notification-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 14px;border-bottom:1px solid var(--line);background:#f8fafb}.notification-list{max-height:520px;overflow:auto}.notification-item{display:grid;grid-template-columns:34px 1fr;gap:9px;padding:11px 13px;border-bottom:1px solid #edf1f4;background:#fff}.notification-item.unread{background:#f4f9fd}.notification-item-icon{font-size:1.08rem}.notification-item strong{display:block;font-size:.87rem;color:#183247}.notification-item div div{font-size:.81rem;color:#526573;line-height:1.35;margin-top:2px}.notification-item small{display:block;color:#87939d;font-size:.68rem;margin-top:4px}.notification-empty{padding:28px 16px;text-align:center;color:var(--muted)}
.toast-stack{position:fixed;right:16px;bottom:16px;z-index:95;display:grid;gap:8px;width:min(360px,calc(100vw - 24px));pointer-events:none}.toast{display:grid;grid-template-columns:34px 1fr;gap:8px;padding:11px 12px;border-radius:13px;background:#fff;border:1px solid var(--line);box-shadow:0 12px 34px rgba(18,36,49,.2);transform:translateY(12px);opacity:0;transition:.2s ease;pointer-events:auto}.toast.show{transform:none;opacity:1}.toast strong{display:block;font-size:.86rem}.toast div div{font-size:.79rem;color:#526573;margin-top:2px}.toast.warning{border-left:5px solid #d19a28}.toast.trade{border-left:5px solid var(--accent)}.toast.purchase{border-left:5px solid var(--good)}.toast-icon{font-size:1.08rem}
.metric.low-budget{background:#fff1df;border-color:#e5b56c}.metric.low-budget strong{color:#8b4d12}.resource.low-stock{border-color:#e7b267;background:#fff7e9}.resource-name{display:flex;align-items:center;justify-content:space-between;gap:6px}.low-label{font-size:.62rem;line-height:1;padding:4px 5px;border-radius:999px;background:#f0b856;color:#5c3a00;font-weight:950;letter-spacing:.04em}
.trade-rulebar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px;padding:10px 12px;border-radius:13px;background:var(--accent-soft);border:1px solid color-mix(in srgb,var(--accent) 22%,white)}.trade-rulebar b{display:block;color:var(--accent-dark)}.trade-rulebar span{font-size:.8rem;color:#526575}.trade-counter{font-size:.8rem;font-weight:900;color:var(--accent-dark);background:#fff;padding:7px 9px;border-radius:9px;border:1px solid #d7e1e8}
.trade-layout{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);gap:12px;align-items:start}.trade-builder,.trade-activity-panel{padding:16px}.trade-builder-head,.trade-activity-head,.trade-history-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.trade-builder-head h2,.trade-activity-head h2{margin:2px 0 0}.trade-history-head{align-items:center;margin:17px 0 7px;padding-top:13px;border-top:1px solid var(--line)}.trade-history-head h3{margin:0}.trade-sides{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:12px 0}.trade-side{border:1px solid var(--line);border-radius:13px;padding:11px;background:#f8fafb}.trade-side h3{margin:0 0 7px}.give-side h3{color:#7b4b1d}.get-side h3{color:var(--accent-dark)}.trade-side label{font-size:.76rem;margin:8px 0 4px}.trade-side input,.trade-side select{padding:9px 10px;border-radius:9px}.trade-asset-row{display:grid;grid-template-columns:minmax(0,1fr) 82px;gap:6px}.send-trade-btn{width:100%;margin-top:10px;min-height:46px}.trade-draft-help{margin-top:8px;font-size:.75rem;color:#61727f;text-align:center}.trade-inbox{display:grid;gap:7px;max-height:245px;overflow:auto}.trade-log{height:365px;overflow:auto;border:0;border-radius:0;padding:0;background:transparent;display:grid;gap:7px;align-content:start}.trade-card{border:1px solid var(--line);border-radius:11px;padding:10px;margin:0;background:#fff}.trade-card.incoming{border-color:color-mix(in srgb,var(--accent) 40%,white);background:#f7fbff}.trade-card-head{display:flex;justify-content:space-between;gap:8px;align-items:center}.trade-status{font-size:.65rem;font-weight:950;padding:4px 6px;border-radius:999px;background:#eef2f5;color:#5d6a73}.trade-status.accepted{background:var(--good-bg);color:var(--good)}.trade-status.declined{background:var(--danger-bg);color:var(--danger)}.trade-status.pending{background:var(--warn-bg);color:var(--warn)}.trade-summary{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:7px;font-size:.78rem;line-height:1.3}.trade-summary>div:not(.trade-note){background:#f6f8fa;border-radius:8px;padding:7px}.trade-summary span{display:block;color:#71808c;font-size:.67rem;text-transform:uppercase;font-weight:850;letter-spacing:.04em}.trade-summary b{display:block;margin-top:2px;color:#223644}.trade-note{grid-column:1/-1;color:#526573;font-style:italic;padding:2px 3px}.trade-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:8px}.trade-empty{display:flex;flex-direction:column;gap:2px;padding:16px 12px;border:1px dashed #cbd5dc;border-radius:11px;text-align:center;color:#62727f;background:#fafcfd}.trade-empty b{color:#304756}.trade-empty span{font-size:.75rem}
@media(max-width:980px){.trade-layout{grid-template-columns:1fr}.trade-log{height:300px}}
@media(max-width:650px){.notification-panel{right:8px;top:58px;width:calc(100vw - 16px)}.trade-sides{grid-template-columns:1fr}.trade-rulebar{align-items:flex-start}.trade-counter{width:100%}.trade-summary{grid-template-columns:1fr}.trade-note{grid-column:auto}.topbar .notification-btn{display:grid!important}}

/* Scenario recovery priorities */
.recovery-panel{margin-top:14px;border-top:5px solid #c98a27}.recovery-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}.recovery-head h2{margin:2px 0 0}.recovery-help{font-size:.82rem;color:var(--muted);max-width:360px;text-align:right}.recovery-priorities{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px;margin-top:12px}.recovery-card{border:1px solid var(--line);border-radius:13px;padding:12px;background:#fff}.recovery-card.pending{border-color:#e1b66f;background:#fffaf0}.recovery-card.pending.ready{border-color:#9fc8aa;background:#f2faf4}.recovery-card.failed{border-color:#df9d9d;background:#fff5f5}.recovery-card.met{border-color:#9fc8aa;background:#f2faf4}.recovery-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.recovery-top strong{display:block;color:#203849;margin-top:2px}.recovery-round{font-size:.65rem;font-weight:950;color:#7a5b22;letter-spacing:.06em}.recovery-status{font-size:.65rem;font-weight:950;padding:5px 7px;border-radius:999px;background:#f2e2bd;color:#6d4d13;white-space:nowrap}.recovery-card.ready .recovery-status,.recovery-card.met .recovery-status{background:var(--good-bg);color:var(--good)}.recovery-card.failed .recovery-status{background:var(--danger-bg);color:var(--danger)}.recovery-due{font-size:.8rem;color:#5d6d78;margin:8px 0}.recovery-line{display:grid;grid-template-columns:82px 1fr;gap:8px;padding:7px 0;border-top:1px solid #e7ecef;font-size:.8rem}.recovery-line span{font-size:.67rem;font-weight:950;letter-spacing:.04em;color:#74828d}.recovery-line b{color:#253b4b}.recovery-line.missing b,.recovery-line.risk b{color:#8a4e1d}.recovery-result{margin-top:8px;padding:8px 9px;border-radius:9px;background:#f2f5f7;color:#536570;font-size:.76rem;font-weight:700}.recovery-result.met{background:var(--good-bg);color:var(--good)}.recovery-result.failed{background:var(--danger-bg);color:var(--danger)}.recovery-empty{display:flex;flex-direction:column;gap:3px;padding:18px;border:1px dashed #cbd5dc;border-radius:12px;text-align:center;color:var(--muted);background:#fafcfd}.recovery-empty b{color:#354b5a}.recovery-preview{margin-top:9px;padding:8px 9px;border-radius:9px;background:#fff1d9;color:#6c4a15;font-size:.79rem;line-height:1.35}.recovery-preview.final{background:#eef2f5;color:#556671}.toast.priority{border-left:5px solid #c98a27}.notification-item.priority{background:#fffaf1}
@media(max-width:650px){.recovery-help{text-align:left}.recovery-priorities{grid-template-columns:1fr}.recovery-line{grid-template-columns:72px 1fr}}


/* Local activity errors, pause, resource guide, AI trade chat */
.area-message{margin-top:9px;padding:9px 11px;border-radius:10px;border:1px solid #e1a4a0;background:#fff2f1;color:#8d2f29;font-size:.8rem;font-weight:750;line-height:1.35}.area-message.success{border-color:#9fc8aa;background:#f1faf3;color:#28703e}
.end-wrap{display:flex;gap:8px;align-items:center;justify-content:flex-end;flex-wrap:wrap}.pause-btn{background:#fff7df;border-color:#dbb45b;color:#72510c}.pause-btn.resume{background:#eaf7ed;border-color:#8eb99a;color:#27623a}.paused-banner{margin:9px 0 0;padding:11px 13px;border-radius:11px;background:#fff4cf;border:1px solid #dfbd57;color:#6f5107;font-weight:850}.paused-mode .tabpage button.primary,.paused-mode .response-choice{filter:saturate(.55);opacity:.68}.paused-mode .phase-shell{border-color:#dfbd57}
.phase-track{grid-template-columns:repeat(5,1fr)}.kickoff-step{background:#f8f0ff}.phase-step.kickoff-step.active{border-color:#8b62a9;background:#f3e9fb}
.trade-support-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}.trade-support-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;flex-wrap:wrap}.trade-support-head h2{margin:2px 0 0}.city-resource-guide{display:grid;gap:8px;margin-top:11px}.city-resource-row{display:grid;grid-template-columns:145px 1fr;gap:9px;align-items:start;border-top:1px solid #e8edf0;padding-top:8px}.city-resource-row:first-child{border-top:0;padding-top:0}.city-resource-row strong{color:#253d4d}.resource-pill-wrap{display:flex;flex-wrap:wrap;gap:5px}.resource-pill{font-size:.72rem;font-weight:800;padding:5px 7px;border-radius:999px;background:#eef4f8;color:#31536a;border:1px solid #d6e2e9}.ai-trade-chat{max-height:315px;overflow:auto;display:grid;gap:7px;margin-top:11px}.ai-chat-line{padding:9px 10px;border-radius:10px;background:#f7f9fb;border:1px solid #e1e7eb;font-size:.78rem;line-height:1.4}.ai-chat-line .ai-time{font-size:.65rem;color:#84919a;margin-right:5px}.ai-chat-line b{color:#2a4558}.ai-chat-line.accepted{border-left:4px solid #59a56c}.ai-chat-line.pending{border-left:4px solid #d2a23d}.ai-chat-line.declined{border-left:4px solid #cb6963}.ai-chat-empty{padding:18px;border:1px dashed #cbd5dc;border-radius:10px;text-align:center;color:#6d7c86;background:#fafcfd}
@media(max-width:900px){.trade-support-grid{grid-template-columns:1fr}.phase-track{grid-template-columns:repeat(2,1fr)}.city-resource-row{grid-template-columns:1fr}}

/* Full score labels, recovery-highlighted Store cards, and expired trades */
.score-full-label{display:block;font-size:.56rem!important;line-height:1.15;letter-spacing:0;text-transform:none;font-weight:700;color:#7a8994;margin-top:2px}.score-grid .metric:last-child .score-full-label{color:#ffffffc9}.score-legend{margin:7px 2px 0;color:#667682;font-size:.72rem;line-height:1.35}.store-item.recovery-needed{border:2px solid #d39a39;background:#fffaf0;position:relative}.store-priority-badge{align-self:flex-start;margin:-4px 0 8px;padding:5px 7px;border-radius:999px;background:#f6dfab;color:#704d0d;font-size:.64rem;font-weight:950;letter-spacing:.04em}.trade-status.cancelled{background:#e8edf1;color:#64727c}.ai-chat-line.cancelled{border-left:4px solid #97a4ad}
@media(max-width:590px){.score-full-label{font-size:.61rem!important}.score-legend{font-size:.69rem}.topbar a.btn{font-size:.72rem;padding:8px 9px}.topbar{gap:7px}}


/* Daily city operations */
.operations-panel{margin-top:14px;border-top:5px solid #527a92}.ops-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}.ops-top h2{margin:2px 0 0}.ops-status{font-size:.68rem;font-weight:950;padding:6px 8px;border-radius:999px;background:var(--good-bg);color:var(--good);letter-spacing:.04em}.ops-status.emergency-purchase-likely{background:#fff1d8;color:#81560d}.ops-status.shortage-risk,.ops-status.budget-risk{background:var(--danger-bg);color:var(--danger)}.ops-rule{margin:10px 0;padding:9px 11px;border-radius:10px;background:#f2f6f8;color:#536875;font-size:.79rem;line-height:1.4}.ops-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.ops-item{border:1px solid var(--line);border-radius:12px;padding:10px;background:#fff;min-width:0}.ops-item span{display:block;font-size:.66rem;font-weight:950;color:#6c7b86;letter-spacing:.04em}.ops-item strong{display:block;font-size:1.12rem;color:#243c4d;margin:4px 0}.ops-item small{display:block;color:#687985;line-height:1.35}.ops-item.ready{border-color:#a6cbb0;background:#f4faf5}.ops-item.warning{border-color:#e2b96f;background:#fffaf0}.ops-item.total{background:#eef5f8;border-color:#b7ceda}.ops-history{margin-top:10px;padding:9px 11px;border-radius:10px;border:1px solid #dde6eb;background:#fafcfd;color:#596b77;font-size:.78rem;line-height:1.45}.ops-bad{color:#9a3e35;font-weight:850}.ops-empty,.ops-disabled{padding:18px;border:1px dashed #cbd5dc;border-radius:12px;text-align:center;color:#667985;background:#fafcfd}.ops-disabled{display:flex;flex-direction:column;gap:4px;background:#f5f7f9}.ops-disabled b{color:#334c5c}
@media(max-width:1050px){.ops-grid{grid-template-columns:repeat(2,1fr)}.ops-item.total{grid-column:1/-1}}
@media(max-width:590px){.ops-grid{grid-template-columns:1fr}.ops-item.total{grid-column:auto}}

/* Student pinboard */
.pinboard-btn{position:relative;border:1px solid #d8bd75;background:#fff8e3;color:#62470d;border-radius:10px;padding:8px 10px;font-weight:900;cursor:pointer;display:flex;align-items:center;gap:5px}.pin-count{min-width:19px;height:19px;border-radius:999px;background:#8d6413;color:#fff;display:inline-grid;place-items:center;font-size:.68rem}.pin-count.empty{background:#a9b2b8}.pinboard-panel{position:fixed;z-index:80;right:14px;top:64px;width:min(390px,calc(100vw - 28px));max-height:calc(100vh - 82px);overflow:auto;background:#f7f9fb;border:1px solid #cfd9df;border-radius:15px;box-shadow:0 18px 48px rgba(29,48,62,.22);padding:12px}.pinboard-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;padding:3px 2px 10px;border-bottom:1px solid #dbe3e8}.pinboard-head strong{font-size:1.05rem;color:#243d4e}.pinboard-tip{margin:10px 0;padding:9px 10px;border-radius:10px;background:#fff8e5;border:1px solid #ead39a;color:#6c551d;font-size:.76rem;line-height:1.4}.pin-list{display:grid;gap:9px}.pin-empty{display:flex;flex-direction:column;gap:4px;text-align:center;padding:24px 14px;border:1px dashed #c7d1d8;border-radius:12px;background:#fff;color:#667782}.pin-empty b{color:#304958}.pin-card{border:1px solid #d6e0e5;border-radius:12px;background:#fff;padding:10px}.pin-card.recovery-pin{border-left:5px solid #c98a27}.pin-card.store-pin{border-left:5px solid #527a92}.pin-card.city-pin{border-left:5px solid #4b8760}.pin-card.ops-pin{border-left:5px solid #6a72a3}.pin-card.stale{opacity:.72}.pin-card-top{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}.pin-card-top strong{display:block;color:#273f4f;margin-top:2px}.pin-kicker{display:block;font-size:.62rem;letter-spacing:.055em;font-weight:950;color:#7a8993}.pin-toggle{border:1px solid #d7c792;background:#fffaf0;color:#6e5218;border-radius:999px;padding:5px 8px;font-size:.66rem;font-weight:900;white-space:nowrap;cursor:pointer}.pin-toggle:hover{background:#fff1c9}.pin-toggle.pinned{background:#f3dfaa;border-color:#c99b36;color:#62450c}.pin-detail{display:grid;grid-template-columns:72px 1fr;gap:7px;border-top:1px solid #edf1f3;padding-top:6px;margin-top:6px;font-size:.76rem}.pin-detail span{color:#71808a;font-size:.65rem;font-weight:900;text-transform:uppercase}.pin-detail b{color:#334c5c}.pin-copy{margin-top:7px;color:#60727e;font-size:.74rem;line-height:1.35}.pin-card-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}.pin-state{margin-top:7px;padding:6px 8px;border-radius:8px;font-size:.68rem;font-weight:950}.pin-state.ready{background:var(--good-bg);color:var(--good)}.pin-state.warning{background:var(--warn-bg);color:var(--warn)}.recovery-actions,.ops-head-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end}.store-title-row{display:flex;align-items:center;justify-content:space-between;gap:8px}.city-resource-name{display:flex;align-items:center;justify-content:space-between;gap:6px}.city-resource-name .pin-toggle{padding:4px 7px}.store-title-row .pin-toggle{flex:0 0 auto}
@media(max-width:720px){.pinboard-btn-label{display:none}.pinboard-panel{left:8px;right:8px;top:auto;bottom:8px;width:auto;max-height:74vh;border-radius:16px}.pin-detail{grid-template-columns:64px 1fr}.pin-card-actions .btn{flex:1}.recovery-actions{align-items:flex-end}}


/* KAPA title / role-selection screen */
.kapa-title-screen{position:relative;min-height:calc(100vh - 92px);display:grid;place-items:center;overflow:hidden;border-radius:22px;background:linear-gradient(180deg,#cfeaff 0%,#eef8ff 55%,#dff0d7 55%,#b9d6a8 100%);box-shadow:0 18px 50px rgba(29,60,82,.14);border:1px solid #bdd4df;margin:4px 0 22px}.kapa-skyline{position:absolute;inset:0;pointer-events:none}.kapa-sun{position:absolute;right:9%;top:9%;width:92px;height:92px;border-radius:50%;background:#ffd86b;box-shadow:0 0 0 14px rgba(255,216,107,.18)}.building{position:absolute;bottom:16%;background:linear-gradient(180deg,#4d7187,#2d5268);border-radius:6px 6px 0 0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}.building:after{content:"";position:absolute;inset:13px 9px;background:repeating-linear-gradient(90deg,#f8dd91 0 7px,transparent 7px 17px),repeating-linear-gradient(180deg,transparent 0 15px,rgba(255,255,255,.14) 15px 17px)}.b1{left:3%;width:9%;height:24%}.b2{left:13%;width:12%;height:35%}.b3{left:27%;width:8%;height:20%}.b4{right:26%;width:10%;height:28%}.b5{right:13%;width:11%;height:38%}.b6{right:3%;width:8%;height:23%}.kapa-road{position:absolute;left:-5%;right:-5%;bottom:0;height:16%;background:#56656e;transform:perspective(340px) rotateX(18deg);transform-origin:bottom}.kapa-road:after{content:"";position:absolute;left:0;right:0;top:45%;height:5px;background:repeating-linear-gradient(90deg,#fff3a0 0 42px,transparent 42px 78px)}.kapa-hero{position:relative;z-index:2;width:min(820px,92%);text-align:center;padding:42px 34px 36px;border-radius:26px;background:rgba(255,255,255,.92);border:1px solid rgba(255,255,255,.98);box-shadow:0 24px 60px rgba(39,73,94,.25);backdrop-filter:blur(4px)}.kapa-seal{width:84px;height:84px;margin:0 auto 12px;display:grid;place-items:center;border-radius:24px;background:linear-gradient(145deg,#285f8e,#173f63);color:#fff;font-weight:1000;letter-spacing:.08em;font-size:1.25rem;box-shadow:0 10px 24px rgba(24,62,92,.28),inset 0 0 0 4px rgba(255,255,255,.16)}.kapa-kicker{font-size:.72rem;font-weight:950;letter-spacing:.18em;color:#537084}.kapa-hero h1{font-size:clamp(2.25rem,6vw,4.7rem);line-height:.98;margin:10px 0 12px;color:#173f63;letter-spacing:-.035em}.kapa-tagline{max-width:650px;margin:0 auto 24px;color:#526978;font-size:1.08rem;line-height:1.55}.kapa-role-actions{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:650px;margin:0 auto}.kapa-role-btn{min-height:110px;display:grid!important;grid-template-columns:58px 1fr;text-align:left;align-items:center;column-gap:10px;padding:16px 18px!important;border-radius:16px!important;text-decoration:none!important}.kapa-role-btn>span{grid-row:1/3;font-size:2rem;text-align:center}.kapa-role-btn b{align-self:end;font-size:1.12rem}.kapa-role-btn small{align-self:start;display:block;font-weight:650;opacity:.8}.teacher-role{background:#fff;border:2px solid #b9cad5;color:#29495d}.teacher-role:hover{background:#f4f8fb}.kapa-city-row{display:flex;justify-content:center;gap:7px;flex-wrap:wrap;margin-top:22px}.kapa-city-row span{padding:7px 9px;border-radius:999px;background:#eef4f7;border:1px solid #d3e0e6;color:#4c6473;font-size:.69rem;font-weight:850}.login-back{margin:4px 0 10px}.login-back .btn{background:#fff}
@media(max-width:700px){.kapa-title-screen{min-height:calc(100vh - 76px);border-radius:16px}.kapa-hero{padding:30px 16px 24px}.kapa-role-actions{grid-template-columns:1fr}.kapa-role-btn{min-height:90px}.building{opacity:.65}.kapa-city-row{display:none}.kapa-sun{width:70px;height:70px}}