@font-face{font-family:CFW Japanese;src:url(/fonts/japanese.ttf?v=0.4.0-ranking-ui) format("truetype");font-style:normal;font-weight:400 900;font-display:swap}:root{font-family:Trebuchet MS,Hiragino Kaku Gothic ProN,Yu Gothic,CFW Japanese,sans-serif;color:#ffedc1;background:#200e16;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden;overscroll-behavior:none}body{background:radial-gradient(ellipse at 50% 35%,#6b292c 0,#30151e 48%,#160d14)}body:before{content:"";position:fixed;inset:0;background:repeating-linear-gradient(90deg,transparent 0,transparent 90px,#ffd58e04 91px,#ffd58e04 92px);pointer-events:none}#viewport{position:absolute;inset:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);display:flex;align-items:center;justify-content:center}#stage{position:relative;flex:none;width:440px;height:820px;transform-origin:center center;overflow:hidden;border-radius:25px;box-shadow:0 35px 100px #0c040ccc,0 0 0 1px #e6b66a55;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;touch-action:none}canvas{position:absolute;inset:0;width:440px;height:820px;touch-action:none}button{font:inherit;cursor:pointer;color:inherit;border:0;touch-action:manipulation;transition:filter .15s,transform .15s}button:hover{filter:brightness(1.1)}button:active{transform:translateY(3px)}button:focus-visible{outline:3px solid #ffeb97;outline-offset:4px}button:disabled{filter:saturate(.5);opacity:.6;cursor:default}button:disabled:active{transform:none}.hidden{display:none!important}.game-header{position:absolute;top:24px;left:29px;right:25px;height:46px;display:flex;align-items:center;justify-content:space-between}.brand{font-size:16px;font-weight:900;letter-spacing:.3px;line-height:19px;text-shadow:0 2px #38101b}.brand span{display:block;font-size:9px;letter-spacing:5px;color:#dbae6a;margin-bottom:1px}.brand b{color:#ffc769}.header-actions{display:flex;gap:8px}.icon-button{position:relative;width:44px;height:44px;border-radius:14px;background:linear-gradient(#a44739,#70212a);border:1px solid #d8995f80;box-shadow:0 3px #3f1620,inset 0 1px #ffc88033;font-size:23px;font-weight:900;color:#ffe0a2}.icon-button.sound-off:after{content:"";position:absolute;left:8px;top:21px;width:28px;height:3px;border-radius:2px;background:#ffe0a2;box-shadow:0 1px #5c2025;transform:rotate(-45deg);pointer-events:none}.scoreboard{position:absolute;top:86px;left:52px;width:336px;height:54px;border:1px solid #e7aa6055;border-radius:16px;background:linear-gradient(100deg,#36111ca6,#642326bb,#36111ca6);display:flex;align-items:center;justify-content:space-around;box-shadow:inset 0 2px 8px #23081155}.scoreboard>div{width:135px;text-align:center}.scoreboard small{display:block;font-size:9px;letter-spacing:2px;color:#d8b388}.scoreboard strong{display:block;font-size:27px;line-height:30px;color:#ffdf93;text-shadow:0 2px 0 #4c221e}.score-ornament{color:#d79c57;font-size:19px}.status{position:absolute;left:52px;right:52px;top:148px;display:flex;justify-content:space-between;font-size:10px;color:#e3b384;letter-spacing:.3px}.combo-status,.miss-status{display:grid;grid-template-columns:auto auto;align-items:center;column-gap:4px;min-width:92px;margin-top:-7px;padding:4px 8px 3px;border:1px solid #e9a45f88;border-radius:10px;background:#431722d9;color:#ffd794;text-align:center;box-shadow:0 2px #260c15aa}.combo-status{margin-left:0}.combo-status b,.miss-status b{color:#ff9675;font-size:10px;letter-spacing:1px}.combo-status b{color:#f5bb6d}.combo-status strong,.miss-status strong{color:#fff0b3;font-size:12px}.combo-status small,.miss-status small{grid-column:1 / -1;font-size:7px;line-height:8px;color:#d7a786;letter-spacing:.5px}.combo-status.active{border-color:#f5bb6dcc;background:#5a2021e8}.combo-status.active strong{color:#ffe184}.miss-status.danger{border-color:#ff795f;background:#6b2025e8;animation:miss-pulse .8s infinite alternate}@keyframes miss-pulse{to{filter:brightness(1.25)}}#selection{position:absolute;top:635px;width:100%;text-align:center;font-size:10px;color:#ffdf9c;pointer-events:none}.actions{position:absolute;top:731px;left:25px;right:25px;display:flex;gap:12px;height:59px}.item-button{position:relative;flex:1;display:flex;align-items:center;gap:5px;border-radius:16px;border:1px solid #e9b65d;background:linear-gradient(160deg,#dbad55 0,#a36b2f 42%,#865025);box-shadow:0 5px #412119,0 8px 12px #210d1c55,inset 0 2px 1px #ffe6a877;text-align:left}.item-icon{font-size:31px;filter:drop-shadow(0 3px 1px #60382266);margin-left:2px}.item-button b{display:block;font-size:14px;text-shadow:0 2px #693a22}.item-button small{display:block;font-size:9px;color:#ffe1a9;margin-top:4px}.item-button i{position:absolute;right:-5px;top:-8px;width:23px;height:23px;background:linear-gradient(#fff1b3,#ffc15f);border:2px solid #8a4a29;border-radius:50%;font-size:12px;color:#642d1c;display:grid;place-items:center;font-style:normal;font-weight:700}.rotate-button{width:63px;flex:none;border-radius:14px;border:1px solid #d69b6277;background:linear-gradient(#8b4434,#522432);box-shadow:0 4px #35121d}.rotate-button>span{display:block;font-size:29px;line-height:29px}.rotate-button b{font-size:10px;letter-spacing:2px}.bottom-note{position:absolute;top:794px;width:100%;margin:0;text-align:center;font-size:8px;letter-spacing:1.5px;color:#c59171}.title-screen{position:absolute;inset:0;pointer-events:none}.title-screen button,.title-screen .ad-slot.has-content,.title-screen .ad-slot.has-content *{pointer-events:auto}.title-top{position:absolute;left:28px;right:28px;top:29px;display:flex;align-items:center;justify-content:flex-end}.title-logo{position:absolute;top:68px;width:100%;text-align:center;transform:rotate(-3deg)}.title-logo>span{font-size:40px;font-weight:1000;letter-spacing:8px;color:#fff0b6;-webkit-text-stroke:1px #8e4326;text-shadow:0 3px #953e26,0 5px #401420}.title-logo>strong{display:block;font-family:Impact,Arial Black,sans-serif;font-size:87px;line-height:.88;letter-spacing:3px;background:linear-gradient(#fff6bf 0,#ffe993 20%,#ffc555 53%,#f19a36);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-stroke:2px #8e3824;filter:drop-shadow(0 4px 0 #ffe09b) drop-shadow(0 7px 0 #772523) drop-shadow(0 8px 5px #240b14)}.title-logo p{font-size:13px;font-weight:700;letter-spacing:2px;color:#fff0c5;text-shadow:0 2px #6d201f;transform:rotate(3deg);margin-top:18px}.title-bottom{position:absolute;top:548px;left:51px;right:51px;text-align:center}.play-button{height:69px;width:100%;border-radius:20px;background:linear-gradient(#fff0a5 0,#ffda70 10%,#f6b33e 65%,#e69226);border:2px solid #ffe1a0;box-shadow:0 6px #9e471e,0 9px #3f1320,0 13px 24px #1e091755,inset 0 3px #fff5c8;font-size:32px;font-weight:1000;letter-spacing:4px;color:#6d291e;text-shadow:0 1px #ffe9a5}.play-button>span{font-size:24px;margin-left:30px}.title-bottom>.play-button{animation:play-glow 2.8s infinite}.ranking-title-button{width:74%;min-height:42px;margin-top:16px;border:1px solid #d4a15f;border-radius:13px;background:linear-gradient(#75302d,#4b1c26);box-shadow:0 4px #2d1019;color:#f0ca8c;font-size:13px;font-weight:900;letter-spacing:3px}.title-best{font-size:11px;letter-spacing:2px;margin:17px 0 4px;color:#dcb17b}.title-best b{color:#ffe7a3;font-size:18px;letter-spacing:1px;margin-left:9px}.text-button{background:none;color:#e6bb83;font-size:11px;min-height:44px;padding:8px 12px}.tutorial{position:absolute;left:27px;right:27px;top:644px;min-height:78px;max-height:90px;border:1px solid #eac17d;border-radius:14px;background:linear-gradient(130deg,#fff2cc,#f0d6a1);color:#673b27;padding:7px 13px 8px;box-shadow:0 5px 15px #35121d66}.tutorial-heading{display:flex;align-items:center;justify-content:space-between;height:16px;font-size:9px;color:#ab6738}.tutorial .text-button{font-size:10px;color:#97633d;min-height:30px;padding:4px 0}.tutorial>b{display:block;font-size:14px;margin:3px 0}.tutorial p{font-size:11px;margin:0;line-height:1.5}.tutorial:has(.small-gold:not(.hidden)){top:630px;max-height:102px}.small-gold{display:block;position:absolute;right:8px;top:54px;height:40px;border-radius:9px;background:linear-gradient(#ffc66d,#e8a045);color:#663a22;font-size:11px;font-weight:700;padding:0 12px}.tutorial:has(.small-gold:not(.hidden)) p{padding-right:93px}.modal{position:absolute;inset:0;display:grid;place-items:center;background:#230d18ba;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);padding:32px}.modal-card{width:100%;border-radius:26px;border:2px solid #edbd70;background:radial-gradient(ellipse at top,#a64b35,#6e2429 62%,#4a1b26);box-shadow:0 15px 50px #18071399,inset 0 0 0 5px #ffc37715;padding:33px 25px;text-align:center}.modal-card>span{font-size:10px;letter-spacing:3px;color:#f2c78a}.modal-card h1{font-size:24px;margin:18px -8px;color:#ffe9aa;text-shadow:0 3px #602322}.modal-card>p{font-size:12px;line-height:1.8;color:#edc59c;margin-bottom:25px}#result-score{margin:10px 0 26px}#result-score small{font-size:10px;letter-spacing:4px;color:#e3b375}#result-score strong{display:block;font-size:56px;color:#ffe494;text-shadow:0 4px #763322}#result-score p{font-size:11px;color:#e9bf89}#result-score p span{padding:0 10px}.modal .play-button{font-size:23px}.secondary-button{height:48px;width:100%;margin-top:19px;background:#4b1c24;border:1px solid #bc804e;border-radius:13px;letter-spacing:3px;font-size:14px;font-weight:700;color:#e8bd86}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes play-glow{0%,to{filter:drop-shadow(0 0 0 #ffc05300)}50%{filter:drop-shadow(0 0 12px #ffc05355)}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}@media(max-width:480px){#stage{border-radius:0;box-shadow:none}}.item-icon{width:36px;height:42px;flex:none}.item-icon svg{width:100%;height:100%;display:block}.version{position:absolute;right:19px;bottom:12px;font-size:10px;letter-spacing:1px;opacity:.35}.status{top:146px}.skill-button{position:absolute;top:168px;left:26px;width:151px;min-height:65px;padding:8px;border:1px solid #d39a51;border-radius:13px;background:linear-gradient(145deg,#963e30,#481924);box-shadow:0 4px #32131b;text-align:left}#skill-label{display:block;font-size:10px;font-weight:700}#skill-state{display:block;font-size:12px;color:#ffe39a;margin:5px 0}.skill-track{display:block;height:4px;border-radius:3px;background:#30141d;overflow:hidden}.skill-track i{display:block;height:100%;background:linear-gradient(90deg,#f0a43d,#fff0a5)}.skill-button.ready{opacity:1;border-color:#fff0a2;box-shadow:0 3px #814222,0 0 15px #ffd97788;animation:play-glow 1s infinite}.actions{top:727px;left:18px;right:18px;gap:8px;height:66px}.rotate-button{width:100px;border-color:#e4ac67}.rotate-button:not(:disabled){background:linear-gradient(#ffe89c,#cd8635);color:#642d22;box-shadow:0 4px #59261f,0 0 12px #ffd66a66}.rotate-button b{font-size:14px}.item-button{padding:4px;gap:2px}.item-icon{width:26px}.item-button small{font-size:9px;line-height:1.5;margin-top:2px}.item-button b{font-size:13px}.character-card{display:flex;width:100%;align-items:center;gap:12px;padding:15px 12px;margin:13px 0;border:1px solid #e7ae62;border-radius:18px;background:linear-gradient(135deg,#b5663a,#63232a);text-align:left;box-shadow:0 5px #37151e,inset 0 2px #ffe5a533}.character-icon{font-size:39px}.character-card b,.character-card strong,.character-card small,.character-card em{display:block}.character-card b{font-size:20px;color:#ffe89f}.character-card strong{font-size:13px;margin:5px 0}.character-card small{font-size:11px;line-height:1.6}.character-card em{font-size:10px;margin-top:6px;color:#ffe18b;font-style:normal}.select-card{max-height:756px;overflow-y:auto;padding:18px}.select-card h1{margin:9px -8px 10px}.select-card>.select-guide{margin:8px 0}.ranking-name-field{text-align:left}.ranking-name-field label{display:block;margin-bottom:5px;color:#ffe6a0;font-size:12px;font-weight:900;letter-spacing:1px}.ranking-name-input{position:relative}.ranking-name-input input{width:100%;height:44px;padding:0 76px 0 12px;border:1px solid #e0ae68;border-radius:11px;outline:none;background:#32131dcc;color:#fff0bd;font:inherit;font-size:15px;user-select:text;-webkit-user-select:text;touch-action:manipulation}.ranking-name-input input:focus{border-color:#fff0a3;box-shadow:0 0 0 2px #ffd77c55}.ranking-name-input input[aria-invalid=true]{border-color:#ff8a73}.ranking-name-input span{position:absolute;right:10px;top:15px;color:#cfa77e;font-size:10px}.ranking-name-field>small{display:block;margin-top:5px;color:#dcb38c;font-size:9px}#ranking-name-feedback{min-height:14px;margin:3px 0 0;color:#ffc1aa;font-size:10px;line-height:14px}.select-card .character-card{min-height:96px;margin:9px 0;padding:9px 12px}.select-card .secondary-button{margin-top:10px}#modal .modal-card{padding:22px}#modal .modal-card h1{margin:12px 0}#modal .modal-card>p{margin:8px 0 12px}#result-score{margin:8px 0 18px}#result-score strong{font-size:52px}#result-score .result-best{margin:5px;font-size:15px}.record-banner{margin-bottom:10px;font-size:14px;letter-spacing:2px}.new-record .record-banner{font-size:23px;font-weight:1000;color:#fff2a5;text-shadow:0 2px #bd6628,0 0 14px #ffd34e;animation:record-pop .8s ease-out,play-glow 1.4s infinite}.new-record .modal-card{box-shadow:0 0 60px #ffb94277,inset 0 0 35px #ffd77022}.ranking-submit-status{min-height:22px;margin:-9px 0 9px;color:#ffe28f;font-size:12px;font-weight:700}.small-secondary{min-height:40px;margin:0 4px 12px;padding:0 15px;border:1px solid #c99057;border-radius:10px;background:#4b1c24;color:#f0c88e;font-size:12px;font-weight:700}.ranking-modal{z-index:80;padding:22px}.ranking-card{display:flex;flex-direction:column;max-height:776px;padding:23px 18px 18px}.ranking-card h1{margin:10px 0 14px}.ranking-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;flex:none}.ranking-tabs button{min-height:42px;border:1px solid #bd7c4d;border-radius:10px;background:#451720;color:#d7ab7c;font-size:12px;font-weight:700}.ranking-tabs button[aria-selected=true]{border-color:#ffe094;background:linear-gradient(#e0a64d,#a55a2f);color:#4c1c1d;box-shadow:inset 0 1px #fff0b4}.ranking-content{flex:1 1 520px;min-height:180px;margin-top:12px;overflow-y:auto;border:1px solid #c888554d;border-radius:13px;background:#35121b99;overscroll-behavior:contain}.ranking-state{display:grid;min-height:180px;place-items:center;padding:20px;color:#e8c398;font-size:12px}.ranking-content>.small-secondary{display:block;margin:-66px auto 24px}.ranking-list{margin:0;padding:0;list-style:none}.ranking-list li{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:8px;min-height:55px;padding:7px 10px;border-bottom:1px solid #d29a5d2e;text-align:left}.ranking-list li:last-child{border-bottom:0}.ranking-rank{color:#f1b65e;font-size:18px;text-align:center}.ranking-list li:nth-child(-n+3) .ranking-rank{color:#ffe699;text-shadow:0 0 8px #ffc84c99}.ranking-player{min-width:0}.ranking-player strong,.ranking-player small{display:block}.ranking-player strong{overflow:hidden;color:#fff0c0;font-size:13px;text-overflow:ellipsis;white-space:nowrap}.ranking-player small{margin-top:3px;color:#cba17a;font-size:9px}.ranking-score{color:#ffd678;font-size:15px;font-weight:900;font-variant-numeric:tabular-nums}.ranking-card>.secondary-button{flex:none;margin-top:12px}.record-score{text-shadow:0 0 14px #ffc548!important}.record-gap{display:block;color:#ffe788;font-size:19px;margin:10px 0}.result-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px;background:#32131b66;border-radius:14px}.result-stats dt{font-size:10px;color:#dcb48d}.result-stats dd{margin:4px 0 0;font-size:20px;font-weight:700}#retry{height:76px;font-size:31px;animation:play-glow 1.5s infinite}@keyframes record-pop{0%{transform:scale(.5) rotate(-8deg)}to{transform:scale(1)}}canvas.character-icon{position:static;width:68px;height:68px;flex:none}.skill-button{width:135px}.skill-button:disabled{opacity:.85}.status{top:146px;left:52px;right:52px}.status>span:last-child{color:#ffcf91;font-weight:800}#player-skill-hud.actions{top:727px;left:16px;right:16px;gap:6px;height:74px;align-items:stretch}#player-skill-hud>#beer{width:142px;flex:none}#player-skill-hud>#skill{position:static;width:158px;min-height:74px;flex:none;padding:7px 9px}#player-skill-hud>#rotate{width:96px;flex:none;min-height:74px}#player-skill-hud .item-button{min-height:74px}#player-skill-hud .item-icon{width:30px;height:42px}#player-skill-hud .item-button b{font-size:14px}#player-skill-hud .item-button small{white-space:nowrap;line-height:1.25}#player-skill-hud .item-button i{top:4px;right:5px;width:auto;min-width:27px;height:20px;padding:0 3px;border-radius:9px;font-size:9px}#player-skill-hud .skill-button #skill-label{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#player-skill-hud .skill-button #skill-state{font-size:11px;line-height:1.2;min-height:27px;margin:4px 0 2px}#player-skill-hud .rotate-button>span{font-size:31px}#player-skill-hud .rotate-button b{font-size:13px}.tutorial{top:608px;min-height:112px;max-height:128px;z-index:25}.tutorial.tutorial-info{top:571px;min-height:145px;max-height:175px}.tutorial.tutorial-info p{line-height:1.45;white-space:pre-line}.tutorial .small-gold{top:auto;bottom:7px;height:36px;min-width:76px}.tutorial .small-gold.hidden{display:none!important}.tutorial.tutorial-info p{padding-right:95px}.ad-slot{display:none}.ad-slot[hidden]{display:none!important}.ad-slot.has-content{display:block;width:100%;max-width:320px;max-height:64px;margin:16px auto 0;overflow:hidden;color:#d2a67b;font-size:9px;letter-spacing:1px;text-align:center}.ad-slot.has-content small{display:block;height:14px;color:#c18f68;font-size:9px}.ad-container{width:100%;max-width:320px;max-height:50px;overflow:hidden}.ad-container>*{display:block;width:100%;height:50px;max-width:100%;max-height:50px;overflow:hidden}.ad-dev-placeholder,.ad-test-content{height:50px;display:grid;place-items:center;border:1px solid #c38e5b66;border-radius:7px;background:#2f1820aa;color:#d4a67c;font-size:9px;letter-spacing:1px}.title-bottom>.ad-slot.has-content{margin-top:6px}#modal .ad-slot.has-content{margin-top:24px}#modal .modal-card{max-height:760px;overflow-y:auto}@media(max-width:350px),(max-height:650px){.ad-slot.has-content,.ad-slot{display:none!important}}
