@layer base;@layer components{.nf{min-height:calc(100svh - var(--nav-h) - 80px);grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:center;gap:40px clamp(32px,5vw,90px);padding-top:clamp(20px,3vw,40px);padding-bottom:clamp(48px,6vw,96px);display:grid}.nf-copy{justify-items:start;gap:26px;display:grid}.nf-copy .ap-lead{text-wrap:balance;max-width:30em}.nf-page{background:#ebe7dc;border-radius:26px;justify-self:end;width:min(100%,clamp(340px,71.4286svh - 96.2857px,560px));padding:clamp(16px,2vw,26px) clamp(16px,2vw,26px) clamp(16px,2vw,26px) clamp(40px,4.6vw,62px);position:relative;box-shadow:inset 0 0 0 1px #0b0b0f14,0 1px 2px #0b0b0f0d,0 28px 60px -34px #0b0b0f59}.nf-rings{pointer-events:none;flex-direction:column;justify-content:space-evenly;display:flex;position:absolute;top:0;bottom:0;left:clamp(12px,1.5vw,20px)}.nf-rings i{aspect-ratio:1;background:var(--bg);border-radius:50%;width:clamp(14px,1.5vw,18px);display:block;box-shadow:inset 0 1px 2px #0b0b0f47,0 1px #fff9}.nf-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.7vw,22px);display:grid}.nf-slot{transform:rotate(var(--tilt,0deg));animation:.9s cubic-bezier(.16,1,.3,1) both nf-in;animation-delay:calc(var(--i,0) * 90ms + .12s);container-type:inline-size}@keyframes nf-in{0%{opacity:0;transform:translateY(26px) rotate(calc(var(--tilt,0deg) * 2.5))}to{opacity:1;transform:rotate(var(--tilt,0deg))}}.nf-empty-wrap{aspect-ratio:5/7;width:100%}.nf-empty{width:100%;height:100%;color:var(--violet);border:2px dashed #0b0b0f4d;border-radius:5.8cqw;flex-direction:column;justify-content:center;align-items:center;gap:5cqw;transition:border-color .2s,background-color .2s;display:flex}.nf-empty:hover{border-color:var(--violet);background:var(--violet-tint)}.nf-plus{background:#fff;border-radius:50%;place-items:center;width:22cqw;height:22cqw;transition:transform .45s cubic-bezier(.16,1,.3,1),background-color .2s,color .2s;display:grid;box-shadow:inset 0 0 0 2px}.nf-plus svg{width:9cqw;height:9cqw}.nf-empty:hover .nf-plus{background:var(--violet);color:#fff;transform:rotate(90deg)}.nf-empty-label{font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-size:max(10px,3.3cqw);font-weight:500}.nf-empty:focus-visible{outline:2px solid var(--violet);outline-offset:4px}@media (max-width:900px){.nf{grid-template-columns:minmax(0,1fr);min-height:0}.nf-page{justify-self:center;width:min(100%,440px)}}}@media (prefers-reduced-motion:reduce){.nf-slot{animation:none}}
