:root{--paper:#e8e4da;--ink:#20221f;--muted:#787a72;--red:#ed4a25;--line:rgba(32,34,31,.2);font-family:Arial,'Apple SD Gothic Neo','Noto Sans KR',sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none}body{touch-action:none;user-select:none;-webkit-user-select:none}button{font:inherit;color:inherit;border:0;cursor:pointer;touch-action:none}button:focus-visible{outline:3px solid var(--red);outline-offset:5px}[hidden]{display:none!important}#app{position:relative;width:100%;height:100%;height:100dvh;overflow:hidden}canvas{position:absolute;inset:0;width:100%;height:100%}.grain{pointer-events:none;position:absolute;inset:0;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23000' filter='url(%23n)' opacity='.8' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}#brand{position:absolute;left:max(30px,env(safe-area-inset-left));top:max(24px,env(safe-area-inset-top));display:flex;align-items:center;gap:9px;font-size:16px;font-weight:900;letter-spacing:-.5px;z-index:3}.brand-icon{background:var(--ink);color:var(--paper);width:24px;height:24px;display:grid;place-items:center;transform:skew(-10deg);font-weight:900}.edition{font-size:8px;font-weight:600;letter-spacing:1.4px;margin-left:18px;opacity:.6}.top-actions{position:absolute;right:max(28px,env(safe-area-inset-right));top:max(20px,env(safe-area-inset-top));display:flex;gap:8px;z-index:12}.icon-button{height:34px;min-width:34px;background:rgba(232,228,218,.8);border:1px solid var(--line);font-size:21px;display:flex;align-items:center;justify-content:center;gap:4px}.icon-button span{font-size:8px;font-weight:700;padding-right:3px}.screen{position:absolute;inset:0}.intro{position:absolute;top:21%;left:8%;z-index:2}.eyebrow{display:flex;align-items:center;gap:8px;font-size:10px;font-weight:700;letter-spacing:2px}.eyebrow i,.home-footer i{display:inline-block;width:6px;height:6px;background:var(--red);border-radius:100%}h1{font-family:'Arial Black',Arial,sans-serif;font-size:clamp(72px,10.8vw,146px);letter-spacing:-.065em;line-height:.79;margin:24px 0 22px;font-weight:1000;font-style:italic}h1>span{color:transparent;-webkit-text-stroke:2px var(--ink)}.period{color:var(--red);-webkit-text-stroke:0}.tagline{font-size:18px;font-weight:800;letter-spacing:-.5px;margin:0 0 13px}.intro-copy{font-size:12px;line-height:1.8;color:#696b64;margin:0 0 25px}.primary{background:var(--red);color:#fff9ed;display:flex;align-items:center;justify-content:space-between;gap:55px;padding:17px 22px;font-size:14px;font-weight:800;min-width:218px;text-align:left;box-shadow:4px 4px 0 var(--ink);transition:transform .12s,box-shadow .12s}.primary span{font-size:24px;line-height:16px}.primary:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--ink)}.home-links{display:flex;flex-direction:column;gap:12px;margin-top:18px;font-size:10px}.home-links button{background:transparent;padding:0;text-align:left;font-weight:700;font-size:11px;width:max-content}.home-links button span{margin-left:15px;color:var(--red)}#best{color:var(--muted);font-size:9px;letter-spacing:.5px}.art-label{position:absolute;right:7%;top:26%;display:flex;flex-direction:column;gap:12px;transform:rotate(90deg);transform-origin:right top}.art-label>span{font-size:8px;letter-spacing:2px}.art-label b{font-size:24px;line-height:.95;letter-spacing:-1px}.art-label small{font-size:7px;letter-spacing:2px}.home-footer{position:absolute;left:30px;right:30px;bottom:max(22px,env(safe-area-inset-bottom));padding-top:16px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;font-size:8px;letter-spacing:1.1px}.home-footer i{margin-right:6px;width:4px;height:4px}.home-footer .arrow{font-size:18px;margin-left:10px}#hud{position:absolute;inset:0;pointer-events:none}.player-panel{position:absolute;left:max(26px,env(safe-area-inset-left));top:max(24px,env(safe-area-inset-top));width:180px}.hud-label{display:flex;justify-content:space-between;font-size:10px;letter-spacing:1px}.health-track{height:8px;background:#cecabf;margin-top:7px}.health-track>div{height:100%;background:var(--ink);width:100%;transition:width .15s}.focus-track{height:3px;background:#cecabf;margin-top:4px}.focus-track>div{height:100%;background:var(--red);width:0;transition:width .1s}.player-panel small{display:block;font-size:8px;margin-top:7px;color:#77796f}.stage-panel{position:absolute;top:28px;left:50%;transform:translateX(-50%);text-align:center;font-size:9px;letter-spacing:2px;font-weight:700}.stage-dots{display:flex;gap:5px;justify-content:center;margin-top:9px}.stage-dots i{height:3px;width:27px;background:#cac5bb}.stage-dots i.active{background:var(--red)}.score-panel{position:absolute;right:185px;top:23px;display:flex;flex-direction:column;align-items:flex-end;gap:1px}.score-panel small{font-size:7px;letter-spacing:2px}.score-panel b{font-size:20px;font-style:italic;letter-spacing:-1px}.score-panel>span{font-size:8px;color:var(--muted);font-variant-numeric:tabular-nums}#boss-hud{position:absolute;top:75px;left:50%;width:32%;transform:translateX(-50%)}#boss-hud>span{font-size:9px;letter-spacing:2px;font-weight:700;display:flex;justify-content:space-between}#boss-hud small{font-size:8px;letter-spacing:0;font-weight:400}#boss-hud>div{height:4px;background:#c4beb3;margin-top:5px}#boss-fill{display:block;height:100%;background:var(--red);width:100%;transition:width .1s}.combo{position:absolute;left:6%;top:25%;display:flex;flex-direction:column;transform:rotate(-6deg);color:var(--red)}.combo b{font-size:60px;line-height:.9;font-style:italic;font-weight:900;letter-spacing:-4px}.combo span{font-size:9px;font-weight:800;letter-spacing:1px;margin-top:5px}.notice{position:absolute;top:28%;width:100%;text-align:center;letter-spacing:4px;font-size:clamp(18px,3vw,36px);font-weight:1000;font-style:italic;opacity:0;transition:opacity .12s;text-shadow:2px 2px var(--paper)}.notice.show{opacity:1}.battle-tip{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);font-size:9px;color:#77796f;text-align:center;line-height:1.6;white-space:nowrap}#controls{position:absolute;inset:0;pointer-events:none}.move-pad{position:absolute;pointer-events:auto;left:max(32px,env(safe-area-inset-left));bottom:max(35px,env(safe-area-inset-bottom));width:154px;height:82px;border-radius:50px;background:rgba(32,34,31,.045);border:1px solid rgba(32,34,31,.22);touch-action:none}.move-knob{width:62px;height:62px;position:absolute;top:9px;left:45px;border-radius:50%;background:rgba(232,228,218,.9);border:1px solid #93958b;box-shadow:0 3px 0 #b6b4a9;display:grid;place-items:center;font-size:23px;color:#51544b;pointer-events:none}.move-arrow{position:absolute;top:21px;font-size:26px;color:#7d8076}.move-arrow.left{left:13px}.move-arrow.right{right:13px}.move-pad small{position:absolute;top:90px;width:100%;text-align:center;font-size:7px;letter-spacing:2px;color:#808176}.combat-pad{position:absolute;right:max(28px,env(safe-area-inset-right));bottom:max(26px,env(safe-area-inset-bottom));width:240px;height:153px;pointer-events:none}.combat-button{position:absolute;pointer-events:auto;border-radius:50%;background:rgba(232,228,218,.93);border:1px solid #8e9186;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 3px 0 #b6b4a9;overflow:hidden}.combat-button>span{font-size:27px;line-height:1}.combat-button b{font-size:9px;margin-top:3px}.combat-button small{font-size:6px;letter-spacing:1px;margin-top:5px}.attack{width:91px;height:91px;right:0;bottom:2px;background:var(--red);color:#fff8e9;border-color:#cc3f20;box-shadow:0 4px 0 #9b341e}.attack>span{font-size:37px;font-weight:900;line-height:.8}.attack b{font-size:12px;margin-top:7px}.jump{width:63px;height:63px;right:75px;top:0}.dodge{width:67px;height:67px;left:14px;bottom:4px}.dodge>span{font-size:33px;line-height:.7}.combat-button.pressed{transform:translateY(3px);box-shadow:none;filter:brightness(.9)}.attack.charged{background:var(--ink);border-color:var(--ink);box-shadow:0 0 0 5px #ed4a2540}#dodge-cooldown{position:absolute;inset:0;background:#20221f55;transform-origin:bottom;transform:scaleY(0);pointer-events:none}.modal{position:absolute;inset:0;z-index:20;background:#e8e4dae8;backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:25px}.modal-card{width:420px;max-width:85vw;text-align:center;max-height:100%;overflow:auto}.modal-card .eyebrow{justify-content:center;color:var(--red);font-size:9px}.modal-card h2{font-size:32px;letter-spacing:-1.5px;margin:15px 0 12px}.modal-card p{font-size:12px;color:#77796f;line-height:1.7}.modal-card .primary{margin:22px auto 13px;width:250px}.text-button{background:transparent;font-size:11px;color:#6d7065;padding:9px 14px;text-decoration:underline;text-underline-offset:4px}.result-rank{font-size:72px;line-height:1;color:var(--red);font-style:italic;font-weight:1000}.result-card h2{margin-bottom:7px}.stats{border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;justify-content:space-around;padding:15px 0}.stats>div{display:flex;flex-direction:column;gap:8px}.stats small{font-size:7px;letter-spacing:1px}.stats b{font-size:23px;font-style:italic}.guide-card{width:600px}.guide-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px 25px;text-align:left;margin:20px 15px}.guide-grid b{font-size:17px;color:var(--red);letter-spacing:-.5px}.guide-grid b span{color:var(--ink);font-size:13px;margin-left:8px}.guide-grid p{font-size:11px;margin:6px 0}.guide-note{font-size:10px!important}.rotate-screen{display:none}.phone{width:52px;height:86px;border:3px solid var(--ink);border-radius:9px;display:grid;place-items:center;font-size:36px;transform:rotate(-90deg);margin-bottom:35px}.rotate-screen h2{font-size:25px;margin:16px 0 8px}.rotate-screen p{font-size:12px;line-height:1.9;text-align:center;color:#77796f}.rotate-screen>span:last-child{font-size:9px;letter-spacing:2px;margin-top:30px;color:#8d8f84}
@media(max-height:600px){#brand{top:18px;left:24px;font-size:13px}.edition{font-size:7px}.top-actions{top:14px;right:max(20px,env(safe-area-inset-right))}.intro{top:18%;left:7%}h1{font-size:clamp(68px,11vw,108px);margin:17px 0 14px;line-height:.78}.eyebrow{font-size:8px;letter-spacing:1.5px}.tagline{font-size:14px;margin-bottom:9px}.intro-copy{font-size:10px;line-height:1.65;margin-bottom:15px}.primary{padding:13px 17px;min-width:200px;font-size:12px}.home-links{margin-top:13px;gap:7px}.home-links button{font-size:9px}#best{font-size:8px}.home-footer{bottom:13px;left:24px;right:24px;padding-top:10px;font-size:7px}.art-label{right:6%;top:23%}.art-label b{font-size:20px}.player-panel{top:18px;left:max(22px,env(safe-area-inset-left));width:150px}.stage-panel{top:22px}.score-panel{top:18px;right:174px}#boss-hud{top:58px}.move-pad{bottom:30px;left:max(24px,env(safe-area-inset-left));width:140px;height:72px}.move-knob{height:54px;width:54px;left:42px;top:8px}.move-arrow{top:17px}.move-pad small{top:80px}.combat-pad{width:218px;height:137px;bottom:22px;right:max(22px,env(safe-area-inset-right))}.attack{width:83px;height:83px}.jump{width:57px;height:57px;right:69px}.dodge{width:61px;height:61px;left:15px}.modal-card h2{font-size:26px;margin:10px 0}.modal-card .primary{margin:14px auto 7px}.modal-card p{font-size:11px}.result-rank{font-size:55px}.stats{padding:10px 0}.stats b{font-size:19px}.guide-grid{margin:14px 15px;gap:5px 25px}.guide-grid p{font-size:10px}.guide-note{font-size:9px!important}.battle-tip{bottom:12px;font-size:8px}}
@media(max-height:420px) and (orientation:landscape){.intro{top:17%}h1{font-size:75px;margin:13px 0 11px}.intro-copy{margin-bottom:12px;font-size:9px}.tagline{font-size:13px}.home-links{margin-top:11px}.home-links #best{display:none}.home-footer{font-size:6px;bottom:10px}.art-label{top:23%;right:6%}.modal-card h2{font-size:23px}.result-card{width:510px}.result-card .result-rank{position:absolute;font-size:90px;margin-left:15px;margin-top:10px}.result-card .stats{margin-left:100px;min-height:65px;align-items:center}.result-card>p{margin:7px}.result-card .primary{margin-top:16px}.guide-card h2{font-size:23px}.guide-grid{margin:10px 15px;gap:4px 25px}.guide-grid p{margin:4px 0}.guide-note{margin:6px 0}.combo b{font-size:45px}}
@media(orientation:portrait){.rotate-screen{position:absolute;inset:0;z-index:40;background:var(--paper);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:30px}#controls{visibility:hidden}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
@media(max-height:600px){.art-label{display:none}}
@media(max-height:360px) and (orientation:landscape){.intro{top:18%}h1{font-size:59px;margin:11px 0 9px}.intro-copy{display:none}.tagline{margin-bottom:15px}.home-links{margin-top:11px}.home-footer{padding-top:8px}.guide-card .guide-note{display:none}.stage-panel{font-size:8px}.player-panel{width:125px}}
