html[data-gb-view=device],html[data-gb-view=device] body,html[data-gb-view=transition],html[data-gb-view=transition] body{height:100%;overflow:hidden}html[data-gb-view=device] body,html[data-gb-view=transition] body{background:var(--bg-0);color:var(--bone)}.gb-stage{z-index:1;background:var(--bg-0);touch-action:manipulation;outline:none;position:fixed;inset:0}.gb-stage:focus-visible{outline:none}.gb-stage:after{content:"";left:var(--ring-x,4px);top:var(--ring-y,4px);width:var(--ring-w,calc(100% - 8px));height:var(--ring-h,calc(100% - 8px));z-index:4;border:2px solid var(--accent);pointer-events:none;border-radius:0;display:none;position:absolute}html.kbd-nav:not(.stage-driving) .gb-stage:focus-visible:after,html.has-keyboard:not(.focus-policy) .gb-stage:focus-visible:after{display:block}.gb-stage canvas{width:100%;height:100%;display:block}.gb-frame{z-index:2;transform-origin:0 0;background:var(--page);width:100%;height:100%;color:var(--text);opacity:0;position:fixed;top:0;left:0;overflow:hidden}.gb-frame[hidden]{display:none}.gb-page{transform-origin:0 0;width:100%;position:absolute;top:0;left:0}.gb-frame.is-docked{opacity:1;z-index:2;height:auto;min-height:100svh;position:relative;overflow:visible;transform:none}.gb-frame.is-docked .gb-page{position:static;transform:none}html[data-gb-view=device] .back,html[data-gb-view=device] .back-nav{display:none}html[data-gb-view=transition] .back{pointer-events:none;opacity:0}html:has(article.cs.bp:not(.bp-index)) .back-nav{display:none}.back{z-index:10}.gb-frame:not(.is-docked)>.gb-docked-footer{display:none}html[data-gb-view=case] body>:is(.case-footer,.ab-footer){z-index:3;position:relative}html[data-gb-view=device] .case-footer,html[data-gb-view=transition] .case-footer,html[data-gb-view=device] .ab-footer,html[data-gb-view=transition] .ab-footer,html[data-gb-view=device] .skip-link,html[data-gb-view=transition] .skip-link{display:none}html[data-gb-view=case] body{background:var(--page);color:var(--text)}.gb-bands{z-index:60;pointer-events:none;position:fixed;inset:0}.gb-band{visibility:hidden;background-image:repeating-linear-gradient(to bottom, #000 0 var(--band), transparent var(--band) calc(2 * var(--band)));position:absolute;inset:0}.gb-band--odd{background-position:0 var(--band)}html:is([data-gb-state=encounter],[data-gb-state=sentOut],[data-gb-state=revealing]).has-keyboard .keyhint{display:var(--kh-display,flex)}@media (width>=1025px) and (hover:hover){html:is([data-gb-state=encounter],[data-gb-state=sentOut],[data-gb-state=revealing]) .keyhint{display:var(--kh-display,flex)}}.gb-twins{pointer-events:none;position:absolute;inset:0}.gb-twin{color:#0000;pointer-events:auto;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;cursor:pointer;background:0 0;border:0;border-radius:0;margin:0;padding:0;position:absolute;top:0;left:0}.gb-twin[data-control=up],.gb-twin[data-control=down],.gb-twin[data-control=left],.gb-twin[data-control=right]{clip-path:var(--gb-wedge,none);border-radius:0}.gb-twin:focus{outline:none}html.kbd-nav .gb-twin:focus-visible{outline:2px solid var(--bone,#e8e6dc);outline-offset:2px;box-shadow:inset 0 0 0 2px var(--bg-0,#0f1110)}html.kbd-nav .gb-twin[data-control]:focus-visible{clip-path:none}.gb-twin:disabled{cursor:default;pointer-events:none}.gb-cbar{pointer-events:none;z-index:2;position:absolute;inset:0}.gb-cbar[hidden]{display:none}.gb-cbar__side{place-items:center;display:grid;position:absolute;top:0;bottom:0}.gb-cbar__side--l{width:var(--gb-gutter-l,160px);padding-left:env(safe-area-inset-left);left:0}.gb-cbar__side--r{width:var(--gb-gutter-r,160px);padding-right:env(safe-area-inset-right);right:0}.gb-cbar__cluster{pointer-events:auto;backdrop-filter:blur(8px);background:#0f111080;border:1px solid #e8e6dc24;border-radius:0;gap:4px;padding:8px;display:grid}.gb-cbar__cluster--pad{grid-template-rows:repeat(3,48px);grid-template-columns:repeat(3,48px);grid-template-areas:".up.""left.right"".down."}.gb-cbar__cluster--ab{grid-template:".a"48px"b."48px"start start"48px"select select"48px/48px 48px;column-gap:12px}.gb-cbar__btn{min-width:48px;min-height:48px;color:var(--bone,#e8e6dc);font:10px/1 var(--font-pixel,monospace);touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;background:#e8e6dc1a;border:1px solid #e8e6dc52;border-radius:0;margin:0;padding:0}.gb-cbar__btn:active{background:#e8e6dc47}.gb-cbar__btn--up{grid-area:up}.gb-cbar__btn--down{grid-area:down}.gb-cbar__btn--left{grid-area:left}.gb-cbar__btn--right{grid-area:right}.gb-cbar__btn--a{grid-area:a}.gb-cbar__btn--b{grid-area:b}.gb-cbar__btn--start,.gb-cbar__btn--select{letter-spacing:.05em;border-radius:0;font-size:8px}.gb-cbar__btn--start{grid-area:start}.gb-cbar__btn--select{grid-area:select}

.fastlane{position:fixed;left:var(--edge-l,var(--gutter,16px));bottom:var(--edge-b,var(--gutter,16px));z-index:6;color:var(--bone-dim,#9a9a90);font-family:var(--font-display,Handjet,system-ui,sans-serif);font-size:16px;line-height:1.2;text-decoration:none;background:#0f1110e6;padding:8px 10px}
.fastlane:hover,.fastlane:focus-visible{color:var(--bone,#e8e6dc);text-decoration:underline}
/* ui-fix shell campaign 2026-11-08 (S-M4, S-M7, S-M8, S-m7). Appended overrides.
   BaseLayout.CpEGNNaJ.css loads after this file, so selectors here are written
   with higher specificity than the BaseLayout rules they adjust. */
/* S-M4: the gate instruction must be visible for the whole gate state, not only
   after the device turn finishes and the bar is placed next to the power switch. */
html.is-gate body .gate.is-pending{opacity:1;transition:none}
/* S-m7: loader line gets an opaque dark pill and bright text, readable over the road band. */
html body .preloader{background:#0f1110}
html body .preloader .preloader__line{color:var(--bone,#e8e6dc)}
/* S-M8: the keyboard-hint strip is meaningless on touch devices; hide it there,
   keep it for fine-pointer (real keyboard) devices. */
@media (pointer:coarse){html body .keyhint{display:none!important}}
/* S-M7: on portrait phones stack the header in one column so the roles line and
   the visitor line no longer share a row or overlap. */
@media (width<=599.98px) and (orientation:portrait){
header.meta{grid-template-columns:1fr;row-gap:2px}
header.meta .meta__visitor{grid-area:auto;justify-self:start}
header.meta .meta__visitor .meta__line{justify-self:start;margin-left:-6px;margin-right:0}
}

/* identity: shift clock (night arc 19:00 -> 06:00 sign-out) */
.shiftclock{position:fixed;top:10px;left:50%;transform:translateX(-50%);z-index:7;display:flex;gap:10px;align-items:baseline;background:#0f1110e6;color:var(--bone,#e8e4d8);font-family:var(--font-display,Handjet,system-ui,sans-serif);font-size:15px;line-height:1.2;padding:6px 12px;border:1px solid #3a2a1a;pointer-events:none;white-space:nowrap}
.shiftclock__label{color:#e8b43c;letter-spacing:.08em}
.shiftclock__time{font-weight:700}
.shiftclock__stamps{color:#9a9a90;font-size:13px}
.shiftclock.is-dawn{background:#e8b43c;color:#171310;border-color:#e8b43c}
.shiftclock.is-dawn .shiftclock__label{color:#7a0c1d}
.shiftclock.is-dawn .shiftclock__stamps{color:#4a3a20}
@media (max-width:600px){.shiftclock{top:118px;font-size:13px;padding:5px 9px;gap:7px}.shiftclock__stamps{display:none}}