/* The Tapestry of Us — Design System Cleanup Layer
   Purpose: one small shared source for typography, spacing, cards, buttons, breadcrumbs and mobile rhythm.
   It intentionally loads after older build CSS so legacy pages keep their personality but follow the same scale. */
:root{
  --tou-bg:#120c14; --tou-ink:#fff7e8; --tou-muted:rgba(255,247,232,.76);
  --tou-gold:#d7b46a; --tou-gold-soft:rgba(215,180,106,.18); --tou-border:rgba(215,180,106,.30);
  --tou-panel:rgba(255,247,232,.065); --tou-panel-strong:rgba(25,15,24,.92);
  --tou-radius-lg:30px; --tou-radius-md:20px; --tou-radius-sm:13px;
  --tou-shadow:0 22px 75px rgba(0,0,0,.34);
  --tou-content:1180px;
  --tou-step--1:clamp(.84rem,.78rem + .18vw,.95rem);
  --tou-step-0:clamp(.96rem,.91rem + .22vw,1.06rem);
  --tou-step-1:clamp(1.15rem,1.02rem + .55vw,1.45rem);
  --tou-step-2:clamp(1.45rem,1.16rem + 1.15vw,2.15rem);
  --tou-step-3:clamp(1.9rem,1.45rem + 2vw,3.35rem);
}
html{scroll-behavior:smooth;}
body{background-color:var(--tou-bg);color:var(--tou-ink);font-size:var(--tou-step-0);line-height:1.6;-webkit-text-size-adjust:100%;}
main, .page, .content, .ux-shell, .dva-hub, .universe-page, .living-cafe, .story-section{box-sizing:border-box;}
:is(.ux-shell,.dva-hub,.universe-page,.living-cafe,.reader-profile,.visual-novel-shell,.story-section,.section,.world-section){max-width:var(--tou-content);margin-left:auto;margin-right:auto;}
:is(h1,h2,h3){text-wrap:balance;line-height:1.12;}
:is(h1,.ux-hero h1,.page-title-top h1){font-size:var(--tou-step-3)!important;}
:is(h2,.ux-card h2,.universe-card h2,.cafe-room h2){font-size:var(--tou-step-2)!important;}
:is(h3,.ux-card h3,.universe-card h3){font-size:var(--tou-step-1)!important;}
:is(p,li,.ux-card p,.universe-card p,.cafe-room p){font-size:var(--tou-step-0);line-height:1.62;}
:is(.eyebrow,.kicker,.ux-kicker,.breadcrumb-path,.tou-breadcrumbs){font-size:var(--tou-step--1);}
:is(.ux-card,.universe-card,.cafe-room,.museum-room,.route-stop,.relationship-node,.world-card,.story-card){border-color:var(--tou-border)!important;border-radius:var(--tou-radius-md)!important;background:var(--tou-panel)!important;box-shadow:none;}
:is(.ux-card,.universe-card,.cafe-room,.museum-room,.route-stop,.world-card,.story-card){padding:clamp(16px,2.4vw,26px)!important;}
a.site-text-button, .site-text-button, .universe-btn, .dva-hub-btn, .ux-btn, button.site-text-button{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;border:1px solid var(--tou-border)!important;border-radius:999px!important;background:var(--tou-gold-soft)!important;color:var(--tou-gold)!important;text-decoration:none!important;padding:.72rem 1rem!important;line-height:1.15!important;min-height:42px;touch-action:manipulation;}
:is(a.site-text-button,.site-text-button,.universe-btn,.dva-hub-btn,.ux-btn):hover{background:rgba(215,180,106,.26)!important;color:#fff7e8!important;}
.tou-page-head,.page-title-top{max-width:var(--tou-content);margin:18px auto 12px!important;padding:0 18px!important;color:var(--tou-ink)!important;font-family:Georgia,serif!important;}
.tou-breadcrumbs,.page-title-top .breadcrumb-path{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center;color:rgba(255,247,232,.70)!important;}
.tou-breadcrumbs a,.page-title-top .breadcrumb-path a{color:var(--tou-gold)!important;text-decoration:none!important;}
.tou-breadcrumbs a:hover{text-decoration:underline!important;}
.tou-title-card{border:1px solid var(--tou-border);border-radius:var(--tou-radius-lg);padding:clamp(22px,4vw,42px);background:radial-gradient(circle at 15% 0%,rgba(215,180,106,.18),transparent 34%),linear-gradient(135deg,rgba(35,20,31,.94),rgba(8,15,29,.94));box-shadow:var(--tou-shadow);}
.tou-title-card h1{margin:0 0 .45rem;color:var(--tou-gold)!important;}
.tou-title-card p{max-width:780px;color:var(--tou-muted);margin:.35rem 0 0;}
img{max-width:100%;height:auto;} iframe,video{max-width:100%;}
@media(max-width:860px){
  body{padding-bottom:76px;}
  :is(.ux-shell,.dva-hub,.universe-page,.living-cafe,.reader-profile,.visual-novel-shell,.story-section,.section,.world-section){width:100%;padding-left:14px!important;padding-right:14px!important;}
  :is(h1,.ux-hero h1,.page-title-top h1){font-size:clamp(1.7rem,7vw,2.35rem)!important;}
  :is(h2,.ux-card h2,.universe-card h2,.cafe-room h2){font-size:clamp(1.22rem,4.6vw,1.55rem)!important;}
  :is(p,li,.ux-card p,.universe-card p,.cafe-room p){font-size:.98rem;line-height:1.56;}
  .tou-title-card{border-radius:22px;padding:22px 16px;}
  a.site-text-button, .site-text-button, .universe-btn, .dva-hub-btn, .ux-btn, button.site-text-button{width:auto;max-width:100%;min-height:44px;}
}