@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=Manrope:wght@400;500;600;700&display=swap');

*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{--status-height:30px;font-family:Manrope,sans-serif;overflow:hidden}
.skip-link{position:fixed;top:8px;left:8px;z-index:999;transform:translateY(-160%);padding:10px 14px;background:#fff;color:#000}
.skip-link:focus{transform:none}
.tmux-shell{--terminal-size:36%;height:calc(100dvh - var(--status-height));display:grid;position:relative}
.pane{min-width:0;min-height:0}
.terminal-pane{font-family:IBM Plex Mono,monospace;display:flex;flex-direction:column;overflow:hidden}
.pane-title{height:36px;flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;padding:0 12px;font:500 11px IBM Plex Mono,monospace;letter-spacing:.04em}
.pane-title button{border:0;background:transparent;color:inherit;font:inherit;cursor:pointer}
.terminal-log{flex:1;overflow:auto;padding:18px 18px 8px;scrollbar-width:thin}
.terminal-line{font-size:12px;line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere}
.terminal-line--command{margin-top:10px}
.terminal-line--system{opacity:.72}
.terminal-line--error{color:var(--terminal-error)}
.terminal-form{display:flex;align-items:center;gap:7px;margin:8px 12px 14px;padding:10px 11px;border:1px solid var(--terminal-line);background:var(--terminal-input-bg)}
.prompt-label{font:500 12px IBM Plex Mono,monospace;color:var(--terminal-accent);white-space:nowrap}
.terminal-input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:inherit;font:500 13px IBM Plex Mono,monospace;caret-color:var(--terminal-accent)}
.terminal-input::placeholder{color:var(--terminal-muted)}
.quick-commands{display:flex;gap:6px;overflow:auto;padding:0 12px 10px}
.quick-commands button{flex:0 0 auto;border:1px solid var(--terminal-line);background:transparent;color:var(--terminal-muted);font:500 10px IBM Plex Mono,monospace;padding:7px 9px;cursor:pointer}
.quick-commands button:hover,.quick-commands button:focus-visible{color:var(--terminal-accent);border-color:var(--terminal-accent)}
.splitter{z-index:3;touch-action:none}
.splitter:focus-visible{outline:2px solid var(--terminal-accent);outline-offset:-2px}
.viewer-pane{overflow:auto;position:relative}
.viewer-chrome{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:58px;padding:8px clamp(18px,3vw,42px);backdrop-filter:blur(16px)}
.viewer-brand{font:700 14px Manrope,sans-serif;text-decoration:none;color:inherit;white-space:nowrap}
.viewer-nav{display:flex;align-items:center;gap:4px;overflow:auto}
.viewer-nav a{display:inline-flex;align-items:center;min-height:42px;padding:0 10px;color:inherit;text-decoration:none;font-size:12px;white-space:nowrap;border-radius:3px}
.viewer-nav a:hover,.viewer-nav a:focus-visible,.viewer-nav a.is-active{background:var(--viewer-nav-active)}
.viewer-content{max-width:980px;margin:auto;padding:clamp(42px,7vw,100px) clamp(24px,7vw,90px) 110px}
.is-enhanced [data-view][hidden]{display:none}
.view{animation:view-in .35s ease both}
.eyebrow{font:600 10px IBM Plex Mono,monospace;letter-spacing:.15em;text-transform:uppercase;color:var(--viewer-accent);margin:0 0 22px}
.display{font-size:clamp(48px,7vw,104px);line-height:.92;letter-spacing:-.065em;margin:0;max-width:850px}
.lede{font-size:clamp(18px,2.2vw,28px);line-height:1.45;max-width:720px;margin:34px 0}
.viewer-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:34px}
.viewer-actions a,.viewer-actions button,.text-link{display:inline-flex;min-height:44px;align-items:center;padding:0 15px;border:1px solid currentColor;background:transparent;color:inherit;text-decoration:none;font:600 11px IBM Plex Mono,monospace;cursor:pointer}
.viewer-actions a:first-child,.viewer-actions button:first-child{background:var(--viewer-accent);border-color:var(--viewer-accent);color:var(--viewer-accent-text)}
.section-title{font-size:clamp(38px,5vw,74px);letter-spacing:-.055em;line-height:1;margin:0 0 42px}
.prose{max-width:700px;font-size:17px;line-height:1.75}
.fact-grid,.project-grid,.writing-list{display:grid;gap:1px;background:var(--viewer-rule);border:1px solid var(--viewer-rule)}
.fact,.project-card,.writing-item{background:var(--viewer-bg);padding:22px}
.fact-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.fact small,.project-card small,.writing-item small{display:block;font:600 10px IBM Plex Mono,monospace;color:var(--viewer-muted);text-transform:uppercase;letter-spacing:.1em;margin-bottom:9px}
.fact strong{font-size:18px}
.project-card{display:grid;grid-template-columns:44px 1fr auto;gap:20px;align-items:start;color:inherit;text-decoration:none}
.project-card:hover,.project-card:focus-visible{background:var(--viewer-hover)}
.project-card strong{font-size:22px}
.project-card p{margin:5px 0 0;color:var(--viewer-muted);font-size:13px;line-height:1.5}
.project-card em{font:500 9px IBM Plex Mono,monospace;color:var(--viewer-accent);font-style:normal;text-transform:uppercase}
.writing-item{display:grid;grid-template-columns:100px 1fr auto;gap:20px;align-items:center}
.writing-item time{font:500 10px IBM Plex Mono,monospace;color:var(--viewer-muted)}
.writing-item strong{font-size:17px}
.project-detail .project-index{font:600 12px IBM Plex Mono,monospace;color:var(--viewer-accent)}
.project-detail blockquote{margin:44px 0;padding:24px 0;border-block:1px solid var(--viewer-rule);font-size:clamp(24px,3vw,42px);line-height:1.2;letter-spacing:-.03em}
.statusbar{position:fixed;z-index:10;left:0;right:0;bottom:0;min-height:var(--status-height);padding-bottom:env(safe-area-inset-bottom);display:flex;align-items:center;gap:8px;padding-inline:10px;font:500 10px IBM Plex Mono,monospace}
.statusbar span:last-child{margin-left:auto}
.mobile-terminal-toggle{display:none}
.concept-exit{color:inherit;text-decoration:none}
.concept-exit:hover{text-decoration:underline}

@keyframes view-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

@media(prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important}
  .view{animation:none}
}

@media(max-width:760px){
  body{--status-height:calc(44px + env(safe-area-inset-bottom));overflow:hidden}
  .skip-link{min-height:44px}
  .viewer-chrome{min-height:96px;padding:4px 14px;display:grid;grid-template-columns:1fr;gap:0}
  .viewer-brand{min-height:44px;display:inline-flex;align-items:center}
  .viewer-nav{gap:0;min-width:0;width:100%;justify-content:space-between}
  .viewer-nav a{padding:0 4px;min-width:44px;min-height:44px;justify-content:center}
  .viewer-content{padding:42px 20px 120px}
  .display{font-size:clamp(48px,15vw,72px)}
  .fact-grid{grid-template-columns:1fr}
  .project-card{grid-template-columns:32px 1fr}
  .project-card em{grid-column:2}
  .writing-item{grid-template-columns:1fr auto}
  .writing-item time{grid-column:1/-1}
  .mobile-terminal-toggle{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;border:0;background:transparent;color:inherit;font:600 11px IBM Plex Mono,monospace}
  .terminal-log{padding-top:12px}
  .terminal-form{min-height:48px;margin-bottom:8px;padding-block:1px}
  .terminal-input{min-height:44px}
  .quick-commands{padding-bottom:8px}
  .quick-commands button,button[data-command]{min-width:44px;min-height:44px}
  .pane-title button{min-height:44px}
  .pane-title:has(button){height:48px}
}

:where(a,button):focus-visible{outline:3px solid currentColor;outline-offset:3px}