@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");@import url("https://fonts.googleapis.com/css2?family=Azeret+Mono:wght@400;500;600&display=swap");@import url("https://fonts.googleapis.com/css2?family=Figtree:wght@400;500;600;700&display=swap");:root{--gray-0:oklch(99.0% 0 0);--gray-50:oklch(96.5% 0 0);--gray-100:oklch(92.0% 0 0);--gray-200:oklch(83.0% 0 0);--gray-300:oklch(72.0% 0 0);--gray-400:oklch(61.0% 0 0);--gray-500:oklch(50.0% 0 0);--gray-600:oklch(40.0% 0 0);--gray-700:oklch(30.0% 0 0);--gray-750:oklch(25.0% 0 0);--gray-800:oklch(21.0% 0 0);--gray-850:oklch(18.0% 0 0);--gray-900:oklch(15.0% 0 0);--gray-950:oklch(11.0% 0 0);--green-50:oklch(97.5% 0.015 155.0);--green-100:oklch(93.5% 0.035 155.0);--green-200:oklch(87.0% 0.060 155.0);--green-300:oklch(80.0% 0.080 155.0);--green-400:oklch(73.5% 0.125 155.0);--green-500:oklch(64.5% 0.165 155.0);--green-600:oklch(54.0% 0.150 155.0);--green-700:oklch(43.5% 0.125 155.0);--green-800:oklch(33.0% 0.100 155.0);--green-900:oklch(22.0% 0.070 155.0);--green-950:oklch(13.0% 0.040 155.0);--lime-50:oklch(97.42% 0.0582 108.5);--lime-100:oklch(94.95% 0.1343 118.6);--lime-200:oklch(91.79% 0.2222 122.2);--lime-300:oklch(85.92% 0.2248 126.0);--lime-400:oklch(81.64% 0.2186 127.0);--lime-500:oklch(73.28% 0.2169 130.3);--lime-600:oklch(62.96% 0.2011 131.1);--lime-700:oklch(50.78% 0.1710 131.1);--lime-800:oklch(42.82% 0.1331 131.4);--lime-900:oklch(30.09% 0.0924 130.5);--lime-950:oklch(18.16% 0.0592 129.3);--amber-50:oklch(97.42% 0.0160 87.0);--amber-100:oklch(94.95% 0.0500 90.0);--amber-200:oklch(91.79% 0.1350 95.0);--amber-300:oklch(85.92% 0.2050 93.0);--amber-400:oklch(81.64% 0.2240 88.0);--amber-500:oklch(73.28% 0.2100 83.0);--amber-600:oklch(62.96% 0.1900 79.0);--amber-700:oklch(50.78% 0.1700 76.0);--amber-800:oklch(42.82% 0.1450 74.0);--amber-900:oklch(30.09% 0.1150 72.0);--amber-950:oklch(18.16% 0.0750 72.0);--gold-50:oklch(97.0% 0.012 82.0);--gold-100:oklch(93.0% 0.035 80.0);--gold-200:oklch(88.0% 0.078 78.0);--gold-300:oklch(82.0% 0.112 76.0);--gold-400:oklch(76.0% 0.130 74.0);--gold-500:oklch(69.0% 0.128 72.0);--gold-600:oklch(59.0% 0.114 70.0);--gold-700:oklch(49.0% 0.096 68.0);--gold-800:oklch(38.0% 0.074 66.0);--gold-900:oklch(26.0% 0.050 64.0);--gold-950:oklch(15.5% 0.032 62.0);--red-50:oklch(97.5% 0.015 22.0);--red-100:oklch(93.5% 0.035 22.0);--red-200:oklch(87.0% 0.065 22.0);--red-300:oklch(79.0% 0.095 22.0);--red-400:oklch(68.0% 0.165 22.0);--red-500:oklch(61.0% 0.225 22.0);--red-600:oklch(51.0% 0.200 22.0);--red-700:oklch(41.5% 0.170 22.0);--red-800:oklch(32.0% 0.135 22.0);--red-900:oklch(21.0% 0.090 22.0);--red-950:oklch(12.5% 0.050 22.0);--blue-50:oklch(97.42% 0.0440 291.6);--blue-100:oklch(94.95% 0.0660 284.9);--blue-200:oklch(91.79% 0.1030 277.1);--blue-300:oklch(85.92% 0.1560 272.6);--blue-400:oklch(75.00% 0.1600 269.5);--blue-500:oklch(63.00% 0.1700 271.1);--blue-600:oklch(52.00% 0.1650 270.9);--blue-700:oklch(47.41% 0.1300 272.1);--blue-800:oklch(42.82% 0.0860 269.5);--blue-900:oklch(30.09% 0.0530 266.7);--blue-950:oklch(18.16% 0.0330 264.7);--violet-50:oklch(97.42% 0.0380 297.1);--violet-100:oklch(94.95% 0.0640 295.3);--violet-200:oklch(91.79% 0.1130 293.1);--violet-300:oklch(85.92% 0.1610 289.6);--violet-400:oklch(75.00% 0.1820 288.1);--violet-500:oklch(63.00% 0.1900 286.3);--violet-600:oklch(52.00% 0.1600 281.9);--violet-700:oklch(47.41% 0.1450 282.0);--violet-800:oklch(42.82% 0.1080 276.5);--violet-900:oklch(30.09% 0.0670 275.1);--violet-950:oklch(18.16% 0.0460 272.1)}:root,:root[data-theme=dark],[data-theme=dark]{--lime-alpha-8:oklch(73.28% 0.2169 130.3/0.08);--lime-alpha-16:oklch(73.28% 0.2169 130.3/0.16);--lime-alpha-24:oklch(73.28% 0.2169 130.3/0.24);--lime-alpha-32:oklch(73.28% 0.2169 130.3/0.32);--lime-alpha-60:oklch(73.28% 0.2169 130.3/0.60);--gray-alpha-8:oklch(100% 0 0/0.08);--gray-alpha-16:oklch(100% 0 0/0.16);--gray-alpha-24:oklch(100% 0 0/0.24);--gray-alpha-32:oklch(100% 0 0/0.32);--gray-alpha-60:oklch(100% 0 0/0.60);--fill-base:var(--gray-950);--fill-surface:var(--gray-850);--fill-surface-raised:var(--gray-750);--fill-surface-overlay:var(--gray-700);--fill-surface-floating:oklch(36% 0.003 100);--fill-header:oklch(20.5% 0.003 100/0.85);--fill-brand:var(--lime-500);--fill-brand-disabled:var(--gray-700);--fill-input:oklch(0% 0 0/0.25);--fill-brand-subtle:var(--lime-900);--fill-success-subtle:var(--green-900);--fill-warning-subtle:var(--amber-900);--fill-danger-subtle:var(--red-900);--fill-info-subtle:var(--blue-900);--fill-accent-subtle:var(--violet-900);--fill-brand-subtle-hover:var(--lime-800);--fill-success-subtle-hover:var(--green-800);--fill-warning-subtle-hover:var(--amber-800);--fill-danger-subtle-hover:var(--red-800);--fill-info-subtle-hover:var(--blue-800);--fill-accent-subtle-hover:var(--violet-800);--fill-brand-solid:var(--lime-600);--fill-success-solid:var(--green-600);--fill-warning-solid:var(--amber-600);--fill-danger-solid:var(--red-600);--fill-info-solid:var(--blue-600);--fill-accent-solid:var(--violet-600);--fill-brand-solid-hover:var(--lime-500);--fill-success-solid-hover:var(--green-500);--fill-warning-solid-hover:var(--amber-500);--fill-danger-solid-hover:var(--red-500);--fill-info-solid-hover:var(--blue-500);--fill-accent-solid-hover:var(--violet-500);--fill-brand-solid-active:var(--lime-700);--fill-success-solid-active:var(--green-700);--fill-warning-solid-active:var(--amber-700);--fill-danger-solid-active:var(--red-700);--fill-info-solid-active:var(--blue-700);--fill-accent-solid-active:var(--violet-700);--text-neutral-primary:var(--gray-100);--text-neutral-secondary:var(--gray-200);--text-neutral-tertiary:var(--gray-400);--text-neutral-disabled:var(--gray-500);--text-neutral-inverse:var(--gray-950);--text-brand:var(--lime-500);--text-brand-subtle:var(--lime-200);--text-success:var(--green-500);--text-warning:var(--amber-500);--text-danger:var(--red-500);--text-info:var(--blue-500);--text-accent:var(--violet-500);--text-on-solid:var(--gray-0);--border-subtle:oklch(100% 0 0/0.04);--border-default:oklch(100% 0 0/0.06);--border-divider:oklch(100% 0 0/0.08);--border-interactive:oklch(100% 0 0/0.16);--border-strong:var(--border-interactive);--border-focus:oklch(100% 0 0/0.60);--border-overlay:var(--border-default);--border-brand-subtle:var(--lime-800);--border-success:var(--green-800);--border-warning:var(--amber-800);--border-danger:var(--red-800);--border-info:var(--blue-800);--border-accent:var(--violet-800);--icon-brand:var(--lime-500);--icon-success:var(--text-success);--icon-warning:var(--text-warning);--icon-danger:var(--text-danger);--icon-info:var(--text-info);--icon-accent:var(--text-accent);--icon-neutral:var(--gray-400);--fill-input-hover:var(--gray-700);--fill-input-disabled:var(--gray-900);--fill-scrim:oklch(0% 0 0/0.65);--fill-tooltip:var(--fill-surface-floating);--text-placeholder:var(--gray-600);--text-link:var(--blue-400);--text-link-hover:var(--blue-300);--text-code:var(--lime-300);--text-on-overlay:var(--gray-100);--text-price-up:var(--green-300);--text-price-down:var(--red-300);--border-input-focus:var(--border-focus);--icon-disabled:var(--gray-600);--icon-interactive:var(--gray-400);--icon-interactive-hover:var(--gray-200);--shadow-xs:0 1px 2px oklch(0% 0 0/0.30);--shadow-sm:0 2px 8px oklch(0% 0 0/0.35),0 1px 2px oklch(0% 0 0/0.20);--shadow-md:0 6px 20px oklch(0% 0 0/0.50),0 2px 4px oklch(0% 0 0/0.28);--shadow-lg:0 16px 40px oklch(0% 0 0/0.60),0 4px 10px oklch(0% 0 0/0.35);--shadow-inset:inset 0 1px 2px rgba(0,0,0,0.2);--shadow-focus:0 0 0 2px var(--fill-base),0 0 0 4px var(--border-focus);--shadow-brand-glow:0 4px 20px oklch(73.28% 0.2169 130.3/0.30);--surface-lift:linear-gradient(180deg,oklch(100% 0 0/0.030),oklch(100% 0 0/0.00) 50%);--surface-lift-raised:linear-gradient(180deg,oklch(100% 0 0/0.045),oklch(100% 0 0/0.00) 50%);--gradient-panel-top:linear-gradient(180deg,rgba(255,255,255,0.025),rgba(255,255,255,0) 60px);--gradient-page-bg:radial-gradient(ellipse 80% 40% at 50% 0%,oklch(22.9% 0.003 100/0.6) 0%,transparent 70%)}[data-theme=light]{--lime-alpha-8:oklch(73.28% 0.2169 130.3/0.08);--lime-alpha-16:oklch(73.28% 0.2169 130.3/0.16);--lime-alpha-24:oklch(73.28% 0.2169 130.3/0.24);--lime-alpha-32:oklch(73.28% 0.2169 130.3/0.32);--lime-alpha-60:oklch(73.28% 0.2169 130.3/0.60);--gray-alpha-8:rgba(0,0,0,0.06);--gray-alpha-16:rgba(0,0,0,0.10);--gray-alpha-24:rgba(0,0,0,0.15);--gray-alpha-32:rgba(0,0,0,0.22);--gray-alpha-60:rgba(0,0,0,0.40);--lime-50:oklch(97.42% 0.012 108.5);--lime-100:oklch(94.95% 0.040 118.6);--lime-200:oklch(91.79% 0.100 122.2);--lime-300:oklch(85.92% 0.160 126.0);--green-50:oklch(97.42% 0.012 162.0);--green-100:oklch(94.95% 0.037 162.0);--green-200:oklch(91.79% 0.089 162.0);--green-300:oklch(85.92% 0.161 162.0);--amber-50:oklch(97.42% 0.009 87.0);--amber-100:oklch(94.95% 0.031 90.0);--amber-200:oklch(91.79% 0.089 95.0);--amber-300:oklch(85.92% 0.150 93.0);--red-50:oklch(97.42% 0.004 25.0);--red-100:oklch(94.95% 0.012 25.0);--red-200:oklch(91.79% 0.029 25.0);--red-300:oklch(85.92% 0.065 25.0);--blue-50:oklch(97.42% 0.004 291.6);--blue-100:oklch(94.95% 0.012 284.9);--blue-200:oklch(91.79% 0.027 277.1);--blue-300:oklch(85.92% 0.059 272.6);--violet-50:oklch(97.42% 0.004 297.1);--violet-100:oklch(94.95% 0.013 295.3);--violet-200:oklch(91.79% 0.030 293.1);--violet-300:oklch(85.92% 0.064 289.6);--fill-base:var(--gray-50);--fill-surface:var(--gray-0);--fill-surface-raised:var(--gray-0);--fill-surface-overlay:var(--gray-0);--fill-surface-floating:var(--gray-0);--fill-header:rgba(255,255,255,0.85);--fill-brand:var(--lime-500);--fill-brand-disabled:var(--gray-300);--fill-input:oklch(0% 0 0/0.04);--fill-brand-subtle:var(--lime-100);--fill-success-subtle:var(--green-100);--fill-warning-subtle:var(--amber-100);--fill-danger-subtle:var(--red-100);--fill-info-subtle:var(--blue-100);--fill-accent-subtle:var(--violet-100);--fill-brand-subtle-hover:var(--lime-200);--fill-success-subtle-hover:var(--green-200);--fill-warning-subtle-hover:var(--amber-200);--fill-danger-subtle-hover:var(--red-200);--fill-info-subtle-hover:var(--blue-200);--fill-accent-subtle-hover:var(--violet-200);--fill-brand-solid:var(--lime-500);--fill-success-solid:var(--green-500);--fill-warning-solid:var(--amber-500);--fill-danger-solid:var(--red-600);--fill-info-solid:var(--blue-600);--fill-accent-solid:var(--violet-600);--fill-brand-solid-hover:var(--lime-600);--fill-success-solid-hover:var(--green-600);--fill-warning-solid-hover:var(--amber-600);--fill-danger-solid-hover:var(--red-700);--fill-info-solid-hover:var(--blue-700);--fill-accent-solid-hover:var(--violet-700);--fill-brand-solid-active:var(--lime-700);--fill-success-solid-active:var(--green-700);--fill-warning-solid-active:var(--amber-700);--fill-danger-solid-active:var(--red-800);--fill-info-solid-active:var(--blue-800);--fill-accent-solid-active:var(--violet-800);--text-on-brand-solid:var(--gray-950);--text-on-success-solid:var(--gray-950);--text-on-warning-solid:var(--gray-950);--text-neutral-primary:var(--gray-950);--text-neutral-secondary:var(--gray-700);--text-neutral-tertiary:var(--gray-500);--text-neutral-disabled:var(--gray-600);--text-neutral-inverse:var(--gray-0);--text-brand:var(--lime-700);--text-brand-subtle:var(--lime-600);--text-success:var(--green-700);--text-warning:var(--amber-700);--text-danger:var(--red-700);--text-info:var(--blue-700);--text-accent:var(--violet-700);--text-on-solid:var(--gray-0);--border-subtle:oklch(0% 0 0/0.08);--border-default:oklch(0% 0 0/0.12);--border-divider:oklch(0% 0 0/0.16);--border-interactive:oklch(0% 0 0/0.28);--border-strong:var(--border-interactive);--border-focus:oklch(0% 0 0/0.60);--border-overlay:var(--border-default);--border-brand-subtle:var(--lime-200);--border-success:var(--green-200);--border-warning:var(--amber-200);--border-danger:var(--red-200);--border-info:var(--blue-200);--border-accent:var(--violet-200);--icon-brand:var(--text-brand);--icon-success:var(--text-success);--icon-warning:var(--text-warning);--icon-danger:var(--text-danger);--icon-info:var(--text-info);--icon-accent:var(--text-accent);--icon-neutral:var(--gray-500);--fill-input-hover:var(--gray-50);--fill-input-disabled:var(--gray-100);--fill-scrim:oklch(0% 0 0/0.45);--fill-tooltip:var(--gray-900);--text-placeholder:var(--gray-400);--text-link:var(--blue-600);--text-link-hover:var(--blue-700);--text-code:var(--lime-700);--text-on-overlay:var(--gray-0);--text-price-up:var(--green-600);--text-price-down:var(--red-600);--border-input-focus:var(--border-focus);--icon-disabled:var(--gray-400);--icon-interactive:var(--gray-500);--icon-interactive-hover:var(--gray-700);--shadow-xs:none;--shadow-sm:none;--shadow-md:0 4px 16px rgba(0,0,0,0.08),0 1px 4px rgba(0,0,0,0.04);--shadow-lg:0 8px 24px rgba(0,0,0,0.10),0 3px 8px rgba(0,0,0,0.05);--shadow-inset:none;--shadow-focus:0 0 0 2px var(--fill-base),0 0 0 4px var(--border-focus);--shadow-brand-glow:0 4px 20px oklch(73.28% 0.2169 130.3/0.18);--surface-lift:none;--surface-lift-raised:none;--gradient-panel-top:linear-gradient(180deg,rgba(255,255,255,0.8),rgba(255,255,255,0) 48px);--gradient-page-bg:radial-gradient(ellipse 80% 40% at 50% 0%,rgba(200,220,200,0.25) 0%,transparent 70%)}[data-theme=light] .alpha-demo-card,[data-theme=light] .controls-card,[data-theme=light] .meta-panel,[data-theme=light] .notice-box,[data-theme=light] .playground-card,[data-theme=light] .sandbox-card,[data-theme=light] .semantic-group,[data-theme=light] .shadow-card-demo{border-top-color:var(--border-subtle)}:root{--font-display:"Figtree","Pretendard",-apple-system,sans-serif;--font-body:"Figtree","Pretendard",-apple-system,sans-serif;--font-mono:"Azeret Mono",monospace;--font-size-display-lg:3.5rem;--font-size-display-md:2.5rem;--font-size-display-sm:2.0rem;--font-size-title-lg:1.5rem;--font-size-title-md:1.25rem;--font-size-title-sm:1.125rem;--font-size-body-lg:1.0rem;--font-size-body-md:0.875rem;--font-size-body-sm:0.75rem;--font-size-caption:0.6875rem;--font-size-micro:0.625rem;--line-height-display:1.1;--line-height-title:1.3;--line-height-body:1.5;--line-height-compact:1.2;--font-weight-light:300;--font-weight-regular:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--font-weight-extra-bold:800;--fill-surface-hover:var(--gray-alpha-8);--fill-surface-pressed:var(--gray-alpha-16);--fill-surface-selected:var(--lime-alpha-16);--fill-input-error:var(--fill-danger-subtle);--border-input:var(--border-default);--border-input-hover:var(--border-interactive);--border-input-error:var(--border-danger);--border-input-disabled:var(--border-subtle);--fill-nav-active:var(--fill-brand-subtle);--fill-nav-hover:var(--fill-surface-hover);--text-nav-active:var(--text-brand);--border-nav-active:var(--text-brand);--border-separator:var(--border-subtle);--border-selected:var(--text-brand);--fill-bid-subtle:var(--fill-success-subtle);--fill-ask-subtle:var(--fill-danger-subtle);--fill-pnl-positive:var(--fill-success-subtle);--fill-pnl-negative:var(--fill-danger-subtle);--fill-order-pending:var(--fill-warning-subtle);--fill-order-filled:var(--fill-success-subtle);--fill-order-cancelled:var(--fill-surface-raised);--text-bid:var(--text-success);--text-ask:var(--text-danger);--text-pnl-positive:var(--text-success);--text-pnl-negative:var(--text-danger);--text-neutral-price:var(--text-neutral-secondary);--icon-on-solid:var(--text-on-solid);--shadow-surface:none;--shadow-raised:var(--shadow-xs);--shadow-overlay:var(--shadow-md);--shadow-floating:var(--shadow-lg);--button-brand-bg:var(--fill-brand-solid);--button-brand-bg-hover:var(--fill-brand-solid-hover);--button-brand-bg-active:var(--fill-brand-solid-active);--button-brand-text:var(--text-on-solid);--button-brand-icon:var(--icon-on-solid);--button-success-bg:var(--fill-success-solid);--button-success-bg-hover:var(--fill-success-solid-hover);--button-success-bg-active:var(--fill-success-solid-active);--button-success-text:var(--text-on-solid);--button-success-icon:var(--icon-on-solid);--button-danger-bg:var(--fill-danger-solid);--button-danger-bg-hover:var(--fill-danger-solid-hover);--button-danger-bg-active:var(--fill-danger-solid-active);--button-danger-text:var(--text-on-solid);--button-danger-icon:var(--icon-on-solid);--button-warning-bg:var(--fill-warning-solid);--button-warning-bg-hover:var(--fill-warning-solid-hover);--button-warning-bg-active:var(--fill-warning-solid-active);--button-warning-text:var(--text-on-solid);--button-warning-icon:var(--icon-on-solid);--button-info-bg:var(--fill-info-solid);--button-info-bg-hover:var(--fill-info-solid-hover);--button-info-bg-active:var(--fill-info-solid-active);--button-info-text:var(--text-on-solid);--button-info-icon:var(--icon-on-solid);--button-accent-bg:var(--fill-accent-solid);--button-accent-bg-hover:var(--fill-accent-solid-hover);--button-accent-bg-active:var(--fill-accent-solid-active);--button-accent-text:var(--text-on-solid);--button-accent-icon:var(--icon-on-solid);--duration-instant:50ms;--duration-fast:100ms;--duration-normal:200ms;--duration-slow:350ms;--duration-sluggish:500ms;--ease-spring:cubic-bezier(0.16,1,0.3,1);--ease-smooth:cubic-bezier(0.4,0,0.2,1);--ease-in:cubic-bezier(0.4,0,1,1);--ease-out:cubic-bezier(0,0,0.2,1);--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--space-20:80px;--radius-xs:2px;--radius-sm:4px;--radius-md:6px;--radius-lg:8px;--radius-xl:12px;--radius-2xl:16px;--radius-3xl:24px;--radius-pill:9999px;--z-base:0;--z-raised:10;--z-sticky:100;--z-dropdown:200;--z-overlay:300;--z-modal:400;--z-toast:500;--z-tooltip:600}*,:after,:before{box-sizing:border-box}body{background:var(--fill-base);background-image:var(--gradient-page-bg);background-attachment:fixed;color:var(--text-neutral-primary);font-family:var(--font-body);line-height:1.6;min-height:100vh;overflow-x:hidden;position:relative}.app-title,.card-title,.drawer-title,.group-title,.section-title,h1,h2,h3,h4,h5,h6{font-family:var(--font-display)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--fill-base)}::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-neutral-disabled)}.theme-toggle-btn{background:var(--fill-surface-raised);border:1px solid var(--border-default);color:var(--text-neutral-primary);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border-radius:2px;transition:all .2s ease}.theme-toggle-btn:hover{background:var(--fill-surface-overlay);border-color:var(--border-strong)}.app-header{border-bottom:1px solid var(--border-subtle);padding:24px 32px;justify-content:space-between;position:sticky;top:0;background:var(--fill-header);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);z-index:1000}.app-header,.brand-section{display:flex;align-items:center}.brand-section{flex-direction:row;gap:8px}.header-logo{height:28px;width:auto;display:block;flex-shrink:0;overflow:visible}.logo-hi{fill:var(--lime-500)}.logo-mid{fill:var(--lime-600)}.logo-shadow-mid{fill:var(--lime-700)}.logo-shadow-deep{fill:var(--lime-800)}.logo-wordmark{fill:var(--text-neutral-primary)}.platform-tag{font-family:var(--font-mono);font-size:var(--font-size-micro);letter-spacing:.15em;text-transform:uppercase;color:var(--text-neutral-tertiary);font-weight:var(--font-weight-bold);padding-left:8px;border-left:1px solid var(--border-default)}.app-title{font-size:var(--font-size-title-lg);font-weight:var(--font-weight-extra-bold);letter-spacing:-.02em;display:flex;align-items:center;gap:8px}.app-title span{color:var(--text-brand)}.version-badge{font-size:10px;padding:2px 8px;background:var(--fill-nav-active);color:var(--text-nav-active);border-radius:var(--radius-sm);font-family:var(--font-mono);font-weight:600}.nav-links{display:flex;gap:8px}.nav-btn{background:transparent;border:1px solid transparent;color:var(--text-neutral-tertiary);padding:8px 16px;border-radius:var(--radius-md);font-size:var(--font-size-body-sm);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--duration-normal) var(--ease-smooth)}.nav-btn:hover{background:var(--fill-nav-hover);color:var(--text-neutral-primary)}.nav-btn.active{background:var(--fill-nav-active);border-color:transparent;color:var(--text-brand)}.container{max-width:1400px;margin:0 auto;padding:40px 32px}.tab-pane{display:none;animation:fadeIn .4s cubic-bezier(.16,1,.3,1)}.tab-pane.active{display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.meta-panel{background:var(--surface-lift),var(--fill-surface);border:1px solid var(--border-subtle);border-top:1px solid oklch(100% 0 0/.07);border-radius:12px;padding:24px;margin-bottom:40px;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:24px;box-shadow:var(--shadow-sm)}.meta-item h3{font-size:11px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px}.meta-item b,.meta-item h3,.meta-item strong{color:var(--text-neutral-primary);font-weight:700}.meta-item p{font-size:13px;color:var(--text-neutral-secondary);line-height:1.5}.meta-item code{font-family:var(--font-mono);font-size:11px;background:var(--fill-surface-raised);padding:2px 6px;border-radius:4px;color:var(--text-brand-subtle)}.section-header{display:flex;align-items:baseline;justify-content:space-between;border-bottom:1px solid var(--border-subtle);padding-bottom:12px;margin-bottom:24px}@media (max-width:768px){.section-header{flex-direction:column;align-items:flex-start;gap:8px}}.section-title{font-size:var(--font-size-title-sm);font-weight:var(--font-weight-bold);letter-spacing:-.01em;color:var(--text-neutral-primary);display:flex;align-items:center;gap:8px}.section-title span{font-family:var(--font-mono);font-size:var(--font-size-body-sm)}.section-desc,.section-title span{color:var(--text-neutral-tertiary)}.notice-box,.section-desc{font-size:12px}.notice-box{display:flex;align-items:flex-start;gap:10px;border-radius:8px;padding:10px 14px;background:var(--surface-lift-raised),var(--fill-surface-raised);border:1px solid var(--border-subtle);border-top:1px solid oklch(100% 0 0/.07);line-height:1.6;color:var(--text-neutral-secondary);margin-bottom:16px;box-shadow:var(--shadow-xs)}.notice-box:before{content:"";flex-shrink:0;width:5px;height:5px;border-radius:50%;margin-top:5px;background:var(--text-neutral-tertiary)}.notice-box.success{background:var(--fill-success-subtle)}.notice-box.success:before{background:var(--text-success)}.notice-box.warning{background:var(--fill-warning-subtle)}.notice-box.warning:before{background:var(--text-warning)}.notice-box.danger{background:var(--fill-danger-subtle)}.notice-box.danger:before{background:var(--text-danger)}.notice-box.info{background:var(--fill-info-subtle)}.notice-box.info:before{background:var(--text-info)}.notice-box.accent{background:var(--fill-accent-subtle)}.notice-box.accent:before{background:var(--text-accent)}.notice-box b{color:var(--text-neutral-primary);font-weight:600}.color-scale-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:4px;margin-bottom:40px}.color-card{aspect-ratio:3/4;border-radius:8px;padding:12px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;cursor:pointer;transition:all .2s cubic-bezier(.16,1,.3,1);border:1px solid var(--border-subtle)}.color-card:hover{transform:translateY(-4px) scale(1.02);box-shadow:var(--shadow-md);z-index:10}[data-token*=alpha]{aspect-ratio:auto!important;min-height:68px!important;transition:all .2s cubic-bezier(.16,1,.3,1)!important}[data-token*=alpha]:hover{transform:translateY(-2px) scale(1.03)!important;border-color:var(--border-focus)!important;box-shadow:var(--shadow-md)!important}.color-tag{align-self:flex-start;font-family:var(--font-mono);font-size:8px;font-weight:700;padding:2px 4px;background:rgba(0,0,0,.2);border-radius:3px;line-height:1}.color-info{display:flex;flex-direction:column;gap:2px}.color-name{font-size:11px;font-weight:700;line-height:1.1}.color-hex{font-size:9px;opacity:.8}.color-hex,.color-oklch{font-family:var(--font-mono)}.color-oklch{font-size:8px;opacity:.5;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.semantic-section{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:24px;margin-bottom:48px}.semantic-group{background:var(--surface-lift),var(--fill-surface);border:1px solid var(--border-subtle);border-top:1px solid oklch(100% 0 0/.07);border-radius:12px;padding:24px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:16px}.group-title{font-size:var(--font-size-body-sm);font-weight:var(--font-weight-bold);text-transform:uppercase;letter-spacing:.1em;color:var(--text-neutral-primary);border-bottom:1px solid var(--border-subtle);padding-bottom:8px}.token-row{display:flex;align-items:center;gap:12px;padding:8px;border-radius:6px;transition:background .15s ease;cursor:pointer}.token-row:hover{background:var(--fill-surface-hover)}.token-dot{width:24px;height:24px;border-radius:6px;flex-shrink:0;border:1px solid var(--border-subtle)}.token-dot-text{font-family:var(--font-display);font-weight:var(--font-weight-bold);font-size:13px}.token-dot-icon,.token-dot-text{width:24px;height:24px;border-radius:6px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:var(--fill-surface-raised);border:1px solid var(--border-subtle);box-shadow:var(--shadow-inset)}.token-dot-icon .lucide{width:14px;height:14px;stroke-width:2px}.token-meta{flex:1;min-width:0}.token-name{font-family:var(--font-mono);color:var(--text-neutral-primary);font-weight:500;margin-bottom:2px}.token-desc,.token-name{font-size:11px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.token-desc{color:var(--text-neutral-tertiary)}.token-value-badge{font-family:var(--font-mono);font-size:9px;background:var(--fill-surface-overlay);color:var(--text-neutral-secondary);padding:3px 6px;border-radius:4px;text-align:right;max-width:100px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.semantic-section-label{font-family:var(--font-mono);font-size:var(--font-size-micro);font-weight:var(--font-weight-bold);text-transform:uppercase;letter-spacing:.15em;color:var(--text-brand);margin:32px 0 12px;padding-left:4px}.token-dot-motion{width:24px;height:6px;border-radius:3px;background:var(--fill-brand-subtle);flex-shrink:0;position:relative;overflow:hidden}.token-dot-motion:after{content:"";position:absolute;left:0;top:0;bottom:0;width:35%;background:var(--text-brand);border-radius:3px}.token-dot-radius{width:22px;height:22px;background:var(--fill-brand-subtle);flex-shrink:0}.token-dot-z{width:24px;height:22px;flex-shrink:0;position:relative}.token-dot-z:before{content:"";position:absolute;width:17px;height:17px;border-radius:4px;background:var(--fill-surface-overlay);bottom:0;left:0}.token-dot-z:after{content:"";position:absolute;width:15px;height:15px;border-radius:3px;background:var(--fill-brand-subtle);top:0;right:0}.semantic-section{margin-bottom:0}.playground-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:32px}.playground-card{background:var(--surface-lift),var(--fill-surface);border:1px solid var(--border-subtle);border-top:1px solid oklch(100% 0 0/.07);border-radius:16px;padding:28px;box-shadow:var(--shadow-md);display:flex;flex-direction:column;gap:24px;position:relative}.card-title{font-size:var(--font-size-body-md);font-weight:var(--font-weight-bold);letter-spacing:-.01em;color:var(--text-neutral-primary);border-bottom:1px solid var(--border-subtle);padding-bottom:12px}.play-row{display:flex;flex-wrap:wrap;gap:12px}.btn-nb,.play-row{align-items:center}.btn-nb{display:inline-flex;justify-content:center;gap:6px;padding:0 14px;height:36px;border:1px solid transparent;border-radius:6px;font-family:var(--font-body);font-size:13px;font-weight:500;line-height:1;letter-spacing:.01em;cursor:pointer;transition:background .12s ease,color .12s ease,border-color .12s ease,box-shadow .12s ease,transform 80ms ease,opacity .12s ease;white-space:nowrap;text-decoration:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;position:relative;overflow:hidden;outline:none;color:var(--text-neutral-primary);-webkit-font-smoothing:antialiased}.btn-nb:focus-visible{outline:2px solid var(--fill-brand);outline-offset:2px;box-shadow:0 0 0 4px oklch(73.28% .15 162/.2)}.btn-disabled,.btn-nb:disabled{opacity:.38;cursor:not-allowed;pointer-events:none}.btn-nb.loading{color:transparent!important;pointer-events:none}.btn-nb.loading:before{content:"";position:absolute;width:14px;height:14px;top:calc(50% - 7px);left:calc(50% - 7px);border:2px solid rgba(255,255,255,.35);border-top-color:rgba(255,255,255,.85);border-radius:50%;animation:btn-spin .7s linear infinite}.btn-nb.btn-tertiary.loading:before{border-color:var(--gray-600);border-top-color:var(--gray-300)}.btn-nb.btn-secondary.loading:before{border-color:var(--gray-500);border-top-color:var(--gray-200)}[data-theme=light] .btn-nb.btn-secondary.loading:before{border-color:var(--gray-300);border-top-color:var(--gray-700)}@keyframes btn-spin{to{transform:rotate(1turn)}}.btn-nb.countdown:after{content:"";position:absolute;bottom:0;left:0;height:2px;width:100%;background:currentColor;opacity:.4;animation:btn-countdown var(--countdown-duration,10s) linear forwards;transform-origin:left}@keyframes btn-countdown{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.btn-sm{height:28px;padding:0 10px;font-size:12px;gap:4px;border-radius:5px}.btn-md{height:36px;padding:0 14px;font-size:13px;gap:6px;border-radius:6px}.btn-lg{height:44px;padding:0 18px;font-size:14px;gap:6px;border-radius:7px}.btn-xl{height:52px;padding:0 24px;font-size:15px;gap:8px;border-radius:8px}.btn-sm .lucide{width:12px;height:12px;flex-shrink:0}.btn-md .lucide{width:14px;height:14px;flex-shrink:0}.btn-lg .lucide{width:16px;height:16px;flex-shrink:0}.btn-xl .lucide{width:18px;height:18px;flex-shrink:0}.btn-full{width:100%}.btn-icon{padding:0;aspect-ratio:1}.btn-primary{background-color:var(--gray-50);background-image:none;color:var(--gray-950);border:1px solid rgba(0,0,0,.12);font-weight:600}.btn-primary,.btn-primary:hover{box-shadow:0 1px 3px oklch(0 0 0/.3)}.btn-primary:hover{background-color:var(--gray-0)}.btn-primary:active{background-color:var(--gray-100);background-image:none;box-shadow:inset 0 1px 2px oklch(0 0 0/.15);transform:translateY(.5px)}.btn-primary.loading:before{border-color:rgba(0,0,0,.7) rgba(0,0,0,.2) rgba(0,0,0,.2)}[data-theme=light] .btn-primary{background-color:var(--gray-900);background-image:none;color:var(--gray-0);border-color:transparent;box-shadow:none}[data-theme=light] .btn-primary:hover{background-color:var(--gray-800);background-image:none}[data-theme=light] .btn-primary:active{background-color:var(--gray-950);background-image:none;transform:translateY(.5px)}[data-theme=light] .btn-primary.loading:before{border-color:rgba(255,255,255,.9) rgba(255,255,255,.3) rgba(255,255,255,.3)}[data-theme=light] .btn-primary.btn--brand{background-color:var(--fill-brand-solid);color:var(--text-on-brand-solid);box-shadow:0 1px 2px oklch(0 0 0/.15),inset 0 1px 0 oklch(100% 0 0/.2)}[data-theme=light] .btn-primary.btn--brand:hover{background-color:var(--fill-brand-solid-hover);box-shadow:0 1px 4px oklch(0 0 0/.2),inset 0 1px 0 oklch(100% 0 0/.2)}[data-theme=light] .btn-primary.btn--brand:active{background-color:var(--fill-brand-solid-active);box-shadow:inset 0 1px 2px oklch(0 0 0/.15)}[data-theme=light] .btn-primary.btn--buy{background-color:var(--fill-success-solid);color:var(--text-on-success-solid);box-shadow:0 1px 4px oklch(0 0 0/.2),inset 0 1px 0 oklch(100% 0 0/.25)}[data-theme=light] .btn-primary.btn--buy:hover{background-color:var(--fill-success-solid-hover);box-shadow:0 2px 6px oklch(0 0 0/.25),inset 0 1px 0 oklch(100% 0 0/.25)}[data-theme=light] .btn-primary.btn--buy:active{background-color:var(--fill-success-solid-active);box-shadow:inset 0 1px 3px oklch(0 0 0/.2)}[data-theme=light] .btn-primary.btn--sell{background-color:var(--fill-danger-solid);color:var(--text-on-solid);box-shadow:0 1px 4px oklch(0 0 0/.25),inset 0 1px 0 oklch(100% 0 0/.15)}[data-theme=light] .btn-primary.btn--sell:hover{background-color:var(--fill-danger-solid-hover);box-shadow:0 2px 6px oklch(0 0 0/.3),inset 0 1px 0 oklch(100% 0 0/.15)}[data-theme=light] .btn-primary.btn--sell:active{background-color:var(--fill-danger-solid-active);box-shadow:inset 0 1px 3px oklch(0 0 0/.2)}[data-theme=light] .btn-primary.btn--warning{background-color:var(--fill-warning-solid);color:var(--text-on-warning-solid);box-shadow:0 1px 3px oklch(0 0 0/.15),inset 0 1px 0 oklch(100% 0 0/.2)}[data-theme=light] .btn-primary.btn--warning:hover{background-color:var(--fill-warning-solid-hover);box-shadow:0 2px 5px oklch(0 0 0/.2),inset 0 1px 0 oklch(100% 0 0/.2)}[data-theme=light] .btn-primary.btn--warning:active{background-color:var(--fill-warning-solid-active);box-shadow:inset 0 1px 2px oklch(0 0 0/.15)}[data-theme=light] .btn-primary.btn--info{background-color:var(--fill-info-solid);color:var(--text-on-solid);box-shadow:0 1px 4px oklch(0 0 0/.25),inset 0 1px 0 oklch(100% 0 0/.15)}[data-theme=light] .btn-primary.btn--info:hover{background-color:var(--fill-info-solid-hover);box-shadow:0 2px 6px oklch(0 0 0/.3),inset 0 1px 0 oklch(100% 0 0/.15)}[data-theme=light] .btn-primary.btn--info:active{background-color:var(--fill-info-solid-active);box-shadow:inset 0 1px 3px oklch(0 0 0/.2)}.btn-primary.btn--brand{background-color:var(--button-brand-bg);background-image:none;color:var(--button-brand-text);border-color:transparent;box-shadow:0 1px 2px oklch(0 0 0/.25),inset 0 1px 0 oklch(100% 0 0/.1);font-weight:700}.btn-primary.btn--brand:hover{background-color:var(--button-brand-bg-hover);box-shadow:0 1px 4px oklch(0 0 0/.3),inset 0 1px 0 oklch(100% 0 0/.1)}.btn-primary.btn--brand:active{background-color:var(--button-brand-bg-active);box-shadow:inset 0 1px 2px oklch(0 0 0/.2);transform:translateY(.5px)}.btn-primary.btn--buy{background-color:var(--button-success-bg);background-image:none;color:var(--button-success-text);border-color:transparent;box-shadow:0 1px 4px oklch(0 0 0/.4),inset 0 1px 0 oklch(100% 0 0/.2);font-weight:700}.btn-primary.btn--buy:hover{background-color:var(--button-success-bg-hover);box-shadow:0 2px 6px oklch(0 0 0/.45),inset 0 1px 0 oklch(100% 0 0/.2)}.btn-primary.btn--buy:active{background-color:var(--button-success-bg-active);box-shadow:inset 0 1px 3px oklch(0 0 0/.3);transform:translateY(.5px) scale(.99)}.btn-primary.btn--sell{background-color:var(--button-danger-bg);background-image:none;color:var(--button-danger-text);border-color:transparent;box-shadow:0 1px 4px oklch(0 0 0/.4),inset 0 1px 0 oklch(100% 0 0/.2);font-weight:700}.btn-primary.btn--sell:hover{background-color:var(--button-danger-bg-hover);box-shadow:0 2px 6px oklch(0 0 0/.45),inset 0 1px 0 oklch(100% 0 0/.2)}.btn-primary.btn--sell:active{background-color:var(--button-danger-bg-active);box-shadow:inset 0 1px 3px oklch(0 0 0/.3);transform:translateY(.5px) scale(.99)}.btn-primary.btn--warning{background-color:var(--button-warning-bg);background-image:none;color:var(--button-warning-text);border-color:transparent;box-shadow:0 1px 4px oklch(0 0 0/.4),inset 0 1px 0 oklch(100% 0 0/.2);font-weight:700}.btn-primary.btn--warning:hover{background-color:var(--button-warning-bg-hover);box-shadow:0 2px 6px oklch(0 0 0/.45),inset 0 1px 0 oklch(100% 0 0/.2)}.btn-primary.btn--warning:active{background-color:var(--button-warning-bg-active);box-shadow:inset 0 1px 2px oklch(0 0 0/.2);transform:translateY(.5px)}.btn-primary.btn--info{background-color:var(--button-info-bg);background-image:none;color:var(--button-info-text);border-color:transparent;box-shadow:0 1px 4px oklch(0 0 0/.4),inset 0 1px 0 oklch(100% 0 0/.2);font-weight:600}.btn-primary.btn--info:hover{background-color:var(--button-info-bg-hover);box-shadow:0 2px 6px oklch(0 0 0/.45),inset 0 1px 0 oklch(100% 0 0/.2)}.btn-primary.btn--info:active{background-color:var(--button-info-bg-active);box-shadow:inset 0 1px 3px oklch(0 0 0/.3);transform:translateY(.5px) scale(.99)}.btn-secondary{background-color:var(--gray-700);color:var(--text-neutral-primary);border-color:transparent;box-shadow:0 1px 2px oklch(0 0 0/.2),inset 0 1px 0 oklch(100% 0 0/.07);font-weight:500}.btn-secondary:hover{background-color:var(--gray-600);color:var(--text-neutral-primary);box-shadow:0 1px 3px oklch(0 0 0/.22),inset 0 1px 0 oklch(100% 0 0/.07)}.btn-secondary:active{background-color:var(--gray-700);box-shadow:inset 0 1px 2px oklch(0 0 0/.25);transform:translateY(.5px)}[data-theme=light] .btn-secondary{background-color:var(--gray-0);color:var(--text-neutral-secondary);border:1px solid var(--border-default);box-shadow:var(--shadow-xs)}[data-theme=light] .btn-secondary:hover{background-color:var(--gray-50);color:var(--text-neutral-primary);border-color:var(--border-interactive);box-shadow:var(--shadow-sm)}[data-theme=light] .btn-secondary:active{background-color:var(--gray-100);box-shadow:none;transform:translateY(.5px)}.btn-secondary.btn--buy{background-color:var(--fill-success-subtle);color:var(--text-success);border-color:transparent}.btn-secondary.btn--buy:hover{background-color:var(--fill-success-subtle-hover);color:var(--green-400);border-color:transparent}.btn-secondary.btn--sell{background-color:var(--fill-danger-subtle);color:var(--text-danger);border-color:transparent}.btn-secondary.btn--sell:hover{background-color:var(--fill-danger-subtle-hover);color:var(--red-400);border-color:transparent}.btn-secondary.btn--warning{background-color:var(--fill-warning-subtle);color:var(--text-warning);border-color:transparent}.btn-secondary.btn--warning:hover{background-color:var(--fill-warning-subtle-hover);color:var(--amber-400);border-color:transparent}.btn-secondary.btn--info{background-color:var(--fill-info-subtle);color:var(--text-info);border-color:transparent}.btn-secondary.btn--info:hover{background-color:var(--fill-info-subtle-hover);color:var(--blue-400);border-color:transparent}.btn-secondary.btn--brand{background-color:var(--fill-brand-subtle);color:var(--text-brand);border-color:transparent}.btn-secondary.btn--brand:hover{background-color:var(--fill-brand-subtle-hover);color:var(--lime-400);border-color:transparent}.btn-tertiary{background:transparent;color:var(--text-neutral-tertiary);border:none;font-weight:400}.btn-tertiary:hover{background:transparent;color:var(--text-neutral-primary)}.btn-tertiary:active{background:transparent;color:var(--gray-50)}[data-theme=light] .btn-tertiary{color:var(--gray-400)}[data-theme=light] .btn-tertiary:hover{background:transparent;color:var(--gray-800)}.btn-tertiary.btn--buy{color:var(--green-700)}.btn-tertiary.btn--buy:hover{color:var(--green-400);background:transparent}.btn-tertiary.btn--sell{color:var(--red-700)}.btn-tertiary.btn--sell:hover{color:var(--red-400);background:transparent}.btn-tertiary.btn--warning{color:var(--amber-700)}.btn-tertiary.btn--warning:hover{color:var(--amber-400);background:transparent}.btn-tertiary.btn--info{color:var(--blue-700)}.btn-tertiary.btn--info:hover{color:var(--blue-400);background:transparent}.btn-tertiary.btn--brand{color:var(--lime-700)}.btn-tertiary.btn--brand:hover{color:var(--lime-400);background:transparent}[data-theme=light] .btn-tertiary.btn--buy{color:var(--green-600)}[data-theme=light] .btn-tertiary.btn--buy:hover{color:var(--green-800)}[data-theme=light] .btn-subtle.btn--sell{color:var(--red-700)}[data-theme=light] .btn-tertiary.btn--sell{color:var(--red-600)}[data-theme=light] .btn-tertiary.btn--sell:hover{color:var(--red-800)}[data-theme=light] .btn-tertiary.btn--warning{color:var(--amber-600)}[data-theme=light] .btn-tertiary.btn--warning:hover{color:var(--amber-800)}.btn-subtle{background:var(--gray-alpha-16);color:var(--text-neutral-primary);border:none;font-weight:500}.btn-subtle,.btn-subtle:hover{box-shadow:inset 0 1px 0 oklch(100% 0 0/.04)}.btn-subtle:hover{background:var(--gray-alpha-24)}.btn-subtle:active{background:var(--gray-alpha-32);box-shadow:inset 0 1px 2px oklch(0 0 0/.15);transform:translateY(.5px)}.btn-subtle.btn--brand{background:var(--fill-brand-subtle);color:var(--text-brand)}.btn-subtle.btn--brand:hover{background:var(--fill-brand-subtle-hover)}.btn-subtle.btn--buy{background:var(--fill-success-subtle);color:var(--text-bid)}.btn-subtle.btn--buy:hover{background:var(--fill-success-subtle-hover)}.btn-subtle.btn--sell{background:var(--fill-danger-subtle);color:var(--red-400)}.btn-subtle.btn--sell:hover{background:var(--fill-danger-subtle-hover)}.btn-subtle.btn--warning{background:var(--fill-warning-subtle);color:var(--text-warning)}.btn-subtle.btn--warning:hover{background:var(--fill-warning-subtle-hover)}.btn-subtle.btn--info{background:var(--fill-info-subtle);color:var(--text-info)}.btn-subtle.btn--info:hover{background:var(--fill-info-subtle-hover)}.btn-subtle.btn--danger{background:var(--fill-danger-subtle);color:var(--text-danger)}.btn-subtle.btn--danger:hover{background:var(--fill-danger-subtle-hover)}.btn-chip{display:inline-flex;align-items:center;gap:4px;height:28px;padding:0 10px;border-radius:99px;border:1px solid oklch(100% 0 0/.1);background:oklch(100% 0 0/.05);color:var(--text-neutral-tertiary);font-family:var(--font-body);font-size:12px;font-weight:500;line-height:1;cursor:pointer;transition:background .1s ease,color .1s ease,border-color .1s ease;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;user-select:none;outline:none;-webkit-font-smoothing:antialiased}.btn-chip:hover{background:oklch(100% 0 0/.09);color:var(--text-neutral-secondary);border-color:oklch(100% 0 0/.16)}.btn-chip.selected,.btn-chip[aria-pressed=true]{background:oklch(100% 0 0/.13);color:var(--text-neutral-primary);border-color:oklch(100% 0 0/.22);font-weight:600}.btn-chip:focus-visible{outline:2px solid var(--fill-brand);outline-offset:2px}.btn-chip:disabled{opacity:.38;cursor:not-allowed;pointer-events:none}.btn-chip.btn--buy{background:oklch(73.28% .15 162/.08);color:var(--text-success);border-color:oklch(73.28% .15 162/.2)}.btn-chip.btn--buy.selected,.btn-chip.btn--buy:hover{background:oklch(73.28% .15 162/.16);color:var(--green-400);border-color:oklch(73.28% .15 162/.35)}.btn-chip.btn--sell{background:oklch(63% .18 25/.08);color:var(--text-danger);border-color:oklch(63% .18 25/.2)}.btn-chip.btn--sell.selected,.btn-chip.btn--sell:hover{background:oklch(63% .18 25/.16);color:var(--red-400);border-color:oklch(63% .18 25/.35)}.btn-chip.btn--brand{background:oklch(85.92% .2248 126/.08);color:var(--text-brand);border-color:oklch(85.92% .2248 126/.2)}.btn-chip.btn--brand.selected,.btn-chip.btn--brand:hover{background:oklch(85.92% .2248 126/.16);color:var(--lime-400);border-color:oklch(85.92% .2248 126/.35)}[data-theme=light] .btn-chip{background:oklch(0 0 0/.04);color:var(--gray-500);border-color:oklch(0 0 0/.1)}[data-theme=light] .btn-chip:hover{background:oklch(0 0 0/.07);color:var(--gray-700)}[data-theme=light] .btn-chip.selected{background:oklch(0 0 0/.1);color:var(--gray-900)}.btn-danger{background:var(--fill-danger-subtle);color:var(--red-400);border:none;font-weight:500}.btn-danger:hover{background:var(--fill-danger-subtle-hover);color:var(--red-300)}.btn-danger:active{background:oklch(24% .09 25);color:var(--red-400);transform:translateY(.5px)}[data-theme=light] .btn-danger{background:oklch(95% .02 25);color:var(--red-700)}[data-theme=light] .btn-danger:hover{background:oklch(90% .04 25);color:var(--red-800)}[data-theme=light] .btn-danger:active{background:oklch(85% .06 25);color:var(--red-800);transform:translateY(.5px)}.btn-danger.btn--solid{background-color:var(--button-danger-bg);background-image:none;color:var(--button-danger-text);border-color:transparent;box-shadow:none;font-weight:700}.btn-danger.btn--solid:hover{background-color:var(--button-danger-bg-hover)}.btn-danger.btn--solid:active{background-color:var(--button-danger-bg-active);transform:translateY(.5px) scale(.99)}.btn-success-solid{background-color:var(--button-success-bg);background-image:none;color:var(--button-success-text);border:1px solid transparent;box-shadow:none;font-weight:700}.btn-success-solid:hover{background-color:var(--button-success-bg-hover)}.btn-success-solid:active{transform:translateY(.5px)}.btn-success-solid:focus-visible{outline-color:var(--green-500)}.btn-danger-solid{background-color:var(--button-danger-bg);background-image:none;color:var(--button-danger-text);border:1px solid transparent;box-shadow:none;font-weight:700}.btn-danger-solid:hover{background-color:var(--button-danger-bg-hover)}.btn-danger-solid:active{transform:translateY(.5px)}.btn-danger-solid:focus-visible{outline-color:var(--red-500)}.btn-warning-solid{background-color:var(--button-warning-bg);background-image:none;color:var(--button-warning-text);border:1px solid transparent;box-shadow:none;font-weight:700}.btn-warning-solid:hover{background-color:var(--button-warning-bg-hover)}.btn-warning-solid:active{transform:translateY(.5px)}.btn-info-solid{background-color:var(--button-info-bg);background-image:none;color:var(--button-info-text);border:1px solid transparent;box-shadow:none;font-weight:700}.btn-info-solid:hover{background-color:var(--button-info-bg-hover)}.btn-info-solid:active{transform:translateY(.5px)}.btn-ghost{background:transparent;color:var(--text-neutral-tertiary);border:1px solid transparent;font-weight:400}.btn-ghost:hover{background:transparent;color:var(--text-neutral-primary)}.btn-ghost:active{color:var(--gray-50)}.btn-ghost-brand{color:var(--lime-600)}.btn-ghost-success{color:var(--green-600)}.btn-ghost-warning{color:var(--amber-600)}.btn-ghost-danger{color:var(--red-600)}.btn-ghost-info{color:var(--blue-600)}.btn-ghost-brand:hover,.btn-ghost-danger:hover,.btn-ghost-info:hover,.btn-ghost-success:hover,.btn-ghost-warning:hover{background:transparent}.btn-ghost-brand:hover{color:var(--lime-400)}.btn-ghost-success:hover{color:var(--green-400)}.btn-ghost-warning:hover{color:var(--amber-400)}.btn-ghost-danger:hover{color:var(--red-400)}.btn-ghost-info:hover{color:var(--blue-400)}.btn-outline-neutral{background:transparent;color:var(--text-neutral-primary);border:1px solid var(--border-default)}.btn-outline-neutral:hover{background:var(--fill-surface-raised);border-color:var(--border-strong)}.btn-outline-brand{background:transparent;color:var(--text-brand);border:1px solid var(--text-brand)}.btn-outline-brand:hover{background:var(--fill-brand-subtle)}.btn-outline-success{background:transparent;color:var(--text-success);border:1px solid var(--border-success)}.btn-outline-success:hover{background:var(--fill-success-subtle)}.btn-outline-warning{background:transparent;color:var(--text-warning);border:1px solid var(--border-warning)}.btn-outline-warning:hover{background:var(--fill-warning-subtle)}.btn-outline-danger{background:transparent;color:var(--text-danger);border:1px solid var(--border-danger)}.btn-outline-danger:hover{background:var(--fill-danger-subtle)}.btn-outline-info{background:transparent;color:var(--text-info);border:1px solid var(--border-info)}.btn-outline-info:hover{background:var(--fill-info-subtle)}.btn-subtle{background:var(--fill-brand-subtle);color:var(--text-brand)}.btn-subtle:hover{background:var(--fill-brand-subtle-hover)}.btn-success{background:var(--fill-success-subtle);color:var(--text-success)}.btn-success:hover{background:var(--fill-success-subtle-hover)}.btn-warning{background:var(--fill-warning-subtle);color:var(--text-warning)}.btn-warning:hover{background:var(--fill-warning-subtle-hover)}.btn-info{background:var(--fill-info-subtle);color:var(--text-info)}.btn-info:hover{background:var(--fill-info-subtle-hover)}.btn-white{background:var(--gray-0);color:var(--text-neutral-inverse);border:1px solid transparent}.btn-white:hover{background:var(--gray-100)}.btn-white:active{background:var(--gray-200)}[data-theme=light] .btn-white{background:var(--gray-950);color:var(--gray-0)}[data-theme=light] .btn-white:hover{background:var(--gray-800)}.btn-link{background:transparent;color:var(--text-neutral-primary);border:none;padding:0;border-radius:0;height:auto;line-height:inherit;font-weight:400}.btn-link:hover{text-decoration:underline}.btn-link-brand{color:var(--text-brand)}.btn-link-success{color:var(--text-success)}.btn-link-warning{color:var(--text-warning)}.btn-link-danger{color:var(--text-danger)}.btn-link-info{color:var(--text-info)}.input-nb{background:var(--fill-input);border:1px solid var(--border-default);color:var(--text-neutral-primary);padding:10px 14px;border-radius:8px;font-size:12px;outline:none;font-family:inherit;transition:all .2s ease;width:100%}.input-nb:focus{border-color:var(--border-focus);box-shadow:0 0 0 2px oklch(100% 0 0/.15)}.input-nb:disabled{background:var(--fill-surface-raised)!important;color:var(--text-neutral-disabled)!important;border-color:var(--border-subtle)!important;cursor:not-allowed!important;opacity:.6!important;pointer-events:none!important}.select-nb{background:var(--fill-input);border:1px solid var(--border-default);color:var(--text-neutral-primary);padding:10px 32px 10px 14px;border-radius:8px;font-size:12px;outline:none;font-family:inherit;transition:all .2s ease;width:100%;appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239FA79C' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;background-size:14px;cursor:pointer}.select-nb:focus{border-color:var(--border-focus);box-shadow:0 0 0 2px oklch(100% 0 0/.15)}.select-nb:disabled{background:var(--fill-surface-raised)!important;color:var(--text-neutral-disabled)!important;border-color:var(--border-subtle)!important;cursor:not-allowed!important;opacity:.6!important;pointer-events:none!important}.input-container{position:relative;display:flex;align-items:center;width:100%}.input-container .lucide{position:absolute;color:var(--text-neutral-disabled);pointer-events:none;width:16px;height:16px;stroke-width:2px}.input-container .input-icon-left{left:12px;right:auto}.input-container .input-icon-right{left:auto;right:12px}.input-container.has-icon-left .input-nb{padding-left:36px}.input-container.has-icon-right .input-nb{padding-right:36px}.input-nb.error{border-color:var(--border-danger);box-shadow:0 0 0 2px oklch(63% .1964 30.6/.15)}.input-nb.warning{border-color:var(--border-warning);box-shadow:0 0 0 2px oklch(70.8% .1892 87.5/.15)}.input-nb.success{border-color:var(--text-success);box-shadow:0 0 0 2px oklch(70% .15 150/.15)}.input-nb.info{border-color:var(--text-info);box-shadow:0 0 0 2px oklch(64.7% .2093 269.5/.15)}[data-theme=light] .input-nb,[data-theme=light] .select-nb{border-color:var(--border-default);box-shadow:none}[data-theme=light] .input-nb:focus,[data-theme=light] .select-nb:focus{border-color:var(--lime-500);box-shadow:0 0 0 3px oklch(73.28% .2169 130.3/.22)}[data-theme=light] .input-nb:disabled,[data-theme=light] .select-nb:disabled{opacity:1!important;color:var(--text-neutral-disabled)!important;border-color:var(--border-subtle)!important}.badge-nb{font-size:10px;font-weight:600;padding:4px 8px;border-radius:4px;font-family:var(--font-body);display:inline-flex;align-items:center;justify-content:center;gap:4px;line-height:1;white-space:nowrap;vertical-align:middle;transition:all .2s ease}.badge-nb .lucide{stroke-width:2px;color:inherit;flex-shrink:0;width:10px;height:10px;display:block}.badge-sm{font-size:9px;padding:2px 6px;border-radius:3px;gap:3px}.badge-sm .lucide{width:9px;height:9px}.badge-lg{font-size:12px;padding:6px 12px;border-radius:6px;gap:6px}.badge-lg .lucide{width:12px;height:12px}.badge-pill{border-radius:9999px!important}.badge-brand{background:var(--fill-brand-subtle);color:var(--text-brand-subtle)}.badge-neutral{background:var(--fill-surface-raised);color:var(--text-neutral-secondary)}.badge-success{background:var(--fill-success-subtle);color:var(--text-success)}.badge-warning{background:var(--fill-warning-subtle);color:var(--text-warning)}.badge-danger{background:var(--fill-danger-subtle);color:var(--text-danger)}.badge-info{background:var(--fill-info-subtle);color:var(--text-info)}.badge-accent{background:var(--fill-accent-subtle);color:var(--text-accent)}.badge-brand-solid{background:var(--fill-brand-solid);color:var(--text-on-solid)}.badge-neutral-solid{background:var(--text-neutral-secondary);color:var(--text-neutral-inverse)}.badge-success-solid{background:var(--fill-success-solid);color:var(--text-on-solid)}.badge-warning-solid{background:var(--fill-warning-solid);color:var(--text-on-solid)}.badge-danger-solid{background:var(--fill-danger-solid);color:var(--text-on-solid)}.badge-info-solid{background:var(--fill-info-solid);color:var(--text-on-solid)}.badge-accent-solid{background:var(--fill-accent-solid);color:var(--text-on-solid)}.badge-chip{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;background:var(--fill-surface-raised);color:var(--text-neutral-secondary)}.badge-chip:hover{background:var(--fill-surface-overlay);color:var(--text-neutral-primary)}.badge-chip.selected{background:var(--fill-brand-subtle);color:var(--text-brand)}.badge-chip.selected:hover{background:var(--fill-brand-subtle-hover)}.badge-chip-close{margin-left:2px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;width:12px;height:12px;color:var(--text-neutral-tertiary);transition:all .1s ease}.badge-chip-close:hover{background:var(--gray-alpha-24);color:var(--text-neutral-primary)}.badge-chip.selected .badge-chip-close{color:var(--text-brand-subtle)}.badge-chip.selected .badge-chip-close:hover{background:rgba(255,255,255,.1);color:var(--text-neutral-primary)}.otc-widget{background:var(--fill-surface-raised);border:1px solid var(--border-subtle);border-radius:10px;padding:14px;display:flex;flex-direction:column;gap:8px;margin-bottom:12px}.otc-row{display:flex;justify-content:space-between;align-items:center;padding:4px 0;border-bottom:1px solid var(--border-subtle)}.otc-row:last-child{border-bottom:none}.otc-lbl{font-size:10px;color:var(--text-neutral-tertiary);font-weight:600;letter-spacing:.04em;text-transform:uppercase}.otc-val{font-size:12px;color:var(--text-neutral-primary);font-weight:700;font-family:var(--font-mono)}.otc-price-up{color:var(--text-success)}.analyzer-layout{display:grid;grid-template-columns:1fr 1fr;gap:32px}@media (max-width:800px){.analyzer-layout{grid-template-columns:1fr}}.controls-card{background:var(--surface-lift),var(--fill-surface);border:1px solid var(--border-subtle);border-top:1px solid oklch(100% 0 0/.07);border-radius:16px;padding:24px;gap:20px}.control-group,.controls-card{display:flex;flex-direction:column}.control-group{gap:8px}.control-group label{font-size:var(--font-size-body-sm);font-weight:var(--font-weight-semibold);color:var(--text-neutral-secondary)}.preview-card{border-radius:16px;padding:40px;justify-content:center;text-align:center;min-height:250px;transition:all .3s ease;border:1px solid var(--border-subtle);position:relative}.contrast-display,.preview-card{display:flex;flex-direction:column;align-items:center}.contrast-display{gap:8px;margin-top:16px}.contrast-number{font-size:48px;font-weight:800;font-family:var(--font-mono);line-height:1}.contrast-pass-badge{font-size:11px;font-weight:700;padding:4px 10px;border-radius:12px;text-transform:uppercase;letter-spacing:.05em}.pass-yes{background:var(--fill-success-subtle);color:var(--text-success);border:1px solid oklch(73.3% .3903 113.6/.2)}.pass-no{background:var(--fill-danger-subtle);color:var(--text-danger);border:1px solid oklch(63% .1964 30.6/.2)}.shadow-sandbox-container{display:grid;grid-template-columns:1fr 1fr;gap:24px}.shadow-card-demo{background:var(--surface-lift-raised),var(--fill-surface-raised);border:1px solid var(--border-subtle);border-top:1px solid oklch(100% 0 0/.07);border-radius:12px;padding:24px;min-height:180px;display:flex;flex-direction:column;justify-content:space-between;transition:transform .2s ease}.shadow-card-demo:hover{transform:translateY(-2px)}.shadow-card-demo.black-shadow{box-shadow:0 10px 30px rgba(0,0,0,.75)}.shadow-card-demo.gray-shadow{box-shadow:0 10px 30px var(--gray-950)}.shadow-card-demo.oklch-shadow{box-shadow:0 10px 30px oklch(14.6% .0282 139/.85)}.token-drawer{position:fixed;right:-400px;top:0;width:380px;height:100vh;background:var(--fill-surface-raised);border-left:1px solid var(--border-subtle);box-shadow:var(--shadow-lg);z-index:1000;padding:32px;display:flex;flex-direction:column;gap:24px;transition:right .3s cubic-bezier(.16,1,.3,1)}.token-drawer.open{right:0}.drawer-header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border-subtle);padding-bottom:16px}.drawer-title{font-size:var(--font-size-body-lg);font-weight:var(--font-weight-bold);color:var(--text-neutral-primary)}.close-btn{background:transparent;border:none;color:var(--text-neutral-tertiary);font-size:18px;cursor:pointer;transition:color .15s ease}.close-btn:hover{color:var(--text-neutral-primary)}.drawer-color-preview{height:100px;border-radius:8px;border:1px solid rgba(255,255,255,.08);box-shadow:inset 0 2px 4px rgba(0,0,0,.2)}.drawer-info-grid{gap:14px}.drawer-info-grid,.info-row{display:flex;flex-direction:column}.info-row{gap:4px}.info-lbl{font-size:10px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-neutral-tertiary);font-weight:700}.info-val{font-family:var(--font-mono);font-size:12px;background:var(--fill-surface-raised);padding:8px 12px;border-radius:6px;border:1px solid var(--border-subtle);color:var(--text-brand-subtle);display:flex;justify-content:space-between;align-items:center;cursor:pointer;transition:border-color .15s ease}.info-val:hover{border-color:var(--border-strong)}.copy-icon{font-size:11px;color:var(--text-neutral-tertiary)}.toast{position:fixed;bottom:32px;left:50%;transform:translateX(-50%) translateY(100px);background:var(--fill-brand);color:var(--text-neutral-inverse);padding:12px 24px;border-radius:30px;font-weight:600;font-size:12px;box-shadow:var(--shadow-lg);opacity:0;z-index:2000;transition:all .35s cubic-bezier(.175,.885,.32,1.275)}.toast.show{transform:translateX(-50%) translateY(0);opacity:1}.depth-sandbox{background:var(--fill-surface-raised);border-radius:12px;border:1px solid var(--border-subtle)}.depth-level,.depth-sandbox{padding:16px;display:flex;flex-direction:column}.depth-level{border-radius:8px;gap:8px;transition:transform .2s ease,box-shadow .2s ease;margin-top:4px}.depth-level:hover{transform:translateY(-2px)}.base-layer{background:var(--fill-base)}.surface-layer{background:var(--surface-lift),var(--fill-surface);box-shadow:var(--shadow-sm)}.raised-layer,.surface-layer{border-top:1px solid oklch(100% 0 0/.1)}.raised-layer{background:var(--surface-lift-raised),var(--fill-surface-raised);box-shadow:var(--shadow-md)}.overlay-layer{background:var(--surface-lift-raised),var(--fill-surface-overlay);border-top:1px solid oklch(100% 0 0/.1);box-shadow:var(--shadow-lg);padding:20px}.level-badge{font-family:var(--font-mono);font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--text-brand)}.level-details{font-size:11px;color:var(--text-neutral-secondary)}.level-details code{font-family:var(--font-mono);background:oklch(0 0 0/.2);padding:2px 4px;border-radius:3px;color:var(--text-brand-subtle)}.type-scale-table{width:100%;border-collapse:collapse;margin-top:16px;background:var(--fill-surface);border-radius:8px;overflow:hidden;border:1px solid var(--border-subtle)}.type-scale-table td,.type-scale-table th{padding:16px;text-align:left;border-bottom:1px solid var(--border-subtle)}.type-scale-table th{background:var(--fill-surface-raised);color:var(--text-neutral-secondary);font-weight:var(--font-weight-semibold);font-size:var(--font-size-body-sm);text-transform:uppercase;letter-spacing:.05em}.type-scale-table tr:last-child td{border-bottom:none}.type-token-cell{font-family:var(--font-mono);color:var(--text-brand)}.type-spec-cell,.type-token-cell{font-size:var(--font-size-body-sm)}.type-spec-cell{color:var(--text-neutral-tertiary)}.type-preview-cell{color:var(--text-neutral-primary)}.type-pair-sandbox{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:24px}.sandbox-card{background:var(--surface-lift),var(--fill-surface);border:1px solid var(--border-subtle);border-top:1px solid oklch(100% 0 0/.07);border-radius:8px;padding:24px;display:flex;flex-direction:column;gap:16px;box-shadow:var(--shadow-sm)}.sandbox-card h3{font-size:var(--font-size-title-md)}.sandbox-card h3,.sandbox-card h4{font-family:var(--font-display);font-weight:var(--font-weight-bold);color:var(--text-neutral-primary);margin:0}.sandbox-card h4{font-size:var(--font-size-body-sm)}.sandbox-card .sandbox-token-label{font-family:var(--font-mono);font-size:var(--font-size-micro);color:var(--text-neutral-tertiary);margin-top:-8px}.sandbox-card p{font-size:var(--font-size-body-sm);color:var(--text-neutral-secondary);line-height:1.5;margin:0}.sandbox-card .sandbox-font-preview{color:var(--text-neutral-primary);margin-top:12px;border-top:1px solid var(--border-subtle);padding-top:12px}.sandbox-input{background:var(--fill-surface-raised);border:1px solid var(--border-default);color:var(--text-neutral-primary);padding:12px 16px;border-radius:6px;font-family:var(--font-body);font-size:var(--font-size-body-md);width:100%}.sandbox-input:focus{outline:none;border-color:var(--border-focus)}.sandbox-preview-container{display:flex;flex-direction:column;gap:16px;padding:24px;background:var(--fill-base);border:1px solid var(--border-subtle);border-radius:8px;justify-content:center;min-height:200px}.alpha-demo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:16px}.alpha-demo-card{background:var(--surface-lift),var(--fill-surface);border:1px solid var(--border-subtle);border-top:1px solid oklch(100% 0 0/.07);border-radius:8px;padding:20px;display:flex;flex-direction:column;gap:14px}.alpha-demo-card-title{font-size:var(--font-size-body-sm);font-weight:700;color:var(--text-neutral-primary);border-bottom:1px dashed var(--border-subtle);padding-bottom:8px}.alpha-demo-desc{font-size:var(--font-size-caption);color:var(--text-neutral-tertiary);line-height:1.4}.btn-alpha-solid{position:relative;background:var(--lime-500);color:var(--text-neutral-inverse);border:none;padding:12px 20px;border-radius:6px;font-weight:700;font-size:var(--font-size-body-sm);cursor:pointer;overflow:hidden;transition:all .2s ease;display:inline-flex;align-items:center;justify-content:center}.btn-alpha-solid:after{content:"";position:absolute;inset:0;background:var(--gray-alpha-24);opacity:0;transition:opacity .15s ease}.btn-alpha-solid:hover:after{opacity:1}.btn-alpha-solid:active:after{background:oklch(14.6% .0282 139/.24);opacity:1}.btn-alpha-ghost{position:relative;background:transparent;color:var(--text-brand);border:1px solid var(--lime-800);padding:12px 20px;border-radius:6px;font-weight:700;font-size:var(--font-size-body-sm);cursor:pointer;overflow:hidden;transition:all .2s ease;display:inline-flex;align-items:center;justify-content:center}.btn-alpha-ghost:after{content:"";position:absolute;inset:0;background:var(--lime-alpha-16);opacity:0;transition:opacity .15s ease}.btn-alpha-ghost:hover:after{opacity:1}.btn-alpha-ghost:active:after{background:var(--lime-alpha-32);opacity:1}.card-alpha-item{position:relative;background:var(--fill-surface-raised);border:1px solid var(--border-subtle);border-radius:6px;padding:14px 18px;cursor:pointer;transition:border-color .2s ease;overflow:hidden}.card-alpha-item:after{content:"";position:absolute;inset:0;background:var(--gray-alpha-8);opacity:0;transition:opacity .15s ease;pointer-events:none}.card-alpha-item:hover:after{opacity:1}.card-alpha-item:hover{border-color:var(--border-strong)}.card-alpha-item:active:after{background:oklch(14.6% .0282 139/.24);opacity:1}.matrix-grid-container{background:var(--fill-surface-raised);border:1px solid var(--border-subtle);border-radius:8px;padding:20px}.matrix-row{display:flex;align-items:center;gap:16px;padding:10px 0;border-bottom:1px dashed var(--border-subtle)}.matrix-row:last-child{border-bottom:none}.matrix-row-label{font-size:11px;color:var(--text-neutral-tertiary);font-weight:600;width:120px;flex-shrink:0}.matrix-row-content{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.matrix-table-header{display:flex;align-items:center;gap:16px;padding-bottom:8px;border-bottom:1px solid var(--border-strong);margin-bottom:8px}.matrix-col-header{font-size:10px;color:var(--text-neutral-tertiary);font-weight:700;text-transform:uppercase;letter-spacing:.05em}.matrix-grid-row{display:grid;grid-template-columns:120px repeat(3,1fr);gap:16px;align-items:center;padding:12px 0;border-bottom:1px dashed var(--border-subtle)}.matrix-grid-row:last-child{border-bottom:none}.matrix-grid-row-header{display:grid;grid-template-columns:120px repeat(3,1fr);gap:16px;align-items:center;padding-bottom:8px;border-bottom:1px solid var(--border-strong);margin-bottom:8px}.matrix-cell{justify-content:center}.matrix-cell,.matrix-cell-left{display:flex;align-items:center}.matrix-cell-left{justify-content:flex-start}.modal-scrim{position:fixed;inset:0;background:var(--fill-scrim);z-index:var(--z-modal);display:flex;align-items:center;justify-content:center;backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);animation:scrimFadeIn var(--duration-normal) var(--ease-smooth)}@keyframes scrimFadeIn{0%{opacity:0}to{opacity:1}}.modal-nb{background:var(--fill-surface-overlay);border:1px solid var(--border-default);border-radius:var(--radius-2xl);box-shadow:var(--shadow-overlay);padding:28px 32px;width:min(480px,calc(100vw - 48px));max-height:calc(100vh - 80px);overflow-y:auto;display:flex;flex-direction:column;gap:20px;animation:modalSlideUp var(--duration-normal) var(--ease-spring)}@keyframes modalSlideUp{0%{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.modal-header{display:flex;align-items:center;justify-content:space-between;padding-bottom:16px;border-bottom:1px solid var(--border-subtle)}.modal-title{font-size:var(--font-size-title-sm);font-weight:var(--font-weight-bold);color:var(--text-neutral-primary)}.modal-body{font-size:var(--font-size-body-md);color:var(--text-neutral-secondary);line-height:var(--line-height-body)}.modal-footer{display:flex;justify-content:flex-end;gap:8px;padding-top:16px;border-top:1px solid var(--border-subtle)}.sheet-nb{position:fixed;bottom:0;left:0;right:0;background:var(--fill-surface-overlay);border-top:1px solid var(--border-default);border-radius:var(--radius-2xl) var(--radius-2xl) 0 0;box-shadow:var(--shadow-overlay);padding:20px 24px 32px;z-index:var(--z-modal);display:flex;flex-direction:column;gap:16px;animation:sheetSlideUp var(--duration-normal) var(--ease-spring)}@keyframes sheetSlideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.sheet-handle{width:36px;height:4px;background:var(--border-default);border-radius:var(--radius-pill);align-self:center;margin-bottom:4px}.sheet-title{font-size:var(--font-size-title-sm);font-weight:var(--font-weight-bold);color:var(--text-neutral-primary)}.floating-nb{background:var(--fill-surface-floating);border:1px solid var(--border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-floating);z-index:var(--z-dropdown);animation:floatingFadeIn var(--duration-fast) var(--ease-out)}@keyframes floatingFadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.tooltip-nb{border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:6px 10px;font-size:var(--font-size-body-sm);color:var(--text-neutral-primary);white-space:nowrap;pointer-events:none;z-index:var(--z-tooltip);max-width:240px;white-space:normal}.dropdown-nb,.tooltip-nb{background:var(--fill-surface-floating);box-shadow:var(--shadow-floating)}.dropdown-nb{border:1px solid var(--border-default);border-radius:var(--radius-lg);padding:4px;min-width:160px;z-index:var(--z-dropdown);display:flex;flex-direction:column;gap:1px}.dropdown-item{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:var(--radius-md);font-size:var(--font-size-body-md);color:var(--text-neutral-primary);cursor:pointer;transition:background var(--duration-fast) var(--ease-smooth)}.dropdown-item:hover{background:var(--fill-surface-hover)}.dropdown-item:active{background:var(--fill-surface-pressed)}.dropdown-item.danger{color:var(--text-danger)}.dropdown-item.danger:hover{background:var(--fill-danger-subtle)}.dropdown-separator{height:1px;background:var(--border-subtle);margin:4px 0}.context-menu-nb{background:var(--fill-surface-floating);border:1px solid var(--border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-floating);padding:4px;min-width:180px;z-index:var(--z-tooltip);position:fixed;display:flex;flex-direction:column;gap:1px}.dropdown-item-shortcut{margin-left:auto;font-size:var(--font-size-body-sm);color:var(--text-neutral-tertiary);font-family:var(--font-mono)}.semantic-dual{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:48px}.mode-dark-wrap .semantic-section,.mode-light-wrap .semantic-section{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin-bottom:0;gap:12px}.mode-dark-wrap{background:oklch(14.6% .003 100)}.mode-dark-wrap,.mode-light-wrap{border-radius:8px;padding:10px 12px}.mode-light-wrap{background:oklch(97.1% .003 100);border:1px solid oklch(0 0 0/.1)}.mode-panel-label{font-size:9px;font-weight:600;text-transform:uppercase;letter-spacing:.09em;margin-bottom:8px;display:flex;align-items:center;gap:5px;border-bottom:1px solid oklch(100% 0 0/.06);padding:2px 6px 5px 0}.mode-dark-wrap .mode-panel-label{color:oklch(71.9% .003 100);border-bottom-color:oklch(100% 0 0/.06)}.mode-light-wrap .mode-panel-label{color:oklch(41% .003 100);border-bottom-color:oklch(0 0 0/.1)}.mode-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}.mode-dark-wrap .mode-dot{background:oklch(60% .003 100)}.mode-light-wrap .mode-dot{background:oklch(50% .003 100)}.mode-dark-wrap .token-row,.mode-light-wrap .token-row{background:transparent}.mode-light-wrap .token-name{color:oklch(18% .003 100)}.mode-light-wrap .token-desc{color:oklch(41% .003 100)}.mode-light-wrap .token-value-badge{background:oklch(91% .003 100);color:oklch(31% .003 100);border-color:oklch(0 0 0/.1)}.mode-light-wrap .group-title{color:oklch(18% .003 100);border-bottom-color:oklch(0 0 0/.1)}.color-hex-dark{display:block}.color-hex-light{display:none;font-size:9px;opacity:.7}[data-theme=light] .color-hex-dark{display:none}[data-theme=light] .color-hex-light{display:block}.tvb-dark{display:inline}.tvb-light,[data-theme=light] .tvb-dark{display:none}[data-theme=light] .tvb-light{display:inline}#semantics-pane .tvb-dark,#semantics-pane .tvb-light{display:block!important;line-height:1.5}#semantics-pane .tvb-dark{opacity:.65}#semantics-pane .tvb-light{opacity:1}#semantics-pane .token-value-badge{flex-direction:column;gap:0;align-items:flex-start}.swatch-ctx{display:contents}.token-swatch-pair{display:flex;gap:4px;flex-shrink:0;align-items:center;position:relative}.token-swatch-pair:after{content:"";position:absolute;left:50%;top:15%;height:70%;width:1px;background:oklch(100% 0 0/.12);pointer-events:none}[data-theme=light] .token-swatch-pair:after{background:oklch(0 0 0/.12)}.token-swatch-pair .token-dot{width:20px;height:20px}