/* Layout: the hero is an architect's blueprint that builds itself — plan, rack, cable, code, deploy, serve — on real-looking 1U network gear. Sections below read like stages of that system. */
:root{
  --bg:#EEF3F0;
  --surface:#FFFFFF;
  --ink:#0C1A14;
  --muted:#55665D;
  --line:#D2DED7;
  --accent:#0B7A4B;
  --accent-soft:#DCEFE5;
  --signal:#C9820E;
  --ok:#16A05F;
  --term-green:#3DD68C;
  --silver:#7D8AA3;
  --bronze:#A8622A;
  --bp:#F5FAF7;
  --grid:#DFEBE4;
  --chassis:#2C3647;
  --face:#384560;
  --edge:#1D2533;
  --port:#0A0E15;
  --label:#B4C3DD;
  --led-off:#4D5970;
  --code-bg:#0D1A15;
  --code-fg:#D6DEEC;
  --code-key:#7FE0B0;
  --code-val:#E8C77E;
  --code-com:#6C8378;
  --f-display:"Bricolage Grotesque","Segoe UI",system-ui,sans-serif;
  --f-body:"Figtree","Segoe UI",system-ui,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#08110D;--surface:#0F1C16;--ink:#E3F0E9;--muted:#8FA79A;--line:#1F3329;
    --accent:#3DD68C;--accent-soft:#12291F;--signal:#F2B544;--ok:#5BE3A1;--silver:#B9C4D8;--bronze:#D9925A;
    --bp:#0A1612;--grid:#132A20;
    --chassis:#252F42;--face:#2F3B53;--edge:#121927;--port:#04070C;--label:#A6B6D0;--led-off:#3A4558;
    --code-bg:#050B08;--code-fg:#D6DEEC;--code-key:#7FE0B0;--code-val:#E8C77E;--code-com:#5D7368;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#08110D;--surface:#0F1C16;--ink:#E3F0E9;--muted:#8FA79A;--line:#1F3329;
  --accent:#3DD68C;--accent-soft:#12291F;--signal:#F2B544;--ok:#5BE3A1;--silver:#B9C4D8;--bronze:#D9925A;
  --bp:#0A1612;--grid:#132A20;
  --chassis:#252F42;--face:#2F3B53;--edge:#121927;--port:#04070C;--label:#A6B6D0;--led-off:#3A4558;
  --code-bg:#050B08;--code-fg:#D6DEEC;--code-key:#7FE0B0;--code-val:#E8C77E;--code-com:#5D7368;
  color-scheme:dark;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font-family:var(--f-body);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--bg)}
a{color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
.wrap{max-width:1160px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
@media (min-width:640px){.wrap{padding-left:max(28px,env(safe-area-inset-left,0px));padding-right:max(28px,env(safe-area-inset-right,0px))}}

/* Nav */
.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:6;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:10px 16px;padding-block:12px;flex-wrap:wrap}
.brand{font-family:var(--f-mono);font-size:14px;text-decoration:none;display:flex;align-items:center;gap:10px;white-space:nowrap}
.brand b{font-weight:500}
.dot{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 4px color-mix(in srgb,var(--ok) 22%,transparent);flex:none}
.nav ul{list-style:none;display:flex;gap:22px;margin:0;padding:0;font-size:15px}
.nav ul a{text-decoration:none;color:var(--muted);white-space:nowrap}
.nav ul a:hover{color:var(--ink)}
@media (max-width:760px){
  .nav ul{width:100%;overflow-x:auto;gap:8px;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding-bottom:2px}
  .nav ul::-webkit-scrollbar{display:none}
  .nav ul a{display:block;font-size:14px;padding:6px 12px;border:1px solid var(--line);border-radius:999px;background:var(--surface)}
}

/* Hero */
.hero{padding-block:44px 40px}
@media (min-width:760px){.hero{padding-block:72px 56px}}
.eyebrow{font-family:var(--f-mono);font-size:13px;color:var(--muted);display:flex;gap:10px 14px;align-items:center;flex-wrap:wrap}
.status{display:inline-flex;align-items:center;gap:8px;color:var(--ok);background:color-mix(in srgb,var(--ok) 12%,transparent);padding:4px 10px;border-radius:999px}
h1{font-family:var(--f-display);font-weight:800;font-size:clamp(40px,8.4vw,100px);line-height:.95;letter-spacing:-.035em;margin:20px 0 0;text-wrap:balance}
h1 .role{display:block;color:var(--accent);font-weight:700}
.lede{max-width:60ch;color:var(--muted);font-size:clamp(17px,1.6vw,20px);margin:24px 0 0}
.lede strong{color:var(--ink);font-weight:600}
.cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;font-weight:600;font-size:16px;padding:12px 18px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);transition:transform .15s ease,border-color .15s ease;cursor:pointer;font-family:var(--f-body)}
.btn:hover{transform:translateY(-2px);border-color:var(--accent)}
.btn.primary{background:var(--accent);color:var(--bg);border-color:var(--accent)}
.btn svg{width:18px;height:18px;flex:none}
@media (max-width:480px){.cta .btn{flex:1 1 auto}.cta .btn.primary{flex-basis:100%}}

/* Console */
.console{margin-top:40px;background:var(--surface);border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:0 30px 60px -40px color-mix(in srgb,var(--accent) 45%,transparent)}
.c-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:12px 16px;border-bottom:1px solid var(--line);font-family:var(--f-mono);font-size:13px;color:var(--muted)}
.c-bar .left{display:flex;align-items:center;gap:12px;flex-wrap:wrap;min-width:0}
.pill{display:inline-flex;align-items:center;gap:7px;padding:3px 10px;border-radius:999px;font-size:12px;text-transform:uppercase;letter-spacing:.06em;background:var(--accent-soft);color:var(--accent)}
.pill::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.pill.running{background:color-mix(in srgb,var(--signal) 16%,transparent);color:var(--signal)}
.pill.live{background:color-mix(in srgb,var(--ok) 15%,transparent);color:var(--ok)}
.timer{font-variant-numeric:tabular-nums}
.c-actions{display:flex;gap:8px}
.mini{font-family:var(--f-mono);font-size:12px;padding:6px 12px;border-radius:8px;border:1px solid var(--line);background:var(--bg);color:var(--ink);cursor:pointer}
.mini:hover{border-color:var(--accent)}

.phases{list-style:none;margin:0;padding:10px 12px;display:flex;gap:6px;overflow-x:auto;border-bottom:1px solid var(--line);scrollbar-width:none;counter-reset:ph}
.phases::-webkit-scrollbar{display:none}
.phases li{counter-increment:ph;flex:1 0 auto;display:flex;align-items:center;gap:8px;padding:6px 12px;border-radius:8px;font-family:var(--f-mono);font-size:12px;color:var(--muted);white-space:nowrap;transition:background .3s,color .3s}
.phases li::before{content:counter(ph);width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-size:10px;border:1px solid var(--line);flex:none}
.phases li.cur{background:color-mix(in srgb,var(--signal) 14%,transparent);color:var(--signal)}
.phases li.cur::before{border-color:currentColor}
.phases li.done{color:var(--ok)}
.phases li.done::before{content:"✓";background:var(--ok);color:var(--surface);border-color:var(--ok)}

.bp{background:var(--bp);line-height:0}
.bp svg{display:block;width:100%;height:auto}

.c-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);border-top:1px solid var(--line)}
.c-code{background:var(--code-bg);color:var(--code-fg);min-width:0;display:flex;flex-direction:column}
.c-log{border-left:1px solid var(--line);min-width:0;display:flex;flex-direction:column}
@media (max-width:760px){
  .c-grid{grid-template-columns:minmax(0,1fr)}
  .c-log{border-left:0;order:-1;border-bottom:1px solid var(--line)}
}
.tab{font-family:var(--f-mono);font-size:12px;padding:10px 16px;color:var(--code-com);border-bottom:1px solid color-mix(in srgb,var(--code-fg) 10%,transparent);display:flex;justify-content:space-between;gap:8px}
.tab b{color:var(--code-fg);font-weight:500}
pre.code{margin:0;padding:12px 16px 16px;font-family:var(--f-mono);font-size:13px;line-height:1.7;overflow-x:auto;min-height:calc(9 * 1.7em + 28px);counter-reset:ln;flex:1}
pre.code .ln{display:block;white-space:pre;counter-increment:ln}
pre.code .ln::before{content:counter(ln);display:inline-block;width:2.2em;color:var(--code-com);opacity:.6;user-select:none}
.k{color:var(--code-key)}.v{color:var(--code-val)}.c{color:var(--code-com);font-style:italic}
.caret{display:inline-block;width:.55em;height:1.1em;background:var(--code-val);vertical-align:-.15em;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
@media (max-width:420px){pre.code{font-size:12px}}
.log-head{font-family:var(--f-mono);font-size:12px;padding:10px 16px;color:var(--muted);border-bottom:1px solid var(--line)}
.log{margin:0;padding:12px 16px;font-family:var(--f-mono);font-size:12.5px;line-height:1.75;height:236px;overflow-y:auto;overflow-x:hidden;list-style:none}
.log li{white-space:pre-wrap;overflow-wrap:anywhere;animation:lin .25s ease both}
.log .t{color:var(--muted);margin-right:8px;font-variant-numeric:tabular-nums}
.log .cmd{color:var(--accent)}
.log .ok{color:var(--ok)}
@keyframes lin{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}
@media (max-width:760px){.log{height:150px;font-size:12px}}
.live-banner{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:12px 16px;border-top:1px solid var(--line);font-family:var(--f-mono);font-size:13px;color:var(--muted);background:color-mix(in srgb,var(--ok) 6%,var(--surface))}
.live-banner b{color:var(--ok);font-weight:500}
.live-banner a{color:var(--accent);text-decoration:none}

/* Blueprint SVG */
.gl{fill:none;stroke:var(--grid);stroke-width:.7}
.gl2{fill:none;stroke:var(--grid);stroke-width:1.4}
.zone{opacity:0;transition:opacity .5s ease}
.zone.on{opacity:1}
.zone rect{fill:color-mix(in srgb,var(--accent) 3%,transparent);stroke:var(--muted);stroke-width:1;stroke-dasharray:6 5;stroke-opacity:.6}
.zone text{fill:var(--accent);font-family:var(--f-mono);font-size:11px;letter-spacing:.1em;font-weight:500}
.wbg{fill:none;stroke:var(--muted);stroke-opacity:.35;stroke-width:1.5;stroke-dasharray:3 5;opacity:0;transition:opacity .5s}
svg.planned .wbg{opacity:1}
.wire{fill:none;stroke:var(--accent);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1 1;stroke-dashoffset:1;transition:stroke-dashoffset .6s ease}
.wire.on{stroke-dashoffset:0}
.guide{fill:none;stroke:none}
.pk{fill:var(--signal)}
.pk.req{fill:var(--accent)}
.pk.res{fill:var(--ok)}
.ph{fill:color-mix(in srgb,var(--accent) 5%,transparent);stroke:var(--accent);stroke-width:1;stroke-dasharray:4 3;opacity:0;transition:opacity .4s}
.ph-t{fill:var(--accent);font-family:var(--f-mono);font-size:8px;opacity:0;transition:opacity .4s}
.dev.plan .ph,.dev.plan .ph-t{opacity:1}
.dev.up .ph,.dev.up .ph-t{opacity:0}
.body{opacity:0;transform:translateY(-18px);transition:opacity .45s ease,transform .7s cubic-bezier(.2,.9,.25,1.15)}
.dev.up .body{opacity:1;transform:none}
.dev.act .body{filter:drop-shadow(0 0 7px var(--signal))}
.ch{fill:var(--chassis)}
.fc{fill:var(--face)}
.eg{fill:var(--edge)}
.hole{fill:var(--bp)}
.pt{fill:var(--port)}
.pt-in{fill:var(--face)}
.rail{fill:var(--face)}
.vent{fill:var(--edge)}
.lb{fill:var(--label);font-family:var(--f-mono)}
.lb1{font-size:7px;font-weight:500;letter-spacing:.04em}
.lb2{font-size:5.4px}
.led{fill:var(--led-off);transition:fill .08s}
.dev.up .led.idle{fill:var(--ok)}
.led.tx{fill:var(--signal)!important}
.con{fill:var(--accent)}
.stripe{fill:var(--signal)}
.shield{fill:none;stroke:var(--signal);stroke-width:1.4;stroke-linejoin:round}
.scr{fill:var(--code-bg)}
.cl{opacity:0;transition:opacity .2s}
.cl.on{opacity:1}
.ck{fill:var(--code-key)}.cv{fill:var(--code-val)}.cc{fill:var(--code-com)}
.card{fill:var(--surface);stroke:var(--line);stroke-width:1.2}
.bpf{fill:var(--bp)}
.mutedt{fill:var(--muted);font-family:var(--f-mono);font-size:6.5px;letter-spacing:.1em}
.cil{stroke:var(--line);stroke-width:2}
.stage{fill:var(--bp);stroke:var(--line);stroke-width:1.6;transition:fill .25s,stroke .25s}
.stage.run{stroke:var(--signal);fill:color-mix(in srgb,var(--signal) 22%,var(--surface))}
.stage.ok{fill:var(--ok);stroke:var(--ok)}
.stt{fill:var(--muted);font-family:var(--f-mono);font-size:7px}
.cloud{fill:var(--surface);stroke:var(--muted);stroke-width:1.3;stroke-dasharray:3 3}
.cloudt{fill:var(--muted);font-family:var(--f-mono);font-size:8px;letter-spacing:.12em}
.wdot{fill:var(--line)}
.url{fill:var(--surface);stroke:var(--line);stroke-width:.8}
.urlt{fill:var(--muted);font-family:var(--f-mono);font-size:5.6px}
.sk{fill:var(--line);transition:fill .45s ease}
.page-on .sk1{fill:var(--ink)}
.page-on .sk2{fill:var(--accent)}
.page-on .sk3{fill:var(--muted)}
.page-on .sk4{fill:var(--accent-soft);stroke:var(--accent);stroke-width:.8}
.badge{opacity:0;transition:opacity .3s}
.page-on .badge{opacity:1}
.okb{fill:var(--ok)}
.okt{fill:var(--surface);font-family:var(--f-mono);font-size:7px;font-weight:500}
.ctr{opacity:0;transform:translateY(8px);transition:opacity .35s,transform .45s cubic-bezier(.2,.9,.25,1.2)}
.ctr.up{opacity:1;transform:none}
.ctrb{fill:color-mix(in srgb,var(--ok) 14%,var(--surface));stroke:var(--ok);stroke-width:.8}
.ctrt{fill:var(--ok);font-family:var(--f-mono);font-size:7px}
.spec{opacity:0;transition:opacity .45s}
.spec.on{opacity:1}
.sp1{fill:var(--ink);font-family:var(--f-mono);font-size:11px;font-weight:500}
.sp2{fill:var(--muted);font-family:var(--f-mono);font-size:10px}

/* Social rail (wide screens) + nav icons (narrower) */
.rail{position:fixed;right:max(22px,env(safe-area-inset-right,0px));top:calc(env(safe-area-inset-top,0px) + 92px);z-index:7;display:flex;flex-direction:column;align-items:center;gap:10px}
.rail::after{content:"";width:1px;height:72px;background:var(--line);margin-top:4px}
.rail .rl{writing-mode:vertical-rl;font-family:var(--f-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.soc{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--muted);text-decoration:none;transition:color .15s,border-color .15s,transform .15s}
.soc:hover{color:var(--accent);border-color:var(--accent);transform:translateX(-3px)}
.soc svg{width:18px;height:18px}
.nav-social{display:none;gap:6px;align-items:center}
.nav-social .soc{width:36px;height:36px;border-radius:9px}
.nav-social .soc:hover{transform:none}
@media (max-width:1299px){.rail{display:none}.nav-social{display:flex}}
@media (max-width:760px){.nav .brand{order:1}.nav-social{order:2}.nav ul{order:3}}

/* Availability datasheet */
.avail{margin:30px 0 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--ink);border-bottom:1px solid var(--line)}
.avail > div{padding:14px 18px 14px 0;min-width:0}
.avail > div + div{padding-left:18px;border-left:1px solid var(--line)}
.avail dt{font-family:var(--f-mono);font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}
.avail dd{margin:4px 0 0;font-weight:600;font-size:16px;line-height:1.35}
@media (max-width:700px){
  .avail{grid-template-columns:repeat(2,minmax(0,1fr))}
  .avail > div:nth-child(3){padding-left:0;border-left:0}
  .avail > div:nth-child(n+3){border-top:1px solid var(--line)}
}
.kicker{font-family:var(--f-mono);font-size:13px;color:var(--muted);letter-spacing:.04em}

/* Honors */
.honors{display:grid;gap:16px}
.aw{display:grid;grid-template-columns:150px minmax(0,1fr);background:var(--surface);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.aw .rank{--m:var(--silver);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:28px 12px;border-right:1px solid var(--line);background:color-mix(in srgb,var(--m) 9%,var(--surface));color:var(--m);text-align:center}
.aw-3 .rank{--m:var(--bronze)}
.aw-f .rank{--m:var(--accent)}
.rank .pos{font-family:var(--f-display);font-weight:800;font-size:68px;line-height:.9;letter-spacing:-.04em}
.rank .pos sup{font-size:.36em;letter-spacing:0;vertical-align:top;position:relative;top:.3em;margin-left:2px}
.rank .pos.small{font-size:34px;letter-spacing:-.02em}
.rank .of{font-family:var(--f-mono);font-size:12px;text-transform:uppercase;letter-spacing:.14em;margin-top:8px}
.aw-body{padding:26px 28px;min-width:0}
.aw-meta{font-family:var(--f-mono);font-size:13px;color:var(--muted);margin:0}
.aw h3{font-family:var(--f-display);font-weight:700;font-size:clamp(22px,2.4vw,28px);letter-spacing:-.015em;line-height:1.15;margin:8px 0 4px}
.aw-title{margin:0 0 14px;color:var(--ink);font-weight:600}
.figure{font-family:var(--f-mono);font-weight:500;color:var(--ok);background:color-mix(in srgb,var(--ok) 12%,transparent);padding:2px 8px;border-radius:6px;white-space:nowrap}
.aw-body > p{max-width:64ch}
.aw-body > p:not(.aw-meta):not(.aw-title):not(.aw-note){color:var(--muted);margin:0}
.aw-body strong{color:var(--ink)}
.aw .tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.aw .tags span{font-family:var(--f-mono);font-size:12px;padding:3px 8px;border-radius:6px;background:var(--accent-soft);color:var(--accent)}
.aw-note{margin:14px 0 0;font-size:14px;color:var(--muted);border-top:1px dashed var(--line);padding-top:12px}
.aw-f .aw-body{padding-block:22px}
@media (max-width:640px){
  .aw{grid-template-columns:minmax(0,1fr)}
  .aw .rank{flex-direction:row;justify-content:flex-start;gap:10px;align-items:baseline;padding:16px 20px;border-right:0;border-bottom:1px solid var(--line)}
  .rank .pos{font-size:44px}.rank .pos.small{font-size:28px}
  .rank .of{margin-top:0}
  .aw-body{padding:20px}
}
.also{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--surface)}
.also li + li{border-top:1px solid var(--line)}
.also a{display:grid;grid-template-columns:minmax(0,auto) minmax(0,1fr) auto;gap:6px 16px;align-items:baseline;padding:16px 20px;text-decoration:none;transition:background .15s}
.also a:hover{background:var(--bg)}
.also b{font-family:var(--f-display);font-size:18px}
.also span{color:var(--muted);font-size:15px}
.also i{font-style:normal;color:var(--muted);font-family:var(--f-mono)}
@media (max-width:640px){.also a{grid-template-columns:minmax(0,1fr) auto}.also span{grid-column:1;grid-row:2}.also i{grid-row:1/3;grid-column:2;align-self:center}}

/* More projects */
.more-list{margin-top:14px}
.more-row{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px;margin-top:20px}
.more-row .more{margin-top:0}
@media (prefers-reduced-motion:no-preference){.more-list:not([hidden]) .proj{animation:lin .35s ease both}.more-list .proj:nth-child(2){animation-delay:.05s}.more-list .proj:nth-child(3){animation-delay:.1s}.more-list .proj:nth-child(4){animation-delay:.15s}.more-list .proj:nth-child(5){animation-delay:.2s}}

/* Credentials */
.cert-intro{max-width:60ch;color:var(--muted);margin:0 0 22px;font-size:18px}
.certs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.cert{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:22px;display:flex;flex-direction:column;gap:4px;min-width:0}
.cert::before{content:"";position:absolute;inset:6px;border:1px solid var(--line);border-radius:10px;pointer-events:none}
.cert-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px;position:relative}
.seal{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;font-family:var(--f-mono);font-size:12px;font-weight:500;letter-spacing:.04em;color:var(--accent);background:var(--accent-soft);box-shadow:0 0 0 3px var(--surface),0 0 0 4px color-mix(in srgb,var(--accent) 40%,transparent)}
.layer{font-family:var(--f-mono);font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
.cert h3{font-family:var(--f-display);font-size:19px;line-height:1.2;margin:0;font-weight:700;position:relative}
.cert .issuer{font-family:var(--f-mono);font-size:13px;color:var(--muted);margin:4px 0 0;position:relative}
.cert .val{font-family:var(--f-mono);font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--ok);margin:16px 0 4px;position:relative}
.cert ul{margin:0;padding-left:18px;color:var(--ink);font-size:15px;position:relative}
.cert ul li{margin-bottom:3px}
@media (max-width:900px){.certs{grid-template-columns:minmax(0,1fr)}}

/* Experience */
.xp-list{display:grid;gap:14px}
.xp{display:grid;grid-template-columns:170px minmax(0,1fr);background:var(--surface);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.xp-when{padding:24px 20px;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:6px;background:color-mix(in srgb,var(--signal) 6%,var(--surface))}
.xp-date{font-family:var(--f-mono);font-size:14px;font-weight:500;color:var(--ink)}
.xp-dur{font-family:var(--f-mono);font-size:12px;color:var(--muted)}
.xp-body{padding:24px 26px;min-width:0}
.xp h3{font-family:var(--f-display);font-weight:700;font-size:clamp(21px,2.2vw,25px);line-height:1.15;letter-spacing:-.01em;margin:0}
.xp-org{margin:4px 0 0;color:var(--accent);font-weight:600;font-size:15px}
.xp ul{margin:14px 0 0;padding-left:18px;color:var(--muted);font-size:15.5px;max-width:64ch}
.xp ul li{margin-bottom:5px}
.xp .tags,.aw .tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.xp .tags span{font-family:var(--f-mono);font-size:12px;padding:3px 8px;border-radius:6px;background:var(--accent-soft);color:var(--accent)}
@media (max-width:640px){
  .xp{grid-template-columns:minmax(0,1fr)}
  .xp-when{flex-direction:row;flex-wrap:wrap;gap:4px 12px;align-items:baseline;border-right:0;border-bottom:1px solid var(--line);padding:14px 20px}
  .xp-body{padding:20px}
}

/* Education */
.edu{list-style:none;margin:0;padding:0}
.edu li{display:grid;grid-template-columns:130px minmax(0,1fr) auto;gap:6px 18px;padding:20px 0;border-top:1px solid var(--line);align-items:baseline}
.edu li:last-child{border-bottom:1px solid var(--line)}
.edu li > div{min-width:0}
.edu-yr{font-family:var(--f-mono);font-size:14px;color:var(--muted);font-variant-numeric:tabular-nums}
.edu li.now .edu-yr{color:var(--accent);font-weight:500}
.edu h3{font-family:var(--f-display);font-size:21px;margin:0;font-weight:700;line-height:1.2}
.edu p{margin:3px 0 0;color:var(--muted);font-size:15px}
.edu-tag{font-family:var(--f-mono);font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--accent);background:var(--accent-soft);padding:3px 8px;border-radius:5px;white-space:nowrap}
@media (max-width:640px){.edu li{grid-template-columns:minmax(0,1fr) auto}.edu-yr{grid-column:1}.edu li > div{grid-column:1/-1}.edu-tag{grid-column:2;grid-row:1}}

/* Photos: award galleries + certificates */
.shot{position:relative;display:block;padding:0;margin:0;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--bg);cursor:zoom-in;aspect-ratio:4/3;width:100%;max-width:100%}
.shot img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.shot:hover img{transform:scale(1.04)}
.shot .ph-cap{display:none}
.shot.missing{cursor:default;border-style:dashed;background:repeating-linear-gradient(-45deg,transparent 0 10px,color-mix(in srgb,var(--line) 45%,transparent) 10px 11px),var(--bg)}
.shot.missing img{display:none}
.shot.missing .ph-cap{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;position:absolute;inset:0;font-family:var(--f-mono);font-size:11px;color:var(--muted);padding:8px;text-align:center}
.shot.missing .ph-cap::before{content:"";width:26px;height:20px;border:1.5px solid currentColor;border-radius:4px;box-shadow:inset 0 0 0 5px var(--bg),inset 0 0 0 7px currentColor}
.aw .rank{grid-row:span 2}
@media (max-width:640px){.aw .rank{grid-row:auto}}
.gallery{grid-column:2;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:0 28px 26px}
@media (max-width:640px){
  .gallery{grid-column:1;display:grid;grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:72%;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 20px 20px;scrollbar-width:none}
  .gallery::-webkit-scrollbar{display:none}
  .gallery .shot{scroll-snap-align:start}
}
.cert-img{aspect-ratio:1.414;margin-bottom:14px;position:relative}
.cert-img .seal{display:none}
.cert-img.missing{border-style:solid;background:color-mix(in srgb,var(--accent) 5%,var(--bg))}
.cert-img.missing .seal{display:grid;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}
.cert-img.missing .ph-cap{display:none}
.cert .layer{position:relative}
.next{position:relative;font-size:13px;color:var(--muted);margin:12px 0 0;border-top:1px dashed var(--line);padding-top:10px}

/* Lightbox */
.lbx{position:fixed;inset:0;z-index:30;background:color-mix(in srgb,#05080F 88%,transparent);display:grid;place-items:center;padding:max(56px,env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-right,0px)) max(24px,env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px))}
.lbx figure{margin:0;max-width:min(1100px,100%);display:grid;gap:12px;justify-items:center}
.lbx img{max-width:100%;max-height:78vh;border-radius:8px;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.lbx figcaption{font-family:var(--f-mono);font-size:13px;color:#C9D3E6;text-align:center}
.lbx-close{position:absolute;top:max(14px,env(safe-area-inset-top,0px));right:max(16px,env(safe-area-inset-right,0px));width:42px;height:42px;border-radius:10px;border:1px solid rgba(255,255,255,.25);background:transparent;color:#fff;font-size:22px;cursor:pointer}

/* Language switch */
.lang{display:flex;align-items:center;gap:6px;font-family:var(--f-mono);font-size:13px;color:var(--muted)}
.lang button{background:none;border:0;padding:4px 2px;font:inherit;color:var(--muted);cursor:pointer;border-bottom:2px solid transparent}
.lang button[aria-pressed="true"]{color:var(--ink);border-bottom-color:var(--accent)}
.lang button:hover{color:var(--accent)}
@media (max-width:760px){.nav .wrap{column-gap:10px}.nav-social{order:2;margin-left:auto;gap:2px}.nav-social .soc{width:28px;height:28px}.nav-social .soc svg{width:16px;height:16px}.lang{order:3;padding-right:12px;border-right:1px solid var(--line)}.nav ul{order:4;width:auto;flex:1 1 0;min-width:0}.nav-social + *{}}

/* Boot intro */
.boot{position:fixed;inset:0;z-index:50;background:var(--code-bg);color:var(--code-fg);display:flex;flex-direction:column;font-family:var(--f-mono);
  padding:calc(env(safe-area-inset-top,0px) + 18px) max(18px,env(safe-area-inset-right,0px)) calc(env(safe-area-inset-bottom,0px) + 18px) max(18px,env(safe-area-inset-left,0px));
  clip-path:inset(0 0 0 0);transition:clip-path .8s cubic-bezier(.7,0,.2,1);animation:bootFailsafe .01s linear 16s forwards}
.boot.out{clip-path:inset(0 0 100% 0)}
@keyframes bootFailsafe{to{visibility:hidden}}
.boot-bar{display:flex;justify-content:space-between;gap:12px;font-size:12px;color:var(--code-com);padding-bottom:12px;border-bottom:1px solid color-mix(in srgb,var(--code-fg) 14%,transparent)}
.boot-bar b{color:var(--term-green);font-weight:500}
.boot-term{flex:1;margin:0;padding-top:18px;font-family:var(--f-mono);font-size:clamp(12px,1.45vw,15px);line-height:1.75;white-space:pre-wrap;overflow-wrap:anywhere;overflow:hidden;max-width:920px;width:100%}
.boot-term .pr{color:var(--term-green)}
.boot-term .dim{color:var(--code-com)}
.boot-term .ok{color:var(--term-green)}
.boot-term .k{color:var(--code-key)}.boot-term .v{color:var(--code-val)}.boot-term .c{color:var(--code-com);font-style:italic}
.boot-term .file{display:block;color:var(--code-com);border-top:1px dashed color-mix(in srgb,var(--code-fg) 18%,transparent);border-bottom:1px dashed color-mix(in srgb,var(--code-fg) 18%,transparent);margin:6px 0}
.boot-skip{position:absolute;right:max(18px,env(safe-area-inset-right,0px));bottom:calc(env(safe-area-inset-bottom,0px) + 16px);font-size:12px;color:var(--code-fg);text-decoration:none;border-bottom:1px solid var(--code-com);padding-bottom:2px}
.boot-skip:hover{color:var(--term-green);border-bottom-color:var(--term-green)}
.boot-bar-r{display:flex;gap:14px}
@media (prefers-reduced-motion:reduce){.boot{display:none}}

/* Contact with photo */
.contact-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(200px,300px);gap:40px 56px;align-items:center}
.contact-grid > *{min-width:0}
.me{margin:0;justify-self:end;width:100%}
.me-frame{position:relative;aspect-ratio:4/5;width:100%;max-width:100%;background:color-mix(in srgb,var(--accent) 22%,var(--ink));outline:1px solid var(--accent);outline-offset:10px;overflow:hidden}
.me-frame img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.9) contrast(1.03)}
.me-mono{display:none;position:absolute;inset:0;place-items:center;font-family:var(--f-display);font-weight:800;font-size:64px;letter-spacing:-.04em;color:var(--term-green)}
.me-frame.missing img{display:none}
.me-frame.missing .me-mono{display:grid}
.me figcaption{margin-top:22px;font-family:var(--f-mono);font-size:13px;color:color-mix(in srgb,var(--bg) 85%,var(--ink));line-height:1.5}
.me figcaption span{color:color-mix(in srgb,var(--bg) 60%,var(--ink))}
@media (max-width:760px){
  .contact-grid{grid-template-columns:minmax(0,1fr)}
  .me{order:-1;justify-self:start;max-width:220px}
}

/* Credly credentials */
.credly-strip{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 28px;padding:14px 0;margin:0 0 26px;border-top:1px solid var(--ink);border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}
.cs-k{font-family:var(--f-mono);font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.cs-v{font-family:var(--f-display);font-weight:700;font-size:24px;line-height:1}
.cs-v small{font-family:var(--f-body);font-weight:500;font-size:14px;color:var(--muted)}
.cs-go{margin-left:auto;font-family:var(--f-mono);font-size:13px;color:var(--accent);border-bottom:1px solid var(--accent);padding-bottom:2px}
.credly-strip:hover .cs-go{color:var(--ink);border-bottom-color:var(--ink)}
@media (max-width:640px){.cs-go{margin-left:0;flex-basis:100%;width:max-content;flex-grow:0}}
.skmap{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-bottom:22px}
.skmap > div{background:var(--surface);padding:18px;min-width:0}
.skmap h3{font-family:var(--f-mono);font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin:0 0 12px}
.sk{display:inline-flex;align-items:baseline;gap:6px;font-size:13.5px;line-height:1.3;padding:5px 9px;margin:0 6px 6px 0;border:1px solid var(--line);background:var(--bg);cursor:default;transition:background .15s,color .15s,border-color .15s}
.sk i{font-style:normal;font-family:var(--f-mono);font-size:11px;color:var(--accent)}
.sk:hover,.sk:focus-visible{border-color:var(--accent)}
.sk.on{background:var(--accent);border-color:var(--accent);color:var(--bg)}
.sk.on i{color:var(--bg)}
@media (max-width:980px){.skmap{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.skmap{grid-template-columns:minmax(0,1fr)}}
.badges{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
@media (max-width:900px){.badges{grid-template-columns:minmax(0,1fr)}}
.badge-card{background:var(--surface);border:1px solid var(--line);padding:22px;display:flex;flex-direction:column;gap:4px;min-width:0;transition:opacity .2s,border-color .2s}
.cred.focus .badge-card.dim{opacity:.32}
.cred.focus .badge-card:not(.dim){border-color:var(--accent)}
.badge-card.hov{border-color:var(--accent)}
.cred-img{aspect-ratio:1;width:128px;max-width:100%;border:0;background:none;margin:0 0 14px;cursor:zoom-in}
.cred-img img{object-fit:contain}
.cred-img.missing{background:none}
@media (max-width:900px){.badge-card{display:grid;grid-template-columns:96px minmax(0,1fr);column-gap:18px;align-items:start}.badge-card > :not(.cred-img){grid-column:2}.cred-img{grid-row:1/span 6;width:96px;margin:0}}
.b-meta{margin:0;font-family:var(--f-mono);font-size:12.5px;color:var(--muted);display:flex;flex-wrap:wrap;gap:8px;align-items:baseline}
.new{font-size:10.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--bg);background:var(--accent);padding:1px 6px}
.badge-card h3{font-family:var(--f-display);font-weight:700;font-size:19px;line-height:1.2;margin:4px 0 0}
.b-what{margin:6px 0 0;color:var(--muted);font-size:15px}
.b-count{margin:10px 0 0;font-family:var(--f-mono);font-size:12px;color:var(--accent)}
.verify{margin-top:auto;padding-top:12px;font-family:var(--f-mono);font-size:13px;color:var(--ink);text-decoration:none;align-self:flex-start;border-bottom:2px solid var(--accent)}
.verify:hover{color:var(--accent)}
.also-cert{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px;margin-top:22px;padding-top:16px;border-top:1px dashed var(--line);font-size:15px;color:var(--muted)}
.also-cert b{color:var(--ink);font-weight:600}
.ac-k{font-family:var(--f-mono);font-size:11px;text-transform:uppercase;letter-spacing:.12em}
.ac-link{aspect-ratio:auto!important;width:auto!important;border:0!important;background:none!important;padding:0;font-family:var(--f-mono);font-size:13px;color:var(--accent);border-bottom:1px solid var(--accent)!important}
.ac-link img{display:none!important}
.ac-link.missing{display:none}

/* Certificates (documents) */
.docs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
@media (max-width:900px){.docs{grid-template-columns:minmax(0,1fr)}}
.doc{background:var(--surface);border:1px solid var(--line);display:flex;flex-direction:column;min-width:0}
.doc-img{aspect-ratio:1.414!important;width:100%;margin:0!important;border:0!important;border-bottom:1px solid var(--line)!important;background:var(--bg)!important}
.doc-img img{object-fit:contain;padding:10px}
.doc-body{padding:20px 22px 22px;display:flex;flex-direction:column;gap:4px;flex:1}
.doc h3{font-family:var(--f-display);font-weight:700;font-size:20px;line-height:1.2;margin:4px 0 0}
.doc-sk{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.doc-sk li{font-family:var(--f-mono);font-size:12px;padding:3px 8px;background:var(--accent-soft);color:var(--accent)}
button.verify{background:none;border:0;border-bottom:2px solid var(--accent);padding:0 0 2px;cursor:pointer}
.doc .verify{margin-top:16px;padding-top:0}

.doc-id{margin:12px 0 0;font-family:var(--f-mono);font-size:11.5px;color:var(--muted);overflow-wrap:anywhere}
.doc-id code{font-family:var(--f-mono);color:var(--ink)}
.doc-links{display:flex;flex-wrap:wrap;gap:10px 24px;margin-top:auto;padding-top:16px}
.doc-links .verify{margin-top:0;padding-top:0}

/* Sections */
section{padding-block:64px;border-top:1px solid var(--line)}
@media (min-width:760px){section{padding-block:80px}}
.sec-head{display:grid;grid-template-columns:200px 1fr;gap:24px;margin-bottom:36px;align-items:baseline}
.sec-label{font-family:var(--f-mono);font-size:13px;color:var(--muted)}
.sec-label b{color:var(--accent);font-weight:500}
h2{font-family:var(--f-display);font-weight:700;font-size:clamp(30px,4.4vw,48px);line-height:1.05;letter-spacing:-.025em;margin:0;text-wrap:balance}
.body-grid{display:grid;grid-template-columns:200px 1fr;gap:24px}
.body-grid > *:last-child{min-width:0}
@media (max-width:760px){.sec-head,.body-grid{grid-template-columns:1fr;gap:10px}.body-grid>.spacer{display:none}}
.about p{max-width:65ch;margin:0 0 16px;font-size:18px}
.about p:first-child{font-family:var(--f-display);font-size:clamp(22px,2.4vw,28px);line-height:1.3;font-weight:500;letter-spacing:-.01em}
.facts{display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:24px;font-family:var(--f-mono);font-size:14px;color:var(--muted)}
.facts b{color:var(--ink);font-weight:500}
.stack{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.stack > div{background:var(--surface);padding:22px}
.stack h3{font-family:var(--f-mono);font-size:13px;text-transform:uppercase;letter-spacing:.07em;color:var(--accent);margin:0 0 14px;font-weight:500}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{font-size:14px;padding:5px 11px;border-radius:8px;background:var(--bg);border:1px solid var(--line)}
@media (max-width:640px){.stack{grid-template-columns:1fr}}
.projects{display:grid;gap:14px}
.proj{display:grid;grid-template-columns:100px minmax(0,1fr) auto;gap:22px;padding:26px;background:var(--surface);border:1px solid var(--line);border-radius:14px;transition:border-color .2s ease,transform .2s ease;text-decoration:none}
a.proj:hover{border-color:var(--accent);transform:translateX(4px)}
.proj .yr{font-family:var(--f-mono);font-size:13px;color:var(--muted)}
.proj h3{font-family:var(--f-display);font-size:23px;margin:0 0 6px;font-weight:700;letter-spacing:-.01em}
.proj p{margin:0;color:var(--muted);max-width:62ch;font-size:16px}
.proj .tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.proj .tags span{font-family:var(--f-mono);font-size:12px;padding:3px 8px;border-radius:6px;background:var(--accent-soft);color:var(--accent)}
.proj .arrow{color:var(--muted);font-family:var(--f-mono)}
@media (max-width:640px){.proj{grid-template-columns:minmax(0,1fr);gap:6px;padding:20px}.proj .arrow{display:none}}
.more{margin-top:20px;display:inline-block;font-family:var(--f-mono);font-size:14px;color:var(--accent);text-decoration:none}
.subhead{font-family:var(--f-mono);font-size:13px;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);margin:44px 0 14px;font-weight:500}
.trace{background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.trace-cmd{font-family:var(--f-mono);font-size:13px;padding:14px 20px;border-bottom:1px solid var(--line);color:var(--muted);overflow-x:auto;white-space:nowrap}
.trace-cmd b{color:var(--ink);font-weight:500}
.hop{display:grid;grid-template-columns:40px minmax(0,1fr) 130px;gap:18px;padding:22px 20px}
.hop + .hop{border-top:1px solid var(--line)}
.hop .n{font-family:var(--f-mono);font-size:14px;color:var(--accent);font-weight:500}
.hop h3{font-family:var(--f-display);font-size:20px;margin:0;font-weight:700}
.hop .org{color:var(--muted);margin:2px 0 0;font-size:15px}
.hop ul{margin:12px 0 0;padding-left:18px;color:var(--muted);font-size:15px;max-width:62ch}
.hop .when{font-family:var(--f-mono);font-size:13px;color:var(--muted);text-align:right}
.kind{display:inline-block;font-family:var(--f-mono);font-size:11px;text-transform:uppercase;letter-spacing:.07em;padding:2px 8px;border-radius:5px;margin-bottom:8px}
.kind.work{background:color-mix(in srgb,var(--signal) 16%,transparent);color:var(--signal)}
.kind.edu{background:var(--accent-soft);color:var(--accent)}
@media (max-width:640px){.hop{grid-template-columns:28px minmax(0,1fr);gap:10px;padding:20px 16px}.hop .when{grid-column:2;text-align:left;order:-1}}
.certs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.cert{padding:22px;background:var(--surface);border:1px solid var(--line);border-radius:14px;display:flex;flex-direction:column;gap:6px}
.cert .issuer{font-family:var(--f-mono);font-size:13px;color:var(--accent)}
.cert h3{font-family:var(--f-display);font-size:19px;line-height:1.2;margin:0;font-weight:700}
.cert .y{font-family:var(--f-mono);font-size:13px;color:var(--muted);margin-top:auto;padding-top:12px}
@media (max-width:820px){.certs{grid-template-columns:1fr}}
.award{margin-top:14px;padding:20px 22px;border:1px dashed var(--line);border-radius:14px;display:flex;gap:6px 16px;align-items:baseline;flex-wrap:wrap}
.award strong{font-family:var(--f-display);font-size:19px}
.award span{color:var(--muted)}
.contact{background:var(--ink);color:var(--bg);border-radius:20px;padding:48px clamp(22px,5vw,64px);margin-block:24px 64px}
.contact h2{color:var(--bg);font-size:clamp(32px,5.5vw,62px);max-width:16ch}
.contact p{color:color-mix(in srgb,var(--bg) 72%,var(--ink));max-width:52ch;margin:16px 0 0}
.mail{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:28px}
.mail code{font-family:var(--f-mono);font-size:clamp(16px,2.2vw,22px);user-select:all;overflow-wrap:anywhere}
.contact .btn{background:transparent;color:var(--bg);border-color:color-mix(in srgb,var(--bg) 35%,var(--ink))}
.contact .btn:hover{border-color:var(--bg)}
.contact .btn.primary{background:var(--bg);color:var(--ink);border-color:var(--bg)}
.contact-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.meta{display:flex;flex-wrap:wrap;gap:8px 28px;margin-top:32px;padding-top:22px;border-top:1px solid color-mix(in srgb,var(--bg) 20%,var(--ink));font-family:var(--f-mono);font-size:14px;color:color-mix(in srgb,var(--bg) 72%,var(--ink))}
footer{padding-block:0 40px;font-family:var(--f-mono);font-size:13px;color:var(--muted);display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}
.copied{color:var(--ok)!important}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before{animation:none!important;transition:none!important}}

/* Flat system: no rounded corners, links instead of buttons */
*,*::before,*::after{border-radius:0!important}
.dot,.seal,.phases li::before{border-radius:50%!important}
.btn,.btn.primary,.contact .btn,.contact .btn.primary{display:inline-flex;align-items:center;gap:8px;background:none!important;border:0;border-bottom:2px solid var(--accent);padding:2px 0 4px;font-family:var(--f-body);font-weight:600;font-size:16px;color:var(--ink);text-decoration:none;cursor:pointer;box-shadow:none;transform:none!important;flex:0 0 auto!important}
.btn:hover{color:var(--accent);border-bottom-color:var(--ink)}
.btn.primary{color:var(--accent)}
.contact .btn,.contact .btn.primary{color:var(--bg);border-bottom-color:var(--accent)}
.contact .btn:hover{color:var(--accent)}
.cta{gap:14px 30px;margin-top:30px}
.contact-row{gap:14px 30px}
.mini{background:none;border:0;border-bottom:1px solid var(--muted);padding:2px 0;font-family:var(--f-mono);font-size:12px;color:var(--ink);cursor:pointer}
.mini:hover{color:var(--accent);border-bottom-color:var(--accent)}
.c-actions{gap:18px}
.soc,.nav-social .soc{border:0;background:none;width:32px;height:32px}
.soc:hover{transform:none}
.nav ul a{border-radius:0}
@media (max-width:760px){.nav ul a{border:0;background:none;padding:6px 0;border-bottom:2px solid transparent}.nav ul{gap:18px}}
.lbx-close{border:0;font-size:28px}
.console{box-shadow:none}
[hidden]{display:none!important}
img{max-width:100%}
body{margin:0}

/* Django additions: the language switch is made of links, styled like the former buttons */
.lang a{display:inline-block;background:none;border:0;padding:4px 2px;font:inherit;color:var(--muted);cursor:pointer;border-bottom:2px solid transparent;text-decoration:none}
.lang a[aria-current="true"]{color:var(--ink);border-bottom-color:var(--accent)}
.lang a:hover{color:var(--accent)}
/* First prize, a rank the original page had no example of */
.aw-1 .rank{--m:var(--signal)}
/* Certificate card linking to its PDF (no preview image) */
a.shot.missing{cursor:pointer}
/* Section labels read as shell commands; the prompt gets its own line in the narrow desktop column */
@media (min-width:761px){.sec-label b{display:block}}
/* Theme switch (dark by default), styled like the language switch */
.theme button{display:inline-flex;align-items:center}
.theme svg{width:15px;height:15px}
/* In the dark theme, the contact block stays dark green instead of turning light,
   with a border to stand out from the page. */
:root[data-theme="dark"] .contact{--bg:#EEF3F0;--ink:#0C1A14;--muted:#55665D;border:1px solid var(--line)}
/* Mobile header: name on the left, language and theme switches on the right; the
   menu has the second row to itself. The social icons stay in the hero and contact. */
@media (max-width:760px){
  .nav-social{display:none}
  .nav .lang{order:2;margin-left:auto}
  .nav .theme{order:3;margin-left:0;padding-right:0;border-right:0}
  .nav ul{order:4;flex:1 1 100%;width:100%}
}
/* Privacy page */
.privacy{border-top:0}
.prose{max-width:65ch}
.prose p{margin:0 0 16px;font-size:17px;color:var(--muted)}
.prose .prose-lede{font-family:var(--f-display);font-size:clamp(20px,2.2vw,24px);line-height:1.35;color:var(--ink)}
.prose h3{font-family:var(--f-display);font-weight:700;font-size:21px;margin:34px 0 8px;color:var(--ink)}
.prose a{color:var(--accent)}
.prose code{font-family:var(--f-mono);font-size:.9em;color:var(--ink)}
.prose .prose-back{margin-top:36px}
footer a{color:inherit}
