/* Scoped to the existing game route; surrounding SAFETY ONE navigation is untouched. */
.interactive-training-page .safety-game-page{--sg-ink:#15354a;--sg-orange:#ffc338;--sg-green:#46d1a3;box-sizing:border-box;width:100%;min-width:0;padding:18px;color:var(--sg-ink);font-family:inherit}
.safety-game-page *{box-sizing:border-box}
.safety-game-page [hidden]{display:none!important}
.safety-game-page .sg-page-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 14px}
.safety-game-page .sg-page-heading small{display:block;color:#4e7994;font-size:11px;font-weight:800;letter-spacing:1.5px;margin-bottom:4px}
.safety-game-page .sg-page-heading h2{margin:0;font-size:23px;letter-spacing:-1px;color:#183d54}
.safety-game-page button{font-family:inherit;cursor:pointer}
.safety-game-page button:focus-visible,.safety-game-page .sg-canvas:focus-visible{outline:3px solid #38a7e8;outline-offset:3px}
.safety-game-page .sg-focus-button{flex-shrink:0;border:1px solid #bed1dc;background:#fff;color:#264d65;border-radius:8px;padding:11px 14px;font-size:13px;font-weight:800}
.safety-game-page .sg-scenario-picker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:12px}
.safety-game-page .sg-scenario-picker button{display:flex;align-items:center;gap:11px;min-width:0;padding:12px;border:1px solid #c6d6de;background:#f4f8fa;border-radius:9px;text-align:left;color:#24465b}
.safety-game-page .sg-scenario-picker button>span{font-size:22px;letter-spacing:-1px;font-weight:900;color:#8ba6b5}
.safety-game-page .sg-scenario-picker b{display:block;font-size:14px;line-height:1.4}
.safety-game-page .sg-scenario-picker small{display:block;font-size:11px;color:#7390a0;margin-top:3px}
.safety-game-page .sg-scenario-picker i{margin-left:auto;font-style:normal}
.safety-game-page .sg-scenario-picker [aria-pressed="true"]{background:#193e56;border-color:#193e56;color:#fff;box-shadow:inset 0 -3px #ffc338}
.safety-game-page .sg-scenario-picker [aria-pressed="true"]>span{color:#ffd05a}
.safety-game-page .sg-scenario-picker [aria-pressed="true"] small{color:#b6cbd8}
.safety-game-page .sg-game-card{overflow:hidden;border:1px solid #b6cad6;border-radius:12px;background:#193c51;box-shadow:0 12px 30px #173e5617}
.safety-game-page .sg-stage{position:relative;isolation:isolate;width:100%;height:clamp(440px,68vh,820px);overflow:hidden;background:#86c4e7;min-width:0}
.safety-game-page .sg-canvas-host,.safety-game-page .sg-canvas{display:block;width:100%;height:100%;outline:0}
.safety-game-page .sg-canvas-host{position:absolute;inset:0}
.safety-game-page .sg-hud{position:absolute;z-index:3;top:16px;left:16px;right:16px;display:flex;justify-content:space-between;align-items:flex-start;gap:14px;pointer-events:none}
.safety-game-page .sg-mission,.safety-game-page .sg-score{background:#153b54e8;border:1px solid #ceeafa4d;border-radius:9px;box-shadow:0 4px 14px #102f432a;color:#fff}
.safety-game-page .sg-mission{max-width:310px;padding:12px 14px;border-top:3px solid #f5c443}
.safety-game-page .sg-mission small{display:block;font-size:13px;font-weight:900;letter-spacing:.8px;color:#ecf7ff;margin-bottom:5px}
.safety-game-page .sg-mission small span{color:#9dbbce}
.safety-game-page .sg-mission b{display:block;font-size:14px;line-height:1.5;font-weight:600;word-break:keep-all}
.safety-game-page .sg-score{padding:9px 16px;min-width:96px;text-align:center}
.safety-game-page .sg-score small{display:block;font-size:12px;font-weight:700}
.safety-game-page .sg-score strong{display:block;color:#ffd244;font-size:36px;line-height:1.15;font-variant-numeric:tabular-nums}
.safety-game-page .sg-score>span{display:block;color:#ff6854;letter-spacing:3px;font-size:20px;line-height:1.2;text-shadow:0 2px #0c2637}
.safety-game-page .sg-score em{font-style:normal;color:#526e7e}
.safety-game-page .sg-signal{position:absolute;top:124px;left:16px;z-index:3;display:flex;align-items:center;gap:8px;max-width:285px;border:1px solid #ffffff88;border-radius:8px;background:#fff9ebeb;padding:8px 12px;color:#754135;pointer-events:none}
.safety-game-page .sg-signal-dot{width:10px;height:10px;border-radius:50%;background:#e5553d;box-shadow:0 0 0 4px #e5553d1f;flex-shrink:0}
.safety-game-page .sg-signal b{display:block;font-size:14px}.safety-game-page .sg-signal small{display:block;font-size:12px;margin-top:2px}
.safety-game-page .sg-signal[data-signal="GO"]{color:#1e654f;background:#effff4ed}
.safety-game-page .sg-signal[data-signal="GO"] .sg-signal-dot{background:#32b87e;box-shadow:0 0 0 4px #32b87e22}
.safety-game-page .sg-signal[data-signal="OBSERVE"]{color:#23536e;background:#f3faffed}
.safety-game-page .sg-signal[data-signal="OBSERVE"] .sg-signal-dot{background:#3189bd}
.safety-game-page .sg-joystick{position:absolute;z-index:5;left:22px;bottom:30px;width:clamp(110px,29vw,130px);height:clamp(110px,29vw,130px);border:2px solid #ebf6ff9c;border-radius:50%;background:#193c527a;box-shadow:inset 0 0 0 8px #ffffff12,0 5px 14px #12304533;touch-action:none;user-select:none}
.safety-game-page .sg-joystick[aria-disabled="true"]{opacity:.35}
.safety-game-page .sg-joystick-ring{position:absolute;inset:26%;border:1px solid #d4edff4a;border-radius:50%}
.safety-game-page .sg-joystick-thumb{position:absolute;left:50%;top:50%;width:48px;height:48px;margin:-24px;border-radius:50%;background:linear-gradient(#badcf0,#699ec0);border:2px solid #e6f6ffb3;box-shadow:0 4px 10px #132c464d;pointer-events:none}
.safety-game-page .sg-stick-arrow{position:absolute;top:5px;left:calc(50% - 6px);color:#e2f3ffc7;font-size:14px}
.safety-game-page .sg-move-hint{position:absolute;z-index:3;bottom:10px;left:28px;color:white;text-shadow:0 1px 4px #092a42;font-size:11px;pointer-events:none}
.safety-game-page .sg-progress{position:absolute;right:24px;bottom:35px;z-index:3;display:flex;align-items:center;gap:6px;padding:9px 12px;background:#143b54cd;border:1px solid #ffffff55;border-radius:24px;color:#fff;pointer-events:none}
.safety-game-page .sg-progress>span{display:grid;place-items:center;width:23px;height:23px;border:1px solid #91b8ce;border-radius:50%;font-size:11px;color:#bad2e0}
.safety-game-page .sg-progress .current{background:#ffc638;border-color:#ffc638;color:#15384d;font-weight:900}
.safety-game-page .sg-progress .done{background:#36b981;color:#fff}
.safety-game-page .sg-progress i{height:2px;width:12px;background:#96b7ca}
.safety-game-page .sg-progress small{font-size:9px;letter-spacing:.8px}
.safety-game-page .sg-layer{position:absolute;inset:0;z-index:7;display:grid;align-items:end;justify-items:center;padding:145px 18px 22px;background:linear-gradient(transparent 25%,#0b2b4480 100%);pointer-events:none}
.safety-game-page .sg-dialog{pointer-events:auto;width:min(430px,100%);max-height:100%;overflow:auto;border:1px solid #ffffff75;border-radius:15px;background:#123952f5;color:#fff;padding:24px;text-align:left;box-shadow:0 16px 44px #0d2c4940}
.safety-game-page .sg-dialog>small{color:#ffd15a;font-size:11px;letter-spacing:2px;font-weight:900}
.safety-game-page .sg-dialog h3{margin:9px 0 10px;font-size:24px;line-height:1.3;letter-spacing:-.8px;color:#fff}
.safety-game-page .sg-dialog p{margin:0 0 18px;font-size:14px;line-height:1.7;word-break:keep-all;color:#d2e4ef}
.safety-game-page .sg-primary-button,.safety-game-page .sg-secondary-button{min-height:44px;padding:11px 18px;border-radius:8px;border:1px solid transparent;font-weight:900;font-size:14px}
.safety-game-page .sg-primary-button{background:#ffc638;color:#193d52;border-color:#ffda7f}
.safety-game-page .sg-primary-button>span{margin-left:50px}
.safety-game-page .sg-start-card>.sg-primary-button{width:100%;display:flex;align-items:center;justify-content:space-between}
.safety-game-page .sg-secondary-button{background:#ffffff0d;color:#e5f2fa;border-color:#7596ae}
.safety-game-page .sg-control-help{display:flex;justify-content:space-between;gap:8px;color:#b4ccda;font-size:11px;margin-top:14px}
.safety-game-page .sg-control-help b{color:#effaff}
.safety-game-page .sg-result-layer{align-items:center;background:#15324728;padding-top:135px}
.safety-game-page .sg-result-card{text-align:center}
.safety-game-page .sg-result-mark{display:grid;width:48px;height:48px;place-items:center;margin:15px auto 10px;border-radius:50%;background:#3ac197;color:white;font-size:32px;font-weight:900}
.safety-game-page .sg-result-card[data-result-type="hazard"] .sg-result-mark{background:#ee644d}
.safety-game-page .sg-result-guidance{background:#ffffff0c;padding:12px;border-left:3px solid #e6bf5a;text-align:left;border-radius:5px}
.safety-game-page .sg-result-award{display:flex;align-items:center;justify-content:center;gap:15px;margin-bottom:18px}
.safety-game-page .sg-result-award strong{color:#ffd65a;font-size:18px}.safety-game-page .sg-result-award span{color:#acd6e5;font-size:13px}
.safety-game-page .sg-result-actions{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}
.safety-game-page .sg-completion-note{color:#a2edc6!important}
.safety-game-page .sg-score-pop{position:absolute;z-index:6;top:32%;left:45%;font-weight:900;font-size:50px;color:#9dffda;text-shadow:0 3px 0 #186955;animation:sg-score-rise 1.2s ease-out both;pointer-events:none}
.safety-game-page.sg-is-hazard .sg-score-pop{color:#ff9b85;text-shadow:0 3px 0 #7e362e}
.safety-game-page.sg-is-hazard .sg-stage:after{content:'';position:absolute;inset:0;pointer-events:none;z-index:4;box-shadow:inset 0 0 100px #f3382a;animation:sg-danger-flash .75s ease-out both}
.safety-game-page .sg-game-footer{display:flex;justify-content:space-between;gap:12px;padding:11px 16px;color:#c2d8e5;font-size:12px}
.safety-game-page .sg-game-footer b{color:#fff;margin-right:7px}
.interactive-training-page .safety-game-page.sg-focus{position:fixed;inset:0;z-index:2000;display:flex;flex-direction:column;background:#102e43;height:100dvh;padding:10px 14px;color:#e1eff8}
.safety-game-page.sg-focus .sg-page-heading{margin:0 0 8px}.safety-game-page.sg-focus .sg-page-heading small{display:none}.safety-game-page.sg-focus .sg-page-heading h2{color:#e5f4ff;font-size:17px}.safety-game-page.sg-focus .sg-focus-button{padding:8px 12px;min-height:38px;background:#21495f;color:white;border-color:#53778c}
.safety-game-page.sg-focus .sg-scenario-picker{margin-bottom:8px}.safety-game-page.sg-focus .sg-scenario-picker button{padding:7px 10px}
.safety-game-page.sg-focus .sg-game-card{flex:1;display:flex;flex-direction:column;min-height:0}.safety-game-page.sg-focus .sg-stage{flex:1;height:auto;min-height:0}.safety-game-page.sg-focus .sg-game-footer{display:none}
@keyframes sg-score-rise{0%{opacity:0;transform:translateY(20px) scale(.65)}30%{opacity:1;transform:translateY(0) scale(1)}100%{opacity:0;transform:translateY(-60px) scale(1)}}
@keyframes sg-danger-flash{0%{opacity:0}20%{opacity:.8}100%{opacity:0}}
@media(max-width:720px){
 .interactive-training-page .safety-game-page{padding:8px}
 .safety-game-page .sg-page-heading{margin-bottom:10px}.safety-game-page .sg-page-heading small{font-size:9px;letter-spacing:.8px}.safety-game-page .sg-page-heading h2{font-size:19px}.safety-game-page .sg-focus-button{font-size:12px;padding:9px}
 .safety-game-page .sg-scenario-picker{gap:5px}.safety-game-page .sg-scenario-picker button{display:block;padding:8px;position:relative}.safety-game-page .sg-scenario-picker button>span{font-size:14px;letter-spacing:0}.safety-game-page .sg-scenario-picker b{font-size:12px;margin-top:4px;line-height:1.35;word-break:keep-all}.safety-game-page .sg-scenario-picker small,.safety-game-page .sg-scenario-picker i{display:none}
 .safety-game-page .sg-stage{height:clamp(540px,78svh,820px)}
 .safety-game-page .sg-hud{top:10px;left:10px;right:10px;gap:8px}.safety-game-page .sg-mission{padding:9px 10px;max-width:210px;flex:1}.safety-game-page .sg-mission small{font-size:11px}.safety-game-page .sg-mission b{font-size:12px}
 .safety-game-page .sg-score{padding:7px 9px;min-width:70px}.safety-game-page .sg-score strong{font-size:29px}.safety-game-page .sg-score small{font-size:10px}.safety-game-page .sg-score>span{font-size:17px;letter-spacing:1px}
 .safety-game-page .sg-signal{top:114px;left:10px;padding:7px 10px}.safety-game-page .sg-signal b{font-size:12px}.safety-game-page .sg-signal small{font-size:11px}
 .safety-game-page .sg-joystick{left:14px;bottom:33px}.safety-game-page .sg-move-hint{left:24px}
 .safety-game-page .sg-progress{right:10px;bottom:40px;padding:7px 9px;gap:4px}.safety-game-page .sg-progress>span{width:19px;height:19px;font-size:10px}.safety-game-page .sg-progress i{width:7px}.safety-game-page .sg-progress small{display:none}
 .safety-game-page .sg-layer{padding:152px 12px 16px}.safety-game-page .sg-dialog{padding:19px}.safety-game-page .sg-dialog h3{font-size:21px}.safety-game-page .sg-dialog p{font-size:13px;margin-bottom:13px}.safety-game-page .sg-control-help{font-size:10px}
 .safety-game-page .sg-game-footer{font-size:11px}.safety-game-page .sg-game-footer>span:last-child{display:none}
 .interactive-training-page .safety-game-page.sg-focus{padding:8px}.safety-game-page.sg-focus .sg-scenario-picker button{padding:5px 7px}.safety-game-page.sg-focus .sg-scenario-picker button>span{display:none}.safety-game-page.sg-focus .sg-scenario-picker b{margin:0}
}
@media(prefers-reduced-motion:reduce){.safety-game-page .sg-score-pop{animation:none}.safety-game-page.sg-is-hazard .sg-stage:after{animation:none;opacity:0}}
/* Second enhancement: compact status, no route answer before a safe action. */
.safety-game-page .sg-signal{padding:6px 9px;max-width:250px}
.safety-game-page .sg-observation{position:absolute;top:186px;left:16px;display:flex;gap:7px;align-items:center;color:#e8f2f4;background:#153b54cf;border-radius:6px;padding:6px 9px;font-size:12px;pointer-events:none;z-index:3}
.safety-game-page .sg-observation i{font-style:normal;color:#92adb9}
.safety-game-page .sg-observation[data-step="observe"] span:first-child,.safety-game-page .sg-observation[data-step="wait"] span:nth-of-type(2),.safety-game-page .sg-observation[data-step="move"] span:last-child{color:#ffd262;font-weight:800}
.safety-game-page .sg-warning{position:absolute;top:226px;left:16px;right:16px;z-index:4;max-width:340px;background:#663b27ed;color:#fff5db;padding:10px 12px;border:1px solid #ffc476;border-radius:8px;font-size:13px;line-height:1.5;pointer-events:none}
.safety-game-page.sg-is-warning .sg-stage:before{content:'';position:absolute;inset:0;z-index:2;box-shadow:inset 0 0 55px #d7492c55;pointer-events:none}
.safety-game-page .sg-settings{position:absolute;right:12px;top:130px;display:flex;flex-direction:column;align-items:flex-end;gap:6px;z-index:5}
.safety-game-page .sg-settings button,.safety-game-page .sg-settings label{background:#17394cd9;border:1px solid #afc6d270;border-radius:6px;color:white;padding:7px;font-size:12px;min-height:36px}
.safety-game-page .sg-settings select{background:#204b63;color:white;border:0;font:inherit;max-width:70px}
.safety-game-page .sg-hint-text{border:1px solid #dcb755;color:#ffe4a1!important;background:#6b58202b;padding:9px;border-radius:6px}
.safety-game-page .sg-score-pop{font-size:28px;left:24%;max-width:70%;text-align:center}
.safety-game-page .sg-blind-label{position:absolute;top:34%;left:20%;right:20%;text-align:center;color:#fff7df;background:#873b25e3;padding:12px;border:1px solid #ffb666;z-index:5;border-radius:6px;font-size:15px;animation:sg-blind-explain 4s both;pointer-events:none}
@keyframes sg-blind-explain{0%,60%{opacity:1}100%{opacity:0}}
@media(max-width:720px){
 .safety-game-page .sg-signal{top:114px;left:10px;max-width:210px}
 .safety-game-page .sg-signal small{font-size:12px}
 .safety-game-page .sg-observation{top:173px;left:10px;font-size:12px}
 .safety-game-page .sg-settings{top:114px;right:10px}
 .safety-game-page .sg-settings button,.safety-game-page .sg-settings label{font-size:12px;padding:6px}
 .safety-game-page .sg-warning{top:212px;left:10px;right:10px;font-size:12px}
 .safety-game-page .sg-dialog{max-height:100%}
 .safety-game-page .sg-blind-label{left:12%;right:12%;font-size:13px}
}
