/* NIA Labs: lab screens */
body.lab{--acc:var(--l1);background:var(--ground)}
body.lab.l2{--acc:var(--l2)}body.lab.l3{--acc:var(--l3)}
.lab-top{padding-top:28px;padding-bottom:8px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
.crumb{font-size:16px;color:var(--muted);text-decoration:none;display:inline-flex;align-items:center;min-height:44px;gap:8px}
.crumb:hover{color:var(--ink)}
.stepper{display:flex;flex-wrap:wrap;gap:8px 6px;align-items:center;font-size:15px}
.stepper li{display:flex;align-items:center;gap:8px;padding:6px 14px 6px 6px;border-radius:999px;border:2px solid var(--line);background:var(--paper);font-weight:500;transition:all .4s var(--ease)}
.stepper li b{width:26px;height:26px;border-radius:50%;background:var(--ground);display:flex;align-items:center;justify-content:center;font-family:var(--display);font-size:14px}
.stepper li.now{border-color:var(--ink);font-weight:700}
.stepper li.now b{background:var(--acc);color:var(--on-accent)}
body.lab.l3 .stepper li.now b{color:var(--on-l3)}
.stepper li.done b{background:var(--brand-slate);color:#101218}
.screen-wrap{padding-top:32px;padding-bottom:96px;min-height:70vh}
.screen.enter{animation:screenIn .7s var(--ease) both}
@keyframes screenIn{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
.two{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;align-items:start}
.two.even{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.side{position:sticky;top:104px;display:flex;flex-direction:column;gap:28px}
.lab h1{font-weight:700;font-size:clamp(40px,5.6vw,80px);line-height:.96;letter-spacing:-.045em}
.lab .lede{margin-top:24px;font-size:21px;line-height:1.55;color:var(--body);max-width:30em}
.lab .lede+.lede{margin-top:14px}
.steps-l{margin-top:32px;display:flex;flex-direction:column;gap:14px}
.steps-l li{display:flex;gap:14px;font-size:19px;line-height:1.45;align-items:flex-start}
.steps-l span.n{flex:none;width:34px;height:34px;border-radius:50%;background:var(--acc);display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:700}
.go{margin-top:36px}
.card{background:var(--paper);border:2px solid var(--ink);border-radius:8px;padding:26px 28px;box-shadow:10px 10px 0 var(--acc)}
.card h2{font-weight:700;font-size:24px;letter-spacing:-.02em}
.mail .from{display:flex;gap:14px;align-items:center}
.av{width:52px;height:52px;border-radius:50%;background:var(--acc);display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:700;font-size:20px;flex:none;color:var(--on-accent)}
body.lab.l3 .av{color:var(--on-l3)}
.mail .from b{display:block;font-size:18px}.mail .from span{font-size:15px;color:var(--muted)}
.mail h2{margin-top:18px;font-weight:600;font-size:28px;line-height:1.15}
.mail p{margin-top:10px;font-size:18px;line-height:1.55;color:var(--body)}
.card.plain{box-shadow:none;border-color:var(--line)}
.card ul.kv li{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid var(--line);font-size:17px}
.card ul.kv li:first-child{border-top:0}
.card ul.kv li span:last-child{color:var(--muted);white-space:nowrap}
.card ul.bul{margin-top:12px}.card ul.bul li{padding:9px 0 9px 22px;position:relative;font-size:17px;line-height:1.5;border-top:1px solid var(--line)}
.card ul.bul li:first-child{border-top:0}
.card ul.bul li::before{content:'';position:absolute;left:0;top:18px;width:9px;height:9px;background:var(--acc)}
.kicker{font-size:15px;font-weight:600;color:var(--muted);letter-spacing:.02em}
/* lab 1 */
.assistant{background:var(--paper);border:2px solid var(--line);border-radius:8px;padding:24px 26px;margin-bottom:22px}
.assistant h2{font-weight:700;font-size:24px;display:flex;align-items:center;gap:10px}
.assistant h2::before{content:'';width:14px;height:14px;background:var(--acc)}
.assistant .intro-t{margin-top:6px;font-size:17px;color:var(--muted)}
.claim{padding:16px 0;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;justify-content:space-between}
.claim:first-of-type{margin-top:16px}
.claim p{flex:1 1 280px;font-size:18px;line-height:1.5}
.seg{display:inline-flex;border:2px solid var(--ink);border-radius:6px;overflow:hidden;flex:none}
.seg button{min-height:46px;padding:0 18px;border:0;background:var(--paper);font:600 16px var(--sans);color:var(--ink);cursor:pointer;transition:background-color .25s,color .25s}
.seg button+button{border-left:2px solid var(--ink)}
.seg button:hover{background:var(--ground)}
.seg button[aria-pressed="true"]{background:var(--ink);color:var(--ground)}
.seg button[aria-pressed="true"].t{background:var(--l1);color:var(--on-accent)}
.seg button[aria-pressed="true"].c{background:var(--l2);color:var(--on-accent)}
.meter{height:10px;border-radius:5px;background:var(--line);overflow:hidden;margin:14px 0 6px}
.meter i{display:block;height:100%;background:var(--ink);width:0;transition:width .6s var(--ease)}
.big{font-family:var(--display);font-weight:700;font-size:clamp(96px,14vw,200px);line-height:.85;letter-spacing:-.06em}
.big small{font-size:.28em;letter-spacing:-.02em;font-weight:500;color:var(--muted)}
.res li{background:var(--paper);border:2px solid var(--line);border-radius:8px;padding:18px 22px;margin-bottom:14px;animation:screenIn .6s var(--ease) both;animation-delay:calc(var(--i)*.07s + .15s)}
.res .top{display:flex;justify-content:space-between;gap:14px;align-items:flex-start}
.res p.t{font-size:18px;font-weight:600;line-height:1.4}
.res p.w{margin-top:8px;font-size:16px;line-height:1.5;color:var(--body)}
.pill{flex:none;font-size:14px;font-weight:700;padding:5px 12px;border-radius:999px;border:2px solid var(--ink);white-space:nowrap}
.pill.ok{background:var(--l1);color:var(--on-accent)}.pill.mid{background:var(--l2);color:var(--on-accent)}.pill.bad{background:var(--l3);color:var(--on-l3)}
/* take */
.take{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:40px}
.take>div{background:var(--paper);border:2px solid var(--ink);border-radius:8px;padding:24px;box-shadow:8px 8px 0 var(--acc);animation:screenIn .7s var(--ease) both;animation-delay:calc(var(--i)*.12s + .1s)}
.take h2{font-weight:700;font-size:23px;line-height:1.15;letter-spacing:-.02em}
.take p{margin-top:10px;font-size:17px;line-height:1.5;color:var(--body)}
.prompt{margin-top:36px;background:#101216;color:#FFFFFF;border-radius:8px;padding:28px 32px;position:relative}
.prompt h2{font-weight:600;font-size:22px;color:var(--acc)}
.prompt p{margin-top:12px;font-size:19px;line-height:1.6;max-width:46em}
.actions{margin-top:28px;display:flex;flex-wrap:wrap;gap:14px}
.prompt .btn{margin-top:20px}
/* lab 2 */
.parts{display:flex;flex-direction:column;gap:12px;margin-top:28px}
.part{width:100%;text-align:left;display:flex;gap:16px;align-items:flex-start;padding:16px 18px;border:2px solid var(--ink);border-radius:8px;background:var(--paper);cursor:pointer;font-family:var(--sans);color:var(--ink);transition:background-color .3s,transform .3s var(--ease),box-shadow .3s}
.part:hover{transform:translateX(4px)}
.part .sw{flex:none;width:44px;height:26px;border-radius:13px;background:var(--line);position:relative;margin-top:2px;transition:background-color .3s}
.part .sw::after{content:'';position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:var(--ink);transition:transform .3s var(--ease)}
.part[aria-pressed="true"]{background:#F1EEFE;color:#101218;box-shadow:6px 6px 0 var(--acc)}
.part[aria-pressed="true"] .sw{background:var(--acc)}
.part[aria-pressed="true"] .sw::after{transform:translateX(18px)}
.part b{display:block;font-family:var(--display);font-size:20px}
.part span.h{display:block;margin-top:2px;font-size:16px;color:var(--muted);line-height:1.45}
.part[aria-pressed="true"] span.h{color:#4D5060}
.brief-box{margin-top:26px;padding:18px 20px;border-radius:8px;background:#101216;color:#FFFFFF}
.brief-box .kicker{color:var(--acc)}
.brief-box p.txt{margin-top:8px;font-size:16.5px;line-height:1.6}
.answer{background:var(--paper);border:2px solid var(--ink);border-radius:8px;box-shadow:10px 10px 0 var(--acc);overflow:hidden}
.answer .hd{padding:14px 22px;border-bottom:2px solid var(--ink);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;background:var(--ground)}
.answer .hd b{font-family:var(--display);font-size:18px}.answer .hd span{font-size:14px;color:var(--muted)}
.answer .bd{padding:22px 24px}
.blk{margin-bottom:20px;animation:screenIn .5s var(--ease) both}
.blk h3{font-weight:700;font-size:19px;margin-bottom:8px}
.blk p,.blk li{font-size:17px;line-height:1.55;color:var(--body)}
.blk li{padding:5px 0 5px 20px;position:relative}.blk li::before{content:'';position:absolute;left:0;top:14px;width:8px;height:8px;background:var(--acc)}
.blk.warn{background:#F8EFFE;border-left:6px solid var(--l3);padding:14px 16px;border-radius:4px;color:#101218}
.blk.warn p,.blk.warn li{color:#2B2E38}
.strength{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;align-items:center;margin-top:24px}
.strength b{font-family:var(--display);font-size:28px;display:block}
.strength p{font-size:16px;color:var(--muted);max-width:26em;line-height:1.45}
/* lab 3 */
.act{background:var(--paper);border:2px solid var(--line);border-radius:8px;padding:20px 22px;margin-bottom:16px;transition:border-color .3s}
.act.set{border-color:var(--ink)}
.act p.q{font-size:19px;font-weight:600;line-height:1.35}
.opts{margin-top:14px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.opt{min-height:56px;padding:8px 10px;border:2px solid var(--ink);border-radius:6px;background:var(--paper);font:600 15px/1.25 var(--sans);color:var(--ink);cursor:pointer;transition:background-color .25s,transform .25s var(--ease)}
.opt:hover{background:var(--ground);transform:translateY(-2px)}
.opt[aria-pressed="true"]{background:var(--l3);color:var(--on-l3)}
.helen{display:flex;gap:14px;align-items:center;margin-bottom:24px}
.doc{background:var(--paper);border:2px solid var(--ink);border-radius:8px;padding:clamp(24px,4vw,44px);box-shadow:10px 10px 0 var(--acc)}
.doc h2{font-weight:700;font-size:38px;letter-spacing:-.03em}
.doc h3{margin-top:26px;font-size:18px;font-weight:700;padding-bottom:6px;border-bottom:2px solid var(--ink)}
.doc ul{margin-top:10px}.doc li{padding:6px 0 6px 20px;position:relative;font-size:17px;line-height:1.5}.doc li::before{content:'';position:absolute;left:0;top:15px;width:8px;height:8px;background:var(--ink)}
.rev p.you{margin-top:8px;font-size:15px;color:var(--muted)}
/* hub */
.hub-hero{padding-top:36px;padding-bottom:40px}
.hub-hero h1{font-weight:700;font-size:clamp(46px,7vw,104px);line-height:.94;letter-spacing:-.05em}
.inbox{display:flex;flex-direction:column;gap:36px;padding-bottom:96px}
.msg-card{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:0;background:var(--paper);border:2px solid var(--ink);border-radius:10px;overflow:hidden;box-shadow:12px 12px 0 var(--c);transition:transform .5s var(--ease),box-shadow .5s var(--ease);scroll-margin-top:100px}
.js .msg-card.is-in:hover,.msg-card:hover{transform:translate(-4px,-4px);box-shadow:18px 18px 0 var(--c)}
.msg-card .tx{padding:clamp(24px,3.4vw,44px)}
.msg-card .meta{display:flex;gap:14px;align-items:center}
.msg-card .meta b{display:block;font-size:18px}.msg-card .meta span{font-size:15px;color:var(--muted)}
.msg-card h2{margin-top:20px;font-weight:700;font-size:clamp(30px,3.4vw,46px);line-height:1.02;letter-spacing:-.035em}
.msg-card p.b{margin-top:14px;font-size:19px;line-height:1.55;color:var(--body)}
.msg-card .row2{margin-top:26px;display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.msg-card .tag{font-size:15px;font-weight:600}
.msg-card .im{position:relative;min-height:260px;background:var(--brand-slate)}
.msg-card .im img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.msg-card:hover .im img{transform:scale(1.06)}
.msg-card .im::after{content:'';position:absolute;left:0;top:0;bottom:0;width:10px;background:var(--c)}
.foot-note{margin-top:8px;font-size:16px;color:var(--muted);max-width:42em;line-height:1.55}
@media (max-width:1024px){.two,.two.even{grid-template-columns:minmax(0,1fr);gap:36px}.side{position:static}.take{grid-template-columns:minmax(0,1fr)}.msg-card{grid-template-columns:minmax(0,1fr)}.msg-card .im{min-height:200px;order:-1}.msg-card .im::after{left:0;right:0;top:auto;bottom:0;width:auto;height:10px}}
@media (max-width:640px){.opts{grid-template-columns:minmax(0,1fr)}.seg{width:100%}.seg button{flex:1;min-height:44px;padding:8px 10px}.stepper{min-width:0}.stepper li span{display:none}.stepper li.now span{display:inline}.card{padding:20px 16px}.card ul.kv li{align-items:flex-start}.card ul.kv li span:last-child{white-space:normal;text-align:right}.big{font-size:clamp(64px,22vw,120px)}.prompt{padding:20px 16px}.doc h2{font-size:clamp(28px,8vw,38px)}.msg-card{box-shadow:8px 8px 0 var(--c)}.hub-hero h1{font-size:clamp(36px,11vw,56px)}.res .top{flex-wrap:wrap}.mail h2{font-size:24px;overflow-wrap:anywhere}}
@media print{.site-header,.lab-top,.actions,.site-footer,.stepper,.side>.card:not(.print-ok){display:none!important}body{background:#fff}.doc{box-shadow:none}}
@media (prefers-reduced-motion:reduce){.screen.enter,.res li,.take>div,.blk{animation:none!important}}
