:root{
    --bg:#F1F0EC;
    --surface:#FFFFFF;
    --surface-soft:#E7E4DB;
    --ink:#1C1F26;
    --ink-soft:#5B6270;
    --ink-faint:#8A8F99;
    --accent:#A6742C;
    --accent-ink:#FFFFFF;
    --line:#DBD7CC;
    --focus:#1C1F26;
    --substack:#FF6719;
    --substack-ink:#FFFFFF;
    --linkedin:#0A66C2;
    --linkedin-ink:#FFFFFF;
  }
  @media (prefers-color-scheme: dark){
    :root:not([data-theme="light"]){
      --bg:#14161B;
      --surface:#1B1E24;
      --surface-soft:#20232A;
      --ink:#ECE9E1;
      --ink-soft:#9BA0AC;
      --ink-faint:#6E7480;
      --accent:#D6A34C;
      --accent-ink:#14161B;
      --line:#2B2E35;
      --focus:#ECE9E1;
    }
  }
  :root[data-theme="dark"]{
    --bg:#14161B;
    --surface:#1B1E24;
    --surface-soft:#20232A;
    --ink:#ECE9E1;
    --ink-soft:#9BA0AC;
    --ink-faint:#6E7480;
    --accent:#D6A34C;
    --accent-ink:#14161B;
    --line:#2B2E35;
    --focus:#ECE9E1;
  }

  *{box-sizing:border-box;}
  body{
    background:var(--bg);
    color:var(--ink);
    font-family:'Public Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    padding-inline:0;
  }
  .wrap{
    max-width:920px;
    margin-inline:auto;
    padding-inline:20px;
  }
  a{color:inherit;}
  h1,h2,h3{font-family:'Newsreader', Georgia, 'Times New Roman', serif; text-wrap:balance; margin:0;}
  .eyebrow{
    font-family:'IBM Plex Mono', 'Courier New', monospace;
    font-size:0.72rem;
    letter-spacing:0.14em;
    text-transform:uppercase;
    color:var(--accent);
    font-weight:600;
    display:flex;
    align-items:center;
    gap:10px;
  }
  .eyebrow::after{
    content:"";
    height:1px;
    flex:1 1 auto;
    background:var(--line);
  }
  .mono{font-family:'IBM Plex Mono', 'Courier New', monospace; font-variant-numeric:tabular-nums;}

  /* masthead */
  .masthead{
    width:100%;
    aspect-ratio:1584/396;
    max-height:280px;
    overflow:hidden;
    background:var(--surface-soft);
  }
  .masthead img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    display:block;
  }
  @media (max-width:560px){
    .masthead{max-height:170px;}
  }

  /* top bar */
  .topbar{
    position:sticky;
    top:env(safe-area-inset-top, 0px);
    z-index:20;
    background:color-mix(in srgb, var(--bg) 88%, transparent);
    backdrop-filter:blur(8px);
    border-bottom:1px solid var(--line);
  }
  .topbar-inner{
    max-width:920px;
    margin-inline:auto;
    padding:14px 20px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
  }
  .topbar-name{
    font-family:'IBM Plex Mono', monospace;
    font-size:0.78rem;
    letter-spacing:0.06em;
    text-transform:uppercase;
    font-weight:600;
  }
  .topbar-nav{display:flex; gap:8px; flex-wrap:wrap;}
  .topbar-nav a{
    font-family:'IBM Plex Mono', monospace;
    font-size:0.72rem;
    letter-spacing:0.03em;
    text-transform:uppercase;
    text-decoration:none;
    color:var(--accent-ink);
    background:var(--accent);
    border-radius:2px;
    padding:7px 12px;
    transition:filter .15s ease;
  }
  .topbar-nav a:hover, .topbar-nav a:focus-visible{ filter:brightness(1.08); }
  .topbar-nav a[aria-current="page"]{
    background:transparent; color:var(--accent);
    box-shadow:inset 0 0 0 1px var(--accent);
  }
  .topbar-cta{
    font-family:'IBM Plex Mono', monospace;
    font-size:0.75rem;
    letter-spacing:0.04em;
    text-transform:uppercase;
    text-decoration:none;
    color:var(--accent-ink);
    background:var(--accent);
    padding:8px 14px;
    border-radius:2px;
    white-space:nowrap;
  }
  .topbar-cta:hover, .topbar-cta:focus-visible{filter:brightness(1.08);}

  /* hero */
  .hero{
    padding-block:56px 64px;
    display:grid;
    grid-template-columns:1.3fr 0.9fr;
    gap:40px;
    align-items:center;
  }
  .hero-eyebrow{
    font-family:'IBM Plex Mono', monospace;
    font-size:0.78rem;
    letter-spacing:0.14em;
    text-transform:uppercase;
    color:var(--accent);
    font-weight:600;
    margin-bottom:18px;
  }
  .hero h1{
    font-size:clamp(2.6rem, 5.2vw + 1rem, 4.6rem);
    font-weight:560;
    line-height:1.02;
    letter-spacing:-0.01em;
    margin-bottom:18px;
  }
  .hero p.lede{
    font-size:1.15rem;
    line-height:1.55;
    color:var(--ink-soft);
    max-width:46ch;
    margin-bottom:22px;
  }
  .hero-meta{
    display:flex;
    flex-wrap:wrap;
    gap:8px 18px;
    font-size:0.82rem;
    color:var(--ink-faint);
  }
  .hero-meta span{display:flex; align-items:center; gap:8px;}
  .hero-meta span:not(:last-child)::after{
    content:"·";
    color:var(--line);
    margin-left:10px;
  }

  .portrait-frame{
    position:relative;
    width:100%;
    max-width:280px;
    margin-inline:auto;
  }
  .portrait-frame img{
    width:100%;
    height:auto;
    aspect-ratio:5/6;
    object-fit:cover;
    display:block;
    border:1px solid var(--line);
    background:var(--surface-soft);
  }
  .stamp{
    position:absolute;
    bottom:-14px;
    left:-14px;
    background:var(--accent);
    color:var(--accent-ink);
    font-family:'IBM Plex Mono', monospace;
    font-size:0.68rem;
    line-height:1.3;
    letter-spacing:0.05em;
    text-transform:uppercase;
    font-weight:600;
    padding:10px 12px;
    transform:rotate(-6deg);
    box-shadow:0 6px 16px -6px rgba(0,0,0,0.35);
    text-align:center;
  }

  section{padding-block:52px; border-top:1px solid var(--line);}
  .section-head{margin-bottom:28px;}
  .section-head h2{
    font-size:clamp(1.6rem, 2.6vw, 2.1rem);
    font-weight:520;
    margin-top:10px;
  }

  .about-body p{
    font-size:1.02rem;
    line-height:1.7;
    color:var(--ink-soft);
    max-width:64ch;
    margin:0 0 18px;
  }
  .about-note{
    margin-top:22px;
    padding-top:18px;
    border-top:1px dashed var(--line);
    font-family:'Newsreader', serif;
    font-style:italic;
    color:var(--ink-faint);
    font-size:0.98rem;
    max-width:64ch;
  }

  /* timeline */
  .timeline{
    position:relative;
    padding-left:26px;
  }
  .timeline::before{
    content:"";
    position:absolute;
    left:5px; top:6px; bottom:6px;
    width:1px;
    background:var(--line);
  }
  .tl-item{
    position:relative;
    display:grid;
    grid-template-columns:110px 1fr;
    gap:18px;
    padding-block:16px;
  }
  .tl-item:not(:last-child){border-bottom:1px solid var(--line);}
  .tl-item::before{
    content:"";
    position:absolute;
    left:-26px; top:24px;
    width:9px; height:9px;
    border-radius:50%;
    background:var(--accent);
    border:2px solid var(--bg);
  }
  .tl-years{
    font-size:0.82rem;
    color:var(--ink-faint);
    padding-top:2px;
  }
  .tl-role{font-weight:600; font-size:1rem;}
  .tl-org{color:var(--ink-soft); font-size:0.94rem; margin-top:2px;}
  .tl-note{color:var(--ink-faint); font-size:0.88rem; margin-top:8px; line-height:1.5;}

  /* chips */
  .chips{display:flex; flex-wrap:wrap; gap:10px;}
  .chip{
    font-family:'IBM Plex Mono', monospace;
    font-size:0.78rem;
    letter-spacing:0.02em;
    padding:9px 14px;
    border:1px solid var(--line);
    border-radius:2px;
    color:var(--ink-soft);
    background:var(--surface);
  }

  /* two col */
  .twocol{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:40px;
  }
  .twocol h3{
    font-size:1.1rem;
    font-weight:560;
    margin-bottom:16px;
  }
  .edu-item{margin-bottom:16px;}
  .edu-item .role{font-weight:600; font-size:0.95rem;}
  .edu-item .org{color:var(--ink-soft); font-size:0.88rem; margin-top:2px;}

  .lang-row{display:flex; align-items:center; justify-content:space-between; gap:12px; padding-block:10px; border-bottom:1px solid var(--line);}
  .lang-row:last-child{border-bottom:none;}
  .lang-name{font-size:0.95rem;}
  .lang-level{font-size:0.78rem; color:var(--ink-faint); font-family:'IBM Plex Mono', monospace;}

  .club-logos{display:flex; flex-wrap:wrap; align-items:center; gap:24px;}
  .club-logo{display:flex; align-items:center; justify-content:center; width:64px; height:64px; transition:transform 0.15s ease, opacity 0.15s ease;}
  .club-logo img{width:100%; height:100%; object-fit:contain;}
  .club-logo:hover{transform:translateY(-3px); opacity:0.85;}

  /* products */
  .cards{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(230px, 1fr));
    gap:20px;
  }
  .pcard{
    background:var(--surface);
    border:1px solid var(--line);
    padding:26px;
    display:flex;
    flex-direction:column;
    gap:12px;
  }
  .pcard-tag{
    font-family:'IBM Plex Mono', monospace;
    font-size:0.7rem;
    letter-spacing:0.08em;
    text-transform:uppercase;
    color:var(--ink-faint);
  }
  .pcard h3{font-size:1.2rem; font-weight:560;}
  .pcard p{color:var(--ink-soft); font-size:0.92rem; line-height:1.55; margin:0; flex:1;}
  .pcard-link{
    align-self:flex-start;
    font-family:'IBM Plex Mono', monospace;
    font-size:0.78rem;
    letter-spacing:0.03em;
    text-transform:uppercase;
    text-decoration:none;
    color:var(--ink);
    border-bottom:1px solid var(--accent);
    padding-bottom:2px;
  }
  .pcard-link:hover, .pcard-link:focus-visible{color:var(--accent);}

  /* contact */
  .contact-box{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    background:var(--surface);
    border:1px solid var(--line);
    padding:32px;
  }
  .contact-box h2{font-size:1.5rem; font-weight:540; margin-bottom:8px;}
  .contact-box p{color:var(--ink-soft); max-width:42ch; margin:0;}
  .btn-mail{
    font-family:'IBM Plex Mono', monospace;
    font-size:0.85rem;
    letter-spacing:0.03em;
    text-transform:uppercase;
    text-decoration:none;
    color:var(--accent-ink);
    background:var(--accent);
    padding:14px 22px;
    white-space:nowrap;
  }
  .btn-mail:hover, .btn-mail:focus-visible{filter:brightness(1.08);}
  .contact-actions{display:flex; flex-wrap:wrap; gap:12px;}
  .nowrap{white-space:nowrap;}
  .btn-outline{
    display:inline-flex;
    align-items:center;
    gap:9px;
    font-family:'IBM Plex Mono', monospace;
    font-size:0.85rem;
    letter-spacing:0.03em;
    text-transform:uppercase;
    text-decoration:none;
    color:var(--accent);
    border:1px solid var(--accent);
    padding:13px 21px;
    white-space:nowrap;
    transition:background .15s ease, color .15s ease;
  }
  .btn-outline:hover, .btn-outline:focus-visible{background:var(--accent); color:var(--accent-ink);}
  .btn-linkedin{color:var(--linkedin); border-color:var(--linkedin);}
  .btn-linkedin:hover, .btn-linkedin:focus-visible{background:var(--linkedin); color:var(--linkedin-ink);}
  .btn-substack{color:var(--substack); border-color:var(--substack);}
  .btn-substack:hover, .btn-substack:focus-visible{background:var(--substack); color:var(--substack-ink);}

  footer{
    padding-block:28px 40px;
    display:flex;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:10px;
    font-size:0.78rem;
    color:var(--ink-faint);
    font-family:'IBM Plex Mono', monospace;
  }

  a:focus-visible, button:focus-visible{
    outline:2px solid var(--focus);
    outline-offset:2px;
  }

  @media (max-width: 720px){
    .hero{grid-template-columns:1fr; padding-block:36px 44px;}
    .hero > div:first-child{order:2;}
    .portrait-frame{order:1; max-width:220px; margin-bottom:12px;}
    .topbar-inner{flex-wrap:wrap;}
    .topbar-nav{
      order:3; width:100%;
      flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch;
      padding-bottom:2px; margin-top:2px;
    }
    .topbar-nav a{white-space:nowrap;}
    .twocol{grid-template-columns:1fr; gap:32px;}
    .tl-item{grid-template-columns:1fr; gap:4px;}
    .timeline{padding-left:20px;}
    .tl-item::before{left:-20px;}
    .contact-box{flex-direction:column; align-items:flex-start;}
    .btn-mail{white-space:normal; text-align:center;}
    .contact-actions{flex-direction:column; align-self:stretch;}
    .btn-outline{justify-content:center;}
  }

  @media (prefers-reduced-motion: no-preference){
    .fade-up{animation:fadeUp .6s ease both;}
    @keyframes fadeUp{from{opacity:0; transform:translateY(8px);} to{opacity:1; transform:none;}}
  }

  /* press widget */
  .press-toggle{
    position:fixed;
    right:20px;
    bottom:20px;
    z-index:40;
    display:none;
    align-items:center;
    gap:8px;
    font-family:'IBM Plex Mono', monospace;
    font-size:0.78rem;
    letter-spacing:0.03em;
    text-transform:uppercase;
    color:var(--accent-ink);
    background:var(--accent);
    border:none;
    padding:12px 16px;
    border-radius:999px;
    box-shadow:0 8px 20px -8px rgba(0,0,0,0.4);
    cursor:pointer;
  }
  .press-overlay{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,0.35);
    z-index:38;
    opacity:0;
    pointer-events:none;
    transition:opacity .25s ease;
  }
  .press-overlay.open{opacity:1; pointer-events:auto;}

  .press-widget{
    position:fixed;
    top:0;
    right:0;
    bottom:0;
    width:min(360px, 86vw);
    background:var(--surface);
    border-left:1px solid var(--line);
    z-index:39;
    display:flex;
    flex-direction:column;
    transform:translateX(100%);
    transition:transform .3s ease;
    box-shadow:-12px 0 30px -18px rgba(0,0,0,0.5);
  }
  .press-widget.open{transform:translateX(0);}

  .press-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:16px 18px;
    border-bottom:1px solid var(--line);
  }
  .press-head h2{
    font-family:'IBM Plex Mono', monospace;
    font-size:0.8rem;
    letter-spacing:0.1em;
    text-transform:uppercase;
    font-weight:600;
    color:var(--ink);
  }
  .press-updated{
    font-family:'IBM Plex Mono', monospace;
    font-size:0.68rem;
    color:var(--ink-faint);
    margin-top:4px;
  }
  .press-close, .press-refresh{
    background:none;
    border:none;
    color:var(--ink-soft);
    cursor:pointer;
    font-size:1rem;
    line-height:1;
    padding:4px;
  }
  .press-close:hover, .press-refresh:hover{color:var(--ink);}

  .press-body{
    flex:1;
    overflow-y:auto;
    padding:8px 18px 20px;
  }
  .press-source{margin-top:18px;}
  .press-source:first-child{margin-top:6px;}
  .press-source-name{
    display:flex;
    align-items:center;
    gap:8px;
    font-family:'IBM Plex Mono', monospace;
    font-size:0.72rem;
    letter-spacing:0.08em;
    text-transform:uppercase;
    color:var(--ink-faint);
    margin-bottom:8px;
  }
  .press-dot{width:8px; height:8px; border-radius:50%; flex:none;}
  .press-item{
    display:block;
    font-size:0.86rem;
    line-height:1.4;
    color:var(--ink);
    text-decoration:none;
    padding:7px 0;
    border-bottom:1px solid var(--line);
  }
  .press-source .press-item:last-child{border-bottom:none;}
  .press-item:hover, .press-item:focus-visible{color:var(--accent);}
  .press-status{
    font-size:0.82rem;
    color:var(--ink-faint);
    padding:10px 0;
  }

  @media (max-width:1359.98px){
    .press-toggle{display:flex;}
  }
  @media (min-width:1360px){
    .press-overlay{display:none;}
    .press-close{display:none;}
    .press-widget{
      top:96px;
      bottom:auto;
      right:24px;
      width:300px;
      max-height:calc(100vh - 130px);
      border:1px solid var(--line);
      border-radius:4px;
      transform:none;
      box-shadow:0 14px 30px -20px rgba(0,0,0,0.35);
    }
  }
  @media (max-width:480px){
    .press-toggle .ptxt{display:none;}
    .press-toggle{padding:12px; border-radius:50%;}
  }