:root{color-scheme:dark;--bg:#17191b;--line:#36393a;--muted:#939998;--paper:#f0f0e6;--red:#ef593f;--ice-height:clamp(210px,calc(100dvh - 320px),680px)}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--paper);font:14px Barlow,Arial,sans-serif}button,select{font:inherit}button{cursor:pointer;color:inherit;border:0;min-height:42px}button:disabled{opacity:.32;cursor:default}button:focus-visible,select:focus-visible,a:focus-visible{outline:2px solid var(--red);outline-offset:4px}button:hover:enabled{filter:brightness(1.15)}.game-shell{max-width:1400px;margin:auto;padding:0 32px}.masthead{height:73px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:16px}.wordmark{color:var(--paper);text-decoration:none;display:flex;align-items:center;font:900 27px 'Barlow Condensed','Arial Narrow',sans-serif;letter-spacing:-.7px;gap:4px}.wordmark>span{color:var(--red)}.wordmark>svg{width:28px;height:30px;margin-right:6px}.wordmark i{font:600 9px Barlow,sans-serif;font-style:normal;letter-spacing:1.7px;margin-left:16px;color:var(--muted);width:66px;line-height:1.5}.masthead nav{display:flex;gap:22px;align-items:center}.quiet{background:transparent;font-size:12px;font-weight:600;padding:0;display:flex;gap:9px;align-items:center}.quiet span{border:1px solid #707575;border-radius:50%;font-size:10px;width:15px;height:15px;text-align:center}.quiet svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.4}.scoreboard{height:83px;display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid var(--line)}.mode{display:flex;align-items:center;gap:12px;min-width:190px}.red-dot{width:7px;height:7px;background:var(--red);border-radius:50%}.mode small{display:block;font-size:9px;letter-spacing:2px;color:var(--muted);margin-bottom:5px}.mode strong{font:700 19px 'Barlow Condensed',sans-serif;text-transform:uppercase}.scores{display:flex;align-items:center;gap:35px}.scores>div{display:flex;align-items:center;gap:10px}.scores strong{font:600 31px 'Barlow Condensed',sans-serif;font-variant-numeric:tabular-nums}.scores span{font-size:9px;letter-spacing:1.2px;color:var(--muted);line-height:1.4;max-width:60px}.scores .current-score{padding-right:28px;border-right:1px solid var(--line)}.current-score strong{color:var(--red);font-size:42px}.start-button{background:var(--red);color:#151719;padding:0 24px;font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:.6px;min-width:150px;clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,0 100%)}.arena{display:grid;grid-template-columns:170px minmax(0,1fr) 170px;align-items:center;gap:24px;padding:18px 0 0}.rink{width:min(100%,calc(var(--ice-height) * 700 / 650));margin:auto;background:#fff;box-shadow:0 12px 40px #0005;overflow:hidden;border-radius:2px}canvas{width:100%;height:auto;aspect-ratio:700/650;display:block;touch-action:none;cursor:crosshair}.ice-caption{display:flex;justify-content:space-between;max-width:calc(var(--ice-height) * 700 / 650);margin:9px auto 0;font-size:7px;color:#787f7c;letter-spacing:.8px;gap:10px}.chapter{font-size:8px;letter-spacing:1.6px;color:var(--muted);font-weight:700}.left-rail h1{font:900 clamp(44px,5vw,72px)/.86 'Barlow Condensed',Impact,sans-serif;letter-spacing:-2px;margin:26px 0 20px}.left-rail h1 em{color:var(--red);font-style:normal}.left-rail p{color:var(--muted);font-size:12px;line-height:1.7}.key-tip{margin-top:32px;display:flex;align-items:center;flex-direction:column;width:80px;gap:3px}.key-tip>div{display:flex;gap:3px}kbd{font:600 10px Barlow,sans-serif;border:1px solid #515754;display:inline-flex;align-items:center;justify-content:center;min-width:22px;min-height:22px;border-radius:3px;color:#b5bbb7;box-shadow:0 2px #292d2b;padding:3px}.key-tip span{color:var(--muted);font-size:8px;letter-spacing:1.5px;margin-top:8px}.roster{display:grid;gap:17px;margin:22px 0 30px}.roster>span{font-weight:700;display:flex;align-items:center;gap:10px;font-size:10px;letter-spacing:1px}.roster b{color:var(--muted);font-weight:500;margin-left:auto;font-size:9px}.jersey{display:inline-block;width:9px;height:9px;border-radius:50%;border:1px solid #ffffff60}.you{background:#d79528}.team{background:#13758a}.defense{background:#d45968}.outlet{padding-top:19px;border-top:1px solid var(--line)}label{font-size:11px;font-weight:600;color:#c6cbc6}.outlet label{font-size:8px;letter-spacing:1.5px;color:var(--muted)}select{width:100%;background:#24282a;color:var(--paper);border:1px solid #414747;border-radius:3px;padding:11px 8px;margin:9px 0 0;font-size:12px;min-height:42px}select:disabled{opacity:.5}.outlet p,.rink-rule{font-size:10px;line-height:1.6;color:var(--muted)}.lineup-button{margin-top:15px;display:flex;width:100%;align-items:center;justify-content:space-between;background:transparent;border-bottom:1px solid #646b65;font-size:11px;padding:0}.lineup-button span{color:var(--red);font-size:20px}.rink-rule{margin-top:24px}.game-status{display:flex;align-items:center;justify-content:center;gap:9px;height:34px;font-size:11px;color:#d9ded8}.status-light{width:5px;height:5px;border-radius:50%;background:var(--red)}.pause-button{background:transparent;font-size:10px;color:var(--muted);min-height:25px;border-left:1px solid var(--line);padding:0 0 0 13px;margin-left:7px}.action-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid var(--line);padding:10px 0 0}.play-actions{display:flex;gap:8px}.pass-button,.shoot-button{min-width:210px;font-weight:800;text-transform:uppercase;font-size:12px;letter-spacing:.2px;padding:0 18px;border-radius:2px}.pass-button{background:var(--paper);color:#17191b}.shoot-button{min-width:130px;background:transparent;border:1px solid #777d76}.move-tip{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:8px;letter-spacing:1px}.move-tip svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.2}.hand-tip{color:var(--muted);font-size:8px;letter-spacing:1px}.feedback{margin:8px 0 12px;font-size:10px;text-align:center;color:var(--muted);min-height:14px;line-height:1.4}dialog{padding:0;border:1px solid #4c514c;border-radius:4px;background:#1b1e20;color:var(--paper);width:min(480px,calc(100vw - 28px));max-height:90dvh;box-shadow:0 30px 100px #0009}dialog::backdrop{background:#07090bd9;backdrop-filter:blur(5px)}.dialog-heading{display:flex;align-items:center;justify-content:space-between;padding:23px 26px 18px;border-bottom:1px solid var(--line)}h2{font:800 36px 'Barlow Condensed',Impact,sans-serif;text-transform:uppercase;margin:5px 0 0}.close-button{font-size:28px;background:transparent;color:var(--muted)}.settings-content{padding:22px 26px}.settings-pair{display:grid;grid-template-columns:1fr 1fr;gap:18px}.settings-pair small{font-weight:400;color:var(--muted);font-size:9px}.switch-row{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:20px 0;gap:15px}.switch-row small{display:block;color:var(--muted);font-size:10px;font-weight:400;margin-top:5px}input[type=checkbox]{width:19px;height:19px;accent-color:var(--red);cursor:pointer}.hand-settings{margin-top:22px}.hand-settings>.row,.row{display:flex;gap:10px;flex-wrap:wrap;margin-top:10px}#teammateHands{margin-top:18px}#teammateHands>label{color:var(--muted);font-size:10px}.setup-note{font-size:10px;line-height:1.6;color:var(--muted);margin:16px 0 0}.dialog-footer{padding:0 26px 24px;display:flex;justify-content:flex-end}.help-content>div{display:grid;grid-template-columns:100px 1fr;gap:18px;align-items:center;margin-bottom:20px}.help-content kbd{min-height:35px}.help-content p{font-size:12px;line-height:1.6;margin:0}.fullscreen-fallback{position:fixed;inset:0;z-index:99999;overflow:auto;background:var(--bg)}:fullscreen{overflow:auto;background:var(--bg)}
@media(min-width:1600px){:root{--ice-height:clamp(210px,calc(100dvh - 320px),900px)}.game-shell{max-width:1600px}.arena{grid-template-columns:210px minmax(0,1fr) 210px}}
@media(max-width:850px){.game-shell{padding:0 18px}.arena{grid-template-columns:110px minmax(0,1fr);gap:16px}.right-rail{display:none}.left-rail h1{font-size:51px}.masthead nav{gap:16px}.wordmark i{display:none}.scores{gap:20px}.mode{min-width:150px}.hand-tip{display:none}.move-tip{max-width:120px;line-height:1.6}.scoreboard{gap:10px}.start-button{min-width:120px;padding:0 16px}}
@media(max-width:580px){:root{--ice-height:clamp(190px,calc(100dvh - 260px),600px)}.game-shell{padding:0 12px}.masthead{height:57px}.wordmark{font-size:24px}.masthead nav{gap:12px}.quiet{font-size:10px}.quiet svg,.quiet span,#helpOpen{display:none}.scoreboard{height:76px;gap:8px}.mode{min-width:0;gap:7px}.mode small{font-size:7px;letter-spacing:1px}.mode strong{font-size:14px;max-width:90px;display:block}.scores{gap:12px}.scores>div{flex-direction:column;gap:0}.scores .current-score{padding-right:12px;flex-direction:row;gap:5px}.scores strong{font-size:23px}.current-score strong{font-size:34px}.scores span{font-size:7px;letter-spacing:.5px}.scores>div:last-child{display:none}.start-button{min-width:90px;font-size:10px;padding:0 10px}.arena{display:block;padding-top:12px}.left-rail{display:none}.ice-caption{font-size:6px}.move-tip{display:none}.action-bar{justify-content:center;padding-top:9px}.play-actions{width:100%}.pass-button{flex:1;min-width:0;font-size:11px;padding:0 10px}.shoot-button{min-width:100px;font-size:11px}.game-status{font-size:10px}.feedback{font-size:9px}.settings-content,.dialog-heading{padding-left:20px;padding-right:20px}}
@media(max-height:540px) and (min-width:650px){:root{--ice-height:calc(100dvh - 185px)}.masthead{height:43px}.scoreboard{height:55px}.arena{padding-top:8px}.ice-caption{display:none}.left-rail h1{font-size:42px;margin:12px 0}.left-rail p,.key-tip,.rink-rule{display:none}.action-bar{padding-top:5px}.game-status{height:25px}.feedback{display:none}.scores strong{font-size:25px}.current-score strong{font-size:33px}}

@media(max-width:580px){#helpOpen{display:flex;font-size:0}#helpOpen span{display:inline-flex;font-size:10px}}

[hidden]{display:none!important}.rink{position:relative}.result-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#14191be8;text-align:center;padding:20px}.result-overlay h2{font-size:70px;line-height:1;color:var(--red);margin:10px 0}.result-overlay p{font-size:12px;color:#b5bdb6;margin:10px 0 26px}

.shortcut-settings{margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}.shortcut-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:12px}.shortcut-grid label{font-size:10px;color:var(--muted)}.shortcut-grid input{display:block;width:100%;margin-top:7px;padding:12px 5px;background:#24282a;color:var(--paper);border:1px solid #535a54;text-align:center;border-radius:3px;font:700 13px Barlow,sans-serif;cursor:pointer}.shortcut-grid input:focus{outline:2px solid var(--red)}#resetKeys{margin-top:5px;font-size:10px}#rewind{white-space:nowrap}
.review-tools{display:flex;justify-content:center;align-items:center;gap:16px;margin:0 0 7px;min-height:32px;font-size:10px;color:var(--muted)}.review-buttons{display:flex;gap:5px}.review-tools button{min-height:28px;padding:4px 8px;border:1px solid var(--line);border-radius:2px;background:#24282a;font-size:10px;color:var(--paper)}.review-tools #rewind{margin:0}.review-tools label{display:flex;align-items:center;gap:7px;font-size:10px}.review-tools select{width:70px;margin:0;padding:4px;min-height:28px;font-size:10px}.lane-status{font-size:9px;letter-spacing:.4px;text-transform:uppercase;min-width:80px;text-align:center}.lane-status.open{color:#7fce9e}.lane-status.covered{color:#ef8c79}#reviewTime{font-variant-numeric:tabular-nums;min-width:48px}:root{--ice-height:clamp(190px,calc(100dvh - 355px),680px)}@media(min-width:1600px){:root{--ice-height:clamp(210px,calc(100dvh - 355px),900px)}}@media(max-width:580px){:root{--ice-height:clamp(170px,calc(100dvh - 310px),600px)}.review-tools{gap:7px;flex-wrap:wrap}.review-tools button{font-size:9px;padding:4px 6px}.review-tools label{font-size:9px}.review-tools select{width:59px}.lane-status{font-size:8px;min-width:65px}}@media(max-height:800px) and (min-width:851px){.key-tip{display:none}.left-rail h1{margin-top:20px}.right-rail .rink-rule{margin-top:12px}}

.shoot-button.armed{background:var(--red);border-color:var(--red);color:#17191b;box-shadow:0 0 0 2px #ef593f25}
.replay-launch{margin:4px auto}.club-stats{display:flex;gap:32px;margin-bottom:24px}.club-stats strong{font-size:38px;color:var(--red)}.club-stats small{display:block;font-size:9px;color:var(--muted);letter-spacing:1px}.reward-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:20px 0}.settings-content input:not([type=checkbox]),.camera-bar select{width:100%;padding:12px;background:#24282a;color:var(--paper);border:1px solid #535a54;border-radius:3px;font:inherit;margin:8px 0 14px}.club-table{width:100%;border-collapse:collapse;margin-top:18px;text-align:left;font-size:12px}.club-table th,.club-table td{padding:10px 5px;border-bottom:1px solid var(--line)}.club-table th{font-size:9px;color:var(--muted);text-transform:uppercase}.member-row{display:flex;align-items:center;justify-content:space-between;gap:15px;border-bottom:1px solid var(--line);padding:10px 0;overflow-wrap:anywhere}.member-row button{color:var(--red)}#clubNotice{color:#ffcf89;font-size:12px;line-height:1.5}#roomMembers{margin:18px 0}.replay-dialog{width:min(1280px,98vw);max-width:98vw;padding:20px}.camera-bar{display:flex;align-items:center;gap:20px}.camera-bar label{display:flex;align-items:center;gap:8px;font-size:12px}.camera-bar select{width:auto;min-height:44px;margin:0}.stage3d{height:clamp(220px,58dvh,720px);position:relative;background:#111820;margin-top:12px;overflow:hidden}.stage3d canvas{aspect-ratio:auto;cursor:grab}.stage3d #error3D{position:absolute;top:0;left:20px;color:#ffcf89}.replay-transport{display:flex;align-items:center;justify-content:center;gap:12px;margin:12px 0}.replay-transport button{padding:0 14px;background:#343a3f;border-radius:3px}.replay-transport .pass-button{background:#13758a}.replay-transport label{display:flex;align-items:center;gap:6px}.replay-transport select{width:auto;margin:0}.replay-transport output{font-size:11px;min-width:110px;font-variant-numeric:tabular-nums}#seek3D{width:100%;accent-color:var(--red);min-height:36px;touch-action:pan-x}.replay-hint{font-size:11px;color:var(--muted);text-align:center}.touch-deck{display:none}.skate-pad{width:118px;height:118px;border-radius:50%;border:1px solid #8a96964d;background:#34424870;position:relative;touch-action:none;user-select:none;flex-shrink:0}.skate-pad>span{position:absolute;left:39px;top:39px;width:38px;height:38px;background:#a4b5b890;border:1px solid #d1e3e78a;border-radius:50%;pointer-events:none}.skate-pad small{position:absolute;bottom:8px;left:40px;font-size:8px;color:#b5c5ca;pointer-events:none}.touch-actions{display:flex;align-items:center;gap:12px}.touch-actions button{width:82px;height:82px;border-radius:50%;font-size:13px;font-weight:800;touch-action:none;user-select:none}.touch-actions .pass-button{background:#187e91}.touch-actions .shoot-button{background:var(--red);color:#17191b}.touch-actions button:active{transform:scale(.94)}
@media(pointer:coarse){.touch-deck{display:flex;align-items:center;justify-content:space-between;margin:12px auto;max-width:520px;padding:0 8px}.action-bar .play-actions{display:none}.move-tip{display:none}.key-tip{display:none}.masthead nav{gap:12px}.masthead nav button{min-height:44px}.masthead nav #helpOpen{display:none}.action-bar{min-height:0}.hand-tip{display:none}}
@media(max-width:700px){.masthead{height:auto;min-height:68px;flex-wrap:wrap;padding:8px 0}.masthead nav{width:100%;justify-content:space-between;gap:10px}.wordmark i{display:none}.camera-bar{gap:8px;flex-wrap:wrap}.camera-bar label{font-size:10px;gap:4px}.camera-bar select{padding:6px;font-size:11px}.replay-dialog{padding:12px}.replay-transport{gap:6px;flex-wrap:wrap}.replay-transport button{font-size:10px;padding:0 9px}.replay-transport output{min-width:100px}.reward-grid{grid-template-columns:1fr}.club-stats{gap:18px}.replay-hint{font-size:10px}.touch-actions button{width:72px;height:72px}.skate-pad{width:108px;height:108px}.skate-pad>span{left:34px;top:34px}.skate-pad small{left:35px}}
@media(pointer:coarse) and (orientation:landscape) and (max-height:600px){.game-shell{padding:0 16px}.masthead{min-height:42px;height:42px;padding:0;flex-wrap:nowrap}.masthead nav{width:auto;gap:18px}.wordmark{font-size:21px}.scoreboard{height:50px}.mode{min-width:120px}.mode small,.scores span,.ice-caption,.arena-rail,.feedback,.hand-tip,.move-tip{display:none}.arena{display:block;padding-top:8px}.ice-column{position:relative}.rink{width:min(54vw,calc((100dvh - 196px)*700/650))}.touch-deck{position:absolute;inset:0;max-width:none;margin:0;padding:0 4vw;align-items:center;pointer-events:none}.touch-deck>*{pointer-events:auto}.game-status{min-height:28px;margin:6px 0}.review-tools{margin:0}.replay-launch{position:absolute;right:22px;top:104px}.action-bar{display:none}.stage3d{height:46dvh}}

.replay-dialog[open]{display:flex;flex-direction:column;max-height:96dvh;overflow:hidden}.replay-dialog .dialog-heading{flex-shrink:0}.replay-dialog .camera-bar{flex-shrink:0}.replay-dialog .stage3d{flex:1 1 auto;min-height:160px}.replay-dialog .replay-transport,.replay-dialog #seek3D{flex-shrink:0}.replay-dialog .replay-hint{margin:6px 0 0}

.touch-mode .touch-deck{display:flex;align-items:center;justify-content:space-between;margin:12px auto;max-width:520px;padding:0 8px}.touch-mode .action-bar .play-actions,.touch-mode .move-tip,.touch-mode .hand-tip{display:none}.touch-mode .action-bar{min-height:0}
.touch-actions button{min-width:0;padding:0;flex-shrink:0}

.touch-hud{display:none}.touch-mode .touch-hud{display:flex;justify-content:space-between;align-items:center;padding:0 8px;min-height:36px}.touch-mode .touch-hud button{min-height:44px}.touch-mode .replay-launch{display:none}@media(pointer:coarse){.touch-hud{display:flex;justify-content:space-between;align-items:center;min-height:36px}.replay-launch{display:none}}@media(pointer:coarse) and (orientation:landscape) and (max-height:600px){.touch-hud,.touch-mode .touch-hud{position:absolute;right:24px;top:100px;z-index:3;gap:15px}.touch-mode .touch-deck{position:absolute;inset:0;max-width:none;margin:0;padding:0 4vw;align-items:center;pointer-events:none}.touch-mode .touch-deck>*{pointer-events:auto}}

.uniform-settings{margin:20px 0;padding:18px 0;border-block:1px solid var(--line)}.uniform-preview{display:flex;gap:20px;flex-wrap:wrap;font-size:10px;font-weight:700;margin-top:10px}.uniform-preview span{display:flex;align-items:center;gap:8px}.uniform-preview i{display:inline-block;width:22px;height:26px;border:4px solid;border-radius:5px}.jersey.you,.jersey.team{background:var(--attack-uniform,#003e7e);border:2px solid var(--attack-trim,#fff)}.jersey.defense{background:var(--defense-uniform,#af1e2d);border:2px solid var(--defense-trim,#192168)}

.privacy-link{display:inline-block;color:#bfc9c5;margin:8px 0;font-size:12px}.friend-code{display:block;font:700 17px monospace;overflow-wrap:anywhere;margin:16px 0}.settings-content a{color:#9bdae5}#accountMessage{color:#ffcf89;line-height:1.5}.legal-page{max-width:780px;margin:auto;padding:30px 24px;line-height:1.7}.legal-page h1,.legal-page h2{line-height:1.2}.legal-page a{color:#9bdae5}.legal-page li{margin:8px 0}
#clubBody>label,#accountBody label:not(.switch-row){display:block}#clubBody>.start-button{display:block;margin:12px 0 20px}#clubBody>label{margin-top:16px}#accountBody form>button{margin-top:12px}@media(max-width:700px){.masthead nav{flex-wrap:wrap}}


.avatar-picker{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:12px;margin:20px 0}.child-play{display:flex;flex-direction:column;align-items:center;gap:12px;min-height:125px;padding:18px;border-radius:12px}.player-avatar{font-size:48px;line-height:1.2}#accountBody details{margin-top:24px;padding-top:20px;border-top:1px solid #444}#accountBody summary{cursor:pointer;padding:12px 0}

.coach-dialog{width:min(920px,95vw);max-width:95vw}.coach-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:16px 0}.coach-dialog #coachPreview,.coach-dialog #coachMovie{display:block;width:min(100%,640px);height:auto;aspect-ratio:8/9;margin:20px auto;border:1px solid #35434b;border-radius:8px}.coach-dialog #coachMovie[hidden],.coach-dialog #coachLesson[hidden],.coach-dialog a[hidden],.coach-dialog button[hidden]{display:none}.coach-moment{display:flex;gap:16px;width:100%;text-align:left;padding:16px;margin:8px 0;line-height:1.5}.coach-moment b{flex:0 0 65px;color:#e7b74e}.coach-dialog #coachStatus,.coach-dialog #coachExportStatus{line-height:1.6;color:#bdcbd2}.coach-dialog select{min-width:110px}
#sandboxPanel{border:1px solid #3d5059;border-radius:5px;padding:16px;margin:20px 0}#sandboxPanel>summary{font-weight:800;cursor:pointer;color:#e7b74e}#sandboxPanel p{line-height:1.5}#sandboxPanel textarea{width:100%;background:#24282a;color:#f5f4ee;padding:12px;border:1px solid #535a54;font:inherit}#drillBoard{display:block;width:100%;max-width:540px;max-height:660px;object-fit:contain;margin:15px auto;touch-action:none;cursor:crosshair;border:1px solid #4e6973}#sandboxPanel input[type=file]{max-width:240px}#sandboxPanel .sandbox-hint{font-size:12px;color:#aebec7}#coachPracticeEnd[hidden]{display:none}.zone-practice-actions{display:flex;gap:12px;margin:16px 0}

/* Original transparent ReactVIEW artwork directly on the site header. */
.wordmark.reactview-brand{display:inline-grid;grid-template-columns:max-content;align-items:start;gap:4px;flex-shrink:0;letter-spacing:0;line-height:1}
.reactview-logo-wrap{display:block;position:relative;width:100%;aspect-ratio:718/93}.reactview-header-logo{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:transparent;padding:0;border-radius:0}
.wordmark .openice-name{display:flex;align-items:center;font:900 27px/1 'Barlow Condensed','Arial Black',Arial,sans-serif;letter-spacing:-.7px;color:var(--paper);padding-left:0}
@media(max-width:1100px){.masthead{height:auto;min-height:73px;flex-wrap:wrap;padding:10px 0}.masthead nav{flex-wrap:wrap;gap:6px 18px}.wordmark .openice-name{font-size:25px;padding-left:0}}
@media(max-width:700px){.masthead nav{justify-content:flex-start;width:100%;gap:4px 18px}.masthead nav button{min-height:38px}}
@media(pointer:coarse) and (orientation:landscape) and (max-height:600px){.wordmark .openice-name{font-size:20px;padding-left:0}.masthead{min-height:48px;padding:4px 0}.masthead nav{gap:2px 12px}}

.wordmark .openice-name .ice-name{color:var(--red)}.wordmark .openice-name small{font:800 10px/1 Arial,sans-serif;letter-spacing:1px;margin-left:8px;border:1px solid #707575;padding:3px 4px;border-radius:2px}

/* Wordmark text sets the brand width; logo scales to exactly match it. */
.masthead{height:auto;min-height:73px;flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:10px 0;gap:12px 24px}.wordmark.reactview-brand{max-width:100%}.masthead nav{width:auto;flex-wrap:wrap;justify-content:flex-end;margin-left:auto}
@media(max-width:700px){.masthead nav{width:100%;justify-content:flex-start;margin-left:0}}

/* Compact touch navigation overlays the rink instead of pushing it down. */
.menu-toggle{display:none}
@media(max-width:1180px){
.masthead{position:relative;min-height:64px;flex-wrap:nowrap;padding:7px 0;gap:12px;z-index:10}
.wordmark .openice-name{font-size:22px}
.menu-toggle{display:flex;align-items:center;gap:10px;min-height:44px;padding:0 14px;border:1px solid var(--line);border-radius:4px;font-weight:700}
.menu-toggle[aria-expanded="true"]{color:var(--red)}
.masthead nav{display:none;position:absolute;right:0;top:100%;width:min(340px,100%);margin:0;padding:10px;gap:4px;grid-template-columns:1fr 1fr;background:#1c2021;border:1px solid #464d4e;border-radius:6px;box-shadow:0 12px 28px #0008}
.masthead nav.menu-open{display:grid}
.masthead nav button,.masthead nav #helpOpen{display:flex;align-items:center;justify-content:flex-start;min-height:44px;padding:10px;text-align:left;white-space:normal}
.menu-toggle:focus-visible,.masthead nav button:focus-visible{outline:2px solid var(--red);outline-offset:2px}
}
@media(max-width:1180px) and (orientation:landscape) and (max-height:600px){.masthead{min-height:54px;padding:4px 0}.wordmark .openice-name{font-size:19px}.masthead nav{max-height:calc(100dvh - 70px);overflow-y:auto}}
@media(max-width:1180px){.menu-toggle{font-size:12px}.menu-toggle span{display:inline;font-size:16px}.masthead nav #helpOpen{font-size:12px}.masthead nav #helpOpen span{display:none}}
/* Landscape play: reserve side gutters for thumbs; never overlay the ice. */
@media (orientation:landscape) and (max-width:1180px){
.game-shell{padding:0 max(12px,env(safe-area-inset-left)) 0 max(12px,env(safe-area-inset-right))}
.masthead{min-height:54px;height:54px;padding:4px 0}.wordmark .openice-name{font-size:19px}
.privacy-link{position:absolute;left:130px;top:17px;margin:0;font-size:10px}
.scoreboard{height:46px;gap:12px}.mode{min-width:0}.mode small,.scores span{display:none}.mode strong{font-size:15px}.scores{gap:16px}.scores>div{gap:5px}.scores .current-score{padding-right:12px}.scores strong{font-size:24px}.start-button{min-height:40px;padding:0 16px}
.arena{display:block;padding-top:6px}.arena-rail,.ice-caption,.feedback,.hand-tip,.move-tip{display:none}
.ice-column{position:relative;min-height:170px;padding:0 120px}
.rink{width:min(100%,calc((100dvh - 150px)*700/650));margin:auto}
.touch-deck,.touch-mode .touch-deck{display:flex;position:absolute;inset:0;max-width:none;margin:0;padding:0;align-items:center;justify-content:space-between;pointer-events:none}
.touch-deck>*{pointer-events:auto}.skate-pad{width:104px;height:104px}.skate-pad>span{left:32px;top:32px}.skate-pad small{left:33px}
.touch-actions{flex-direction:column;gap:12px;width:104px}.touch-actions button{width:72px;height:72px;font-size:11px}
.touch-hud,.touch-mode .touch-hud{display:flex;position:static;justify-content:center;min-height:36px;height:36px;padding:0;gap:28px}.touch-hud button{min-height:36px!important;font-size:11px}
.game-status{height:24px;min-height:24px!important;margin:0;font-size:10px}.game-status .pause-button{display:none}
.replay-launch,.touch-mode .replay-launch,.action-bar{display:none}.review-tools{margin:0;min-height:34px;gap:10px}
}
@media (orientation:landscape) and (max-width:1180px){
.privacy-link{left:180px;top:36px;font-size:9px}
.touch-hud,.touch-mode .touch-hud{position:absolute;left:50%;right:auto;top:6px;transform:translateX(-50%);z-index:4;width:max-content;height:38px;gap:20px}
.rink{width:min(100%,calc((100dvh - 168px)*700/650))}
}

.teammate-skill{margin:20px 0;padding:18px 0;border-block:1px solid var(--line)}.teammate-skill label{display:flex;justify-content:space-between;font-weight:700}.teammate-skill output{color:var(--red);font-variant-numeric:tabular-nums}.settings-content .teammate-skill input[type=range]{width:100%;min-height:44px;padding:0;margin:8px 0;accent-color:var(--red);cursor:pointer}.teammate-skill p{font-size:12px;line-height:1.5;color:#bfc9c5;margin:0}.skill-scale{display:flex;justify-content:space-between;font-size:10px;color:var(--muted);margin-top:8px}
/* Landscape game view: remove header chrome and keep thumbs off the ice. */
@media (orientation:landscape) and (max-width:1180px){
.masthead{display:contents}.masthead .wordmark,.privacy-link{display:none}
.menu-toggle{position:fixed;right:max(12px,env(safe-area-inset-right));bottom:max(3px,env(safe-area-inset-bottom));z-index:12;min-height:36px;padding:0 10px;background:#24282a;font-size:11px}
.masthead nav{position:fixed;top:auto;bottom:46px;right:12px;z-index:20;max-height:calc(100dvh - 64px);overflow-y:auto}
.scoreboard{height:44px}.mode strong{font-size:13px}.scores{gap:12px}.scores strong{font-size:21px}.scoreboard .start-button{min-height:36px;font-size:11px}
.ice-column{padding:0 96px;min-height:156px}.arena{padding-top:4px}
.rink{width:min(100%,calc((100dvh - 110px)*700/650))}
.skate-pad{width:88px;height:88px}.skate-pad>span{left:24px;top:24px}.skate-pad small{left:25px;bottom:5px}
.touch-actions{width:88px;gap:12px}.touch-actions button{width:64px;height:64px}
.touch-hud,.touch-mode .touch-hud{position:static;transform:none;width:auto;justify-content:center;height:36px;min-height:36px;gap:24px;margin:0;padding-right:90px}
.game-shell{display:flex;flex-direction:column}.scoreboard{order:1}.arena{order:2}.game-status{order:3}.touch-hud{order:4}.review-tools{order:5}.action-bar{order:6}
.review-tools{display:none}.is-paused .review-tools{display:flex;flex-wrap:wrap;padding-right:90px}.game-status{height:24px;min-height:24px!important}.touch-hud button{min-height:36px!important}
}
#exitImmersive{display:none}
@media (orientation:landscape) and (max-width:1180px){
body.immersive-play{position:fixed;inset:0;overflow:hidden;overscroll-behavior:none;background:var(--bg)}
.immersive-play .game-shell{position:fixed;inset:0;max-width:none;padding:max(6px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));overflow:hidden}
.immersive-play .masthead,.immersive-play .menu-toggle,.immersive-play .masthead nav,.immersive-play .scoreboard,.immersive-play .game-status,.immersive-play .review-tools,.immersive-play.is-paused .review-tools,.immersive-play #touchReplay,.immersive-play .action-bar,.immersive-play .privacy-link{display:none!important}
.immersive-play .arena{display:block;position:absolute;inset:max(6px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));padding:0}
.immersive-play .ice-column{height:100%;min-height:0;padding:0 96px;display:flex;align-items:center;justify-content:center}
.immersive-play .rink{width:min(100%,calc((100dvh - max(6px,env(safe-area-inset-top)) - max(6px,env(safe-area-inset-bottom)))*700/650));margin:0}
.immersive-play .touch-hud,.immersive-play.touch-mode .touch-hud{position:fixed;left:max(8px,env(safe-area-inset-left));top:max(6px,env(safe-area-inset-top));right:auto;bottom:auto;transform:none;z-index:8;width:88px;height:auto;padding:0;margin:0;display:flex;flex-direction:column;gap:6px}
.immersive-play #touchPause{width:88px;min-height:44px!important;justify-content:center;border:1px solid #5a6669;border-radius:5px;background:#242b2e;font-size:12px}
.immersive-play.is-paused #exitImmersive{display:flex;min-height:44px;text-align:center;font-size:10px;justify-content:center}
}
.goal-replay-dialog{width:min(850px,96vw);max-height:96dvh}.goal-replay-dialog .settings-content{overflow:auto;max-height:calc(96dvh - 110px)}#goalReplayCanvas{display:block;max-width:100%;width:min(100%,520px);height:auto;margin:auto}#goalReplaySeek{width:100%;min-height:44px;accent-color:var(--red)}#goalReplayCaption{line-height:1.5;color:#e3d5a7}#goalReplayMoments button{font-size:12px;line-height:1.5}#watchGoal{padding:12px 18px;margin:8px;min-height:44px}.result-overlay #watchGoal{flex:none}.result-overlay{overflow:auto}

#roomInvite,#joinLink{display:block;width:100%;padding:12px;background:#24282a;color:var(--paper);border:1px solid #535a54;border-radius:4px;font:14px/1.6 monospace;resize:vertical;overflow-wrap:anywhere}#joinPin{max-width:180px;font:700 22px/1.4 monospace;letter-spacing:4px}

/* One typographic system for private room setup. */
#clubDialog{font:400 14px/1.5 Arial,sans-serif}
#clubDialog .chapter{display:none}
#clubDialog .dialog-heading{padding:24px 26px}
#clubDialog h2{font:700 24px/1.2 Arial,sans-serif;text-transform:none;letter-spacing:0;margin:0}
#clubDialog h3{font:700 16px/1.4 Arial,sans-serif;letter-spacing:0;margin:22px 0 12px}
#clubDialog p,#clubDialog label,#clubNotice{font:400 14px/1.5 Arial,sans-serif;letter-spacing:0}
#clubDialog label{display:block;font-weight:600;margin-top:12px}
#clubDialog .setup-note{font:400 12px/1.5 Arial,sans-serif;margin:12px 0}
#clubDialog button{font:700 14px/1.3 Arial,sans-serif;letter-spacing:0;text-transform:none;min-height:44px}
#clubDialog input:not([type=checkbox]),#clubDialog select,#clubDialog textarea{font:400 16px/1.5 Arial,sans-serif;letter-spacing:0;margin:6px 0 16px}
#clubDialog #joinPin{width:180px;max-width:100%;letter-spacing:0}
#clubDialog #roomInvite,#clubDialog #joinLink{font-family:Arial,sans-serif}

/* The native shell has no browser chrome; reserve separate thumb rails on larger tablets too. */
.native-app .privacy-link{font-size:12px}
@media (orientation:landscape) and (min-width:1181px){
.native-app.immersive-play{position:fixed;inset:0;overflow:hidden;overscroll-behavior:none}
.native-app.immersive-play .game-shell{position:fixed;inset:0;padding:0;max-width:none;overflow:hidden}
.native-app.immersive-play .masthead,.native-app.immersive-play .scoreboard,.native-app.immersive-play .game-status,.native-app.immersive-play .review-tools,.native-app.immersive-play .action-bar,.native-app.immersive-play .privacy-link,.native-app.immersive-play .arena-rail,.native-app.immersive-play .ice-caption,.native-app.immersive-play .feedback,.native-app.immersive-play .replay-launch,.native-app.immersive-play #touchReplay{display:none!important}
.native-app.immersive-play .arena{position:absolute;inset:max(8px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));display:block;padding:0}
.native-app.immersive-play .ice-column{height:100%;padding:0 120px;display:flex;align-items:center;justify-content:center}
.native-app.immersive-play .rink{width:min(100%,calc((100dvh - max(8px,env(safe-area-inset-top)) - max(8px,env(safe-area-inset-bottom)))*700/650));margin:0}
.native-app.immersive-play .touch-deck{display:flex;position:absolute;inset:0;max-width:none;padding:0;margin:0;align-items:center;justify-content:space-between;pointer-events:none}
.native-app.immersive-play .touch-deck>*{pointer-events:auto}
.native-app.immersive-play .touch-actions{flex-direction:column;gap:20px;width:108px}
.native-app.immersive-play .touch-hud{display:flex;position:fixed;left:max(12px,env(safe-area-inset-left));top:max(8px,env(safe-area-inset-top));right:auto;transform:none;z-index:8;width:108px;height:auto;padding:0;flex-direction:column;gap:8px}
.native-app.immersive-play #touchPause{min-height:44px;width:108px;justify-content:center;border:1px solid #5a6669;background:#242b2e;border-radius:5px}
.native-app.immersive-play.is-paused #exitImmersive{display:flex;min-height:44px;text-align:center;font-size:12px;justify-content:center}
}