:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#fff4e3;--panel:#fffdf7;--panel-soft:#ffeecf;--ink:#2a1f1a;--amber-ink:#2a1f1a;--text:#2a1f1a;--muted:#6e5d50;--accent:#ff4757;--on-accent:#fff;--accent-soft:#ffe3dc;--amber:#ffb100;--teal:#00b89f;--teal-ink:#0b2b26;--pin-a:#ff4757;--pin-b:#00b89f;--range:#ffb10059;--playhead:#2a1f1a;--danger:#d63031;--overlay:#2a1f1a8c;--line:#2a1f1a2e;--bw:2.5px;--shadow:4px 4px 0 var(--ink);--shadow-sm:3px 3px 0 var(--ink);--shadow-lg:8px 8px 0 var(--ink);--radius:18px}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#1b1613;--panel:#262019;--panel-soft:#33291f;--ink:#f2e9dc;--text:#f5efe8;--muted:#b9ac9e;--accent:#ff6b6b;--on-accent:#33100e;--accent-soft:#45241f;--amber:#ffc53d;--teal:#2dd4bf;--pin-a:#ff6b6b;--pin-b:#2dd4bf;--range:#ffc53d47;--playhead:#fff7ec;--danger:#ff9f9f;--overlay:#000000a6;--line:#f2e9dc38;--shadow:4px 4px 0 #0000008c;--shadow-sm:3px 3px 0 #0000008c;--shadow-lg:8px 8px 0 #0000008c}}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0;font-family:"M PLUS Rounded 1c",Hiragino Maru Gothic ProN,BIZ UDPGothic,Noto Sans JP,system-ui,sans-serif;font-size:15.5px;line-height:1.65}.app{max-width:720px;margin:0 auto;padding:16px 16px 64px}button{cursor:pointer;font-family:inherit}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.card{background:var(--panel);border:var(--bw) solid var(--ink);border-radius:var(--radius);box-shadow:var(--shadow);margin-top:20px;padding:18px}.app>.card:nth-of-type(odd){transform:rotate(-.4deg)}.app>.card:nth-of-type(2n){transform:rotate(.35deg)}.section-title{letter-spacing:.02em;align-items:center;gap:9px;margin:0 0 14px;font-size:18px;font-weight:800;display:flex}.section-title:before{content:"";background:var(--amber);border:2px solid var(--ink);border-radius:5px;flex-shrink:0;width:15px;height:15px;transform:rotate(-8deg)}.card:nth-of-type(2n) .section-title:before{background:var(--teal);transform:rotate(7deg)}.voice-card .section-title:before{background:var(--accent)}.btn{background:var(--panel);color:var(--text);border:var(--bw) solid var(--ink);box-shadow:var(--shadow-sm);border-radius:999px;align-items:center;gap:7px;padding:11px 18px;font-size:15px;font-weight:800;transition:transform .12s,box-shadow .12s;display:inline-flex}.btn:hover:not(:disabled){box-shadow:var(--shadow);transform:translate(-1px,-1px)}.btn:active:not(:disabled){box-shadow:none;transform:translate(2px,2px)}.btn:disabled{opacity:.4;cursor:default;box-shadow:none}.btn.active{background:var(--amber);color:var(--amber-ink)}.btn-play{background:var(--accent);color:var(--on-accent)}.icon-btn{background:var(--panel);border:var(--bw) solid var(--ink);width:44px;height:44px;color:var(--text);box-shadow:var(--shadow-sm);border-radius:999px;justify-content:center;align-items:center;transition:transform .12s,box-shadow .12s,color .12s;display:inline-flex}.icon-btn:hover{color:var(--accent);box-shadow:var(--shadow);transform:translate(-1px,-1px)}.icon-btn:active{box-shadow:none;transform:translate(2px,2px)}input[type=text],input[type=number],input[type=url]{background:var(--panel);color:var(--text);border:2px solid var(--ink);border-radius:12px;padding:12px 14px;font-family:inherit;font-size:16px}input:disabled{opacity:.5}select{background:var(--panel);color:var(--text);border:2px solid var(--ink);border-radius:10px;padding:9px 12px;font-family:inherit;font-size:15px;font-weight:700}.app-header{justify-content:space-between;align-items:flex-start;gap:12px;padding:8px 2px 4px;display:flex}.brand{flex-wrap:nowrap;align-items:center;gap:12px;min-width:0;display:flex}.brand h1{letter-spacing:.01em;color:var(--text);flex-shrink:0;margin:0;font-size:32px;font-weight:800;line-height:1.1}.brand h1:first-letter{color:var(--accent)}.tagline{background:var(--amber);color:var(--amber-ink);border:2px solid var(--ink);white-space:nowrap;text-overflow:ellipsis;border-radius:999px;margin:0;padding:2px 12px;font-size:11.5px;font-weight:800;display:inline-block;overflow:hidden;transform:rotate(-2deg)}.header-actions{gap:10px;padding-top:6px;display:flex}.url-form{flex-wrap:wrap;gap:10px;display:flex}.url-form input{flex:240px}.url-form .btn{background:var(--accent);color:var(--on-accent)}.form-error{color:var(--danger);width:100%;margin:4px 0 0;font-size:14px;font-weight:700}.player-block{margin-top:20px}.player-frame{aspect-ratio:16/9;border:var(--bw) solid var(--ink);border-radius:var(--radius);box-shadow:var(--shadow-lg);background:#000;position:relative;overflow:hidden}.player-frame iframe{display:block}.player-host{width:100%;height:100%}.player-host iframe{width:100%;height:100%;display:block}#yt-player{width:100%;height:100%}.player-hidden{visibility:hidden}.player-placeholder{color:#cbb9a5;text-align:center;place-items:center;padding:16px;font-size:15px;font-weight:700;display:grid;position:absolute;inset:0}.loop-bar-wrap{margin-top:14px;padding:0 2px}.loop-bar-hit{cursor:pointer;touch-action:manipulation;padding:8px 0}.loop-bar{background:var(--panel);border:2px solid var(--ink);border-radius:999px;height:12px;position:relative}.loop-range{background:var(--range);border-radius:999px;position:absolute;top:0;bottom:0}.loop-playhead{background:var(--playhead);border-radius:2px;width:4px;height:18px;position:absolute;top:-4px;transform:translate(-50%)}.loop-pin{background:var(--pin-a);border:1.5px solid var(--ink);border-radius:3px;width:6px;height:20px;position:absolute;top:-5px;transform:translate(-50%)}.loop-pin.pin-b{background:var(--pin-b)}.loop-label{color:var(--muted);justify-content:space-between;align-items:center;gap:12px;min-height:24px;margin-top:5px;font-size:13px;font-weight:700;display:flex}.loop-info{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.loop-status{color:var(--text);white-space:nowrap;flex-shrink:0;align-items:center;gap:6px;font-weight:800;display:inline-flex}.status-dot{background:var(--muted);border:1.5px solid var(--ink);border-radius:999px;flex-shrink:0;width:9px;height:9px}.status-dot.on{background:var(--teal)}.voice-card{background:var(--accent-soft);transform:rotate(-.5deg)}.mic-row{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.mic-btn{background:var(--accent);color:var(--on-accent);border:var(--bw) solid var(--ink);box-shadow:var(--shadow);border-radius:999px;align-items:center;gap:10px;padding:15px 28px;font-size:17px;font-weight:800;transition:transform .12s,box-shadow .12s;display:inline-flex}.mic-btn:hover{box-shadow:var(--shadow-lg);transform:translate(-1px,-1px)}.mic-btn:active{box-shadow:none;transform:translate(2px,2px)}.mic-btn.listening .mic-dot{background:var(--on-accent);border-radius:999px;width:11px;height:11px;animation:1.2s ease-in-out infinite micPulse}@keyframes micPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.72)}}.mic-state{color:var(--muted);font-size:13px;font-weight:800}.mic-listening{color:var(--pin-b)}.mic-error{color:var(--danger)}.mic-banner{background:var(--panel);border:2px solid var(--ink);color:var(--muted);border-radius:14px;margin:12px 0 0;padding:12px 14px;font-size:14px}.mic-transcript{min-height:22px;margin:10px 0 0;font-size:14px;font-weight:700}.wake-hint{color:var(--muted)}.interim{color:var(--text)}.controls{flex-direction:column;gap:10px;display:flex}.controls-row{gap:10px;display:grid}.controls-row.row-2{grid-template-columns:repeat(2,minmax(0,1fr))}.controls-row.row-3{grid-template-columns:repeat(3,minmax(0,1fr))}.controls .btn{white-space:nowrap;justify-content:center;width:100%;padding:12px 6px}@media (width<=420px){.controls-row.row-3 .btn{padding:12px 2px;font-size:12.5px}}@keyframes voiceFlash{0%,to{box-shadow:var(--shadow-sm)}35%{box-shadow:0 0 0 5px var(--amber);transform:translate(-1px,-1px)}70%{box-shadow:0 0 0 2px var(--amber)}}.btn.flash,.seg-btn.flash{animation:.7s voiceFlash}.seg{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}@media (width>=560px){.seg{grid-template-columns:repeat(6,minmax(0,1fr))}}.seg-btn{border:var(--bw) solid var(--ink);background:var(--panel);width:100%;color:var(--text);text-align:center;white-space:nowrap;box-shadow:var(--shadow-sm);border-radius:999px;padding:10px 8px;font-size:14.5px;font-weight:800;transition:transform .12s,box-shadow .12s}.seg-btn:hover:not(:disabled):not(.on){box-shadow:var(--shadow);transform:translate(-1px,-1px)}.seg-btn:active:not(:disabled){box-shadow:none;transform:translate(2px,2px)}.seg-btn:disabled{opacity:.4;cursor:default;box-shadow:none}.seg-btn.on{background:var(--teal);color:var(--teal-ink)}@media (prefers-color-scheme:dark){.seg-btn.on{color:#0b2b26}}.modal-overlay{background:var(--overlay);-webkit-backdrop-filter:blur(3px);z-index:100;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.modal{background:var(--panel);border:var(--bw) solid var(--ink);border-radius:var(--radius);box-shadow:var(--shadow-lg);width:100%;max-width:480px;max-height:85dvh;animation:.2s ease-out modalIn;overflow-y:auto}@keyframes modalIn{0%{opacity:0;transform:translateY(16px)rotate(-.5deg)}to{opacity:1;transform:translateY(0)rotate(0)}}.modal-head{background:var(--panel);z-index:1;justify-content:space-between;align-items:center;padding:16px 18px 10px;display:flex;position:sticky;top:0}.modal-head h2{margin:0;font-size:21px;font-weight:800}.modal-body{flex-direction:column;gap:16px;padding:4px 18px 22px;display:flex}.field{align-items:center;gap:10px;font-size:15px;font-weight:800;display:flex}.field input[type=number]{width:90px}.field input[type=text]{flex:1;font-weight:700}.modal-body fieldset{border:2px solid var(--ink);border-radius:14px;flex-direction:column;gap:10px;margin:0;padding:12px 14px;display:flex}.modal-body legend{color:var(--muted);padding:0 6px;font-size:13px;font-weight:800}.hint{color:var(--muted);margin:0;font-size:13px;font-weight:400}.wake-block{background:var(--panel-soft);border:2px solid var(--ink);border-radius:14px;flex-direction:column;gap:9px;padding:13px 14px;display:flex}.wake-block.inactive .hint,.wake-block.inactive .field{opacity:.45}.switch-row{justify-content:space-between;align-items:center;gap:10px;display:flex}.switch-label{font-size:15px;font-weight:800}.switch{border:2px solid var(--ink);background:var(--panel);border-radius:999px;flex-shrink:0;width:54px;height:31px;padding:0;transition:background .18s;position:relative}.switch .knob{background:var(--ink);border-radius:999px;width:23px;height:23px;transition:transform .18s,background .18s;position:absolute;top:2px;left:2px}.switch.on{background:var(--teal)}.switch.on .knob{background:var(--panel);transform:translate(23px)}.pedal-row{align-items:center;gap:10px;display:flex}.pedal-gesture{min-width:7.5em;font-size:14px;font-weight:800}.pedal-unsupported{color:var(--muted);font-size:13.5px;font-weight:700}.capture-summary{flex-direction:column;gap:4px;margin:0;padding-left:20px;font-size:14px;font-weight:700;display:flex}.pedal-key{background:var(--panel-soft);border:2px solid var(--ink);letter-spacing:.03em;border-radius:8px;padding:3px 10px;font-size:13px;font-weight:800;display:inline-block}.icon-btn-sm{width:34px;height:34px;box-shadow:none}.capture-box{background:var(--panel-soft);border:2px dashed var(--ink);border-radius:12px;flex-direction:column;gap:9px;padding:12px 14px;display:flex}.capture-msg{margin:0;font-size:14px;font-weight:800}.capture-actions{flex-wrap:wrap;gap:8px;display:flex}.help-body section{flex-direction:column;gap:6px;display:flex}.help-body h3{color:var(--accent);margin:6px 0 0;font-size:16px;font-weight:800}.help-body p,.help-body li{margin:0;font-size:14px}.help-body ul,.help-body ol{flex-direction:column;gap:4px;margin:0;padding-left:20px;display:flex}.help-body table{border-collapse:collapse;width:100%;font-size:14px}.help-body td{border-bottom:1px solid var(--line);padding:6px 8px}.help-body td:first-child{white-space:nowrap;font-weight:800}.app-footer{text-align:center;color:var(--muted);margin-top:28px;font-size:11.5px;font-weight:700}.title-screen{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:13px;min-height:82dvh;padding:24px 0;display:flex}.title-logo{border:var(--bw) solid var(--ink);box-shadow:var(--shadow-lg);background:#fff6ea;border-radius:30px;transform:rotate(-3deg)}.title-name{letter-spacing:.01em;margin:12px 0 0;font-size:46px;font-weight:800;line-height:1.1}.title-name:first-letter{color:var(--accent)}.title-tagline{font-size:13px}.title-start{margin-top:14px;padding:16px 46px;font-size:18px}.title-links{margin-top:6px;font-size:13px}.title-links a{color:var(--muted);font-weight:700}.title-version{color:var(--muted);margin:2px 0 0;font-size:12px;font-weight:700}.lock-screen{background:var(--panel);border:var(--bw) solid var(--ink);border-radius:var(--radius);box-shadow:var(--shadow-lg);text-align:center;flex-direction:column;align-items:center;gap:14px;margin-top:18vh;padding:28px 24px;display:flex}.lock-screen h1{color:var(--accent);margin:0;font-size:30px;font-weight:800}.lock-screen p{margin:0;font-size:15px;font-weight:700}.lock-screen .btn{text-decoration:none}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}@media (orientation:landscape) and (pointer:coarse) and (height<=900px){.app:has(.player-block){grid-template-columns:minmax(0,56%) minmax(0,1fr);align-items:start;gap:12px 14px;max-width:none;padding:12px 14px 24px;display:grid}.app:has(.player-block) .app-header{grid-column:1/-1;padding:0 2px 2px}.app:has(.player-block) .brand h1{font-size:22px}.app:has(.player-block) .player-block{grid-area:2/1/span 8;position:sticky;top:8px}.app:has(.player-block) .player-frame{width:min(100%,177.778dvh - 266.667px);margin:0 auto}:is(.app:has(.player-block)>.card,.app:has(.player-block) .app-footer){grid-column:2;margin-top:0;margin-bottom:12px}.app:has(.player-block) .mic-btn{padding:12px 20px;font-size:15px}}