/* Corbie Creative: one shared stylesheet for every page. Each class name has one job. */
/* Layout concept: dark tenebrism ground, left-aligned editorial splits, one lit moment per section.
   Every color below is one of the 56 Corbie palette values (or an opacity of one). */
:root{
  --ink:#0B0D12; --plum:#290920; --ver-s2:#0B1F21; --ver-s1:#0A3130; --ver:#0A433F; --ver-t2:#7D978E; --ver-t3:#B6C1B6;
  --woad:#1B2A6B; --woad-s1:#16204D; --woad-t2:#868BA5; --orchil:#4A1D63; --orchil-s1:#351848; --orchil-s2:#20122D; --orchil-t2:#9D84A1; --orchil-t3:#C6B8BF;
  --tyrian:#66023C; --tyrian-s1:#48062E; --tyrian-t3:#CDB1B6; --madder:#A61E5C; --madder-t1:#B9517D; --madder-t2:#CB849D; --madder-t3:#DDB8BE;
  --weld:#E0B93C; --weld-t1:#E4C664; --weld-t3:#ECDFB5; --ochre:#CC7722; --gesso:#F0EBDE; --n2:#2C2D2F; --n3:#4C4C4C; --n5:#8E8C87; --n6:#AFACA4; --n7:#CFCBC1;
  --surface:#10131a; --line:rgba(240,235,222,.14); --muted:#AFACA4;
  --display:"Bricolage Grotesque","Trebuchet MS",system-ui,sans-serif; --body:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:64px;
  --max:1180px; color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--gesso);font:400 16px/1.55 var(--body);padding-inline:0;overflow-x:hidden;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(520px circle at var(--mx,70%) var(--my,10%),rgba(224,185,60,.07),transparent 70%),
             radial-gradient(900px circle at 8% 0%,rgba(10,67,63,.35),transparent 60%),
             radial-gradient(800px circle at 100% 40%,rgba(41,9,32,.8),transparent 65%)}
main,header.site,footer.site,.wrap{position:relative;z-index:1}
.wrap{max-width:var(--max);margin-inline:auto}
a{color:var(--weld-t1);text-underline-offset:3px}
a:hover{color:var(--weld)}
:focus-visible{outline:2px solid var(--weld);outline-offset:2px}
h1,h2,h3,h4{font-family:var(--display);font-weight:600;line-height:1.1;letter-spacing:-.02em;margin:0;text-wrap:balance}
h1{font-size:clamp(2.4rem,6.2vw,4.4rem)}
h2{font-size:clamp(1.8rem,4vw,3rem);letter-spacing:-.015em}
h3{font-size:clamp(1.25rem,2.2vw,1.6rem);font-weight:500;letter-spacing:-.01em}
p{margin:0}
.lede{font-size:clamp(1.05rem,1.6vw,1.25rem);color:var(--n7);max-width:60ch}
.muted{color:var(--muted)}
.eyebrow{font:500 12px/1 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--madder-t2)}
.shim{background:linear-gradient(100deg,var(--ver-t2) 0%,var(--orchil-t2) 30%,var(--madder-t2) 55%,var(--weld-t1) 80%,var(--ver-t2) 100%);background-size:240% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shim 7s ease-in-out infinite alternate}
@keyframes shim{to{background-position:100% 0}}
@keyframes rise{from{opacity:0;transform:translateY(14px)}}
.rise{animation:rise .7s cubic-bezier(.2,.7,.2,1) both}.d1{animation-delay:.08s}.d2{animation-delay:.16s}.d3{animation-delay:.24s}
@media (prefers-reduced-motion:reduce){.shim,.rise{animation:none}.shim{background-position:30% 0}html{scroll-behavior:auto}*{transition:none!important}}

/* header */
header.site{padding-inline:16px;display:flex;align-items:center;justify-content:space-between;gap:var(--s5);max-width:var(--max);margin:0 auto;padding-block:20px;flex-wrap:wrap}
.logo{display:flex;align-items:baseline;gap:10px;text-decoration:none;color:var(--gesso)}
.logo b{font:600 30px/1 var(--display);letter-spacing:-.03em}
.logo i{font:300 13px/1 var(--body);letter-spacing:.32em;text-transform:uppercase;font-style:normal;color:var(--n6)}
nav.main{display:flex;gap:var(--s1) var(--s5);flex-wrap:wrap}
nav.main a{position:relative;display:block;padding:10px 2px;color:var(--n7);text-decoration:none;font-weight:300;min-height:44px}
nav.main a small{display:block;font-size:11px;color:var(--n5);letter-spacing:.04em;font-weight:400;margin-top:1px}
nav.main a:hover,nav.main a[aria-current]{color:var(--weld-t1)}
nav.main a[aria-current]::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:2px;background:var(--weld)}
nav.main a.off{opacity:.55}
.menu-btn{display:none;background:none;color:var(--gesso);border:1px solid var(--line);min-height:44px;padding:0 16px;font:500 14px var(--body);border-radius:2px}
@media (max-width:860px){.menu-btn{display:block}nav.main{display:none;width:100%;flex-direction:column}nav.main.open{display:flex}}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 24px;border-radius:2px;font:500 15px/1 var(--body);letter-spacing:.01em;text-decoration:none;border:1px solid transparent;cursor:pointer;position:relative;overflow:visible;transition:background .2s,color .2s,transform .2s}
.btn.pri{background:var(--weld);color:var(--ink)}.btn.pri:hover{background:var(--weld-t1);color:var(--ink);transform:translateY(-1px)}
.btn.sec{background:transparent;color:var(--gesso);border-color:rgba(240,235,222,.4)}.btn.sec:hover{border-color:var(--weld);color:var(--weld-t1)}
.spark{position:fixed;width:6px;height:6px;pointer-events:none;z-index:99;background:var(--weld);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
.cta-fixed{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));z-index:40;box-shadow:0 0 0 1px rgba(11,13,18,.9)}
@media (max-width:600px){.cta-fixed{left:16px;right:16px}}

/* sections */
section.blk{padding-inline:16px;max-width:var(--max);margin-inline:auto;padding-block:var(--s8)}
.split{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:var(--s5) var(--s7)}
@media (max-width:860px){.split{grid-template-columns:minmax(0,1fr)}}
.split .head{display:flex;flex-direction:column;gap:var(--s3);align-content:start;position:sticky;top:24px;align-self:start}
@media (max-width:860px){.split .head{position:static}}
.steps{height:16px;padding-inline:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='16'%3E%3Cpath d='M0 14H12V8H24V2H36V8H48' fill='none' stroke='%23E0B93C' stroke-opacity='.55' stroke-width='1.5'/%3E%3C/svg%3E") repeat-x;max-width:var(--max);margin-inline:auto}
.hero{padding-inline:16px;padding-block:var(--s7) var(--s8);display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:var(--s7);align-items:center;max-width:var(--max);margin-inline:auto}
.hero.solo{grid-template-columns:minmax(0,1fr)}
.hero .copy{display:flex;flex-direction:column;gap:var(--s5)}
.hero .row{display:flex;gap:var(--s3);flex-wrap:wrap}
@media (max-width:860px){.hero{grid-template-columns:minmax(0,1fr)}}
.wink{font-style:italic;color:var(--ver-t2);font-size:15px}

/* cards */
.grid{display:grid;gap:var(--s5);grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.card{position:relative;background:radial-gradient(260px circle at var(--cx,50%) var(--cy,-20%),rgba(224,185,60,.11),transparent 70%),var(--surface);border:1px solid var(--line);padding:var(--s5);display:flex;flex-direction:column;gap:var(--s3);min-width:0;transition:border-color .25s,transform .25s}
.card:hover{border-color:rgba(224,185,60,.5)}
.card.inv{background:linear-gradient(135deg,var(--ver-s1),var(--orchil-s2) 70%);border-color:rgba(125,151,142,.4)}
.card h3{font-size:1.25rem}
.chip{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;border-radius:2px;font:500 12px/1 var(--body);letter-spacing:.03em;background:var(--ver-s1);color:var(--ver-t3);border:1px solid rgba(125,151,142,.35);width:fit-content}
.chip.m{background:var(--tyrian-s1);color:var(--madder-t3);border-color:rgba(203,132,157,.35)}
.chip.w{background:rgba(224,185,60,.12);color:var(--weld-t3);border-color:rgba(224,185,60,.4)}
.chip.o{background:var(--orchil-s2);color:var(--orchil-t3);border-color:rgba(157,132,161,.4)}
.tag-row{display:flex;gap:var(--s2);flex-wrap:wrap}
button.chip,button.pick{cursor:pointer;font-family:var(--body)}
button.chip[aria-pressed=true]{background:var(--weld);color:var(--ink);border-color:var(--weld)}
.draft{border:1px dashed rgba(224,185,60,.55);color:var(--weld-t3);padding:2px 8px;font:500 11px/1.6 var(--body);letter-spacing:.06em;text-transform:uppercase;width:fit-content}
ul.tick{list-style:none;margin:0;padding:0;display:grid;gap:var(--s2)}
ul.tick li{padding-left:22px;position:relative}
ul.tick li::before{content:"";position:absolute;left:0;top:.6em;width:10px;height:6px;border-left:2px solid var(--weld);border-bottom:2px solid var(--weld);transform:rotate(-45deg) scale(.8)}
ul.x li::before{border:0;width:10px;height:2px;background:var(--madder-t1);transform:none;top:.8em}

/* details offers */
details.offer{border-top:1px solid var(--line);padding-block:var(--s4)}
details.offer:last-of-type{border-bottom:1px solid var(--line)}
details.offer summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:minmax(0,1fr) 32px;gap:var(--s4);align-items:center;min-height:56px}
details.offer summary::-webkit-details-marker{display:none}
details.offer summary h3{font-size:clamp(1.3rem,2.6vw,1.9rem)}
details.offer summary span.for{display:block;color:var(--muted);font-size:15px;margin-top:4px}
details.offer summary::after{content:"+";font:300 28px/1 var(--display);color:var(--weld);text-align:center;transition:transform .25s}
details.offer[open] summary::after{transform:rotate(45deg)}
details.offer.hit{background:linear-gradient(90deg,rgba(224,185,60,.1),transparent 60%)}
.offer-body{display:grid;gap:var(--s4);padding-top:var(--s4);max-width:70ch}

/* picker */
.picks{display:grid;gap:var(--s2)}
button.pick{background:var(--surface);color:var(--gesso);border:1px solid var(--line);text-align:left;padding:14px 16px;min-height:52px;font-size:15px;border-radius:2px;transition:border-color .2s,background .2s}
button.pick:hover{border-color:rgba(224,185,60,.55)}
button.pick[aria-pressed=true]{background:rgba(224,185,60,.12);border-color:var(--weld)}
.answer{border-left:2px solid var(--weld);padding:var(--s3) var(--s4);background:rgba(224,185,60,.06);min-height:76px}

/* slider */
.range{width:100%;accent-color:var(--weld);height:32px}
.range-labels{display:flex;justify-content:space-between;font-size:13px;color:var(--muted);gap:8px}

/* counters */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.stat{padding:var(--s5);border-left:1px solid var(--line);display:flex;flex-direction:column;gap:var(--s2)}
.stat:first-child{border-left:0}
.stat b{font:600 clamp(2rem,4.5vw,3.2rem)/1 var(--display);letter-spacing:-.03em}
.stat span{color:var(--muted);font-size:14px}
@media (max-width:700px){.stat{border-left:0;border-top:1px solid var(--line)}.stat:first-child{border-top:0}}

/* dialog */
dialog{background:var(--ink);color:var(--gesso);border:1px solid rgba(224,185,60,.5);max-width:min(760px,calc(100vw - 32px));width:100%;padding:0;max-height:88vh}
dialog::backdrop{background:rgba(11,13,18,.82)}
dialog .in{padding:var(--s6);display:grid;gap:var(--s5)}
dialog .x{justify-self:end;background:none;border:1px solid var(--line);color:var(--gesso);min-height:44px;padding:0 16px;cursor:pointer;font:500 14px var(--body)}
dialog h3{font-size:clamp(1.5rem,3vw,2.2rem)}
dialog h4{font:500 12px/1 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--madder-t2);margin-bottom:8px}

/* feed + misc */
.feed{display:grid;gap:var(--s4)}
.entry{display:grid;grid-template-columns:96px minmax(0,1fr);gap:var(--s4);padding:var(--s5);border:1px solid var(--line);background:var(--surface)}
.entry time{font:500 12px/1.5 var(--body);color:var(--muted);letter-spacing:.04em}
@media (max-width:560px){.entry{grid-template-columns:minmax(0,1fr)}}
.speaker{font-weight:500}.speaker.callie{color:var(--weld-t1)}.speaker.claude{color:var(--ver-t3)}.speaker.chatgpt{color:var(--madder-t2)}
.banner{background:linear-gradient(100deg,var(--woad),var(--tyrian) 60%,var(--madder));padding:var(--s6);display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--s6);align-items:center}
.banner img{width:140px;height:140px;border-radius:2px;display:block}
@media (max-width:640px){.banner{grid-template-columns:minmax(0,1fr)}}
.logmono{font:400 14px/1.7 "IBM Plex Mono",ui-monospace,Menlo,monospace;color:var(--ver-t3);white-space:pre-wrap}
.log{background:var(--ver-s2);border:1px solid rgba(125,151,142,.35);padding:var(--s5);min-height:260px}
.log.cap{background:linear-gradient(160deg,var(--tyrian-s1),var(--orchil-s2));border-color:rgba(203,132,157,.4)}
.log.cap p{font-family:var(--body);color:var(--gesso);line-height:1.7}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:2px;flex-wrap:wrap}
.seg button{background:none;color:var(--n7);border:0;min-height:44px;padding:0 18px;font:500 14px var(--body);cursor:pointer}
.seg button[aria-pressed=true]{background:var(--weld);color:var(--ink)}
.flow{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:0;counter-reset:f}
.node{border:1px solid var(--line);padding:var(--s4);background:var(--surface);cursor:pointer;text-align:left;color:var(--gesso);font:400 14px/1.4 var(--body);min-height:88px;display:flex;flex-direction:column;gap:6px;transition:background .3s,border-color .3s}
.node b{font:600 15px var(--display)}
.node.on{background:linear-gradient(160deg,var(--ver-s1),var(--orchil-s2));border-color:var(--weld)}
.node.done{border-color:rgba(125,151,142,.55)}
.time{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(260px,1fr);gap:var(--s5);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:var(--s4)}
.time>.card{scroll-snap-align:start}
.profile{display:grid;grid-template-columns:minmax(0,220px) minmax(0,1fr);gap:var(--s6);background:var(--gesso);color:var(--ink);padding:var(--s6);position:relative}
.profile h3,.profile h4{color:var(--ink)}
.profile .chip{background:var(--orchil-t3);color:var(--orchil-s2);border-color:transparent}
.profile .chip.g{background:var(--ver-t3);color:var(--ver-s2)}
.profile a{color:var(--orchil)}
.profile .f{position:relative;padding-block:2px}
.profile .f::before{content:attr(data-f);display:none;position:absolute;right:0;top:-10px;background:var(--orchil);color:var(--gesso);font:500 11px/1 var(--body);letter-spacing:.06em;text-transform:uppercase;padding:4px 8px}
.profile.labels .f{outline:1px dashed var(--orchil)}.profile.labels .f::before{display:block}
.profile img{width:100%;max-width:220px;height:auto;display:block;border-radius:2px}
.profile .cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:var(--s5)}
.profile p,.profile li{color:#2C2D2F}
@media (max-width:700px){.profile{grid-template-columns:minmax(0,1fr)}}
form.share{display:grid;gap:var(--s4);max-width:560px}
label{display:grid;gap:6px;font-weight:500;font-size:14px}
input,textarea,select{background:var(--surface);color:var(--gesso);border:1px solid rgba(240,235,222,.4);border-radius:2px;min-height:48px;padding:12px;font:400 16px var(--body);width:100%}
textarea{min-height:140px}
footer.site{padding-inline:16px;max-width:var(--max);margin:var(--s8) auto 0;padding-block:var(--s6) 96px;border-top:1px solid var(--line);display:grid;gap:var(--s5)}
footer.site .cols{display:flex;gap:var(--s5) var(--s7);flex-wrap:wrap;justify-content:space-between}
footer.site nav{display:flex;gap:var(--s4);flex-wrap:wrap}
footer.site nav a{color:var(--n7);text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.note{font-size:13px;color:var(--muted);border-left:2px solid rgba(224,185,60,.5);padding-left:var(--s3)}
/* ===== v2 layer: designer impact. Every color is a Corbie palette value. ===== */
:root{--iri:linear-gradient(110deg,#0A433F 0%,#1B2A6B 34%,#4A1D63 62%,#A61E5C 100%);
--ver-t1:#436D67;--orchil-t1:#745182;--woad-s2:#101730;--tyrian-s2:#290920;--lincoln:#195905;--ochre-l:#CC7722}
.js .rv{opacity:0;transform:translateY(26px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.js .rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.08s}.rv.d2{transition-delay:.16s}.rv.d3{transition-delay:.24s}
/* grain */
.grain::after,body::after{content:"";position:fixed;inset:-50%;pointer-events:none;z-index:60;opacity:.07;mix-blend-mode:overlay;
 background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)'/%3E%3C/svg%3E");animation:grainmv 1.4s steps(6) infinite}
@keyframes grainmv{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-2%,-1%)}80%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}
/* buttons: lit, not flat. Verdigris to Madder oil-slick fill, Gesso text, a single Weld edge-glint */
.btn.pri{background:var(--iri);background-size:260% 100%;background-position:0 0;color:var(--gesso);border:1px solid rgba(240,235,222,.28);box-shadow:inset 0 1px 0 rgba(240,235,222,.25),0 10px 30px -12px rgba(166,30,92,.7);transition:background-position .6s cubic-bezier(.2,.7,.2,1),transform .2s,box-shadow .3s;overflow:hidden;isolation:isolate}
.btn.pri::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(105deg,transparent 35%,rgba(224,185,60,.55) 50%,transparent 65%);transform:translateX(-120%);transition:transform .7s}
.btn.pri:hover{background:var(--iri);background-size:260% 100%;background-position:100% 0;color:var(--gesso);transform:translateY(-2px);box-shadow:inset 0 1px 0 rgba(240,235,222,.35),0 16px 36px -10px rgba(166,30,92,.85)}
.btn.pri:hover::before{transform:translateX(120%)}
.btn.sec{background:rgba(11,13,18,.4);backdrop-filter:blur(6px)}
.btn.sec:hover{border-color:var(--madder-t2);color:var(--gesso);background:rgba(166,30,92,.18)}
.btn.arrow::after{content:"\2192";transition:transform .25s}.btn.arrow:hover::after{transform:translateX(4px)}
.spark{background:var(--weld-t1)}
/* animated gradient border */
.gb{position:relative;background:var(--ink);isolation:isolate}
.gb::before{content:"";position:absolute;inset:-1px;z-index:-1;background:conic-gradient(from var(--a,0deg),#0A433F,#1B2A6B,#4A1D63,#A61E5C,#E0B93C,#0A433F);animation:spin 9s linear infinite;border-radius:inherit}
.gb::after{content:"";position:absolute;inset:0;z-index:-1;background:inherit}
@property --a{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes spin{to{--a:360deg}}
/* stage hero */
.stage{position:relative;min-height:min(94vh,860px);display:grid;align-items:end;overflow:hidden;isolation:isolate;padding:0 16px}
.stage .bg{position:absolute;inset:-6% 0;z-index:-3;background:radial-gradient(60% 55% at 72% 38%,rgba(27,42,107,.7),transparent 70%),radial-gradient(50% 50% at 18% 70%,rgba(10,67,63,.75),transparent 70%),radial-gradient(40% 40% at 90% 90%,rgba(102,2,60,.7),transparent 70%),var(--ink);background-size:cover;background-position:center}
.stage .bg.img{background-image:var(--img);background-color:transparent;z-index:-2}
.stage .vig{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(11,13,18,.35),rgba(11,13,18,0) 30%,rgba(11,13,18,.92) 100%),radial-gradient(70% 60% at 50% 40%,transparent 40%,rgba(11,13,18,.6))}
.stage .in{max-width:var(--max);margin:0 auto;width:100%;padding-block:120px 56px;display:grid;gap:var(--s5)}
.stage h1{font-size:clamp(2.6rem,7.4vw,6rem);font-weight:600;max-width:15ch}
.stage .row{display:flex;gap:12px;flex-wrap:wrap}
.crow{position:absolute;z-index:-2;right:-4%;top:50%;width:min(78vw,860px);aspect-ratio:600/438.65;transform:translateY(-62%);
 -webkit-mask:url(logo-lockup.svg) center/contain no-repeat;mask:url(logo-lockup.svg) center/contain no-repeat;
 background:linear-gradient(115deg,#0A433F 0%,#1B2A6B 30%,#4A1D63 52%,#A61E5C 74%,#0A433F 100%);background-size:240% 100%;animation:iri 12s ease-in-out infinite alternate;opacity:.95}
.crow::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 40%,rgba(125,151,142,.55) 47%,rgba(157,132,161,.7) 52%,transparent 60%);background-size:260% 100%;animation:catch 9s ease-in-out infinite;mix-blend-mode:screen}
@keyframes iri{to{background-position:100% 0}}
@keyframes catch{0%,18%{background-position:130% 0;opacity:0}30%{opacity:1}55%{background-position:-30% 0;opacity:1}70%,100%{background-position:-30% 0;opacity:0}}
@media (max-width:860px){.crow{width:120vw;right:-30%;top:34%;opacity:.7}.stage .in{padding-top:200px}}
.scroll-cue{font:500 12px var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--n6)}
/* marquee */
.marquee{overflow:hidden;border-block:1px solid var(--line);background:var(--ink);padding-block:18px;mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee .tr{display:flex;gap:48px;width:max-content;animation:mq 38s linear infinite}
.marquee:hover .tr{animation-play-state:paused}
.marquee span{font:300 clamp(1.4rem,3vw,2.2rem)/1 var(--display);letter-spacing:-.01em;white-space:nowrap;color:var(--n6);display:inline-flex;align-items:center;gap:48px}
.marquee span::after{content:"";width:14px;height:14px;background:var(--weld);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}
.marquee span:nth-child(3n+1){color:var(--ver-t3)}.marquee span:nth-child(3n+2){color:var(--orchil-t3)}.marquee span:nth-child(3n){color:var(--madder-t3)}
@keyframes mq{to{transform:translateX(-50%)}}
/* color bands (Shopify Editions style full-bleed segments) */
.band{position:relative;overflow:hidden;isolation:isolate}
.band>.bgslot{position:absolute;inset:-8% 0;z-index:-2;background-size:cover;background-position:center}
.band.v{background:linear-gradient(160deg,var(--ver-s2),var(--ver-s1))}
.band.o{background:linear-gradient(160deg,var(--orchil-s2),var(--orchil-s1))}
.band.t{background:linear-gradient(160deg,var(--tyrian-s2),var(--tyrian-s1))}
.band.w{background:linear-gradient(160deg,var(--woad-s2),var(--woad-s1))}
.band.g{background:var(--gesso);color:var(--ink)}
.band.g .eyebrow{color:var(--madder)}.band.g .muted,.band.g p{color:#2C2D2F}.band.g h2,.band.g h3{color:var(--ink)}
.band.g .card{background:#fff8;border-color:rgba(11,13,18,.18)}.band.g .card h3{color:var(--ink)}.band.g .card p{color:#2C2D2F}
.band.g a:not(.btn){color:var(--orchil)}
.band.g .btn.sec{color:var(--ink);border-color:rgba(11,13,18,.5);background:transparent}
.band.g .btn.sec:hover{color:var(--ink);background:rgba(166,30,92,.12)}
/* sticky stacking panels */
.stack{position:relative}
.stack .panel{position:sticky;top:0;min-height:78vh;display:grid;align-items:center}
@media (max-width:860px){.stack .panel{position:static;min-height:0}}
.panel .wrap{padding:var(--s8) 16px;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--s7);align-items:center}
.panel .big{font:600 clamp(5rem,16vw,12rem)/.8 var(--display);letter-spacing:-.06em;background:var(--iri);-webkit-background-clip:text;background-clip:text;color:transparent;opacity:.9}
.band.g .panel .big{background:linear-gradient(110deg,#0A433F,#4A1D63,#A61E5C);-webkit-background-clip:text;background-clip:text}
@media (max-width:860px){.panel .wrap{grid-template-columns:minmax(0,1fr)}}
/* bento */
.bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px}
.bento>*{grid-column:span 4;min-height:220px}.bento .w6{grid-column:span 6}.bento .w8{grid-column:span 8}.bento .w12{grid-column:span 12}
@media (max-width:860px){.bento>*,.bento .w6,.bento .w8{grid-column:span 12}}
.tile{position:relative;overflow:hidden;padding:var(--s5);display:flex;flex-direction:column;justify-content:flex-end;gap:10px;border:1px solid var(--line);background:var(--surface);transition:transform .35s cubic-bezier(.2,.7,.2,1),border-color .3s}
.tile:hover{border-color:rgba(203,132,157,.6)}
.tile .art{position:absolute;inset:0;z-index:0;opacity:.9}
.tile>*:not(.art){position:relative;z-index:1}
.tile.a .art{background:radial-gradient(70% 90% at 80% 10%,#1B2A6B,transparent 70%),linear-gradient(160deg,#0B1F21,#0A433F)}
.tile.b .art{background:radial-gradient(70% 90% at 20% 0%,#A61E5C,transparent 70%),linear-gradient(160deg,#290920,#4A1D63)}
.tile.c .art{background:radial-gradient(60% 80% at 90% 100%,#CC7722,transparent 70%),linear-gradient(160deg,#48062E,#66023C)}
.tile.d .art{background:radial-gradient(70% 90% at 0% 100%,#195905,transparent 70%),linear-gradient(160deg,#101730,#1B2A6B)}
.tile .art::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 30%,rgba(11,13,18,.82))}
.tile h3{font-size:clamp(1.3rem,2.4vw,1.9rem)}
.tile .ghost{position:absolute;right:-6%;top:-10%;width:60%;aspect-ratio:600/438.65;-webkit-mask:url(logo-lockup.svg) center/contain no-repeat;mask:url(logo-lockup.svg) center/contain no-repeat;background:rgba(240,235,222,.12);z-index:0}
/* tilt */
.tilt{transform-style:preserve-3d;will-change:transform}
/* image slot: shows image if present, else palette art */
.slot{position:relative;aspect-ratio:var(--ar,4/3);overflow:hidden;background:var(--surface)}
.slot .art{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.slot .lbl{position:absolute;left:12px;bottom:12px;font:500 11px var(--body);letter-spacing:.1em;text-transform:uppercase;border:1px dashed rgba(224,185,60,.7);color:var(--weld-t3);padding:3px 8px;background:rgba(11,13,18,.6)}
/* case grid (Cecilia Kim style: image-forward, quiet text) */
.cs-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:56px 32px}
.cs{display:grid;gap:16px;text-decoration:none;color:var(--gesso)}
.cs.feat{grid-column:1/-1}.cs.feat .slot{--ar:21/9}
.cs:hover .slot .art{transform:scale(1.05)}
.cs .ctx{font:500 12px var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--madder-t2)}
.cs h3{font:500 clamp(1.4rem,2.6vw,2.2rem)/1.15 var(--display)}
.cs .view{font:500 14px var(--body);color:var(--weld-t1);display:inline-flex;gap:8px;align-items:center;width:fit-content;border-bottom:1px solid transparent}
.cs:hover .view{border-color:var(--weld-t1)}
@media (max-width:760px){.cs-grid{grid-template-columns:minmax(0,1fr)}.cs.feat .slot{--ar:4/3}}
/* social */
.soc{display:flex;gap:10px;flex-wrap:wrap}
.soc a{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border:1px solid var(--line);color:var(--n7);text-decoration:none;font:500 14px var(--body);transition:border-color .2s,background .2s,color .2s}
.soc a:hover{border-color:var(--madder-t2);background:rgba(166,30,92,.15);color:var(--gesso)}
.soc svg{width:18px;height:18px;fill:currentColor}
.soc a.soon::after{content:"soon";font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--weld-t3);border:1px dashed rgba(224,185,60,.6);padding:1px 5px}
/* progress */
#prog{position:fixed;left:0;top:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:var(--iri);z-index:80}
header.site{position:sticky;top:0;z-index:50;background:linear-gradient(180deg,rgba(11,13,18,.92),rgba(11,13,18,.6));backdrop-filter:blur(10px);max-width:none;padding-inline:max(16px,calc((100vw - var(--max))/2))}
header.site .logo svg{height:34px;width:auto}
.logo .lm{width:46px;height:34px;display:block;-webkit-mask:url(logo-lockup.svg) 0 0/auto 190% no-repeat;mask:url(logo-lockup.svg) 0 0/auto 190% no-repeat;background:var(--gesso)}
.cta-fixed{box-shadow:0 14px 40px -10px rgba(166,30,92,.8)}
/* brand page */
.bg-layout{display:grid;grid-template-columns:200px minmax(0,1fr);gap:var(--s7);max-width:var(--max);margin:0 auto;padding:0 16px}
.bg-nav{position:sticky;top:96px;align-self:start;display:grid;gap:2px;padding-block:var(--s6)}
.bg-nav a{color:var(--n6);text-decoration:none;padding:10px 12px;border-left:2px solid var(--line);font-size:14px;min-height:44px;display:flex;align-items:center}
.bg-nav a.on,.bg-nav a:hover{color:var(--gesso);border-color:var(--madder-t1);background:linear-gradient(90deg,rgba(166,30,92,.18),transparent)}
@media (max-width:860px){.bg-layout{grid-template-columns:minmax(0,1fr)}.bg-nav{position:static;grid-auto-flow:column;overflow-x:auto;padding-block:8px}.bg-nav a{white-space:nowrap;border-left:0;border-bottom:2px solid var(--line)}}
.bsec{padding-block:var(--s8);border-top:1px solid var(--line);display:grid;gap:var(--s6);scroll-margin-top:90px}
.bsec:first-child{border-top:0}
.lg-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:16px}
.lg{display:grid;gap:10px;align-content:start}
.lg .pad{aspect-ratio:3/2;display:grid;place-items:center;position:relative;border:1px solid var(--line);overflow:hidden}
.lg .m{width:62%;aspect-ratio:600/438.65;-webkit-mask:url(logo-lockup.svg) center/contain no-repeat;mask:url(logo-lockup.svg) center/contain no-repeat;transition:transform .4s}
.lg:hover .m{transform:scale(1.06)}
.lg small{color:var(--muted);font-size:13px}
.clear{position:relative;display:grid;place-items:center;padding:calc(var(--cs,48px));background:repeating-linear-gradient(45deg,rgba(166,30,92,.18) 0 6px,transparent 6px 12px);border:1px dashed var(--madder-t1);width:fit-content;max-width:100%;transition:padding .2s}
.clear .m{width:280px;max-width:60vw;aspect-ratio:600/438.65;-webkit-mask:url(logo-lockup.svg) center/contain no-repeat;mask:url(logo-lockup.svg) center/contain no-repeat;background:var(--gesso)}
.fam{display:grid;gap:12px}
.fam h4{font:500 15px var(--display);display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.fam h4 span{font:400 12px var(--body);color:var(--muted)}
.ramp{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0;height:84px}
.sw{border:0;cursor:pointer;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;padding:8px;font:500 11px/1.3 "IBM Plex Mono",monospace;text-align:left;transition:transform .25s,flex .25s;position:relative}
.sw:hover,.sw:focus-visible{transform:translateY(-6px);z-index:2;box-shadow:0 12px 24px -8px rgba(0,0,0,.7)}
.sw .cp{opacity:0;font-size:10px}.sw:hover .cp,.sw:focus-visible .cp{opacity:1}
.toast{position:fixed;left:50%;bottom:90px;transform:translate(-50%,20px);background:var(--gesso);color:var(--ink);padding:12px 18px;font:500 14px var(--body);opacity:0;pointer-events:none;transition:.3s;z-index:90}
.toast.on{opacity:1;transform:translate(-50%,0)}
.specimen{display:grid;gap:12px}
.specimen .big{font-size:var(--sz,64px);line-height:1.1;font-family:var(--display);font-weight:var(--wt,600);letter-spacing:-.02em;overflow-wrap:anywhere}
.traits{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:16px}
.flip{perspective:900px;min-height:230px;cursor:pointer;background:none;border:0;padding:0;text-align:left;color:inherit;font:inherit}
.flip .f{position:relative;width:100%;height:100%;min-height:230px;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.flip[aria-pressed=true] .f{transform:rotateY(180deg)}
.flip .s{position:absolute;inset:0;backface-visibility:hidden;padding:24px;display:flex;flex-direction:column;gap:10px;border:1px solid var(--line)}
.flip .s.fr{background:linear-gradient(160deg,var(--ver-s1),var(--orchil-s2))}
.flip .s.bk{transform:rotateY(180deg);background:var(--gesso);color:var(--ink)}
.flip .s.bk p{color:#2C2D2F;font-size:14px}.flip .s.bk b{color:var(--madder)}
.dodont{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px}
.dodont .no,.dodont .yes{padding:var(--s5);border:1px solid var(--line);display:grid;gap:10px}
.dodont .yes{border-color:rgba(125,151,142,.6)}.dodont .no{border-color:rgba(203,132,157,.55)}
.mo-demo{position:relative;min-height:260px;padding:44px 24px;display:grid;place-items:center;background:var(--ink);border:1px solid var(--line);overflow:hidden}
.mo-demo .crow{position:relative;inset:auto;right:auto;top:auto;transform:none;width:min(420px,100%);z-index:0;opacity:1}
.mo-demo.off .crow{animation:none}.mo-demo.off .crow::after{display:none}
/* case template */
.meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:24px;border-block:1px solid var(--line);padding-block:24px}
.meta b{display:block;font:500 12px var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--madder-t2);margin-bottom:6px}
.cs-sec{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,8fr);gap:var(--s6) var(--s7);padding-block:var(--s7);border-top:1px solid var(--line)}
@media (max-width:760px){.cs-sec{grid-template-columns:minmax(0,1fr)}}
.cs-sec p{font-size:1.1rem;max-width:62ch;color:var(--n7)}
.pull{font:500 clamp(1.6rem,3.6vw,2.8rem)/1.2 var(--display);letter-spacing:-.02em;max-width:24ch}
@media (prefers-reduced-motion:reduce){.crow,.crow::after,.marquee .tr,.gb::before,body::after{animation:none!important}.js .rv{opacity:1;transform:none}.crow{background-position:30% 0}.crow::after{opacity:.6;background-position:20% 0}}

.hero:not(.stage){position:relative;isolation:isolate}
.hero:not(.stage)::before{content:"";position:absolute;z-index:-1;right:-6%;top:-4%;width:min(560px,70%);aspect-ratio:600/438.65;-webkit-mask:url(logo-lockup.svg) center/contain no-repeat;mask:url(logo-lockup.svg) center/contain no-repeat;background:linear-gradient(115deg,#0A433F,#1B2A6B 40%,#4A1D63 70%,#A61E5C);opacity:.35;pointer-events:none}
main{overflow-x:clip}
.crow{top:4%;transform:none;opacity:1;background:linear-gradient(115deg,#436D67 0%,#505A88 28%,#745182 52%,#B9517D 76%,#436D67 100%);background-size:240% 100%}
@media (max-width:860px){.crow{top:6%}}
.hero:not(.stage)::before{background:linear-gradient(115deg,#436D67,#505A88 40%,#745182 70%,#B9517D);opacity:.4}
.seg button[aria-pressed=true],button.chip[aria-pressed=true]{background:var(--iri);color:var(--gesso);border-color:rgba(240,235,222,.3)}
.mo-demo .crow{background:linear-gradient(115deg,#436D67 0%,#505A88 28%,#745182 52%,#B9517D 76%,#436D67 100%);background-size:240% 100%}
.stat b span{font:inherit;color:inherit}
.crow{width:min(60vw,720px);right:-6%;top:2%;opacity:.8}
@media (max-width:860px){.crow{width:130vw;right:-35%;top:8%;opacity:.4}}
.panel .big{background:linear-gradient(110deg,#436D67,#505A88 45%,#B9517D);-webkit-background-clip:text;background-clip:text}
/* ===== v2.1 fixes ===== */
p{text-wrap:pretty}h1,h2,h3{text-wrap:balance}
.steps{display:none!important}
.crow{right:2%;top:3%;width:min(50vw,620px);opacity:.9}
@media (max-width:860px){.crow{width:94vw;right:3%;top:5%;opacity:.38}}
.tile .ghost{right:4%;top:6%;bottom:auto;width:auto;height:70%;aspect-ratio:336.44/604;-webkit-mask:url(logo-mark.svg) center/contain no-repeat;mask:url(logo-mark.svg) center/contain no-repeat;background:rgba(240,235,222,.14)}
.hero:not(.stage)::before{right:3%;top:0;width:min(230px,38%);aspect-ratio:336.44/604;-webkit-mask:url(logo-mark.svg) center/contain no-repeat;mask:url(logo-mark.svg) center/contain no-repeat;opacity:.35}
@media (max-width:700px){.hero:not(.stage)::before{opacity:.18}}
/* real logo in header + footer */
.lg-lock{display:block;height:50px;aspect-ratio:8.4/1;-webkit-mask:url(logo-creative-line.svg) left center/contain no-repeat;mask:url(logo-creative-line.svg) left center/contain no-repeat;background:var(--gesso);transition:background .4s}
.logo:hover .lg-lock{background:linear-gradient(110deg,#B6C1B6,#9D84A1,#CB849D,#E4C664);background-size:200% 100%;animation:iri 2.2s ease-in-out infinite alternate}
footer.site .lg-lock{height:40px}
header.site{padding-block:10px}
.logo{display:flex;align-items:center}
.lgm{display:block;background:var(--c,var(--gesso));-webkit-mask:var(--m) left center/contain no-repeat;mask:var(--m) left center/contain no-repeat}
/* back to top */
.totop{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:84px;z-index:40;width:48px;height:48px;border:1px solid rgba(240,235,222,.35);background:rgba(11,13,18,.82);backdrop-filter:blur(8px);color:var(--gesso);font:500 20px/1 var(--body);cursor:pointer;opacity:0;pointer-events:none;transform:translateY(8px);transition:opacity .3s,transform .3s,border-color .2s}
.totop.on{opacity:1;pointer-events:auto;transform:none}
.totop:hover{border-color:var(--madder-t2);background:rgba(166,30,92,.35)}
/* family logos */
.fam-card .lgm{height:46px;width:100%;margin-bottom:6px}
.fam-card.slot-missing{border-style:dashed}
.logo-row{display:flex;gap:28px;align-items:center;flex-wrap:wrap}
.pig{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,120px),1fr));gap:8px}
.pig button{border:0;cursor:pointer;min-height:84px;padding:12px;text-align:left;font:500 14px var(--display);transition:transform .25s,box-shadow .25s}
.pig button[aria-pressed=true]{transform:translateY(-8px);box-shadow:0 14px 28px -10px rgba(0,0,0,.8);outline:2px solid var(--gesso)}
.pigstory{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--s6);padding:var(--s6);border:1px solid var(--line);background:var(--surface);min-height:220px}
@media (max-width:760px){.pigstory{grid-template-columns:minmax(0,1fr)}}
.quote{font:500 clamp(1.5rem,3.4vw,2.6rem)/1.2 var(--display);letter-spacing:-.02em;max-width:28ch}
.acc details{border-top:1px solid var(--line);padding-block:14px}
.acc details:last-child{border-bottom:1px solid var(--line)}
.acc summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:16px;align-items:center;min-height:48px;font:500 clamp(1.2rem,2.2vw,1.6rem) var(--display)}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"+";font:300 28px var(--display);color:var(--madder-t2);transition:transform .25s}
.acc details[open] summary::after{transform:rotate(45deg)}
.acc details>div{padding-top:10px;max-width:64ch;color:var(--n7)}
.lg .m.lm{-webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat}
.lg-lock{height:38px;transition:height .3s,background .4s}
header.site.sm .lg-lock{height:30px}

@media(max-width:700px){.lg-lock{height:24px}header.site.sm .lg-lock{height:22px}footer.site .lg-lock{height:30px}}

.msk{display:block;flex:none;background:var(--c,var(--gesso));-webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat}
.msk.grad{background:linear-gradient(110deg,#B6C1B6,#9D84A1,#CB849D,#E4C664);background-size:200% 100%;animation:iri 6s ease-in-out infinite alternate}
@media(prefers-reduced-motion:reduce){.msk.grad{animation:none}}

/* v7 */
.who{display:grid;grid-template-columns:minmax(0,260px) minmax(0,1fr);gap:32px;align-items:start}
.who .msk{width:260px;height:260px}
@media(max-width:700px){.who{grid-template-columns:minmax(0,1fr)}.who .msk{width:200px;height:200px}}
.journal{position:relative;overflow:hidden;background:
 radial-gradient(1.2px 1.2px at 12% 22%,#F0EBDE 50%,transparent 51%),radial-gradient(1px 1px at 78% 14%,#F0EBDE 50%,transparent 51%),radial-gradient(1.4px 1.4px at 88% 64%,#E4C664 50%,transparent 51%),radial-gradient(1px 1px at 34% 82%,#F0EBDE 50%,transparent 51%),radial-gradient(1px 1px at 58% 38%,#B6C1B6 50%,transparent 51%),
 repeating-linear-gradient(180deg,transparent 0 35px,rgba(240,235,222,.07) 35px 36px),var(--ink);border-block:1px solid var(--line);padding:var(--s7) var(--s5)}
.journal .jin{position:relative;max-width:var(--maxw,1120px);margin-inline:auto;display:grid;gap:22px;z-index:1}
.jmeta{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:.78rem;letter-spacing:.14em;color:var(--weld-t1,#E4C664);margin:0}
.cofword{height:clamp(44px,7vw,72px);width:min(100%,420px)}
.cofword.big{height:clamp(56px,11vw,110px);width:min(100%,640px);margin:0}
.jtxt{display:grid;gap:14px;max-width:62ch;border-left:2px solid rgba(228,198,100,.5);padding-left:20px;color:var(--gesso)}
.jtxt p{margin:0}
.orbit{position:absolute;right:-120px;top:-60px;width:520px;height:520px;border:1px solid rgba(182,193,182,.28);border-radius:50%;transform:rotate(-18deg) scaleY(.42);z-index:0;pointer-events:none}
.orbit::after{content:"";position:absolute;left:12%;top:22%;width:12px;height:12px;border-radius:50%;background:#E4C664}
@media(max-width:700px){.orbit{width:360px;height:360px;right:-140px}}
.stair{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:stretch}
.stair .card{gap:12px}.stair .lgm{height:34px;width:100%}
.stair .s-cultivated{grid-column:3;grid-row:1}
.stair .s-creative{grid-column:2;grid-row:2}.stair .s-collective{grid-column:3;grid-row:2}
.stair .s-cof{grid-column:1;grid-row:3}.stair .s-community{grid-column:2;grid-row:3}.stair .s-commerce{grid-column:3;grid-row:3}
.stair .s-cultivated .lgm{height:22px;margin-block:6px}
@media(max-width:860px){.stair{grid-template-columns:minmax(0,1fr)}.stair .card{grid-column:auto!important;grid-row:auto!important}
 .stair .s-creative,.stair .s-collective{margin-left:16px}.stair .s-cof,.stair .s-community,.stair .s-commerce{margin-left:32px}}
.fable{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));gap:16px;margin-block:12px}
.fable figure{margin:0;display:grid;gap:10px;background:var(--surface);border:1px solid var(--line);padding:14px}
.fable svg{width:100%;height:auto;display:block;background:#12151c}
.fable figcaption{font-size:.92rem;color:var(--gesso)}.fable figcaption b{display:block;font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.12em;color:var(--weld-t1,#E4C664);margin-bottom:4px;text-transform:uppercase}

/* corbie step, subtle */
.stack .panel .big::after{content:"";display:block;margin-top:14px;background:#9D84A1;opacity:.75}
.stack .band.v .big::after{width:22px;height:10px}
.stack .band.o .big::after{width:44px;height:20px;clip-path:polygon(0 100%,0 50%,50% 50%,50% 0,100% 0,100% 100%)}
.stack .band.t .big::after{width:66px;height:30px;clip-path:polygon(0 100%,0 66.6%,33.3% 66.6%,33.3% 33.3%,66.6% 33.3%,66.6% 0,100% 0,100% 100%)}
/* step cards + fable panels: tops aligned, equal heights in each row */
.grid.stepcards{grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr))!important;align-items:stretch}
.fable{align-items:stretch}
.fable figure{grid-template-rows:auto 1fr;align-content:start}
.stair .s-cultivated .lgm{height:34px;margin-block:0}

@media(min-width:861px){.split.tight{grid-template-columns:max-content minmax(0,1fr);gap:var(--s5) var(--s6)}}

.pstats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:var(--s4)}
.pstats div{border-top:2px solid var(--orchil);padding-top:10px;display:grid;gap:4px;align-content:start}
.pstats b{font:600 clamp(1.5rem,3vw,2rem)/1.1 var(--display);color:var(--ink);letter-spacing:-.02em}
.pstats span{font-size:.88rem;color:#2C2D2F}

/* v13 collective */
nav.main{gap:clamp(10px,1.6vw,22px)}
.dd{position:relative}
.dd-btn{background:none;border:0;color:var(--n7);font:inherit;font-weight:300;cursor:pointer;padding:10px 2px;min-height:44px;text-align:left;display:block;position:relative}
.dd-btn::after{content:"";position:absolute;right:-12px;top:20px;width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);opacity:.7}
.dd-btn small{display:block;font-size:11px;color:var(--n5);letter-spacing:.04em;font-weight:400;margin-top:1px}
.dd.cur .dd-btn,.dd-btn:hover{color:var(--weld-t1,#E4C664)}
.dd-menu{display:none;position:absolute;top:100%;left:-16px;min-width:230px;background:#0f1218;border:1px solid var(--line);padding:8px;z-index:60;gap:2px}
.dd.open .dd-menu{display:grid}
.dd-menu a{padding:10px 12px;display:grid;gap:2px}.dd-menu a:hover{background:rgba(240,235,222,.06)}
.dd-menu::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px}
@media(max-width:860px){.dd-menu{position:static;border:0;padding:0 0 0 14px;min-width:0;background:none}.dd-btn{width:100%}.dd-btn::after{right:auto;left:7.5em}}
.mono{display:grid;place-items:center;width:160px;height:160px;border-radius:50%;color:#F0EBDE;font:600 3.2rem/1 var(--display);letter-spacing:-.02em}
.mono.sm{width:56px;height:56px;font-size:1.3rem;flex:none}
.ph{color:#77746C;font-style:italic}
.joingrid{display:grid;gap:var(--s6);align-items:start}
@media(min-width:1000px){.joingrid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.pvwrap{position:sticky;top:90px}}
.joingrid .profile,.dirgrid~#open .profile{grid-template-columns:minmax(0,1fr);padding:var(--s5)}
.joingrid .profile .mono{width:110px;height:110px;font-size:2.2rem}
.jf{display:grid;gap:var(--s5)}.jf fieldset{border:1px solid var(--line);padding:var(--s5);display:grid;gap:var(--s4);margin:0;min-width:0}
.jf legend{padding:0 8px;font:600 1.05rem var(--display);color:var(--gesso)}.jf legend small,.fld small{color:var(--muted,#9A978F);font-weight:400;font-size:.8rem;margin-left:6px}
.fld{display:grid;gap:6px;font-size:.95rem}.two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:10px}
@media(max-width:600px){.two{grid-template-columns:minmax(0,1fr)}}
.pk-row{display:flex;flex-wrap:wrap;gap:8px}.pk{background:none;color:var(--gesso);border:1px solid var(--line);padding:8px 12px;min-height:40px;font:400 .9rem var(--body);border-radius:2px;cursor:pointer}
.pk[aria-pressed=true]{background:var(--verdigris,#436D67);border-color:transparent;color:#fff}
.hues{display:flex;gap:10px;flex-wrap:wrap}.hue{width:40px;height:40px;border-radius:50%;border:2px solid transparent;cursor:pointer;padding:0}.hue[aria-pressed=true]{border-color:#F0EBDE;box-shadow:0 0 0 2px #0B0D12 inset}
.rad{display:flex;gap:12px;align-items:flex-start;cursor:pointer}.rad input{width:20px;min-height:20px;margin-top:4px;flex:none}.rad b{display:block}.rad small{display:block;color:var(--muted,#9A978F)}
.msg{margin:0;min-height:1.4em;font-size:.95rem}.msg.bad{color:#E8A0A8}
.note-box{border:1px solid var(--line);padding:16px 20px;margin-bottom:var(--s5);background:rgba(240,235,222,.04)}.note-box.ok{border-color:#436D67}
.qitem{display:grid;gap:12px}.qbar{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.dirbar{display:flex;gap:var(--s4);align-items:end;flex-wrap:wrap;margin-bottom:var(--s5)}
.dirgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr));gap:16px}
.mcard{display:flex;gap:14px;align-items:center;text-align:left;background:var(--surface);border:1px solid var(--line);color:var(--gesso);padding:16px;cursor:pointer;font:inherit}
.mcard:hover,.mcard[aria-expanded=true]{border-color:var(--weld-t1,#E4C664)}
.mcard .mt{display:grid;gap:4px}.mcard small{color:var(--muted,#9A978F)}.mcard .chip{justify-self:start}

/* v14 profile galleries */
.pgal{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,200px),1fr));gap:var(--s4)}
.pgal.sm{grid-template-columns:repeat(auto-fill,minmax(min(100%,130px),1fr))}
.pcard{margin:0;display:grid;gap:8px;align-content:start}
.pimg{aspect-ratio:4/3;background:#E2DCCB;border-radius:6px;overflow:hidden;display:grid;place-items:center}
.pimg img{width:100%;height:100%;object-fit:cover;display:block}
.pimg.nopic{display:none}
.pcard figcaption{display:grid;gap:3px;font-size:.88rem}
.pcard figcaption b{font:600 .95rem/1.25 var(--display)}
.pcard figcaption span{color:#2C2D2F}
.jrow{display:grid;gap:8px;grid-template-columns:1fr;margin-bottom:10px}
@media(min-width:700px){.jrow.three{grid-template-columns:1fr 1fr 1fr}.jrow.four{grid-template-columns:1fr 2fr}}
