/* Loop & Lens extras. Builds on site.css (same palette, type and motion). */
.ll-hero h1{font-size:clamp(4.2rem,15vw,15rem);line-height:.82}
.ll-hero h1 .l1{color:var(--paper)}
.ll-hero h1 .l2{color:var(--flame)}
.ll-hero .hero-in{grid-template-columns:8fr 4fr}
.ll-hero .portrait{width:min(100%,340px)}
.ll-hero .portrait img{aspect-ratio:3/4}
@media(max-width:900px){.ll-hero .hero-in{grid-template-columns:1fr}.ll-hero h1{font-size:clamp(4rem,22vw,8rem)}}

/* selector visuals */
.vz-chat{padding:18px;display:grid;gap:10px;align-content:start}
.vz-chat .m{max-width:82%;padding:11px 15px;border-radius:14px;font-size:.98rem;line-height:1.4;opacity:0;transform:translateY(10px);animation:typeIn .6s var(--ease) forwards;animation-delay:calc(var(--i)*650ms + 200ms)}
.vz-chat .in{background:var(--navy-2);justify-self:start;border-bottom-left-radius:3px}
.vz-chat .out{background:var(--flame);color:#160a00;justify-self:end;border-bottom-right-radius:3px;font-weight:500}
.vz-chat small{display:block;opacity:.75;font-size:.82rem;margin-top:4px}
.vz-bars{padding:22px 22px 14px;display:flex;align-items:flex-end;gap:12px;height:100%;min-height:240px}
.vz-bars span{flex:1;background:var(--navy-2);border-radius:2px 2px 0 0;position:relative;height:var(--h);transform-origin:bottom;transform:scaleY(0);animation:grow .9s var(--ease) forwards;animation-delay:calc(var(--i)*120ms + 150ms)}
.vz-bars span.hot{background:var(--flame)}
.vz-bars span.cut{background:repeating-linear-gradient(45deg,#2a2d33,#2a2d33 6px,#1b1d21 6px,#1b1d21 12px)}
@keyframes grow{to{transform:scaleY(1)}}
.vz-cap{position:absolute;left:18px;bottom:12px;right:18px;font-size:.88rem;color:var(--paper-dim)}
.vz-cal{padding:18px;display:grid;grid-template-columns:repeat(7,1fr);gap:6px;align-content:start}
.vz-cal i{aspect-ratio:1.25;background:#14171b;border-radius:2px}
.vz-cal i.b{background:var(--flame);opacity:0;animation:pop2 .5s var(--ease) forwards;animation-delay:calc(var(--i)*220ms + 300ms)}
.vz-cal i.h{background:transparent;aspect-ratio:auto;font-size:.82rem;color:var(--paper-dim);text-align:center}
@keyframes pop2{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
.vz-app{display:grid;place-items:center;padding:18px;min-height:240px}
.vz-app .ph{width:150px;height:260px;border-radius:24px;border:2px solid #2a2d33;padding:16px 12px;display:grid;gap:8px;align-content:start;background:#0d0e10}
.vz-app .ph b{height:28px;border-radius:3px;background:var(--flame);opacity:0;animation:typeIn .6s var(--ease) forwards}
.vz-app .ph u{display:block;height:36px;border-radius:3px;background:#1b1d21;opacity:0;animation:typeIn .6s var(--ease) forwards;animation-delay:calc(var(--i)*180ms + 300ms)}
.cmp2{position:absolute;inset:0}
.cmp .old.vid{background:#2b2c2e;color:#aaa;font-family:var(--text);align-content:center;justify-items:start}
.cmp .old.vid h4{font:800 1.4rem/1 var(--display);text-transform:uppercase;color:#cfcfcf;text-decoration:none}
.cmp .old.vid p{color:#9a9a9a}
.cmp .new.vid{align-content:center;justify-items:start}
.cmp .new.vid .cap{display:inline-block;background:var(--flame);color:#160a00;font:800 1.5rem/1 var(--display);text-transform:uppercase;padding:8px 12px}
.cmp .new.vid .cap2{display:inline-block;background:var(--paper);color:#0d0e10;font:800 1.5rem/1 var(--display);text-transform:uppercase;padding:8px 12px;margin-top:6px}

/* first-project picker */
.pick{max-width:var(--max);margin:0 auto;padding-inline:var(--pad);display:grid;grid-template-columns:6fr 6fr;gap:104px clamp(24px,5vw,72px);align-items:center}
.pick .tile2{background:var(--ink);border:1px solid var(--line);padding:clamp(24px,3vw,40px)}
.pick .amt{font:800 clamp(5rem,12vw,9rem)/.85 var(--display);color:var(--flame)}
.pick .amt small{font-size:1.6rem;color:var(--paper);letter-spacing:0}
.pick select{width:100%;min-height:56px;padding:0 14px;background:var(--ink-2);border:1.5px solid var(--line);border-radius:2px;font-size:1.05rem;margin:6px 0 18px}
.pick ul{list-style:none;display:grid;gap:10px;margin:18px 0 24px}
.pick li{padding-left:28px;position:relative;color:var(--paper-dim)}
.pick li::before{content:"";position:absolute;left:0;top:.55em;width:12px;height:7px;border-left:2.5px solid var(--flame);border-bottom:2.5px solid var(--flame);transform:rotate(-45deg)}
@media(max-width:900px){.pick{grid-template-columns:1fr}}
.ll-wl{--scrim:.25;color:var(--paper);min-height:90svh}
.ll-wl .ct{align-items:end}