:root{--hud-page:#000;--hud-ink:#f9f7f3;--hud-panel:#27303f;--hud-accent:#ffa200;--hud-night-accent:#29adff;--hud-muted:#81818b;--hud-panel-alpha:82%;--hud-font:ui-monospace, "SF Mono", Menlo, Consolas, monospace;--hud-values:var(--hud-font);--hud-names:system-ui, -apple-system, "Hiragino Sans", "Noto Sans CJK JP", sans-serif;--hud-inset:16px;--hud-pad:8px;--hud-text:11px;--hud-title:14px;--hud-time:20px;--hud-gap:3px;--hud-corner-width:33vw;--hud-corner-top-height:33vh;--hud-corner-bottom-height:33vh;--hud-strip-width:33vw;--hud-strip-height:20vh;--hud-dial-radius:calc(var(--hud-time) * 2.4);--hud-dial-arc:9;--hud-moon-lit:#f2eee6;--hud-moon-dark:#383842}*{box-sizing:border-box}html,body{background:var(--hud-page);overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;width:100%;height:100%;margin:0;padding:0;overflow:hidden}html{touch-action:none}body{color:var(--hud-ink);font:var(--hud-text) / 1.4 var(--hud-values)}#view{touch-action:none;width:100vw;height:100vh;display:block;position:fixed;inset:0}[hidden]{display:none!important}#loading,#hud-location,#hud-dial,#status-modes,#minimap,#hud-controls,#info,#menu,#ride{pointer-events:none;-webkit-user-select:none;user-select:none;position:fixed}.panel{background:color-mix(in srgb, var(--hud-panel) var(--hud-panel-alpha), transparent);color:var(--hud-ink);padding:var(--hud-pad) calc(var(--hud-pad) * 1.25);white-space:nowrap;border-radius:0;overflow:hidden}#loading{top:var(--hud-inset);max-width:var(--hud-strip-width);max-height:var(--hud-corner-top-height);padding:calc(var(--hud-pad) * .5) var(--hud-pad);background:color-mix(in srgb, var(--hud-panel) var(--hud-panel-alpha), transparent);white-space:nowrap;text-overflow:ellipsis;left:50%;overflow:hidden;transform:translate(-50%)}#hud-location{top:var(--hud-inset);left:var(--hud-inset);max-width:var(--hud-corner-width);max-height:var(--hud-corner-top-height);gap:var(--hud-gap);font-family:var(--hud-names);display:grid}#hud-location .ja{margin-right:.5em}#hud-location .district{font-size:var(--hud-title);font-weight:700;line-height:1.1}#hud-location .catchment{color:var(--hud-muted)}#hud-location .ward{color:var(--hud-accent)}#hud-location .private{color:var(--hud-muted)}#status-modes .refused .label{text-decoration:line-through}#hud-location .street.named .private:before{content:"· "}#hud-location:not(.labelled) .district,#hud-location:not(.labelled) .catchment{display:none}#hud-dial{top:var(--hud-inset);right:var(--hud-inset);max-width:var(--hud-corner-width);max-height:var(--hud-corner-top-height);gap:var(--hud-gap);text-align:right;--dial-accent:var(--hud-accent);display:grid}#hud-dial.night{--dial-accent:var(--hud-night-accent)}#hud-dial .dome{width:calc(var(--hud-dial-radius) * 2.2);height:calc(var(--hud-dial-radius) * 1.7);justify-self:end}#hud-dial .horizon{stroke:var(--hud-muted);stroke-width:2px}#hud-dial .arc{stroke:var(--dial-accent);stroke-width:var(--hud-dial-arc);stroke-linecap:butt;opacity:.55}#hud-dial .sun{fill:var(--dial-accent);stroke:none}#hud-dial.night .sun{fill:none;stroke:var(--dial-accent);stroke-width:3px}#hud-dial .moon-dark{fill:var(--hud-moon-dark)}#hud-dial .moon-lit{fill:var(--hud-moon-lit)}#hud-dial div.moon{color:var(--hud-muted)}#hud-dial .east,#hud-dial .west{fill:var(--hud-muted);font-size:16px;font-family:var(--hud-values);text-anchor:middle}#hud-dial .time{font-size:var(--hud-time);letter-spacing:.04em;font-weight:600;line-height:1.1}#hud-dial .date{color:var(--hud-muted)}#hud-dial .event,#hud-dial .daylight,#hud-dial .altitude{color:var(--dial-accent)}#hud-dial .altitude{color:var(--hud-muted)}#status-modes{bottom:var(--hud-inset);right:var(--hud-inset);max-width:var(--hud-corner-width);max-height:var(--hud-corner-bottom-height);gap:var(--hud-gap);display:grid}#status-modes .mode{color:var(--hud-muted);grid-template-columns:auto 1fr;gap:1.5em;display:grid}#status-modes .mode .label{letter-spacing:.06em}#status-modes .mode .span{text-align:right}#status-modes .mode.active{color:var(--hud-accent)}#minimap{bottom:var(--hud-inset);left:var(--hud-inset);max-width:var(--hud-corner-width);max-height:var(--hud-corner-bottom-height);display:block}#hud-controls{bottom:var(--hud-inset);max-width:var(--hud-strip-width);max-height:var(--hud-strip-height);gap:calc(var(--hud-pad) * 1.5);color:var(--hud-muted);white-space:nowrap;justify-content:center;align-items:center;display:flex;left:50%;overflow:hidden;transform:translate(-50%)}#hud-controls .item{gap:calc(var(--hud-gap) * 1.5);align-items:center;display:flex}#hud-controls .item .what{font-family:var(--hud-names)}.key{text-align:center;min-width:1.6em;color:var(--hud-ink);border:1px solid;border-radius:0;padding:0 .35em;line-height:1.3;display:inline-block}#info{justify-content:center;align-items:center;display:flex;inset:0}#info .panel{white-space:normal;pointer-events:auto;touch-action:pan-y;max-width:60vw;max-height:70vh;overflow:auto}#info .notice p{margin:0 0 1em}#info .notice p:last-child{margin-bottom:0}#info .seed{margin-top:1.2em}#info .seed .value{font-family:var(--hud-values)}#info .seed a{color:inherit}#info .close{color:var(--hud-muted);margin-top:1.2em}#menu{width:var(--hud-strip-width);max-height:calc(100vh - var(--hud-inset) * 4);white-space:normal;gap:var(--hud-pad);z-index:2;display:grid;top:50%;left:50%;overflow:hidden;transform:translate(-50%,-50%)}#menu .line,#ride .to{font-family:var(--hud-names);font-size:var(--hud-title);font-weight:700}#menu .line .ja,#ride .to .ja{margin-right:.5em}#ride{background:var(--hud-panel);color:var(--hud-ink);align-content:center;justify-items:center;gap:var(--hud-pad);padding:calc(var(--hud-inset) * 2);z-index:1;display:grid;inset:0}#ride .wait{color:var(--hud-accent)}#ride .stops{width:var(--hud-strip-width);position:relative}#hud-dial{z-index:3}.stops{gap:var(--hud-gap);display:grid}.stop{gap:var(--hud-pad);color:var(--hud-ink);grid-template-columns:auto 1fr auto;align-items:baseline;display:grid}.stop .dot:before{content:"●";color:var(--hud-muted)}.stop .names{font-family:var(--hud-names);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.stop .names .ja{margin-right:.5em}.stop .values{text-align:right;color:var(--hud-muted);white-space:nowrap}.stop.passed{color:var(--hud-muted)}.stop.here .dot:before,.stop.here .values{color:var(--hud-night-accent)}.stop.selected,.stop.selected .dot:before,.stop.selected .values{color:var(--hud-accent)}.stop.train .dot:before{content:"◆";color:var(--hud-accent)}
