@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Noto+Sans+TC:wght@400;500;600;700&display=swap";
:root{--hue-primary:265;--hue-accent:35;--saturation-base:70%;--color-bg-start:hsl(var(--hue-primary), 20%, 97%);--color-bg-mid:hsl(var(--hue-primary), 25%, 93%);--color-bg-end:hsl(var(--hue-primary), 30%, 88%);--color-primary:hsl(var(--hue-primary), var(--saturation-base), 55%);--color-primary-hover:hsl(var(--hue-primary), var(--saturation-base), 48%);--color-primary-light:hsla(var(--hue-primary), var(--saturation-base), 55%, .15);--color-primary-glow:hsla(var(--hue-primary), var(--saturation-base), 55%, .4);--color-primary-subtle:hsla(var(--hue-primary), var(--saturation-base), 55%, .08);--color-accent:hsl(var(--hue-accent), 85%, 55%);--color-accent-hover:hsl(var(--hue-accent), 85%, 48%);--color-surface:#ffffffb8;--color-surface-hover:#ffffffd9;--color-surface-alt:#ffffff73;--color-surface-raised:#ffffffe6;--color-sidebar:hsla(var(--hue-primary), 30%, 18%, .85);--color-sidebar-text:#ffffffd9;--color-sidebar-text-muted:#ffffff80;--color-sidebar-active:#fbbf24;--color-topbar:#fff9;--color-border:#ffffff59;--color-border-subtle:#ffffff2e;--color-border-glow:hsla(var(--hue-primary), var(--saturation-base), 60%, .35);--color-text:hsl(var(--hue-primary), 15%, 15%);--color-text-muted:hsl(var(--hue-primary), 8%, 45%);--color-text-inverse:#fff;--color-success:#25b170;--color-success-bg:#25b1701f;--color-warning:#f29e0d;--color-warning-bg:#f29e0d1f;--color-danger:#df2020;--color-danger-bg:#df20201f;--color-info:#2574f4;--color-info-bg:#2574f41f;--color-focus-ring:hsla(var(--hue-primary), var(--saturation-base), 50%, .5);--glass-blur-1:8px;--glass-blur-2:16px;--glass-blur-3:24px;--glass-blur-solid:32px;--font-family-base:"Inter", "Noto Sans TC", system-ui, -apple-system, sans-serif;--fs-h1:2rem;--fs-h2:1.5rem;--fs-h3:1.25rem;--fs-h4:1rem;--fs-body:.9375rem;--fs-sm:.8125rem;--fs-xs:.75rem;--fw-regular:400;--fw-medium:500;--fw-semibold:600;--fw-bold:700;--lh-tight:1.3;--lh-normal:1.5;--lh-relaxed:1.7;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:40px;--space-8:48px;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-xl:20px;--radius-2xl:24px;--radius-full:9999px;--shadow-sm:0 1px 3px #0000000f;--shadow-md:0 4px 12px #00000014;--shadow-lg:0 12px 28px #0000001f;--shadow-glow:0 0 20px var(--color-primary-glow);--shadow-glow-lg:0 0 40px var(--color-primary-glow), 0 0 80px hsla(var(--hue-primary), var(--saturation-base), 55%, .15);--z-base:0;--z-dropdown:100;--z-sticky:200;--z-fixed:300;--z-modal-backdrop:400;--z-modal:500;--z-popover:600;--z-tooltip:700;--transition-fast:.15s ease;--transition-normal:.25s cubic-bezier(.4, 0, .2, 1);--transition-slow:.4s cubic-bezier(.4, 0, .2, 1);--sidebar-width:256px;--sidebar-collapsed:72px;--topbar-height:64px}[data-theme=dark]{--color-bg-start:hsl(var(--hue-primary), 45%, 5%);--color-bg-mid:hsl(var(--hue-primary), 35%, 9%);--color-bg-end:hsl(calc(var(--hue-primary) + 20), 30%, 12%);--color-primary:hsl(var(--hue-primary), var(--saturation-base), 68%);--color-primary-hover:hsl(var(--hue-primary), var(--saturation-base), 75%);--color-primary-light:hsla(var(--hue-primary), var(--saturation-base), 60%, .18);--color-primary-glow:hsla(var(--hue-primary), 80%, 60%, .35);--color-primary-subtle:hsla(var(--hue-primary), var(--saturation-base), 60%, .06);--color-surface:hsla(var(--hue-primary), 20%, 16%, .55);--color-surface-hover:hsla(var(--hue-primary), 20%, 20%, .7);--color-surface-alt:hsla(var(--hue-primary), 15%, 14%, .4);--color-surface-raised:hsla(var(--hue-primary), 18%, 22%, .8);--color-sidebar:hsla(var(--hue-primary), 35%, 8%, .88);--color-sidebar-text:#ffffffe6;--color-sidebar-text-muted:#ffffff73;--color-sidebar-active:#fcd34d;--color-topbar:hsla(var(--hue-primary), 25%, 10%, .7);--color-border:hsla(var(--hue-primary), 20%, 40%, .2);--color-border-subtle:hsla(var(--hue-primary), 15%, 30%, .15);--color-border-glow:hsla(var(--hue-primary), 80%, 60%, .25);--color-text:#f0f0f0;--color-text-muted:hsl(var(--hue-primary), 10%, 60%);--shadow-sm:0 1px 3px #0000004d;--shadow-md:0 4px 16px #00000059;--shadow-lg:0 12px 32px #0006, 0 0 1px var(--color-border-glow);--shadow-glow:0 0 20px var(--color-primary-glow), 0 0 2px var(--color-border-glow);--shadow-glow-lg:0 0 50px var(--color-primary-glow), 0 0 100px hsla(var(--hue-primary), 80%, 55%, .12)}[data-theme=light]{--color-bg-start:hsl(var(--hue-primary), 20%, 97%);--color-bg-mid:hsl(var(--hue-primary), 25%, 94%);--color-bg-end:hsl(var(--hue-primary), 30%, 90%);--color-primary:hsl(var(--hue-primary), var(--saturation-base), 50%);--color-primary-hover:hsl(var(--hue-primary), var(--saturation-base), 42%);--color-primary-light:hsla(var(--hue-primary), var(--saturation-base), 50%, .12);--color-primary-glow:hsla(var(--hue-primary), var(--saturation-base), 50%, .3);--color-primary-subtle:hsla(var(--hue-primary), var(--saturation-base), 50%, .06);--color-surface:#ffffffbf;--color-surface-hover:#ffffffe6;--color-surface-alt:#ffffff80;--color-surface-raised:#ffffffeb;--color-sidebar:hsla(var(--hue-primary), 30%, 18%, .92);--color-sidebar-text:#ffffffe6;--color-sidebar-text-muted:#ffffff80;--color-sidebar-active:#fbbf24;--color-topbar:#ffffffb3;--color-border:#0000001a;--color-border-subtle:#0000000f;--color-border-glow:hsla(var(--hue-primary), var(--saturation-base), 50%, .3);--color-text:hsl(var(--hue-primary), 15%, 15%);--color-text-muted:hsl(var(--hue-primary), 8%, 45%);--color-text-inverse:#fff;--color-success-bg:#25b1701a;--color-warning-bg:#f29e0d1a;--color-danger-bg:#df20201a;--color-info-bg:#2574f41a;--shadow-sm:0 1px 3px #0000000f;--shadow-md:0 4px 12px #00000014;--shadow-lg:0 12px 28px #0000001a;--shadow-glow:0 0 16px var(--color-primary-glow);--shadow-glow-lg:0 0 32px var(--color-primary-glow), 0 0 64px hsla(var(--hue-primary), var(--saturation-base), 55%, .1)}
*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{font-family:var(--font-family-base);font-size:16px;line-height:var(--lh-normal);color:var(--color-text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;height:100%}body{background:radial-gradient(ellipse at 20% 50%, hsla(var(--hue-primary), 60%, 15%, .4) 0%, transparent 50%), radial-gradient(ellipse at 80% 20%, hsla(var(--hue-accent), 50%, 20%, .25) 0%, transparent 50%), radial-gradient(ellipse at 50% 100%, hsla(calc(var(--hue-primary) + 30), 40%, 12%, .3) 0%, transparent 50%), linear-gradient(160deg, var(--color-bg-start) 0%, var(--color-bg-mid) 40%, var(--color-bg-end) 100%);background-attachment:fixed;min-height:100vh;position:relative;overflow-x:hidden}body:before{content:"";pointer-events:none;z-index:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.03'/%3E%3C/svg%3E");position:fixed;inset:0}h1,h2,h3,h4,h5,h6{font-weight:var(--fw-semibold);line-height:var(--lh-tight);letter-spacing:-.01em}a{color:inherit;text-decoration:none}ul,ol{list-style:none}button,input,select,textarea{font-family:inherit}img{max-width:100%;height:auto}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background-color:hsla(var(--hue-primary), 20%, 50%, .3);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background-color:hsla(var(--hue-primary), 30%, 50%, .5)}*{scrollbar-width:thin;scrollbar-color:hsla(var(--hue-primary), 20%, 50%, .3) transparent}::selection{background-color:hsla(var(--hue-primary), 70%, 55%, .35);color:var(--color-text)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}@keyframes pulseGlow{0%,to{box-shadow:0 0 0 0 var(--color-primary-glow)}50%{box-shadow:0 0 20px 5px var(--color-primary-glow)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes gradientShift{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}@keyframes borderGlow{0%,to{border-color:var(--color-border)}50%{border-color:var(--color-border-glow)}}.glass-1{background:var(--color-surface-alt);-webkit-backdrop-filter:blur(var(--glass-blur-1));border:1px solid var(--color-border-subtle);border-radius:var(--radius-md);box-shadow:var(--shadow-sm), inset 0 1px 0 0 #ffffff0f}.glass-2{background:var(--color-surface);-webkit-backdrop-filter:blur(var(--glass-blur-2));border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md), inset 0 1px 0 0 #ffffff14;transition:transform var(--transition-normal), box-shadow var(--transition-normal), border-color var(--transition-normal)}.glass-2:hover{border-color:var(--color-border-glow)}.glass-3{background:var(--color-surface);-webkit-backdrop-filter:blur(var(--glass-blur-3));border:1px solid var(--color-border);box-shadow:var(--shadow-lg), inset 0 1px 0 0 #ffffff0d}.glass-solid{background:var(--color-surface-raised);-webkit-backdrop-filter:blur(var(--glass-blur-solid));border:1px solid var(--color-border);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg), 0 0 0 1px var(--color-border-glow), inset 0 1px 0 0 #ffffff1a}.glow{box-shadow:var(--shadow-glow)}.glow-lg{box-shadow:var(--shadow-glow-lg)}.gradient-text{background:linear-gradient(135deg, var(--color-primary), var(--color-accent));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}@media (max-width:768px){.layout-root{flex-direction:column!important}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:var(--radius-full)}}:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}::selection{background:var(--color-primary-light);color:var(--color-text)}@media print{.glass-1,.glass-2,.glass-3{-webkit-backdrop-filter:none;background:#fff;border-color:#ddd}}@media (max-width:768px){main{padding:12px!important}}.reveal{opacity:0;transition:opacity .6s,transform .6s cubic-bezier(.4,0,.2,1);transform:translateY(20px)}.reveal.visible{opacity:1;transform:translateY(0)}.reveal-delay-1{transition-delay:.1s}.reveal-delay-2{transition-delay:.2s}.reveal-delay-3{transition-delay:.3s}.reveal-delay-4{transition-delay:.4s}

