:root{color-scheme:dark;--bg:#111a2c;--surface:#1b2639;--surface2:#263349;--line:#334158;--ink:#f5f7ff;--muted:#aab6cb;--green:#53dba7;--red:#ff848f;font-family:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Noto Sans JP","Yu Gothic",sans-serif;-webkit-tap-highlight-color:transparent}
*{box-sizing:border-box}body{background:radial-gradient(circle at 50% 0%,#1c2d47 0, var(--bg) 58%);color:var(--ink);margin:0;min-height:100dvh}.app{width:min(100%,740px);margin:auto;padding:calc(20px + env(safe-area-inset-top)) 18px calc(20px + env(safe-area-inset-bottom))}.topbar{display:flex;justify-content:space-between;align-items:center;gap:10px}.brand{display:flex;align-items:center;gap:12px}.brand-icon{display:grid;place-items:center;border-radius:14px;background:linear-gradient(130deg,#2dc58c,#ef7583);font-size:20px;letter-spacing:-4px;font-weight:800;width:48px;height:48px;padding-right:4px}.brand h1{font-size:21px;line-height:1.3;margin:0}.brand p{margin:3px 0 0;color:var(--muted);font-size:12px}.settings-toggle,.close-settings{color:#f1f5fc;background:#2a3a50;border:1px solid #45546a;border-radius:12px;padding:10px 13px;font-size:14px;font-weight:700;white-space:nowrap;cursor:pointer}.play-area{padding:clamp(20px,6dvh,65px) 0 24px;text-align:center}.rate-chip{display:inline-flex;align-items:center;gap:7px;background:#2b3950;border:1px solid #384760;padding:8px 16px;border-radius:50px;color:#bac6dc;font-size:13px;margin-bottom:21px}.rate-chip strong{color:#fff;font-size:16px}.judges{display:grid;grid-template-columns:1fr 1fr;gap:15px}.judge{min-width:0;border:none;border-radius:26px;min-height:clamp(210px,42dvh,345px);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;box-shadow:inset 0 2px 0 #ffffff24,0 16px 30px #00000028;cursor:pointer;touch-action:manipulation;transition:transform .09s ease,filter .15s ease}.judge:active,.judge.pressed{transform:scale(.96);filter:brightness(1.1)}.judge:focus-visible,.settings-toggle:focus-visible,.close-settings:focus-visible{outline:3px solid white;outline-offset:3px}.judge-ok{color:#0e4832;background:linear-gradient(155deg,#74efbd,#37c995)}.judge-ng{color:#711b29;background:linear-gradient(155deg,#ffabb2,#fc707c)}.judge-symbol{line-height:1;font-size:clamp(110px,24vw,180px);font-family:Arial,sans-serif;font-weight:300}.judge-ng .judge-symbol{font-size:clamp(112px,24vw,188px);font-weight:200}.judge-label{font-size:clamp(20px,4.5vw,28px);font-weight:800}.feedback{font-size:18px;font-weight:700;min-height:28px;margin-top:24px}.feedback.special{color:#ffcc88}.microcopy{color:var(--muted);font-size:12px;margin:10px 0 0}.settings{border-top:1px solid var(--line);padding-top:25px;margin-top:8px}.settings[hidden]{display:none}.settings-head{display:flex;justify-content:space-between;gap:10px;align-items:baseline}.settings h2{font-size:21px;margin:0 0 15px}.settings-head p{font-size:12px;color:var(--muted);margin:0}.panel{border:1px solid var(--line);background:var(--surface);padding:18px;border-radius:19px;margin-bottom:16px}.panel-top{display:flex;justify-content:space-between;align-items:center;font-weight:700}.panel-top output{font-size:22px;color:var(--green)}input[type=range]{width:100%;margin:23px 0 8px;accent-color:var(--green)}.range-end{display:flex;justify-content:space-between;font-size:12px;color:var(--muted)}.panel h3{margin:0 0 7px;font-size:17px}.help,.note{font-size:12px;line-height:1.7;color:var(--muted)}.help{margin-top:0}.note{padding:0 6px}.sound-section{border-top:1px solid var(--line);padding:14px 0}.sound-head{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:15px}.upload{display:inline-block;background:#e5ebf6;color:#182438;font-size:12px;font-weight:800;border-radius:10px;padding:9px 12px;cursor:pointer}.upload input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.clip-list{margin-top:8px}.clip-row{display:flex;align-items:center;justify-content:space-between;padding:8px 0;gap:5px}.clip-name{font-size:12px;color:#c7d3e6;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.clip-actions{display:flex;gap:5px;flex-shrink:0}.mini-button{background:#344358;border:1px solid #506078;color:white;border-radius:8px;padding:5px 9px;font-size:12px;cursor:pointer}.mini-button.danger{color:#ffa9aa}.demo-note{color:#8e9db2;font-size:12px;margin:6px 0 0}.close-settings{width:100%;margin-top:4px;padding:14px}footer{text-align:center;color:#7f8da4;font-size:11px;margin-top:24px}@media(max-width:375px){.app{padding-left:12px;padding-right:12px}.judges{gap:10px}.judge{border-radius:20px;min-height:210px}.settings-toggle{padding:9px}.brand h1{font-size:19px}}@media(prefers-reduced-motion:reduce){.judge{transition:none}}