:root{--primary:#3b82f6;--primary-dark:#2563eb;--bg:#0f172a;--bg-alt:#1e293b;--bg-code:#1e293b;--text:#e2e8f0;--text-muted:#94a3b8;--border:#334155;--max-width:1200px}*{box-sizing:border-box;margin:0;padding:0}body{color:var(--text);background:var(--bg);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.7}a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}code{background:var(--bg-code);color:#93c5fd;border-radius:4px;padding:2px 6px;font-family:SF Mono,Fira Code,monospace;font-size:.9em}pre{color:#cbd5e1;border:1px solid var(--border);background:#0c1222;border-radius:8px;margin:16px 0;padding:20px;font-size:.875rem;line-height:1.6;overflow-x:auto}pre code{color:inherit;background:0 0;padding:0}.nav{border-bottom:1px solid var(--border);background:var(--bg);z-index:100;position:sticky;top:0}.nav-inner{max-width:var(--max-width);justify-content:space-between;align-items:center;margin:0 auto;padding:16px 24px;display:flex}.nav-logo{color:var(--text);font-size:1.125rem;font-weight:700;text-decoration:none}.nav-logo:hover{text-decoration:none}.nav-links{gap:24px;list-style:none;display:flex}.nav-links a{color:var(--text-muted);font-size:.9375rem;font-weight:500;transition:color .15s}.nav-links a:hover,.nav-links a.active{color:var(--primary);text-decoration:none}.hero-zone{position:relative;overflow:hidden}.swirly-bg{z-index:0;width:100%;height:100%;position:absolute;top:0;left:0}.swirly-bg canvas{width:100%;height:100%;position:absolute;top:0;left:0}.swirly-overlay{pointer-events:none;background:radial-gradient(#0000 30%,#0f172a 75%);width:100%;height:100%;position:absolute;top:0;left:0}.swirly-grain{pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:128px 128px;width:200%;height:200%;position:absolute;top:-50%;left:-50%}.hero-zone .hero,.hero-zone .section{z-index:1;position:relative}.hero-zone .principle-card{-webkit-backdrop-filter:blur(8px);background:#1e293bb3}.hero{text-align:center;background:0 0;padding:80px 24px 60px}.hero h1{letter-spacing:-.02em;background:linear-gradient(135deg,#fff 0%,#fff9 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin-bottom:16px;font-size:3rem;font-weight:800}.hero .subtitle{color:var(--text-muted);max-width:700px;margin:0 auto 12px;font-size:1.25rem}.hero .version-badge{background:var(--primary);color:#fff;border-radius:999px;margin-bottom:32px;padding:4px 12px;font-size:.8125rem;font-weight:600;display:inline-block}.hero-cta{color:#fff;background:#ffffff14;border:1px solid #ffffff1a;border-radius:999px;align-items:center;gap:8px;padding:12px 28px;font-size:1rem;font-weight:600;text-decoration:none;transition:all .3s;display:inline-flex}.hero-cta:hover{background:#ffffff24;border-color:#fff3;text-decoration:none}.section{max-width:var(--max-width);margin:0 auto;padding:60px 24px}.section h2{letter-spacing:-.01em;margin-bottom:32px;font-size:1.75rem;font-weight:700}.principles-grid{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:20px;display:grid}.principle-card{background:var(--bg-alt);border:1px solid var(--border);border-radius:10px;padding:24px}.principle-card h3{margin-bottom:8px;font-size:1rem;font-weight:700}.principle-card p{color:var(--text-muted);font-size:.9375rem}.concepts-list{flex-direction:column;gap:24px;display:flex}.concept-item{align-items:flex-start;gap:16px;display:flex}.concept-icon{background:var(--bg-alt);border:1px solid var(--border);border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;font-size:1.25rem;display:flex}.concept-item h3{margin-bottom:4px;font-size:1.0625rem;font-weight:700}.concept-item p{color:var(--text-muted);font-size:.9375rem}.flow-steps{flex-direction:column;gap:28px;padding-left:40px;display:flex;position:relative}.flow-steps:before{content:"";background:var(--border);width:2px;position:absolute;top:4px;bottom:4px;left:15px}.flow-step{position:relative}.flow-step .step-number{background:var(--primary);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:.8125rem;font-weight:700;display:flex;position:absolute;left:-40px}.flow-step h3{margin-bottom:4px;font-size:1rem;font-weight:700}.flow-step p{color:var(--text-muted);font-size:.9375rem}.cta-banner{color:#fff;text-align:center;border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:linear-gradient(135deg,#1e3a5f 0%,#1e40af 100%);padding:60px 24px}.cta-banner h2{margin-bottom:12px;font-size:1.75rem}.cta-banner p{opacity:.85;margin-bottom:24px;font-size:1.0625rem}.cta-banner .hero-cta{color:#1e40af;background:#fff}.cta-banner .hero-cta:hover{background:#e0e7ff}.footer{border-top:1px solid var(--border);text-align:center;color:var(--text-muted);padding:32px 24px;font-size:.875rem}.spec-page{max-width:var(--max-width);margin:0 auto;padding:48px 24px 80px}.spec-page h1{margin-bottom:8px;font-size:2.25rem;font-weight:800}.spec-meta{color:var(--text-muted);border-bottom:1px solid var(--border);margin-bottom:48px;padding-bottom:24px;font-size:.9375rem}.spec-page h2{border-top:1px solid var(--border);margin-top:48px;margin-bottom:16px;padding-top:24px;font-size:1.5rem;font-weight:700}.spec-page h2:first-of-type{border-top:none;padding-top:0}.spec-page h3{margin-top:32px;margin-bottom:12px;font-size:1.125rem;font-weight:700}.spec-page p{margin-bottom:16px;font-size:.9375rem}.spec-page ul{margin-bottom:16px;padding-left:24px}.spec-page li{margin-bottom:8px;font-size:.9375rem}.spec-table{border-collapse:collapse;width:100%;margin:16px 0 24px;font-size:.875rem}.spec-table th,.spec-table td{border:1px solid var(--border);text-align:left;padding:10px 14px}.spec-table th{background:var(--bg-alt);font-weight:600}.spec-table code{font-size:.8125rem}.info-box{border-left:4px solid var(--primary);color:#93c5fd;background:#3b82f61a;border-radius:0 6px 6px 0;margin:16px 0;padding:14px 18px;font-size:.9375rem}@media (width<=640px){.hero h1{font-size:2rem}.hero .subtitle{font-size:1.0625rem}.nav-inner{flex-direction:column;gap:12px}.principles-grid{grid-template-columns:1fr}}
