:root{color-scheme:dark;--yellow:#eeee43;--gold:#b9b847;--amber:#f2bc42;--dim:#b6b7a4;--menu-width:640px;--menu-height:400px;--ui-scale:1;font-family:'Courier New',monospace;font-weight:700;background:#070808;color:var(--yellow)}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}body{user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}button,input,select,textarea{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #fafaca;outline-offset:2px}button:disabled{opacity:.4;cursor:default}button,input,select{border-radius:0}#shell{width:100vw;height:100vh;height:100dvh;display:flex;align-items:center;justify-content:center;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}#arena{position:relative;isolation:isolate;width:min(100%,160dvh);height:min(100%,62.5vw);max-width:1600px;max-height:1000px;background:#676689;overflow:hidden;touch-action:none}#scene-host,.ski-scene,#hud,#scanlines{position:absolute;inset:0;width:100%;height:100%;display:block}#scene-host{z-index:0;transition:filter .18s}#arena.menu-open #scene-host{filter:grayscale(1) brightness(.39) contrast(.87)}.ski-scene,#hud{image-rendering:pixelated;image-rendering:crisp-edges}#hud{z-index:2;pointer-events:none}#scanlines{z-index:3;pointer-events:none;background:repeating-linear-gradient(to bottom,transparent 0px,transparent 3px,#0002 3px,#0002 4px);display:none}#arena.scanline-on #scanlines{display:block}#arena.menu-open #hud{opacity:0}#menu-layer{z-index:5;position:absolute;left:50%;top:50%;width:var(--menu-width);height:var(--menu-height);transform:translate(-50%,-50%) scale(var(--ui-scale));transform-origin:center;border:1px solid #b4b749;box-shadow:inset 0 0 0 1px #26292a;background:linear-gradient(115deg,#31363552,#20242b15);display:flex;flex-direction:column;padding:7px 12px 0}#menu-layer[hidden],#game-toolbar[hidden],#touch-controls[hidden],#replay-controls[hidden],[hidden]{display:none!important}#menu-header{height:61px;min-height:61px;border-bottom:1px solid var(--gold);display:flex;align-items:flex-start;justify-content:space-between;padding-bottom:4px}#logo{width:282px;height:52px;image-rendering:pixelated}#header-note{font-size:8px;line-height:13px;color:#d9dc67;text-align:right;letter-spacing:.3px;padding-top:7px}#renderer-name{color:#8eaaa5;font-size:8px}#menu-heading{min-height:26px;display:flex;align-items:center;padding-top:3px;color:var(--amber)}#menu-heading .pixel-label{filter:sepia(.7) saturate(1.5)}#menu-content{flex:1;min-height:0;overflow:auto;scrollbar-width:thin;scrollbar-color:#b9b847 #303436;padding:3px 3px 7px;touch-action:pan-y}#menu-layer footer{min-height:19px;height:19px;display:flex;justify-content:space-between;align-items:center;border-top:1px solid #77793d;color:#aeb188;font-size:7px;letter-spacing:.2px;white-space:nowrap}.pixel-label{display:block;image-rendering:pixelated;pointer-events:none;max-width:100%;object-fit:contain;object-position:left center}.menu-item,.text-button{border:0;color:var(--yellow);background:transparent;padding:4px 8px;text-align:left;display:flex;align-items:center;gap:6px;min-height:25px}.menu-item:hover,.menu-item:focus-visible,.text-button:hover{color:var(--amber);background:#eded4914}.menu-item:hover .pixel-label,.text-button:hover .pixel-label{filter:sepia(1) saturate(3)}.main-menu{display:flex;flex-direction:column;width:245px;margin:0 auto;gap:3px;padding-top:0}.main-menu .menu-item{position:relative;padding-left:15px}.main-menu .menu-item:hover:before,.main-menu .menu-item:focus-visible:before{content:'>';position:absolute;left:0;color:var(--amber);font-size:16px}.main-side{position:absolute;right:28px;bottom:38px;color:#9fa59a;font-size:8px;line-height:14px;text-align:right;pointer-events:none}.buttons{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px;align-items:center}.buttons.end{justify-content:flex-end}.small-button{border:1px solid #8a8c49;background:#2f3435b5;color:var(--yellow);padding:5px 8px;font-size:11px;min-height:26px}.small-button:hover{background:#686b3b;color:#fffcaa}.small-button.primary{background:#b5b645;color:#181c20;border-color:#e7e970}.section-title{font-size:11px;color:var(--amber);margin:5px 0 8px}.muted{color:var(--dim);font-size:10px;line-height:1.6;font-weight:400}.hint{font-size:9px;color:#c0c3b3;line-height:1.45;margin:6px 0}.hint strong{color:#ffff95}.divider{border:0;border-top:1px solid #7f8349;margin:8px 0}.toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:7px;font-size:10px}.toolbar select,.toolbar input{font-size:10px;min-height:23px}.hill-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:10px;row-gap:3px}.hill-button{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;min-height:25px;background:transparent;border:0;border-left:2px solid transparent;color:var(--yellow);padding:3px 4px;text-align:left;gap:4px}.hill-button .hill-sub{display:flex;gap:8px;align-items:center;width:100%;font-size:8px;color:#a8b1a5}.hill-button .hill-k{color:#eae956;font-size:10px;margin-left:auto}.hill-button:hover,.hill-button:focus-visible{background:#dddd3915;border-left-color:var(--yellow)}.hill-button[data-selected=true]{background:#b8bc3a1a;border-left-color:var(--amber)}.hill-button .pb{font-size:7px;color:#b1b79c}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px 16px}.field{display:flex;flex-direction:column;gap:3px;font-size:10px;color:#d7d99d}.field input,.field select,input[type=text],input[type=number],select{min-width:0;background:#191e25d9;color:#f0f0ba;border:1px solid #727b63;padding:4px 5px;min-height:23px;font-size:11px;width:100%;outline-offset:1px}input[type=color]{padding:1px;width:100%;height:27px}input[type=range]{accent-color:#dada52;padding:0;min-height:24px}input[type=checkbox]{accent-color:#dede49;width:13px;height:13px;vertical-align:middle;margin:0 5px 0 0}.check{display:flex;align-items:center;font-size:10px;color:#e4e4b2;min-height:24px;gap:4px}.full{grid-column:1/-1}.player-editor{display:grid;grid-template-columns:170px 1fr;gap:18px}.player-list{max-height:225px;overflow:auto}.player-row{width:100%;border:0;background:transparent;color:#dbe05b;padding:6px;text-align:left;font-size:10px;display:flex;gap:7px}.player-row.active{background:#d0d23822;outline:1px solid #7f8140}.swatch{display:inline-block;width:10px;height:10px;border:1px solid #c4c8ca;flex-shrink:0}.check-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2px}.check-grid .check{font-size:8px;white-space:nowrap}.setup-top{display:grid;grid-template-columns:1fr 130px;gap:12px;margin-bottom:6px}.table-wrap{overflow:auto;max-height:222px;scrollbar-width:thin}table{border-collapse:collapse;width:100%;font-size:10px;text-align:left;color:#d6d9b9}th{position:sticky;top:0;background:#3a3f3e;color:#eeee55;font-size:9px;border-bottom:1px solid #999e54;padding:5px}td{padding:5px;border-bottom:1px solid #a7a97e21;white-space:nowrap}td.num,th.num{text-align:right}.you td{color:#ffff63;background:#b3bb4020}.out td{color:#888d85}.result-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.jump-distance .pixel-label{max-width:300px}.points-big{font-size:25px;color:#ffff94;text-align:right}.points-big small{display:block;color:#c3c7ab;font-size:9px}.judge-marks{display:flex;justify-content:space-around;padding:12px 0;background:#1b20276b;border-top:1px solid #7a8047;border-bottom:1px solid #7a8047;margin:8px 0}.judge{font-size:20px;text-align:center;min-width:45px;color:#eded78}.judge small{display:block;font-size:8px;color:#9ca493;margin-bottom:4px}.judge.dropped{color:#858b7f;text-decoration:line-through}.result-meta{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;font-size:9px;color:#b9c1b4;margin-bottom:5px}.result-meta strong{display:block;color:#f3f0a8;font-size:12px;margin-top:4px}.new-record{color:#fcdf4e;font-size:12px;letter-spacing:2px}.bad{color:#ff9985}.good{color:#dff276}.help-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.help-grid h3{font-size:12px;color:var(--amber);margin:3px 0 9px}.help-grid p{font-size:10px;line-height:1.5;color:#d3d6c3;margin:0 0 9px}kbd{display:inline-block;border:1px solid #b7ba6b;background:#202628;color:#f2f26d;padding:1px 4px;font:inherit}.replay-row{display:flex;align-items:center;gap:5px;border-bottom:1px solid #868b533a;padding:5px}.replay-info{flex:1;font-size:10px;color:#e6e993}.replay-info small{display:block;color:#b1b8a9;font-size:8px;margin-top:3px}.empty{padding:35px 22px;color:#bfc6ad;font-size:11px;line-height:1.7;text-align:center}.loading{margin:70px auto;text-align:center;font-size:14px;line-height:2}.pause-menu{padding-top:24px}#game-toolbar{position:absolute;z-index:4;right:12%;top:5px;display:flex;gap:4px}#game-toolbar button{min-width:27px;height:25px;background:#151b28bb;color:#f0ec74;border:1px solid #7b846b;font-size:12px}#touch-controls{display:none;position:absolute;inset:auto 0 40px;z-index:4;justify-content:space-between;align-items:center;padding:0 20px;pointer-events:none}#drag-tip{font-size:10px;color:#ecefd2;line-height:1.5;text-shadow:1px 2px #101b26;padding:8px;background:#141e2670;border:1px dashed #b7bfa15c;pointer-events:none}.touch-actions{display:flex;align-items:center;gap:12px}.touch-actions button{pointer-events:auto;touch-action:none;background:#171f27ba;color:#fffa75;border:2px solid #bbbe6b;min-height:58px;min-width:84px;font-size:14px;text-shadow:1px 1px #000;box-shadow:3px 3px #17202a60}.touch-actions button:active{background:#8a934dcc;transform:translateY(2px)}#touch-safe{min-width:55px;min-height:48px;font-size:10px;color:#f4f2d6;border-color:#a9b59e}#replay-controls{position:absolute;left:8px;right:8px;bottom:25px;z-index:6;display:flex;align-items:center;gap:5px;background:#141b24db;border:1px solid #9caa67;padding:6px}#replay-controls button{background:#3e4740;color:#eef27d;border:1px solid #919d68;padding:6px 8px;font-size:10px;min-height:29px}#replay-controls select{width:63px;font-size:11px}#replay-seek{width:auto;flex:1;min-width:20px}#toast{z-index:20;position:absolute;bottom:8%;left:50%;transform:translateX(-50%);padding:11px 18px;max-width:88%;background:#181f27f0;border:1px solid #d3d76c;color:#f0f1b6;font-size:12px;line-height:1.5;box-shadow:3px 4px #0005;pointer-events:none}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}#arena:fullscreen{width:100vw;height:100dvh;max-width:none;max-height:none}#arena.portrait{width:100%;height:100%;max-height:none}#arena.portrait #header-note{font-size:6px;line-height:11px;max-width:78px}#arena.portrait #logo{width:224px;height:42px}#arena.portrait #menu-header{height:54px;min-height:54px;align-items:center}#arena.portrait #menu-layer{padding:6px 9px 0}#arena.portrait #menu-heading{min-height:33px}#arena.portrait .main-menu{padding-top:18px;gap:7px;width:250px}#arena.portrait .main-menu .menu-item{min-height:34px;padding:9px 14px}#arena.portrait .main-side{position:static;text-align:center;margin:28px auto 8px;line-height:17px}#arena.portrait .hill-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}#arena.portrait .hill-button{min-height:42px;gap:6px;padding:7px}#arena.portrait .hill-button .hill-k{font-size:12px}#arena.portrait .hill-button .pb{font-size:8px}#arena.portrait .form-grid{grid-template-columns:1fr;gap:9px}#arena.portrait .field{font-size:12px;gap:5px}#arena.portrait .field select,#arena.portrait .field input,#arena.portrait select,#arena.portrait input[type=text],#arena.portrait input[type=number]{min-height:35px;font-size:13px}#arena.portrait .field input[type=color]{min-height:36px}#arena.portrait .check{font-size:12px;min-height:31px}#arena.portrait input[type=checkbox]{width:17px;height:17px}#arena.portrait .small-button{min-height:36px;font-size:12px;padding:8px}#arena.portrait .check-grid{grid-template-columns:repeat(2,1fr)}#arena.portrait .check-grid .check{font-size:10px;min-height:31px}#arena.portrait .setup-top{grid-template-columns:1fr}#arena.portrait .help-grid{grid-template-columns:1fr;gap:15px}#arena.portrait .help-grid p{font-size:12px;line-height:1.55}#arena.portrait .help-grid h3{font-size:14px}#arena.portrait .player-editor{grid-template-columns:1fr}#arena.portrait .player-list{max-height:130px}#arena.portrait .player-row{min-height:35px;font-size:12px}#arena.portrait .result-top{flex-direction:column;gap:13px;align-items:flex-start}#arena.portrait .points-big{text-align:left}#arena.portrait .result-meta{grid-template-columns:1fr 1fr;gap:13px;margin:15px 0}#arena.portrait .judge-marks{padding:15px 0}#arena.portrait .result-meta strong{font-size:15px}#arena.portrait .table-wrap{max-height:58vh}#arena.portrait table{font-size:11px}#arena.portrait td,#arena.portrait th{padding:9px 5px}#arena.portrait .buttons{gap:9px;margin-top:16px}#arena.portrait .hint{font-size:11px}#arena.portrait .grid2{grid-template-columns:1fr}#arena.portrait #menu-layer footer{font-size:6px;min-height:23px}#arena.portrait .replay-row{flex-wrap:wrap;padding:12px 2px}#arena.portrait .replay-info{font-size:12px;min-width:200px}#arena.portrait #touch-controls{bottom:72px;padding:0 14px}#arena.portrait #drag-tip{max-width:108px;font-size:10px}#arena.portrait #game-toolbar{top:38px;right:8px}#arena.portrait #game-toolbar button{height:34px;min-width:34px}#arena.portrait #replay-controls{flex-wrap:wrap;bottom:35px}#arena.portrait #replay-seek{order:10;min-width:100%}#arena.portrait .touch-actions{gap:8px}#arena.portrait .touch-actions button{min-width:83px;min-height:66px}#arena.portrait #touch-safe{min-width:53px;min-height:53px}@media(pointer:coarse){#touch-controls{display:flex}#game-toolbar button{min-height:30px;min-width:32px}}@media(prefers-reduced-motion:reduce){#scene-host{transition:none}}@media(max-height:420px) and (orientation:landscape){#touch-controls{bottom:30px;padding:0 10px}.touch-actions button{min-height:47px;min-width:73px}#touch-safe{min-height:41px;min-width:46px}#drag-tip{font-size:8px}#replay-controls{bottom:25px;padding:3px}}

/* Keep all 32 hills and the Back button visible at the original landscape ratio. */
#arena:not(.portrait) .hill-grid{row-gap:2px}#arena:not(.portrait) .hill-button{padding:2px 4px;gap:1px;min-height:25px}#arena:not(.portrait) #menu-layer[data-view="hills"] .toolbar{margin-bottom:4px}#arena:not(.portrait) #menu-layer[data-view="hills"] .buttons{margin-top:6px}

#arena.portrait #game-toolbar{top:86px}
@media(pointer:coarse) and (orientation:landscape){#arena:not(.portrait) .hill-button{min-height:40px;gap:4px;padding:5px}#arena:not(.portrait) .menu-item{min-height:36px}#arena:not(.portrait) .small-button{min-height:36px;font-size:12px}#arena:not(.portrait) .toolbar select{min-height:30px}}

/* Additional classic-menu views retain the 640x400 logical UI and touch scaling. */
.tour-events{max-height:139px;overflow:auto;scrollbar-width:thin;border-top:1px solid #77793d;border-bottom:1px solid #77793d;margin:4px 0 8px}.tour-event{display:flex;align-items:center;gap:4px;padding:3px 2px;border-bottom:1px solid #88883333;font-size:10px}.tour-event strong{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.small-button.tiny{font-size:8px;padding:3px 5px;min-height:22px}.table-link{padding:0;border:0;color:var(--yellow);background:transparent;font:inherit;text-align:left}.table-link:hover{text-decoration:underline}.start-list-table{max-height:190px}#menu-layer[data-view=tour] .toolbar{margin-bottom:5px}#menu-layer[data-view=tour] .toolbar select{width:auto;max-width:210px}#menu-layer[data-view=tour] .toolbar input{width:240px}#menu-layer[data-view=tour] .buttons{margin-top:4px}#replay-controls{flex-wrap:wrap}.replay-extra{display:flex;flex-wrap:wrap;gap:4px;width:100%}#replay-controls .replay-extra button{flex:1;padding:4px;min-width:35px;font-size:9px;min-height:27px}#arena.portrait .tour-events{max-height:42vh}#arena.portrait .tour-event{flex-wrap:wrap;font-size:12px;padding:6px 2px}#arena.portrait .tour-event strong{flex-basis:100%;white-space:normal}#arena.portrait .small-button.tiny{min-height:34px;font-size:11px;padding:5px 9px}#arena.portrait #replay-controls .replay-extra button{min-height:34px;font-size:9px}#arena.portrait #replay-seek{order:0}#arena.portrait .start-list-table{max-height:49vh}
/* Documented-behavior profile: compact, sparse HUD and independent touch mouse pads. */
#classic-pads { position:absolute; inset:auto 0 74px; display:flex; justify-content:space-between; padding:0 14px; pointer-events:none; }
#classic-pads button { pointer-events:auto; touch-action:none; user-select:none; min-width:76px; min-height:48px; background:#20212dd9; color:#eeee43; border:1px solid #c9c74b; border-radius:0; font:700 14px monospace; }
#classic-pads button:active { background:#686941; }
#classic-pads[hidden] { display:none!important; }
#arena[data-presentation=classic] #game-toolbar { opacity:.22; transition:opacity .12s; }
#arena[data-presentation=classic] #game-toolbar:hover, #arena[data-presentation=classic] #game-toolbar:focus-within { opacity:1; }
@media(pointer:coarse) { #arena[data-presentation=classic] #game-toolbar { opacity:.8; } }
@media(orientation:landscape) { #classic-pads { bottom:68px; } }

/* DSJ 2.10 measured menu rhythm. The background and glyphs remain our own artwork. */
#arena[data-presentation=classic]:not(.portrait) #menu-layer[data-view=main] #menu-header,
#arena[data-presentation=classic]:not(.portrait) #menu-layer[data-view=records] #menu-header { height:70px; min-height:70px; }
#arena[data-presentation=classic]:not(.portrait) #menu-layer[data-view=main] #logo,
#arena[data-presentation=classic]:not(.portrait) #menu-layer[data-view=records] #logo { width:236px; height:44px; margin-left:20px; }
#arena[data-presentation=classic]:not(.portrait) .main-menu { position:absolute; left:96px; top:152px; width:240px; margin:0; gap:0; padding:0; }
#arena[data-presentation=classic]:not(.portrait) .main-menu .menu-item { min-height:24px; height:24px; padding:4px 2px; }
#arena[data-presentation=classic] .main-menu .menu-item:hover,
#arena[data-presentation=classic] .main-menu .menu-item:focus-visible { outline:1px solid #49d8d1; outline-offset:-1px; background:transparent; }
#arena[data-presentation=classic] .main-menu .menu-item:hover:before,
#arena[data-presentation=classic] .main-menu .menu-item:focus-visible:before { content:none; }
#arena[data-presentation=classic] .main-menu [data-action=quit] { margin-top:16px; }
.classic-extensions { position:absolute; left:16px; right:16px; bottom:24px; display:flex; gap:6px; flex-wrap:wrap; }
.classic-extensions .small-button { font-size:9px; min-height:20px; padding:3px 6px; }
.classic-records { margin:23px 0 0 83px; }
.classic-record { display:grid; grid-template-columns:140px 74px 1fr; width:430px; min-height:20px; border:0; background:transparent; padding:2px 0; text-align:left; }
.classic-record:hover,.classic-record:focus-visible { outline:1px solid #49d8d1; outline-offset:-1px; }
.record-page { position:absolute; top:88px; right:43px; }
.classic-record-nav { margin:23px 0 0 83px; display:grid; grid-template-columns:280px 1fr; }
.classic-record-nav .menu-item { padding:3px 0; }
#arena[data-presentation=classic] #menu-layer[data-view=records] .record-extensions { font-size:8px; margin-top:4px; }
#arena[data-presentation=classic] #menu-layer[data-view=records] .record-extensions .small-button { font-size:8px; min-height:18px; padding:2px 5px; }
.sound-setup { max-width:330px; margin:30px auto; }
#arena.portrait .classic-extensions { position:static; margin-top:20px; }
#arena.portrait .classic-records { margin:12px 0; }
#arena.portrait .classic-record { grid-template-columns:136px 76px 1fr; width:100%; min-height:34px; }
#arena.portrait .record-page { position:static; display:block; margin:8px 0 12px; }
#arena.portrait .classic-record-nav { margin:12px 0; grid-template-columns:1fr; }
#arena.portrait .classic-record-nav .menu-item { min-height:34px; }

#arena[data-presentation=classic] #menu-layer { background:rgba(22,23,30,.46); }
.classic-record-tools { position:absolute; right:16px; bottom:24px; max-width:380px; font-size:9px; text-align:right; }
.classic-record-tools summary { cursor:pointer; color:#cbce86; padding:4px; }
.classic-record-tools[open] { padding:8px; background:#20232df5; border:1px solid #93984c; text-align:left; z-index:7; }
#arena.portrait .classic-record-tools { position:static; margin:12px 0; max-width:none; text-align:left; }

/* Classic menus have an opaque, independent pixel backdrop. */
#arena[data-presentation=classic].menu-open :is(#scene-host,#hud,#scanlines){visibility:hidden!important}

/* The menu may use viewport letterbox space; gameplay remains arena-clipped. */
#arena[data-presentation=classic].menu-open{overflow:visible}
