:root { color-scheme:light dark; --ground:light-dark(#f7f9f6,#141917);--sheet:light-dark(#ffffff,#1e2521);--ink:light-dark(#20312b,#edf3ee);--secondary:light-dark(#53665c,#b1c5b8);--accent:light-dark(#235c46,#a5d4b4);--on-accent:light-dark(#ffffff,#183823);--wash:light-dark(#e7eee8,#2d3930);--line:light-dark(#cfdacf,#425247);--error:light-dark(#9e2e2e,#ffb4ac);font-family:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:17px;line-height:1.65;background:var(--ground);color:var(--ink); }
* { box-sizing:border-box; }
body { margin:0; }
a { color:var(--accent);text-underline-offset:4px; }
button,input,textarea { font:inherit; }
button,a,input,textarea,summary { -webkit-tap-highlight-color:transparent; }
button,a { touch-action:manipulation; }
button { cursor:pointer; }
button:disabled { cursor:default;opacity:.5; }
:focus-visible { outline:3px solid var(--accent);outline-offset:4px; }
.site-header,main,footer { width:min(1152px,calc(100% - 48px));margin-inline:auto; }
.site-header { display:flex;gap:28px;align-items:center;justify-content:space-between;padding-block:28px; }
.wordmark { font-weight:700;font-size:25px;letter-spacing:-1px;color:var(--ink);text-decoration:none;white-space:nowrap; }
.mark { display:inline-block;margin-left:8px;color:var(--accent);font-size:24px; }
nav { display:flex;gap:24px;align-items:center;flex-wrap:wrap;font-size:14px; }
nav a { color:var(--ink);text-decoration:none; }
nav a:hover { text-decoration:underline; }
main { min-height:55vh;padding-block:40px 64px; }
main[aria-busy="true"] { opacity:.75; }
h1,h2,h3,p { margin-top:0; }
h1 { font-size:clamp(28px,4vw,48px);line-height:1.12;font-weight:600;letter-spacing:-1.7px;max-width:19ch;margin-bottom:24px; }
h2 { font-size:23px;line-height:1.25;letter-spacing:-.45px;font-weight:600; }
h3 { font-size:18px;line-height:1.4;font-weight:600; }
p { margin-bottom:20px; }
.intro { max-width:62ch;font-size:20px;line-height:1.5; }
.quiet { color:var(--secondary);font-size:14px; }
.context-layout { display:grid;grid-template-columns:minmax(0,1fr) minmax(270px,.55fr);gap:48px;align-items:start; }
.context-layout>* { min-width:0; }
.context-panel { background:var(--wash);padding:26px; }
.context-panel h2 { margin-bottom:12px; }
.source-text { white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px;line-height:1.7; }
.source-text.compact { max-height:350px;overflow:auto; }
.note-text { white-space:pre-wrap;overflow-wrap:anywhere;font-size:19px;line-height:1.8; }
.note-author { display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:24px;color:var(--secondary);font-size:14px; }
.avatar { display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;background:var(--wash);border-radius:50%;color:var(--accent);font-size:14px;font-weight:600; }
.actions { display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-block:24px; }
button,.button { display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:9px 18px;border:1px solid var(--line);border-radius:4px;background:var(--sheet);color:var(--ink);font-weight:500;font-size:15px;text-decoration:none;transition:transform .12s,background .12s; }
button:not(:disabled):hover,.button:hover { background:var(--wash); }
button:not(:disabled):active,.button:active { transform:translateY(1px); }
.primary { background:var(--accent);border-color:var(--accent);color:var(--on-accent); }
.primary:hover { background:var(--accent)!important;filter:brightness(.95); }
.secondary-link { border:0;background:transparent;padding-inline:0;color:var(--accent); }
button[aria-pressed="true"] { background:var(--wash);border-color:var(--accent);color:var(--accent); }
.editor { display:block;width:100%;padding:16px;border:1px solid var(--line);border-radius:4px;background:var(--sheet);color:var(--ink);resize:vertical;min-height:230px;line-height:1.7; }
label { display:block;font-weight:500;margin-bottom:10px; }
.choice { display:flex;align-items:flex-start;gap:10px;font-size:15px;margin-block:20px; }
.choice input { margin-top:6px;accent-color:var(--accent);width:18px;height:18px;flex:0 0 auto; }
.ai-excerpt { margin:28px 0;padding:20px 24px;background:var(--wash);font-size:16px; }
.ai-excerpt p { white-space:pre-wrap;overflow-wrap:anywhere;margin-bottom:12px; }
.ai-excerpt cite { font-style:normal;color:var(--secondary);font-size:13px; }
.summary-list { display:grid;grid-template-columns:1fr 1fr;gap:0 40px;list-style:none;margin:32px 0 0;padding:0; }
.summary-list li { padding-block:24px;border-bottom:1px solid var(--line); }
.summary-list h2 { font-size:23px;margin-bottom:12px; }
.summary-list h2 a { color:var(--ink);text-decoration:none; }
.summary-list p { margin-bottom:12px;overflow-wrap:anywhere; }
.summary-list .quiet { margin-bottom:0; }
.empty { max-width:720px;padding:34px;background:var(--wash);margin-block:32px; }
.empty h2 { margin-bottom:16px; }
.error { color:var(--error); }
.notice-inline { padding:18px 20px;background:var(--wash);margin-block:24px;font-size:15px; }
.prose { max-width:76ch; }
.prose h1 { max-width:none; }
.prose h2 { margin-top:36px; }
.review-text { padding:20px;background:var(--sheet); }
.permalink { overflow-wrap:anywhere; }
details { margin-block:20px; }
summary { cursor:pointer;color:var(--accent);font-size:14px;min-height:32px; }
footer { padding-block:28px 40px;display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;color:var(--secondary);font-size:13px; }
footer div { display:flex;gap:24px; }
#notice { position:fixed;inset:auto 24px 24px auto;max-width:min(440px,calc(100% - 48px));padding:0;z-index:5; }
#notice:not(:empty) { padding:16px 20px;background:var(--ink);color:var(--ground);box-shadow:0 6px 24px #0002; }
@media(max-width:760px) { .context-layout { grid-template-columns:minmax(0,1fr);gap:24px; }.summary-list { grid-template-columns:1fr; }.site-header { align-items:flex-start;gap:18px;flex-direction:column; }.site-header,main,footer { width:calc(100% - 36px); }main { padding-top:24px; }h1 { font-size:32px;letter-spacing:-1px; }.context-panel { padding:20px; }.note-text { font-size:18px; }.intro { font-size:18px; }nav { gap:16px;font-size:13px; }.empty { padding:24px; }.source-text.compact { max-height:230px; } }
@media(prefers-reduced-motion:reduce) { * { transition:none!important; } }