/* Scoped to the main device: header, logo, sky, activation and Whisp are untouched. */
#shell .card{border-color:#65818a99;border-top-color:#829da5;gap:16px;transition:border-color .18s ease,box-shadow .18s ease}
#shell .card>.glyph{flex:0 0 35px;line-height:1}
#shell .card>span:last-child{min-width:0}
#shell .card .label{font-family:Interface,Arial,sans-serif;font-size:12px;line-height:1.3;letter-spacing:1px;color:#aacbd3}
#shell .card .value{color:#efc984;font-size:29px;line-height:1.15}
#shell .card .sub{color:#d0dde2;font-size:14px;line-height:1.4}
#shell .card:active{border-color:#dfba72;box-shadow:inset 0 0 0 1px #dfba7244,inset 0 5px 15px #0006,0 0 10px #dfba7220}
#shell .card.tutorial-focus{outline-color:#dfba72;box-shadow:inset 0 0 0 1px #dfba7222,0 0 12px #dfba7220}
#shell .readout p{font-family:Interface,Arial,sans-serif;font-size:18px;line-height:1.45;color:#dce9ec}
#shell .readout .label{font-family:Interface,Arial,sans-serif;font-size:11px;letter-spacing:1.2px}
/* Out-of-flow commands cannot change the reserved footer or scanner geometry. */
#shell>footer{height:70px;min-height:70px;max-height:70px;position:relative}
#shell .choices{position:absolute;inset:0;width:100%;height:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:minmax(0,1fr);gap:16px;padding-top:10px}
#shell .choices button{width:100%;min-width:0;max-width:none;min-height:0;animation:ward-command-appear .45s ease-out both}
@keyframes ward-command-appear{from{opacity:0}to{opacity:1}}
@media(max-width:900px){
 #shell .card{padding:9px 10px;gap:8px}
 #shell .card>.glyph{flex-basis:22px;width:22px;font-size:21px}
 #shell .card .label{font-size:11px;letter-spacing:.55px;margin-bottom:4px}
 #shell .card .value{font-size:24px}
 #shell .card.location{min-height:41px}
 #shell .card.location .label{margin-bottom:0;margin-right:12px}
 #shell .card.location .value{font-size:22px}
 #shell .records{align-items:stretch}
 #shell .records .card{min-height:64px}
 #shell .card .sub{font-size:12px;line-height:1.4}
 #shell .scanner{font-size:10px;letter-spacing:1.4px}
 #shell .scanner b{font-size:10px;letter-spacing:1px}
 #shell .readout p{font-size:15px;line-height:1.4}
 #shell .readout .label{font-size:10px;letter-spacing:1px}
 #shell>footer{height:96px;min-height:96px;max-height:96px}
 #shell .choices{grid-template-columns:minmax(0,1fr);grid-template-rows:repeat(2,minmax(0,1fr));gap:6px;padding-top:4px}
 #shell .choices button{font-size:19px;line-height:1.1;padding:6px 8px;letter-spacing:1px}
}
@media(max-width:900px) and (max-height:650px){
 #shell .card{padding:6px 8px}
 #shell .records .card{min-height:58px}
 #shell>footer{height:80px;min-height:80px;max-height:80px}
 #shell .choices button{font-size:18px}
}
@media(prefers-reduced-motion:reduce){#shell .choices button{animation:none}#shell .card{transition:none}}
/* Decorative standby face occupies only the already-reserved command slot. */
#shell .command-standby{position:absolute;inset:10px 0 0;display:flex;align-items:center;justify-content:center;gap:14px;border:1px solid #65818a33;border-radius:5px;background:linear-gradient(135deg,#10212b88,#050e16bb);box-shadow:inset 0 2px 9px #0006;color:#98acb5;pointer-events:none;opacity:1;transition:opacity .3s ease;z-index:0}
#shell .command-standby:before{content:'';position:absolute;inset:5px;background:linear-gradient(#b99b5e77,#b99b5e77) top left/12px 1px no-repeat,linear-gradient(#b99b5e77,#b99b5e77) top left/1px 7px no-repeat,linear-gradient(#b99b5e77,#b99b5e77) bottom right/12px 1px no-repeat,linear-gradient(#b99b5e77,#b99b5e77) bottom right/1px 7px no-repeat}
#shell .standby-label{display:flex;align-items:center;gap:9px;font:400 10px/1.4 Interface,Arial,sans-serif;letter-spacing:2px}
#shell .standby-label:before{content:'';width:4px;height:4px;border-radius:50%;background:#b89a60;box-shadow:0 0 6px #dfba7222}
#shell .standby-line{width:clamp(20px,9vw,90px);height:1px;background:linear-gradient(90deg,transparent,#b99b5e66)}
#shell .standby-line:last-child{transform:rotate(180deg)}
#shell #ward-guide,#shell .choices{z-index:1}
#shell .choices:empty{pointer-events:none}
#shell>footer:has(#ward-guide:not([hidden])) .command-standby,#shell>footer:has(.choices>button) .command-standby{opacity:0}
@media(max-width:900px){#shell .command-standby{top:4px}}
@media(prefers-reduced-motion:reduce){#shell .command-standby{transition:none}}