*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#10182c;color:#f6f4e9;font-family:Arial,Noto Sans JP,sans-serif}body{touch-action:none}#app{position:relative;margin:auto;width:min(100%,520px);height:100%;height:100dvh;background:radial-gradient(ellipse at 50% 60%,#253349 0,#10182c 72%);overflow:hidden}header{position:absolute;z-index:2;top:max(25px,env(safe-area-inset-top));left:28px;right:28px;display:flex;justify-content:space-between;pointer-events:none}.brand{font-size:12px;letter-spacing:3px;line-height:1.4}.brand b{font-size:19px;letter-spacing:5px}.records{display:flex;gap:28px;text-align:center;color:#9caabe;font-size:10px;letter-spacing:2px}.records strong{display:block;color:#f6f4e9;font-size:32px;letter-spacing:-1px;line-height:1.2}#game{position:absolute;top:0;right:0;bottom:0;left:0}canvas{display:block}#panel{position:absolute;z-index:3;top:23%;left:34px;right:34px}.eyebrow{color:#64dbc5;font-size:10px;letter-spacing:2px}h1{font-size:clamp(44px,11vw,64px);line-height:1.2;letter-spacing:-3px;margin:18px 0}h1 span{color:#7de4c4}p{font-size:13px;line-height:1.9;color:#aebcd0}button{margin-top:20px;width:100%;border:0;border-radius:4px;padding:18px 22px;background:#c8f078;color:#14252b;font-weight:700;font-size:16px;cursor:pointer;display:flex;justify-content:space-between}button:active{transform:translateY(2px)}.hint{text-align:center;font-size:10px;letter-spacing:1px}footer{position:absolute;bottom:max(22px,env(safe-area-inset-bottom));left:0;width:100%;display:flex;align-items:center;gap:12px;flex-direction:column;font-size:10px;letter-spacing:1px;color:#73839c;pointer-events:none}#streak{color:#b6c9d1}#feedback{position:absolute;top:25%;width:100%;text-align:center;color:#c8f078;font-size:22px;font-weight:700;letter-spacing:3px;pointer-events:none;transition:opacity .15s}#panel[hidden]{display:none}@media(max-height:600px){#panel{top:16%}h1{font-size:38px;margin:10px 0}button{margin-top:8px}footer{bottom:12px}}.ended #panel{top:18%;bottom:10%;pointer-events:none;display:flex;flex-direction:column;align-items:stretch}.ended #panel h1{font-size:23px;letter-spacing:0;margin:12px 0}.ended #description{display:grid;grid-template-columns:1fr 1fr;text-align:center;margin:10px -20px 0;gap:12px}.result-record{display:flex;flex-direction:column;font-size:12px;letter-spacing:2px}.result-record strong{font-size:38px;color:#c8f078;letter-spacing:0;line-height:1.4}.result-record:last-child strong{color:#a4c8ce}.result-record small{font-size:12px}.ended #start{margin-top:auto;pointer-events:auto}.ended #panel .hint{margin-bottom:0}.ended header .records{visibility:hidden}.ended footer>span:last-child{display:none}@media(max-height:600px){.ended #panel{top:16%;bottom:8%}.ended #panel h1{font-size:18px;margin:5px 0}.result-record strong{font-size:28px}.ended #description{margin-top:0}.ended #panel .hint{display:none}.ended #start{padding:12px 20px}}