@font-face { font-family: "Cinzel Local"; src: url("fonts/cinzel-400.ttf") format("truetype"); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: "Cinzel Local"; src: url("fonts/cinzel-600.ttf") format("truetype"); font-style: normal; font-weight: 600; font-display: swap; }
@font-face { font-family: "Cinzel Local"; src: url("fonts/cinzel-700.ttf") format("truetype"); font-style: normal; font-weight: 700; font-display: swap; }

:root {
  --topbar-h: 70px;
  --sidebar-w: 318px;
  --sidebar-collapsed: 86px;
  --paper: #fbfaf7;
  --paper-strong: #ffffff;
  --ink: #26302d;
  --muted: #6d7772;
  --line: rgba(53, 69, 63, 0.14);
  --accent: #7463a5;
  --accent-deep: #514276;
  --accent-soft: #eee9f8;
  --gold: #b79243;
  --gold-soft: #f7edcb;
  --leaf: #607d70;
  --berry: #5974a7;
  --topbar: rgba(255, 255, 255, 0.92);
  --sidebar: #f5f2eb;
  --shadow: 0 18px 54px rgba(44, 53, 50, 0.12);
  --soft-shadow: 0 8px 26px rgba(44, 53, 50, 0.09);
  --radius: 22px;
  --font-body: Georgia, "Times New Roman", serif;
  --font-display: Georgia, "Times New Roman", serif;
}

html[data-theme="rivendell"] {
  color-scheme: dark;
  --paper: #101827;
  --paper-strong: #182338;
  --ink: #eef2ef;
  --muted: #aebbb9;
  --line: rgba(213, 227, 226, 0.13);
  --accent: #9b8bd0;
  --accent-deep: #c4b8ef;
  --accent-soft: #28264a;
  --gold: #d0b56c;
  --gold-soft: #3d3524;
  --leaf: #79a494;
  --berry: #7099ce;
  --topbar: rgba(15, 24, 39, 0.92);
  --sidebar: #131e30;
  --shadow: 0 20px 60px rgba(0, 0, 0, 0.36);
  --soft-shadow: 0 8px 28px rgba(0, 0, 0, 0.28);
}

html[data-theme="honey"] {
  --paper: #f8f2e3;
  --paper-strong: #fffdf7;
  --ink: #34443a;
  --muted: #788071;
  --line: rgba(78, 91, 61, 0.16);
  --accent: #71845b;
  --accent-deep: #4f6748;
  --accent-soft: #e7ead8;
  --gold: #b87c2b;
  --gold-soft: #f6dfaa;
  --leaf: #607b53;
  --berry: #7e6c45;
  --topbar: rgba(255, 252, 244, 0.92);
  --sidebar: #eee8d6;
}

html[data-theme="friends"] {
  --paper: #f5f4fb;
  --paper-strong: #ffffff;
  --ink: #2f344c;
  --muted: #74788d;
  --line: rgba(68, 73, 111, 0.14);
  --accent: #7657a5;
  --accent-deep: #523a82;
  --accent-soft: #e9e2f6;
  --gold: #b9824a;
  --gold-soft: #f6e3c7;
  --leaf: #5c857e;
  --berry: #557db7;
  --topbar: rgba(255, 255, 255, 0.92);
  --sidebar: #eeeaf7;
}

html[data-font="georgia"] { --font-body: Georgia, "Times New Roman", serif; --font-display: Georgia, "Times New Roman", serif; }
html[data-font="palatino"] { --font-body: "Palatino Linotype", Palatino, Georgia, serif; --font-display: "Palatino Linotype", Palatino, Georgia, serif; }
html[data-font="cinzel"] { --font-body: "Cinzel Local", "Palatino Linotype", Georgia, serif; --font-display: "Cinzel Local", "Palatino Linotype", Georgia, serif; }
html[data-font="garamond"] { --font-body: Garamond, "EB Garamond", Georgia, serif; --font-display: Garamond, "EB Garamond", Georgia, serif; }
html[data-font="book-antiqua"] { --font-body: "Book Antiqua", "Palatino Linotype", Palatino, Georgia, serif; --font-display: "Book Antiqua", "Palatino Linotype", Palatino, Georgia, serif; }
html[data-font="handwriting"] { --font-body: "Segoe Print", "Bradley Hand", "Comic Sans MS", cursive; --font-display: "Segoe Print", "Bradley Hand", cursive; }

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--paper); }
body { margin: 0; min-width: 320px; min-height: 100vh; color: var(--ink); background: var(--paper); font-family: var(--font-body); line-height: 1.65; }
body::before { content: ""; position: fixed; inset: 0; pointer-events: none; opacity: .52; background: radial-gradient(circle at 78% 8%, color-mix(in srgb, var(--accent-soft) 78%, transparent) 0 13%, transparent 35%), radial-gradient(circle at 4% 91%, color-mix(in srgb, var(--gold-soft) 64%, transparent) 0 10%, transparent 28%); }
button, input { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
.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; }

.topbar { position: fixed; z-index: 80; inset: 0 0 auto 0; height: var(--topbar-h); display: grid; grid-template-columns: auto minmax(190px, 318px) minmax(280px, 680px) auto; align-items: center; gap: 20px; padding: 0 24px 0 18px; background: var(--topbar); border-bottom: 1px solid var(--line); backdrop-filter: blur(18px); }
.icon-button { width: 42px; height: 42px; display: grid; place-content: center; gap: 4px; padding: 0; border: 1px solid var(--line); border-radius: 12px; background: var(--paper-strong); cursor: pointer; box-shadow: var(--soft-shadow); }
.icon-button span { display: block; width: 17px; height: 2px; border-radius: 9px; background: var(--ink); transition: transform .2s; }
.brand { display: flex; align-items: center; flex-direction: column; justify-content: center; gap: 0; min-width: 0; line-height: 1; }
.brand-logo { width: max-content; justify-self: start; margin-left: 0; }
.brand-title { color: var(--accent-deep); font-family: "Cinzel Local", "Palatino Linotype", Georgia, serif; font-size: 24px; font-weight: 700; letter-spacing: .025em; text-shadow: 0 2px 14px color-mix(in srgb, var(--accent) 18%, transparent); transition: color .25s, transform .25s; }
.brand-logo small { align-self: center; margin: 2px 0 0; color: var(--gold); font-family: "Cinzel Local", "Palatino Linotype", Georgia, serif; font-size: 8px; font-weight: 600; letter-spacing: .1em; }
.brand-logo:hover .brand-title { color: var(--gold); transform: translateY(-1px); }
.brand-orbit { position: relative; width: 34px; height: 34px; flex: 0 0 auto; border: 1.5px solid var(--gold); border-radius: 50%; transform: rotate(-18deg); }
.brand-orbit::before, .brand-orbit::after { content: ""; position: absolute; border-radius: 50%; background: var(--accent); }
.brand-orbit::before { width: 7px; height: 7px; right: -2px; top: 5px; }
.brand-orbit::after { width: 4px; height: 4px; left: 2px; bottom: 5px; background: var(--leaf); }
.brand-orbit i { position: absolute; width: 12px; height: 12px; border-radius: 50% 12% 50% 12%; background: var(--accent-soft); left: 10px; top: 10px; transform: rotate(45deg); }
.search-wrap { position: relative; justify-self: center; width: min(100%, 650px); }
.search-wrap input { width: 100%; height: 42px; padding: 0 44px; border: 1px solid var(--line); border-radius: 14px; outline: none; color: var(--ink); background: color-mix(in srgb, var(--paper-strong) 82%, transparent); transition: border-color .2s, box-shadow .2s; }
.search-wrap input:focus { border-color: var(--accent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 16%, transparent); }
.search-glyph { position: absolute; z-index: 2; left: 17px; top: 12px; width: 14px; height: 14px; border: 2px solid var(--muted); border-radius: 50%; pointer-events: none; }
.search-glyph::after { content: ""; position: absolute; width: 7px; height: 2px; right: -6px; bottom: -3px; background: var(--muted); transform: rotate(45deg); border-radius: 3px; }
.search-results { position: absolute; z-index: 100; left: 0; right: 0; top: calc(100% + 10px); max-height: min(540px, 70vh); overflow: auto; padding: 8px; background: var(--paper-strong); border: 1px solid var(--line); border-radius: 18px; box-shadow: var(--shadow); }
.search-results a { display: grid; grid-template-columns: 58px 1fr; align-items: center; gap: 12px; padding: 8px; border-radius: 12px; }
.search-results a:hover { background: var(--accent-soft); }
.search-results b, .search-results small { display: block; }
.search-results b { font-size: 14px; line-height: 1.25; }
.search-results small { margin-top: 4px; color: var(--muted); font-size: 11px; }
.search-thumb { width: 58px; height: 46px; object-fit: cover; border-radius: 9px; }
.search-results .image-fallback { width: 58px; height: 46px; border-radius: 9px; }
.empty-search { padding: 24px; text-align: center; color: var(--muted); }
.topbar-actions { display: flex; align-items: center; justify-self: end; gap: 9px; }
.version-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 56px; height: 28px; padding: 0 10px; color: var(--accent-deep); border: 1px solid color-mix(in srgb, var(--accent) 32%, var(--line)); border-radius: 999px; background: var(--accent-soft); font-size: 9px; font-weight: 800; letter-spacing: .08em; white-space: nowrap; }
.homepage-button { display: inline-flex; align-items: center; gap: 17px; height: 46px; padding: 0 18px; white-space: nowrap; color: var(--ink); border: 1px solid var(--line); border-radius: 24px; background: color-mix(in srgb, var(--paper-strong) 82%, var(--accent-soft)); box-shadow: var(--soft-shadow); font-family: Georgia, serif; font-size: 12px; font-weight: 400; transition: transform .2s, border-color .2s, color .2s; }
.homepage-button i { color: var(--accent-deep); font-family: Georgia, serif; font-size: 14px; font-style: normal; }
.homepage-button:hover { color: var(--gold); border-color: var(--gold); transform: translateY(-2px); }
.settings-wrap { position: relative; }
.settings-button { display: grid; place-items: center; width: 46px; height: 46px; padding: 0; color: var(--ink); border: 1px solid var(--line); border-radius: 50%; background: color-mix(in srgb, var(--paper-strong) 82%, var(--accent-soft)); cursor: pointer; box-shadow: var(--soft-shadow); transition: transform .2s, border-color .2s; }
.settings-button:hover { border-color: var(--accent); transform: rotate(12deg); }
.settings-gear { display: block; font-family: "Segoe UI Symbol", sans-serif; font-size: 23px; line-height: 1; }
.settings-panel { position: absolute; right: 0; top: calc(100% + 12px); width: min(520px, calc(100vw - 24px)); max-height: calc(100vh - 95px); overflow: auto; padding: 22px; background: var(--paper-strong); border: 1px solid var(--line); border-radius: 22px; box-shadow: var(--shadow); }
.settings-head { display: flex; align-items: flex-start; justify-content: space-between; padding-bottom: 15px; border-bottom: 1px solid var(--line); }
.settings-head span, .settings-head b { display: block; }
.settings-head span { color: var(--muted); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; }
.settings-head b { font-family: var(--font-display); font-size: 22px; }
.mini-close { padding: 0; width: 32px; height: 32px; border: 1px solid var(--line); border-radius: 50%; background: transparent; font-size: 22px; cursor: pointer; }
.settings-panel fieldset { padding: 0; margin: 18px 0 0; border: 0; }
.settings-panel legend { padding: 0; margin-bottom: 10px; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.theme-grid, .font-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.theme-option, .font-option { display: flex; align-items: center; gap: 10px; min-height: 64px; padding: 9px; text-align: left; color: var(--ink); border: 1px solid var(--line); border-radius: 13px; background: var(--paper); cursor: pointer; }
.theme-option:hover, .font-option:hover, .theme-option.selected, .font-option.selected { border-color: var(--accent); box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 13%, transparent); }
.theme-option b, .theme-option small, .font-option b, .font-option small { display: block; }
.theme-option b { font-size: 12px; }
.theme-option small, .font-option small { color: var(--muted); font-size: 9px; }
.theme-preview { position: relative; flex: 0 0 52px; height: 43px; overflow: hidden; border-radius: 9px; background: #fbfaf7; border: 1px solid rgba(0,0,0,.1); }
.theme-preview::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 14px; background: #f0ece3; }
.theme-preview span { position: absolute; left: 20px; right: 6px; height: 5px; border-radius: 5px; background: #7463a5; }
.theme-preview span:nth-child(1) { top: 8px; }
.theme-preview span:nth-child(2) { top: 18px; right: 16px; background: #b79243; }
.theme-preview span:nth-child(3) { top: 28px; right: 10px; background: #607d70; }
.theme-rivendell { background: #101827; }
.theme-rivendell::before { background: #182338; }
.theme-rivendell span:nth-child(1) { background: #9b8bd0; }
.theme-rivendell span:nth-child(2) { background: #d0b56c; }
.theme-honey { background: #f8f2e3; }
.theme-honey::before { background: #eee8d6; }
.theme-honey span:nth-child(1) { background: #71845b; }
.theme-honey span:nth-child(2) { background: #b87c2b; }
.theme-friends { background: #f5f4fb; }
.theme-friends::before { background: #eeeaf7; }
.theme-friends span:nth-child(1) { background: #7657a5; }
.theme-friends span:nth-child(2) { background: #557db7; }
.font-option > b { flex: 0 0 42px; font-size: 22px; text-align: center; color: var(--accent-deep); }
.font-option span { font-size: 12px; font-weight: 700; }
.font-georgia { font-family: Georgia, serif; }
.font-palatino { font-family: "Palatino Linotype", serif; }
.font-cinzel { font-family: "Cinzel Local", Georgia, serif; }
.font-garamond { font-family: Garamond, Georgia, serif; }
.font-book-antiqua { font-family: "Book Antiqua", "Palatino Linotype", serif; }
.font-handwriting { font-family: "Segoe Print", "Bradley Hand", cursive; }

.sidebar { position: fixed; z-index: 60; top: var(--topbar-h); bottom: 0; left: 0; width: var(--sidebar-w); display: flex; flex-direction: column; background: var(--sidebar); border-right: 1px solid var(--line); transition: width .25s ease, transform .25s ease; }
.sidebar::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5; background: radial-gradient(circle at 20% 9%, color-mix(in srgb, var(--accent-soft) 72%, transparent), transparent 25%), repeating-linear-gradient(115deg, transparent 0 18px, color-mix(in srgb, var(--line) 12%, transparent) 19px 20px); }
.sidebar-scroll { position: relative; z-index: 1; flex: 1; min-height: 0; overflow: auto; padding: 20px 13px 26px; scrollbar-width: thin; }
.sidebar-copyright { display: flex; align-items: center; gap: 11px; margin: 26px 9px 4px; padding: 18px 7px 5px; color: var(--muted); border-top: 1px solid var(--line); font-size: 9px; line-height: 1.45; }
.sidebar-copyright b { color: var(--accent-deep); font-size: 10px; }
.sidebar-copyright small { display: block; margin-top: 5px; color: var(--muted); font-size: 8px; letter-spacing: .04em; }
.book-icon { position: relative; display: inline-block; width: 34px; height: 29px; flex: 0 0 34px; perspective: 100px; }
.book-icon::before, .book-icon::after { content: ""; position: absolute; top: 3px; width: 16px; height: 23px; border: 1.5px solid var(--gold); background: color-mix(in srgb, var(--paper-strong) 84%, var(--accent-soft)); box-shadow: 0 3px 8px color-mix(in srgb, var(--ink) 10%, transparent); }
.book-icon::before { left: 1px; border-radius: 3px 1px 1px 5px; transform: skewY(5deg); }
.book-icon::after { right: 1px; border-radius: 1px 3px 5px 1px; transform: skewY(-5deg); }
.book-icon i { position: absolute; z-index: 2; left: 16px; top: 3px; bottom: 1px; width: 2px; border-radius: 3px; background: var(--accent); }
.home-link, .nav-section-row { position: relative; display: flex; align-items: center; min-height: 46px; border-radius: 13px; }
.home-link { gap: 12px; padding: 6px 12px; font-weight: 700; }
.home-link:hover, .home-link.active { background: var(--paper-strong); color: var(--accent-deep); box-shadow: var(--soft-shadow); }
.nav-kicker { margin: 24px 11px 9px; color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.nav-section { margin-bottom: 5px; border-radius: 13px; }
.nav-section-row { padding: 0 4px 0 11px; }
.nav-section-row > a { display: flex; align-items: center; gap: 12px; flex: 1; min-width: 0; font-size: 13px; font-weight: 700; }
.nav-section-row > button { flex: 0 0 30px; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 8px; background: transparent; cursor: pointer; }
.nav-section-row > button:hover { background: var(--accent-soft); }
.nav-section-row > button span { display: block; width: 7px; height: 7px; margin: auto; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg) translate(-1px, -1px); transition: transform .2s; }
.nav-section.open .nav-section-row > button span { transform: rotate(225deg) translate(-1px, -1px); }
.nav-section:hover .nav-section-row, .nav-section.active .nav-section-row { background: color-mix(in srgb, var(--paper-strong) 72%, transparent); }
.nav-section.active .nav-section-row { color: var(--accent-deep); }
.nav-mark { flex: 0 0 28px; width: 28px; height: 28px; display: grid; place-items: center; color: var(--accent-deep); border: 1px solid color-mix(in srgb, var(--accent) 34%, transparent); border-radius: 10px; background: var(--accent-soft); font-family: Georgia, serif; font-size: 11px; font-weight: 800; }
.submenu { display: grid; grid-template-rows: 0fr; opacity: 0; transition: grid-template-rows .22s ease, opacity .22s ease; }
.submenu::before { content: ""; min-height: 0; }
.nav-section.open .submenu { grid-template-rows: 1fr; opacity: 1; padding: 3px 8px 7px 50px; }
.submenu a { display: none; padding: 7px 8px; color: var(--muted); border-left: 1px solid var(--line); font-size: 11px; line-height: 1.35; }
.nav-section.open .submenu a { display: block; }
.submenu a:hover, .submenu a.active { color: var(--accent-deep); border-left-color: var(--accent); background: color-mix(in srgb, var(--accent-soft) 50%, transparent); }
.sidebar-is-collapsed .sidebar { width: var(--sidebar-collapsed); }
.sidebar-is-collapsed .main-content { margin-left: var(--sidebar-collapsed); }
.sidebar-is-collapsed .nav-label, .sidebar-is-collapsed .nav-kicker, .sidebar-is-collapsed .nav-section-row button { display: none; }
.sidebar-is-collapsed .sidebar-copyright { justify-content: center; margin-inline: 0; padding-inline: 0; }
.sidebar-is-collapsed .sidebar-copyright > span:last-child { display: none; }
.sidebar-is-collapsed .home-link, .sidebar-is-collapsed .nav-section-row { justify-content: center; padding: 5px; }
.sidebar-is-collapsed .nav-section-row > a { flex: initial; }
.nav-backdrop { display: none; }

.main-content { position: relative; z-index: 1; min-height: 100vh; margin-left: var(--sidebar-w); padding-top: var(--topbar-h); transition: margin-left .25s ease; }
.home-page, .listing-page, .article-page { width: min(1440px, 100%); margin: 0 auto; padding: 34px clamp(24px, 4vw, 72px) 54px; }
.eyebrow { display: block; margin-bottom: 10px; color: var(--accent-deep); font-size: 11px; font-weight: 900; letter-spacing: .18em; text-transform: uppercase; }
h1, h2, h3 { font-family: var(--font-display); line-height: 1.08; }
h1, h2, h3, p { overflow-wrap: anywhere; }

.hero { position: relative; min-height: 580px; display: grid; grid-template-columns: 1.04fr .96fr; align-items: center; overflow: hidden; border: 1px solid var(--line); border-radius: 34px; background: var(--paper-strong); box-shadow: var(--shadow); }
.hero::after { content: ""; position: absolute; inset: 0; pointer-events: none; border: 1px solid color-mix(in srgb, var(--gold) 20%, transparent); border-radius: inherit; transform: scale(.985); }
.hero-image { position: absolute; inset: 0 48% 0 0; overflow: hidden; background: var(--accent-soft); }
.hero-cover { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero-image .image-fallback { width: 100%; height: 100%; }
.hero-wash { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(15,20,18,.08), rgba(15,20,18,0) 65%, var(--paper-strong) 100%), linear-gradient(0deg, rgba(15,20,18,.27), transparent 45%); }
.hero-copy { position: relative; z-index: 2; grid-column: 2; padding: 56px clamp(34px, 5vw, 76px) 56px 28px; }
.hero-copy h1 { margin: 0 0 22px; font-size: clamp(48px, 5vw, 78px); font-weight: 500; letter-spacing: -.04em; }
.hero-copy h1 em { color: var(--accent-deep); font-weight: 500; }
.hero-copy > p { max-width: 610px; margin: 0 0 30px; color: var(--muted); font-size: 17px; }
.hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 20px; }
.primary-button { display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 0 20px; color: white; border-radius: 14px; background: var(--accent-deep); font-size: 13px; font-weight: 800; box-shadow: 0 10px 26px color-mix(in srgb, var(--accent) 28%, transparent); transition: transform .2s, box-shadow .2s; }
.primary-button:hover { transform: translateY(-2px); box-shadow: 0 14px 30px color-mix(in srgb, var(--accent) 38%, transparent); }
.play-triangle { width: 0; height: 0; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 8px solid currentColor; }
.text-button { font-size: 13px; font-weight: 800; border-bottom: 1px solid var(--line); }
.text-button span { color: var(--accent); }
.hero-stats { display: flex; flex-wrap: wrap; gap: 25px; margin-top: 38px; padding-top: 22px; border-top: 1px solid var(--line); color: var(--muted); font-size: 11px; text-transform: uppercase; letter-spacing: .08em; }
.hero-stats b { color: var(--ink); font-family: var(--font-display); font-size: 19px; }
.berry-cluster { position: absolute; z-index: 4; right: 26px; bottom: 21px; width: 86px; height: 70px; opacity: .82; }
.berry-cluster i { position: absolute; width: 22px; height: 22px; border-radius: 48% 52% 44% 56%; background: var(--berry); box-shadow: inset 3px 3px 0 rgba(255,255,255,.2); }
.berry-cluster i::before { content: ""; position: absolute; left: 8px; top: -6px; width: 7px; height: 7px; border-left: 2px solid var(--leaf); border-top: 2px solid var(--leaf); transform: rotate(45deg); }
.berry-cluster i:nth-child(2) { left: 23px; top: 12px; transform: scale(.88); }
.berry-cluster i:nth-child(3) { left: 45px; top: 2px; transform: scale(.74); }
.berry-cluster i:nth-child(4) { left: 11px; top: 34px; transform: scale(.68); }
.berry-cluster i:nth-child(5) { left: 37px; top: 38px; transform: scale(.92); }

.home-section { margin-top: 78px; }
.section-heading { display: flex; justify-content: space-between; align-items: end; gap: 32px; margin-bottom: 28px; }
.section-heading h2 { margin: 0; font-size: clamp(34px, 4vw, 50px); font-weight: 500; letter-spacing: -.025em; }
.section-heading > p { max-width: 420px; margin: 0; color: var(--muted); font-size: 13px; }
.world-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 18px; }
.world-card { grid-column: span 4; position: relative; overflow: hidden; min-height: 390px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper-strong); box-shadow: var(--soft-shadow); transition: transform .25s, box-shadow .25s; }
.world-card:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.world-card:nth-child(1), .world-card:nth-child(2), .world-card:nth-child(3) { grid-column: span 4; }
.world-card:nth-child(n+4) { grid-column: span 3; min-height: 350px; }
.world-art { position: relative; height: 190px; overflow: hidden; background: var(--accent-soft); }
.world-card:nth-child(n+4) .world-art { height: 160px; }
.world-art img { width: 100%; height: 100%; object-fit: cover; transition: transform .45s; }
.world-card:hover .world-art img { transform: scale(1.04); }
.world-art::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(16,20,18,.35), transparent 55%); }
.world-mark { position: absolute; z-index: 2; right: 16px; bottom: 14px; width: 48px; height: 48px; display: grid; place-items: center; color: white; border: 1px solid rgba(255,255,255,.6); border-radius: 50%; background: rgba(35,37,45,.32); backdrop-filter: blur(9px); font-family: Georgia, serif; }
.world-copy { padding: 23px; }
.world-copy small { color: var(--accent-deep); font-size: 10px; font-weight: 900; letter-spacing: .11em; text-transform: uppercase; }
.world-copy h3 { margin: 6px 0 10px; font-size: 26px; font-weight: 600; }
.world-copy p { margin: 0; color: var(--muted); font-size: 13px; }
.card-link { display: block; margin-top: 18px; color: var(--accent-deep); font-size: 12px; font-weight: 800; }
.note-row { display: grid; grid-template-columns: 1fr 1.25fr 1fr; align-items: center; gap: 28px; margin: 90px 0 66px; padding: 20px; }
.sticky { --sticky-paper: #f8edbb; position: relative; padding: 30px; color: #3f433f; background: repeating-linear-gradient(to bottom, transparent 0 30px, rgba(86,94,106,.12) 31px, transparent 32px), var(--sticky-paper); box-shadow: 7px 12px 28px rgba(55,49,31,.15); }
.sticky::after { content: ""; position: absolute; top: 0; bottom: 0; left: 21px; width: 1px; background: rgba(175,93,93,.14); pointer-events: none; }
.sticky-lilac { --sticky-paper: #e9e1f3; transform: rotate(-1.2deg); }
.sticky-gold { --sticky-paper: #f8edbb; transform: rotate(1deg); }
.sticky small { color: #6c5e3c; font-size: 10px; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.sticky h3 { margin: 7px 0 12px; font-size: 25px; }
.sticky p { margin: 0; font-size: 13px; }
.tape { position: absolute; top: -13px; left: 35%; width: 80px; height: 28px; background: rgba(255,255,255,.52); transform: rotate(2deg); box-shadow: 0 1px 1px rgba(0,0,0,.08); }
.pin { position: absolute; top: 12px; right: 15px; width: 12px; height: 12px; border-radius: 50%; background: #9f624b; box-shadow: 2px 3px 3px rgba(0,0,0,.25); }
.quote-card { padding: 30px 40px; text-align: center; }
.quote-card p { margin: 0 0 12px; font-family: var(--font-display); font-size: clamp(24px, 3vw, 36px); line-height: 1.25; }
.quote-card small { color: var(--muted); letter-spacing: .12em; text-transform: uppercase; }
.site-footer { display: flex; align-items: center; gap: 12px; padding: 24px 0 10px; border-top: 1px solid var(--line); }
.site-footer b, .site-footer small { display: block; }
.site-footer small { color: var(--muted); font-size: 10px; }
.site-footer a { margin-left: auto; color: var(--accent-deep); font-size: 11px; font-weight: 800; }
.image-fallback { display: grid; place-items: center; background: radial-gradient(circle at 35% 30%, var(--gold-soft), var(--accent-soft)); }
.image-fallback span { color: var(--accent); font-size: 44px; }

.listing-page { padding-top: 48px; }
.listing-hero { min-height: 340px; display: grid; grid-template-columns: 1fr 410px; align-items: center; gap: 50px; margin-bottom: 48px; padding: 38px 44px; overflow: hidden; border: 1px solid var(--line); border-radius: 28px; background: var(--paper-strong); box-shadow: var(--soft-shadow); }
.crumb { color: var(--accent-deep); font-size: 11px; font-weight: 800; }
.listing-hero > div:first-child > span:nth-child(2), .listing-hero > div:first-child > span:nth-child(3) { margin-left: 7px; color: var(--muted); font-size: 11px; }
.listing-hero .eyebrow { margin-top: 36px; }
.listing-hero h1 { max-width: 750px; margin: 0 0 16px; font-size: clamp(44px, 5vw, 72px); font-weight: 500; letter-spacing: -.04em; }
.listing-hero p { max-width: 650px; margin: 0; color: var(--muted); }
.listing-meta { display: flex; gap: 8px; margin-top: 24px; }
.listing-meta span { padding: 6px 10px; border-radius: 20px; background: var(--accent-soft); color: var(--accent-deep); font-size: 10px; font-weight: 800; }
.listing-visual { position: relative; height: 260px; overflow: hidden; border-radius: 50% 50% 46% 54% / 55% 45% 55% 45%; background: var(--accent-soft); transform: rotate(2deg); }
.listing-visual img, .listing-visual .image-fallback { width: 100%; height: 100%; object-fit: cover; }
.listing-visual i { position: absolute; right: 24px; bottom: 17px; width: 56px; height: 56px; display: grid; place-items: center; color: white; border: 1px solid rgba(255,255,255,.7); border-radius: 50%; background: rgba(28,32,36,.38); font-family: Georgia, serif; font-style: normal; }
.episode-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.episode-card { overflow: hidden; border: 1px solid var(--line); border-radius: 20px; background: var(--paper-strong); box-shadow: var(--soft-shadow); transition: transform .22s, box-shadow .22s; }
.episode-card:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.episode-image { position: relative; height: 210px; overflow: hidden; background: var(--accent-soft); }
.episode-image img, .episode-image .image-fallback { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.episode-card:hover .episode-image img { transform: scale(1.04); }
.episode-number { position: absolute; top: 13px; right: 13px; display: grid; place-items: center; min-width: 38px; height: 38px; padding: 0 9px; color: white; border: 1px solid rgba(255,255,255,.5); border-radius: 20px; background: rgba(28,32,36,.38); backdrop-filter: blur(8px); font-family: Georgia, serif; font-size: 10px; }
.video-count { position: absolute; left: 12px; bottom: 12px; display: flex; align-items: center; gap: 7px; padding: 6px 10px; color: white; border-radius: 20px; background: rgba(31,32,36,.65); backdrop-filter: blur(8px); font-size: 10px; font-weight: 800; }
.episode-copy { padding: 21px; }
.episode-copy small { color: var(--muted); font-size: 9px; letter-spacing: .09em; text-transform: uppercase; }
.episode-copy h2 { min-height: 58px; margin: 7px 0 10px; font-size: 23px; font-weight: 600; }
.episode-copy p { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; overflow: hidden; min-height: 92px; margin: 0; color: var(--muted); font-size: 12px; }
.episode-copy > span { display: block; margin-top: 17px; color: var(--accent-deep); font-size: 11px; font-weight: 800; }
.back-home { display: inline-block; margin-top: 34px; color: var(--accent-deep); font-size: 12px; font-weight: 800; }

.article-page { max-width: 1360px; }
.article-topline { display: flex; justify-content: space-between; gap: 16px; padding: 8px 0 22px; color: var(--muted); font-size: 11px; font-weight: 800; }
.article-topline a:hover { color: var(--accent-deep); }
.article-hero { position: relative; min-height: 520px; display: grid; grid-template-columns: 1.12fr .88fr; align-items: stretch; overflow: hidden; border: 1px solid var(--line); border-radius: 30px; background: var(--paper-strong); box-shadow: var(--shadow); }
.article-cover { position: relative; min-height: 520px; background: var(--accent-soft); }
.article-cover img, .article-cover .image-fallback { width: 100%; height: 100%; object-fit: cover; }
.cover-vignette { position: absolute; inset: 0; background: linear-gradient(90deg, transparent 70%, var(--paper-strong)), linear-gradient(0deg, rgba(20,22,23,.26), transparent 45%); }
.article-title { display: flex; flex-direction: column; justify-content: center; padding: 50px clamp(30px, 4vw, 60px) 50px 24px; }
.article-tags { display: flex; flex-wrap: wrap; gap: 7px; }
.article-tags a { padding: 5px 9px; color: var(--accent-deep); border-radius: 20px; background: var(--accent-soft); font-size: 9px; font-weight: 900; text-transform: uppercase; letter-spacing: .08em; }
.article-title h1 { margin: 18px 0; font-size: clamp(42px, 5vw, 68px); font-weight: 500; letter-spacing: -.04em; }
.article-title > p { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 5; overflow: hidden; margin: 0; color: var(--muted); font-size: 14px; }
.article-byline { display: flex; align-items: center; gap: 11px; margin-top: 25px; padding-top: 20px; border-top: 1px solid var(--line); }
.author-seal { width: 38px; height: 38px; display: grid; place-items: center; color: white; border-radius: 50%; background: var(--accent-deep); font-family: Georgia, serif; font-size: 10px; }
.article-byline b, .article-byline small { display: block; }
.article-byline b { font-size: 11px; }
.article-byline small { color: var(--muted); font-size: 9px; }
.video-section { margin: 68px 0; }
.video-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.video-grid > :only-child { grid-column: 1 / -1; width: 100%; max-width: none; margin: 0; }
.video-poster, .video-player { position: relative; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 22px; background: #111; box-shadow: var(--shadow); }
.video-poster > img, .video-poster > .image-fallback { width: 100%; height: 100%; object-fit: cover; }
.video-shade { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(10,12,13,.68), rgba(10,12,13,.14)); }
.video-poster > button { position: absolute; inset: 0; z-index: 2; display: grid; place-content: center; justify-items: center; color: white; border: 0; background: transparent; cursor: pointer; }
.video-poster > button b, .video-poster > button small { display: block; margin-top: 10px; text-shadow: 0 2px 9px rgba(0,0,0,.6); }
.video-poster > button small { margin-top: 2px; opacity: .75; font-size: 10px; }
.big-play { width: 74px; height: 74px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.72); border-radius: 50%; background: color-mix(in srgb, var(--accent-deep) 74%, transparent); box-shadow: 0 12px 35px rgba(0,0,0,.28); transition: transform .2s; }
.video-poster > button:hover .big-play { transform: scale(1.08); }
.big-play i { margin-left: 5px; border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-left: 16px solid white; }
.video-poster > a { position: absolute; z-index: 3; right: 15px; bottom: 13px; color: white; font-size: 9px; }
.video-player iframe { width: 100%; height: 100%; border: 0; }
.article-layout { display: block; width: min(1120px, 100%); margin: 76px auto 0; }
.article-body { min-width: 0; color: var(--ink); font-size: 17px; line-height: 1.78; }
.article-body > :first-child { margin-top: 0; }
.article-body h1, .article-body h2, .article-body h3, .article-body h4 { color: var(--ink); font-family: var(--font-display); line-height: 1.22; }
.article-body h1 { font-size: 40px; }
.article-body h2 { margin-top: 48px; font-size: 34px; font-weight: 500; }
.article-body h3 { margin-top: 36px; font-size: 27px; font-weight: 600; }
.article-body h4 { margin-top: 30px; font-size: 21px; }
.article-body p { margin: 0 0 1.45em; }
.article-body a { color: var(--accent-deep); text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--accent) 38%, transparent); text-underline-offset: 3px; }
.article-body img { width: auto; max-width: 100%; height: auto; margin: 0 auto; border-radius: 15px; box-shadow: var(--soft-shadow); }
.article-body figure { max-width: 100%; margin: 28px auto; }
.article-body figcaption { margin-top: 8px; color: var(--muted); text-align: center; font-size: 10px; }
.article-body blockquote { margin: 32px 0; padding: 23px 28px; border-left: 3px solid var(--accent); background: var(--accent-soft); font-family: var(--font-display); font-size: 20px; }
.article-body ul, .article-body ol { padding-left: 24px; }
.article-body audio, .article-body video { width: 100%; max-width: 100%; }
.article-body .wp-block-gallery, .article-body .blocks-gallery-grid, .article-body .aw-gallery-center, .article-body .aw-gallery, .article-body .aw-gallery-polaroid, .article-body .bb-gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; padding: 0; list-style: none; }
.article-body .wp-block-gallery figure, .article-body .blocks-gallery-grid figure, .article-body .aw-gallery-center figure { margin: 0; }
.article-body .wp-block-gallery img, .article-body .blocks-gallery-grid img, .article-body .aw-gallery-center img, .article-body .aw-gallery img, .article-body .aw-gallery-polaroid img, .article-body .bb-gallery img { width: 100%; height: 250px; object-fit: cover; border-radius: 14px; }
.article-body .aw-grid, .article-body .wp-block-columns, .article-body .two-column, .article-body .sticky-board, .article-body .info-box-row, .article-body .db-row, .article-body .aw-columns-card { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; gap: 20px; margin: 24px 0; }
.article-body .aw-card, .article-body .wp-block-column, .article-body .has-background { width: 100%; min-width: 0; padding: 24px; border: 1px solid var(--line); border-radius: 17px; background: var(--paper-strong); box-shadow: var(--soft-shadow); }
.article-body .aw-sticky-gold { position: relative; color: #3f433f; background: repeating-linear-gradient(to bottom, transparent 0 33px, rgba(86,94,106,.13) 34px, transparent 35px), #f8edbb; box-shadow: 8px 13px 30px rgba(55,49,31,.14); transform: rotate(-.3deg); }
.article-body .aw-sticky-gold::before { content: ""; position: absolute; z-index: 2; top: -15px; left: 50%; width: 96px; height: 29px; background: rgba(255,255,255,.58); box-shadow: 0 1px 2px rgba(0,0,0,.08); transform: translateX(-50%) rotate(1.8deg); }
.article-body .aw-sticky-gold::after { content: ""; position: absolute; top: 0; bottom: 0; left: 27px; width: 1px; background: rgba(175,93,93,.15); }
.article-body .soft-card, .article-body .info-box, .article-body .db-infobox { width: 100%; min-width: 0; padding: 24px; border: 1px solid var(--line); border-radius: 18px; background: var(--paper-strong); box-shadow: var(--soft-shadow); }
.article-body .text-columns { column-count: 1; column-rule: 0; }
.article-body .text-columns > * { break-inside: avoid; }
.article-body .sticky-note, .article-body .db-sticky, .article-body .db-postit { --note-paper: #f7edc0; position: relative; margin: 24px 0; padding: 25px 28px 25px 38px; color: #3f433f; border: 1px solid rgba(113,91,46,.15); background: repeating-linear-gradient(to bottom, transparent 0 29px, rgba(86,94,106,.12) 30px, transparent 31px), var(--note-paper); box-shadow: 7px 12px 26px rgba(55,49,31,.13); transform: rotate(-.35deg); }
.article-body .sticky-note:nth-child(even), .article-body .db-postit:nth-child(even) { --note-paper: #e9e1f3; transform: rotate(.45deg); }
.article-body .sticky-note::before, .article-body .db-sticky::before, .article-body .db-postit::before { content: ""; position: absolute; top: 0; bottom: 0; left: 20px; width: 1px; background: rgba(175,93,93,.16); }
.article-body p:has(> strong:first-child) { padding: 15px 18px; border-left: 3px solid var(--gold); background: linear-gradient(90deg, var(--gold-soft), transparent 78%); }
.article-body .aw-quote-box { margin: 42px 0; padding: 28px; text-align: center; border: 1px solid var(--line); border-radius: 18px; background: var(--accent-soft); }
.article-body .aw-quote-text { font-family: var(--font-display); font-size: 30px; color: var(--accent-deep); }
.article-body .aw-media-flex { display: flex; align-items: center; flex-wrap: wrap; gap: 24px; }
.article-body .aw-media-flex > * { flex: 1 1 300px; }
.article-body .aw-media-flex.reverse { flex-direction: row-reverse; }
.article-body hr { margin: 45px 0; border: 0; border-top: 1px solid var(--line); }
.article-end { margin: 80px auto 10px; text-align: center; }
.article-end > span { color: var(--accent); font-size: 34px; }
.article-end p { margin: 2px 0 12px; color: var(--muted); font-size: 10px; letter-spacing: .13em; text-transform: uppercase; }
.article-end a { color: var(--accent-deep); font-family: var(--font-display); font-size: 19px; border-bottom: 1px solid var(--accent); }

.article-column { position: relative; min-width: 0; }
.article-column::before { content: ""; position: absolute; z-index: -1; top: 120px; bottom: 80px; left: -34px; width: 1px; background: repeating-linear-gradient(to bottom, var(--gold) 0 6px, transparent 6px 15px); opacity: .32; }
.episode-story { position: relative; margin: 0 0 48px; padding: 36px 42px; overflow: hidden; border: 1px solid var(--line); border-radius: 24px; background: linear-gradient(135deg, var(--paper-strong), color-mix(in srgb, var(--accent-soft) 50%, var(--paper-strong))); box-shadow: var(--soft-shadow); }
.episode-story::after { content: "✦"; position: absolute; right: 22px; bottom: -22px; color: color-mix(in srgb, var(--accent) 18%, transparent); font-family: Georgia, serif; font-size: 100px; line-height: 1; transform: rotate(15deg); }
.episode-story h2 { position: relative; z-index: 1; margin: 0 0 14px; font-size: clamp(30px, 4vw, 46px); font-weight: 500; }
.episode-story p { position: relative; z-index: 1; max-width: 880px; margin: 0; color: var(--muted); font-size: 16px; }
.story-highlight { position: relative; margin: 0 0 52px; padding: 34px 42px 32px 58px; overflow: hidden; border: 1px solid color-mix(in srgb, var(--accent) 30%, var(--line)); border-radius: 4px 24px 24px 4px; background: linear-gradient(115deg, var(--accent-soft), color-mix(in srgb, var(--paper-strong) 82%, transparent)); box-shadow: var(--soft-shadow); }
.story-highlight::before { content: "„"; position: absolute; left: 14px; top: -12px; color: color-mix(in srgb, var(--accent) 48%, transparent); font-family: Georgia, serif; font-size: 92px; line-height: 1; }
.story-highlight > span { color: var(--accent-deep); font-size: 9px; font-weight: 900; letter-spacing: .15em; text-transform: uppercase; }
.story-highlight p { margin: 8px 0 6px; font-family: var(--font-display); font-size: clamp(23px, 3vw, 34px); line-height: 1.28; }
.story-highlight p::after { content: "“"; margin-left: .08em; color: var(--accent-deep); }
.story-highlight small { color: var(--muted); font-size: 10px; font-weight: 800; }
.article-body figure.wp-block-image { display: inline-block; width: calc(50% - 12px); margin: 10px 5px; vertical-align: top; overflow: hidden; border: 1px solid color-mix(in srgb, var(--accent) 18%, var(--line)); border-radius: 16px; background: var(--paper-strong); box-shadow: var(--soft-shadow); }
.article-body figure.wp-block-image img { width: 100%; max-height: 390px; object-fit: cover; border: 0; border-radius: 0; box-shadow: none; cursor: zoom-in; }
.article-body figure.wp-block-image figcaption { padding: 0 12px 10px; }
.article-body .aw-media-flex figure.wp-block-image, .article-body .wp-block-gallery figure.wp-block-image, .article-body .blocks-gallery-grid figure.wp-block-image, .article-body .aw-gallery-center figure.wp-block-image, .article-body .aw-gallery figure.wp-block-image, .article-body .aw-gallery-polaroid figure.wp-block-image, .article-body .bb-gallery figure.wp-block-image { width: auto; margin: 0; }
.article-body .wp-block-gallery, .article-body .blocks-gallery-grid, .article-body .aw-gallery-center, .article-body .aw-gallery, .article-body .aw-gallery-polaroid, .article-body .bb-gallery { margin: 28px 0; padding: 11px; border: 1px solid var(--line); border-radius: 20px; background: color-mix(in srgb, var(--paper-strong) 78%, transparent); box-shadow: var(--soft-shadow); }
.article-body img { cursor: zoom-in; transition: transform .65s cubic-bezier(.2,.7,.2,1), filter .45s ease, opacity .75s ease; }
.article-body figure:hover img { transform: scale(1.035); filter: saturate(1.06) contrast(1.025); }
.article-body .aw-card, .article-body .soft-card, .article-body .info-box, .article-body .db-infobox { transition: transform .45s cubic-bezier(.2,.72,.2,1), box-shadow .35s ease, border-color .35s ease; }
.article-body .aw-card:hover, .article-body .soft-card:hover, .article-body .info-box:hover, .article-body .db-infobox:hover { transform: translateY(-4px) rotate(.15deg); border-color: color-mix(in srgb, var(--accent) 32%, var(--line)); box-shadow: var(--shadow); }
.article-body h2::after { content: ""; display: block; width: 64px; height: 2px; margin: 13px 0 0; background: linear-gradient(90deg, var(--gold), var(--accent), transparent); border-radius: 4px; }
.article-body .bb-section, .article-body .bs312-section, .article-body .aw-section { margin: 34px 0; }
.article-body .bb-card, .article-body .bs312-panel, .article-body .aw-heading-box, .article-body .bs312-transmission, .article-body .bb-disclaimer-box, .article-body .bb-audio-box { position: relative; padding: 26px; border: 1px solid var(--line); border-radius: 20px; background: var(--paper-strong); box-shadow: var(--soft-shadow); transition: transform .42s cubic-bezier(.2,.72,.2,1), box-shadow .35s ease; }
.article-body .bb-card:hover, .article-body .bs312-panel:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.article-body .aw-postit-grid, .article-body .bs312-columns, .article-body .bs312-transmission-grid, .article-body .bs312-stats, .article-body .bb-flex-container { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 18px; margin: 24px 0; }
.article-body .aw-pinboard { display: block; width: 100%; margin: 24px 0; }
.article-body .aw-pinboard > .aw-postit-grid { width: 100%; }
.article-body .aw-postit, .article-body .bb-sticky-modern, .article-body .bs312-quote { --fancy-note: #f8edbb; position: relative; margin: 22px 0; padding: 29px 28px 27px 40px; color: #3f433f; border: 1px solid rgba(113,91,46,.16); background: repeating-linear-gradient(to bottom, transparent 0 31px, rgba(86,94,106,.12) 32px, transparent 33px), var(--fancy-note); box-shadow: 8px 13px 28px rgba(55,49,31,.14); transform: rotate(-.35deg); }
.article-body .aw-postit:nth-child(even), .article-body .bb-sticky-modern:nth-child(even), .article-body .bs312-quote:nth-child(even) { --fancy-note: #e9e1f3; transform: rotate(.4deg); }
.article-body .aw-postit::before, .article-body .bb-sticky-modern::before, .article-body .bs312-quote::before { content: ""; position: absolute; z-index: 2; top: -14px; left: 50%; width: 88px; height: 27px; background: rgba(255,255,255,.58); box-shadow: 0 1px 2px rgba(0,0,0,.08); transform: translateX(-50%) rotate(-1.5deg); }
.article-body .aw-postit::after, .article-body .bb-sticky-modern::after, .article-body .bs312-quote::after { content: ""; position: absolute; top: 0; bottom: 0; left: 25px; width: 1px; background: rgba(175,93,93,.15); }
.article-body .bs312-chip { display: inline-flex; margin: 4px; padding: 6px 10px; color: var(--accent-deep); border-radius: 20px; background: var(--accent-soft); font-size: 10px; font-weight: 800; }
.article-body .bs312-stat { padding: 18px; text-align: center; border: 1px solid var(--line); border-radius: 16px; background: var(--paper-strong); }
.article-body .bs312-stat-number { display: block; color: var(--accent-deep); font-family: var(--font-display); font-size: 28px; }

.cinema-page { width: min(1440px, 100%); margin: 0 auto; padding: 34px clamp(24px, 4vw, 72px) 70px; }
.cinema-intro { max-width: 940px; margin: 15px auto 32px; text-align: center; }
.cinema-intro h1 { margin: 0 0 12px; font-size: clamp(42px, 5vw, 68px); font-weight: 500; letter-spacing: -.035em; }
.cinema-intro p { margin: 0; color: var(--muted); }
.cinema-room-simple { display: block; width: 100%; min-height: 0; aspect-ratio: 16 / 9; }
.cinema-room-simple .cinema-stage { width: 100%; height: 100%; }
.cinema-room-simple .cinema-curtain { height: 100%; min-height: 0; }
.cinema-room-simple .video-player { width: 100%; height: 100%; aspect-ratio: auto; }
.cinema-header { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 40px; margin-bottom: 28px; padding: 38px 46px; overflow: hidden; border: 1px solid var(--line); border-radius: 28px; background: radial-gradient(circle at 90% 20%, color-mix(in srgb, var(--gold-soft) 70%, transparent), transparent 30%), var(--paper-strong); box-shadow: var(--soft-shadow); }
.cinema-header h1 { max-width: 900px; margin: 0 0 14px; font-size: clamp(44px, 5vw, 72px); font-weight: 500; letter-spacing: -.04em; }
.cinema-header p { max-width: 760px; margin: 0; color: var(--muted); }
.cinema-meta { display: flex; gap: 8px; margin-top: 22px; }
.cinema-meta span { padding: 6px 11px; color: var(--accent-deep); border-radius: 20px; background: var(--accent-soft); font-size: 10px; font-weight: 900; }
.cinema-ticket { width: 154px; min-height: 196px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: white; border-radius: 18px; background: linear-gradient(150deg, var(--accent-deep), color-mix(in srgb, var(--accent-deep) 56%, #17202c)); box-shadow: 0 15px 40px color-mix(in srgb, var(--accent) 25%, transparent); transform: rotate(3deg); }
.cinema-ticket::before, .cinema-ticket::after { content: ""; width: 100%; height: 1px; margin: 14px 0; background: repeating-linear-gradient(90deg, rgba(255,255,255,.6) 0 5px, transparent 5px 10px); }
.cinema-ticket span, .cinema-ticket small { font-size: 9px; font-weight: 900; letter-spacing: .18em; text-transform: uppercase; }
.cinema-ticket b { font-family: Georgia, serif; font-size: 46px; }
.cinema-room { display: grid; grid-template-columns: minmax(0, 1fr) 370px; min-height: 560px; overflow: hidden; border: 1px solid var(--line); border-radius: 26px; background: #11151b; box-shadow: var(--shadow); }
.cinema-stage { min-width: 0; display: grid; place-items: center; background: radial-gradient(circle at 50% 40%, #263043, #0c0f14 70%); }
.cinema-stage > .video-player { width: 100%; aspect-ratio: 16 / 9; border-radius: 0; box-shadow: none; }
.cinema-room.cinema-room-simple { display: block; grid-template-columns: none; width: 100%; min-height: 0; aspect-ratio: 16 / 9; }
.cinema-room.cinema-room-simple .cinema-stage, .cinema-room.cinema-room-simple .playlist-player { width: 100%; height: 100%; min-height: 0; aspect-ratio: auto; }
.cinema-unavailable { padding: 40px; color: #f3f3f4; text-align: center; }
.cinema-curtain { position: relative; width: 100%; height: 100%; min-height: 560px; overflow: hidden; }
.cinema-curtain > img, .cinema-curtain > .image-fallback { width: 100%; height: 100%; object-fit: cover; }
.cinema-curtain::before, .cinema-curtain::after { content: ""; position: absolute; z-index: 2; top: 0; bottom: 0; width: 28%; pointer-events: none; background: repeating-linear-gradient(90deg, #421b2d 0 28px, #562338 29px 55px); box-shadow: inset -18px 0 28px rgba(0,0,0,.35); transition: transform .8s ease; }
.cinema-curtain::before { left: 0; transform: translateX(-78%); }
.cinema-curtain::after { right: 0; transform: translateX(78%); box-shadow: inset 18px 0 28px rgba(0,0,0,.35); }
.cinema-curtain > button { position: absolute; z-index: 4; inset: 0; display: grid; place-content: center; justify-items: center; color: white; border: 0; background: transparent; cursor: pointer; }
.cinema-curtain > button b, .cinema-curtain > button small { display: block; margin-top: 10px; text-shadow: 0 2px 9px rgba(0,0,0,.7); }
.cinema-curtain > button small { margin-top: 2px; opacity: .78; font-size: 10px; }
.cinema-queue { min-width: 0; max-height: 680px; overflow: auto; color: #f3f3f4; border-left: 1px solid rgba(255,255,255,.12); background: #171c24; scrollbar-width: thin; }
.cinema-queue-head { position: sticky; z-index: 2; top: 0; display: flex; justify-content: space-between; align-items: center; padding: 18px; border-bottom: 1px solid rgba(255,255,255,.1); background: rgba(23,28,36,.94); backdrop-filter: blur(8px); }
.cinema-queue-head span { color: #aeb4bf; font-size: 9px; font-weight: 900; letter-spacing: .14em; text-transform: uppercase; }
.cinema-queue-head b { font-family: var(--font-display); }
.cinema-episode { width: 100%; display: grid; grid-template-columns: 28px 1fr auto; align-items: center; gap: 10px; padding: 10px 14px; color: inherit; text-align: left; border: 0; border-bottom: 1px solid rgba(255,255,255,.08); background: transparent; cursor: pointer; transition: background .2s, transform .2s; }
.cinema-episode:hover, .cinema-episode.active { background: color-mix(in srgb, var(--accent) 30%, #171c24); }
.cinema-episode > span:first-child { color: #939aa7; font-family: Georgia, serif; font-size: 10px; }
.cinema-episode > span:nth-child(2) { min-width: 0; display: grid; grid-template-columns: 75px 1fr; align-items: center; gap: 10px; }
.cinema-episode b { overflow: hidden; font-family: var(--font-body); font-size: 10px; font-weight: 700; line-height: 1.25; text-overflow: ellipsis; }
.cinema-thumb, .cinema-episode .image-fallback { width: 75px; height: 46px; object-fit: cover; border-radius: 7px; }
.cinema-episode .play-triangle { margin-right: 3px; color: #d7d9dc; }
.cinema-actions { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 24px; margin-top: 28px; }
.cinema-actions button.primary-button { border: 0; cursor: pointer; }
.cinema-card { grid-column: span 2; display: grid; grid-template-columns: minmax(280px, .95fr) 1.05fr; }
.cinema-card .episode-image { height: 100%; min-height: 285px; }
.cinema-card .episode-number { width: auto; padding: 0 12px; border-radius: 20px; }
.cinema-card .episode-copy { display: flex; flex-direction: column; justify-content: center; padding: 32px; }
.cinema-card .episode-copy h2 { min-height: 0; font-size: 34px; }

.lightbox { position: fixed; z-index: 200; inset: 0; display: grid; place-items: center; padding: 28px; }
.lightbox-backdrop { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: color-mix(in srgb, var(--paper) 84%, transparent); backdrop-filter: blur(18px) saturate(.85); cursor: zoom-out; }
.lightbox-frame { position: relative; z-index: 1; display: grid; place-items: center; max-width: min(1280px, 94vw); max-height: 91vh; padding: 12px; border: 4px solid color-mix(in srgb, var(--paper-strong) 90%, var(--accent-soft)); border-radius: 22px; background: var(--paper-strong); box-shadow: 0 28px 90px rgba(34,38,40,.28), 0 0 0 1px var(--line); }
.lightbox-frame img { max-width: 100%; max-height: calc(91vh - 70px); object-fit: contain; border-radius: 12px; }
.lightbox-frame p { max-width: 820px; margin: 10px 10px 2px; color: var(--muted); text-align: center; font-size: 11px; }
.lightbox-close { position: absolute; z-index: 2; top: -17px; right: -17px; width: 40px; height: 40px; padding: 0; color: var(--ink); border: 2px solid var(--paper-strong); border-radius: 50%; background: var(--accent-soft); box-shadow: var(--soft-shadow); font-size: 25px; cursor: pointer; }
.lightbox-is-open { overflow: hidden; }

.reveal { --reveal-x: 0px; --reveal-y: 28px; --reveal-scale: .985; opacity: 0; transform: translate3d(var(--reveal-x), var(--reveal-y), 0) scale(var(--reveal-scale)); transition: opacity .72s ease, transform .82s cubic-bezier(.2,.72,.2,1); }
.reveal-1 { --reveal-x: -34px; --reveal-y: 0px; }
.reveal-2 { --reveal-x: 34px; --reveal-y: 0px; }
.reveal-3 { --reveal-x: 0px; --reveal-y: 38px; --reveal-scale: .95; }
.reveal.is-visible { opacity: 1; transform: translate3d(0,0,0) scale(1); }
.article-body .media-motion-0 { opacity: .45; transform: scale(.94); }
.article-body .media-motion-1 { opacity: .35; transform: translateX(-28px); }
.article-body .media-motion-2 { opacity: .35; transform: translateX(28px); }
.article-body .media-motion-3 { opacity: .35; transform: translateY(25px) scale(.98); }
.article-body .is-visible .media-motion-0, .article-body .is-visible .media-motion-1, .article-body .is-visible .media-motion-2, .article-body .is-visible .media-motion-3,
.article-body .reveal.is-visible.media-motion-0, .article-body .reveal.is-visible.media-motion-1, .article-body .reveal.is-visible.media-motion-2, .article-body .reveal.is-visible.media-motion-3 { opacity: 1; transform: none; }

@media (max-width: 1180px) {
  :root { --sidebar-w: 276px; }
  .topbar { grid-template-columns: auto 230px minmax(250px, 1fr) auto; gap: 13px; }
  .hero { min-height: 530px; }
  .hero-image { inset-right: 45%; }
  .world-card:nth-child(n) { grid-column: span 6; }
  .world-card:nth-child(7) { grid-column: 4 / span 6; }
  .listing-hero { grid-template-columns: 1fr 300px; }
  .episode-grid { grid-template-columns: repeat(2, 1fr); }
  .cinema-room { grid-template-columns: minmax(0, 1fr) 330px; }
}

@media (max-width: 900px) {
  :root { --topbar-h: 64px; }
  .topbar { grid-template-columns: auto 1fr auto; padding: 0 14px; }
  .brand { font-size: 19px; }
  .brand-logo { justify-self: start; }
  .brand-orbit { width: 30px; height: 30px; }
  .search-wrap { position: fixed; top: calc(var(--topbar-h) + 8px); left: 12px; right: 12px; width: auto; display: none; }
  .settings-label { display: none; }
  .settings-button { width: 46px; height: 46px; padding: 0; justify-content: center; }
  .homepage-button { width: 46px; padding: 0; justify-content: center; gap: 0; font-size: 0; }
  .homepage-button span, .homepage-button i { display: none; }
  .homepage-button::before { content: "DB"; font-size: 10px; letter-spacing: .06em; }
  .version-badge { min-width: 45px; padding-inline: 7px; font-size: 8px; }
  .settings-panel { position: fixed; right: 12px; top: calc(var(--topbar-h) + 8px); }
  .sidebar, .sidebar-is-collapsed .sidebar { width: min(350px, calc(100vw - 54px)); transform: translateX(-105%); box-shadow: var(--shadow); }
  .mobile-nav-is-open .sidebar { transform: translateX(0); }
  .sidebar-is-collapsed .nav-label, .sidebar-is-collapsed .nav-kicker, .sidebar-is-collapsed .nav-section-row button { display: initial; }
  .sidebar-is-collapsed .home-link, .sidebar-is-collapsed .nav-section-row { justify-content: initial; padding: 5px 11px; }
  .sidebar-is-collapsed .nav-section-row > a { flex: 1; }
  .nav-backdrop { position: fixed; z-index: 55; inset: var(--topbar-h) 0 0 0; width: 100%; height: auto; border: 0; background: rgba(13,18,17,.42); backdrop-filter: blur(2px); }
  .mobile-nav-is-open .nav-backdrop { display: block; }
  .main-content, .sidebar-is-collapsed .main-content { margin-left: 0; }
  .home-page, .listing-page, .article-page { padding-inline: 20px; }
  .hero { grid-template-columns: 1fr; padding-top: 310px; }
  .hero-image { inset: 0 0 auto; height: 330px; }
  .hero-wash { background: linear-gradient(0deg, var(--paper-strong), transparent 55%); }
  .hero-copy { grid-column: 1; padding: 32px; }
  .hero-copy h1 { font-size: clamp(44px, 10vw, 68px); }
  .note-row { grid-template-columns: 1fr; max-width: 620px; margin-inline: auto; }
  .listing-hero { grid-template-columns: 1fr; }
  .listing-visual { display: none; }
  .article-hero { grid-template-columns: 1fr; }
  .article-cover { min-height: 360px; }
  .cover-vignette { background: linear-gradient(0deg, var(--paper-strong), transparent 45%); }
  .article-title { padding: 20px 30px 40px; }
  .cinema-header { grid-template-columns: 1fr; }
  .cinema-ticket { display: none; }
  .cinema-room { grid-template-columns: 1fr; }
  .cinema-queue { max-height: 430px; border-top: 1px solid rgba(255,255,255,.12); border-left: 0; }
  .cinema-curtain { min-height: 480px; }
}

@media (max-width: 640px) {
  .home-page, .listing-page, .article-page { padding: 18px 12px 40px; }
  .brand-title { max-width: 165px; overflow: hidden; font-size: 21px; text-overflow: ellipsis; white-space: nowrap; }
  .brand-logo small { font-size: 9px; }
  .version-badge { display: none; }
  .theme-grid, .font-grid { grid-template-columns: 1fr; }
  .settings-panel { padding: 17px; }
  .hero { min-height: 0; padding-top: 236px; border-radius: 22px; }
  .hero-image { height: 260px; }
  .hero-copy { padding: 24px 20px 30px; }
  .hero-copy h1 { margin-bottom: 15px; font-size: 42px; }
  .hero-copy > p { font-size: 14px; }
  .hero-actions { align-items: flex-start; flex-direction: column; }
  .hero-stats { gap: 15px; }
  .berry-cluster { display: none; }
  .home-section { margin-top: 55px; }
  .section-heading { align-items: start; flex-direction: column; gap: 12px; }
  .section-heading h2 { font-size: 36px; }
  .world-grid { display: block; }
  .world-card { display: block; min-height: 0; margin-bottom: 15px; }
  .world-card:nth-child(n) .world-art { height: 180px; }
  .note-row { margin: 50px 0 35px; padding: 8px; }
  .site-footer { flex-wrap: wrap; }
  .site-footer a { width: 100%; margin: 12px 0 0; }
  .listing-page { padding-top: 28px; }
  .listing-hero { min-height: 0; padding: 26px 20px; border-radius: 20px; }
  .listing-hero .eyebrow { margin-top: 28px; }
  .listing-hero h1 { font-size: 42px; }
  .episode-grid { grid-template-columns: 1fr; }
  .episode-image { height: 220px; }
  .article-topline a:last-child { display: none; }
  .article-hero { min-height: 0; border-radius: 21px; }
  .article-cover { min-height: 270px; }
  .article-title { padding: 8px 20px 28px; }
  .article-title h1 { margin: 15px 0; font-size: 39px; }
  .video-section { margin: 50px 0; }
  .video-grid { grid-template-columns: 1fr; }
  .video-grid > :only-child { grid-column: auto; }
  .article-layout { margin-top: 48px; }
  .article-body { font-size: 15px; }
  .article-body h2 { font-size: 29px; }
  .article-body h3 { font-size: 24px; }
  .article-body .wp-block-gallery, .article-body .blocks-gallery-grid, .article-body .aw-gallery-center, .article-body .aw-gallery, .article-body .aw-gallery-polaroid, .article-body .bb-gallery, .article-body .aw-grid, .article-body .wp-block-columns, .article-body .two-column, .article-body .sticky-board, .article-body .info-box-row, .article-body .db-row, .article-body .aw-postit-grid, .article-body .aw-pinboard, .article-body .bs312-columns, .article-body .bs312-transmission-grid, .article-body .bs312-stats, .article-body .bb-flex-container, .article-body .aw-columns-card { grid-template-columns: 1fr; }
  .article-body .text-columns { column-count: 1; }
  .article-body .wp-block-gallery img, .article-body .blocks-gallery-grid img, .article-body .aw-gallery-center img, .article-body .aw-gallery img, .article-body .aw-gallery-polaroid img, .article-body .bb-gallery img { height: auto; }
  .article-body figure.wp-block-image { display: block; width: 100%; margin: 12px 0; }
  .story-highlight { padding: 28px 24px 26px 48px; }
  .episode-story { padding: 28px 22px; }
  .article-column::before { display: none; }
  .cinema-page { padding: 18px 12px 45px; }
  .cinema-header { padding: 26px 20px; border-radius: 20px; }
  .cinema-header h1 { font-size: 40px; }
  .cinema-curtain { min-height: 300px; }
  .cinema-card { grid-column: 1; display: block; }
  .cinema-card .episode-image { min-height: 220px; }
  .cinema-episode > span:nth-child(2) { grid-template-columns: 62px 1fr; }
  .cinema-thumb, .cinema-episode .image-fallback { width: 62px; height: 40px; }
  .lightbox { padding: 14px; }
  .lightbox-frame { border-width: 3px; border-radius: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

/* Einheitliches Beitragsdesign ab „Interessanter Fund“ – Version 1.1 */
.aw-unified-content {
  --aw-lilac: color-mix(in srgb, var(--accent) 68%, #7e6bbd);
  --aw-lilac-soft: color-mix(in srgb, var(--accent-soft) 72%, var(--paper-strong));
  --aw-gold: color-mix(in srgb, var(--gold) 82%, #b89d3f);
  width: 100%;
  margin-top: 42px;
  color: var(--ink);
}
.aw-unified-content *, .aw-unified-content *::before, .aw-unified-content *::after { box-sizing: border-box; }
.aw-unified-content :is(.wp-block-group, .wp-block-group__inner-container, .aw-wrapper, .db-wrapper, .bb-wrapper, .custom-page-container, .alenwen, .patsy-buch2, .patsy-buch3) { width: 100%; max-width: none !important; margin-inline: 0 !important; padding-inline: 0 !important; background: transparent !important; }
.aw-unified-content :is(.aw-section, .bb-section, .bs312-section) { width: 100%; margin: 0 0 42px !important; }
.aw-unified-content :is(h1, h2, h3, h4, h5, h6) { color: var(--accent-deep) !important; font-family: var(--font-display); letter-spacing: .015em; text-shadow: 0 0 14px color-mix(in srgb, var(--accent) 20%, transparent); }
.aw-unified-content :is(h2, h3)::after { display: none; }
.aw-unified-content p { margin: 0 0 1.25rem; font-size: 1.04em; line-height: 1.76; }
.aw-unified-content p:last-child { margin-bottom: 0; }
.aw-unified-content :is(strong, em) { color: var(--aw-gold); }
.aw-unified-content a { color: var(--accent-deep); border-bottom: 1px dotted var(--accent); }
.aw-unified-content a:hover { color: var(--aw-gold); border-color: var(--aw-gold); }
.aw-unified-content .aw-initiale { float: left; margin: 10px 16px -6px 0; color: var(--aw-gold); font-family: var(--font-display); font-size: 5em; line-height: .8; text-shadow: 0 0 10px color-mix(in srgb, var(--gold) 35%, transparent), 0 0 18px color-mix(in srgb, var(--accent) 38%, transparent); }

.aw-unified-content :is(.aw-heading-box, .aw-quote-box, .bs312-heading, .section-title, .aw-heading-box.bs312-heading) {
  position: relative;
  display: block !important;
  max-width: 900px !important;
  margin: 44px auto 24px !important;
  padding: 18px 28px !important;
  text-align: center;
  border: 1px solid color-mix(in srgb, var(--accent) 38%, var(--line)) !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, color-mix(in srgb, var(--paper-strong) 92%, transparent), var(--aw-lilac-soft)) !important;
  box-shadow: 0 10px 24px color-mix(in srgb, var(--accent) 12%, transparent) !important;
  transform: none !important;
}
.aw-unified-content :is(.aw-heading-box, .aw-quote-box, .bs312-heading, .section-title)::before,
.aw-unified-content :is(.aw-heading-box, .aw-quote-box, .bs312-heading, .section-title)::after { display: none !important; }
.aw-unified-content :is(.aw-heading-box, .aw-quote-box, .bs312-heading, .section-title) :is(h1, h2, h3, .aw-quote-text) { display: block; margin: 0 !important; color: var(--accent-deep) !important; font-family: var(--font-display); font-size: clamp(24px, 3vw, 34px) !important; font-weight: 600; line-height: 1.25; text-align: center; }
.aw-unified-content :is(.aw-quote-author, .aw-gold-text) { display: block; margin-top: 8px; color: var(--aw-gold) !important; text-align: center; }

.aw-unified-content :is(.aw-card, .soft-card, .info-box, .db-infobox, .bb-card, .bs312-panel, .bs312-transmission, .bb-disclaimer-box, .bb-audio-box, .aw-bio-box, .aw-verse-box, .hero-box, .aw-auto-card) {
  position: relative;
  display: block;
  width: 100% !important;
  min-width: 0;
  margin: 0 0 30px !important;
  padding: 30px 32px !important;
  overflow: visible;
  color: var(--ink) !important;
  border: 1px solid color-mix(in srgb, var(--accent) 34%, var(--line)) !important;
  border-radius: 24px !important;
  background: linear-gradient(145deg, color-mix(in srgb, var(--paper-strong) 96%, transparent), color-mix(in srgb, var(--accent-soft) 36%, var(--paper-strong))) !important;
  box-shadow: 0 14px 34px color-mix(in srgb, var(--accent) 10%, transparent) !important;
  transform: none;
}
.aw-unified-content :is(.aw-card, .soft-card, .info-box, .db-infobox, .bb-card, .bs312-panel, .bs312-transmission, .bb-disclaimer-box, .bb-audio-box, .aw-bio-box, .aw-verse-box, .hero-box, .aw-auto-card)::before { content: ""; position: absolute; inset: 10px; display: block; pointer-events: none; border: 1px solid color-mix(in srgb, white 46%, transparent); border-radius: 18px; }
.aw-unified-content :is(.aw-card, .soft-card, .info-box, .db-infobox, .bb-card, .bs312-panel):hover { transform: translateY(-3px); box-shadow: 0 18px 38px color-mix(in srgb, var(--accent) 16%, transparent) !important; }
.aw-unified-content :is(.aw-grid, .wp-block-columns, .two-column, .info-box-row, .db-row, .bs312-columns, .bs312-transmission-grid) { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; align-items: start; gap: 20px; width: 100%; margin: 28px 0 42px !important; }
.aw-unified-content .aw-columns-card { display: block !important; column-count: 2 !important; column-gap: 38px; column-rule: 1px solid var(--line); }
.aw-unified-content .aw-columns-card > * { break-inside: avoid; }

.aw-unified-content :is(.aw-pinboard, .sticky-board) { position: relative; display: block !important; width: 100%; margin: 30px 0 45px !important; padding: 28px !important; border: 1px solid color-mix(in srgb, var(--gold) 28%, var(--line)) !important; border-radius: 28px !important; background: linear-gradient(160deg, color-mix(in srgb, var(--paper-strong) 70%, transparent), color-mix(in srgb, var(--gold-soft) 55%, var(--paper-strong))) !important; box-shadow: 0 16px 38px color-mix(in srgb, var(--gold) 11%, transparent) !important; }
.aw-unified-content :is(.aw-pinboard, .sticky-board)::before, .aw-unified-content :is(.aw-pinboard, .sticky-board)::after { display: none !important; }
.aw-unified-content :is(.aw-postit-grid, .sticky-board, .bs312-stats) { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; align-items: start; gap: 22px !important; }
.aw-unified-content :is(.aw-postit, .aw-sticky-gold, .sticky-note, .db-sticky, .db-postit, .bb-sticky-modern, .bs312-quote) { position: relative; min-height: 140px; margin: 0 !important; padding: 30px 24px 23px !important; color: #3f433f !important; border: 0 !important; border-radius: 12px !important; background: linear-gradient(135deg, #fff8bf, #ffef99) !important; box-shadow: 0 12px 20px rgba(0,0,0,.1) !important; transform: rotate(-.7deg); }
.aw-unified-content :is(.aw-postit, .aw-sticky-gold, .sticky-note, .db-sticky, .db-postit, .bb-sticky-modern, .bs312-quote)::before { content: "" !important; position: absolute; z-index: 2; top: 10px; left: 50%; width: 18px; height: 18px; margin-left: -9px; display: block !important; border: 0; border-radius: 50%; background: rgba(255,255,255,.84); box-shadow: 0 2px 6px rgba(0,0,0,.18); transform: none; }
.aw-unified-content :is(.aw-postit, .aw-sticky-gold, .sticky-note, .db-sticky, .db-postit, .bb-sticky-modern, .bs312-quote)::after { display: none !important; }
.aw-unified-content :is(.aw-postit, .aw-sticky-gold, .sticky-note, .db-sticky, .db-postit, .bb-sticky-modern, .bs312-quote):nth-child(4n+2) { background: linear-gradient(135deg, #dcf5ec, #c0e9dc) !important; transform: rotate(.7deg); }
.aw-unified-content :is(.aw-postit, .aw-sticky-gold, .sticky-note, .db-sticky, .db-postit, .bb-sticky-modern, .bs312-quote):nth-child(4n+3) { background: linear-gradient(135deg, #ebe6ff, #d6cdf8) !important; transform: rotate(-.5deg); }
.aw-unified-content :is(.aw-postit, .aw-sticky-gold, .sticky-note, .db-sticky, .db-postit, .bb-sticky-modern, .bs312-quote):nth-child(4n+4) { background: linear-gradient(135deg, #ffe5eb, #f9cedb) !important; transform: rotate(.8deg); }

.aw-unified-content :is(.aw-gallery, .aw-gallery-polaroid, .aw-gallery-center, .bb-gallery, .wp-block-gallery, .blocks-gallery-grid) { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important; gap: 18px !important; width: 100%; margin: 30px auto 45px !important; padding: 0 !important; list-style: none; }
.aw-unified-content :is(.aw-gallery, .aw-gallery-polaroid, .aw-gallery-center, .bb-gallery, .wp-block-gallery, .blocks-gallery-grid) > :is(figure, .aw-polaroid, .aw-section) { width: 100% !important; margin: 0 !important; padding: 10px !important; overflow: hidden; border: 0 !important; border-radius: 20px !important; background: linear-gradient(145deg, var(--paper-strong), color-mix(in srgb, var(--accent-soft) 34%, var(--paper-strong))) !important; box-shadow: 0 12px 24px color-mix(in srgb, var(--accent) 10%, transparent) !important; transform: none; }
.aw-unified-content :is(.aw-gallery, .aw-gallery-polaroid, .aw-gallery-center, .bb-gallery, .wp-block-gallery, .blocks-gallery-grid) > :is(figure, .aw-polaroid, .aw-section):hover { transform: translateY(-4px); box-shadow: 0 18px 32px color-mix(in srgb, var(--accent) 15%, transparent) !important; }
.aw-unified-content :is(.aw-gallery, .aw-gallery-polaroid, .aw-gallery-center, .bb-gallery, .wp-block-gallery, .blocks-gallery-grid) img { width: 100% !important; height: 210px !important; margin: 0 !important; object-fit: cover; border: 0 !important; border-radius: 14px !important; box-shadow: none !important; transform: none !important; }
.aw-unified-content figure.wp-block-image:not(.aw-gallery figure) { width: min(760px, 100%) !important; margin: 30px auto 42px !important; padding: 10px; border-radius: 20px; background: var(--paper-strong); box-shadow: 0 12px 24px color-mix(in srgb, var(--accent) 10%, transparent); }
.aw-unified-content figure.wp-block-image:not(.aw-gallery figure) img { width: 100%; height: auto !important; margin: 0; border-radius: 14px; box-shadow: none !important; }
.aw-unified-content :is(.aw-media-flex, .aw-flex-container, .bb-flex-container, .aw-bio-grid) { display: grid !important; grid-template-columns: minmax(220px, .82fr) minmax(0, 1.18fr) !important; align-items: center; gap: 26px; width: 100%; margin: 30px 0 42px !important; padding: 24px !important; border: 1px solid color-mix(in srgb, var(--accent) 32%, var(--line)); border-radius: 24px; background: var(--paper-strong); box-shadow: 0 14px 34px color-mix(in srgb, var(--accent) 10%, transparent); }
.aw-unified-content :is(.aw-media-flex, .aw-flex-container, .bb-flex-container, .aw-bio-grid).reverse, .aw-unified-content .bb-flex-reverse { direction: rtl; }
.aw-unified-content :is(.aw-media-flex, .aw-flex-container, .bb-flex-container, .aw-bio-grid).reverse > *, .aw-unified-content .bb-flex-reverse > * { direction: ltr; }
.aw-unified-content :is(.aw-media-flex, .aw-flex-container, .bb-flex-container, .aw-bio-grid) img { width: 100% !important; height: 260px !important; object-fit: cover; border-radius: 18px !important; }
.aw-unified-content :is(.aw-audio-wrapper, .bb-audio-box) audio { width: min(680px, 100%); }

@media (max-width: 700px) {
  .aw-unified-content { margin-top: 30px; }
  .aw-unified-content :is(.aw-card, .soft-card, .info-box, .db-infobox, .bb-card, .bs312-panel, .bs312-transmission, .bb-disclaimer-box, .bb-audio-box, .aw-bio-box, .aw-verse-box, .hero-box, .aw-auto-card, .aw-pinboard, .sticky-board) { padding: 22px 18px !important; border-radius: 20px !important; }
  .aw-unified-content :is(.aw-heading-box, .aw-quote-box, .bs312-heading, .section-title) { padding: 17px 18px !important; border-radius: 18px !important; }
  .aw-unified-content .aw-columns-card { column-count: 1 !important; column-gap: 0; column-rule: 0; }
  .aw-unified-content :is(.aw-postit-grid, .sticky-board, .bs312-stats, .aw-media-flex, .aw-flex-container, .bb-flex-container, .aw-bio-grid) { grid-template-columns: minmax(0, 1fr) !important; }
  .aw-unified-content :is(.aw-gallery, .aw-gallery-polaroid, .aw-gallery-center, .bb-gallery, .wp-block-gallery, .blocks-gallery-grid) { grid-template-columns: minmax(0, 1fr) !important; }
  .aw-unified-content :is(.aw-gallery, .aw-gallery-polaroid, .aw-gallery-center, .bb-gallery, .wp-block-gallery, .blocks-gallery-grid) img { height: auto !important; max-height: none; }
}