/*
 * Derin Kare 1.3 — dual-mode editorial design.
 * Loaded after legacy style.css. Every color is local; no CDN/fonts/network.
 * Theme set synchronously in <head> BEFORE stylesheets are parsed to prevent flashes.
 */
:root,
:root[data-theme="dark"] {
  --bg: #0b141d;
  --bg-soft: #101d27;
  --surface: #162530;
  --line: rgba(227,237,239,.11);
  --line-strong: rgba(227,237,239,.22);
  --ivory: #f1efe9;
  --sub: #bdc8cf;
  --muted: #92a4b2;
  --gold: #d7b47c;
  --gold-soft: #eecb92;
  --dk-page: #0b141d;
  --dk-surface: #13222c;
  --dk-card: #14222c;
  --dk-elevated: #1c2b36;
  --dk-hero: #0e1c26;
  --dk-hero-2: #172934;
  --dk-text: #f1efe9;
  --dk-text-strong: #fffdf9;
  --dk-text-soft: #c3ced4;
  --dk-subtle: #96a7b2;
  --dk-line: rgba(213,225,232,.15);
  --dk-line-strong: rgba(213,225,232,.23);
  --dk-accent: #e0b979;
  --dk-accent-ink: #1d2429;
  --dk-accent-wash: rgba(224,185,121,.12);
  --dk-input: #182833;
  --dk-toolbar: #182934;
  --dk-header: rgba(11,20,29,.87);
  --dk-shadow: 0 18px 55px rgba(0,0,0,.19);
  --dk-cover-shadow: 0 25px 75px rgba(0,0,0,.24);
  --dk-gold-line: rgba(224,185,121,.38);
  color-scheme: dark;
}
:root[data-theme="light"] {
  --bg: #f7f6f2;
  --bg-soft: #f0eee8;
  --surface: #ffffff;
  --line: rgba(40,56,62,.12);
  --line-strong: rgba(40,56,62,.22);
  --ivory: #1c2830;
  --sub: #53636e;
  --muted: #697b84;
  --gold: #9b6b30;
  --gold-soft: #956125;
  --dk-page: #f7f6f2;
  --dk-surface: #f1f0eb;
  --dk-card: #fffefb;
  --dk-elevated: #fff;
  --dk-hero: #f5f2e9;
  --dk-hero-2: #e8eef0;
  --dk-text: #1c2830;
  --dk-text-strong: #131e25;
  --dk-text-soft: #485a65;
  --dk-subtle: #647580;
  --dk-line: rgba(33,49,56,.14);
  --dk-line-strong: rgba(33,49,56,.24);
  --dk-accent: #946227;
  --dk-accent-ink: #fffdf8;
  --dk-accent-wash: rgba(148,98,39,.10);
  --dk-input: #fffefb;
  --dk-toolbar: #f4f1eb;
  --dk-header: rgba(247,246,242,.92);
  --dk-shadow: 0 12px 36px rgba(35,43,48,.075);
  --dk-cover-shadow: 0 20px 56px rgba(35,43,48,.12);
  --dk-gold-line: rgba(148,98,39,.3);
  color-scheme: light;
}

html {scroll-padding-top: 105px}
body {background:var(--dk-page);color:var(--dk-text); font-size:14px;}
.site-shell {overflow:clip}
.container {width:min(calc(100% - 64px),1200px)}
::selection {background:var(--dk-accent);color:var(--dk-accent-ink)}
a:focus-visible, button:focus-visible, select:focus-visible, textarea:focus-visible, input:focus-visible {outline:3px solid var(--dk-accent);outline-offset:3px}
.site-header {background:var(--dk-header);border-bottom:1px solid var(--dk-line);box-shadow:0 4px 22px rgba(0,0,0,.025);backdrop-filter:blur(22px)}
.header-inner {height:78px;gap:22px}
.brand {gap:12px}
.brand-icon {width:40px;height:40px}
.brand-text {font-size:19px;letter-spacing:.105em}
.brand-text small {color:var(--dk-subtle);letter-spacing:.22em}
.desktop-nav {gap:20px}
.desktop-nav a {color:var(--dk-text-soft);font-size:12px;letter-spacing:0;font-weight:650;padding-block:26px;position:relative}
.desktop-nav a::after {content:"";position:absolute;bottom:20px;left:0;right:100%;height:2px;background:var(--dk-accent);transition:right .24s}
.desktop-nav a:hover,.desktop-nav a[aria-current] {color:var(--dk-text-strong)}
.desktop-nav a:hover::after,.desktop-nav a[aria-current]::after {right:0}
.header-actions {gap:10px}
.header-search,.saved-shortcut,.theme-toggle,.menu-toggle {border:1px solid var(--dk-line-strong);background:var(--dk-card);color:var(--dk-text-soft);box-shadow:none}
.header-search {width:39px;height:39px;border-radius:12px}
.header-search:hover,.saved-shortcut:hover,.theme-toggle:hover {border-color:var(--dk-accent);color:var(--dk-accent);background:var(--dk-accent-wash)}
.saved-shortcut {height:39px;border-radius:11px;padding:8px 12px;font-weight:600}
.saved-shortcut span:first-child {color:var(--dk-accent)}
.theme-toggle {display:inline-flex;align-items:center;gap:8px;justify-content:center;min-height:39px;min-width:39px;border-radius:11px;padding:7px 11px;white-space:nowrap;transition:background .2s,border-color .2s;cursor:pointer;font-size:12px;font-weight:700}
.theme-toggle .theme-icon {width:17px;height:17px;flex:none}
:root[data-theme="dark"] .theme-toggle .theme-moon {display:none}
:root[data-theme="light"] .theme-toggle .theme-sun {display:none}
.theme-toggle span {line-height:1}
.menu-toggle {width:39px;height:39px;border-radius:11px}
.menu-toggle span {background:var(--dk-text)}
.mobile-nav {background:var(--dk-card);border-color:var(--dk-line)}
.mobile-nav a {color:var(--dk-text)}

/* Hero: calm editorial shapes work in both themes without image/network loads. */
.hero {background:radial-gradient(ellipse at 83% 32%,var(--dk-accent-wash),transparent 45%),linear-gradient(125deg,var(--dk-hero),var(--dk-hero-2));min-height:615px}
.hero-inner {min-height:615px;grid-template-columns:1.13fr .9fr;gap:30px}
.hero-glow {background:radial-gradient(circle,var(--dk-accent-wash),transparent 67%)}
.hero h1 {font-size:clamp(48px,5.8vw,82px);line-height:1.075;letter-spacing:-.045em;max-width:720px;color:var(--dk-text-strong)}
.hero h1 em {color:var(--dk-accent)}
.hero-copy>p {color:var(--dk-text-soft);font-size:15px;line-height:1.9;max-width:560px}
.eyebrow {color:var(--dk-accent);letter-spacing:.2em}
.eyebrow-dot {background:var(--dk-accent)}
.hero-note {color:var(--dk-subtle);margin-top:44px}
.note-line {background:var(--dk-accent)}
.hero-mini-links {gap:18px}
.hero-mini-links a {color:var(--dk-text-soft)}
.hero-mini-links a:hover {color:var(--dk-accent)}
.btn {min-height:48px;border-radius:11px;font-size:12px;padding:0 22px;gap:14px;transition:transform .2s,box-shadow .2s,background .2s}
.btn:hover {box-shadow:var(--dk-shadow)}
.btn-primary {background:var(--dk-accent);color:var(--dk-accent-ink)}
.btn-primary:hover {background:var(--dk-accent);filter:brightness(1.1)}
.btn-quiet {color:var(--dk-text-strong)}
.btn-quiet:hover {color:var(--dk-accent)}
.btn-outline {border-color:var(--dk-line-strong);color:var(--dk-text-strong)}
.btn-outline:hover {background:var(--dk-accent-wash)}
.hero-art {height:475px}
.art-orbit {border-color:var(--dk-gold-line);opacity:.5}
.art-monolith {border-radius:9px;border-color:var(--dk-gold-line);background:linear-gradient(160deg,var(--dk-card),var(--dk-hero-2));box-shadow:var(--dk-cover-shadow);transform:rotate(-5deg)}
.art-inner {border-color:var(--dk-gold-line)}
.art-sphere {box-shadow:0 0 60px rgba(210,156,80,.2),inset -22px -17px 35px #0d1b23}
.art-caption {color:var(--dk-subtle)}
.art-star {background:var(--dk-accent)}
.hero-bottom-line {background:linear-gradient(90deg,transparent,var(--dk-gold-line),transparent)}

/* Article discovery */
.section-spacer {padding-top:83px;padding-bottom:22px}
.section-heading {margin-bottom:28px}
.section-heading h2 {color:var(--dk-text-strong);letter-spacing:-.04em;font-size:clamp(30px,3.4vw,44px)}
.section-heading p,.featured-copy p {color:var(--dk-text-soft)}
.text-link {color:var(--dk-accent)}
.topic-grid {gap:12px}
.topic-pill {border-radius:14px;border:1px solid var(--dk-line);background:var(--dk-card);font-size:13px;padding:17px 17px;min-height:88px;box-shadow:var(--dk-shadow);color:var(--dk-text-strong)}
.topic-pill:hover {border-color:var(--dk-gold-line);background:var(--dk-elevated);transform:translateY(-4px)}
.topic-symbol {color:var(--dk-accent)}
.topic-arrow {color:var(--dk-subtle)}
.featured-story {border-radius:22px;overflow:hidden;background:var(--dk-card);border:1px solid var(--dk-line);box-shadow:var(--dk-shadow);min-height:380px}
.featured-image {min-height:350px;background:var(--dk-elevated)}
.feature-tag {border-radius:8px;background:var(--dk-accent);color:var(--dk-accent-ink)}
.featured-copy {padding:clamp(28px,4vw,50px)}
.featured-copy h3 {color:var(--dk-text-strong);letter-spacing:-.045em}
.feature-meta {color:var(--dk-subtle)}
.circle-arrow {color:var(--dk-accent)}
.article-grid {gap:22px}
.article-card {display:flex;overflow:hidden;background:var(--dk-card);border:1px solid var(--dk-line);border-radius:18px;padding:0 0 14px;box-shadow:var(--dk-shadow);transition:transform .25s,border-color .25s,box-shadow .25s}
.article-card:hover {transform:translateY(-5px);border-color:var(--dk-gold-line);box-shadow:var(--dk-cover-shadow)}
.article-card:hover h3 {color:var(--dk-accent)}
.article-image {overflow:hidden;background:var(--dk-elevated);border-radius:0}
.article-image img {width:100%;height:100%;object-fit:cover}
.card-content {padding:19px 20px 10px}
.card-content h3 {color:var(--dk-text-strong);font-size:clamp(23px,2.4vw,28px);letter-spacing:-.035em}
.card-content p {color:var(--dk-text-soft)}
.card-meta {display:flex;flex-wrap:wrap;gap:8px;align-items:center;color:var(--dk-subtle)}
.article-category {background:var(--dk-accent);color:var(--dk-accent-ink);border-radius:7px}
.save-action {margin:4px 20px 0;padding:9px 12px;border-radius:9px;border:1px solid var(--dk-line-strong);color:var(--dk-text-soft);font-weight:650;transition:background .2s,border .2s}
.save-action>span:first-child {color:var(--dk-accent)}
.save-action:hover,.save-action[aria-pressed="true"] {background:var(--dk-accent-wash);border-color:var(--dk-accent);color:var(--dk-accent)}
.save-action[aria-pressed="true"]>span:first-child {color:var(--dk-accent)}
.route-row {border:1px solid var(--dk-line);border-radius:15px;background:var(--dk-card);box-shadow:var(--dk-shadow)}
.route-row:hover {border-color:var(--dk-gold-line)}
.route-index,.route-arrow {color:var(--dk-accent)}
.route-copy small {color:var(--dk-subtle)}
.manifesto {border:1px solid var(--dk-line);border-radius:23px;background:radial-gradient(circle at 25% 30%,var(--dk-accent-wash),transparent 58%),var(--dk-card);box-shadow:var(--dk-shadow)}
.manifesto h2 {color:var(--dk-text-strong)}
.manifesto h2 em {color:var(--dk-accent)}
.manifesto p {color:var(--dk-text-soft)}

/* Archive, filters, reading lists */
.page-banner {background:radial-gradient(ellipse at 83% 50%,var(--dk-accent-wash),transparent 44%),linear-gradient(145deg,var(--dk-hero),var(--dk-hero-2));border-bottom:1px solid var(--dk-line)}
.page-banner h1 {color:var(--dk-text-strong)}
.page-banner p {color:var(--dk-text-soft)}
.filter-panel {border-color:var(--dk-line)}
.filter-panel h2 {color:var(--dk-accent)}
.filter-panel a {border-color:var(--dk-line);color:var(--dk-text-soft);border-radius:8px}
.filter-panel a:hover,.filter-panel a.selected {color:var(--dk-accent);background:var(--dk-accent-wash)}
.filter-saved {color:var(--dk-accent)!important}
.search-box {background:var(--dk-card);border-color:var(--dk-line-strong);border-radius:13px;overflow:hidden}
.search-box:focus-within {border-color:var(--dk-accent)}
.search-box input {color:var(--dk-text)}
.search-box input::placeholder {color:var(--dk-subtle)}
.search-box button {color:var(--dk-accent)}
.archive-toolbar {border-color:var(--dk-line)}
.archive-total,.archive-sort,.search-categories {color:var(--dk-subtle)}
.archive-sort select,.search-categories select {border:1px solid var(--dk-line-strong);border-radius:9px;background:var(--dk-input);color:var(--dk-text)}
.btn-filter {border-radius:9px;background:var(--dk-accent);border-color:var(--dk-accent);color:var(--dk-accent-ink)}
.pagination {color:var(--dk-text-soft)}
.pagination a {color:var(--dk-accent);border-color:var(--dk-line-strong);border-radius:9px}
.pagination a:hover {background:var(--dk-accent-wash);border-color:var(--dk-accent)}
.empty-state {background:var(--dk-card);border-radius:16px;border-color:var(--dk-line)}
.empty-state p {color:var(--dk-text-soft)}
.saved-intro,.saved-row {border-color:var(--dk-line);color:var(--dk-text-soft)}
.saved-index {color:var(--dk-accent)}
.saved-row .saved-meta,.saved-privacy {color:var(--dk-subtle)}
.saved-row a:hover {color:var(--dk-accent)}
.saved-remove {color:var(--dk-text-soft);border-color:var(--dk-line-strong);border-radius:9px}
.saved-remove:hover {color:var(--dk-accent);border-color:var(--dk-accent)}

/* Long-form reading: a paper-like area in light theme, calm slate in dark. */
.detail-page {padding-top:62px}
.breadcrumbs {color:var(--dk-subtle)}
.breadcrumbs a:hover {color:var(--dk-accent)}
.article-head h1 {color:var(--dk-text-strong)}
.article-lead {color:var(--dk-text-soft)}
.detail-meta {color:var(--dk-subtle)}
.detail-cover img {border-radius:18px;box-shadow:var(--dk-cover-shadow)}
.detail-save-line .save-action {margin:0}
.save-hint {color:var(--dk-subtle)}
.preview-warning,.demo-flag {background:var(--dk-accent-wash);border:1px solid var(--dk-gold-line);border-radius:11px;color:var(--dk-text-soft)}
.preview-warning a {color:var(--dk-accent)}
.read-aside {border-color:var(--dk-line)}
.toc-header {color:var(--dk-accent);border-color:var(--dk-line-strong)}
.toc-links {border-color:var(--dk-line)}
.toc-link {color:var(--dk-subtle)}
.toc-link:hover,.toc-link.active {color:var(--dk-accent);background:var(--dk-accent-wash);border-left-color:var(--dk-accent)}
.toc-empty {color:var(--dk-subtle)}
.back-archive {color:var(--dk-accent)}
.reader-tools {border:1px solid var(--dk-line);border-radius:13px;background:var(--dk-toolbar);box-shadow:var(--dk-shadow);padding:11px 13px}
.reading-label {color:var(--dk-text-soft)}
.reading-spark {color:var(--dk-accent)}
.reading-meta {color:var(--dk-subtle)}
.reader-tool-actions button {border-radius:8px;color:var(--dk-text-soft)}
.reader-tool-actions button:hover,.reader-tool-actions button[aria-pressed="true"] {border-color:var(--dk-accent);background:var(--dk-accent-wash);color:var(--dk-accent)}
.article-text,.article-markdown {color:var(--dk-text);line-height:1.9}
.article-markdown :is(h2,h3,h4) {color:var(--dk-text-strong);border-color:var(--dk-line)}
.article-markdown h3 {color:var(--dk-accent)}
.article-markdown strong {color:var(--dk-text-strong)}
.article-markdown em,.article-markdown p:first-child::first-letter {color:var(--dk-accent)}
.article-markdown blockquote {color:var(--dk-text-strong);background:var(--dk-accent-wash);border-left-color:var(--dk-accent);border-radius:0 10px 10px 0}
.article-markdown li::marker {color:var(--dk-accent)}
.article-markdown a {color:var(--dk-accent);text-decoration-color:var(--dk-accent)}
.article-markdown a:hover {color:var(--dk-text-strong)}
.article-markdown img {border-radius:12px;border-color:var(--dk-line)}
.article-markdown code {background:var(--dk-toolbar);color:var(--dk-accent);border-radius:4px}
.article-markdown pre {background:var(--dk-toolbar);border-color:var(--dk-line);border-radius:11px}
.article-markdown pre code {background:transparent}
.article-markdown th,.article-markdown td {border-color:var(--dk-line)}
.article-markdown th {color:var(--dk-accent)}
.article-markdown hr {border-color:var(--dk-line)}
.sources-box {background:var(--dk-card);border:1px solid var(--dk-line);border-left:3px solid var(--dk-accent);border-radius:0 13px 13px 0}
.sources-box h2 {color:var(--dk-accent)}
.sources-box .sources-text {color:var(--dk-text-soft)}
.article-share {border-color:var(--dk-line);color:var(--dk-text-soft)}
.article-share button {color:var(--dk-accent)}
.article-end-note {color:var(--dk-subtle)}
.article-end-note span {color:var(--dk-accent)}
.mobile-toc {background:var(--dk-card);border-radius:12px;border-color:var(--dk-line)}
.mobile-toc summary {color:var(--dk-text-strong)}
.mobile-toc a {color:var(--dk-text-soft)}
.end-mark {color:var(--dk-accent)}
.read-progress span {background:var(--dk-accent);box-shadow:0 0 9px var(--dk-accent-wash)}

/* About and footer */
.about-layout h2 {color:var(--dk-text-strong)}
.about-copy p {color:var(--dk-text-soft)}
.about-principles div {border-color:var(--dk-line)}
.about-principles strong {color:var(--dk-accent)}
.site-footer {background:var(--dk-surface);border-top:1px solid var(--dk-line)}
.footer-links strong,.footer-dot {color:var(--dk-accent)!important}
.footer-top p,.footer-bottom {color:var(--dk-subtle);border-color:var(--dk-line)}
.footer-links a {color:var(--dk-text-soft)}
.footer-links a:hover {color:var(--dk-accent)}
.footer-brand>span:not(.footer-dot),.brand-text>span {color:var(--dk-accent)}

/* UX polish: responsive and motion preferences. */
@media (max-width:1120px) {
  .desktop-nav {gap:13px}
  .header-inner {gap:14px}
  .brand-text {font-size:17px}
}
@media (max-width:980px) {
  .desktop-nav {display:none}
  .menu-toggle {display:block}
  .theme-toggle span {display:none}
  .hero-inner {grid-template-columns:1fr;min-height:0;padding-top:74px;padding-bottom:22px}
  .hero {min-height:0}
  .hero-art {height:325px;transform:scale(.78);max-width:500px;margin-inline:auto}
  .topic-grid {grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:720px) {
  .container {width:min(calc(100% - 34px),1200px)}
  .header-inner {height:70px}
  .saved-shortcut span:last-child {display:none}
  .hero-inner {padding-top:55px}
  .hero h1 {font-size:clamp(44px,10vw,66px)}
  .hero-copy>p {font-size:14px;line-height:1.8}
  .hero-note {margin-top:35px}
  .hero-art {height:265px;transform:scale(.65);margin-top:-20px;margin-bottom:-15px}
  .section-spacer {padding-top:58px;padding-bottom:12px}
  .topic-grid {grid-template-columns:repeat(2,minmax(0,1fr))}
  .topic-pill {min-height:76px;padding:13px}
  .featured-story {grid-template-columns:1fr}
  .featured-copy {padding:30px}
  .featured-image {min-height:240px;height:255px}
  .article-grid,.archive-grid {grid-template-columns:1fr;gap:18px}
  .section-heading h2 {font-size:32px}
  .detail-page {padding-top:30px}
  .article-head h1 {font-size:clamp(37px,9vw,55px)}
  .detail-cover img {border-radius:11px}
  .reader-tools {flex-wrap:wrap}
  .filter-panel {position:static;display:flex;flex-wrap:wrap;gap:9px;border:0}
  .archive-layout {grid-template-columns:1fr}
  .filter-panel h2 {flex-basis:100%}
  .filter-panel a {border:1px solid var(--dk-line);padding:8px 12px}
  .manifesto {grid-template-columns:1fr;gap:12px;padding:32px 25px}
  .footer-top {gap:24px}
}
@media (max-width:390px) {
  .brand-text small {font-size:6px}
  .brand-icon {height:34px;width:34px}
  .header-actions {gap:6px}
  .saved-shortcut,.theme-toggle,.header-search,.menu-toggle {width:34px;min-width:34px;height:34px;padding:6px}
  .section-heading h2 {font-size:29px}
  .topic-pill {font-size:12px}
  .reading-label {flex-basis:100%}
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after {animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}
}
