:root{--bg:#f6f5f0;--paper:#fffefa;--ink:#243730;--muted:#78847a;--line:#dce2d8;--accent:#b8da55;--green:#355b49;--error:#973d31}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline}
button,input,select,textarea{font:inherit}
button,a,input,textarea,select{outline-offset:4px}
button{cursor:pointer}
button,.button{border:1px solid var(--line);border-radius:8px;padding:10px 17px;background:var(--paper);color:var(--ink);display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:600}
button:hover,.button:hover{background:#eaf0de;text-decoration:none}
.button{background:var(--ink);color:white;border-color:var(--ink)}
.button:hover{background:var(--green)}
.button.secondary{background:transparent;color:var(--ink);border-color:var(--line)}
.quiet{background:none;border:0;padding:4px;font-weight:400}
header{height:92px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 5vw;gap:30px}
.brand{font-size:27px;font-weight:750;letter-spacing:-1.5px;white-space:nowrap}
.brand span{font-weight:400}
.brand i{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--accent);margin-left:5px}
header nav{display:flex;gap:30px;font-size:14px}
header nav a:first-child{font-weight:650}
.account{display:flex;gap:15px;align-items:center;font-size:13px}
.pill{border:1px solid var(--line);padding:6px 14px;border-radius:30px}
main{min-height:75vh}
footer{padding:30px 5vw;display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)}
.intro{padding:60px 7vw 50px;display:flex;align-items:center;justify-content:space-between;gap:40px}
.eyebrow{font-size:11px;letter-spacing:2px;font-weight:700;color:var(--green);margin:0 0 16px}
h1,h2,h3{line-height:1.15;letter-spacing:-1.5px;font-weight:600}
h1{font-size:clamp(32px,4.4vw,64px);margin:0 0 20px}
h1 em{font-family:Georgia,serif;font-weight:400}
h2{font-size:28px;margin-top:36px;letter-spacing:-.7px}
h3{font-size:20px;letter-spacing:-.4px}
.intro p:not(.eyebrow){color:var(--muted);line-height:1.7}
.searchbox{width:360px;max-width:100%}
.searchbox label{display:block;font-size:13px;font-weight:600;margin-bottom:12px}
.searchbox>div{display:flex;background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:5px}
.searchbox input{border:0;background:transparent;min-width:0;width:100%;padding:12px}
.searchbox button{background:var(--accent);border:0;font-size:22px}
.searchbox small{font-size:11px;display:block;margin-top:12px;color:var(--muted)}
.map-section{margin:0 5vw 50px}
.section-head{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:20px 0;font-size:14px}
.section-head .muted{font-size:12px}
.dot{width:7px;height:7px;background:var(--green);display:inline-block;border-radius:50%;margin-right:8px}
.muted{color:var(--muted)}
.map{position:relative;height:480px;background-color:#eeeee6;background-image:radial-gradient(#cdd4c7 .7px,transparent .7px);background-size:20px 20px;border:1px solid var(--line);border-radius:18px;overflow:hidden;touch-action:none}
.map.large{height:65vh;min-height:450px;margin:0 5vw}
.map svg{display:block;width:100%;height:100%;user-select:none}
.map svg:active{cursor:grabbing}
.map-controls{position:absolute;bottom:20px;left:20px;display:flex;gap:5px}
.map-controls button{background:var(--paper);padding:6px 12px;font-size:13px}
.map-hint{position:absolute;right:20px;bottom:24px;font-size:10px;color:var(--muted);max-width:45%;pointer-events:none}
.map .node{cursor:pointer}
.map .node circle{stroke-width:1.5;stroke:#b3c0ac;fill:#e1e7d4;transition:stroke .15s}
.map .node:nth-of-type(3n) circle{fill:#d4dec1}
.map .node:nth-of-type(4n) circle{fill:#f6f4e9}
.map .node:hover circle,.map .node:focus circle{stroke:var(--ink);stroke-width:3}
.map .node text{font-size:13px;fill:var(--ink);pointer-events:none;text-anchor:middle;font-weight:600}
.map .node .node-meta{font-size:10px;fill:#64745c;font-weight:400}
.map .node .node-summary{font-size:10px;font-weight:400}
.map .ring{fill:none;stroke:#cbd4c3;stroke-dasharray:4 8}
.map .ring-label{font-size:11px;fill:#718166}
.map .edge{stroke:#6d8273;stroke-width:2;fill:none;cursor:pointer;pointer-events:stroke}
.map .edge.editorial{stroke-dasharray:6 5}
.map .edge:hover,.map .edge:focus{stroke:#263d31;stroke-width:5}
.map .dim{opacity:.15}
.map .node.selected circle{stroke:#1b4939;stroke-width:4}
.map.zoom-low .node-summary,.map.zoom-low .node-meta{display:none}
.center-label{font-size:13px;fill:#42604c;text-anchor:middle;font-weight:600}
.empty{text-align:center;padding:65px 20px;background:var(--paper);border:1px solid var(--line);border-radius:16px}
.empty-orbit{font-size:64px;color:#98ad75}
.empty h2{margin:8px}
.empty p{color:var(--muted)}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;padding-top:20px}
.card{padding:20px;background:var(--paper);border:1px solid var(--line);border-radius:12px}
.card span{font-size:12px;color:var(--muted)}
details summary{cursor:pointer}
.list-toggle{padding-top:22px;font-size:14px}
.breadcrumbs{margin:25px 5vw;font-size:12px;color:var(--muted)}
.topic-head{margin:25px 5vw;display:flex;align-items:center;justify-content:space-between;gap:25px}
.topic-head h1{font-size:42px}
.topic-head p:not(.eyebrow){max-width:700px;color:var(--muted)}
.topic-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;max-width:340px}
.metric{font-size:36px;line-height:1}
.metric small{display:block;font-size:10px;letter-spacing:1px;margin-top:8px}
.chips{margin:15px 5vw;display:flex;gap:12px;flex-wrap:wrap;font-size:12px}
.chips a{border:1px solid var(--line);border-radius:20px;padding:3px 12px}
.legend{margin:15px 5vw;display:flex;gap:25px;flex-wrap:wrap;font-size:11px;color:var(--muted)}
.reading-list,.article{max-width:900px;margin:60px auto;padding:0 25px}
.article .breadcrumbs{margin:0 0 30px}
.article h1{font-size:44px}
.lead{font-size:25px;line-height:1.5}
.label{font-size:11px;text-transform:uppercase;letter-spacing:1.2px;color:var(--muted)}
.statement-row{display:flex;align-items:center;gap:25px;border-bottom:1px solid var(--line);padding:23px 0}
.statement-row:hover{text-decoration:none;background:#eef1e6}
.statement-row time{min-width:100px;color:var(--muted);font-size:12px}
.statement-row>div,.statement-row>strong{flex:1}
.statement-row p{margin:4px 0 0;font-size:14px}
.statement-row>span:last-child{margin-left:auto}
.profile-heading{display:flex;gap:25px;align-items:center}
.avatar{width:100px;height:100px;border-radius:50%;object-fit:cover}
.source-card{border:1px solid var(--line);border-radius:12px;padding:24px;margin:18px 0;background:var(--paper);overflow-wrap:anywhere}
.source-card>a{font-weight:650}
.source-card p{font-size:14px}
.source-card h2{margin-top:0}
blockquote{border-left:3px solid var(--accent);padding:12px 28px;font:24px/1.6 Georgia,serif;margin:24px 0;background:#edf1e4}
.actions{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin:25px 0}
.form-shell{max-width:780px;margin:55px auto;padding:0 25px}
.form-shell h1{font-size:38px}
.field{margin:22px 0}
label{display:block;font-size:13px;font-weight:600;margin-bottom:7px}
input:not([type=checkbox]):not([type=hidden]),textarea,select{display:block;width:100%;padding:12px;border:1px solid #bdc8b8;border-radius:7px;background:var(--paper);color:var(--ink)}
input[type=checkbox]{width:20px;height:20px}
select[multiple]{min-height:145px}
textarea{resize:vertical}
.field small{color:var(--muted)}
.errorlist{color:var(--error);font-size:13px;padding-left:18px}
.message{margin:18px 5vw;padding:15px 20px;background:#e5ecd6;border:1px solid #cedbb8;border-radius:8px}
.form-shell .message,.article .message{margin:20px 0}
.quick-add{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;border-bottom:1px solid var(--line);padding-bottom:15px}
.quick-add button{font-size:12px;padding:4px 8px}
.danger{margin:40px 0;color:var(--error)}
.honeypot{position:absolute;left:-10000px}
.workspace{margin:45px 5vw}
.workspace h1{font-size:40px}
.tabs{display:flex;gap:8px;flex-wrap:wrap;border-bottom:1px solid var(--line);padding-bottom:16px}
.tabs a{font-size:13px;padding:7px 14px;border-radius:7px}
.tabs [aria-current=page]{background:var(--ink);color:white}
.inline-search{display:flex;gap:10px;align-items:center}
.inline-search input{min-width:0}
.table-wrap{overflow:auto}
table{border-collapse:collapse;width:100%;font-size:14px}
td,th{padding:16px 12px;border-bottom:1px solid var(--line);text-align:left}
th{font-size:11px;text-transform:uppercase;color:var(--muted)}
td:first-child{min-width:200px}
.pagination{display:flex;gap:25px;justify-content:center;margin:20px;font-size:13px}
.editor-toolbar{margin:20px 5vw;display:flex;gap:15px;align-items:center;flex-wrap:wrap;background:#e6eddb;padding:15px;font-size:12px}
.editor-toolbar[hidden]{display:none}
.context-menu{position:absolute;z-index:5;background:var(--paper);border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 40px #24373030;min-width:220px;max-width:90%;padding:6px}
.context-menu a,.context-menu button{display:block;text-align:left;width:100%;padding:9px 12px;font-size:13px;border:0;background:transparent}
.context-menu a:hover,.context-menu button:hover{background:#e7eddc;text-decoration:none}
dialog{border:1px solid var(--line);border-radius:18px;background:var(--bg);color:var(--ink);width:min(850px,94vw);max-height:88vh;padding:20px}
dialog::backdrop{background:#1c2f2770;backdrop-filter:blur(3px)}
dialog .article{margin:15px auto}
dialog h1{font-size:30px}
.close-dialog{position:sticky;top:0;float:right;border-radius:50%;width:38px;height:38px;z-index:2;font-size:22px}
.skip{position:absolute;top:-60px}
.skip:focus{top:10px;background:white;padding:10px;z-index:99}
.login{max-width:550px}
.editor-active{box-shadow:inset 0 0 0 3px #8fa962}
.filter-select{margin-bottom:6px;font-size:13px!important}
dt{font-weight:600}
dd{margin:0 0 15px;overflow-wrap:anywhere}
@media(max-width:760px){header{height:auto;padding:18px 5vw;flex-wrap:wrap;gap:15px}
header nav{order:3;width:100%;gap:20px;font-size:12px}
.account{margin-left:auto}
.intro{padding:35px 6vw;display:block}
.intro h1{font-size:44px}
.searchbox{margin-top:30px;width:100%}
.section-head{align-items:flex-start;flex-wrap:wrap}
.map{height:440px}
.map.large{height:58vh;min-height:400px}
.map-hint{display:none}
.map-controls{bottom:12px;left:12px}
.map-controls button{padding:7px 10px;font-size:11px}
.topic-head{display:block}
.topic-head h1{font-size:32px}
.topic-actions{max-width:none;margin:20px 0}
.topic-actions .metric{margin-right:auto}
.topic-actions .button{font-size:12px}
.statement-row{gap:12px;align-items:flex-start}
.statement-row time{min-width:76px;font-size:11px}
.statement-row p{font-size:13px}
.article{margin:35px auto}
.article h1{font-size:32px}
.lead{font-size:21px}
.avatar{width:65px;height:65px}
footer{flex-wrap:wrap}
footer span{order:3;width:100%}
.workspace h1{font-size:30px}
.form-shell h1{font-size:30px}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}
}


@view-transition{navigation:auto}


/* The home map occupies the viewport; topic labels stay inside an inscribed square. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
header:has(.header-search){gap:22px;padding-inline:3vw;flex-wrap:wrap;height:auto;min-height:92px;padding-block:16px}
.header-search{display:flex;flex:1 1 240px;max-width:360px;gap:4px;align-items:center;background:var(--paper);border:1px solid var(--line);padding:4px;border-radius:12px}
.header-search input[type=search]{min-width:0;border:0;background:transparent;padding:8px;font-size:14px}
.header-search button{background:var(--accent);border:0;padding:6px 13px;font-size:21px}
.home-map{margin:20px 3vw 30px}
.home-map .map{height:calc(100svh - 180px);min-height:480px}
.topic-visual{pointer-events:none;transition:transform .18s ease}
.map .node .topic-hit{fill:transparent!important;stroke:none!important;pointer-events:all}
.topic-label{height:100%;display:flex;flex-direction:column;justify-content:center;gap:6px;overflow:hidden;text-align:center;color:var(--ink);line-height:1.18;pointer-events:none}
.topic-label strong{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:6;overflow:hidden;overflow-wrap:normal;font-weight:600}
.topic-label small{font-size:.7em;line-height:1.2;color:#64745c}
.map[data-mode=topics] .node.dim{opacity:1}
@media(max-width:1000px){header:has(.header-search) nav{gap:16px}header:has(.header-search) .header-search{order:4;max-width:none;flex-basis:100%}.home-map .map{height:calc(100svh - 245px);min-height:520px}}
@media(max-width:760px){header:has(.header-search){gap:12px}.home-map{margin:12px 3vw 24px}.home-map .map{height:calc(100svh - 240px);min-height:560px}}

/* Shared soft-body maps: labels do not deform with the bubble membrane. */
.topic-visual{transition:none}
.topic-label{gap:5px}
.topic-label strong{flex-shrink:0;-webkit-line-clamp:5}
.statement-label strong{font-size:1.08em;-webkit-line-clamp:2}
.statement-label p{margin:0;font-size:.82em;font-weight:400;line-height:1.28;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:5;overflow:hidden}
.statement-label img{width:28px;height:28px;object-fit:cover;border-radius:50%;align-self:center;flex-shrink:0}
.map-hub circle{fill:#354f42;stroke:#233b30;stroke-width:2}
.hub-label{height:100%;display:flex;align-items:center;text-align:center;color:#fffefa;font-size:16px;line-height:1.3;overflow:hidden;overflow-wrap:anywhere}
.map .node.dim{opacity:.55}
.map .edge{stroke-width:2.5;vector-effect:non-scaling-stroke}
.map .edge.reaction{stroke:#355b49}
.map .edge.dim{opacity:.12}
.map .ring{opacity:.4;pointer-events:none}
.map-controls{flex-wrap:wrap;max-width:calc(100% - 24px)}
.map-hint{bottom:16px}
.header-topic{display:flex;align-items:center;gap:12px;flex:1;min-width:200px;max-width:560px}
.header-topic h1{font-size:20px;letter-spacing:-.4px;margin:0;line-height:1.2}
header:has(.header-topic){height:auto;min-height:92px;padding:16px 3vw;gap:22px;flex-wrap:wrap}
.compact-topic{margin:14px 3vw;align-items:center;font-size:13px}
.compact-topic .topic-actions{max-width:none;margin:0}
.compact-topic .button{font-size:12px;padding:7px 12px}
.topic-description{max-width:65%}.topic-description p{font-size:13px}
.map.large{margin:0 3vw;height:calc(100svh - 210px);min-height:580px}
.map-selection{margin:12px 3vw;font-size:14px;min-height:48px;padding:12px 16px;border:1px solid var(--line);border-radius:10px;background:var(--paper)}
@media(max-width:1000px){header:has(.header-topic) .header-topic{order:4;max-width:none;flex-basis:100%}.map.large{height:65svh}}
@media(max-width:760px){.compact-topic{display:flex;gap:10px;flex-wrap:wrap}.topic-description{max-width:100%}.map.large{min-height:500px}.header-topic h1{font-size:18px}.map-selection{font-size:13px}.map-controls button{font-size:10px;padding:7px}.map .node.dim{opacity:.7}}

.time-layers:not([hidden]){display:flex;align-items:center;flex-wrap:wrap;gap:.4rem}
.time-layers span{font-size:.85rem;color:#486052}
.time-layers button{padding:.35rem .7rem;border-radius:2rem;font-size:.84rem}
.time-layers button[aria-pressed=true]{background:#294a3a;color:white}
.map.large .ring{opacity:.9;stroke-width:1.2;vector-effect:non-scaling-stroke}
.compact-topic{flex-wrap:wrap}
