/*
 * Research Workbench — Ghost theme
 * Balanced Emacs influence: editorial first, editor/workbench details second.
 */

:root {
    --bg: #f6f4ee;
    --bg-raised: #fbfaf6;
    --panel: #fffef9;
    --panel-soft: #efeee8;
    --ink: #152027;
    --muted: #66737a;
    --line: #d1d6d3;
    --line-strong: #9da9a6;
    --accent: #1769e0;
    --teal: #137d72;
    --org: #1a705f;
    --mode-bg: #e7eae5;
    --code-bg: #edf0ef;
    --shadow: 0 16px 48px rgba(25, 37, 43, .08);
    --radius: 8px;
    --page: 1240px;
    --content: 760px;
    --mono: "IBM Plex Mono", "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
    --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --serif: "Source Serif 4", SourceSerif4, Georgia, Cambria, "Times New Roman", serif;
}

html[data-theme="dark"] {
    --bg: #10171b;
    --bg-raised: #141d22;
    --panel: #172127;
    --panel-soft: #1b282e;
    --ink: #edf3ef;
    --muted: #9dacb1;
    --line: #314249;
    --line-strong: #586c73;
    --teal: #55c8b4;
    --org: #7fdc91;
    --mode-bg: #0c252c;
    --code-bg: #16252b;
    --shadow: 0 18px 54px rgba(0, 0, 0, .28);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--bg); }
body {
    margin: 0;
    min-height: 100vh;
    padding-bottom: 34px;
    background: var(--bg);
    color: var(--ink);
    font: 16px/1.55 var(--sans);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}
img, svg, video { max-width: 100%; height: auto; }
a { color: inherit; text-decoration-thickness: .07em; text-underline-offset: .16em; }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
::selection { background: color-mix(in srgb, var(--accent) 22%, transparent); }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
[hidden] { display: none !important; }

.sr-visually-hidden {
    position: absolute !important;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0, 0, 0, 0);
    white-space: nowrap; border: 0;
}
.sr-skip {
    position: fixed; left: 18px; top: -80px; z-index: 9999;
    padding: 10px 14px; border: 1px solid var(--line);
    background: var(--panel); color: var(--ink); border-radius: 5px;
    font: 700 12px/1 var(--mono); text-decoration: none;
}
.sr-skip:focus { top: 18px; }

/* Header */
.sr-header {
    position: sticky; top: 0; z-index: 100;
    height: 72px;
    border-bottom: 1px solid var(--line);
    background: color-mix(in srgb, var(--bg-raised) 92%, transparent);
    backdrop-filter: blur(14px);
}
.sr-header-inner {
    width: min(var(--page), calc(100% - 48px));
    height: 100%; margin: 0 auto;
    display: flex; align-items: center; gap: 26px;
}
.sr-wordmark {
    display: inline-flex; flex-direction: column; justify-content: center;
    margin-right: auto; color: var(--ink); text-decoration: none;
    font: 800 13px/.98 var(--mono); letter-spacing: -.035em;
}
.sr-wordmark img { display: block; max-height: 42px; max-width: 190px; }
.sr-nav { display: flex; align-items: center; }
.sr-nav-list { list-style: none; display: flex; align-items: center; gap: 24px; margin: 0; padding: 0; }
.sr-nav-item a {
    position: relative; display: block; padding: 8px 0;
    color: var(--muted); font: 500 12px/1 var(--mono); text-decoration: none;
}
.sr-nav-item a::after {
    content: ""; position: absolute; left: 0; right: 100%; bottom: 1px;
    height: 2px; background: var(--accent); transition: right .16s ease;
}
.sr-nav-item a:hover, .sr-nav-item a:focus-visible, .sr-nav-item.is-current a { color: var(--ink); }
.sr-nav-item a:hover::after, .sr-nav-item.is-current a::after { right: 0; }
.sr-header-actions { display: flex; align-items: center; gap: 8px; }
.sr-icon-button, .sr-subscribe, .sr-button {
    min-height: 36px; border: 1px solid var(--line); border-radius: 5px;
    background: var(--panel); color: var(--ink); cursor: pointer;
    font: 700 11px/1 var(--mono); text-decoration: none;
}
.sr-icon-button { width: 36px; display: inline-grid; place-items: center; font-size: 16px; }
.sr-icon-button:hover { border-color: var(--line-strong); background: var(--panel-soft); }
.sr-subscribe { display: inline-flex; align-items: center; padding: 0 14px; background: var(--accent); border-color: var(--accent); color: #fff; }
.sr-mobile-menu-button { display: none; }
.sr-mobile-menu {
    position: absolute; left: 0; right: 0; top: 71px;
    padding: 22px 24px 24px; border-bottom: 1px solid var(--line);
    background: var(--bg-raised); box-shadow: var(--shadow);
}
.sr-mobile-menu .sr-nav-list { display: grid; gap: 0; }
.sr-mobile-menu .sr-nav-item a { padding: 15px 0; border-bottom: 1px solid var(--line); font-size: 15px; }
.sr-mobile-shortcuts { margin-top: 20px; display: flex; flex-wrap: wrap; gap: 8px 18px; color: var(--muted); font: 11px/1.5 var(--mono); }

/* Layout */
.sr-site { min-height: calc(100vh - 72px); }
.sr-main { width: min(var(--page), calc(100% - 48px)); margin: 0 auto; }
.sr-home, .sr-page, .sr-archive, .sr-post-page, .sr-project-page { border-left: 1px solid var(--line); border-right: 1px solid var(--line); }
.sr-section { padding: 64px 44px; border-bottom: 1px solid var(--line); background: var(--bg-raised); }
.sr-section-head { display: flex; justify-content: space-between; align-items: end; gap: 28px; margin-bottom: 28px; }
.sr-section-head h2 {
    margin: 0; font: 750 25px/1.15 var(--mono); letter-spacing: -.04em;
}
.sr-section-head h2::before { content: "* "; color: var(--org); }
.sr-section-head p { max-width: 650px; margin: 8px 0 0; color: var(--muted); font: 18px/1.45 var(--serif); }
.sr-section-head > a { color: var(--accent); font: 700 11px/1.3 var(--mono); text-decoration: none; white-space: nowrap; }
.sr-label, .sr-kicker { font: 750 11px/1.2 var(--mono); letter-spacing: .025em; color: var(--accent); text-transform: uppercase; }
.sr-kicker::before { content: ";; "; color: var(--org); }
