@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@500;600;700;900&family=Noto+Sans+JP:wght@500;700;900&display=swap";:root{color:#fbf4ff;font-synthesis:none;--accent:#9a63d4;--accent-bright:#bd8df0;--ink:#241238;--line:#f4e2ff26;--muted:#b19dbd;background:#241238;font-family:DM Sans,Noto Sans JP,sans-serif}*{box-sizing:border-box}body{background:#241238;min-width:320px;min-height:100vh;margin:0}button{font:inherit}.app-shell{background:radial-gradient(circle at 28% 42%,#9a63d43b,#0000 28%),radial-gradient(circle at 78% 18%,#bd8df014,#0000 25%),#241238;grid-template-rows:auto 1fr auto;min-height:100vh;display:grid;overflow:hidden}.topbar{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;height:82px;padding:0 clamp(24px,5vw,72px);display:flex}.brand{color:#fff;letter-spacing:.16em;text-shadow:0 0 10px #bd8df04d;align-items:center;gap:11px;font-size:20px;font-weight:900;text-decoration:none;display:flex}.brand i{background:var(--accent-bright);border-radius:50%;width:16px;height:16px;box-shadow:0 0 12px #bd8df0d9,0 0 30px #9a63d47a}.topbar>p{color:#947fa1;letter-spacing:.32em;margin:0;font-size:10px;font-weight:700}.sound-button{border:1px solid var(--line);color:#fff;cursor:pointer;background:0 0;border-radius:50%;width:42px;height:42px;font-size:18px}.motivation{text-align:center;padding:17px 24px 0;transition:opacity .2s,transform .2s}.motivation.is-changing{opacity:0;transform:translateY(-5px)}.motivation span{color:var(--accent-bright);letter-spacing:.25em;text-shadow:0 0 10px #bd8df07a;margin-bottom:4px;font-size:8px;font-weight:900;display:block}.motivation p{color:#fff8ff;letter-spacing:.07em;text-shadow:0 0 8px #f0d5ff42,0 0 20px #9a63d424;margin:0;font-size:clamp(14px,1.5vw,19px);font-weight:700}main{grid-template-columns:minmax(0,1fr) 350px;align-items:center;gap:64px;width:min(1220px,100%);margin:auto;padding:40px 36px;display:grid}.run-panel{min-width:0}.status-row{color:#927e9f;letter-spacing:.16em;justify-content:space-between;align-items:center;font-size:10px;font-weight:800;display:flex}.live-chip{color:var(--accent-bright);border:1px solid #bd8df057;border-radius:30px;padding:8px 13px}.live-chip i{background:var(--accent-bright);width:6px;height:6px;box-shadow:0 0 10px var(--accent);border-radius:50%;margin-right:7px;display:inline-block}.count-stage{text-align:center;padding:14px 0 9px}.count-stage>p{color:var(--accent-bright);letter-spacing:.34em;text-shadow:0 0 12px #bd8df06b;margin:0;font-size:11px;font-weight:900}.count-stage>strong{letter-spacing:-.1em;font-variant-numeric:tabular-nums;text-shadow:0 0 12px #f1d7ff2e,0 0 32px #9a63d429;margin-left:.1em;font-size:clamp(118px,18vw,220px);font-weight:600;line-height:.9;transition:color .3s,text-shadow .3s;display:inline-block}.count-stage>strong.is-target-achieved{color:#ff8a2a;text-shadow:0 0 9px #ffa44ab8,0 0 25px #ff741f73,0 0 52px #ff601033}.count-stage>span{color:#9c88a8;margin-left:18px;font-size:18px;font-weight:800}.level-line{color:#d6c5df;letter-spacing:.12em;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;width:min(410px,85%);margin:18px auto 0;font-size:11px;display:grid}.level-line i{background:linear-gradient(90deg,transparent,var(--accent),transparent);height:1px}.court{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:linear-gradient(90deg,#9a63d40a,#9a63d424,#9a63d40a);height:84px;margin:18px 0 26px;position:relative;overflow:hidden}.line{background:var(--accent);width:3px;position:absolute;top:0;bottom:0;box-shadow:0 0 14px #9a63d4a6}.line span{color:#927d9e;letter-spacing:.12em;white-space:nowrap;font-size:8px;font-weight:900;position:absolute;top:8px}.line--start{left:7%}.line--start span{left:8px}.line--turn{right:7%}.line--turn span{right:8px}.court-dashes{border-top:1px dashed #e5ccf32e;position:absolute;top:50%;left:15%;right:15%}.runner{--run-progress:0;z-index:2;left:calc(8% + var(--run-progress) * 78%);place-items:center;transition:left .1s linear;display:grid;position:absolute;top:50%;transform:translate(-50%,-50%)}.runner.is-returning{left:calc(86% - var(--run-progress) * 78%)}.runner i{background:var(--accent);width:23px;height:23px;box-shadow:0 0 8px #fff,0 0 26px var(--accent);border:5px solid #fff;border-radius:50%}.runner span{color:#fff;letter-spacing:.12em;margin-top:4px;font-size:7px;font-weight:900}.next-signal{justify-content:space-between;align-items:center;width:min(470px,92%);margin:auto;display:flex}.next-signal>div:first-child{align-items:baseline;gap:9px;display:flex}.next-signal span{color:#8f7b9b;letter-spacing:.16em;font-size:9px;font-weight:800}.next-signal strong{font-variant-numeric:tabular-nums;font-size:32px}.next-signal small{color:var(--accent-bright);font-size:8px}.signal-bars{align-items:center;gap:5px;height:34px;display:flex}.signal-bars i{background:var(--accent-bright);border-radius:3px;width:3px;box-shadow:0 0 8px #bd8df07a}.signal-bars i:first-child,.signal-bars i:nth-child(5){height:9px}.signal-bars i:nth-child(2),.signal-bars i:nth-child(4){height:20px}.signal-bars i:nth-child(3){height:31px}.controls{justify-content:center;align-items:center;margin-top:28px;display:flex}.controls button{cursor:pointer}.start-button{color:#fff;background:linear-gradient(135deg,var(--accent-bright),#7845af);border:0;border-radius:30px;min-width:200px;height:58px;padding:0 34px;font-weight:900;box-shadow:0 8px 28px #9a63d44d,0 0 30px #9a63d426}.start-button span{margin-right:10px}.reset-action{color:#aa96b5;letter-spacing:.08em;cursor:pointer;background:0 0;border:0;margin:13px auto 0;padding:8px 18px;font-size:10px;font-weight:700;display:block}.side-panel{border:1px solid var(--line);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#401f53c2;border-radius:20px;padding:28px;box-shadow:0 26px 70px #07010c61}.panel-head{justify-content:space-between;align-items:center;margin-bottom:22px;display:flex}.panel-head span,.tip span{color:var(--accent-bright);letter-spacing:.2em;font-size:8px;font-weight:900}.panel-head h2{margin:4px 0 0;font-size:17px}.goal-card{background:linear-gradient(135deg,#9a63d433,#4d236326);border:1px solid #bd8df047;border-radius:14px;padding:20px}.goal-heading span{color:var(--muted);font-size:10px}.goal-card strong{margin:3px 0 13px;font-size:40px;display:block}.goal-card strong small{color:var(--muted);margin-left:5px;font-size:11px}.goal-meter{background:#523464;border-radius:5px;height:5px;overflow:hidden}.goal-meter i{border-radius:inherit;background:var(--accent-bright);width:0;height:100%;box-shadow:0 0 12px var(--accent);transition:width .2s;display:block}.goal-card p{text-align:right;color:#c8b4d2;margin:8px 0 0;font-size:9px}.metric-grid{grid-template-columns:1fr 1fr;gap:10px;margin-top:14px;display:grid}.metric-grid>div{border:1px solid var(--line);background:#250f3340;border-radius:12px;padding:15px}.metric-grid span{color:var(--muted);font-size:9px;display:block}.metric-grid strong{margin-top:5px;font-size:24px;display:block}.metric-grid small{color:var(--muted);margin-left:3px;font-size:9px}.tip{border-top:1px solid var(--line);margin-top:18px;padding-top:18px}.tip p{color:#c1aecb;margin:6px 0 0;font-size:10px;line-height:1.8}footer{border-top:1px solid var(--line);color:#786785;letter-spacing:.25em;justify-content:space-between;align-items:center;min-height:58px;padding:0 clamp(24px,5vw,72px);font-size:8px;font-weight:800;display:flex}footer p{margin:0}button{transition:transform .16s,border-color .16s}button:hover{border-color:var(--accent);transform:translateY(-1px)}button:focus-visible,a:focus-visible{outline:3px solid var(--accent-bright);outline-offset:3px}@media (width<=900px){main{grid-template-columns:1fr;gap:38px;padding:32px 24px}.side-panel{width:min(620px,100%);margin:auto}.count-stage>strong{font-size:clamp(126px,28vw,190px)}}@media (width<=480px){.topbar{height:68px;padding:0 18px}.topbar>p{display:none}.brand{font-size:17px}.motivation{padding:14px 16px 0}.motivation p{letter-spacing:.03em;font-size:13px}main{gap:30px;padding:24px 16px 32px}.count-stage{padding-top:25px}.count-stage>strong{font-size:42vw}.count-stage>span{margin-left:8px;font-size:15px}.court{height:76px;margin-top:12px}.next-signal{width:100%}.start-button{min-width:190px;height:58px;padding:0 26px}.side-panel{padding:22px 18px}footer{padding:0 18px}footer span{display:none}}@media (prefers-reduced-motion:reduce){*{transition:none!important}}.challenge-time{border:1px solid var(--line);background:#250f3340;border-radius:12px;gap:7px;margin-top:14px;padding:18px;display:grid}.challenge-time>span{color:var(--muted);font-size:11px}.challenge-time strong{font-variant-numeric:tabular-nums;color:#fff8ff;text-shadow:0 0 12px #bd8df059;font-size:36px;line-height:1.1}.challenge-time small{color:var(--muted);font-size:9px}.goal-heading{justify-content:space-between;align-items:center;display:flex}.goal-heading button{color:#d8c1e5;cursor:pointer;background:0 0;border:0;font-size:9px;text-decoration:underline}.goal-card form{border:1px solid #bd8df042;border-radius:9px;grid-template-columns:1fr 74px auto;align-items:center;gap:7px;margin:0 0 14px;padding:10px;display:grid}.goal-card form[hidden]{display:none}.goal-card form label{color:var(--muted);font-size:9px}.goal-card form input{border:1px solid var(--line);color:#fff;width:74px;height:34px;font:inherit;background:#3b1c4e;border-radius:7px;padding:0 7px}.goal-card form button{color:#fff;background:var(--accent);cursor:pointer;border:0;border-radius:7px;height:34px;padding:0 10px;font-size:9px;font-weight:900}