*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{overscroll-behavior:none;color:#4a3b32;background:#fdf6ec;height:100%;margin:0;font-family:Hiragino Maru Gothic ProN,Hiragino Sans,Noto Sans JP,sans-serif;overflow:hidden}#app{position:fixed;inset:0}.screen{display:none;position:absolute;inset:0}.screen.active{display:block}button{cursor:pointer;font-family:inherit}.btn{color:#fff;background:#f08a4b;border:0;border-radius:999px;width:100%;margin-top:10px;padding:14px;font-size:18px;font-weight:800;display:block;box-shadow:0 4px #c96a32}.btn:active{transform:translateY(2px);box-shadow:0 2px #c96a32}.btn.big{padding:18px;font-size:22px}.btn.ghost{color:#f08a4b;background:#fff;box-shadow:0 4px #ecd2bd}#title{background:radial-gradient(circle at 50% 30%,#fff3df,#f9d9b5);overflow-y:auto}.title-inner{max-width:420px;padding:max(48px, env(safe-area-inset-top)) 24px 32px;text-align:center;margin:0 auto}.logo{color:#f08a4b;letter-spacing:.04em;text-shadow:3px 3px #fff;white-space:nowrap;font-size:clamp(30px,12.5vw,54px);font-weight:900}.logo span{color:#4a3b32}.lead{margin:8px 0 28px;line-height:1.8}.howto{text-align:left;background:#ffffffb3;border-radius:16px;margin-top:26px;padding:12px 16px;font-size:13px;line-height:2}.howto b{color:#f08a4b;min-width:4.5em;display:inline-block}.view{cursor:crosshair;touch-action:none;position:absolute;inset:0}.view canvas{display:block}.frame{pointer-events:none;position:absolute;inset:12% 10%}.frame i{border:4px solid #ffffffe6;width:34px;height:34px;position:absolute}.frame i:first-child{border-bottom:0;border-right:0;top:0;left:0}.frame i:nth-child(2){border-bottom:0;border-left:0;top:0;right:0}.frame i:nth-child(3){border-top:0;border-right:0;bottom:0;left:0}.frame i:nth-child(4){border-top:0;border-left:0;bottom:0;right:0}.flash{pointer-events:none;position:absolute;inset:0;overflow:hidden}.flash i{position:absolute;left:0;right:0}.flash .curtain{background:#120e0b;height:50%;transform:scaleY(0)}.flash .top{transform-origin:top;top:0}.flash .bottom{transform-origin:bottom;bottom:0}.flash .glow{opacity:0;background:radial-gradient(circle,#fffaf059,#fffaf000 70%);inset:0}.flash.go .curtain{animation:.16s ease-in-out curtain}.flash.go .glow{animation:.3s ease-out 50ms glow}@keyframes curtain{0%{transform:scaleY(0)}40%,55%{transform:scaleY(1.02)}to{transform:scaleY(0)}}@keyframes glow{0%{opacity:1}to{opacity:0}}@media (prefers-reduced-motion:reduce){.flash.go .curtain{animation:none}}.hud-top{top:max(10px, env(safe-area-inset-top));pointer-events:none;align-items:center;gap:clamp(4px,2vw,10px);display:flex;position:absolute;left:10px;right:10px}.pill{color:#fff;font-variant-numeric:tabular-nums;white-space:nowrap;background:#4a3b32bf;border-radius:999px;flex-shrink:0;padding:6px 12px;font-weight:800}.progress{background:#ffffff80;border-radius:99px;flex:1;min-width:48px;height:8px;overflow:hidden}.progress div{background:#f08a4b;width:0;height:100%}.hud-bottom{right:12px;bottom:max(14px, env(safe-area-inset-bottom));align-items:flex-end;gap:10px;display:flex;position:absolute}.round{color:#fff;background:#4a3b32a6;border:3px solid #fff;border-radius:50%;width:58px;height:58px;font-size:24px;position:relative}.round.shoot{background:#f08a4b;width:76px;height:76px;font-size:30px}.round.cool{opacity:.45}.round.on{background:#2e86de}.round span{background:#4a3b32;border-radius:99px;padding:1px 6px;font-size:12px;position:absolute;top:-4px;right:-4px}.round span:empty{display:none}.last-shot{left:12px;bottom:max(14px, env(safe-area-inset-bottom));pointer-events:none;flex-direction:column;gap:6px;display:flex;position:absolute}.shot{background:#fff;border-radius:6px;width:150px;padding:5px 5px 4px;font-size:11px;transition:opacity .5s,transform .5s;transform:rotate(-2deg);box-shadow:0 3px 10px #00000040}.shot img{border-radius:3px;width:100%;display:block}.shot b{color:#f08a4b;float:right}.shot.out{opacity:0;transform:translate(-30px)rotate(-6deg)}#album,#dex{background:#fdf6ec;overflow-y:auto}.album-inner{max-width:900px;padding:max(24px, env(safe-area-inset-top)) 16px 40px;margin:0 auto}h2{margin:0 0 6px;font-size:26px}.sensei{background:#fff;border-radius:14px;padding:10px 14px;line-height:1.6}.total{margin:12px 0;font-size:18px}.total b{color:#f08a4b;font-size:38px}.best{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px;display:grid}.card{background:#fff;border-radius:10px;padding:8px;position:relative;box-shadow:0 2px 8px #4a3b3226}.card img{border-radius:6px;width:100%;display:block}.card .cap{margin-top:6px}.card em{color:#e74c3c;font-style:normal;font-weight:900}.card .detail{color:#8a7a6e;margin-top:2px;font-size:11px}.card .comment{margin-top:4px;font-size:13px}.card.empty .ph{aspect-ratio:16/10;color:#c9b8a5;background:#efe6da;border-radius:6px;place-items:center;font-size:40px;display:grid}.rank{color:#fff;background:#95a5a6;border:3px solid #fff;border-radius:50%;place-items:center;width:40px;height:40px;font-size:22px;font-weight:900;display:grid;position:absolute;top:2px;right:2px}.r-S{background:#f1c40f}.r-A{background:#e67e22}.r-B{background:#3498db}.r-C{background:#2ecc71}details{margin-top:18px}.all{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px;margin-top:10px;display:grid}.all figure{text-align:center;margin:0;font-size:11px}.all img{border-radius:4px;width:100%}.row{gap:10px;max-width:420px;margin:20px auto 0;display:flex}kbd{color:#4a3b32;background:#fff;border:1px solid #c9b8a5;border-bottom-width:2px;border-radius:4px;padding:0 5px;font-family:inherit;font-size:11px;line-height:16px;display:inline-block}.round kbd{white-space:nowrap;position:absolute;bottom:-9px;left:50%;transform:translate(-50%)}h3{margin:26px 0 10px;font-size:18px}.share-x{color:#fff;background:#111;border:0;border-radius:999px;width:100%;margin-top:8px;padding:8px;font-size:13px;font-weight:800}.share-x:disabled{opacity:.5}.share-toast{color:#2e7d32;background:#fdf6ec;min-height:20px;padding:6px 0;font-size:14px;font-weight:700;position:sticky;bottom:10px}.pause-btn{pointer-events:auto;cursor:pointer;border:0;font-size:16px}.speed{display:none;position:absolute;top:calc(100% + 8px);left:0}.speed.show{display:block}.hud-speed{right:12px;bottom:calc(max(14px, env(safe-area-inset-bottom)) + 96px);flex-direction:column;gap:14px;display:flex;position:absolute}.round.small{width:46px;height:46px;font-size:20px}.pause-menu{z-index:10;background:#4a3b328c;place-items:center;display:grid;position:absolute;inset:0}.pause-menu[hidden]{display:none}.pause-card{text-align:center;background:#fdf6ec;border-radius:20px;width:min(340px,86vw);padding:22px}.pause-card p{color:#8a7a6e;font-size:13px}.rule{color:#8a7a6e;margin:-6px 0 12px;font-size:12px}.course-list{gap:12px;margin-top:14px;display:grid}.course{text-align:left;color:#4a3b32;background:#fff;border:0;border-radius:16px;grid-template-rows:auto auto;grid-template-columns:56px 1fr auto;align-items:center;column-gap:12px;padding:14px 16px;font-family:inherit;display:grid;box-shadow:0 3px #ecd2bd}.course .emoji{text-align:center;grid-row:1/3;font-size:38px}.course b{font-size:19px}.course small{color:#8a7a6e;grid-column:2;line-height:1.5}.course i{color:#f08a4b;grid-area:1/3/3;font-size:13px;font-style:normal;font-weight:800}.course:active{transform:translateY(2px);box-shadow:0 1px #ecd2bd}.record{color:#e74c3c;font-size:15px;font-style:normal;font-weight:900}button,.hud-top,.hud-bottom,.hud-speed{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:manipulation}.gyro-btn,.touch-only{display:none}body.touch .gyro-btn,body.touch .touch-only{display:block}.gyro-btn.on{background:#2e86de}.toast-msg{top:calc(max(10px, env(safe-area-inset-top)) + 46px);color:#fff;opacity:0;pointer-events:none;white-space:nowrap;background:#4a3b32d9;border-radius:999px;padding:8px 14px;font-size:13px;transition:opacity .3s;position:absolute;left:50%;transform:translate(-50%)}.toast-msg.show{opacity:1}.rotate-hint{top:calc(max(10px, env(safe-area-inset-top)) + 46px);color:#4a3b32;pointer-events:none;background:#ffffffd9;border-radius:999px;padding:6px 10px;font-size:12px;display:none;position:absolute;right:10px}@media (orientation:portrait) and (pointer:coarse){.rotate-hint{animation:6s forwards hintfade;display:block}}@keyframes hintfade{0%,80%{opacity:1}to{opacity:0}}.hud-top,.hud-bottom,.hud-speed,.last-shot{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}@media (width<=520px),(height<=460px){.round{width:52px;height:52px;font-size:22px}.round.shoot{width:68px;height:68px}.round.small{width:42px;height:42px}.round kbd{display:none}.shot{width:110px;font-size:10px}.frame{inset:14% 6%}.pill{padding:5px 10px;font-size:14px}}@media (height<=460px){.last-shot .shot:nth-child(n+3){display:none}.hud-speed{bottom:calc(max(10px, env(safe-area-inset-bottom)) + 80px);gap:10px}}.shot img,.card img,.all img{aspect-ratio:4/3;object-fit:cover}.share-link{color:#2e86de;word-break:break-all;margin-top:6px;font-size:12px;display:block}.btn,.share-x,.course b,.course i,h2,h3{white-space:nowrap}.btn{text-overflow:ellipsis;overflow:hidden}@media (width<=360px){.pill{padding:5px 8px;font-size:13px}.hud-top{left:6px;right:6px}.btn{font-size:16px}.btn.big{font-size:20px}h2{font-size:22px}}.course{grid-template-columns:auto minmax(0,1fr) auto;width:100%}.course b,.course small{text-overflow:ellipsis;min-width:0;overflow:hidden}.course small{white-space:normal}@media (width<=380px){.course{grid-template-rows:auto auto auto;grid-template-columns:auto minmax(0,1fr)}.course .emoji{grid-row:1/4;font-size:30px}.course i{grid-area:3/2}}.ph{display:inline-block}.lead{text-wrap:balance}.howto{text-align:left;background:#ffffffb3;border-radius:16px;grid-template-columns:auto 1fr;gap:6px 12px;margin:26px 0 0;padding:12px 16px;font-size:13px;line-height:1.6;display:grid}.howto dt{color:#f08a4b;white-space:nowrap;font-weight:800}.howto dd{min-width:0;margin:0}.howto .sp{display:none}body.touch .howto .sp{display:inline}body.touch .howto .pc{display:none}.secret-hint{color:#a08c7c;margin-top:10px;font-size:12px}@media (width<=520px) and (orientation:portrait){.last-shot,.hud-speed{bottom:calc(max(14px, env(safe-area-inset-bottom)) + 84px)}}