:where(html){--font-system-ui:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;--font-transitional:Charter,Bitstream Charter,Sitka Text,Cambria,serif;--font-old-style:Iowan Old Style,Palatino Linotype,URW Palladio L,P052,serif;--font-humanist:Seravek,Gill Sans Nova,Ubuntu,Calibri,DejaVu Sans,source-sans-pro,sans-serif;--font-geometric-humanist:Avenir,Montserrat,Corbel,URW Gothic,source-sans-pro,sans-serif;--font-classical-humanist:Optima,Candara,Noto Sans,source-sans-pro,sans-serif;--font-neo-grotesque:Inter,Roboto,Helvetica Neue,Arial Nova,Nimbus Sans,Arial,sans-serif;--font-monospace-slab-serif:Nimbus Mono PS,Courier New,monospace;--font-monospace-code:Dank Mono,Operator Mono,Inconsolata,Fira Mono,ui-monospace,SF Mono,Monaco,Droid Sans Mono,Source Code Pro,Cascadia Code,Menlo,Consolas,DejaVu Sans Mono,monospace;--font-industrial:Bahnschrift,DIN Alternate,Franklin Gothic Medium,Nimbus Sans Narrow,sans-serif-condensed,sans-serif;--font-rounded-sans:ui-rounded,Hiragino Maru Gothic ProN,Quicksand,Comfortaa,Manjari,Arial Rounded MT,Arial Rounded MT Bold,Calibri,source-sans-pro,sans-serif;--font-slab-serif:Rockwell,Rockwell Nova,Roboto Slab,DejaVu Serif,Sitka Small,serif;--font-antique:Superclarendon,Bookman Old Style,URW Bookman,URW Bookman L,Georgia Pro,Georgia,serif;--font-didone:Didot,Bodoni MT,Noto Serif Display,URW Palladio L,P052,Sylfaen,serif;--font-handwritten:Segoe Print,Bradley Hand,Chilanka,TSCu_Comic,casual,cursive;--font-sans:var(--font-system-ui);--font-serif:ui-serif,serif;--font-mono:var(--font-monospace-code);--font-weight-1:100;--font-weight-2:200;--font-weight-3:300;--font-weight-4:400;--font-weight-5:500;--font-weight-6:600;--font-weight-7:700;--font-weight-8:800;--font-weight-9:900;--font-lineheight-00:.95;--font-lineheight-0:1.1;--font-lineheight-1:1.25;--font-lineheight-2:1.375;--font-lineheight-3:1.5;--font-lineheight-4:1.75;--font-lineheight-5:2;--font-letterspacing-0:-.05em;--font-letterspacing-1:.025em;--font-letterspacing-2:.05em;--font-letterspacing-3:.075em;--font-letterspacing-4:.15em;--font-letterspacing-5:.5em;--font-letterspacing-6:.75em;--font-letterspacing-7:1em;--font-size-00:.5rem;--font-size-0:.75rem;--font-size-1:1rem;--font-size-2:1.1rem;--font-size-3:1.25rem;--font-size-4:1.5rem;--font-size-5:2rem;--font-size-6:2.5rem;--font-size-7:3rem;--font-size-8:3.5rem;--font-size-fluid-0:max(.75rem,min(2vw,1rem));--font-size-fluid-1:max(1rem,min(4vw,1.5rem));--font-size-fluid-2:max(1.5rem,min(6vw,2.5rem));--font-size-fluid-3:max(2rem,min(9vw,3.5rem));--size-000:-.5rem;--size-00:-.25rem;--size-1:.25rem;--size-2:.5rem;--size-3:1rem;--size-4:1.25rem;--size-5:1.5rem;--size-6:1.75rem;--size-7:2rem;--size-8:3rem;--size-9:4rem;--size-10:5rem;--size-11:7.5rem;--size-12:10rem;--size-13:15rem;--size-14:20rem;--size-15:30rem;--size-px-000:-8px;--size-px-00:-4px;--size-px-1:4px;--size-px-2:8px;--size-px-3:16px;--size-px-4:20px;--size-px-5:24px;--size-px-6:28px;--size-px-7:32px;--size-px-8:48px;--size-px-9:64px;--size-px-10:80px;--size-px-11:120px;--size-px-12:160px;--size-px-13:240px;--size-px-14:320px;--size-px-15:480px;--size-fluid-1:max(.5rem,min(1vw,1rem));--size-fluid-2:max(1rem,min(2vw,1.5rem));--size-fluid-3:max(1.5rem,min(3vw,2rem));--size-fluid-4:max(2rem,min(4vw,3rem));--size-fluid-5:max(4rem,min(5vw,5rem));--size-fluid-6:max(5rem,min(7vw,7.5rem));--size-fluid-7:max(7.5rem,min(10vw,10rem));--size-fluid-8:max(10rem,min(20vw,15rem));--size-fluid-9:max(15rem,min(30vw,20rem));--size-fluid-10:max(20rem,min(40vw,30rem));--size-content-1:20ch;--size-content-2:45ch;--size-content-3:60ch;--size-header-1:20ch;--size-header-2:25ch;--size-header-3:35ch;--size-xxs:240px;--size-xs:360px;--size-sm:480px;--size-md:768px;--size-lg:1024px;--size-xl:1440px;--size-xxl:1920px;--size-relative-000:-.5ch;--size-relative-00:-.25ch;--size-relative-1:.25ch;--size-relative-2:.5ch;--size-relative-3:1ch;--size-relative-4:1.25ch;--size-relative-5:1.5ch;--size-relative-6:1.75ch;--size-relative-7:2ch;--size-relative-8:3ch;--size-relative-9:4ch;--size-relative-10:5ch;--size-relative-11:7.5ch;--size-relative-12:10ch;--size-relative-13:15ch;--size-relative-14:20ch;--size-relative-15:30ch;--ease-1:cubic-bezier(.25,0,.5,1);--ease-2:cubic-bezier(.25,0,.4,1);--ease-3:cubic-bezier(.25,0,.3,1);--ease-4:cubic-bezier(.25,0,.2,1);--ease-5:cubic-bezier(.25,0,.1,1);--ease-in-1:cubic-bezier(.25,0,1,1);--ease-in-2:cubic-bezier(.5,0,1,1);--ease-in-3:cubic-bezier(.7,0,1,1);--ease-in-4:cubic-bezier(.9,0,1,1);--ease-in-5:cubic-bezier(1,0,1,1);--ease-out-1:cubic-bezier(0,0,.75,1);--ease-out-2:cubic-bezier(0,0,.5,1);--ease-out-3:cubic-bezier(0,0,.3,1);--ease-out-4:cubic-bezier(0,0,.1,1);--ease-out-5:cubic-bezier(0,0,0,1);--ease-in-out-1:cubic-bezier(.1,0,.9,1);--ease-in-out-2:cubic-bezier(.3,0,.7,1);--ease-in-out-3:cubic-bezier(.5,0,.5,1);--ease-in-out-4:cubic-bezier(.7,0,.3,1);--ease-in-out-5:cubic-bezier(.9,0,.1,1);--ease-elastic-out-1:cubic-bezier(.5,.75,.75,1.25);--ease-elastic-out-2:cubic-bezier(.5,1,.75,1.25);--ease-elastic-out-3:cubic-bezier(.5,1.25,.75,1.25);--ease-elastic-out-4:cubic-bezier(.5,1.5,.75,1.25);--ease-elastic-out-5:cubic-bezier(.5,1.75,.75,1.25);--ease-elastic-in-1:cubic-bezier(.5,-.25,.75,1);--ease-elastic-in-2:cubic-bezier(.5,-.5,.75,1);--ease-elastic-in-3:cubic-bezier(.5,-.75,.75,1);--ease-elastic-in-4:cubic-bezier(.5,-1,.75,1);--ease-elastic-in-5:cubic-bezier(.5,-1.25,.75,1);--ease-elastic-in-out-1:cubic-bezier(.5,-.1,.1,1.5);--ease-elastic-in-out-2:cubic-bezier(.5,-.3,.1,1.5);--ease-elastic-in-out-3:cubic-bezier(.5,-.5,.1,1.5);--ease-elastic-in-out-4:cubic-bezier(.5,-.7,.1,1.5);--ease-elastic-in-out-5:cubic-bezier(.5,-.9,.1,1.5);--ease-step-1:steps(2);--ease-step-2:steps(3);--ease-step-3:steps(4);--ease-step-4:steps(7);--ease-step-5:steps(10);--ease-elastic-1:var(--ease-elastic-out-1);--ease-elastic-2:var(--ease-elastic-out-2);--ease-elastic-3:var(--ease-elastic-out-3);--ease-elastic-4:var(--ease-elastic-out-4);--ease-elastic-5:var(--ease-elastic-out-5);--ease-squish-1:var(--ease-elastic-in-out-1);--ease-squish-2:var(--ease-elastic-in-out-2);--ease-squish-3:var(--ease-elastic-in-out-3);--ease-squish-4:var(--ease-elastic-in-out-4);--ease-squish-5:var(--ease-elastic-in-out-5);--ease-spring-1:linear(0,.006,.025 2.8%,.101 6.1%,.539 18.9%,.721 25.3%,.849 31.5%,.937 38.1%,.968 41.8%,.991 45.7%,1.006 50.1%,1.015 55%,1.017 63.9%,1.001);--ease-spring-2:linear(0,.007,.029 2.2%,.118 4.7%,.625 14.4%,.826 19%,.902,.962,1.008 26.1%,1.041 28.7%,1.064 32.1%,1.07 36%,1.061 40.5%,1.015 53.4%,.999 61.6%,.995 71.2%,1);--ease-spring-3:linear(0,.009,.035 2.1%,.141 4.4%,.723 12.9%,.938 16.7%,1.017,1.077,1.121,1.149 24.3%,1.159,1.163,1.161,1.154 29.9%,1.129 32.8%,1.051 39.6%,1.017 43.1%,.991,.977 51%,.974 53.8%,.975 57.1%,.997 69.8%,1.003 76.9%,1);--ease-spring-4:linear(0,.009,.037 1.7%,.153 3.6%,.776 10.3%,1.001,1.142 16%,1.185,1.209 19%,1.215 19.9% 20.8%,1.199,1.165 25%,1.056 30.3%,1.008 33%,.973,.955 39.2%,.953 41.1%,.957 43.3%,.998 53.3%,1.009 59.1% 63.7%,.998 78.9%,1);--ease-spring-5:linear(0,.01,.04 1.6%,.161 3.3%,.816 9.4%,1.046,1.189 14.4%,1.231,1.254 17%,1.259,1.257 18.6%,1.236,1.194 22.3%,1.057 27%,.999 29.4%,.955 32.1%,.942,.935 34.9%,.933,.939 38.4%,1 47.3%,1.011,1.017 52.6%,1.016 56.4%,1 65.2%,.996 70.2%,1.001 87.2%,1);--ease-bounce-1:linear(0,.004,.016,.035,.063,.098,.141,.191,.25,.316,.391 36.8%,.563,.766,1 58.8%,.946,.908 69.1%,.895,.885,.879,.878,.879,.885,.895,.908 89.7%,.946,1);--ease-bounce-2:linear(0,.004,.016,.035,.063,.098,.141 15.1%,.25,.391,.562,.765,1,.892 45.2%,.849,.815,.788,.769,.757,.753,.757,.769,.788,.815,.85,.892 75.2%,1 80.2%,.973,.954,.943,.939,.943,.954,.973,1);--ease-bounce-3:linear(0,.004,.016,.035,.062,.098,.141 11.4%,.25,.39,.562,.764,1 30.3%,.847 34.8%,.787,.737,.699,.672,.655,.65,.656,.672,.699,.738,.787,.847 61.7%,1 66.2%,.946,.908,.885 74.2%,.879,.878,.879,.885 79.5%,.908,.946,1 87.4%,.981,.968,.96,.957,.96,.968,.981,1);--ease-bounce-4:linear(0,.004,.016 3%,.062,.141,.25,.391,.562 18.2%,1 24.3%,.81,.676 32.3%,.629,.595,.575,.568,.575,.595,.629,.676 48.2%,.811,1 56.2%,.918,.86,.825,.814,.825,.86,.918,1 77.2%,.94 80.6%,.925,.92,.925,.94 87.5%,1 90.9%,.974,.965,.974,1);--ease-bounce-5:linear(0,.004,.016 2.5%,.063,.141,.25 10.1%,.562,1 20.2%,.783,.627,.534 30.9%,.511,.503,.511,.534 38%,.627,.782,1 48.7%,.892,.815,.769 56.3%,.757,.753,.757,.769 61.3%,.815,.892,1 68.8%,.908 72.4%,.885,.878,.885,.908 79.4%,1 83%,.954 85.5%,.943,.939,.943,.954 90.5%,1 93%,.977,.97,.977,1);--ease-circ-in:cubic-bezier(.6,.04,.98,.335);--ease-circ-in-out:cubic-bezier(.785,.135,.15,.86);--ease-circ-out:cubic-bezier(.075,.82,.165,1);--ease-cubic-in:cubic-bezier(.55,.055,.675,.19);--ease-cubic-in-out:cubic-bezier(.645,.045,.355,1);--ease-cubic-out:cubic-bezier(.215,.61,.355,1);--ease-expo-in:cubic-bezier(.95,.05,.795,.035);--ease-expo-in-out:cubic-bezier(1,0,0,1);--ease-expo-out:cubic-bezier(.19,1,.22,1);--ease-quad-in:cubic-bezier(.55,.085,.68,.53);--ease-quad-in-out:cubic-bezier(.455,.03,.515,.955);--ease-quad-out:cubic-bezier(.25,.46,.45,.94);--ease-quart-in:cubic-bezier(.895,.03,.685,.22);--ease-quart-in-out:cubic-bezier(.77,0,.175,1);--ease-quart-out:cubic-bezier(.165,.84,.44,1);--ease-quint-in:cubic-bezier(.755,.05,.855,.06);--ease-quint-in-out:cubic-bezier(.86,0,.07,1);--ease-quint-out:cubic-bezier(.23,1,.32,1);--ease-sine-in:cubic-bezier(.47,0,.745,.715);--ease-sine-in-out:cubic-bezier(.445,.05,.55,.95);--ease-sine-out:cubic-bezier(.39,.575,.565,1);--layer-1:1;--layer-2:2;--layer-3:3;--layer-4:4;--layer-5:5;--layer-important:2147480000;--shadow-color:220 3% 15%;--shadow-strength:1%;--shadow-strength-3:calc(var(--shadow-strength) + 2%);--shadow-strength-4:calc(var(--shadow-strength) + 3%);--shadow-strength-5:calc(var(--shadow-strength) + 4%);--shadow-strength-6:calc(var(--shadow-strength) + 5%);--shadow-strength-7:calc(var(--shadow-strength) + 6%);--shadow-strength-8:calc(var(--shadow-strength) + 7%);--shadow-strength-10:calc(var(--shadow-strength) + 9%);--inner-shadow-highlight:inset 0 -.5px 0 0 #fff,inset 0 .5px 0 0 #0001;--shadow-1:0 1px 2px -1px hsl(var(--shadow-color)/var(--shadow-strength-10));--shadow-2:0 3px 5px -2px hsl(var(--shadow-color)/var(--shadow-strength-4)),0 7px 14px -5px hsl(var(--shadow-color)/var(--shadow-strength-6));--shadow-3:0 -1px 3px 0 hsl(var(--shadow-color)/var(--shadow-strength-3)),0 1px 2px -5px hsl(var(--shadow-color)/var(--shadow-strength-3)),0 2px 5px -5px hsl(var(--shadow-color)/var(--shadow-strength-5)),0 4px 12px -5px hsl(var(--shadow-color)/var(--shadow-strength-6)),0 12px 15px -5px hsl(var(--shadow-color)/var(--shadow-strength-8));--shadow-4:0 -2px 5px 0 hsl(var(--shadow-color)/var(--shadow-strength-3)),0 1px 1px -2px hsl(var(--shadow-color)/var(--shadow-strength-4)),0 2px 2px -2px hsl(var(--shadow-color)/var(--shadow-strength-4)),0 5px 5px -2px hsl(var(--shadow-color)/var(--shadow-strength-5)),0 9px 9px -2px hsl(var(--shadow-color)/var(--shadow-strength-6)),0 16px 16px -2px hsl(var(--shadow-color)/var(--shadow-strength-7));--shadow-5:0 -1px 2px 0 hsl(var(--shadow-color)/var(--shadow-strength-3)),0 2px 1px -2px hsl(var(--shadow-color)/var(--shadow-strength-4)),0 5px 5px -2px hsl(var(--shadow-color)/var(--shadow-strength-4)),0 10px 10px -2px hsl(var(--shadow-color)/var(--shadow-strength-5)),0 20px 20px -2px hsl(var(--shadow-color)/var(--shadow-strength-6)),0 40px 40px -2px hsl(var(--shadow-color)/var(--shadow-strength-8));--shadow-6:0 -1px 2px 0 hsl(var(--shadow-color)/var(--shadow-strength-3)),0 3px 2px -2px hsl(var(--shadow-color)/var(--shadow-strength-4)),0 7px 5px -2px hsl(var(--shadow-color)/var(--shadow-strength-4)),0 12px 10px -2px hsl(var(--shadow-color)/var(--shadow-strength-5)),0 22px 18px -2px hsl(var(--shadow-color)/var(--shadow-strength-6)),0 41px 33px -2px hsl(var(--shadow-color)/var(--shadow-strength-7)),0 100px 80px -2px hsl(var(--shadow-color)/var(--shadow-strength-8));--inner-shadow-0:inset 0 0 0 1px hsl(var(--shadow-color)/var(--shadow-strength-10));--inner-shadow-1:inset 0 1px 2px 0 hsl(var(--shadow-color)/var(--shadow-strength-10)),var(--inner-shadow-highlight);--inner-shadow-2:inset 0 1px 4px 0 hsl(var(--shadow-color)/var(--shadow-strength-10)),var(--inner-shadow-highlight);--inner-shadow-3:inset 0 2px 8px 0 hsl(var(--shadow-color)/var(--shadow-strength-10)),var(--inner-shadow-highlight);--inner-shadow-4:inset 0 2px 14px 0 hsl(var(--shadow-color)/var(--shadow-strength-10)),var(--inner-shadow-highlight);--ratio-square:1;--ratio-landscape:4/3;--ratio-portrait:3/4;--ratio-widescreen:16/9;--ratio-ultrawide:18/5;--ratio-golden:1.618/1;--gray-0:#f8f9fa;--gray-1:#f1f3f5;--gray-2:#e9ecef;--gray-3:#dee2e6;--gray-4:#ced4da;--gray-5:#adb5bd;--gray-6:#868e96;--gray-7:#495057;--gray-8:#343a40;--gray-9:#212529;--gray-10:#16191d;--gray-11:#0d0f12;--gray-12:#030507;--stone-0:#f8fafb;--stone-1:#f2f4f6;--stone-2:#ebedef;--stone-3:#e0e4e5;--stone-4:#d1d6d8;--stone-5:#b1b6b9;--stone-6:#979b9d;--stone-7:#7e8282;--stone-8:#666968;--stone-9:#50514f;--stone-10:#3a3a37;--stone-11:#252521;--stone-12:#121210;--red-0:#fff5f5;--red-1:#ffe3e3;--red-2:#ffc9c9;--red-3:#ffa8a8;--red-4:#ff8787;--red-5:#ff6b6b;--red-6:#fa5252;--red-7:#f03e3e;--red-8:#e03131;--red-9:#c92a2a;--red-10:#b02525;--red-11:#962020;--red-12:#7d1a1a;--pink-0:#fff0f6;--pink-1:#ffdeeb;--pink-2:#fcc2d7;--pink-3:#faa2c1;--pink-4:#f783ac;--pink-5:#f06595;--pink-6:#e64980;--pink-7:#d6336c;--pink-8:#c2255c;--pink-9:#a61e4d;--pink-10:#8c1941;--pink-11:#731536;--pink-12:#59102a;--purple-0:#f8f0fc;--purple-1:#f3d9fa;--purple-2:#eebefa;--purple-3:#e599f7;--purple-4:#da77f2;--purple-5:#cc5de8;--purple-6:#be4bdb;--purple-7:#ae3ec9;--purple-8:#9c36b5;--purple-9:#862e9c;--purple-10:#702682;--purple-11:#5a1e69;--purple-12:#44174f;--violet-0:#f3f0ff;--violet-1:#e5dbff;--violet-2:#d0bfff;--violet-3:#b197fc;--violet-4:#9775fa;--violet-5:#845ef7;--violet-6:#7950f2;--violet-7:#7048e8;--violet-8:#6741d9;--violet-9:#5f3dc4;--violet-10:#5235ab;--violet-11:#462d91;--violet-12:#3a2578;--indigo-0:#edf2ff;--indigo-1:#dbe4ff;--indigo-2:#bac8ff;--indigo-3:#91a7ff;--indigo-4:#748ffc;--indigo-5:#5c7cfa;--indigo-6:#4c6ef5;--indigo-7:#4263eb;--indigo-8:#3b5bdb;--indigo-9:#364fc7;--indigo-10:#2f44ad;--indigo-11:#283a94;--indigo-12:#21307a;--blue-0:#e7f5ff;--blue-1:#d0ebff;--blue-2:#a5d8ff;--blue-3:#74c0fc;--blue-4:#4dabf7;--blue-5:#339af0;--blue-6:#228be6;--blue-7:#1c7ed6;--blue-8:#1971c2;--blue-9:#1864ab;--blue-10:#145591;--blue-11:#114678;--blue-12:#0d375e;--cyan-0:#e3fafc;--cyan-1:#c5f6fa;--cyan-2:#99e9f2;--cyan-3:#66d9e8;--cyan-4:#3bc9db;--cyan-5:#22b8cf;--cyan-6:#15aabf;--cyan-7:#1098ad;--cyan-8:#0c8599;--cyan-9:#0b7285;--cyan-10:#095c6b;--cyan-11:#074652;--cyan-12:#053038;--teal-0:#e6fcf5;--teal-1:#c3fae8;--teal-2:#96f2d7;--teal-3:#63e6be;--teal-4:#38d9a9;--teal-5:#20c997;--teal-6:#12b886;--teal-7:#0ca678;--teal-8:#099268;--teal-9:#087f5b;--teal-10:#066649;--teal-11:#054d37;--teal-12:#033325;--green-0:#ebfbee;--green-1:#d3f9d8;--green-2:#b2f2bb;--green-3:#8ce99a;--green-4:#69db7c;--green-5:#51cf66;--green-6:#40c057;--green-7:#37b24d;--green-8:#2f9e44;--green-9:#2b8a3e;--green-10:#237032;--green-11:#1b5727;--green-12:#133d1b;--lime-0:#f4fce3;--lime-1:#e9fac8;--lime-2:#d8f5a2;--lime-3:#c0eb75;--lime-4:#a9e34b;--lime-5:#94d82d;--lime-6:#82c91e;--lime-7:#74b816;--lime-8:#66a80f;--lime-9:#5c940d;--lime-10:#4c7a0b;--lime-11:#3c6109;--lime-12:#2c4706;--yellow-0:#fff9db;--yellow-1:#fff3bf;--yellow-2:#ffec99;--yellow-3:#ffe066;--yellow-4:#ffd43b;--yellow-5:#fcc419;--yellow-6:#fab005;--yellow-7:#f59f00;--yellow-8:#f08c00;--yellow-9:#e67700;--yellow-10:#b35c00;--yellow-11:#804200;--yellow-12:#663500;--orange-0:#fff4e6;--orange-1:#ffe8cc;--orange-2:#ffd8a8;--orange-3:#ffc078;--orange-4:#ffa94d;--orange-5:#ff922b;--orange-6:#fd7e14;--orange-7:#f76707;--orange-8:#e8590c;--orange-9:#d9480f;--orange-10:#bf400d;--orange-11:#99330b;--orange-12:#802b09;--choco-0:#fff8dc;--choco-1:#fce1bc;--choco-2:#f7ca9e;--choco-3:#f1b280;--choco-4:#e99b62;--choco-5:#df8545;--choco-6:#d46e25;--choco-7:#bd5f1b;--choco-8:#a45117;--choco-9:#8a4513;--choco-10:#703a13;--choco-11:#572f12;--choco-12:#3d210d;--brown-0:#faf4eb;--brown-1:#ede0d1;--brown-2:#e0cab7;--brown-3:#d3b79e;--brown-4:#c5a285;--brown-5:#b78f6d;--brown-6:#a87c56;--brown-7:#956b47;--brown-8:#825b3a;--brown-9:#6f4b2d;--brown-10:#5e3a21;--brown-11:#4e2b15;--brown-12:#422412;--sand-0:#f8fafb;--sand-1:#e6e4dc;--sand-2:#d5cfbd;--sand-3:#c2b9a0;--sand-4:#aea58c;--sand-5:#9a9178;--sand-6:#867c65;--sand-7:#736a53;--sand-8:#5f5746;--sand-9:#4b4639;--sand-10:#38352d;--sand-11:#252521;--sand-12:#121210;--camo-0:#f9fbe7;--camo-1:#e8ed9c;--camo-2:#d2df4e;--camo-3:#c2ce34;--camo-4:#b5bb2e;--camo-5:#a7a827;--camo-6:#999621;--camo-7:#8c851c;--camo-8:#7e7416;--camo-9:#6d6414;--camo-10:#5d5411;--camo-11:#4d460e;--camo-12:#36300a;--jungle-0:#ecfeb0;--jungle-1:#def39a;--jungle-2:#d0e884;--jungle-3:#c2dd6e;--jungle-4:#b5d15b;--jungle-5:#a8c648;--jungle-6:#9bbb36;--jungle-7:#8fb024;--jungle-8:#84a513;--jungle-9:#7a9908;--jungle-10:#658006;--jungle-11:#516605;--jungle-12:#3d4d04;--gradient-space: ;--gradient-1:linear-gradient(to bottom right var(--gradient-space),#1f005c,#5b0060,#870160,#ac255e,#ca485c,#e16b5c,#f39060,#ffb56b);--gradient-2:linear-gradient(to bottom right var(--gradient-space),#48005c,#8300e2,#a269ff);--gradient-3:radial-gradient(circle at top right var(--gradient-space),#0ff,#0ff0),radial-gradient(circle at bottom left var(--gradient-space),#ff1492,#ff149200);--gradient-4:linear-gradient(to bottom right var(--gradient-space),#00f5a0,#00d9f5);--gradient-5:conic-gradient(from -270deg at 75% 110% var(--gradient-space),#f0f,#fffaf0);--gradient-6:conic-gradient(from -90deg at top left var(--gradient-space),#000,#fff);--gradient-7:linear-gradient(to bottom right var(--gradient-space),#72c6ef,#004e8f);--gradient-8:conic-gradient(from 90deg at 50% 0% var(--gradient-space),#111,50%,#222,#111);--gradient-9:conic-gradient(from .5turn at bottom center var(--gradient-space),#add8e6,#fff);--gradient-10:conic-gradient(from 90deg at 40% -25% var(--gradient-space),gold,#f79d03,#ee6907,#e6390a,#de0d0d,#d61039,#cf1261,#c71585,#cf1261,#d61039,#de0d0d,#ee6907,#f79d03,gold,gold,gold);--gradient-11:conic-gradient(at bottom left var(--gradient-space),#ff1493,cyan);--gradient-12:conic-gradient(from 90deg at 25% -10% var(--gradient-space),#ff4500,#d3f340,#7bee85,#afeeee,#7bee85);--gradient-13:radial-gradient(circle at 50% 200% var(--gradient-space),#000142,#3b0083,#b300c3,#ff059f,#ff4661,#ffad86,#fff3c7);--gradient-14:conic-gradient(at top right var(--gradient-space),lime,cyan);--gradient-15:linear-gradient(to bottom right var(--gradient-space),#c7d2fe,#fecaca,#fef3c7);--gradient-16:radial-gradient(circle at 50% -250% var(--gradient-space),#374151,#111827,#000);--gradient-17:conic-gradient(from -90deg at 50% -25% var(--gradient-space),blue,#8a2be2);--gradient-18:linear-gradient(0deg var(--gradient-space),#f00c,#f000 75%),linear-gradient(60deg var(--gradient-space),#ff0c,#ff00 75%),linear-gradient(120deg var(--gradient-space),#0f0c,#0f00 75%),linear-gradient(180deg var(--gradient-space),#0ffc,#0ff0 75%),linear-gradient(240deg var(--gradient-space),#00fc,#00f0 75%),linear-gradient(300deg var(--gradient-space),#f0fc,#f0f0 75%);--gradient-19:linear-gradient(to bottom right var(--gradient-space),#ffe259,#ffa751);--gradient-20:conic-gradient(from -135deg at -10% center var(--gradient-space),orange,#ff7715,#ff522a,#ff3f47,#ff5482,#ff69b4);--gradient-21:conic-gradient(from -90deg at 25% 115% var(--gradient-space),red,#f06,#f0c,#c0f,#60f,#00f,#00f,#00f,#00f);--gradient-22:linear-gradient(to bottom right var(--gradient-space),#acb6e5,#86fde8);--gradient-23:linear-gradient(to bottom right var(--gradient-space),#536976,#292e49);--gradient-24:conic-gradient(from .5turn at 0% 0% var(--gradient-space),#00c476,10%,#82b0ff,90%,#00c476);--gradient-25:conic-gradient(at 125% 50% var(--gradient-space),#b78cf7,#ff7c94,#ffcf0d,#ff7c94,#b78cf7);--gradient-26:linear-gradient(to bottom right var(--gradient-space),#9796f0,#fbc7d4);--gradient-27:conic-gradient(from .5turn at bottom left var(--gradient-space),#ff1493,#639);--gradient-28:conic-gradient(from -90deg at 50% 105% var(--gradient-space),#fff,orchid);--gradient-29:radial-gradient(circle at top right var(--gradient-space),#bfb3ff,#bfb3ff00),radial-gradient(circle at bottom left var(--gradient-space),#86acf9,#86acf900);--gradient-30:radial-gradient(circle at top right var(--gradient-space),#00ff80,#00ff8000),radial-gradient(circle at bottom left var(--gradient-space),#adffd6,#adffd600);--noise-1:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='a'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.005' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23a)'/%3E%3C/svg%3E");--noise-2:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 300 300' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='a'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.05' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23a)'/%3E%3C/svg%3E");--noise-3:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='a'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.25' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23a)'/%3E%3C/svg%3E");--noise-4:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 2056 2056' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='a'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.5' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23a)'/%3E%3C/svg%3E");--noise-5:url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 2056 2056' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='a'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23a)'/%3E%3C/svg%3E");--noise-filter-1:contrast(300%) brightness(100%);--noise-filter-2:contrast(200%) brightness(150%);--noise-filter-3:contrast(200%) brightness(250%);--noise-filter-4:contrast(200%) brightness(500%);--noise-filter-5:contrast(200%) brightness(1000%);--animation-fade-in:fade-in .5s var(--ease-3);--animation-fade-in-bloom:fade-in-bloom 2s var(--ease-3);--animation-fade-out:fade-out .5s var(--ease-3);--animation-fade-out-bloom:fade-out-bloom 2s var(--ease-3);--animation-scale-up:scale-up .5s var(--ease-3);--animation-scale-down:scale-down .5s var(--ease-3);--animation-slide-out-up:slide-out-up .5s var(--ease-3);--animation-slide-out-down:slide-out-down .5s var(--ease-3);--animation-slide-out-right:slide-out-right .5s var(--ease-3);--animation-slide-out-left:slide-out-left .5s var(--ease-3);--animation-slide-in-up:slide-in-up .5s var(--ease-3);--animation-slide-in-down:slide-in-down .5s var(--ease-3);--animation-slide-in-right:slide-in-right .5s var(--ease-3);--animation-slide-in-left:slide-in-left .5s var(--ease-3);--animation-shake-x:shake-x .75s var(--ease-out-5);--animation-shake-y:shake-y .75s var(--ease-out-5);--animation-shake-z:shake-z 1s var(--ease-in-out-3);--animation-spin:spin 2s linear infinite;--animation-ping:ping 5s var(--ease-out-3) infinite;--animation-blink:blink 1s var(--ease-out-3) infinite;--animation-float:float 3s var(--ease-in-out-3) infinite;--animation-bounce:bounce 2s var(--ease-squish-2) infinite;--animation-pulse:pulse 2s var(--ease-out-3) infinite;--border-size-1:1px;--border-size-2:2px;--border-size-3:5px;--border-size-4:10px;--border-size-5:25px;--radius-1:2px;--radius-2:5px;--radius-3:1rem;--radius-4:2rem;--radius-5:4rem;--radius-6:8rem;--radius-drawn-1:255px 15px 225px 15px/15px 225px 15px 255px;--radius-drawn-2:125px 10px 20px 185px/25px 205px 205px 25px;--radius-drawn-3:15px 255px 15px 225px/225px 15px 255px 15px;--radius-drawn-4:15px 25px 155px 25px/225px 150px 25px 115px;--radius-drawn-5:250px 25px 15px 20px/15px 80px 105px 115px;--radius-drawn-6:28px 100px 20px 15px/150px 30px 205px 225px;--radius-round:100000px;--radius-blob-1:30% 70% 70% 30%/53% 30% 70% 47%;--radius-blob-2:53% 47% 34% 66%/63% 46% 54% 37%;--radius-blob-3:37% 63% 56% 44%/49% 56% 44% 51%;--radius-blob-4:63% 37% 37% 63%/43% 37% 63% 57%;--radius-blob-5:49% 51% 48% 52%/57% 44% 56% 43%;--radius-conditional-1:clamp(0px, calc(100vw - 100%) * 100000,var(--radius-1));--radius-conditional-2:clamp(0px, calc(100vw - 100%) * 100000,var(--radius-2));--radius-conditional-3:clamp(0px, calc(100vw - 100%) * 100000,var(--radius-3));--radius-conditional-4:clamp(0px, calc(100vw - 100%) * 100000,var(--radius-4));--radius-conditional-5:clamp(0px, calc(100vw - 100%) * 100000,var(--radius-5));--radius-conditional-6:clamp(0px, calc(100vw - 100%) * 100000,var(--radius-6));--palette-hue:250;--palette-hue-rotate-by:0;--palette-chroma:.15;--color-1:oklch(98% calc(var(--palette-chroma)*.03) calc(var(--palette-hue) + var(--palette-hue-rotate-by)*0));--color-2:oklch(97% calc(var(--palette-chroma)*.06) calc(var(--palette-hue) + var(--palette-hue-rotate-by)*1));--color-3:oklch(93% calc(var(--palette-chroma)*.1) calc(var(--palette-hue) + var(--palette-hue-rotate-by)*2));--color-4:oklch(84% calc(var(--palette-chroma)*.12) calc(var(--palette-hue) + var(--palette-hue-rotate-by)*3));--color-5:oklch(80% calc(var(--palette-chroma)*.16) calc(var(--palette-hue) + var(--palette-hue-rotate-by)*4));--color-6:oklch(71% calc(var(--palette-chroma)*.19) calc(var(--palette-hue) + var(--palette-hue-rotate-by)*5));--color-7:oklch(66% calc(var(--palette-chroma)*.2) calc(var(--palette-hue) + var(--palette-hue-rotate-by)*6));--color-8:oklch(58% calc(var(--palette-chroma)*.21) calc(var(--palette-hue) + var(--palette-hue-rotate-by)*7));--color-9:oklch(53% calc(var(--palette-chroma)*.2) calc(var(--palette-hue) + var(--palette-hue-rotate-by)*8));--color-10:oklch(49% calc(var(--palette-chroma)*.19) calc(var(--palette-hue) + var(--palette-hue-rotate-by)*9));--color-11:oklch(42% calc(var(--palette-chroma)*.17) calc(var(--palette-hue) + var(--palette-hue-rotate-by)*10));--color-12:oklch(35% calc(var(--palette-chroma)*.15) calc(var(--palette-hue) + var(--palette-hue-rotate-by)*11));--color-13:oklch(27% calc(var(--palette-chroma)*.12) calc(var(--palette-hue) + var(--palette-hue-rotate-by)*12));--color-14:oklch(20% calc(var(--palette-chroma)*.09) calc(var(--palette-hue) + var(--palette-hue-rotate-by)*13));--color-15:oklch(16% calc(var(--palette-chroma)*.07) calc(var(--palette-hue) + var(--palette-hue-rotate-by)*14));--color-16:oklch(10% calc(var(--palette-chroma)*.05) calc(var(--palette-hue) + var(--palette-hue-rotate-by)*15))}@media(prefers-color-scheme:dark){:where(html){--shadow-color:220 40% 2%;--shadow-strength:25%;--inner-shadow-highlight:inset 0 -.5px 0 0 #fff1,inset 0 .5px 0 0 #0007}}@supports (background:linear-gradient(to right in oklab,#000,#fff)){:where(html){--gradient-space:in oklab}}@keyframes fade-in{to{opacity:1}}@keyframes fade-in-bloom{0%{filter:brightness()blur(20px);opacity:0}10%{filter:brightness(2)blur(10px);opacity:1}to{filter:brightness()blur();opacity:1}}@keyframes fade-out{to{opacity:0}}@keyframes fade-out-bloom{to{filter:brightness()blur(20px);opacity:0}10%{filter:brightness(2)blur(10px);opacity:1}0%{filter:brightness()blur();opacity:1}}@keyframes scale-up{to{transform:scale(1.25)}}@keyframes scale-down{to{transform:scale(.75)}}@keyframes slide-out-up{to{transform:translateY(-100%)}}@keyframes slide-out-down{to{transform:translateY(100%)}}@keyframes slide-out-right{to{transform:translate(100%)}}@keyframes slide-out-left{to{transform:translate(-100%)}}@keyframes slide-in-up{0%{transform:translateY(100%)}}@keyframes slide-in-down{0%{transform:translateY(-100%)}}@keyframes slide-in-right{0%{transform:translate(-100%)}}@keyframes slide-in-left{0%{transform:translate(100%)}}@keyframes shake-x{0%,to{transform:translate(0)}20%{transform:translate(-5%)}40%{transform:translate(5%)}60%{transform:translate(-5%)}80%{transform:translate(5%)}}@keyframes shake-y{0%,to{transform:translateY(0)}20%{transform:translateY(-5%)}40%{transform:translateY(5%)}60%{transform:translateY(-5%)}80%{transform:translateY(5%)}}@keyframes shake-z{0%,to{transform:rotate(0)}20%{transform:rotate(-2deg)}40%{transform:rotate(2deg)}60%{transform:rotate(-2deg)}80%{transform:rotate(2deg)}}@keyframes spin{to{transform:rotate(1turn)}}@keyframes ping{90%,to{opacity:0;transform:scale(2)}}@keyframes blink{0%,to{opacity:1}50%{opacity:.5}}@keyframes float{50%{transform:translateY(-25%)}}@keyframes bounce{25%{transform:translateY(-20%)}40%{transform:translateY(-3%)}0%,60%,to{transform:translateY(0)}}@keyframes pulse{50%{transform:scale(.9)}}@media(prefers-color-scheme:dark){@keyframes fade-in-bloom{0%{filter:brightness()blur(20px);opacity:0}10%{filter:brightness(.5)blur(10px);opacity:1}to{filter:brightness()blur();opacity:1}}@keyframes fade-out-bloom{to{filter:brightness()blur(20px);opacity:0}10%{filter:brightness(.5)blur(10px);opacity:1}0%{filter:brightness()blur();opacity:1}}}*,:before,:after{box-sizing:border-box;margin:0;padding:0}#root{visibility:hidden}#root.loaded{visibility:visible}:root{--bg-primary:#0d1117;--bg-secondary:#161b22;--bg-tertiary:#21262d;--bg-card:#1c2128;--border:#30363d;--text-primary:#e6edf3;--text-secondary:#8b949e;--text-muted:#484f58;--surface:var(--bg-tertiary);--accent:#58a6ff;--accent-dim:#58a6ff26;--accent-glow:#58a6ff4d;--green:#3fb950;--green-dim:#3fb95026;--green-glow:#3fb9504d;--red:#f85149;--yellow:#d29922;--orange:#db6d28;--purple:#bc8cff;--teal:#2dd4bf;--note-active:#58a6ff;--bg-inverse:#f6f8fa;--text-inverse:#1f2328;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}[data-theme=light]{--bg-primary:#f3f4f6;--bg-secondary:#e8eaed;--bg-tertiary:#dde1e6;--bg-card:#eff0f3;--border:#c9cdd3;--text-primary:#1f2328;--text-secondary:#525960;--text-muted:#7d8590;--accent:#0969da;--accent-dim:#0969da1f;--accent-glow:#0969da40;--green:#1a7f37;--green-dim:#1a7f371f;--green-glow:#1a7f3740;--red:#cf222e;--yellow:#9a6700;--orange:#bc4c00;--purple:#8250df;--teal:#0a6460;--note-active:#0969da;--bg-inverse:#1f2328;--text-inverse:#e6edf3;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}html,body{background:var(--bg-primary);height:100%;color:var(--text-primary);font-family:Segoe UI,-apple-system,BlinkMacSystemFont,sans-serif;overflow:hidden}select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border);cursor:pointer;background-image:linear-gradient(45deg,transparent 50%,var(--text-muted) 50%),linear-gradient(135deg,var(--text-muted) 50%,transparent 50%);background-position:calc(100% - 14px),calc(100% - 9px);background-repeat:no-repeat;background-size:5px 5px,5px 5px;border-radius:6px;padding:6px 30px 6px 10px;font-size:.8rem;font-weight:500;line-height:1.3;transition:border-color .15s,background-color .15s,box-shadow .15s}select:hover{border-color:var(--accent-glow);background-color:var(--bg-card)}select:focus{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-dim);outline:none}select option{background:var(--bg-secondary);color:var(--text-primary)}@keyframes crash-pulse{0%,to{box-shadow:0 0 20px #f8514933}50%{box-shadow:0 0 40px #f8514966}}.crash-stacktrace-wrapper{background:#0003;border-radius:8px;max-height:180px;padding:12px;overflow-y:auto}.crash-stacktrace-header{align-items:flex-start;gap:12px;display:flex;position:relative}.crash-stacktrace-content{color:var(--text-muted);white-space:pre-wrap;word-break:break-word;flex:1;min-width:0;margin:0;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;font-size:12px;line-height:1.5}.crash-copy-btn{color:var(--primary);border:1px solid var(--primary);cursor:pointer;white-space:nowrap;background:0 0;border-radius:6px;flex-shrink:0;align-items:center;gap:6px;padding:6px 12px;font-size:12px;font-weight:500;transition:all .15s;display:inline-flex}.crash-copy-btn:hover{background:rgba(var(--primary-rgb),.1)}.crash-copy-btn:active{transform:scale(.98)}.crash-copy-btn svg,.crash-copy-text{flex-shrink:0}select{-webkit-appearance:none;-moz-appearance:none;appearance:none;color:var(--text-primary);cursor:pointer;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;background-color:#161b22;background-image:linear-gradient(45deg,#0000 50%,#58a6ffcc 50%),linear-gradient(135deg,#58a6ffcc 50%,#0000 50%);background-position:calc(100% - 14px),calc(100% - 9px);background-repeat:no-repeat;background-size:5px 5px,5px 5px;border:1px solid #ffffff14;border-radius:6px;padding:6px 30px 6px 10px;font-size:.8rem;font-weight:500;line-height:1.3;transition:border-color .15s,background-color .15s,box-shadow .15s}select:hover{background-color:#1c2128;border-color:#58a6ff66}select:focus{border-color:#58a6ffb3;outline:none;box-shadow:0 0 0 2px #58a6ff26}select option{color:var(--text-primary);background:#161b22}select option:disabled{color:var(--text-muted);letter-spacing:.04em;font-size:.72rem}select option.custom-scale-option{color:#38bdf8e6}.crash-modal-overlay{z-index:9999;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#080a0fd9;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.crash-modal-glass{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#14182099;border:1px solid #ffffff1a;border-radius:24px;width:100%;max-width:540px;padding:40px;position:relative;overflow:hidden;box-shadow:0 24px 64px #0009,inset 0 1px #ffffff0d}.crash-modal-glass:before{content:"";background:linear-gradient(90deg,transparent,var(--red),transparent);opacity:.8;height:2px;position:absolute;top:0;left:0;right:0}.crash-header{align-items:flex-start;gap:20px;margin-bottom:32px;display:flex}.crash-icon-container{width:64px;height:64px;color:var(--red);background:#f8514926;border:1px solid #f851494d;border-radius:16px;flex-shrink:0;justify-content:center;align-items:center;animation:2s ease-in-out infinite crash-pulse;display:flex;box-shadow:0 0 20px #f8514933}.crash-svg-icon{width:32px;height:32px}.crash-header-text{text-align:left}.crash-title{color:#fff;letter-spacing:-.5px;margin:0 0 8px;font-size:24px;font-weight:700}.crash-subtitle{color:var(--text-secondary);margin:0;font-size:14px;line-height:1.5}.crash-error-panel{background:#0000004d;border:1px solid #ffffff0d;border-radius:12px;margin-bottom:24px;overflow:hidden}.crash-error-message-box{background:#f851490d;border-bottom:1px solid #ffffff0d;align-items:center;gap:12px;padding:16px;display:flex}.crash-error-bullet{width:16px;height:16px;color:var(--red);flex-shrink:0}.crash-error-message{color:var(--red);word-break:break-word;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;font-size:13px;font-weight:500}.crash-stacktrace-wrapper{max-height:180px;padding:16px;overflow-y:auto}.crash-stacktrace-content{color:var(--text-muted);white-space:pre-wrap;word-break:break-word;margin:0;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;font-size:12px;line-height:1.6}.crash-metadata{gap:12px;margin-bottom:32px;display:flex}.crash-meta-badge{background:#ffffff08;border:1px solid #ffffff1a;border-radius:8px;align-items:stretch;font-size:11px;display:inline-flex;overflow:hidden;box-shadow:0 2px 8px #0003}.crash-meta-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;background:#ffffff0d;border-right:1px solid #ffffff0d;align-items:center;padding:6px 10px;font-weight:600;line-height:1;display:flex}.crash-meta-value{color:var(--text-primary);align-items:center;padding:6px 12px;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;font-weight:500;line-height:1;display:flex}.crash-actions-container{flex-direction:column;gap:16px;display:flex}.crash-btn{cursor:pointer;border:none;border-radius:12px;justify-content:center;align-items:center;gap:8px;width:100%;padding:14px 20px;font-size:15px;font-weight:600;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex}.crash-btn-primary{background:var(--accent);color:#fff;box-shadow:0 4px 12px #58a6ff33}.crash-btn-primary:hover{background:#79c0ff;transform:translateY(-2px);box-shadow:0 6px 16px #58a6ff4d}.crash-btn-primary:active{transform:translateY(0)}.crash-secondary-actions{justify-content:center;align-items:center;gap:12px;display:flex}.crash-action-link{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;align-items:center;gap:6px;padding:8px;font-size:13px;font-weight:500;text-decoration:none;transition:color .15s;display:flex}.crash-action-link:hover{color:var(--text-primary)}.crash-danger-link:hover{color:var(--red)}.crash-action-divider{color:var(--border);font-size:12px}[data-theme=light] .crash-modal-glass{background:#fffffff2;border-color:#0000001a;box-shadow:0 24px 64px #00000026}[data-theme=light] .crash-title{color:var(--text-primary)}[data-theme=light] .crash-error-panel{background:#00000008;border-color:#0000000d}[data-theme=light] .crash-meta-badge{background:#00000005;border-color:#0000001a}[data-theme=light] .crash-meta-label{background:#0000000d;border-right-color:#0000000d}.dropdown-select-style{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--bg-card);background-image:linear-gradient(45deg,transparent 50%,var(--text-muted) 50%),linear-gradient(135deg,var(--text-muted) 50%,transparent 50%);border:1px solid var(--border);width:100%;min-width:0;color:var(--text-primary);cursor:pointer;background-position:calc(100% - 16px),calc(100% - 11px);background-repeat:no-repeat;background-size:5px 5px,5px 5px;border-radius:6px;padding:7px 30px 7px 10px;font-size:.75rem;font-weight:500;line-height:1.2;transition:border-color .15s,background-color .15s,box-shadow .15s}.dropdown-select-style option{background:var(--bg-secondary);color:var(--text-primary)}#app{flex-direction:column;height:100vh;display:flex}header{background:var(--bg-secondary);border-bottom:1px solid var(--border);flex-shrink:0;align-items:center;gap:16px;padding:10px 24px;display:flex}header h1{cursor:pointer;background:linear-gradient(135deg,var(--accent),var(--purple));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.2rem;font-weight:700}.subtitle{color:var(--text-secondary);font-size:.8rem}.header-left{flex-direction:column;gap:2px;display:flex}.logo-btn{cursor:pointer;text-align:left;background:0 0;border:none;padding:0}.logo-btn #app-title-text{background:linear-gradient(135deg,var(--accent),var(--purple));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin:0;font-size:1.3rem;font-weight:700;line-height:1.2}.logo-btn:hover #app-title-text{opacity:.85}.logo-btn:active #app-title-text{opacity:.7}.main-layout{flex:1;height:100%;min-height:0;display:flex;overflow:hidden}.app-sidebar{background:var(--bg-secondary);border-right:1px solid var(--border);flex-direction:column;flex-shrink:0;gap:10px;width:300px;min-width:300px;height:100%;min-height:0;padding:14px;display:flex;overflow-y:auto}.sidebar-close-btn{color:var(--text-primary);cursor:pointer;opacity:.6;background:0 0;border:none;border-radius:4px;align-self:flex-end;padding:4px;transition:opacity .15s;display:none}.sidebar-close-btn:hover{opacity:1}.sidebar-collapse-btn{background:var(--bg-tertiary);border:1px solid var(--border-color);color:var(--text-color);cursor:pointer;opacity:.6;border-radius:4px;flex-shrink:0;justify-content:center;align-self:flex-end;align-items:center;padding:4px;transition:opacity .15s;display:flex}.sidebar-collapse-btn:hover{opacity:1}.app-sidebar.collapsed{align-items:center;width:40px;min-width:40px;padding:8px 4px}.app-sidebar.collapsed>:not(.sidebar-collapse-btn),.sidebar-toggle-btn{display:none}.sidebar-section{flex-direction:column;gap:6px;display:flex}.sidebar-vis-grid{grid-template-columns:1fr 1fr;gap:8px 12px;padding:12px 4px 0;display:grid}.fancy-divider{background:linear-gradient(90deg,var(--border) 0%,var(--accent) 50%,var(--border) 100%);opacity:.7;border-radius:1px;align-items:center;height:2px;margin:16px 0 8px;display:flex}.vis-grid-cell{background:var(--bg-tertiary);border:1px solid #ffffff05;border-radius:8px;justify-content:space-between;align-items:center;min-height:28px;padding:4px 10px;display:flex}.vis-grid-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.3px;font-size:.7rem;font-weight:500}.vis-grid-toggle{height:18px;width:34px!important}.vis-grid-toggle.settings-toggle .settings-slider{border-radius:18px;width:34px}.vis-grid-toggle.settings-toggle .settings-slider:before{width:12px;height:12px;top:50%;bottom:auto;left:2px;transform:translateY(-50%)}.vis-grid-toggle.settings-toggle input:checked+.settings-slider:before{transform:translate(16px,-50%)}.sidebar-section.sidebar-notes-bottom{border-top:1px solid var(--border);flex-direction:column;margin-top:auto;padding-top:10px;display:flex}.app-header-bar{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.app-header-sep{background:var(--border);flex-shrink:0;width:1px;height:22px}.practice-header-bar{background:var(--bg-tertiary);border-bottom:1px solid var(--border);-webkit-overflow-scrolling:touch;scrollbar-width:none;flex-shrink:0;align-items:center;gap:6px;min-height:44px;padding:5px 12px;display:flex;overflow-x:auto}.practice-header-bar::-webkit-scrollbar{display:none}.practice-header-bar .essential-controls,.practice-header-bar .secondary-controls{flex-shrink:0;align-items:center;gap:6px;display:flex}.practice-header-bar .essential-controls>*{flex-shrink:0}.session-editor{border-top:1px solid var(--border);background:var(--bg-secondary)}.session-editor-header{background:var(--bg-tertiary);border-bottom:1px solid var(--border);cursor:pointer;-webkit-user-select:none;user-select:none;justify-content:space-between;align-items:center;padding:8px 12px;display:flex}.session-editor-title{align-items:center;gap:6px;font-size:14px;font-weight:600;display:flex}.toggle-btn{cursor:pointer;width:24px;height:24px;color:var(--text-secondary);background:0 0;border:none;justify-content:center;align-items:center;transition:transform .2s;display:flex}.toggle-icon{transition:transform .2s}.toggle-icon.expanded{transform:rotate(0)}.toggle-icon.collapsed{transform:rotate(-90deg)}.session-editor-content{padding:12px;animation:.2s slideDown}@keyframes slideDown{0%{opacity:0;max-height:0}to{opacity:1;max-height:500px}}.melody-library-section{margin-bottom:16px}.section-title{color:var(--text-secondary);margin:0 0 8px;font-size:13px;font-weight:600}.section-header{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.session-editor-timeline{margin-top:12px}.timeline-track{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:6px;width:100%;overflow-x:auto}.timeline-items{align-items:stretch;min-width:min-content;padding:8px;display:flex}.timeline-item{background:var(--bg-primary);border:1px solid var(--border);cursor:grab;border-radius:6px;flex-direction:column;min-width:140px;margin-right:8px;padding:10px 14px;transition:border-color .2s,box-shadow .2s;display:flex}.timeline-item:hover{border-color:var(--accent);box-shadow:0 2px 8px #0000001a}.timeline-item:active{cursor:grabbing}.item-header{align-items:center;gap:6px;margin-bottom:4px;display:flex}.item-type-icon{font-size:12px}.item-label{text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:13px;font-weight:500;overflow:hidden}.item-delete-btn{width:16px;height:16px;color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:3px;justify-content:center;align-items:center;font-size:14px;line-height:1;display:flex}.item-delete-btn:hover{background:var(--red);color:var(--bg-primary)}.item-details{color:var(--text-secondary);flex-direction:column;gap:2px;font-size:11px;display:flex}.item-start-beat{font-family:monospace}.timeline-drop-zone{cursor:pointer;border:1px dashed var(--border);background:var(--bg-tertiary);text-align:center;border-radius:6px;flex-direction:column;justify-content:center;align-items:center;width:24px;margin-right:8px;transition:border-color .2s,background .2s;display:flex}.timeline-drop-zone:hover{border-color:var(--accent);background:var(--accent-dim)}.rest-placeholder{color:var(--text-secondary);font-size:18px;line-height:1}.rest-hint{color:var(--text-secondary);margin-top:4px;font-size:10px}.timeline-footer{border-top:1px solid var(--border);color:var(--text-secondary);margin-top:12px;padding-top:8px;font-size:12px}.editor-view-toggle{background:var(--bg-tertiary);border-bottom:1px solid var(--border);align-items:center;gap:4px;padding:8px 12px;display:flex}.view-btn{border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;background:0 0;border-radius:4px;padding:6px 12px;font-size:13px;font-weight:500;transition:all .2s}.view-btn:hover{background:var(--bg-secondary);color:var(--text-primary)}.view-btn.active{background:var(--accent);border-color:var(--accent);color:var(--bg-primary)}.session-editor-container{min-height:400px}.melody-pill-list{border:1px solid var(--border);border-radius:6px;overflow:hidden}.pill-list-header{background:var(--bg-tertiary);border-bottom:1px solid var(--border);flex-wrap:wrap;align-items:center;gap:8px;padding:8px;display:flex}.search-input{background:var(--bg-primary);border:1px solid var(--border);min-width:150px;color:var(--text-primary);border-radius:4px;flex:1;padding:6px 10px;font-size:13px}.select-all-btn,.clear-selection-btn{border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;background:0 0;border-radius:4px;padding:6px 12px;font-size:12px;transition:all .2s}.select-all-btn:hover,.clear-selection-btn:hover{background:var(--bg-secondary);color:var(--text-primary)}.pill-list-items{max-height:300px;overflow-y:auto}.pill-list-items::-webkit-scrollbar{width:6px}.pill-list-items::-webkit-scrollbar-track{background:var(--bg-secondary)}.pill-list-items::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}.pill-list-items::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.melody-pill{cursor:grab;border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:8px;padding:8px 10px;transition:background .15s;display:flex}.melody-pill:last-child{border-bottom:none}.melody-pill:hover{background:var(--bg-secondary)}.melody-pill.selected{background:var(--accent-dim);border-color:var(--accent)}.pill-name{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;flex:1;font-size:13px;overflow:hidden}.pill-bpm{color:var(--text-secondary);background:var(--bg-tertiary);white-space:nowrap;border-radius:3px;padding:2px 6px;font-size:11px;font-weight:500}.empty-state{text-align:center;color:var(--text-secondary);padding:20px;font-size:13px}.save-btn,.load-btn{background:var(--accent);color:var(--bg-primary);cursor:pointer;border:none;border-radius:4px;padding:6px 12px;font-size:12px;font-weight:500;transition:background .2s}.save-btn:hover,.load-btn:hover{background:var(--accent)}.item-count{color:var(--text-secondary);font-size:13px}.editor-header-bar{background:var(--bg-tertiary);border-bottom:1px solid var(--border);-webkit-overflow-scrolling:touch;scrollbar-width:none;flex-shrink:0;align-items:center;gap:6px;min-height:44px;padding:5px 12px;display:flex;overflow-x:auto}.editor-header-bar::-webkit-scrollbar{display:none}.editor-header-bar .essential-controls,.editor-header-bar .secondary-controls,.practice-header-bar .essential-control-group,.editor-header-bar .essential-control-group{flex-shrink:0;align-items:center;gap:6px;display:flex}.practice-header-bar .secondary-control-group,.editor-header-bar .secondary-control-group{align-items:center;gap:6px;display:flex}.key-group,.scale-group{align-items:center;gap:4px;display:flex}.key-select,.scale-select{background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border);cursor:pointer;border-radius:4px;outline:none;min-width:75px;padding:3px 7px;font-size:.8rem}.key-select:focus,.scale-select:focus{border-color:var(--accent)}.mode-group{flex-shrink:0;gap:4px;display:flex}.cycles-input{background:var(--bg-secondary);width:52px;color:var(--text-primary);border:1px solid var(--border);border-radius:4px;padding:3px 6px;font-size:.8rem}#cycle-counter{color:var(--text-secondary);font-size:.8rem}.app-header-score{align-items:center;gap:6px;margin-left:4px;display:flex}.app-score-value{color:var(--green);font-size:.9rem;font-weight:700}.main-content{flex-direction:column;flex:1;min-width:0;height:100%;min-height:0;padding-bottom:40px;display:flex;overflow:auto}@media(max-height:768px){.main-content{padding-bottom:20px}.pitch-algorithm-tester,.pitch-testing-tab{margin-bottom:20px;padding-bottom:20px}}#notes-panel{background:var(--bg-secondary);border-right:1px solid var(--border);flex-direction:column;gap:10px;width:270px;min-width:270px;padding:14px;display:flex;overflow-y:auto}.panel-title{color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;font-size:.7rem;font-weight:600}#scale-info{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.key-label,.octave-label,.preset-label{color:var(--text-secondary);font-size:.78rem}#key-select,#preset-select{background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border);cursor:pointer;border-radius:5px;outline:none;padding:3px 7px;font-size:.8rem}#key-select:focus,#preset-select:focus{border-color:var(--accent)}.octave-ctrl{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:5px;align-items:center;gap:2px;padding:2px 3px;display:flex}.octave-btn{width:20px;height:20px;color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:3px;justify-content:center;align-items:center;padding:0;transition:all .12s;display:flex}.octave-btn:hover{background:var(--accent-dim);color:var(--accent)}.octave-btn:active{transform:scale(.88)}.octave-value{text-align:center;min-width:16px;color:var(--accent);padding:0 2px;font-size:.82rem;font-weight:700}#preset-select{max-width:140px}#share-preset{align-items:center;padding:6px 12px;display:flex}.share-btn{border:1px solid var(--green);color:var(--green);cursor:pointer;background:0 0;border-radius:5px;padding:5px 10px;font-size:.72rem;transition:all .12s}.share-btn:hover{background:var(--green);color:#fff}.ctrl-btn.small{padding:3px 8px;font-size:.75rem}.ctrl-btn.small span{font-size:.75rem}#note-list{flex-direction:column;flex:1;gap:3px;min-height:0;display:flex;overflow-y:auto}.note-item{background:var(--bg-tertiary);cursor:default;border:1px solid #0000;border-radius:6px;align-items:center;gap:8px;padding:6px 10px;transition:all .12s;display:flex}.note-dot{background:var(--text-muted);border-radius:50%;flex-shrink:0;width:8px;height:8px;transition:background .12s}.note-item.band-perfect{border-color:var(--green);background:#3fb95033;box-shadow:0 0 6px #3fb95066}.note-item.band-excellent{background:var(--accent-glow);border-color:var(--accent);box-shadow:0 0 6px var(--accent-glow)}.note-item.band-good{background:#2dd4bf33;border-color:#2dd4bf;box-shadow:0 0 6px #2dd4bf66}.note-item.band-okay{background:#d2992233;border-color:#d29922;box-shadow:0 0 6px #d2992266}.note-item.band-off{background:#f8514933;border-color:#f85149;box-shadow:0 0 6px #f8514966}.note-item.active{background:var(--accent-dim);border-color:var(--accent);box-shadow:0 0 12px var(--accent-glow)}.note-item.active .note-dot{background:var(--accent)}.note-item.hit{border-color:var(--green);box-shadow:0 0 12px var(--green-glow)}.note-item.hit .note-dot{background:var(--green)}.note-name{min-width:30px;font-size:.9rem;font-weight:600}.note-freq{color:var(--text-secondary);margin-left:auto;font-size:.7rem}.note-accuracy-pct{color:var(--text-primary);text-align:right;background:#ffffff1f;border-radius:4px;min-width:28px;margin-left:6px;padding:1px 5px;font-size:.75rem;font-weight:700}#pitch-reference{background:var(--bg-card);border:1px solid var(--border);text-align:center;border-radius:8px;flex-shrink:0;padding:10px}#pitch-reference h3{color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px;font-size:.68rem}#detected-note{color:var(--accent);font-size:1.8rem;font-weight:700;line-height:1.1}#detected-freq{color:var(--text-secondary);margin-bottom:6px;font-size:.78rem}#cents-display{margin-top:4px}#cents-bar{background:var(--bg-tertiary);border-radius:3px;height:6px;position:relative;overflow:visible}.cents-center{background:var(--text-muted);width:2px;height:10px;position:absolute;top:-2px;left:50%;transform:translate(-50%)}#cents-marker{background:var(--accent);width:12px;height:12px;box-shadow:0 0 6px var(--accent-glow);border-radius:50%;transition:left 60ms,background .12s;position:absolute;top:-3px;left:50%;transform:translate(-50%)}#cents-marker.sharp{background:var(--orange);box-shadow:0 0 6px #db6d2866}#cents-marker.flat{background:var(--yellow);box-shadow:0 0 6px #d2992266}#cents-marker.in-tune{background:var(--green);box-shadow:0 0 8px var(--green-glow)}.cents-labels{color:var(--text-muted);justify-content:space-between;margin-top:2px;font-size:.6rem;display:flex}#stats-panel{background:var(--bg-card);border:1px solid var(--border);border-radius:8px;flex-shrink:0;padding:10px}#stats-panel h3{color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px;font-size:.68rem}#stats-bars{flex-direction:column;gap:5px;display:flex}.stat-row{align-items:center;gap:6px;display:flex}.stat-label{color:var(--text-secondary);flex-shrink:0;width:68px;font-size:.7rem}.stat-bar-bg{background:var(--bg-tertiary);border-radius:3px;flex:1;height:5px;overflow:hidden}.stat-bar{border-radius:3px;width:0%;height:100%;transition:width .3s}.stat-row[data-band="100"] .stat-bar{background:var(--green)}.stat-row[data-band="90"] .stat-bar{background:var(--accent)}.stat-row[data-band="75"] .stat-bar{background:var(--teal)}.stat-row[data-band="50"] .stat-bar{background:var(--yellow)}.stat-row[data-band="0"] .stat-bar{background:var(--red)}.stat-count{text-align:right;min-width:16px;color:var(--text-secondary);font-size:.72rem;font-weight:600}#score-display{border-top:1px solid var(--border);justify-content:space-between;align-items:center;margin-top:8px;padding-top:8px;display:flex}#score-label{color:var(--text-muted);font-size:.72rem}#score-value{color:var(--text-primary);font-size:1.1rem;font-weight:700}#controls{background:var(--bg-secondary);border-bottom:1px solid var(--border);flex-wrap:wrap;flex-shrink:0;align-items:center;gap:6px;padding:10px 18px;display:flex}.ctrl-btn{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-primary);cursor:pointer;white-space:nowrap;border-radius:6px;flex-shrink:0;align-items:center;gap:5px;padding:6px 12px;font-size:.78rem;line-height:1;transition:all .12s;display:flex}.ctrl-btn:hover:not(:disabled){border-color:var(--accent);background:var(--accent-dim);color:var(--text-primary)}.mic-btn{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-primary);cursor:pointer;white-space:nowrap;border-radius:6px;align-items:center;gap:5px;padding:6px 12px;font-size:.78rem;line-height:1;transition:all .12s;display:flex}.mic-btn:hover:not(:disabled){border-color:var(--accent);background:var(--accent-dim)}.mic-btn:active:not(:disabled),.ctrl-btn:active:not(:disabled){transform:scale(.97)}.ctrl-btn:disabled{opacity:.35;cursor:not-allowed}.ctrl-btn.active{border-color:var(--green);color:var(--green);background:#3fb9501a}.ctrl-btn.recording{border-color:var(--red);color:var(--red);background:#f851494d;animation:.4s ease-in-out infinite pulse-rec;box-shadow:0 0 15px #f8514966}.record-text.recording{letter-spacing:1px;text-transform:uppercase;font-weight:700}.record-text{text-transform:uppercase;letter-spacing:.5px;margin-left:6px;font-size:14px;font-weight:700}.ctrl-btn.accent{border-color:var(--accent);background:var(--accent-dim);color:var(--accent)}.ctrl-btn.accent:hover{background:var(--accent);color:#fff}.ctrl-btn.metronome-btn{position:relative}.ctrl-btn.metronome-btn.active{border-color:var(--yellow);color:var(--yellow);background:#d299221a}.ctrl-btn.wave-btn.active{color:#d485f5;background:#d485f526;border-color:#d485f5}.ctrl-sep{background:var(--border);flex-shrink:0;width:1px;height:22px;margin:0 4px}#mode-group{gap:4px;display:flex}.mode-btn{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;border-radius:6px;flex-shrink:0;padding:6px 12px;font-size:.78rem;transition:all .15s}.mode-btn:hover{border-color:var(--accent);color:var(--text-primary)}.mode-btn.active{border-color:var(--accent);background:var(--accent-dim);color:var(--accent)}.practice-mode-badge{color:var(--accent);align-items:center;gap:6px;font-size:.75rem;display:flex}.practice-mode-badge .mode-label{color:var(--text-secondary)}.practice-mode-badge .mode-value{text-align:left;min-width:60px;font-weight:600}.save-melody-group{align-items:center;gap:6px;display:flex}.save-melody-btn{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--text-primary);cursor:pointer;white-space:nowrap;border-radius:6px;align-items:center;gap:6px;padding:4px 12px;font-size:.78rem;font-weight:500;transition:all .2s;display:flex}.save-melody-btn:hover:not(:disabled){border-color:var(--accent);background:var(--accent-dim);color:var(--accent)}.save-melody-btn:active:not(:disabled){transform:translateY(1px)}.save-melody-btn:disabled{opacity:.4;cursor:not-allowed}.save-melody-btn.with-label span{font-size:.78rem}#practice-options{align-items:center;gap:8px;display:flex}#practice-options .opt-label{color:var(--text-secondary);white-space:nowrap;font-size:.78rem}.cycles-input{background:var(--bg-tertiary);border:1px solid var(--border);width:52px;color:var(--text-primary);text-align:center;border-radius:4px;outline:none;padding:3px 6px;font-size:.8rem}.cycles-input:focus{border-color:var(--accent)}.tempo-group{align-items:center;gap:6px;display:flex}.tempo-group .opt-label{color:var(--text-secondary);font-size:.78rem}.bpm-number-input,.vol-number-input,.sens-number-input{text-align:center;border:1px solid var(--border);background:var(--bg-secondary);width:50px;color:var(--text-primary);-moz-appearance:textfield;border-radius:4px;outline:none;padding:2px 4px;font-size:.8rem}.sens-number-input{width:38px}.bpm-number-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.bpm-number-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.vol-number-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.vol-number-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.sens-number-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.sens-number-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.bpm-number-input:focus,.vol-number-input:focus,.sens-number-input:focus{border-color:var(--accent)}.tempo-slider{width:80px;accent-color:var(--accent)}#tempo-value{text-align:right;min-width:26px;color:var(--text-primary);font-weight:600}.sensitivity-group{align-items:center;gap:6px;display:flex}.sensitivity-group .opt-label{color:var(--text-secondary);font-size:.78rem}.sensitivity-slider{width:60px;accent-color:var(--yellow)}.inline-control.sensitivity-group .sensitivity-slider{width:80px}#sensitivity-value{text-align:right;min-width:20px;color:var(--yellow);font-weight:600}.theme-toggle-btn{border-radius:6px;padding:6px 10px;transition:all .2s}.theme-toggle-btn.dark{background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border)}.theme-toggle-btn.dark:hover{background:var(--accent-dim);color:var(--accent);border-color:var(--accent)}.theme-toggle-btn.light{background:var(--accent-dim);color:var(--accent);border:1px solid var(--accent)}.theme-toggle-btn.light:hover{background:var(--accent);color:#fff}.roll-snap-btn{background:var(--bg-tertiary);color:var(--text-secondary);border:1px solid var(--border);cursor:pointer;border-radius:4px;padding:4px 8px;font-size:.75rem;transition:all .15s}.roll-snap-btn:hover{color:var(--text-primary);border-color:var(--text-secondary)}.roll-snap-btn.active{background:var(--accent-dim);color:var(--accent);border-color:var(--accent)}.speed-group{align-items:center;gap:6px;display:flex}.speed-group .opt-label{color:var(--text-secondary);font-size:.78rem}.speed-select{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--text-primary);cursor:pointer;border-radius:4px;padding:4px 8px;font-size:.78rem}.speed-select:hover{border-color:var(--accent)}.speed-select option{color:var(--text-primary);background:#161b22}.preset-group{align-items:center;gap:6px;display:flex}.preset-group .opt-label{color:var(--text-secondary);font-size:.78rem}.preset-select{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--text-primary);cursor:pointer;border-radius:4px;padding:4px 8px;font-size:.78rem}.preset-select:hover{border-color:var(--accent)}.preset-select option{color:var(--text-primary);background:#161b22}.volume-group{align-items:center;gap:6px;display:flex}.volume-group .opt-label{color:var(--text-secondary);font-size:.78rem}.volume-slider{width:60px;accent-color:var(--green)}#volume-value{text-align:right;min-width:26px;color:var(--green);font-weight:600}#btn-precount{align-items:center;gap:4px;display:flex}#btn-precount svg{flex-shrink:0}#btn-precount.active{background:var(--accent);color:#fff}.hidden{display:none!important}.cycles-group{align-items:center;gap:6px;display:flex}.cycles-input{background:var(--bg-tertiary);border:1px solid var(--border);width:50px;color:var(--text-primary);text-align:center;border-radius:4px;padding:3px 6px;font-size:.78rem}.cycles-input::-webkit-inner-spin-button{width:14px}.cycles-input::-webkit-outer-spin-button{width:14px}.repeat-cycles-input{background:var(--bg-secondary);width:52px;color:var(--text-primary);border:1px solid var(--border);border-radius:4px;padding:3px 6px;font-size:.8rem}#cycle-counter{color:var(--text-muted)}.countin-badge{background:var(--accent-dim);border:1.5px solid var(--accent);width:32px;height:32px;color:var(--accent);-webkit-user-select:none;user-select:none;border-radius:50%;justify-content:center;align-items:center;margin:0 4px;font-size:.95rem;font-weight:700;line-height:1;animation:.25s ease-out countin-pulse;display:inline-flex;box-shadow:0 0 #0000}@keyframes countin-pulse{0%{opacity:.5;transform:scale(1.3)}to{opacity:1;transform:scale(1)}}#pitch-area{flex-direction:column;flex:1;min-width:0;display:flex;overflow:hidden}#canvas-container{background:var(--bg-primary);flex:1;min-height:100px;position:relative;overflow:hidden}#pitch-canvas{height:100%;display:block}#playhead{background:var(--accent);width:3px;height:100%;box-shadow:0 0 8px var(--accent-glow),0 0 16px var(--accent-glow);pointer-events:none;z-index:10;border-radius:2px;display:none;position:absolute;top:0;left:0}#playhead:after{content:"";background:var(--accent);clip-path:polygon(0 0,100% 0,50% 100%);border-radius:0 0 4px 4px;width:17px;height:9px;position:absolute;top:0;left:-7px}#playhead .playhead-marker{background:var(--accent-glow);border-radius:0 0 2px 2px;width:100%;height:50%;transition:left .1s linear;position:absolute;bottom:0;left:0}#history-container{background:var(--bg-secondary);border-top:1px solid var(--border);flex-shrink:0;height:90px}#history-canvas{width:100%;height:100%;display:block}.overlay{z-index:1000;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#0d111766;justify-content:center;align-items:flex-start;padding-top:12vh;display:flex;position:fixed;inset:0}#score-card,#session-summary-card{background:var(--bg-secondary);border:1px solid var(--border);text-align:center;border-radius:16px;min-width:300px;max-width:380px;padding:24px 32px;position:relative;box-shadow:0 12px 40px #0006}.overlay-close{width:28px;height:28px;color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;font-size:1.4rem;line-height:1;transition:all .12s;display:flex;position:absolute;top:12px;right:14px}.overlay-close:hover{background:var(--bg-tertiary);color:var(--text-secondary)}#score-title{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.1em;margin-bottom:12px;font-size:.9rem;font-weight:400}#score-grade{margin-bottom:16px;font-size:3rem;font-weight:800;line-height:1.1}#score-grade.grade-perfect{background:linear-gradient(135deg,var(--green),#7ee8a0);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}#score-grade.grade-excellent{background:linear-gradient(135deg,var(--accent),var(--purple));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}#score-grade.grade-good{background:linear-gradient(135deg,var(--teal),var(--accent));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}#score-grade.grade-okay{background:linear-gradient(135deg,var(--yellow),var(--orange));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}#score-grade.grade-needs-work{color:var(--red)}#score-pct{color:var(--text-primary);margin-bottom:6px;font-size:2.2rem;font-weight:700}#score-detail{color:var(--text-secondary);margin-bottom:20px;font-size:.82rem}#score-stats{background:var(--bg-tertiary);border-radius:8px;justify-content:center;gap:20px;margin-bottom:24px;padding:12px 16px;display:flex}.score-stat{text-align:center}.score-stat-value{font-size:1.4rem;font-weight:700}.score-stat-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:.65rem}.score-stat-perfect .score-stat-value{color:var(--green)}.score-stat-excellent .score-stat-value{color:var(--accent)}.score-stat-good .score-stat-value{color:var(--teal)}.score-stat-okay .score-stat-value{color:var(--yellow)}.score-stat-off .score-stat-value{color:var(--red)}#score-actions{justify-content:center;gap:10px;display:flex}.overlay-btn{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-primary);cursor:pointer;border-radius:8px;padding:10px 24px;font-size:.85rem;transition:all .15s}.overlay-btn:hover{border-color:var(--text-secondary)}.overlay-btn.primary{border-color:var(--accent);background:var(--accent-dim);color:var(--accent)}#score-history{border-top:1px solid var(--border);margin-top:20px;padding-top:16px}.history-title{color:var(--text-muted);text-align:center;margin-bottom:10px;font-size:.75rem}.history-chart{justify-content:center;align-items:flex-end;gap:4px;height:60px;display:flex}.history-bar{background:var(--accent);border-radius:3px 3px 0 0;width:16px;min-height:4px;transition:height .3s}.history-bar:first-child{background:var(--green)}.overlay-btn.primary:hover{background:var(--accent);color:#fff}@keyframes pulse-rec{0%,to{box-shadow:0 0 #f8514900}50%{box-shadow:0 0 10px #f8514940}}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}@media(max-width:768px){.main-layout{flex-direction:column}.app-sidebar{z-index:200;background:var(--bg-secondary);border-right:1px solid var(--border);border-bottom:none;flex-direction:column;width:270px;max-height:100vh;transition:transform .22s;position:fixed;top:0;bottom:0;left:0;overflow-y:auto;transform:translate(-100%)}.app-sidebar.open{transform:translate(0)}.app-sidebar>*{width:100%}.sidebar-toggle-btn{z-index:199;background:var(--bg-secondary);border:1px solid var(--border);cursor:pointer;color:var(--text-primary);border-radius:8px;align-items:center;gap:4px;min-width:44px;min-height:44px;padding:8px 10px;font-size:.8rem;position:fixed;top:8px;left:8px;box-shadow:0 2px 8px #0000004d;display:flex!important}.sidebar-toggle-btn:hover{background:var(--bg-tertiary)}.sidebar-backdrop{z-index:199;background:#0006;display:block;position:fixed;inset:0}.main-content{flex:1;min-height:0}#score-card{min-width:unset;margin:8px;padding:16px 12px}#history-container{height:50px}header{padding-left:56px}.app-header-bar{gap:4px}.practice-header-bar{-webkit-overflow-scrolling:touch;scrollbar-width:none;flex-flow:row;flex-shrink:1;gap:4px;padding:5px 8px;overflow:auto hidden}.practice-header-bar .essential-controls{flex-wrap:nowrap;flex-shrink:0}.practice-header-bar .control-group{flex-shrink:0;display:flex}.practice-header-bar::-webkit-scrollbar{display:none}.practice-header-bar .opt-label{font-size:.65rem}.practice-header-bar .ctrl-btn{min-width:44px;min-height:44px;padding:6px 8px;font-size:.72rem}.practice-header-bar .record-btn{min-width:auto}.mode-group{gap:2px}.mode-btn{min-height:44px;padding:6px 8px;font-size:.72rem}.cycles-input{width:44px;padding:2px 5px;font-size:.68rem}.practice-sub-mode-select{padding:2px 5px;font-size:.68rem}.countin-badge{width:30px;min-width:30px;height:30px;padding:0;font-size:.9rem}.tempo-group{flex-shrink:0}.tempo-slider{width:70px}#tempo-value{min-width:24px;font-size:.65rem}.countin-group{flex-shrink:0;align-items:center;gap:4px;display:flex}.countin-select{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-primary);border-radius:4px;padding:2px 5px;font-size:.68rem}.volume-group{flex-shrink:0}.volume-slider{width:60px}#volume-value{min-width:20px;font-size:.65rem}.speed-group{flex-shrink:0}.speed-select{padding:2px 5px;font-size:.68rem}.sensitivity-group{flex-shrink:0}.sensitivity-slider{width:60px}#sensitivity-value{min-width:14px;font-size:.65rem}.app-header-sep{display:none}#run-indicator{font-size:.7rem}#playhead:after{width:21px;height:11px;left:-9px}#pitch-reference{order:1}#note-list{order:2}}@media(max-width:480px){.app-sidebar{top:0}#history-container,.stats-panel,#note-list,.practice-header-bar .secondary-controls{display:none}.practice-header-bar .essential-controls{display:flex}.session-player{flex-wrap:wrap;gap:4px}.session-player-info{font-size:.72rem}header{flex-wrap:wrap;padding-left:50px}.header-left{flex:auto}.header-right{order:99;width:100%}.subtitle,.melody-indicator-pill{display:none}.countin-badge{width:28px;min-width:28px;height:28px;padding:0;font-size:.85rem}}@media(max-width:390px){.app-sidebar{top:0}header h1{font-size:1rem}.subtitle{display:none}.app-tab{gap:3px;padding:4px 8px;font-size:.7rem}.tab-icon{width:12px;height:12px}.tab-group-label{font-size:.58rem}.practice-header-bar{scrollbar-width:none;-webkit-overflow-scrolling:touch;flex-wrap:nowrap;flex-shrink:1;overflow:auto hidden}.practice-header-bar .essential-controls{flex-wrap:nowrap;flex-shrink:0}.practice-header-bar .control-group{flex-shrink:0;display:flex}.practice-header-bar::-webkit-scrollbar{display:none}.practice-header-bar .tempo-group,.practice-header-bar .countin-group,.practice-header-bar .volume-group,.practice-header-bar .speed-group,.practice-header-bar .sensitivity-group{display:none}.practice-header-bar .ctrl-btn{min-width:44px;min-height:44px;padding:6px 8px;font-size:.75rem}.practice-header-bar .record-btn{min-width:auto}.practice-header-bar .app-header-sep{display:none}.mode-group{gap:2px}.mode-btn{min-height:44px;padding:6px 8px;font-size:.72rem}#run-indicator{font-size:.65rem}.countin-badge{font-size:.75rem}}#editor-panel{background:var(--bg-primary);flex-direction:column;flex:1;min-width:0;display:flex;overflow:hidden}#editor-panel.editor-fullscreen{flex:1;width:100%}#piano-roll-container{-webkit-user-select:none;user-select:none;flex-direction:column;flex:1;min-height:0;display:flex;overflow:hidden}.piano-roll-wrapper{flex:1;min-height:0;display:flex;overflow:hidden}.piano-roll-container{flex:1;min-height:0;overflow:auto}#app-tabs{-webkit-overflow-scrolling:touch;scrollbar-width:thin;white-space:nowrap;flex-wrap:wrap;align-items:center;gap:6px;display:flex;overflow-x:auto}#app-tabs::-webkit-scrollbar{height:6px}#app-tabs::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}#app-tabs::-webkit-scrollbar-track{background:0 0}.tab-group{border:1px solid var(--border);background:var(--bg-secondary);border-radius:8px;align-items:center;gap:3px;padding:3px 4px;display:flex}.tab-group-label{text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);-webkit-user-select:none;user-select:none;padding:0 5px;font-size:.65rem}.app-tab{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;border-radius:6px;align-items:center;gap:5px;padding:5px 12px;font-size:.78rem;transition:all .15s;display:inline-flex}.app-tab:hover{border-color:var(--accent);color:var(--text-primary)}.app-tab.active{border-color:var(--accent);background:var(--accent-dim);color:var(--accent)}.tab-icon{opacity:.75;flex-shrink:0;width:14px;height:14px}.app-tab.active .tab-icon{opacity:1}.tab-badge{background:var(--accent);color:#fff;border-radius:9px;justify-content:center;align-items:center;min-width:18px;height:18px;margin-left:6px;padding:0 5px;font-size:.7rem;font-weight:600;line-height:1;display:inline-flex}.roll-toolbar{background:var(--bg-secondary);border-bottom:1px solid var(--border);flex-wrap:unset;-webkit-overflow-scrolling:touch;flex-shrink:0;grid-auto-columns:max-content;grid-auto-flow:column;align-items:stretch;gap:10px;max-width:100%;padding:8px 14px;display:grid;overflow-x:auto}.roll-group{background:var(--bg-secondary);grid-template-rows:repeat(3,auto);grid-auto-columns:max-content;grid-auto-flow:column;gap:5px;padding:8px;display:grid;position:relative}.roll-group:not(:last-child):after{content:"";width:1px;position:absolute;top:6px;bottom:6px;right:-6px}.roll-group-2col{grid-template-columns:repeat(2,max-content)}.roll-group>*{align-self:center}.roll-group:before{content:attr(data-name);color:var(--text-secondary);font-size:.62rem;font-weight:700;position:absolute;top:-7px;left:4px}.roll-durations,.roll-octave-group,.roll-octaves-group,.roll-bars-group,.roll-bars-btn,.roll-octave-btn,.roll-zoom-group,.roll-mode-group,.roll-instrument-group,.roll-effects-group,.roll-export-btn,.roll-export-group{align-items:center;gap:4px;display:flex}.roll-toolbar label{white-space:nowrap}.roll-group{box-shadow:inset 0 0 0 1px #ffffff05}.roll-tool-btn{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;border-radius:5px;align-items:center;gap:4px;padding:5px 10px;font-size:.72rem;transition:all .12s;display:flex}.roll-tool-btn:hover{border-color:var(--accent);color:var(--text-primary)}.roll-tool-btn.active{border-color:var(--accent);background:var(--accent-dim);color:var(--accent)}.roll-effects-label{color:var(--text-muted);margin-right:2px;font-size:.72rem}.roll-effect-btn{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;border-radius:5px;align-items:center;gap:2px;padding:5px 8px;font-size:.7rem;transition:all .12s;display:flex}.roll-effect-btn:hover{border-color:var(--accent);color:var(--text-primary)}.roll-effect-btn.active{border-color:var(--accent);background:var(--accent-dim);color:var(--accent)}.roll-effect-btn.slide-up,.roll-effect-btn.slide-down{border-left:2px solid #4ecdc4}.roll-effect-btn.ease-in,.roll-effect-btn.ease-out{border-left:2px solid #ffe66d}.roll-effect-btn.vibrato{border-left:2px solid #ff6b6b}.roll-octave-btn{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;border-radius:4px;min-width:36px;padding:4px 8px;font-size:.7rem;transition:all .12s}.roll-octave-btn:hover{border-color:var(--accent);color:var(--text-primary)}.roll-octave-value{color:var(--accent);text-align:center;min-width:20px;font-size:.72rem;font-weight:600}.roll-octaves-group{align-items:center;gap:3px;display:flex}.octaves-label{color:var(--text-secondary);margin-right:2px;font-size:.72rem}.octave-btn{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;border-radius:4px;min-width:24px;padding:3px 6px;font-size:.68rem;font-weight:600;transition:all .12s}.octave-btn:hover{border-color:var(--accent);color:var(--accent)}.roll-mode-group{align-items:center;gap:6px;display:flex}.mode-label{color:var(--text-secondary);font-size:.72rem}.roll-mode-select{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--text-primary);border-radius:5px;outline:none;max-width:140px;padding:4px 8px;font-size:.72rem}.roll-mode-select:focus{border-color:var(--accent)}.roll-custom-scale{background:var(--bg-secondary);border:1px solid var(--border);border-radius:5px;flex-wrap:wrap;gap:2px;max-width:200px;padding:4px;display:flex}.scale-note-btn{border:1px solid var(--border);background:var(--bg-tertiary);width:24px;height:24px;color:var(--text-secondary);cursor:pointer;border-radius:3px;justify-content:center;align-items:center;padding:0;font-size:.6rem;transition:all .1s;display:flex}.scale-note-btn:hover{border-color:var(--accent);color:var(--text-primary)}.scale-note-btn.active{background:var(--accent);border-color:var(--accent);color:#0d1117;font-weight:700}.scale-note-btn.black{color:var(--text-muted);background:#0000004d}.scale-note-btn.black:hover{color:var(--text-primary);background:#00000080}.scale-note-btn.black.active{background:var(--accent);color:#0d1117}.roll-share-btn{border:1px solid var(--green);background:var(--green-dim);color:var(--green);cursor:pointer;border-radius:5px;padding:5px 10px;font-size:.72rem;transition:all .12s}.roll-share-btn:hover{background:var(--green);color:#fff}.roll-effects-row{flex-shrink:0;align-items:center;gap:4px;display:flex}.roll-action-btn{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;white-space:nowrap;border-radius:5px;align-items:center;gap:3px;padding:4px 8px;font-size:.68rem;transition:all .12s;display:flex}.roll-action-btn:hover{border-color:var(--purple);color:var(--purple);background:#bc8cff14}.roll-action-btn:active{transform:scale(.96)}.roll-action-btn.slide-up:hover{border-color:var(--teal);color:var(--teal);background:#2dd4bf14}.roll-action-btn.slide-down:hover{border-color:var(--orange);color:var(--orange);background:#db6d2814}.roll-action-btn.ease-in:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-dim)}.roll-action-btn.ease-out:hover{border-color:var(--yellow);color:var(--yellow);background:#d2992214}.roll-action-btn.vibrato:hover{border-color:var(--purple);color:var(--purple);background:#bc8cff14}.instrument-label,.octave-label{color:var(--text-secondary);font-size:.72rem}.roll-instrument-group{align-items:center;gap:6px;display:flex}.roll-instrument-select{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--text-primary);border-radius:5px;outline:none;max-width:100px;padding:4px 8px;font-size:.72rem}.roll-instrument-select:focus{border-color:var(--accent)}.roll-bars-group{align-items:center;gap:4px;display:flex}.roll-bars-btn{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;border-radius:4px;min-width:36px;padding:4px 8px;font-size:.7rem;transition:all .12s}.roll-bars-btn:hover{border-color:var(--accent);color:var(--text-primary)}.roll-zoom-group{align-items:center;gap:4px;display:flex}.roll-zoom-btn{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;border-radius:4px;min-width:30px;padding:4px 8px;font-size:.7rem;transition:all .12s}.roll-zoom-btn:hover{border-color:var(--accent);color:var(--text-primary)}.label-toggle-group{align-items:center;display:inline-flex}.label-toggle-btn{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);white-space:nowrap;cursor:pointer;border-radius:6px;flex-shrink:0;align-items:center;gap:5px;padding:4px 10px;font-size:.75rem;line-height:1;transition:all .12s;display:inline-flex}.label-toggle-btn:hover{border-color:var(--accent);background:var(--accent-dim);color:var(--text-primary)}.label-toggle-btn:active{transform:scale(.97)}.label-toggle-btn.active{border-color:var(--green);color:var(--green);background:#3fb9501f}.label-toggle-text{letter-spacing:.02em;font-size:.72rem}@media(max-width:600px){.label-toggle-btn{padding:3px 8px}.label-toggle-text{display:none}}.roll-grid-toggle-btn{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;border-radius:4px;align-items:center;gap:4px;padding:4px 10px;font-size:.68rem;transition:all .12s;display:flex}.roll-grid-toggle-btn:hover{border-color:var(--accent);color:var(--text-primary)}.roll-grid-toggle-btn.active{border-color:var(--accent);background:var(--accent-dim);color:var(--accent)}.zoom-value{color:var(--text-secondary);text-align:center;min-width:40px;font-size:.7rem}.roll-durations{align-items:center;gap:4px;display:flex}.dur-label{color:var(--text-secondary);margin-right:2px;font-size:.72rem}.dur-btn{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;border-radius:4px;min-width:34px;padding:4px 8px;font-size:.7rem;transition:all .12s}.dur-btn:hover{border-color:var(--accent);color:var(--text-primary)}.dur-btn.active{border-color:var(--accent);background:var(--accent);color:#fff}.roll-ctrl-btn{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;border-radius:5px;padding:5px 10px;font-size:.72rem;transition:all .12s}.roll-ctrl-btn:hover{border-color:var(--accent);color:var(--text-primary)}.roll-ctrl-btn.danger:hover{border-color:var(--red);color:var(--red)}.roll-undo-group{align-items:center;gap:4px;display:flex}.roll-undo-btn,.roll-redo-btn{border:1px solid var(--border);background:var(--bg-tertiary);width:28px;height:28px;color:var(--text-secondary);cursor:pointer;border-radius:5px;justify-content:center;align-items:center;padding:0;transition:all .12s;display:flex}.roll-undo-btn:hover:not(:disabled),.roll-redo-btn:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}.roll-undo-btn:disabled,.roll-redo-btn:disabled{opacity:.35;cursor:not-allowed}.roll-selection-group{align-items:center;gap:4px;display:flex}.roll-delete-btn{border:1px solid var(--red);background:var(--bg-tertiary);color:var(--red);cursor:pointer;border-radius:5px;padding:5px 10px;font-size:.78rem;transition:all .12s}.roll-delete-btn:hover{background:var(--red);color:var(--bg-primary)}.roll-delete-btn:disabled{opacity:.35;cursor:not-allowed}.roll-clipboard-group{align-items:center;gap:4px;display:flex}.roll-clipboard-group .roll-ctrl-btn{background:var(--bg-tertiary);color:var(--text-secondary);border:1px solid var(--border);border-radius:4px;padding:4px 6px}.roll-clipboard-group .roll-ctrl-btn:hover{color:var(--text-primary);border-color:var(--text-secondary)}.roll-preset-group{align-items:center;gap:6px;display:flex}.roll-preset-select{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--text-primary);border-radius:5px;outline:none;max-width:140px;padding:4px 8px;font-size:.72rem}.roll-preset-select:focus{border-color:var(--accent)}.roll-preset-name{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--text-primary);border-radius:5px;outline:none;width:120px;padding:4px 8px;font-size:.72rem}.roll-preset-name:focus{border-color:var(--accent)}.roll-new-btn{border:1px solid var(--green);background:var(--green-dim);color:var(--green);cursor:pointer;border-radius:5px;min-width:30px;padding:5px 10px;font-size:.85rem;font-weight:700;transition:all .12s}.roll-new-btn:hover{background:var(--green);color:#fff}.roll-save-btn{border:1px solid var(--border);background:var(--accent-dim);color:var(--accent);cursor:pointer;border-radius:5px;padding:5px 10px;font-size:.72rem;transition:all .12s}.roll-save-btn:hover{background:var(--accent);color:#fff}.roll-play-group{gap:4px;display:flex}.roll-play-btn{border:1px solid var(--green);background:var(--green-dim);color:var(--green);cursor:pointer;border-radius:5px;align-items:center;gap:4px;padding:5px 12px;font-size:.72rem;transition:all .12s;display:flex}.roll-play-btn:hover{background:var(--green);color:#fff}.roll-reset-btn{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;border-radius:5px;align-items:center;gap:4px;padding:5px 10px;font-size:.72rem;transition:all .12s;display:flex}.roll-reset-btn:hover:not(:disabled){border-color:var(--red);color:var(--red)}.roll-reset-btn:disabled{opacity:.35;cursor:not-allowed}.roll-main-area{flex-direction:column;flex:1;min-height:0;display:flex;position:relative;overflow:hidden}.roll-grid-wrapper{grid-template-columns:var(--piano-width,62px) 1fr;grid-template-rows:var(--ruler-height,28px) 1fr;flex:1;min-height:0;display:grid;position:relative;overflow:hidden}.roll-ruler-container{background:var(--bg-secondary);border-bottom:1px solid var(--border);grid-area:1/1/auto/-1;position:relative;overflow:hidden}.roll-piano{background:var(--bg-secondary);border-right:1px solid var(--border);border-bottom:1px solid var(--border);z-index:1;grid-area:2/1;align-self:stretch;position:sticky;left:0}.roll-grid-container{background:var(--bg-primary);z-index:2;grid-area:2/2;position:relative;overflow:auto hidden}.roll-ruler{display:block;position:absolute;top:0;left:0}.roll-grid{display:block}.roll-status{background:var(--bg-secondary);border-top:1px solid var(--border);color:var(--text-secondary);flex-shrink:0;justify-content:space-between;padding:6px 14px;font-size:.7rem;display:flex}.roll-pitch-track-btn{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;border-radius:4px;flex-shrink:0;padding:5px 10px;font-size:.7rem;transition:all .12s}.roll-pitch-track-btn:hover{border-color:var(--accent);color:var(--text-primary)}.roll-pitch-track-btn.active{border-color:var(--accent);background:var(--accent-dim);color:var(--accent)}.roll-export-btn{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;border-radius:4px;flex-shrink:0;padding:5px 10px;font-size:.7rem;transition:all .12s}.roll-export-btn:hover{border-color:var(--accent);color:var(--text-primary)}.roll-export-btn:active{background:var(--accent);color:#fff}.roll-pitch-track{border-top:1px solid var(--border);background:#0d1117;width:100%;height:80px;display:block}@media(max-width:768px){.app-tab{gap:3px;padding:4px 8px;font-size:.7rem}.tab-icon{width:12px;height:12px}.tab-group-label{font-size:.58rem}.roll-toolbar{-webkit-overflow-scrolling:touch;scrollbar-width:none;grid-auto-columns:min-content;grid-auto-flow:column;gap:3px;width:100%;padding:6px 8px;display:grid;overflow:auto hidden}.roll-group,.roll-durations{min-width:max-content}.roll-toolbar::-webkit-scrollbar{display:none}.roll-tool-btn{padding:4px 7px;font-size:.68rem}.roll-tool-btn svg{width:12px;height:12px}.roll-durations{flex-shrink:0;gap:2px}.dur-label{font-size:.65rem}.dur-btn{padding:3px 5px;font-size:.65rem}.octave-label,.octaves-label{font-size:.65rem}.octave-btn{padding:3px 6px;font-size:.7rem}.octave-value{min-width:16px;font-size:.68rem}.roll-snap-btn{padding:3px 7px;font-size:.65rem}.mode-label{font-size:.65rem}.roll-mode-select{max-width:100px;padding:3px 6px;font-size:.68rem}.roll-custom-scale{max-width:160px}.scale-note-btn{width:20px;height:20px;font-size:.55rem}.roll-bars-btn,.roll-zoom-btn{padding:3px 6px;font-size:.65rem}.zoom-value{min-width:32px;font-size:.65rem}.roll-undo-btn,.roll-redo-btn,.roll-ctrl-btn{padding:4px 6px}.roll-ctrl-btn svg{width:12px;height:12px}.roll-effects-label{font-size:.65rem}.roll-action-btn{padding:3px 6px;font-size:.65rem}.roll-action-btn svg{width:12px;height:12px}.roll-preset-select{max-width:90px;font-size:.68rem}.roll-preset-name{width:80px;font-size:.68rem}.roll-sep{display:none}.roll-play-btn{padding:4px 10px;font-size:.72rem}.roll-reset-btn{padding:4px 8px;font-size:.68rem}.roll-instrument-select{max-width:90px;font-size:.68rem}.roll-grid-wrapper{grid-template-columns:44px 1fr}.roll-piano canvas{width:44px!important}.roll-ruler-container{height:24px}.roll-status{padding:4px 10px;font-size:.65rem}.roll-action-btn span{font-size:.6rem}.roll-pitch-track{height:60px}.roll-pitch-track-btn{padding:3px 8px;font-size:.65rem}}#settings-panel{background:var(--bg-primary);width:100%;height:100%;overflow-y:auto}.settings-panel{width:100%;height:100%;padding:20px;overflow-y:auto}.settings-content{max-width:600px;margin:0 auto}.settings-title{color:var(--text-primary);border-bottom:1px solid var(--border);margin:0 0 20px;padding-bottom:16px;font-size:1.2rem}.settings-section{margin-bottom:30px}.settings-section-title{color:var(--text-primary);text-transform:uppercase;letter-spacing:.06em;border-bottom:1px solid var(--border-color);margin:0;padding-bottom:12px;font-size:.9rem;font-weight:600}.settings-divider,.changelog-divider{background:linear-gradient(90deg,var(--border) 0%,var(--border) 60%,var(--accent) 60%,var(--accent) 100%);border-radius:2px;width:100%;height:4px;margin:16px 0}.settings-desc{color:var(--text-muted);margin:-8px 0 12px;font-size:.8rem}.keymap-table{flex-direction:column;gap:10px;margin-top:12px;display:flex}.keymap-row{color:var(--text-primary);justify-content:space-between;align-items:center;font-size:.8rem;display:flex}.keymap-action{flex:1}.keymap-row kbd{background:var(--bg-secondary);border:1px solid var(--border);min-width:28px;height:24px;color:var(--text-primary);border-radius:4px;justify-content:center;align-items:center;padding:0 8px;font-size:.72rem;font-weight:500;display:inline-flex;box-shadow:0 1px 2px #0000000d}.keymap-row kbd.ctrl-kbd{background:var(--bg-tertiary);color:var(--text-muted);font-size:.68rem}.keymap-row kbd+kbd{margin-left:4px}.tooltip-wrapper{align-items:center;display:inline-flex;position:relative}.tooltip{z-index:9000;background:var(--bg-inverse);color:var(--text-inverse);white-space:nowrap;pointer-events:none;border-radius:6px;padding:5px 10px;font-size:.72rem;line-height:1.4;position:absolute;box-shadow:0 2px 8px #0003}.tooltip-top{bottom:calc(100% + 6px);left:50%;transform:translate(-50%)}.tooltip-bottom{top:calc(100% + 6px);left:50%;transform:translate(-50%)}.tooltip-left{top:50%;right:calc(100% + 6px);transform:translateY(-50%)}.tooltip-right{top:50%;left:calc(100% + 6px);transform:translateY(-50%)}.keymap-table{border:1px solid var(--border);border-radius:8px;margin-top:8px;overflow:hidden}.keymap-row{border-bottom:1px solid var(--border);align-items:center;gap:16px;padding:8px 14px;display:flex}.keymap-row:last-child{border-bottom:none}.keymap-row.keymap-header{background:var(--bg-secondary);text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);padding:6px 14px;font-size:.72rem;font-weight:600}.keymap-row kbd{background:var(--bg-secondary);border:1px solid var(--border);min-width:52px;color:var(--text-primary);border-radius:5px;justify-content:center;align-items:center;padding:3px 8px;font-family:monospace;font-size:.75rem;display:inline-flex;box-shadow:0 1px 2px #00000026}.keymap-row span:last-child{color:var(--text-secondary);font-size:.82rem}.settings-row{flex-wrap:wrap;align-items:center;gap:12px;max-width:500px;margin-bottom:12px;display:flex}.settings-row label{width:auto;min-width:160px;color:var(--text-primary);cursor:default;align-items:center;padding:8px 0;font-size:.85rem;display:flex}.settings-row input[type=range]{min-width:120px;max-width:200px;accent-color:var(--accent);flex:1}.settings-row select{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-primary);cursor:pointer;border-radius:4px;flex:1;min-width:200px;max-width:280px;padding:8px 12px;font-size:.85rem}.settings-val{text-align:left;min-width:40px;color:var(--accent);font-size:.85rem}.settings-row small{width:100%;color:var(--text-muted);margin-top:2px;font-size:.72rem}.settings-toggle{cursor:pointer;flex-shrink:0;height:22px;display:inline-block;position:relative;width:42px!important}.settings-toggle input{opacity:0;width:0;height:0;position:absolute}.settings-slider{cursor:pointer;background-color:var(--bg-tertiary);border:1px solid var(--border);border-radius:22px;width:42px;transition:all .3s;position:absolute;inset:0}.settings-slider:before{content:"";background-color:var(--text-secondary);border-radius:50%;width:16px;height:16px;transition:all .3s;position:absolute;top:50%;bottom:auto;left:2px;transform:translateY(-50%)}input:checked+.settings-slider{background-color:var(--accent-dim);border-color:var(--accent)}input:checked+.settings-slider:before{background-color:var(--accent);transform:translate(20px,-50%)}.settings-row input[type=number]{background:var(--bg-tertiary);border:1px solid var(--border);width:60px;color:var(--text-primary);text-align:center;border-radius:4px;outline:none;padding:6px 8px;font-size:.85rem;transition:border-color .2s}.settings-row input[type=number]:focus{border-color:var(--accent)}.settings-row input[type=number]::-webkit-inner-spin-button{opacity:.7;filter:invert(65%)sepia(44%)saturate(711%)hue-rotate(179deg)brightness(96%)contrast(95%);cursor:pointer}.settings-row input[type=number]::-webkit-outer-spin-button{opacity:.7;filter:invert(65%)sepia(44%)saturate(711%)hue-rotate(179deg)brightness(96%)contrast(95%);cursor:pointer}.settings-info{background:var(--bg-secondary);color:var(--text-secondary);border-radius:6px;grid-template-columns:1fr 1fr;gap:8px;padding:12px;font-size:.85rem;display:grid}.settings-info span{color:var(--accent);font-weight:700}.settings-danger-zone{background:#ff3b3005;border:1px solid #ff3b304d;border-radius:8px;padding:16px}.danger-divider{background:linear-gradient(90deg,var(--border) 0%,var(--border) 60%,#ff3b3099 60%,#ff3b3099 100%)}.danger-row{justify-content:space-between;align-items:flex-start;gap:16px;margin-top:12px;display:flex}.danger-content{flex:1}.danger-label{color:#ff3b30;margin-bottom:4px;font-size:.85rem;font-weight:600;display:block}.danger-desc{color:var(--text-muted);font-size:.75rem;line-height:1.4;display:block}.danger-btn{color:#ff3b30;cursor:pointer;white-space:nowrap;background:#ff3b301a;border:1px solid #ff3b304d;border-radius:6px;padding:8px 16px;font-size:.85rem;font-weight:500;transition:all .2s}.danger-btn:hover{background:#ff3b3033;border-color:#ff3b3080}.danger-confirm-overlay{z-index:1000;background:#00000080;justify-content:center;align-items:center;width:100%;height:100%;padding:20px;display:flex;position:fixed;top:0;left:0}.danger-confirm-box{background:var(--bg-primary);border:1px solid var(--border);border-radius:12px;width:100%;max-width:400px;padding:24px;box-shadow:0 20px 40px #0000004d}.danger-confirm-title{color:var(--text-primary);margin:0 0 12px;font-size:1rem;font-weight:600}.danger-confirm-text{color:var(--text-muted);margin-bottom:20px;font-size:.85rem;line-height:1.5}.danger-confirm-actions{justify-content:flex-end;gap:12px;display:flex}.danger-btn-secondary{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-primary);cursor:pointer;border-radius:6px;padding:8px 16px;font-size:.85rem;font-weight:500;transition:all .2s}.danger-btn-secondary:hover{background:var(--bg-tertiary);border-color:var(--text-muted)}.danger-btn-primary{color:#fff;cursor:pointer;background:#ff3b30;border:1px solid #ff3b30;border-radius:6px;padding:8px 16px;font-size:.85rem;font-weight:500;transition:all .2s}.danger-btn-primary:hover{background:#e62e24;border-color:#e62e24}.about-content{text-align:center;flex-direction:column;align-items:center;gap:8px;padding:8px 16px 16px;display:flex}.about-logo{color:var(--accent);margin-bottom:4px}.about-name{color:var(--text-primary);margin:0;font-size:1.2rem;font-weight:700}.about-version{color:var(--text-muted);margin:0;font-size:.8rem}.about-desc{color:var(--text-secondary);max-width:340px;margin:0;font-size:.85rem;line-height:1.5}.about-features{flex-wrap:wrap;justify-content:center;gap:10px;font-size:.8rem;display:flex}.feature-pill{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--text-secondary);border-radius:16px;align-items:center;gap:8px;padding:6px 12px;transition:all .2s;display:flex}.feature-pill svg{flex-shrink:0}.feature-pill:hover{background:var(--bg-card);border-color:var(--accent-glow);color:var(--text-primary);transform:translateY(-1px)}.pill-detection svg{color:var(--accent)}.pill-editor svg{color:var(--purple)}.pill-progress svg{color:var(--green)}.pill-midi svg{color:var(--orange)}.pill-adsr svg{color:var(--teal)}.pill-reverb svg{color:var(--yellow)}.about-credits{color:var(--text-muted);margin:4px 0 0;font-size:.75rem}.about-links{justify-content:center;margin-top:12px;display:flex}.about-link{color:var(--accent);border:1px solid var(--accent);border-radius:4px;align-items:center;gap:6px;padding:6px 12px;font-size:.82rem;text-decoration:none;transition:background .2s,color .2s;display:inline-flex}.about-link:hover{background:var(--accent);color:#fff}.modal-overlay{z-index:1000;background:#000000b3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-content{background:var(--bg-card);border:1px solid var(--border);border-radius:8px;flex-direction:column;width:90%;max-width:480px;max-height:80vh;display:flex;overflow:hidden}.modal-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.modal-header h2{font-size:1.1rem;font-weight:600}.modal-close{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;padding:0 4px;font-size:1.5rem}.modal-close:hover{color:var(--text-primary)}.modal-body{flex:1;padding:20px;overflow-y:auto}.modal-footer{border-top:1px solid var(--border);justify-content:flex-end;gap:12px;padding:16px 20px;display:flex}.changelog-version{margin-bottom:24px}.changelog-version:last-child{margin-bottom:0}.changelog-version-header{align-items:baseline;gap:10px;margin-bottom:12px;display:flex}.changelog-version-tag{color:var(--text-primary);font-size:1rem;font-weight:700}.changelog-date{color:var(--text-muted);font-size:.8rem}.changelog-section{flex-direction:column;align-items:center;margin-bottom:10px;display:flex}.changelog-section:last-child{margin-bottom:0}.changelog-badge{text-transform:uppercase;letter-spacing:.5px;border-radius:4px;margin-bottom:4px;padding:2px 8px;font-size:.65rem;font-weight:600;display:inline-block}.badge-added{color:#2ea043;background:#2ea04326}.badge-changed{color:#388bfd;background:#388bfd26}.badge-fixed{color:#d4a72c;background:#d4a72c26}.changelog-entries{text-align:left;width:100%;margin:0;padding-left:14px;list-style:outside}.changelog-entry{color:var(--text-secondary);margin-bottom:2px;font-size:.82rem;line-height:1.45}.whats-new-btn{color:var(--accent);border:1px solid var(--accent);cursor:pointer;background:0 0;border-radius:6px;align-items:center;gap:6px;padding:5px 14px;font-size:.8rem;transition:background .2s,box-shadow .2s;display:inline-flex}.whats-new-btn:hover{background:var(--accent);color:var(--bg-primary);box-shadow:0 0 8px #6366f14d}.whats-new-btn:active{transform:scale(.97)}.scale-builder .scale-desc{color:var(--text-secondary);margin-bottom:16px;font-size:.85rem}.scale-notes-grid{grid-template-columns:repeat(6,1fr);gap:8px;margin-bottom:16px;display:grid}.scale-note-btn{border:1px solid var(--border);background:var(--bg-secondary);color:var(--text-primary);cursor:pointer;border-radius:6px;padding:12px 8px;font-size:.85rem;transition:all .15s}.scale-note-btn:hover{background:var(--bg-tertiary);border-color:var(--accent)}.scale-note-btn.active{background:var(--accent-dim);border-color:var(--accent);color:var(--accent)}.scale-note-btn.white-key{background:var(--bg-tertiary)}.scale-note-btn.black-key{background:var(--bg-secondary);color:var(--text-secondary)}.scale-note-btn.black-key.active{background:var(--accent-dim);color:var(--accent)}.scale-quick-actions{gap:8px;margin-bottom:16px;display:flex}.scale-quick-actions button{padding:6px 12px;font-size:.8rem}.scale-preview{background:var(--bg-secondary);border-radius:6px;margin-bottom:16px;padding:12px}.scale-preview h4{color:var(--text-secondary);margin-bottom:8px;font-size:.85rem}.scale-preview-notes{flex-wrap:wrap;gap:6px;display:flex}.preview-note{background:var(--accent-dim);color:var(--accent);border-radius:4px;padding:4px 10px;font-size:.85rem}.no-notes{color:var(--text-muted);font-size:.85rem;font-style:italic}.scale-name-row{align-items:center;gap:12px;margin-bottom:16px;display:flex}.scale-name-row label{color:var(--text-secondary);font-size:.85rem}.scale-name-input{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-primary);border-radius:4px;flex:1;padding:8px 12px;font-size:.85rem}.saved-scales{border-top:1px solid var(--border);padding-top:16px}.saved-scales h4{color:var(--text-secondary);margin-bottom:8px;font-size:.85rem}.saved-scales-list{flex-wrap:wrap;gap:8px;display:flex}.saved-scale-item{align-items:center;gap:4px;display:flex}.btn-small{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-primary);cursor:pointer;border-radius:4px;padding:4px 8px;font-size:.8rem}.btn-small:hover{background:var(--accent-dim);border-color:var(--accent)}.btn-delete{color:var(--red);cursor:pointer;background:0 0;border:none;padding:2px 4px;font-size:1rem}.btn-delete:hover{color:#ff6b6b}.btn-primary{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:6px;padding:8px 16px;font-size:.9rem}.btn-primary:hover{background:#4090e0}.btn-primary:disabled{background:var(--bg-tertiary);color:var(--text-muted);cursor:not-allowed}.btn-secondary{background:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border);cursor:pointer;border-radius:6px;padding:8px 16px;font-size:.9rem}.btn-secondary:hover{background:var(--bg-tertiary)}.btn-secondary:disabled{color:var(--text-muted);cursor:not-allowed}.session-browser{box-sizing:border-box;flex-direction:column;width:min(680px,95vw);max-height:85vh;padding:20px;display:flex}.session-browser .modal-header{margin-bottom:12px;padding:0 0 12px;position:relative}.session-browser .modal-close-btn{position:absolute;top:0;right:0}.session-browser .session-categories{margin:0 0 12px}.session-card{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:8px;flex-direction:column;gap:8px;margin-bottom:4px;padding:16px;display:flex}.modal-close-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;padding:4px;transition:all .12s;display:flex}.modal-close-btn:hover{color:var(--text-primary);background:var(--bg-tertiary)}.modal-close-btn svg{display:block}.session-categories{flex-wrap:wrap;gap:6px;margin:12px 0;display:flex}.session-cat-btn{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;border-radius:16px;padding:6px 14px;font-size:.78rem;transition:all .12s}.session-cat-btn.active{background:var(--accent);color:#fff;border-color:var(--accent)}.session-list{flex-direction:column;flex:1;gap:10px;padding-bottom:8px;display:flex;overflow-y:auto}.session-card{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:8px;flex-direction:column;gap:6px;padding:14px 16px;display:flex}.session-card-header{justify-content:space-between;align-items:center;display:flex}.session-name{color:var(--text-primary);font-size:.92rem;font-weight:600}.session-difficulty{text-transform:uppercase;letter-spacing:.04em;font-size:.72rem;font-weight:600}.session-description{color:var(--text-secondary);margin:0;font-size:.78rem;line-height:1.4}.session-meta{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.session-category-badge{background:var(--bg-secondary);color:var(--text-muted);text-transform:uppercase;letter-spacing:.03em;border-radius:10px;padding:2px 8px;font-size:.68rem}.session-item-count,.session-duration{color:var(--text-muted);font-size:.72rem}.session-start-btn{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:6px;align-self:flex-end;margin-top:4px;padding:6px 18px;font-size:.8rem;transition:background .12s}.session-start-btn:hover{background:#4e9eff}.session-player{background:linear-gradient(90deg,var(--accent-dim) 0%,var(--green-dim) 100%);border-top:1px solid var(--border);border-bottom:1px solid var(--border);flex-wrap:wrap;align-items:center;gap:12px;padding:8px 16px;display:flex}.session-player-header{align-items:center;gap:8px;display:flex}.session-player-title{color:var(--green);align-items:center;gap:5px;font-size:.82rem;font-weight:600;display:flex}.focus-mode{z-index:500;background:var(--bg-primary);flex-direction:column;display:flex;position:fixed;inset:0}.focus-topbar{background:var(--bg-secondary);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--border);flex-shrink:0;justify-content:space-between;align-items:center;gap:16px;min-height:48px;padding:10px 20px;display:flex}.focus-topbar-left{flex-shrink:0;align-items:center;gap:10px;display:flex}.focus-key-badge{color:var(--accent);background:var(--accent-dim);border:1px solid var(--accent-glow);white-space:nowrap;border-radius:20px;padding:3px 10px;font-size:.8rem;font-weight:600}.focus-session-badge{color:var(--text-secondary);background:var(--bg-tertiary);border:1px solid var(--border);white-space:nowrap;border-radius:20px;padding:3px 10px;font-size:.78rem}.focus-repeat-count{color:var(--accent)}.focus-topbar-center{flex:1;max-width:360px;margin:0 auto}.focus-progress-container{flex-direction:column;align-items:center;gap:4px;display:flex}.focus-progress-bar{background:var(--bg-secondary);border:1px solid var(--border);border-radius:3px;width:100%;height:6px;overflow:hidden}.focus-progress-fill{background:linear-gradient(90deg,var(--accent) 0%,var(--green) 100%);border-radius:3px;min-width:0;height:100%;transition:width .3s}.focus-progress-label{color:var(--text-muted);letter-spacing:.05em;font-size:.7rem}.focus-topbar-right{text-align:right;flex-shrink:0;min-width:60px}.focus-score{color:var(--accent);font-size:1.1rem;font-weight:700}.focus-score-unit{color:var(--text-muted);margin-left:2px;font-size:.65rem}.focus-canvas{flex:1;min-height:0;position:relative;overflow:hidden}.focus-playhead{background:var(--accent);width:3px;height:100%;box-shadow:0 0 8px var(--accent-glow),0 0 16px var(--accent-glow);pointer-events:none;z-index:10;border-radius:2px;display:none;position:absolute;top:0;left:0}.focus-playhead:after{content:"";background:var(--accent);clip-path:polygon(0 0,100% 0,50% 100%);border-radius:0 0 4px 4px;width:17px;height:9px;position:absolute;top:0;left:-7px}.focus-playhead .playhead-marker{background:var(--accent-glow);border-radius:0 0 2px 2px;width:100%;height:50%;transition:left .1s linear;position:absolute;bottom:0;left:0}.focus-pitch-dot{background:var(--accent);width:5px;height:5px;box-shadow:0 0 4px var(--accent-glow),0 0 8px var(--accent-glow),0 0 12px var(--accent-glow),0 0 16px var(--accent-glow);transform:translateY(calc(var(--pitch-position,50%) * -100%));border-radius:50%;animation:1.5s ease-in-out infinite pitch-dot-pulse;position:absolute;left:2px}@keyframes pitch-dot-pulse{0%,to{opacity:1;box-shadow:0 0 4px var(--accent-glow),0 0 8px var(--accent-glow),0 0 12px var(--accent-glow),0 0 16px var(--accent-glow)}50%{opacity:.7;box-shadow:0 0 6px var(--accent-glow),0 0 12px var(--accent-glow),0 0 18px var(--accent-glow),0 0 24px var(--accent-glow)}}.focus-history{border-bottom:1px solid var(--border);flex-shrink:0;height:56px}.focus-toolbar{background:var(--bg-secondary);border:1px solid var(--border);border-radius:40px;align-items:center;gap:12px;padding:10px 20px;display:flex;position:absolute;bottom:24px;left:50%;transform:translate(-50%);box-shadow:0 4px 24px #00000026}.focus-exit{color:var(--text-primary);cursor:pointer;opacity:.7;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;min-width:44px;min-height:44px;padding:6px 10px;font-size:1.2rem;transition:opacity .15s;display:flex}.focus-exit:hover{opacity:1}.focus-play{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;min-width:56px;min-height:56px;padding:8px 16px;font-size:1.2rem;transition:background .15s;display:flex}.focus-play:hover{filter:brightness(1.15)}.focus-play svg{width:24px;height:24px}.focus-info{color:var(--text-primary);text-align:center;min-width:60px;font-size:.9rem;font-weight:600}.focus-key-hint{color:var(--text-muted);text-align:center;font-size:.75rem}.focus-speed-controls{align-items:center;gap:6px;display:flex}.focus-speed-btn{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--text-primary);cursor:pointer;border-radius:6px;justify-content:center;align-items:center;padding:4px 8px;transition:background .15s;display:flex}.focus-speed-btn:hover:not(:disabled){background:var(--accent);color:#fff}.focus-speed-btn:disabled{opacity:.4;cursor:not-allowed}.focus-speed-label{color:var(--text-primary);text-align:center;min-width:48px;font-size:.85rem;font-weight:600}@media(max-width:480px){.focus-topbar{min-height:44px;padding:8px 12px}.focus-topbar-left{gap:6px}.focus-key-badge,.focus-session-badge{padding:2px 8px;font-size:.7rem}.focus-topbar-center{max-width:200px}.focus-progress-bar{height:5px}.focus-toolbar{gap:8px;padding:8px 16px;bottom:16px}}.session-player-progress{color:var(--text-secondary);font-size:.78rem}.session-player-item{align-items:center;gap:4px;display:flex}.session-item-icon{color:var(--text-muted)}.session-item-label{color:var(--text-primary);font-size:.78rem}.session-player-timer{margin-left:auto}.session-elapsed{color:var(--text-secondary);font-variant-numeric:tabular-nums;font-size:.82rem;font-weight:600}.session-player-controls{gap:6px;display:flex}#session-summary-card{text-align:center}#session-summary-card h2{color:var(--green);margin:0 0 4px;font-size:1.3rem;font-weight:700}#session-summary-name{color:var(--text-secondary);margin:0 0 16px;font-size:.92rem}#session-summary-score{color:var(--text-primary);margin-bottom:8px;font-size:3.5rem;font-weight:800;line-height:1}#session-summary-items{color:var(--text-muted);margin-bottom:20px;font-size:.82rem}#session-history-panel{border-top:1px solid var(--border);margin-top:10px;padding-top:8px}#session-history-panel h3{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin:0 0 5px;font-size:.72rem;font-weight:600}#session-history-list{flex-direction:column;gap:3px;display:flex}.session-history-entry{background:var(--bg-tertiary);border-radius:4px;justify-content:space-between;align-items:center;padding:3px 5px;font-size:.7rem;display:flex}.session-history-name{color:var(--text-secondary);white-space:nowrap;text-overflow:ellipsis;max-width:90px;overflow:hidden}.session-history-score{font-size:.7rem;font-weight:600}.session-history-score.score-high{color:var(--green)}.session-history-score.score-mid{color:var(--yellow)}.session-history-score.score-low{color:var(--red)}.welcome-overlay{z-index:9999;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0009;justify-content:center;align-items:center;animation:.3s welcome-fadein;display:flex;position:fixed;inset:0}@keyframes welcome-fadein{0%{opacity:0}to{opacity:1}}.welcome-card{background:var(--bg-secondary);border:1px solid var(--border);text-align:center;border-radius:14px;width:420px;max-width:92vw;max-height:90vh;padding:32px 36px 28px;animation:.35s cubic-bezier(.34,1.56,.64,1) welcome-slidein;position:relative;overflow-y:auto;box-shadow:0 20px 60px #0006}@keyframes welcome-slidein{0%{opacity:0;transform:translateY(20px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}.welcome-close{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:4px;transition:all .15s;display:flex;position:absolute;top:12px;right:12px}.welcome-close:hover{background:var(--bg-tertiary);color:var(--text-primary)}.welcome-hero{margin-bottom:24px}.welcome-icon{color:var(--accent);filter:drop-shadow(0 0 16px #58a6ff66);margin-bottom:12px}.welcome-title{color:var(--text-primary);letter-spacing:-.02em;margin:0 0 6px;font-size:1.5rem;font-weight:700}.welcome-subtitle{color:var(--text-muted);margin:0;font-size:.9rem}.welcome-mic-section{background:var(--bg-tertiary);border:1px solid var(--border);text-align:left;border-radius:10px;align-items:center;gap:12px;margin-bottom:20px;padding:14px 16px;display:flex}.welcome-mic-icon{background:var(--bg-secondary);width:36px;height:36px;color:var(--accent);border:1px solid var(--border);border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.welcome-mic-text{flex:1;min-width:0}.welcome-mic-text strong{color:var(--text-primary);margin-bottom:2px;font-size:.82rem;display:block}.welcome-mic-text p{color:var(--text-muted);margin:0;font-size:.75rem;line-height:1.3}.welcome-mic-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#58a6ffd9,#6482ffcc);border:1px solid #78beff59;border-radius:8px;flex-shrink:0;padding:8px 16px;font-size:.78rem;font-weight:600;transition:all .2s;box-shadow:0 2px 10px #58a6ff26}@media(hover:hover){.welcome-mic-btn:hover{background:linear-gradient(135deg,#64b4fff2,#7391ffe6);border-color:#8cc8ff80;transform:translateY(-1px);box-shadow:0 4px 16px #58a6ff40}}.welcome-mic-btn:active{transform:translateY(0);box-shadow:0 1px 6px #58a6ff26}.welcome-mic-success{color:var(--green);background:#22c55e1a;border-radius:6px;flex-shrink:0;align-items:center;gap:4px;padding:6px 12px;font-size:.78rem;font-weight:500;display:inline-flex}.welcome-mic-error{color:var(--red);background:#f851491a;border-radius:6px;flex-shrink:0;padding:6px 10px;font-size:.75rem}.welcome-features{text-align:left;flex-direction:column;gap:8px;margin-bottom:24px;display:flex}.welcome-feature{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:10px;align-items:center;gap:12px;padding:10px 14px;display:flex}.welcome-feature-icon{background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;display:flex}.welcome-feature-icon-practice{color:#58a6ff}.welcome-feature-icon-editor{color:#d2a8ff}.welcome-feature-icon-improve{color:#7ee787}.welcome-feature-text{text-align:left;flex:1}.welcome-feature-text strong{color:var(--text-primary);margin-bottom:1px;font-size:.82rem;display:block}.welcome-feature-text p{color:var(--text-muted);margin:0;font-size:.75rem;line-height:1.3}.welcome-actions{gap:10px;display:flex}.welcome-cta{color:#fff;cursor:pointer;background:linear-gradient(135deg,#58a6ffe6,#6482ffd9);border:1px solid #78beff66;border-radius:10px;flex:2;justify-content:center;align-items:center;gap:8px;padding:12px 20px;font-size:.92rem;font-weight:600;transition:all .2s;display:inline-flex;box-shadow:0 4px 16px #58a6ff33}@media(hover:hover){.welcome-cta:hover{background:linear-gradient(135deg,#64b4ff,#7391fff2);border-color:#8cc8ff99;transform:translateY(-1px);box-shadow:0 6px 24px #58a6ff4d}}.welcome-cta:active{transform:translateY(0);box-shadow:0 2px 10px #58a6ff33}.welcome-tour-btn{color:var(--text-secondary);cursor:pointer;background:#161b2280;border:1.5px solid #30363db3;border-radius:10px;flex:1;justify-content:center;align-items:center;gap:6px;padding:12px 16px;font-size:.85rem;font-weight:500;transition:all .2s;display:inline-flex}@media(hover:hover){.welcome-tour-btn:hover{color:var(--accent);background:#1e2630b3;border-color:#58a6ff66;transform:translateY(-1px);box-shadow:0 0 12px #58a6ff1a}}.welcome-tour-btn:active{transform:translateY(0)}.welcome-tier-select{background:linear-gradient(#161b2299,#0d111780);border:1px solid #30363d99;border-radius:12px;margin-top:20px;padding:14px 16px}.welcome-tier-label{color:var(--text-muted);text-align:center;margin:0 0 10px;font-size:.75rem}.welcome-tier-buttons{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.welcome-tier-btn{background:var(--bg-tertiary);border:1.5px solid var(--border);color:var(--text-secondary);cursor:pointer;border-radius:10px;flex-direction:column;align-items:center;gap:6px;padding:12px 8px 10px;font-size:.75rem;font-weight:500;transition:all .2s;display:flex}.tier-icon-wrap{background:var(--bg-card);border:1px solid var(--accent-dim);border-radius:10px;justify-content:center;align-items:center;width:38px;height:38px;transition:all .2s;display:flex}.tier-icon-wrap svg{opacity:.6;transition:opacity .2s}.welcome-tier-btn .tier-name{font-size:.78rem;font-weight:600;line-height:1.2}.welcome-tier-btn .tier-desc{color:var(--text-muted);opacity:.7;font-size:.65rem;line-height:1}@media(hover:hover){.welcome-tier-btn:hover{border-color:var(--accent-glow);background:var(--bg-card)}.welcome-tier-btn:hover .tier-icon-wrap{border-color:var(--accent-glow)}.welcome-tier-btn:hover .tier-icon-wrap svg{opacity:.85}}.welcome-tier-learning{border-color:#22c55e59}.welcome-tier-learning .tier-icon-wrap{background:#22c55e14;border-color:#22c55e33}.welcome-tier-learning .tier-icon-wrap svg{color:#22c55e}.welcome-tier-singer{border-color:#f59e0b59}.welcome-tier-singer .tier-icon-wrap{background:#f59e0b14;border-color:#f59e0b33}.welcome-tier-singer .tier-icon-wrap svg{color:#f59e0b}.welcome-tier-professional{border-color:#8b5cf659}.welcome-tier-professional .tier-icon-wrap{background:#8b5cf614;border-color:#8b5cf633}.welcome-tier-professional .tier-icon-wrap svg{color:#8b5cf6}.welcome-tier-btn.tier-active{color:var(--text-primary)}.welcome-tier-learning.tier-active{background:#22c55e1f;border-color:#22c55e;box-shadow:0 0 14px #22c55e26}.welcome-tier-learning.tier-active .tier-icon-wrap{background:#22c55e33;border-color:#22c55e80}.welcome-tier-learning.tier-active .tier-icon-wrap svg{opacity:1}.welcome-tier-singer.tier-active{background:#f59e0b1f;border-color:#f59e0b;box-shadow:0 0 14px #f59e0b26}.welcome-tier-singer.tier-active .tier-icon-wrap{background:#f59e0b33;border-color:#f59e0b80}.welcome-tier-singer.tier-active .tier-icon-wrap svg{opacity:1}.welcome-tier-professional.tier-active{background:#8b5cf61f;border-color:#8b5cf6;box-shadow:0 0 14px #8b5cf626}.welcome-tier-professional.tier-active .tier-icon-wrap{background:#8b5cf633;border-color:#8b5cf680}.welcome-tier-professional.tier-active .tier-icon-wrap svg{opacity:1}.walkthrough-overlay{z-index:9998;pointer-events:auto;position:fixed;inset:0}.walkthrough-highlight{pointer-events:none;z-index:9999;border:3px solid #6c63ff;border-radius:10px;transition:top .2s,left .2s,width .2s,height .2s;position:fixed;box-shadow:0 0 0 9999px #0000008c}.walkthrough-tooltip{background:var(--bg-secondary);border:1px solid var(--border);z-index:10000;width:340px;color:var(--text-primary);pointer-events:auto;border-radius:14px;padding:18px 22px;transition:left .2s,top .2s;position:fixed;box-shadow:0 8px 40px #00000059}.walkthrough-tooltip:after{content:"";border:8px solid #0000;width:0;height:0;position:absolute}.walkthrough-tooltip[data-placement=bottom]:after{border-bottom-color:var(--border);border-top:none;bottom:100%;left:50%;transform:translate(-50%)}.walkthrough-tooltip[data-placement=top]:after{border-top-color:var(--border);border-bottom:none;top:100%;left:50%;transform:translate(-50%)}.walkthrough-tooltip[data-placement=right]:after{border-right-color:var(--border);border-left:none;top:50%;right:100%;transform:translateY(-50%)}.walkthrough-tooltip[data-placement=left]:after{border-left-color:var(--border);border-right:none;top:50%;left:100%;transform:translateY(-50%)}.walkthrough-step-counter{color:var(--text-muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px;font-size:11px;font-weight:600}.walkthrough-step-title{color:var(--text-primary);margin:0 0 10px;font-size:16px;font-weight:700}.walkthrough-step-desc{color:var(--text-secondary);margin:0 0 18px;font-size:13px;line-height:1.6}.walkthrough-actions{align-items:center;gap:8px;display:flex}.walkthrough-skip{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:4px 8px;font-size:12px;text-decoration:underline}.walkthrough-skip:hover{color:var(--text-secondary)}.walkthrough-prev,.walkthrough-next{border:1px solid var(--border);cursor:pointer;background:var(--bg-tertiary);color:var(--text-primary);border-radius:8px;padding:7px 16px;font-size:13px;font-weight:500;transition:background .15s}.walkthrough-prev:hover{background:var(--bg-secondary)}.walkthrough-prev:disabled{opacity:.35;cursor:default;pointer-events:none}.walkthrough-next{color:#fff;background:#6c63ff;border-color:#6c63ff;margin-left:auto}.walkthrough-next:hover{background:#5850e0}.tour-btn{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;border-radius:8px;align-items:center;gap:7px;width:100%;margin-bottom:10px;padding:7px 12px;font-size:12px;font-weight:500;transition:background .15s;display:flex}.tour-btn:hover{background:var(--bg-secondary);color:var(--text-primary)}.library-modal{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;flex-direction:column;width:92%;max-width:960px;max-height:85vh;display:flex;box-shadow:0 20px 60px #00000080}.library-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.library-header h2{margin:0;font-size:1.2rem}.library-tabs{border-bottom:1px solid var(--border);gap:0;padding:0 20px;display:flex}.library-modal-tab{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;align-items:center;gap:8px;padding:10px 20px;font-size:.85rem;font-weight:500;transition:color .15s;display:flex;position:relative}.library-modal-tab:after{content:"";background:0 0;border-radius:2px 2px 0 0;height:2px;transition:background .15s;position:absolute;bottom:-1px;left:8px;right:8px}.library-modal-tab:hover{color:var(--text-primary)}.library-modal-tab.active{color:var(--accent);font-weight:600}.library-modal-tab.active:after{background:var(--accent)}.tab-count{background:var(--bg-tertiary);color:var(--text-muted);border-radius:10px;padding:1px 7px;font-size:.7rem;font-weight:600;line-height:1.4}.library-modal-tab.active .tab-count{background:var(--accent-dim);color:var(--accent)}.library-content{scroll-behavior:smooth;flex:1;min-height:200px;padding:20px;overflow-y:auto}.search-input{background:var(--bg-tertiary);border:1px solid var(--border);width:100%;color:var(--text-primary);border-radius:6px;outline:none;margin-bottom:12px;padding:10px 14px;font-size:.85rem}.new-btn{background:var(--accent-dim);border:1px solid var(--accent);width:100%;color:var(--accent);cursor:pointer;border-radius:6px;align-items:center;gap:8px;margin-bottom:16px;padding:10px 16px;font-size:.85rem;font-weight:600;transition:all .15s;display:flex}.new-btn:hover{background:var(--accent);color:#fff}.preset-list{flex-direction:column;flex:1;gap:10px;padding:4px;display:flex;overflow-y:auto}.preset-card{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:8px;flex-direction:column;gap:8px;padding:14px 16px;transition:all .15s;display:flex}.preset-card:hover{border-color:var(--accent);background:var(--bg-card)}.preset-card-header{justify-content:space-between;align-items:center;gap:10px;display:flex}.preset-name{color:var(--text-primary);font-size:.92rem;font-weight:600}.preset-difficulty{text-transform:uppercase;letter-spacing:.03em;border-radius:10px;padding:2px 8px;font-size:.7rem;font-weight:600}.preset-description{color:var(--text-secondary);margin:0;font-size:.78rem;line-height:1.4}.preset-meta{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.preset-category-badge{background:var(--bg-secondary);color:var(--text-muted);text-transform:uppercase;letter-spacing:.03em;border-radius:10px;padding:2px 8px;font-size:.68rem}.preset-item-count,.preset-duration{color:var(--text-muted);font-size:.72rem}.preset-start-btn{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:6px;align-self:flex-start;margin-top:4px;padding:8px 20px;font-size:.85rem;transition:background .15s}.preset-start-btn:hover{background:#4e9eff}.difficulty-badge{text-transform:uppercase;letter-spacing:.03em;border-radius:10px;padding:2px 8px;font-size:.68rem;font-weight:600}.difficulty-badge.beginner{color:var(--green);background:#3fb95026}.difficulty-badge.intermediate{color:var(--yellow);background:#d2992226}.difficulty-badge.advanced{color:var(--red);background:#f8514926}.close-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:4px;transition:all .15s;display:flex}.close-btn:hover{background:var(--bg-secondary);color:var(--text-primary)}.close-btn svg{display:block}.library-list{scrollbar-width:thin;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;max-height:50vh;padding:4px 4px 8px;display:grid;overflow-y:auto}.library-list::-webkit-scrollbar{width:8px}.library-list::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:8px}@media(max-width:900px){.library-list{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.library-list{grid-template-columns:1fr}}.library-item{background:var(--bg-tertiary);cursor:pointer;border:1px solid #0000;border-radius:8px;flex-direction:column;justify-content:space-between;gap:8px;min-width:0;padding:10px 12px;transition:all .15s;display:flex}.library-item .item-actions{flex-wrap:wrap;justify-content:flex-end;gap:4px;display:flex}.library-item:hover{border-color:var(--border);background:var(--bg-card)}.library-item.selected{border-color:var(--accent);background:var(--accent-dim)}.item-main{flex:1;min-width:0}.item-title{margin-bottom:2px;font-size:.9rem;font-weight:600}.item-author{color:var(--text-muted);margin-left:8px;font-size:.75rem}.item-meta{color:var(--text-muted);flex-wrap:wrap;align-items:center;gap:4px;font-size:.72rem;display:flex}.item-tags{flex-wrap:wrap;gap:4px;margin-top:4px;display:flex}.tag-pill{background:var(--accent-dim);color:var(--accent);border-radius:3px;padding:2px 6px;font-size:.6rem;font-weight:500;display:inline-block}.tag-pill.more{padding:2px 5px;font-size:.55rem}.tag-pills{flex-wrap:wrap;gap:4px;min-height:1.5rem;display:flex}.item-actions{gap:4px;margin-left:12px;display:flex}.action-btn{width:32px;height:32px;color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:0;transition:all .15s;display:flex}.action-btn:hover:not(:disabled){background:var(--bg-secondary);color:var(--text-primary)}.play-btn:hover{color:var(--accent)}.load-btn:hover{color:var(--green)}.edit-btn:hover{color:var(--purple)}.delete-btn:hover{color:var(--red)}.delete-btn:disabled,.play-btn:disabled,.load-btn:disabled,.edit-btn:disabled{opacity:.35;cursor:not-allowed}.empty-state{text-align:center;color:var(--text-muted);padding:40px 20px}.empty-state p{margin:0;font-size:.9rem}.melody-details{background:var(--bg-secondary);border-top:1px solid var(--border);border-radius:8px;margin-top:20px;padding:16px}.melody-details h3{margin:0 0 12px;font-size:.9rem;font-weight:600}.details-list{grid-template-columns:80px 1fr;gap:6px 12px;font-size:.8rem;display:grid}.details-list dt{color:var(--text-muted);grid-column:1}.details-list dd{color:var(--text-primary);grid-column:2;font-weight:500}.playlist-list{flex-direction:column;gap:8px;display:flex}.playlist-item{background:var(--bg-tertiary);border-radius:6px;justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.playlist-info{flex:1;align-items:center;gap:12px;display:flex}.playlist-name{font-size:.9rem;font-weight:600}.playlist-count{color:var(--text-muted);font-size:.72rem}.playlist-item.drag-over{border:2px dashed var(--accent);background:var(--bg-secondary)}.playlist-item.drag-over .playlist-name{color:var(--accent);font-weight:700}.edit-melody-form{background:var(--bg-secondary);border-radius:8px;margin-bottom:12px;padding:16px}.edit-melody-form h3{margin:0 0 12px;font-size:.95rem;font-weight:600}.create-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.big-create-btn{background:var(--accent);width:44px;height:44px;color:var(--bg-primary);cursor:pointer;border:none;border-radius:8px;justify-content:center;align-items:center;gap:4px;font-size:1.2rem;transition:opacity .2s;display:flex}.big-create-btn:hover{opacity:.9}.big-create-btn:active{transform:scale(.95)}.form-row{grid-template-columns:repeat(3,1fr);gap:12px;display:grid}.form-group:last-child{margin-bottom:0}.form-group input,.form-group select{border:1px solid var(--border);background:var(--bg-primary);width:100%;color:var(--text-primary);border-radius:6px;padding:8px 10px;font-size:.85rem;transition:border-color .15s}.form-group input:focus,.form-group select:focus{border-color:var(--accent);outline:none}.form-group input[type=number]{-moz-appearance:textfield}.form-group input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.form-group input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.form-group input::placeholder{color:var(--text-muted)}.form-group textarea{border:1px solid var(--border);background:var(--bg-primary);width:100%;color:var(--text-primary);resize:vertical;border-radius:6px;min-height:60px;padding:8px 10px;font-family:inherit;font-size:.85rem}.form-group textarea:focus{border-color:var(--accent);outline:none}.cancel-btn,.save-btn{cursor:pointer;border:none;border-radius:6px;flex:1;padding:8px 16px;font-size:.85rem;font-weight:500;transition:all .15s}.cancel-btn{background:var(--bg-tertiary);color:var(--text-secondary)}.cancel-btn:hover{background:var(--border);color:var(--text-primary)}.save-btn{background:var(--accent);color:var(--text-inverse)}.save-btn:hover{filter:brightness(1.1)}.edit-session-form{padding:20px}.edit-session-form h3{margin:0 0 16px;font-size:1.1rem;font-weight:600}.form-group{margin-bottom:16px}.form-group label{color:var(--text-secondary);margin-bottom:6px;font-size:.85rem;display:block}.form-group input,.form-group select{background:var(--bg-tertiary);border:1px solid var(--border);width:100%;color:var(--text-primary);border-radius:6px;outline:none;padding:10px 12px;font-size:.9rem}.form-group input:focus,.form-group select:focus{border-color:var(--accent)}.form-actions{gap:8px;margin-top:20px;display:flex}.cancel-btn{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--text-primary);cursor:pointer;border-radius:6px;padding:10px 20px}.cancel-btn:hover{background:var(--bg-secondary)}.save-btn{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:6px;padding:10px 20px}.save-btn:hover{background:#4090e0}.tab-header{flex-direction:column;gap:8px;display:flex}.tab-header h3{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.08em;margin:0;font-size:.85rem;font-weight:600}.tab-actions{gap:4px;display:flex}.tab-action-btn{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;border-radius:4px;align-items:center;gap:6px;padding:8px 12px;font-size:.75rem;transition:all .15s;display:flex}@media(hover:hover){.tab-action-btn:hover{background:var(--accent-dim);border-color:var(--accent);color:var(--accent)}}.recent-section{flex-direction:column;gap:6px;display:flex}.empty-tip{color:var(--text-muted);text-align:center;padding:12px;font-size:.75rem;font-style:italic}.quick-actions{flex-direction:column;gap:6px;display:flex}.quick-action-btn{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;border-radius:4px;align-items:center;gap:6px;padding:10px 12px;font-size:.75rem;transition:all .15s;display:flex}@media(hover:hover){.quick-action-btn:hover{background:var(--accent-dim);border-color:var(--accent);color:var(--accent)}}.library-tab{border:1px solid var(--accent-dim);background:linear-gradient(180deg,var(--bg-secondary),var(--bg-primary));border-radius:14px;flex-direction:column;gap:10px;padding:10px;display:flex}.tab-header{justify-content:space-between;align-items:center;display:flex}.tab-header h3{color:var(--text-muted);text-transform:uppercase;margin:0;font-size:.8rem;font-weight:600}.session-items-section{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:10px;flex-direction:column;gap:6px;padding:8px;display:flex}[data-theme=light] .library-tab{border-color:var(--accent-dim);background:linear-gradient(#ffffffd9,#f6f8fabf)}[data-theme=light] .session-items-section{background:#f6f8fa99;border-color:#d0d7de80}.session-items-display{flex-direction:column;gap:8px;display:flex}.session-items-display h3{color:var(--text-muted);text-transform:uppercase;margin:0;padding:0 2px;font-size:.7rem;font-weight:600}.session-item-entry{background:var(--bg-secondary);border-radius:4px;justify-content:space-between;align-items:center;gap:6px;padding:4px 8px;font-size:.75rem;display:flex}.session-item-label{white-space:nowrap;text-overflow:ellipsis;flex:1;overflow:hidden}.session-item-type{align-items:center;font-size:.7rem;display:flex}.session-empty-tip{color:var(--text-muted);text-align:center;padding:8px;font-size:.7rem;font-style:italic}.session-header{justify-content:space-between;align-items:center;gap:4px;display:flex}.active-session-summary{flex-direction:column;flex:1;gap:5px;min-width:0;display:flex}.active-session-summary .section-label{letter-spacing:.06em;text-transform:uppercase;font-weight:600}.sidebar-session-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--bg-card);background-image:linear-gradient(45deg,transparent 50%,var(--text-muted) 50%),linear-gradient(135deg,var(--text-muted) 50%,transparent 50%);border:1px solid var(--border);width:100%;min-width:0;color:var(--text-primary);cursor:pointer;background-position:calc(100% - 16px),calc(100% - 11px);background-repeat:no-repeat;background-size:5px 5px,5px 5px;border-radius:6px;padding:7px 30px 7px 10px;font-size:.75rem;font-weight:500;line-height:1.2;transition:border-color .15s,background-color .15s,box-shadow .15s}.sidebar-session-select:hover{background-color:var(--bg-secondary);border-color:var(--accent)}.sidebar-session-select:focus{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-dim);outline:none}.sidebar-session-select option{background:var(--bg-secondary);color:var(--text-primary)}.section-meta{color:var(--text-muted);font-size:.65rem}.session-actions{flex-shrink:0;align-self:flex-start;gap:4px;display:flex}.pill-action-btn{background:var(--accent-dim);border:1px solid var(--border);color:var(--accent);cursor:pointer;border-radius:4px;padding:2px 6px;font-size:.6rem;transition:all .15s}@media(hover:hover){.pill-action-btn:hover{background:var(--accent);color:var(--bg-primary)}}.session-items-pills{flex-wrap:wrap;gap:4px;display:flex}.session-item-pill{background:var(--bg-card);border:1px solid var(--border);color:var(--text-secondary);border-radius:12px;align-items:center;gap:4px;padding:4px 8px;font-size:.65rem;transition:all .15s;display:flex}.session-item-pill.active{background:var(--accent-dim);border-color:var(--accent);color:var(--accent)}.melody-pill{cursor:pointer}@media(hover:hover){.melody-pill:hover{background:var(--bg-tertiary);border-color:var(--green)}}.melody-pill.selected{background:var(--green-dim);border-color:var(--green);color:var(--green)}.pill-tags{flex-wrap:wrap;gap:2px;margin-left:4px;display:flex}.pill-tag{background:var(--accent-dim);color:var(--accent);border-radius:3px;padding:1px 4px;font-size:.55rem;font-weight:500}.pill-tag.more{padding:1px 3px;font-size:.5rem}.pill-icon{font-size:.7rem}.pill-label{text-overflow:ellipsis;white-space:nowrap;max-width:60px;overflow:hidden}.pill-repeat{color:var(--text-muted);background:var(--bg-tertiary);border-radius:8px;padding:1px 4px;font-size:.6rem}.tab-stats{gap:8px;display:flex}.stat-badge{background:var(--bg-tertiary);color:var(--text-secondary);border-radius:10px;padding:2px 8px;font-size:.7rem}.recent-list{flex-direction:column;gap:6px;display:flex}.section-label{color:var(--text-muted);margin:0;font-size:.7rem}.empty-tip{color:var(--text-muted);text-align:center;font-size:.8rem;font-style:italic}.recent-item{background:var(--bg-tertiary);cursor:pointer;border-radius:4px;justify-content:space-between;align-items:center;padding:8px 12px;transition:background .15s;display:flex}.recent-item:hover{background:var(--bg-card)}.recent-name{font-size:.85rem;font-weight:500}.recent-meta{color:var(--text-muted);font-size:.72rem}.recent-tags{flex-wrap:wrap;gap:4px;margin-top:4px;display:flex}.recent-tag{background:var(--accent-dim);color:var(--accent);border-radius:2px;padding:1px 5px;font-size:.55rem;font-weight:500}.recent-tag.more{padding:1px 4px;font-size:.5rem}.library-tab-btn{background:var(--bg-tertiary);border:1px solid var(--border);width:100%;color:var(--text-primary);cursor:pointer;border-radius:6px;align-items:center;gap:8px;padding:10px 12px;font-size:.85rem;transition:all .15s;display:flex}.library-tab-btn:hover{border-color:var(--accent);background:var(--bg-card)}.notification-toast{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-primary);z-index:2000;border-radius:8px;align-items:center;gap:12px;max-width:350px;padding:12px 16px;font-size:.85rem;animation:.3s slideIn,.3s 2.7s forwards fadeOut;display:flex;position:fixed;bottom:20px;right:20px;box-shadow:0 4px 12px #0000004d}.notification-toast--info{border-left:4px solid var(--accent)}.notification-toast--success{border-left:4px solid var(--green)}.notification-toast--warning{border-left:4px solid var(--yellow)}.notification-toast--error{border-left:4px solid var(--red)}.notification-toast-icon{align-items:center;font-size:1.1rem;font-weight:700;display:flex}.notification-toast--info .notification-toast-icon{color:var(--accent)}.notification-toast--success .notification-toast-icon{color:var(--green)}.notification-toast--warning .notification-toast-icon{color:var(--yellow)}.notification-toast--error .notification-toast-icon{color:var(--red)}.notification-toast-message{flex:1}@keyframes slideIn{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.walkthrough-control-group{justify-content:center;gap:6px;display:flex}.walkthrough-control-btn{background:var(--surface);border:1px solid var(--border);color:var(--text-primary);cursor:pointer;white-space:nowrap;border-radius:6px;align-items:center;gap:6px;height:32px;padding:6px 12px;font-size:.85rem;font-weight:500;line-height:32px;transition:all .2s;display:flex}.walkthrough-control-btn:hover{background:var(--bg-card);border-color:var(--accent);color:var(--accent)}.walkthrough-control-btn:active{transform:scale(.98)}.walkthrough-control-text{font-size:.85rem}.walkthrough-control-btn-guide{background:var(--surface-dim,var(--surface));border-color:var(--border-muted,var(--border));opacity:.85}.walkthrough-control-btn-guide:hover{opacity:1;border-color:var(--accent);color:var(--accent)}.walkthrough-selection-overlay{z-index:9999;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0009;justify-content:center;align-items:center;animation:.25s welcome-fadein;display:flex;position:fixed;inset:0}.walkthrough-selection-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:14px;flex-direction:column;width:400px;max-width:92vw;max-height:85vh;animation:.3s cubic-bezier(.34,1.56,.64,1) welcome-slidein;display:flex;overflow-y:auto;box-shadow:0 20px 60px #0006}.ws-header{flex-shrink:0;justify-content:space-between;align-items:center;padding:20px 24px 16px;display:flex}.ws-header-left{align-items:center;gap:10px;display:flex}.ws-header-icon{color:var(--accent)}.ws-title{color:var(--text-primary);letter-spacing:-.01em;margin:0;font-size:1.2rem;font-weight:700}.ws-close-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:6px;align-items:center;padding:4px;transition:all .15s;display:flex}.ws-close-btn:hover{background:var(--bg-tertiary);color:var(--text-primary)}.ws-progress{flex-shrink:0;padding:0 24px 16px}.ws-progress-bar{background:var(--bg-tertiary);border-radius:2px;width:100%;height:4px;margin-bottom:6px;overflow:hidden}.ws-progress-fill{background:var(--accent);border-radius:2px;height:100%;transition:width .3s}.ws-progress-text{color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;font-size:.72rem;font-weight:500}.ws-chapters{flex-direction:column;flex:1;gap:6px;padding:0 16px 16px;display:flex;overflow-y:auto}.ws-chapter-item{background:var(--bg-tertiary);border:1px solid var(--border);text-align:left;cursor:pointer;width:100%;color:var(--text-primary);border-radius:10px;align-items:center;gap:12px;padding:12px 14px;font-size:.88rem;transition:all .15s;display:flex}.ws-chapter-item:hover{border-color:var(--accent);background:var(--bg-secondary)}.ws-chapter-icon{background:var(--bg-secondary);width:28px;height:28px;color:var(--text-muted);border:1px solid var(--border);border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.ws-chapter-icon-done{color:var(--green);border-color:var(--green);background:#22c55e14}.ws-chapter-title{flex:1;font-size:.85rem;font-weight:500}.ws-chapter-tab{color:var(--text-muted);background:var(--bg-secondary);text-transform:capitalize;letter-spacing:.04em;border:1px solid var(--border);border-radius:4px;padding:2px 8px;font-size:.68rem;font-weight:600}.ws-chapter-done{opacity:.6}.ws-chapter-done:hover{opacity:1}.ws-completed{border-top:1px solid var(--border);flex-direction:column;gap:6px;margin-top:8px;padding-top:12px;display:flex}.ws-footer{border-top:1px solid var(--border);flex-shrink:0;padding:16px 24px}.ws-close-footer{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:10px;width:100%;padding:10px 16px;font-size:.88rem;font-weight:600;transition:all .15s}.ws-close-footer:hover{background:var(--accent)}.walkthrough-backdrop{z-index:10000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#000000b3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.walkthrough-modal{background:var(--bg-primary);width:95vw;max-width:680px;border-radius:12px;flex-direction:column;max-width:min(680px,95vw);max-height:85vh;display:flex;overflow:hidden;box-shadow:0 20px 60px #0006}.walkthrough-content{flex-direction:column;max-height:100%;display:flex;overflow:hidden}.walkthrough-header{border-bottom:1px solid var(--border);text-align:center;padding:20px 24px}.walkthrough-title{margin:0 0 8px;font-size:1.5rem;font-weight:600}.walkthrough-subtitle{color:var(--text-secondary);margin:0;font-size:.95rem}.walkthrough-tabs{border-bottom:1px solid var(--border);background:var(--bg-primary);border-radius:12px 12px 0 0;gap:4px;padding:12px 24px 0;display:flex}.walkthrough-tab{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:6px;padding:10px 20px;font-weight:500;transition:all .2s}.walkthrough-tab:hover{background:var(--bg-primary);color:var(--text-primary)}.walkthrough-tab.active{color:var(--accent);background:var(--bg-primary)}.walkthrough-list{flex:1;padding:24px;overflow-y:auto}.walkthrough-item{background:var(--bg-primary);border:1px solid var(--border);cursor:pointer;text-align:left;border-radius:8px;justify-content:flex-start;align-items:center;gap:16px;width:100%;margin-bottom:12px;padding:16px;transition:all .2s;display:flex}.walkthrough-item:hover{border-color:var(--accent);transform:translateY(-2px)}.walkthrough-item.completed{opacity:.75;border-color:var(--green);background:var(--green-dim);position:relative}.walkthrough-item.completed:before{content:"✓";color:var(--green);background:var(--green-dim);border-radius:50%;justify-content:center;align-items:center;width:20px;height:20px;font-size:1rem;font-weight:700;display:flex;position:absolute;top:8px;right:8px}.walkthrough-item.completed .walkthrough-item-title{padding-right:28px;position:relative}.walkthrough-item.completed .walkthrough-item-title:after{content:" - Completed";color:var(--green);font-size:.85rem;font-weight:500}.walkthrough-thumbnail{flex-shrink:0;font-size:2rem}.walkthrough-item-content{text-align:left;flex:1;min-width:0}.walkthrough-item-title{margin:0 0 6px;font-size:1rem;font-weight:500;line-height:1.4}.walkthrough-item-desc{color:var(--text-secondary);margin:0;font-size:.9rem;line-height:1.4}.walkthrough-status{color:#22c55e;background:#22c55e26;border:1px solid #22c55e4d;border-radius:20px;align-items:center;gap:6px;padding:6px 12px;font-size:.9rem;font-weight:500;display:inline-flex}.walkthrough-footer{border-top:1px solid var(--border);background:var(--bg-primary);border-radius:0 0 12px 12px;justify-content:flex-end;gap:12px;padding:16px 24px;display:flex}.walkthrough-close-btn{background:var(--text-primary);color:#fff;cursor:pointer;border:none;border-radius:6px;padding:10px 20px;font-weight:500;transition:all .2s}.walkthrough-close-btn:hover{background:var(--accent)}.walkthrough-body{overscroll-behavior:contain;flex-direction:column;flex:1;padding:24px;display:flex;overflow-y:auto}.walkthrough-back-btn{border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;background:0 0;border-radius:6px;align-items:center;gap:6px;margin:16px 24px 0;padding:8px 12px;font-size:.85rem;transition:all .2s;display:flex}.walkthrough-back-btn:hover{border-color:var(--text-primary);color:var(--text-primary)}.walkthrough-back-list-btn{background:var(--bg-primary);border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;border-radius:6px;align-items:center;gap:6px;max-width:200px;margin:16px auto 0;padding:8px 12px;font-size:.85rem;transition:all .2s;display:inline-flex}.walkthrough-back-list-btn:hover{border-color:var(--accent);color:var(--accent)}.walkthrough-main-title{text-align:center;margin:0 0 16px;padding-top:12px;font-size:1.75rem;font-weight:600}.walkthrough-main-desc{text-align:left;color:var(--text-secondary);align-self:start;max-width:600px;margin:0 0 24px}.walkthrough-text{overscroll-behavior:contain;flex:1;padding:0 0 24px;overflow-y:auto}.walkthrough-paragraph{text-align:left;color:var(--text-primary);word-wrap:break-word;overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto;margin:0 0 12px;line-height:1.6}.walkthrough-text .md-paragraph{text-align:left;color:var(--text-primary);margin:0 0 12px;font-size:.92rem;line-height:1.7}.walkthrough-text .md-h2{border-bottom:1px solid var(--border);color:var(--text-primary);letter-spacing:-.01em;margin:24px 0 10px;padding-bottom:6px;font-size:1.15rem;font-weight:700}.walkthrough-text .md-h2:first-child{margin-top:0}.walkthrough-text .md-h3{color:var(--text-primary);margin:18px 0 8px;font-size:1rem;font-weight:600}.walkthrough-text strong{color:var(--text-primary);font-weight:600}.walkthrough-text em{color:var(--text-secondary,var(--text-muted));font-style:italic}.walkthrough-text .md-list{counter-reset:md-list-counter;margin:0 0 14px;padding-left:22px;list-style:none}.walkthrough-text .md-list li{color:var(--text-primary);margin:0 0 6px;padding-left:4px;font-size:.92rem;line-height:1.6;position:relative}.walkthrough-text .md-list li:before{background:var(--accent);opacity:.7;content:"";border-radius:50%;width:7px;height:7px;position:absolute;top:2px;left:-18px}.walkthrough-text .md-list-ordered{counter-reset:md-list-counter}.walkthrough-text .md-list-ordered li{counter-increment:md-list-counter;list-style:none}.walkthrough-text .md-list-ordered li:before{content:counter(md-list-counter) ".";opacity:1;width:auto;height:auto;color:var(--accent);background:0 0;border-radius:0;font-weight:600;top:0;left:-22px}.walkthrough-text .md-admonition{border-left:4px solid var(--accent);background:var(--bg-tertiary);border-radius:8px;gap:12px;margin:16px 0;padding:14px 16px;font-size:.88rem;line-height:1.6;display:flex}.walkthrough-text .md-admonition p{color:var(--text-primary);margin:0 0 6px}.walkthrough-text .md-admonition p:last-child{margin-bottom:0}.walkthrough-text .md-admonition-icon{color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:20px;height:20px;margin-top:1px;font-size:11px;font-weight:700;display:flex}.walkthrough-text .md-admonition-content{flex:1;min-width:0}.walkthrough-text .md-admonition-label{text-transform:uppercase;letter-spacing:.04em;color:var(--text-secondary,var(--text-muted));margin-bottom:4px;font-size:.78rem;font-weight:700;display:block}.walkthrough-text .md-admonition-note{background:#3b82f614;border-left-color:#3b82f6}.walkthrough-text .md-admonition-note .md-admonition-icon{background:#3b82f6}.walkthrough-text .md-admonition-tip{background:#22c55e14;border-left-color:#22c55e}.walkthrough-text .md-admonition-tip .md-admonition-icon{background:#22c55e}.walkthrough-text .md-admonition-warning{background:#f59e0b14;border-left-color:#f59e0b}.walkthrough-text .md-admonition-warning .md-admonition-icon{background:#f59e0b}.walkthrough-text .md-admonition-info{background:#8b5cf614;border-left-color:#8b5cf6}.walkthrough-text .md-admonition-info .md-admonition-icon{background:#8b5cf6}.walkthrough-text .md-admonition-note .md-admonition-icon:before{content:"N"}.walkthrough-text .md-admonition-tip .md-admonition-icon:before{content:"T"}.walkthrough-text .md-admonition-warning .md-admonition-icon:before{content:"!"}.walkthrough-text .md-admonition-info .md-admonition-icon:before{content:"i"}.walkthrough-text table{border-collapse:collapse;border:1px solid var(--border);border-radius:6px;width:100%;margin:12px 0 16px;font-size:.85rem;line-height:1.5;overflow:hidden}.walkthrough-text thead{background:var(--bg-tertiary)}.walkthrough-text th{text-align:left;color:var(--text-primary);border-bottom:2px solid var(--border);white-space:nowrap;padding:8px 12px;font-size:.82rem;font-weight:600}.walkthrough-text td{border-top:1px solid var(--border);color:var(--text-primary);padding:7px 12px}.walkthrough-text tr:last-child td{border-bottom:none}.walkthrough-text p strong,.walkthrough-text li strong{font-weight:600}.walkthrough-steps{margin:0 0 20px 24px}.walkthrough-steps-title{margin:0 0 16px;font-size:1.1rem;font-weight:600}.walkthrough-steps-list{flex-direction:column;gap:12px;display:flex}.walkthrough-step-item{background:var(--bg-tertiary);border:1px solid var(--border);border-radius:8px;gap:16px;padding:16px;transition:all .2s;display:flex}.walkthrough-step-item.active{border-color:var(--accent);background:var(--bg-tertiary)}.walkthrough-step-number{background:var(--accent);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;font-size:.9rem;font-weight:600;display:flex}.walkthrough-step-details{flex:1}.walkthrough-step-title{margin:0 0 6px;font-weight:600}.walkthrough-step-desc{color:var(--text-secondary);margin:0 0 8px;font-size:.9rem}.walkthrough-step-action{background:var(--surface);border:1px solid var(--border);border-radius:4px;padding:4px 10px;font-family:monospace;font-size:.8rem;display:inline-block}.walkthrough-controls{justify-content:space-between;gap:12px;padding:0 24px 20px;display:flex}.walkthrough-nav-btn{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--text-primary);cursor:pointer;border-radius:6px;align-items:center;gap:6px;padding:10px 20px;font-size:.85rem;font-weight:500;transition:all .2s;display:inline-flex}.walkthrough-nav-btn:hover{border-color:var(--accent);color:var(--accent)}.walkthrough-nav-btn:disabled{opacity:.5;cursor:not-allowed}.walkthrough-done-btn{background:var(--accent);color:#fff;border:none;border-radius:6px;padding:10px 20px;font-weight:500}.walkthrough-done-btn:hover{background:var(--accent)}.walkthrough-nav-btn-next{background:var(--accent);border-color:var(--accent);color:#fff}.walkthrough-nav-btn-next:hover{filter:brightness(1.15)}.walkthrough-complete{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:400px;padding:48px 32px;display:flex}.walkthrough-complete-icon{justify-content:center;align-items:center;margin-bottom:20px;display:flex}.walkthrough-complete-icon svg{filter:drop-shadow(0 0 16px var(--green-glow))}.walkthrough-check-path{stroke-dasharray:48;stroke-dashoffset:48px;animation:.6s ease-out .3s forwards drawCheck}@keyframes drawCheck{to{stroke-dashoffset:0}}.walkthrough-complete-title{margin:0 0 16px;font-size:1.5rem;font-weight:600}.walkthrough-complete-desc{color:var(--text-secondary);margin:0 0 32px}.walkthrough-complete-btn{background:var(--accent);border:1px solid var(--accent);color:#fff;cursor:pointer;border-radius:6px;align-items:center;gap:6px;padding:10px 20px;font-size:.85rem;font-weight:500;transition:all .2s;display:inline-flex}.walkthrough-complete-btn:hover{filter:brightness(1.15)}.header-right{align-items:center;gap:8px;display:flex}.melody-indicator-pill{color:var(--accent);cursor:pointer;white-space:nowrap;-webkit-backdrop-filter:blur(6px);background:linear-gradient(135deg,#58a6ff1f,#8250dc1a);border:1px solid #58a6ff40;border-radius:12px;align-items:center;gap:8px;max-width:220px;padding:4px 14px 4px 10px;transition:all .2s;display:inline-flex;overflow:hidden}.melody-indicator-pill:hover{background:linear-gradient(135deg,#58a6ff38,#8250dc2e);border-color:#58a6ff73;transform:translateY(-1px);box-shadow:0 0 12px #58a6ff26}.melody-indicator-pill:active{transform:translateY(0)}.melody-indicator-icon{opacity:.7;flex-shrink:0}.melody-indicator-info{flex-direction:column;line-height:1.2;display:flex;overflow:hidden}.melody-indicator-name{letter-spacing:.01em;text-overflow:ellipsis;white-space:nowrap;font-size:.78rem;font-weight:600;overflow:hidden}.melody-indicator-character{color:var(--text-secondary);text-transform:capitalize;opacity:.75;text-overflow:ellipsis;white-space:nowrap;font-size:.65rem;font-weight:500;overflow:hidden}[data-theme=light] .melody-indicator-pill{color:var(--accent);background:linear-gradient(135deg,#58a6ff1a,#8250dc14);border-color:#58a6ff4d}[data-theme=light] .melody-indicator-pill:hover{background:linear-gradient(135deg,#58a6ff2e,#8250dc24);border-color:#58a6ff80;box-shadow:0 0 12px #58a6ff1f}#practice-panel{flex-direction:column;height:100%;min-height:0;display:flex}#practice-panel #canvas-container{flex:auto;min-height:0}#practice-panel #history-container{flex:none;margin-top:auto}#settings-panel,.settings-panel,.library-tab,.session-editor-container,.app-sidebar,#main-layout,.main-content{padding-bottom:max(24px,env(safe-area-inset-bottom,24px))}.editor-playhead{background:var(--accent,#4caf50);box-shadow:0 0 6px var(--accent-glow,#4caf5099)}.editor-playhead .editor-playhead-marker{border-left:7px solid #0000;border-right:7px solid #0000;border-top:9px solid var(--accent,#4caf50);width:0;height:0;filter:drop-shadow(0 0 4px var(--accent-glow,#4caf5099));position:absolute;top:-8px;left:-6px}.cycles-control-group{border:1px solid var(--accent-dim);background:linear-gradient(180deg,var(--bg-secondary),var(--bg-primary));border-radius:999px;align-items:center;gap:8px;padding:4px 8px;display:inline-flex;box-shadow:inset 0 1px #ffffff0a,0 0 0 1px #00000014}.cycles-label{color:var(--text-secondary);letter-spacing:.04em;text-transform:uppercase;margin:0;font-size:.72rem}.cycles-control-group .cycles-input{border:1px solid var(--accent-glow);background:var(--accent-dim);width:54px;min-width:54px;height:28px;color:var(--text-primary);text-align:center;border-radius:999px;outline:none;padding:0 8px;font-weight:700}.cycles-control-group .cycles-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-dim),0 0 18px var(--accent-dim)}.cycle-progress-pill{border:1px solid var(--green-dim);background:linear-gradient(135deg,var(--green-dim),var(--accent-dim));height:28px;color:var(--text-primary);white-space:nowrap;border-radius:999px;align-items:center;gap:5px;padding:0 10px;font-size:.78rem;font-weight:700;display:inline-flex}.cycle-progress-label{color:var(--text-secondary);letter-spacing:.06em;text-transform:uppercase;font-size:.68rem;font-weight:600}.cycle-progress-value{color:var(--green);text-shadow:0 0 10px var(--green-dim)}.sidebar-scale-select{width:100%;max-width:100%;min-height:34px;margin-top:4px}.cycles-control-group .cycles-input::-webkit-inner-spin-button{opacity:1;filter:invert(65%)sepia(44%)saturate(711%)hue-rotate(179deg)brightness(96%)contrast(95%);cursor:pointer}.cycles-control-group .cycles-input::-webkit-outer-spin-button{opacity:1;filter:invert(65%)sepia(44%)saturate(711%)hue-rotate(179deg)brightness(96%)contrast(95%);cursor:pointer}#bpm-input::-webkit-inner-spin-button{opacity:1;filter:invert(65%)sepia(44%)saturate(711%)hue-rotate(179deg)brightness(96%)contrast(95%);cursor:pointer}#bpm-input::-webkit-outer-spin-button{opacity:1;filter:invert(65%)sepia(44%)saturate(711%)hue-rotate(179deg)brightness(96%)contrast(95%);cursor:pointer}.practice-mode-control-group{border:1px solid var(--accent-dim);background:linear-gradient(180deg,var(--bg-secondary),var(--bg-primary));border-radius:999px;align-items:center;gap:8px;padding:4px 8px;display:inline-flex;box-shadow:inset 0 1px #ffffff0a,0 0 0 1px #00000014}.practice-mode-label{color:var(--text-secondary);letter-spacing:.04em;text-transform:uppercase;margin:0;font-size:.72rem}.practice-mode-control-group .practice-sub-mode-select{border:1px solid var(--accent-glow);background:var(--accent-dim);min-width:132px;height:28px;color:var(--text-primary);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--text-muted) 50%),linear-gradient(135deg,var(--text-muted) 50%,transparent 50%);background-position:calc(100% - 16px) 11px,calc(100% - 11px) 11px;background-repeat:no-repeat;background-size:5px 5px,5px 5px;border-radius:999px;outline:none;padding:0 30px 0 10px;font-weight:700}.practice-mode-control-group .practice-sub-mode-select:hover{border-color:var(--accent-glow);background-color:var(--bg-card)}.practice-mode-control-group .practice-sub-mode-select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-dim),0 0 18px var(--accent-dim)}.practice-mode-control-group .practice-sub-mode-select option{background:var(--bg-secondary);color:var(--text-primary)}.practice-mode-control-group select.practice-sub-mode-select,.practice-mode-control-group .practice-sub-mode-select{background-color:var(--bg-secondary)!important;color:var(--text-primary)!important;border-color:var(--accent-glow)!important}.settings-panel .settings-row select,#settings-panel .settings-row select{border:1px solid var(--border);background-color:var(--bg-secondary);height:34px;min-height:34px;color:var(--text-primary);-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--text-muted) 50%),linear-gradient(135deg,var(--text-muted) 50%,transparent 50%);background-position:calc(100% - 16px) 14px,calc(100% - 11px) 14px;background-repeat:no-repeat;background-size:5px 5px,5px 5px;border-radius:10px;padding:0 32px 0 12px;font-size:.9rem;line-height:34px}.settings-panel .settings-row select:hover,#settings-panel .settings-row select:hover{border-color:var(--accent-glow);background-color:var(--bg-card)}.settings-panel .settings-row select:focus,#settings-panel .settings-row select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-dim);outline:none}.settings-panel .settings-row select option,#settings-panel .settings-row select option{background:var(--bg-secondary);color:var(--text-primary)}.pitch-buffer-pills{background:#00000040;border:1px solid #ffffff0f;border-radius:10px;gap:4px;padding:3px;display:flex}.pitch-buffer-pill{color:#ffffff73;letter-spacing:.02em;cursor:pointer;white-space:nowrap;background:0 0;border:none;border-radius:8px;flex:1;padding:6px 10px;font-family:Inter,SF Mono,monospace;font-size:.72rem;font-weight:600;transition:all .2s}@media(hover:hover){.pitch-buffer-pill:hover{color:#ffffffb3;background:#ffffff0f}}.pitch-buffer-pill-active{color:#fff;background:linear-gradient(135deg,#38bdf833,#8b5cf633);border:1px solid #38bdf840;box-shadow:0 0 8px #38bdf826,inset 0 1px #ffffff14}@media(hover:hover){.pitch-buffer-pill-active:hover{background:linear-gradient(135deg,#38bdf84d,#8b5cf64d)}}.walkthrough-section-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;margin-bottom:10px;padding-bottom:8px;display:flex}.walkthrough-section-title{text-transform:uppercase;letter-spacing:.08em;color:var(--accent);font-size:11px;font-weight:700}.walkthrough-section-steps{color:var(--text-muted);font-size:11px;font-weight:600}.walkthrough-actions{justify-content:space-between;align-items:center;gap:8px;display:flex}.walkthrough-actions-center{align-items:center;gap:6px;display:flex}.walkthrough-skip-section{color:var(--text-muted);border:1px solid var(--border);cursor:pointer;background:0 0;border-radius:6px;padding:4px 8px;font-size:11px;transition:background .15s,color .15s}.walkthrough-skip-section:hover{color:var(--text-secondary);background:var(--bg-tertiary)}.guide-overlay{z-index:10000;background:#00000080;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.guide-selection{background:var(--bg-primary);border:1px solid var(--border);width:100%;max-width:480px;max-height:80vh;color:var(--text-primary);border-radius:16px;padding:28px;overflow-y:auto;box-shadow:0 12px 48px #0000004d}.guide-selection-header{justify-content:space-between;align-items:center;margin-bottom:6px;display:flex}.guide-selection-header h2{color:var(--text-primary);margin:0;font-size:20px;font-weight:700}.guide-close-btn{cursor:pointer;color:var(--text-muted);background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:4px;transition:background .15s,color .15s;display:flex}.guide-close-btn:hover{background:var(--bg-tertiary);color:var(--text-primary)}.guide-selection-desc{color:var(--text-secondary);margin:0 0 20px;font-size:13px;line-height:1.5}.guide-quick-actions{flex-direction:column;gap:8px;margin-bottom:20px;display:flex}.guide-quick-btn{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-primary);cursor:pointer;text-align:left;border-radius:10px;align-items:center;gap:10px;width:100%;padding:12px 16px;font-size:14px;font-weight:600;transition:background .15s,border-color .15s;display:flex}.guide-quick-btn:hover{background:var(--bg-secondary);border-color:var(--accent)}.guide-quick-incomplete{border-color:var(--accent);background:var(--accent-light,#6c63ff14);color:var(--accent)}.guide-quick-incomplete:hover{background:var(--accent-light,#6c63ff26)}.guide-sections-list{border-top:1px solid var(--border);padding-top:16px}.guide-sections-list h3{color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;margin:0 0 12px;font-size:13px;font-weight:600}.guide-section-item{width:100%;color:var(--text-primary);cursor:pointer;text-align:left;background:0 0;border:1px solid #0000;border-radius:10px;align-items:center;gap:12px;margin-bottom:4px;padding:12px 14px;font-size:14px;transition:background .15s,border-color .15s;display:flex}.guide-section-item:hover{background:var(--bg-tertiary);border-color:var(--border)}.guide-section-item.completed{opacity:.6}.guide-section-icon{color:var(--accent);flex-shrink:0;align-items:center;display:flex}.guide-section-item.completed .guide-section-icon{color:#4caf50}.guide-section-text{flex-direction:column;gap:2px;min-width:0;display:flex}.guide-section-name{color:var(--text-primary);font-size:14px;font-weight:600}.guide-section-desc{color:var(--text-muted);font-size:12px;line-height:1.4}.app-sidebar #scale-info{border:1px solid var(--accent-dim);background:linear-gradient(180deg,var(--bg-secondary),var(--bg-primary));border-radius:14px;grid-template-columns:1fr auto;align-items:center;gap:8px;padding:10px;display:grid}.app-sidebar #scale-info #key-select,.app-sidebar #scale-info #scale-select{border:1px solid var(--accent-dim);min-height:36px;color:var(--text-primary);border-radius:10px;font-weight:700;background-color:var(--bg-secondary)!important}.app-sidebar #scale-info #key-select{width:100%}.app-sidebar #scale-info #scale-select{grid-column:1/-1;width:100%}.app-sidebar #scale-info .octave-ctrl{border-color:var(--accent-dim);background:var(--accent-dim);border-radius:999px;height:36px;padding:3px 6px}.app-sidebar #scale-info .octave-btn{border-radius:999px;width:26px;height:26px}.app-sidebar #scale-info .octave-value{color:#7ee787;text-align:center;min-width:24px;font-weight:800}.app-sidebar #open-scale-builder{border-radius:10px;grid-column:1/-1;justify-content:center;width:100%;min-height:34px}#note-list .note-item.rest-item{color:var(--text-secondary);background:#8b949e1a;border-style:dashed;border-color:#8b949e73}#note-list .note-item.rest-item .note-dot{background:0 0;border:1px dashed #8b949ea6}.playlist-edit-form{flex-direction:column;gap:16px;padding:4px 2px;display:flex}.playlist-edit-form h3{color:var(--text-primary);margin:0;font-size:1.05rem;font-weight:600}.playlist-edit-form .form-group{flex-direction:column;gap:6px;display:flex}.playlist-edit-form .form-group label{color:var(--text-secondary);font-size:.85rem}.playlist-edit-form .search-input{border:1px solid var(--border);background:var(--bg-tertiary);width:100%;color:var(--text-primary);border-radius:10px;outline:none;padding:9px 12px;font-size:.9rem;transition:border-color .12s,box-shadow .12s}.playlist-edit-form .search-input::placeholder{color:var(--text-secondary);opacity:.7}.playlist-edit-form .search-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-dim)}.playlist-edit-form .melody-select-list{scrollbar-width:thin;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;max-height:50vh;padding:4px 4px 8px;display:grid;overflow-y:auto}.playlist-edit-form .melody-select-list::-webkit-scrollbar{width:8px}.playlist-edit-form .melody-select-list::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:8px}@media(max-width:900px){.playlist-edit-form .melody-select-list{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.playlist-edit-form .melody-select-list{grid-template-columns:1fr}}.playlist-picker-pill{border:1px solid var(--border-color,#ffffff14);color:var(--text-primary);text-align:left;cursor:pointer;font:inherit;background:#ffffff08;border-radius:12px;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:10px 12px;transition:border-color .12s,background-color .12s,transform 80ms,box-shadow .12s;display:grid}.playlist-picker-pill:hover{background:#4a9eff14;border-color:#4a9eff66}.playlist-picker-pill:active{transform:translateY(1px)}.playlist-picker-pill.selected{border-color:var(--accent-color,#4a9eff);background:linear-gradient(135deg,#4a9eff2e,#4a9eff0f);box-shadow:inset 0 0 0 1px #4a9eff73}.playlist-picker-icon{background:#ffffff0f;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:30px;height:30px;font-size:1rem;display:inline-flex}.playlist-picker-pill.selected .playlist-picker-icon{background:#4a9eff40}.playlist-picker-copy{flex-direction:column;gap:2px;min-width:0;display:flex}.playlist-picker-copy .select-item-title{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:.92rem;font-weight:600;overflow:hidden}.playlist-picker-copy .select-item-meta{color:var(--text-secondary);white-space:nowrap;text-overflow:ellipsis;font-size:.78rem;overflow:hidden}.playlist-picker-check{width:24px;height:24px;color:var(--text-secondary);background:#ffffff0f;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-size:.85rem;font-weight:700;transition:background .12s,color .12s;display:inline-flex}.playlist-picker-pill.selected .playlist-picker-check{background:var(--accent-color,#4a9eff);color:#fff}.playlist-edit-form .empty-state{text-align:center;color:var(--text-secondary);background:#ffffff08;border:1px dashed #ffffff14;border-radius:12px;grid-column:1/-1;padding:24px}.playlist-edit-form .form-actions{border-top:1px solid #ffffff0f;justify-content:flex-end;gap:8px;padding-top:8px;display:flex}.playlist-edit-form .form-actions .cancel-btn,.playlist-edit-form .form-actions .save-btn{cursor:pointer;border:1px solid #0000;border-radius:10px;padding:9px 16px;font-weight:600;transition:background .12s,border-color .12s,transform 80ms}.playlist-edit-form .form-actions .cancel-btn{color:var(--text-primary);background:#ffffff0a;border-color:#ffffff1a}.playlist-edit-form .form-actions .cancel-btn:hover{background:#ffffff14}.playlist-edit-form .form-actions .save-btn{background:var(--accent-color,#4a9eff);color:#fff}.playlist-edit-form .form-actions .save-btn:hover{filter:brightness(1.08)}.playlist-edit-form .form-actions .save-btn:active,.playlist-edit-form .form-actions .cancel-btn:active{transform:translateY(1px)}.inline-controls-row{flex-wrap:wrap;flex:auto;align-items:center;gap:.75rem;min-width:0;display:flex}.inline-control{background:var(--surface-2,#ffffff0a);white-space:nowrap;border-radius:6px;align-items:center;gap:.4rem;padding:2px 6px;display:inline-flex}.inline-control-icon{color:var(--text-muted,#aaa);flex:none;justify-content:center;align-items:center;display:inline-flex}.inline-control-value{font-variant-numeric:tabular-nums;color:var(--text,#ddd);text-align:right;min-width:2ch;font-size:.8rem}.inline-control .opt-label{display:none}@media(max-width:600px){.practice-header-bar,.editor-header-bar{flex-wrap:wrap}.inline-controls-row{order:99;justify-content:flex-start;width:100%}#app-tabs{-webkit-overflow-scrolling:touch;scrollbar-width:none;flex-wrap:nowrap;padding-bottom:2px;overflow-x:auto}#app-tabs::-webkit-scrollbar{display:none}.tab-group{flex-shrink:0}}.session-library-item .item-main{flex-direction:column;flex:1;gap:6px;min-width:0;display:flex}.session-mini-timeline{flex-wrap:wrap;gap:4px;max-height:64px;margin-top:4px;padding-right:4px;display:flex;overflow-y:auto}.session-mini-pill{background:var(--surface-2,#ffffff0f);color:var(--text,#ddd);white-space:nowrap;text-overflow:ellipsis;border:1px solid #ffffff14;border-radius:10px;align-items:center;gap:4px;max-width:200px;padding:2px 8px;font-size:.72rem;line-height:1.4;display:inline-flex;overflow:hidden}.session-mini-pill.is-melody{background:#6384ff2e;border-color:#6384ff59}.session-mini-pill.is-rest{color:var(--text-muted,#aaa);background:#ffffff0d;border-color:#ffffff1f;font-style:italic}.session-mini-pill-icon{flex:none;font-size:.75rem}.session-mini-pill-label{text-overflow:ellipsis;overflow:hidden}.session-mini-empty{color:var(--text-muted,#888);font-size:.75rem;font-style:italic}.session-player-item.is-rest .session-item-label{color:var(--text-muted,#9aa3b2);font-style:italic}.session-player-item.is-rest .session-item-icon{color:var(--accent-muted,#777)}.session-item-pill.pill-disabled{opacity:.45;cursor:not-allowed;pointer-events:auto;filter:grayscale(.4)}.session-item-pill.pill-disabled:hover{background:inherit;transform:none}.settings-tier-selector .welcome-tier-buttons{gap:8px}.settings-tier-selector .welcome-tier-btn{flex:1;min-width:0;padding:10px 12px}.settings-tier-selector .tier-icon-wrap svg{width:18px;height:18px}.settings-tier-selector .tier-name{font-size:.8rem}.settings-tier-selector .tier-desc{font-size:.65rem}.pitch-algorithm-tester{flex-direction:column;height:100%;min-height:0;display:flex}.tester-header{border-bottom:1px solid var(--border);background:var(--bg-card);flex-shrink:0;align-items:center;padding:12px 20px;display:flex}.tester-header h2{margin:0 auto 0 0;font-size:1rem;font-weight:600}.tester-layout{flex:1;grid-template-columns:260px 1fr;gap:0;min-height:0;display:grid;overflow:hidden}.tester-layout.busy .tester-results{opacity:.45}.tester-controls{border-right:1px solid var(--border);background:var(--bg-card);flex-direction:column;gap:8px;padding:16px;display:flex;overflow-y:auto}.tester-controls .section{margin-bottom:4px}.tester-controls .section h3{text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);margin-bottom:8px;font-size:.7rem}.tester-results{flex:1;padding:16px 20px;overflow-y:auto}.algorithm-list{flex-direction:column;gap:4px;display:flex}.algorithm-item{border:1px solid var(--border);background:var(--bg-secondary);cursor:pointer;border-radius:6px;align-items:center;gap:8px;padding:8px 10px;transition:all .15s;display:flex}.algorithm-item:hover{border-color:var(--accent);background:var(--bg-tertiary)}.algorithm-item.selected{border-color:var(--accent);background:var(--accent-dim)}.algorithm-item input[type=checkbox]{cursor:pointer;flex-shrink:0;width:16px;height:16px}.algo-info{flex-direction:column;flex:1;gap:1px;min-width:0;display:flex}.algo-name{color:var(--text-primary);font-size:.78rem;font-weight:500}.algo-desc{color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;font-size:.68rem;overflow:hidden}.sample-pill-list{flex-wrap:wrap;gap:6px;display:flex}.sample-pill{border:1px solid var(--border);background:var(--bg-secondary);color:var(--text-primary);cursor:pointer;white-space:nowrap;border-radius:20px;padding:4px 10px;font-size:.72rem;transition:all .15s}.sample-pill:hover{border-color:var(--accent);background:var(--bg-tertiary)}.sample-pill.selected{border-color:var(--accent);background:var(--accent-dim);color:var(--accent)}.tester-buttons{gap:8px;margin-top:4px;display:flex}.tester-play-btn{background:linear-gradient(135deg,var(--accent),var(--accent-glow));color:#fff;cursor:pointer;border:none;border-radius:6px;flex:1;padding:10px 12px;font-size:.82rem;font-weight:600;transition:transform .1s,box-shadow .1s}.run-all-btn{border:1px solid var(--border);background:var(--bg-secondary);color:var(--text-primary);cursor:pointer;border-radius:6px;padding:10px 12px;font-size:.78rem;font-weight:500;transition:all .15s}.run-all-btn:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}.tester-play-btn:hover:not(:disabled){box-shadow:0 4px 12px var(--accent-glow);transform:translateY(-1px)}.tester-play-btn:active:not(:disabled){transform:translateY(1px)}.tester-play-btn:disabled,.run-all-btn:disabled{opacity:.4;cursor:not-allowed}.progress-container{background:var(--bg-secondary);border-radius:6px;margin-top:4px;padding:8px 10px}.progress-bar{background:var(--bg-tertiary);border-radius:2px;height:4px;overflow:hidden}.progress-fill{background:linear-gradient(90deg,var(--accent),var(--accent-glow));height:100%;transition:width .3s}.progress-text{color:var(--text-muted);text-align:center;margin-top:4px;font-size:.68rem;display:block}.crash-copy-btn.error{border-color:var(--red);color:var(--red);background:rgba(var(--red-rgb),.1)}.crash-copy-btn.error:hover{background:rgba(var(--red-rgb),.15)}.results-section{margin-top:20px}.results-section h3{margin-bottom:12px;font-size:.9rem;font-weight:600}.sample-section{border-bottom:2px solid var(--border);margin-bottom:20px;padding-bottom:16px}.sample-section:last-child{border-bottom:none;margin-bottom:0}.sample-section-header{color:var(--accent);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--border);margin-bottom:10px;padding-bottom:6px;font-size:.78rem;font-weight:600}.overall-score{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:6px;margin-bottom:16px;display:grid}.result-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:6px;justify-content:space-between;align-items:center;gap:10px;padding:8px 12px;display:flex}.result-card-left{flex-direction:column;gap:3px;min-width:0;display:flex}.result-algo-name{color:var(--text-primary);font-size:.8rem;font-weight:600}.result-card-right{flex-direction:column;flex-shrink:0;align-items:flex-end;gap:2px;display:flex}.result-score{font-size:1.15rem;font-weight:700;line-height:1}.score-max{opacity:.6;font-size:.65rem;font-weight:400}.result-time{color:var(--text-muted);font-size:.65rem}.result-offset{font-size:.7rem;font-weight:600}.result-offset.good{color:var(--green)}.result-offset.bad{color:var(--red)}.perf-badge{text-transform:uppercase;border-radius:10px;padding:4px 10px;font-size:.7rem;font-weight:600}.perf-badge.fast{background:var(--green-dim);color:var(--green)}.perf-badge.slow{background:var(--yellow-dim);color:var(--yellow)}.perf-badge.timeout{background:var(--red-dim);color:var(--red)}.perf-time{color:var(--text-muted);font-size:.8rem}.results-legend{background:var(--bg-secondary);color:var(--text-muted);border-radius:6px;flex-wrap:wrap;gap:14px;margin-bottom:16px;padding:8px 12px;font-size:.72rem;display:flex}.legend-item{align-items:center;gap:5px;display:flex}.legend-dot{border-radius:50%;flex-shrink:0;width:8px;height:8px}.legend-dot.good{background:var(--green)}.legend-dot.ok{background:var(--yellow)}.legend-dot.bad{background:var(--red)}.legend-dot.miss{background:var(--text-muted)}.detailed-results{border-top:1px solid var(--border);margin-top:0;padding-top:10px}.note-row{border-bottom:1px solid var(--border);align-items:center;gap:6px;padding:5px 0;font-size:.8rem;display:grid}.note-row.note-header{text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted);border-bottom:2px solid var(--border);background:var(--bg-primary);z-index:1;padding:6px 0;font-size:.7rem;font-weight:600;position:sticky;top:0}.note-name{color:var(--text-primary);font-weight:500}.note-freq{color:var(--text-muted);font-size:.72rem}.note-offset-hdr{text-align:center;font-weight:600}.note-offset{text-align:center;font-variant-numeric:tabular-nums;border-radius:3px;padding:2px 4px;font-size:.75rem;font-weight:500}.note-offset.good{color:var(--green)}.note-offset.ok{color:var(--yellow)}.note-offset.bad{color:var(--red)}.note-offset.miss{color:var(--text-muted)}.pitch-testing-tab{flex-direction:column;height:100%;min-height:0;padding:0;display:flex;overflow:hidden}.pitch-testing-header{border-bottom:1px solid var(--border);background:var(--bg-card);flex-shrink:0;justify-content:space-between;align-items:center;padding:10px 16px;display:flex}.pitch-testing-header h2{margin:0;font-size:1rem;font-weight:600}.pitch-testing-layout{flex-direction:row;flex:1;gap:0;min-height:0;display:flex}.pitch-testing-controls{border-right:1px solid var(--border);background:var(--bg-card);flex-shrink:0;width:240px;padding:12px;overflow-y:auto}.pitch-testing-controls .control-group{margin-bottom:10px}.pitch-testing-controls .control-group label{text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);margin-bottom:4px;font-size:.7rem;display:block}.pitch-testing-controls select,.pitch-testing-controls input[type=number]{border:1px solid var(--border);background:var(--bg-secondary);width:100%;color:var(--text-primary);border-radius:6px;margin-bottom:2px;padding:6px 8px;font-size:.78rem}.pitch-testing-controls select:focus,.pitch-testing-controls input:focus{border-color:var(--accent);outline:none}.pitch-testing-controls .control-hint{color:var(--text-muted);font-size:.68rem;display:block}.pitch-testing-controls .file-input{border:1px dashed var(--border);background:var(--bg-secondary);width:100%;color:var(--text-primary);border-radius:6px;margin-bottom:6px;padding:6px;font-size:.75rem}.pitch-testing-controls .file-info{color:var(--text-secondary);margin-top:2px;font-size:.7rem;display:block}.pitch-testing-controls .mic-controls,.pitch-testing-controls .file-controls,.pitch-testing-controls .generate-controls{background:var(--bg-secondary);border-radius:6px;margin-bottom:10px;padding:8px}.pitch-testing-controls .waveform-info{color:var(--text-secondary);margin-top:4px;font-size:.7rem;display:block}.mic-status{border-radius:10px;margin-top:4px;padding:3px 6px;font-size:.68rem;font-weight:500;display:inline-block}.mic-status.active{background:var(--green-dim);color:var(--green)}.pitch-testing-controls .mic-hint{color:var(--text-muted);margin-top:4px;font-size:.65rem;display:block}.pitch-testing-controls .btn{cursor:pointer;border:none;border-radius:6px;width:100%;margin-bottom:6px;padding:8px 12px;font-size:.78rem;font-weight:500;transition:all .15s}.pitch-testing-controls .btn-sm{padding:5px 8px;font-size:.72rem}.pitch-testing-controls .btn-primary{background:var(--accent);color:#fff}.pitch-testing-controls .btn-primary:hover:not(:disabled){background:var(--accent)}.pitch-testing-controls .btn-primary:disabled{opacity:.5;cursor:not-allowed}.pitch-testing-controls .btn-secondary{background:var(--bg-tertiary);color:var(--text-primary)}.pitch-testing-controls .btn-secondary:hover:not(:disabled){background:var(--bg-secondary)}.pitch-testing-controls .btn-secondary:disabled{opacity:.5;cursor:not-allowed}.pitch-testing-controls .btn-test{background:linear-gradient(135deg,var(--accent),var(--accent-glow));color:#fff}.pitch-testing-controls .btn-test:hover:not(:disabled){opacity:.95;box-shadow:0 4px 12px var(--accent-glow);transform:translateY(-1px)}.pitch-testing-controls .btn-test:disabled{opacity:.5;cursor:not-allowed}.pitch-testing-controls .btn-outline{border:1px solid var(--border);color:var(--text-primary);background:0 0}.pitch-testing-controls .btn-outline:hover{border-color:var(--accent);color:var(--accent)}.pitch-testing-controls .algorithm-header-row{justify-content:space-between;align-items:center;display:flex}.pitch-testing-controls .ensemble-toggle-label{color:var(--text-muted);cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:4px;font-size:.68rem;display:flex}.pitch-testing-controls .ensemble-toggle-label input[type=checkbox]{accent-color:var(--accent);width:12px;height:12px;margin:0}.pitch-testing-controls .ensemble-toggle-text{text-transform:uppercase;letter-spacing:.04em;color:var(--accent)}.pitch-testing-controls .ensemble-pills{flex-wrap:wrap;gap:6px;display:flex}.pitch-testing-controls .ensemble-pill{border:1px solid var(--border-subtle);background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;white-space:nowrap;border-radius:14px;padding:4px 10px;font-size:.7rem;transition:all .15s}.pitch-testing-controls .ensemble-pill:hover:not(:disabled){border-color:var(--accent-glow);color:var(--text-primary)}.pitch-testing-controls .ensemble-pill.selected{background:var(--accent-dim);border-color:var(--accent);color:var(--accent);font-weight:600}.pitch-testing-controls .ensemble-pill:disabled{opacity:.5;cursor:not-allowed}.pitch-testing-visualization .ensemble-vote-bar{flex-wrap:wrap;gap:6px;margin-bottom:8px;display:flex}.ensemble-vote-chip{border:1px solid var(--border-subtle);background:var(--bg-tertiary);border-radius:10px;align-items:center;gap:4px;padding:3px 8px;font-size:.68rem;display:flex}.ensemble-vote-chip.detected{border-color:var(--green-dim);background:#3fb95014}.ensemble-vote-chip.no-detect{border-color:var(--red-dim);background:#f851490f}.ensemble-vote-chip .vote-chip-algo{color:var(--text-muted);text-transform:uppercase;font-size:.6rem;font-weight:500}.ensemble-vote-chip .vote-chip-note{color:var(--text-primary);font-weight:600}.ensemble-vote-chip.detected .vote-chip-note{color:var(--green-bright)}.ensemble-vote-chip.no-detect .vote-chip-note{color:var(--text-muted)}.pitch-testing-visualization{background:var(--bg-secondary);flex:1;min-height:0;padding:12px 16px;overflow-y:auto}.pitch-testing-visualization .detection-panel,.pitch-testing-visualization .results-panel,.pitch-testing-visualization .info-panel{margin-bottom:14px}.pitch-testing-visualization h3{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin:0 0 8px;font-size:.78rem}.pitch-testing-visualization h4{color:var(--text-muted);margin:0 0 6px;font-size:.75rem}.pitch-testing-visualization .metrics-grid{grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:6px;margin-bottom:12px;display:grid}.pitch-testing-visualization .metric-item{background:var(--bg-tertiary);border-radius:6px;padding:6px 8px}.pitch-testing-visualization .metric-label{color:var(--text-muted);text-transform:uppercase;margin-bottom:2px;font-size:.62rem;display:block}.pitch-testing-visualization .metric-value{color:var(--text-primary);font-size:.78rem;font-weight:600}.pitch-testing-visualization .metric-row{border-radius:4px;justify-content:space-between;padding:4px 8px;font-size:.78rem;display:flex}.pitch-testing-visualization .metric-row.passed{color:var(--green)}.pitch-testing-visualization .metric-row.failed{color:var(--red)}.pitch-testing-visualization .metric-row.result{background:var(--bg-tertiary)}.pitch-testing-visualization .waveform-display{margin-bottom:12px}.pitch-testing-visualization .waveform-display-header{justify-content:space-between;align-items:center;margin-bottom:6px;display:flex}.pitch-testing-visualization .waveform-display-header h4{margin:0}.pitch-testing-visualization .zoom-controls{align-items:center;gap:6px;display:flex}.pitch-testing-visualization .zoom-btn{border:1px solid var(--border-primary);background:var(--bg-tertiary);width:22px;height:22px;color:var(--text-secondary);cursor:pointer;border-radius:4px;justify-content:center;align-items:center;padding:0;font-size:14px;font-weight:600;line-height:1;display:flex}.pitch-testing-visualization .zoom-btn:hover:not(:disabled){background:var(--bg-secondary);color:var(--text-primary);border-color:var(--text-secondary)}.pitch-testing-visualization .zoom-btn:disabled{opacity:.35;cursor:default}.pitch-testing-visualization .zoom-value{color:var(--text-secondary);text-align:center;font-variant-numeric:tabular-nums;min-width:24px;font-size:12px}.pitch-testing-visualization .waveform-canvas{background:var(--bg-tertiary);border-radius:6px;flex-direction:column;height:280px;display:flex;position:relative}.pitch-testing-visualization .waveform-canvas-inner{border-radius:6px 6px 0 0;flex:1;min-height:0;overflow:hidden}.pitch-testing-visualization .waveform-canvas canvas{width:100%;height:100%;display:block}.pitch-testing-visualization .resize-handle{background:var(--bg-tertiary);cursor:ns-resize;border-top:1px solid var(--border-primary);border-radius:0 0 6px 6px;flex-shrink:0;justify-content:center;align-items:center;height:6px;transition:background .15s;display:flex}.pitch-testing-visualization .resize-handle:hover{background:var(--bg-secondary);border-top-color:var(--text-secondary)}.pitch-testing-visualization .resize-grip{align-items:center;gap:3px;display:flex}.pitch-testing-visualization .grip-dash{background:var(--border-primary);border-radius:1px;width:20px;height:2px;transition:background .15s}.pitch-testing-visualization .resize-handle:hover .grip-dash{background:var(--text-secondary)}.pitch-testing-visualization .info-panel{background:var(--bg-tertiary);border-radius:6px;padding:8px 10px}.pitch-testing-visualization .info-panel h3{color:var(--text-primary);text-transform:none;margin:0 0 4px;font-size:.78rem}.pitch-testing-visualization .info-panel p{color:var(--text-muted);margin:0 0 8px;font-size:.7rem}.pitch-testing-visualization .last-result{border-top:1px solid var(--border);margin-top:8px;padding-top:8px}.pitch-testing-visualization .result-details div{color:var(--text-secondary);margin-bottom:2px;font-size:.7rem}.pitch-testing-visualization .error-list{margin-top:6px}.pitch-testing-visualization .error-list p{color:var(--text-muted);margin-bottom:6px;font-size:.7rem}.pitch-testing-visualization .error-grid{grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:4px;display:grid}.pitch-testing-visualization .error-item{background:var(--bg-secondary);color:var(--text-secondary);border-radius:4px;padding:3px 6px;font-size:.7rem}.close-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:0 8px;font-size:1.5rem;line-height:1}.close-btn:hover{color:var(--text-primary)}.pitch-testing-controls input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--bg-tertiary);cursor:pointer;border-radius:3px;outline:none;width:100%;height:6px;margin:4px 0}.pitch-testing-controls input[type=range]::-moz-range-track{background:var(--bg-tertiary);border:none;border-radius:3px;height:6px}.pitch-testing-controls input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--accent);cursor:pointer;border:2px solid var(--bg-card);border-radius:50%;width:16px;height:16px;transition:transform .1s;box-shadow:0 1px 4px #0000004d}.pitch-testing-controls input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.15)}.pitch-testing-controls input[type=range]::-moz-range-thumb{background:var(--accent);cursor:pointer;border:2px solid var(--bg-card);border-radius:50%;width:16px;height:16px;box-shadow:0 1px 4px #0000004d}.pitch-testing-controls input[type=range]:disabled{opacity:.4;cursor:not-allowed}.pitch-testing-controls input[type=range]:disabled::-webkit-slider-thumb{cursor:not-allowed}.pitch-testing-controls input[type=range]:disabled::-moz-range-thumb{cursor:not-allowed}.slider-value-badge{font-variant-numeric:tabular-nums;background:var(--accent);color:#fff;vertical-align:middle;border-radius:8px;padding:1px 6px;font-size:.65rem;font-weight:600;display:inline-block}.slider-range-labels{color:var(--text-muted);justify-content:space-between;margin-top:-2px;font-size:.6rem;display:flex}.pitch-testing-controls .freq-slider{margin-top:6px}.test-running-hint{color:var(--accent);margin:0 0 10px;font-size:.72rem;font-style:italic}.test-description{color:var(--text-muted);margin:0 0 10px;font-size:.68rem;line-height:1.4}.test-summary-bar{flex-wrap:wrap;gap:8px;margin-bottom:12px;display:flex}.test-summary-item{background:var(--bg-tertiary);border-radius:6px;flex-direction:column;align-items:center;min-width:56px;padding:6px 14px;display:flex}.test-summary-item.passed{background:var(--green-dim)}.test-summary-item.failed{background:var(--red-dim)}.test-summary-item.rate{background:var(--bg-tertiary);border:1px solid var(--border)}.test-summary-label{text-transform:uppercase;letter-spacing:.04em;color:var(--text-muted);margin-bottom:1px;font-size:.6rem}.test-summary-value{font-variant-numeric:tabular-nums;color:var(--text-primary);font-size:.9rem;font-weight:700}.test-summary-item.passed .test-summary-value{color:var(--green)}.test-summary-item.failed .test-summary-value{color:var(--red)}.test-table-scroll{border:1px solid var(--border);border-radius:6px;max-height:360px;overflow-y:auto}.test-results-table{table-layout:fixed;border-collapse:collapse;width:100%;font-size:.72rem}.test-results-table thead{z-index:1;position:sticky;top:0}.test-results-table th{text-align:left;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);background:var(--bg-tertiary);border-bottom:1px solid var(--border);padding:7px 10px;font-size:.65rem}.test-results-table th:first-child{width:13%}.test-results-table th:nth-child(2){width:19%}.test-results-table th:nth-child(3){text-align:right;width:19%}.test-results-table th:nth-child(4){text-align:right;width:15%}.test-results-table th:nth-child(5){text-align:center;width:14%}.test-results-table td{border-bottom:1px solid var(--border-subtle);padding:6px 10px}.test-results-table tbody tr:last-child td{border-bottom:none}.test-results-table .row-pass{background:0 0}.test-results-table .row-fail{background:#f851490f}.test-note-name{font-variant-numeric:tabular-nums;color:var(--text-primary);font-weight:600}.test-note-freq{font-variant-numeric:tabular-nums;color:var(--text-secondary)}.test-note-result{text-align:right;font-variant-numeric:tabular-nums}.test-note-error{text-align:right;font-variant-numeric:tabular-nums;color:var(--text-secondary)}.test-note-status{text-align:center}.result-badge{font-variant-numeric:tabular-nums;border-radius:10px;padding:2px 8px;font-size:.68rem;font-weight:600;display:inline-block}.result-badge.pass{background:var(--green-dim);color:var(--green)}.result-badge.fail{background:var(--red-dim);color:var(--red)}.preset-buttons{gap:6px;margin-bottom:6px;display:flex}.btn-preset{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);cursor:pointer;border-radius:4px;padding:3px 8px;font-size:.68rem;transition:all .15s}.btn-preset.active{background:var(--accent-dim,#007aff26);border-color:var(--accent,#007aff);color:var(--accent,#007aff);font-weight:600}.btn-preset:hover:not(:disabled){border-color:var(--text-muted)}.btn-preset:disabled{opacity:.5;cursor:not-allowed}.icon-svg{vertical-align:-.25em;fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;stroke-linejoin:round;width:20px;height:20px;display:inline-block}.icon-svg.w-24{width:24px;height:24px}.icon-svg.w-32{width:32px;height:32px}.icon-svg.w-40{width:40px;height:40px}.icon-svg.w-48{width:48px;height:48px}.icon-avatar{width:32px;height:32px}.icon-avatar.w-48{width:48px;height:48px}.community-panel,.leaderboard-panel,.vocal-challenges-panel{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:400px;padding:2rem;animation:.3s ease-in-out fadeIn;display:flex}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.vocal-challenges-panel{justify-content:flex-start;align-items:stretch;padding:1.5rem}#falling-notes-panel{background:#0d1117;flex-direction:column;gap:8px;height:100%;padding:8px 8px 40px;display:flex}#falling-notes-song-picker{flex-shrink:0}.fn-picker-row{align-items:center;gap:8px;display:flex}.fn-song-select{color:#c9d1d9;background:#161b22;border:1px solid #30363d;border-radius:6px;flex:1;padding:8px 12px;font-size:14px}.fn-btn{color:#c9d1d9;cursor:pointer;white-space:nowrap;background:#21262d;border:1px solid #30363d;border-radius:6px;padding:8px 16px;font-size:14px}.fn-btn:hover:not(:disabled){background:#30363d}.fn-btn:disabled{opacity:.4;cursor:default}.fn-btn-play{background:#238636;border-color:#2ea043}.fn-btn-play:hover:not(:disabled){background:#2ea043}.fn-btn-pause{background:#9e6a03;border-color:#bb8009}.fn-btn-pause:hover:not(:disabled){background:#bb8009}.fn-btn-reset{background:#da3633;border-color:#f85149}.fn-btn-reset:hover:not(:disabled){background:#f85149}.fn-btn-mic{background:#1f6feb;border-color:#388bfd}.fn-btn-mic:hover:not(:disabled){background:#388bfd}.fn-import-status{color:#8b949e;margin-top:6px;font-size:12px}#falling-notes-canvas-container{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:manipulation;background:#0d1117;border:1px solid #21262d;border-radius:6px;flex:1;min-height:300px;overflow:hidden}.bpm-display-label{color:#f0f6fc;white-space:nowrap;padding:0 6px;font-size:13px;font-weight:600}#fn-game-controls{justify-content:center;gap:8px;padding:4px 0;display:flex}.fn-score-overlay{z-index:100;background:#000000b3;border-radius:6px;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.fn-score-card{text-align:center;color:#c9d1d9;background:#161b22;border:1px solid #30363d;border-radius:12px;padding:32px 48px}.fn-score-card h2{color:#f0f6fc;margin-bottom:12px;font-size:24px}.fn-score-grade{color:#3fb950;margin-bottom:8px;font-size:32px;font-weight:700}.fn-score-pct{color:#f0f6fc;margin-bottom:8px;font-size:48px;font-weight:700}.fn-score-detail{color:#8b949e;margin-bottom:20px;font-size:14px}.fn-score-card .fn-btn{padding:10px 32px;font-size:16px}.fn-score-actions{justify-content:center;gap:12px;display:flex}.fn-btn-close{color:#8b949e;cursor:pointer;background:#30363d;border:1px solid #484f58;border-radius:6px;padding:8px 24px;font-size:14px;transition:background .15s}.fn-btn-close:hover{color:#f0f6fc;background:#484f58}.vocal-analysis-tab{width:100%;height:100%;padding:20px;overflow-y:auto}.vocal-header{justify-content:space-between;align-items:center;margin-bottom:24px;display:flex}.vocal-header-content h2{color:var(--text-primary);margin:0;font-size:1.5rem}.vocal-subtitle{color:var(--text-muted);margin:8px 0 0;font-size:.875rem}.analyze-btn{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:8px;padding:10px 20px;font-weight:500;transition:all .2s}.analyze-btn:hover:not(:disabled){background:var(--accent);opacity:.9}.analyze-btn:disabled{opacity:.5;cursor:not-allowed}.vocal-grid{grid-template-columns:320px 1fr;gap:24px;height:calc(100% - 80px);display:grid}.vocal-column-left{flex-direction:column;gap:16px;display:flex}.vocal-column-right{flex-direction:column;gap:16px;height:100%;display:flex;overflow-y:auto}.stat-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;padding:16px}.stat-card h3{color:var(--text-primary);margin:0 0 12px;font-size:1rem}.streak-card{align-items:center;gap:12px;display:flex}.streak-number{color:var(--accent);font-size:1.5rem;font-weight:700}.streak-label{color:var(--text-muted);font-size:.75rem}.streak-divider{background:var(--border);width:1px;height:48px}.chart-bar-container{flex-direction:column;gap:8px;display:flex}.chart-bar-wrapper{align-items:center;gap:8px;display:flex}.chart-bar{border-radius:4px;flex:1;min-height:24px;transition:height .3s}.chart-label{color:var(--text-muted);min-width:40px;font-size:.75rem}.chart-score{min-width:30px;font-size:.75rem;font-weight:600}.chart-legend{color:var(--text-muted);justify-content:space-between;margin-top:8px;font-size:.75rem;display:flex}.session-list{flex-direction:column;gap:8px;display:flex}.session-item{background:var(--bg-tertiary);border-radius:6px;justify-content:space-between;align-items:center;padding:8px 12px;display:flex}.session-info{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.session-name{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:.875rem;font-weight:500;overflow:hidden}.session-date{color:var(--text-muted);font-size:.75rem}.session-score{align-items:center;gap:8px;min-width:100px;display:flex}.score-value{font-size:.875rem;font-weight:600}.score-bar{background:var(--bg-primary);border-radius:3px;flex:1;height:6px;overflow:hidden}.score-fill{border-radius:3px;height:100%;transition:width .3s}.no-sessions{text-align:center;color:var(--text-muted);padding:24px;font-size:.875rem;font-style:italic}.vocal-techniques{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;padding:16px}.technique-grid{grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:16px;display:grid}.technique-card{border:1px solid var(--border);background:var(--bg-tertiary);cursor:pointer;border-radius:8px;flex-direction:column;align-items:center;gap:6px;padding:12px;transition:all .2s;display:flex}.technique-card:hover{border-color:var(--accent)}.technique-card.active{border-color:var(--accent);background:var(--accent-dim);box-shadow:0 0 12px var(--accent-glow)}.technique-card.active .exercise-name{color:var(--accent)}.exercise-icon{font-size:1.5rem}.exercise-name{color:var(--text-primary);font-size:.75rem;font-weight:500}.exercise-result{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;padding:16px}.exercise-result h4{color:var(--text-primary);margin:0 0 16px;font-size:1.1rem}.analyzing-overlay{flex-direction:column;justify-content:center;align-items:center;gap:16px;padding:40px;display:flex}.analyzing-spinner{border:3px solid var(--accent-dim);border-top-color:var(--accent);border-radius:50%;width:40px;height:40px;animation:1s linear infinite spin}.community-share-tab{width:100%;height:100%;padding:20px;overflow-y:auto}.community-header{justify-content:space-between;align-items:center;margin-bottom:24px;display:flex}.community-header-content h2{color:var(--text-primary);margin:0;font-size:1.5rem}.community-subtitle{color:var(--text-muted);margin:8px 0 0;font-size:.875rem}.community-actions{gap:12px;display:flex}.share-btn{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:8px;align-items:center;gap:8px;padding:10px 20px;font-weight:500;transition:all .2s;display:flex}.share-btn:hover{background:var(--accent);opacity:.9}.search-filter-bar{gap:12px;margin-bottom:16px;display:flex}.search-input{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-primary);border-radius:8px;flex:1;padding:10px 16px;font-size:.875rem}.search-input:focus{border-color:var(--accent);outline:none}.sort-select select{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-primary);cursor:pointer;border-radius:8px;padding:10px 16px;font-size:.875rem}.community-tabs{border-bottom:1px solid var(--border);gap:8px;margin-bottom:16px;padding-bottom:16px;display:flex}.community-tab{background:var(--bg-secondary);border:1px solid var(--border);cursor:pointer;border-radius:8px;align-items:center;gap:8px;padding:10px 16px;transition:all .2s;display:flex}.community-tab:hover{border-color:var(--accent)}.community-tab.active{background:var(--accent-dim);border-color:var(--accent)}.tab-icon{font-size:1.2rem}.tab-name{color:var(--text-primary);font-weight:500}.tab-count{background:var(--bg-primary);color:var(--text-muted);border-radius:10px;margin-left:auto;padding:2px 8px;font-size:.75rem}.community-content{min-height:calc(100% - 180px)}.melodies-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;display:grid}.melody-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;padding:16px;transition:all .2s}.melody-card:hover{border-color:var(--accent);transform:translateY(-2px)}.melody-header{justify-content:space-between;align-items:flex-start;margin-bottom:12px;display:flex}.melody-name{color:var(--text-primary);margin:0 0 4px;font-size:1.1rem}.melody-date{color:var(--text-muted);font-size:.75rem}.melody-info{margin-bottom:12px}.melody-author{color:var(--text-muted);font-size:.875rem;display:block}.melody-tags{flex-wrap:wrap;gap:6px;margin-top:4px;display:flex}.tag{background:var(--bg-tertiary);color:var(--text-muted);border-radius:4px;padding:2px 8px;font-size:.75rem}.melody-footer{gap:8px;display:flex}.action-btn{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-primary);cursor:pointer;border-radius:6px;flex:1;padding:8px 12px;font-size:.875rem;transition:all .2s}.action-btn:hover{border-color:var(--accent)}.action-btn.copy-btn{background:var(--accent-dim)}.sessions-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;display:grid}.session-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;padding:16px}.session-header{justify-content:space-between;align-items:flex-start;margin-bottom:12px;display:flex}.session-name{color:var(--text-primary);margin:0 0 4px;font-size:1.1rem}.session-scores{gap:4px;display:flex}.session-score-badge{background:var(--bg-tertiary);width:24px;height:24px;color:var(--text-primary);border-radius:4px;justify-content:center;align-items:center;font-size:.7rem;font-weight:600;display:flex}.session-info{gap:16px;margin-bottom:12px;display:flex}.session-author,.session-date{color:var(--text-muted);font-size:.875rem}.session-stats{background:var(--bg-tertiary);border-radius:8px;gap:16px;margin-bottom:12px;padding:12px;display:flex}.stat-value{font-weight:600}.empty-state{text-align:center;flex-direction:column;grid-column:1/-1;align-items:center;padding:60px 20px;display:flex}.empty-icon{margin-bottom:16px;font-size:4rem}.empty-state h3{color:var(--text-primary);margin:0 0 8px;font-size:1.25rem}.empty-state p{color:var(--text-muted);margin:0 0 20px}.primary-btn{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:8px;padding:12px 24px;font-size:1rem;font-weight:500}.profile-container{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;padding:24px}.profile-header{border-bottom:1px solid var(--border);gap:20px;margin-bottom:24px;padding-bottom:20px;display:flex}.profile-avatar{background:var(--bg-tertiary);border:2px solid var(--accent);border-radius:50%;justify-content:center;align-items:center;width:80px;height:80px;font-size:2.5rem;display:flex}.profile-info{flex:1}.profile-stats-row{gap:16px;display:flex}.stat-badge{background:var(--bg-tertiary);border-radius:8px;flex-direction:column;align-items:center;min-width:80px;padding:12px 16px;display:flex}.stat-label{color:var(--text-muted);margin-bottom:4px;font-size:.7rem}.stat-value{font-size:1.1rem;font-weight:600}.stat-value.streak{color:#f85149}.stat-value.score{color:var(--green)}.stat-value.accuracy{color:var(--teal)}.profile-charts{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px;margin-bottom:24px;display:grid}.chart-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;padding:16px}.chart-card h3{color:var(--text-primary);margin:0 0 16px;font-size:1rem}.mini-chart{justify-content:space-between;align-items:flex-end;gap:4px;height:100px;display:flex}.mini-bar-wrapper{flex:1;align-items:flex-end;height:100%;display:flex}.mini-bar{border-radius:4px 4px 0 0;width:100%;transition:height .3s}.mini-bar.line-chart{background:var(--accent);border-radius:2px}.personal-records{margin-bottom:24px}.personal-records h3{color:var(--text-primary);margin:0 0 16px;font-size:1rem}.records-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;display:grid}.record-item{background:var(--bg-tertiary);border-radius:8px;align-items:center;gap:12px;padding:12px;display:flex}.record-icon{font-size:1.5rem}.record-info{flex-direction:column;gap:2px;display:flex}.record-label{color:var(--text-muted);font-size:.75rem}.record-value{color:var(--text-primary);font-size:.9rem;font-weight:600}.shared-content-preview{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;padding:16px}.shared-content-preview h3{color:var(--text-primary);margin:0 0 16px;font-size:1rem}.preview-list{flex-direction:column;gap:16px;display:flex}.preview-section h4{color:var(--text-muted);margin:0 0 12px;font-size:.875rem}.preview-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px;display:grid}.preview-card{background:var(--bg-tertiary);border-radius:6px;padding:8px}.preview-name{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;margin-bottom:4px;font-size:.8rem;display:block;overflow:hidden}.preview-date,.preview-scores{color:var(--text-muted);font-size:.7rem;display:block}.preview-scores{flex-wrap:wrap;gap:4px;display:flex}.share-page{justify-content:center;align-items:center;min-height:100%;padding:40px;display:flex}.share-container{width:100%;max-width:800px}.share-content{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;padding:32px}.share-header h1{color:var(--text-primary);margin:0 0 8px;font-size:1.75rem}.share-subtitle{color:var(--text-muted);margin:0 0 24px}.share-body{margin-bottom:32px}.info-section,.details-section{margin-bottom:24px}.info-section h3,.details-section h3{color:var(--text-primary);margin:0 0 16px;font-size:1.1rem}.info-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px;display:grid}.info-item{flex-direction:column;gap:4px;display:flex}.info-label{color:var(--text-muted);font-size:.75rem}.info-value{color:var(--text-primary);font-size:1rem;font-weight:500}.results-list{flex-direction:column;gap:8px;display:flex}.result-item{background:var(--bg-tertiary);border-radius:6px;justify-content:space-between;align-items:center;padding:12px;display:flex}.result-index{color:var(--text-primary);font-weight:500}.result-score{--score:85%;background:linear-gradient(90deg,var(--score-color,var(--accent)) var(--score),var(--bg-primary) 0);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:1.1rem;font-weight:600}.stats-row{gap:16px;display:flex}.tags-section{margin-bottom:24px}.tags-section h3{color:var(--text-primary);margin:0 0 12px;font-size:1.1rem}.tags-container{flex-wrap:wrap;gap:8px;display:flex}.tags-container .tag{background:var(--bg-tertiary);border-radius:16px;padding:6px 12px;font-size:.875rem}.notes-section{margin-bottom:24px}.notes-section h3{color:var(--text-primary);margin:0 0 16px;font-size:1.1rem}.notes-grid{background:var(--bg-tertiary);border-radius:8px;overflow:hidden}.notes-header{background:var(--bg-secondary);border-bottom:1px solid var(--border);color:var(--text-muted);text-transform:uppercase;grid-template-columns:repeat(3,1fr);gap:12px;padding:12px;font-size:.75rem;font-weight:600;display:grid}.note-row{border-bottom:1px solid var(--border);grid-template-columns:repeat(3,1fr);gap:12px;padding:10px 12px;font-size:.875rem;display:grid}.note-row:last-child{border-bottom:none}.note-column{text-align:center}.note-column:first-child{text-align:left;color:var(--accent);font-weight:500}.share-footer{gap:12px;display:flex}.share-footer .share-btn,.share-footer .load-btn{flex:1}.load-btn{background:var(--accent-dim);color:var(--accent)}.error-state{text-align:center;padding:60px 20px}.error-icon{margin-bottom:16px;font-size:4rem}.error-state h2{color:var(--text-primary);margin:0 0 12px;font-size:1.5rem}.error-state p{color:var(--text-muted);margin:0 0 24px}.back-btn{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-primary);cursor:pointer;border-radius:8px;padding:12px 24px}@media(max-width:768px){.profile-header{text-align:center;flex-direction:column}.profile-stats-row{justify-content:center}.notes-header,.note-row{grid-template-columns:1fr}.note-column:first-child{text-align:center}}.result-card{background:var(--bg-tertiary);border-radius:8px;padding:16px}.result-empty{text-align:center;color:var(--text-muted)}.result-empty p{margin:0 0 16px}.start-analysis-btn{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:6px;padding:8px 16px}.result-good{color:var(--green)}.result-neutral{color:var(--text-muted)}.result-header{justify-content:space-between;align-items:center;margin-bottom:12px;font-size:.875rem;font-weight:500;display:flex}.result-feedback{border-radius:6px;margin-bottom:16px;padding:12px;font-size:.875rem;line-height:1.5}.result-metrics{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.metric-item{background:var(--bg-secondary);border-radius:6px;flex-direction:column;gap:4px;padding:8px;display:flex}.metric-label{color:var(--text-muted);font-size:.7rem}.metric-value{color:var(--text-primary);font-size:.9rem;font-weight:600}.spectrogram-display{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;padding:16px}.spectrogram-container{background:var(--bg-tertiary);border-radius:8px;width:100%;height:200px;position:relative;overflow:hidden}.spectrogram-grid{grid-template-rows:1fr 60px;grid-template-columns:60px 1fr;height:100%;display:grid}.freq-axis{border-right:1px solid var(--border);flex-direction:column;justify-content:space-between;padding:8px 0;display:flex}.freq-label{color:var(--text-muted);text-align:right;font-size:.7rem}.time-axis{border-top:1px solid var(--border);background:var(--bg-primary);justify-content:space-between;align-items:center;padding:0 8px;display:flex}.time-label{color:var(--text-muted);font-size:.7rem}.spectrogram-bars{background:linear-gradient(90deg,#d92626,#d9d926,#26d926 66%,#26d9d9);grid-area:1/2;gap:1px;display:flex;overflow:hidden}.spectrogram-bar{flex:1;min-width:2px;transition:height .1s}.spectrogram-legend{color:var(--text-muted);gap:16px;margin-top:8px;font-size:.75rem;display:flex}.pitch-history{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;padding:16px}.pitch-canvas-container{background:var(--bg-tertiary);border-radius:8px;width:100%;height:180px;position:relative}.pitch-grid{grid-template-rows:repeat(12,1fr);grid-template-columns:50px 1fr;height:100%;display:grid}.pitch-lines{grid-area:1/2/-1;position:relative}.pitch-line{background:var(--border);width:100%;height:1px;position:absolute}.pitch-notes{grid-area:1/2/-1;width:100%;height:100%;position:relative}.pitch-dot{background:var(--accent);border-radius:50%;width:8px;height:8px;transition:all .1s;position:absolute;transform:translate(-50%,-50%)}.pitch-dot:after{content:attr(data-note);color:var(--text-muted);white-space:nowrap;font-size:.65rem;position:absolute;top:-20px;left:50%;transform:translate(-50%)}.pitch-dot.good{background:var(--green);box-shadow:0 0 8px var(--green)}.pitch-legend{color:var(--text-muted);gap:16px;margin-top:8px;font-size:.75rem;display:flex}.dot{border-radius:50%;width:8px;height:8px;margin-right:4px;display:inline-block}.dot.good{background:var(--green)}.dot.bad{background:var(--red)}.app-tab svg{vertical-align:middle;margin-right:6px;display:inline-block}.leaderboard-panel{width:100%;height:100%;padding:20px;overflow-y:auto}.leaderboard-header{justify-content:space-between;align-items:center;margin-bottom:24px;display:flex}.leaderboard-header-content h2{color:var(--text-primary);margin:0;font-size:1.5rem}.leaderboard-subtitle{color:var(--text-muted);margin:8px 0 0;font-size:.875rem}.leaderboard-tabs{gap:12px;margin-bottom:20px;display:flex}.leaderboard-tab{background:var(--bg-secondary);border:1px solid var(--border);max-width:160px;color:var(--text-muted);cursor:pointer;border-radius:8px;flex:1;align-items:center;gap:8px;padding:12px 16px;font-size:.875rem;font-weight:500;transition:all .2s;display:flex}.leaderboard-tab:hover{background:var(--bg-tertiary);border-color:var(--accent)}.leaderboard-tab.active{background:var(--accent);color:#fff;border-color:var(--accent)}.category-tab:hover{background:var(--bg-tertiary);border-color:var(--accent)}.search-container{gap:12px;margin-bottom:24px;display:flex}.search-input{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-primary);border-radius:8px;outline:none;flex:1;padding:10px 16px;font-size:.875rem;transition:border-color .2s}.search-input:focus{border-color:var(--accent)}.filter-btn{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-muted);cursor:pointer;border-radius:8px;align-items:center;gap:6px;padding:10px 16px;font-size:.875rem;font-weight:500;display:flex}.filter-btn:hover{background:var(--bg-tertiary);border-color:var(--accent)}.weekly-challenges{margin-bottom:32px}.weekly-challenges-title{color:var(--text-primary);margin:0 0 8px;font-size:1.25rem}.weekly-challenges-desc{color:var(--text-muted);margin:0 0 24px;font-size:.9rem}.challenges-grid{gap:16px;display:grid}.challenge-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;grid-template-columns:60px 1fr auto;align-items:start;gap:16px;padding:16px;transition:all .2s;display:grid}.challenge-card:hover{border-color:var(--accent);transform:translateY(-2px)}.challenge-icon{text-align:center;font-size:2rem}.challenge-content{min-width:0}.challenge-name{color:var(--text-primary);margin:0 0 6px;font-size:1rem;font-weight:600}.challenge-desc{color:var(--text-muted);margin:0 0 12px;font-size:.85rem}.challenge-stats{color:var(--text-muted);gap:16px;font-size:.8rem;display:flex}.challenge-progress{flex-direction:column;align-items:flex-end;gap:6px;display:flex}.progress-fill{background:var(--accent);border-radius:4px;height:100%;transition:width .3s}.progress-text{color:var(--text-muted);font-size:.75rem}.challenge-join-btn{background:var(--accent);color:#fff;cursor:pointer;white-space:nowrap;border:none;border-radius:6px;padding:8px 16px;font-size:.875rem;font-weight:500;transition:all .2s}.challenge-join-btn:hover:not(:disabled){background:var(--accent);opacity:.9}.challenge-join-btn:disabled{opacity:.5;cursor:not-allowed}.podium-section{background:var(--bg-secondary);border-radius:16px;justify-content:center;gap:16px;margin-bottom:24px;padding:24px 0;display:flex}.podium-item{border-radius:12px;flex-direction:column;align-items:center;padding:12px;transition:all .2s;display:flex}.podium-1{background:linear-gradient(#ffd7001a,#0000);border:1px solid #ffd7004d}.podium-2{background:linear-gradient(#c0c0c01a,#0000);border:1px solid #c0c0c04d}.podium-3{background:linear-gradient(#cd7f321a,#0000);border:1px solid #cd7f324d}.podium-rank{margin-bottom:8px;font-size:1.25rem}.podium-avatar{background:var(--bg-tertiary);border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;margin-bottom:8px;font-size:1.5rem;display:flex}.podium-name{color:var(--text-primary);text-align:center;margin-bottom:4px;font-weight:500}.podard-score{color:var(--text-muted);font-size:.85rem}.podium-score-display{color:var(--accent);font-size:1.5rem;font-weight:700}.leaderboard-content{background:var(--bg-secondary);border-radius:12px;overflow:hidden}.leaderboard-table-container{overflow-x:auto}.leaderboard-table{border-collapse:collapse;width:100%}.leaderboard-table thead{background:var(--bg-tertiary)}.leaderboard-table th{text-align:left;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;padding:12px 16px;font-size:.8rem;font-weight:600}.leaderboard-table td{border-bottom:1px solid var(--border);padding:12px 16px}.leaderboard-table tbody tr{cursor:pointer;transition:background-color .2s}.leaderboard-table tbody tr:hover{background:var(--bg-tertiary)}.leaderboard-table tbody tr.is-me{background:rgba(var(--accent),.1);border-left:3px solid var(--accent)}.leaderboard-row:last-child td{border-bottom:none}.rank-th{text-align:center;width:60px}.user-th{min-width:200px}.score-th{text-align:right;width:100px}.streak-th{text-align:center;width:60px}.sessions-th,.best-th{text-align:center;width:70px}.rank-td{text-align:center;color:var(--text-muted)}.user-td,.user-cell{align-items:center;gap:12px;display:flex}.user-avatar{background:var(--bg-tertiary);border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;font-size:1rem;display:flex}.user-details{flex-direction:column;gap:2px;display:flex}.user-name{color:var(--text-primary);font-weight:500}.user-streak-badge{color:var(--teal);background:rgba(var(--teal),.1);border-radius:4px;width:-moz-fit-content;width:fit-content;padding:2px 6px;font-size:.7rem}.score-td{text-align:right;color:var(--text-primary);font-weight:600}.streak-td{text-align:center}.streak-bar{background:var(--bg-tertiary);border-radius:3px;width:36px;height:6px;margin:0 auto;overflow:hidden}.streak-fill{border-radius:3px;height:100%;transition:width .3s}.streak-count{color:var(--text-muted);margin-top:2px;font-size:.75rem;display:block}.load-more-container{text-align:center;padding:24px}.load-more-btn{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-primary);cursor:pointer;border-radius:8px;padding:12px 32px;font-weight:500;transition:all .2s}.load-more-btn:hover{background:var(--bg-tertiary);border-color:var(--accent)}.leaderboard-profile-modal{z-index:1000;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.profile-modal-backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0009;position:absolute;inset:0}.profile-modal-content{background:var(--bg-secondary);border:1px solid var(--border);border-radius:16px;width:90%;max-width:500px;max-height:90vh;padding:24px;position:relative;overflow-y:auto}.profile-modal-close{background:var(--bg-tertiary);width:32px;height:32px;color:var(--text-muted);cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;font-size:1.25rem;transition:all .2s;display:flex;position:absolute;top:16px;right:16px}.profile-modal-close:hover{background:var(--accent);color:#fff}.profile-header{text-align:center;gap:16px;margin-bottom:24px;display:flex}.profile-avatar-large{background:var(--bg-tertiary);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:80px;height:80px;font-size:2.5rem;display:flex}.profile-header-info{flex-direction:column;flex:1;justify-content:center;display:flex}.profile-rank-badge{background:linear-gradient(135deg,var(--accent),var(--teal));color:#fff;border-radius:20px;align-self:center;margin-bottom:8px;padding:4px 12px;font-size:.8rem;font-weight:600;display:inline-block}.profile-name{color:var(--text-primary);margin:0 0 8px;font-size:1.5rem}.profile-bio{color:var(--text-muted);margin:0 0 8px;font-size:.9rem}.profile-stats-grid{grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:24px;display:grid}.stat-card{background:var(--bg-tertiary);border-radius:12px;align-items:center;gap:12px;padding:16px;display:flex}.stat-content{flex-direction:column;gap:2px;display:flex}.profile-charts{margin-bottom:24px}.profile-charts h4{color:var(--text-primary);margin:0 0 12px;font-size:1rem}.profile-actions{gap:12px;display:flex}.profile-follow-btn{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:8px;flex:1;padding:12px;font-weight:600;transition:all .2s}.profile-follow-btn:hover{background:var(--accent);opacity:.9}.profile-view-btn{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--text-primary);cursor:pointer;border-radius:8px;flex:1;padding:12px;font-weight:600;transition:all .2s}.profile-view-btn:hover{background:var(--border)}@media(max-width:900px){.vocal-grid{grid-template-columns:1fr}.vocal-column-left{grid-template-columns:repeat(2,1fr);display:grid}.podium-section{flex-direction:column;align-items:center}.challenge-card{grid-template-columns:50px 1fr;gap:12px}.challenge-progress{flex-direction:row;grid-column:2;justify-content:flex-end;align-items:center;gap:8px}.profile-stats-grid{grid-template-columns:1fr}}.vocal-challenges-panel{width:100%;height:100%;padding:20px;overflow-y:auto}.challenges-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin-bottom:24px;display:flex}.challenges-header-content h2{color:var(--text-primary);margin:0;font-size:1.5rem}.challenges-subtitle{color:var(--text-muted);margin:8px 0 0;font-size:.875rem}.streak-card{background:linear-gradient(135deg,var(--accent),var(--teal));color:#fff;border-radius:12px;align-items:center;gap:12px;padding:12px 16px;display:flex}.streak-icon{font-size:2rem}.streak-info{flex-direction:column;gap:2px;display:flex}.streak-label{opacity:.9;font-size:.75rem}.streak-value{font-size:1.25rem;font-weight:700}.category-tabs{flex-wrap:wrap;gap:10px;margin-bottom:24px;display:flex}.category-tab{background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-muted);cursor:pointer;border-radius:20px;align-items:center;gap:6px;padding:10px 18px;font-size:.85rem;font-weight:500;transition:all .2s;display:flex}.category-tab:hover:not(:disabled){background:var(--bg-tertiary);border-color:var(--accent)}.category-tab:disabled{opacity:.5;cursor:not-allowed}.category-tab.active{background:var(--accent);color:#fff;border-color:var(--accent)}.cat-icon{font-size:1rem}.cat-name{margin-right:6px}.cat-count{background:var(--bg-tertiary);color:var(--text-muted);border-radius:10px;padding:2px 8px;font-size:.75rem}.challenges-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;margin-bottom:32px;display:grid}.challenge-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:12px;flex-direction:column;gap:12px;padding:16px;transition:all .2s;display:flex}.challenge-card:hover{border-color:var(--accent);transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.challenge-card.completed{border-color:var(--green);background:linear-gradient(135deg,rgba(var(--green),.1),transparent)}.challenge-card.in-progress{border-color:var(--accent)}.challenge-card.locked{opacity:.6;cursor:not-allowed}.challenge-header{justify-content:space-between;align-items:center;display:flex}.challenge-icon-large{font-size:1.5rem}.challenge-status{background:var(--bg-tertiary);border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;font-size:1.25rem;display:flex}.challenge-body{flex-direction:column;gap:8px;display:flex}.challenge-title{color:var(--text-primary);margin:0;font-size:1rem;font-weight:600}.challenge-desc{color:var(--text-muted);margin:0;font-size:.85rem;line-height:1.4}.challenge-stats{gap:12px;display:flex}.stat-item{color:var(--text-muted);align-items:center;gap:4px;font-size:.8rem;display:flex}.stat-icon{font-size:.9rem}.stat-value{color:var(--text-primary);font-weight:600}.challenge-progress{flex-direction:column;gap:4px;display:flex}.progress-bar{background:var(--bg-tertiary);border-radius:4px;width:100%;height:8px;overflow:hidden}.progress-fill{border-radius:4px;height:100%;transition:width .3s}.progress-label{color:var(--text-muted);text-align:right;font-size:.75rem}.challenge-action-btn{color:#fff;cursor:pointer;border:none;border-radius:8px;padding:10px;font-size:.875rem;font-weight:600;transition:all .2s}.challenge-action-btn.completed{background:var(--green)}.challenge-action-btn.in-progress{background:var(--accent)}.challenge-action-btn.not-started{background:var(--teal)}.challenge-action-btn.locked{background:var(--text-muted);cursor:not-allowed}.badges-section{margin-bottom:32px}.section-title{color:var(--text-primary);margin:0 0 16px;font-size:1.25rem}.badges-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;display:grid}.badge-item{background:var(--bg-secondary);text-align:center;border-radius:12px;flex-direction:column;align-items:center;gap:8px;padding:12px;transition:all .2s;display:flex}.badge-item.earned{border:2px solid var(--accent);background:linear-gradient(135deg,rgba(var(--accent),.1),transparent)}.badge-item.locked{opacity:.5}.badge-icon{font-size:2rem}.badge-info{flex-direction:column;gap:4px;display:flex}.badge-name{color:var(--text-primary);font-size:.875rem;font-weight:600}.badge-tier{color:var(--text-muted);font-size:.7rem}.badge-check{color:var(--green);font-size:1rem;position:absolute;top:4px;right:4px}.achievements-section{margin-bottom:32px}.achievements-list{flex-direction:column;gap:12px;display:flex}.achievement-item{background:var(--bg-secondary);border-radius:12px;align-items:flex-start;gap:12px;padding:12px;display:flex}.achievement-item.unlocked{border:1px solid var(--accent);background:linear-gradient(135deg,rgba(var(--accent),.1),transparent)}.achievement-item.locked{opacity:.5}.achievement-icon{flex-shrink:0;font-size:2rem}.achievement-content{flex:1;min-width:0}.achievement-header{justify-content:space-between;align-items:center;gap:12px;margin-bottom:4px;display:flex}.achievement-name{color:var(--text-primary);font-size:.9rem;font-weight:600}.achievement-points{color:var(--accent);font-size:.75rem;font-weight:600}.achievement-desc{color:var(--text-muted);margin:0 0 8px;font-size:.85rem;line-height:1.4}.achievement-progress{flex-direction:column;gap:4px;display:flex}.achievement-progress .progress-label{color:var(--text-muted);justify-content:space-between;align-items:center;font-size:.8rem;display:flex}.achievement-locked{background:var(--bg-tertiary);width:28px;height:28px;color:var(--text-muted);border-radius:50%;justify-content:center;align-self:flex-end;align-items:center;font-size:1rem;display:flex}.challenge-modal{z-index:1000;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0009;position:absolute;inset:0}.modal-content{background:var(--bg-secondary);border:1px solid var(--border);border-radius:16px;width:90%;max-width:500px;max-height:90vh;padding:24px;position:relative;overflow-y:auto}.modal-close{background:var(--bg-tertiary);width:32px;height:32px;color:var(--text-muted);cursor:pointer;border:none;border-radius:50%;justify-content:center;align-items:center;font-size:1.25rem;transition:all .2s;display:flex;position:absolute;top:16px;right:16px}.modal-close:hover{background:var(--accent);color:#fff}.modal-header{text-align:center;flex-direction:column;align-items:center;gap:16px;margin-bottom:20px;display:flex}.modal-icon{font-size:3rem}.modal-title{color:var(--text-primary);margin:8px 0 0;font-size:1.5rem}.modal-desc{color:var(--text-muted);margin:4px 0 0;font-size:.9rem}.modal-stats{grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:20px;display:grid}.stat-card{background:var(--bg-tertiary);text-align:center;border-radius:12px;flex-direction:column;align-items:center;gap:8px;padding:16px;display:flex}.stat-label{color:var(--text-muted);font-size:.75rem}.stat-value{color:var(--accent);font-size:1.5rem;font-weight:700}.modal-instructions{background:var(--bg-tertiary);border-radius:12px;margin-bottom:20px;padding:16px}.modal-instructions h3{color:var(--text-primary);margin:0 0 12px;font-size:1rem}.instructions-list{margin:0;padding-left:20px;list-style:outside}.instructions-list li{color:var(--text-muted);margin-bottom:6px;font-size:.85rem}.modal-progress-large{margin-bottom:20px}.progress-bar-large{background:var(--bg-tertiary);border-radius:6px;width:100%;height:12px;overflow:hidden}.progress-fill-large{border-radius:6px;height:100%;transition:width .3s}.progress-text-large{text-align:center;color:var(--text-muted);margin-top:8px;font-size:.9rem;display:block}.modal-actions{gap:12px;display:flex}.modal-btn{color:#fff;cursor:pointer;border:none;border-radius:8px;flex:1;padding:12px;font-size:.9rem;font-weight:600;transition:all .2s}.modal-btn.secondary{background:var(--bg-tertiary)}.modal-btn.secondary:hover{background:var(--border)}.modal-btn.primary{background:var(--accent)}.modal-btn.primary:hover{background:var(--accent);opacity:.9}.modal-btn.primary:disabled{opacity:.5;cursor:not-allowed}@media(max-width:768px){.challenges-header{flex-direction:column;align-items:stretch}.modal-stats{grid-template-columns:1fr}.modal-actions{flex-direction:column}.badge-item{padding:8px}}@media(max-width:900px){.vocal-grid{grid-template-columns:1fr}.vocal-column-left{grid-template-columns:repeat(2,1fr);display:grid}}.uvr-settings{background:var(--bg-secondary);border:1px solid var(--border);border-radius:8px;margin-top:16px;padding:16px}.uvr-header{margin-bottom:20px}.uvr-header h3{color:var(--text-primary);margin:0 0 4px;font-size:1rem}.uvr-description{color:var(--text-muted);margin:0;font-size:.8rem}.uvr-mode-selection label{color:var(--text-primary);margin-bottom:12px;font-size:.875rem;display:block}.mode-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;display:grid}.mode-card{background:var(--bg-tertiary);border:2px solid var(--border);cursor:pointer;border-radius:8px;flex-direction:column;align-items:center;gap:8px;padding:16px;transition:all .2s;display:flex}.mode-card:hover{border-color:var(--accent);background:var(--bg-secondary)}.mode-card.active{border-color:var(--accent);background:var(--accent-soft)}.mode-icon{width:32px;height:32px;color:var(--text-primary)}.mode-label{color:var(--text-primary);font-size:.875rem}.uvr-intensity-controls{margin:16px 0}.intensity-group{margin-bottom:12px}.intensity-divider{background:var(--border);height:1px;margin:16px 0}.intensity-header{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.intensity-label{color:var(--text-primary);align-items:center;gap:6px;font-size:.875rem;display:flex}.intensity-value{color:var(--accent);font-size:.875rem;font-weight:500}.intensity-slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--bg-tertiary);cursor:pointer;border-radius:3px;outline:none;width:100%;height:6px}.intensity-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--accent);cursor:pointer;border:2px solid var(--bg-primary);border-radius:50%;width:18px;height:18px;transition:transform .15s,box-shadow .15s;box-shadow:0 1px 3px #0003}.intensity-slider::-webkit-slider-thumb:hover{transform:scale(1.15);box-shadow:0 2px 6px #0000004d}.intensity-slider::-moz-range-thumb{background:var(--accent);cursor:pointer;border:2px solid var(--bg-primary);border-radius:50%;width:18px;height:18px;box-shadow:0 1px 3px #0003}.intensity-slider::-moz-range-track{background:var(--bg-tertiary);border-radius:3px;height:6px}.uvr-smoothing{margin:16px 0}.smoothing-header{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.smoothing-label{color:var(--text-primary);align-items:center;gap:6px;font-size:.875rem;display:flex}.smoothing-value{color:var(--accent);font-size:.875rem;font-weight:500}.smoothing-slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--bg-tertiary);cursor:pointer;border-radius:3px;outline:none;width:100%;height:6px}.smoothing-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--accent);cursor:pointer;border:2px solid var(--bg-primary);border-radius:50%;width:18px;height:18px;transition:transform .15s,box-shadow .15s;box-shadow:0 1px 3px #0003}.smoothing-slider::-webkit-slider-thumb:hover{transform:scale(1.15);box-shadow:0 2px 6px #0000004d}.smoothing-slider::-moz-range-thumb{background:var(--accent);cursor:pointer;border:2px solid var(--bg-primary);border-radius:50%;width:18px;height:18px;box-shadow:0 1px 3px #0003}.smoothing-slider::-moz-range-track{background:var(--bg-tertiary);border-radius:3px;height:6px}.uvr-info{background:var(--bg-primary);border:1px solid var(--border);border-radius:10px;margin-top:20px;padding:16px}.info-header{color:var(--text-primary);align-items:center;gap:8px;margin-bottom:12px;font-size:.85rem;font-weight:600;display:flex}.info-icon{width:24px;height:24px;color:var(--accent);flex-shrink:0;justify-content:center;align-items:center;display:flex}.info-icon svg{width:18px;height:18px}.info-list{color:var(--text-muted);flex-direction:column;gap:6px;margin:0;padding:0;font-size:.8rem;list-style:none;display:flex}.info-list li{padding-left:14px;line-height:1.5;position:relative}.info-list li:before{content:"";background:var(--accent);border-radius:50%;width:5px;height:5px;position:absolute;top:8px;left:0}.info-list strong{color:var(--text-primary);font-weight:600}.shortcuts-grid{flex-direction:column;gap:8px;display:flex}.shortcut-item{color:var(--text-muted);align-items:center;gap:10px;font-size:.8rem;display:flex}.shortcut-item kbd{background:var(--bg-tertiary,#21262d);border:1px solid var(--border);min-width:28px;height:22px;font-family:var(--font-mono,"SF Mono", "Fira Code", monospace);color:var(--text-primary);border-radius:4px;justify-content:center;align-items:center;padding:0 6px;font-size:.7rem;font-weight:600;display:inline-flex;box-shadow:0 1px #0000004d}.settings-panel .uvr-settings-wrapper{background:var(--bg-secondary);border:1px solid var(--border);border-radius:6px;margin-top:12px;padding:12px}.settings-panel .uvr-mode-selection label{font-size:.875rem;font-weight:500}.settings-panel .mode-card{padding:12px}.settings-panel .mode-icon{width:28px;height:28px}.settings-panel .mode-label,.settings-panel .intensity-label,.settings-panel .intensity-value{font-size:.8rem}.settings-panel .intensity-slider{height:4px}.settings-panel .smoothing-label,.settings-panel .smoothing-value{font-size:.8rem}.settings-panel .smoothing-slider{height:4px}.settings-panel .uvr-info{padding:10px}.settings-panel .info-list li{padding-left:14px}.uvr-panel{background:var(--bg-secondary);border-radius:1rem 1rem 0 0;flex-direction:column;height:100%;display:flex;overflow:hidden}.panel-header{background:var(--bg-primary);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:1rem 1.25rem;display:flex}.header-left{align-items:center;gap:.75rem;display:flex}.header-icon{color:#fff;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:.75rem;justify-content:center;align-items:center;width:2.5rem;height:2.5rem;display:flex}.header-icon svg{width:1.25rem;height:1.25rem}.header-left h3{color:var(--fg-primary);margin:0;font-size:1.1rem}.header-subtitle{color:var(--fg-secondary);margin:0;font-size:.8rem}.header-actions{gap:.25rem;display:flex}.header-btn{background:var(--bg-tertiary);border:1px solid var(--border);width:2rem;height:2rem;color:var(--fg-primary);cursor:pointer;border-radius:.5rem;justify-content:center;align-items:center;padding:0;transition:all .2s;display:flex}.header-btn:hover{background:var(--bg-hover)}.header-btn-ghost{background:0 0;border-color:#0000}.header-btn-ghost:hover{background:var(--bg-primary)}.header-btn-close:hover{color:var(--error);background:#ef44441a}.panel-content{flex:1;padding-bottom:1.5rem;position:relative;overflow-y:auto}.view-section{min-height:0;padding:1.5rem}.mixer-section{flex-direction:column;height:100%;min-height:0;padding:0;display:flex;overflow:auto}.section-header{justify-content:space-between;align-items:center;margin-bottom:.75rem;display:flex}.section-header h4{color:var(--fg-primary);margin:0;font-size:1.1rem}.guide-toggle{background:var(--bg-primary);border:1px solid var(--border);color:var(--fg-primary);cursor:pointer;border-radius:.5rem;align-items:center;gap:.5rem;padding:.5rem 1rem;font-size:.85rem;transition:all .2s;display:flex}.guide-toggle:hover{background:var(--bg-hover)}.back-btn{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--fg-primary);cursor:pointer;border-radius:.5rem;align-items:center;gap:.5rem;padding:.5rem 1rem;font-size:.85rem;transition:all .2s;display:flex}.back-btn:hover{background:var(--bg-hover)}.guide-modal{z-index:1000;background:#00000080;justify-content:center;align-items:center;padding:2rem;display:flex;position:fixed;inset:0}.guide-container{background:var(--bg-secondary);border-radius:1rem;flex-direction:column;width:620px;max-width:90vw;max-height:90vh;padding:1.5rem;display:flex;overflow:hidden}.guide-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:1.25rem;display:flex}.guide-header h3{color:var(--fg-primary);margin:0}.guide-close{background:var(--bg-tertiary);border:1px solid var(--border);width:2rem;height:2rem;color:var(--fg-primary);cursor:pointer;border-radius:.5rem;justify-content:center;align-items:center;padding:0;display:flex}.guide-close:hover{background:var(--bg-hover)}.history-section{max-width:min(85%,1200px);margin:0 auto;padding:1rem}.history-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem;max-height:calc(100vh - 200px);padding-right:.25rem;display:grid;overflow-y:auto}.history-list.history-list-inline{border-bottom:1px solid var(--border);flex:6 auto;min-height:0;max-height:360px;margin-bottom:.75rem;padding-bottom:.75rem;overflow-y:auto}.history-empty{color:var(--fg-tertiary);flex-direction:column;justify-content:center;align-items:center;padding:3rem 1rem;display:flex}.history-empty svg{width:3rem;height:3rem;margin-bottom:1rem}.history-empty p{margin:0 0 1rem;font-size:.9rem}.history-empty button{background:var(--accent);color:var(--bg-primary);cursor:pointer;border:none;border-radius:.5rem;padding:.625rem 1.25rem;font-size:.9rem;font-weight:600;transition:all .2s}.history-empty button:hover{opacity:.9}.section-header-actions{align-items:center;gap:.5rem;display:flex}.delete-all-btn{color:var(--error);cursor:pointer;background:0 0;border:1px solid #ef44444d;border-radius:.4rem;align-items:center;gap:.35rem;padding:.4rem .75rem;font-size:.8rem;transition:all .15s;display:inline-flex}.delete-all-btn:hover{background:#ef44441a}.delete-all-btn svg{width:.8rem;height:.8rem}.delete-all-overlay{z-index:1000;background:#00000080;justify-content:center;align-items:center;animation:.15s overlay-in;display:flex;position:fixed;inset:0}@keyframes overlay-in{0%{opacity:0}to{opacity:1}}.delete-all-dialog{background:var(--bg-secondary);border:1px solid var(--border);border-radius:.75rem;width:90%;max-width:420px;padding:1.5rem;animation:.2s dialog-in;box-shadow:0 8px 32px #0000004d}@keyframes dialog-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.delete-all-dialog h4{color:var(--fg-primary);margin:0 0 .5rem;font-size:1rem}.delete-all-dialog p{color:var(--fg-secondary);margin:0 0 1.25rem;font-size:.85rem;line-height:1.5}.delete-all-actions{justify-content:flex-end;gap:.5rem;display:flex}.delete-all-cancel{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--fg-primary);cursor:pointer;border-radius:.4rem;padding:.5rem 1rem;font-size:.85rem;transition:background .15s}.delete-all-cancel:hover{background:var(--bg-hover)}.delete-all-confirm{background:var(--error);color:#fff;cursor:pointer;border:none;border-radius:.4rem;align-items:center;gap:.35rem;padding:.5rem 1rem;font-size:.85rem;font-weight:500;transition:opacity .15s;display:inline-flex}.delete-all-confirm:hover{opacity:.85}.delete-all-confirm svg{width:.9rem;height:.9rem}.history-toast{background:var(--bg-primary);border:1px solid var(--border);color:var(--fg-primary);z-index:1001;border-radius:.5rem;align-items:center;gap:.5rem;padding:.65rem 1.25rem;font-size:.85rem;animation:.25s toast-in,.25s 2s forwards toast-out;display:flex;position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%);box-shadow:0 4px 16px #0003}@keyframes toast-in{0%{opacity:0;transform:translate(-50%)translateY(1rem)}to{opacity:1;transform:translate(-50%)translateY(0)}}@keyframes toast-out{0%{opacity:1}to{opacity:0}}.history-toast-icon{color:var(--success);align-items:center;display:flex}.history-toast-icon svg{width:.9rem;height:.9rem}.upload-section{flex-direction:column;width:100%;max-width:min(80%,800px);min-height:0;margin:0 auto;padding:1rem;display:flex}.upload-section .section-header,.upload-section .upload-divider{flex-shrink:0}.upload-section .uvr-upload-control{flex:4 auto;height:100%;min-height:0;margin-bottom:.5rem;overflow-y:auto}.upload-divider{align-items:center;gap:.75rem;margin:0 0 .75rem;display:flex}.upload-divider:before,.upload-divider:after{content:"";border-radius:1px;flex:1;height:2px}.upload-divider:before{background:linear-gradient(90deg,var(--border) 0%,var(--border) 50%,var(--accent) 100%)}.upload-divider:after{background:linear-gradient(90deg,var(--accent) 0%,var(--border) 50%,var(--border) 100%)}.upload-divider-text{color:var(--fg-tertiary);white-space:nowrap;font-size:.75rem;font-weight:500}.uvr-upload-control{flex-direction:column;gap:.75rem;width:100%;min-height:0;display:flex}.upload-header{text-align:center}.upload-icon-wrapper{color:#fff;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:50%;justify-content:center;align-items:center;width:2.5rem;height:2.5rem;margin:0 auto .5rem;display:flex}.upload-icon-wrapper svg{width:1.25rem;height:1.25rem}.upload-header h3{color:var(--fg-primary);margin-bottom:.25rem;font-size:1.05rem}.upload-subtitle{color:var(--fg-secondary);font-size:.8rem}.upload-zone{border:2px dashed var(--border);background:var(--bg-secondary);cursor:pointer;border-radius:1rem;transition:all .2s;position:relative}.upload-zone:hover{border-color:var(--accent);background:var(--bg-hover)}.upload-zone.dragging{border-color:var(--accent);background:#667eea1a;transform:scale(1.01)}.file-input{opacity:0;cursor:pointer;position:absolute;inset:0}.upload-content{flex-direction:column;justify-content:center;align-items:center;gap:.5rem;padding:1rem;display:flex}.upload-icon{color:var(--fg-tertiary)}.upload-icon svg{width:2rem;height:2rem}.upload-text{color:var(--fg-primary);font-size:.9rem;font-weight:500}.upload-text-highlight{color:var(--accent);text-decoration:underline}.upload-hint{color:var(--fg-secondary);font-size:.78rem}.file-info{flex-direction:column;gap:1rem;padding:1.5rem;display:flex}.file-preview{background:var(--bg-primary);border-radius:.5rem;align-items:center;gap:1rem;padding:.75rem;display:flex}.file-icon{font-size:1.75rem}.file-details{flex:1;min-width:0}.file-name{color:var(--fg-primary);white-space:nowrap;text-overflow:ellipsis;margin-bottom:.25rem;font-weight:500;overflow:hidden}.file-meta{color:var(--fg-secondary);font-size:.8rem}.processing-indicator{color:var(--accent);background:#667eea1a;border-radius:.5rem;justify-content:center;align-items:center;gap:.5rem;padding:.75rem;font-size:.9rem;display:flex}.pulse-spinner{border:2px solid var(--accent);border-top-color:#0000;border-radius:50%;width:1rem;height:1rem;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.upload-actions{gap:.75rem;display:flex}.upload-btn{cursor:pointer;border:none;border-radius:.5rem;flex:1;justify-content:center;align-items:center;gap:.5rem;padding:.625rem 1rem;font-size:.9rem;font-weight:600;transition:all .2s;display:flex}.upload-btn-primary{color:#fff;background:linear-gradient(135deg,#667eea,#764ba2)}.upload-btn-primary:hover:not(:disabled){opacity:.9;transform:translateY(-1px)}.upload-btn-primary:disabled{opacity:.5;cursor:not-allowed}.upload-btn-secondary{background:var(--bg-tertiary);color:var(--fg-primary)}.upload-btn-secondary:hover:not(:disabled){background:var(--border)}.supported-formats{padding:.5rem 0 0}.formats-list{flex-wrap:wrap;justify-content:center;gap:.5rem;display:flex}.format-tag{background:var(--bg-primary);border:1px solid var(--border);color:var(--fg-secondary);border-radius:.35rem;padding:.3rem .65rem;font-size:.78rem;font-weight:500}.format-tag-size{color:var(--accent);background:#667eea14;border-color:#667eea40}.uvr-process-control{background:var(--bg-secondary);border-radius:1rem;flex-direction:column;gap:1rem;width:100%;padding:1rem;display:flex}.process-header{align-items:center;gap:.75rem;display:flex}.process-icon-wrapper{background:var(--bg-primary);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:2.5rem;height:2.5rem;font-size:1.25rem;display:flex}.process-info h3{color:var(--fg-primary);margin:0;font-size:1rem}.process-info p{color:var(--fg-secondary);margin:.25rem 0 0;font-size:.85rem}.process-session-id{background:var(--bg-primary);letter-spacing:.02em;cursor:default;border-radius:.25rem;max-width:-moz-fit-content;max-width:fit-content;padding:.1rem .35rem;font-family:monospace;color:var(--fg-tertiary)!important;margin:.25rem 0 0!important;font-size:.6rem!important;display:inline-block!important}.progress-section{flex-direction:column;gap:.5rem;display:flex}.progress-bar-container{background:var(--bg-primary);border-radius:4px;height:8px;position:relative;overflow:hidden}.progress-bar-fill{background:var(--progress-color,var(--accent));border-radius:4px;height:100%;transition:width .3s}.progress-bar-indeterminate{background:linear-gradient(90deg,var(--progress-color,var(--accent)) 0%,var(--progress-color,var(--accent)) 30%,#ffffff4d 40%,var(--progress-color,var(--accent)) 50%,var(--progress-color,var(--accent)) 100%);background-size:200% 100%;animation:1.5s ease-in-out infinite indeterminate-slide;width:100%!important}@keyframes indeterminate-slide{0%{background-position:200% 0}to{background-position:-200% 0}}.progress-bar-container:after{content:"";background:linear-gradient(90deg,#0000,#fff3,#0000);animation:2s infinite shimmer;position:absolute;inset:0}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.progress-text{color:var(--fg-secondary);justify-content:space-between;font-size:.85rem;display:flex}.stage-indicators{border-top:1px solid var(--border);border-bottom:1px solid var(--border);justify-content:space-around;padding:.75rem 0;display:flex}.stage-item{color:var(--fg-tertiary);flex-direction:column;align-items:center;gap:.25rem;font-size:.75rem;display:flex}.stage-item.active{color:var(--fg-primary)}.stage-icon{font-size:1rem}.stage-label{font-size:.7rem}.error-section{border-left:3px solid var(--error);background:#ef44441a;border-radius:0 .25rem .25rem 0;padding:.75rem}.error-text{color:var(--error);margin:0;font-size:.85rem}.process-actions{justify-content:flex-end;gap:.75rem;display:flex}.process-btn{cursor:pointer;white-space:nowrap;border:none;border-radius:.4rem;align-items:center;gap:.4rem;padding:.5rem .75rem;font-size:.85rem;font-weight:600;transition:all .2s;display:inline-flex}.process-btn-primary{background:var(--accent);color:var(--bg-primary)}.process-btn-primary:hover:not(:disabled){opacity:.85}.process-btn-primary:disabled{opacity:.5;cursor:not-allowed}.process-btn-danger{background:var(--bg-primary);color:var(--error);border:1px solid #ef44441a}.process-btn-danger:hover:not(:disabled){background:#ef44441a}.uvr-session-result{background:var(--bg-secondary);border:1px solid var(--border);border-radius:.75rem;flex-direction:column;gap:.8rem;padding:.6rem;transition:border-color .2s,box-shadow .2s;display:flex}.uvr-session-result:hover{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.session-header{justify-content:flex-start;align-items:center;gap:.4rem;margin-bottom:0;display:flex}.session-icon-wrapper{background:var(--bg-primary);width:1.75rem;height:1.75rem;color:var(--fg-primary);border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:flex}.session-icon-wrapper svg{width:.9rem;height:.9rem}.session-title-area{flex:1;min-width:0}.session-title-area h3{color:var(--fg-primary);margin:0;font-size:.8rem}.session-filename{color:var(--fg-secondary);white-space:nowrap;text-overflow:ellipsis;margin:.1rem 0 0;font-size:.7rem;overflow:hidden}.session-id-pill{color:var(--fg-tertiary);background:var(--bg-primary);letter-spacing:.02em;cursor:default;border-radius:.25rem;max-width:-moz-fit-content;max-width:fit-content;margin:.1rem 0 0;padding:.1rem .35rem;font-family:monospace;font-size:.6rem;display:inline-block}.session-delete-btn{width:1.5rem;height:1.5rem;color:var(--fg-tertiary);cursor:pointer;opacity:0;background:0 0;border:none;border-radius:.375rem;flex-shrink:0;justify-content:center;align-items:center;padding:0;transition:all .15s;display:flex}.uvr-session-result:hover .session-delete-btn{opacity:1}.session-delete-btn:hover{color:var(--error);background:#ef44441a}.session-delete-btn svg{width:.85rem;height:.85rem}.session-share-btn{width:1.5rem;height:1.5rem;color:var(--fg-tertiary);cursor:pointer;background:0 0;border:none;border-radius:.375rem;flex-shrink:0;justify-content:center;align-items:center;padding:0;transition:all .15s;display:flex}.uvr-session-result:hover .session-share-btn{opacity:1}.session-share-btn:hover{color:var(--accent);background:#8b5cf61a}.session-share-btn svg{width:.85rem;height:.85rem}.status-bar{background:var(--bg-primary);border-left:3px solid var(--status-color,var(--fg-tertiary));border-radius:.4rem;align-items:center;gap:.3rem;padding:.3rem .5rem;display:flex;position:relative;overflow:hidden}.status-bar:before{content:"";background:var(--status-color,var(--fg-tertiary));opacity:.08;pointer-events:none;position:absolute;inset:0}.status-bar svg{width:.8rem;height:.8rem}.status-icon{align-items:center;display:flex;position:relative}.status-text{color:var(--fg-primary);flex:1;font-size:.78rem;font-weight:500;position:relative}.status-time{color:var(--fg-tertiary);font-size:.7rem}.info-grid{grid-template-columns:1fr 1fr;gap:.3rem;display:grid}.info-item{background:var(--bg-primary);border-radius:.4rem;flex-direction:row;gap:.3rem;padding:.3rem;display:flex}.info-icon{width:auto;height:auto;color:var(--fg-tertiary);flex-shrink:0;justify-content:center;align-items:center;display:flex}.info-icon svg{width:.9rem;height:.9rem}.info-content{flex-direction:column;min-width:0;display:flex}.info-label{color:var(--fg-tertiary);margin-bottom:.1rem;font-size:.65rem}.info-value{color:var(--fg-primary);font-size:.75rem;font-weight:500}.outputs-section{background:var(--bg-primary);border-radius:.4rem;padding:.4rem}.outputs-section h4{color:var(--fg-primary);margin:0 0 .3rem;font-size:.78rem}.stem-pills{flex-wrap:wrap;gap:.8rem;padding:.3rem;display:flex}.stem-pill{border:1px solid var(--border);cursor:pointer;background:var(--bg-secondary);border-radius:999px;align-items:center;gap:.25rem;padding:.25rem .5rem;font-size:.72rem;font-weight:500;transition:all .15s;display:inline-flex}.stem-pill svg{width:.7rem;height:.7rem}.stem-pill-vocal{color:#f59e0b;background:#f59e0b14;border-color:#f59e0b40}.stem-pill-vocal:hover{background:#f59e0b26;border-color:#f59e0b66}.stem-pill-instrumental{color:#3b82f6;background:#3b82f614;border-color:#3b82f640}.stem-pill-instrumental:hover{background:#3b82f626;border-color:#3b82f666}.stem-pill-midi{color:#8b5cf6;background:#8b5cf614;border-color:#8b5cf640}.stem-pill-midi:hover{background:#8b5cf626;border-color:#8b5cf666}.stem-pill-duration{opacity:.7;margin-left:.1rem;font-family:monospace;font-size:.65rem}.stem-pill-selected{outline-offset:1px;filter:brightness(1.2);outline:2px solid}.stem-pill-vocal.stem-pill-selected{box-shadow:0 0 8px #f59e0b4d}.stem-pill-instrumental.stem-pill-selected{box-shadow:0 0 8px #3b82f64d}.stem-pill-midi.stem-pill-selected{box-shadow:0 0 8px #8b5cf64d}.session-result-actions{gap:.35rem;margin-top:auto;display:flex}.session-result-btn{cursor:pointer;white-space:nowrap;border:none;border-radius:.4rem;flex:1;justify-content:center;align-items:center;gap:.35rem;padding:.4rem .6rem;font-size:.78rem;font-weight:500;transition:all .2s;display:inline-flex}.session-result-btn svg{width:.75rem;height:.75rem}.session-result-btn-primary{background:var(--accent);color:var(--bg-primary)}.session-result-btn-primary:hover:not(:disabled){opacity:.85}.session-result-btn-mixer{background:var(--bg-tertiary);color:var(--accent);border:1px solid #8b5cf64d}.session-result-btn-mixer:hover{background:#8b5cf61a;border-color:#8b5cf680}.session-result-btn-copy{background:var(--bg-tertiary);color:var(--fg-secondary);border:1px solid var(--border);flex:0;padding:.5rem}.session-result-btn-copy:hover{background:var(--bg-hover);color:var(--accent);border-color:var(--accent)}.session-result-btn-copy svg{width:.85rem;height:.85rem}.session-result-btn-danger{background:var(--bg-tertiary);color:var(--fg-primary);border:1px solid var(--border)}.session-result-btn-danger:hover{color:var(--error);background:#ef44441a;border-color:#ef44444d}.delete-confirm-overlay{z-index:1000;background:#00000080;justify-content:center;align-items:center;animation:.15s confirm-overlay-in;display:flex;position:fixed;inset:0}@keyframes confirm-overlay-in{0%{opacity:0}to{opacity:1}}.delete-confirm-dialog{background:var(--bg-secondary);border:1px solid var(--border);border-radius:.75rem;width:90%;max-width:380px;padding:1.5rem;animation:.2s confirm-dialog-in;box-shadow:0 8px 32px #0000004d}@keyframes confirm-dialog-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.delete-confirm-dialog h4{color:var(--fg-primary);margin:0 0 .5rem;font-size:1rem}.delete-confirm-dialog p{color:var(--fg-secondary);margin:0 0 1.25rem;font-size:.85rem;line-height:1.5}.delete-confirm-actions{justify-content:flex-end;gap:.5rem;display:flex}.delete-confirm-cancel{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--fg-primary);cursor:pointer;border-radius:.4rem;padding:.5rem 1rem;font-size:.85rem;transition:background .15s}.delete-confirm-cancel:hover{background:var(--bg-hover)}.delete-confirm-delete{background:var(--error);color:#fff;cursor:pointer;border:none;border-radius:.4rem;align-items:center;gap:.35rem;padding:.5rem 1rem;font-size:.85rem;font-weight:500;transition:opacity .15s;display:inline-flex}.delete-confirm-delete:hover{opacity:.85}.delete-confirm-delete svg{width:.9rem;height:.9rem}.session-toast{background:var(--bg-primary);border:1px solid var(--border);color:var(--fg-primary);z-index:1001;border-radius:.5rem;align-items:center;gap:.5rem;padding:.65rem 1.25rem;font-size:.85rem;animation:.25s session-toast-in,.25s 2s forwards session-toast-out;display:flex;position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%);box-shadow:0 4px 16px #0003}@keyframes session-toast-in{0%{opacity:0;transform:translate(-50%)translateY(1rem)}to{opacity:1;transform:translate(-50%)translateY(0)}}@keyframes session-toast-out{0%{opacity:1}to{opacity:0}}.session-toast-icon{color:var(--success);align-items:center;display:flex}.session-toast-icon svg{width:.9rem;height:.9rem}.uvr-result-viewer{flex-direction:column;gap:1rem;width:100%;display:flex}.rv-header{justify-content:space-between;align-items:center;display:flex}.rv-header-left{align-items:center;gap:.75rem;display:flex}.rv-header-left h3{color:var(--fg-primary);margin:0;font-size:1.05rem}.rv-processing-time{color:var(--fg-tertiary);background:var(--bg-tertiary);border-radius:.3rem;padding:.15rem .5rem;font-size:.72rem}.rv-header-right{align-items:center;gap:.5rem;display:flex}.rv-share-btn{background:var(--bg-primary);border:1px solid var(--border);color:var(--fg-primary);cursor:pointer;border-radius:.4rem;align-items:center;gap:.35rem;padding:.4rem .85rem;font-size:.8rem;transition:all .15s;display:inline-flex}.rv-share-btn svg{width:.8rem;height:.8rem}.rv-share-btn:hover{background:var(--bg-hover);border-color:var(--accent);color:var(--accent)}.rv-close-btn{background:var(--bg-tertiary);border:1px solid var(--border);width:2rem;height:2rem;color:var(--fg-primary);cursor:pointer;border-radius:.5rem;justify-content:center;align-items:center;padding:0;display:flex}.rv-close-btn:hover{color:var(--error);background:#ef44441a}.rv-close-btn svg{width:.9rem;height:.9rem}.rv-stems-grid{flex-direction:column;gap:.5rem;display:flex}.rv-stem-card{background:var(--bg-secondary);border:1px solid var(--border);border-left:3px solid var(--stem-color,var(--border));border-radius:.6rem;justify-content:space-between;align-items:center;padding:.65rem .85rem;transition:border-color .2s,box-shadow .2s;display:flex}.rv-stem-card:hover{border-color:var(--stem-color,var(--accent));box-shadow:0 0 0 1px rgba(from var(--stem-color) r g b / .15)}.rv-stem-card-top{align-items:center;gap:.65rem;display:flex}.rv-stem-icon{background:var(--bg-primary);border-radius:.5rem;flex-shrink:0;justify-content:center;align-items:center;width:2rem;height:2rem;display:flex}.rv-stem-icon svg{width:1rem;height:1rem}.rv-stem-info{flex-direction:column;gap:.15rem;display:flex}.rv-stem-name{color:var(--fg-primary);font-size:.85rem;font-weight:600}.rv-stem-meta{flex-wrap:wrap;align-items:center;gap:.4rem;display:flex}.rv-stem-format{text-transform:uppercase;letter-spacing:.05em;background:var(--bg-tertiary);color:var(--fg-tertiary);border-radius:.2rem;padding:.1rem .35rem;font-size:.62rem}.rv-stem-duration{color:var(--fg-secondary);font-family:monospace;font-size:.68rem}.rv-stem-size{color:var(--fg-tertiary);font-size:.65rem}.rv-stem-card-actions{flex-shrink:0;gap:.35rem;display:flex}.rv-stem-btn{cursor:pointer;white-space:nowrap;border:none;border-radius:.4rem;align-items:center;gap:.3rem;padding:.4rem .75rem;font-size:.78rem;font-weight:500;transition:all .15s;display:inline-flex}.rv-stem-btn svg{width:.75rem;height:.75rem}.rv-stem-btn-play{background:var(--accent);color:var(--bg-primary)}.rv-stem-btn-play:hover{opacity:.85}.rv-stem-btn-download{background:var(--bg-tertiary);color:var(--fg-secondary);border:1px solid var(--border);padding:.4rem .5rem}.rv-stem-btn-download:hover{background:var(--bg-hover);color:var(--fg-primary)}.rv-stem-btn-mixer{background:var(--bg-tertiary);color:var(--accent);border:1px solid #8b5cf64d}.rv-stem-btn-mixer:hover{background:#8b5cf61a;border-color:#8b5cf680}.rv-full-mix-card{background:linear-gradient(135deg,#10b98114,#8b5cf614);border:1px solid #10b98140;border-radius:.6rem;justify-content:space-between;align-items:center;padding:.75rem .85rem;display:flex}.rv-full-mix-left{align-items:center;gap:.65rem;display:flex}.rv-full-mix-actions{flex-shrink:0;gap:.5rem;display:flex}.rv-toast{background:var(--bg-primary);border:1px solid var(--border);color:var(--fg-primary);z-index:1001;border-radius:.5rem;padding:.6rem 1.25rem;font-size:.85rem;animation:.25s rv-toast-in,.25s 2s forwards rv-toast-out;position:fixed;bottom:1.5rem;left:50%;transform:translate(-50%);box-shadow:0 4px 16px #0003}@keyframes rv-toast-in{0%{opacity:0;transform:translate(-50%)translateY(1rem)}to{opacity:1;transform:translate(-50%)translateY(0)}}@keyframes rv-toast-out{0%{opacity:1}to{opacity:0}}.session-results-panel{z-index:100;justify-content:flex-end;display:flex;position:fixed;inset:0}.session-results-content{background:var(--bg-secondary);width:400px;max-width:100%;height:100%;overflow-y:auto;box-shadow:-4px 0 15px #0000004d}.panel-overlay{background:#0000004d;position:absolute;inset:0}.panel-footer{background:var(--bg-primary);border-top:1px solid var(--border);justify-content:space-between;align-items:center;padding:.75rem 1.25rem;display:flex}.footer-stats{color:var(--fg-secondary);align-items:center;gap:1rem;font-size:.8rem;display:flex}.stat-item{align-items:center;gap:.25rem;display:flex}.stat-divider{color:var(--border)}.footer-actions{gap:.5rem;display:flex}.footer-btn{background:var(--bg-tertiary);border:1px solid var(--border);color:var(--fg-primary);cursor:pointer;border-radius:.5rem;align-items:center;gap:.5rem;padding:.5rem 1rem;font-size:.8rem;transition:all .2s;display:flex}.footer-btn:hover{background:var(--bg-hover)}.result-info{background:var(--bg-primary);border-radius:.5rem;margin-bottom:1.5rem;padding:.75rem}.output-sections{flex-direction:column;gap:1rem;display:flex}.output-section{flex-direction:column;gap:.75rem;display:flex}.output-section .section-header{align-items:center;gap:.75rem;display:flex}.section-icon{flex-shrink:0;font-size:1.25rem}.section-title{flex-direction:column;display:flex}.section-title h4{color:var(--fg-primary);margin:0;font-size:1rem}.section-tag{color:var(--fg-tertiary);background:var(--bg-tertiary);border-radius:.25rem;width:-moz-fit-content;width:fit-content;margin-top:.25rem;padding:.1rem .5rem;font-size:.75rem}.vocal-icon{color:#ef4444}.instrumental-icon{color:#22c55e}.full-icon{color:#f59e0b}.midi-icon{color:#3b82f6}.output-actions{background:var(--bg-primary);border-radius:.5rem;flex-wrap:wrap;gap:.75rem;padding:1rem;display:flex}.output-btn{cursor:pointer;border:none;border-radius:.5rem;justify-content:center;align-items:center;gap:.5rem;padding:.625rem 1rem;font-size:.9rem;font-weight:500;transition:all .2s;display:flex}.output-btn:disabled{opacity:.5;cursor:not-allowed}.output-btn-primary{color:#fff;background:linear-gradient(135deg,#667eea,#764ba2)}.output-btn-primary:hover:not(:disabled){opacity:.9;transform:translateY(-1px);box-shadow:0 4px 12px #667eea4d}.output-btn-secondary{background:var(--bg-tertiary);color:var(--fg-primary)}.output-btn-secondary:hover:not(:disabled){background:var(--bg-hover)}.result-footer{border-top:1px solid var(--border);margin-top:1.5rem;padding-top:1rem}.share-btn{background:var(--bg-tertiary);border:1px solid var(--border);width:100%;color:var(--fg-primary);cursor:pointer;border-radius:.5rem;justify-content:center;align-items:center;gap:.5rem;padding:.75rem;font-size:.9rem;transition:all .2s;display:flex}.share-btn:hover:not(:disabled){background:var(--bg-hover)}.share-btn:disabled{opacity:.5;cursor:not-allowed}.PI4emG_ctrlBtn{border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-primary);cursor:pointer;white-space:nowrap;border-radius:6px;justify-content:center;align-items:center;gap:5px;padding:6px 12px;font-size:.78rem;line-height:1;transition:all .12s;display:inline-flex}.PI4emG_ctrlBtn:hover:not(:disabled){background:var(--border-light);border-color:var(--accent)}.PI4emG_ctrlBtn:active:not(:disabled){transform:translateY(1px)}.PI4emG_ctrlBtn:disabled{opacity:.5;cursor:not-allowed}.PI4emG_ctrlBtn.PI4emG_recording{background:var(--red);border-color:var(--red);color:#fff}.PI4emG_ctrlBtn.PI4emG_recording:hover{background:#d04a42;border-color:#d04a42}.character-image{width:120px;height:120px;transition:transform .3s}.character-image:hover{transform:scale(1.05)}.character-aria.selected-anim,.character-luna.selected-anim{animation:3s ease-in-out infinite float}.character-blaze.selected-anim,.character-glint.selected-anim{animation:.8s ease-in-out infinite vibrate}.character-flux.selected-anim,.character-echo.selected-anim{animation:2.5s ease-in-out infinite wave}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes vibrate{0%,to{transform:translate(0)rotate(0)}25%{transform:translate(-1px,1px)rotate(-1deg)}50%{transform:translate(1px,-1px)rotate(1deg)}75%{transform:translate(-1px,-1px)rotate(-1deg)}}@keyframes wave{0%,to{transform:rotate(0)scale(1)}50%{transform:rotate(4deg)scale(1.02)}}.character-icons-grid{grid-template-rows:repeat(2,1fr);grid-template-columns:repeat(3,1fr);align-items:center;gap:4px;display:grid}.character-icon-btn{background:var(--bg-tertiary);border:1px solid var(--border);cursor:pointer;border-radius:6px;justify-content:center;align-items:center;width:32px;height:32px;padding:4px;transition:all .2s;display:flex}.character-icon-btn:hover{background:var(--bg-card);border-color:var(--accent)}.character-icon-btn.selected{background:var(--accent-dim);border-color:var(--accent);box-shadow:0 0 10px var(--accent-glow)}.character-icon-img{width:24px;height:24px}.character-icons-grid{border:1px solid var(--accent-dim);background:linear-gradient(180deg,var(--bg-secondary),var(--bg-primary));border-radius:14px;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:58px;gap:8px;width:100%;padding:8px}.character-icon-btn{border-radius:14px;width:100%;height:58px;padding:5px;overflow:hidden}.character-icon-img{object-fit:contain;transform-origin:50%;width:50px;height:50px;transform:scale(1.28)}._2o3clq_notificationContainer{z-index:1000;pointer-events:none;flex-direction:column;gap:8px;display:flex;position:fixed;top:60px;right:16px}._2o3clq_notification{pointer-events:auto;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:8px;align-items:center;gap:10px;min-width:280px;max-width:400px;padding:12px 16px;font-size:.85rem;font-weight:500;line-height:1.4;animation:.3s ease-out _2o3clq_slideIn;display:flex;box-shadow:0 4px 12px #0006,0 2px 6px #0003}@keyframes _2o3clq_slideIn{0%{opacity:0;transform:translate(400px)}to{opacity:1;transform:translate(0)}}@keyframes _2o3clq_fadeOut{0%{opacity:1}to{opacity:0}}._2o3clq_notification._2o3clq_info{border-left:4px solid var(--accent);color:var(--text-primary);background:#0d1117f2}._2o3clq_notification._2o3clq_info:hover{background:#0d1117fa}._2o3clq_notification._2o3clq_success{border-left:4px solid var(--green);color:#fff;background:#1a7f37f2}._2o3clq_notification._2o3clq_success:hover{background:#1a7f37fa}._2o3clq_notification._2o3clq_warning{border-left:4px solid var(--yellow);color:#fff;background:#d29922f2}._2o3clq_notification._2o3clq_warning:hover{background:#d29922fa}._2o3clq_notification._2o3clq_error{border-left:4px solid var(--red);color:#fff;background:#cf222ef2}._2o3clq_notification._2o3clq_error:hover{background:#cf222efa}._2o3clq_notification ._2o3clq_closeBtn{color:inherit;opacity:.7;cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;margin-left:auto;padding:2px;transition:opacity .2s;display:flex}._2o3clq_notification ._2o3clq_closeBtn:hover{opacity:1;background:#ffffff1a}._2o3clq_notification ._2o3clq_closeBtn svg{width:16px;height:16px}._2o3clq_notificationContainer:empty{display:none}._6QN9Vq_tooltipWrapper{display:inline-block;position:relative}._6QN9Vq_tooltip{z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:var(--text-primary);white-space:nowrap;pointer-events:none;opacity:0;background:#1e293bf2;border-radius:6px;padding:5px 10px;font-size:.75rem;transition:opacity .2s,transform .2s;position:absolute;transform:translateY(-4px);box-shadow:0 4px 12px #0000004d}._6QN9Vq_tooltip._6QN9Vq_show{opacity:1;transform:translateY(0)}._6QN9Vq_tooltip-top{top:100%;left:50%;transform:translate(-50%)translateY(-4px)}._6QN9Vq_tooltip-top._6QN9Vq_show{transform:translate(-50%)translateY(0)}._6QN9Vq_tooltip-bottom{bottom:100%;left:50%;transform:translate(-50%)translateY(4px)}._6QN9Vq_tooltip-bottom._6QN9Vq_show{transform:translate(-50%)translateY(0)}._6QN9Vq_tooltip-left{top:50%;left:100%;transform:translateY(-50%)translate(-4px)}._6QN9Vq_tooltip-left._6QN9Vq_show{transform:translateY(-50%)translate(0)}._6QN9Vq_tooltip-right{top:50%;right:100%;transform:translateY(-50%)translate(4px)}._6QN9Vq_tooltip-right._6QN9Vq_show{transform:translateY(-50%)translate(0)}
