@font-face{font-family:Solex;src:url('./brand/185_SolexBoldItalic.woff') format('woff');font-weight:700;font-style:italic;font-display:swap}
@font-face{font-family:Solex;src:url('./brand/1_SolexBold.woff') format('woff');font-weight:700;font-display:swap}
:root{color-scheme:dark;--gold:#ad9550;--cream:#e4d8b4;--mobile-scale:1;--desktop-scale:1}
*{box-sizing:border-box}html,body{margin:0;background:#000;color:var(--cream)}body{font:16px/1.45 Solex,Arial,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:#ffdc4c}button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid #ffdc4c;outline-offset:3px}[hidden]{display:none!important}
#site{width:min(1179px,100%);margin:40px auto 50px}.stage{position:relative}.desktop-stage{height:calc(885px * var(--desktop-scale))}.paper-art{position:absolute;transform-origin:top left}.desktop-stage .paper-art{width:1179px;height:885px;transform:scale(var(--desktop-scale))}.mobile-stage{display:none;background:#10162e;overflow:hidden;min-height:calc(844px * var(--mobile-scale))}.mobile-stage .paper-art{width:390px;height:844px;transform:scale(var(--mobile-scale))}
.art-button{padding:0;border:0;background:transparent;text-align:inherit;font:inherit;color:inherit;cursor:pointer}.art-button:hover{filter:brightness(1.12)}.art-button:active{filter:brightness(.9)}.art-button svg{display:block;pointer-events:none}.art-button:focus-visible{outline-offset:1px}
#game{position:relative;width:100%;height:100%;background:#000;isolation:isolate}#canvas{display:block;width:100%;height:100%;object-fit:contain;background:#000}#canvas:focus-visible{outline:1px solid #ad955088;outline-offset:-1px}.loading-cover{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;text-align:center;background:#000;pointer-events:none}.loading-symbol{font-size:42px;color:#ad9550}.loading-cover p{font-size:18px;max-width:30ch}.game-ready .loading-cover{display:none}#fullscreen{position:absolute;right:0;bottom:0;width:44px;height:44px;padding:0;border:0;background:transparent;color:#d4c391;opacity:1}#fullscreen svg{width:100%;height:100%;display:block}.corner-fill{fill:#000}#fullscreen:hover,#fullscreen:focus-visible{opacity:1;color:#ffdc4c}.desktop-stage #fullscreen{width:64px;height:64px}
#touch-host{position:absolute;left:0;top:calc(508px * var(--mobile-scale));width:100%}#touch-host .mobile-controls{background:linear-gradient(180deg,rgba(4,3,3,.2),rgba(3,2,2,.48));border-top:0;box-shadow:none}#touch-host .mobile-controls button{font-family:Solex,Arial,sans-serif;font-weight:700;font-synthesis:none}
#site-dialog{position:fixed;width:min(440px,calc(100% - 32px));max-height:calc(100dvh - 48px);padding:28px;border:1px solid var(--gold);border-radius:4px;background:#10162e;color:#e4d8b4;box-shadow:0 12px 80px #0009}#site-dialog::backdrop{background:#000b;backdrop-filter:blur(3px)}#site-dialog h1{font:700 26px Solex,Arial,sans-serif;color:#ffdc4c;margin:0 40px 18px 0}#site-dialog p{line-height:1.65}#site-dialog a{display:inline-block;padding:10px 0}.dialog-close{position:absolute;right:8px;top:8px;width:44px;height:44px;background:none;color:var(--cream);border:0;font-size:28px}.menu-links{display:flex;flex-direction:column;gap:8px}.menu-links button{min-height:44px;text-align:left;padding:10px 14px;background:#232b4c;border:1px solid #62658e;color:var(--cream)}kbd{color:#fff;font:inherit;font-weight:700}
#immersive-shell{position:fixed;inset:0;z-index:100;display:flex;flex-direction:column;justify-content:center;align-items:center;background:#000;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}#immersive-shell #game{width:100%;height:auto;aspect-ratio:4/3;max-height:100%;flex:0 1 auto}#immersive-shell #touch-host{position:relative;top:auto;flex:0 0 auto;width:100%;max-width:600px}body.is-immersive{overflow:hidden}#diagnostics{max-width:900px;margin:20px auto;color:#bbb;font:12px monospace}#result{white-space:pre-wrap;overflow-wrap:anywhere}
@media(max-width:700px), (pointer:coarse) and (orientation:portrait){#site{width:min(480px,100%);margin:0 auto}.desktop-stage{display:none}.mobile-stage{display:block}#game #fullscreen{width:44px;height:44px}.mobile-stage{padding-bottom:env(safe-area-inset-bottom)}}
@media(max-width:700px),(pointer:coarse){input,textarea,select,[contenteditable]{font-size:16px!important}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}

/* Landscape follows the Paper side grips, with OpenSmash action positions. */
@media(pointer:coarse) and (orientation:landscape){
#site{width:100%;margin:0}.desktop-stage{display:none}.mobile-stage{display:block;height:100dvh;min-height:0}.mobile-stage .paper-art{transform:none;width:100%;height:100%}
.mobile-stage .paper-art>[data-part]{display:none!important}.mobile-stage .paper-art>[data-part="mobile-0"],.mobile-stage .paper-art>[data-part="mobile-1"]{display:block!important;width:100%!important;height:100%!important;top:0!important}.mobile-stage [data-part="mobile-0"]>div{width:100%!important;height:100%!important}
.mobile-stage .paper-art>[data-game-slot]{display:block!important;left:50%!important;top:50%!important;width:min(calc((100dvh - 30px) * 4 / 3),calc(100vw - 280px))!important;height:auto!important;aspect-ratio:4/3;transform:translate(-50%,-50%);outline:1px solid #ad9550;outline-offset:6px}
.mobile-stage #touch-host{top:0;height:100%;pointer-events:none}.mobile-stage #touch-host .mobile-controls{height:100%;background:none;overflow:visible}
.mobile-stage .mobile-start-button{position:absolute;left:0;top:52px;width:60px}.mobile-stage .mobile-joystick{left:max(12px,env(safe-area-inset-left));bottom:max(12px,env(safe-area-inset-bottom));width:clamp(104px,30vh,136px);height:clamp(104px,30vh,136px)}
.mobile-stage .mobile-action-controls{right:max(10px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom));width:120px;height:130px;display:grid;grid-template-columns:1fr 1fr;grid-template-areas:'shield jump' 'b a';gap:8px}
.mobile-stage .mobile-action-controls>.mobile-control-button{position:static;width:56px;height:56px}.mobile-stage .is-z{grid-area:shield}.mobile-stage .is-jump{grid-area:jump}.mobile-stage .is-b{grid-area:b}.mobile-stage .is-a{grid-area:a}
}

@media(max-width:700px),(pointer:coarse) and (orientation:portrait){
.mobile-stage #fullscreen{width:calc(44px / var(--mobile-scale));height:calc(44px / var(--mobile-scale))}
.mobile-stage [data-part="mobile-4"]{width:max(44px,calc(44px / var(--mobile-scale)))!important;height:max(44px,calc(44px / var(--mobile-scale)))!important}
.mobile-stage [data-action="gamepad"]{min-height:calc(44px / var(--mobile-scale))}
}

/* Use the original SWF's Solex faces for every added label, too. */
#mobile-art [style*="font-family"]{font-family:Solex,Arial,sans-serif!important;font-weight:700!important;font-synthesis:none}
#touch-host .mobile-controls small{font-family:Solex,Arial,sans-serif;font-weight:700}
#touch-host .mobile-start-button{font-family:Solex,Arial,sans-serif;font-weight:700;font-style:italic;font-size:14px;letter-spacing:.04em}
#touch-host .is-jump>span{font-family:Arial,sans-serif}

/* The chamfer is opaque; only its icon is subdued, never the game mask. */
#fullscreen svg>path:last-child{opacity:.78}
#fullscreen:hover svg>path:last-child,#fullscreen:focus-visible svg>path:last-child{opacity:1}

/* One continuous viewport rim, with the expand glyph inside its cut-away. */
#game{--cut:44px;background:transparent}
#game::before{content:"";position:absolute;inset:0;background:#ad9550;clip-path:polygon(0 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%);pointer-events:none}
#canvas{position:absolute;inset:1px;width:calc(100% - 2px);height:calc(100% - 2px);clip-path:polygon(0 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%)}
.loading-cover{inset:1px;clip-path:polygon(0 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%)}
#game #fullscreen{width:44px;height:44px;display:flex;align-items:flex-end;justify-content:flex-end;padding:5px;color:#d4c391;opacity:1}
#game #fullscreen svg{width:14px;height:14px;flex:none}
#fullscreen svg>path:last-child{opacity:1}
@media(max-width:700px),(pointer:coarse) and (orientation:portrait){.mobile-stage #game{--cut:calc(44px / var(--mobile-scale))}.mobile-stage #game #fullscreen{width:calc(44px / var(--mobile-scale));height:calc(44px / var(--mobile-scale))}}
@font-face{font-family:MeleeDisplay;src:url('./brand/paper/kanit-800.ttf') format('truetype');font-weight:800;font-display:swap}
#retry-game{margin:12px auto;padding:10px 22px;border:2px solid var(--gold);background:#151b35;color:var(--cream);font:700 20px Solex,Arial,sans-serif}
