/* Readable device labels and controls, including narrow desktop side panels. */
.workspace{grid-template-columns:minmax(0,1fr) 360px}
.compact-controls{padding:18px}
.activity-svg{stroke-width:2.1;stroke-linecap:round;stroke-linejoin:round}
.compact-controls .activity-choices .activity-svg{width:34px;height:34px}
.activity-emblem svg{width:38px;height:38px;stroke-width:2}
.compact-controls button{font-weight:600}
.compact-controls .main-actions button,.compact-controls .compact-secondary,.compact-controls .training-time-actions button{
 border-radius:9px;border-color:#8395a4;box-shadow:inset 0 1px 0 #ffffff20,0 3px 0 #0e1317;
}
.compact-controls .main-actions button{min-height:64px}
.compact-controls .main-actions .activity-svg{width:27px;height:27px;flex-basis:27px}
.compact-controls .drive-primary{background:linear-gradient(#e9cfa4,#ccaa78);border-color:#f3d6a6;color:#171d21}
.compact-controls .activity-choices{gap:8px}
.compact-controls .activity-choices button{min-height:94px;padding:12px 3px;gap:10px;background:linear-gradient(#394650,#28323b);border:1px solid #7f919e;color:#f2f5f7;border-radius:9px;box-shadow:inset 0 1px 0 #ffffff16,0 3px 0 #0e1317;font-size:14px}
.compact-controls .activity-choices button[aria-pressed="true"]{border:2px solid #f3d099;background:#56452f;color:#fff1d8}
.compact-controls .activity-choices button[data-activity="Ruhe"][aria-pressed="true"]{border-color:#acd5ae;background:#294334;color:#f0fff0}
.compact-controls .activity-choices button[aria-pressed="true"]:after{font-size:16px;top:5px;right:6px}
.compact-controls .keypad{gap:9px}
.compact-controls .keypad button{min-height:76px;gap:7px;border:1px solid #a0aeb7;border-radius:9px;background:linear-gradient(#56636d,#2c3842);color:#fff;box-shadow:inset 0 2px 0 #ffffff35,0 4px 0 #0a0e11;padding:10px 1px}
.compact-controls .keypad .activity-svg{width:29px;height:29px;flex:none;stroke-width:2.8}
.compact-controls .keypad #key-ok{background:linear-gradient(#dcc092,#b49363);border-color:#f3d8ac;color:#171d21}
.compact-controls .keypad #key-ok>span{font-size:24px;font-weight:750;line-height:29px}
.compact-controls .keypad small{font-size:12px;font-weight:600}
.compact-controls .keypad button:hover{filter:brightness(1.15)}
.compact-controls .lcd{padding:6px 4px;border:3px solid #0e1114;background:#211305;border-radius:6px;box-shadow:inset 0 0 0 1px #665337}
#lcd-canvas,#large-lcd-canvas{image-rendering:auto}
.symbol-legend canvas{image-rendering:pixelated}
.inline-readings{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:12px 0}
.inline-readings>div{display:flex;align-items:center;gap:9px;min-width:0;padding:12px 9px;border:1px solid #53636f;border-radius:7px;background:#171e24}
.inline-readings .activity-svg{width:30px;height:30px;flex:0 0 30px;color:#ffdcaa}
.inline-readings span{min-width:0}
.inline-readings strong{display:block;font-size:12px;line-height:1.35;color:#e4ebf0;overflow-wrap:anywhere}
.inline-readings b{display:block;margin-top:4px;font:600 23px/1.2 Consolas,monospace;color:#fff0d9;font-variant-numeric:tabular-nums}
.compact-controls .lcd-magnify{margin-top:6px;background:#383124;color:#ffdfaf;border-color:#a78c62}
@media(min-width:1500px){.workspace{grid-template-columns:minmax(0,1fr) 400px}.inline-readings strong{font-size:14px}.inline-readings .activity-svg{width:34px;height:34px;flex-basis:34px}}
@media(max-width:1100px){.workspace{grid-template-columns:minmax(0,1fr) 340px}.compact-controls{padding:16px}}
@media(max-width:950px){.workspace{display:flex;flex-direction:column}.scene-column{position:relative;top:auto;width:100%}.scene-column>.viewport{height:clamp(450px,65vw,620px);min-height:0}.viewport:has(#scene[data-view="device"]) .scene-description{bottom:54px;left:20px;right:20px}.compact-controls{width:100%}.compact-controls .activity-choices{gap:12px}.compact-controls .activity-choices button{font-size:16px}.inline-readings{gap:12px}.inline-readings strong{font-size:15px}.inline-readings .activity-svg{width:38px;height:38px;flex-basis:38px}}
@media(max-width:420px){.scene-column>.viewport{height:350px}.inline-readings{gap:7px}.inline-readings>div{padding:10px 7px;gap:7px}.inline-readings .activity-svg{width:25px;height:25px;flex-basis:25px}.inline-readings strong{font-size:12px}.inline-readings b{font-size:21px}.compact-controls .activity-choices button{font-size:13px}.compact-controls .keypad{gap:6px}.compact-controls .keypad small{font-size:11px}body[data-large-text="true"] .inline-readings{grid-template-columns:1fr}body[data-large-text="true"] .inline-readings strong{font-size:16px}}
@media(forced-colors:active){.inline-readings>div,.compact-controls .keypad button{border:2px solid CanvasText}.inline-readings .activity-svg{color:CanvasText}}
/* Clean picture; all training information stays with the controls. */
:root{--hud-height:0px}
html{scroll-padding-top:18px}
.scene-column{top:16px}
.scene-column>.viewport{height:clamp(540px,calc(100vh - 200px),780px)}
.viewport:after{display:none}
.viewport .focus-button{left:auto;right:20px;bottom:20px;min-height:44px;padding:12px 16px;font-size:14px}
.sidebar-column{min-width:0;display:flex;flex-direction:column;gap:12px;width:100%}
.sidebar-column .training-hud{position:relative;top:auto;z-index:auto;margin:0;padding:16px;gap:12px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);box-shadow:none}
.sidebar-column .activity-summary{grid-column:1/-1;grid-row:1;gap:10px;min-width:0}
.sidebar-column .activity-emblem{width:44px;height:44px;border-radius:8px}
.sidebar-column .activity-emblem svg{width:30px;height:30px}
.sidebar-column .training-hud .eyebrow{font-size:10px;letter-spacing:1px}
.sidebar-column .training-hud h2{font-size:16px;line-height:1.3;margin:3px 0}
.sidebar-column .training-hud p{font-size:12px;line-height:1.4;color:#c5cfd7;max-width:none}
.sidebar-column .timer-metric{grid-row:2;grid-column:1;border:0;padding:0;min-width:0;align-self:start}
.sidebar-column .goal-metric{grid-column:2}
.sidebar-column .timer-metric>span{font-size:11px;line-height:1.4}
.sidebar-column .timer-metric>strong{font-size:22px;margin:4px 0;letter-spacing:0}
.sidebar-column .timer-metric small{font-size:11px;line-height:1.4}
.sidebar-column .sim-clock{grid-row:3;grid-column:1/-1;display:flex;flex-direction:row;flex-wrap:wrap;align-items:baseline;justify-content:flex-start;text-align:left;gap:4px 8px;border-top:1px solid #485159;padding-top:10px}
.sidebar-column .sim-clock>span{display:block;font-size:10px;letter-spacing:.6px}
.sidebar-column .sim-clock strong{font-size:18px}
.sidebar-column .sim-clock small{display:block;font-size:11px}
.sidebar-column .activity-toast{position:relative;inset:auto;margin:0;padding:14px 42px 14px 12px;gap:9px;min-width:0;box-shadow:none}
.sidebar-column .activity-toast>svg{flex:0 0 24px;width:24px;height:24px}
.sidebar-column .activity-toast>div{min-width:0;overflow-wrap:anywhere}
.sidebar-column .activity-toast strong{font-size:15px}
.sidebar-column .activity-toast p{font-size:12px;line-height:1.5}
.sidebar-column .activity-toast>button{top:2px;right:2px;width:40px;height:44px}
.compact-controls .first-use-row{display:flex;align-items:center;gap:10px;min-height:56px;padding:10px;margin:0 0 16px;background:#2c343a;border:1px solid #697782;border-radius:7px;cursor:pointer}
.compact-controls .first-use-row:has(input:checked){background:#3d362a;border-color:#d5b583}
.first-use-row span{min-width:0}
.first-use-row strong{display:block;font-size:14px;line-height:1.35;color:#f0e7d8}
.first-use-row small{display:block;font-size:11px;line-height:1.4;color:#c4cdd3;margin-top:3px}
.first-use-row input:focus-visible{outline:3px solid #fff;outline-offset:3px}
.compact-controls .view-switch{display:flex;padding:3px;border:1px solid #667680;border-radius:6px}
.compact-controls .view-switch button{flex:1;font-size:14px}
body[data-large-text="true"] .sidebar-column .training-hud h2{font-size:18px}
body[data-large-text="true"] .first-use-row strong{font-size:16px}
body[data-large-text="true"] .first-use-row small{font-size:13px}
@media(max-width:950px){.scene-column{position:relative;top:auto}.scene-column>.viewport{height:clamp(400px,65vw,620px);min-height:0}.sidebar-column{width:100%}}
@media(max-width:420px){.scene-column>.viewport{height:350px}.viewport .focus-button{right:12px;bottom:12px;font-size:13px}.sidebar-column .training-hud{padding:14px}.sidebar-column .timer-metric>strong{font-size:21px}}
@media(forced-colors:active){.compact-controls .first-use-row{border:1px solid CanvasText}}
.compact-controls .first-use-row{margin-bottom:0;border-radius:7px 7px 0 0}
.privacy-help{margin:0 0 16px;border:1px solid #697782;border-top:0;border-radius:0 0 7px 7px;background:#252d33}
.privacy-help>summary{padding:10px;font-size:14px!important;cursor:pointer;color:#efcfa3}
.privacy-help>div{padding:0 12px 12px;font-size:14px;line-height:1.5;color:#d4dce2}
.privacy-help p{margin:4px 0 12px}.privacy-help ol{padding-left:20px;margin:10px 0 14px}.privacy-help li{margin:8px 0}
.privacy-help #privacy-saved{padding:10px;border:1px solid #677682;border-radius:5px;color:#fff1da;font-weight:600}
.privacy-help #privacy-show-keys{width:100%;padding:10px;border:1px solid #a38b6b;background:#403729;color:#ffe4bc;border-radius:5px;font-size:14px}