/*
Theme Name: AnyKey Phoenix
Theme URI: https://anykeycafe.com/
Author: Little Phoenix
Description: A compact, reading-first theme for AnyKey Cafe with persistent conversation navigation.
Version: 1.1.2
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.1
License: GNU General Public License v2 or later
Text Domain: anykey-phoenix
*/

:root {
  --ak-ivory: #fbf6e8;
  --ak-paper: #fffdf7;
  --ak-paper-deep: #f4ead4;
  --ak-ink: #25231f;
  --ak-muted: #675f52;
  --ak-gold: #b97914;
  --ak-gold-bright: #e4ad35;
  --ak-gold-pale: #f5d98a;
  --ak-silver: #8b929a;
  --ak-silver-pale: #dfe2e5;
  --ak-wine: #6b2936;
  --ak-teal: #285e62;
  --ak-line: rgba(108, 83, 37, .2);
  --ak-shadow: 0 14px 38px rgba(66, 48, 18, .11);
  --ak-radius: 18px;
  --ak-reading: 76ch;
  --ak-wide: 1180px;
  --ak-header-h: 58px;
  --ak-serif: Georgia, "Times New Roman", serif;
  --ak-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.experiment-fuel {
  margin: 2.4rem 0;
  padding: clamp(1.4rem, 3vw, 2.25rem);
  border: 1px solid rgba(185, 121, 20, .32);
  border-radius: var(--ak-radius);
  background: linear-gradient(135deg, rgba(245, 217, 138, .22), rgba(255, 253, 247, .82));
  box-shadow: var(--ak-shadow);
}
.experiment-fuel h3 { margin-top: .45rem; }
.experiment-fuel-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin: 1.2rem 0 .9rem; }
.experiment-fuel-note { margin-bottom: 0; color: var(--ak-muted); font-size: .88rem; }

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--ak-header-h) + 20px); }
body {
  margin: 0;
  color: var(--ak-ink);
  background-color: var(--ak-ivory);
  background-image:
    radial-gradient(circle at 0 50%, transparent 18px, rgba(185,121,20,.055) 19px, transparent 20px),
    radial-gradient(circle at 100% 50%, transparent 18px, rgba(139,146,154,.05) 19px, transparent 20px),
    radial-gradient(circle at 50% 0, transparent 18px, rgba(185,121,20,.045) 19px, transparent 20px),
    radial-gradient(circle at 50% 100%, transparent 18px, rgba(139,146,154,.045) 19px, transparent 20px);
  background-size: 44px 38px;
  font-family: var(--ak-sans);
  font-size: 17px;
  line-height: 1.7;
  text-rendering: auto;
}

/* Keep refined shaping where it is visible, without imposing it on the long archive. */
h1, h2, h3, h4, h5, h6, .brand-title, .entry-title, .archive-title {
  text-rendering: optimizeLegibility;
}

/* Let supporting browsers skip layout and paint for material far below the viewport. */
@supports (content-visibility: auto) {
  .site-main > .section,
  .entry-card,
  .post-card,
  .trail-card,
  .explore-group {
    content-visibility: auto;
    contain-intrinsic-size: auto 720px;
  }

  .site-main > .hero {
    content-visibility: visible;
  }
}

img { max-width: 100%; height: auto; }
a { color: var(--ak-wine); text-decoration-thickness: .08em; text-underline-offset: .16em; }
a:hover { color: var(--ak-teal); }
button, input, select, textarea { font: inherit; }
:focus-visible { outline: 3px solid var(--ak-gold-bright); outline-offset: 3px; }

.screen-reader-text {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.screen-reader-text:focus {
  width: auto; height: auto; padding: .65rem 1rem; margin: .5rem; clip: auto;
  background: var(--ak-paper); color: var(--ak-ink); z-index: 9999;
}

.reading-progress {
  position: fixed; inset: 0 auto auto 0; height: 3px; width: 100%;
  background: linear-gradient(90deg, var(--ak-gold-bright), var(--ak-silver), var(--ak-wine));
  z-index: 2000; transform: scaleX(0); transform-origin: left center;
  will-change: transform; contain: paint;
}

.site-header {
  position: sticky; top: 0; z-index: 1000;
  min-height: var(--ak-header-h);
  background: rgba(255, 253, 247, .985);
  border-bottom: 1px solid var(--ak-line);
  box-shadow: 0 4px 18px rgba(59, 44, 20, .06);
}
.header-inner {
  width: min(var(--ak-wide), calc(100% - 28px)); min-height: var(--ak-header-h); margin: 0 auto;
  display: flex; align-items: center; gap: 18px;
}
.site-brand { display: inline-flex; align-items: center; gap: 10px; color: var(--ak-ink); text-decoration: none; min-width: max-content; }
.brand-mark { width: 42px; height: 42px; object-fit: contain; filter: drop-shadow(0 3px 5px rgba(99,65,10,.16)); }
.brand-words { display: grid; line-height: 1; }
.brand-title { font-family: var(--ak-serif); font-size: 1.13rem; font-weight: 700; letter-spacing: .01em; }
.brand-kicker { color: var(--ak-muted); font-size: .64rem; letter-spacing: .13em; text-transform: uppercase; margin-top: 4px; }
.primary-nav { margin-left: auto; }
.primary-nav ul { list-style: none; margin: 0; padding: 0; }
.primary-nav .nav-root { display: flex; align-items: center; gap: 2px; }
.primary-nav .nav-root > li { position: relative; }
.primary-nav a, .nav-group-toggle {
  display: block; padding: 8px 11px; border-radius: 999px; color: var(--ak-ink); text-decoration: none;
  font-size: .86rem; font-weight: 680; line-height: 1.25;
}
.nav-group-toggle {
  display: inline-flex; align-items: center; gap: 5px; border: 0; background: transparent; cursor: pointer;
}
.nav-chevron { color: var(--ak-gold); font-size: .82em; transition: transform .16s ease; }
.nav-group.is-open > .nav-group-toggle .nav-chevron { transform: rotate(180deg); }
.primary-nav a:hover, .primary-nav .current-menu-item > a,
.primary-nav .current-menu-ancestor > .nav-group-toggle,
.nav-group-toggle:hover, .nav-group-toggle[aria-expanded="true"] {
  background: rgba(185,121,20,.11); color: var(--ak-wine);
}
.nav-submenu {
  display: none; position: absolute; z-index: 1200; top: calc(100% + 10px); right: 0;
  width: min(440px, calc(100vw - 30px)); grid-template-columns: repeat(2,minmax(0,1fr)); gap: 3px;
  padding: 12px; border: 1px solid var(--ak-line); border-radius: 15px;
  background: rgba(255,253,247,.995); box-shadow: 0 18px 42px rgba(56,41,17,.16);
}
.nav-submenu::before {
  content: ""; position: absolute; right: 24px; top: -6px; width: 11px; height: 11px;
  border-left: 1px solid var(--ak-line); border-top: 1px solid var(--ak-line);
  background: var(--ak-paper); transform: rotate(45deg);
}
.nav-submenu a { padding: 9px 10px; border-radius: 9px; color: var(--ak-muted); font-size: .82rem; }
.nav-submenu a:hover, .nav-submenu .current-menu-item > a { background: rgba(185,121,20,.1); color: var(--ak-wine); }
@media (min-width: 1321px) {
  .nav-group:hover > .nav-submenu, .nav-group:focus-within > .nav-submenu, .nav-group.is-open > .nav-submenu { display: grid; }
}
.nav-toggle {
  display: none; margin-left: auto; border: 1px solid var(--ak-line); border-radius: 999px;
  background: var(--ak-paper); color: var(--ak-ink); padding: 7px 11px; cursor: pointer;
}

.site-main { min-height: 70vh; }
.shell { width: min(var(--ak-wide), calc(100% - 30px)); margin-inline: auto; }
.reading-shell { width: min(var(--ak-reading), calc(100% - 30px)); margin-inline: auto; }

.hero { padding: clamp(30px, 6vw, 74px) 0 clamp(36px, 7vw, 86px); overflow-x: clip; }
.hero-grid { display: grid; grid-template-columns: minmax(270px,.78fr) minmax(0,1.22fr); gap: clamp(28px, 6vw, 76px); align-items: center; }
.hero-art { position: relative; text-align: center; }
.hero-art::before {
  content: ""; position: absolute; inset: 10% 8%; z-index: -1; border-radius: 50%;
  background: radial-gradient(circle, rgba(228,173,53,.22), rgba(223,226,229,.15) 44%, transparent 72%);
  filter: blur(8px);
}
.hero-art img {
  width: min(100%, 460px);
  filter: drop-shadow(0 18px 23px rgba(94,60,9,.17));
  transform-origin: 50% 72%;
  animation: phoenix-arrival 1.05s cubic-bezier(.2,.75,.25,1) both;
}
.hero-art::after {
  content: ""; position: absolute; inset: 7% 12%; pointer-events: none;
  background: linear-gradient(112deg, transparent 38%, rgba(255,255,255,.72) 48%, rgba(245,217,138,.42) 52%, transparent 62%);
  mix-blend-mode: screen; opacity: 0; transform: translateX(-52%) skewX(-10deg);
  animation: phoenix-glint 1.15s .72s ease-out both;
  -webkit-mask: radial-gradient(ellipse at center, #000 20%, transparent 72%);
  mask: radial-gradient(ellipse at center, #000 20%, transparent 72%);
}
@keyframes phoenix-arrival {
  from { opacity: 0; transform: translateY(12px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes phoenix-glint {
  0% { opacity: 0; transform: translateX(-52%) skewX(-10deg); }
  28% { opacity: .34; }
  100% { opacity: 0; transform: translateX(52%) skewX(-10deg); }
}
.eyebrow { color: var(--ak-wine); font-size: .74rem; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.hero h1, .page-title, .entry-title, .archive-title {
  margin: .18em 0 .3em; font-family: var(--ak-serif); line-height: 1.05; color: var(--ak-ink);
}
.hero h1 { font-size: clamp(2.8rem, 7vw, 6rem); letter-spacing: -.045em; }
.hero .lead { max-width: 58ch; margin: 0 0 1.4rem; color: var(--ak-muted); font-family: var(--ak-serif); font-size: clamp(1.08rem, 2.2vw, 1.35rem); }
.hero-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.experiment-note-wrap { position: relative; z-index: 2; margin-top: clamp(-38px,-3vw,-20px); }
.experiment-note {
  display: flex; align-items: center; justify-content: space-between; gap: 18px;
  padding: 14px 18px; border: 1px solid var(--ak-line); border-radius: 14px;
  background: rgba(255,253,247,.91); box-shadow: 0 10px 28px rgba(66,48,18,.08);
  color: var(--ak-muted); font-size: .9rem;
}
.experiment-note strong { color: var(--ak-ink); font-family: var(--ak-serif); }
.experiment-note a { min-width: max-content; font-weight: 800; text-decoration: none; }
.site-progress-note { border-color: rgba(201,169,95,.58); background: linear-gradient(135deg,rgba(253,248,234,.97),rgba(255,255,255,.94)); }
.origin-story { padding-top: clamp(58px,8vw,108px); }
.story-layout { display: grid; grid-template-columns: minmax(230px,.72fr) minmax(0,1.28fr); gap: clamp(32px,7vw,92px); align-items: start; }
.story-heading { position: sticky; top: 110px; }
.story-heading h2 { max-width: 13ch; }
.story-copy { font-family: var(--ak-serif); font-size: clamp(1.06rem,1.6vw,1.22rem); line-height: 1.78; }
.story-copy > p:first-child { margin-top: 0; }
.story-copy strong { color: var(--ak-ink); }
.profile-experiment-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; margin: 1.8rem 0; }
.profile-experiment-grid article { padding: 20px; border: 1px solid rgba(201,169,95,.42); border-radius: 18px; background: rgba(255,255,255,.72); box-shadow: 0 12px 30px rgba(48,39,21,.07); }
.profile-experiment-grid h3 { margin: 0 0 .6rem; font-family: var(--ak-sans); font-size: 1rem; line-height: 1.25; }
.profile-experiment-grid p { margin: 0; font-family: var(--ak-sans); font-size: .9rem; line-height: 1.6; color: var(--ak-muted); }
.unexpected-result { margin: 2rem 0; padding: clamp(22px,4vw,36px); border: 1px solid rgba(201,169,95,.5); border-radius: 22px; background: linear-gradient(145deg,rgba(35,45,42,.96),rgba(54,57,43,.94)); color: rgba(255,255,255,.84); box-shadow: 0 18px 42px rgba(25,29,25,.16); }
.unexpected-result .eyebrow { color: #e8c96f; }
.unexpected-result h3 { margin: .35rem 0 1rem; color: #fff8e7; font-family: var(--ak-serif); font-size: clamp(1.35rem,2.4vw,1.85rem); }
.unexpected-result p { font-family: var(--ak-sans); font-size: .96rem; line-height: 1.7; }
.unexpected-result p:last-child { margin-bottom: 0; }
.story-destination { margin-top: 2rem; padding: clamp(24px,4vw,40px); border-left: 4px solid var(--ak-gold); background: rgba(253,248,234,.72); }
.story-destination .eyebrow { display: block; margin-bottom: .3rem; }
.story-destination h3 { margin: 0 0 1.25rem; font-family: var(--ak-serif); font-size: clamp(1.35rem,2.5vw,1.9rem); }
.story-destination p { font-size: .98em; }
.story-destination p:last-child { margin-bottom: 0; }
.laboratory-statement { position: relative; margin: 2rem 0; padding: clamp(24px,4vw,40px); overflow: hidden; border: 1px solid rgba(201,169,95,.48); border-radius: 22px; background: linear-gradient(145deg,rgba(255,255,255,.9),rgba(244,234,212,.72)); box-shadow: 0 15px 38px rgba(48,39,21,.09); }
.laboratory-statement::after { content: "LAB"; position: absolute; right: -8px; bottom: -28px; color: rgba(185,121,20,.07); font: 900 clamp(5rem,12vw,9rem)/1 var(--ak-sans); letter-spacing: -.08em; pointer-events: none; }
.laboratory-statement .eyebrow { display: block; margin-bottom: .3rem; }
.laboratory-statement h3 { position: relative; z-index: 1; margin: 0 0 1.2rem; font-family: var(--ak-serif); font-size: clamp(1.35rem,2.5vw,1.9rem); }
.laboratory-statement p { position: relative; z-index: 1; font-size: .98em; }
.laboratory-statement p:last-child { margin-bottom: 0; }
.story-links { display: flex; flex-wrap: wrap; gap: 10px 22px; margin-top: 1.7rem; }
.story-links a { font-family: var(--ak-sans); font-size: .94rem; font-weight: 800; text-decoration: none; }
.button, .wp-block-button__link {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 42px;
  border: 1px solid transparent; border-radius: 999px; padding: 9px 17px;
  background: linear-gradient(135deg, #9f5e08, var(--ak-gold-bright)); color: #231605 !important;
  box-shadow: 0 7px 18px rgba(156,96,9,.16); text-decoration: none; font-weight: 800;
}
.button:hover, .wp-block-button__link:hover { transform: translateY(-1px); filter: saturate(1.08); }
.button.secondary { background: rgba(255,255,255,.64); border-color: var(--ak-line); color: var(--ak-ink) !important; box-shadow: none; }

.section { padding: clamp(42px, 7vw, 82px) 0; }
.section + .section { border-top: 1px solid var(--ak-line); }
.section-heading { max-width: 760px; margin-bottom: 26px; }
.section-heading h2 { margin: 0 0 8px; font: 700 clamp(1.85rem,4vw,3rem)/1.12 var(--ak-serif); }
.section-heading p { margin: 0; color: var(--ak-muted); }
.card-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
.trail-card, .post-card {
  position: relative; overflow: hidden; background: rgba(255,253,247,.88); border: 1px solid var(--ak-line);
  border-radius: var(--ak-radius); box-shadow: var(--ak-shadow); padding: 22px;
}
.trail-card::before, .post-card::before {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0;
  background: linear-gradient(118deg, transparent 18%, rgba(245,217,138,.2) 47%, rgba(223,226,229,.18) 53%, transparent 82%);
  transform: translateX(-105%); transition: transform .72s ease, opacity .28s ease;
}
.trail-card:hover::before, .trail-card:focus-within::before,
.post-card:hover::before, .post-card:focus-within::before { opacity: 1; transform: translateX(105%); }
.trail-card, .post-card, .button, .wp-block-button__link { transition: transform .18s ease, box-shadow .18s ease, filter .18s ease; }
.trail-card:hover, .trail-card:focus-within, .post-card:hover, .post-card:focus-within {
  transform: translateY(-2px); box-shadow: 0 18px 44px rgba(66,48,18,.14);
}
.trail-card { min-height: 220px; display: flex; flex-direction: column; }
.trail-card img { width: 104px; height: 104px; object-fit: contain; align-self: flex-end; margin: -10px -6px -24px 0; opacity: .96; }
.trail-card h3, .post-card h2 { margin: 0 0 8px; font: 700 1.35rem/1.18 var(--ak-serif); }
.trail-card p, .post-card p { color: var(--ak-muted); }
.trail-card a::after, .post-card .card-link::after { content: ""; position: absolute; inset: 0; }
.trail-card .arrow { margin-top: auto; color: var(--ak-wine); font-weight: 800; }
.source-chip-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }
.source-chip {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  min-height: 58px; padding: 12px 15px; border: 1px solid var(--ak-line); border-radius: 13px;
  background: rgba(255,253,247,.9); color: var(--ak-ink); font: 700 .98rem/1.25 var(--ak-serif);
  text-decoration: none; box-shadow: 0 6px 18px rgba(66,48,18,.06);
}
.source-chip:hover, .source-chip:focus-visible { color: var(--ak-wine); border-color: rgba(185,121,20,.48); }

.archive-head, .page-head { padding: 40px 0 22px; }
.archive-title, .page-title { font-size: clamp(2.1rem,5vw,4.5rem); }
.section-page-head {
  display: grid; grid-template-columns: minmax(0,1fr) minmax(190px,330px); gap: clamp(22px,5vw,66px);
  align-items: center; min-height: 330px; padding-top: clamp(30px,5vw,64px); padding-bottom: clamp(28px,5vw,60px);
}
.section-page-copy { min-width: 0; }
.fit-section-title { max-width: 100%; white-space: nowrap; }
.section-phoenix-card {
  position: relative; width: min(100%,330px); max-height: 430px; margin: 0; overflow: hidden;
  border: 1px solid rgba(201,169,95,.46); border-radius: 44% 44% 22px 22px / 28% 28% 22px 22px;
  background: linear-gradient(150deg,#37200b,#9b5e0c 55%,#21170e); box-shadow: 0 22px 52px rgba(64,40,8,.2);
  isolation: isolate;
}
.section-phoenix-card::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(112deg,transparent 38%,rgba(255,255,255,.2) 49%,transparent 61%);
  transform: translateX(-110%); animation: section-phoenix-glimmer 1.3s .35s ease-out both;
}
.section-phoenix-card img { display: block; width: 100%; height: 100%; max-height: inherit; object-fit: cover; object-position: 50% 38%; }
.section-phoenix-foundations,.section-phoenix-notebook{background:linear-gradient(150deg,#24180c,#7f4f12 58%,#17120d)}
.section-phoenix-experiments,.section-phoenix-tools{background:linear-gradient(150deg,#37200b,#a7650d 58%,#21170e)}
.section-phoenix-conversations{background:linear-gradient(150deg,#272520,#8d661c 58%,#191716)}
.section-phoenix-studio{background:linear-gradient(150deg,#32160e,#b66c0b 55%,#21100c)}
@keyframes section-phoenix-glimmer{0%{opacity:0;transform:translateX(-110%)}35%{opacity:.7}100%{opacity:0;transform:translateX(110%)}}
@media(max-width:760px){.section-page-head{grid-template-columns:1fr;min-height:0;text-align:center}.section-phoenix-card{justify-self:center;width:min(72vw,310px);max-height:370px}.fit-section-title{white-space:normal!important;font-size:clamp(2.15rem,10vw,4rem)!important}}
@media(prefers-reduced-motion:reduce){.section-phoenix-card::after{animation:none}}
.archive-description, .entry-deck { color: var(--ak-muted); font-family: var(--ak-serif); font-size: 1.08rem; }
.content-grid { display: grid; grid-template-columns: minmax(0,1fr) 280px; gap: 36px; align-items: start; }
.content-grid > *, .entry-card, .entry-content { min-width: 0; max-width: 100%; }
.entry-card { background: rgba(255,253,247,.9); border: 1px solid var(--ak-line); border-radius: var(--ak-radius); box-shadow: var(--ak-shadow); padding: clamp(22px,4vw,46px); }
.entry-title { font-size: clamp(2.05rem,5vw,4.2rem); }
.entry-meta { display: flex; flex-wrap: wrap; gap: 8px 14px; color: var(--ak-muted); font-size: .82rem; margin: 8px 0 28px; }
.entry-content { overflow-wrap: anywhere; font-family: var(--ak-serif); font-size: clamp(1rem,1.3vw,1.12rem); }
.entry-content pre, .entry-content code { overflow-wrap: normal; word-break: normal; }
.entry-content > * { max-width: var(--ak-reading); }
.entry-content h2, .entry-content h3, .entry-content h4 { color: var(--ak-ink); line-height: 1.2; scroll-margin-top: 82px; }
.entry-content h2 { margin-top: 1.8em; font-size: 1.75em; }
.entry-content h3 { margin-top: 1.55em; font-size: 1.35em; }
.entry-content blockquote { margin: 1.6em 0; padding: .5em 0 .5em 1.25em; border-left: 4px solid var(--ak-gold); color: #50483c; }
.entry-content pre { max-width: 100%; overflow: auto; padding: 16px; border-radius: 12px; background: #24221f; color: #f8eed9; font-size: .85rem; }
.entry-content table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; }
.entry-content th, .entry-content td { padding: 9px 11px; border: 1px solid var(--ak-line); }

.conversation-rail { position: sticky; top: calc(var(--ak-header-h) + 18px); display: grid; gap: 14px; }
.rail-panel { background: rgba(255,253,247,.9); border: 1px solid var(--ak-line); border-radius: 15px; padding: 16px; box-shadow: 0 8px 24px rgba(62,47,24,.07); }
.rail-panel h2 { margin: 0 0 10px; font: 700 1rem/1.2 var(--ak-serif); }
.conversation-jump { width: 100%; border: 1px solid var(--ak-line); border-radius: 10px; background: #fff; padding: 9px; color: var(--ak-ink); }
.toc-list, .rail-list { list-style: none; margin: 0; padding: 0; max-height: 40vh; overflow: auto; }
.toc-list li, .rail-list li { margin: 0; border-top: 1px solid rgba(108,83,37,.1); }
.toc-list li:first-child, .rail-list li:first-child { border-top: 0; }
.toc-list a, .rail-list a { display: block; padding: 7px 3px; color: var(--ak-muted); text-decoration: none; font-size: .83rem; line-height: 1.35; }
.toc-list a:hover, .rail-list a:hover { color: var(--ak-wine); }
.toc-list .toc-h3 a { padding-left: 13px; }
.rail-prompt { margin: 8px 0 0; color: var(--ak-muted); font-size: .75rem; }

.conversation-dock { display: none; position: fixed; right: 14px; bottom: 14px; z-index: 1200; }
.dock-button { border: 1px solid var(--ak-line); border-radius: 999px; padding: 10px 14px; background: var(--ak-paper); color: var(--ak-ink); box-shadow: var(--ak-shadow); font-weight: 800; }
.mobile-rail {
  position: fixed; inset: var(--ak-header-h) 0 0 auto; z-index: 1100; width: min(88vw,380px); overflow-y: auto;
  padding: 18px; background: var(--ak-ivory); border-left: 1px solid var(--ak-line); box-shadow: -18px 0 40px rgba(38,31,18,.18);
  visibility: hidden; pointer-events: none; transform: translateX(105%); transition: transform .22s ease, visibility 0s linear .22s;
}
.mobile-rail.is-open { visibility: visible; pointer-events: auto; transform: translateX(0); transition-delay: 0s; }
.mobile-rail .conversation-rail { position: static; }

.posts-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; padding-bottom: 56px; }
.post-card { padding: 22px; }
.post-card .post-meta { color: var(--ak-muted); font-size: .78rem; }
.post-card .card-link { color: var(--ak-ink); text-decoration: none; }
.pagination { display: flex; gap: 7px; justify-content: center; padding: 12px 0 52px; }
.pagination .page-numbers { padding: 7px 11px; border: 1px solid var(--ak-line); border-radius: 999px; background: var(--ak-paper); text-decoration: none; }
.pagination .current { background: var(--ak-gold-pale); }

.explore-layout { padding-bottom: 64px; }
.explore-group { padding: 24px 0 38px; scroll-margin-top: calc(var(--ak-header-h) + 18px); }
.explore-group + .explore-group { border-top: 1px solid var(--ak-line); }
.explore-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px; }
.explore-card { padding: 20px; border: 1px solid var(--ak-line); border-radius: 15px; background: rgba(255,253,247,.9); box-shadow: 0 8px 24px rgba(62,47,24,.06); }
.explore-card h3 { margin: 0 0 7px; font: 700 1.25rem/1.2 var(--ak-serif); }
.explore-card h3 a { color: var(--ak-ink); text-decoration: none; }
.explore-card h3 a:hover { color: var(--ak-wine); }
.explore-card p { margin: 0 0 12px; color: var(--ak-muted); }
.source-link { font-size: .84rem; font-weight: 800; text-decoration: none; }
.complete-link-list { columns: 3 240px; column-gap: 30px; list-style: none; margin: 0; padding: 0; }
.complete-link-list li { break-inside: avoid; margin: 0 0 6px; }
.complete-link-list a { display: block; padding: 7px 9px; border-left: 2px solid rgba(185,121,20,.28); color: var(--ak-muted); text-decoration: none; line-height: 1.3; }
.complete-link-list a:hover { color: var(--ak-wine); border-left-color: var(--ak-gold); background: rgba(255,253,247,.64); }

.site-footer { margin-top: 58px; border-top: 1px solid var(--ak-line); background: rgba(255,253,247,.82); }
.footer-inner { width: min(var(--ak-wide),calc(100% - 30px)); margin: 0 auto; min-height: 108px; display: grid; grid-template-columns: auto 1fr auto; gap: 18px; align-items: center; padding: 18px 0; }
.footer-mark { width: 64px; height: 64px; object-fit: contain; }
.footer-mark-trigger {
  position: relative; width: 68px; height: 68px; margin: 0; padding: 2px; border: 0; border-radius: 50%;
  background: transparent; color: inherit; cursor: pointer; filter: drop-shadow(0 5px 8px rgba(94,60,9,.2));
  transition: transform .2s ease, filter .2s ease, opacity .2s ease;
}
.footer-mark-trigger:hover, .footer-mark-trigger:focus-visible { transform: scale(1.06); filter: drop-shadow(0 7px 13px rgba(185,121,20,.42)); outline: 2px solid var(--ak-gold); outline-offset: 3px; }
.footer-mark-trigger:disabled { cursor: wait; opacity: .58; }
.footer-mark-trigger .footer-mark { display: block; width: 64px; height: 64px; }
.unsigned-phoenix-flight {
  position: fixed; left: var(--ak-flight-left); top: var(--ak-flight-top); width: var(--ak-flight-size); height: var(--ak-flight-size);
  z-index: 10001; pointer-events: none; transform-origin: center; animation: unsigned-phoenix-takeoff 900ms cubic-bezier(.2,.82,.2,1) forwards;
}
.unsigned-phoenix-flight::after {
  content: ""; position: absolute; left: 46%; top: 70%; width: 32%; height: 95%; border-radius: 50%;
  background: linear-gradient(to bottom, rgba(255,247,130,.94), rgba(255,114,0,.78) 38%, transparent 84%);
  filter: blur(7px); transform: rotate(-18deg); animation: unsigned-flame-flicker 130ms ease-in-out infinite alternate; z-index: -1;
}
.unsigned-phoenix-flight img { display: block; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 0 9px #ffd54a) drop-shadow(0 0 19px rgba(255,91,0,.72)); }
@keyframes unsigned-phoenix-takeoff {
  0% { transform: translate3d(0,0,0) scale(1) rotate(0); opacity: 1; }
  60% { opacity: 1; }
  100% { transform: translate3d(clamp(170px,34vw,430px),clamp(-430px,-45vh,-240px),0) scale(.58) rotate(12deg); opacity: 0; }
}
@keyframes unsigned-flame-flicker { from { transform: rotate(-16deg) scaleX(.8); opacity: .72; } to { transform: rotate(-21deg) scaleX(1.18); opacity: 1; } }
.unsigned-maker-mark {
  position: fixed; inset: 0; z-index: 10000; display: grid; place-items: center; padding: 22px; pointer-events: none;
  visibility: hidden; opacity: 0; overflow: hidden;
}
.unsigned-maker-mark-glow { position: absolute; width: min(760px,95vw); aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle,rgba(255,247,215,.74),rgba(255,196,69,.16) 42%,transparent 70%); filter: blur(10px); }
.unsigned-maker-mark img { position: relative; display: block; width: min(560px,88vw,72vh); height: auto; filter: drop-shadow(0 20px 26px rgba(56,25,0,.28)); }
.unsigned-maker-mark.is-visible { visibility: visible; animation: unsigned-mark-reveal 500ms ease-out forwards; }
.unsigned-maker-mark.is-visible img { animation: unsigned-mark-settle 620ms cubic-bezier(.16,.85,.25,1) forwards; }
.unsigned-maker-mark.is-closing { visibility: visible; animation: unsigned-mark-close 700ms ease-in forwards; }
@keyframes unsigned-mark-reveal { from { opacity: 0; } to { opacity: 1; } }
@keyframes unsigned-mark-settle { from { transform: translateY(26px) scale(.91); filter: blur(4px) drop-shadow(0 20px 26px rgba(56,25,0,.28)); } to { transform: translateY(0) scale(1); filter: blur(0) drop-shadow(0 20px 26px rgba(56,25,0,.28)); } }
@keyframes unsigned-mark-close { from { opacity: 1; transform: scale(1); } to { opacity: 0; transform: scale(.97); } }
.footer-copy { text-align: center; color: var(--ak-muted); font-size: .8rem; }
.site-credit { display: inline-block; margin: .32rem 0 .18rem; color: var(--ak-ink); font-family: var(--ak-serif); font-style: italic; letter-spacing: .01em; }
.footer-nav { display: flex; gap: 12px; flex-wrap: wrap; justify-content: flex-end; }
.footer-nav a { color: var(--ak-muted); text-decoration: none; font-size: .8rem; }

+/* Chats collection landing page. Kept in the theme so WordPress does not print CSS as article text. */
#chats-intro {
  position: relative; overflow: hidden; margin: 0 0 2em; border-radius: 14px;
  background: radial-gradient(ellipse at 50% -10%, #0f1420 0%, #0a0d12 60%); color: #e9e6df;
  -webkit-font-smoothing: antialiased;
}
#chats-intro * { box-sizing: border-box; }
#chats-intro .ci-wrap { position: relative; z-index: 1; max-width: 720px; margin: 0 auto; padding: clamp(42px,5vw,72px) clamp(24px,6vw,72px); }
#chats-intro header { text-align: center; }
#chats-intro .ci-eyebrow { display: inline-block; margin-bottom: 1.4rem; color: rgba(212,175,110,.72); font-size: .72rem; letter-spacing: .32em; text-transform: uppercase; }
#chats-intro h2 { margin: 0 0 1.2rem; color: #e9e6df; font: 400 clamp(2rem,6vw,3rem)/1.08 var(--ak-serif); letter-spacing: .02em; }
#chats-intro h2 em { color: #d4af6e; }
#chats-intro .ci-lede { max-width: 56ch; margin: 0 auto; color: #b4bac4; font: 1.05rem/1.75 var(--ak-serif); }
.ai-selector { margin: 2.5rem 0; }
.ai-selector-label { margin: 0 0 1rem; color: #8b6334; font: 700 .85rem/1.4 var(--ak-serif); letter-spacing: .14em; text-align: center; text-transform: uppercase; }
.ai-card-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 1.1rem; }
.ai-card { display: flex; min-height: 150px; flex-direction: column; align-items: center; justify-content: center; gap: .65rem; padding: 1.5rem 1rem; background: #fff; box-shadow: rgba(34,56,101,.04) 0 12px 18px -6px; text-decoration: none; transition: transform .18s ease,box-shadow .18s ease; }
.ai-card:hover, .ai-card:focus-visible { transform: translateY(-3px); box-shadow: rgba(34,56,101,.10) 0 16px 24px -6px; }
.ai-card-badge { display: flex; width: 52px; height: 52px; align-items: center; justify-content: center; border: 1px solid rgba(185,121,20,.58); border-radius: 50%; background: radial-gradient(circle,rgba(212,175,110,.22),rgba(212,175,110,.08)); color: #825f28; font: 700 1rem/1 var(--ak-serif); }
.ai-card-name { color: var(--ak-ink); font: 1rem/1.3 var(--ak-serif); text-align: center; }
@media (max-width: 900px) { .ai-card-grid { grid-template-columns: repeat(3,minmax(0,1fr)); } }
@media (max-width: 560px) { .ai-card-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }

@media (max-width: 1320px) {
  .primary-nav { display: none; position: absolute; top: calc(100% + 1px); left: 0; right: 0; margin: 0; padding: 10px 15px 14px; background: rgba(255,253,247,.98); border-bottom: 1px solid var(--ak-line); }
  .primary-nav.is-open { display: block; }
  .primary-nav .nav-root { display: grid; gap: 2px; }
  .primary-nav .nav-root > li { width: 100%; }
  .primary-nav a, .nav-group-toggle { width: 100%; border-radius: 9px; padding: 10px 12px; text-align: left; }
  .nav-group-toggle { justify-content: space-between; }
  .nav-submenu { position: static; width: auto; margin: 3px 0 8px 12px; grid-template-columns: repeat(2,minmax(0,1fr)); box-shadow: none; border-radius: 11px; }
  .nav-submenu::before { display: none; }
  .nav-group.is-open > .nav-submenu { display: grid; }
  .nav-toggle { display: inline-flex; }
}

@media (max-width: 900px) {
  .content-grid { grid-template-columns: 1fr; }
  .content-grid > .conversation-rail { display: none; }
  .conversation-dock { display: block; }
  .card-grid { grid-template-columns: 1fr 1fr; }
  .source-chip-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .explore-grid { grid-template-columns: 1fr; }
}

@media (max-width: 782px) {
  body.admin-bar #wpadminbar { width: 100% !important; min-width: 0 !important; max-width: 100vw; overflow-x: clip; }
  body.admin-bar #wpadminbar #wp-admin-bar-my-account .display-name { display: none !important; }
}

@media (max-width: 680px) {
  :root { --ak-header-h: 54px; }
  body { font-size: 16px; }
  .header-inner { width: min(100% - 18px,var(--ak-wide)); gap: 8px; }
  .brand-mark { width: 38px; height: 38px; }
  .brand-kicker { display: none; }
  .nav-submenu { grid-template-columns: 1fr; }
  .hero { padding-top: 18px; }
  .hero-grid { grid-template-columns: 1fr; gap: 12px; }
  .hero-art { order: -1; }
  .hero-art img { width: min(72vw,330px); }
  .hero-copy { text-align: center; }
  .hero .lead { margin-inline: auto; }
  .hero-actions { justify-content: center; }
  .experiment-note-wrap { margin-top: -20px; }
  .experiment-note { display: block; text-align: center; }
  .experiment-note a { display: inline-block; margin-top: 8px; }
  .story-layout { grid-template-columns: 1fr; gap: 18px; }
  .story-heading { position: static; }
  .story-heading h2 { max-width: none; }
  .profile-experiment-grid { grid-template-columns: 1fr; }
  .card-grid, .posts-grid { grid-template-columns: 1fr; }
  .source-chip-grid { grid-template-columns: 1fr; }
  .entry-card { border-radius: 13px; padding: 21px 17px; }
  .footer-inner { grid-template-columns: auto 1fr; }
  .footer-mark { width: 52px; height: 52px; }
  .footer-mark-trigger { width: 56px; height: 56px; }
  .footer-mark-trigger .footer-mark { width: 52px; height: 52px; }
  .footer-copy { text-align: left; }
  .footer-nav { grid-column: 1 / -1; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
  .hero-art::after, .trail-card::before, .post-card::before { display: none; }
  .unsigned-phoenix-flight { display: none; }
  .unsigned-maker-mark.is-visible, .unsigned-maker-mark.is-closing, .unsigned-maker-mark.is-visible img { animation: none; }
  .unsigned-maker-mark.is-visible { visibility: visible; opacity: 1; }
  .unsigned-maker-mark.is-closing { opacity: 0; }
}

/* Forum skin: bring wpForo/bbPress surfaces into the Phoenix reading room. */
#af-wrapper,
#wpforo-wrap,
.wpforo-wrap,
#bbpress-forums {
  --wpf-color-primary: #9a681a;
  --wpf-color-secondary: #d4af6e;
  color: var(--ak-ink);
  font-family: var(--ak-sans);
}
#af-wrapper #forum-header,
#af-wrapper #forum-navigation,
#af-wrapper .title-element,
#af-wrapper .forum-menu,
#af-wrapper .forum-button,
#wpforo-wrap .wpforo-category,
#wpforo-wrap .wpf-head-bar,
#wpforo-wrap .wpf-button,
#bbpress-forums .bbp-header,
#bbpress-forums button,
#bbpress-forums .button {
  border-color: rgba(154,104,26,.34) !important;
  background: linear-gradient(135deg,#6f4814,#a8731c) !important;
  color: #fffaf0 !important;
}
#af-wrapper .content-container,
#af-wrapper .content-element,
#af-wrapper .notices-panel,
#wpforo-wrap .wpforo-forum,
#wpforo-wrap .wpforo-topic,
#bbpress-forums ul.bbp-forums,
#bbpress-forums ul.bbp-topics,
#bbpress-forums ul.bbp-replies {
  border-color: rgba(154,104,26,.22) !important;
  background: rgba(255,253,247,.94) !important;
  box-shadow: 0 12px 28px rgba(66,48,18,.08);
}
#af-wrapper a,
#wpforo-wrap a,
#bbpress-forums a { color: #795014; }
#af-wrapper a:hover,
#af-wrapper a:focus-visible,
#wpforo-wrap a:hover,
#wpforo-wrap a:focus-visible,
#bbpress-forums a:hover,
#bbpress-forums a:focus-visible { color: #b06f08; }
.footer-copy small { display: inline-block; max-width: 68ch; margin-top: .35rem; color: color-mix(in srgb,var(--ak-muted) 88%,#6f4814); line-height: 1.45; }
.workshop-index { border-top: 1px solid rgba(154,104,26,.22); }
.workshop-disclosure { border: 1px solid rgba(154,104,26,.24); border-radius: 14px; background: rgba(255,253,247,.8); }
.workshop-disclosure summary { cursor: pointer; padding: 1rem 1.2rem; color: #795014; font-weight: 700; }
.workshop-disclosure[open] summary { border-bottom: 1px solid rgba(154,104,26,.18); }
.workshop-disclosure .complete-link-list { padding: 1rem 1.2rem 1.2rem; }


/* Music archive: compact vertical video previews */
.page-id-1669 .entry-content figure.wp-block-video {
  width: min(200px, 100%);
  margin: 1.15rem auto .65rem;
  padding: .45rem;
  border: 1px solid rgba(185, 121, 20, .28);
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(255,253,247,.96), rgba(244,234,212,.72));
  box-shadow: 0 10px 26px rgba(66, 48, 18, .10);
}
.page-id-1669 .entry-content figure.wp-block-video video {
  display: block;
  width: 100% !important;
  height: 220px !important;
  max-height: 220px;
  object-fit: contain;
  border-radius: 11px;
  background: #090909;
}
@media (max-width: 520px) {
  .page-id-1669 .entry-content figure.wp-block-video {
    width: min(180px, 58vw);
  }
  .page-id-1669 .entry-content figure.wp-block-video video {
    height: 200px !important;
  }
}

.page-id-1669 .entry-content .wp-video,
.page-id-1669 .entry-content .mejs-container.mejs-video {
  width: min(200px, 100%) !important;
  height: 220px !important;
  margin: 1.15rem auto .65rem;
  border-radius: 16px;
  overflow: hidden;
  background: #090909;
  box-shadow: 0 10px 26px rgba(66, 48, 18, .12);
}
.page-id-1669 .entry-content .mejs-container.mejs-video .mejs-inner,
.page-id-1669 .entry-content .mejs-container.mejs-video .mejs-mediaelement,
.page-id-1669 .entry-content .mejs-container.mejs-video video {
  width: 100% !important;
  height: 220px !important;
  max-height: 220px !important;
}
.page-id-1669 .entry-content .mejs-container.mejs-video video {
  object-fit: contain;
}
.page-id-1669 .entry-content .mejs-container.mejs-video .mejs-controls {
  width: 100% !important;
}
@media (max-width: 520px) {
  .page-id-1669 .entry-content .wp-video,
  .page-id-1669 .entry-content .mejs-container.mejs-video,
  .page-id-1669 .entry-content .mejs-container.mejs-video .mejs-inner,
  .page-id-1669 .entry-content .mejs-container.mejs-video .mejs-mediaelement,
  .page-id-1669 .entry-content .mejs-container.mejs-video video {
    width: min(180px, 58vw) !important;
    height: 200px !important;
  }
}


/* Conversation provenance */
.ak-conversation-intro {
  position: relative;
  margin-bottom: 2rem;
  padding: clamp(1.25rem, 3vw, 2.25rem);
  border: 1px solid rgba(185, 121, 20, .24);
  border-radius: 22px;
  background:
    radial-gradient(circle at 92% 8%, rgba(228,173,53,.16), transparent 32%),
    linear-gradient(145deg, rgba(255,253,247,.98), rgba(244,234,212,.78));
  box-shadow: var(--ak-shadow);
}
.ak-conversation-intro .ak-kicker {
  margin: 0 0 .55rem;
  color: var(--ak-wine);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .16em;
}
.ak-conversation-intro h2 {
  margin-top: 0;
  text-wrap: balance;
}
.ak-credit-card {
  margin-top: 1.35rem;
  padding: 1rem 1.2rem;
  border-left: 4px solid var(--ak-gold);
  border-radius: 4px 14px 14px 4px;
  background: rgba(255,255,255,.62);
}
.ak-credit-card h3 { margin: 0 0 .55rem; }
.ak-credit-card ul { margin-bottom: 0; }
.ak-credit-card li + li { margin-top: .28rem; }

/* Music catalog cards */
.ak-music-catalog{display:grid;gap:1.35rem}.ak-music-intro{margin-bottom:.35rem;padding:clamp(1.2rem,3vw,2rem);border:1px solid rgba(185,121,20,.22);border-radius:20px;background:radial-gradient(circle at 92% 10%,rgba(228,173,53,.17),transparent 34%),rgba(255,253,247,.8)}.ak-music-intro .ak-kicker{margin:0 0 .4rem;color:var(--ak-wine);font-size:.76rem;font-weight:800;letter-spacing:.16em}.ak-music-intro h2{margin:0 0 .55rem}.ak-music-intro p:last-child{margin-bottom:0}
.ak-song-card{overflow:hidden;border:1px solid rgba(108,83,37,.2);border-radius:20px;background:rgba(255,253,247,.93);box-shadow:0 10px 28px rgba(66,48,18,.09)}.ak-song-head{display:flex;align-items:center;gap:.9rem;padding:.9rem 1.05rem .8rem;border-bottom:1px solid rgba(108,83,37,.14)}.ak-song-head h2{margin:0;font-size:clamp(1.25rem,2.5vw,1.7rem);line-height:1.16}.ak-song-head p{margin:.2rem 0 0;color:var(--ak-muted);font-size:.84rem}.ak-track-no{flex:0 0 auto;display:grid;place-items:center;width:2.5rem;height:2.5rem;border:1px solid rgba(185,121,20,.32);border-radius:50%;color:var(--ak-wine);font:700 .78rem/1 var(--ak-serif);background:var(--ak-gold-pale)}
.ak-song-media{display:grid;grid-template-columns:200px minmax(0,1fr);align-items:center;gap:clamp(1rem,3vw,2rem);padding:1rem 1.15rem}.ak-song-video{width:200px;padding:7px;border-radius:15px;background:#090909;box-shadow:0 8px 20px rgba(20,15,8,.2)}.ak-song-video video{display:block;width:186px!important;height:248px!important;margin:0;border-radius:9px;object-fit:contain;background:#090909}.ak-song-listen{min-width:0}.ak-song-listen>span{display:block;margin-bottom:.5rem;color:var(--ak-wine);font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.ak-song-listen audio{display:block;width:min(100%,390px);height:40px;margin:0}
.ak-song-notes{display:grid;grid-template-columns:1.2fr 1fr;gap:.8rem 1.25rem;padding:.9rem 1.15rem 1.05rem;border-top:1px solid rgba(108,83,37,.14);background:linear-gradient(135deg,rgba(244,234,212,.6),rgba(255,255,255,.5))}.ak-song-notes p{margin:0;color:var(--ak-muted);font-size:.9rem}.ak-song-notes strong{color:var(--ak-ink)}.ak-song-source{grid-column:1/-1;width:fit-content;font-size:.86rem;font-weight:700}
@media(max-width:680px){.ak-song-media{grid-template-columns:1fr;justify-items:center}.ak-song-listen{width:100%}.ak-song-listen>span{text-align:center}.ak-song-listen audio{width:min(100%,360px);margin-inline:auto}.ak-song-notes{grid-template-columns:1fr}.ak-song-source{grid-column:1}}
