:root{--navy:#15334e;--blue:#2a79bd;--sky:#8ad4f6;--green:#5eaa55;--lime:#8fd267;--red:#d8564d;--orange:#e5a339;--paper:#f7f3e9;--ink:#193049;--muted:#6c7c89;--glass:rgba(248,250,252,.92);--line:rgba(18,49,76,.14);--shadow:0 18px 46px rgba(14,37,58,.22)}
*{box-sizing:border-box}html,body,#app{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:#dbeef7}button,input,select,textarea{font:inherit}button{cursor:pointer}.hidden{display:none!important}.screen{min-height:100vh}.panel-glass{background:var(--glass);border:1px solid rgba(255,255,255,.7);box-shadow:0 8px 22px rgba(21,51,78,.17);backdrop-filter:blur(14px)}
.login-screen{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(340px,.55fr);background:#eaf4f8}.login-hero{position:relative;min-height:100vh;overflow:hidden}.login-hero img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}.login-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,30,52,.12),rgba(7,30,52,.68))}.brand{position:absolute;left:6%;bottom:8%;color:white;text-shadow:0 3px 12px rgba(0,0,0,.35)}.brand-kicker{font-weight:800;letter-spacing:.12em;font-size:.76rem}.brand h1{font-size:clamp(2.6rem,6vw,6.2rem);line-height:.88;margin:.25rem 0 .6rem}.brand p{font-size:1.25rem;font-weight:600}.login-panel{padding:clamp(24px,5vw,64px);display:flex;flex-direction:column;justify-content:center;background:rgba(255,255,255,.93)}.role-switch{display:grid;grid-template-columns:1fr 1fr;background:#e7eef2;border-radius:14px;padding:4px;margin-bottom:28px}.role{border:0;padding:12px;border-radius:11px;background:transparent;color:var(--muted);font-weight:800}.role.active{background:white;color:var(--navy);box-shadow:0 4px 10px rgba(21,51,78,.1)}label{display:grid;gap:7px;font-size:.88rem;font-weight:750;margin-bottom:16px}input,select,textarea{width:100%;border:1px solid #c9d6df;border-radius:12px;background:white;padding:12px 13px;color:var(--ink);font-size:1rem;outline:none}input:focus,select:focus,textarea:focus{border-color:#4d9fce;box-shadow:0 0 0 3px rgba(77,159,206,.15)}.big-action{border:0;border-radius:13px;background:linear-gradient(180deg,#45a650,#33833c);color:white;font-weight:900;padding:14px 18px;box-shadow:0 6px 0 #24662d,0 10px 18px rgba(30,104,44,.24)}.big-action:active{transform:translateY(2px);box-shadow:0 4px 0 #24662d}.hint{color:var(--muted);font-size:.82rem}.error-text{color:#b53d37;font-weight:700;min-height:1.2rem}
.game-screen{position:relative;overflow:hidden;background:#7dc8ed}.game-screen canvas{display:block;width:100%;height:100vh;touch-action:none}.top-hud{position:absolute;z-index:10;top:13px;left:13px;right:13px;display:flex;align-items:flex-start;gap:10px;pointer-events:none}.city-badge{display:flex;gap:9px;align-items:center;padding:8px 12px;border-radius:15px;pointer-events:auto}.city-icon{font-size:1.6rem}.city-badge strong,.city-badge span{display:block}.city-badge span{color:var(--muted);font-size:.73rem;font-weight:700}.resource-strip{display:flex;padding:6px;border-radius:15px;gap:3px;pointer-events:auto}.resource-strip div{padding:5px 9px;display:flex;align-items:center;gap:6px;border-right:1px solid var(--line);white-space:nowrap}.resource-strip div:last-child{border-right:0}
.money-resource{background:linear-gradient(180deg,#fff6c7,#f1c84e);border:1px solid #d4a624!important;border-radius:11px;box-shadow:inset 0 1px 0 rgba(255,255,255,.75),0 3px 8px rgba(151,106,13,.18);color:#76510b}.money-resource span{filter:drop-shadow(0 1px 0 rgba(255,255,255,.65))}.money-resource b{color:#7a5208;text-shadow:0 1px 0 rgba(255,255,255,.7)}
.coin-cost{color:#a87308;font-weight:900;text-shadow:0 1px 0 rgba(255,255,255,.7)}
.round-button{width:48px;height:48px;border-radius:50%;border:0;font-size:1.3rem;position:relative;pointer-events:auto}.top-hud .round-button:first-of-type{margin-left:auto}.badge{position:absolute;top:-4px;right:-4px;background:#e4554d;color:white;border:2px solid white;border-radius:999px;font-size:.68rem;min-width:20px;height:20px;display:grid;place-items:center;font-weight:900}
.service-ribbon{position:absolute;z-index:10;top:76px;left:50%;transform:translateX(-50%);display:flex;border-radius:14px;padding:4px}.service-chip{display:flex;align-items:center;gap:7px;border:0;background:transparent;padding:6px 10px;border-right:1px solid var(--line);color:var(--ink);position:relative}.service-chip:last-child{border-right:0}.service-chip>span{font-size:1.15rem}.service-chip small,.service-chip b{display:block;text-align:left}.service-chip small{font-size:.58rem;color:var(--muted);font-weight:900;letter-spacing:.05em}.service-chip b{font-size:.72rem}.service-chip i{width:7px;height:7px;border-radius:50%;background:#48a65a}.service-chip i.bad{background:#db554c}.service-chip i.warn{background:#e7a236}
.tutorial-card{position:absolute;z-index:9;left:16px;top:130px;width:min(330px,calc(100% - 32px));border-radius:16px;padding:11px;display:flex;gap:11px;align-items:flex-start}.tutorial-count{min-width:40px;height:40px;border-radius:12px;background:var(--blue);color:white;display:grid;place-items:center;font-weight:900}.tutorial-card small{color:var(--blue);font-weight:900}.tutorial-card strong{display:block;margin:2px 0}.tutorial-card p{margin:0;color:var(--muted);font-size:.79rem;line-height:1.35}.event-toast{position:absolute;z-index:30;top:128px;left:50%;transform:translateX(-50%);background:rgba(21,51,78,.94);color:white;border-radius:14px;padding:11px 16px;box-shadow:var(--shadow);font-weight:800;max-width:min(90%,540px);text-align:center}.floating-warnings{position:absolute;z-index:8;inset:0;pointer-events:none}.world-warning{position:absolute;transform:translate(-50%,-100%);background:white;border:2px solid #e8a13c;border-radius:999px;padding:4px 7px;box-shadow:0 5px 10px rgba(0,0,0,.18);font-size:.85rem;white-space:nowrap}
.bottom-menu{position:absolute;z-index:12;left:50%;bottom:14px;transform:translateX(-50%);display:flex;border-radius:20px;padding:5px;gap:3px}.bottom-menu button{min-width:92px;border:0;background:transparent;border-radius:15px;padding:8px 10px;color:var(--ink);font-weight:800}.bottom-menu button span,.bottom-menu button b{display:block}.bottom-menu button span{font-size:1.45rem}.bottom-menu button b{font-size:.7rem}.bottom-menu button:hover,.bottom-menu button.active{background:#fff;box-shadow:0 5px 13px rgba(21,51,78,.13)}
.build-tray{position:absolute;z-index:16;left:50%;bottom:103px;transform:translateX(-50%);width:min(780px,calc(100% - 28px));border-radius:20px;padding:12px}.tray-header{display:flex;justify-content:space-between;align-items:center}.tray-header small,.tray-header strong{display:block}.tray-header small{color:var(--muted);font-size:.65rem;font-weight:900}.tray-header button,.panel-close,.modal-title-row button{border:0;width:34px;height:34px;border-radius:50%;background:#e8eef2;color:var(--ink);font-weight:900}.tray-items{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:8px;margin-top:10px}.tray-item{border:1px solid #d8e1e7;background:white;border-radius:14px;padding:10px;text-align:left;min-height:84px;position:relative}.tray-item:hover{border-color:#6eacd0;transform:translateY(-1px)}.tray-item .icon{font-size:1.6rem}.tray-item strong,.tray-item small{display:block}.tray-item small{color:var(--muted);font-size:.7rem}.tray-item.locked{opacity:.55;cursor:not-allowed}.road-controls{position:absolute;z-index:16;left:50%;bottom:105px;transform:translateX(-50%);border-radius:15px;padding:9px 11px;display:flex;align-items:center;gap:10px;font-size:.8rem}.road-controls button{border:0;background:#e6edf1;border-radius:10px;padding:7px 10px;font-weight:800}
.side-panel{position:absolute;z-index:15;right:15px;top:126px;width:min(360px,calc(100% - 30px));border-radius:20px;padding:16px;max-height:calc(100vh - 250px);overflow:auto}.panel-close{float:right}.building-title{display:flex;align-items:center;gap:10px;margin-bottom:12px}.building-title span{font-size:2rem}.building-title small,.building-title h2{display:block;margin:0}.building-title small{font-size:.65rem;color:var(--muted);font-weight:900}.building-stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0}.building-stat-grid div{border:1px solid #dde5e9;border-radius:12px;background:white;padding:9px}.building-stat-grid small,.building-stat-grid b{display:block}.building-stat-grid small{font-size:.62rem;color:var(--muted)}.upgrade-button{width:100%;border:0;border-radius:13px;background:linear-gradient(180deg,#3fa35a,#318344);color:white;font-weight:900;padding:12px}.upgrade-button.locked{background:#80919d}.countdown{font-size:.8rem;color:#c34c43;font-weight:850;margin-top:8px}
.modal{position:absolute;z-index:50;inset:0;background:rgba(8,26,42,.55);backdrop-filter:blur(5px);display:grid;place-items:center;padding:18px}.modal-card{width:min(530px,100%);background:#f9fbfc;border:1px solid rgba(255,255,255,.7);border-radius:24px;box-shadow:0 24px 70px rgba(9,29,46,.38);padding:20px}.challenge-head{display:flex;align-items:center;gap:12px}.challenge-icon{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:#dceef7;font-size:1.7rem}.challenge-head small{font-size:.68rem;color:#3378a5;font-weight:900}.challenge-head h2{margin:2px 0}.challenge-context{background:#eef5f7;border-radius:14px;padding:12px;line-height:1.5}.challenge-question{font-size:1.08rem;font-weight:850;line-height:1.45}.challenge-card form{margin-top:15px}.feedback{min-height:25px;font-weight:800}.feedback.ok{color:#278747}.feedback.bad{color:#bc443d}.text-button{border:0;background:transparent;color:var(--muted);font-weight:800}.modal-title-row{display:flex;justify-content:space-between;align-items:flex-start}.modal-title-row h2{margin:2px 0}.modal-title-row small{font-size:.65rem;color:var(--muted);font-weight:900}.message-list{display:grid;gap:9px;margin-top:14px;max-height:450px;overflow:auto}.message-item{background:white;border:1px solid #dfe7eb;border-radius:14px;padding:12px}.message-item .message-meta{display:flex;justify-content:space-between;gap:8px;color:var(--muted);font-size:.7rem}.message-item p{margin:7px 0 0;line-height:1.45}.message-item.unread{border-color:#4b9ccb;box-shadow:inset 4px 0 #4b9ccb}.blocked-overlay{position:absolute;z-index:80;inset:0;background:rgba(9,25,38,.75);backdrop-filter:blur(6px);display:grid;place-items:center;color:white;text-align:center;padding:22px}.blocked-overlay span{font-size:4rem}.blocked-overlay h2{font-size:2rem;margin:.4rem 0}.blocked-overlay p{max-width:430px;color:#dbe8ee}
.teacher-screen{background:#eef4f6;padding:24px;min-height:100vh}.teacher-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.teacher-header small{font-weight:900;color:#4c7b9b}.teacher-header h1{margin:3px 0;font-size:2rem}.teacher-header p{margin:0;color:var(--muted)}.teacher-head-actions{display:flex;gap:8px}.teacher-head-actions button{border:1px solid #d4dfe5;background:white;border-radius:12px;padding:10px 12px;font-weight:800}.teacher-grid{display:grid;grid-template-columns:minmax(290px,.8fr) minmax(360px,1.2fr);gap:15px}.teacher-card{background:white;border:1px solid #dde6ea;border-radius:18px;padding:16px;box-shadow:0 8px 22px rgba(29,54,72,.06)}.card-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:13px}.card-title small{font-size:.63rem;color:var(--muted);font-weight:900}.card-title h2{margin:2px 0}.card-title>span{background:#edf3f6;border-radius:999px;padding:6px 9px;font-size:.75rem;font-weight:800}.student-list{display:grid;gap:7px}.student-row{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;border:1px solid #e1e7eb;border-radius:12px;padding:10px;cursor:pointer}.student-row.active{border-color:#5e9fc5;background:#eff8fc}.student-row small,.student-row strong{display:block}.student-row small{color:var(--muted);font-size:.68rem}.student-mode{font-size:.73rem;font-weight:850}.teacher-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.teacher-stats div{border:1px solid #e1e7eb;border-radius:12px;padding:10px}.teacher-stats small,.teacher-stats b{display:block}.teacher-stats small{font-size:.58rem;color:var(--muted);font-weight:900}.control-buttons{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:13px}.control-buttons button{border:1px solid #d8e2e7;background:#f8fafb;border-radius:12px;padding:10px;font-weight:800}.control-buttons .danger{color:#b93e3a}.messages-card label{margin-bottom:11px}.recipient-switch{display:grid;grid-template-columns:1fr 1fr;background:#edf2f5;padding:4px;border-radius:12px;margin-bottom:13px}.recipient-switch button{border:0;background:transparent;border-radius:9px;padding:8px;font-weight:850;color:var(--muted)}.recipient-switch button.active{background:white;color:var(--ink);box-shadow:0 2px 7px rgba(0,0,0,.08)}.history-card{grid-column:1/-1}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;font-size:.82rem}th,td{text-align:left;padding:9px 8px;border-bottom:1px solid #e4eaed;white-space:nowrap}th{color:var(--muted);font-size:.68rem}
@media(max-width:900px){.login-screen{grid-template-columns:1fr}.login-hero{min-height:46vh}.login-panel{min-height:54vh}.teacher-grid{grid-template-columns:1fr}.history-card{grid-column:auto}.top-hud{flex-wrap:wrap}.service-ribbon{top:122px}.tutorial-card{top:175px}.resource-strip{order:3}.bottom-menu button{min-width:70px}.bottom-menu button b{display:none}.bottom-menu button span{font-size:1.7rem}.side-panel{top:170px}.teacher-stats{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.game-screen canvas{height:100svh}.city-badge{max-width:145px}.city-badge strong{font-size:.8rem}.resource-strip{position:absolute;top:55px;left:0}.round-button{width:44px;height:44px}.service-ribbon{top:116px;width:calc(100% - 20px);overflow:auto;justify-content:flex-start}.tutorial-card{top:170px}.bottom-menu{width:calc(100% - 16px);justify-content:space-around}.build-tray{bottom:87px}.road-controls{bottom:87px;width:calc(100% - 18px);flex-wrap:wrap}.teacher-screen{padding:14px}.teacher-header{align-items:flex-start;gap:10px}.teacher-head-actions{flex-direction:column}.control-buttons{grid-template-columns:1fr}}

/* V3.1 teacher support + bilingual controls */
.teacher-language{display:grid;gap:6px;margin:14px 0;font-size:13px;color:#486274}
.teacher-language select,.support-grid input,.support-grid select{min-height:42px;border:1px solid #ccd9e1;border-radius:10px;padding:8px 10px;background:#fff;color:#173b5e;font:inherit}
.support-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-items:end}
.support-grid label{display:grid;gap:5px;font-size:12px;color:#526b7c}
.support-grid button{min-height:42px;border:0;border-radius:11px;background:#1e6594;color:white;font-weight:800;padding:8px 10px}
.assistance-card{border-top:4px solid #d7a624}
.inventory-row-actions{display:flex;gap:7px;align-items:center;flex-wrap:wrap}
.inventory-row-actions button{border:1px solid #d4b45d;background:#fff6d8;color:#654800;border-radius:9px;padding:6px 9px;font-weight:800;cursor:pointer}
.production-actions{display:grid;gap:8px;margin-top:12px}
.production-actions button{border:1px solid #cbd8df;background:#f8fbfc;border-radius:10px;padding:9px;text-align:left;font-weight:800;color:#24465d}
.requirements{display:grid;gap:6px;margin:12px 0;padding:10px;border-radius:12px;background:#f3f6f7}
.requirements .missing{color:#b33e36;font-weight:800}
.requirements .ready{color:#277848;font-weight:800}
.teacher-resource-badge{font-size:12px;color:#667b89}
@media(max-width:720px){.support-grid{grid-template-columns:1fr}}

/* V3.2 visual pass: stronger contrast, darker city-builder HUD and less washed-out world */
:root{--glass:rgba(228,236,239,.90);--ink:#142b3b;--muted:#546875;--line:rgba(12,38,55,.20);--shadow:0 14px 34px rgba(5,24,38,.28)}
html,body,#app{background:#719e67}
.game-screen{background:#83b9d8}
.panel-glass{background:linear-gradient(180deg,rgba(235,241,242,.94),rgba(208,221,224,.92));border:1px solid rgba(60,83,91,.34);box-shadow:0 8px 22px rgba(5,26,39,.24);backdrop-filter:blur(10px)}
.city-badge,.resource-strip,.service-ribbon{box-shadow:0 7px 18px rgba(5,24,38,.25)}
.resource-strip div{border-right-color:rgba(35,57,68,.22)}
.money-resource{background:linear-gradient(180deg,#f7d86f,#c8951f)!important;border:1px solid #8e6812!important;box-shadow:inset 0 1px 0 rgba(255,247,197,.8),0 4px 10px rgba(77,53,8,.28)!important;color:#533902!important}
.money-resource b{color:#4c3403!important;text-shadow:0 1px 0 rgba(255,239,160,.7)!important}.money-resource span{filter:drop-shadow(0 1px 0 rgba(255,240,169,.7))}
.coin-cost{color:#956909;text-shadow:none}
.service-chip small{color:#405865}.service-chip b{color:#142b3b}
.tutorial-card{background:linear-gradient(180deg,rgba(238,242,239,.96),rgba(211,222,216,.95))}.tutorial-count{background:#316f9a}.tutorial-card small{color:#285f84}
.bottom-menu{background:linear-gradient(180deg,rgba(225,233,233,.95),rgba(192,206,207,.94))}.bottom-menu button:hover,.bottom-menu button.active{background:#f3f5f2;box-shadow:0 4px 10px rgba(4,23,35,.18)}
.build-tray,.road-controls,.side-panel{background:linear-gradient(180deg,rgba(232,237,235,.97),rgba(203,214,212,.96))}
.tray-item{background:#e7ece8;border-color:#aebcb9}.tray-item:hover{border-color:#477f99;background:#f0f3ef}.tray-item small{color:#52646c}
.building-stat-grid div{background:#e9eeea;border-color:#b6c2bf}.requirements{background:#dfe6e2!important;border-color:#aebbb7!important}
.world-warning{background:#eee8d8;border-color:#bd8130;color:#382c1c}
.modal-card{background:#e7ecea;border-color:#afbebc}.challenge-context{background:#d7e1df}.modal{background:rgba(4,17,25,.66)}


/* V4 REALISTIC CITY-BUILDER PASS */
:root{--glass:rgba(20,34,38,.91);--ink:#f2f0e7;--muted:#b8c3c1;--line:rgba(212,194,132,.30);--shadow:0 12px 28px rgba(0,0,0,.34)}
.game-screen{background:#607b61}
.panel-glass{background:linear-gradient(180deg,rgba(24,39,43,.95),rgba(15,28,31,.93));border:1px solid rgba(202,185,126,.30);box-shadow:0 8px 24px rgba(0,0,0,.38);color:#f5f2e8}
.city-badge strong,.resource-strip b,.service-chip b{color:#f5f2e8}.city-badge span,.service-chip small{color:#bdc9c5}
.money-resource{background:linear-gradient(180deg,#d8b44a,#9a6d12)!important;border:1px solid #f1d16e!important;color:#231801!important}.money-resource b{color:#211600!important}
.tutorial-card{background:linear-gradient(180deg,rgba(31,47,45,.96),rgba(22,35,34,.96));color:#f5f2e7;border-color:rgba(185,164,101,.32)}.tutorial-card small{color:#d5c47f}.tutorial-count{background:#a77d24;color:#fff7d2}
.bottom-menu{background:linear-gradient(180deg,rgba(28,43,45,.97),rgba(16,29,31,.97));border-color:rgba(204,184,117,.36)}.bottom-menu button{color:#eee9dd}.bottom-menu button:hover,.bottom-menu button.active{background:#354c49;color:#fff7df;box-shadow:inset 0 0 0 1px #b99742}
.build-tray,.road-controls,.side-panel{background:linear-gradient(180deg,rgba(32,46,47,.98),rgba(18,31,32,.98));color:#f4f0e5;border-color:rgba(192,171,108,.36)}
.tray-item{background:#263b3b;border-color:#526661;color:#f1eee4}.tray-item:hover{border-color:#d1ad4c;background:#334a47}.tray-item small{color:#bcc7c1}
.service-ribbon{background:rgba(18,32,35,.94)}.service-chip{color:#f2efe7}
.round-button{color:#f6f1e1}
.world-warning{background:#252d29;border:2px solid #cb8a28;color:#fff3d6;box-shadow:0 4px 12px rgba(0,0,0,.34)}
.event-toast{background:#19292b;color:#fff;border:1px solid rgba(218,190,102,.45)}

/* V4.1 readability fix for challenge/message modals */
.modal-card,
.challenge-card{
  background:linear-gradient(180deg,rgba(26,40,43,.98),rgba(18,29,32,.98))!important;
  border:1px solid rgba(211,186,108,.42)!important;
  color:#f6f1e5!important;
  box-shadow:0 26px 72px rgba(0,0,0,.46)!important;
}
.modal-card h2,
.modal-card h3,
.modal-card strong,
.modal-card label,
.modal-card p,
.modal-card .challenge-question,
.modal-card .challenge-head h2,
.modal-card .challenge-head small,
.modal-card .message-item,
.modal-card .message-item p,
.modal-card .message-item .message-meta,
.modal-title-row h2,
.modal-title-row small{
  color:#f6f1e5!important;
}
.challenge-context{
  background:rgba(244,239,224,.09)!important;
  border:1px solid rgba(214,190,120,.18);
  color:#f6f1e5!important;
}
.challenge-head small,
.modal-title-row small,
.modal-card .message-meta,
.modal-card .feedback{
  color:#d7c790!important;
}
.modal-card input,
.modal-card select,
.modal-card textarea{
  background:#f4f1e8!important;
  color:#112531!important;
  border:2px solid #5aa1d3!important;
  box-shadow:0 0 0 4px rgba(90,161,211,.18)!important;
}
.modal-card input::placeholder,
.modal-card textarea::placeholder{
  color:#657785!important;
}
.modal-card .big-action,
.modal-card .upgrade-button,
.modal-card .send-button,
.modal-card button[type="submit"]{
  background:linear-gradient(180deg,#46ad50,#2f843b)!important;
  color:#fff!important;
  box-shadow:0 8px 0 #23652d,0 14px 24px rgba(18,61,26,.35)!important;
}
.modal-card .text-button,
.modal-card .panel-close,
.modal-card .modal-title-row button{
  color:#d6ddd8!important;
}
.feedback.ok{color:#80d68e!important}
.feedback.bad{color:#ff8f85!important}


/* V4.3 teacher dashboard contrast + explicit recipient selector */
.teacher-screen{background:#edf3f5!important;color:#173247!important;--ink:#173247;--muted:#657984;--line:rgba(23,50,71,.16)}
.teacher-screen .teacher-header h1,.teacher-screen .teacher-header p,.teacher-screen .teacher-header small{color:#173247!important}
.teacher-screen .teacher-header small{color:#2f6f98!important}
.teacher-screen .teacher-card{background:#ffffff!important;color:#173247!important;border-color:#cedbe2!important;box-shadow:0 8px 22px rgba(20,48,67,.08)!important}
.teacher-screen .teacher-card h2,.teacher-screen .teacher-card strong,.teacher-screen .teacher-card b,.teacher-screen .teacher-card label,.teacher-screen .teacher-card td{color:#173247!important}
.teacher-screen .teacher-card small,.teacher-screen .teacher-card .hint,.teacher-screen .teacher-card p,.teacher-screen .teacher-card th{color:#657984!important}
.teacher-screen .student-row{background:#fff!important;border-color:#d4e0e5!important;color:#173247!important}
.teacher-screen .student-row.active{background:#edf8fd!important;border-color:#55a1ca!important}
.teacher-screen input,.teacher-screen select,.teacher-screen textarea{background:#fff!important;color:#173247!important;border:1px solid #b9ccd6!important;box-shadow:none!important}
.teacher-screen input:focus,.teacher-screen select:focus,.teacher-screen textarea:focus{border-color:#2d82b5!important;box-shadow:0 0 0 3px rgba(45,130,181,.14)!important}
.teacher-screen .recipient-switch{background:#e8f0f3!important}
.teacher-screen .recipient-switch button{color:#61747e!important}
.teacher-screen .recipient-switch button.active{background:#fff!important;color:#173247!important;box-shadow:0 2px 8px rgba(20,48,67,.12)!important}
.teacher-screen .control-buttons button,.teacher-screen .teacher-head-actions button{background:#fff!important;color:#173247!important;border-color:#cbd9df!important}
.teacher-screen .control-buttons .danger{color:#bf3632!important}
.teacher-screen .support-grid button{background:#276f9c!important;color:#fff!important}
.teacher-screen .big-action{color:#fff!important}
.teacher-screen #individualRecipientLabel{margin-top:12px}

/* V4.4 mailbox readability: light message cards must use dark text */
.modal-card .message-item {
  background: linear-gradient(180deg,#fbfcfa,#f1f4f2) !important;
  border: 1px solid #8ebdd6 !important;
  color: #172a35 !important;
  box-shadow: 0 4px 12px rgba(0,0,0,.12);
}
.modal-card .message-item.unread {
  border-color: #2f9ed8 !important;
  box-shadow: inset 5px 0 #2f9ed8,0 4px 12px rgba(0,0,0,.12) !important;
}
.modal-card .message-item p,
.modal-card .message-item strong,
.modal-card .message-item span,
.modal-card .message-item div {
  color: #172a35 !important;
}
.modal-card .message-item .message-meta,
.modal-card .message-item .message-meta * {
  color: #657681 !important;
}
.modal-card .message-item p {
  font-weight: 750;
  line-height: 1.48;
}
.modal-card .message-item .message-meta {
  font-weight: 700;
}
.modal-card .modal-title-row button {
  background: #edf2f2 !important;
  color: #59686f !important;
  border: 1px solid rgba(255,255,255,.35);
}


/* V4.5 road construction clarity + bulldozer */
.road-tool-switch{display:flex;gap:6px;padding:3px;border-radius:11px;background:rgba(255,255,255,.07)}
.road-controls .road-tool{border:1px solid rgba(220,205,150,.20);background:rgba(255,255,255,.08);color:#f3efe3;border-radius:9px;padding:7px 10px;min-height:38px}
.road-controls .road-tool.active{background:#dbead3;color:#173228;border-color:#ebf7df;box-shadow:0 0 0 2px rgba(225,247,210,.18)}
.road-controls .road-tool.danger.active{background:#b95645;color:#fff;border-color:#efaa97;box-shadow:0 0 0 2px rgba(239,130,105,.18)}
.road-controls #roadHint{min-width:190px;color:#e8e2d2;font-weight:750}
@media(max-width:720px){.road-tool-switch{width:100%}.road-controls .road-tool{flex:1}.road-controls #roadHint{width:100%;min-width:0}}

/* V4.6 administrator events + damage/repair */
.admin-profile-chip{display:inline-flex;align-items:center;min-height:38px;padding:8px 11px;border-radius:11px;background:#173247;color:#fff;font-size:.76rem;font-weight:900;letter-spacing:.04em;white-space:nowrap}
.events-card{grid-column:1/-1;border-top:4px solid #c9792d!important}
.event-admin-grid{display:grid;grid-template-columns:repeat(4,minmax(140px,1fr));gap:10px;align-items:end}
.event-admin-grid label{margin:0}
.event-send-button{margin-top:12px;width:100%;min-height:44px;border:0;border-radius:12px;background:linear-gradient(180deg,#b65c2e,#8f3d24);color:#fff;font-weight:900;box-shadow:0 5px 0 #71301f}
.event-send-button:active{transform:translateY(2px);box-shadow:0 3px 0 #71301f}
.event-history-wrap{margin-top:16px;padding-top:13px;border-top:1px solid #dce5e9}.event-history-wrap>strong{display:block;margin-bottom:8px}
.event-history-list{display:grid;gap:7px}.event-history-item{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:9px;border:1px solid #d8e3e8;border-radius:11px;padding:9px;background:#f8fbfc}.event-history-item>span{font-size:1.35rem}.event-history-item strong,.event-history-item small{display:block}.event-history-item small{margin-top:2px;color:#657984!important}.event-history-item b{min-width:30px;height:30px;border-radius:999px;background:#eef2f3;display:grid;place-items:center}
.damage-alert{display:grid;gap:5px;margin:12px 0;padding:12px;border:1px solid #cf7046;border-left:5px solid #c44f2e;border-radius:12px;background:rgba(151,68,38,.16)}.damage-alert strong{color:#ffd8c6!important}.damage-alert span{color:#f0c8ad;font-size:.82rem;font-weight:800}.damage-alert p{margin:0!important;color:#e9dfd8!important;font-size:.8rem;line-height:1.35}
.repair-button{width:100%;border:0;border-radius:12px;background:linear-gradient(180deg,#d77c32,#a84d27);color:#fff;font-weight:900;padding:12px;margin:8px 0 11px;box-shadow:0 5px 0 #78351f}
.repair-button:active{transform:translateY(2px);box-shadow:0 3px 0 #78351f}
@media(max-width:900px){.event-admin-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.event-admin-grid{grid-template-columns:1fr}.admin-profile-chip{white-space:normal}.events-card{grid-column:auto}}

/* V5 online authentication */
.auth-switch{margin-top:-14px;margin-bottom:18px}
#onlineAuthForm .hidden{display:none!important}
#onlineLogoutGameBtn{pointer-events:auto}
@media(max-width:560px){.login-panel{padding:24px}.auth-switch{margin-top:-10px}}

/* V5.1.1 — Online login isolated palette / readability */
.login-screen{
  color:#173b5e!important;
  background:#eef4f6!important;
}
.login-panel{
  background:rgba(255,255,255,.97)!important;
  color:#173b5e!important;
}
.login-panel .role-switch{
  background:#e8eff3!important;
  border:1px solid #d7e1e7;
}
.login-panel .role{
  color:#788a91!important;
  background:transparent!important;
  text-shadow:none!important;
}
.login-panel .role.active{
  color:#173b5e!important;
  background:#ffffff!important;
  box-shadow:0 6px 18px rgba(23,59,94,.10)!important;
}
.login-panel label,
.login-panel #onlineAuthForm label{
  color:#173b5e!important;
  text-shadow:none!important;
}
.login-panel input,
.login-panel select,
.login-panel textarea,
#onlineAuthForm input,
#onlineAuthForm select{
  background:#ffffff!important;
  color:#152f45!important;
  border:2px solid #c8d6df!important;
  -webkit-text-fill-color:#152f45!important;
  opacity:1!important;
}
.login-panel input::placeholder,
#onlineAuthForm input::placeholder{
  color:#6f7f89!important;
  opacity:1!important;
  -webkit-text-fill-color:#6f7f89!important;
}
.login-panel input:focus,
.login-panel select:focus,
#onlineAuthForm input:focus,
#onlineAuthForm select:focus{
  border-color:#3e9bd3!important;
  box-shadow:0 0 0 4px rgba(62,155,211,.15)!important;
}
.login-panel .hint,
#onlineAuthHint{
  color:#637781!important;
  text-shadow:none!important;
}
.login-panel .error-text,
#onlineAuthError{
  color:#b23d35!important;
}
.login-panel .big-action,
#onlineAuthSubmit{
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
}
@media(max-width:900px){
  .login-panel{min-height:54vh!important}
}

/* ==========================================================
   V5.1.2 · GLOBAL COLOR / CONTRAST AUDIT
   Each application area owns its palette so global theme
   changes cannot make text unreadable on opposite surfaces.
   ========================================================== */

/* --- GAME: dark glass surfaces --- */
.game-screen .panel-glass,
.game-screen .city-badge,
.game-screen .resource-strip,
.game-screen .service-ribbon,
.game-screen .tutorial-card,
.game-screen .bottom-menu,
.game-screen .build-tray,
.game-screen .road-controls,
.game-screen .side-panel{
  color:#f6f1e5!important;
}
.game-screen .city-badge strong,
.game-screen .resource-strip b,
.game-screen .service-chip b,
.game-screen .tutorial-card strong,
.game-screen .tray-header strong,
.game-screen .side-panel h2,
.game-screen .side-panel h3,
.game-screen .side-panel>p,
.game-screen .side-panel .building-title h2{
  color:#f6f1e5!important;
}
.game-screen .city-badge span,
.game-screen .service-chip small,
.game-screen .tutorial-card p,
.game-screen .tray-header small,
.game-screen .building-title small{
  color:#c3ceca!important;
}

/* Light controls that live inside dark game panels need dark text. */
.game-screen .tray-header button,
.game-screen .panel-close,
.game-screen .road-controls button:not(.road-tool){
  background:#eef2ee!important;
  color:#182f3c!important;
  border:1px solid #b8c4c1!important;
}
.game-screen .tray-header button:hover,
.game-screen .panel-close:hover,
.game-screen .road-controls button:not(.road-tool):hover{
  background:#ffffff!important;
  color:#102631!important;
}

/* Build cards stay dark. */
.game-screen .tray-item{
  background:#263b3b!important;
  color:#f4f0e5!important;
  border-color:#586d68!important;
}
.game-screen .tray-item strong{color:#f4f0e5!important}
.game-screen .tray-item small{color:#c4cfca!important}
.game-screen .tray-item.locked{opacity:.62}

/* Side-panel summary cells are light cards: force dark text. */
.game-screen .side-panel .building-stat-grid div,
.game-screen .side-panel .requirements{
  background:#eef2ee!important;
  color:#182f3c!important;
  border:1px solid #b9c5c1!important;
}
.game-screen .side-panel .building-stat-grid small{
  color:#526774!important;
}
.game-screen .side-panel .building-stat-grid b,
.game-screen .side-panel .requirements strong,
.game-screen .side-panel .requirements span,
.game-screen .side-panel .requirements div{
  color:#182f3c!important;
}
.game-screen .side-panel .requirements .missing{color:#9f302b!important}
.game-screen .side-panel .requirements .ready{color:#1f6a3b!important}

/* Production buttons are deliberately light on the dark panel. */
.game-screen .side-panel .production-actions button{
  background:#f8fbfc!important;
  color:#24465d!important;
  border-color:#b9cad3!important;
}
.game-screen .side-panel .production-actions strong{color:#f6f1e5!important}
.game-screen .side-panel .countdown{color:#ff9b91!important}

/* Road tools: explicit high-contrast active / inactive states. */
.game-screen .road-controls .road-tool{
  background:#263a3b!important;
  color:#f4f0e5!important;
  border-color:#667671!important;
}
.game-screen .road-controls .road-tool.active{
  background:#dbead3!important;
  color:#173228!important;
  border-color:#f0f7e9!important;
}
.game-screen .road-controls .road-tool.danger.active{
  background:#a84336!important;
  color:#ffffff!important;
  border-color:#f0aa9a!important;
}
.game-screen .road-controls #roadHint{color:#eee8da!important}

/* HUD gold resource must always remain dark text on gold. */
.game-screen .money-resource,
.game-screen .money-resource b{
  color:#211600!important;
}

/* --- MODALS: dark shell, explicit readable content --- */
.game-screen .modal-card,
.game-screen .challenge-card{
  background:linear-gradient(180deg,#1d3032,#132325)!important;
  color:#f6f1e5!important;
}
.game-screen .modal-card h2,
.game-screen .modal-card h3,
.game-screen .modal-card>p,
.game-screen .modal-card label,
.game-screen .modal-title-row h2,
.game-screen .challenge-question{
  color:#f6f1e5!important;
}
.game-screen .modal-title-row small,
.game-screen .challenge-head small{
  color:#d7c790!important;
}
.game-screen .challenge-context{
  background:#2a3c3c!important;
  color:#f6f1e5!important;
  border-color:#6e6950!important;
}
.game-screen .modal-card input,
.game-screen .modal-card select,
.game-screen .modal-card textarea{
  background:#ffffff!important;
  color:#152f45!important;
  -webkit-text-fill-color:#152f45!important;
  border:2px solid #5aa1d3!important;
}
.game-screen .modal-card input::placeholder,
.game-screen .modal-card textarea::placeholder{
  color:#60727d!important;
  -webkit-text-fill-color:#60727d!important;
  opacity:1!important;
}
.game-screen .modal-card .modal-title-row button,
.game-screen .modal-card .panel-close{
  background:#edf2f2!important;
  color:#59686f!important;
  border:1px solid #c8d3d1!important;
}

/* Mail cards are light cards: never inherit the modal's cream text. */
.game-screen .modal-card .message-item{
  background:#f8faf8!important;
  color:#172a35!important;
  border-color:#8ebdd6!important;
}
.game-screen .modal-card .message-item p,
.game-screen .modal-card .message-item strong,
.game-screen .modal-card .message-item span,
.game-screen .modal-card .message-item div{
  color:#172a35!important;
}
.game-screen .modal-card .message-item .message-meta,
.game-screen .modal-card .message-item .message-meta *{
  color:#5d6f7a!important;
}

/* Inventory uses dark rows to match modal shell. */
.game-screen .inventory-list{
  display:grid;
  gap:8px;
  margin-top:14px;
}
.game-screen .inventory-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:11px 12px;
  border-radius:12px;
  background:#26393a!important;
  border:1px solid #516563!important;
  color:#f4f0e5!important;
}
.game-screen .inventory-row strong,
.game-screen .inventory-row b{color:#f4f0e5!important}
.game-screen .inventory-row small{color:#c2cec9!important}
.game-screen .inventory-row-actions button{
  background:#fff6d8!important;
  color:#654800!important;
  border-color:#d4b45d!important;
}
.game-screen .inventory-row-actions button:disabled{
  background:#465654!important;
  color:#c8d0cc!important;
  border-color:#5c6d69!important;
  opacity:1!important;
}

/* Damage panel colors remain readable against the dark side panel. */
.game-screen .damage-alert{
  background:#4a261c!important;
  border-color:#d57d56!important;
}
.game-screen .damage-alert strong{color:#ffd8c6!important}
.game-screen .damage-alert span{color:#f6c7aa!important}
.game-screen .damage-alert p{color:#f3e5dd!important}

/* --- TEACHER / ADMIN: light application theme, fully isolated --- */
.teacher-screen{
  background:#edf3f5!important;
  color:#173247!important;
}
.teacher-screen .teacher-header h1,
.teacher-screen .teacher-header p,
.teacher-screen .teacher-card h2,
.teacher-screen .teacher-card h3,
.teacher-screen .teacher-card strong,
.teacher-screen .teacher-card b,
.teacher-screen .teacher-card label,
.teacher-screen .teacher-card td{
  color:#173247!important;
}
.teacher-screen .teacher-header small{color:#2f6f98!important}
.teacher-screen .teacher-card small,
.teacher-screen .teacher-card p,
.teacher-screen .teacher-card th,
.teacher-screen .teacher-card .hint{
  color:#5d6f7a!important;
}
.teacher-screen .teacher-card,
.teacher-screen .student-row,
.teacher-screen .event-history-item{
  background:#ffffff!important;
  color:#173247!important;
}
.teacher-screen .event-history-item strong,
.teacher-screen .event-history-item b{color:#173247!important}
.teacher-screen .event-history-item small{color:#5d6f7a!important}
.teacher-screen .event-history-item b{background:#eef3f5!important}
.teacher-screen input,
.teacher-screen select,
.teacher-screen textarea{
  background:#ffffff!important;
  color:#173247!important;
  -webkit-text-fill-color:#173247!important;
  border-color:#b9ccd6!important;
}
.teacher-screen input::placeholder,
.teacher-screen textarea::placeholder{
  color:#60727d!important;
  -webkit-text-fill-color:#60727d!important;
  opacity:1!important;
}
.teacher-screen .control-buttons button,
.teacher-screen .teacher-head-actions button{
  background:#ffffff!important;
  color:#173247!important;
}
.teacher-screen .control-buttons button:disabled,
.teacher-screen .teacher-head-actions button:disabled{
  background:#e7ecef!important;
  color:#60727d!important;
  opacity:1!important;
}
.teacher-screen .recipient-switch button{color:#5d6f7a!important}
.teacher-screen .recipient-switch button.active{color:#173247!important;background:#ffffff!important}
.teacher-screen .support-grid button,
.teacher-screen .event-send-button,
.teacher-screen .big-action{
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
}
.teacher-screen .admin-profile-chip{color:#ffffff!important}

/* --- AUTH / LOGIN: light theme, isolated from game and admin themes --- */
.login-screen{color:#173b5e!important;background:#eef4f6!important}
.login-panel{background:#ffffff!important;color:#173b5e!important}
.login-panel .role-switch{background:#e8eff3!important;border-color:#d7e1e7!important}
.login-panel .role{color:#60727d!important;background:transparent!important}
.login-panel .role.active{background:#ffffff!important;color:#173b5e!important}
.login-panel label{color:#173b5e!important}
.login-panel input,
.login-panel select,
.login-panel textarea,
#onlineAuthForm input,
#onlineAuthForm select{
  background:#ffffff!important;
  color:#152f45!important;
  -webkit-text-fill-color:#152f45!important;
  border-color:#c8d6df!important;
}
.login-panel input::placeholder,
.login-panel textarea::placeholder,
#onlineAuthForm input::placeholder{
  color:#60727d!important;
  -webkit-text-fill-color:#60727d!important;
  opacity:1!important;
}
.login-panel .hint,#onlineAuthHint{color:#5d6f7a!important}
.login-panel .error-text,#onlineAuthError{color:#a8322d!important}
.login-panel .big-action,#onlineAuthSubmit{color:#ffffff!important;-webkit-text-fill-color:#ffffff!important}

/* --- BLOCKED / NOTICES --- */
.game-screen .blocked-overlay{background:rgba(9,25,38,.82)!important;color:#ffffff!important}
.game-screen .blocked-overlay h2{color:#ffffff!important}
.game-screen .blocked-overlay p{color:#e4edf1!important}
.game-screen .event-toast{background:#17292b!important;color:#ffffff!important}
.game-screen .world-warning{background:#252d29!important;color:#fff3d6!important}

/* Visible keyboard focus across all themes. */
.login-screen button:focus-visible,
.teacher-screen button:focus-visible,
.game-screen button:focus-visible{
  outline:3px solid #55aee0!important;
  outline-offset:2px!important;
}