/* Optional game UI: isolated from the professional portfolio layout. */
.game-launch{margin-left:auto;display:inline-flex;align-items:center;gap:10px;padding:10px 14px;min-height:42px;color:#dce9db;background:#142635eb;border:1px solid #849692;box-shadow:3px 3px 0 #101827;font:11px var(--mono);transition:background .2s,transform .2s}
.game-launch:hover{background:#284441;transform:translateY(-2px)}
.game-launch svg{width:20px;height:16px}
[data-theme="light"] .game-launch{background:#eee5dcec;color:#304d46;border-color:#7f8f89;box-shadow:3px 3px 0 #a8a6a2}
body.game-is-open{overflow:hidden}
.portfolio-game{padding:0;width:min(1180px,calc(100vw - 40px));height:min(850px,calc(100dvh - 40px));max-width:none;max-height:none;border:2px solid #71857e;background:#15252e;color:#e6e7d7;box-shadow:0 24px 100px #0009;font-family:var(--sans);overflow:hidden}
.portfolio-game::backdrop{background:#070d1cde;backdrop-filter:blur(5px)}
.portfolio-game[open]{animation:game-open .3s var(--ease)}
@keyframes game-open{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}
.game-shell{position:relative;height:100%;display:grid;grid-template-rows:76px 44px minmax(0,1fr)82px}
.game-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 24px;background:#1c2e36;border-bottom:1px solid #4a645e}
.game-eyebrow{font:8px var(--mono);letter-spacing:.16em;color:#aec5b7;margin:0 0 5px}
.game-header h2{font:28px var(--pixel);letter-spacing:0;line-height:1;margin:0;color:#edf0dc}
.game-close{display:flex;align-items:center;gap:10px;background:#14262e;color:#d4e0d2;border:1px solid #596f68;padding:9px 12px;font:11px var(--mono);min-height:38px}
.game-close>span{font-size:22px;line-height:1}
.game-close:hover,.game-continue:hover{background:#345047}
.game-toolbar{display:flex;align-items:center;gap:22px;padding:0 24px;font:10px var(--mono);background:#13262f;position:relative;z-index:4;border-bottom:1px solid #526a61}
.game-location{color:#d5ddcb;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.game-location::before{content:"";display:inline-block;width:5px;height:5px;background:#bbd5ae;margin-right:10px}
.game-progress{margin-left:auto;color:#9fb6aa;white-space:nowrap}
.game-directory{position:relative;flex:none}
.game-directory summary{cursor:pointer;padding:11px 0 11px 12px;color:#d3e1cc;list-style:none}
.game-directory summary::-webkit-details-marker{display:none}
.game-directory summary span{padding-left:8px}
.game-directory nav{position:absolute;right:-12px;top:38px;width:290px;background:#192e36;border:1px solid #80958a;box-shadow:5px 6px 0 #0b172966;padding:7px;max-height:min(440px,65dvh);overflow:auto}
.game-directory nav button{display:grid;grid-template-columns:17px 1fr auto;align-items:center;gap:8px;text-align:left;width:100%;padding:13px 10px;background:transparent;color:#e0e4d4;border:0;border-bottom:1px solid #334c4c;font:11px var(--sans)}
.game-directory nav button:last-child{border-bottom:0}
.game-directory nav button:hover{background:#304a45}
.game-directory .place-type{font:8px var(--mono);color:#9eb5a9}
.place-marker{color:#b9d8b6}
.game-stage{position:relative;overflow:hidden;background:#293f40;min-height:0}
.game-canvas{display:block;width:100%;height:100%;image-rendering:pixelated;touch-action:none;cursor:crosshair}
.game-canvas:focus-visible{outline:2px solid #e3d4a1;outline-offset:-3px}
.game-arrival{position:absolute;left:50%;top:16px;transform:translateX(-50%);background:#13262fea;border:1px solid #749084;padding:12px 22px;min-width:300px;text-align:center;pointer-events:none;animation:game-arrival 4.5s both;z-index:1}
.game-arrival>span{display:block;font:18px var(--pixel);letter-spacing:.06em;color:#dce6cd}
.game-arrival small{display:block;font:10px var(--sans);color:#b7c9b6;margin-top:4px}
@keyframes game-arrival{0%,70%{opacity:1;visibility:visible}100%{opacity:0;visibility:hidden}}
.game-footer{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 24px;background:#192c34;border-top:1px solid #60766a}
#game-help{font:11px/1.8 var(--sans);color:#b4c7bb;margin:0}
#game-help kbd{font:10px var(--mono);color:#e4e5cf}
.game-interact{border:1px solid #9eae92;background:#bdd6ad;color:#172f31;padding:12px 18px;font:11px var(--mono);min-height:42px;max-width:280px;cursor:pointer}
.game-interact:disabled{color:#8aa299;background:#1e353c;border-color:#455f5c;cursor:default}
.game-interact:not(:disabled):hover{background:#d4e5bf}
.game-dpad{display:none}
.game-card{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);width:min(660px,calc(100% - 36px));max-height:calc(100% - 36px);overflow:auto;overscroll-behavior:contain;z-index:2;background:#172a33;border:2px solid #a9b996;box-shadow:6px 6px 0 #0f1d2cc0;padding:27px 30px;color:#e3e7d5}
.game-card-category{font:9px/1.7 var(--mono);letter-spacing:.08em;color:#b8cba5;max-width:calc(100% - 24px);margin-bottom:12px}
.game-card h3{font:32px/1.15 var(--pixel);color:#f1edcf;letter-spacing:0;margin:0 25px 14px 0;overflow-wrap:anywhere}
.game-card h3:focus{outline:none}
.game-card-summary{font-size:13px;line-height:1.8;color:#ced9c9;margin-bottom:15px}
.game-card-points{color:#b8cabb;font-size:12px;line-height:1.8;padding-left:17px;margin:0 0 20px}
.game-card-points li+li{margin-top:7px}
.game-card-points li::marker{color:#cfbc8c}
.game-card-tags{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:0 0 22px;padding:0}
.game-card-tags li{border:1px solid #516c62;color:#c6d5be;font:9px var(--mono);padding:5px 8px}
.game-card-close{position:absolute;right:13px;top:11px;border:0;background:transparent;color:#d3dfc7;font:25px var(--sans);width:32px;height:32px}
.game-card-actions{display:flex;align-items:center;gap:15px;flex-wrap:wrap}
.game-card-actions .button{background:#c6dcb4;border-color:#c6dcb4;color:#1b332f;min-height:40px;padding:10px 15px;font-size:11px}
.game-continue{font:11px var(--sans);background:transparent;border:1px solid #577268;color:#c6d5c0;padding:10px 13px;min-height:40px}
.is-reading .game-canvas{filter:brightness(.48)}
.is-reading .game-arrival{opacity:0!important}
.portfolio-game :is(button,a,summary):focus-visible{outline:2px solid #f1d298;outline-offset:3px}
@media(max-width:800px),(pointer:coarse){
 .game-shell{grid-template-rows:68px 42px minmax(0,1fr)142px}
 .game-header{padding:12px 16px}
 .game-header h2{font-size:24px}
 .game-toolbar{padding:0 16px;gap:12px}
 .game-footer{display:grid;grid-template-columns:136px minmax(0,1fr);grid-template-rows:48px 1fr;gap:5px 20px;padding:12px 16px}
 .game-dpad{display:grid;grid-template-columns:44px 44px 44px;grid-template-rows:44px 44px;gap:2px;grid-column:1;grid-row:1/3;align-self:center}
 .game-dpad button{width:44px;height:44px;border:1px solid #779082;background:#2a4648;color:#dbe3cb;font:19px var(--pixel);padding:0;touch-action:none;user-select:none;-webkit-user-select:none}
 .game-dpad [data-direction="up"]{grid-column:2;grid-row:1}
 .game-dpad [data-direction="left"]{grid-column:1;grid-row:2}
 .game-dpad [data-direction="down"]{grid-column:2;grid-row:2}
 .game-dpad [data-direction="right"]{grid-column:3;grid-row:2}
 .game-dpad button.is-held{background:#bdd6ad;color:#1c3032}
 .game-interact{grid-column:2;grid-row:1;max-width:none;width:100%;font-size:10px;padding:8px;min-height:42px}
 #game-help{grid-column:2;grid-row:2;font-size:10px;line-height:1.6}
 .game-keyboard-help{display:none}
 .is-reading .game-dpad{opacity:.35;pointer-events:none}
 .game-card{bottom:12px;width:min(660px,calc(100% - 24px));max-height:calc(100% - 24px);padding:22px}
 .game-card h3{font-size:28px}
}
@media(max-width:600px){
 .game-launch{align-self:flex-end;font-size:10px;padding:10px 12px}
 .portfolio-game{width:calc(100vw - 16px);height:calc(100dvh - 16px);border-width:1px}
 .game-close{font-size:0;padding:5px 10px;min-height:36px}
 .game-close>span{font-size:25px}
 .game-eyebrow{font-size:7px}
 .game-toolbar{font-size:9px;gap:10px;padding:0 12px}
 .game-location{max-width:125px}
 .game-progress{font-size:8px}
 .game-directory summary{padding-left:0}
 .game-directory nav{width:min(270px,calc(100vw - 40px));right:-4px}
 .game-arrival{min-width:260px;padding:10px 13px}
 .game-arrival>span{font-size:16px}
 .game-footer{gap:5px 12px;padding:10px 12px}
 .game-card-summary{font-size:12px}
 .game-card-points{font-size:11px}
}
@media(min-width:801px){
 .game-keyboard-help{display:inline}
}
@media(max-height:550px){
 .portfolio-game{height:calc(100dvh - 16px)}
 .game-shell{grid-template-rows:52px 34px minmax(0,1fr)102px}
 .game-header{padding:6px 16px}
 .game-header h2{font-size:22px}
 .game-eyebrow{margin-bottom:3px}
 .game-toolbar{font-size:9px}
 .game-footer{padding:6px 16px;gap:0 16px}
 .game-keyboard-help{display:none}
 .game-arrival{top:8px;padding:7px 12px}
 .is-reading .game-stage{position:static}
 .is-reading .game-card{bottom:12px;max-height:calc(100% - 108px);z-index:5;padding:18px 22px}
 .is-reading .game-footer{visibility:hidden}
}
@media(prefers-reduced-motion:reduce){
 .portfolio-game[open]{animation:none}
 .game-arrival{display:none}
 .game-launch:hover{transform:none}
}

/* Room controls use the same compact toolbar as the outdoor map. */
.game-outside{border:1px solid #6f897d;background:#29433f;color:#dce5cc;font:9px var(--mono);padding:7px 10px;cursor:pointer;flex:none}
.game-outside:hover{background:#3a574b}
.game-outside[hidden]{display:none}
.is-interior .game-arrival{display:none}
.is-interior .game-stage{background:#101d29}
@media(max-width:600px){.is-interior .game-progress{display:none}.is-interior .game-directory{margin-left:auto}.is-interior .game-location{max-width:none;min-width:0;flex:1}.game-outside{padding:7px 8px}}