html{scroll-behavior:smooth;transition:background .35s,color .35s}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{min-height:100vh;height:auto!important;overflow:hidden auto!important}body{background:var(--bg);color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;flex-direction:column;align-items:center;min-height:100vh;font-size:14px;line-height:1.5;transition:background .35s,color .35s;display:flex;overflow-x:hidden}body:before{content:"";z-index:0;pointer-events:none;background-image:radial-gradient(#ffffff04 1px,#0000 1px);background-size:32px 32px;position:fixed;inset:0}.layout{flex-direction:column;flex:1;min-height:100vh;display:flex;width:100%!important;height:auto!important;overflow:visible!important}.main-section{flex:1;position:relative;width:100%!important;height:auto!important;overflow:visible!important}:root{--light-bg-color:#dee8e8;--light-bg-color-shade500:#d0dbdb;--light-bg-color-shade100:#e4e4e4;--light-text-color:#161616;--light-text-color-shade500:#00000087;--light-text-color-shade400:#0006;--light-hf-bg-color:#eee;--light-border-color-50:#00000080;--light-border-color-10:#0000001f;--light-hover-text-color:#000;--light-box-shadow-color:#f5f5f5;--light-box-bg-color:#e1e1e1;--light-bg-shadow-color:#e2e2e2;--dark-bg-color:#161616;--dark-bg-color-shade500:#232323;--dark-bg-color-shade100:#1b1b1b;--dark-text-color:#dee8e8;--dark-text-color-shade500:#ffffff87;--dark-text-color-shade400:#fff6;--dark-hf-bg-color:#111;--dark-border-color-50:#ffffff80;--dark-border-color-10:#ffffff1f;--dark-hover-text-color:#ddf247;--dark-box-shadow-color:#0a0a0a;--dark-box-bg-color:#1e1e1e;--dark-bg-shadow-color:#1d1d1d}.topnav{background:var(--bg-nav);-webkit-backdrop-filter:blur(24px);border-bottom:1px solid var(--border);z-index:100;justify-content:space-between;align-items:center;width:100%;height:60px;padding:0 32px;transition:background .35s,border-color .35s;display:flex;position:sticky;top:0}.topnav-brand{color:var(--text);align-items:center;gap:10px;font-size:17px;font-weight:700;text-decoration:none;display:flex}.topnav-brand svg{flex-shrink:0}.topnav-right{align-items:center;gap:12px;display:flex}.theme-btn{border-radius:var(--radius-btn);border:1px solid var(--border);background:var(--bg-inner);width:36px;height:36px;color:var(--text-dim);cursor:pointer;justify-content:center;align-items:center;transition:all .25s;display:flex}.theme-btn:hover{border-color:var(--border-mid);background:var(--bg-hover)}@keyframes theme-spin{0%{transform:rotate(0)scale(1)}50%{opacity:.4;transform:rotate(180deg)scale(.7)}to{opacity:1;transform:rotate(360deg)scale(1)}}.theme-btn.spinning svg{animation:.45s cubic-bezier(.4,0,.2,1) forwards theme-spin}.ambient-glow{filter:blur(160px);opacity:.08;pointer-events:none;z-index:0;border-radius:50%;width:600px;height:600px;position:fixed}.glow-1{background:#7c5cfc;top:-200px;left:-100px}.glow-2{background:#9b7eff;bottom:-200px;right:-100px}[data-theme=light] .ambient-glow{opacity:0}.hero{z-index:1;text-align:center;width:100%;max-width:640px;padding:80px 24px 48px;position:relative}.hero-badge{border-radius:var(--radius-pill);background:var(--bg-inner);border:1px solid var(--border);color:var(--text-muted);letter-spacing:.04em;text-transform:uppercase;align-items:center;gap:6px;margin-bottom:24px;padding:5px 14px;font-size:12px;font-weight:500;transition:background .35s,border-color .35s,color .35s;display:inline-flex}.hero-badge .dot{background:var(--green);width:6px;height:6px;box-shadow:0 0 8px var(--green-ring);border-radius:50%}.hero h1{letter-spacing:-.02em;margin-bottom:14px;font-size:40px;font-weight:700;line-height:1.15}.gradient-text{background:var(--grad);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.hero p{color:var(--text-dim);max-width:480px;margin:0 auto;font-size:16px;line-height:1.6}.pages-section{z-index:1;width:100%;max-width:960px;padding:0 24px 80px;position:relative}.section-label{letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);margin-bottom:20px;padding-left:4px;font-size:11px;font-weight:600}.pages-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;display:grid}.page-card{background:var(--bg-card-grad);border-radius:var(--radius-card);border:1px solid var(--border);box-shadow:var(--shadow-card);color:var(--text);flex-direction:column;text-decoration:none;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden}.page-card:after{content:"";border-radius:var(--radius-card)var(--radius-card)0 0;pointer-events:none;z-index:2;background:linear-gradient(90deg,#0000 5%,#ffffff59 30%,#ffffff80 50%,#ffffff59 70%,#0000 95%);height:1px;position:absolute;top:0;left:0;right:0}[data-theme=light] .page-card:after{opacity:0}.page-card:hover{box-shadow:var(--shadow-raise);border-color:var(--border-mid);transform:translateY(-4px)}.page-card:hover .card-arrow{color:var(--p1);transform:translate(3px)}.card-preview{background:var(--bg-inner);border-bottom:1px solid var(--border);justify-content:center;align-items:center;height:140px;transition:background .35s,border-color .35s;display:flex;position:relative;overflow:hidden}.preview-icon{color:var(--p1);opacity:.6;transition:opacity .3s,transform .3s}.page-card:hover .preview-icon{opacity:1;transform:scale(1.08)}.card-preview:before{content:"";background:var(--grad);opacity:0;height:3px;transition:opacity .3s;position:absolute;top:0;left:0;right:0}.page-card:hover .card-preview:before{opacity:1}.card-body{flex-direction:column;flex:1;gap:8px;padding:20px 22px 22px;display:flex}.card-title-row{justify-content:space-between;align-items:center;gap:8px;display:flex}.card-title{letter-spacing:-.01em;color:var(--text);font-size:16px;font-weight:600}.card-arrow{color:var(--text-muted);flex-shrink:0;transition:transform .25s,color .25s}.card-desc{color:var(--text-dim);font-size:13px;line-height:1.55}.card-tags{flex-wrap:wrap;gap:6px;margin-top:4px;display:flex}.tag{border-radius:var(--radius-pill);background:var(--bg-hover);color:var(--text-muted);border:1px solid var(--border);letter-spacing:.02em;padding:3px 10px;font-size:11px;font-weight:500;transition:background .35s,border-color .35s,color .35s}.footer{z-index:1;text-align:center;border-top:1px solid var(--border);width:100%;color:var(--text-muted);padding:24px;font-size:12px;transition:border-color .35s;position:relative}
