:root{color-scheme:dark;font-family:"Nunito",system-ui,sans-serif;color:#fff0d4;background:#160b15;font-size:14px}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at top,#432333,#160b15 70%);min-height:100dvh}button,select,summary{font:inherit;color:inherit}button,select{min-height:38px;border:1px solid #a57245;border-radius:10px;background:#381d29;padding:7px 12px;cursor:pointer}button:hover,button:focus-visible,select:focus-visible{background:#60333d;outline:2px solid #ead299;outline-offset:2px}button:disabled{opacity:.45;cursor:default}.primary{background:#b34339;border-color:#efb657;font-weight:800}button[hidden],[hidden]{display:none!important}h1,h2{font-family:"Baloo 2",system-ui,sans-serif;line-height:1.05;margin:6px 0 10px}h1{font-size:26px}h1 br{display:none}small{color:#e7bb79;font-size:10px;letter-spacing:2px}p{line-height:1.45;margin:8px 0}#app{margin:auto;display:flex;flex-direction:column;align-items:center;gap:5px;padding:8px max(8px,env(safe-area-inset-right)) 8px max(8px,env(safe-area-inset-left));min-height:100dvh}.rail{width:min(480px,100%)}header{text-align:center}nav{display:flex;justify-content:center;gap:6px}nav button{font-size:12px;min-height:32px;padding:4px 10px}#hud{display:flex;justify-content:space-between;gap:5px;font-size:12px;margin-top:7px;flex-wrap:wrap}#hud strong{color:#edbe75}#powerHud{font-size:11px;min-height:16px;margin:4px 0;text-align:center;color:#8fdbb8}#notice{font-size:12px;color:#ffcc9b;text-align:center}#notice:empty{display:none}#launch{display:block;margin:0 auto 4px;font-size:12px;min-height:33px}#hint{font-size:11px;color:#dcc9ba;text-align:center;margin:3px 0}#court{position:relative;width:min(480px,calc(100vw - 16px),calc((100dvh - 244px)*.72727));aspect-ratio:480/660;border:2px solid #9d7146;border-radius:18px;overflow:hidden;box-shadow:0 12px 44px #0009;flex:none;min-width:160px}canvas{width:100%;height:100%;display:block;touch-action:none;outline:none}canvas:focus-visible{box-shadow:inset 0 0 0 3px #f7dda3}#ready{position:absolute;top:70%;left:12%;right:12%;text-align:center;pointer-events:none;font-size:clamp(11px,2vw,15px);color:#fff4d6;text-shadow:0 2px 4px #000;background:#29121dca;border:1px solid #b18354;border-radius:10px;padding:6px}dialog{border:1px solid #b18354;border-radius:18px;padding:18px;color:#fff0d4;background:#2c1622;max-width:min(430px,calc(100vw - 22px));width:430px;max-height:calc(100dvh - 24px);overflow:auto;box-shadow:0 16px 80px #000b}dialog::backdrop{background:#0b0610c9;backdrop-filter:blur(4px)}dialog h2{font-size:28px}dialog button{margin:4px 3px 4px 0}.cover{width:calc(100% + 36px);margin:-18px -18px 12px;aspect-ratio:16/7;object-fit:cover}.meta{display:grid;grid-template-columns:1fr 1fr;gap:4px;font-size:12px}.meta p{margin:3px 0}.meta #progress{grid-column:1/-1;color:#e9c176}label{display:flex;gap:8px;align-items:center;margin:9px 0;justify-content:space-between}label span{flex:1}select{max-width:64%;min-width:115px}summary{padding:10px 0;cursor:pointer;color:#e9c176}details p{font-size:12px}.settings input{width:20px;height:20px;accent-color:#cc5140}.powerGuide{display:grid;grid-template-columns:1fr 1fr;gap:8px}.powerGuide div{display:flex;align-items:center;gap:8px;font-size:13px}.powerGuide img{width:42px;height:42px;object-fit:contain}.medal{width:75px;display:block;margin:auto}#result{text-align:center}#resultStats{color:#eec67e;font-weight:800}#cosmetic{font-size:12px;color:#e9c176}
@media (min-width:760px),(orientation:landscape) and (max-height:520px){#app{flex-direction:row;justify-content:center;gap:24px;padding:10px;min-height:100dvh}.rail{width:240px;max-width:40vw}header{text-align:left}h1{font-size:36px}h1 br{display:block}nav{justify-content:flex-start;flex-wrap:wrap}#hud{display:grid;grid-template-columns:1fr 1fr;gap:12px;font-size:14px;margin:20px 0}#court{width:min(480px,calc((100dvh - 24px)*.72727),calc(60vw - 36px));min-width:130px}#launch{margin:12px 0;width:100%;font-size:14px}#hint,#powerHud,#notice{text-align:left}#ready{font-size:13px}}
@media (orientation:landscape) and (max-height:400px){.rail{width:215px}h1{font-size:26px}#hud{margin:10px 0;gap:6px;font-size:12px}small{letter-spacing:1px}#hint{font-size:10px}#app{gap:14px}}