:root{--color-palette-amber-50: #fffbeb;--color-palette-amber-100: #fef3c7;--color-palette-amber-200: #fde68a;--color-palette-amber-300: #fcd34d;--color-palette-amber-400: #fbbf24;--color-palette-amber-500: #f59e0b;--color-palette-amber-600: #d97706;--color-palette-amber-700: #b45309;--color-palette-amber-800: #92400e;--color-palette-amber-900: #78350f;--color-palette-cyan-50: #ecfeff;--color-palette-cyan-100: #cffafe;--color-palette-cyan-200: #a5f3fc;--color-palette-cyan-300: #67e8f9;--color-palette-cyan-400: #22d3ee;--color-palette-cyan-500: #06b6d4;--color-palette-cyan-600: #0891b2;--color-palette-cyan-700: #0e7490;--color-palette-cyan-800: #155e75;--color-palette-cyan-900: #164e63;--color-palette-indigo-50: #eef2ff;--color-palette-indigo-100: #e0e7ff;--color-palette-indigo-200: #c7d2fe;--color-palette-indigo-300: #a5b4fc;--color-palette-indigo-400: #818cf8;--color-palette-indigo-500: #6366f1;--color-palette-indigo-600: #4f46e5;--color-palette-indigo-700: #4338ca;--color-palette-indigo-800: #3730a3;--color-palette-indigo-900: #312e81;--color-palette-cosmic-50: #f8fafc;--color-palette-cosmic-100: #f1f5f9;--color-palette-cosmic-200: #e2e8f0;--color-palette-cosmic-300: #cbd5e1;--color-palette-cosmic-400: #94a3b8;--color-palette-cosmic-500: #64748b;--color-palette-cosmic-600: #475569;--color-palette-cosmic-700: #334155;--color-palette-cosmic-800: #1e293b;--color-palette-cosmic-900: #0f172a;--color-palette-cosmic-950: #080e1a;--color-palette-neutral-0: #ffffff;--color-palette-neutral-50: #fafafa;--color-palette-neutral-100: #f5f5f5;--color-palette-neutral-200: #e5e5e5;--color-palette-neutral-300: #d4d4d4;--color-palette-neutral-400: #a3a3a3;--color-palette-neutral-500: #737373;--color-palette-neutral-600: #525252;--color-palette-neutral-700: #404040;--color-palette-neutral-800: #262626;--color-palette-neutral-900: #171717;--color-palette-neutral-950: #0a0a0a;--color-palette-success-light: #4ade80;--color-palette-success-base: #22c55e;--color-palette-success-dark: #16a34a;--color-palette-warning-light: #fbbf24;--color-palette-warning-base: #f59e0b;--color-palette-warning-dark: #d97706;--color-palette-error-light: #f87171;--color-palette-error-base: #ef4444;--color-palette-error-dark: #dc2626;--color-palette-info-light: #60a5fa;--color-palette-info-base: #3b82f6;--color-palette-info-dark: #2563eb;--size-scale-0: 0px;--size-scale-1: 4px;--size-scale-2: 8px;--size-scale-3: 12px;--size-scale-4: 16px;--size-scale-5: 24px;--size-scale-6: 32px;--size-scale-7: 48px;--size-scale-8: 64px;--size-scale-9: 96px;--size-scale-10: 128px;--size-scale-11: 160px;--size-scale-12: 192px;--radius-none: 0px;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 16px;--radius-xl: 24px;--radius-full: 9999px;--motion-duration-instant: 80ms;--motion-duration-fast: .16s;--motion-duration-normal: .24s;--motion-duration-slow: .36s;--motion-easing-standard: cubic-bezier(.4, 0, .2, 1);--motion-easing-entrance: cubic-bezier(0, 0, .2, 1);--motion-easing-exit: cubic-bezier(.4, 0, 1, 1);--z-base: 0;--z-dropdown: 100;--z-sticky: 200;--z-overlay: 300;--z-modal: 400;--z-toast: 500;--z-tooltip: 600;--font-family-sans: "Inter", "Noto Sans SC", system-ui, -apple-system, sans-serif;--font-family-mono: "JetBrains Mono", "Fira Code", Consolas, monospace;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 800}:root,[data-theme=light]{--color-text-primary: var(--color-palette-cosmic-900);--color-text-secondary: var(--color-palette-cosmic-600);--color-text-tertiary: var(--color-palette-cosmic-400);--color-text-inverse: var(--color-palette-neutral-0);--color-text-disabled: var(--color-palette-cosmic-300);--color-text-accent: var(--color-palette-cyan-600);--color-text-brand: var(--color-palette-indigo-600);--color-bg-canvas: var(--color-palette-neutral-50);--color-bg-surface: var(--color-palette-neutral-0);--color-bg-elevated: var(--color-palette-neutral-0);--color-bg-accent: var(--color-palette-cyan-50);--color-bg-brand: var(--color-palette-indigo-500);--color-bg-brand-hover: var(--color-palette-indigo-600);--color-border-default: var(--color-palette-cosmic-200);--color-border-subtle: var(--color-palette-cosmic-100);--color-border-focus: var(--color-palette-cyan-400);--color-border-brand: var(--color-palette-indigo-400);--color-feedback-success: var(--color-palette-success-base);--color-feedback-warning: var(--color-palette-warning-base);--color-feedback-error: var(--color-palette-error-base);--color-feedback-info: var(--color-palette-info-base);--color-dec01-primary: var(--color-palette-cosmic-950);--color-dec01-accent: var(--color-palette-cyan-400);--color-dec01-secondary: var(--color-palette-indigo-400);--color-dec01-highlight: var(--color-palette-cyan-200);--color-dec02-base: var(--color-palette-cosmic-800);--color-dec02-line: var(--color-palette-cosmic-500);--color-dec02-node: var(--color-palette-cyan-500);--color-dec03-icon: var(--color-palette-cyan-500);--color-dec03-icon-hover: var(--color-palette-cyan-400);--shadow-elevation-0: none;--shadow-elevation-1: 0 1px 4px 0 rgba(15,23,42,.08);--shadow-elevation-2: 0 4px 16px -2px rgba(15,23,42,.12);--shadow-elevation-3: 0 8px 32px -4px rgba(15,23,42,.18);--shadow-glow-cyan: 0 0 24px 0 rgba(6,182,212,.35)}[data-theme=dark]{--color-text-primary: var(--color-palette-cosmic-50);--color-text-secondary: var(--color-palette-cosmic-300);--color-text-tertiary: var(--color-palette-cosmic-500);--color-text-inverse: var(--color-palette-cosmic-900);--color-text-disabled: var(--color-palette-cosmic-600);--color-text-accent: var(--color-palette-cyan-400);--color-text-brand: var(--color-palette-indigo-400);--color-bg-canvas: var(--color-palette-cosmic-950);--color-bg-surface: var(--color-palette-cosmic-900);--color-bg-elevated: var(--color-palette-cosmic-800);--color-bg-accent: var(--color-palette-cyan-900);--color-bg-brand: var(--color-palette-indigo-600);--color-bg-brand-hover: var(--color-palette-indigo-500);--color-border-default: var(--color-palette-cosmic-700);--color-border-subtle: var(--color-palette-cosmic-800);--color-border-focus: var(--color-palette-cyan-400);--color-border-brand: var(--color-palette-indigo-400);--color-feedback-success: var(--color-palette-success-light);--color-feedback-warning: var(--color-palette-warning-light);--color-feedback-error: var(--color-palette-error-light);--color-feedback-info: var(--color-palette-info-light);--color-dec01-primary: var(--color-palette-cosmic-950);--color-dec01-accent: var(--color-palette-cyan-400);--color-dec01-secondary: var(--color-palette-indigo-300);--color-dec01-highlight: var(--color-palette-cyan-300);--color-dec02-base: var(--color-palette-cosmic-950);--color-dec02-line: var(--color-palette-cosmic-600);--color-dec02-node: var(--color-palette-cyan-400);--color-dec03-icon: var(--color-palette-cyan-400);--color-dec03-icon-hover: var(--color-palette-cyan-300);--shadow-elevation-0: none;--shadow-elevation-1: 0 1px 4px 0 rgba(0,0,0,.32);--shadow-elevation-2: 0 4px 16px -2px rgba(0,0,0,.48);--shadow-elevation-3: 0 8px 32px -4px rgba(0,0,0,.64);--shadow-glow-cyan: 0 0 32px 0 rgba(34,211,238,.25)}:root{--space-inline-xs: var(--size-scale-1);--space-inline-sm: var(--size-scale-2);--space-inline-md: var(--size-scale-4);--space-inline-lg: var(--size-scale-5);--space-inline-xl: var(--size-scale-6);--space-stack-xs: var(--size-scale-1);--space-stack-sm: var(--size-scale-2);--space-stack-md: var(--size-scale-4);--space-stack-lg: var(--size-scale-5);--space-stack-xl: var(--size-scale-7);--space-section-sm: var(--size-scale-7);--space-section-md: var(--size-scale-8);--space-section-lg: var(--size-scale-9);--radius-semantic-none: var(--radius-none);--radius-semantic-sm: var(--radius-sm);--radius-semantic-md: var(--radius-md);--radius-semantic-lg: var(--radius-lg);--radius-semantic-xl: var(--radius-xl);--radius-semantic-full: var(--radius-full);--motion-standard-duration: var(--motion-duration-normal);--motion-standard-easing: var(--motion-easing-standard);--motion-entrance-duration: var(--motion-duration-normal);--motion-entrance-easing: var(--motion-easing-entrance);--motion-exit-duration: var(--motion-duration-fast);--motion-exit-easing: var(--motion-easing-exit);--motion-hover-duration: var(--motion-duration-fast);--motion-hover-easing: var(--motion-easing-standard);--layout-breakpoint-mobile: 640px;--layout-breakpoint-tablet: 1024px;--layout-breakpoint-desktop: 1280px;--layout-container-max: 1280px;--layout-container-padding-x: var(--size-scale-5)}*,*:before,*:after{box-sizing:border-box}body{margin:0;font-family:var(--font-family-sans);font-size:16px;line-height:24px;color:var(--color-text-primary);background-color:var(--color-bg-canvas);transition:background-color var(--motion-duration-normal) var(--motion-easing-standard),color var(--motion-duration-normal) var(--motion-easing-standard);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{color:var(--color-text-accent);text-decoration:none;transition:color var(--motion-hover-duration) var(--motion-hover-easing)}a:hover{color:var(--color-text-brand)}.studio-topbar{position:sticky;top:0;z-index:var(--z-sticky);display:flex;align-items:center;justify-content:space-between;padding:var(--space-stack-sm) var(--space-inline-xl);background-color:var(--color-bg-surface);border-bottom:1px solid var(--color-border-default);height:var(--size-scale-7);transition:background-color var(--motion-hover-duration) var(--motion-hover-easing),border-color var(--motion-hover-duration) var(--motion-hover-easing)}.studio-topbar-brand{display:flex;align-items:center;gap:var(--space-inline-sm)}.studio-topbar-logo{font-size:18px;font-weight:var(--font-weight-bold);color:var(--color-text-accent);letter-spacing:-.01em}.studio-topbar-sep{color:var(--color-text-tertiary);font-weight:var(--font-weight-regular)}.studio-topbar-label{font-size:14px;font-weight:var(--font-weight-medium);color:var(--color-text-secondary);letter-spacing:.02em;text-transform:uppercase}.studio-theme-toggle{display:flex;align-items:center;gap:var(--space-inline-xs);padding:var(--space-stack-xs) var(--space-inline-sm);border:1px solid var(--color-border-default);border-radius:var(--radius-semantic-md);background:transparent;color:var(--color-text-secondary);cursor:pointer;font-size:14px;font-family:var(--font-family-sans);font-weight:var(--font-weight-medium);transition:color var(--motion-hover-duration) var(--motion-hover-easing),border-color var(--motion-hover-duration) var(--motion-hover-easing),background-color var(--motion-hover-duration) var(--motion-hover-easing)}.studio-theme-toggle:hover{color:var(--color-text-accent);border-color:var(--color-border-focus);background-color:var(--color-bg-accent)}.studio-sidebar{width:200px;min-width:200px;background-color:var(--color-bg-surface);border-right:1px solid var(--color-border-default);padding:var(--space-stack-md) 0;overflow-y:auto;transition:background-color var(--motion-hover-duration) var(--motion-hover-easing)}.studio-nav-group{margin-bottom:var(--space-stack-md)}.studio-nav-group-label{padding:var(--space-stack-xs) var(--space-inline-md);font-size:10px;font-weight:var(--font-weight-semibold);color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:.1em}.studio-nav-item{display:block;width:100%;text-align:left;padding:var(--space-stack-xs) var(--space-inline-md);background:transparent;border:none;border-left:2px solid transparent;color:var(--color-text-secondary);font-size:14px;font-family:var(--font-family-sans);font-weight:var(--font-weight-medium);cursor:pointer;transition:color var(--motion-hover-duration) var(--motion-hover-easing),border-color var(--motion-hover-duration) var(--motion-hover-easing),background-color var(--motion-hover-duration) var(--motion-hover-easing)}.studio-nav-item:hover{color:var(--color-text-primary);background-color:var(--color-bg-accent)}.studio-nav-item.active{color:var(--color-text-accent);border-left-color:var(--color-border-focus);background-color:var(--color-bg-accent);font-weight:var(--font-weight-semibold)}.studio-main{flex:1;padding:var(--space-section-sm) var(--space-inline-xl);overflow-y:auto;background-color:var(--color-bg-canvas);transition:background-color var(--motion-hover-duration) var(--motion-hover-easing)}.page-title{font-size:28px;font-weight:var(--font-weight-bold);color:var(--color-text-primary);margin:0 0 var(--space-stack-sm) 0;letter-spacing:-.01em}.page-subtitle{font-size:16px;color:var(--color-text-secondary);margin:0 0 var(--space-section-sm) 0;line-height:24px}.section-label{font-size:10px;font-weight:var(--font-weight-semibold);color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:.1em;margin:0 0 var(--space-stack-md) 0}.token-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--space-stack-md);margin-bottom:var(--space-section-sm)}.token-card{border:1px solid var(--color-border-default);border-radius:var(--radius-semantic-md);overflow:hidden;background-color:var(--color-bg-surface);box-shadow:var(--shadow-elevation-1)}.token-swatch{height:var(--size-scale-7)}.token-info{padding:var(--space-stack-sm) var(--space-inline-sm)}.token-name{font-size:11px;font-weight:var(--font-weight-semibold);color:var(--color-text-primary);font-family:var(--font-family-mono);margin:0 0 2px}.token-value{font-size:11px;color:var(--color-text-tertiary);font-family:var(--font-family-mono);margin:0}.divider{height:1px;background-color:var(--color-border-subtle);margin:var(--space-section-sm) 0}.btn-primary{display:inline-flex;align-items:center;gap:var(--space-inline-xs);padding:var(--space-stack-sm) var(--space-inline-lg);background-color:var(--color-bg-brand);color:var(--color-text-inverse);border:none;border-radius:var(--radius-semantic-md);font-size:16px;font-weight:var(--font-weight-semibold);font-family:var(--font-family-sans);cursor:pointer;transition:background-color var(--motion-hover-duration) var(--motion-hover-easing),box-shadow var(--motion-hover-duration) var(--motion-hover-easing),transform var(--motion-hover-duration) var(--motion-hover-easing)}.btn-primary:hover{background-color:var(--color-bg-brand-hover);box-shadow:var(--shadow-glow-cyan);transform:translateY(-1px)}.btn-primary:active{transform:translateY(0)}.btn-primary:disabled{opacity:.4;cursor:not-allowed;box-shadow:none;transform:none}.btn-secondary{display:inline-flex;align-items:center;gap:var(--space-inline-xs);padding:var(--space-stack-sm) var(--space-inline-lg);background-color:transparent;color:var(--color-text-brand);border:1px solid var(--color-border-brand);border-radius:var(--radius-semantic-md);font-size:16px;font-weight:var(--font-weight-semibold);font-family:var(--font-family-sans);cursor:pointer;transition:background-color var(--motion-hover-duration) var(--motion-hover-easing),border-color var(--motion-hover-duration) var(--motion-hover-easing),color var(--motion-hover-duration) var(--motion-hover-easing)}.btn-secondary:hover{background-color:var(--color-bg-accent);border-color:var(--color-border-focus);color:var(--color-text-accent)}.btn-secondary:disabled{opacity:.4;cursor:not-allowed}.btn-ghost{display:inline-flex;align-items:center;padding:var(--space-stack-sm) var(--space-inline-md);background:transparent;color:var(--color-text-secondary);border:none;border-radius:var(--radius-semantic-md);font-size:14px;font-family:var(--font-family-sans);font-weight:var(--font-weight-medium);cursor:pointer;text-decoration:underline;text-underline-offset:3px;transition:color var(--motion-hover-duration) var(--motion-hover-easing)}.btn-ghost:hover{color:var(--color-text-accent)}.prim-input{display:block;width:100%;padding:var(--space-stack-sm) var(--space-inline-md);background-color:var(--color-bg-surface);color:var(--color-text-primary);border:1px solid var(--color-border-default);border-radius:var(--radius-semantic-md);font-size:16px;font-family:var(--font-family-sans);outline:none;transition:border-color var(--motion-hover-duration) var(--motion-hover-easing),box-shadow var(--motion-hover-duration) var(--motion-hover-easing)}.prim-input:focus{border-color:var(--color-border-focus);box-shadow:0 0 0 3px #fbbf2426}.prim-input::placeholder{color:var(--color-text-tertiary)}.prim-input:disabled{opacity:.5;cursor:not-allowed;background-color:var(--color-bg-canvas)}.prim-card{padding:var(--space-inline-lg);background-color:var(--color-bg-surface);border:1px solid var(--color-border-default);border-radius:var(--radius-semantic-lg);box-shadow:var(--shadow-elevation-1);transition:box-shadow var(--motion-hover-duration) var(--motion-hover-easing),transform var(--motion-hover-duration) var(--motion-hover-easing),border-color var(--motion-hover-duration) var(--motion-hover-easing)}.prim-card:hover{box-shadow:var(--shadow-elevation-2);transform:translateY(-2px);border-color:var(--color-border-brand)}.prim-card-elevated{border-radius:var(--radius-semantic-xl);box-shadow:var(--shadow-elevation-2)}.prim-card-accent{background-color:var(--color-bg-accent);border-color:var(--color-border-focus)}.prim-card-label{font-size:16px;font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin:0 0 var(--space-stack-sm) 0}.prim-toast{display:inline-block;padding:var(--space-stack-sm) var(--space-inline-lg);background-color:var(--color-bg-elevated);color:var(--color-text-primary);border:1px solid var(--color-border-default);border-radius:var(--radius-semantic-lg);box-shadow:var(--shadow-elevation-3);font-size:14px;font-weight:var(--font-weight-medium);margin-bottom:var(--space-stack-md);animation:toast-in var(--motion-duration-normal) var(--motion-easing-entrance);z-index:var(--z-toast);position:relative}@keyframes toast-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.prim-tooltip{position:absolute;top:calc(100% + var(--size-scale-2));left:50%;transform:translate(-50%);padding:var(--space-stack-xs) var(--space-inline-sm);background-color:var(--color-bg-elevated);color:var(--color-text-primary);border:1px solid var(--color-border-default);border-radius:var(--radius-semantic-sm);font-size:12px;font-family:var(--font-family-mono);white-space:nowrap;box-shadow:var(--shadow-elevation-2);z-index:var(--z-tooltip);pointer-events:none}.btn-toggle{padding:var(--space-stack-xs) var(--space-inline-md);border:1px solid var(--color-border-default);border-radius:var(--radius-semantic-md);background:transparent;color:var(--color-text-secondary);font-family:var(--font-family-sans);font-size:13px;font-weight:var(--font-weight-medium);cursor:pointer;transition:border-color var(--motion-hover-duration) var(--motion-hover-easing),color var(--motion-hover-duration) var(--motion-hover-easing),background-color var(--motion-hover-duration) var(--motion-hover-easing)}.btn-toggle:hover{border-color:var(--color-border-focus);color:var(--color-text-accent)}.btn-toggle.active{border-color:var(--color-border-focus);color:var(--color-text-accent);background-color:var(--color-bg-accent);font-weight:var(--font-weight-semibold)}.token-table{width:100%;border-collapse:collapse;font-size:13px;margin-bottom:var(--space-section-sm)}.token-table th{text-align:left;padding:var(--space-stack-sm) var(--space-inline-md);border-bottom:1px solid var(--color-border-default);color:var(--color-text-tertiary);font-weight:var(--font-weight-semibold);font-size:11px;text-transform:uppercase;letter-spacing:.06em}.token-table td{padding:var(--space-stack-sm) var(--space-inline-md);border-bottom:1px solid var(--color-border-subtle);color:var(--color-text-secondary);vertical-align:top}.token-table td:first-child{font-family:var(--font-family-mono);font-size:12px;color:var(--color-text-accent)}.token-table tr:last-child td{border-bottom:none}.project-card{padding:var(--space-inline-xl);background-color:var(--color-bg-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-semantic-xl);box-shadow:var(--shadow-elevation-2);transition:box-shadow var(--motion-standard-duration) var(--motion-standard-easing),transform var(--motion-standard-duration) var(--motion-standard-easing),border-color var(--motion-standard-duration) var(--motion-standard-easing)}.project-card:hover{box-shadow:var(--shadow-elevation-3);transform:translateY(-4px);border-color:var(--color-border-focus)}.tag{display:inline-flex;align-items:center;padding:var(--space-stack-xs) var(--space-inline-sm);background-color:var(--color-bg-accent);color:var(--color-text-accent);border-radius:var(--radius-semantic-full);font-size:12px;font-weight:var(--font-weight-semibold);letter-spacing:.02em}.btn-secondary-link{display:inline-flex;align-items:center;padding:var(--space-stack-xs) var(--space-inline-md);border:1px solid var(--color-border-brand);border-radius:var(--radius-semantic-md);background:transparent;color:var(--color-text-brand);font-size:14px;font-weight:var(--font-weight-semibold);font-family:var(--font-family-sans);text-decoration:none;cursor:pointer;transition:background-color var(--motion-hover-duration) var(--motion-hover-easing),border-color var(--motion-hover-duration) var(--motion-hover-easing),color var(--motion-hover-duration) var(--motion-hover-easing)}.btn-secondary-link:hover{background-color:var(--color-bg-accent);border-color:var(--color-border-focus);color:var(--color-text-accent)}.showcase-root{padding-bottom:var(--space-section-lg)}.showcase-frame{border:1px solid var(--color-border-default);border-radius:var(--radius-semantic-xl);overflow:hidden;box-shadow:var(--shadow-elevation-3)}.sc-nav{display:flex;align-items:center;justify-content:space-between;padding:0 var(--space-inline-xl);height:var(--size-scale-7);background-color:#080e1ad9;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom:1px solid var(--color-palette-cosmic-700);position:sticky;top:0;z-index:var(--z-sticky)}.sc-nav-logo{font-size:20px;font-weight:var(--font-weight-extrabold);color:var(--color-palette-cyan-400);letter-spacing:-.01em}.sc-nav-links{display:flex;gap:var(--space-inline-xl)}.sc-nav-link{font-size:14px;font-weight:var(--font-weight-medium);color:var(--color-palette-cosmic-200);text-decoration:none;transition:color var(--motion-hover-duration) var(--motion-hover-easing)}.sc-nav-link:hover{color:var(--color-palette-cyan-400)}.sc-landing{position:relative;min-height:480px;display:flex;align-items:center;justify-content:center;background-color:var(--color-palette-cosmic-950);overflow:hidden}.sc-landing-bg{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.sc-landing-glow{position:absolute;border-radius:var(--radius-semantic-full);filter:blur(80px)}.sc-landing-glow-cyan{width:400px;height:400px;top:-100px;left:10%;background:radial-gradient(circle,rgba(6,182,212,.18) 0%,transparent 70%)}.sc-landing-glow-indigo{width:300px;height:300px;bottom:-80px;right:15%;background:radial-gradient(circle,rgba(99,102,241,.15) 0%,transparent 70%)}.sc-landing-stars{position:absolute;top:0;right:0;bottom:0;left:0;background-image:radial-gradient(circle 1px at 20% 30%,rgba(255,255,255,.4) 0%,transparent 1px),radial-gradient(circle 1px at 60% 20%,rgba(255,255,255,.3) 0%,transparent 1px),radial-gradient(circle 1px at 80% 60%,rgba(255,255,255,.35) 0%,transparent 1px),radial-gradient(circle 1px at 40% 70%,rgba(255,255,255,.25) 0%,transparent 1px),radial-gradient(circle 1px at 90% 40%,rgba(165,180,252,.5) 0%,transparent 1px),radial-gradient(circle 1px at 15% 65%,rgba(165,180,252,.4) 0%,transparent 1px),radial-gradient(circle 2px at 55% 45%,rgba(34,211,238,.3) 0%,transparent 2px)}.sc-landing-content{position:relative;z-index:1;text-align:center;padding:var(--space-section-lg) var(--space-inline-xl)}.sc-display{font-size:56px;font-weight:var(--font-weight-extrabold);line-height:64px;letter-spacing:-.02em;color:var(--color-palette-neutral-0);margin:0 0 var(--space-stack-md) 0;text-shadow:0 0 60px rgba(6,182,212,.3)}.sc-tagline{font-size:22px;font-weight:var(--font-weight-semibold);color:var(--color-palette-cyan-300);margin:0 0 var(--space-stack-xs) 0}.sc-tagline-en{font-size:16px;font-weight:var(--font-weight-regular);color:var(--color-palette-cosmic-400);margin:0 0 var(--space-stack-lg) 0;letter-spacing:.05em}.sc-lead{font-size:16px;color:var(--color-palette-cosmic-300);margin:0 0 var(--space-stack-xl) 0}.sc-cta{display:inline-flex;align-items:center;padding:var(--space-stack-sm) var(--space-inline-xl);background-color:var(--color-bg-brand);color:var(--color-palette-neutral-0);text-decoration:none;border-radius:var(--radius-semantic-md);font-size:16px;font-weight:var(--font-weight-semibold);transition:background-color var(--motion-hover-duration) var(--motion-hover-easing),box-shadow var(--motion-hover-duration) var(--motion-hover-easing),transform var(--motion-hover-duration) var(--motion-hover-easing)}.sc-cta:hover{background-color:var(--color-bg-brand-hover);box-shadow:var(--shadow-glow-cyan);transform:translateY(-2px);color:var(--color-palette-neutral-0)}.sc-section{padding:var(--space-section-lg) 0}.sc-container{max-width:960px;margin:0 auto;padding:0 var(--space-inline-xl)}.sc-section-tag{display:inline-block;font-size:11px;font-weight:var(--font-weight-semibold);color:var(--color-text-accent);text-transform:uppercase;letter-spacing:.1em;margin-bottom:var(--space-stack-md);border-left:3px solid var(--color-border-focus);padding-left:var(--space-inline-sm)}.sc-h2{font-size:28px;font-weight:var(--font-weight-bold);color:var(--color-text-primary);margin:0 0 var(--space-stack-md) 0;letter-spacing:-.01em}.sc-h3{font-size:22px;font-weight:var(--font-weight-bold);color:var(--color-text-primary);margin:0 0 var(--space-stack-xs) 0}.sc-body{font-size:16px;color:var(--color-text-secondary);line-height:24px;margin:0 0 var(--space-stack-md) 0}.sc-body-sm{font-size:14px;color:var(--color-text-secondary);line-height:20px;margin:0 0 var(--space-stack-lg) 0}.sc-divider-line{height:2px;width:var(--size-scale-7);background:linear-gradient(to right,var(--color-palette-cyan-400),transparent);border-radius:var(--radius-semantic-full);margin-bottom:var(--space-stack-lg)}.sc-tag{display:inline-flex;align-items:center;padding:var(--space-stack-xs) var(--space-inline-sm);background-color:var(--color-bg-accent);color:var(--color-text-accent);border-radius:var(--radius-semantic-full);font-size:11px;font-weight:var(--font-weight-semibold);letter-spacing:.02em;margin-bottom:var(--space-stack-sm)}.sc-about{background-color:var(--color-bg-canvas)}.sc-about-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-inline-xl);align-items:start}.sc-about-dec02{display:flex;align-items:center;justify-content:center}.sc-dec02-inner{position:relative;width:240px;height:200px;border:1px dashed var(--color-border-default);border-radius:var(--radius-semantic-lg);background-color:var(--color-bg-surface);display:flex;flex-direction:column;align-items:center;justify-content:center}.sc-dec02-node{position:absolute;width:var(--size-scale-3);height:var(--size-scale-3);border-radius:var(--radius-semantic-full);background-color:var(--color-dec02-node);box-shadow:var(--shadow-glow-cyan)}.sc-dec02-node-1{top:30%;left:25%}.sc-dec02-node-2{top:50%;left:60%}.sc-dec02-node-3{top:20%;left:70%}.sc-dec02-line{position:absolute;height:1px;background-color:var(--color-dec02-line)}.sc-dec02-line-1{width:80px;top:calc(30% + 6px);left:calc(25% + 12px);transform:rotate(12deg)}.sc-dec02-line-2{width:60px;top:calc(22% + 6px);left:calc(60% + 12px);transform:rotate(-20deg)}.sc-projects{background-color:var(--color-bg-surface)}.sc-projects-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--space-stack-lg)}.sc-project-card{padding:var(--space-inline-xl);background-color:var(--color-bg-elevated);border:1px solid var(--color-border-default);border-radius:var(--radius-semantic-xl);box-shadow:var(--shadow-elevation-2);transition:box-shadow var(--motion-standard-duration) var(--motion-standard-easing),transform var(--motion-standard-duration) var(--motion-standard-easing),border-color var(--motion-standard-duration) var(--motion-standard-easing)}.sc-project-card:hover{box-shadow:var(--shadow-elevation-3);transform:translateY(-4px);border-color:var(--color-border-focus)}.sc-project-bar{height:var(--size-scale-1);border-radius:var(--radius-semantic-full);background:linear-gradient(to right,var(--color-palette-cyan-400),var(--color-palette-indigo-500));margin-bottom:var(--space-stack-lg)}.sc-project-tagline{font-size:14px;font-weight:var(--font-weight-semibold);color:var(--color-text-accent);margin:0 0 var(--space-stack-md) 0}.sc-btn-secondary{display:inline-flex;align-items:center;padding:var(--space-stack-xs) var(--space-inline-md);border:1px solid var(--color-border-brand);border-radius:var(--radius-semantic-md);background:transparent;color:var(--color-text-brand);font-size:14px;font-weight:var(--font-weight-semibold);font-family:var(--font-family-sans);text-decoration:none;transition:background-color var(--motion-hover-duration) var(--motion-hover-easing),border-color var(--motion-hover-duration) var(--motion-hover-easing),color var(--motion-hover-duration) var(--motion-hover-easing)}.sc-btn-secondary:hover{background-color:var(--color-bg-accent);border-color:var(--color-border-focus);color:var(--color-text-accent)}.sc-contact{background-color:var(--color-bg-canvas)}.sc-contact-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--space-stack-md)}.sc-contact-item{display:flex;align-items:center;gap:var(--space-inline-md);padding:var(--space-stack-md) var(--space-inline-md);border:1px solid var(--color-border-subtle);border-radius:var(--radius-semantic-md);background-color:var(--color-bg-surface);text-decoration:none;transition:border-color var(--motion-hover-duration) var(--motion-hover-easing),background-color var(--motion-hover-duration) var(--motion-hover-easing)}.sc-contact-item-link:hover{border-color:var(--color-border-focus);background-color:var(--color-bg-accent)}.sc-contact-icon{color:var(--color-dec03-icon);flex-shrink:0}.sc-contact-label{font-size:11px;color:var(--color-text-tertiary);font-weight:var(--font-weight-medium);margin-bottom:2px}.sc-contact-value{font-size:14px;color:var(--color-text-primary);font-weight:var(--font-weight-medium)}.sc-footer{padding:var(--space-stack-lg) var(--space-inline-xl);background-color:var(--color-palette-cosmic-950);border-top:1px solid var(--color-palette-cosmic-800);text-align:center}.sc-footer-text{font-size:13px;color:var(--color-palette-cosmic-500);margin:0}.sc-footer-icp{color:var(--color-palette-cosmic-400);text-decoration:underline;text-underline-offset:2px;transition:color var(--motion-hover-duration) var(--motion-hover-easing)}.sc-footer-icp:hover{color:var(--color-text-accent)}
