/* Tokens and shared pieces for both the site and the app. Dark first. */
@font-face{font-family:"Instrument Serif";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/instrument-serif.woff2) format("woff2")}
@font-face{font-family:"Instrument Serif";font-style:italic;font-weight:400;font-display:swap;src:url(/fonts/instrument-serif-italic.woff2) format("woff2")}
:root{
  --bg:#0a0c0b;--panel:#101312;--card:#151918;--raise:#1b201e;--line:#232927;--line2:#2f3633;
  --ink:#eceee8;--ink2:#b9c0b8;--mut:#869087;--acc:#57d6a4;--acc2:#3fb98a;--on-acc:#05130d;
  --warn:#e8b45a;--bad:#f0776b;--me:#182420;--shadow:0 18px 50px rgba(0,0,0,.55);
  --serif:"Instrument Serif","Iowan Old Style",Palatino,Georgia,serif;
  --sans:"SF Pro Display",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
  --r:14px;color-scheme:dark;
}
:root[data-theme="light"]{
  --bg:#f5f4ef;--panel:#efeee8;--card:#ffffff;--raise:#ffffff;--line:#e0ded5;--line2:#cfccc1;
  --ink:#15181a;--ink2:#3d4443;--mut:#6b7370;--acc:#0b7a59;--acc2:#096648;--on-acc:#ffffff;
  --warn:#9a6a10;--bad:#b93a2f;--me:#e4f1ea;--shadow:0 18px 50px rgba(30,40,35,.18);color-scheme:light;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 var(--sans);-webkit-font-smoothing:antialiased}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;padding:0}
a{color:var(--acc)}
.i{width:20px;height:20px;flex:none;display:block}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border-radius:12px;font-weight:600;text-decoration:none;white-space:nowrap}
.btn.pri{background:var(--acc);color:var(--on-acc)}
.btn.pri:hover{background:var(--acc2)}
.btn.ghost{border:1px solid var(--line2);color:var(--ink)}
.btn.ghost:hover{background:var(--raise)}
.btn:disabled{opacity:.5;cursor:default}
.ib{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:10px;color:var(--ink2)}
.ib:hover{background:var(--raise);color:var(--ink)}
:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.brand{display:inline-flex;align-items:center;gap:9px;color:var(--ink);text-decoration:none;font-weight:650;letter-spacing:-.01em}
.brand .i{width:24px;height:24px;color:var(--acc)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
::selection{background:color-mix(in srgb,var(--acc) 35%,transparent)}
