/* ─── shared brutalist case page styles ─── */
:root{
  --bg:#ededea;
  --ink:#0a0a0a;
  --line:#0a0a0a;
  --soft:rgba(10,10,10,.05);
  --muted:rgba(10,10,10,.55);
  --grid:rgba(10,10,10,.08);
  --mono:"JetBrains Mono",ui-monospace,"SF Mono",monospace;
  --pad:clamp(16px,3vw,32px);
  --maxw:1480px;
}
html[data-theme="dark"]{
  --bg:#0a0a0a;
  --ink:#ededea;
  --line:#ededea;
  --soft:rgba(237,237,234,.06);
  --muted:rgba(237,237,234,.55);
  --grid:rgba(237,237,234,.1);
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--mono);font-size:14px;line-height:1.5;transition:background .25s,color .25s}
body{-webkit-font-smoothing:antialiased;overflow-x:hidden;font-variant-ligatures:none}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}

.grid-bg{position:fixed;inset:0;pointer-events:none;z-index:0;background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(to bottom,black 0,black calc(100% - 200px),transparent 100%)}
.shell{position:relative;z-index:1;max-width:var(--maxw);margin:0 auto;padding:0 var(--pad)}

.topbar{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);font-size:11px;text-transform:uppercase;letter-spacing:.08em;padding:8px 0;position:sticky;top:0;background:var(--bg);z-index:30}
.topbar .left,.topbar .right{display:flex;gap:18px;align-items:center}
.blink{display:inline-block;width:8px;height:8px;background:var(--ink);animation:blink .9s steps(2) infinite;margin-right:6px;vertical-align:middle}
@keyframes blink{50%{opacity:0}}
@media (max-width:700px){.topbar .hide-sm{display:none}}

.nav{display:flex;align-items:center;justify-content:space-between;padding:18px 0;border-bottom:1px solid var(--line);position:sticky;top:33px;background:var(--bg);z-index:29}
.logo{display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:18px;letter-spacing:.02em}
.logo .eye{font-size:14px;letter-spacing:-.05em;border:1px solid var(--line);padding:2px 8px}
.back{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);padding:8px 14px;font-size:12px;text-transform:uppercase;letter-spacing:.08em;background:var(--bg);transition:.15s}
.back:hover{background:var(--ink);color:var(--bg)}
.nav-right{display:flex;gap:10px;align-items:center}
.btn{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);padding:8px 14px;font-size:12px;text-transform:uppercase;letter-spacing:.08em;background:var(--bg);transition:.15s}
.btn:hover{background:var(--ink);color:var(--bg)}
.btn.solid{background:var(--ink);color:var(--bg)}
.btn.solid:hover{background:var(--bg);color:var(--ink)}

.breadcrumb{display:flex;align-items:center;gap:10px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:24px 0;border-bottom:1px dashed var(--line)}
.breadcrumb a:hover{color:var(--ink)}
.breadcrumb .sep::before{content:" / ";opacity:.5}

.hero-case{padding:48px 0 56px;border-bottom:1px solid var(--line)}
.hero-grid{display:grid;grid-template-columns:1.7fr 1fr;gap:48px;align-items:start}
h1.case-title{font-size:clamp(40px,7vw,108px);font-weight:700;letter-spacing:-.04em;line-height:.95;margin:0;text-transform:uppercase}
.case-title .slash{color:var(--muted);font-weight:400}
.case-tagline{margin:24px 0 0;font-size:18px;line-height:1.45;max-width:46ch}
.meta-box{border:1px solid var(--line);background:var(--bg);padding:18px}
.meta-row{display:flex;justify-content:space-between;gap:12px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;padding:8px 0;border-bottom:1px dashed var(--line)}
.meta-row:last-child{border-bottom:0}
.meta-row .lbl{color:var(--muted)}
.meta-row .val{color:var(--ink);font-weight:500;text-align:right}
@media (max-width:860px){.hero-grid{grid-template-columns:1fr;gap:32px}}

/* ─── cover ─── */
.cover{border-bottom:1px solid var(--line);padding:48px 0}
.cover-box{aspect-ratio:21/9;border:1px solid currentColor;background:var(--mk-bg, var(--bg));color:var(--mk-fg, var(--ink));display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;padding:32px}
.cover-box::before,.cover-box::after{content:"";position:absolute;background:currentColor;opacity:.2}
.cover-box::before{top:18px;bottom:18px;left:18px;width:1px}
.cover-box::after{top:18px;bottom:18px;right:18px;width:1px}
.cover-content{display:flex;flex-direction:column;align-items:center;gap:18px;text-align:center;font-family:var(--mono);position:relative;z-index:1}
.cover-corners{position:absolute;top:14px;left:14px;right:14px;bottom:14px;pointer-events:none}
.cover-corners::before,.cover-corners::after{content:"";position:absolute;width:18px;height:18px;border:1px solid currentColor;opacity:.5}
.cover-corners::before{top:0;left:0;border-right:0;border-bottom:0}
.cover-corners::after{bottom:0;right:0;border-left:0;border-top:0}
.cover-mark{font-size:clamp(64px,12vw,140px);line-height:.85;letter-spacing:-.04em;font-weight:700}
.cover-name{font-size:clamp(28px,4.5vw,52px);letter-spacing:.36em;font-weight:700;text-transform:uppercase}
.cover-sub{font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--mk-muted, var(--muted));padding:6px 18px;border-top:1px solid currentColor;border-bottom:1px solid currentColor}
.cover-meta{display:flex;gap:24px;font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--mk-muted, var(--muted));margin-top:8px;flex-wrap:wrap;justify-content:center}
.cover-meta b{color:currentColor;font-weight:700;margin-left:6px}

/* ─── section ─── */
section.b{padding:64px 0;border-bottom:1px solid var(--line);position:relative}
.b-head{display:flex;justify-content:space-between;align-items:end;border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:32px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.b-head h2{font-family:var(--mono);font-size:clamp(28px,4.5vw,56px);font-weight:700;text-transform:uppercase;letter-spacing:-.03em;line-height:1;margin:0;color:var(--ink)}
.b-head .right{text-align:right}

/* ─── brief grid ─── */
.brief-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:48px;align-items:start}
.brief-body{font-size:18px;line-height:1.55}
.brief-body p{margin:0 0 14px}
.brief-body b{background:var(--ink);color:var(--bg);padding:0 4px;font-weight:500}
.aside-box{border:1px solid var(--line);background:var(--soft);padding:20px}
.aside-box h3{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0 0 14px;font-weight:500}
.aside-box ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px;font-size:13px}
.aside-box li{display:flex;gap:10px}
.aside-box li::before{content:"→";color:var(--muted);flex:0 0 14px}
@media (max-width:860px){.brief-grid{grid-template-columns:1fr;gap:24px}}

/* ─── approach steps ─── */
.approach-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.app-step{background:var(--bg);padding:24px;display:flex;flex-direction:column;gap:14px;min-height:200px;transition:.2s}
.app-step:hover{background:var(--ink);color:var(--bg)}
.app-step:hover .step-desc{color:rgba(237,237,234,.6)}
.step-num{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);display:flex;justify-content:space-between;padding-bottom:10px;border-bottom:1px dashed currentColor}
.step-name{font-size:20px;font-weight:700;letter-spacing:-.02em}
.step-desc{font-size:13px;line-height:1.5;color:var(--muted);flex:1}
@media (max-width:760px){.approach-grid{grid-template-columns:1fr}}

/* ─── deliverables ─── */
.deliv-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.deliv{border:1px solid var(--line);background:var(--bg);display:flex;flex-direction:column;min-height:280px;overflow:hidden}
.deliv .mock{flex:1;border-bottom:1px solid var(--line);display:flex;align-items:stretch;justify-content:stretch;position:relative;background:var(--mk-bg, var(--soft));color:var(--mk-fg, var(--ink));overflow:hidden;min-height:260px}
.deliv .info{padding:14px 16px;display:flex;flex-direction:column;gap:4px;background:var(--bg);color:var(--ink)}
.deliv .info small{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.deliv .info h4{margin:0;font-size:15px;font-weight:600;letter-spacing:-.01em}
.d6{grid-column:span 6}
.d4{grid-column:span 4}
.d8{grid-column:span 8}
.d12{grid-column:span 12}
@media (max-width:960px){.d6,.d4,.d8,.d12{grid-column:span 6}}
@media (max-width:600px){.d6,.d4,.d8,.d12{grid-column:span 12}}

/* ─── mockup widgets ─── */
.mk{flex:1;width:100%;display:flex;flex-direction:column;font-family:var(--mono);font-size:11px;line-height:1.5;padding:18px;gap:10px;color:inherit}
.mk *{box-sizing:border-box}
.mk-row{display:flex;justify-content:space-between;align-items:center;gap:8px}
.mk-head{font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--mk-muted, var(--muted));display:flex;justify-content:space-between;padding-bottom:6px;border-bottom:1px dashed currentColor;opacity:.85}

.mk-logo{align-items:center;justify-content:center;text-align:center;padding:24px 16px;gap:14px}
.mk-logo .mark{font-size:64px;font-weight:700;line-height:.8;letter-spacing:-.04em}
.mk-logo .name{font-size:14px;letter-spacing:.32em;font-weight:700;text-transform:uppercase}
.mk-logo .sub{font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--mk-muted, var(--muted));padding:6px 14px;border-top:1px solid currentColor;border-bottom:1px solid currentColor}
.mk-logo .meta{font-size:8px;letter-spacing:.18em;text-transform:uppercase;color:var(--mk-muted, var(--muted));margin-top:4px;opacity:.7}

.mk-palette{padding:14px}
.mk-palette .swatches{flex:1;display:grid;gap:6px;min-height:140px}
.mk-palette .sw{display:flex;flex-direction:column;justify-content:flex-end;padding:8px;font-size:9px;line-height:1.15;letter-spacing:.04em;min-height:54px;border:1px solid rgba(0,0,0,.18)}
.mk-palette .sw .lbl{font-weight:700;letter-spacing:.06em;text-transform:uppercase;display:block;margin-bottom:2px}
.mk-palette .sw .code{opacity:.7}

.mk-typo{padding:18px;gap:12px;justify-content:center}
.mk-typo .h1{font-size:34px;font-weight:700;letter-spacing:-.04em;line-height:.95}
.mk-typo .h1.serif{font-family:'Newsreader',serif;font-weight:400;font-style:italic;letter-spacing:-.02em}
.mk-typo .h2{font-size:17px;font-weight:600;letter-spacing:-.01em;line-height:1.1}
.mk-typo .body{font-size:11px;line-height:1.45;max-width:30ch}
.mk-typo .scale{font-size:9px;color:var(--mk-muted, var(--muted));letter-spacing:.12em;text-transform:uppercase;padding-top:6px;border-top:1px dashed currentColor}

.mk-window{padding:0;background:var(--mk-bg, var(--bg));color:var(--mk-fg, var(--ink))}
.mk-window .titlebar{display:flex;align-items:center;gap:8px;padding:7px 12px;border-bottom:1px solid rgba(0,0,0,.18);font-size:9px;color:var(--mk-muted, var(--muted));letter-spacing:.08em}
.mk-window .dots{display:inline-flex;gap:5px;margin-right:6px}
.mk-window .dots span{width:8px;height:8px;border:1px solid currentColor;border-radius:50%}
.mk-window .body{flex:1;padding:14px;display:flex;flex-direction:column;gap:8px;overflow:hidden;font-size:10px;line-height:1.4}
.mk-window h5{margin:0;font-family:var(--mono);font-size:16px;font-weight:700;letter-spacing:-.02em;line-height:1}
.mk-window h5.big{font-size:22px}
.mk-window .row{display:flex;justify-content:space-between;align-items:baseline;gap:8px;padding:4px 0;border-bottom:1px dotted rgba(0,0,0,.18);font-size:10px}
.mk-window .row.head{font-size:9px;letter-spacing:.1em;text-transform:uppercase;opacity:.7;border-bottom-style:solid}
.mk-window .row .pr{font-weight:600}
.mk-window .btn{display:inline-flex;align-items:center;gap:6px;border:1px solid currentColor;padding:6px 10px;font-size:9px;letter-spacing:.08em;text-transform:uppercase;align-self:flex-start}
.mk-window .btn.solid{background:currentColor}
.mk-window .btn.solid span{color:var(--mk-bg, var(--bg))}
.mk-window .grid-2{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.mk-window .grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.mk-window .grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.mk-window .tile{aspect-ratio:1;border:1px solid rgba(0,0,0,.2);padding:6px;display:flex;flex-direction:column;justify-content:space-between;font-size:8px}
.mk-window .tile .ph{flex:1;border:1px dashed rgba(0,0,0,.25);margin-bottom:4px;display:flex;align-items:center;justify-content:center;font-size:14px;opacity:.5}
.mk-window .nav{display:flex;gap:8px;font-size:9px;letter-spacing:.1em;text-transform:uppercase}
.mk-window .nav span.cur{font-weight:700;border-bottom:1px solid currentColor}

.mk-mobile{padding:14px;background:repeating-linear-gradient(45deg,transparent 0 22px,rgba(0,0,0,.04) 22px 23px);align-items:center;justify-content:center}
.mk-mobile .phone{width:148px;border:1.5px solid currentColor;background:var(--mk-bg, var(--bg));color:var(--mk-fg, var(--ink));padding:10px 9px 12px;display:flex;flex-direction:column;gap:6px;border-radius:14px;font-size:9px;line-height:1.35}
.mk-mobile .phone .notch{width:32px;height:4px;background:currentColor;border-radius:2px;margin:0 auto 6px;opacity:.5}
.mk-mobile .phone h5{margin:0;font-size:14px;font-weight:700;line-height:1;letter-spacing:-.02em}
.mk-mobile .phone .row{display:flex;justify-content:space-between;padding:3px 0;border-bottom:1px dotted rgba(0,0,0,.2);font-size:9px}
.mk-mobile .phone .btn{border:1px solid currentColor;padding:6px;text-align:center;font-size:8px;letter-spacing:.1em;text-transform:uppercase;margin-top:4px}
.mk-mobile .phone .btn.solid{background:currentColor}
.mk-mobile .phone .btn.solid span{color:var(--mk-bg, var(--bg))}

.mk-tree{padding:18px;font-size:11px;line-height:1.55;display:flex;flex-direction:column;gap:8px}
.mk-tree h5{font-family:var(--mono);font-size:13px;font-weight:700;margin:0;letter-spacing:-.01em}
.mk-tree ul{list-style:none;margin:0;padding:0}
.mk-tree li{padding:2px 0 2px 14px;position:relative}
.mk-tree li::before{content:"└─";color:var(--mk-muted, var(--muted));position:absolute;left:0;top:2px;font-family:var(--mono)}
.mk-tree .sub{padding-left:18px}
.mk-tree .strike{text-decoration:line-through;opacity:.5}
.mk-tree .new{background:currentColor;color:var(--mk-bg, var(--bg));padding:0 4px;display:inline-block}

.mk-tokens{padding:14px;font-size:10px;gap:0}
.mk-tokens h5{margin:0 0 10px;font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--mk-muted, var(--muted))}
.mk-tokens .row{display:grid;grid-template-columns:20px 1fr auto;gap:8px;align-items:center;padding:4px 0;border-bottom:1px dotted rgba(0,0,0,.18)}
.mk-tokens .swatch{width:14px;height:14px;border:1px solid currentColor}
.mk-tokens .name{color:var(--mk-muted, var(--muted))}
.mk-tokens .val{font-weight:600}
.mk-tokens .glyph{display:inline-flex;align-items:center;justify-content:center;width:18px;height:14px;font-family:var(--mono);font-size:11px}

.mk-social{padding:14px;display:grid;grid-template-columns:1fr 1fr;gap:6px}
.mk-social .post{aspect-ratio:1;border:1px solid rgba(0,0,0,.2);background:var(--mk-bg, var(--bg));color:var(--mk-fg, var(--ink));display:flex;flex-direction:column;justify-content:space-between;padding:8px;font-size:8px;letter-spacing:.06em;text-transform:uppercase;overflow:hidden;gap:4px}
.mk-social .post.inv{background:var(--mk-fg, var(--ink));color:var(--mk-bg, var(--bg))}
.mk-social .post .num{opacity:.65}
.mk-social .post .ttl{font-weight:700;font-size:11px;line-height:1.05;letter-spacing:.02em;text-transform:none}

.mk-cert{padding:14px;justify-content:stretch}
.mk-cert .frame{flex:1;border:1.5px double currentColor;padding:16px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;text-align:center;background:var(--mk-bg, var(--bg));position:relative;gap:8px}
.mk-cert .frame::before{content:"";position:absolute;inset:6px;border:1px solid currentColor;opacity:.35}
.mk-cert .frame > *{position:relative;z-index:1}
.mk-cert .top{font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--mk-muted, var(--muted))}
.mk-cert .who{font-family:'Newsreader',serif;font-style:italic;font-size:24px;line-height:1;letter-spacing:-.01em;font-weight:400}
.mk-cert .meta{font-size:8px;letter-spacing:.16em;text-transform:uppercase;display:flex;gap:18px;flex-wrap:wrap;justify-content:center}

.mk-schedule{padding:14px;gap:4px;font-size:10px}
.mk-schedule h5{margin:0 0 8px;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--mk-muted, var(--muted));font-weight:700;display:flex;justify-content:space-between}
.mk-schedule .day{display:grid;grid-template-columns:32px 1fr 56px 12px;gap:8px;padding:4px 0;border-bottom:1px dotted rgba(0,0,0,.18);align-items:center}
.mk-schedule .day .d{font-weight:700;text-transform:uppercase}
.mk-schedule .day .nm{color:var(--mk-muted, var(--muted))}
.mk-schedule .day .t{text-align:right;opacity:.7}
.mk-schedule .day .dot{width:8px;height:8px;border:1px solid currentColor;border-radius:50%;justify-self:end}
.mk-schedule .day .dot.full{background:currentColor}

.mk-code{padding:14px;background:var(--mk-bg, var(--bg));color:var(--mk-fg, var(--ink));overflow:hidden;justify-content:flex-start}
.mk-code h5{margin:0 0 8px;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--mk-muted, var(--muted));font-weight:700}
.mk-code pre{margin:0;font-family:var(--mono);font-size:10px;line-height:1.6;white-space:pre;color:inherit}
.mk-code .key{color:var(--mk-muted, var(--muted))}
.mk-code .str{font-weight:600}

.mk-doc{padding:14px}
.mk-doc .doc{flex:1;border:1.5px solid currentColor;background:var(--mk-bg, var(--bg));padding:16px;display:flex;flex-direction:column;gap:12px;justify-content:space-between;position:relative}
.mk-doc .doc::after{content:"";position:absolute;top:14px;right:14px;width:28px;height:14px;border:1px solid currentColor;opacity:.3}
.mk-doc h5{margin:0;font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:700}
.mk-doc .title{font-family:'Newsreader',serif;font-size:26px;line-height:.95;font-weight:400;letter-spacing:-.02em;font-style:italic}
.mk-doc .index{display:flex;flex-direction:column;gap:3px;font-size:10px;line-height:1.4}
.mk-doc .index .it{display:grid;grid-template-columns:18px 1fr auto;gap:10px}
.mk-doc .index .it .n{color:var(--mk-muted, var(--muted))}
.mk-doc .index .it .pg{color:var(--mk-muted, var(--muted));font-variant-numeric:tabular-nums}
.mk-doc .stamp{align-self:flex-end;font-size:8px;letter-spacing:.18em;text-transform:uppercase;border:1px solid currentColor;padding:4px 10px;color:var(--mk-muted, var(--muted))}

.mk-slide{padding:0}
.mk-slide .stage{flex:1;background:var(--mk-bg, var(--bg));color:var(--mk-fg, var(--ink));padding:20px;display:flex;flex-direction:column;gap:14px;justify-content:space-between}
.mk-slide .stage h5{margin:0;font-size:9px;letter-spacing:.18em;text-transform:uppercase;font-weight:700}
.mk-slide .stage .title{font-size:28px;line-height:.95;letter-spacing:-.03em;font-weight:700;max-width:14ch}
.mk-slide .stage .footer{display:flex;justify-content:space-between;align-items:end;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--mk-muted, var(--muted))}

.mk-card{padding:14px}
.mk-card .photo{flex:1;border:1px dashed rgba(0,0,0,.3);background:var(--mk-bg, var(--bg));display:flex;align-items:center;justify-content:center;min-height:100px;font-size:42px;font-weight:300;color:var(--mk-muted, var(--muted));line-height:1}
.mk-card .info{display:flex;justify-content:space-between;align-items:end;padding-top:10px;font-size:10px}
.mk-card .info .pr{font-size:14px;font-weight:700;letter-spacing:-.01em}
.mk-card .meta{display:flex;justify-content:space-between;font-size:8px;letter-spacing:.1em;text-transform:uppercase;color:var(--mk-muted, var(--muted));padding-top:4px;border-top:1px dotted rgba(0,0,0,.2)}

.mk-qr{padding:14px;align-items:center;justify-content:center;gap:8px;text-align:center}
.mk-qr .qr{width:88px;height:88px;background-image:radial-gradient(circle,currentColor 1px,transparent 1.4px);background-size:6px 6px;background-position:center;position:relative;border:2px solid currentColor}
.mk-qr .qr .corner{position:absolute;width:22px;height:22px;border:3px solid currentColor;background:var(--mk-bg, var(--bg))}
.mk-qr .qr .corner.tl{top:-2px;left:-2px}
.mk-qr .qr .corner.tr{top:-2px;right:-2px}
.mk-qr .qr .corner.bl{bottom:-2px;left:-2px}
.mk-qr .lbl{font-size:9px;letter-spacing:.18em;text-transform:uppercase}

/* ─── results ─── */
.results-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.result{background:var(--bg);padding:28px 22px;display:flex;flex-direction:column;gap:14px;min-height:180px;justify-content:space-between}
.r-num{font-size:clamp(40px,5vw,64px);font-weight:700;letter-spacing:-.04em;line-height:.95}
.r-num .unit{font-size:.4em;font-weight:500;letter-spacing:0;color:var(--muted);margin-left:4px}
.r-label{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);line-height:1.4}
@media (max-width:900px){.results-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:480px){.results-grid{grid-template-columns:1fr}}

/* ─── quote ─── */
.quote-block{border:1px solid var(--line);padding:48px;background:var(--soft);position:relative}
.quote-block::before{content:"\"";position:absolute;top:24px;left:48px;font-family:var(--mono);font-size:120px;font-weight:700;line-height:1;color:var(--ink);opacity:.1;pointer-events:none}
.quote-text{font-size:clamp(20px,2.2vw,28px);line-height:1.4;font-weight:500;letter-spacing:-.01em;max-width:60ch;margin:0 0 24px;position:relative;z-index:1}
.quote-author{display:flex;justify-content:space-between;align-items:end;padding-top:18px;border-top:1px dashed var(--line);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.quote-author .name{color:var(--ink);font-weight:500}

/* ─── next ─── */
.next-case{padding:64px 0 80px;border-bottom:1px solid var(--line)}
.next-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.nav-card{border:1px solid var(--line);padding:32px;background:var(--bg);transition:.2s;display:flex;flex-direction:column;gap:14px;min-height:200px}
.nav-card:hover{background:var(--ink);color:var(--bg)}
.nav-card:hover .nc-meta{color:rgba(237,237,234,.6)}
.nc-dir{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.nav-card:hover .nc-dir{color:rgba(237,237,234,.6)}
.nc-name{font-size:28px;font-weight:700;letter-spacing:-.02em;line-height:1.05;margin-top:auto}
.nc-meta{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-top:auto;padding-top:14px;border-top:1px dashed currentColor}
@media (max-width:600px){.next-grid{grid-template-columns:1fr}}

/* ─── footer ─── */
footer{padding:48px 0 24px;position:relative;z-index:1}
.foot-row{display:flex;justify-content:space-between;flex-wrap:wrap;gap:24px;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.foot-row a:hover{color:var(--ink)}

::selection{background:var(--ink);color:var(--bg)}

/* ──────────────────────────────────────────────────────
   SITE SHOT — full-fidelity brand product mockups
   Drop-in into a section. Set brand colors via CSS vars on the
   wrapper element (--mk-bg, --mk-fg, --mk-muted, --mk-accent).
   ────────────────────────────────────────────────────── */
.ss-wrap{margin-top:32px;display:flex;flex-direction:column;gap:48px}
.ss-cap{display:flex;justify-content:space-between;gap:24px;align-items:end;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding-bottom:10px;border-bottom:1px dashed var(--line);margin-bottom:14px}
.ss-cap .l{color:var(--ink);font-weight:600}
.ss-cap .num{font-variant-numeric:tabular-nums}

.ss{border:1px solid var(--line);background:var(--mk-bg);color:var(--mk-fg);font-family:var(--mono);font-size:13px;line-height:1.5;overflow:hidden;position:relative;display:flex;flex-direction:column}
.ss[data-mode="dark"]{--mk-line:rgba(255,255,255,.14);--mk-line-strong:rgba(255,255,255,.22)}
.ss[data-mode="light"]{--mk-line:rgba(0,0,0,.12);--mk-line-strong:rgba(0,0,0,.2)}

.ss-chrome{display:flex;align-items:center;gap:10px;padding:10px 16px;border-bottom:1px solid var(--mk-line);font-size:10px;letter-spacing:.08em;color:var(--mk-muted);background:var(--mk-bg)}
.ss-chrome .dots{display:inline-flex;gap:5px}
.ss-chrome .dots span{width:9px;height:9px;border:1px solid currentColor;border-radius:50%;opacity:.6}
.ss-chrome .url{flex:1;text-align:center;font-size:10px;letter-spacing:.05em;padding:4px 10px;border:1px solid var(--mk-line);border-radius:2px;max-width:340px;margin:0 auto;color:var(--mk-fg);opacity:.85}
.ss-chrome .meta{font-size:10px;letter-spacing:.1em}

/* ─── site nav ─── */
.ss-nav{display:flex;align-items:center;justify-content:space-between;padding:18px 28px;border-bottom:1px solid var(--mk-line);font-size:11px;letter-spacing:.1em;text-transform:uppercase}
.ss-nav .brand{display:inline-flex;align-items:center;gap:10px;font-weight:700;letter-spacing:.18em;font-size:13px}
.ss-nav .brand .mk{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border:1px solid currentColor;font-size:14px}
.ss-nav ul{display:flex;gap:22px;list-style:none;margin:0;padding:0;font-size:11px;letter-spacing:.12em}
.ss-nav ul a{opacity:.7}
.ss-nav ul a.cur{opacity:1;font-weight:700;border-bottom:1px solid currentColor;padding-bottom:2px}
.ss-nav .right{display:flex;gap:14px;align-items:center;font-size:10px;letter-spacing:.12em}
.ss-nav .right .cta{border:1px solid currentColor;padding:8px 14px;font-weight:600}

/* ─── content sections (live inside .ss) ─── */
.ss-sec{padding:36px 28px;border-bottom:1px solid var(--mk-line);position:relative}
.ss-sec:last-child{border-bottom:0}
.ss-sec.tight{padding:24px 28px}

/* hero shot — big banner */
.ss-hero{display:grid;grid-template-columns:1.2fr 1fr;gap:32px;align-items:end;min-height:420px;padding:48px 28px;position:relative;overflow:hidden}
.ss-hero h1{margin:0;font-family:var(--mono);font-size:clamp(40px,5vw,84px);line-height:.92;letter-spacing:-.04em;font-weight:700;text-transform:uppercase}
.ss-hero h1.serif{font-family:'Newsreader',serif;font-style:italic;font-weight:400;letter-spacing:-.02em;text-transform:none}
.ss-hero .sub{font-size:13px;line-height:1.5;max-width:42ch;margin:16px 0 0;color:var(--mk-muted)}
.ss-hero .meta-strip{position:absolute;left:28px;top:28px;display:flex;gap:18px;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--mk-muted)}
.ss-hero .meta-strip b{color:var(--mk-fg);font-weight:600;margin-left:6px}
.ss-hero .cta-row{display:flex;gap:12px;margin-top:24px;flex-wrap:wrap}
.ss-hero .cta-row a{padding:14px 22px;border:1px solid currentColor;font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:600}
.ss-hero .cta-row a.solid{background:var(--mk-fg);color:var(--mk-bg)}
.ss-hero .col-img{aspect-ratio:1/1.05;border:1px solid currentColor;background:repeating-linear-gradient(45deg,transparent 0 14px,var(--mk-line) 14px 15px);position:relative;display:flex;align-items:flex-end;padding:14px}
.ss-hero .col-img .ph{font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--mk-muted)}
.ss-hero .col-img .badge{position:absolute;top:14px;right:14px;border:1px solid currentColor;padding:4px 8px;font-size:9px;letter-spacing:.16em;text-transform:uppercase}
@media (max-width:860px){.ss-hero{grid-template-columns:1fr;min-height:auto}}

/* runner band — strip across the page */
.ss-runner{display:flex;align-items:center;gap:32px;padding:12px 28px;border-bottom:1px solid var(--mk-line);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--mk-muted);overflow:hidden;white-space:nowrap}
.ss-runner span{display:inline-flex;align-items:center;gap:32px}
.ss-runner i{font-style:normal;opacity:.5}

/* section heading inside the site */
.ss-h{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:24px;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--mk-muted);padding-bottom:10px;border-bottom:1px solid var(--mk-line)}
.ss-h h2{margin:0;font-family:var(--mono);font-size:clamp(22px,2.4vw,32px);font-weight:700;letter-spacing:-.02em;line-height:1;color:var(--mk-fg);text-transform:uppercase}
.ss-h h2.serif{font-family:'Newsreader',serif;font-style:italic;font-weight:400;text-transform:none;letter-spacing:-.01em;font-size:clamp(26px,3vw,40px)}
.ss-h .num{font-variant-numeric:tabular-nums}

/* masters grid */
.ss-people{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--mk-line);border:1px solid var(--mk-line)}
.ss-person{background:var(--mk-bg);padding:18px;display:flex;flex-direction:column;gap:10px}
.ss-person .ph{aspect-ratio:3/4;border:1px solid currentColor;background:repeating-linear-gradient(135deg,transparent 0 12px,var(--mk-line) 12px 13px);display:flex;align-items:flex-end;justify-content:flex-start;padding:8px;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--mk-muted)}
.ss-person h4{margin:0;font-size:18px;font-weight:700;letter-spacing:-.02em}
.ss-person .role{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--mk-muted)}
.ss-person .tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:auto;font-size:9px;letter-spacing:.08em;text-transform:uppercase}
.ss-person .tags span{border:1px solid currentColor;padding:2px 6px;opacity:.7}
.ss-person .stat{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--mk-muted);padding-top:8px;border-top:1px dashed currentColor}
.ss-person .stat b{color:var(--mk-fg);font-weight:600}
@media (max-width:760px){.ss-people{grid-template-columns:repeat(2,1fr)}}

/* services / price list */
.ss-services{display:flex;flex-direction:column;gap:0;border:1px solid var(--mk-line)}
.ss-svc{display:grid;grid-template-columns:60px 1fr auto 110px;gap:18px;align-items:baseline;padding:14px 18px;border-bottom:1px solid var(--mk-line);transition:.15s}
.ss-svc:last-child{border-bottom:0}
.ss-svc:hover{background:var(--mk-fg);color:var(--mk-bg)}
.ss-svc .n{font-size:10px;letter-spacing:.12em;color:var(--mk-muted);font-variant-numeric:tabular-nums}
.ss-svc:hover .n,.ss-svc:hover .dur{color:var(--mk-bg);opacity:.7}
.ss-svc .nm{font-size:18px;font-weight:600;letter-spacing:-.01em}
.ss-svc .nm small{display:block;font-size:11px;font-weight:400;color:var(--mk-muted);margin-top:3px;letter-spacing:0;line-height:1.4}
.ss-svc:hover .nm small{color:var(--mk-bg);opacity:.7}
.ss-svc .dur{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--mk-muted);font-variant-numeric:tabular-nums}
.ss-svc .pr{font-size:20px;font-weight:700;letter-spacing:-.01em;text-align:right;font-variant-numeric:tabular-nums}
@media (max-width:600px){.ss-svc{grid-template-columns:40px 1fr auto;gap:10px}.ss-svc .dur{display:none}}

/* booking widget */
.ss-book{display:grid;grid-template-columns:1.2fr 1fr;gap:0;border:1px solid var(--mk-line)}
.ss-book .calendar{padding:20px;border-right:1px solid var(--mk-line)}
.ss-book .cal-head{display:flex;justify-content:space-between;align-items:center;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--mk-muted);padding-bottom:10px;border-bottom:1px solid var(--mk-line);margin-bottom:14px}
.ss-book .cal-head b{color:var(--mk-fg);font-weight:700;font-size:13px}
.ss-book .cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;font-size:11px}
.ss-book .cal-grid .d{aspect-ratio:1;display:flex;align-items:center;justify-content:center;border:1px solid var(--mk-line);font-variant-numeric:tabular-nums;cursor:pointer;position:relative}
.ss-book .cal-grid .d.off{opacity:.3;cursor:default}
.ss-book .cal-grid .d.cur{background:var(--mk-fg);color:var(--mk-bg);font-weight:700}
.ss-book .cal-grid .d.has::after{content:"";position:absolute;bottom:4px;width:4px;height:4px;background:currentColor;border-radius:50%}
.ss-book .cal-week{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--mk-muted);margin-bottom:6px;text-align:center}
.ss-book .slots{padding:20px;display:flex;flex-direction:column;gap:14px}
.ss-book .slots .lab{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--mk-muted)}
.ss-book .slot-row{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.ss-book .slot{border:1px solid currentColor;padding:8px;text-align:center;font-size:12px;font-variant-numeric:tabular-nums;letter-spacing:.04em;cursor:pointer}
.ss-book .slot.gone{opacity:.3;text-decoration:line-through;cursor:default}
.ss-book .slot.cur{background:var(--mk-fg);color:var(--mk-bg);font-weight:700}
.ss-book .confirm{border:1px solid currentColor;padding:14px;background:var(--mk-fg);color:var(--mk-bg);display:flex;justify-content:space-between;align-items:center;font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;margin-top:auto}
@media (max-width:760px){.ss-book{grid-template-columns:1fr}.ss-book .calendar{border-right:0;border-bottom:1px solid var(--mk-line)}}

/* gallery / image strip */
.ss-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--mk-line);border:1px solid var(--mk-line)}
.ss-gallery .tile{aspect-ratio:1;background:repeating-linear-gradient(45deg,var(--mk-bg) 0 14px,var(--mk-line) 14px 15px);position:relative}
.ss-gallery .tile.tall{aspect-ratio:1/1.4}
.ss-gallery .tile .lab{position:absolute;left:10px;bottom:10px;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--mk-muted);background:var(--mk-bg);padding:3px 6px}
.ss-gallery .tile.big{grid-column:span 2;grid-row:span 2;aspect-ratio:1}

/* footer */
.ss-foot{padding:32px 28px;border-top:1px solid var(--mk-line);display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px;font-size:11px;line-height:1.6;color:var(--mk-muted)}
.ss-foot h5{margin:0 0 10px;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--mk-fg);font-weight:700}
.ss-foot .col-brand .mk{font-size:42px;line-height:1;font-weight:700;letter-spacing:-.04em;margin-bottom:8px}
.ss-foot .col-brand p{margin:0;max-width:32ch}
.ss-foot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.ss-foot .end{grid-column:1/-1;border-top:1px dashed var(--mk-line);padding-top:14px;margin-top:8px;display:flex;justify-content:space-between;font-size:10px;letter-spacing:.12em;text-transform:uppercase}
@media (max-width:760px){.ss-foot{grid-template-columns:1fr 1fr}}

/* identity strip — logo + palette + type row */
.ss-id{display:grid;grid-template-columns:1fr 1.2fr 1fr;gap:1px;background:var(--mk-line);border:1px solid var(--mk-line)}
.ss-id .cell{background:var(--mk-bg);padding:24px;display:flex;flex-direction:column;gap:10px;min-height:260px}
.ss-id .cell .cap{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--mk-muted);display:flex;justify-content:space-between}
.ss-id .logo{flex:1;display:flex;align-items:center;justify-content:center;text-align:center;flex-direction:column;gap:14px}
.ss-id .logo .mk{font-size:64px;font-weight:700;letter-spacing:-.04em;line-height:.8}
.ss-id .logo .nm{font-size:13px;letter-spacing:.32em;font-weight:700;text-transform:uppercase}
.ss-id .logo .sb{font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--mk-muted);padding:5px 12px;border-top:1px solid currentColor;border-bottom:1px solid currentColor}
.ss-id .pal{flex:1;display:grid;grid-template-columns:repeat(2,1fr);gap:6px;min-height:160px}
.ss-id .sw{display:flex;flex-direction:column;justify-content:flex-end;padding:8px;font-size:9px;line-height:1.2;letter-spacing:.04em}
.ss-id .sw .lbl{font-weight:700;letter-spacing:.08em;text-transform:uppercase;display:block;margin-bottom:2px}
.ss-id .sw .code{opacity:.7;font-variant-numeric:tabular-nums}
.ss-id .typ{flex:1;display:flex;flex-direction:column;justify-content:center;gap:10px}
.ss-id .typ .a{font-size:42px;font-weight:700;letter-spacing:-.04em;line-height:.9}
.ss-id .typ .a.serif{font-family:'Newsreader',serif;font-style:italic;font-weight:400;letter-spacing:-.02em}
.ss-id .typ .b{font-size:14px;font-weight:500}
.ss-id .typ .c{font-size:10px;color:var(--mk-muted);line-height:1.4}
.ss-id .typ .scale{font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--mk-muted);padding-top:8px;border-top:1px dashed currentColor;margin-top:auto}
@media (max-width:760px){.ss-id{grid-template-columns:1fr}}

/* mobile flow — 3 phones in a row */
.ss-mob{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--mk-line);border:1px solid var(--mk-line);padding:0}
.ss-mob .col{background:repeating-linear-gradient(45deg,var(--mk-bg) 0 18px,var(--mk-line) 18px 19px);padding:32px 18px;display:flex;flex-direction:column;align-items:center;gap:12px;min-height:480px}
.ss-mob .col .cap{font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--mk-muted);align-self:stretch;display:flex;justify-content:space-between}
.ss-mob .col .cap b{color:var(--mk-fg);font-weight:700}
.ss-mob .phone{width:100%;max-width:240px;border:1.5px solid currentColor;background:var(--mk-bg);color:var(--mk-fg);padding:16px 14px 20px;display:flex;flex-direction:column;gap:10px;border-radius:22px;font-size:11px;line-height:1.4;flex:1}
.ss-mob .phone .notch{width:44px;height:5px;background:currentColor;border-radius:3px;margin:0 auto 10px;opacity:.5}
.ss-mob .phone h5{margin:0;font-size:14px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.ss-mob .phone .ttl{font-size:18px;font-weight:700;letter-spacing:-.02em;line-height:1.1;margin:0}
.ss-mob .phone .row{display:flex;justify-content:space-between;align-items:center;padding:6px 0;border-bottom:1px dotted var(--mk-line);font-size:11px;font-variant-numeric:tabular-nums}
.ss-mob .phone .row b{font-weight:600}
.ss-mob .phone .btn{border:1px solid currentColor;padding:10px;text-align:center;font-size:10px;letter-spacing:.14em;text-transform:uppercase;margin-top:auto;font-weight:700}
.ss-mob .phone .btn.solid{background:currentColor}
.ss-mob .phone .btn.solid span{color:var(--mk-bg)}
.ss-mob .phone .ph{aspect-ratio:4/3;border:1px solid currentColor;background:repeating-linear-gradient(135deg,transparent 0 10px,var(--mk-line) 10px 11px);display:flex;align-items:flex-end;padding:6px;font-size:8px;letter-spacing:.14em;text-transform:uppercase;color:var(--mk-muted)}
.ss-mob .phone .pill{display:inline-flex;gap:6px;font-size:9px;letter-spacing:.1em;text-transform:uppercase}
.ss-mob .phone .pill span{border:1px solid currentColor;padding:3px 8px;border-radius:99px;opacity:.7}
.ss-mob .phone .pill span.cur{background:currentColor;color:var(--mk-bg);opacity:1;font-weight:700}
@media (max-width:760px){.ss-mob{grid-template-columns:1fr}}

/* identity assets row — packaging / cards / poster */
.ss-assets{display:grid;grid-template-columns:repeat(12,1fr);gap:16px;margin-top:16px}
.ss-asset{border:1px solid var(--line);background:var(--mk-bg, var(--bg));color:var(--mk-fg, var(--ink));overflow:hidden;display:flex;flex-direction:column;min-height:300px}
.ss-asset .body{flex:1;padding:24px;display:flex;flex-direction:column;gap:14px;position:relative}
.ss-asset .info{padding:12px 16px;display:flex;justify-content:space-between;align-items:baseline;background:var(--bg);color:var(--ink);border-top:1px solid var(--line);font-size:11px;letter-spacing:.06em;text-transform:uppercase}
.ss-asset .info b{font-weight:600;color:var(--ink)}
.ss-a4{grid-column:span 4}
.ss-a6{grid-column:span 6}
.ss-a8{grid-column:span 8}
.ss-a12{grid-column:span 12}
@media (max-width:960px){.ss-a4,.ss-a6,.ss-a8{grid-column:span 6}}
@media (max-width:600px){.ss-a4,.ss-a6,.ss-a8,.ss-a12{grid-column:span 12}}

/* poster mock */
.ss-poster{aspect-ratio:3/4;border:1px solid currentColor;padding:18px;display:flex;flex-direction:column;justify-content:space-between;position:relative;background:var(--mk-bg);color:var(--mk-fg)}
.ss-poster .ttl{font-size:34px;line-height:.95;letter-spacing:-.04em;font-weight:700;text-transform:uppercase;max-width:11ch}
.ss-poster .ttl.serif{font-family:'Newsreader',serif;font-style:italic;font-weight:400;text-transform:none}
.ss-poster .head{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--mk-muted);display:flex;justify-content:space-between}
.ss-poster .foot{font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--mk-muted);display:flex;justify-content:space-between;padding-top:10px;border-top:1px dashed currentColor}

/* card / business card mock */
.ss-bcard{aspect-ratio:1.7/1;border:1px solid currentColor;padding:14px;display:flex;flex-direction:column;justify-content:space-between;background:var(--mk-bg);color:var(--mk-fg);position:relative}
.ss-bcard .nm{font-size:18px;font-weight:700;letter-spacing:-.02em;line-height:1}
.ss-bcard .head{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--mk-muted)}
.ss-bcard .foot{font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--mk-muted);padding-top:6px;border-top:1px dotted currentColor;display:flex;justify-content:space-between}

/* generic small note */
.mk-cap{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--mk-muted);display:flex;justify-content:space-between;padding-bottom:8px;border-bottom:1px dashed currentColor;margin-bottom:8px}

/* photo block (used inline) */
.ph-block{border:1px solid currentColor;background:repeating-linear-gradient(45deg,transparent 0 14px,var(--mk-line) 14px 15px);position:relative;display:flex;align-items:flex-end;padding:14px;font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--mk-muted)}
.ph-block .badge{position:absolute;top:14px;right:14px;border:1px solid currentColor;padding:4px 8px;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--mk-fg)}

/* version switcher reused */
.vs{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:80;display:flex;gap:4px;background:var(--bg);border:1px solid var(--line);padding:4px;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;box-shadow:0 8px 32px -10px rgba(0,0,0,.15)}
.vs a{padding:8px 14px;transition:.15s}
.vs a.cur{background:var(--ink);color:var(--bg);font-weight:500}
.vs a:hover{background:var(--soft)}