/* Geometry shared by all three themes; preserve Fieldnotes' palette. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.top-actions{display:flex;align-items:center;gap:10px;min-width:0}
.panel-controls{display:flex;align-items:center;gap:4px}
.panel-toggle{display:inline-flex;align-items:center;justify-content:center;flex:none;width:40px;min-height:44px;padding:0;border:1px solid var(--line);border-radius:6px;background:transparent;color:var(--muted);font-size:20px;cursor:pointer}
.panel-toggle:hover{background:var(--panel);color:var(--text)}
.panel-toggle[hidden]{display:none}.panel-toggle:disabled{opacity:.5;cursor:not-allowed}
.theme-picker{position:relative;display:flex;align-items:center;min-width:0;color:var(--muted)}
.theme-picker::after{content:'';position:absolute;right:14px;top:50%;width:5px;height:5px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-65%) rotate(45deg);pointer-events:none;transition:color .15s ease}
.theme-picker:hover::after,
.theme-picker:focus-within::after{color:var(--text)}
#theme-select{appearance:none;-webkit-appearance:none;-moz-appearance:none;font:inherit;font-size:13px;color:var(--text);background:var(--panel);border:1px solid var(--line);border-radius:6px;min-height:44px;height:44px;width:138px;padding:0 30px 0 12px;cursor:pointer}
.search-trigger{display:flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:0 14px;font-size:13px;flex:none}
.search-trigger svg{flex:none}.search-trigger .search-label{font-size:13px;line-height:1}.search-trigger kbd{margin-left:8px}
/* Keep all search content inside the modal: focus must never scroll it sideways. */
.search-dialog{--search-gutter:24px;width:min(760px,calc(100% - 32px));max-width:none;max-height:min(780px,calc(100dvh - 48px));margin:auto;padding:0;overflow:hidden;overscroll-behavior:contain}
.search-dialog[open]{display:flex;flex-direction:column}
.search-heading{flex:none;min-width:0;gap:16px;padding:20px var(--search-gutter) 16px}
.search-heading label{font-size:18px;letter-spacing:-.02em;line-height:1.4}
#search-close{flex:none;min-width:44px;min-height:44px;border-radius:6px}
#global-search{flex:none;width:calc(100% - 2 * var(--search-gutter));min-width:0;min-height:52px;margin:0 var(--search-gutter) 18px;padding:14px 16px;font-size:16px;line-height:1.5;outline-offset:2px}
#search-results{flex:1 1 auto;min-height:80px;max-height:min(56dvh,520px);overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable}
.result-count{padding:12px var(--search-gutter);line-height:1.5}
.search-result{padding:18px var(--search-gutter);overflow-wrap:anywhere}
.search-result strong{display:block;line-height:1.5}
.search-result .result-section{margin-top:6px;line-height:1.5}
.search-result p{margin-top:10px;line-height:1.75}
.search-foot{flex:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px var(--search-gutter);font-size:12px;line-height:1.5;border-top:1px solid var(--line)}
.search-foot kbd{margin-left:auto}
#search-more{margin:16px var(--search-gutter)}
html:has(#search-dialog[open]){overflow:hidden;scrollbar-gutter:stable}
@media(max-width:480px){.search-dialog{--search-gutter:18px;width:calc(100% - 24px);max-height:calc(100dvh - 24px)}.search-dialog .search-heading{padding:14px var(--search-gutter) 12px}.search-dialog .search-foot{padding:12px var(--search-gutter)}.search-dialog .search-result{padding:16px var(--search-gutter)}}
.resize-handle{position:sticky;top:var(--top);height:calc(100dvh - var(--top));width:10px;align-self:start;cursor:col-resize;touch-action:none;z-index:5;background:transparent;outline-offset:-2px}
.resize-handle::after{content:'';position:absolute;inset:0 4px;background:var(--line);transition:background .15s}
.resize-handle:hover::after,.resize-handle:focus-visible::after,.is-resizing .resize-handle::after{background:var(--accent)}
.is-resizing,.is-resizing *{cursor:col-resize!important;user-select:none!important}
.reading{container-type:normal}
.article,.article .code-block,.article pre,.article table{min-width:0;max-width:100%}
.article .code-block pre code{font-size:clamp(13px,calc(10px + .25vw),15px);line-height:1.8}
.article .code-block pre{max-height:none;overflow:auto;tab-size:2}
@media(min-width:1101px){
 .layout{grid-template-columns:var(--left-panel-width,var(--sidebar)) 10px minmax(0,1fr)}
 .layout>main{grid-column:3}
 .sidebar{width:auto;min-width:0}
 :root[data-left-visible="false"] .layout{grid-template-columns:0 0 minmax(0,1fr)}
 :root[data-left-visible="false"] .sidebar,:root[data-left-visible="false"] #left-resizer{display:none}
 :root[data-right-visible="true"] .reading{padding-inline-end:calc(var(--page-gutter) + var(--contents-panel-width) + 34px)}
 :root[data-right-visible="true"] .reader-layout{grid-template-columns:minmax(0,1fr)}
 :root[data-right-visible="true"] .toc{display:block;position:fixed;top:calc(var(--top) + 24px);right:var(--page-gutter);width:var(--contents-panel-width);min-width:0;max-height:calc(100dvh - var(--top) - 48px);overflow:auto;overscroll-behavior:contain;padding-inline:12px 2px;word-break:normal;overflow-wrap:anywhere;scrollbar-gutter:stable}
 :root[data-right-visible="true"] .toc-mobile{display:none}
 :root[data-right-visible="true"] .right-resizer{display:block;position:fixed;right:calc(var(--page-gutter) + var(--contents-panel-width) + 12px);top:calc(var(--top) + 24px);height:calc(100dvh - var(--top) - 48px)}
 :root[data-right-visible="false"] .reader-layout{grid-template-columns:minmax(0,1fr)}
 :root[data-right-visible="false"] .toc,:root[data-right-visible="false"] .right-resizer{display:none}
 :root[data-right-visible="false"] .toc-mobile{display:block}
}
@media(max-width:1100px){.layout{display:block}.panel-controls,.resize-handle,.right-resizer{display:none}.top-actions{gap:8px}.reader-layout{grid-template-columns:minmax(0,1fr)}}
@media(max-width:760px){.search-trigger{width:44px;padding:0;font-size:13px}.search-trigger .search-label,.search-trigger kbd{display:none}.topbar{gap:12px}#theme-select{width:118px;font-size:12px}}
@media(max-width:480px){.brand>span:last-child{display:none}.topbar{padding-inline:14px;gap:8px}.top-actions{gap:6px}#theme-select{width:116px}.search-heading label{font-size:16px}}
@media(prefers-reduced-motion:reduce){.resize-handle::after{transition:none}}
