:root{--purple: #8e3aa3;--purple-deep: #5c2066;--green: #2fae5d;--panel: rgba(12, 14, 22, .72);--text: #f0ecf4;--muted: #a99fb3}*{box-sizing:border-box}html,body,#root{margin:0;padding:0;width:100%;height:100%;overflow:hidden;background:#0b0e14;font-family:ui-sans-serif,system-ui,Segoe UI,Roboto,Noto Sans,Noto Sans Kannada,sans-serif}.app{position:relative;width:100%;height:100%}.app canvas{display:block}.hud{position:fixed;top:58px;left:12px;width:252px;padding:14px 16px;border-radius:14px;background:var(--panel);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(142,58,163,.35);color:var(--text);user-select:none;z-index:10;max-height:calc(100vh - 72px);max-height:calc(100dvh - 72px);display:flex;flex-direction:column}.hud .scroll{min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;margin:-14px -16px;padding:14px 16px;border-radius:inherit}.hud .brand{padding-right:22px}button.hud.pill{display:flex;flex-direction:row;align-items:center;gap:9px;width:auto;max-height:none;overflow:visible;padding:7px 13px 7px 9px;border-radius:999px;border:1px solid rgba(142,58,163,.45);font-family:inherit;cursor:pointer;transition:background .15s,border-color .15s;touch-action:manipulation;-webkit-tap-highlight-color:rgba(0,0,0,0)}button.hud.pill:hover{background:#181220d9;border-color:#8e3aa3cc}button.hud.pill .logo{width:24px;height:24px;flex:none}button.hud.pill .clock{font-size:15px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:.03em}button.hud.pill .fps{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}button.hud.pill .fps b{color:var(--green)}button.hud.pill .chev{font-size:11px;color:var(--muted)}.hud .minbtn{position:absolute;top:10px;right:10px;width:24px;height:24px;flex:none;padding:0;font-size:16px;line-height:1;border-radius:7px;color:var(--muted);z-index:2;touch-action:manipulation;-webkit-tap-highlight-color:rgba(0,0,0,0)}.hud .minbtn:before{content:"";position:absolute;inset:-8px}.hud .minbtn:hover{color:var(--text)}@media (pointer: coarse){.hud .minbtn{width:32px;height:32px;top:7px;right:7px;font-size:20px}.hud .brand{padding-right:30px}}.hud .brand{display:flex;align-items:center;gap:9px;margin-bottom:2px}.hud .brand .logo{width:34px;height:34px;flex:none;filter:drop-shadow(0 0 6px rgba(255,255,255,.18))}.hud .brand .title{font-weight:700;font-size:15px;letter-spacing:.02em}.hud .sub{color:var(--muted);font-size:11px;margin-bottom:10px}.hud .clockrow{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:8px}.hud .clock{font-size:30px;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:.03em}.hud .fps{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}.hud .fps b{color:var(--green);font-size:14px}.hud label{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin:10px 0 4px}.hud input[type=range]{width:100%;accent-color:var(--purple)}.hud .row{display:flex;gap:5px;flex-wrap:wrap}.hud button{flex:1;padding:5px 7px;font-size:11px;border-radius:8px;border:1px solid rgba(255,255,255,.14);background:#ffffff0f;color:var(--text);cursor:pointer;transition:background .15s,border-color .15s;white-space:nowrap}.hud button:hover{background:#8e3aa34d}.hud button.on{background:var(--purple);border-color:var(--purple);font-weight:600}.hud button.greenline:hover{background:#2fae5d4d}.hud button.on.greenline{background:var(--green);border-color:var(--green)}.hud button.yellowline:hover{background:#f2c01e4d}.hud button.on.yellowline{background:#f2c01e;border-color:#f2c01e;color:#1c1a22}.hud .train{display:flex;flex-direction:column;gap:4px;font-size:12px;padding:6px 9px;margin-top:5px;border-radius:8px;background:#ffffff0d;border-left:3px solid var(--purple)}.hud .train.green{border-left-color:var(--green)}.hud .train.yellow{border-left-color:#f2c01e}.hud .train .trow{display:flex;justify-content:space-between;align-items:center;gap:6px}.hud .train .trow .name{font-weight:600;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hud .train .statrow{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--muted)}.hud .train .statrow .mark{flex:none;font-size:8px}.hud .train .statrow .stname{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant-numeric:tabular-nums}.hud .train .badge{flex:none;display:inline-flex;align-items:center;gap:5px;padding:2px 7px;border-radius:999px;background:#ffffff12;font-size:10.5px;font-variant-numeric:tabular-nums;white-space:nowrap}.hud .train .badge.doors{color:#ffc04d;background:#ffc04d21}.hud .train .doorico{position:relative;width:14px;height:9px;border:1px solid currentColor;border-radius:2px;overflow:hidden;opacity:.9}.hud .train .doorico i{position:absolute;top:0;bottom:0;width:7px;background:currentColor;transition:transform .3s linear}.hud .train .doorico i:first-child{left:0}.hud .train .doorico i:last-child{right:0}.hud .train .cams{display:flex;gap:3px;flex:none}.hud .train .cams button{flex:none;padding:4px 7px;font-size:10px;border-radius:6px}.hud .freecam{width:100%;margin-top:7px;padding:7px;font-size:11.5px;border-radius:8px;border:1px solid rgba(255,255,255,.14);background:#ffffff0f;color:var(--text);cursor:pointer;transition:background .15s,border-color .15s}.hud .freecam:hover{background:#ffffff24}.hud .freecam.on{background:#ffffff2e;border-color:#ffffff80;font-weight:600}.hint{position:fixed;right:14px;bottom:12px;font-size:11px;color:#f0ecf48c;background:#0c0e1680;padding:6px 11px;border-radius:9px;backdrop-filter:blur(6px);z-index:10;pointer-events:none}@media (max-width: 640px){.hud{width:min(232px,calc(100vw - 20px));top:52px;left:10px;max-height:calc(100vh - 64px);max-height:calc(100dvh - 64px)}.hint{display:none}}.walkkeys{position:fixed;right:14px;bottom:46px;display:flex;flex-direction:column;align-items:center;gap:5px;padding:12px 18px 9px;border-radius:14px;background:#0c0e169e;border:1px solid rgba(142,58,163,.4);backdrop-filter:blur(8px);z-index:10;pointer-events:none}.walkkeys .krow{display:flex;gap:6px}.walkkeys kbd{min-width:40px;height:40px;display:flex;align-items:center;justify-content:center;font:700 16px ui-sans-serif,system-ui,sans-serif;color:var(--text);background:#ffffff14;border:1.5px solid rgba(255,255,255,.28);border-bottom-width:3.5px;border-radius:8px;transition:background .08s,transform .08s,border-color .08s}.walkkeys kbd.on{background:var(--purple);border-color:#c77ad8;transform:translateY(1.5px);box-shadow:0 0 14px #8e3aa3cc}.walkkeys .klabel{margin-top:2px;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.joy{position:fixed;right:18px;bottom:44px;display:flex;flex-direction:row-reverse;align-items:flex-end;gap:12px;z-index:11;user-select:none;-webkit-user-select:none}.joy-pad{position:relative;width:118px;height:118px;border-radius:50%;background:#0c0e168c;border:1.5px solid rgba(142,58,163,.5);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);touch-action:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}.joy-arrow{position:absolute;font-size:10px;color:#f0ecf466;pointer-events:none}.joy-arrow.n{top:7px;left:50%;transform:translate(-50%)}.joy-arrow.s{bottom:7px;left:50%;transform:translate(-50%)}.joy-arrow.w{left:8px;top:50%;transform:translateY(-50%)}.joy-arrow.e{right:8px;top:50%;transform:translateY(-50%)}.joy-knob{position:absolute;left:50%;top:50%;width:52px;height:52px;margin:-26px 0 0 -26px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#c478d6f2,#8e3aa3eb 60%,#5c2066f2);border:1.5px solid rgba(255,255,255,.35);box-shadow:0 3px 12px #00000073;pointer-events:none;will-change:transform}.joy-updown{display:flex;flex-direction:column;gap:9px}.joy-updown button{width:46px;height:46px;border-radius:50%;font-size:15px;color:var(--text);background:#0c0e168c;border:1.5px solid rgba(142,58,163,.5);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);touch-action:none;-webkit-tap-highlight-color:rgba(0,0,0,0);cursor:pointer}.joy-updown button:active{background:var(--purple)}@media (pointer: coarse){.walkkeys{display:none}}