/* B~LOG — the house system (Oct 2 2026; Oct 16 2026 Anthony: the whole scheme now matches the Studio — dark, gold, red,
   the Studio's own bar and dock at the top right). One stylesheet for the index and every post.
   Cream page, Instrument Serif carries the voice, Manrope does the reading, Outfit is the wordmark.
   Gold lives only inside the marks. Cards are hairlines, no hover lift. Phone first. */
:root{
  --page:#0a0a0d; --card:#15110f; --card-2:#1d1814; --ink:#f4efe2; --ink-2:#d9cfbb; --ink-3:#b8aa8c;
  --red:#c8102e; --red-deep:#5a0517; --line:rgba(214,178,96,.2); --line-2:rgba(214,178,96,.42);
  --gold:#d8b968; --gold-2:#f3cf62; --paper:#f4efe2; --paper-2:#d9cfbb;
  --serif:'Instrument Serif',Georgia,'Times New Roman',serif; --sans:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;
  --wrap:1240px; --gut:20px; --ease:cubic-bezier(.22,1,.36,1); --nav:64px; --measure:68ch;
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--page);-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{font-family:var(--sans);font-size:16px;line-height:1.55;color:var(--ink);background:var(--page);overflow-x:hidden}
img,video{max-width:100%;display:block;height:auto} a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:3px solid var(--red);outline-offset:3px;border-radius:4px}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)} @media(min-width:760px){:root{--gut:32px}}
h1,h2,h3,.serif{font-family:var(--serif);font-weight:400;letter-spacing:-.01em;line-height:1.05;text-wrap:balance}
em{font-style:italic}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 22px;border-radius:999px;background:var(--red);color:#fffcf6;font-weight:600;font-size:15px;transition:background .25s;text-decoration:none}
.btn:hover{background:#a80c26}
.btn.ghost{background:transparent;border:1px solid var(--line-2);color:var(--ink)} .btn.ghost:hover{border-color:var(--ink);background:rgba(36,20,23,.04)}
.btn.sm{min-height:44px;padding:8px 16px;font-size:14px}

/* nav — same as /about.html */
.nav{position:sticky;top:0;z-index:60;height:var(--nav);display:flex;align-items:center;background:var(--page);transition:background .35s,border-color .35s;border-bottom:1px solid transparent}
.nav.solid{background:rgba(247,240,223,.9);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-color:var(--line)}
.nav .wrap{display:flex;align-items:center;gap:12px;width:100%}
.brand{display:flex;align-items:center;gap:9px;font-family:'Outfit',var(--sans);font-weight:800;font-size:13.5px;line-height:1.05;letter-spacing:-.01em;text-transform:lowercase;color:var(--ink);white-space:nowrap;text-decoration:none}
.brand img{width:30px;height:30px;object-fit:contain}.brand span{display:flex;flex-direction:column}.brand small{font-size:9px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;opacity:.7}
.nav nav{margin-left:auto;display:none;align-items:center;gap:4px}
.nav nav a{font-size:14px;font-weight:500;color:var(--ink-2);padding:8px 12px;border-radius:999px}
.nav nav a:hover{color:var(--ink)} .nav nav a.on{color:var(--ink);box-shadow:inset 0 -2px 0 var(--red);border-radius:0;padding-bottom:6px}
.nav .store{display:none;color:#fffcf6}
.nav nav a.store{color:#fffcf6;border-radius:999px;padding:8px 16px}
.menu-btn{margin-left:auto;width:44px;height:44px;border:1px solid var(--line-2);border-radius:999px;display:grid;place-items:center}
.menu-btn span{width:18px;height:2px;background:var(--ink);box-shadow:0 -6px 0 var(--ink),0 6px 0 var(--ink)}
@media(min-width:900px){.nav nav{display:flex}.nav .store{display:inline-flex;margin-left:8px}.menu-btn{display:none}}
.nav.open{background:var(--page);border-color:var(--line)}
.nav.open nav{display:flex;position:absolute;left:0;right:0;top:var(--nav);flex-direction:column;align-items:stretch;background:var(--page);border-bottom:1px solid var(--line);padding:12px var(--gut) 20px;gap:2px}
.nav.open nav a{font-size:18px;padding:12px 6px;border-radius:0;min-height:48px;display:flex;align-items:center} .nav.open nav a.on{box-shadow:none;color:var(--red)}
.nav.open nav .store{display:inline-flex;margin:10px 0 0;align-self:flex-start;font-size:15px;min-height:44px;padding:8px 18px;border-radius:999px;color:#fffcf6}

/* ───────────────────────── INDEX ───────────────────────── */
.bhero{padding:40px 0 34px}
@media(min-width:900px){.bhero{padding:76px 0 52px}}
.bhero h1{font-size:clamp(44px,6vw,84px);line-height:.98;max-width:22ch}
.bhero h1 em{color:var(--red)}
.bhero .lede{margin-top:18px;font-size:clamp(17px,1.5vw,20px);color:var(--ink-2);max-width:58ch}
.sec-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:22px;margin-bottom:20px}
.sec-h h2{font-size:clamp(28px,3vw,40px)}
.sec-h span{font-size:14px;color:var(--ink-2)}

.posts{display:grid;gap:14px;grid-template-columns:1fr;padding-bottom:56px}
@media(min-width:760px){.posts{grid-template-columns:1fr 1fr}}
@media(min-width:1100px){.posts{grid-template-columns:repeat(3,1fr)}}
.pc{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:22px;overflow:hidden;min-width:0;transition:border-color .25s}
.pc:hover{border-color:var(--line-2)}
.pc:hover h3{color:var(--red)}
.pc .ph{aspect-ratio:16/9;background:var(--card-2);border-bottom:1px solid var(--line);overflow:hidden}
.pc .ph img{width:100%;height:100%;object-fit:cover}
.pc .tx{padding:20px 20px 22px;display:flex;flex-direction:column;gap:8px;flex:1}
.pc .when{font-size:13px;font-weight:600;color:var(--ink-2)}
.pc .when b{color:var(--red);font-weight:700}
.pc h3{font-size:28px;line-height:1.06;transition:color .2s}
.pc p{font-size:15px;color:var(--ink-2)}
.pc .go{margin-top:auto;padding-top:6px;font-size:14px;font-weight:600;color:var(--ink);text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--line-2)}
@media(min-width:760px){
  .pc.lead{grid-column:1/-1;flex-direction:row}
  .pc.lead .ph{flex:0 0 52%;aspect-ratio:auto;min-height:320px;border-bottom:0;border-right:1px solid var(--line)}
  .pc.lead .tx{padding:34px 34px 32px;justify-content:center}
  .pc.lead h3{font-size:clamp(36px,3.6vw,52px)}
  .pc.lead p{font-size:17px;max-width:46ch}
  .pc.lead .go{margin-top:12px}
}

.oslist{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);border-left:1px solid var(--line);margin-bottom:56px}
@media(min-width:760px){.oslist{grid-template-columns:repeat(4,1fr)}} @media(min-width:1100px){.oslist{grid-template-columns:repeat(7,1fr)}}
.oslist a{display:flex;flex-direction:column;gap:4px;padding:16px 14px 14px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);min-height:88px;transition:background .25s}
.oslist a:hover{background:var(--card)}
.oslist b{font-family:var(--serif);font-weight:400;font-size:21px;line-height:1.05}
.oslist span{font-size:13px;color:var(--ink-2)}

.contact{padding:0 0 80px}
.contact .box{position:relative;overflow:hidden;color:#f3ede2;background:linear-gradient(135deg,var(--red-deep),#3b0410 60%,#1a0308);border:1px solid rgba(200,16,46,.35);border-radius:28px;padding:40px 24px;display:grid;gap:24px}
@media(min-width:900px){.contact .box{grid-template-columns:1.3fr .7fr;align-items:center;padding:56px}}
.contact h2{font-size:clamp(34px,4.4vw,60px);line-height:.98}
.contact p{color:rgba(243,237,226,.82);font-size:17px;margin-top:12px;max-width:50ch}
.contact .side{display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.contact .side .btn.ghost{color:#f3ede2;border-color:rgba(243,237,226,.45)} .contact .side .btn.ghost:hover{border-color:#f3ede2;background:rgba(243,237,226,.08)}

/* ───────────────────────── POST ───────────────────────── */
.post-main{padding:36px 0 24px}
@media(min-width:900px){.post-main{padding:64px 0 32px}}
.post-main .wrap{max-width:calc(var(--measure) + 2 * var(--gut))}
article{font-size:18px;line-height:1.65;color:var(--ink)}
article .kick{display:inline-block;font-size:14px;font-weight:700;color:var(--red);letter-spacing:0;text-transform:none;margin-bottom:12px}
article h1{font-size:clamp(38px,5vw,48px);line-height:1.04;margin:0 0 16px}
article .dek{font-family:var(--serif);font-size:clamp(21px,2.2vw,25px);line-height:1.32;color:var(--ink-2);margin-bottom:6px}
article .byline{display:flex;gap:6px 18px;flex-wrap:wrap;font-size:14px;font-weight:600;color:var(--ink-2);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:12px 0;margin:22px 0 30px}
article .byline span{white-space:nowrap}
article p{margin:0 0 22px}
article a:not(.btn){color:var(--red);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
article a:not(.btn):hover{color:var(--red-deep)}
article b,article strong{font-weight:700}
article h2{font-size:clamp(30px,3vw,36px);line-height:1.08;margin:42px 0 14px}
article h3{font-size:26px;margin:32px 0 10px}
article .pull,article blockquote{font-family:var(--serif);font-size:clamp(24px,2.6vw,30px);line-height:1.22;color:var(--ink);border-left:3px solid var(--red);padding:2px 0 2px 20px;margin:34px 0}
article ul,article ol{margin:0 0 22px;padding:0;list-style:none}
article li{padding-left:24px;position:relative;margin-bottom:10px}
article li:before{content:"";position:absolute;left:2px;top:.72em;width:10px;height:1.5px;background:var(--red)}
article ol{counter-reset:n} article ol>li{counter-increment:n} article ol>li:before{content:counter(n);width:auto;height:auto;background:none;top:0;color:var(--red);font-weight:700;font-size:15px}
article img,article video{width:100%;max-width:100%;margin:10px 0 6px;border-radius:18px;border:1px solid var(--line);background:var(--card-2)}
article img.wide{max-width:100%}
article p.cap,article .filmcap,article figcaption{font-size:14px;line-height:1.45;color:var(--ink-2);margin:4px 0 28px;text-align:left;letter-spacing:0;text-transform:none;font-family:var(--sans)}
article hr{border:0;border-top:1px solid var(--line);margin:34px 0}
article code{font-size:.9em;background:var(--card-2);padding:1px 6px;border-radius:6px}

/* the post's own call-to-action row (kept from each post) */
article .next{display:flex;gap:10px;flex-wrap:wrap;margin:38px 0 6px;padding-top:24px;border-top:1px solid var(--line)}
article .next a{display:inline-flex;align-items:center;min-height:44px;padding:10px 18px;border-radius:999px;border:1px solid var(--line-2);color:var(--ink);font-size:15px;font-weight:600;text-decoration:none}
article .next a:hover{border-color:var(--ink);color:var(--ink);background:rgba(36,20,23,.04)}
article .next a.gold{background:var(--red);border-color:var(--red);color:#fffcf6}
article .next a.gold:hover{background:#a80c26;color:#fffcf6}
article .next .kick{display:block;width:100%;margin:0}
article .next p{width:100%;margin:0;color:var(--ink-2)}

/* prev / next */
.pager{display:grid;gap:10px;grid-template-columns:1fr;margin:34px 0 0}
@media(min-width:600px){.pager{grid-template-columns:1fr 1fr}}
.pager a{display:flex;flex-direction:column;gap:4px;min-height:44px;padding:16px 18px;border:1px solid var(--line);border-radius:18px;background:var(--card);transition:border-color .25s}
.pager a:hover{border-color:var(--line-2)}
.pager a:hover b{color:var(--red)}
.pager span{font-size:13px;font-weight:600;color:var(--ink-2)}
.pager b{font-family:var(--serif);font-weight:400;font-size:22px;line-height:1.1}
.pager .older{text-align:right} @media(max-width:599px){.pager .older{text-align:left}}
.pager .all{grid-column:1/-1;flex-direction:row;justify-content:center;align-items:center;background:transparent;font-size:15px;font-weight:600;padding:12px 18px}

/* more from the B~Log */
.more{padding:56px 0 72px}
.more .sec-h{margin-bottom:18px}
.more .posts{padding-bottom:0}
@media(min-width:760px){.more .posts{grid-template-columns:repeat(3,1fr)}}
.more .pc h3{font-size:24px}

/* footer — same as /about.html */
footer{border-top:1px solid var(--line);padding:54px 0 34px;color:var(--ink-2);font-size:14px}
footer .cols{display:grid;gap:30px;grid-template-columns:1fr}
@media(min-width:560px){footer .cols{grid-template-columns:1fr 1fr}} @media(min-width:960px){footer .cols{grid-template-columns:1.4fr 1fr 1fr 1fr}}
footer .cols>*{min-width:0} footer a{overflow-wrap:anywhere} footer a:hover{color:var(--ink)}
footer h4{font-family:var(--serif);font-weight:400;font-size:22px;color:var(--ink);margin-bottom:12px}
footer li{list-style:none;margin:8px 0}
footer .fine{margin-top:36px;padding-top:20px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:12.5px;color:var(--ink-2)}
@media(max-width:759px){footer{padding:48px 0 32px}footer .cols{gap:26px}footer li{margin:0}footer li a{display:inline-flex;align-items:center;min-height:44px}}

/* ─────────────── post-specific pieces (moved out of each post's inline style) ─────────────── */

/* before-the-internet: the film, the two exhibits, the quoted write-up, the geek box, the shelf of fourteen */
.post-before-the-internet .film,.post-how-an-app-gets-made .film{margin:28px 0 8px;border-radius:18px;overflow:hidden;border:1px solid var(--line);background:var(--card-2)}
.post-before-the-internet .film video,.post-how-an-app-gets-made .film video{display:block;width:100%;height:auto;margin:0;border:0;border-radius:0}
.post-before-the-internet .ex{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;margin:24px 0 8px}
.post-before-the-internet .ex figure{margin:0}
.post-before-the-internet .ex img{margin:0;border-radius:14px}
.post-before-the-internet .ex figcaption{margin:10px 0 0;font-size:13.5px}
.post-before-the-internet .q{border-left:3px solid var(--red);background:var(--card);border-radius:0 16px 16px 0;padding:18px 22px;margin:26px 0;font-family:var(--serif);font-size:22px;line-height:1.38;color:var(--ink)}
.post-before-the-internet .q small{display:block;font-family:var(--sans);font-size:13.5px;font-weight:600;color:var(--ink-2);margin-top:10px}
.post-before-the-internet .geek{border:1px solid var(--line);border-radius:20px;background:var(--card);padding:22px 22px 8px;margin:32px 0 14px}
.post-before-the-internet .geek b.h{display:block;font-family:var(--serif);font-weight:400;font-size:24px;color:var(--ink);margin-bottom:10px}
.post-before-the-internet .geek p{font-size:16px;margin:0 0 14px}
.post-before-the-internet .shelf{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px;margin:18px 0 8px}
.post-before-the-internet .shelf img{margin:0;border-radius:16px;border:0;background:transparent}
@media(max-width:560px){.post-before-the-internet .ex{grid-template-columns:1fr}.post-before-the-internet .shelf{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* how-an-app-gets-made: film caption */
.post-how-an-app-gets-made .filmcap{margin:10px 0 28px}

/* meet-the-neuro-divulge: tool headings with their icons, the color tags, the mark, the find-it row */
.post-meet-the-neuro-divulge article h2.tool{display:flex;align-items:center;gap:12px;margin-top:44px}
.post-meet-the-neuro-divulge article h2.tool img{width:46px;height:46px;max-width:46px;margin:0;border-radius:11px;border:0;flex:none;background:transparent}
.post-meet-the-neuro-divulge article .tag{font-size:14px;font-weight:700;margin:-4px 0 16px}
.post-meet-the-neuro-divulge article .mark{width:120px;max-width:120px;border-radius:22px;border:0;background:transparent}
.post-meet-the-neuro-divulge .find{display:flex;gap:10px;flex-wrap:wrap;margin:8px 0 24px}
.post-meet-the-neuro-divulge article .find a{display:inline-flex;align-items:center;min-height:44px;border:1px solid var(--line-2);color:var(--ink);padding:9px 16px;border-radius:999px;font-weight:600;font-size:15px;text-decoration:none}
.post-meet-the-neuro-divulge article .find a:hover{border-color:var(--ink)}

/* my-own-commercials and xpense-os: the videos */
.post-my-own-commercials article video,.post-xpense-os article video{background:var(--card-2)}

/* espohystory: the Roz read-along boxes */
.post-espohystory .rz{border:1px solid var(--line);border-radius:22px;background:var(--card);margin:24px 0 10px;overflow:hidden;font-size:16px}
.post-espohystory .rz .rzh{display:flex;align-items:center;gap:14px;padding:16px 20px;background:var(--card-2);border-bottom:1px solid var(--line);flex-wrap:wrap}
.post-espohystory .rz .gr{font-size:13px;font-weight:700;color:#fffcf6;background:var(--red-deep);padding:5px 12px;border-radius:999px;white-space:nowrap}
.post-espohystory .rz .ti{font-family:var(--serif);font-size:23px;line-height:1.1;color:var(--ink);flex:1;min-width:180px}
.post-espohystory .rz .ti i{display:block;font-style:italic;font-size:15px;color:var(--ink-2);margin-top:4px;font-family:var(--sans)}
.post-espohystory .rz .bar{display:flex;align-items:center;gap:12px;padding:12px 20px;border-bottom:1px solid var(--line);background:var(--card)}
.post-espohystory .rz button.pl{display:inline-flex;align-items:center;gap:9px;min-height:44px;background:var(--red);color:#fffcf6;font-weight:600;font-size:15px;padding:10px 20px;border-radius:999px;transition:background .18s}
.post-espohystory .rz button.pl:hover{background:#a80c26}
.post-espohystory .rz .tm{font-size:13px;color:var(--ink-2);font-variant-numeric:tabular-nums}
.post-espohystory .rz .sk{flex:1;height:5px;border-radius:99px;background:var(--line);overflow:hidden;min-width:60px}
.post-espohystory .rz .sk span{display:block;height:100%;width:0;background:var(--red);border-radius:99px}
.post-espohystory .rz .txw{position:relative}
.post-espohystory .rz .txw:after{content:"";position:absolute;left:0;right:0;bottom:0;height:38px;background:linear-gradient(180deg,rgba(255,252,246,0),var(--card) 78%);pointer-events:none}
.post-espohystory .rz .tx{padding:6px 20px 20px;max-height:300px;overflow-y:auto;scroll-behavior:smooth}
.post-espohystory .rz .tx p{font-family:var(--serif);font-size:20px;line-height:1.5;color:var(--ink);margin:14px 0}
.post-espohystory .rz .w{cursor:pointer;border-radius:4px;padding:0 1px;transition:background .1s linear,color .1s linear}
.post-espohystory .rz .w.on{background:rgba(200,16,46,.14);color:var(--red-deep);box-shadow:0 0 0 2px rgba(200,16,46,.14)}
.post-espohystory .rz .tb{padding:14px 20px 18px;background:var(--card-2);border-top:1px solid var(--line)}
.post-espohystory .rz .tb b{display:block;font-size:14px;font-weight:700;color:var(--red-deep);margin-bottom:8px}
.post-espohystory .rz .tb ul{margin:0}
.post-espohystory .rz .tb li{font-size:15px;line-height:1.55;color:var(--ink);margin:6px 0}
.post-espohystory .rz .nt{padding:10px 20px;font-size:13px;color:var(--ink-2);background:var(--card);border-top:1px solid var(--line)}
@media(max-width:560px){.post-espohystory .rz .tx p{font-size:18px}.post-espohystory .rz .ti{font-size:21px}}

/* phone */
@media(max-width:759px){
  article{font-size:18px}
  article h1{font-size:38px}
  article .pull,article blockquote{font-size:24px;padding-left:16px}
  .pc h3{font-size:26px}
  .bhero h1{font-size:44px}
  .contact .box{padding:34px 22px;border-radius:24px}
  .contact .side{align-items:stretch}
  .contact .side .btn{width:100%;min-height:52px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *{transition:none!important;animation:none!important}
}

/* ───────────── THE STUDIO SCHEME (Oct 16 2026, Anthony: "This needs to look the same as the rest of the site") ───────────── */
html,body{background:#0a0a0d}
body{background:radial-gradient(120% 60% at 50% 0%,#1c1511 0%,#0a0a0d 55%) no-repeat,#0a0a0d}
.nav{background:transparent}
.bhero h1 em,.contact h2 em,article h1 em,article h2 em{color:var(--gold-2)}
.bhero h1{color:#fff}
.bhero h1 em{font-style:italic}
.sec-h h2,article h1,article h2,article h3{color:#fff}
.pc{background:rgba(27,22,19,.9);border-color:rgba(214,178,96,.28)}
.pc:hover{border-color:rgba(243,207,98,.7)}
.pc:hover h3,.pager a:hover b{color:var(--gold-2)}
.pc .when b,article .kick{color:var(--gold)}
.pc h3{color:#fff}
.pc .go{color:var(--gold-2);text-decoration-color:rgba(243,207,98,.45)}
.oslist a:hover{background:rgba(27,22,19,.9)}
.oslist b{color:#fff}
.btn.ghost{color:#efe6d2;border-color:rgba(214,178,96,.5)} .btn.ghost:hover{border-color:var(--gold-2);background:rgba(243,207,98,.08)}
.contact .box{background:linear-gradient(135deg,#2a0610,#14070a 60%,#0d0507);border-color:rgba(214,178,96,.32)}
article a:not(.btn){color:var(--gold-2);text-decoration-color:rgba(243,207,98,.45)}
article a:not(.btn):hover{color:#fff}
article .pull,article blockquote{color:#fff;border-left-color:var(--gold)}
article li:before{background:var(--gold)}
article ol>li:before{color:var(--gold);background:none}
article .next a{color:var(--ink);border-color:rgba(214,178,96,.5)}
article .next a:hover{border-color:var(--gold-2);color:#fff;background:rgba(243,207,98,.08)}
article .next a.gold{background:var(--red);border-color:var(--red);color:#fffcf6}
.pager a{background:rgba(27,22,19,.9);border-color:rgba(214,178,96,.28)}
.pager b{color:#fff}
footer h4{color:#fff}
footer a:hover{color:var(--gold-2)}
.post-before-the-internet .q,.post-before-the-internet .geek{border-left-color:var(--gold)}
.post-espohystory .rz .txw:after{background:linear-gradient(180deg,rgba(21,17,15,0),var(--card) 78%)}
.post-espohystory .rz .w.on{background:rgba(243,207,98,.18);color:#fff;box-shadow:0 0 0 2px rgba(243,207,98,.18)}
.post-espohystory .rz .tb b{color:var(--gold)}
.post-meet-the-neuro-divulge article .find a{color:var(--ink);border-color:rgba(214,178,96,.5)}
.post-meet-the-neuro-divulge article .find a:hover{border-color:var(--gold-2)}
/* the plain / technical switch: the Studio's gold pill */
.vs-open{display:inline-flex;align-items:center;min-height:44px;padding:9px 18px;border:1px solid rgba(214,178,96,.5) !important;border-radius:999px;color:var(--ink) !important;background:rgba(27,22,19,.9) !important}
.vs-open b{color:#fff !important;box-shadow:none !important}
.vs-open small{color:var(--ink-3) !important}
.vs-open svg{stroke:var(--gold-2) !important}
.vs-open:hover{border-color:var(--gold-2) !important}
.vs-open[aria-pressed="true"]{background:var(--red) !important;border-color:var(--red) !important;color:#fffcf6 !important}
.vs-chev{border-color:var(--gold-2) !important}
.vs-mark{color:var(--gold) !important}
[data-version="geek"] code{background:rgba(243,207,98,.1) !important;color:#f4efe2 !important}
article code{background:rgba(243,207,98,.1);color:#f4efe2}
/* the bar's top-right dock needs the page to start under the bar */
.post-main{padding-top:28px}