/* Leitner Studio. Each page is a drawing sheet: a framed field with grid references,
   mono labels, condensed titles. One dark palette; the site is always black. */
@font-face{font-family:"Plex Mono";src:url(fonts/IBMPlexMono-Regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Plex Mono";src:url(fonts/IBMPlexMono-Medium.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Plex Condensed";src:url(fonts/IBMPlexSansCondensed-Medium.woff2) format("woff2");font-weight:500;font-display:swap}
:root{
  --bg:#050506; --ink:#e9e3d6; --text:#d9d2c4; --soft:#cfc8bb; --muted:#8d877e; --faint:#5d5852;
  --rule:#2a2826; --frame:#3a3734;
  --mono:"Plex Mono",ui-monospace,Menlo,monospace; --cond:"Plex Condensed","Arial Narrow",sans-serif;
  --m:24px; --pad:96px; color-scheme:dark;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink)}
body{font-family:var(--mono);-webkit-font-smoothing:antialiased;min-height:100vh;position:relative}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:1px solid var(--ink);outline-offset:4px}
::selection{background:#3a2a1a}

/* frame */
#frame{position:absolute;left:0;top:0;width:100%;pointer-events:none;z-index:0}
#frame text{font-family:var(--mono);font-size:9px;fill:var(--faint);text-anchor:middle}
.sheet{position:relative;z-index:1;padding:calc(var(--m) + 22px) calc(var(--m) + 28px) calc(var(--m) + 20px);min-height:100vh;display:flex;flex-direction:column}

/* labels */
.m{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;line-height:1.85;color:var(--muted);text-transform:uppercase}
.m b,.m strong{font-weight:500;color:var(--ink)}
.dim{color:var(--faint)}

/* header */
.top{display:flex;justify-content:space-between;align-items:flex-start;gap:24px}
.brand{display:block;font-family:var(--cond);font-weight:500;font-size:16px;letter-spacing:.05em;line-height:1.3;color:var(--ink)}
.brand .sub{display:block;font-family:var(--mono);font-weight:400;font-size:10.5px;letter-spacing:.08em;color:var(--muted);margin-top:3px}
.nav{display:flex;gap:26px;margin-top:-2px}
.nav a{color:var(--muted)} .nav a:hover{color:var(--ink)}
.nav a[aria-current=page]{color:var(--ink);font-weight:500}
.ixbtn{display:none;background:none;border:0;padding:4px 0;cursor:pointer;color:var(--ink);font:500 10.5px/1 var(--mono);letter-spacing:.06em;align-items:center;gap:9px}
.ixbtn svg{display:block;transition:transform .25s}
.ixbtn[aria-expanded=true] svg{transform:rotate(45deg)}
.ix{position:fixed;inset:0;z-index:50;background:var(--bg);display:none;padding:calc(var(--m) + 22px) calc(var(--m) + 20px)}
.ix.open{display:block}
.ix .top{margin-bottom:64px}
.ix ol{list-style:none;margin:16px 0 0;padding:0;border-top:1px solid var(--rule)}
.ix li a{display:grid;grid-template-columns:34px 1fr;align-items:baseline;border-bottom:1px solid var(--rule);padding:20px 0 18px}
.ix li .n{font-size:10.5px;color:var(--faint)}
.ix li .t{font-family:var(--cond);font-weight:500;font-size:22px;letter-spacing:.03em;color:#bdb6aa;text-transform:uppercase}
.ix li a[aria-current=page] .t,.ix li a[aria-current=page] .n{color:var(--ink)}

/* page body */
main{flex:1;padding:0 calc(var(--pad) - var(--m) - 28px)}
.head{margin:84px 0 0}
.foot{display:flex;justify-content:flex-end;margin-top:72px}
.clock{text-align:right;white-space:nowrap}
.clock b{font-variant-numeric:tabular-nums}

/* schedules (works lists) */
.sched{margin-top:64px}
.row{display:grid;grid-template-columns:56px minmax(0,1.3fr) minmax(0,1fr) 60px 110px;gap:24px;align-items:baseline;border-top:1px solid var(--rule);padding:12px 0 11px}
.row.hd{border-top:0;padding-bottom:10px}
.sched .row:last-child{border-bottom:1px solid var(--rule)}
.wt{font-family:var(--mono);font-weight:500;font-size:13.5px;letter-spacing:.06em;line-height:1.5;color:var(--ink);text-transform:uppercase}
.row .c{line-height:1.6}
.row .l{text-align:right}
.lk{color:var(--ink);font-weight:500;white-space:nowrap}
.lk:hover{text-decoration:underline;text-underline-offset:4px}
.row .yr-m{display:none}

/* prose sheets */
.cols{display:grid;grid-template-columns:minmax(0,800px) 1fr;gap:48px;margin-top:22px}
.p{font-family:var(--mono);font-size:15px;line-height:1.75;color:var(--text);margin:0 0 1.1em;max-width:42em}
.p i{font-style:italic}
.side{padding-top:6px;padding-left:max(0px,calc(100% - 330px))}
blockquote{margin:34px 0 0}
blockquote p{font-family:var(--mono);font-style:italic;font-size:14px;line-height:1.75;color:var(--soft);margin:0 0 8px;max-width:42em}
.aud{margin-top:72px}
.aud ul{list-style:none;margin:14px 0 0;padding:0;columns:3;column-gap:40px;border-top:1px solid var(--rule)}
.aud li{font-size:11px;letter-spacing:.05em;color:var(--soft);border-bottom:1px solid var(--rule);padding:10px 0;break-inside:avoid;text-transform:uppercase}
.mail{color:var(--ink);font-weight:500}

/* method note */
.mn .sec{display:grid;grid-template-columns:56px 190px 1fr;padding:22px 0 20px;border-top:1px solid var(--rule)}
.mn .ans{margin:0;font-size:13.5px;line-height:1.75;color:var(--soft);max-width:52em}
.mn-grid{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:72px;margin-top:34px}
.detail svg{width:100%;height:auto;display:block}
.schedule-r div{display:flex;justify-content:space-between;border-top:1px solid var(--rule);padding:7px 0;font-size:11px;color:var(--muted);letter-spacing:.03em}
.schedule-r div:last-child{border-bottom:1px solid var(--rule)}

@media (max-width:900px){
  :root{--m:14px}
  .sheet{padding:34px 34px 34px}
  .brand{font-size:14px} .brand .sub{font-size:9.5px}
  .m{font-size:9.5px}
  .nav{display:none} .ixbtn{display:flex}
  main{padding:0}
  .head{margin-top:54px}
  .sched{margin-top:40px}
  .row.hd{display:none}
  .row{display:block;padding:12px 0 14px}
  .row .no{display:flex;justify-content:space-between;margin-bottom:3px}
  .row .yr-m{display:inline}
  .row .yr{display:none}
  .row .l{text-align:left;margin-top:4px}
  .row .l:empty{display:none}
  .wt{margin-bottom:3px}
  .cols{grid-template-columns:1fr;gap:0}
  .p{font-size:13px}
  .side{padding:0;margin-top:10px;border-top:1px solid var(--rule);padding-top:16px}
  blockquote{border-top:1px solid var(--rule);padding-top:18px;margin-top:24px} blockquote p{font-size:13px}
  .aud{margin-top:24px;border-top:1px solid var(--rule);padding-top:16px}
  .aud ul{columns:1;border-top:0}
  .aud li{font-size:10.5px;padding:9px 0;border-bottom:0;border-top:1px solid var(--rule)}
  .foot{justify-content:flex-start;margin-top:56px}
  .clock{text-align:left}
  .mn-grid{grid-template-columns:1fr;gap:28px}
  .mn .sec{display:block;padding:16px 0 14px}
  .mn .sec .m{display:inline}
  .mn .ans{margin-top:6px;font-size:12.5px;line-height:1.7}
  .mn .lbl{display:block;margin-bottom:6px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}