/* Production adaptation of the MotionSites Nimbus and Liquid Glass patterns. */
.motion-group { position:relative; isolation:isolate; }
@media(max-width:699px){.bottom-nav.motion-group{position:fixed}}
.motion-group > :is(button,a) { position:relative; z-index:1; }
.motion-group > .selection-indicator,.motion-group > .hover-indicator { position:absolute; inset:0 auto auto 0; z-index:0; pointer-events:none; border-radius:12px; transition:transform 350ms cubic-bezier(.2,.8,.2,1),width 250ms,height 250ms,opacity 180ms; }
.motion-group > .selection-indicator { background:var(--primary-container); }
.motion-group > .hover-indicator { background:color-mix(in srgb,var(--primary) 9%,transparent); outline:1px solid color-mix(in srgb,var(--primary) 15%,transparent); }
.motion-group.nav-list > .selection-indicator { background:var(--high); border-radius:28px; }
.motion-group.nav-list > .hover-indicator { border-radius:28px; }
.motion-group.bottom-nav > :is(.hover-indicator,.selection-indicator) { border-radius:20px; }
.motion-group[data-motion-nav] > :is(.filter-chip.active,[aria-pressed="true"],[aria-selected="true"],.nav-item.active) { background:transparent; }
.filter-chip[aria-pressed="true"] { color:var(--on-primary-container); font-weight:650; border-color:transparent; }
.motion-group > :is(button,a):hover { background:transparent; }
:is(.nav-item,.filter-chip,.menu-row,.source-link,.icon-button,.tiny-button,.topic-link) { transition:background 180ms,color 180ms,box-shadow 220ms,transform 240ms cubic-bezier(.2,.8,.2,1); }
:is(.nav-item,.menu-row,.source-link):hover svg { transform:translateX(3px); }
:is(.icon-button,.filter-chip,.tiny-button,.topic-link):active { transform:scale(.95); }
:is(.primary-button,.publish-button) { translate:var(--magnetic-x,0px) var(--magnetic-y,0px); transition:translate 180ms ease-out,background 180ms,box-shadow 180ms,transform 180ms; }
.icon-button:hover svg { transform:rotate(-8deg) scale(1.08); }
svg.icon { transition:transform 220ms; }
.request-card,.order-card,.admin-stats > div,.form-aside { transition:transform 260ms,box-shadow 260ms,border-color 260ms; }
.request-card:hover,.order-card:hover,.admin-stats > div:hover { transform:translateY(-3px); box-shadow:var(--shadow); border-color:var(--primary); }
.admin-row { transition:background 180ms,translate 200ms; }
.admin-row:hover { background:var(--container); translate:2px 0; }
.form-grid label { transition:color 180ms; }
.form-grid label:focus-within { color:var(--primary); }

/* Full cover images stay legible and never stretch or crop to fill a card. */
.mini-book.has-cover { padding:0 !important; background:transparent; border:0; box-shadow:3px 3px 0 #dcdedc,5px 5px 0 #a8ada9,8px 12px 18px #14274430; }
.mini-book.has-cover::before { z-index:2; }
.mini-book.has-cover::after { z-index:2; background:linear-gradient(115deg,#fff3,transparent 30%,#fff0 70%,#fff1); }
.book-cover-image { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; border-radius:inherit; background:var(--card); }
.cover-fallback { position:absolute; inset:0; padding:14px 11px; background:var(--cover); color:var(--cover-ink); display:flex; flex-direction:column; }
.cover-fallback small { font-size:8px; letter-spacing:0; }
.cover-fallback strong { font-size:13px; }
.cover-fallback em { font-size:8px; }
.cover-fallback[hidden] { display:none; }
.cover-credit { font-size:11px; line-height:1.7; color:var(--muted); margin-top:15px; }
.cover-credit a { color:var(--primary); text-decoration:underline; text-underline-offset:3px; }
.cover-credit .icon { display:inline; width:12px; height:12px; vertical-align:middle; }

.ambient-surface { position:relative; isolation:isolate; overflow:hidden; }
.page-intro.ambient-surface { border-radius:24px; padding:24px 28px; }
.page-intro .site-ambient { opacity:.25; }
.site-ambient { position:absolute; inset:-25%; pointer-events:none; z-index:-1; opacity:.55; background:radial-gradient(ellipse at 20% 30%,#8bb9ee70,transparent 48%),radial-gradient(ellipse at 85% 80%,#baaddf70,transparent 50%); animation:site-ambient-drift 17s ease-in-out infinite alternate; }
html[data-ambience="sunset"] .site-ambient { background:radial-gradient(ellipse at 20% 30%,#e3b28775,transparent 48%),radial-gradient(ellipse at 85% 80%,#d5a1b575,transparent 50%); }
html[data-ambience="neon"] .site-ambient { background:radial-gradient(ellipse at 20% 30%,#76baa775,transparent 48%),radial-gradient(ellipse at 85% 80%,#84a7de80,transparent 50%); }
[data-theme="dark"] .site-ambient { opacity:.22; }
.hero-card::before { display:none; }
@keyframes site-ambient-drift { from { transform:translate3d(-3%,-2%,0) rotate(-4deg); } to { transform:translate3d(4%,3%,0) rotate(5deg); } }
.appearance-options { display:grid; gap:18px; margin-top:22px; }
.appearance-options h3 { margin-bottom:10px; font-size:14px; }
.appearance-options p { font-size:12px; color:var(--muted); }

.topic-strip { display:flex; gap:12px; align-items:center; margin:20px 0 8px; min-width:0; }
.topic-marquee { overflow:hidden; flex:1; min-width:0; border-block:1px solid var(--outline); mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent); }
.topic-track { display:flex; width:max-content; animation:site-topic-travel 35s linear infinite; }
.topic-group { display:flex; flex-shrink:0; align-items:center; padding:9px 0; }
.topic-link { padding:9px 18px; display:inline-flex; align-items:center; gap:12px; font-size:13px; color:var(--primary); white-space:nowrap; border-radius:24px; }
.topic-link::before { content:"✳"; color:var(--green); font-size:17px; }
.topic-link:hover { background:var(--primary-container); }
.topic-marquee:hover .topic-track,.topic-marquee:focus-within .topic-track,.topic-marquee[data-paused="true"] .topic-track { animation-play-state:paused; }
.topic-marquee:focus-within,.topic-marquee[data-paused="true"] { overflow-x:auto; mask-image:none; }
.topic-marquee:focus-within .topic-track,.topic-marquee[data-paused="true"] .topic-track { animation-name:none; transform:none; }
.topic-marquee:focus-within .topic-group[aria-hidden],.topic-marquee[data-paused="true"] .topic-group[aria-hidden] { display:none; }
@keyframes site-topic-travel { to { transform:translateX(-50%); } }
.topic-pause { flex-shrink:0; font-size:11px; padding:8px 10px; }

.reading-paths { height:210svh; position:relative; margin:40px 0; }
.reading-frame { position:sticky; top:20px; height:min(760px,calc(100svh - 40px)); min-height:520px; display:grid; grid-template-columns:minmax(180px,.7fr) minmax(0,1.3fr); gap:30px; align-items:center; }
.reading-intro h2 { font-size:clamp(26px,3vw,38px); line-height:1.35; margin:14px 0; text-wrap:balance; }
.reading-intro p { font-size:13px; color:var(--muted); line-height:1.9; }
.reading-tabs { display:grid; gap:8px; margin-top:24px; }
.reading-tabs button { border-radius:12px; padding:13px 16px; text-align:left; color:var(--muted); }
.reading-tabs [aria-selected="true"] { color:var(--on-primary-container); font-weight:650; }
.reading-stack { height:470px; position:relative; overflow:hidden; border-radius:24px; }
.reading-card { position:absolute; inset:0; background:var(--card); border:1px solid var(--outline); border-radius:22px; overflow:hidden; transform:translateY(var(--path-y,100%)); clip-path:inset(0 0 var(--path-clip,0px) 0); }
.reading-card > h3 { padding:15px 24px; height:54px; font-size:14px; border-bottom:1px solid var(--outline); color:var(--primary); }
.reading-card-body { padding:25px; display:grid; grid-template-columns:minmax(0,1fr) 112px; gap:22px; align-items:center; }
.reading-card-body h4 { font-size:23px; font-weight:600; margin:0 0 10px; text-wrap:balance; }
.reading-card-body p { font-size:12px; color:var(--muted); line-height:1.8; }
.reading-card-body .mini-book { width:108px; height:150px; }
.reading-card .path-action { margin-top:18px; font-size:12px; padding-inline:15px; }
.reading-cover { display:grid; place-items:center; perspective:800px; }
.reading-cover:hover .mini-book { transform:rotate(0) translateY(-6px); }

.exchange-guide { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin:24px 0; }
.guide-card { padding:22px; border-radius:20px; border:1px solid var(--glass-edge); background:linear-gradient(145deg,var(--glass-surface),color-mix(in srgb,var(--card) 75%,transparent)); backdrop-filter:blur(12px); transition:transform 250ms,box-shadow 250ms; }
.guide-card:hover { transform:translateY(-5px); box-shadow:var(--shadow); }
.guide-card small { color:var(--primary); font-size:11px; letter-spacing:.08em; }
.guide-card h3 { margin:10px 0; font-size:17px; }
.guide-card p { font-size:12px; line-height:1.8; color:var(--muted); }
.guide-layers { height:95px; position:relative; margin-top:18px; }
.guide-layer { position:absolute; width:65%; padding:14px; border:1px solid var(--outline); background:color-mix(in srgb,var(--primary-container) 75%,transparent); border-radius:12px; font-size:12px; color:var(--primary); transition:transform 300ms; }
.guide-layer:last-child { right:0; top:25px; background:color-mix(in srgb,var(--green-container) 85%,transparent); color:var(--green); transform:rotate(5deg); }
.guide-card:hover .guide-layer:first-child { transform:translateY(-4px) rotate(-3deg); }
.guide-card:hover .guide-layer:last-child { transform:translateY(4px) rotate(9deg); }
.site-faq { margin:30px 0; border:1px solid var(--outline); border-radius:22px; background:color-mix(in srgb,var(--card) 70%,transparent); padding:8px 24px; }
.site-faq h2 { font-size:20px; padding:15px 0; }
.site-faq details + details { border-top:1px solid var(--outline); }
.site-faq summary { list-style:none; display:flex; justify-content:space-between; gap:12px; cursor:pointer; padding:18px 0; font-size:14px; }
.site-faq summary::-webkit-details-marker { display:none; }
.site-faq summary::after { content:"+"; font-size:22px; color:var(--primary); transition:transform 220ms; }
.site-faq details[open] summary::after { transform:rotate(45deg); }
.site-faq details > div { padding:0 0 20px; font-size:13px; line-height:1.9; color:var(--muted); }
.number-animation { font-variant-numeric:tabular-nums; }
.admin-book-title { min-width:0; display:flex; align-items:center; gap:14px; text-align:left; padding:0; border-radius:8px; }
.admin-book-title .mini-book { width:34px; height:48px; flex-shrink:0; transform:rotate(-3deg); }
.admin-book-title:hover .mini-book { transform:rotate(0) translateY(-2px); }
.request-book-heading { display:flex; align-items:center; gap:16px; margin:18px 0; }
.request-book-heading .mini-book { width:48px; height:67px; flex-shrink:0; }
.request-book-heading h3 { margin:0; }
.request-book-heading button { padding:0; flex-shrink:0; border-radius:5px; }
.request-book-heading button:hover .mini-book { transform:rotate(0) translateY(-3px); }
html[data-motion="quiet"] .site-ambient,html[data-motion="quiet"] .topic-track { animation:none; }
html[data-motion="quiet"] :is(.primary-button,.publish-button,.admin-row) { translate:none; }
html[data-motion="quiet"] .reading-paths { height:auto; }
html[data-motion="quiet"] .reading-frame { position:static; height:auto; min-height:0; }
html[data-motion="quiet"] .reading-card { transform:none !important; clip-path:none !important; }
html[data-motion="quiet"] .reading-card:not(.active) { display:none; }
.document-hidden :is(.site-ambient,.topic-track) { animation-play-state:paused; }
@media (max-width:1023px) { .exchange-guide { gap:12px; } .guide-card { padding:17px; } .reading-frame { gap:20px; grid-template-columns:180px minmax(0,1fr); } .reading-card-body { gap:12px; padding:20px; grid-template-columns:minmax(0,1fr) 85px; } .reading-card-body .mini-book { width:78px; height:115px; } .reading-card-body h4 { font-size:20px; } }
@media (max-width:699px) {
 .page-intro.ambient-surface { padding:20px; }
 .admin-row .admin-book-title { grid-column:1; grid-row:auto; gap:10px; }
 .admin-book-title .mini-book { width:29px; height:41px; }
 .reading-paths { height:auto; margin:32px 0; }
 .reading-frame { position:static; height:auto; min-height:0; grid-template-columns:1fr; gap:18px; }
 .reading-intro h2 { font-size:26px; margin:10px 0; }
 .reading-tabs { display:flex; flex-wrap:wrap; margin-top:16px; gap:6px; }
 .reading-tabs button { flex:1; padding:11px 8px; text-align:center; font-size:12px; }
 .reading-stack { height:320px; }
 .reading-card { transform:none !important; clip-path:none !important; }
 .reading-card:not(.active) { display:none; }
 .reading-card-body { padding:22px 20px; grid-template-columns:minmax(0,1fr) 82px; }
 .reading-card > h3 { font-size:13px; padding:15px 20px; }
 .reading-card-body h4 { font-size:20px; }
 .reading-card .path-action { font-size:11px; }
 .exchange-guide { grid-template-columns:1fr; }
 .guide-card { padding:20px; }
 .guide-layers { max-width:280px; }
 .site-faq { padding:8px 18px; }
 .topic-strip { gap:4px; }
 .topic-link { font-size:12px; padding:9px 12px; }
 .topic-pause { font-size:10px; }
}
@media (hover:none),(pointer:coarse) { :is(.primary-button,.publish-button) { translate:none !important; } }
@media (prefers-reduced-motion:reduce) {
 .site-ambient,.topic-track { animation:none; }
 :is(.primary-button,.publish-button,.admin-row) { translate:none !important; }
 .reading-paths { height:auto; } .reading-frame { position:static; height:auto; min-height:0; }
 .reading-card { transform:none !important; clip-path:none !important; } .reading-card:not(.active) { display:none; }
}