/* ── Lingonberry Wiki ──────────────────────────────────
   Classifieds-plain: one column, text links, hairlines.
   The logo colours only appear as small colour-coding dots. */
@font-face {
    font-family: 'GT Maru';
    src: url('/GT Maru/GT Maru/GT-Maru-Medium.woff2') format('woff2');
    font-weight: 500; font-display: swap;
}
@font-face {
    font-family: 'GT Maru Mono';
    src: url('/GT Maru/GT Maru Mono/GT-Maru-Mono-Regular.woff2') format('woff2');
    font-weight: 400; font-display: swap;
}

:root {
    --bg:     #fbfbf9;
    --ink:    #151515;
    --ink-2:  #5c5c58;
    --ink-3:  #9a9a94;
    --line:   #deded9;
    --tint:   #f1f1ed;
    --link:   #1f47c4;
    --seen:   #6a3aa8;
    --gold:   #F1A839;
    --blue:   #27BEFF;
    --red:    #ED2C2F;
    --grey:   #b4b4ae;
    --sans:  'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    --round: 'GT Maru', 'Inter', sans-serif;
    --mono:  'GT Maru Mono', ui-monospace, 'SF Mono', Menlo, monospace;
    color-scheme: light;
}
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        --bg: #141413; --ink: #ecece8; --ink-2: #a6a6a0; --ink-3: #6c6c67;
        --line: #2e2e2b; --tint: #1d1d1b; --link: #8fb0ff; --seen: #c3a6f5;
        color-scheme: dark;
    }
}
:root[data-theme="dark"] {
    --bg: #141413; --ink: #ecece8; --ink-2: #a6a6a0; --ink-3: #6c6c67;
    --line: #2e2e2b; --tint: #1d1d1b; --link: #8fb0ff; --seen: #c3a6f5;
    color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
    background: var(--bg); color: var(--ink);
    font-family: var(--sans); font-size: 16px; line-height: 1.55;
    -webkit-font-smoothing: antialiased;
    max-width: 760px; margin: 0 auto; padding: 0 16px;
}
a { color: var(--link); text-underline-offset: 2px; text-decoration-thickness: 1px; }
a:visited { color: var(--seen); }
a:hover { text-decoration-thickness: 2px; }
h1, h2, h3 { font-family: var(--round); font-weight: 500; line-height: 1.25; }

.mono { font-family: var(--mono); font-size: 13px; }
.quiet { color: var(--ink-2); }
.count { margin-left: 8px; color: var(--ink-3); }
.dot {
    display: inline-block; width: 7px; height: 7px; border-radius: 50%;
    margin-right: 7px; vertical-align: 1px;
}
.dot--gold { background: var(--gold); }
.dot--blue { background: var(--blue); }
.dot--red  { background: var(--red); }
.dot--grey { background: var(--grey); }

/* Japanese twins: same line, smaller, quieter. */
.jp {
    margin-left: 0.5em;
    font-family: 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Noto Sans JP', 'Yu Gothic', sans-serif;
    font-size: 0.85em; font-weight: 400; letter-spacing: 0.02em; text-transform: none;
    color: var(--ink-3); white-space: nowrap;
}

/* Small mono labels: section names, folders, tags. */
.label {
    margin: 0 0 6px; font-family: var(--mono); font-size: 13px; font-weight: 400;
    text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink-2);
}
.label a { color: inherit; text-decoration: none; }
.tag {
    margin-left: 8px; padding: 0 6px; border: 1px solid var(--line); border-radius: 4px;
    font-family: var(--mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.04em;
    color: var(--ink-2); white-space: nowrap;
}
button.link {
    background: none; border: 0; padding: 0; cursor: pointer;
    font: inherit; color: var(--link); text-decoration: underline; text-underline-offset: 2px;
}

/* ── Top and bottom ──────────────────────────────────── */
.top {
    display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px;
    padding: 18px 0 12px; border-bottom: 1px solid var(--line);
}
.brand {
    display: flex; align-items: center; gap: 8px;
    font-family: var(--round); font-weight: 500; font-size: 19px;
    color: var(--ink) !important; text-decoration: none;
}
.brand img { width: 26px; height: 26px; }
.nav { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 15px; }
.nav a, .nav a:visited { color: var(--link); }
.nav a[aria-current] { color: var(--ink); text-decoration: none; font-weight: 500; }
.find { margin-left: auto; }
.find input {
    width: 150px; padding: 4px 10px; border: 1px solid var(--line); border-radius: 6px;
    background: var(--bg); color: var(--ink); font: inherit; font-size: 15px;
}
.find input:focus { outline: 2px solid var(--link); outline-offset: -1px; }

.main { padding: 24px 0 40px; min-height: 60vh; }

.foot {
    display: flex; flex-wrap: wrap; gap: 6px 18px; align-items: baseline;
    padding: 16px 0 32px; border-top: 1px solid var(--line);
    font-size: 13px; color: var(--ink-3);
}
.foot a, .foot a:visited { color: var(--ink-2); }
.theme {
    margin-left: auto; background: none; border: 0; padding: 0; cursor: pointer;
    font-family: var(--mono); font-size: 12px; color: var(--ink-2); text-decoration: underline;
}
:root[data-theme="light"] .theme [data-mode="dark"],
:root[data-theme="dark"] .theme [data-mode="light"] { display: none; }

/* ── Sections ────────────────────────────────────────── */
.block { margin-top: 32px; }
.block > p { margin: 0 0 10px; }
.intro h1 { margin: 0 0 4px; font-size: 24px; }
.intro p { margin: 0; color: var(--ink-2); }

/* Timeline: year · date · event, one row each. */
.timeline { list-style: none; margin: 12px 0 0; padding: 0; }
.ev {
    display: grid; grid-template-columns: 56px 92px 1fr; gap: 0 12px;
    padding: 7px 0;
}
.ev--year { border-top: 1px solid var(--line); }
.ev-year { font-size: 14px; color: var(--ink); }
.ev-when { color: var(--ink-2); }
.ev-what a { font-weight: 500; }
.ev-sum { display: block; color: var(--ink-2); font-size: 15px; }
.ev-note { display: block; color: var(--ink-3); font-size: 14px; font-style: italic; }

/* Pages: folders in columns, like a classifieds index. */
.folders { columns: 2 260px; column-gap: 40px; margin-top: 12px; }
.folder { break-inside: avoid; margin-bottom: 24px; }
.folder h2 { margin: 0 0 4px; font-size: 16px; }
.folder ul { list-style: none; margin: 0; padding: 0; }
.folder li { padding: 1px 0; }
.wanted { line-height: 1.9; }

/* Changelog and search results */
.day h2 { margin: 24px 0 4px; font-weight: 400; color: var(--ink); border-bottom: 1px solid var(--line); padding-bottom: 4px; }
.changes, .changes ul, .results { list-style: none; margin: 0; padding: 0; }
.changes > li { display: grid; grid-template-columns: 64px 1fr; padding: 4px 0; }
.changes time { color: var(--ink-2); padding-top: 2px; }
.gone { color: var(--ink-3); text-decoration: line-through; }
.results li { padding: 8px 0; border-bottom: 1px solid var(--line); }

/* Donations */
.wallets { list-style: none; margin: 0; padding: 0; }
.wallets li { display: flex; gap: 12px; align-items: baseline; padding: 4px 0; flex-wrap: wrap; }
.wallets .mono { width: 32px; color: var(--ink-2); }
.wallets code { font-family: var(--mono); font-size: 12px; word-break: break-all; }

/* ── A page ──────────────────────────────────────────── */
.title { margin: 0; font-size: 30px; display: flex; align-items: center; gap: 10px; }
.title-icon { width: 24px; height: 24px; flex: none; stroke-width: 1.75; color: var(--ink-2); }
.summary { margin: 6px 0 0; font-size: 18px; color: var(--ink-2); }
.fuzz { margin: 12px 0 0; font-size: 12px; color: var(--ink-3); }
.note {
    margin: 18px 0 0; padding: 10px 14px; background: var(--tint); border-radius: 6px;
    font-size: 15px;
}
.note .mono { text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink-2); margin-right: 6px; }
.figure { margin: 20px 0 0; }
.figure img { display: block; max-width: 100%; height: auto; border-radius: 6px; }
.tweet { margin: 20px 0 0; }
.stamp { margin-top: 32px; }
.stamp a, .stamp a:visited { color: var(--ink-2); }

.prose { margin-top: 18px; }
.prose > :first-child { margin-top: 0; }
.prose p, .prose ul, .prose ol { margin: 0 0 12px; }
.prose ul, .prose ol { padding-left: 22px; }
.prose li { margin: 3px 0; }
.prose h2 { font-size: 20px; margin: 28px 0 8px; }
.prose h3 { font-size: 17px; margin: 20px 0 6px; }
.prose strong { font-weight: 600; }
.prose img { max-width: 100%; height: auto; }
.prose blockquote { margin: 12px 0; padding: 0 14px; border-left: 2px solid var(--line); color: var(--ink-2); }
.prose code { font-family: var(--mono); font-size: 0.88em; background: var(--tint); padding: 1px 4px; border-radius: 3px; }
.prose table { border-collapse: collapse; width: 100%; font-size: 15px; margin: 4px 0 16px; }
.prose thead { display: none; }
.prose td { padding: 7px 0; border-bottom: 1px solid var(--line); vertical-align: top; }
.prose td:first-child {
    width: 32%; padding-right: 14px; padding-top: 9px;
    font-family: var(--mono); font-size: 12px; text-transform: uppercase; letter-spacing: 0.05em; color: var(--ink-2);
}
.prose td:first-child strong { font-weight: 400; }

.wikilink.missing, .wikilink.missing:visited { color: var(--ink-3); text-decoration-style: dashed; }

/* Log */
.log { list-style: none; margin: 8px 0 0; padding: 0; }
.log li { padding: 10px 0; border-top: 1px solid var(--line); }
.log li > p { margin: 0 0 4px; }
.log .prose { margin-top: 0; }
details summary { cursor: pointer; color: var(--ink-2); font-size: 15px; padding: 6px 0; }

/* ── Glitched names (name-style: glitch) ─────────────── */
.glitch { display: inline-block; line-height: 1; padding: 0.15em 0; }

/* ── Phones ──────────────────────────────────────────── */
@media (max-width: 600px) {
    .find { margin-left: 0; width: 100%; }
    .find input { width: 100%; }
    .ev { grid-template-columns: 52px 1fr; }
    .ev-when { grid-column: 2; }
    .ev-what { grid-column: 2; }
    .title { font-size: 26px; }
}
