.nf-page{--nf-cyan:#22d3ee;--nf-text:#eef2f7;--nf-muted:#94a3b8;--nf-surface:#ffffff0b;--nf-border:#94a3b833;max-width:940px;margin:0 auto;padding:40px 20px 60px}.nf-hero{text-align:center;margin-bottom:34px}.nf-eyebrow{letter-spacing:7px;text-transform:uppercase;color:var(--nf-cyan);opacity:.7;margin-bottom:10px;font-size:10px;font-weight:800}.nf-code{letter-spacing:-.03em;background:linear-gradient(#67e8f9 0%,#22d3ee 45%,#0891b2 100%);-webkit-text-fill-color:transparent;filter:drop-shadow(0 8px 26px #22d3ee47);-webkit-background-clip:text;background-clip:text;font-size:clamp(76px,17vw,132px);font-weight:900;line-height:.95}.nf-hero h1{color:var(--nf-text);text-wrap:balance;margin:10px 0 8px;font-size:clamp(19px,3.2vw,25px);font-weight:800}.nf-hero>p{max-width:50ch;color:var(--nf-muted);margin:0 auto 22px;font-size:.92rem;line-height:1.6}.nf-actions{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.nf-btn{border:1px solid var(--nf-border);color:var(--nf-text);white-space:nowrap;border-radius:11px;align-items:center;gap:8px;padding:11px 20px;font-size:.88rem;font-weight:700;text-decoration:none;transition:border-color .15s,background .15s;display:inline-flex}.nf-btn:hover{border-color:var(--nf-cyan);background:#22d3ee17}.nf-btn.primary{background:linear-gradient(135deg, #06b6d4, var(--nf-cyan));color:#04121a;border-color:#0000}.nf-btn.primary:hover{filter:brightness(1.08)}.nf-cats{margin-bottom:30px}.nf-cats-head{text-align:center;margin-bottom:18px}.nf-badge{color:var(--nf-cyan);text-transform:uppercase;letter-spacing:.07em;background:#22d3ee1c;border:1px solid #22d3ee47;border-radius:50px;align-items:center;gap:7px;padding:4px 12px;font-size:.66rem;font-weight:800;display:inline-flex}.nf-cats-head h2{color:var(--nf-text);margin:10px 0 4px;font-size:1.22rem;font-weight:800}.nf-cats-head p{color:var(--nf-muted);margin:0;font-size:.84rem}.nf-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px;display:grid}.nf-card{--nf-c:var(--nf-cyan);border:1px solid var(--nf-border);background:var(--nf-surface);color:var(--nf-text);border-radius:14px;align-items:center;gap:13px;padding:11px 14px 11px 11px;text-decoration:none;transition:border-color .16s,background .16s,transform .16s;display:flex;position:relative;overflow:hidden}.nf-card:before{content:"";background:var(--nf-c);opacity:.8;width:3px;position:absolute;top:0;bottom:0;left:0}.nf-card:hover{border-color:color-mix(in srgb, var(--nf-c) 55%, transparent);background:color-mix(in srgb, var(--nf-c) 9%, var(--nf-surface));transform:translateY(-2px)}.nf-thumb{background:color-mix(in srgb, var(--nf-c) 16%, transparent);width:52px;height:52px;color:var(--nf-c);border-radius:11px;flex:none;place-items:center;font-size:19px;display:grid;overflow:hidden}.nf-thumb img{object-fit:cover;width:100%;height:100%;display:block}.nf-card-body{flex-direction:column;flex:1;gap:3px;min-width:0;display:flex}.nf-card-body h3{text-overflow:ellipsis;white-space:nowrap;margin:0;font-size:.93rem;font-weight:700;line-height:1.3;overflow:hidden}.nf-count{color:var(--nf-muted);font-variant-numeric:tabular-nums;font-size:.74rem}.nf-arrow{color:var(--nf-muted);flex:none;font-size:.76rem;transition:transform .16s,color .16s}.nf-card:hover .nf-arrow{color:var(--nf-c);transform:translate(3px)}.nf-help{border:1px solid var(--nf-border);background:var(--nf-surface);border-radius:14px;flex-wrap:wrap;align-items:center;gap:14px;padding:16px 20px;display:flex}.nf-help-ico{width:42px;height:42px;color:var(--nf-cyan);background:#22d3ee1f;border-radius:11px;flex:none;place-items:center;font-size:17px;display:grid}.nf-help-text{flex:1;min-width:190px}.nf-help-text b{color:var(--nf-text);margin-bottom:2px;font-size:.92rem;display:block}.nf-help-text p{color:var(--nf-muted);margin:0;font-size:.8rem;line-height:1.5}html[data-theme=light] .nf-page{--nf-text:#0f172a;--nf-muted:#64748b;--nf-surface:#fff;--nf-border:#e3e7ee}html[data-theme=light] .nf-code{background:linear-gradient(#22d3ee 0%,#0891b2 55%,#0e7490 100%);filter:drop-shadow(0 6px 18px #0891b233);-webkit-background-clip:text;background-clip:text}html[data-theme=light] .nf-card{box-shadow:0 3px 12px #0f1e370d}html[data-theme=light] .nf-btn:hover{background:#f0fbff}@media (max-width:560px){.nf-page{padding:30px 16px 44px}.nf-grid{grid-template-columns:1fr}.nf-help{flex-direction:column;align-items:flex-start}}@media (prefers-reduced-motion:reduce){.nf-card,.nf-arrow{transition:none}.nf-card:hover{transform:none}}