:root,:root[data-theme=dark]{--bg:#121214;--bg-raised:#19191b;--bg-sunken:#0d0d0e;--text:#f4f2ee;--text-dim:#f4f2ee8f;--text-faint:#f4f2ee52;--line:#ffffff14;--line-strong:#ffffff26;--accent:#dfa24a;--accent-strong:#f0b95f;--accent-soft:#dfa24a24;--accent-glow:0 0 14px #dfa24a2e;--signal:#e5766a;--signal-soft:#e5766a24;--signal-glow:0 0 14px #e5766a26;--bass:#35ad78;--on-accent:#1c1206;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}:root[data-theme=light]{--bg:#f6f4ef;--bg-raised:#fff;--bg-sunken:#edeae2;--text:#201c17;--text-dim:#201c1794;--text-faint:#201c175c;--line:#140e061a;--line-strong:#140e062e;--accent:#946019;--accent-strong:#7c5014;--accent-soft:#9460191f;--accent-glow:0 0 12px #9460191f;--signal:#b34c3f;--signal-soft:#b34c3f1f;--signal-glow:0 0 12px #b34c3f1a;--bass:#1e8f4a;--on-accent:#fff;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}:root{--font-ui:"Space Grotesk", system-ui, sans-serif;--font-mono:var(--font-ui);--font-display:var(--font-ui);--type-label:11px;--type-body:13px;--type-display:24px;--type-hero:48px;--sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:24px;--sp-6:32px;--radius-pill:999px;--radius-lg:20px;--radius-md:14px;--radius-sm:10px;font-family:var(--font-ui);letter-spacing:-.01em}[data-project-accent=gold]{--project-accent:#d89532}[data-project-accent=violet]{--project-accent:#8b78e6}[data-project-accent=green]{--project-accent:#35ad78}[data-project-accent=coral]{--project-accent:#db655e}[data-project-accent=blue]{--project-accent:#65a9db}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);-webkit-tap-highlight-color:transparent}.app-shell{width:100%;min-height:100%}button{font:inherit;font-family:var(--font-ui);color:var(--text);background:var(--bg-raised);border:1px solid var(--line);border-radius:var(--radius-sm);cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;transition:border-color .12s,color .12s,background .12s,box-shadow .18s}button:hover:not(:disabled){border-color:var(--line-strong)}button:active:not(:disabled){transform:translateY(1px)}button:disabled{opacity:.4;cursor:default}button[data-on=true]{border-color:var(--accent);color:var(--accent-strong);background:var(--accent-soft);box-shadow:var(--accent-glow)}.brand{background:0 0;border:0;border-radius:0;padding:0}.brand:hover:not(:disabled){background:0 0;border-color:#0000}button:focus-visible,[role=button]:focus-visible,[role=slider]:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--accent-strong);outline-offset:3px}.btn-compact{height:34px;padding:0 var(--sp-3);font-size:12px}.btn{width:100%;height:44px;font-size:13px}.admin-page{gap:var(--sp-4);display:grid}.admin-hero,.admin-settings{padding:var(--sp-5)}.admin-hero{justify-content:space-between;align-items:flex-start;gap:var(--sp-4);display:flex}.admin-hero h1,.admin-settings h2,.admin-editor h2{margin:var(--sp-1) 0}.admin-hero p,.admin-settings p{color:var(--text-dim);margin:0}.admin-tabs,.admin-slots{gap:var(--sp-2);flex-wrap:wrap;display:flex}.admin-tabs button,.admin-slots button{min-height:34px;padding:0 var(--sp-3);font-size:12px}.admin-grid{gap:var(--sp-4);grid-template-columns:minmax(220px,.7fr) minmax(0,1.3fr);display:grid}.admin-slots,.admin-editor{padding:var(--sp-4)}.admin-slots{align-content:start}.admin-language-fields{gap:var(--sp-3);margin-top:var(--sp-4);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.admin-language-fields label,.admin-color-row label,.admin-switches label{color:var(--text-dim);font-size:var(--type-label);gap:6px;display:grid}.admin-language-fields textarea{resize:vertical;min-height:106px}.admin-seo-page{margin-top:var(--sp-4);padding-top:var(--sp-4);border-top:1px solid var(--line)}.admin-seo-page h3{margin:0}.admin-sticker-grid{gap:var(--sp-3);margin-top:var(--sp-4);grid-template-columns:repeat(auto-fill,minmax(84px,1fr));display:grid}.admin-sticker-toggle{padding:var(--sp-2);border:1px solid var(--line);border-radius:var(--radius-2);background:var(--bg-raised);place-items:center;gap:4px;display:grid}.admin-sticker-toggle img{object-fit:contain;width:48px;height:48px}.admin-sticker-toggle span{font:800 9px/1 var(--font-mono);letter-spacing:.05em;color:var(--text-dim)}.admin-sticker-toggle[data-on=true]{border-color:var(--bass);background:color-mix(in srgb, var(--bass) 12%, var(--bg-raised))}.admin-sticker-toggle[data-on=true] span{color:var(--bass)}.admin-sticker-toggle:hover{border-color:var(--line-strong)}.admin-toolbar,.admin-add-row{align-items:center;gap:var(--sp-2);margin-top:var(--sp-3);display:flex}.admin-toolbar label{align-items:center;gap:var(--sp-2);color:var(--text-dim);font-size:var(--type-label);display:flex}.admin-toolbar button{width:34px;height:34px;padding:0}.admin-preview{margin-top:var(--sp-4);padding:var(--sp-4);border:1px dashed var(--line-strong);border-radius:var(--radius-sm);background:var(--bg-sunken)}.admin-color-row{gap:var(--sp-5);margin-top:var(--sp-4);flex-wrap:wrap;display:flex}.admin-color-row input{width:54px;height:34px;padding:2px}.admin-color-row code{color:var(--text)}.admin-add-row input{max-width:360px}.admin-term-list{gap:var(--sp-2);margin-top:var(--sp-4);flex-wrap:wrap;display:flex}.admin-term-list span{border:1px solid var(--line);border-radius:var(--radius-pill);background:var(--bg-sunken);align-items:center;gap:6px;padding:5px 6px 5px 9px;font-size:12px;display:inline-flex}.admin-term-list button{width:20px;height:20px;color:var(--signal);border-radius:50%;padding:0}.admin-switches{gap:var(--sp-3);margin:var(--sp-4) 0;grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.admin-switches label{padding:var(--sp-3);border:1px solid var(--line);border-radius:var(--radius-sm)}.admin-switches button{height:32px}@media (width<=700px){.admin-hero,.admin-grid{flex-direction:column;grid-template-columns:1fr}.admin-language-fields,.admin-switches{grid-template-columns:1fr}.admin-add-row{flex-direction:column;align-items:stretch}.admin-add-row input{max-width:none}}.control-login-page{min-height:100vh;padding:var(--sp-4);background:var(--bg);justify-content:center;align-items:center;display:flex}.control-login-card{gap:var(--sp-3);width:100%;max-width:360px;padding:var(--sp-5);display:grid}.control-login-card label{font-size:var(--type-label);color:var(--text-dim);gap:6px;display:grid}.control-login-error{color:var(--signal);font-size:12px}.control-dashboard{max-width:1100px;margin:0 auto}.control-tabs-table{border-collapse:collapse;width:100%;margin-top:var(--sp-3);font-size:12px}.control-tabs-table th,.control-tabs-table td{text-align:left;padding:var(--sp-2);border-bottom:1px solid var(--line)}.control-community .admin-tabs{margin-bottom:var(--sp-2)}.control-security h3{margin:var(--sp-4) 0 var(--sp-2);font-size:var(--type-body)}.control-security h3:first-of-type{margin-top:var(--sp-3)}.control-status-on{color:var(--bass);font-weight:700}.control-status-off{color:var(--text-dim);font-weight:700}.control-inline-form{align-items:center;gap:var(--sp-2);margin-top:var(--sp-2);flex-wrap:wrap;display:flex}.control-inline-form input{max-width:220px}.control-2fa-setup{gap:var(--sp-3);margin:var(--sp-2) 0;padding:var(--sp-4);border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--bg-sunken);display:grid}.control-qr{border-radius:var(--radius-sm)}.control-words-row{gap:var(--sp-2);grid-template-columns:repeat(4,minmax(0,1fr));display:grid}.control-words-reveal{margin:var(--sp-2) 0}.control-words-reveal code{text-align:center;padding:var(--sp-2);border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--bg-sunken);font-size:14px;display:block}.control-recovery-reveal{margin-top:var(--sp-2);padding:var(--sp-4);border:1px dashed var(--signal);border-radius:var(--radius-sm)}.control-account-form{gap:var(--sp-2);max-width:420px;margin-bottom:var(--sp-4);display:grid}@media (width<=480px){.control-words-row{grid-template-columns:repeat(2,minmax(0,1fr))}}.screen{width:100%;max-width:1280px;min-height:100%;padding:var(--sp-4) var(--sp-4) 0;gap:var(--sp-4);flex-direction:column;margin:0 auto;display:flex;position:relative}.ad-slot{isolation:isolate;border:1px solid color-mix(in srgb, var(--accent) 24%, var(--line));border-radius:var(--radius-md);color:#fff8eb;background:#16130f;min-width:0;position:relative;overflow:hidden}.ad-slot:after{content:"";z-index:-1;pointer-events:none;background:linear-gradient(90deg,#080706e6,#08070633 68%,#08070675);position:absolute;inset:0}.ad-slot__art{z-index:-2;object-fit:cover;object-position:54% 67%;width:100%;height:100%;display:block;position:absolute;inset:0}.ad-slot__badge{border-radius:var(--radius-pill);color:#ffffffb8;font:700 7px/1 var(--font-mono);letter-spacing:.1em;background:#0807068c;border:1px solid #ffffff40;padding:3px 6px;position:absolute;top:8px;right:8px}.ad-slot__copy{left:var(--sp-4);right:82px;bottom:var(--sp-3);gap:3px;display:grid;position:absolute}.ad-slot__copy strong{letter-spacing:-.025em;font-size:14px;line-height:1.08}.ad-slot__copy span{color:#ffffff94;font:8px/1 var(--font-mono);letter-spacing:.07em;text-transform:uppercase}.ad-slot--inline{flex:none;width:100%;height:92px}.ad-slot--rail{display:none}@media (width<=620px){.ad-slot--inline{border-radius:var(--radius-sm);height:76px}.ad-slot__art{object-position:57% 64%}.ad-slot__copy{left:var(--sp-3);bottom:10px;right:70px}.ad-slot__copy strong{font-size:12px}.ad-slot__copy span{display:none}.ad-slot__badge{top:7px;right:7px}}@media (width>=1640px){.app-shell{justify-content:center;align-items:start;gap:var(--sp-4);padding:0 var(--sp-4);grid-template-columns:minmax(132px,160px) minmax(0,1280px) minmax(132px,160px);display:grid}.screen{grid-column:2;padding-inline:0}.ad-slot--inline{display:none}.ad-slot--rail{top:var(--sp-5);width:100%;height:min(600px,100vh - 48px);margin-top:var(--sp-5);border-radius:var(--radius-lg);display:block;position:sticky}.ad-slot--rail:after{background:linear-gradient(#08070657,#0807061a 38%,#080706f0)}.ad-slot--rail .ad-slot__art{object-position:58% 56%}.ad-slot--rail[data-side=right] .ad-slot__art{object-position:76% 50%}.ad-slot--rail .ad-slot__copy{left:var(--sp-3);right:var(--sp-3);bottom:var(--sp-4);gap:7px}.ad-slot--rail .ad-slot__copy strong{font-size:15px;line-height:1.12}}.content{gap:var(--sp-4);flex:1;grid-template-columns:minmax(0,1fr);align-content:start;align-items:start;display:grid}.pane{gap:var(--sp-4);flex-direction:column;min-width:0;display:flex}.content .tabview,.content .transport,.content .full{grid-column:1/-1}.content .transport.transport--under-main{grid-column:1}@media (width>=760px){.screen{padding:var(--sp-5) var(--sp-6) 0}.content{grid-template-columns:minmax(0,1fr) minmax(300px,380px)}}@media (width>=1240px){.content{grid-template-columns:minmax(0,1fr) minmax(340px,420px)}}.topbar{justify-content:space-between;align-items:center;gap:var(--sp-3);padding-bottom:var(--sp-3);border-bottom:1px solid var(--line);flex-wrap:wrap;min-width:0;display:flex}.topbar .nav-pills{scrollbar-width:thin;max-width:100%;overflow-x:auto}.topbar-actions{align-items:center;gap:var(--sp-2);min-width:0;display:flex}.topbar-learning-button{height:36px;padding:0 var(--sp-3);border:1px solid var(--accent-strong);border-radius:var(--radius-pill);background:var(--accent-strong);color:var(--on-accent);letter-spacing:.07em;cursor:pointer;box-shadow:0 4px 14px color-mix(in srgb, var(--accent) 20%, transparent);justify-content:center;align-items:center;gap:6px;font-size:10px;font-weight:800;display:inline-flex}.topbar-learning-button span{width:16px;height:16px;font:800 11px/1 var(--font-mono);border:1px solid;border-radius:50%;place-items:center;display:grid}.topbar-learning-button:hover{filter:brightness(1.08)}.topbar-learning-button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.topbar-account-button{height:36px;padding:0 var(--sp-3);color:var(--text-dim);letter-spacing:.05em;justify-content:center;align-items:center;gap:6px;display:inline-flex;font:700 10px/1 var(--font-mono)!important}.topbar-account-button>span{color:var(--accent-strong);font-size:12px}.brand{flex:none;align-items:center;gap:9px;display:inline-flex}.brand-logo{object-fit:contain;width:30px;height:30px;display:block}.wordmark{font-family:var(--font-ui);letter-spacing:-.035em;color:var(--text);font-size:21px;font-style:normal;font-weight:750;line-height:1}.wordmark span{color:var(--accent-strong)}.app-shell .wordmark,.app-shell .wordmark span{font-size:26px!important}.brand-beta{border:1px solid var(--line-strong);border-radius:var(--radius-pill);color:var(--text-dim);letter-spacing:.04em;text-transform:uppercase;align-self:flex-end;margin-bottom:3px;padding:1px 4px;font-size:7px;font-weight:700;line-height:1.4}.nav-pills{background:var(--bg-raised);border:1px solid var(--line);border-radius:var(--radius-pill);gap:2px;padding:3px;display:flex}.nav-pills button{height:30px;padding:0 var(--sp-4);border-radius:var(--radius-pill);letter-spacing:.06em;text-transform:uppercase;color:var(--text-dim);background:0 0;border:none;flex:none;font-size:11px}.nav-pills .nav-home-button{place-items:center;width:34px;padding:0;display:inline-grid}.nav-home-button svg{fill:currentColor;width:14px;height:14px}@media (width<=620px){.screen{padding:var(--sp-3) var(--sp-3) 0;gap:var(--sp-3);overflow-x:clip}.topbar{grid-template-columns:minmax(0,1fr);display:grid}.topbar-actions{grid-template-columns:minmax(0,1fr);width:100%;display:grid}.topbar .nav-pills{border-radius:var(--radius-md);grid-template-columns:repeat(3,minmax(0,1fr));width:100%;display:grid;overflow:visible}.topbar .nav-pills button{width:100%;height:36px;padding:0 var(--sp-1);font-size:9px}.topbar-learning-button,.topbar-account-button{width:100%;height:36px}}.home{gap:var(--sp-4);flex-direction:column;min-width:0;display:flex}.home-icon{flex:none;width:22px;height:22px}.home-hero{isolation:isolate;border:1px solid var(--line);background:var(--bg-raised);border-radius:28px;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:clamp(28px,6vw,80px);min-height:330px;padding:clamp(28px,5vw,64px);display:grid;position:relative;overflow:hidden}.home-hero:after{content:none}.home-hero-copy{max-width:720px}.home-eyebrow,.home-kicker{color:var(--text-dim);letter-spacing:.14em;font-size:10px;font-weight:600}.home-eyebrow{align-items:center;gap:var(--sp-2);display:flex}.home-eyebrow span{background:var(--accent);width:22px;height:2px}.home-hero h1{max-width:680px;margin:var(--sp-3) 0;font-family:var(--font-display);letter-spacing:-.035em;font-size:clamp(42px,6vw,72px);font-weight:700;line-height:.98}.home-hero-support{max-width:640px;color:var(--text-dim);letter-spacing:-.02em;margin:0;line-height:1.24}.home-hero p,.home-panel p{color:var(--text-dim);margin:0;font-size:14px;line-height:1.6}.home-hero p{max-width:600px}.home-hero-actions{gap:var(--sp-3);margin-top:var(--sp-5);flex-wrap:wrap;display:flex}.home-hero-actions button{min-height:48px;padding:0 var(--sp-5);justify-content:center;align-items:center;gap:var(--sp-2);letter-spacing:.08em;font-size:11px;display:inline-flex}.home-primary{min-width:220px}.home-secondary{background:0 0}.home-session-orbit{text-align:center;min-width:190px}.home-session-ring{border:1px solid var(--line-strong);background:var(--bg);width:170px;height:170px;box-shadow:inset 0 0 0 10px var(--bg-raised);border-radius:50%;place-content:center;margin:0 auto;display:grid}.home-session-orbit[data-done=true] .home-session-ring{border:3px solid var(--accent)}.home-session-ring span{font-family:var(--font-mono);font-size:32px;font-weight:700}.home-session-ring small{color:var(--text-dim);letter-spacing:.12em;text-transform:uppercase;font-size:10px}.home-session-caption{margin-top:var(--sp-3);color:var(--text-dim);font-size:11px}.home-stats{border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--bg-raised);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.home-stats article{min-width:0;padding:var(--sp-4) var(--sp-5);align-items:center;gap:var(--sp-3);border-right:1px solid var(--line);display:flex}.home-stats article:last-child{border-right:0}.home-stats .home-icon{color:var(--accent-strong)}.home-stats strong{font-family:var(--font-mono);font-size:22px;display:block}.home-stats span{color:var(--text-dim);font-size:11px;display:block}.home-stat-mark{border:1px solid var(--line-strong);width:34px;height:34px;font-family:var(--font-mono);border-radius:50%;place-items:center;font-weight:700;color:var(--accent-strong)!important;font-size:8px!important;display:grid!important}.home-grid{gap:var(--sp-4);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.learn{gap:var(--sp-4);display:grid}.learn-hero{border:1px solid var(--line);border-radius:var(--radius-lg);background:linear-gradient(120deg, var(--bg-raised), var(--bg-sunken));padding:clamp(24px,5vw,56px)}.learn-hero h1{max-width:680px;margin:var(--sp-3) 0;font-size:clamp(30px,4vw,52px);line-height:1.04}.learn-hero p,.learn-card p{max-width:680px;color:var(--text-dim);line-height:1.6}.learn-card{gap:var(--sp-4);padding:clamp(22px,4vw,42px);display:grid}.learn-card h2{margin:0;font-size:clamp(24px,3vw,34px)}.learn-progress{gap:var(--sp-2);display:flex}.learn-progress button{width:34px;height:34px;color:var(--text-dim);border-radius:50%;padding:0}.learn-progress button[data-on=true]{color:var(--bg);background:var(--accent);border-color:var(--accent)}.learn-progress button[data-done=true]{border-color:var(--accent);color:var(--accent-strong)}.learn-actions{gap:var(--sp-2);margin-top:var(--sp-2);flex-wrap:wrap;display:flex}.home-panel{min-height:250px;padding:var(--sp-5);gap:var(--sp-4)}.home-panel h2{margin:var(--sp-1) 0 0;color:var(--text);font-family:var(--font-display);letter-spacing:-.02em;text-transform:none;font-size:30px;font-weight:400}.home-panel-head{justify-content:space-between;align-items:flex-start;gap:var(--sp-4);display:flex}.home-panel-head>.home-icon{width:30px;height:30px;color:var(--accent-strong)}.home-quest-line{align-items:center;gap:var(--sp-2);color:var(--text-dim);margin-top:auto;font-size:11px;display:flex}.home-quest-line i{border:1px solid var(--line-strong);border-radius:50%;width:9px;height:9px}.home-quest-line i[data-done=true]{border-color:var(--accent);background:var(--accent)}.home-inline-action{align-self:flex-start;align-items:center;gap:var(--sp-2);color:var(--accent-strong);letter-spacing:.1em;background:0 0;border:0;padding:0;font-size:10px;display:inline-flex}.home-inline-action .home-icon{width:16px;height:16px}.home-project-title{font-family:var(--font-mono);font-size:19px}.home-project-meta{gap:var(--sp-2);display:flex}.home-project-meta span{border-radius:var(--radius-pill);background:var(--bg-sunken);color:var(--text-dim);padding:5px 9px;font-size:10px}.home-tool-grid{gap:var(--sp-2);display:grid}.home-tool-grid button{align-items:center;gap:var(--sp-3);min-height:52px;padding:var(--sp-2) var(--sp-3);text-align:left;grid-template-columns:auto 1fr auto;display:grid}.home-tool-grid button>.home-icon:first-child{color:var(--accent-strong)}.home-tool-grid button>.home-icon:last-child{opacity:.5;width:16px}.home-tool-grid strong{font-size:12px;font-weight:500;display:block}.home-tool-grid small{color:var(--text-dim);margin-top:2px;font-size:10px;display:block}.home-discover{background:var(--bg-sunken)}.home-discover-actions{gap:var(--sp-2);flex-wrap:wrap;margin-top:auto;display:flex}.home-discover-actions button{min-height:42px;padding:0 var(--sp-4);letter-spacing:.08em;font-size:10px}.home-discover-actions button:first-child{border-color:var(--accent);color:var(--accent-strong)}.home-product{gap:clamp(var(--sp-4), 3vw, var(--sp-6))}.home-product-hero{background:linear-gradient(90deg, var(--bg-raised) 0%, color-mix(in srgb, var(--bg-raised) 94%, transparent) 38%, color-mix(in srgb, var(--bg-raised) 62%, transparent) 100%), url(/riffonic-home-hero-v2.webp) center / cover no-repeat;grid-template-columns:minmax(0,1.15fr) minmax(330px,.85fr);min-height:400px}.home-product-hero:after{opacity:.6;width:460px;height:460px;bottom:-210px;right:-150px}.home-product .home-hero-copy{max-width:690px}.home-product .home-hero h1{max-width:650px}.home-hero-flow{align-items:center;gap:var(--sp-2);grid-template-columns:1fr 1px 1fr 1px 1fr;min-width:0;display:grid}.home-hero-flow>i{background:var(--line);height:58%}.home-hero-flow button{justify-content:center;align-items:flex-start;gap:var(--sp-2);min-width:0;min-height:150px;padding:var(--sp-4) var(--sp-3);text-align:left;background:color-mix(in srgb, var(--bg) 76%, transparent);border-color:#0000;flex-direction:column;display:flex}.home-hero-flow button:hover{border-color:var(--line-strong);background:var(--bg)}.home-hero-flow .home-icon{width:25px;height:25px;color:var(--accent-strong)}.home-hero-flow span{color:var(--text);font-weight:700}.home-hero-flow small{color:var(--text-dim);line-height:1.25}.home-value-intro{max-width:840px;padding:var(--sp-2) 0}.home-value-intro h2,.home-creation h2,.home-benefit h2{margin:var(--sp-2) 0 0;font-family:var(--font-display);letter-spacing:-.025em;font-weight:700;line-height:1.08}.home-value-intro h2{max-width:780px}.home-benefits{gap:var(--sp-4);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.home-benefit{align-items:flex-start;gap:var(--sp-2);min-height:270px;padding:var(--sp-4) var(--sp-5);flex-direction:column;display:flex}.home-benefit-icon{width:46px;height:46px;color:var(--accent-strong);border:1px solid var(--line-strong);border-radius:var(--radius-md);background:var(--bg-sunken);place-items:center;display:grid}.home-benefit-icon .home-icon{width:25px;height:25px;color:var(--accent-strong)}.home-benefit h2{min-height:0;font-size:18px}.home-benefit p,.home-creation p{color:var(--text-dim);margin:0;line-height:1.45}.home-benefit p{font-size:12px}.home-benefit .home-inline-action{margin-top:auto}.home-benefit--studio{border-color:var(--line-strong);background:var(--bg-sunken)}.card.home-benefit--practice,.card.home-benefit--studio,.card.home-benefit--tabs{isolation:isolate;background-position:50%;background-size:cover;position:relative;overflow:hidden}.card.home-benefit--practice{background-image:linear-gradient(125deg, color-mix(in srgb, var(--bg-raised) 96%, transparent), color-mix(in srgb, var(--bg-raised) 61%, transparent)), url(/riffonic-practice-bg.webp)}.card.home-benefit--studio{background-image:linear-gradient(125deg, color-mix(in srgb, var(--bg-sunken) 96%, transparent), color-mix(in srgb, var(--bg-sunken) 62%, transparent)), url(/riffonic-studio-bg.webp)}.card.home-benefit--tabs{background-image:linear-gradient(125deg, color-mix(in srgb, var(--bg-raised) 96%, transparent), color-mix(in srgb, var(--bg-raised) 62%, transparent)), url(/riffonic-community-bg.webp)}.home-benefit--tabs .home-benefit-icon{color:var(--violet)}.home-creation{align-items:start;gap:var(--sp-4);padding:clamp(var(--sp-5), 4vw, var(--sp-6));background:var(--bg-raised);grid-template-columns:minmax(0,1fr);display:grid}.card.home-community-callout{align-items:center;gap:clamp(var(--sp-4), 5vw, var(--sp-6));padding:clamp(var(--sp-5), 4vw, var(--sp-6));background:linear-gradient(100deg, color-mix(in srgb, var(--bg-raised) 96%, transparent), color-mix(in srgb, var(--bg-raised) 58%, transparent)), url(/riffonic-community-bg.webp) center / cover no-repeat;grid-template-columns:minmax(0,1fr) minmax(260px,.42fr);display:grid}.home-community-copy h2{max-width:680px;margin:var(--sp-2) 0 0;font-family:var(--font-display);font-size:var(--type-display);letter-spacing:-.025em;font-weight:700;line-height:1.08}.home-community-copy p{max-width:720px;margin:var(--sp-3) 0 0;color:var(--text-dim);line-height:1.6}.home-community-points{gap:var(--sp-2);margin-top:var(--sp-4);flex-wrap:wrap;display:flex}.home-community-points span{border:1px solid color-mix(in srgb, var(--accent) 30%, var(--line));border-radius:var(--radius-pill);color:var(--accent-strong);background:var(--accent-soft);padding:6px 10px;font-size:11px;font-weight:700}.home-community-actions{gap:var(--sp-2);display:grid}.home-community-actions button{justify-content:center;align-items:center;gap:var(--sp-2);min-height:48px;display:inline-flex}.home-creation>div:first-child{grid-area:1/1}.home-creation h2{max-width:650px}.home-creation p{max-width:720px;margin-top:var(--sp-3)}.home-creation-actions{gap:var(--sp-2);flex-wrap:wrap;grid-area:2/1;display:flex}.home-creation-actions button{justify-content:center;align-items:center;gap:var(--sp-2);min-height:50px;padding:0 var(--sp-3);flex:0 220px;display:inline-flex}.home-creation-actions button:last-child{flex-basis:min(100%,280px)}@media (width<=760px){.home-hero{grid-template-columns:1fr;min-height:0}.home-session-orbit{display:none}.home-grid,.home-product-hero{grid-template-columns:1fr}.home-hero-flow{grid-template-columns:repeat(3,minmax(0,1fr))}.home-hero-flow>i{display:none}.home-hero-flow button{min-height:112px}.home-benefits{grid-template-columns:1fr}.home-benefit,.home-benefit h2{min-height:0}.home-creation{gap:var(--sp-4);grid-template-columns:1fr}.home-creation-actions{grid-area:2/1}.card.home-community-callout{grid-template-columns:1fr}}@media (width<=620px){.home{gap:var(--sp-3)}.home-hero{padding:var(--sp-5) var(--sp-4);border-radius:var(--radius-lg)}.home-hero h1{font-size:42px}.home-hero-actions{display:grid}.home-hero-actions button{width:100%}.home-stats{grid-template-columns:1fr}.home-stats article{border-right:0;border-bottom:1px solid var(--line)}.home-stats article:last-child{border-bottom:0}.home-panel{min-height:0;padding:var(--sp-4)}}.nav-pills button[data-on=true]{background:var(--bg-sunken);color:var(--text);border:none}.tag{color:var(--accent-strong);border:1px solid var(--line-strong);background:var(--bg-raised);border-radius:var(--radius-pill);padding:3px 10px;font-size:10px}.metro{align-items:center;gap:var(--sp-3);padding:var(--sp-2) 0 0;flex-direction:column;display:flex}.pane-main>.tempo-row,.pane-main>input[type=range]{align-self:center;width:100%;max-width:560px}.ring-wrap{place-items:center;width:clamp(200px,25vw,300px);height:clamp(200px,25vw,300px);display:grid;position:relative}.ring{--vhs-pulse:0;inset:calc((100% - var(--metro-ring-size,100%)) / 2);border:2px solid var(--line-strong);color:var(--line-strong);will-change:transform, opacity, border-color, box-shadow;border-radius:50%;position:absolute}.ring:before,.ring:after{content:"";border-radius:inherit;pointer-events:none;mix-blend-mode:screen;border:1px solid;position:absolute;inset:-1px}.ring:before{opacity:calc(.025 + var(--vhs-pulse) * .32);transform:scale(calc(1.025 + var(--vhs-pulse) * .22))}.ring:after{opacity:calc(.015 + var(--vhs-pulse) * .16);transform:translateX(1.5px) scale(calc(1.01 + var(--vhs-pulse) * .09))}@media (prefers-reduced-motion:reduce){.ring:before,.ring:after{display:none}}.bpm{font-family:var(--font-mono);letter-spacing:-.02em;font-variant-numeric:tabular-nums;font-size:clamp(56px,6.5vw,88px);font-weight:700;line-height:1}.bpm-label{color:var(--text-dim);letter-spacing:.24em;text-transform:uppercase;font-size:11px}.beat-readout{font-family:var(--font-mono);color:var(--text-dim);font-variant-numeric:tabular-nums;font-size:12px}.dots{gap:var(--sp-2);display:flex}.dot{background:var(--line-strong);border-radius:50%;width:8px;height:8px;transition:background 60ms linear}.tempo-row{align-items:center;gap:var(--sp-3);display:flex}.tempo-row input[type=range]{flex:1}.tap{letter-spacing:.14em;text-transform:uppercase;flex:none;width:160px;height:46px;font-size:12px}input[type=range]{appearance:none;cursor:pointer;background:0 0;width:100%;height:28px}input[type=range]::-webkit-slider-runnable-track{border-radius:var(--radius-pill);background:var(--line-strong);height:4px}input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--accent);border:2px solid var(--bg-raised);width:16px;height:16px;box-shadow:var(--accent-glow);border-radius:50%;margin-top:-6px}input[type=range]::-moz-range-track{border-radius:var(--radius-pill);background:var(--line-strong);height:4px}input[type=range]::-moz-range-thumb{background:var(--accent);border:2px solid var(--bg-raised);width:14px;height:14px;box-shadow:var(--accent-glow);border-radius:50%}.card{background:var(--bg-raised);border:1px solid var(--line);border-radius:var(--radius-lg);padding:var(--sp-4) var(--sp-5);gap:var(--sp-3);flex-direction:column;display:flex}.card h2{letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim);margin:0;font-size:11px;font-weight:500}.seg{gap:var(--sp-2);display:flex}.seg button{flex:1;height:40px;font-size:12px}.seg--metro{gap:var(--sp-3)}.seg--metro button{flex:none;width:40px;height:40px;padding:0}.seg--metro-accent{margin-left:auto}.slider-field{gap:var(--sp-1);flex-direction:column;display:flex}.row{justify-content:space-between;align-items:baseline;gap:var(--sp-3);display:flex}.mono-num{font-family:var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:-.01em;font-size:26px;font-weight:700}.mono-num--sm{font-size:16px}.mono-num--md{font-size:20px}.dim{color:var(--text-dim);font-size:12px;line-height:1.55}.chord-top-row{gap:var(--sp-4);flex-wrap:wrap;align-items:stretch;display:flex}.chord-progression-preview{order:-1}.chord-library-card{order:1}.chord-top-row>.card{flex:1.5 400px}.chord-top-row>.card:last-child{flex:300px}.chord-selection-card{gap:var(--sp-3);flex-direction:column;display:flex}.chord-selection-card>h2,.chord-progression-control h2,.chord-practice-card h2{margin:0}@media (width<=620px){.chord-practice-card .seg--metro,.seg.chord-picking-row{gap:var(--sp-2);grid-template-columns:none;grid-auto-columns:minmax(0,1fr);grid-auto-flow:column}.chord-practice-card .seg--metro button,.seg.chord-picking-row button{width:auto}.chord-practice-card .seg--metro-accent,.chord-strings-toggle{margin-left:0}}.chord-progression-control{gap:var(--sp-2);display:grid}.chord-backing-control{gap:var(--sp-2);padding-top:var(--sp-3);border-top:1px solid var(--line);margin-top:auto;display:grid}.chord-backing-control h2{margin:0}.chord-backing-toggle{width:40px;min-width:40px;height:40px;padding:0}.chord-backing-toggle svg{width:20px;height:20px}.chord-strings-toggle[data-on=false]{border-color:var(--signal);color:var(--signal)}.chord-strings-toggle{margin-left:auto}.chord-picking-row .chord-picking-glyph{width:26px;height:16px}.chord-slot-name-input{border-radius:var(--radius-sm,6px);width:4.5em;color:inherit;font:inherit;text-align:center;background:0 0;border:1px solid #0000;padding:2px 4px}.chord-slot-name-input:hover:not(:disabled){border-color:var(--line-strong)}.chord-slot-name-input:focus{border-color:var(--accent);background:var(--bg-raised);outline:none}.chord-practice-slot[data-drop-target]{outline:2px dashed var(--accent);outline-offset:4px}.chord-free-hint{margin-left:auto;font-size:11px}.chord-progression-control .seg button{flex:0 auto}.chord-random-row{display:flex}.chord-random-button{flex:none;width:auto;min-width:218px;height:44px}.card-row{gap:var(--sp-4);flex-wrap:wrap;align-items:stretch;display:flex}.card-row>.card{flex:1 1 0;min-width:320px}.card-row>.player-metro-card{flex:.8 1 0}.chord-row{gap:var(--sp-4);flex-wrap:nowrap;width:100%;display:flex;overflow-x:auto}.chord-practice-scroller{scrollbar-gutter:stable;width:100%;padding-bottom:var(--sp-2);overflow:auto hidden}.chord-practice-track{gap:var(--sp-2);width:max-content;min-width:100%;padding:0 var(--sp-2);display:flex;position:relative}.chord-practice-slot{width:272px;padding-top:64px;overflow:hidden}.chord-practice-ruler{border-bottom:1px solid var(--line-strong);pointer-events:none;grid-template-columns:repeat(4,1fr);height:48px;display:grid;position:absolute;inset:0 0 auto}.chord-practice-ruler i{border-left:1px solid var(--line);position:relative}.chord-practice-ruler i:after{content:"";background:var(--text-dim);width:1px;height:8px;position:absolute;bottom:0;left:-1px}.chord-practice-ruler i.major:after{background:var(--text);height:14px}.chord-practice-bar-number{z-index:1;color:var(--text-dim);font:600 10px/1 var(--font-mono);position:absolute;top:8px;left:7px}.chord-random-button{border-color:color-mix(in srgb, #8b78e6 55%, var(--line));color:color-mix(in srgb, #8b78e6 78%, var(--text));background:color-mix(in srgb, #8b78e6 8%, var(--bg-raised));font-weight:700}.chord-random-button:hover:not(:disabled){background:color-mix(in srgb, #8b78e6 15%, var(--bg-raised));border-color:#8b78e6}.chord-practice-playhead{z-index:3;border-radius:var(--radius-pill);background:var(--accent);width:2px;height:48px;box-shadow:0 0 10px color-mix(in srgb, var(--accent) 65%, transparent);opacity:0;pointer-events:none;will-change:transform;position:absolute;top:0;left:0}.chord-grid{gap:var(--sp-3);flex-wrap:wrap;width:100%;display:flex}.chord-slot{align-items:center;gap:var(--sp-2);padding:var(--sp-2);border-radius:var(--radius-md);border:1px solid #0000;flex-direction:column;flex:none;display:flex;position:relative}.chord-slot.chord-practice-slot{padding:48px var(--sp-2) var(--sp-2)}.chord-slot[data-on=true]{border-color:var(--accent);background:var(--accent-soft)}.chord-name{font-family:var(--font-mono);font-size:18px;font-weight:600}.chord-name--sm{font-size:12px;font-weight:400}.chord-degree{color:var(--accent);letter-spacing:.04em;font-size:12px;font-weight:500}.chord-progression-head{align-items:baseline;gap:var(--sp-3);margin-bottom:var(--sp-3);flex-wrap:wrap;display:flex}.chord-key-badge{color:var(--text-dim);text-transform:uppercase;letter-spacing:.08em;font-size:12px}.chord-key-badge b{font-family:var(--font-mono);color:var(--accent);margin-left:4px;font-size:16px}.chord-slot--clickable{cursor:pointer;border-color:var(--line-strong);touch-action:none}.chord-slot--clickable:hover{background:var(--bg-sunken);border-color:var(--accent)}.chord-variants-badge{border-radius:var(--radius-pill);background:var(--accent);min-width:18px;height:18px;color:var(--on-accent);font-family:var(--font-mono);pointer-events:none;justify-content:center;align-items:center;padding:0 5px;font-size:10px;font-weight:700;line-height:1;display:flex;position:absolute;top:-6px;right:-6px}.popup-backdrop{padding:var(--sp-5);z-index:80;background:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.composer-inspector-backdrop{z-index:80}.popup{background:var(--bg-raised);border:1px solid var(--line-strong);border-radius:var(--radius-lg);padding:var(--sp-5);gap:var(--sp-3);flex-direction:column;max-width:720px;max-height:80vh;display:flex;overflow-y:auto}.auth-popup{width:100%;max-width:380px}.auth-form{gap:var(--sp-3);flex-direction:column;display:flex}.auth-links{gap:var(--sp-2);flex-wrap:wrap;justify-content:space-between;display:flex}.account-password-row{align-items:flex-end;gap:var(--sp-3);flex-wrap:wrap;display:flex}.account-password-row .field-label{flex:none}.account-password-row input{width:180px}.bar{background:var(--bg-sunken);border-radius:var(--radius-pill);height:6px;overflow:hidden}.bar>i{background:var(--accent);border-radius:var(--radius-pill);width:0;height:100%;display:block}.bar[data-phase=rest]>i{background:var(--signal)}.transport{gap:var(--sp-3);margin-top:auto;width:100%;padding:var(--sp-3) 0 calc(var(--sp-3) + env(safe-area-inset-bottom));background:linear-gradient(to top, var(--bg) 65%, transparent);margin-inline:auto;display:flex;position:sticky;bottom:0}.transport button{letter-spacing:.1em;border-radius:var(--radius-md);flex:1;height:56px;font-size:13px}@media (width>=760px){.transport{max-width:560px}}.transport--under-main{padding:var(--sp-3) 0 0;background:0 0;position:static}.primary{background:var(--accent);color:var(--on-accent);border-color:var(--accent);box-shadow:var(--accent-glow);font-weight:600}.primary:hover:not(:disabled){background:var(--accent-strong);border-color:var(--accent-strong);box-shadow:0 0 18px #dfa24a42}.cents-scale{border-radius:var(--radius-sm);background:linear-gradient(to right, transparent 49.6%, var(--line-strong) 49.6%, var(--line-strong) 50.4%, transparent 50.4%), var(--bg-sunken);height:24px;position:relative}.cents-mark{background:var(--line-strong);border-radius:2px;width:3px;height:18px;margin-left:-1.5px;transition:left 60ms linear,background .12s linear;position:absolute;top:3px}select{font:inherit;font-family:var(--font-ui);color:var(--text);background:var(--bg-sunken);border:1px solid var(--line);border-radius:var(--radius-sm);height:42px;padding:0 var(--sp-3);width:100%}select:hover{border-color:var(--line-strong)}input[type=search]{width:100%;height:42px;padding:0 var(--sp-3);color:var(--text);background:var(--bg-sunken);border:1px solid var(--line);border-radius:var(--radius-sm);font:inherit}input[type=search]::placeholder{color:var(--text-faint)}input[type=search]:hover{border-color:var(--line-strong)}.chord-catalog-tools{gap:var(--sp-3);flex-wrap:wrap;align-items:end;display:flex}.chord-catalog-search input[type=search]{width:150px}.chord-catalog-root select{width:88px}.chord-catalog-type select{width:150px}.chord-catalog-tools .composer-chord-zoom{margin-left:0}.field-label{gap:var(--sp-1);color:var(--text-dim);flex-direction:column;font-size:10px;display:flex}.tabs-page{gap:var(--sp-5);display:grid}.tabs-hero{justify-content:space-between;align-items:end;gap:var(--sp-5);padding:var(--sp-6);border:1px solid var(--line);border-radius:var(--radius-lg);background:linear-gradient(90deg, var(--bg-raised) 0%, color-mix(in srgb, var(--bg-raised) 94%, transparent) 46%, color-mix(in srgb, var(--bg-raised) 48%, transparent) 100%), url(/riffonic-tabs-hero.webp) center / cover no-repeat;display:flex}.tabs-hero h1{margin:var(--sp-1) 0;font-size:clamp(24px,4vw,42px)}.tabs-hero p{max-width:650px;color:var(--text-dim);margin:0}.tabs-shelf{width:fit-content;max-width:100%}.tabs-shelf b{color:var(--accent-strong);margin-left:4px}.tabs-library{gap:var(--sp-4)}.tabs-library-head,.tabs-project{justify-content:space-between;align-items:center;gap:var(--sp-3);display:flex}.tabs-library-head h2{margin:0 0 3px}.tabs-project-list{gap:var(--sp-2);display:grid}.tabs-project{padding:var(--sp-3);border:1px solid var(--line);background:var(--bg-sunken)}.tabs-project[data-project-accent]{border-left:2px solid var(--project-accent);background:linear-gradient(90deg, color-mix(in srgb, var(--project-accent) 7%, var(--bg-sunken)), var(--bg-sunken) 36%)}.tabs-project>div:first-child{gap:3px;min-width:0;display:grid}.tabs-project span{color:var(--text-dim);font:11px/1.35 var(--font-mono)}.tabs-project-actions{justify-content:flex-end;gap:var(--sp-2);flex-wrap:wrap;display:flex}.tabs-project-accent-control{display:inline-flex;position:relative}.tabs-project-accent-button,.tabs-project-accent-menu button{place-items:center;width:34px;height:34px;padding:0;display:inline-grid;border-radius:50%!important}.tabs-project-accent-button i,.tabs-project-accent-menu i{background:var(--project-accent);width:11px;height:11px;box-shadow:0 0 7px color-mix(in srgb, var(--project-accent) 42%, transparent);border-radius:50%;display:block}.tabs-project-accent-button{border-color:color-mix(in srgb, var(--project-accent) 46%, var(--line));background:color-mix(in srgb, var(--project-accent) 8%, var(--bg-raised))}.tabs-project-accent-button[data-on=true]{border-color:var(--project-accent);background:color-mix(in srgb, var(--project-accent) 14%, var(--bg-raised));box-shadow:0 0 13px color-mix(in srgb, var(--project-accent) 25%, transparent)}.tabs-project-accent-menu{z-index:5;border:1px solid var(--line-strong);border-radius:var(--radius-pill);background:var(--bg-raised);align-items:center;gap:5px;padding:6px;display:flex;position:absolute;bottom:calc(100% + 7px);right:0;box-shadow:0 10px 28px #0000003d}.tabs-project-accent-menu button{width:27px;height:27px}.tabs-project-accent-menu button[data-on=true]{border-color:var(--project-accent);background:color-mix(in srgb, var(--project-accent) 12%, var(--bg-raised))}.tabs-project-open{color:#55c98e;border-color:color-mix(in srgb, #55c98e 48%, var(--line));background:color-mix(in srgb, #55c98e 10%, var(--bg-raised))}.tabs-project-open:hover:not(:disabled){color:#76e4a8;background:color-mix(in srgb, #55c98e 16%, var(--bg-raised));border-color:#55c98e}.tabs-pro-gated{position:relative}.tabs-pro-gated .sticker-pro-badge{position:absolute;top:-6px;bottom:auto;right:-6px}.tabs-project-submit{color:var(--on-accent);border-color:var(--accent);background:var(--accent);box-shadow:var(--accent-glow)}.tabs-project-submit:hover:not(:disabled){color:var(--on-accent);border-color:var(--accent-strong);background:var(--accent-strong)}.tabs-project-submit[data-on=true]{color:var(--signal);border-color:color-mix(in srgb, var(--signal) 45%, var(--line));background:color-mix(in srgb, var(--signal) 10%, var(--bg-raised));box-shadow:none}.tabs-project-submit[data-on=true]:hover:not(:disabled){border-color:var(--signal);background:color-mix(in srgb, var(--signal) 18%, var(--bg-raised))}.tabs-project-submit-wrap{display:inline-flex}.tabs-project-submit-wrap:has(button:disabled){cursor:not-allowed}.tabs-project-submit:disabled{pointer-events:none}.tabs-project-delete{color:var(--signal);border-color:color-mix(in srgb, var(--signal) 38%, var(--line))}.tabs-project-delete:hover:not(:disabled){border-color:var(--signal);background:color-mix(in srgb, var(--signal) 9%, var(--bg-raised))}.tabs-notice{padding:var(--sp-2) var(--sp-3);color:var(--accent-strong);border-left:2px solid var(--accent);background:var(--accent-soft);font-size:12px}.tabs-share-link{gap:var(--sp-2);align-items:center;display:flex}.tabs-share-link input{flex:1;min-width:0}.tabs-empty,.tabs-placeholder{gap:var(--sp-2);display:grid}.tabs-empty{padding:var(--sp-6);text-align:center;color:var(--text-dim)}.tabs-placeholder p{max-width:720px;color:var(--text-dim);margin:0;line-height:1.55}.tabs-community{gap:var(--sp-5);display:grid}.tabs-community-toolbar{align-items:center;gap:var(--sp-3);padding:var(--sp-2);border:1px solid var(--line);border-radius:var(--radius-md);background:var(--bg-raised);display:flex}.tabs-community-switch,.tabs-community-filters,.tabs-community-volume,.tabs-voting-controls,.tabs-voting-controls>div{align-items:center;gap:var(--sp-2);display:flex}.tabs-community-switch{flex:none}.tabs-community-switch button,.tabs-icon-button,.tabs-auto-button{min-height:30px;padding:0 var(--sp-3);color:var(--text-dim);letter-spacing:.01em;text-transform:none;font:700 10px/1 var(--font-mono)!important}.tabs-community-switch button[data-on=true],.tabs-auto-button[data-on=true]{color:var(--accent-strong);border-color:color-mix(in srgb, var(--accent) 58%, var(--line));background:var(--accent-soft)}.tabs-community-filters{flex:1;min-width:0}.tabs-community-filters label{min-width:0;color:var(--text-dim);font:700 9px/1 var(--font-mono);letter-spacing:.01em;text-transform:none;align-items:center;gap:6px;display:flex}.tabs-community-filters select{min-width:116px;height:30px;padding:0 26px 0 var(--sp-2);font:700 10px/1 var(--font-mono)}.tabs-community-volume{min-width:166px;padding-left:var(--sp-3);border-left:1px solid var(--line);color:var(--text-dim);margin-left:auto}.tabs-community-volume>span{filter:saturate(.65);font-size:13px}.tabs-community-volume input{width:78px;accent-color:var(--accent)}.tabs-community-volume b{min-width:28px;color:var(--text);font:700 10px/1 var(--font-mono);text-align:right}.tabs-community-intro,.tabs-community-section-head,.tabs-community-card-top,.tabs-community-meta{justify-content:space-between;align-items:center;gap:var(--sp-3);display:flex}.tabs-community-intro{padding:0 var(--sp-1)}.tabs-community-intro h2,.tabs-community-section-head h3,.tabs-community-card h3{margin:0}.tabs-community-count,.tabs-community-section-head>b{border:1px solid var(--line);border-radius:var(--radius-pill);color:var(--text-dim);font:700 9px/1 var(--font-mono);letter-spacing:.06em;text-transform:none;white-space:nowrap;padding:5px 8px}.tabs-community-section{gap:var(--sp-3);display:grid}.tabs-community-section-head{padding:0 var(--sp-1)}.tabs-community-section-head>div{gap:3px;display:grid}.tabs-community-section-head h3{font-size:16px}.tabs-community-section-head span{color:var(--text-dim);font-size:12px}.tabs-community-section-head>b{color:var(--accent-strong);border-color:color-mix(in srgb, var(--accent) 42%, var(--line))}.tabs-community-section--candidates .tabs-community-section-head>b{color:var(--signal);border-color:color-mix(in srgb, var(--signal) 42%, var(--line))}.tabs-battle-banner{align-items:center;gap:var(--sp-2) var(--sp-4);padding:var(--sp-3);border:1px solid color-mix(in srgb, var(--accent) 40%, var(--line));border-radius:var(--radius-2);background:color-mix(in srgb, var(--accent) 8%, var(--bg-raised));flex-wrap:wrap;font-size:13px;display:flex}.tabs-battle-badge{color:var(--accent-strong);font-weight:800}.tabs-battle-banner--compact{padding:var(--sp-2) var(--sp-3);font-size:12px}.tabs-community-section--candidates .tabs-community-card-top>b{color:var(--signal);font:700 9px/1 var(--font-mono);letter-spacing:.01em;text-transform:none}.tabs-voting-controls{padding:0 var(--sp-1);color:var(--text-dim);font:700 10px/1 var(--font-mono);justify-content:space-between}.tabs-icon-button{width:32px;padding:0;font-size:16px!important}.tabs-auto-button{min-width:62px}.tabs-voting-card{border-color:color-mix(in srgb, var(--signal) 24%, var(--line))}.tabs-community-grid{gap:var(--sp-3);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.tabs-community-card{gap:var(--sp-2);min-width:0;padding:var(--sp-4);border:1px solid var(--line);border-radius:var(--radius-md);background:var(--bg-raised);display:grid;position:relative;overflow:hidden}.tabs-community-card[data-featured=true]{border-color:color-mix(in srgb, var(--accent) 56%, var(--line));box-shadow:var(--accent-glow)}.tabs-community-card[data-project-accent]{border-color:color-mix(in srgb, var(--project-accent) 46%, var(--line));background:linear-gradient(130deg, color-mix(in srgb, var(--project-accent) 10%, var(--bg-raised)), var(--bg-raised) 48%);box-shadow:0 0 16px color-mix(in srgb, var(--project-accent) 12%, transparent)}.tabs-community-card[data-featured=true]:after{content:"";pointer-events:none;background:linear-gradient(125deg, color-mix(in srgb, var(--accent) 9%, transparent), transparent 42%);position:absolute;inset:0}.tabs-community-card-top{z-index:1;min-height:18px;position:relative}.tabs-community-card-top>span{color:var(--text-dim);font:700 10px/1 var(--font-mono);text-transform:uppercase;letter-spacing:.05em}.tabs-community-card-top>b{color:var(--accent-strong);font:700 9px/1 var(--font-mono);text-transform:none;letter-spacing:.01em}.tabs-community-card h3{z-index:1;font-size:18px;line-height:1.15;position:relative}.tabs-community-card p{z-index:1;color:var(--text-dim);margin:0;font-size:12px;position:relative}.tabs-community-meta{z-index:1;margin-top:var(--sp-1);color:var(--text-dim);font:10px/1 var(--font-mono);position:relative}.tabs-community-card-actions{z-index:1;justify-content:space-between;align-items:center;gap:var(--sp-2);display:flex;position:relative}.tabs-community-card-main-actions{align-items:center;gap:var(--sp-2);min-width:0;display:flex}.tabs-community-card-save-actions{align-items:center;gap:var(--sp-2);display:flex}.tabs-save-button{width:30px;height:30px;color:var(--text-dim);background:var(--bg-raised);border-radius:50%;place-items:center;padding:0;display:inline-grid}.tabs-save-button:hover:not(:disabled){color:var(--accent-strong);border-color:color-mix(in srgb, var(--accent) 58%, var(--line));background:color-mix(in srgb, var(--accent) 9%, var(--bg-raised))}.tabs-save-button[data-on=true]{color:var(--accent-strong);border-color:color-mix(in srgb, var(--accent) 68%, var(--line));background:color-mix(in srgb, var(--accent) 14%, var(--bg-raised));box-shadow:0 0 12px color-mix(in srgb, var(--accent) 20%, transparent)}.tabs-preview-button{min-width:94px;height:30px;padding:0 var(--sp-2);color:var(--text);letter-spacing:.01em;text-transform:none;justify-content:center;align-items:center;gap:6px;display:inline-flex;font:700 10px/1 var(--font-mono)!important}.tabs-preview-button>span{color:var(--accent-strong);font-size:10px}.tabs-open-button{height:30px;padding:0 var(--sp-2);color:var(--text-dim);letter-spacing:.01em;text-transform:none;font:700 9px/1 var(--font-mono)!important}.tabs-like-button{min-width:54px;height:30px;padding:0 var(--sp-2);color:var(--text-dim);justify-content:center;align-items:center;gap:5px;display:inline-flex;font:700 11px/1 var(--font-mono)!important}.tabs-like-button span{color:var(--signal);font-size:15px;line-height:1}.tabs-like-button[data-on=true]{border-color:color-mix(in srgb, var(--signal) 68%, var(--line));color:var(--signal);background:color-mix(in srgb, var(--signal) 11%, var(--bg-raised));box-shadow:var(--signal-glow)}.composer-project-colors{margin-top:var(--sp-2);flex-wrap:wrap;align-items:center;gap:7px;display:flex}.composer-project-colors>span{color:var(--text-dim);margin-right:2px;font-size:11px}.composer-project-accent{place-items:center;width:28px;height:28px;padding:0;display:inline-grid;border-radius:50%!important}.composer-project-accent i{background:var(--project-accent);width:11px;height:11px;box-shadow:0 0 7px color-mix(in srgb, var(--project-accent) 38%, transparent);border-radius:50%;display:block}.composer-project-accent[data-on=true]{border-color:var(--project-accent);background:color-mix(in srgb, var(--project-accent) 12%, var(--bg-raised));box-shadow:0 0 13px color-mix(in srgb, var(--project-accent) 25%, transparent)}.account-page{gap:var(--sp-4);display:grid}.account-identity-bar{justify-content:space-between;align-items:center;gap:var(--sp-4);padding:var(--sp-3) var(--sp-4);border:1px solid var(--line);border-radius:var(--radius-md);background:var(--bg-raised);display:flex}.account-plan-badge,.tabs-author-badge{border-radius:var(--radius-pill);background:var(--accent);color:var(--on-accent);font:800 9px/1.6 var(--font-mono);letter-spacing:.04em;vertical-align:middle;margin-left:6px;padding:1px 6px}.account-profile{gap:var(--sp-3);padding:var(--sp-5);display:grid}.account-profile h3{margin:var(--sp-2) 0 0;font-size:13px}.account-setting-row{align-items:center;gap:var(--sp-3);flex-wrap:wrap;display:flex}.account-setting-row h3{flex:none;min-width:120px;margin:0}.account-notice{padding:var(--sp-3);border-left:2px solid var(--signal);background:var(--signal-soft);border-radius:var(--radius-sm);gap:var(--sp-2);display:grid}.account-status-on{color:var(--bass);font-weight:700}.account-status-off{color:var(--text-dim);font-weight:700}.auth-2fa-setup{gap:var(--sp-3);padding:var(--sp-4);border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--bg-sunken);width:fit-content;max-width:100%;display:grid}.auth-2fa-body{align-items:center;gap:var(--sp-4);flex-wrap:wrap;display:flex}.auth-qr-frame{border-radius:var(--radius-sm);background:#fff;flex:none;padding:10px;line-height:0;display:inline-flex}.auth-qr{width:160px;height:160px;display:block}.auth-2fa-fields{align-items:center;gap:var(--sp-2);flex-wrap:wrap;flex:none;display:flex}.auth-2fa-secret{width:190px;font-family:var(--font-mono);letter-spacing:.02em;font-size:12px}.auth-2fa-fields input:not(.auth-2fa-secret){width:120px}.account-author-bar{justify-content:space-between;align-items:center;gap:var(--sp-4);padding:var(--sp-3) var(--sp-4);border:1px solid var(--line);border-radius:var(--radius-md);background:var(--bg-raised);display:flex}.account-author-bar>div{gap:3px;display:grid}.account-author-bar b{font-size:13px}.account-author-bar>div>span{color:var(--text-dim);font-size:11px}.account-author-bar label{align-items:center;gap:var(--sp-2);color:var(--text-dim);white-space:nowrap;font-size:11px;display:flex}.account-author-bar input{width:min(280px,32vw);min-width:160px;height:34px;padding:0 var(--sp-3)}@media (width<=760px){.account-author-bar,.account-author-bar label{flex-direction:column;align-items:stretch}.account-author-bar input{width:100%}.tabs-community-grid{grid-template-columns:1fr}.tabs-community-toolbar{flex-wrap:wrap;align-items:stretch}.tabs-community-switch{width:100%}.tabs-community-switch button{flex:1}.tabs-community-filters{flex:100%}.tabs-community-filters label{flex:1}.tabs-community-filters select{width:100%;min-width:0}.tabs-community-volume{border-left:0;margin-left:0;padding-left:0}.tabs-library-head,.tabs-project{flex-direction:column;align-items:stretch}.tabs-project-actions{justify-content:flex-start}}@media (width<=480px){.tabs-community-intro,.tabs-community-section-head{flex-direction:column;align-items:flex-start}.tabs-community-filters{flex-direction:column;align-items:stretch}.tabs-community-volume{width:100%}.tabs-community-volume input{flex:1;width:auto}}.bpm-lookup-card{gap:var(--sp-3)}.bpm-lookup-form{gap:var(--sp-2);grid-template-columns:minmax(0,1fr) auto;display:grid}.bpm-lookup-form input{min-width:0;min-height:34px;padding:0 var(--sp-3);border:1px solid var(--line-strong);border-radius:var(--radius-pill);background:var(--bg-sunken);color:var(--text);font:12px/1.2 var(--font-ui);outline:none}.bpm-lookup-form input::placeholder{color:var(--text-dim);opacity:.8}.bpm-lookup-form input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.bpm-lookup-error{color:var(--signal);font-size:12px;line-height:1.45}.bpm-lookup-results{gap:var(--sp-2);display:grid}.bpm-lookup-video{padding:var(--sp-2) var(--sp-3);border-left:2px solid var(--accent);background:var(--bg-sunken);gap:2px;display:grid}.bpm-lookup-video>span,.bpm-lookup-video small{color:var(--text-dim);font:10px/1.35 var(--font-mono)}.bpm-lookup-video b{font-size:12px;line-height:1.35}.bpm-lookup-candidates{gap:var(--sp-1);display:grid}.bpm-lookup-candidate{align-items:center;column-gap:var(--sp-3);width:100%;min-height:42px;padding:var(--sp-2) var(--sp-3);text-align:left;grid-template-columns:minmax(0,1fr) auto;display:grid}.bpm-lookup-candidate[data-best=true]{border-color:color-mix(in srgb, var(--accent) 62%, var(--line));background:var(--accent-soft)}.bpm-lookup-candidate-name{text-overflow:ellipsis;white-space:nowrap;font-size:11px;overflow:hidden}.bpm-lookup-candidate-tempo{color:var(--accent-strong);font:700 13px/1 var(--font-mono);white-space:nowrap;grid-area:1/2/span 2}.bpm-lookup-candidate small{color:var(--text-dim);grid-column:1;font-size:9px}.chord-variants-button{min-width:0;max-width:100%;min-height:34px;padding:0 var(--sp-3);border-radius:var(--radius-pill);color:var(--accent-strong);border-color:color-mix(in srgb, var(--accent) 55%, var(--line));background:var(--accent-soft);justify-content:center;align-items:center;gap:var(--sp-2);font-size:11px;font-weight:700;display:inline-flex}.chord-variants-button>span:first-child{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.chord-variants-button--compact{padding:0 var(--sp-2);gap:4px}.chord-variants-button:hover{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 20%, var(--bg-raised))}.chord-variants-button b{border-radius:var(--radius-pill);min-width:22px;height:20px;color:var(--on-accent);background:var(--accent);font:700 10px/1 var(--font-mono);justify-content:center;align-items:center;padding:0 5px;display:inline-flex}.chord-slot--variants{border-color:color-mix(in srgb, var(--accent) 45%, var(--line));background:var(--bg-raised);box-shadow:4px 4px 0 var(--bg-raised), 5px 5px 0 color-mix(in srgb, var(--accent) 24%, var(--line)), 8px 8px 0 var(--bg-raised), 9px 9px 0 color-mix(in srgb, var(--accent) 14%, var(--line));margin:0 8px 8px 0}.chord-slot--variants:hover{border-color:var(--accent)}.chord-variants-count{z-index:2;border:1px solid color-mix(in srgb, var(--accent) 50%, var(--line));border-radius:var(--radius-pill);min-width:19px;height:19px;color:var(--accent-strong);background:color-mix(in srgb, var(--accent) 14%, var(--bg-raised));font:700 10px/1 var(--font-mono);white-space:nowrap;pointer-events:none;justify-content:center;align-items:center;padding:0 4px;display:inline-flex;position:absolute;top:7px;right:7px}.catalog-empty{padding:var(--sp-6);border:1px dashed var(--line-strong);border-radius:var(--radius-md);color:var(--text-dim);text-align:center;font-size:12px}@media (width<=760px){.chord-catalog-search{flex:100%}.chord-catalog-search input[type=search]{width:100%}}.tabview{background:var(--bg-raised);border:1px solid var(--line);border-radius:var(--radius-lg);padding:var(--sp-3) var(--sp-4);width:100%;overflow-x:auto}.riffonic-tabview{overscroll-behavior-x:contain;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--bg-sunken);scrollbar-color:var(--line-strong) transparent;overflow-x:auto}.riffonic-tab-shell{gap:var(--sp-2);display:grid}.riffonic-tab-controls{justify-content:flex-end;align-items:center;gap:var(--sp-3);padding:0 var(--sp-2);flex-wrap:wrap;display:flex}.riffonic-tab-zoom{justify-content:flex-end;align-items:center;gap:var(--sp-2);color:var(--text-dim);font:700 10px/1 var(--font-mono);display:flex}.riffonic-tab-zoom button{width:26px;min-width:26px;min-height:26px;font:700 16px/1 var(--font-mono);padding:0}.riffonic-tab-zoom .riffonic-tab-export{width:auto;min-width:40px;color:var(--accent-strong);padding:0 8px;font-size:10px}.riffonic-tab-controls>.riffonic-tab-export{min-width:40px;color:var(--accent-strong);font:700 10px/1 var(--font-mono);padding:0 8px}.riffonic-tab-size{align-items:center;column-gap:var(--sp-2);color:var(--text-dim);font:700 11px/1 var(--font-mono);grid-template-rows:18px 8px;grid-template-columns:auto 92px;display:grid}.riffonic-tab-size>span{grid-area:1/1}.riffonic-tab-size input{width:92px;accent-color:var(--accent);cursor:pointer;grid-area:1/2;margin:0}.riffonic-tab-size i{grid-area:2/2;justify-content:space-between;width:92px;padding:0 5px;display:flex}.riffonic-tab-size b{background:var(--text-dim);opacity:.72;border-radius:2px;width:2px;height:4px;display:block}.riffonic-tabview-surface{height:238px;padding:28px 0 0;position:relative}.riffonic-tabview-ruler{height:16px;color:var(--text-dim);font:700 11px/1 var(--font-mono);position:absolute;inset:8px 0 auto}.riffonic-tabview-ruler b{position:absolute;transform:translate(-2px)}.riffonic-tabview-staff{height:130px;position:absolute;top:68px;left:0;right:0}.riffonic-tabview-staff>i:not(.riffonic-tabview-bar){background:color-mix(in srgb, var(--text-dim) 68%, transparent);height:1px;position:absolute;left:0;right:0}.riffonic-tabview-bar{background:color-mix(in srgb, var(--text) 72%, transparent);width:1px;position:absolute;top:0;bottom:0}.riffonic-tab-note{z-index:2;box-sizing:border-box;width:var(--riffonic-note-box,26px);min-height:var(--riffonic-note-box,26px);color:var(--accent-strong);background:var(--bg-sunken);font-family:var(--font-mono);font-size:var(--riffonic-note-size,15px);cursor:pointer;touch-action:manipulation;border:0;border-radius:5px;padding:0 4px;font-weight:800;line-height:1;position:absolute;transform:translate(-50%,-50%)}.riffonic-tab-note:hover,.riffonic-tab-note--active{color:var(--text);background:color-mix(in srgb, var(--accent) 26%, var(--bg-sunken))}.riffonic-tab-note:active:not(:disabled){color:var(--text);background:color-mix(in srgb, var(--accent) 42%, var(--bg-sunken));box-shadow:0 0 12px color-mix(in srgb, var(--accent) 40%, transparent);transform:translate(-50%,-50%)}.riffonic-tab-note--hit{color:var(--accent-strong)}.riffonic-tab-note--wrong,.riffonic-tab-note--missed{color:var(--signal)}@media (width<=420px){.riffonic-tab-controls{justify-items:stretch;gap:var(--sp-2);grid-template-columns:1fr;display:grid}.riffonic-tab-zoom{justify-content:flex-start}.riffonic-tab-size{grid-template-columns:auto minmax(120px,1fr);width:100%}.riffonic-tab-size input,.riffonic-tab-size i{width:100%}}.riffonic-tab-bend{z-index:3;width:24px;height:38px;color:var(--accent-strong);pointer-events:none;position:absolute;transform:translate(-7px)}.riffonic-tab-bend em{color:var(--text);font:700 9px/1 var(--font-mono);white-space:nowrap;font-style:normal;position:absolute;top:0;left:50%;transform:translate(-50%)}.riffonic-tab-bend svg{fill:none;width:22px;height:31px;stroke:var(--text);stroke-width:1.25px;stroke-linecap:round;stroke-linejoin:round;position:absolute;bottom:0;left:0}.riffonic-tab-vibrato{z-index:3;fill:none;width:34px;height:10px;stroke:var(--text);stroke-width:1.7px;stroke-linecap:round;pointer-events:none;position:absolute;overflow:visible;transform:translate(-7px)}.riffonic-tab-sustain{z-index:3;min-width:42px;color:var(--text);font:italic 700 9px/1 var(--font-mono);white-space:nowrap;pointer-events:none;align-items:center;gap:3px;display:flex;position:absolute}.riffonic-tab-sustain i{opacity:.75;border-top:1px dashed;width:28px;display:inline-block}.riffonic-tab-staccato{z-index:3;background:var(--text);pointer-events:none;border-radius:50%;width:5px;height:5px;position:absolute;transform:translate(2px)}.riffonic-tab-slide-mark{z-index:3;color:var(--text);font:italic 700 16px/1 var(--font-mono);pointer-events:none;position:absolute}.riffonic-tab-legato{z-index:3;color:var(--text-dim);font:italic 800 10px/1 var(--font-mono);pointer-events:none;position:absolute;transform:translate(-50%)}.riffonic-tab-strum{z-index:3;fill:none;width:16px;height:18px;stroke:var(--text);stroke-width:1.5px;stroke-linecap:round;stroke-linejoin:round;pointer-events:none;position:absolute;top:208px;transform:translate(-5px)}.riffonic-tabview-cursor{z-index:4;opacity:0;pointer-events:none;background:var(--accent);width:2px;box-shadow:0 0 12px color-mix(in srgb, var(--accent) 72%, transparent);transition:opacity .12s;position:absolute;top:48px;bottom:26px}.riffonic-tabview-slides{z-index:1;pointer-events:none;position:absolute;top:0;left:0;overflow:visible}.riffonic-tabview-slides path{fill:none;stroke:var(--accent);stroke-width:1.5px;stroke-linecap:round}.riffonic-tabview-slides text{fill:var(--accent-strong);font:italic 700 10px/1 var(--font-mono);text-anchor:middle}.tabview svg text:not([fill]){fill:var(--text-dim)}.verdicts{gap:var(--sp-1);flex-wrap:wrap;display:flex}.verdict{background:var(--line-strong);border-radius:5px;width:22px;height:22px}.verdict[data-status=hit]{background:var(--accent)}.verdict[data-status=wrong_pitch]{background:var(--signal)}.verdict[data-status=missed]{border:1px solid var(--signal);background:0 0}.verdict[data-status=pending]{border:1px solid var(--line-strong);background:0 0}.exercise-picker-row{align-items:center}.exercise-picker-row select{flex:1;min-width:0}.exercise-picker-row button{white-space:nowrap;flex:none;width:auto}.exercise-divider{border:none;border-top:1px solid var(--line);margin:0}.exercise-result-stats{gap:var(--sp-5);display:flex}.exercise-result-stat{flex-direction:column;gap:2px;display:flex}.exercise-result-body{gap:var(--sp-2);flex-direction:column;display:flex}.exercise-result-body--disabled{opacity:.4;pointer-events:none}.tab-stack{isolation:isolate;position:relative}.tab-overlay{pointer-events:none;z-index:2;position:absolute;inset:0}.tab-slide-connector{pointer-events:none;position:absolute;inset:0;overflow:visible}.tab-slide-connector-line{fill:none;stroke:var(--accent-strong);stroke-width:1.7px;stroke-linecap:round;filter:drop-shadow(0 0 4px color-mix(in srgb, var(--accent) 54%, transparent))}.tab-slide-connector-guide{fill:none;stroke:var(--accent-strong);stroke-width:1.25px;stroke-linecap:round;opacity:.92}.tab-slide-connector-label{fill:var(--accent-strong);font:italic 800 11px/1 var(--font-mono);letter-spacing:.08em;paint-order:stroke;stroke:var(--bg-raised);stroke-width:3px}.tab-cursor{background:var(--accent);opacity:0;will-change:transform;width:2px;position:absolute;left:0}.tab-mark{border:2px solid var(--text);opacity:0;border-radius:6px;transition:opacity 90ms linear,background 90ms linear,border-color 90ms linear;position:absolute}.tab-mark--clickable{pointer-events:auto;cursor:pointer;outline:none}.tab-mark--clickable:focus-visible{border-color:var(--accent);box-shadow:0 0 0 2px var(--bg), 0 0 0 4px var(--accent);opacity:.7!important}.tab-mark--clickable:hover{border-color:var(--accent);opacity:.6!important}.tab-mark--clickable:active{background:color-mix(in srgb, var(--accent) 30%, transparent);opacity:1!important}.tab-note-hit{pointer-events:auto;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;border:2px solid #0000;border-radius:6px;outline:none;position:absolute}.tab-note-hit:hover{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 16%, transparent)}.tab-note-hit:active{background:color-mix(in srgb, var(--accent) 30%, transparent)}.tab-note-hit:focus-visible{border-color:var(--accent);box-shadow:0 0 0 2px var(--bg), 0 0 0 4px var(--accent)}.composer-fretboard,.composer-fretboard svg,.composer-timeline,.chord-grid,.chord-row{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.composer-fretboard{width:100%;min-height:252px;overflow-x:auto}.composer-fretboard svg{min-width:980px;display:block}@media (width>=1025px){.composer-fretboard{overflow:hidden}}.composer-position-legend{justify-content:flex-end;gap:var(--sp-3);margin-top:var(--sp-2);flex-wrap:wrap;display:flex}.composer-position-chip{border:1px solid color-mix(in srgb, var(--position-color) 42%, var(--line));width:30px;min-height:30px;color:color-mix(in srgb, var(--position-color) 78%, var(--text));background:color-mix(in srgb, var(--position-color) 7%, var(--bg-raised));cursor:pointer;border-radius:8px;place-items:center;padding:0;font-family:inherit;font-size:13px;font-weight:700;transition:border-color .14s,background .14s,transform .14s;display:grid}.composer-position-chip:hover{border-color:var(--position-color);background:color-mix(in srgb, var(--position-color) 15%, var(--bg-raised))}.composer-position-chip:active{transform:translateY(1px)}.composer-position-chip:focus-visible{outline:2px solid var(--position-color);outline-offset:2px}.composer-position-chip[data-selected=true]{border-color:var(--position-color);background:color-mix(in srgb, var(--position-color) 22%, var(--bg-raised));box-shadow:0 0 0 2px color-mix(in srgb, var(--position-color) 18%, transparent)}.composer-position-reset{border:1px solid var(--line-strong);width:30px;min-height:30px;color:var(--text-dim);background:var(--bg-raised);font:700 16px/1 var(--font-mono);cursor:pointer;border-radius:50%;place-items:center;padding:0;display:grid}.composer-position-reset:hover:not(:disabled){color:var(--text);border-color:var(--accent)}.composer-position-reset:disabled{opacity:.35;cursor:default}.composer-position-reset:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.composer-layer-legend{gap:var(--sp-4);margin-top:var(--sp-2);padding-top:var(--sp-2);border-top:1px solid var(--line);color:var(--text-dim);flex-wrap:wrap;font-size:10px;display:flex}.composer-layer-legend span{align-items:center;gap:6px;display:inline-flex}.composer-layer-legend i{flex:none;display:inline-block}.composer-legend-box{background:color-mix(in srgb, var(--accent) 18%, transparent);border-radius:2px;width:14px;height:10px}.composer-legend-scale{background:#48c878;border-radius:50%;width:6px;height:6px}.composer-legend-suggestion{border:2px solid var(--accent);border-radius:50%;width:11px;height:11px}.composer-scale-note,.composer-suggestion{pointer-events:none}.composer-guidance{gap:var(--sp-3);padding:var(--sp-4);border:1px solid color-mix(in srgb, var(--accent) 35%, var(--line));border-radius:var(--radius-md);background:color-mix(in srgb, var(--accent-soft) 45%, var(--bg-sunken));flex-direction:column;display:flex}.composer-guidance-head{justify-content:space-between;align-items:flex-start;gap:var(--sp-4);display:flex}.composer-guidance-head strong{font-size:14px;font-weight:600}.composer-context-chips{justify-content:flex-end;gap:var(--sp-2);flex-wrap:wrap;display:flex}.composer-context-chips span{border:1px solid var(--line-strong);border-radius:var(--radius-pill);color:var(--text-dim);background:var(--bg-raised);white-space:nowrap;padding:4px 8px;font-size:10px}.composer-recommendations{gap:var(--sp-2);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.composer-recommendations button{align-items:center;gap:var(--sp-2);padding:var(--sp-3);text-align:left;grid-template-columns:auto auto 1fr;display:grid}.recommendation-rank{width:24px;height:24px;color:var(--on-accent);background:var(--accent);font-family:var(--font-mono);border-radius:50%;place-items:center;font-weight:700;display:grid}.recommendation-note{font-family:var(--font-mono);font-size:16px;font-weight:700}.recommendation-score{color:var(--accent-strong);justify-self:end;font-size:10px}.composer-recommendations small{color:var(--text-dim);grid-column:2/-1;font-size:10px;line-height:1.35}.composer-cell{cursor:pointer;touch-action:none}.composer-cell:hover{fill:color-mix(in srgb, var(--accent) 10%, transparent)}.note-chip{min-width:64px}.composer-projects{gap:var(--sp-3)}.composer-projects-heading h2{align-items:center;gap:var(--sp-3);margin:0;display:flex}.composer-project-count{min-width:30px;height:30px;padding:0 var(--sp-2);border:1px solid var(--line-strong);border-radius:var(--radius-pill);color:var(--text-dim);font:700 11px/1 var(--font-mono);place-items:center;display:grid}.composer-projects-controls{align-items:center;gap:var(--sp-3);flex-wrap:wrap;display:flex}.composer-project-picker{flex:320px;max-width:520px}.composer-project-actions{gap:var(--sp-2);flex-wrap:wrap;align-items:center;margin-left:auto;display:flex}.composer-project-limit{padding:0 var(--sp-2);font:700 11px/1 var(--font-mono);color:var(--text-dim)}.composer-project-limit[data-full=true]{color:var(--signal)}.composer-project-edit{width:36px;min-width:36px;color:var(--accent-strong);padding:0;font-size:18px}.composer-project-save{border-color:color-mix(in srgb, var(--accent) 62%, var(--line));color:var(--accent-strong);background:var(--accent-soft)}.composer-project-popup-actions{align-items:center}.composer-project-popup-actions select{min-width:150px;margin-left:auto}.composer-projects input,.composer-projects select{width:100%}.composer-rhythm-card{gap:var(--sp-4)}.composer-source-switch{flex-flow:wrap;justify-content:space-between;align-items:center;display:none}.composer-fretboard-tools{justify-content:flex-start;gap:var(--sp-2);flex-wrap:wrap;align-items:center;display:flex}.composer-key-tools{align-items:center;gap:var(--sp-2);margin-left:auto;display:flex}.composer-key-tools select:first-child{width:74px}.composer-key-tools select:last-child{width:min(220px,52vw)}.composer-source-tools{gap:var(--sp-2);flex-wrap:wrap;display:flex}.composer-source-switch>div:first-child{gap:3px;display:grid}.composer-source-switch .seg{min-width:min(100%,320px)}.composer-source-stage{align-content:start;gap:var(--sp-4);overflow-anchor:none;min-height:430px;display:grid}.composer-source-stage[data-mode=drums],.composer-source-stage[data-mode=notes]{min-height:0}.composer-source-stage>.card{width:100%}.composer-chord-browser{gap:var(--sp-4)}.composer-chord-levels{align-items:stretch}.composer-chord-level-row{align-items:end;gap:var(--sp-3);flex-wrap:wrap;display:flex}.composer-chord-level-row .composer-chord-levels{flex:620px}.composer-chord-levels button{text-align:center;align-content:center;min-width:145px;min-height:42px;display:grid}.composer-chord-levels button b{font-size:12px}.composer-chord-levels button small{color:var(--text-dim);font-size:9px;line-height:1.25}.composer-chord-root-filter{flex:0 190px;margin-left:auto}.composer-chord-grid{align-items:stretch}.composer-chord-grid>.chord-slot{width:var(--composer-chord-tile-w,190px);min-height:var(--composer-chord-tile-min-h,205px);justify-content:flex-start}.composer-chord-zoom{align-items:center;gap:var(--sp-2);color:var(--text-dim);font:700 11px/1 var(--font-mono);margin-left:auto;display:flex}.composer-chord-zoom input{width:92px;accent-color:var(--accent);cursor:pointer;margin:0}.composer-chord-card-title{justify-items:center;gap:1px;min-height:34px;display:grid}.composer-chord-card-title b{font:800 17px/1 var(--font-mono);color:var(--text)}.composer-chord-card-title span{color:var(--text-dim);font-size:10px}.composer-chord-fingers{color:var(--text-dim);text-align:center;font-size:9px}[data-track-kind=guitar]{--track-color:#d89532}[data-track-kind=bass]{--track-color:#35ad78}[data-track-kind=chords]{--track-color:#8b78e6}[data-track-kind=drums]{--track-color:#db655e}.composer-source-button,.composer-track-add{border-color:color-mix(in srgb, var(--track-color) 55%, var(--line));color:color-mix(in srgb, var(--track-color) 78%, var(--text));background:color-mix(in srgb, var(--track-color) 8%, var(--bg-raised))}.composer-source-button{box-sizing:border-box;width:108px;height:38px;padding:0 var(--sp-3);letter-spacing:.02em;white-space:nowrap;font-size:11px;font-weight:600;line-height:1}.composer-source-button:hover:not(:disabled),.composer-track-add:hover:not(:disabled){border-color:var(--track-color);background:color-mix(in srgb, var(--track-color) 15%, var(--bg-raised))}.composer-source-button[data-on=true]{border-color:var(--track-color);color:color-mix(in srgb, var(--track-color) 82%, var(--text));background:color-mix(in srgb, var(--track-color) 18%, var(--bg-raised))}@media (width<=640px){.composer-chord-levels button{min-width:calc(50% - var(--sp-2));flex:1 1 calc(50% - var(--sp-2))}.composer-chord-level-row .composer-chord-levels,.composer-chord-root-filter{flex-basis:100%}.composer-chord-grid>.chord-slot{width:calc(50% - var(--sp-2));min-width:145px}}.composer-drum-card{gap:var(--sp-4);display:grid}.composer-drum-pads{gap:var(--sp-3);grid-template-columns:repeat(auto-fit,minmax(130px,1fr));display:grid}.composer-drum-pad{min-height:86px;padding:var(--sp-3);border-color:color-mix(in srgb, var(--accent) 34%, var(--line));background:radial-gradient(circle at 50% 35%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 58%), var(--bg-sunken);text-align:left;touch-action:none;-webkit-user-select:none;user-select:none;justify-content:space-between;align-items:flex-end;font-size:12px;font-weight:700;display:flex}.composer-drum-pad:hover{border-color:var(--accent);transform:translateY(-1px)}.composer-drum-pad:active{background:var(--accent-soft);transform:scale(.98)}.composer-drum-pad kbd{border:1px solid var(--line-strong);border-radius:var(--radius-sm);color:var(--text-dim);background:var(--bg-raised);font:9px/1 var(--font-mono);padding:4px 6px}.composer-drum-pad[data-voice=kick],.composer-drum-pad[data-voice=tom]{border-bottom-color:#d68a3a}.composer-drum-pad[data-voice=snare],.composer-drum-pad[data-voice=clap]{border-bottom-color:#db6575}.composer-drum-pad[data-voice=closed_hat],.composer-drum-pad[data-voice=open_hat],.composer-drum-pad[data-voice=crash]{border-bottom-color:#65a9db}.composer-control-grid{gap:var(--sp-5);grid-template-columns:minmax(0,1.5fr) minmax(220px,1fr) minmax(220px,1fr);display:grid}.composer-control-grid>div{gap:var(--sp-2);flex-direction:column;min-width:0;display:flex}.control-label{color:var(--text-dim);font-size:11px}.composer-timeline-status{align-items:center;gap:var(--sp-4);flex-wrap:wrap;font-size:11px;display:flex}.composer-timeline-status b{color:var(--text-dim);font-weight:500}.composer-timeline-toolbar{justify-content:space-between;align-items:center;gap:var(--sp-5);display:flex}.composer-timeline-transport-controls{align-items:end;gap:var(--sp-4) var(--sp-6);padding:var(--sp-3) 0 0;border-top:1px solid var(--line);flex-wrap:wrap;display:flex}.composer-sections-transport-controls{gap:var(--sp-3) var(--sp-4);padding-top:var(--sp-2)}.composer-timeline-control{gap:var(--sp-2);min-width:0;display:grid}.composer-timeline-seg{gap:6px}.composer-timeline-seg button{min-width:40px;font:700 14px/1 var(--font-mono);padding-inline:10px}.composer-timeline-timing-note{flex:240px;max-width:460px;font-size:11px;line-height:1.45}.composer-timeline-zoom{align-items:center;gap:var(--sp-2);color:var(--text-dim);font:10px/1 var(--font-mono);white-space:nowrap;grid-template-columns:auto minmax(88px,150px);display:grid}.composer-timeline-bpm{align-items:center;gap:var(--sp-3);color:var(--text-dim);font-family:var(--font-mono);white-space:nowrap;flex:0 330px;grid-template-columns:auto minmax(150px,240px);font-size:11px;display:grid}.composer-timeline-bpm b{color:var(--text);font-size:15px}.composer-timeline-bpm input{min-width:150px}.composer-mixer{gap:var(--sp-2);grid-template-columns:repeat(2,minmax(260px,1fr));display:grid}.composer-tracks-head{justify-content:space-between;align-items:center;gap:var(--sp-3);flex-wrap:wrap;display:flex}.composer-tracks-head>div:first-child{gap:3px;display:grid}.composer-tracks-head b{font-size:12px}.composer-tracks-head span{color:var(--text-dim);font-size:10px}.composer-tracks-head>div:last-child{gap:var(--sp-2);flex-wrap:wrap;display:flex}.composer-mixer-strip{align-items:center;gap:var(--sp-3);padding:var(--sp-2) var(--sp-3);border:1px solid var(--line);border-radius:var(--radius-md);background:color-mix(in srgb, var(--bg-sunken) 55%, transparent);grid-template-columns:minmax(110px,1fr) auto minmax(110px,1.4fr) auto;display:grid}.composer-mixer-strip[data-selected=true]{border-color:var(--track-color);box-shadow:inset 3px 0 0 var(--track-color)}.composer-mixer-strip[data-track-kind]{background:color-mix(in srgb, var(--track-color) 6%, var(--bg-sunken))}.composer-mixer-strip[data-muted=true]{opacity:.52}.composer-mixer-name{align-items:baseline;gap:var(--sp-2);display:flex}.composer-mixer-name input{width:100%;min-width:0;height:30px;padding:0 var(--sp-2);font-size:12px;font-weight:700}.composer-track-instrument{border:1px solid color-mix(in srgb, var(--track-color) 55%, var(--line));color:color-mix(in srgb, var(--track-color) 76%, var(--text));background:color-mix(in srgb, var(--track-color) 10%, transparent);font:8px/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;border-radius:999px;flex:none;padding:3px 6px}.composer-mixer-name span,.composer-mixer-strip label span{color:var(--text-dim);font:10px/1 var(--font-mono)}.composer-mixer-switches{gap:4px;display:flex}.composer-mixer-switches button{border-radius:var(--radius-sm);min-width:30px;min-height:30px;font:700 11px/1 var(--font-mono);padding:0}.composer-mixer-switches button[data-on=true]{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}.composer-mixer-strip label{align-items:center;gap:var(--sp-2);grid-template-columns:34px 1fr;display:grid}.composer-mixer-strip input{width:100%;min-width:0}.composer-track-remove{min-width:30px;min-height:30px;color:var(--text-dim);padding:0}.composer-track-required{color:var(--text-dim);font:9px/1 var(--font-mono);white-space:nowrap}.composer-sections{gap:var(--sp-2);padding:var(--sp-2) var(--sp-3);border:1px solid var(--line);border-radius:var(--radius-lg);background:color-mix(in srgb, var(--bg-sunken) 38%, transparent);display:grid}.composer-sections-head{justify-content:space-between;align-items:center;gap:var(--sp-3);flex-wrap:wrap;display:flex}.composer-sections-head>.composer-sections-copy{gap:3px;display:grid}.composer-section-editor-actions{justify-content:flex-end;gap:var(--sp-2);flex-wrap:wrap;display:flex}.composer-sections-head b{font-size:12px}.composer-sections-head span{color:var(--text-dim);font-size:10px}.composer-section-presets{flex-wrap:wrap;gap:5px;display:flex}.composer-section-presets button{align-items:center;gap:6px;display:inline-flex}.composer-section-presets i,.composer-section-row>i{background:var(--section-color);border-radius:50%;flex:none;width:7px;height:7px}.composer-section-list{gap:6px;display:grid}.composer-section-row{align-items:center;gap:var(--sp-2);grid-template-columns:auto minmax(130px,230px) 82px 32px 32px;justify-content:start;display:grid}.composer-section-row>input{width:100%}.composer-section-time{align-items:center;gap:4px;display:flex}.composer-section-time input{width:100%;min-width:0}.composer-section-time span{color:var(--text-dim);font:10px/1 var(--font-mono)}.composer-workspace-card>.composer-timeline{order:1}.composer-timeline-titlebar{justify-content:space-between;align-items:center;gap:var(--sp-3);display:flex}.composer-timeline-titlebar h2{margin:0}.composer-timeline-track-actions{align-items:center;gap:var(--sp-2);flex-wrap:wrap;display:flex}.composer-timeline-primary-actions{justify-content:flex-end;align-items:center;gap:var(--sp-2);flex-wrap:wrap;display:flex}.composer-listen-button{place-items:center;width:42px;min-width:42px;padding:0;display:inline-grid}.composer-loop-button{color:var(--accent-strong);font-size:18px}.composer-loop-button[data-on=true]{border-color:var(--accent);background:var(--accent-soft);box-shadow:var(--accent-glow)}.composer-workspace-card>.composer-sections{order:2}.composer-workspace-card>.composer-inspector{order:3}.composer-workspace-card>.composer-edit-toolbar{order:4}.composer-workspace-card>.composer-tracks-head{margin-top:var(--sp-2);order:5}.composer-workspace-card>.composer-mixer{order:6}.composer-timeline{width:100%;max-height:min(430px,56vh);padding:34px 0 var(--sp-2);overscroll-behavior:contain;scrollbar-gutter:stable;overflow:auto}.composer-timeline-track{border-bottom:1px solid var(--line);background:linear-gradient(to bottom, color-mix(in srgb, var(--bg-sunken) 45%, transparent), transparent);cursor:crosshair;min-height:180px;position:relative}.composer-section-lane{z-index:3;pointer-events:none;height:22px;position:absolute;top:0;left:0;right:0;overflow:hidden}.composer-section-marker{border:0;border-left:3px solid var(--section-color);background:color-mix(in srgb, var(--section-color) 16%, var(--bg-sunken));min-height:0;color:var(--text-dim);font:700 9px/20px var(--font-mono);text-align:left;text-overflow:ellipsis;white-space:nowrap;pointer-events:auto;border-radius:0;padding:0 7px;position:absolute;top:1px;bottom:1px;overflow:hidden}.composer-timeline-lane{border-top:1px solid color-mix(in srgb, var(--line) 75%, transparent);border-bottom:1px solid color-mix(in srgb, var(--line) 45%, transparent);background:color-mix(in srgb, var(--bg-sunken) 28%, transparent);pointer-events:none;height:72px;position:absolute;left:0;right:0}.composer-timeline-lane[data-track-kind]{background:color-mix(in srgb, var(--track-color) 3%, var(--bg-sunken))}.composer-timeline-lane[data-selected=true]{background:color-mix(in srgb, var(--track-color) 10%, transparent);border-color:color-mix(in srgb, var(--track-color) 45%, var(--line))}.composer-timeline-lane[data-track-kind]>span{color:color-mix(in srgb, var(--track-color) 72%, var(--text));opacity:.9}.composer-timeline-lane>span{left:var(--sp-2);top:var(--sp-1);z-index:2;color:var(--text-dim);font:9px/1 var(--font-mono);letter-spacing:.08em;opacity:.65;position:sticky}.composer-timeline-tick{border-left:1px solid var(--line);pointer-events:none;position:absolute;bottom:0}.composer-timeline-tick--bar{border-color:var(--line-strong);top:0}.composer-timeline-tick--beat{opacity:.7;top:24px}.composer-timeline-tick--sub{opacity:.35;top:44px}.composer-timeline-tick span{top:-16px;left:var(--sp-1);color:var(--text-dim);font-size:10px;position:absolute}.composer-timeline-drop{background:var(--accent);opacity:.6;width:2px;position:absolute;top:0;bottom:0}.composer-timeline-selection{z-index:2;border:1px solid color-mix(in srgb, var(--accent) 85%, white);background:color-mix(in srgb, var(--accent) 16%, transparent);pointer-events:none;min-width:1px;min-height:1px;position:absolute}.composer-playhead{z-index:4;background:var(--accent-strong);pointer-events:none;width:2px;box-shadow:0 0 0 1px color-mix(in srgb, var(--bg) 50%, transparent);position:absolute;top:-12px;bottom:0}.composer-playhead:before{content:"";background:var(--accent-strong);border-radius:3px 3px 50% 50%;width:12px;height:12px;position:absolute;top:-1px;left:-5px}.composer-playhead-time{border-radius:var(--radius-pill);color:var(--on-accent);background:var(--accent-strong);font:700 9px/1 var(--font-mono);font-variant-numeric:tabular-nums;white-space:nowrap;padding:2px 5px;position:absolute;top:-18px;left:0;transform:translate(-18%)}.composer-timeline-block{min-width:5px;height:58px;padding:var(--sp-2);border-radius:var(--radius-md);background:var(--bg-raised);border:1px solid var(--line-strong);cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;text-align:center;z-index:3;position:absolute;overflow:visible}.composer-timeline-block:before{content:"";z-index:4;border-radius:var(--radius-md) 1px 1px var(--radius-md);background:var(--track-color,var(--accent));width:5px;box-shadow:2px 0 0 color-mix(in srgb, var(--track-color,var(--accent)) 22%, transparent);pointer-events:none;position:absolute;top:-1px;bottom:-1px;left:-1px}.composer-timeline-block[data-compact=true]{padding:var(--sp-2) 4px 4px 7px}.composer-timeline-block[data-compact=true] .composer-timeline-sub,.composer-timeline-block[data-compact=true] .composer-timeline-technique,.composer-timeline-block[data-micro=true] .composer-timeline-label,.composer-timeline-block[data-micro=true] .composer-timeline-remove{display:none}.composer-timeline-block:active{cursor:grabbing}.composer-timeline-block[data-on=true]{border-color:var(--accent);background:var(--accent-soft)}.composer-timeline-block[data-selected=true]{z-index:12;border-width:2px;border-color:var(--accent);background:color-mix(in srgb, var(--accent) 34%, var(--bg-raised));box-shadow:0 0 0 2px color-mix(in srgb, var(--accent) 70%, transparent), 0 0 16px color-mix(in srgb, var(--accent) 45%, transparent)}.composer-timeline-block[data-suggestion=true]{border-color:color-mix(in srgb, #e8a843 55%, var(--line-strong));background:color-mix(in srgb, #e8a843 7%, var(--bg-raised))}.composer-timeline-block[data-track-kind]{border-color:color-mix(in srgb, var(--track-color) 62%, var(--line-strong));background:color-mix(in srgb, var(--track-color) 12%, var(--bg-raised))}.composer-timeline-block[data-track-kind][data-on=true]{border-color:var(--track-color);background:color-mix(in srgb, var(--track-color) 22%, var(--bg-raised));box-shadow:0 0 0 2px color-mix(in srgb, var(--track-color) 26%, transparent)}.composer-timeline-block[data-track-kind][data-selected=true]{border-width:2px;border-color:color-mix(in srgb, var(--track-color) 82%, var(--text));background:color-mix(in srgb, var(--track-color) 46%, var(--bg-raised));box-shadow:0 0 0 2px color-mix(in srgb, var(--track-color) 72%, transparent), 0 0 18px color-mix(in srgb, var(--track-color) 48%, transparent)}.composer-timeline-block[data-selected=true] .composer-timeline-label,.composer-timeline-block[data-selected=true] .composer-timeline-sub{color:var(--text)}.composer-timeline-block[data-track-kind][data-suggestion=true]{border-color:color-mix(in srgb, #e8a843 64%, var(--track-color))}.composer-timeline-slide-links{z-index:2;pointer-events:none;position:absolute;top:0;left:0;overflow:visible}.composer-timeline-slide-link-glow{fill:none;stroke:color-mix(in srgb, var(--accent-strong) 55%, transparent);stroke-width:7px;stroke-linecap:round;opacity:.36;filter:blur(3px)}.composer-timeline-slide-link-line{fill:none;stroke:var(--accent-strong);stroke-width:1.5px;stroke-linecap:round;stroke-dasharray:3 4;opacity:.92}.composer-timeline-slide-link-point{fill:var(--bg-raised);stroke:var(--accent-strong);stroke-width:1.5px}.composer-timeline-block[data-slide-source=true],.composer-timeline-block[data-slide-target=true]{border-color:color-mix(in srgb, var(--accent-strong) 70%, var(--track-color));box-shadow:0 0 0 1px color-mix(in srgb, var(--accent-strong) 34%, transparent), 0 0 16px color-mix(in srgb, var(--accent-strong) 18%, transparent)}.composer-timeline-block[data-slide-source=true]:after,.composer-timeline-block[data-slide-target=true]:after{content:"↝";z-index:6;border:1px solid color-mix(in srgb, var(--accent-strong) 72%, var(--line-strong));width:18px;height:18px;color:var(--accent-strong);background:var(--bg-raised);box-shadow:0 2px 10px color-mix(in srgb, var(--accent) 22%, transparent);font:700 13px/1 var(--font-sans);border-radius:50%;place-items:center;display:grid;position:absolute;top:-10px;right:5px}.composer-timeline-block[data-slide-target=true]:after{content:"↜"}.composer-timeline-remove{border:1px solid var(--line-strong);background:var(--bg-raised);width:18px;height:18px;color:var(--text-dim);cursor:pointer;border-radius:50%;padding:0;font-size:11px;line-height:1;position:absolute;top:-8px;right:-8px}.composer-timeline-remove:hover{color:var(--signal);border-color:var(--signal)}.composer-timeline-settings{z-index:8;border-color:color-mix(in srgb, var(--track-color,var(--accent)) 66%, var(--line));background:var(--bg-raised);width:28px;min-width:28px;height:28px;min-height:28px;color:var(--track-color,var(--accent-strong));box-shadow:0 3px 12px color-mix(in srgb, var(--track-color,var(--accent)) 22%, transparent);border-radius:50%;padding:0;position:absolute;top:-34px;left:50%;transform:translate(-50%)}.composer-timeline-settings:hover{background:color-mix(in srgb, var(--track-color,var(--accent)) 14%, var(--bg-raised))}.composer-timeline-settings:active:not(:disabled){transform:translate(-50%)}.composer-timeline-settings .editor-action-icon{width:15px;height:15px}.composer-timeline-link{z-index:10;border:1px solid var(--accent-strong);background:var(--bg-raised);width:28px;min-width:28px;height:28px;color:var(--accent-strong);box-shadow:0 3px 12px color-mix(in srgb, var(--accent) 28%, transparent);border-radius:50%;padding:0;position:absolute;top:-34px;left:50%;transform:translate(-50%)}.composer-timeline-link:hover{background:color-mix(in srgb, var(--accent) 14%, var(--bg-raised))}.composer-timeline-link:active:not(:disabled){transform:translate(-50%)}.composer-timeline-link .editor-action-icon{width:15px;height:15px}.composer-timeline-suggestion{z-index:7;border-color:color-mix(in srgb, #e8a843 70%, var(--line));background:var(--bg-raised);color:#e8a843;width:20px;min-width:0;height:20px;min-height:0;font:800 11px/1 var(--font-mono);border-radius:50%;padding:0;position:absolute;top:-9px;left:-9px}.composer-timeline-label{font-family:var(--font-mono);font-size:13px;font-weight:600}.composer-timeline-sub{color:var(--text-dim);margin-top:2px;font-size:9px}.composer-timeline-technique{color:var(--accent-strong);font:700 8px/1 var(--font-mono);margin-top:2px}.composer-timeline-label,.composer-timeline-sub,.composer-timeline-technique{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.composer-timeline-resize{z-index:5;border-right:3px solid color-mix(in srgb, var(--accent) 75%, var(--line-strong));cursor:ew-resize;touch-action:none;border-radius:2px;width:10px;position:absolute;top:5px;bottom:5px;right:-1px}.composer-timeline-resize:before,.composer-timeline-resize:after{content:"";background:var(--text-dim);border-radius:50%;width:3px;height:3px;position:absolute;right:3px}.composer-timeline-resize:before{top:17px}.composer-timeline-resize:after{top:24px}.composer-tab-card{gap:var(--sp-4)}.composer-tab-heading,.composer-tab-actions{justify-content:space-between;align-items:center;gap:var(--sp-3);flex-wrap:wrap;display:flex}.composer-tab-heading>div{flex:1;min-width:min(100%,420px)}.composer-tab-parts{gap:var(--sp-4);display:grid}.composer-tab-part{border:1px solid color-mix(in srgb, var(--track-color) 45%, var(--line));border-radius:var(--radius-md);background:color-mix(in srgb, var(--track-color) 4%, var(--bg-sunken));min-width:0;position:relative;overflow:hidden}.composer-tab-part-heading{align-items:center;gap:var(--sp-2);padding:var(--sp-3) var(--sp-4);border-bottom:1px solid var(--line);display:flex}.composer-tab-part:has(.riffonic-tab-controls) .composer-tab-part-heading{min-height:44px;padding-right:248px}.composer-tab-part .riffonic-tab-controls{z-index:5;top:8px;right:var(--sp-4);gap:var(--sp-2);flex-wrap:nowrap;padding:0;position:absolute}.composer-tab-part-heading b{font-size:13px}.composer-tab-part-heading span{border:1px solid color-mix(in srgb, var(--track-color) 55%, var(--line));border-radius:var(--radius-pill);color:color-mix(in srgb, var(--track-color) 78%, var(--text));font:8px/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;padding:3px 7px}.drum-tab-shell{gap:var(--sp-2);display:grid}.drum-tab{padding:var(--sp-3) var(--sp-4);min-width:0;overflow-x:auto}.drum-tab-content{width:max-content;min-width:100%;position:relative}.drum-tab-ruler,.drum-tab-row{grid-template-columns:42px max-content;min-width:max-content;display:grid}.drum-tab-ruler>span,.drum-tab-row>span{font:700 10px/1 var(--font-mono);color:var(--muted);align-items:center;display:flex}.drum-tab-ruler i,.drum-tab-cells button{box-sizing:border-box;width:var(--drum-cell,24px);min-width:var(--drum-cell,24px);border:0;border-left:1px solid color-mix(in srgb, var(--line) 72%, transparent);height:22px;color:var(--muted);font:700 10px/1 var(--font-mono);background:0 0;padding:0;font-style:normal}.drum-tab-ruler i{height:18px;color:var(--muted);justify-content:center;align-items:center;display:inline-flex}.drum-tab-ruler-cells{display:flex}.drum-tab-cells{border-bottom:1px solid color-mix(in srgb, var(--line) 74%, transparent);display:flex}.drum-tab-ruler .bar,.drum-tab-cells .bar{border-left-color:color-mix(in srgb, var(--track-color) 80%, var(--line))}.drum-tab-ruler .beat,.drum-tab-cells .beat{border-left-color:color-mix(in srgb, var(--line) 95%, var(--text))}.drum-tab-cells button.hit{color:var(--track-color);cursor:pointer;font-size:14px}.drum-tab-cells button.hit:hover,.drum-tab-cells button.hit:focus-visible{background:color-mix(in srgb, var(--track-color) 18%, transparent);outline:none}.drum-tab-playhead{z-index:2;background:var(--accent);width:2px;box-shadow:0 0 10px color-mix(in srgb, var(--accent) 70%, transparent);pointer-events:none;will-change:transform;border-radius:2px;position:absolute;top:18px;bottom:21px;left:42px}.drum-tab-hint{margin:var(--sp-3) 0 0 42px;color:var(--muted);font-size:11px}.composer-tab-notice{padding:var(--sp-2) var(--sp-3);border:1px solid color-mix(in srgb, var(--accent) 35%, var(--line));border-radius:var(--radius-md);background:var(--accent-soft);color:var(--text-dim);font-size:11px}.composer-tab-actions{justify-content:flex-start}.composer-tab-actions .dim{margin-left:auto}.exercise-rhythm-summary{gap:var(--sp-2);margin-top:var(--sp-2);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.exercise-rhythm-summary>div{padding:var(--sp-3);border:1px solid var(--line);border-radius:var(--radius-md);background:var(--bg-sunken);gap:3px;display:grid}.exercise-rhythm-summary span{color:var(--text-dim);letter-spacing:.08em;text-transform:uppercase;font-size:9px}.exercise-rhythm-summary b{font-size:11px;font-weight:600}.exercise-rhythm-summary[data-generated=true]>div:last-child{border-color:color-mix(in srgb, var(--accent) 38%, var(--line));background:color-mix(in srgb, var(--accent) 7%, var(--bg-sunken))}.exercise-note-rate{gap:var(--sp-2);margin-top:var(--sp-3);display:grid}.exercise-note-rate .seg{width:100%}.exercise-note-rate .seg button{flex:1}.exercise-note-rate .seg--metro{width:auto}.exercise-note-rate .seg--metro button{flex:none;width:40px}.exercise-note-rate .seg--metro svg{width:20px;height:20px}.exercise-metronome-btn{color:var(--signal);border-color:color-mix(in srgb, var(--signal) 55%, var(--line));justify-content:center;align-items:center;display:flex}.exercise-metronome-btn[data-on=true]{color:var(--bass);border-color:color-mix(in srgb, var(--bass) 68%, var(--line));background:color-mix(in srgb, var(--bass) 14%, var(--bg-raised));box-shadow:0 0 12px color-mix(in srgb, var(--bass) 20%, transparent)}.exercise-rhythm-help{margin-top:var(--sp-2)}.player-notation-toolbar{justify-content:space-between;align-items:center;gap:var(--sp-2);flex-wrap:wrap;min-height:40px;display:flex}.player-notation-toolbar-right{align-items:center;gap:var(--sp-3);display:flex}.player-notation-switch,.player-instrument-switch{width:auto}.player-marker-size{margin:0}.player-notation-switch button,.player-instrument-switch button{flex:none;min-width:88px}.player-notation-toolbar .player-notation-switch--icons button{border-radius:var(--radius-md);place-items:center;width:40px;min-width:0;height:40px;padding:0;display:grid}.player-notation-switch--icons svg{width:19px;height:19px}.player-instrument-guitar{color:var(--accent-strong);border-color:color-mix(in srgb, var(--accent) 72%, var(--line))}.player-instrument-guitar[data-on=true]{color:var(--bg);border-color:var(--accent);background:var(--accent);box-shadow:0 0 14px color-mix(in srgb, var(--accent) 32%, transparent)}.player-instrument-bass{color:var(--bass);border-color:color-mix(in srgb, var(--bass) 70%, var(--line))}.player-instrument-bass[data-on=true]{color:var(--bg);border-color:var(--bass);background:var(--bass);box-shadow:0 0 14px color-mix(in srgb, var(--bass) 32%, transparent)}.exercise-notation{min-width:0}.exercise-notation .riffonic-tab-shell{width:100%}.practice-fretboard-card{gap:var(--sp-3);display:grid;overflow:hidden}.practice-fretboard-scroll{overscroll-behavior-x:contain;scrollbar-color:var(--line-strong) transparent;overflow-x:auto}.practice-fretboard{width:100%;min-width:720px;color:var(--text);display:block}.practice-fretboard-fret{fill:currentColor;font:700 11px/1 var(--font-mono);opacity:.58}.practice-fretboard-note--active{filter:drop-shadow(0 0 7px var(--accent))}.practice-fretboard-note{cursor:pointer}.practice-fretboard-note:hover circle:last-of-type,.practice-fretboard-note:focus-visible circle:last-of-type{opacity:1}.practice-fretboard-note:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:50%}.composer-inspector{align-items:end;gap:var(--sp-2);padding:var(--sp-2) var(--sp-3);border:1px solid color-mix(in srgb, var(--accent) 42%, var(--line));border-radius:var(--radius-lg);background:color-mix(in srgb, var(--accent-soft) 42%, var(--bg-sunken));flex-wrap:wrap;display:flex}.composer-inspector-popup{width:min(760px,100%);max-width:calc(100vw - var(--sp-4) - var(--sp-4));max-height:none;padding:var(--sp-2);border:1px solid var(--line-strong);background:var(--bg-raised);overflow:visible}.composer-inspector-popup .composer-inspector{padding:var(--sp-4);gap:var(--sp-3);box-shadow:0 18px 44px #00000057}.composer-inspector-popup .composer-inspector>.composer-techniques{width:100%;min-width:0;max-width:100%;flex:0 0 100%!important}.composer-inspector-popup .composer-techniques .seg{width:100%;max-width:100%}.composer-inspector-popup .composer-inspector .composer-technique-buttons.is-expanded{flex-wrap:wrap!important}.composer-inspector-head,.composer-inspector-actions{justify-content:space-between;align-items:center;gap:var(--sp-2);display:flex}.composer-inspector>.composer-inspector-head,.composer-inspector>.composer-event-suggestion{flex:0 0 100%}.composer-event-suggestion{gap:var(--sp-3);padding:var(--sp-3);border:1px solid color-mix(in srgb, #e8a843 48%, var(--line));border-radius:var(--radius-md);background:color-mix(in srgb, #e8a843 8%, var(--bg-sunken));display:grid}.composer-event-suggestion>div:first-child{align-items:flex-start;gap:var(--sp-2);font-size:11px;display:flex}.composer-event-suggestion>div:first-child b{color:#e8a843;font:800 16px/1 var(--font-mono)}.composer-event-replacements{gap:var(--sp-2);flex-wrap:wrap;display:flex}.composer-event-replacements strong{color:var(--accent-strong)}.composer-techniques{gap:var(--sp-2);display:grid}.composer-techniques>span{color:var(--text-dim);font-size:10px}.composer-techniques .seg button{flex:0 auto;min-width:92px;height:34px}.composer-technique-buttons button{width:36px;font:700 12px/1 var(--font-mono);padding:0 5px;min-width:36px!important}.composer-technique-buttons.is-expanded button{width:auto;padding:0 var(--sp-3);font-family:var(--font-ui);min-width:76px!important}.composer-icon-button{width:32px;min-width:32px;font:700 15px/1 var(--font-mono);padding:0}.composer-label-toggle{width:34px;min-width:34px;font:700 12px/1 var(--font-mono);padding:0}.composer-inspector-head-actions{align-items:center;gap:var(--sp-2);display:flex}.composer-inspector-head>div{align-items:baseline;gap:var(--sp-2);display:flex}.composer-inspector-head span{color:var(--text-dim);font:9px/1 var(--font-mono);letter-spacing:.08em}.composer-inspector-head b{font:700 16px/1 var(--font-mono)}.composer-inspector-fields{gap:var(--sp-3);grid-template-columns:repeat(4,minmax(110px,1fr));display:grid}.composer-inspector-fields input,.composer-inspector-fields select{width:100%}.composer-inspector-fields--compact{flex:0 0 214px;grid-template-columns:repeat(2,minmax(76px,104px));gap:6px}.composer-inspector:not(.composer-inspector--group)>.composer-techniques,.composer-inspector:not(.composer-inspector--group)>.composer-inspector-actions{flex:none}.composer-inspector:not(.composer-inspector--group)>.composer-techniques{min-width:0}.composer-inspector .composer-technique-buttons.is-expanded{flex-wrap:nowrap;gap:6px}.composer-inspector .composer-technique-buttons.is-expanded button{padding:0 10px;min-width:0!important}.composer-inspector-actions{justify-content:flex-start}.composer-inspector--group{border-style:dashed}.composer-edit-toolbar{flex-wrap:wrap}.composer-toolbar-icon{width:36px;min-width:36px;font:700 17px/1 var(--font-mono);padding:0}.composer-help-button{color:var(--text-dim);border-radius:999px}.composer-help-button:hover{color:var(--accent);border-color:var(--accent)}.composer-timeline-help-actions{align-items:center;gap:var(--sp-2);display:flex}.composer-settings-popup{min-width:min(520px,100%)}.composer-settings-list{gap:var(--sp-3);display:grid}.composer-settings-row{justify-content:space-between;align-items:flex-start;gap:var(--sp-4);display:flex}.composer-settings-row>span{gap:2px;min-width:0;display:grid}.composer-settings-row small{color:var(--text-dim);line-height:1.4}.composer-switch{border:1px solid var(--line-strong);background:var(--bg-sunken);border-radius:999px;flex:none;width:46px;height:26px;padding:0;position:relative}.composer-switch i{background:var(--text-dim);border-radius:50%;width:18px;height:18px;transition:transform .14s,background .14s;position:absolute;top:3px;left:3px}.composer-switch[data-on=true]{border-color:color-mix(in srgb, var(--bass) 68%, var(--line));background:color-mix(in srgb, var(--bass) 20%, var(--bg-raised))}.composer-switch[data-on=true] i{background:var(--bass);transform:translate(20px)}.composer-shortcuts-popup{min-width:min(700px,100%)}.composer-shortcuts-grid{gap:var(--sp-4) var(--sp-5);grid-template-columns:repeat(auto-fit,minmax(240px,1fr));display:grid}.composer-shortcuts-grid h3{margin:0 0 var(--sp-2);letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim);font-size:11px}.composer-shortcuts-grid dl{gap:var(--sp-2);margin:0;display:grid}.composer-shortcuts-grid dl>div{align-items:baseline;gap:var(--sp-2);display:flex}.composer-shortcuts-grid dt{flex:none;align-items:center;gap:2px;display:flex}.composer-shortcuts-grid dt i{color:var(--text-faint);font-size:10px;font-style:normal}.composer-shortcuts-grid dd{color:var(--text-dim);margin:0;font-size:12px}.composer-shortcuts-grid kbd{border:1px solid var(--line-strong);border-radius:var(--radius-sm);color:var(--text);background:var(--bg-raised);font:10px/1 var(--font-mono);white-space:nowrap;padding:3px 6px}.editor-action-icon{width:17px;height:17px;margin:auto;display:block}.composer-drag-ghost{z-index:50;padding:var(--sp-1) var(--sp-2);border-radius:var(--radius-md);background:var(--accent);color:var(--on-accent);font-family:var(--font-mono);pointer-events:none;white-space:nowrap;font-size:12px;font-weight:600;position:fixed;transform:translate(-50%,-130%)}.composer-countdown{inset:auto 50% calc(100% + var(--sp-2)) auto;padding:var(--sp-2) var(--sp-4);border-radius:var(--radius-pill);background:var(--accent);color:var(--on-accent);font-family:var(--font-mono);white-space:nowrap;font-size:12px;font-weight:700;position:absolute;transform:translate(50%)}@media (width<=900px){.composer-projects-controls{grid-template-columns:1fr 1fr}.composer-project-actions{grid-column:1/-1}.composer-control-grid{gap:var(--sp-4);grid-template-columns:1fr}.composer-guidance-head{flex-direction:column}.composer-context-chips{justify-content:flex-start}.composer-recommendations{grid-template-columns:1fr}.composer-timeline-toolbar{align-items:stretch;gap:var(--sp-2);flex-direction:column}.composer-timeline-bpm{flex-basis:auto;grid-template-columns:auto 1fr}.composer-timeline-transport-controls{align-items:stretch;gap:var(--sp-3)}.composer-timeline-control .seg{width:fit-content;max-width:100%}.composer-mixer{grid-template-columns:1fr}.composer-inspector-fields{grid-template-columns:repeat(2,minmax(110px,1fr))}}@media (width<=620px){.composer-projects-controls{grid-template-columns:1fr}.composer-project-actions{grid-column:auto}.composer-project-actions button{flex:auto}.composer-mixer-strip{grid-template-columns:1fr auto}.composer-mixer-strip label{grid-column:1/-1}.composer-track-remove{grid-area:2/2}.composer-track-required{grid-area:2/2;align-self:center}.composer-tab-actions .dim{width:100%;margin-left:0}.composer-inspector-fields{grid-template-columns:1fr 1fr}.composer-inspector-fields--compact{flex-basis:100%}.composer-inspector .composer-technique-buttons.is-expanded{flex-wrap:wrap}.composer-section-row{grid-template-columns:auto minmax(100px,1fr) 76px 32px 32px}.composer-timeline-titlebar{flex-direction:column;align-items:flex-start}.composer-timeline-track-actions{width:100%}.composer-timeline-primary-actions{justify-content:flex-start;width:100%}.composer-tab-part:has(.riffonic-tab-controls) .composer-tab-part-heading{min-height:0;padding-right:var(--sp-4)}.composer-tab-part .riffonic-tab-controls{padding:var(--sp-2) var(--sp-3) 0;position:static}}.settings-row{justify-content:space-between;align-items:center;gap:var(--sp-3);padding:0 0 calc(var(--sp-4) + 96px);flex-wrap:wrap;font-size:11px;display:flex}.settings-group{align-items:center;gap:var(--sp-3);display:flex}.settings-group--language{margin-left:auto}.seg-wrap{flex-wrap:wrap}.seg-wrap button{padding:0 var(--sp-3);flex:0 auto}.points{font-family:var(--font-mono);letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--accent-strong);font-size:24px;font-weight:700;line-height:1}.text-signal{color:var(--signal)}.link-button{color:var(--accent);text-underline-offset:2px;font:inherit;cursor:pointer;background:0 0;border:none;margin:0;padding:0;text-decoration:underline;display:inline}.link-button:hover{color:var(--accent-strong)}.field-checkbox{align-items:flex-start;gap:var(--sp-2);color:var(--text-dim);cursor:pointer;font-size:12px;line-height:1.5;display:flex}.field-checkbox input[type=checkbox]{flex-shrink:0;margin-top:3px}.site-footer{gap:var(--sp-3);margin-top:var(--sp-6);padding:var(--sp-5) 0 var(--sp-4);border-top:1px solid var(--line);display:grid}.site-footer textarea{resize:vertical;font:inherit}.site-footer-legal{gap:var(--sp-2) var(--sp-4);flex-wrap:wrap;display:flex}.site-footer-legal .link-button{color:var(--text-dim);font-size:11px;text-decoration:none}.site-footer-legal .link-button:hover{color:var(--accent)}.site-footer-note{max-width:560px}.legal-popup{line-height:1.6;position:relative}.legal-popup h1{margin:0 var(--sp-6) var(--sp-1) 0;font-size:22px}.legal-popup h2{margin-top:var(--sp-5);font-size:16px}.legal-popup ul{gap:var(--sp-1);padding-left:1.2em;display:grid}.legal-popup li{margin:0}.legal-popup-close{position:absolute;top:0;right:0}.mascot-picker{max-width:620px}.mascot-picker-intro{align-items:center;gap:var(--sp-4);padding:var(--sp-2) 0;display:flex}.mascot-picker-figure{filter:drop-shadow(0 6px 14px #00000059);flex-shrink:0;width:96px;height:auto}.mascot-picker-intro p{margin:0;line-height:1.5}.mascot-picker-grid{gap:var(--sp-3);grid-template-columns:repeat(auto-fit,minmax(150px,1fr));display:grid}.mascot-picker-card{gap:var(--sp-1);text-align:left;padding:var(--sp-3);border-radius:var(--radius-lg);border:1px solid var(--line);background:var(--bg-sunken);cursor:pointer;flex-direction:column;align-items:flex-start;transition:border-color .15s,background .15s;display:flex}.mascot-picker-card:hover{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 8%, var(--bg-sunken))}.mascot-picker-card b{letter-spacing:.04em;font-size:12px}.mascot-picker-card span{color:var(--text-dim);font-size:11px;line-height:1.4}.onboarding-hint-target{z-index:40;outline:2px solid var(--accent);outline-offset:4px;border-radius:var(--radius-md);animation:1.6s ease-in-out infinite onboarding-hint-pulse;position:relative}@keyframes onboarding-hint-pulse{0%,to{outline-color:var(--accent);box-shadow:0 0 0 0 color-mix(in srgb, var(--accent) 45%, transparent)}50%{outline-color:var(--accent-strong);box-shadow:0 0 0 6px color-mix(in srgb, var(--accent) 0%, transparent)}}.onboarding-coach{left:var(--sp-4);bottom:var(--sp-4);z-index:65;align-items:flex-start;gap:var(--sp-2);max-width:min(340px, calc(100vw - var(--sp-6)));display:flex;position:fixed}.onboarding-coach--above{align-items:flex-end;transform:translateY(-100%)}.onboarding-coach-face{filter:drop-shadow(0 6px 12px #0006);flex-shrink:0;width:64px;height:auto}.onboarding-coach-bubble{background:var(--bg-raised);border:1px solid var(--line-strong);border-radius:var(--radius-lg);padding:var(--sp-3);gap:var(--sp-2);display:grid;box-shadow:0 10px 24px #0000004d}.onboarding-coach-bubble p{margin:0;font-size:12px;line-height:1.5}.onboarding-coach-actions{justify-content:flex-end;gap:var(--sp-2);display:flex}.onboarding-coach-backdrop{z-index:65;padding:var(--sp-5);background:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.onboarding-coach--intro{text-align:center;align-items:center;gap:var(--sp-3);flex-direction:column;max-width:420px;position:static}.onboarding-coach-face--intro{filter:drop-shadow(0 12px 24px #00000080);width:180px}.onboarding-coach-bubble--intro{text-align:center}.onboarding-coach-bubble--intro p{font-size:14px}.onboarding-coach-bubble--intro .onboarding-coach-actions{justify-content:center}@media (width<=620px){.card{padding:var(--sp-4);border-radius:var(--radius-md)}.seg{grid-template-columns:repeat(auto-fit,minmax(70px,1fr));display:grid}.transport{background:0 0;padding:0;position:static}.popup-backdrop{padding:var(--sp-3)}.popup{padding:var(--sp-4)}.settings-row{padding-bottom:calc(var(--sp-4) + env(safe-area-inset-bottom) + 64px);align-items:stretch}.settings-group{justify-content:space-between;width:100%}.settings-group--language{margin-left:0}}.app-shell :where(p,span,div,li,a,label,button,input,select,textarea,small,strong,b){font-size:var(--type-body)!important}.app-shell .riffonic-tab-note{font-size:var(--riffonic-note-size,15px)!important}.app-shell .ad-slot{font-size:var(--type-body)!important}.app-shell :where(.card h2,.field-label,.control-label,.dim,small,.ad-slot__badge,.ad-slot__copy span,.home-session-ring small,.home-session-caption,.home-stats span,.home-project-meta span,.home-tool-grid small,.composer-timeline-sub,.composer-timeline-technique,.composer-track-required,.composer-inspector-head span,.drum-tab-hint){font-size:var(--type-label)!important}.app-shell :where(h1,h2,h3,h4,h5,h6,.mono-num,.points,.home-session-ring span,.home-stats strong,.chord-name,.composer-inspector-head b,.recommendation-note){font-size:var(--type-display)!important}.app-shell :where(.home-hero h1,.learn-hero h1,.tabs-hero h1,.home-panel h2,.bpm,.home-session-ring span){font-size:var(--type-hero)!important}.app-shell .card h2,.app-shell .composer-shortcuts-grid h3,.app-shell .composer-fretboard svg text{font-size:var(--type-label)!important}.app-shell :where(input:not([type=range]):not([type=checkbox]):not([type=radio]),select,textarea){min-height:40px;padding:0 var(--sp-3);color:var(--text);background:var(--bg-sunken);border:1px solid var(--line);border-radius:var(--radius-md);font-family:var(--font-ui);line-height:1.2;transition:border-color .12s,background .12s}.app-shell textarea{min-height:96px;padding-block:var(--sp-3);resize:vertical}.app-shell :where(input:not([type=range]):not([type=checkbox]):not([type=radio]),select,textarea):hover{border-color:var(--line-strong)}.app-shell :where(input:not([type=range]):not([type=checkbox]):not([type=radio]),select,textarea)::placeholder{color:var(--text-faint)}.app-shell button{border-radius:var(--radius-md);font-weight:500;font-family:var(--font-ui)!important;font-size:var(--type-body)!important}.app-shell :where(p,span,div,li,a,label,input,select,textarea,small,strong,b){font-family:var(--font-ui)!important}.app-shell .btn-compact,.app-shell .composer-toolbar-icon,.app-shell .composer-icon-button,.app-shell .composer-label-toggle,.app-shell .composer-technique-buttons button{font-size:var(--type-label)!important}@media (width>=621px) and (width<=1024px){.screen{padding-inline:var(--sp-4)}.composer-fretboard svg{min-width:900px}.composer-timeline{max-height:min(500px,62vh)}.tabs-community-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.settings-row{padding-bottom:calc(var(--sp-4) + 78px)}}@media (width<=620px){.topbar .nav-pills button,.topbar-learning-button,.topbar-account-button{min-height:42px}.topbar .nav-pills .nav-home-button{width:100%}.topbar .nav-home-button svg{width:16px;height:16px}.chord-row,.chord-practice-scroller,.composer-fretboard,.composer-timeline,.tabview,.drum-tab{-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;scrollbar-width:thin;overscroll-behavior-x:contain}.tabview{padding:var(--sp-2) 0 var(--sp-3);scroll-padding-inline:var(--sp-3)}.chord-row>*,.chord-practice-slot,.composer-fretboard svg,.composer-timeline-track,.tabview>*,.drum-tab-row{scroll-snap-align:start}.chord-row{padding-bottom:var(--sp-2)}.chord-row .chord-slot{min-width:min(76vw,250px)}.chord-practice-slot{width:min(78vw,272px)}.tabs-page{gap:var(--sp-4)}.tabs-hero{padding:var(--sp-5) var(--sp-4)}.tabs-community-card{padding:var(--sp-4)}.tabs-preview-button,.tabs-open-button,.tabs-like-button,.tabs-project-actions>.btn-compact,.tabs-project-accent-button{min-height:40px}.tabs-project-accent-button{width:40px;height:40px}.tabs-project-accent-menu{right:var(--sp-3);left:var(--sp-3);bottom:calc(var(--sp-3) + env(safe-area-inset-bottom));padding:var(--sp-2);justify-content:center;position:fixed}.tabs-project-accent-menu button{width:38px;height:38px}.composer-projects-controls{gap:var(--sp-2)}.composer-project-picker{flex-basis:100%;max-width:none}.composer-project-actions{grid-template-columns:repeat(2,minmax(0,1fr));width:100%;margin-left:0;display:grid}.composer-project-actions>button{min-height:42px}.composer-project-edit{width:auto;min-width:0}.composer-key-tools{width:100%}.composer-key-tools select:first-child{flex:0 0 70px}.composer-key-tools select:last-child{flex:1;width:auto}.composer-fretboard{min-height:208px;padding-bottom:var(--sp-2)}.composer-fretboard svg{min-width:840px}.composer-position-chip,.composer-position-reset{min-height:38px}.composer-position-reset{width:38px}.composer-drum-pads{gap:var(--sp-2);grid-template-columns:repeat(2,minmax(0,1fr))}.composer-drum-pad{min-height:76px}.composer-source-button,.composer-track-add,.composer-mixer-switches button,.composer-track-remove{min-height:40px}.composer-timeline{max-height:min(520px,68vh);padding-top:30px}.composer-timeline-track{min-height:148px}.composer-timeline-primary-actions{grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.composer-timeline-primary-actions>button{width:100%;min-height:42px}.composer-timeline-primary-actions>.composer-listen-button{width:100%}.composer-timeline-transport-controls{gap:var(--sp-3)}.composer-timeline-control .seg{width:100%}.composer-timeline-seg button{min-height:40px}.composer-mixer-strip{padding:var(--sp-3)}.composer-mixer-name input{height:40px}.composer-section-row{grid-template-columns:auto minmax(0,1fr) 72px 36px}.composer-section-row>:last-child{grid-area:2/4}}.sticker-bank-button{z-index:60;cursor:pointer;filter:drop-shadow(0 8px 18px #00000073);background:0 0;border:none;width:150px;height:180px;padding:0;transition:transform .15s;position:absolute;bottom:-18px;left:50%;transform:translate(-50%)}.sticker-bank-button:hover{transform:translate(-50%)translateY(-6px)}.sticker-bank-button[data-open=true]{transform:translate(-50%)translateY(-10px)}.sticker-bank-button img{object-fit:contain;pointer-events:none;width:100%;height:100%}.sticker-bank-tray{width:min(420px, calc(100vw - var(--sp-4) * 2));background:var(--bg-raised);border:1px solid var(--line);border-radius:var(--radius-3);max-height:50vh;padding:var(--sp-3);z-index:61;position:absolute;bottom:176px;left:50%;overflow-y:auto;transform:translate(-50%);box-shadow:0 16px 40px #00000080}.sticker-bank-tray-header{font:11px/1.3 var(--font-mono);color:var(--text-dim);margin-bottom:var(--sp-2);text-align:center}.sticker-bank-tray-grid{gap:var(--sp-2);grid-template-columns:repeat(5,1fr);display:grid}.sticker-bank-tray-item{aspect-ratio:1;object-fit:contain;cursor:grab;touch-action:none;border-radius:var(--radius-2);background:color-mix(in srgb, var(--line) 20%, transparent);width:100%}.sticker-bank-tray-item:active{cursor:grabbing}.sticker-bank-tray-cell{position:relative}.sticker-bank-tray-cell[data-locked=true] .sticker-bank-tray-item{opacity:.38;filter:grayscale(.6);cursor:pointer}.sticker-pro-badge{border-radius:var(--radius-pill);background:var(--accent);color:var(--on-accent);font:800 8px/1.6 var(--font-mono);letter-spacing:.04em;pointer-events:none;padding:1px 5px;position:absolute;bottom:2px;right:2px}.sticker-earned-badge{pointer-events:none;filter:drop-shadow(0 1px 2px #0009);font-size:12px;line-height:1;position:absolute;bottom:2px;right:2px}.sticker-drag-ghost{object-fit:contain;pointer-events:none;z-index:999;opacity:.85;filter:drop-shadow(0 6px 14px #00000080);width:100px;height:100px;position:fixed;transform:translate(-50%,-50%)}.paywall-backdrop{z-index:80;background:#0000008c;place-items:center;display:grid;position:fixed;inset:0}.paywall-card{width:min(360px, calc(100vw - var(--sp-4) * 2));background:var(--bg-raised);border:1px solid var(--line);border-radius:var(--radius-3);padding:var(--sp-4);gap:var(--sp-2);flex-direction:column;display:flex}.paywall-badge{border-radius:var(--radius-pill);background:var(--accent);color:var(--on-accent);font:800 10px/1.6 var(--font-mono);letter-spacing:.05em;justify-self:start;padding:2px 8px}.paywall-card h3{margin:0;font-size:16px}.paywall-card p{color:var(--text-dim);margin:0;font-size:13px}.paywall-sent{color:var(--bass);font-size:13px;font-weight:600}.paywall-error{color:var(--danger,#e05d5d);font-size:12px}.paywall-actions{justify-content:flex-end;gap:var(--sp-2);margin-top:var(--sp-2);display:flex}.paywall-actions button{height:34px;padding:0 var(--sp-3);border-radius:var(--radius-2);border:1px solid var(--line);background:var(--bg-raised);color:var(--text);cursor:pointer}.paywall-actions button.primary{background:var(--accent);border-color:var(--accent);color:var(--bg)}.paywall-actions button:disabled{opacity:.6;cursor:not-allowed}.export-preview-backdrop{z-index:80;padding:var(--sp-4);background:#0000008c;place-items:center;display:grid;position:fixed;inset:0}.export-preview-card{background:var(--bg-raised);border:1px solid var(--line);border-radius:var(--radius-3);width:min(560px,100%);max-height:90vh;padding:var(--sp-4);gap:var(--sp-2);flex-direction:column;display:flex;overflow:auto}.export-preview-card h3{margin:0;font-size:16px}.export-preview-card p{color:var(--text-dim);margin:0;font-size:13px}.export-preview-image{border-radius:var(--radius-2);border:1px solid var(--line);width:100%;display:block}.export-preview-loading{aspect-ratio:16/9;color:var(--text-dim);border:1px dashed var(--line);border-radius:var(--radius-2);place-items:center;font-size:13px;display:grid}.export-preview-actions{justify-content:flex-end;gap:var(--sp-2);margin-top:var(--sp-2);display:flex}.export-preview-actions button{height:34px;padding:0 var(--sp-4);border-radius:var(--radius-2);border:1px solid var(--line);background:var(--bg-raised);color:var(--text);cursor:pointer}.export-preview-actions button.primary{background:var(--accent);border-color:var(--accent);color:var(--bg)}.export-preview-upsell{padding:var(--sp-3);border:1px solid color-mix(in srgb, var(--accent) 45%, var(--line));border-radius:var(--radius-2);background:color-mix(in srgb, var(--accent) 8%, var(--bg-raised));gap:4px;display:grid}.export-preview-upsell p{color:var(--text);margin:0;font-size:13px}.export-preview-upsell p b{color:var(--accent-strong)}.export-preview-upgrade{margin-top:var(--sp-1);border-radius:var(--radius-2);background:var(--accent);height:36px;color:var(--bg);cursor:pointer;border:0;font-weight:700}.export-preview-upgrade:hover{background:var(--accent-strong)}.first-save-toast{left:50%;bottom:var(--sp-5);z-index:75;align-items:center;gap:var(--sp-3);max-width:calc(100vw - var(--sp-4) * 2);padding:var(--sp-3) var(--sp-4);border:1px solid color-mix(in srgb, var(--bass) 45%, var(--line));border-radius:var(--radius-pill);background:var(--bg-raised);display:flex;position:fixed;transform:translate(-50%);box-shadow:0 10px 28px #00000047}.first-save-toast b{color:var(--bass);white-space:nowrap}.first-save-toast span{color:var(--text-dim);white-space:nowrap;font-size:12px}.first-save-toast button{color:var(--text-dim);cursor:pointer;padding:0 0 0 var(--sp-2);background:0 0;border:0;font-size:16px;line-height:1}.first-save-toast button:hover{color:var(--text)}@media (width<=640px){.first-save-toast{border-radius:var(--radius-3);text-align:center;flex-wrap:wrap;justify-content:center}}.sticker-layer{pointer-events:none;z-index:55;position:absolute;inset:0}.sticker-instance{pointer-events:none;touch-action:none;position:absolute}.sticker-instance[data-editing=true]{pointer-events:auto}.sticker-instance-img{object-fit:contain;pointer-events:none;-webkit-user-select:none;user-select:none;width:100%;height:100%}.sticker-instance[data-editing=true]{cursor:grab;z-index:65}.sticker-instance[data-editing=true]:active{cursor:grabbing}.sticker-instance[data-editing=true]:before{content:"";border:1px dashed color-mix(in srgb, var(--accent) 70%, var(--line));border-radius:var(--radius-2);pointer-events:none;position:absolute;inset:-4px}.sticker-handle{border:1px solid var(--line);background:var(--bg-raised);color:var(--text);cursor:pointer;touch-action:none;border-radius:50%;place-items:center;display:grid;position:absolute}.sticker-handle-delete{width:26px;height:26px;color:var(--danger,#e05d5d);font-size:15px;line-height:1;top:-14px;left:-14px}.sticker-handle-confirm{width:26px;height:26px;color:var(--accent-strong);font-size:13px;line-height:1;top:-14px;right:-14px}.sticker-handle-rotate{cursor:grab;width:22px;height:22px;bottom:-14px;left:-14px}.sticker-handle-rotate:after{content:"⟳";font-size:13px}.sticker-handle-scale{cursor:nwse-resize;width:22px;height:22px;bottom:-14px;right:-14px}.sticker-handle-scale:after{content:"⤡";font-size:12px}@media (width>=621px) and (width<=1024px){.sticker-bank-button{width:118px;height:142px;bottom:-14px}.sticker-bank-tray{bottom:139px}.sticker-instance{max-width:200px;max-height:200px}}@media (width<=620px){.sticker-bank-button{width:92px;height:110px;bottom:-10px}.sticker-bank-tray{bottom:108px}.sticker-bank-tray-grid{grid-template-columns:repeat(4,1fr)}.sticker-instance{max-width:130px;max-height:130px}.onboarding-coach{max-width:none;left:var(--sp-3)!important;right:var(--sp-3)!important;top:auto!important;bottom:var(--sp-3)!important;transform:none!important}.onboarding-coach-face{width:48px}.onboarding-coach--intro{max-width:100%;position:static}.onboarding-coach-face--intro{width:120px}}
