/* ArtFolio v8 — gold studio · dark / light / auto
   Bricolage Grotesque + Archivo */
:root,[data-theme="dark"]{
  --bg:#0A0A0B; --bg-2:#111113; --card:#18181B; --card-2:#222226; --card-hi:#1F1F23;
  --line:rgba(255,255,255,.08); --line-2:rgba(255,255,255,.14);
  --text:#FAFAFA; --muted:#A1A1AA; --dim:#8B8B94;
  --accent:#D4AF37; --accent-2:#E5C54D; --accent-hover:#E5C54D; --on-accent:#0A0A0B;
  --acc:212,175,55; --glow:rgba(212,175,55,.35); --soft-text:#EBD58A;
  --strap:#5C4A12; --shadow:0 40px 80px -30px rgba(0,0,0,.85); --nav-bg:rgba(10,10,11,.78);
  --fire-bg:#140A04; --fire-tx:#FFE7B3; --ok:#22C55E; --err:#FF8A8A;
  color-scheme:dark;
}
[data-theme="light"]{
  --bg:#F3F4F6; --bg-2:#FFFFFF; --card:#FFFFFF; --card-2:#E9EBEF; --card-hi:#F8F8F9;
  --line:#D6D9DE; --line-2:#C3C8CE;
  --text:#111318; --muted:#3B4150; --dim:#5B6170;
  --accent:#D4AF37; --accent-2:#7A5D00; --accent-hover:#C9A227; --on-accent:#111318;
  --acc:184,150,12; --glow:rgba(184,150,12,.28); --soft-text:#5E4800;
  --strap:#B8960C; --shadow:0 30px 60px -28px rgba(17,19,24,.35); --nav-bg:rgba(243,244,246,.86);
  --fire-bg:#111318; --fire-tx:#FFE7B3; --ok:#15803D; --err:#B42318;
  color-scheme:light;
}
:root{--display:"Bricolage Grotesque","Archivo",system-ui,sans-serif;--text-f:"Archivo",system-ui,-apple-system,sans-serif;
  --wrap:1240px;--gut:clamp(1.15rem,4vw,2.5rem);--r:18px;--r-sm:12px;--ease:cubic-bezier(.2,.7,.1,1);--spring:cubic-bezier(.34,1.56,.64,1);--nav:76px}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--nav) + 16px);-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:400 16.5px/1.65 var(--text-f);-webkit-font-smoothing:antialiased;overflow-x:hidden;padding-bottom:env(safe-area-inset-bottom,0px);transition:background .35s,color .35s}
img{max-width:100%;display:block}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer}
svg{flex:none}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:6px}
::selection{background:var(--accent);color:var(--on-accent)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip-link{position:absolute;left:1rem;top:-3rem;z-index:300;background:var(--accent);color:var(--on-accent);padding:.6rem 1rem;border-radius:8px;text-decoration:none}
.skip-link:focus{top:1rem}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
.bg-glow{position:fixed;inset:-20vh -10vw auto;height:90vh;pointer-events:none;z-index:-1;
  background:radial-gradient(45% 55% at 78% 18%,rgba(var(--acc),.12),transparent 70%)}

/* ── Buttons & links ── */
.btn{display:inline-flex;align-items:center;gap:.55rem;padding:.85rem 1.4rem;border-radius:999px;border:1px solid transparent;text-decoration:none;font-weight:600;font-size:.96rem;
  transition:transform .25s var(--ease),background .25s,box-shadow .3s,border-color .25s,color .25s}
.btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s var(--ease)}
.btn:hover svg{transform:translateX(4px)}
.btn-sm{padding:.55rem 1.05rem;font-size:.9rem}
.btn-accent{background:var(--accent);color:var(--on-accent);box-shadow:0 8px 28px -12px var(--glow)}
.btn-accent:hover{background:var(--accent-hover);transform:translateY(-2px);box-shadow:0 12px 34px -10px var(--glow)}
.btn-ghost{border-color:var(--line-2);color:var(--text);background:transparent;font-weight:500}
.btn-ghost:hover{border-color:var(--accent);background:rgba(var(--acc),.08);transform:translateY(-2px)}
.link{background:none;border:0;padding:0 0 2px;text-decoration:none;color:var(--accent-2);font-weight:600;
  background-image:linear-gradient(currentColor,currentColor);background-size:0 1px;background-repeat:no-repeat;background-position:0 100%;transition:background-size .35s var(--ease)}
.link:hover{background-size:100% 1px}

/* ── Fire button (AI Tools) ── */
@keyframes flame{0%{background-position:0% 50%}100%{background-position:200% 50%}}
@keyframes flick{0%,100%{opacity:.85;transform:scaleX(1)}40%{opacity:1;transform:scaleX(1.1)}70%{opacity:.65;transform:scaleX(.92)}}
@keyframes flame-ring{0%{background-position:0 0,0% 50%}100%{background-position:0 0,200% 50%}}
.fire{position:relative;display:inline-flex;align-items:center;gap:.5rem;padding:.6rem 1.1rem;border-radius:999px;border:2px solid transparent;color:var(--fire-tx);
  background:linear-gradient(var(--fire-bg),var(--fire-bg)) padding-box,linear-gradient(90deg,#FF3D00,#FF9100,#FFD54F,#FF9100,#FF3D00) border-box;
  background-size:100% 100%,200% 100%;animation:flame-ring 2.2s linear infinite;box-shadow:0 0 22px -6px rgba(255,120,0,.65),inset 0 0 14px -6px rgba(255,140,0,.6);
  text-decoration:none;font-weight:600;font-size:.92rem;white-space:nowrap;transition:transform .3s var(--spring),box-shadow .3s}
.fire:hover{box-shadow:0 0 30px -4px rgba(255,120,0,.8),inset 0 0 18px -6px rgba(255,140,0,.7)}
.fire::after{content:"";position:absolute;left:14%;right:14%;bottom:-10px;height:8px;border-radius:50%;background:radial-gradient(closest-side,#FFB300,rgba(255,61,0,.6),transparent);filter:blur(2px);animation:flick 1.1s ease-in-out infinite;pointer-events:none}
.fire:hover{transform:translateY(-2px)}
.fire[aria-current="page"]{box-shadow:0 0 34px -2px rgba(255,120,0,.85),inset 0 0 18px -6px rgba(255,140,0,.7)}
.fire svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.fire-lg{padding:1rem 1.6rem;font-size:1rem}
.flametext{background:linear-gradient(90deg,#FF5A1F,#FFB300,#FFE08A,#FFB300,#FF5A1F);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:flame 4s linear infinite}
[data-theme="light"] .flametext{background-image:linear-gradient(90deg,#C2410C,#D97706,#A16207,#D97706,#C2410C)}

/* ── Nav ── */
.nav-wrap{position:sticky;top:0;z-index:100;height:var(--nav);transition:background .3s,border-color .3s;border-bottom:1px solid transparent}
.nav-wrap.is-scrolled{background:var(--nav-bg);-webkit-backdrop-filter:blur(14px) saturate(1.3);backdrop-filter:blur(14px) saturate(1.3);border-bottom-color:var(--line)}
.nav-row{height:var(--nav);display:flex;align-items:center;gap:1rem}
.brand{display:flex;align-items:center;gap:.65rem;text-decoration:none;margin-right:auto}
.brand-mark{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;background:var(--accent);color:var(--on-accent);font:800 .95rem var(--display);box-shadow:0 6px 20px -8px var(--glow)}
.brand-name{font:600 1rem var(--display)}
.nav{position:relative;display:flex;gap:.15rem;padding:.3rem;border:1px solid var(--line);border-radius:999px}
.nav a{position:relative;z-index:1;padding:.45rem .85rem;border-radius:999px;text-decoration:none;font-size:.9rem;color:var(--muted);transition:color .25s}
.nav a:hover,.nav a.is-current{color:var(--text)}
.nav-glow{position:absolute;z-index:0;top:.3rem;height:calc(100% - .6rem);left:0;width:0;border-radius:999px;background:rgba(var(--acc),.14);
  box-shadow:inset 0 0 0 1px rgba(var(--acc),.45),0 0 22px -6px var(--glow);opacity:0;transition:left .45s var(--spring),width .45s var(--spring),opacity .25s}
.nav-glow::after{content:"";position:absolute;left:22%;right:22%;bottom:-.32rem;height:2px;border-radius:2px;background:var(--accent);box-shadow:0 0 10px 2px var(--glow)}
.theme-toggle{display:flex;padding:3px;border:1px solid var(--line);border-radius:999px}
.theme-toggle button{border:0;background:transparent;color:var(--muted);font-size:.76rem;padding:.38rem .6rem;border-radius:999px;transition:background .25s,color .25s}
.theme-toggle button[aria-pressed="true"]{background:var(--accent);color:var(--on-accent)}
.nav-toggle{display:none;width:44px;height:44px;border:1px solid var(--line-2);border-radius:12px;background:none;position:relative}
.nav-toggle span:first-child,.nav-toggle span:first-child::before{position:absolute;left:12px;right:12px;height:1.6px;background:var(--text);border-radius:2px;transition:transform .3s var(--ease)}
.nav-toggle span:first-child{top:18px}.nav-toggle span:first-child::before{content:"";left:0;right:0;top:7px}
.nav-toggle[aria-expanded="true"] span:first-child{transform:translateY(3.5px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:first-child::before{transform:translateY(-7px) rotate(-90deg)}
@media(max-width:1100px){.brand-name{display:none}}
@media(max-width:980px){
  .nav-toggle{display:block}
  .nav{position:fixed;left:var(--gut);right:var(--gut);top:calc(var(--nav) + 6px);flex-direction:column;border-radius:var(--r);background:var(--bg-2);padding:.6rem;
    opacity:0;visibility:hidden;transform:translateY(-8px) scale(.98);transform-origin:top;transition:opacity .25s,transform .3s var(--ease),visibility .25s;box-shadow:var(--shadow)}
  .nav.is-open{opacity:1;visibility:visible;transform:none}
  .nav a{font:600 1.2rem var(--display);padding:.75rem 1rem;color:var(--text)}
  .nav-glow{display:none}
}
@media(max-width:560px){.theme-toggle button{padding:.35rem .45rem;font-size:.7rem}.nav-row .fire{padding:.55rem .85rem;font-size:.82rem}}

/* ── Hero ── */
.hero{padding:clamp(1.5rem,5vw,4rem) 0 clamp(2rem,5vw,3.5rem);position:relative}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:center;min-height:min(78vh,700px)}
.status{display:inline-flex;align-items:center;gap:.55rem;margin:0 0 1.4rem;padding:.4rem .85rem;border:1px solid var(--line-2);border-radius:999px;font-size:.88rem;color:var(--muted)}
.status-dot{width:8px;height:8px;border-radius:50%;background:var(--ok);animation:pulse 2.2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(34,197,94,.55)}70%{box-shadow:0 0 0 9px rgba(34,197,94,0)}100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}}
.hero-title{margin:0;font:800 clamp(2.4rem,4.4vw,4.5rem)/1.04 var(--display);letter-spacing:-.035em}
.hero-title .mask{display:block;overflow:hidden;padding-bottom:.08em}
.hero-title .mask>span{display:inline-block}
.rot-line{display:block;white-space:nowrap;color:var(--accent-2)}
[data-theme="dark"] .rot-line{color:var(--accent)}
.rot-word{display:inline-block;transition:opacity .45s var(--ease),transform .55s var(--ease),filter .45s}
.rot-word.is-out{opacity:0;transform:translateY(-.35em);filter:blur(6px)}
.rot-word.is-pre{opacity:0;transform:translateY(.35em);filter:blur(6px);transition:none}
.hero-lede{max-width:46ch;margin:1.5rem 0 1.9rem;font-size:clamp(1.02rem,1.4vw,1.16rem);color:var(--muted)}
.hero-cta{display:flex;flex-wrap:wrap;gap:.75rem}
.hero-social{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:3rem}

/* social buttons: fill + tooltip (room is reserved above) */
.soc{position:relative;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;text-decoration:none;font:700 .85rem var(--display);
  border:1px solid var(--line-2);color:var(--text);isolation:isolate;transition:border-color .3s,transform .3s var(--spring),color .2s}
.soc::before{content:"";position:absolute;inset:0;border-radius:50%;background:var(--c);transform:scale(0);transition:transform .35s var(--spring);z-index:-1}
.soc::after{content:attr(data-tip);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%,6px) scale(.9);padding:.28rem .6rem;border-radius:8px;background:var(--c);color:#fff;
  font:500 .76rem var(--text-f);white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .25s,transform .3s var(--spring);z-index:3}
.soc:hover,.soc:focus-visible{border-color:transparent;transform:translateY(-3px);color:#fff}
.soc:hover::before,.soc:focus-visible::before{transform:scale(1)}
.soc:hover::after,.soc:focus-visible::after{opacity:1;transform:translate(-50%,0) scale(1)}

/* entrance */
.enter{opacity:0;transform:translateY(16px);transition:opacity .8s var(--ease),transform .9s var(--ease)}
.hero-title .enter{opacity:1;transform:translateY(110%)}
body.is-ready .enter{opacity:1;transform:none}
body.is-ready .e1{transition-delay:.05s}body.is-ready .e2{transition-delay:.15s}body.is-ready .e3{transition-delay:.27s}
body.is-ready .e4{transition-delay:.39s}body.is-ready .e5{transition-delay:.6s}body.is-ready .e6{transition-delay:.72s}
body.is-ready .e7{transition-delay:.84s}body.is-ready .e8{transition-delay:.95s}

/* ── Lanyard ID card ── */
.hero-badge-zone{position:relative;height:min(640px,74vh);min-height:500px}
.lanyard{position:absolute;inset:0}
.strap{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.strap path{fill:none;stroke:var(--strap);stroke-width:12;stroke-linecap:round}
.id-card{position:absolute;left:50%;top:0;width:270px;margin-left:-135px;padding:.95rem .95rem 1.05rem;border-radius:22px;background:var(--card);border:1px solid var(--line-2);
  box-shadow:var(--shadow),0 30px 70px -45px var(--glow);cursor:grab;user-select:none;-webkit-user-select:none;will-change:transform;opacity:0;touch-action:pan-y;z-index:2}
.id-card.is-dragging{cursor:grabbing}
body.is-ready .id-card{opacity:1;transition:opacity .6s .2s}
.id-clip{position:absolute;top:-14px;left:50%;width:46px;height:22px;margin-left:-23px;border-radius:7px;background:linear-gradient(#D7D7DC,#9898A0)}
.id-top{display:flex;align-items:center;justify-content:space-between;font-size:.72rem;color:var(--muted);margin-bottom:.75rem}
.id-mark{font:800 .78rem var(--display);color:var(--on-accent);background:var(--accent);border-radius:7px;padding:.2rem .45rem}
.id-photo{aspect-ratio:1;border-radius:15px;overflow:hidden;background:var(--card-2);display:grid;place-items:center}
.id-photo img{width:100%;height:100%;object-fit:cover;pointer-events:none}
.id-mono{font:800 4.2rem var(--display);color:var(--accent);letter-spacing:-.04em}
.id-name{margin-top:.85rem;font:700 1.22rem/1.15 var(--display)}
.id-role{color:var(--muted);font-size:.82rem;margin-top:.2rem}
.id-meta{display:flex;justify-content:space-between;margin-top:.75rem;padding-top:.65rem;border-top:1px dashed var(--line-2);font-size:.74rem;color:var(--dim)}
.id-bar{height:24px;margin-top:.65rem;border-radius:4px;opacity:.5;
  background:repeating-linear-gradient(90deg,var(--text) 0 2px,transparent 2px 4px,var(--text) 4px 5px,transparent 5px 8px,var(--text) 8px 11px,transparent 11px 13px)}
@media(max-width:980px){
  .hero-grid{grid-template-columns:1fr;min-height:0}
  .hero-badge-zone{height:470px;min-height:0;order:-1}
  .id-card{width:205px;margin-left:-102.5px;padding:.75rem .75rem .85rem;border-radius:18px}
  .id-name{font-size:1.05rem}.id-role{font-size:.74rem}.id-bar{height:18px}
}


/* ── About band: stats + publishers ── */
.about-band{padding:0 0 clamp(2.5rem,5vw,3.5rem)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));margin:0;border:1px solid var(--line);border-radius:var(--r);background:var(--card)}
.stats div{display:flex;flex-direction:column;padding:1.35rem 1.5rem;border-right:1px solid var(--line)}
.stats div:last-child{border-right:0}
.stats dd{order:-1;margin:0;font:800 clamp(2rem,3.4vw,2.7rem)/1 var(--display);letter-spacing:-.03em}
.stats dd.acc{color:var(--accent-2)}
[data-theme="dark"] .stats dd.acc{color:var(--accent)}
.stats dt{color:var(--muted);font-size:.88rem;margin-top:.4rem}
@media(max-width:700px){.stats div{border-right:0;border-bottom:1px solid var(--line)}.stats div:last-child{border-bottom:0}}
.about-text{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:2rem;margin-top:2.2rem;align-items:start}
.about-text h2{margin:0;font:800 clamp(1.7rem,3vw,2.4rem)/1.1 var(--display);letter-spacing:-.025em}
.about-text p{margin:0;color:var(--muted);font-size:1.05rem}
@media(max-width:800px){.about-text{grid-template-columns:1fr}}
.publishers{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.6rem 2.2rem;margin-top:2.2rem;padding-top:1.6rem;border-top:1px solid var(--line);font:600 1.12rem var(--display);color:var(--muted)}
.publishers span:first-child{font:400 .88rem var(--text-f);color:var(--dim)}

/* ── Sections ── */
.section{padding:clamp(4rem,8vw,6.5rem) 0;position:relative}
.section-band{background:var(--bg-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.head{margin-bottom:clamp(1.8rem,4vw,2.75rem);max-width:780px}
.head-row{display:flex;justify-content:space-between;align-items:flex-end;gap:1.5rem;max-width:none;flex-wrap:wrap}
.kicker{margin:0 0 .7rem;color:var(--accent-2);font-weight:600;font-size:.95rem;display:flex;align-items:center;gap:.6rem}
[data-theme="dark"] .kicker{color:var(--accent)}
.kicker::before{content:"";width:22px;height:2px;border-radius:2px;background:var(--accent)}
.head h2{margin:0;font:800 clamp(2rem,4.2vw,3.2rem)/1.06 var(--display);letter-spacing:-.03em}
.head-sub{color:var(--muted);margin:1rem 0 0;max-width:56ch}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .8s var(--ease),transform .9s var(--ease)}
.reveal.is-in{opacity:1;transform:none}
.spot{position:relative;isolation:isolate}
.spot::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1;opacity:0;transition:opacity .35s;
  background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(var(--acc),.14),transparent 70%)}
.spot:hover::before{opacity:1}

/* ── Bento ── */
.bento{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:minmax(200px,auto);gap:1rem}
.tile{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:1.5rem;display:flex;flex-direction:column;gap:.55rem;transition:border-color .3s,transform .4s var(--ease)}
.tile:hover{border-color:rgba(var(--acc),.45);transform:translateY(-4px)}
.tile-lg{grid-column:span 2;grid-row:span 2}
.tile-half{grid-column:span 2}
.tile-wide{grid-column:1 / -1;flex-direction:row;align-items:center;gap:1.5rem;flex-wrap:wrap}
.tile-wide>div{flex:1;min-width:240px}
.tile h3{margin:.35rem 0 0;font:700 1.28rem/1.2 var(--display)}
.tile-lg h3{font-size:clamp(1.55rem,2.3vw,2rem)}
.tile p{margin:0;color:var(--muted)}
.ico{width:44px;height:44px;padding:10px;border-radius:12px;background:rgba(var(--acc),.14);fill:none;stroke:var(--accent-2);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
[data-theme="dark"] .ico{stroke:var(--accent)}
.tags{list-style:none;padding:0;margin:auto 0 0;display:flex;flex-wrap:wrap;gap:.4rem}
.tags li{font-size:.8rem;padding:.28rem .65rem;border-radius:999px;border:1px solid var(--line-2);color:var(--muted)}
@media(max-width:980px){.bento{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.bento{grid-template-columns:1fr}.tile-lg,.tile-wide,.tile-half{grid-column:auto;grid-row:auto}}

/* ── Scroll stack (featured) ── */
.stack{position:relative;display:grid;gap:2rem;margin-bottom:clamp(3.5rem,7vw,5.5rem)}
.stack-card{position:sticky;top:calc(var(--nav) + 24px + var(--i) * 18px);display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(1.5rem,3vw,2.5rem);
  min-height:min(520px,72vh);padding:clamp(1.25rem,3vw,2.25rem);border-radius:24px;border:1px solid var(--line-2);background:var(--card);box-shadow:0 -20px 60px -30px rgba(0,0,0,.6);transform-origin:50% 0;will-change:transform}
.stack-text{display:flex;flex-direction:column;gap:.8rem;padding:.5rem 0}
.stack-num{font:800 3.4rem/1 var(--display);color:transparent;-webkit-text-stroke:1px rgba(var(--acc),.7)}
.stack-text h3{margin:0;font:800 clamp(1.6rem,2.8vw,2.3rem)/1.1 var(--display);letter-spacing:-.02em}
.stack-text p{margin:0;color:var(--muted)}
.stack-cat{align-self:flex-start;font-size:.82rem;padding:.3rem .7rem;border-radius:999px;background:rgba(var(--acc),.15);color:var(--soft-text)}
.stack-text .link{margin-top:auto;align-self:flex-start}
.stack-img{border-radius:16px;overflow:hidden;background:var(--card-2);display:grid;place-items:center}
.stack-img img{width:100%;height:100%;object-fit:contain;max-height:min(460px,64vh)}
@media(max-width:800px){.stack-card{grid-template-columns:1fr;min-height:0;top:calc(var(--nav) + 12px + var(--i) * 10px)}.stack-img{order:-1}}

/* ── Folder cards ── */
.folders-title{font:800 clamp(1.7rem,3vw,2.4rem)/1.1 var(--display);letter-spacing:-.025em;margin:0 0 1.5rem}
.folder-list{display:flex;flex-direction:column;gap:1.25rem}
.folder-card{display:grid;grid-template-columns:minmax(0,.42fr) minmax(0,.58fr);gap:2rem;padding:1.75rem;border-radius:24px;background:var(--card);border:1px solid var(--line-2);
  text-decoration:none;color:var(--text);transition:border-color .3s,transform .45s var(--ease),box-shadow .45s}
.folder-card:hover{border-color:rgba(var(--acc),.55);transform:translateY(-4px);box-shadow:0 30px 60px -36px var(--glow)}
.folder-info{display:flex;flex-direction:column;gap:.75rem}
.folder-tag{align-self:flex-start;font-size:.82rem;padding:.28rem .75rem;border-radius:999px;background:rgba(var(--acc),.16);color:var(--soft-text)}
.folder-info h3{margin:0;font:800 clamp(1.6rem,2.6vw,2.1rem)/1.1 var(--display);letter-spacing:-.02em}
.folder-info p{margin:0;color:var(--muted)}
.folder-meta{display:flex;gap:2rem;margin:.4rem 0 0}
.folder-meta div{display:flex;flex-direction:column}
.folder-meta dt{font-size:.8rem;color:var(--dim)}
.folder-meta dd{margin:0;font:700 1.2rem var(--display)}
.folder-open{margin-top:auto;align-self:flex-start}
.folder-previews{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;align-content:start}
.folder-previews img{width:100%;border-radius:12px;background:var(--card-2);aspect-ratio:16/10;object-fit:cover;transition:transform .7s var(--ease)}
.folder-previews img:first-child{grid-column:1 / -1;aspect-ratio:16/9}
.folder-card:hover .folder-previews img:first-child{transform:scale(1.02)}
.folder-more{display:grid;place-items:center;border-radius:12px;border:1px dashed var(--line-2);color:var(--muted);font-size:.9rem;aspect-ratio:16/10}
.folder-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1rem}
.folder-mini{display:flex;flex-direction:column;gap:.8rem;padding:1.2rem;border-radius:20px;background:var(--card);border:1px solid var(--line);text-decoration:none;color:var(--text);transition:border-color .3s,transform .4s var(--ease)}
.folder-mini:hover{border-color:rgba(var(--acc),.5);transform:translateY(-4px)}
.mini-thumbs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem}
.mini-thumbs img,.mini-thumbs span{aspect-ratio:3/4;width:100%;object-fit:cover;border-radius:8px;background:var(--card-2)}
.mini-row{display:flex;justify-content:space-between;align-items:baseline;gap:.75rem}
.mini-row b{font:700 1.15rem var(--display)}
.mini-row span{color:var(--accent-2);font-weight:700}
[data-theme="dark"] .mini-row span{color:var(--accent)}
@media(max-width:800px){.folder-card{grid-template-columns:1fr}.folder-previews{order:-1}}

/* ── Timeline ── */
.process-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(2rem,6vw,5rem);align-items:start}
.head-sticky{position:sticky;top:calc(var(--nav) + 32px)}
.timeline{position:relative;list-style:none;margin:0;padding:0 0 0 3rem;counter-reset:step}
.tl-line{position:absolute;left:15px;top:8px;bottom:8px;width:2px;background:var(--line-2);border-radius:2px}
.tl-fill{position:absolute;left:0;top:0;width:100%;height:0;background:var(--accent);box-shadow:0 0 14px var(--glow);border-radius:2px}
.timeline li{position:relative;padding:0 0 2.5rem;counter-increment:step;opacity:.5;transition:opacity .5s}
.timeline li.is-on{opacity:1}
.timeline li::before{content:counter(step);position:absolute;left:-3rem;top:0;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;
  font:700 .85rem var(--display);background:var(--bg);border:2px solid var(--line-2);color:var(--muted);transition:all .4s var(--spring)}
.timeline li.is-on::before{background:var(--accent);border-color:var(--accent);color:var(--on-accent);box-shadow:0 0 0 6px rgba(var(--acc),.15);transform:scale(1.08)}
.timeline h3{margin:.15rem 0 .35rem;font:700 1.28rem var(--display)}
.timeline p{margin:0;color:var(--muted);max-width:52ch}
@media(max-width:900px){.process-grid{grid-template-columns:1fr}.head-sticky{position:static}}

/* ── AI tools teaser ── */
.tools-teaser{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:2.5rem;align-items:center}
.teaser-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
.mini-tool{padding:1.1rem;border-radius:16px;background:var(--card);border:1px solid var(--line);text-decoration:none;color:var(--text);transition:border-color .3s,transform .4s var(--ease)}
.mini-tool:hover{border-color:rgba(var(--acc),.5);transform:translateY(-3px)}
.mini-tool small{display:block;font-size:.76rem;color:var(--dim)}
.mini-tool b{display:block;font:700 1.02rem/1.3 var(--display);margin:.15rem 0 .4rem}
.mini-tool span{font:800 1rem var(--display);color:var(--accent-2)}
[data-theme="dark"] .mini-tool span{color:var(--accent)}
@media(max-width:860px){.tools-teaser{grid-template-columns:1fr}}

/* ── Scripts ── */
.tabs{position:relative;display:flex;flex-wrap:wrap;gap:.3rem;padding:.3rem;margin-bottom:1rem;border:1px solid var(--line);border-radius:16px;width:fit-content;max-width:100%}
.tab{position:relative;z-index:1;background:none;border:0;padding:.5rem 1rem;border-radius:12px;font-size:.92rem;color:var(--muted);transition:color .25s}
.tab sup{font-size:.68em;opacity:.75}
.tab:hover{color:var(--text)}
.tab.is-active{color:var(--on-accent)}
.tab-pill{position:absolute;z-index:0;border-radius:12px;background:var(--accent);box-shadow:0 6px 20px -8px var(--glow);transition:left .45s var(--spring),top .45s var(--spring),width .45s var(--spring),height .45s var(--spring)}
.script-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:1rem;margin-top:1.25rem}
.script-card{display:flex;flex-direction:column;gap:.6rem;padding:1.5rem;border-radius:var(--r);border:1px solid var(--line);background:var(--card);transition:border-color .3s,transform .4s var(--ease)}
.script-card[hidden]{display:none}
.script-card:hover{border-color:rgba(var(--acc),.45);transform:translateY(-4px)}
.script-host{align-self:flex-start;font-size:.78rem;padding:.25rem .65rem;border-radius:999px;background:rgba(var(--acc),.16);color:var(--soft-text)}
.script-card h3{margin:0;font:700 1.25rem/1.2 var(--display)}
.script-card p{margin:0;color:var(--muted);font-size:.93rem}
.script-foot{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:.8rem;border-top:1px solid var(--line)}
.price{font:800 1.1rem var(--display);color:var(--accent-2)}
[data-theme="dark"] .price{color:var(--accent)}
.empty-card{padding:2rem;border-radius:var(--r);border:1px dashed var(--line-2);color:var(--muted);text-align:center}

/* ── Resume ── */
.resume-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1rem}
.resume-card{display:flex;align-items:center;gap:1.1rem;padding:1.5rem;border-radius:20px;background:var(--card);border:1px solid var(--line)}
.resume-ico{width:56px;height:56px;border-radius:14px;display:grid;place-items:center;font:800 1rem var(--display);background:rgba(var(--acc),.16);color:var(--soft-text);flex:none}
.resume-card h3{margin:0;font:700 1.2rem var(--display)}
.resume-card p{margin:.1rem 0 0;font-size:.82rem;color:var(--dim)}
.resume-actions{display:flex;gap:.5rem;margin-left:auto;flex-wrap:wrap}
.dl-btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:.45rem;padding:.55rem 1rem .55rem .6rem;border-radius:999px;background:var(--accent);color:var(--on-accent);text-decoration:none;font-weight:600;font-size:.88rem;transition:background .3s}
.dl-btn.alt{background:transparent;color:var(--text);border:1px solid var(--line-2)}
.dl-icon{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:rgba(0,0,0,.12)}
.dl-btn.alt .dl-icon{background:rgba(var(--acc),.16)}
.dl-icon svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.dl-bar{position:absolute;left:0;bottom:0;height:3px;width:0;background:currentColor;opacity:.8}
.dl-btn.is-loading .dl-icon svg{animation:drop .6s ease-in infinite}
.dl-btn.is-loading .dl-bar{animation:fill 1.1s var(--ease) forwards}
.dl-btn.is-done{background:#16A34A;color:#fff;border-color:#16A34A}
@keyframes drop{0%{transform:translateY(-5px);opacity:0}50%{opacity:1}100%{transform:translateY(5px);opacity:0}}
@keyframes fill{to{width:100%}}
@media(max-width:520px){.resume-card{flex-wrap:wrap}.resume-actions{margin-left:0}}

/* ── Contact ── */
.contact-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(2rem,5vw,4rem);padding:clamp(1.5rem,4vw,3.25rem);border-radius:28px;
  border:1px solid var(--line-2);background:radial-gradient(70% 90% at 0% 0%,rgba(var(--acc),.12),transparent 60%),var(--card)}
.contact-left h2{margin:0;font:800 clamp(2rem,4vw,2.9rem)/1.06 var(--display);letter-spacing:-.03em}
.contact-info{list-style:none;padding:0;margin:2rem 0 0;display:grid}
.contact-info li{display:grid;grid-template-columns:100px 1fr;gap:1rem;padding:.75rem 0;border-bottom:1px solid var(--line);font-size:.96rem}
.contact-info span{color:var(--dim)}
.contact-info a{text-decoration:none}.contact-info a:hover{color:var(--accent-2)}
.contact-form{display:grid;gap:1rem}
.field{position:relative}
.field input,.field textarea{width:100%;padding:1.35rem 1rem .6rem;border-radius:14px;border:1px solid var(--line-2);background:var(--bg);color:var(--text);font:inherit;resize:vertical;transition:border-color .25s,box-shadow .25s}
.field label{position:absolute;left:1rem;top:1rem;color:var(--dim);pointer-events:none;transition:all .25s var(--ease)}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px rgba(var(--acc),.18)}
.field input:focus+label,.field input:not(:placeholder-shown)+label,.field textarea:focus+label,.field textarea:not(:placeholder-shown)+label{top:.42rem;font-size:.74rem;color:var(--accent-2)}
.contact-form .btn{justify-self:start}
.form-error{margin:0;color:var(--err);font-size:.9rem}
.contact-success h3{font:800 1.6rem var(--display);margin:.6rem 0 .3rem}
.contact-success p{color:var(--muted);margin:0 0 1rem}
.ok-mark{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:rgba(34,197,94,.15);margin:0}
.ok-mark svg{width:28px;height:28px;fill:none;stroke:var(--ok);stroke-width:2.5;stroke-linecap:round;stroke-dasharray:24;stroke-dashoffset:24;animation:tick .6s .2s var(--ease) forwards}
@keyframes tick{to{stroke-dashoffset:0}}
.contact-links{display:flex;gap:.6rem;flex-wrap:wrap}
@media(max-width:860px){.contact-card{grid-template-columns:1fr}}

/* ── Footer ── */
.footer{border-top:1px solid var(--line);padding:1.8rem 0;color:var(--dim);font-size:.88rem}
.footer-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem}
.footer .brand{margin-right:0}.footer p{margin:0}

/* ── Lightbox ── */
.lightbox{position:fixed;inset:0;z-index:400;background:rgba(5,5,6,.95);color:#FAFAFA;display:grid;grid-template-rows:1fr auto;opacity:0;transition:opacity .3s;padding:env(safe-area-inset-top,0px) 0 env(safe-area-inset-bottom,0px)}
.lightbox[hidden]{display:none}.lightbox.is-open{opacity:1}
.lb-stage{display:grid;place-items:center;padding:clamp(1rem,4vw,3rem);min-height:0}
.lb-stage img{max-width:100%;max-height:100%;object-fit:contain;border-radius:10px;transform-origin:top left;box-shadow:0 30px 80px -30px #000}
.lb-bar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;padding:1rem clamp(1rem,4vw,3rem) 1.4rem;border-top:1px solid rgba(255,255,255,.1)}
.lb-text h3{margin:0;font:700 1.3rem var(--display)}.lb-text p{margin:.2rem 0 0;color:#A1A1AA;font-size:.92rem;max-width:70ch}
.lb-controls{display:flex;align-items:center;gap:.5rem}
.lb-controls button{width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:transparent;color:#FAFAFA;display:grid;place-items:center;transition:background .2s,border-color .2s}
.lb-controls button:hover{background:#D4AF37;border-color:#D4AF37;color:#0A0A0B}
.lb-controls svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.lb-count{color:#8B8B94;font-size:.88rem;margin-right:.5rem}
body.lb-lock{overflow:hidden}

/* ── Coverflow (folder page) ── */
.folder-hero{padding:clamp(1.5rem,4vw,3rem) 0 0}
.crumbs{margin:0 0 .8rem;font-size:.9rem;color:var(--dim)}
.crumbs a{color:var(--muted);text-decoration:none}.crumbs a:hover{color:var(--accent-2)}
.folder-head{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;flex-wrap:wrap}
.folder-head h1{margin:0;font:800 clamp(2.4rem,5.5vw,4.2rem)/1 var(--display);letter-spacing:-.035em}
.folder-head p{margin:.9rem 0 0;max-width:60ch;color:var(--muted);font-size:1.08rem}
.folder-stats{display:flex;gap:1.8rem;color:var(--muted);font-size:.88rem}
.folder-stats b{display:block;font:800 1.9rem var(--display);color:var(--text)}
.folder-stats b.acc{color:var(--accent-2)}[data-theme="dark"] .folder-stats b.acc{color:var(--accent)}
.sub-filter{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:1.5rem}
.sub-filter button{background:transparent;border:1px solid var(--line-2);border-radius:999px;padding:.4rem .9rem;font-size:.86rem;color:var(--muted);transition:all .2s}
.sub-filter button:hover{border-color:var(--accent);color:var(--text)}
.sub-filter button[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.cf{--cfw:clamp(260px,52vw,680px);position:relative;padding:clamp(2rem,5vw,3.5rem) 0 1rem;overflow:hidden;user-select:none}
@media(max-width:700px){.cf{--cfw:78vw}.cf-dots{display:none}}
.cf::before{content:"";position:absolute;left:50%;top:6%;width:min(1100px,120vw);height:80%;transform:translateX(-50%);background:radial-gradient(closest-side,rgba(var(--acc),.14),transparent);pointer-events:none}
.cf-stage{position:relative;height:calc(var(--cfw) * .65 + 24px);perspective:1600px;touch-action:pan-y}
.cf-item{position:absolute;left:50%;top:0;width:var(--cfw);aspect-ratio:16/10.4;padding:0;border:0;border-radius:18px;background:var(--card);overflow:hidden;
  transform:translateX(-50%);transition:transform .65s var(--ease),opacity .5s,box-shadow .5s,filter .5s;cursor:pointer}
.cf-item img{width:100%;height:100%;object-fit:cover;pointer-events:none}
.cf-item.is-active{box-shadow:0 40px 90px -30px rgba(0,0,0,.8),0 0 0 2px var(--accent);cursor:zoom-in}
.cf-item[hidden]{display:none}
.cf-ph{display:grid;place-items:center;width:100%;height:100%;color:var(--dim);font:600 1rem var(--display)}
.cf-controls{display:flex;justify-content:center;align-items:center;gap:1.1rem;margin-top:1rem}
.cf-btn{width:52px;height:52px;border-radius:50%;border:1px solid var(--line-2);background:var(--card);color:var(--text);display:grid;place-items:center;transition:background .2s,transform .3s var(--spring)}
.cf-btn:hover{transform:scale(1.06)}
.cf-btn.next{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.cf-btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.cf-dots{display:flex;gap:6px;flex-wrap:wrap;max-width:60vw;justify-content:center}
.cf-dots button{width:8px;height:8px;padding:0;border:0;border-radius:4px;background:var(--line-2);transition:width .3s,background .3s}
.cf-dots button[aria-current="true"]{width:26px;background:var(--accent)}
.cf-info{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2rem;align-items:center;margin-top:2rem;padding:1.6rem 1.9rem;border-radius:22px;background:var(--card);border:1px solid var(--line)}
.cf-info .cf-count{margin:0;font-size:.88rem;color:var(--accent-2);font-weight:600}[data-theme="dark"] .cf-info .cf-count{color:var(--accent)}
.cf-info h2{margin:.25rem 0 .35rem;font:800 clamp(1.4rem,2.6vw,1.9rem)/1.15 var(--display)}
.cf-info p.desc{margin:0;color:var(--muted)}
.cf-info .acts{display:flex;gap:.6rem;flex-wrap:wrap}
@media(max-width:700px){.cf-info{grid-template-columns:1fr}}
.others{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1rem}
.other{display:flex;justify-content:space-between;padding:1.3rem 1.4rem;border-radius:18px;background:var(--card);border:1px solid var(--line);text-decoration:none;color:var(--text);transition:border-color .3s,transform .35s var(--ease)}
.other:hover{border-color:rgba(var(--acc),.5);transform:translateY(-3px)}
.other b{font:700 1.08rem var(--display)}.other span{color:var(--accent-2);font-weight:700}[data-theme="dark"] .other span{color:var(--accent)}

/* ── AI Tools page ── */
@keyframes rise{0%{transform:translateY(0) scale(1);opacity:0}15%{opacity:.9}100%{transform:translateY(-260px) scale(.3);opacity:0}}
.store-hero{position:relative;overflow:hidden;padding:clamp(3.5rem,9vw,6.5rem) 0 clamp(3rem,6vw,4.5rem);text-align:center}
.store-hero::before{content:"";position:absolute;left:50%;top:0;width:min(1000px,130vw);height:560px;transform:translateX(-50%);
  background:radial-gradient(closest-side,rgba(255,120,0,.2),rgba(var(--acc),.08),transparent);pointer-events:none}
.ember{position:absolute;bottom:0;width:6px;height:6px;border-radius:50%;background:#FFB300;box-shadow:0 0 10px 3px rgba(255,120,0,.7);animation:rise 4.5s ease-in infinite;pointer-events:none}
.store-inner{position:relative;max-width:980px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:1.4rem;padding:0 var(--gut)}
.store-pill{margin:0;padding:.38rem .9rem;border-radius:999px;border:1px solid rgba(255,140,0,.4);color:#C2410C;font-size:.88rem;font-weight:500}
[data-theme="dark"] .store-pill{color:#FFD27A}
.store-hero h1{margin:0;font:800 clamp(2.6rem,7.5vw,6rem)/.98 var(--display);letter-spacing:-.04em}
.store-hero .lede{margin:0;max-width:640px;font-size:clamp(1rem,1.6vw,1.2rem);color:var(--muted)}
.search{width:100%;max-width:660px;display:flex;align-items:center;gap:.75rem;padding:.45rem .45rem .45rem 1.3rem;border-radius:999px;background:var(--card);border:1px solid var(--line-2);box-shadow:0 20px 50px -30px rgba(0,0,0,.6);transition:border-color .25s,box-shadow .25s}
.search:focus-within{border-color:var(--accent);box-shadow:0 0 0 4px rgba(var(--acc),.18)}
.search svg{width:20px;height:20px;fill:none;stroke:var(--muted);stroke-width:2;stroke-linecap:round}
.search input{flex:1;min-width:0;border:0;background:transparent;color:var(--text);font:inherit;font-size:1rem;padding:.65rem 0}
.search input:focus{outline:none}
.search-count{padding:.7rem 1.15rem;border-radius:999px;background:var(--accent);color:var(--on-accent);font-weight:600;font-size:.9rem;white-space:nowrap}
.store-stats{display:flex;flex-wrap:wrap;justify-content:center;gap:1rem 2.4rem;color:var(--muted);font-size:.9rem}
.store-stats b{font:800 1.4rem var(--display);color:var(--text);margin-right:.25rem}
.spotlight{position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(1.5rem,4vw,2.5rem);padding:clamp(1.25rem,3vw,2.25rem);border-radius:28px;
  background:linear-gradient(135deg,rgba(255,120,0,.1),transparent 55%),var(--card);border:1px solid rgba(255,140,0,.35)}
.spot-media{border-radius:18px;overflow:hidden;background:var(--card-2);border:1px solid var(--line);aspect-ratio:16/10;display:grid;place-items:center;color:var(--dim)}
.spot-media img{width:100%;height:100%;object-fit:cover}
.spot-body{display:flex;flex-direction:column;gap:.9rem}
.spot-badge{align-self:flex-start;padding:.3rem .75rem;border-radius:999px;background:rgba(255,120,0,.16);color:#C2410C;font-size:.82rem;font-weight:600}
[data-theme="dark"] .spot-badge{color:#FFB300}
.spot-body h2{margin:0;font:800 clamp(1.8rem,3.4vw,2.7rem)/1.05 var(--display);letter-spacing:-.03em}
.spot-body p{margin:0;color:var(--muted)}
.spot-feats{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem .9rem;font-size:.92rem}
.spot-feats li::before{content:"";display:inline-block;width:6px;height:6px;border-radius:2px;background:var(--accent);margin-right:.5rem;vertical-align:middle}
.spot-buy{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem;margin-top:auto}
.spot-price{font:800 2rem var(--display);color:var(--accent-2)}[data-theme="dark"] .spot-price{color:var(--accent)}
@media(max-width:860px){.spotlight{grid-template-columns:1fr}}
.chips{display:flex;flex-wrap:wrap;gap:.45rem;margin-bottom:1.5rem}
.chips button{padding:.55rem 1rem;border-radius:999px;border:1px solid var(--line-2);background:transparent;color:var(--muted);font-size:.9rem;transition:all .2s}
.chips button span{opacity:.65;margin-left:.2rem}
.chips button:hover{border-color:var(--accent);color:var(--text)}
.chips button[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.tool-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1rem}
.tool-card{display:flex;flex-direction:column;gap:.55rem;padding:1.3rem;border-radius:20px;background:var(--card);border:1px solid var(--line);text-decoration:none;color:var(--text);min-height:220px;
  transition:border-color .3s,transform .45s var(--ease),box-shadow .45s}
.tool-card:hover{border-color:rgba(255,140,0,.55);transform:translateY(-6px);box-shadow:0 26px 50px -30px rgba(255,120,0,.45)}
.tool-card[hidden]{display:none}
.tool-top{display:flex;justify-content:space-between;align-items:center}
.tool-ico{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;font:800 1.05rem var(--display);background:rgba(var(--acc),.16);color:var(--soft-text);transition:background .3s,color .3s}
.tool-card:hover .tool-ico{background:linear-gradient(135deg,#FF5A1F,#FFB300);color:#140A04}
.tool-cat{font-size:.76rem;color:var(--dim)}
.tool-card h3{margin:.2rem 0 0;font:700 1.12rem/1.25 var(--display)}
.tool-card p{margin:0;color:var(--muted);font-size:.9rem;line-height:1.5;flex:1}
.tool-foot{display:flex;justify-content:space-between;align-items:center;padding-top:.8rem;border-top:1px solid var(--line)}
.tool-go{font-size:.86rem;color:#C2410C;font-weight:600}[data-theme="dark"] .tool-go{color:#FFD27A}
.no-results{padding:2.5rem;text-align:center;color:var(--muted);border:1px dashed var(--line-2);border-radius:var(--r)}
.steps{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.steps li{padding:1.6rem;border-radius:20px;background:var(--card);border:1px solid var(--line)}
.steps b{font:800 2.4rem/1 var(--display);color:var(--accent-2)}[data-theme="dark"] .steps b{color:var(--accent)}
.steps h3{margin:.75rem 0 .35rem;font:700 1.2rem var(--display)}
.steps p{margin:0;color:var(--muted);font-size:.95rem}
@media(max-width:760px){.steps{grid-template-columns:1fr}}
.cta-fire{display:flex;justify-content:space-between;align-items:center;gap:2rem;flex-wrap:wrap;padding:clamp(1.6rem,4vw,3rem);border-radius:28px;
  background:linear-gradient(135deg,rgba(255,120,0,.14),transparent 60%),var(--card);border:1px solid rgba(255,140,0,.35)}
.cta-fire h2{margin:0;font:800 clamp(1.7rem,3.2vw,2.5rem)/1.1 var(--display)}
.cta-fire p{margin:.6rem 0 0;color:var(--muted)}

/* ── Tool detail ── */
.td-hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(1.5rem,4vw,3rem);align-items:start;padding:clamp(1.5rem,4vw,3rem) 0}
.td-gallery{display:flex;flex-direction:column;gap:.75rem}
.td-main{border-radius:20px;overflow:hidden;background:var(--card-2);border:1px solid var(--line);aspect-ratio:16/9;display:grid;place-items:center;color:var(--dim)}
.td-main img{width:100%;height:100%;object-fit:contain;background:#000}
.td-thumbs{display:flex;gap:.5rem;overflow-x:auto;padding-bottom:.3rem}
.td-thumbs button{flex:none;width:96px;aspect-ratio:16/9;padding:0;border-radius:10px;overflow:hidden;border:2px solid transparent;background:var(--card-2)}
.td-thumbs button[aria-current="true"]{border-color:var(--accent)}
.td-thumbs img{width:100%;height:100%;object-fit:cover}
.td-info{display:flex;flex-direction:column;gap:1rem;position:sticky;top:calc(var(--nav) + 20px)}
.td-info h1{margin:0;font:800 clamp(2rem,4vw,3rem)/1.05 var(--display);letter-spacing:-.03em}
.td-info .lede{margin:0;color:var(--muted);font-size:1.05rem}
.td-price{display:flex;align-items:baseline;gap:.8rem;padding:1.1rem 1.25rem;border-radius:18px;background:var(--card);border:1px solid var(--line)}
.td-price b{font:800 2.2rem var(--display);color:var(--accent-2)}[data-theme="dark"] .td-price b{color:var(--accent)}
.td-price span{color:var(--muted);font-size:.9rem}
.td-actions{display:flex;flex-wrap:wrap;gap:.7rem}
.td-feats{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.td-feats li{display:flex;gap:.6rem;align-items:flex-start}
.td-feats svg{width:18px;height:18px;margin-top:.2rem;fill:none;stroke:var(--accent);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.td-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem;font-size:.9rem}
.td-meta div{padding:.8rem 1rem;border-radius:14px;background:var(--card);border:1px solid var(--line)}
.td-meta dt{color:var(--dim);font-size:.78rem}.td-meta dd{margin:0;font-weight:600}
.td-nav{display:flex;justify-content:space-between;gap:1rem;padding:2rem 0 3rem;border-top:1px solid var(--line)}
.td-nav a{display:flex;flex-direction:column;gap:.2rem;max-width:45%;text-decoration:none;color:var(--text)}
.td-nav a small{color:var(--dim)}.td-nav a b{font:700 1.1rem var(--display)}.td-nav a:hover b{color:var(--accent-2)}
.td-nav a.next{text-align:right;margin-left:auto}
@media(max-width:900px){.td-hero{grid-template-columns:1fr}.td-info{position:static}}

/* ── Chat widget ── */
.ai-chat{position:fixed;right:max(1rem,env(safe-area-inset-right));bottom:calc(1rem + env(safe-area-inset-bottom,0px));z-index:350;font-family:var(--text-f)}
.ai-chat-btn{display:flex;align-items:center;gap:.5rem;border:0;border-radius:999px;padding:.8rem 1.15rem;background:var(--accent);color:var(--on-accent);font-weight:600;box-shadow:0 12px 30px -12px var(--glow);transition:transform .3s var(--spring)}
.ai-chat-btn:hover{transform:translateY(-3px)}
.ai-chat-panel{position:absolute;right:0;bottom:calc(100% + .75rem);width:min(380px,calc(100vw - 2rem));height:min(540px,70vh);display:none;flex-direction:column;
  background:var(--bg-2);border:1px solid var(--line-2);border-radius:20px;overflow:hidden;box-shadow:var(--shadow);color:var(--text)}
.ai-chat-panel.open{display:flex;animation:pop .35s var(--ease)}
@keyframes pop{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.chat-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.1rem;border-bottom:1px solid var(--line)}
.chat-header-left{display:flex;gap:.7rem;align-items:center}
.chat-avatar{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:var(--accent);color:var(--on-accent)}
.chat-header-title{font:700 .98rem var(--display)}.chat-header-sub{font-size:.76rem;color:var(--dim)}
.chat-close{background:none;border:0;color:var(--muted)}
.chat-messages{flex:1;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:.65rem}
.chat-msg{display:flex}.chat-msg.user{justify-content:flex-end}
.chat-bubble{max-width:86%;padding:.65rem .85rem;border-radius:14px;font-size:.9rem;line-height:1.5;background:var(--card-2)}
.chat-msg.user .chat-bubble{background:var(--accent);color:var(--on-accent)}
.chat-input-wrap{display:flex;border-top:1px solid var(--line)}
.chat-input-wrap input{flex:1;border:0;background:transparent;color:var(--text);padding:.9rem 1rem;font:inherit;font-size:.92rem}
.chat-input-wrap input:focus{outline:none}
.chat-input-wrap button{border:0;background:var(--accent);color:var(--on-accent);padding:0 1.1rem}
.chat-quick-actions{display:flex;flex-wrap:wrap;gap:.35rem;padding:.6rem 1rem}
.chat-quick-actions button{background:none;border:1px solid var(--line-2);border-radius:999px;padding:.3rem .65rem;font-size:.76rem;color:var(--muted)}
.chat-tool-card{display:block;padding:.5rem .6rem;border-radius:10px;border:1px solid var(--line-2);text-decoration:none;margin-top:.35rem}
.chat-tool-name{font-weight:600;font-size:.85rem}.chat-tool-price,.chat-tool-cat{font-size:.74rem;color:var(--dim)}
@media(max-width:600px){.chat-btn-text{display:none}.ai-chat-btn{padding:.85rem}}

/* ── Shared enter animation for filtered items ── */
.is-entering{animation:pop .55s var(--ease) both;animation-delay:calc(var(--i,0) * 35ms)}

/* ── Reduced motion ── */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .enter,.hero-title .enter,.reveal,.chip,.id-card{opacity:1!important;transform:none!important}
  .stack-card{position:relative;top:auto}
}
.more-row{display:flex;justify-content:center;margin-top:2rem}
.more-row[hidden]{display:none}

/* ═══ v9 additions ═══ */

/* animated IM logo (original ring, more presence) */
.logo-mark{position:relative;width:44px;height:44px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;flex:none;
  font:800 .82rem/1 var(--display);letter-spacing:-.04em;color:var(--accent);background:var(--card);isolation:isolate;
  animation:logoSpin 8s ease-in-out infinite,logoPulse 3s ease-in-out infinite}
[data-theme="light"] .logo-mark{color:#7A5D00}
.logo-mark::before{content:"";position:absolute;inset:-2px;border-radius:50%;z-index:-1;padding:2px;
  background:conic-gradient(from 0deg,var(--accent),#FFF1B8,var(--accent) 35%,rgba(var(--acc),.25) 60%,var(--accent));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:logoSweep 3.2s linear infinite}
.logo-mark::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:1px solid var(--accent);opacity:0;animation:logoRing 3s ease-in-out infinite}
.logo-i,.logo-m{display:inline-block;animation:logoLetter 3s ease-in-out infinite}
.logo-m{animation-delay:.25s}
.brand:hover .logo-mark{animation-duration:1.6s,1.5s}
@keyframes logoSpin{0%,100%{transform:rotate(0)}25%{transform:rotate(6deg)}50%{transform:rotate(0)}75%{transform:rotate(-6deg)}}
@keyframes logoPulse{0%,100%{box-shadow:0 0 0 0 rgba(var(--acc),.0)}50%{box-shadow:0 0 18px 4px rgba(var(--acc),.35)}}
@keyframes logoRing{0%,100%{opacity:0;transform:scale(1)}50%{opacity:.7;transform:scale(1.22)}}
@keyframes logoSweep{to{transform:rotate(360deg)}}
@keyframes logoLetter{0%,70%,100%{transform:translateY(0)}35%{transform:translateY(-2px)}}
.footer .logo-mark{width:38px;height:38px}

/* page background: dot grid + drifting light (stronger in light mode) */
.page-bg{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.page-bg::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.07) 1px,transparent 1.2px);background-size:26px 26px;
  -webkit-mask-image:radial-gradient(120% 90% at 50% 0%,#000 30%,transparent 85%);mask-image:radial-gradient(120% 90% at 50% 0%,#000 30%,transparent 85%)}
[data-theme="light"] .page-bg::before{background-image:radial-gradient(rgba(17,19,24,.13) 1px,transparent 1.2px)}
.blob{position:absolute;border-radius:50%;filter:blur(70px);opacity:.16;animation:drift 24s ease-in-out infinite alternate}
.b1{width:46vw;height:46vw;left:-12vw;top:-8vw;background:rgba(var(--acc),.9)}
.b2{width:38vw;height:38vw;right:-10vw;top:28vh;background:#FF9A3C;animation-duration:30s;animation-delay:-8s}
.b3{width:34vw;height:34vw;left:30vw;bottom:-14vw;background:#F5D67B;animation-duration:36s;animation-delay:-16s}
[data-theme="light"] .blob{opacity:.34}
[data-theme="dark"] .blob{opacity:.09}
@keyframes drift{0%{transform:translate(0,0) scale(1)}50%{transform:translate(6vw,4vh) scale(1.12)}100%{transform:translate(-4vw,8vh) scale(.95)}}
.bg-glow{display:none}

/* custom cursor (mouse only) */
.cursor{position:fixed;left:0;top:0;z-index:1000;pointer-events:none;width:26px;height:26px;margin:-4px 0 0 -4px;opacity:0;transition:opacity .2s}
.cursor svg{position:absolute;inset:0;width:26px;height:26px;transition:opacity .15s,transform .2s var(--spring)}
.cur-arrow{fill:var(--text);stroke:var(--bg);stroke-width:1.2;stroke-linejoin:round;transform-origin:4px 2px}
.cur-hand,.cur-grab{fill:var(--card);stroke:var(--text);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;opacity:0}
html.has-cursor,html.has-cursor *{cursor:none!important}
html.has-cursor input,html.has-cursor textarea,html.has-cursor [contenteditable]{cursor:text!important}
html.has-cursor .cursor{opacity:1}
.cursor.on-link .cur-arrow{fill:var(--accent);transform:scale(1.25)}
.cursor.on-card .cur-arrow,.cursor.dragging .cur-arrow{opacity:0}
.cursor.on-card .cur-hand{opacity:1}
.cursor.dragging .cur-hand{opacity:0}.cursor.dragging .cur-grab{opacity:1;transform:scale(.92)}
.cursor.on-text{opacity:0}

/* hero tool chips — outer = physics (translate/rotate), inner = float */
.chip{position:absolute;z-index:3;opacity:0;scale:.8;transition:opacity .6s var(--ease),scale .7s var(--spring);will-change:translate,rotate}
.chip-in{display:inline-flex;align-items:center;gap:.42rem;padding:.38rem .7rem;border-radius:999px;font-size:.76rem;font-weight:500;white-space:nowrap;
  background:var(--card);border:1px solid var(--line-2);box-shadow:0 12px 30px -16px rgba(0,0,0,.6)}
.chip-in::before{content:"";width:9px;height:9px;border-radius:3px;background:var(--c);box-shadow:0 0 10px var(--c)}
body.is-ready .chip{opacity:1;scale:1}
body.is-ready .chip-in{animation:float 6s ease-in-out infinite}
.chip:nth-child(odd) .chip-in{animation-duration:7s;animation-direction:reverse}
.chip-1{left:-12px;top:10%}.chip-4{left:6px;top:28%}.chip-6{left:-12px;top:46%}.chip-8{left:6px;top:64%}.chip-10{left:-12px;top:82%}
.chip-2{right:-12px;top:4%}.chip-3{right:6px;top:20%}.chip-5{right:-12px;top:36%}.chip-7{right:6px;top:52%}.chip-9{right:-12px;top:68%}.chip-11{right:6px;top:84%}
.chip-1{transition-delay:.85s}.chip-2{transition-delay:.9s}.chip-3{transition-delay:.95s}.chip-4{transition-delay:1s}.chip-5{transition-delay:1.05s}.chip-6{transition-delay:1.1s}
.chip-7{transition-delay:1.15s}.chip-8{transition-delay:1.2s}.chip-9{transition-delay:1.25s}.chip-10{transition-delay:1.3s}.chip-11{transition-delay:1.35s}
@media(max-width:980px){.chip-in{font-size:.72rem}}
@media(max-width:600px){.chip-4,.chip-6,.chip-7,.chip-8,.chip-9,.chip-11{display:none}.chip-in{padding:.3rem .55rem}}

/* running publisher band */
.marquee{display:flex;align-items:center;gap:2rem;margin-top:2.2rem;padding:1.15rem 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden}
.marquee-label{flex:none;margin:0;font-size:.86rem;color:var(--dim);white-space:nowrap}
.marquee-track{flex:1;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.marquee-run{display:flex;width:max-content;animation:marq 40s linear infinite}
.marquee:hover .marquee-run{animation-play-state:paused}
.marquee ul{display:flex;gap:3rem;margin:0;padding:0 1.5rem 0 0;list-style:none}
.marquee li{font:700 1.15rem var(--display);color:var(--muted);white-space:nowrap;transition:color .2s}
.marquee li:hover{color:var(--accent-2)}
@keyframes marq{to{transform:translateX(-50%)}}
@media(max-width:700px){.marquee{flex-direction:column;align-items:flex-start;gap:.6rem}.marquee-track{width:100%}}

/* stack card → folder */
.stack-acts{margin-top:auto;display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap}
a.stack-img{position:relative;text-decoration:none}
.stack-img img{transition:transform .8s var(--ease)}
a.stack-img:hover img{transform:scale(1.025)}
.stack-hint{position:absolute;right:14px;bottom:14px;padding:.4rem .8rem;border-radius:999px;background:var(--accent);color:var(--on-accent);font-size:.82rem;font-weight:600;
  opacity:0;transform:translateY(8px);transition:opacity .3s,transform .4s var(--ease)}
a.stack-img:hover .stack-hint,a.stack-img:focus-visible .stack-hint{opacity:1;transform:none}

/* folder sections with scroll strip */
.folder-sec{padding-top:clamp(2.5rem,5vw,4rem);padding-bottom:clamp(2.5rem,5vw,4rem)}
.folder-sec .head{margin-bottom:1.4rem}
.strip-wrap{position:relative}
.strip{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:.4rem .1rem 1rem;scrollbar-width:thin}
.strip::-webkit-scrollbar{height:6px}.strip::-webkit-scrollbar-thumb{background:var(--line-2);border-radius:3px}
.strip-item{flex:none;width:clamp(240px,30vw,400px);scroll-snap-align:start;display:flex;flex-direction:column;gap:.6rem;text-decoration:none;color:var(--text)}
.strip-item img{width:100%;aspect-ratio:16/10.5;object-fit:cover;border-radius:16px;border:1px solid var(--line);background:var(--card-2);transition:transform .6s var(--ease),border-color .3s,box-shadow .4s}
.strip-item:hover img{transform:translateY(-6px);border-color:rgba(var(--acc),.6);box-shadow:0 26px 50px -30px var(--glow)}
.strip-item span{font:600 .95rem var(--display);color:var(--muted)}
.strip-more{justify-content:center;align-items:center;aspect-ratio:16/10.5;height:auto;border-radius:16px;border:1px dashed var(--line-2);background:var(--card);width:clamp(200px,22vw,280px)}
.strip-more b{font:800 2.2rem var(--display);color:var(--accent-2)}[data-theme="dark"] .strip-more b{color:var(--accent)}
.strip-more span{font:500 .88rem var(--text-f);text-align:center;padding:0 1rem}
.strip-btn{position:absolute;top:calc(50% - 30px);width:46px;height:46px;border-radius:50%;border:1px solid var(--line-2);background:var(--card);color:var(--text);display:grid;place-items:center;
  box-shadow:0 10px 30px -14px rgba(0,0,0,.6);transition:transform .3s var(--spring),background .2s}
.strip-btn:hover{background:var(--accent);color:var(--on-accent);transform:scale(1.08)}
.strip-btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.strip-btn.prev{left:-18px}.strip-btn.next{right:-18px}
@media(max-width:700px){.strip-btn{display:none}}

/* highlighted AI tools block */
.ai-hl{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(1.5rem,4vw,3rem);align-items:center;
  padding:clamp(1.6rem,4.5vw,3.5rem);border-radius:32px;border:2px solid transparent;
  background:linear-gradient(135deg,rgba(255,120,0,.12),transparent 55%) padding-box,linear-gradient(var(--card),var(--card)) padding-box,
             linear-gradient(90deg,#FF3D00,#FF9100,#FFD54F,#FF9100,#FF3D00) border-box;background-size:auto,auto,200% 100%;
  animation:hlBorder 4s linear infinite;box-shadow:0 30px 80px -40px rgba(255,120,0,.55)}
@keyframes hlBorder{0%{background-position:0 0,0 0,0% 50%}100%{background-position:0 0,0 0,200% 50%}}
.ai-hl-copy{position:relative;z-index:1;display:flex;flex-direction:column;align-items:flex-start;gap:1rem}
.ai-hl h2{margin:0;font:800 clamp(2.2rem,4.6vw,3.6rem)/1.02 var(--display);letter-spacing:-.035em}
.ai-hl .head-sub{margin:0}
.ai-hl-cta{display:flex;flex-wrap:wrap;align-items:center;gap:1.2rem;margin:.6rem 0 0}
.ai-hl-count{color:var(--muted);font-size:.92rem}.ai-hl-count b{font:800 1.3rem var(--display);color:var(--text)}
.ai-hl .teaser-grid{position:relative;z-index:1}
.ai-hl .mini-tool{background:var(--bg);border:1px solid rgba(255,140,0,.28)}
.ai-hl .mini-tool:hover{border-color:#FF9100;box-shadow:0 18px 40px -24px rgba(255,120,0,.6)}
@media(max-width:860px){.ai-hl{grid-template-columns:1fr}}

/* timeline: circles animate after they light up */
.timeline li::after{content:"";position:absolute;left:calc(-3rem - 7px);top:-7px;width:46px;height:46px;border-radius:50%;border:2px dashed rgba(var(--acc),.0);pointer-events:none;transition:border-color .4s}
.timeline li.is-on::after{border-color:rgba(var(--acc),.75);animation:ringSpin 7s linear infinite}
.timeline li.is-on::before{animation:stepPop .6s var(--spring),stepGlow 2.6s 0.6s ease-in-out infinite}
@keyframes ringSpin{to{transform:rotate(360deg)}}
@keyframes stepPop{0%{transform:scale(.6)}60%{transform:scale(1.22)}100%{transform:scale(1.08)}}
@keyframes stepGlow{0%,100%{box-shadow:0 0 0 6px rgba(var(--acc),.15),0 0 0 0 rgba(var(--acc),.35)}50%{box-shadow:0 0 0 6px rgba(var(--acc),.15),0 0 0 14px rgba(var(--acc),0)}}

/* tool cards + other cards: visible borders */
.tool-card{border:1px solid rgba(var(--acc),.28)}
.tool-card:hover{border-color:#FF9100}
.mini-tool,.script-card,.tile,.folder-mini,.other,.resume-card,.steps li{border-color:rgba(var(--acc),.2)}

/* parachute download (from the example video) */
.resume-card{flex-wrap:wrap}
.resume-actions{display:flex;gap:1.6rem;margin-left:auto;align-items:flex-start}
.para{position:relative;width:64px;height:84px;display:block;text-decoration:none;color:var(--accent);outline-offset:6px}
.para-ring{position:absolute;left:4px;top:0;width:56px;height:56px;border-radius:50%;border:3px solid currentColor;transition:all .45s var(--ease)}
.para-bar{position:absolute;left:-46px;top:26px;width:156px;height:3px;border-radius:3px;background:rgba(var(--acc),.25);opacity:0;overflow:hidden;transition:opacity .2s}
.para-bar i{position:absolute;inset:0 auto 0 0;width:0;background:currentColor;border-radius:3px}
.para-arrow{position:absolute;left:20px;top:14px;width:24px;height:28px;transition:transform .5s var(--spring)}
.para-arrow .arr{position:absolute;left:0;bottom:0;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;transition:transform .45s var(--spring)}
.para-arrow .chute{position:absolute;left:0;top:-14px;width:24px;height:12px;fill:none;stroke:currentColor;stroke-width:1.6;opacity:0;transform:scale(.2);transform-origin:50% 100%;transition:all .4s var(--spring)}
.para-ok{position:absolute;left:18px;top:6px;width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-dasharray:24;stroke-dashoffset:24;opacity:0}
.para-pct{position:absolute;left:-20px;right:-20px;top:36px;text-align:center;font:600 .74rem var(--text-f);color:var(--muted);opacity:0}
.para-label{position:absolute;left:-10px;right:-10px;top:62px;text-align:center;font:600 .82rem var(--text-f);color:var(--text)}
.para:hover .para-ring{box-shadow:0 0 0 6px rgba(var(--acc),.15),0 0 20px var(--glow)}
.para.is-run .para-ring{left:-46px;top:26px;width:156px;height:3px;border-radius:3px;border-width:0;background:transparent}
.para.is-run .para-bar{opacity:1}
.para.is-run .para-arrow{transform:translateY(-34px)}
.para.is-run .para-arrow .arr{transform:rotate(180deg)}
.para.is-run .para-arrow .chute{opacity:1;transform:scale(1)}
.para.is-run .para-pct{opacity:1}
.para.is-done .para-arrow{opacity:0;transition:opacity .2s}
.para.is-done .para-ok{opacity:1;animation:tick .5s var(--ease) forwards;top:-14px}
.para.is-done .para-label{color:var(--ok)}
@media(max-width:520px){.resume-actions{margin:0 auto;gap:3.4rem;padding:0 3rem}}

/* AI tools: comet tab change (from the example video, in gold) */
.cat-tabs{position:relative;display:flex;gap:.25rem;overflow-x:auto;padding:.3rem .2rem 1.1rem;margin-bottom:1.4rem;scrollbar-width:none;border-bottom:1px solid var(--line)}
.cat-tabs::-webkit-scrollbar{display:none}
.cat-tabs button{position:relative;flex:none;background:transparent;border:0;padding:.55rem 1rem;border-radius:10px;font:500 .95rem var(--text-f);color:var(--muted);transition:color .25s,text-shadow .25s,background .25s}
.cat-tabs button span{opacity:.6;margin-left:.25rem;font-size:.8em}
.cat-tabs button:hover{color:var(--text);background:rgba(var(--acc),.1);text-shadow:0 0 12px rgba(var(--acc),.7)}
.cat-tabs button[aria-pressed="true"]{color:var(--accent-2)}[data-theme="dark"] .cat-tabs button[aria-pressed="true"]{color:var(--accent)}
.comet{position:absolute;bottom:.55rem;left:0;height:3px;width:40px;border-radius:3px;background:var(--accent);box-shadow:0 0 12px 2px var(--glow);pointer-events:none}
.comet::after{content:"";position:absolute;right:-6px;top:-3px;width:9px;height:9px;border-radius:50%;background:#FFF1B8;box-shadow:0 0 14px 6px rgba(255,200,80,.8);opacity:0;transition:opacity .2s}
.comet.is-flying{background:linear-gradient(90deg,transparent,rgba(var(--acc),.4) 30%,#FFD54F 85%,#FFF1B8);box-shadow:0 0 22px 4px rgba(255,170,40,.6)}
.comet.is-flying::after{opacity:1}
.comet.rev.is-flying{background:linear-gradient(270deg,transparent,rgba(var(--acc),.4) 30%,#FFD54F 85%,#FFF1B8)}
.comet.rev::after{right:auto;left:-6px}

/* nav: more menu */
.nav-more{position:relative;z-index:2}
.nav-more summary{list-style:none;padding:.45rem .85rem;border-radius:999px;font-size:.9rem;color:var(--muted);cursor:pointer}
.nav-more summary::-webkit-details-marker{display:none}
.nav-more summary::after{content:" ▾";font-size:.75em}
.nav-more[open] summary{color:var(--text)}
.nav-more-menu{position:absolute;top:calc(100% + .6rem);left:0;min-width:200px;padding:.4rem;border-radius:14px;background:var(--bg-2);border:1px solid var(--line-2);box-shadow:var(--shadow);display:flex;flex-direction:column}
.nav-more-menu a{display:flex;justify-content:space-between;color:var(--text)!important}
.nav-more-menu a span{color:var(--dim)}
@media(max-width:980px){.nav-more summary{font:600 1.2rem var(--display);padding:.75rem 1rem;color:var(--text)}.nav-more-menu{position:static;box-shadow:none;border:0;background:transparent}}
@media(max-width:1180px){.nav a{padding:.45rem .65rem;font-size:.86rem}}

@media(prefers-reduced-motion:reduce){.blob,.marquee-run,.logo-mark,.logo-mark::before,.logo-mark::after{animation:none!important}.cursor{display:none}}
.chips.cat-tabs{flex-wrap:nowrap}
.cat-tabs button,.cat-tabs button:hover{border:0}
.cat-tabs button[aria-pressed="true"]{background:transparent;text-shadow:0 0 14px rgba(var(--acc),.55)}
/* nav: never wrap labels */
.nav a,.nav-more summary{white-space:nowrap}
.brand-name{white-space:nowrap}
@media(max-width:1420px){.nav-row .brand-name{display:none}}
/* parachute: bar runs to the right, sibling hides while running */
.para-bar{left:4px;width:150px}
.para.is-run .para-ring{left:4px;width:150px}
.para-pct{left:4px;right:auto;width:150px}
.para.is-run .para-arrow{transform:translate(55px,-34px)}
.para.is-done .para-ok{left:65px}
.para.is-run .para-label{opacity:0}
.resume-actions:has(.para.is-run) .para:not(.is-run){opacity:0;pointer-events:none;transition:opacity .2s}
.resume-actions{min-width:160px}

/* ═══ v10 ═══ */

/* comet: same flame as the fire buttons, deeper and smoother */
.comet{height:3px;bottom:.5rem;background:linear-gradient(90deg,#FF3D00,#FF9100,#FFD54F);box-shadow:0 0 14px 2px rgba(255,120,0,.55),0 0 2px rgba(255,61,0,.9)}
.comet::after{background:#FFE7A3;box-shadow:0 0 16px 7px rgba(255,145,0,.85)}
.comet.is-flying{background:linear-gradient(90deg,rgba(255,61,0,0),#FF3D00 25%,#FF9100 70%,#FFD54F);box-shadow:0 0 26px 6px rgba(255,110,0,.55)}
.comet.rev.is-flying{background:linear-gradient(270deg,rgba(255,61,0,0),#FF3D00 25%,#FF9100 70%,#FFD54F)}
.cat-tabs button:hover{background:rgba(255,145,0,.1);text-shadow:0 0 12px rgba(255,145,0,.6)}
.cat-tabs button[aria-pressed="true"]{color:#C2410C;text-shadow:0 0 14px rgba(255,120,0,.45)}
[data-theme="dark"] .cat-tabs button[aria-pressed="true"]{color:#FFC14D}

/* ─ light mode: glass cards so the moving light shows through ─ */
[data-theme="light"]{--card:rgba(255,255,255,.62);--card-2:rgba(233,235,239,.8);--line:rgba(17,19,24,.1);--bg-2:rgba(255,255,255,.55)}
[data-theme="light"] .tile,[data-theme="light"] .stack-card,[data-theme="light"] .contact-card,[data-theme="light"] .stats,
[data-theme="light"] .resume-card,[data-theme="light"] .script-card,[data-theme="light"] .mini-tool,[data-theme="light"] .tool-card,
[data-theme="light"] .spotlight,[data-theme="light"] .cf-info,[data-theme="light"] .steps li,[data-theme="light"] .other,
[data-theme="light"] .fd-panel,[data-theme="light"] .ai-hl,[data-theme="light"] .nav,[data-theme="light"] .theme-toggle,[data-theme="light"] .search{
  -webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4);box-shadow:0 18px 50px -32px rgba(120,80,0,.35)}
[data-theme="light"] .ai-hl{background:linear-gradient(135deg,rgba(255,140,0,.1),rgba(255,255,255,.5) 55%) padding-box,linear-gradient(90deg,#FF3D00,#FF9100,#FFD54F,#FF9100,#FF3D00) border-box;background-size:auto,200% 100%}
[data-theme="light"] .page-bg::before{background-image:radial-gradient(rgba(122,93,0,.22) 1.1px,transparent 1.3px);background-size:24px 24px}
[data-theme="light"] .blob{opacity:.55;filter:blur(60px)}
[data-theme="light"] .b1{background:#F2C94C}
[data-theme="light"] .b2{background:#FF9F5A}
[data-theme="light"] .b3{background:#FFC6A8}
.b4{width:30vw;height:30vw;right:20vw;top:-10vw;background:rgba(var(--acc),.8);animation-duration:28s;animation-delay:-4s}
[data-theme="light"] .b4{background:#FFE08A;opacity:.6}
.page-bg::after{content:"";position:absolute;inset:-50%;background:conic-gradient(from 0deg at 50% 50%,transparent 0 20%,rgba(var(--acc),.05) 25%,transparent 32% 70%,rgba(255,150,60,.05) 76%,transparent 82%);animation:sweep 40s linear infinite}
[data-theme="light"] .page-bg::after{background:conic-gradient(from 0deg at 50% 50%,transparent 0 18%,rgba(242,201,76,.22) 25%,transparent 34% 66%,rgba(255,159,90,.2) 75%,transparent 84%)}
@keyframes sweep{to{transform:rotate(360deg)}}
[data-theme="light"] .section-band{background:rgba(255,255,255,.35)}
[data-theme="light"] .kicker::before{box-shadow:0 0 10px rgba(184,150,12,.6)}
[data-theme="light"] .head h2,[data-theme="light"] .hero-title{text-shadow:0 1px 0 rgba(255,255,255,.6)}

/* ─ Pages I'm proud of: one card per root folder ─ */
a.stack-card{text-decoration:none;color:var(--text);cursor:pointer;transition:border-color .3s,box-shadow .4s}
a.stack-card:hover{border-color:rgba(var(--acc),.6);box-shadow:0 -20px 60px -30px rgba(0,0,0,.6),0 30px 70px -40px var(--glow)}
.stack-text h3{font-size:clamp(2rem,3.6vw,3rem)}
.stack-subs{list-style:none;margin:.2rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem}
.stack-subs li{font-size:.8rem;padding:.28rem .7rem;border-radius:999px;background:rgba(var(--acc),.15);color:var(--soft-text)}
.stack-meta{display:flex;gap:2rem;margin:.6rem 0 0}
.stack-meta div{display:flex;flex-direction:column-reverse}
.stack-meta dt{font-size:.78rem;color:var(--dim)}.stack-meta dd{margin:0;font:800 1.5rem var(--display)}
.stack-open{margin-top:auto;align-self:flex-start;pointer-events:none}
a.stack-card:hover .stack-open svg{transform:translateX(4px)}
.stack-collage{position:relative;display:grid;gap:.7rem;border-radius:16px;overflow:hidden;min-height:260px}
.stack-collage img{width:100%;height:100%;object-fit:cover;border-radius:14px;background:var(--card-2);transition:transform .8s var(--ease)}
.stack-collage.n1{grid-template-columns:1fr}
.stack-collage.n2{grid-template-columns:1fr 1fr}
.stack-collage.n3{grid-template-columns:1.4fr 1fr;grid-template-rows:1fr 1fr}
.stack-collage.n3 img:first-child{grid-row:1 / span 2}
a.stack-card:hover .stack-collage img{transform:scale(1.03)}
.stack-collage .stack-hint{right:14px;bottom:14px}
a.stack-card:hover .stack-hint{opacity:1;transform:none}
.stack-empty{display:grid;place-items:center;text-align:center;padding:2rem;color:var(--muted);border:1px dashed var(--line-2);border-radius:14px}
.stack-card{max-height:calc(100vh - var(--nav) - 60px)}
@media(max-width:800px){.stack-collage{min-height:200px}.stack-meta{gap:1.2rem}.stack-card{max-height:none}}

/* folder page section tabs */
.sub-tabs{margin-top:1.4rem;margin-bottom:0;border-bottom:0}

/* FlowDesk */
.fd-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.75rem;margin:0 0 1.6rem}
.fd-stats div{display:flex;flex-direction:column-reverse;padding:1rem 1.2rem;border-radius:16px;background:var(--card);border:1px solid rgba(var(--acc),.2)}
.fd-stats dd{margin:0;font:800 1.7rem var(--display);color:var(--accent-2)}[data-theme="dark"] .fd-stats dd{color:var(--accent)}
.fd-stats dt{font-size:.82rem;color:var(--dim)}
.fd-tabs{margin-bottom:1.2rem}
.fd-panel{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(1.25rem,3vw,2.25rem);padding:clamp(1rem,2.5vw,1.75rem);border-radius:24px;background:var(--card);border:1px solid rgba(var(--acc),.22);animation:pop .45s var(--ease)}
.fd-panel[hidden]{display:none}
.fd-media .work-open{all:unset;display:block;cursor:zoom-in;border-radius:16px;overflow:hidden}
.fd-media img{width:100%;border-radius:16px;border:1px solid var(--line)}
.fd-ph{aspect-ratio:16/10;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3rem;border-radius:16px;border:1px dashed var(--line-2);color:var(--muted)}
.fd-ph b{font:800 1.4rem var(--display);color:var(--text)}
.fd-body{display:flex;flex-direction:column;gap:.9rem}
.fd-body h3{margin:0;font:800 1.7rem var(--display)}
.fd-body p{margin:0;color:var(--muted)}
.fd-body .btn{align-self:flex-start;margin-top:auto}
@media(max-width:860px){.fd-panel{grid-template-columns:1fr}}

/* language menu */
.lang{position:relative}
.lang-btn{display:flex;align-items:center;gap:.35rem;padding:.42rem .6rem;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--muted);font-size:.76rem;font-weight:600}
.lang-btn:hover,.lang-btn[aria-expanded="true"]{color:var(--text);border-color:rgba(var(--acc),.5)}
.lang-btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6}
.lang-menu{position:absolute;right:0;top:calc(100% + .5rem);z-index:120;list-style:none;margin:0;padding:.4rem;width:200px;max-height:360px;overflow:auto;border-radius:14px;background:var(--bg);border:1px solid var(--line-2);box-shadow:var(--shadow);animation:pop .25s var(--ease)}
.lang-menu[hidden]{display:none}
.lang-menu button{width:100%;text-align:left;border:0;background:transparent;color:var(--text);padding:.5rem .7rem;border-radius:9px;font-size:.9rem}
.lang-menu button:hover,.lang-menu button[aria-current="true"]{background:rgba(var(--acc),.15);color:var(--accent-2)}
[data-theme="dark"] .lang-menu button[aria-current="true"]{color:var(--accent)}
/* hide Google Translate chrome */
.goog-te-banner-frame,.skiptranslate>iframe,#goog-gt-tt,.goog-te-balloon-frame,.VIpgJd-ZVi9od-ORHb-OEVmcd{display:none!important}
body{top:0!important}
font[style*="background-color"]{background:none!important;box-shadow:none!important}
@media(max-width:560px){.lang-btn span{display:none}}
[data-theme="light"] .id-card{background:#FFFFFF}
[data-theme="light"] .ai-chat-panel,[data-theme="light"] .nav-more-menu{background:#FFFFFF}
@media(max-width:980px){[data-theme="light"] .nav{background:#FFFFFF}}
/* compact icon theme toggle */
.theme-toggle button{display:grid;place-items:center;width:30px;height:30px;padding:0}
.theme-toggle svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.theme-toggle button[data-theme-set="dark"][aria-pressed="true"] svg{fill:currentColor}
@media(max-width:1600px){.nav-row .brand-name{display:none}}
/* light: stacked cards stay solid so the card underneath never shows through */
[data-theme="light"] .stack-card{background:linear-gradient(160deg,#FFFFFF,#FBF7EC);-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:0 -18px 50px -30px rgba(120,80,0,.35),0 24px 60px -36px rgba(120,80,0,.35)}
/* light: calmer AI block so the flame text reads */
[data-theme="light"] .ai-hl{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  background:linear-gradient(135deg,rgba(255,170,80,.16),rgba(255,255,255,.88) 45%) padding-box,linear-gradient(90deg,#FF3D00,#FF9100,#FFD54F,#FF9100,#FF3D00) border-box;background-size:auto,200% 100%}
[data-theme="light"] .flametext{background-image:linear-gradient(90deg,#B4380A,#D9640A,#A86A00,#D9640A,#B4380A)}

/* ═══ v11 (final edits) ═══ */
/* no stray line under tab rows; comet flight is solid flame end to end */
.cat-tabs{border-bottom:0!important}
.comet.is-flying,.comet.rev.is-flying{background:linear-gradient(90deg,#FF3D00,#FF9100,#FFD54F)}
.comet.rev.is-flying{background:linear-gradient(270deg,#FF3D00,#FF9100,#FFD54F)}
/* scrollable tab rows with arrows (FlowDesk, categories, folder sections) */
.tabs-scroll{position:relative;margin-bottom:1.2rem}
.tabs-scroll .cat-tabs{margin-bottom:0;scroll-behavior:smooth}
.tabs-scroll.has-left .cat-tabs{-webkit-mask-image:linear-gradient(90deg,transparent,#000 64px);mask-image:linear-gradient(90deg,transparent,#000 64px)}
.tabs-scroll.has-right .cat-tabs{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 64px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 64px),transparent)}
.tabs-scroll.has-left.has-right .cat-tabs{-webkit-mask-image:linear-gradient(90deg,transparent,#000 64px,#000 calc(100% - 64px),transparent);mask-image:linear-gradient(90deg,transparent,#000 64px,#000 calc(100% - 64px),transparent)}
.ts-btn{position:absolute;top:.35rem;z-index:3;width:38px;height:38px;border-radius:50%;border:1px solid var(--line-2);background:var(--bg);color:var(--text);display:none;place-items:center;box-shadow:0 8px 24px -10px rgba(0,0,0,.6);transition:transform .25s var(--spring),border-color .2s}
.ts-btn:hover{border-color:#FF9100;transform:scale(1.08)}
.ts-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.ts-btn.l{left:-6px}.ts-btn.r{right:-6px}
.tabs-scroll.has-left .ts-btn.l,.tabs-scroll.has-right .ts-btn.r{display:grid}
/* FlowDesk slide thumbnails */
.fd-thumbs{display:flex;gap:.5rem;overflow-x:auto;padding:.6rem 0 .2rem}
.fd-thumbs button{flex:none;width:92px;aspect-ratio:16/9;padding:0;border-radius:9px;overflow:hidden;border:2px solid transparent;background:var(--card-2)}
.fd-thumbs button[aria-current="true"]{border-color:#FF9100}
.fd-thumbs img{width:100%;height:100%;object-fit:cover}
/* translated pages: let long lines wrap instead of being cut */
html.translated .rot-line{white-space:normal}
html.translated .hero-title .mask{overflow:visible}

/* script cards: guide slides as picture + "How to use" */
.script-thumb{position:relative;display:block;width:100%;padding:0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--card-2);cursor:zoom-in;margin-bottom:.3rem}
.script-thumb img{width:100%;aspect-ratio:16/9;object-fit:cover;transition:transform .6s var(--ease)}
.script-thumb span{position:absolute;left:10px;bottom:10px;padding:.3rem .65rem;border-radius:999px;background:var(--accent);color:var(--on-accent);font-size:.78rem;font-weight:600;opacity:.92}
.script-thumb:hover img{transform:scale(1.03)}
.script-foot .link{font-size:.9rem}

.script-card p,.script-card h3{overflow-wrap:anywhere}
