/* Studio Blueprint · ecosystem concept (16 Oct 2026)
   Status labels, paper artefacts (ledger, checklist, decision log, envelope, planner), pickers. White background only. */
:root{--yel:#FFF200;--blue:#1D3FB8;--red:#D8261C;--pencil:#7A7A7A}
.st{display:inline-block;font:400 13px/1.2 'Special Elite',monospace;letter-spacing:.1em;text-transform:uppercase;padding:5px 10px 4px;border:2px solid currentColor;background:#fff;rotate:-3deg;white-space:nowrap;vertical-align:middle}
.st.live{color:#0A0A0A;background:var(--yel);border-color:#0A0A0A}
.st.build{color:var(--blue);border-width:1.5px;font-family:'Reenie Beanie',cursive;font-size:22px;letter-spacing:.02em;text-transform:none;padding:0 10px;rotate:-2deg}
.st.soon{color:var(--red);rotate:-5deg;border-width:2.5px;box-shadow:inset 0 0 0 2px #fff,inset 0 0 0 3.5px rgba(216,38,28,.55)}
.st.road{color:var(--pencil);border-style:dashed;rotate:0deg}
.st-note{font:400 12px 'Special Elite',monospace;letter-spacing:.05em;color:#6B6B6B;margin-top:10px;display:block}
.pg-head .st{margin:0 0 18px}
.skey{font:400 12px 'Special Elite',monospace;letter-spacing:.06em;color:#6B6B6B;border-top:1px solid #E6E6E6;padding:16px 0 0;margin-top:6px;grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center}
.skey .st{font-size:11px;padding:3px 7px 2px;rotate:0deg}.skey .st.build{font-size:18px;padding:0 6px}
/* paper */
.pp{position:relative;background:#fff;background-image:var(--fib);box-shadow:0 1px 1px rgba(0,0,0,.12),0 6px 10px -4px rgba(0,0,0,.14),0 22px 30px -18px rgba(0,0,0,.22);padding:28px 26px 24px;rotate:var(--r,0deg)}
.pp>.st{position:absolute;right:-12px;top:-16px;z-index:3}
.pp .tp2{position:absolute;top:-12px;left:var(--tl,38%);width:86px;height:26px;background:rgba(232,232,218,.85);background-image:var(--fib);box-shadow:0 1px 1px rgba(0,0,0,.1);clip-path:polygon(2% 0,98% 6%,100% 30%,97% 55%,100% 100%,3% 96%,0 70%,3% 40%);rotate:-4deg;z-index:2}
.pp .pin{position:absolute;left:50%;top:10px;width:8px;height:8px;border-radius:50%;background:radial-gradient(#9a9a9a,#d8d8d8 70%);box-shadow:inset 0 1px 1px rgba(0,0,0,.4)}
.nm{font:800 26px/1 'Bricolage Grotesque',sans-serif;letter-spacing:-.03em;font-variation-settings:"wdth" 80}
.sub{font:400 11px 'Special Elite',monospace;letter-spacing:.08em;text-transform:uppercase;color:#6B6B6B;margin-top:6px}
.lg{width:100%;border-collapse:collapse;font-size:14px;margin-top:14px}
.lg td,.lg th{text-align:left;padding:7px 0;border-bottom:1px solid #E6E6E6;vertical-align:top}
.lg th{font:400 10px 'Special Elite',monospace;letter-spacing:.07em;text-transform:uppercase;color:#6B6B6B}
.lg td:last-child,.lg th:last-child{text-align:right;padding-left:14px}
.ledger{background-image:var(--fib),linear-gradient(90deg,transparent 30px,rgba(216,38,28,.35) 30px 31px,transparent 31px);padding-left:46px}
.circ{display:inline-block;border:2px solid var(--red);border-radius:50%;padding:0 6px;color:var(--red);rotate:-6deg}
.biro{font-family:'Reenie Beanie',cursive;color:var(--blue);line-height:.95}
.pencil{font:400 30px/1 'Reenie Beanie',cursive;color:var(--pencil)}
.ck{list-style:none;margin-top:12px}
.ck li{font-size:14px;padding:6px 0;border-bottom:1px solid #E6E6E6;display:flex;gap:10px;align-items:center}
.ck b{width:16px;height:16px;border:1.5px solid #0A0A0A;display:inline-grid;place-items:center;font:400 20px/1 'Reenie Beanie',cursive;color:var(--blue);flex:none}
.bars{display:flex;gap:6px;margin:8px 0 14px;height:60px;align-items:flex-end}.bars i{display:block;width:24px;background:#CFCFCF}.bars i.k{background:#0A0A0A}
.env{position:relative;background:#fff;background-image:var(--fib);box-shadow:0 1px 1px rgba(0,0,0,.12),0 6px 10px -4px rgba(0,0,0,.14),0 22px 30px -18px rgba(0,0,0,.22);aspect-ratio:17/10;rotate:var(--r,-2deg)}
.env svg{position:absolute;inset:0;width:100%;height:100%}
.env .lbl{position:absolute;left:18px;bottom:14px;right:18px}
.env>.st{position:absolute;right:-8px;top:-16px}
.planner{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #E6E6E6;margin-top:14px}
.planner>div{border-left:1px solid #EDEDED;padding:12px 14px 14px;min-height:110px}
.planner .sub{margin-top:8px}
.planner .mo{display:flex;justify-content:space-between;font:400 10px 'Special Elite',monospace;color:#B0B0B0;letter-spacing:.1em;grid-column:1/-1;padding:6px 14px 0;border-left:0;min-height:0}
/* family wall */
.fam{display:grid;grid-template-columns:1fr 1.35fr 1fr;grid-template-areas:"ce aos cmo" "rm rm aio";gap:56px 44px;align-items:start}
.fam>*{min-width:0}.fam .a-ce{grid-area:ce}.fam .a-aos{grid-area:aos}.fam .a-cmo{grid-area:cmo}.fam .a-rm{grid-area:rm}.fam .a-aio{grid-area:aio}
.fam a.more{display:inline-block;margin-top:14px;font:600 14px 'Bricolage Grotesque',sans-serif;text-decoration:none;background:linear-gradient(var(--yel),var(--yel)) no-repeat 0 92%/100% .4em;color:#0A0A0A}
/* ledger strip (six steps) */
.strip{display:grid;grid-template-columns:repeat(6,1fr);border-top:2px solid #0A0A0A;border-bottom:1px solid #0A0A0A;counter-reset:s}
.strip li{list-style:none;padding:18px 16px 22px;border-left:1px solid #E6E6E6;counter-increment:s}
.strip li:first-child{border-left:0}
.strip li::before{content:counter(s);display:block;font:400 40px/1 'Reenie Beanie',cursive;color:var(--blue);margin-bottom:6px}
.strip h3{font:700 19px/1.05 'Bricolage Grotesque',sans-serif;letter-spacing:-.02em;font-variation-settings:"wdth" 85}
.strip p{font-size:14px;color:#3A3A3A;margin-top:8px;line-height:1.4}
.oneline{font:400 34px/1.05 'Reenie Beanie',cursive;color:var(--blue);max-width:30em;margin-top:30px;rotate:-.6deg}
/* trays (PipeTime) */
.trays{display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:28px}
.tray h3{font:700 22px/1 'Bricolage Grotesque',sans-serif;letter-spacing:-.02em}
.tray p{font-size:15px;color:#3A3A3A;margin-top:8px}
.tray.live{outline:3px solid var(--yel);outline-offset:6px}
/* PipeTime widget */
.pt{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:start}
.pt .row{margin-bottom:22px}
.pt .lab{font:400 12px 'Special Elite',monospace;letter-spacing:.07em;text-transform:uppercase;color:#6B6B6B;display:block;margin-bottom:8px}
.pt .wins{display:flex;flex-wrap:wrap;gap:8px}
.pt .wins button{font:600 16px 'Bricolage Grotesque',sans-serif;background:#fff;border:2px solid #0A0A0A;padding:8px 12px;cursor:pointer}
.pt .wins button[aria-pressed="true"]{background:var(--yel)}
.pt label.q{display:flex;gap:10px;align-items:center;font-size:15px;padding:6px 0;border-top:1px dashed #D0D0D0;cursor:pointer}
.pt label.q input{appearance:none;width:22px;height:22px;border:2px solid #0A0A0A;margin:0;display:grid;place-items:center;flex:none;cursor:pointer}
.pt label.q input:checked{background:var(--yel)}.pt label.q input:checked::after{content:"✓";font:400 26px/1 'Reenie Beanie',cursive;color:var(--blue);margin-top:-4px}
.pt input[type=range]{width:100%;accent-color:#0A0A0A}
.pt .out dl{display:grid;grid-template-columns:1fr auto;gap:10px 18px;align-items:baseline}
.pt .out dt{font:400 12px 'Special Elite',monospace;letter-spacing:.07em;text-transform:uppercase;color:#6B6B6B}
.pt .out dd{font:800 34px/1 'Bricolage Grotesque',sans-serif;letter-spacing:-.04em;text-align:right;font-variant-numeric:tabular-nums}
.pt .verdict{font:400 36px/1 'Reenie Beanie',cursive;margin-top:18px}
.pt .why{font-size:14px;color:#3A3A3A;margin-top:6px;min-height:2.8em}
/* approve slip */
.slip2{max-width:520px}.slip2 p{font-size:17px;margin-top:8px}
.slip2 .acts{display:flex;gap:10px;margin-top:14px}
.slip2 .acts button{font:600 15px 'Bricolage Grotesque',sans-serif;border:2px solid #0A0A0A;background:#fff;padding:7px 14px;cursor:pointer}
.slip2 .acts button.ok{background:#0A0A0A;color:#fff}
.slip2 .res{font:400 32px/1 'Reenie Beanie',cursive;color:var(--blue);margin-top:10px;min-height:1em}
/* picker */
.pick{display:grid;grid-template-columns:1fr 1fr 1fr;gap:34px;align-items:start}
.pick fieldset{border:0}
.pick legend{font:400 12px 'Special Elite',monospace;letter-spacing:.07em;text-transform:uppercase;color:#6B6B6B;margin-bottom:10px}
.pick label{display:flex;gap:12px;align-items:center;padding:11px 0;border-top:1px dashed #CFCFCF;font:600 18px 'Bricolage Grotesque',sans-serif;cursor:pointer}
.pick input{appearance:none;width:24px;height:24px;border:2px solid #0A0A0A;margin:0;display:grid;place-items:center;flex:none;cursor:pointer}
.pick input:checked{background:var(--yel)}.pick input:checked::after{content:"✓";font:400 28px/1 'Reenie Beanie',cursive;color:var(--blue);margin-top:-4px}
.pick .rec{background:#FFF27A;background-image:var(--fib);padding:26px 22px;box-shadow:0 6px 10px -4px rgba(0,0,0,.14);rotate:1.5deg}
.pick .rec p{font:400 30px/1.05 'Reenie Beanie',cursive;color:var(--blue)}
.pick .rec p.nx{font:500 15px/1.45 'Bricolage Grotesque',sans-serif;color:var(--ink);margin-top:14px}.pick .rec p.nx .st{margin:0 4px}.pick .rec p.nx a{margin-top:0}
.pick .rec .st{margin:12px 0 4px}
.pick .rec a{display:inline-block;margin-top:14px}
.valband{border-top:1px solid #0A0A0A;border-bottom:1px solid #0A0A0A;padding:54px 0;text-align:left}
.valband p{font:700 clamp(28px,3vw,44px)/1.05 'Bricolage Grotesque',sans-serif;letter-spacing:-.03em;font-variation-settings:"wdth" 80;max-width:22em}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:40px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:34px}
.areas{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:2px solid #0A0A0A}
.areas div{padding:18px 16px;border-left:1px solid #E6E6E6}.areas div:first-child{border-left:0}
.areas b{display:block;font:800 52px/1 'Bricolage Grotesque',sans-serif;letter-spacing:-.04em}
.areas span{font-size:15px;color:#3A3A3A}
.swatch{display:inline-block;width:12px;height:12px;border:1px solid #0A0A0A;vertical-align:-1px;margin-right:6px}
.fnx{font:400 12px 'Special Elite',monospace;color:#6B6B6B;margin-top:14px;letter-spacing:.03em}
.check{display:inline-block;font:400 12px 'Special Elite',monospace;color:var(--red);border:1.5px solid var(--red);padding:2px 6px;rotate:-2deg;letter-spacing:.06em}
@media(max-width:860px){
 .fam{grid-template-columns:minmax(0,1fr);grid-template-areas:"aos" "cmo" "ce" "aio" "rm";gap:44px}
 .strip{grid-template-columns:1fr 1fr}.strip li:nth-child(odd){border-left:0}.strip li{border-top:1px solid #E6E6E6}
 .trays,.pt,.pick,.grid2,.grid3{grid-template-columns:1fr}
 .areas{grid-template-columns:1fr 1fr}.areas div:nth-child(3){border-left:0}
 .planner{grid-template-columns:1fr 1fr}.planner>div:nth-child(odd){border-left:0}
 .pp>.st{right:-4px}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
/* founder portraits: taped prints */
.ph.ph-img{display:block;padding:0;background:#fff;gap:0}
.ph.ph-img img{display:block;width:100%;height:100%;aspect-ratio:1;object-fit:cover;filter:grayscale(1)}
