/* Glitch Studios — store + docs. Visual language from glitch-uiElements. */
@import url("https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@1,700;1,800&family=Figtree:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap");

:root{
  --bg:#0c0a10; --s1:#141118; --s2:#1b1720; --s3:#241f2b;
  --line:rgba(255,255,255,.07); --line2:rgba(255,255,255,.13);
  --pr:#c04cff; --pr-h:#cf70ff; --pr-rgb:192,76,255; --pr-ink:#140620; --title:#d9a8ff;
  --key:#f1e9fb; --ink:#1f0a33;
  --tx:#f4f1f8; --tx2:#cfc8d9; --mu:#a99bb8; --dim:#7d7289;
  --ok:#36f1a0; --bad:#ff5a76; --warn:#ffa04d; --info:#59b8ff;
  --cond:"Barlow Condensed",sans-serif; --sans:Figtree,"Segoe UI",system-ui,sans-serif; --mono:"JetBrains Mono",ui-monospace,monospace;
  --r:8px; --w:1200px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-padding-top:84px}
body{background:var(--bg);color:var(--tx);font:15px/1.6 var(--sans);-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;flex-direction:column}
main{flex:1}
a{color:inherit;text-decoration:none}
button,input{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer}
img{max-width:100%;display:block}
:focus-visible{outline:2px solid var(--pr);outline-offset:2px;border-radius:4px}
.wrap{max-width:var(--w);margin:0 auto;padding:0 28px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* type */
.cap{font-family:var(--cond);font-style:italic;font-weight:800;text-transform:uppercase;letter-spacing:.005em;line-height:.95}
.cap em{font-style:italic;color:var(--pr)}
.eyebrow{font:600 12px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--mu)}
.mono{font-family:var(--mono);font-size:12.5px;color:var(--mu)}

/* title tag: purple block + dark block (in-game window titles) */
.tt{display:inline-flex;align-items:stretch;border-radius:5px;overflow:hidden;font:italic 800 16px/1 var(--cond);text-transform:uppercase;letter-spacing:.02em}
.tt>*{display:flex;align-items:center;gap:6px;padding:6px 10px}
.tt>b{background:var(--pr);color:#fff}
.tt>span{background:var(--s3);color:#fff}

/* buttons — keycap + label, like the in-game key hints */
.btn{display:inline-flex;align-items:stretch;height:42px;border-radius:6px;overflow:hidden;font:600 14px/1 var(--sans);white-space:nowrap;transition:filter .15s,transform .15s}
.btn>span{display:flex;align-items:center;gap:8px;padding:0 16px;background:var(--s3);color:var(--tx)}
.btn>kbd{display:flex;align-items:center;justify-content:center;min-width:34px;padding:0 8px;background:var(--key);color:var(--ink);font:700 13px var(--sans)}
.btn.pri>span{background:var(--pr);color:#fff}
.btn:hover{filter:brightness(1.12)}
.btn:active{transform:translateY(1px)}
.btn.sm{height:34px;font-size:13px}
.btn.sm>span{padding:0 12px}
.btn.sm>kbd{min-width:28px}
.btn.block{display:flex;width:100%}
.btn.block>span{flex:1;justify-content:center}
.btn[aria-disabled=true]{pointer-events:none;opacity:.55}
.link{color:var(--title);border-bottom:1px solid rgba(var(--pr-rgb),.35)}
.link:hover{border-color:var(--pr)}
.more{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:14px;color:var(--tx2)}
.more:hover{color:#fff}

/* chips & badges */
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 13px;border-radius:6px;background:var(--s1);border:1px solid var(--line);font-size:13.5px;font-weight:500;color:var(--tx2);cursor:pointer}
.chip i{font-style:normal;font-size:12px;color:var(--dim)}
.chip:hover{border-color:var(--line2);color:#fff}
.chip[aria-pressed=true]{background:rgba(var(--pr-rgb),.16);border-color:rgba(var(--pr-rgb),.55);color:#fff}
.chip[aria-pressed=true] i{color:var(--title)}
.badge{display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 8px;border-radius:4px;font:600 11.5px/1 var(--sans);letter-spacing:.02em;background:var(--s3);color:var(--tx2)}
.badge.free{background:rgba(54,241,160,.13);color:var(--ok)}
.badge.paid{background:rgba(var(--pr-rgb),.18);color:var(--title)}
.badge.soon{background:rgba(255,160,77,.15);color:var(--warn)}
.fw{display:inline-flex;align-items:center;height:22px;padding:0 7px;border-radius:4px;border:1px solid var(--line2);font:500 12px/1 var(--mono);color:var(--tx2)}

/* notification tag (glitch-notifications) */
.note{display:flex;align-items:stretch;border-radius:6px;overflow:hidden;background:var(--s1);border:1px solid var(--line)}
.note>.ic{width:44px;flex:none;display:grid;place-items:center;background:var(--c,var(--pr));color:#0c0a10}
.note>.ic svg{width:20px;height:20px}
.note>.bd{padding:11px 14px;min-width:0}
.note>.bd b{display:block;font:italic 800 16px/1.1 var(--cond);text-transform:uppercase;letter-spacing:.03em;margin-bottom:2px}
.note>.bd span{font-size:13.5px;color:var(--tx2)}
a.note:hover{border-color:var(--line2)}
a.note .go{margin-left:auto;display:grid;place-items:center;padding:0 16px;color:var(--dim)}
a.note:hover .go{color:#fff}

/* icons */
.i{width:18px;height:18px;flex:none;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ---------- header ---------- */
.hd{position:sticky;top:0;z-index:40;background:rgba(12,10,16,.92);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.hd .wrap{display:flex;align-items:center;gap:22px;height:68px}
.logo{display:flex;align-items:center;gap:10px;font:italic 800 25px/1 var(--cond);text-transform:uppercase;letter-spacing:.01em}
.logo span{color:var(--pr)}
.logo img{width:30px;height:30px}
.nav{display:flex;gap:2px}
.nav a{display:flex;align-items:center;gap:7px;height:38px;padding:0 13px;border-radius:6px;font-size:14px;font-weight:500;color:var(--tx2)}
.nav a:hover{background:var(--s2);color:#fff}
.nav a[aria-current=page]{background:var(--s3);color:#fff;box-shadow:inset 0 -2px 0 var(--pr)}
.hd .sp{flex:1}
.searchbtn{display:flex;align-items:center;gap:10px;width:250px;height:38px;padding:0 6px 0 12px;border-radius:6px;background:var(--s1);border:1px solid var(--line);color:var(--mu);font-size:14px}
.searchbtn:hover{border-color:var(--line2)}
.searchbtn kbd{margin-left:auto;display:grid;place-items:center;min-width:26px;height:26px;border-radius:4px;background:var(--key);color:var(--ink);font:700 12px var(--sans)}

/* ---------- footer ---------- */
.ft{border-top:1px solid var(--line);margin-top:96px}
.ft .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:8px 24px;padding-top:28px;padding-bottom:40px;font-size:13.5px;color:var(--mu)}
.ft .logo{font-size:19px;color:var(--tx2)}
.ft .sp{flex:1}
.ft a:hover{color:#fff}
.ft small{flex-basis:100%;font-size:12px;color:var(--dim)}

/* ---------- search overlay ---------- */
.sx{position:fixed;inset:0;z-index:100;background:rgba(6,4,9,.72);backdrop-filter:blur(3px);display:none;align-items:flex-start;justify-content:center;padding-top:12vh}
.sx.on{display:flex}
.sx .box{width:min(640px,92vw);border-radius:10px;background:var(--s1);border:1px solid var(--line2);box-shadow:0 30px 80px rgba(0,0,0,.6);overflow:hidden}
.sx .in{display:flex;align-items:center;gap:12px;padding:0 16px;border-bottom:1px solid var(--line)}
.sx input{flex:1;height:56px;background:none;border:0;outline:0;font-size:17px}
.sx .in kbd{font:600 11px var(--sans);padding:4px 7px;border-radius:4px;background:var(--s3);color:var(--mu)}
.sx ul{list-style:none;max-height:56vh;overflow:auto;padding:6px}
.sx li a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:6px}
.sx li a small{display:block;color:var(--mu);font-size:12.5px}
.sx li a[aria-selected=true]{background:rgba(var(--pr-rgb),.16)}
.sx .empty{padding:22px;color:var(--mu);font-size:14px}
.sx .thumb{width:64px;height:36px;border-radius:4px;object-fit:cover;flex:none;background:var(--s3)}

/* ---------- store: home ---------- */
.hero{display:grid;grid-template-columns:minmax(0,1fr) 480px;gap:56px;align-items:center;padding:64px 0 24px}
.hero h1{font-size:76px}
.hero .lede{font-size:17px;color:var(--tx2);margin:20px 0 28px;max-width:520px;line-height:1.6}
.hero .acts{display:flex;flex-wrap:wrap;gap:10px}
.hero .fine{display:flex;gap:18px;margin-top:26px;font-size:13px;color:var(--mu)}
.hero .fine span{display:flex;align-items:center;gap:7px}
.hero .fine .i{width:16px;height:16px;color:var(--title)}

/* inspect card (in-game item inspect) */
.inspect{border-radius:12px;background:var(--s1);border:1px solid var(--line2);overflow:hidden;box-shadow:0 30px 70px rgba(0,0,0,.45)}
.inspect .bar{display:flex;align-items:center;justify-content:space-between;padding:12px 14px}
.inspect .media{position:relative;aspect-ratio:16/9;background:#000}
.inspect .media img{width:100%;height:100%;object-fit:cover}
.inspect .body{padding:16px 18px 18px}
.inspect h2{font-size:38px}
.inspect p{color:var(--tx2);font-size:14px;margin:6px 0 12px}
.spec{width:100%;border-collapse:collapse;font-size:13.5px}
.spec td{padding:8px 0;border-top:1px solid var(--line)}
.spec td:first-child{color:var(--mu)}
.spec td:last-child{text-align:right;font-weight:500}
.inspect .buy{display:flex;align-items:center;gap:8px;margin-top:14px}
.inspect .buy .price{margin-right:auto}

.price{font:italic 800 30px/1 var(--cond);letter-spacing:.01em}
.price small{font:500 12.5px var(--sans);color:var(--mu);margin-left:6px;font-style:normal;text-transform:none}

/* section head */
.sh{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px 18px;margin:72px 0 18px}
.sh h2{font-size:44px}
.sh p{color:var(--mu);font-size:14px;max-width:420px}
.sh .r{margin-left:auto}
.filters{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;margin-bottom:16px}
.filters .lbl{font-size:12.5px;color:var(--dim);margin-right:-8px}

/* script cards */
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.card{display:flex;flex-direction:column;border-radius:10px;background:var(--s1);border:1px solid var(--line);overflow:hidden;transition:border-color .15s,transform .15s}
.card:hover{border-color:rgba(var(--pr-rgb),.45);transform:translateY(-2px)}
.card .media{position:relative;aspect-ratio:16/9;background:var(--s3);overflow:hidden}
.card .media img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.card:hover .media img{transform:scale(1.03)}
.card .media .badges{position:absolute;left:10px;top:10px;display:flex;gap:6px}
.card .media .badges .badge{backdrop-filter:blur(6px);background:rgba(12,10,16,.78)}
.card .media .badges .badge.free{color:var(--ok)}
.card .media .badges .badge.paid{color:var(--title)}
.card .media .play{position:absolute;right:10px;bottom:10px;display:flex;align-items:center;gap:6px;height:26px;padding:0 9px;border-radius:4px;background:rgba(12,10,16,.78);font-size:12px;font-weight:600}
.card .media .play .i{width:13px;height:13px;fill:#fff;stroke:none}
.card .body{display:flex;flex-direction:column;gap:8px;padding:16px 16px 0;flex:1}
.card h3{font-size:28px}
.card h3 a::after{content:"";position:absolute;inset:0}
.card .body{position:relative}
.card p{font-size:14px;color:var(--tx2);line-height:1.5}
.card .fws{display:flex;flex-wrap:wrap;gap:5px;margin-top:auto;padding-top:4px}
.card .foot{display:flex;align-items:center;gap:8px;padding:14px 16px 16px;margin-top:12px;border-top:1px solid var(--line)}
.card .foot .price{font-size:24px;margin-right:auto}
.card .foot .docs{font-size:13px;font-weight:600;color:var(--mu);padding:0 6px}
.card .foot .docs:hover{color:#fff}
.card.hide{display:none}
.nores{display:none;padding:36px;text-align:center;color:var(--mu);border:1px dashed var(--line2);border-radius:10px}

.strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.demo{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:40px;margin-top:72px;padding:32px;border-radius:12px;background:var(--s1);border:1px solid var(--line)}
.demo h2{font-size:42px;margin:12px 0 10px}
.demo p{color:var(--tx2);max-width:460px;margin-bottom:20px}
.demo .shot{border-radius:8px;overflow:hidden;border:1px solid var(--line2);aspect-ratio:16/9}
.demo .shot img{width:100%;height:100%;object-fit:cover}

/* ---------- store: product page ---------- */
.crumbs{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--mu);padding:28px 0 18px}
.crumbs a:hover{color:#fff}
.crumbs .i{width:14px;height:14px}
.pp{display:grid;grid-template-columns:minmax(0,1fr) 370px;gap:40px;align-items:start}
.pp h1{font-size:64px;margin-bottom:10px}
.pp .sub{font-size:17px;color:var(--tx2);margin-bottom:22px;max-width:680px}
.yt{position:relative;display:block;aspect-ratio:16/9;border-radius:10px;overflow:hidden;background:#000;border:1px solid var(--line2)}
.yt img{width:100%;height:100%;object-fit:cover;opacity:.92}
.yt .pl{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:stretch;border-radius:6px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.5)}
.yt .pl kbd{display:grid;place-items:center;width:46px;background:var(--key);color:var(--ink)}
.yt .pl kbd .i{fill:var(--ink);stroke:none}
.yt .pl span{display:flex;align-items:center;padding:0 18px;background:var(--pr);font-weight:600;font-size:15px;height:48px}
.yt:hover img{opacity:1}
.yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.buybox{position:sticky;top:88px;border-radius:12px;background:var(--s1);border:1px solid var(--line2);padding:20px}
.buybox .top{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.buybox .price{font-size:44px}
.buybox .acts{display:flex;flex-direction:column;gap:8px;margin:16px 0 6px}
.buybox .del{display:flex;gap:10px;font-size:12.5px;color:var(--mu);margin-top:14px;padding-top:14px;border-top:1px solid var(--line)}
.buybox .del .i{width:16px;height:16px;color:var(--title);margin-top:2px}
.about{margin-top:44px}
.about h2.cap{font-size:38px;margin-bottom:14px}

/* ---------- docs ---------- */
.dhero{padding:64px 0 8px}
.dhero h1{font-size:72px;max-width:900px}
.dhero p{color:var(--tx2);font-size:17px;margin:14px 0 26px}
.bigsearch{display:flex;align-items:center;gap:14px;width:100%;height:62px;padding:0 10px 0 20px;border-radius:10px;background:var(--s1);border:1px solid var(--line2);color:var(--mu);font-size:17px;text-align:left;transition:border-color .15s}
.bigsearch:hover{border-color:rgba(var(--pr-rgb),.6)}
.bigsearch .i{width:22px;height:22px;color:var(--title)}
.bigsearch kbd{margin-left:auto;display:grid;place-items:center;min-width:36px;height:36px;border-radius:5px;background:var(--key);color:var(--ink);font:700 14px var(--sans)}
.popular{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px;font-size:13px;color:var(--mu)}
.popular a{padding:5px 10px;border-radius:5px;background:var(--s1);border:1px solid var(--line);color:var(--tx2)}
.popular a:hover{border-color:var(--line2);color:#fff}

.dcols{display:grid;grid-template-columns:360px minmax(0,1fr);gap:40px;margin-top:56px}
.dcols h2{font-size:34px;margin-bottom:14px}
.steps{list-style:none;display:flex;flex-direction:column;gap:8px}
.steps a{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:8px;background:var(--s1);border:1px solid var(--line)}
.steps a:hover{border-color:var(--line2)}
.steps kbd{display:grid;place-items:center;width:30px;height:30px;border-radius:5px;background:var(--key);color:var(--ink);font:700 13px var(--sans);flex:none}
.steps b{display:block;font-weight:600}
.steps small{color:var(--mu);font-size:13px}
.steps .i{margin-left:auto;color:var(--dim)}

.slist{border-radius:10px;border:1px solid var(--line);overflow:hidden}
.srow{display:grid;grid-template-columns:96px minmax(0,1fr);gap:16px;align-items:center;padding:12px 14px;border-top:1px solid var(--line);background:var(--s1)}
.srow:first-child{border-top:0}
.srow:hover{background:var(--s2)}
.srow .th{width:96px;aspect-ratio:16/9;border-radius:5px;object-fit:cover;background:var(--s3)}
.srow .n{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.srow .n a.t{font:italic 800 21px/1 var(--cond);text-transform:uppercase}
.srow .n a.t:hover{color:var(--title)}
.srow .pages{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:6px;font-size:13.5px}
.srow .pages a{color:var(--tx2)}
.srow .pages a:hover{color:var(--title)}
.help{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:56px}

/* doc page layout */
.dl{display:grid;grid-template-columns:250px minmax(0,1fr) 200px;gap:44px;align-items:start}
.side{position:sticky;top:68px;max-height:calc(100vh - 68px);overflow:auto;padding:28px 6px 40px 0;font-size:14px}
.side .g{font:600 11.5px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin:22px 0 6px}
.side .g:first-child{margin-top:0}
.side a{display:block;padding:6px 10px;border-radius:5px;color:var(--tx2)}
.side a:hover{background:var(--s2);color:#fff}
.side a[aria-current=page]{background:var(--s3);color:#fff;box-shadow:inset 2px 0 0 var(--pr)}
.side .kids{margin-left:12px;padding-left:8px;border-left:1px solid var(--line)}
.side .kids a{font-size:13.5px;padding:5px 10px}
.toc{position:sticky;top:68px;padding:34px 0;font-size:13px}
.toc .g{font:600 11.5px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-bottom:10px}
.toc a{display:block;padding:4px 0 4px 12px;border-left:1px solid var(--line);color:var(--mu)}
.toc a.l3{padding-left:22px}
.toc a:hover,.toc a.on{color:#fff;border-color:var(--pr)}
.toc .edit{margin-top:22px;display:flex;flex-direction:column;gap:6px}
.toc .edit a{border:0;padding:0;color:var(--mu)}
.article{min-width:0;padding:30px 0 40px}
.article .crumbs{padding:0 0 14px}
.article>h1{font-size:58px;margin-bottom:8px}
.article .desc{font-size:17px;color:var(--tx2);margin-bottom:8px;max-width:760px}
.article .meta{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 4px}

/* rendered markdown */
.md{font-size:15.5px;line-height:1.75;color:var(--tx2);max-width:780px}
.md>*+*{margin-top:14px}
.md h2{font:italic 800 32px/1.05 var(--cond);text-transform:uppercase;color:var(--tx);margin-top:44px;padding-top:4px}
.md h3{font:700 19px/1.3 var(--sans);color:var(--tx);margin-top:30px}
.md h4{font:600 16px/1.3 var(--sans);color:var(--tx);margin-top:22px}
.md h2 a.anc,.md h3 a.anc{opacity:0;margin-left:8px;color:var(--dim);font:400 16px var(--mono)}
.md h2:hover a.anc,.md h3:hover a.anc{opacity:1}
.md p,.md li{color:var(--tx2)}
.md strong{color:var(--tx);font-weight:600}
.md a{color:var(--title);border-bottom:1px solid rgba(var(--pr-rgb),.35)}
.md a:hover{border-color:var(--pr)}
.md ul,.md ol{padding-left:22px}
.md li+li{margin-top:5px}
.md li::marker{color:var(--dim)}
.md code{font:13.5px var(--mono);background:var(--s3);padding:2px 6px;border-radius:4px;color:#ecdcff}
.md pre{position:relative;background:#110e15;border:1px solid var(--line);border-radius:8px;padding:16px 18px;overflow:auto}
.md pre code{background:none;padding:0;font-size:13px;line-height:1.7;color:#e6dff0}
.md pre .copy{position:absolute;top:8px;right:8px;height:28px;padding:0 10px;border-radius:5px;background:var(--s3);font-size:12px;font-weight:600;color:var(--tx2);opacity:0;transition:opacity .15s}
.md pre:hover .copy,.md pre .copy:focus{opacity:1}
.md table{width:100%;border-collapse:collapse;font-size:14px;display:block;overflow-x:auto}
.md th{text-align:left;font-weight:600;color:var(--tx);background:var(--s2)}
.md th,.md td{padding:9px 12px;border:1px solid var(--line)}
.md blockquote{border-left:3px solid var(--pr);background:var(--s1);padding:12px 16px;border-radius:0 6px 6px 0}
.md hr{border:0;border-top:1px solid var(--line);margin:32px 0}
.md figure img,.md p>img{border-radius:8px;border:1px solid var(--line)}
.md figcaption{font-size:13px;color:var(--mu);margin-top:6px}
.md .callout{display:flex;border-radius:6px;overflow:hidden;background:var(--s1);border:1px solid var(--line)}
.md .callout>.ic{width:42px;flex:none;display:flex;justify-content:center;padding-top:14px;background:var(--c)}
.md .callout>.ic .i{color:#0c0a10}
.md .callout>.bd{padding:12px 16px;min-width:0}
.md .callout>.bd>*+*{margin-top:8px}
.md .callout.info{--c:var(--info)}.md .callout.warning{--c:var(--warn)}.md .callout.danger{--c:var(--bad)}.md .callout.success{--c:var(--ok)}
.md .tabs{border:1px solid var(--line);border-radius:8px;overflow:hidden}
.md .tabs .tl{display:flex;gap:2px;padding:6px;background:var(--s2);overflow-x:auto}
.md .tabs .tl button{padding:6px 12px;border-radius:5px;font-size:13px;font-weight:600;color:var(--mu);white-space:nowrap}
.md .tabs .tl button[aria-selected=true]{background:var(--pr);color:#fff}
.md .tabs .tp{padding:14px 16px}
.md .tabs .tp[hidden]{display:none}
.md .yt{margin-top:16px}
.pn{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:56px;max-width:780px}
.pn a{display:flex;flex-direction:column;gap:2px;padding:14px 16px;border-radius:8px;background:var(--s1);border:1px solid var(--line)}
.pn a:hover{border-color:var(--line2)}
.pn a small{font-size:12px;color:var(--mu)}
.pn a b{font-weight:600}
.pn a.nx{text-align:right;grid-column:2}

/* responsive */
@media (max-width:1100px){
  .dl{grid-template-columns:220px minmax(0,1fr)}
  .toc{display:none}
  .hero{grid-template-columns:1fr}
  .pp{grid-template-columns:1fr}
  .buybox{position:static}
}
@media (max-width:860px){
  .grid,.strip,.help{grid-template-columns:1fr 1fr}
  .dcols,.demo{grid-template-columns:1fr}
  .hd .wrap{flex-wrap:wrap;height:auto;padding-top:12px;padding-bottom:8px;row-gap:6px}
  .nav{order:3;flex-basis:100%;overflow-x:auto;margin:0 -6px}
  .nav a{height:34px;padding:0 10px;flex:none}
  .searchbtn{width:auto}
  .searchbtn .t{display:none}
  .dl{grid-template-columns:1fr}
  .side{position:static;max-height:none;border-bottom:1px solid var(--line)}
  .hero h1,.dhero h1{font-size:54px}
}
@media (max-width:560px){
  .grid,.strip,.help{grid-template-columns:1fr}
  .wrap{padding:0 18px}
  .hero h1,.dhero h1{font-size:44px}
  .sh h2{font-size:36px}
}
.btn .i.sm{width:14px;height:14px;opacity:.7}

/* ===== round 3 refinements ===== */
.note>.ic{background:var(--c,var(--key));color:var(--ink)}
.badge.paid{background:rgba(var(--pr-rgb),.22);color:#efd9ff;box-shadow:inset 0 0 0 1px rgba(var(--pr-rgb),.45)}
.card .media .badges .badge.paid{color:#efd9ff}

/* filters: segmented + selects in one row */
.filters{gap:12px}
.seg{display:inline-flex;padding:3px;border-radius:7px;background:var(--s1);border:1px solid var(--line)}
.seg button{height:32px;padding:0 14px;border-radius:5px;font-size:13.5px;font-weight:600;color:var(--tx2)}
.seg button i{font-style:normal;font-weight:500;font-size:12px;color:var(--dim);margin-left:4px}
.seg button[aria-pressed=true]{background:var(--pr);color:#fff}
.seg button[aria-pressed=true] i{color:#f3dcff}
.sel{display:inline-flex;align-items:center;height:40px;border-radius:7px;background:var(--s1);border:1px solid var(--line);overflow:hidden;font-size:13.5px}
.sel span{padding:0 10px 0 12px;color:var(--mu);font-weight:500}
.sel select{height:100%;padding:0 30px 0 6px;background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23a99bb8' stroke-width='2.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 10px center;border:0;color:var(--tx);font-weight:600;appearance:none;cursor:pointer}
.sel select option{background:var(--s1)}
.sel:focus-within{border-color:rgba(var(--pr-rgb),.6)}

/* product page: head / buybox / body areas */
.pp{grid-template-areas:"head buy" "body buy"}
.pp-head{grid-area:head}
.pp .buybox{grid-area:buy}
.pp-body{grid-area:body;max-width:780px}
.bbt{font-size:30px;margin:2px 0 4px}
.lead2{font-size:16.5px;color:var(--tx2);margin-top:30px;line-height:1.65}
.pblock{margin-top:40px}
.pblock h2.cap{font-size:32px;margin-bottom:14px}
.feats,.reqs{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.feats li,.reqs li{display:flex;flex-direction:column;gap:3px;padding:12px 14px;border-radius:8px;background:var(--s1);border:1px solid var(--line)}
.feats b,.reqs b{font-weight:600;font-size:14.5px;color:var(--tx)}
.feats span{font-size:13.5px;color:var(--mu);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.reqs span{font-size:12.5px;color:var(--mu)}
.reqs{grid-template-columns:repeat(3,1fr)}
.reqs a{color:var(--title)}

/* video: play chip bottom-left with scrim, never over the logo */
.yt::after{content:"";position:absolute;inset:auto 0 0 0;height:45%;background:linear-gradient(transparent,rgba(8,6,11,.85));pointer-events:none}
.yt .pl{left:16px;top:auto;bottom:16px;transform:none;z-index:2}
.yt .pl span{height:42px;font-size:14px;padding:0 14px}
.yt .pl kbd{width:42px}
.yt iframe{z-index:3}

/* docs: numbered install steps as keycaps */
.md .step{display:flex;align-items:center;gap:12px;font:700 18px/1.3 var(--sans);color:var(--tx);margin-top:30px}
.md .step kbd{display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:5px;background:var(--key);color:var(--ink);font:700 14px var(--sans)}
.md .step a.anc{display:none}

/* docs: sidebar is a drawer on small screens */
.sidewrap>summary{display:none}
.sidewrap{position:sticky;top:68px;align-self:start}
.sidewrap .side{position:static;max-height:calc(100vh - 68px)}

@media (max-width:1100px){
  .pp{grid-template-areas:"head" "buy" "body";grid-template-columns:minmax(0,1fr)}
}
@media (max-width:860px){
  .sidewrap{position:static;border-bottom:1px solid var(--line);margin-bottom:6px}
  .sidewrap>summary{display:flex;align-items:center;gap:10px;height:52px;list-style:none;cursor:pointer;font-weight:600}
  .sidewrap>summary::-webkit-details-marker{display:none}
  .sidewrap>summary .mono{margin-left:auto}
  .sidewrap .side{max-height:none;padding-top:4px}
  .feats{grid-template-columns:1fr}
  .reqs{grid-template-columns:1fr 1fr}
}
@media (max-width:560px){
  .hero .acts .btn{flex:1 1 100%}
  .hero .acts .btn>span{flex:1;justify-content:center}
  .filters .sel{flex:1 1 45%}
  .yt .pl span{font-size:13px}
}
@media (hover:none){
  .btn>kbd{display:none}
  .md pre .copy{opacity:1}
}

/* ===== round 4: in-game framing, cleaner price slot ===== */
.muted{font-size:13px;color:var(--mu)}
.pnote{margin-right:auto;font-size:13px;color:var(--mu)}
.hero{align-items:start;padding-top:56px}
.hero>div:first-child{padding-top:40px}
/* tighter, in-game corners */
.card,.inspect,.buybox,.demo,.slist,.steps a,.feats li,.reqs li,.note,.yt,.sx .box{border-radius:5px}
/* coloured edge like the notification tags */
.card{box-shadow:inset 3px 0 0 var(--edge)}
.card.is-paid{--edge:var(--pr)}
.card.is-free{--edge:var(--ok)}
.card .media{aspect-ratio:16/8}
.card .media img{object-position:center 78%}
.card .body{padding-left:18px}.card .foot{padding-left:18px}
/* HUD frame: corner brackets around the showcase + featured media */
.yt,.inspect .media{position:relative}
.hudframe::before,.yt::before{content:"";position:absolute;inset:10px;z-index:2;pointer-events:none;
  background:
   linear-gradient(var(--key),var(--key)) top left/18px 2px, linear-gradient(var(--key),var(--key)) top left/2px 18px,
   linear-gradient(var(--key),var(--key)) top right/18px 2px, linear-gradient(var(--key),var(--key)) top right/2px 18px,
   linear-gradient(var(--key),var(--key)) bottom left/18px 2px, linear-gradient(var(--key),var(--key)) bottom left/2px 18px,
   linear-gradient(var(--key),var(--key)) bottom right/18px 2px, linear-gradient(var(--key),var(--key)) bottom right/2px 18px;
  background-repeat:no-repeat;opacity:.85}
.inspect .media::after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,.16) 0 1px,transparent 1px 3px)}
.inspect .media{display:block;overflow:hidden}
.inspect .media img{object-position:center 70%}
.yt .pl{left:26px;bottom:26px}
/* product: full feature text, delivery note as a tag, related */
.feats span{display:block;-webkit-line-clamp:unset;overflow:visible}
.buybox .del{border-top:0;padding-top:0;margin-top:16px}
.buybox .del.note{display:flex;gap:0;padding:0}
.buybox .del.note .ic{width:40px}
.buybox .del.note .bd{padding:10px 12px}
.buybox .del.note .bd span{font-size:12.5px;line-height:1.5;color:var(--mu)}
.buybox .del.note .bd b{font-size:15px}
.rel{margin-top:18px}
.rel .g{font:600 11.5px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-bottom:8px}
.rel a{display:flex;align-items:center;gap:10px;padding:8px;border-radius:5px}
.rel a:hover{background:var(--s2)}
.rel img{width:64px;aspect-ratio:16/9;object-fit:cover;object-position:center 75%;border-radius:3px}
.rel b{display:block;font-weight:600;font-size:14px}
.rel small{font-size:12px;color:var(--mu)}
.article .eyebrow{margin-bottom:6px;color:var(--title)}
@media (max-width:860px){
  .article{padding-top:6px}
  .sidewrap{margin-bottom:0}
  .inspect .spec{display:none}
  .srow .pages{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .hero>div:first-child{padding-top:0}
}
.buybox .del.note{color:var(--tx)}
.buybox .del.note .bd b{color:var(--tx)}
.buybox .del.note .ic .i{color:var(--ink);width:18px;height:18px;margin:0}
.buybox .del.note .ic{align-items:flex-start;padding-top:12px;display:flex;justify-content:center}

/* ===== round 5 ===== */
.facts{display:flex;gap:30px;margin:34px 0 18px;padding-top:22px;border-top:1px solid var(--line)}
.facts dt{font:italic 800 34px/1 var(--cond)}
.facts dd{font-size:13px;color:var(--mu);margin-top:4px}
.note.latest{max-width:420px}
.seg button i{color:#bfb2cc}
.pnote{color:var(--tx2)}
.pp h1{font-size:52px}
.card .media.scene img{object-position:center;transform:none}
.card.ask{display:flex;align-items:center;justify-content:center;border:1px dashed rgba(var(--pr-rgb),.45);background:transparent;box-shadow:none;text-align:left}
.card.ask:hover{background:var(--s1)}
.ask-in{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:28px}
.ask-in>b.cap{font-size:30px}
.ask-in>span:not(.tt):not(.btn){color:var(--tx2);font-size:14px}
/* features as a HUD task list */
.feats{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:0 28px;border-top:1px solid var(--line)}
.feats li{flex-direction:row;align-items:flex-start;gap:12px;padding:14px 0;border:0;border-bottom:1px solid var(--line);border-radius:0;background:none}
.feats li kbd{display:grid;place-items:center;flex:none;width:26px;height:26px;border-radius:4px;background:var(--key);color:var(--ink);font:700 12px var(--sans);margin-top:1px}
.feats li>span{display:flex;flex-direction:column;gap:2px}
.feats li b{font-size:15px}
.feats li span span{font-size:13.5px;color:var(--mu)}
@media (max-width:860px){
  .srow .pages{flex-wrap:wrap;overflow:visible}
  .facts{gap:20px}
}
@media (max-width:560px){
  .filters .seg{width:100%}
  .filters .seg button{flex:1}
  .filters .sel{flex:1 1 100%}
  .feats{grid-template-columns:1fr}
}

/* ===== round 6 ===== */
.tt.big{font-size:30px;border-radius:5px}
.tt.big>*{padding:6px 14px}
.sh .tt.big{margin-right:4px}
.dcols h2.tt.big{margin-bottom:16px}
.hero h1{max-width:620px}
.hero .note.latest{display:inline-flex;max-width:440px}
.note>.ic{background:var(--pr);color:#fff;width:40px}
.note>.ic svg{color:#fff}
.card .foot{gap:10px}
.card .foot .fws{margin-right:auto;padding-top:0;display:flex;flex-wrap:wrap;gap:5px;align-items:center}
.card .foot .fws .price{font-size:22px;margin-right:6px}
.card.ask{border-color:rgba(var(--pr-rgb),.25)}
.inspect .fws{display:flex;gap:5px;flex-wrap:wrap}
.gal{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:8px}
.gal a{position:relative;display:block;aspect-ratio:16/9;border-radius:4px;overflow:hidden;border:1px solid var(--line2)}
.gal img{width:100%;height:100%;object-fit:cover;transition:transform .25s}
.gal a:hover img{transform:scale(1.05)}
.gal a:hover{border-color:rgba(var(--pr-rgb),.6)}
.srow{box-shadow:inset 3px 0 0 var(--edge)}
.srow.is-paid{--edge:var(--pr)}.srow.is-free{--edge:var(--ok)}
.srow .n .badge{height:20px;font-size:11px}
.md .step{padding:10px 14px;background:var(--s1);border:1px solid var(--line);border-left:3px solid var(--pr);border-radius:4px}
.md .step+p,.md .step+ul{margin-left:4px}
@media (max-width:860px){ .gal{grid-template-columns:repeat(2,1fr)} }
@media (max-width:560px){
  .yt .pl span{display:none}
  .yt .pl{left:18px;bottom:18px}
  .pblock pre code{white-space:pre-wrap;word-break:break-all}
  .tt.big{font-size:24px}
}

/* ===== round 7 ===== */
.card .body .fws{margin-top:auto;padding-top:6px}
.fw{white-space:nowrap}
.pp{grid-template-areas:"head side" "body side"}
.pp-side{grid-area:side;display:flex;flex-direction:column;gap:14px;align-self:start}
.pp-side .buybox{position:static}
.sblock{border-radius:5px;background:var(--s1);border:1px solid var(--line);padding:16px}
.sblock .g{font:600 11.5px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--dim);margin-bottom:10px}
.sblock .reqs{grid-template-columns:1fr;gap:6px}
.sblock .reqs li{flex-direction:row;justify-content:space-between;align-items:center;padding:9px 12px;background:var(--s2);box-shadow:inset 3px 0 0 var(--pr)}
.sblock .md pre{padding:12px 14px}
.sblock .md pre code{white-space:pre-wrap;font-size:12.5px}
.pp-body .lead2{margin-top:28px}
.md .step{background:none;border:0;padding:0 0 0 14px;border-left:3px solid var(--pr);border-radius:0}
.md .step+p{padding-left:17px;margin-left:0}
.dcols .help{grid-template-columns:1fr;margin-top:22px;gap:8px}
.searchbtn.hide{visibility:hidden}
.card .media .play{background:rgba(8,6,11,.9);box-shadow:0 0 0 1px rgba(255,255,255,.12)}
.card .media::after{content:"";position:absolute;inset:auto 0 0 0;height:40%;background:linear-gradient(transparent,rgba(8,6,11,.55));pointer-events:none}
.card .media .play,.card .media .badges{z-index:2}
@media (max-width:1100px){ .pp{grid-template-areas:"head" "side" "body"} }
@media (max-width:560px){ .yt .pl span{display:flex} }

/* ===== round 8 ===== */
.card .foot .sp{flex:1}
.badge.feat{background:var(--pr)!important;color:#fff!important}
.card .media .play{opacity:0;transition:opacity .15s}
.card:hover .media .play{opacity:1}
.fw{font:600 12px/1 var(--sans);letter-spacing:.01em}
.sh{margin-top:56px}
.hero{padding-bottom:0}
.dcols .help .note{background:transparent}
.dcols .help .note>.ic{background:transparent;color:var(--title);border-right:1px solid var(--line)}
.dcols .help .note>.ic svg{color:var(--title)}
.srow .pages a:hover{text-decoration:underline;text-underline-offset:3px}
.mbuy{display:none}
@media (max-width:860px){
  .mbuy{display:block;position:fixed;left:0;right:0;bottom:0;z-index:45;padding:10px 14px calc(10px + env(safe-area-inset-bottom));background:rgba(12,10,16,.94);backdrop-filter:blur(8px);border-top:1px solid var(--line2)}
  .mbuy .btn{height:46px}
  body:has(.mbuy) .ft{padding-bottom:70px}
}
.pp{grid-template-rows:auto 1fr}
@media (max-width:1100px){ .pp{grid-template-rows:none} }
.pp{row-gap:0}.pp-body .lead2{margin-top:30px}@media (max-width:1100px){.pp{row-gap:24px}}

/* ===== round 9 ===== */
.grid .card.is-featured{display:none}
.grid.filtered .card.is-featured:not(.hide){display:flex}
.tt.sm{font-size:13px;margin-bottom:12px}
.tt.sm>*{padding:4px 8px}
.also{margin-top:10px;padding:10px 12px;border-radius:4px;background:var(--s2)}
.also>span{display:block;font-size:12px;color:var(--mu);margin-bottom:6px}
.also div{display:flex;flex-wrap:wrap;gap:5px}
.also code{font:500 12px var(--mono);padding:3px 7px;border-radius:3px;background:var(--s3);color:var(--tx)}
.sblock .md pre code{white-space:pre}
.sblock .md pre{overflow-x:auto}
.feats li .dot{flex:none;width:8px;height:8px;margin-top:7px;border-radius:2px;background:var(--pr);transform:rotate(45deg)}
.card .media:not(.scene) img{filter:brightness(.6) saturate(.85)}
.yt .pl{left:auto;right:26px}
.btn>kbd{box-shadow:inset 0 -3px 0 rgba(31,10,51,.22)}
@media (max-width:1100px){
  .pp{display:flex;flex-direction:column;gap:24px}
  .pp-side{display:contents}
  .pp-head{order:1}.pp-side .buybox{order:2}.pp-body{order:3}.pp-side .sblock{order:4}
}

/* ===== round 10 ===== */
.tt.sm{font-size:15px}
.tt.sm>*{padding:5px 10px}
.sel select{flex:1;min-width:110px}
.also p{margin-top:8px;font-size:13px;color:var(--tx2)}
.also p a{color:var(--title);border-bottom:1px solid rgba(var(--pr-rgb),.35)}
.card .foot .fw{margin-right:0}
.md pre code{line-height:1.55}
.md pre .c{color:var(--dim)}
.callout pre{margin-top:8px}
.card .media:not(.scene) img{filter:brightness(.45) saturate(.7) blur(1px)}
.srow .pages a{color:var(--tx)}
.mbuy{transition:transform .2s}
.mbuy.away{transform:translateY(110%)}
@media (max-width:560px){
  .filters .sel{flex:1 1 calc(50% - 6px)}
  .sel span{padding:0 6px 0 10px}
}

/* ===== round 11 ===== */
.card .media.flat{display:grid;place-items:center;background:linear-gradient(135deg,#1d1427,#120c19)}
.card .media.flat::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 4px)}
.flat-ic .i{width:56px;height:56px;color:var(--title);stroke-width:1.5}
.flat-id{position:absolute;right:12px;bottom:10px;font:500 12px var(--mono);color:var(--mu)}
.md .quick{border-left:3px solid var(--pr);background:var(--s1);border-radius:0 5px 5px 0;padding:14px 16px}
.md .quick pre{margin-top:10px;background:#0f0c13}
.buybox .del.note{border-left:0}
.buybox .del.note .ic{width:4px;padding:0;background:var(--pr)}
.buybox .del.note .ic svg{display:none}
.side .g,.toc .g,.article .eyebrow{font:italic 800 14px var(--cond);letter-spacing:.04em}
.pp-side{position:sticky;top:84px}
.card .foot .docs{height:34px;display:inline-flex;align-items:center;padding:0 12px;border-radius:6px;border:1px solid var(--line2)}
.seg button[aria-pressed=false]{color:var(--tx)}
@media (max-width:1100px){ .pp-side{position:static} }
@media (max-width:560px){ .md pre code{white-space:pre-wrap;word-break:break-word} }

/* ===== round 12 ===== */
.card .media .badges .badge{background:rgba(8,6,11,.88);backdrop-filter:none}
.badge.fwb{color:var(--tx2)!important;font-weight:500}
.card .foot .docs{border-color:var(--line2)}
.md .quick .g,.sblock .g{font:600 11.5px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--mu);margin-bottom:8px}
.srow .th.flat{display:grid;place-items:center;background:linear-gradient(135deg,#1d1427,#120c19)}
.srow .th.flat .i{width:26px;height:26px;color:var(--title)}
.srow .pages a{padding:2px 0;border-bottom:1px solid transparent}
.srow .pages a:hover{border-color:var(--pr);text-decoration:none}

/* ===== round 13 ===== */
.sblock .g,.md .quick .g{font:italic 800 15px var(--cond);letter-spacing:.04em;color:var(--tx)}
.dlinks{display:flex;flex-direction:column}
.dlinks a{display:flex;justify-content:space-between;padding:8px 2px;border-bottom:1px solid var(--line);font-size:14px;color:var(--tx2)}
.dlinks a:last-child{border:0}
.dlinks a:hover{color:#fff}
.dlinks a span{color:var(--dim)}
.srow .pages{gap:6px}
.srow .pages a{padding:3px 9px;border-radius:4px;background:var(--s3);border:0;font-size:13px}
.srow .pages a:hover{background:rgba(var(--pr-rgb),.25);border:0}
.card .foot .btn.sm,.card .foot .docs{height:36px}
.feats li{padding:14px 12px;border-bottom:0;background:var(--s1);border-left:3px solid var(--pr);margin-bottom:8px;border-radius:0 4px 4px 0}
.feats{border-top:0;gap:0 10px}
.feats li .dot{display:none}
.card .media.flat{background:linear-gradient(135deg,#1d1427,#120c19),repeating-linear-gradient(90deg,rgba(255,255,255,.03) 0 1px,transparent 1px 24px)}
.card .media.flat::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(var(--pr-rgb),.07) 0 1px,transparent 1px 28px),repeating-linear-gradient(0deg,rgba(var(--pr-rgb),.07) 0 1px,transparent 1px 28px)}
.md h2,.md h3:not(.step){}
@media (max-width:1100px){
  .pp-head .gal{display:none}
  .pp-body .galm{display:flex}
}
.galm{display:none;gap:8px;overflow-x:auto;scroll-snap-type:x mandatory;margin-bottom:8px}
.galm a{flex:0 0 70%;aspect-ratio:16/9;border-radius:4px;overflow:hidden;scroll-snap-align:start}
.galm img{width:100%;height:100%;object-fit:cover}

/* ===== round 14 ===== */
.dnote{font-size:12.5px;line-height:1.5;color:var(--mu);margin-top:12px}
.buybox .g.bdiv{font:italic 800 15px var(--cond);letter-spacing:.04em;margin:18px 0 10px;padding-top:16px;border-top:1px solid var(--line)}
.buybox .reqs{grid-template-columns:1fr;gap:6px}
.buybox .reqs li{flex-direction:row;justify-content:space-between;align-items:center;padding:9px 12px;background:var(--s2);box-shadow:inset 3px 0 0 var(--pr)}
.buybox .also{background:transparent;padding:8px 0 0}
@media (max-width:560px){
  .srow .pages a:nth-child(n+4){display:none}
}
.gal{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:1fr}

/* ===== round 15: edges only mean paid/free ===== */
.feats li{background:none;border-left:0;border-radius:0;margin:0;padding:14px 0;border-bottom:1px solid var(--line)}
.feats li .dot{display:block;background:var(--tx2)}
.feats{gap:0 28px;border-top:1px solid var(--line)}
.buybox .reqs li{box-shadow:none;background:none;padding:8px 0;border-bottom:1px solid var(--line);border-radius:0}
.buybox .reqs a{color:var(--title)}
.md .quick{border-left:0;border:1px solid var(--line2);border-radius:5px}
.md .step{border-left:0;padding-left:0}
.md .step+p{padding-left:42px}
.dcols .srow{box-shadow:none}
.srow .n .badge{display:inline-flex}
.card.ask{align-items:center}
.ask-in{justify-content:center;height:100%}
.flat-id{display:none}
.flat-ic .i{width:72px;height:72px}
.ptag{font:italic 800 22px var(--cond);margin:2px 0 4px;color:var(--tx)}
.reqchips{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 4px}
.reqchips code{font:500 13px var(--mono);padding:4px 9px;border-radius:4px;background:var(--s3);color:var(--tx)}
.reqchips a{font-size:13.5px;color:var(--title);border-bottom:1px solid rgba(var(--pr-rgb),.35);align-self:center}
@media (max-width:860px){ body:has(.mbuy) main{padding-bottom:80px} .mbuy{box-shadow:0 -8px 20px rgba(0,0,0,.5)} }
.buybox .reqs li{border:0;border-bottom:1px solid var(--line)}

/* ===== round 17 ===== */
.md .quick pre{border:0;background:var(--s1);border-left:0}
.md .quick{border:1px solid var(--line);border-radius:5px;background:var(--s1);padding:12px 14px 2px}
.md .quick pre{padding:6px 0 10px}
.md a.chiplink{font:500 13px var(--mono);padding:4px 9px;border-radius:4px;background:rgba(var(--pr-rgb),.2);color:#efd9ff;border-bottom:0}
.md .step{margin-top:26px;margin-bottom:0}
.md .step+p,.md .step+ul{margin-top:6px}
.dcols .help::before{content:"Help";display:block;font:italic 800 18px var(--cond);text-transform:uppercase;color:var(--mu);margin:8px 0 2px}
.buybox .reqs li b a{color:var(--tx)}
.buybox .reqs li b a::after{content:" ↗";color:var(--dim);font-weight:400}

/* ===== round 18 ===== */
.article>h1{margin-bottom:28px}
.article .eyebrow+h1{margin-bottom:28px}
.dcols .help::before{font:italic 800 32px var(--cond);color:var(--tx);margin:28px 0 8px}
.card .foot .docs{border:0;background:none;padding:0 4px;height:auto;font-weight:600;color:var(--tx2)}
.card .foot .docs:hover{color:#fff}
@media (max-width:560px){ .srow .pages a:nth-child(n+2):not(.more-p){display:none} }
.mock-code{position:relative;z-index:1;width:84%;border-radius:5px;background:rgba(10,7,14,.92);border:1px solid var(--line2);overflow:hidden}
.mock-code b{display:block;padding:5px 10px;font:600 11px var(--mono);color:var(--mu);background:var(--s3)}
.mock-code code{display:block;padding:8px 10px;font:12px/1.65 var(--mono);color:#e6dff0;white-space:pre;overflow:hidden}
.mock-code em{font-style:normal;color:var(--title)}.mock-code s{text-decoration:none;color:var(--ok)}
.mock-loot{position:relative;z-index:1;display:flex;gap:8px;align-items:center}
.mock-loot i{width:46px;height:58px;border-radius:4px;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(0,0,0,.3)),var(--s3);border-bottom:4px solid var(--c);box-shadow:0 0 0 1px rgba(255,255,255,.06)}
.mock-loot i.win{transform:scale(1.18);box-shadow:0 0 0 2px var(--c),0 0 26px color-mix(in srgb,var(--c) 55%,transparent)}
.mock-loot::after{content:"";position:absolute;left:50%;top:-14px;bottom:-14px;width:2px;background:var(--key);transform:translateX(18px)}
.stats{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:8px;margin-top:8px}
.stats div{padding:10px 12px;border-radius:4px;background:var(--s1);border:1px solid var(--line)}
.stats b{display:block;font:italic 800 22px/1.05 var(--cond);text-transform:uppercase}
.stats span{font-size:12px;color:var(--mu)}
