/* PRÉLUDE LAB — shared styles for /lab/* tools (builds on /beauty-checker/checker.css) */
.lab-nav{position:relative;z-index:49;background:rgba(5,6,12,.6);border-bottom:1px solid var(--line);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.lab-nav .wrap{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding-top:8px;padding-bottom:8px}
.lab-nav .wrap::-webkit-scrollbar{display:none}
.lab-nav a{flex:0 0 auto;font:600 12px var(--mono);letter-spacing:.04em;color:var(--muted);text-decoration:none;padding:7px 12px;border:1px solid transparent;border-radius:3px;white-space:nowrap}
.lab-nav a:hover{color:var(--ink);border-color:var(--line)}
.lab-nav a[aria-current=page]{color:#05060c;background:var(--grad);box-shadow:0 0 14px rgba(62,242,255,.35)}
.lab-head{margin:30px auto 0}
.lab-head h1{font-size:clamp(26px,4vw,38px);line-height:1.45;margin-top:6px}
.lab-head p{color:var(--muted);font-size:14px;margin:10px 0 0;max-width:640px}
.lab-chip{display:inline-block;font:600 11px var(--mono);color:var(--cyan);border:1px solid var(--line2);background:rgba(62,242,255,.06);padding:4px 9px;border-radius:3px;margin:12px 6px 0 0}
.lab-note{font-size:11.5px;color:var(--soft);line-height:1.8;margin-top:18px}
.lab-cta{margin:56px auto 0;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.lab-cta a{display:block;padding:18px 16px;background:var(--panel);border:1px solid var(--line);border-radius:4px;text-decoration:none;transition:.2s}
.lab-cta a:hover{border-color:var(--line2);box-shadow:var(--glow)}
.lab-cta small{display:block;font:600 10px var(--mono);letter-spacing:.18em;color:var(--mag)}
.lab-cta b{display:block;font:700 15px/1.5 var(--jp);margin:4px 0}
.lab-cta span{font-size:12px;color:var(--muted);line-height:1.7}
.mini-prods{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.mini-prods a{display:grid;grid-template-columns:72px 1fr;gap:12px;align-items:center;padding:10px;background:var(--panel);border:1px solid var(--line);border-radius:4px;text-decoration:none;transition:.2s}
.mini-prods a:hover{border-color:var(--line2);box-shadow:var(--glow)}
.mini-prods img{width:72px;height:72px;object-fit:cover;border-radius:3px;background:#11152a}
.mini-prods small{display:block;font:600 9.5px var(--mono);letter-spacing:.14em;color:var(--cyan);text-transform:uppercase}
.mini-prods b{display:block;font:700 13px/1.5 var(--jp)}
.mini-prods span{display:block;font-size:11.5px;color:var(--muted);line-height:1.6;margin-top:2px}
.pr-mini{font-size:11px;color:var(--soft);margin-top:10px}
@media (max-width:860px){.lab-cta{grid-template-columns:1fr}.mini-prods{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.mini-prods{grid-template-columns:1fr}}

/* ---------- weather ---------- */
.wx-bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:22px 0 0}
.wx-bar select{appearance:none;-webkit-appearance:none;font:600 14px var(--sans);color:var(--ink);background:rgba(10,13,26,.8) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%233ef2ff' stroke-width='2' fill='none'/%3E%3C/svg%3E") no-repeat right 12px center;border:1px solid var(--line2);border-radius:4px;padding:11px 36px 11px 14px}
.wx-bar .btn{padding:11px 16px;font-size:13px}
.wx-status{font:12px var(--mono);color:var(--muted);min-height:20px;margin-top:10px}
.wx-hero{margin-top:18px;display:grid;grid-template-columns:1.1fr .9fr;gap:20px;align-items:stretch}
.wx-now{position:relative;padding:26px;background:linear-gradient(140deg,rgba(24,29,54,.92),rgba(12,14,28,.92));border:1px solid var(--line);border-radius:6px;overflow:hidden}
.wx-now:after{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--grad);box-shadow:0 0 16px var(--cyan)}
.wx-city{font:600 12px var(--mono);letter-spacing:.14em;color:var(--cyan)}
.wx-temp{display:flex;align-items:baseline;gap:12px;margin:8px 0 6px}
.wx-temp b{font:900 64px/1 var(--disp);text-shadow:0 0 22px rgba(62,242,255,.45)}
.wx-temp span{font-size:14px;color:var(--muted)}
.wx-alert{font:700 clamp(19px,3vw,24px)/1.5 var(--jp);margin:10px 0 8px}
.wx-alert em{font-style:normal;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.wx-sum{font-size:13.5px;color:#c9cfee;margin:0}
.wx-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:16px}
.wx-facts div{padding:10px;background:rgba(5,6,12,.5);border:1px solid var(--line);border-radius:4px;text-align:center}
.wx-facts small{display:block;font:600 9.5px var(--mono);letter-spacing:.1em;color:var(--muted)}
.wx-facts b{font:700 18px var(--disp)}
.wx-gauges{display:grid;gap:12px;padding:22px;background:var(--panel);border:1px solid var(--line);border-radius:6px}
.wx-g{display:grid;grid-template-columns:110px 1fr 70px;gap:10px;align-items:center;font-size:13px}
.wx-g .t{white-space:nowrap}
.wx-g .lv{display:grid;grid-template-columns:repeat(5,1fr);gap:3px}
.wx-g .lv i{height:10px;background:rgba(130,150,255,.14);border-radius:1px}
.wx-g .lv i.on{box-shadow:0 0 8px currentColor}
.wx-g .w{font:700 11.5px var(--mono);text-align:right}
.wx-tips{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.wx-tip{padding:18px;background:var(--panel);border:1px solid var(--line);border-radius:4px}
.wx-tip small{font:600 10px var(--mono);letter-spacing:.18em;color:var(--mag)}
.wx-tip b{display:block;font:700 15px/1.5 var(--jp);margin:6px 0}
.wx-tip p{margin:0;font-size:13px;color:#c9cfee;line-height:1.8}
.wx-hours{display:grid;grid-template-columns:repeat(8,1fr);gap:6px}
.wx-hours div{padding:10px 4px;text-align:center;background:var(--panel);border:1px solid var(--line);border-radius:4px}
.wx-hours small{display:block;font:600 10px var(--mono);color:var(--muted)}
.wx-hours b{display:block;font:700 15px var(--disp);margin:4px 0 2px}
.wx-hours span{display:block;font:11px var(--mono);color:var(--cyan)}
.wx-hours .uvhi{border-color:rgba(255,92,138,.6)}
.wx-hours .uvhi span{color:var(--warn)}
.wx-skeleton{opacity:.45}
@media (max-width:860px){.wx-hero{grid-template-columns:1fr}.wx-tips{grid-template-columns:1fr 1fr}.wx-hours{grid-template-columns:repeat(4,1fr)}}
@media (max-width:520px){.wx-tips{grid-template-columns:1fr}.wx-facts{grid-template-columns:repeat(2,1fr)}.wx-g{grid-template-columns:92px 1fr 62px;font-size:12.5px}.wx-temp b{font-size:54px}}

/* ---------- swipe ---------- */
.sw-wrap{max-width:440px;margin:22px auto 0}
.sw-prog{display:flex;justify-content:space-between;font:600 12px var(--mono);color:var(--muted);margin-bottom:8px}
.sw-bar{height:3px;background:rgba(130,150,255,.14);margin-bottom:16px}
.sw-bar i{display:block;height:100%;width:0;background:var(--grad);box-shadow:0 0 10px var(--cyan);transition:width .3s}
.sw-stack{position:relative;height:min(122vw,560px);touch-action:pan-y}
.sw-card{position:absolute;inset:0;display:flex;flex-direction:column;background:#0d1020;border:1px solid var(--line);border-radius:10px;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.55);user-select:none;-webkit-user-select:none;cursor:grab;transition:transform .35s cubic-bezier(.2,.8,.2,1),opacity .35s;will-change:transform}
.sw-card.dragging{transition:none;cursor:grabbing}
.sw-card:nth-last-child(2){transform:scale(.95) translateY(12px);opacity:.75}
.sw-card:nth-last-child(n+3){transform:scale(.9) translateY(24px);opacity:0}
.sw-card .ph{position:relative;flex:1;min-height:0;background:#11152a}
.sw-card .ph img{width:100%;height:100%;object-fit:cover;pointer-events:none}
.sw-card .ph:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(13,16,32,.95))}
.sw-card .info{position:absolute;left:0;right:0;bottom:0;padding:18px 18px 16px;z-index:1}
.sw-card .info small{font:600 10px var(--mono);letter-spacing:.16em;color:var(--cyan);text-transform:uppercase}
.sw-card .info b{display:block;font:700 18px/1.45 var(--jp);margin:3px 0 4px}
.sw-card .info span{font-size:12.5px;color:#c9cfee}
.sw-stamp{position:absolute;top:22px;z-index:2;font:900 28px var(--disp);letter-spacing:.1em;padding:6px 14px;border:3px solid;border-radius:6px;opacity:0;transform:rotate(-12deg)}
.sw-stamp.like{left:20px;color:var(--ok);border-color:var(--ok);text-shadow:0 0 12px var(--ok)}
.sw-stamp.nope{right:20px;color:var(--warn);border-color:var(--warn);transform:rotate(12deg);text-shadow:0 0 12px var(--warn)}
.sw-btns{display:flex;justify-content:center;gap:22px;margin-top:18px}
.sw-btns button{width:68px;height:68px;border-radius:50%;border:1px solid var(--line2);background:rgba(10,13,26,.8);font-size:26px;display:grid;place-items:center;transition:.15s}
.sw-btns button:hover{transform:scale(1.06)}
.sw-btns .no{color:var(--warn);border-color:rgba(255,92,138,.6);box-shadow:0 0 18px rgba(255,92,138,.25)}
.sw-btns .yes{color:var(--ok);border-color:rgba(62,242,196,.6);box-shadow:0 0 18px rgba(62,242,196,.25)}
.sw-btns .undo{width:48px;height:48px;font-size:17px;color:var(--muted);align-self:center}
.sw-hint{text-align:center;font:11.5px var(--mono);color:var(--soft);margin-top:12px}
.sw-res .r-hero{margin-top:22px}
.sw-tastes{display:grid;gap:10px}
.sw-liked{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.sw-liked a{display:block;text-decoration:none;background:var(--panel);border:1px solid var(--line);border-radius:4px;overflow:hidden;transition:.2s}
.sw-liked a:hover{border-color:var(--line2);box-shadow:var(--glow)}
.sw-liked img{width:100%;aspect-ratio:1;object-fit:cover;background:#11152a}
.sw-liked span{display:block;padding:8px 10px;font:700 12px/1.5 var(--jp)}
.sw-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
@media (max-width:640px){.sw-liked{grid-template-columns:repeat(2,1fr)}}

/* ---------- ingredients ---------- */
.ig-pick{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:start;margin-top:22px}
.ig-slot{padding:16px;background:var(--panel);border:1px solid var(--line);border-radius:6px;min-height:100%}
.ig-slot h3{font:600 11px var(--mono);letter-spacing:.16em;color:var(--cyan);margin:0 0 10px}
.ig-slot .sel{font:700 18px/1.4 var(--jp);min-height:26px;margin-bottom:12px}
.ig-slot .sel.empty{color:var(--soft);font-weight:500;font-size:14px}
.ig-list{display:flex;flex-wrap:wrap;gap:6px}
.ig-list button{border:1px solid var(--line);background:rgba(10,13,26,.7);border-radius:3px;padding:6px 10px;font:600 12.5px var(--sans);color:#c9cfee;transition:.15s}
.ig-list button:hover{border-color:var(--line2);color:var(--ink)}
.ig-list button[aria-pressed=true]{background:var(--cyan);border-color:var(--cyan);color:#05060c;box-shadow:0 0 12px rgba(62,242,255,.45)}
.ig-x{align-self:center;font:900 28px var(--disp);color:var(--mag);text-shadow:0 0 14px rgba(255,63,180,.6)}
.ig-opts{display:flex;flex-wrap:wrap;gap:16px;align-items:center;margin-top:14px;font-size:13px}
.ig-opts label{display:flex;gap:8px;align-items:center;cursor:pointer}
.ig-opts input{width:18px;height:18px;accent-color:#3ef2ff}
.ig-res{margin-top:22px}
.ig-verdict{position:relative;display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:center;padding:26px;background:linear-gradient(140deg,rgba(24,29,54,.92),rgba(12,14,28,.92));border:1px solid var(--line);border-radius:6px;overflow:hidden}
.ig-verdict:after{content:"";position:absolute;left:0;right:0;top:0;height:2px}
.ig-mark{width:110px;height:110px;border-radius:50%;display:grid;place-items:center;font:900 54px var(--disp);border:3px solid}
.ig-verdict.ok .ig-mark{color:var(--ok);border-color:var(--ok);box-shadow:0 0 30px rgba(62,242,196,.4),inset 0 0 20px rgba(62,242,196,.2)}
.ig-verdict.mid .ig-mark{color:var(--amber);border-color:var(--amber);box-shadow:0 0 30px rgba(255,196,107,.4),inset 0 0 20px rgba(255,196,107,.2)}
.ig-verdict.ng .ig-mark{color:var(--warn);border-color:var(--warn);box-shadow:0 0 30px rgba(255,92,138,.45),inset 0 0 20px rgba(255,92,138,.2)}
.ig-verdict.ok:after{background:var(--ok);box-shadow:0 0 14px var(--ok)}.ig-verdict.mid:after{background:var(--amber);box-shadow:0 0 14px var(--amber)}.ig-verdict.ng:after{background:var(--warn);box-shadow:0 0 14px var(--warn)}
.ig-verdict small{font:600 11px var(--mono);letter-spacing:.16em;color:var(--muted)}
.ig-verdict h2{font-size:clamp(20px,3vw,26px);line-height:1.5;margin:4px 0 8px}
.ig-verdict p{margin:0;color:#c9cfee;font-size:14px}
.ig-plan{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:14px}
.ig-plan div{padding:16px;background:var(--panel);border:1px solid var(--line);border-radius:4px}
.ig-plan small{font:600 10px var(--mono);letter-spacing:.16em;color:var(--cyan)}
.ig-plan b{display:block;font:700 14.5px/1.6 var(--jp);margin:4px 0}
.ig-plan p{margin:0;font-size:12.5px;color:#c9cfee;line-height:1.8}
.ig-about{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:12px}
.ig-about div{padding:14px 16px;background:rgba(139,92,255,.08);border:1px solid rgba(139,92,255,.3);border-radius:4px}
.ig-about b{display:block;font:700 14px var(--jp);color:#d9d0ff;margin-bottom:4px}
.ig-about p{margin:0;font-size:12.5px;color:#c9cfee;line-height:1.75}
.ig-matrix-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:4px;background:var(--panel)}
.ig-matrix{border-collapse:collapse;font-size:12px;min-width:720px;width:100%}
.ig-matrix th,.ig-matrix td{border:1px solid rgba(130,150,255,.12);padding:6px;text-align:center;white-space:nowrap}
.ig-matrix th{font:600 11px var(--sans);color:#c9cfee;background:rgba(5,6,12,.6)}
.ig-matrix thead th{writing-mode:vertical-rl;padding:8px 4px;height:110px;vertical-align:bottom}
.ig-matrix tbody th{text-align:left;position:sticky;left:0;z-index:1;background:#0b0e1c}
.ig-matrix td button{all:unset;cursor:pointer;display:block;width:100%;font:900 14px var(--disp)}
.ig-matrix td.ok button{color:var(--ok)}.ig-matrix td.mid button{color:var(--amber)}.ig-matrix td.ng button{color:var(--warn)}.ig-matrix td.same{color:var(--soft)}
.ig-matrix td:hover{background:rgba(62,242,255,.08)}
@media (max-width:760px){.ig-pick{grid-template-columns:1fr}.ig-x{justify-self:center}.ig-plan,.ig-about{grid-template-columns:1fr}.ig-verdict{grid-template-columns:1fr;text-align:center}.ig-mark{margin:0 auto}}
