:root {
  --season-background: url("./assets/bg-autumn.webp");
  --ink: #122536;
  --ink-soft: #26475d;
  --paper: #f7fcff;
  --paper-deep: #dcebf3;
  --red: #bd2d25;
  --red-bright: #ed5141;
  --gold: #a9710f;
  --gold-light: #9b6508;
  --muted: #506a7b;
  --ice: #bfe9ff;
  --ice-bright: #edfaff;
  --serif: "Noto Serif JP", serif;
  --sans: "Noto Sans JP", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  color: var(--ink);
  background:
    linear-gradient(180deg, rgba(248,252,255,.16) 0%, rgba(246,251,255,.68) 48rem, rgba(237,247,252,.97) 92rem),
    linear-gradient(90deg, rgba(255,255,255,.88) 0%, rgba(247,252,255,.58) 48%, rgba(241,249,255,.18) 100%),
    var(--season-background) 68% top / cover fixed no-repeat;
  background-color: #edf7fc;
  font-family: var(--sans);
  min-height: 100vh;
}
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
.noise {
  position: fixed; inset: 0; pointer-events: none; z-index: 20; opacity: .025;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
}
.welcome-open { overflow: hidden; }
.welcome-gate {
  position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 22px;
  background:
    linear-gradient(180deg, rgba(238,248,254,.7), rgba(233,246,253,.88)),
    var(--season-background) center / cover no-repeat;
  transition: opacity .65s ease, visibility .65s ease;
}
.welcome-gate::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(circle at 50% 34%, rgba(255,255,255,.18), rgba(191,233,255,.22) 32%, rgba(18,37,54,.2) 100%);
}
.welcome-gate.is-leaving { opacity: 0; visibility: hidden; }
.welcome-card {
  width: min(500px, 100%); position: relative; z-index: 1; padding: 38px clamp(24px, 6vw, 54px) 32px;
  text-align: center; border: 1px solid rgba(190,137,32,.5); border-radius: 28px;
  background: linear-gradient(145deg, rgba(255,255,255,.94), rgba(241,250,255,.88));
  box-shadow: 0 30px 100px rgba(18,55,78,.26), inset 0 0 0 6px rgba(255,255,255,.5);
  backdrop-filter: blur(22px);
}
.welcome-torii {
  width: 68px; height: 68px; margin: 0 auto 15px; display: grid; place-items: center; border-radius: 50%;
  color: #fff8dc; font-size: 34px; border: 2px solid #d7ad52;
  background: radial-gradient(circle at 35% 25%, #e96050, #a51f1c 62%, #701510);
  box-shadow: 0 0 0 4px rgba(255,250,228,.9), 0 0 28px rgba(215,173,82,.5);
}
.welcome-card > p:first-of-type { margin: 0 0 8px; color: #895807; font-size: 12px; font-weight: 800; letter-spacing: .22em; }
.welcome-card .welcome-date { margin: 10px 0 0; color: #9a2b24; font-family: var(--serif); font-size: 14px; font-weight: 800; letter-spacing: .08em; }
.welcome-card h1 {
  margin: 0; font-family: var(--serif); font-size: clamp(38px, 9vw, 56px); letter-spacing: .13em;
  color: #a51f1c; background: linear-gradient(180deg, #7f1714, #c33a2c 55%, #9a5a00);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.welcome-rule { display: block; width: 110px; height: 1px; margin: 20px auto; background: linear-gradient(90deg, transparent, #bd8c29, transparent); }
.welcome-copy { margin: 0 0 24px; color: var(--ink-soft); font-family: var(--serif); font-size: 15px; line-height: 1.8; }
.welcome-enter, .welcome-silent { width: 100%; min-height: 54px; border-radius: 12px; cursor: pointer; font-weight: 800; }
.welcome-enter { border: 1px solid rgba(255,223,123,.85); color: white; background: linear-gradient(135deg, #d33a2e, #921e1a); box-shadow: 0 12px 28px rgba(145,30,26,.28); }
.welcome-silent { margin-top: 8px; border: 1px solid rgba(38,71,93,.18); color: var(--ink-soft); background: rgba(255,255,255,.66); }
.welcome-enter:focus-visible, .welcome-silent:focus-visible, .sound-toggle:focus-visible { outline: 3px solid var(--gold-light); outline-offset: 3px; }
.welcome-card > small { display: block; margin-top: 13px; color: var(--muted); font-size: 10px; }
.sound-control-row {
  width: min(1180px, calc(100% - 40px)); margin: 14px auto 28px; display: flex; align-items: center; justify-content: flex-end; gap: 12px;
}
.sound-control-row span { color: var(--muted); font-size: 12px; font-weight: 700; }
.sound-control-top { margin-top: 12px; margin-bottom: 0; }
.sound-control-middle, .sound-control-bottom {
  padding: 13px 16px; border: 1px solid rgba(255,255,255,.82); border-radius: 16px;
  background: rgba(255,255,255,.78); box-shadow: 0 12px 34px rgba(35,77,104,.12); backdrop-filter: blur(14px);
}
.sound-toggle {
  min-width: 108px; min-height: 42px; padding: 9px 14px;
  border: 1px solid rgba(169,113,15,.38); border-radius: 999px; color: var(--ink); font-weight: 800; font-size: 12px;
  background: rgba(255,255,255,.88); box-shadow: 0 10px 30px rgba(32,66,88,.16); backdrop-filter: blur(14px); cursor: pointer;
}
.sound-toggle[aria-pressed="true"] { color: white; border-color: rgba(255,223,123,.72); background: linear-gradient(135deg, #bd2d25, #8f1d19); }
.site-header {
  width: min(1180px, calc(100% - 40px));
  height: 94px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between;
  position: relative; z-index: 10; border-bottom: 1px solid rgba(38,71,93,.16);
  padding-inline: 18px; border-radius: 0 0 18px 18px;
  background: linear-gradient(180deg, rgba(255,255,255,.88), rgba(240,249,253,.72));
  backdrop-filter: blur(16px); box-shadow: 0 10px 35px rgba(32,66,88,.1);
}
.brand {
  display: flex; gap: 13px; align-items: center; color: var(--ink); text-decoration: none;
  padding: 7px 16px 7px 8px; border: 1px solid rgba(187,132,30,.34); border-radius: 999px;
  background: linear-gradient(135deg, rgba(255,255,255,.92), rgba(255,245,214,.7));
  box-shadow: 0 9px 24px rgba(130,78,8,.12), inset 0 1px rgba(255,255,255,.92);
}
.brand-mark {
  display: grid; place-items: center; width: 52px; height: 52px; flex: 0 0 52px;
  border: 2px solid #d7ad52; border-radius: 50%; color: #fff8dc; font-size: 27px;
  background: radial-gradient(circle at 35% 25%, #e96050, #a51f1c 62%, #701510);
  box-shadow: 0 0 0 3px rgba(255,250,228,.9), 0 0 18px rgba(215,173,82,.55), inset 0 1px rgba(255,255,255,.45);
}
.brand-mark svg { display:block; width:100%; height:100%; }
.welcome-torii svg { display:block; width:100%; height:100%; }
.brand b {
  display: block; font-family: var(--serif); font-size: 30px; line-height: 1.05; font-weight: 900; letter-spacing: .16em;
  color: #a51f1c; background: linear-gradient(180deg, #7f1714 8%, #c33a2c 52%, #9a5a00 100%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 1px 0 rgba(255,255,255,.95));
}
.brand small {
  display: block; margin-top: 4px; color: #895807; letter-spacing: .27em; font-size: 9px; font-weight: 800;
}
.collection-link { color: var(--ink); text-decoration: none; border: 1px solid rgba(38,71,93,.22); padding: 10px 14px; border-radius: 999px; font-size: 13px; background: rgba(255,255,255,.66); }
.collection-link span { color: var(--gold-light); margin-left: 5px; }
.header-actions { display: flex; align-items: center; gap: 8px; }
.offering-link { border-color: rgba(169,113,15,.38); color: #895807; }

.shrine-stage {
  width: min(1180px, calc(100% - 40px)); min-height: calc(100vh - 94px); margin: 0 auto;
  display: grid; grid-template-columns: .96fr 1.04fr; align-items: center; position: relative; overflow: hidden;
  padding: 56px 0 70px; isolation: isolate;
}
.shrine-stage::before {
  content: ""; position: absolute; left: 42%; top: 8%; bottom: 9%; width: 1px;
  background: linear-gradient(transparent, rgba(215,168,56,.55), transparent);
}
.glow { position: absolute; border-radius: 50%; filter: blur(90px); pointer-events: none; }
.glow-one { width: 250px; height: 250px; background: rgba(105,206,255,.2); left: -130px; top: 20%; }
.glow-two { width: 300px; height: 300px; background: rgba(195,234,255,.16); right: 7%; bottom: 3%; }
.main-copy {
  position: relative; z-index: 3; max-width: 550px; margin-right: 2vw;
  padding: 30px clamp(22px, 3vw, 36px); border: 1px solid rgba(255,255,255,.82); border-radius: 24px;
  background: linear-gradient(145deg, rgba(255,255,255,.88), rgba(232,246,253,.74));
  backdrop-filter: blur(18px); box-shadow: 0 24px 70px rgba(35,77,104,.18), inset 0 1px rgba(255,255,255,.86);
}
.eyebrow { color: var(--gold-light); font-size: 12px; letter-spacing: .2em; font-weight: 700; margin: 0 0 20px; display: flex; align-items: center; gap: 10px; }
.eyebrow span { width: 30px; height: 1px; background: var(--gold); }
h1 { font-family: var(--serif); font-size: clamp(42px, 5.2vw, 72px); line-height: 1.17; margin: 0; letter-spacing: -.02em; text-shadow: 0 2px 16px rgba(255,255,255,.8); }
h1 em { font-style: normal; color: var(--red-bright); text-shadow: 0 0 34px rgba(237,81,65,.25); }
.intro { color: #344f62; font-size: 16px; margin: 18px 0 28px; line-height: 1.8; }
.stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.stat-card { border: 1px solid rgba(38,71,93,.14); background: rgba(255,255,255,.6); border-radius: 14px; padding: 14px 16px; backdrop-filter: blur(12px); }
.stat-card span { display: block; color: var(--muted); font-size: 12px; margin-bottom: 3px; }
.stat-card strong { font-family: var(--serif); font-size: 20px; }
.stat-card strong b { color: var(--gold-light); font-size: 27px; }
.oracle-preview { border-left: 3px solid var(--red); padding: 11px 14px; margin: 0 0 17px; background: linear-gradient(90deg, rgba(189,45,37,.11), rgba(255,255,255,.22)); }
.oracle-label { color: var(--gold-light); font-weight: 700; font-size: 11px; letter-spacing: .12em; }
.oracle-preview p { font-family: var(--serif); font-size: 15px; line-height: 1.75; margin: 5px 0 0; }
.worship-button {
  width: 100%; min-height: 76px; position: relative; overflow: hidden; border: 1px solid rgba(255,223,123,.8);
  border-radius: 12px; color: white; background: linear-gradient(135deg, #d33a2e, #921e1a); cursor: pointer;
  box-shadow: 0 14px 36px rgba(145,30,26,.35), inset 0 1px rgba(255,255,255,.25);
  display: flex; flex-direction: column; align-items: center; justify-content: center; transition: transform .2s ease, filter .2s ease;
}
.worship-button:hover { transform: translateY(-2px); filter: brightness(1.08); }
.worship-button:active { transform: translateY(1px); }
.worship-button:focus-visible, .share-button:focus-visible, .secondary-button:focus-visible, .close-button:focus-visible { outline: 3px solid var(--gold-light); outline-offset: 3px; }
.worship-button > span:not(.button-shine) { font-family: var(--serif); font-size: 24px; font-weight: 900; letter-spacing: .16em; }
.worship-button small { font-size: 11px; opacity: .78; margin-top: 3px; letter-spacing: .08em; }
.button-shine { position: absolute; width: 100px; height: 180%; top: -40%; left: -35%; background: rgba(255,255,255,.12); transform: rotate(20deg); transition: left .7s ease; }
.worship-button:hover .button-shine { left: 120%; }
.worship-button.is-ritual { pointer-events: none; animation: pulse 1s infinite alternate; }
.today-note { text-align: center; color: #587184; font-size: 11px; margin: 10px 0 0; }

.character-stage { align-self: stretch; min-height: 630px; position: relative; display: flex; align-items: flex-end; justify-content: center; z-index: 2; }
.character-stage img {
  position: absolute; z-index: 3; height: min(82vh, 760px); max-width: 100%; object-fit: contain; bottom: -48px;
  filter: drop-shadow(0 30px 34px rgba(0,10,20,.42));
  transform-origin: center bottom;
}
.character-stage #weekdayGoddess {
  will-change: transform; animation: goddess-float 6.4s ease-in-out infinite;
}
.vertical-seal { position: absolute; z-index: 2; right: 1%; top: 15%; font-family: var(--serif); font-size: 19px; letter-spacing: .18em; line-height: 1.65; color: rgba(18,37,54,.62); border-block: 1px solid rgba(38,71,93,.25); padding: 12px 7px; }
.character-name { position: absolute; z-index: 4; left: 6%; bottom: 6%; max-width: 88%; padding: 12px 16px 12px 18px; border-left: 3px solid var(--gold); border-radius: 0 12px 12px 0; background: linear-gradient(90deg, rgba(8,24,38,.78), rgba(8,24,38,.25), transparent); text-shadow: 0 2px 10px #000; }
.character-name time { display: block; margin-bottom: 3px; color: #fff3bf; font-size: 12px; font-weight: 800; letter-spacing: .08em; }
.character-person-name { display: block; color: white; font-family: var(--serif); font-size: 33px; font-weight: 900; letter-spacing: .17em; line-height: 1.25; }
.character-name small { display: block; margin-top: 4px; font-size: 10px; color: var(--gold-light); letter-spacing: .08em; }
.character-name strong { display: block; margin-top: 3px; font-family: var(--serif); font-size: 21px; letter-spacing: .1em; }
.character-name, .character-name strong { color: white; }
.character-name small { color: #ffe69b; }

.goshuin-section {
  width: min(1180px, calc(100% - 40px)); margin: 0 auto 28px; padding: 70px 34px 60px;
  border: 1px solid rgba(255,255,255,.82); border-radius: 26px;
  background: linear-gradient(145deg, rgba(255,255,255,.9), rgba(225,242,250,.82));
  backdrop-filter: blur(20px); box-shadow: 0 26px 70px rgba(35,77,104,.16);
}
.section-heading { display: grid; grid-template-columns: 130px auto 1fr; align-items: end; gap: 18px; margin-bottom: 30px; }
.section-heading p { color: var(--gold); letter-spacing: .2em; font-size: 11px; margin: 0 0 7px; }
.section-heading h2 { font-family: var(--serif); font-size: 38px; letter-spacing: .08em; margin: 0; }
.section-heading span { color: var(--muted); font-size: 13px; padding-bottom: 6px; }
.stamp-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; }
.stamp-card { min-height: 190px; border: 1px solid rgba(38,71,93,.14); background: rgba(255,255,255,.62); border-radius: 16px; padding: 18px 14px; display: flex; flex-direction: column; justify-content: space-between; text-align: center; position: relative; overflow: hidden; }
.stamp-card.unlocked { background: linear-gradient(145deg, rgba(255,248,232,.98), rgba(241,225,189,.93)); color: var(--ink); border-color: rgba(215,168,56,.65); box-shadow: 0 10px 30px rgba(0,0,0,.18); }
.stamp-card.locked { color: #607789; }
.stamp-icon { width: 82px; height: 82px; margin: 0 auto 10px; border: 3px double currentColor; border-radius: 9px; display: grid; place-items: center; font-family: var(--serif); font-size: 28px; font-weight: 900; transform: rotate(-3deg); }
.unlocked .stamp-icon { color: var(--red); filter: drop-shadow(0 3px 3px rgba(189,45,37,.2)); }
.locked .stamp-icon { filter: grayscale(1); opacity: .35; }
.stamp-card strong { font-family: var(--serif); font-size: 16px; }
.stamp-card small { font-size: 11px; line-height: 1.5; opacity: .7; }
.new-ribbon { position: absolute; top: 11px; right: -28px; width: 100px; background: var(--red); color: white; font-size: 9px; padding: 4px; transform: rotate(35deg); letter-spacing: .12em; }
.offering-section {
  width: min(1180px, calc(100% - 40px)); margin: 0 auto 28px; padding: 70px 34px 54px;
  border: 1px solid rgba(215,168,56,.42); border-radius: 26px;
  background: linear-gradient(145deg, rgba(255,252,242,.94), rgba(236,247,252,.88));
  box-shadow: 0 26px 70px rgba(73,61,31,.14);
}
.offering-heading { margin-bottom: 28px; }
.devotion-rewards {
  display: grid; grid-template-columns: 1.2fr 1fr 1fr auto; gap: 12px; align-items: stretch;
  margin-bottom: 22px; padding: 16px; border: 1px solid rgba(169,113,15,.28); border-radius: 18px;
  background: linear-gradient(135deg, rgba(255,255,255,.82), rgba(255,246,217,.7));
}
.devotion-intro { padding: 7px 10px; }
.devotion-intro > span { color: #9a6410; font-size: 11px; font-weight: 900; letter-spacing: .12em; }
.devotion-intro h3 { margin: 5px 0 6px; font-family: var(--serif); font-size: 20px; }
.devotion-intro p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.55; }
.devotion-reward { display: grid; grid-template-columns: auto 1fr; gap: 4px 10px; align-content: center; padding: 12px; border-radius: 13px; background: rgba(255,255,255,.72); }
.devotion-reward b { grid-row: 1 / 3; align-self: center; color: var(--red); font-family: var(--serif); font-size: 25px; }
.devotion-reward span { color: var(--ink-soft); font-size: 12px; line-height: 1.45; }
.devotion-reward span strong { display: block; color: var(--ink); font-size: 14px; }
.devotion-reward small { color: var(--muted); font-size: 11px; }
.devotion-reward em { color: var(--red); font-style: normal; font-weight: 900; }
.devotion-owned { display: grid; gap: 7px; align-content: center; padding: 10px 12px; border-left: 1px solid rgba(169,113,15,.25); }
.devotion-owned span { white-space: nowrap; color: var(--muted); font-size: 11px; }
.devotion-owned strong { color: #895807; font-family: var(--serif); font-size: 20px; }
.charm-status { grid-column: 1 / -1; padding: 9px 12px; border-radius: 10px; color: #5b6d78; background: rgba(226,239,246,.72); font-size: 12px; text-align: center; }
.charm-status.is-expiring { color: #8b281f; background: rgba(255,232,224,.86); font-weight: 800; }
.offering-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: stretch; }
.offering-card {
  position: relative; display: flex; flex-direction: column; min-height: 390px; padding: 24px;
  border: 1px solid rgba(169,113,15,.24); border-radius: 20px;
  background: rgba(255,255,255,.72); box-shadow: 0 16px 34px rgba(62,67,59,.1); overflow: hidden;
}
.offering-card.featured { border-color: rgba(189,45,37,.42); background: linear-gradient(155deg, rgba(255,255,255,.96), rgba(255,238,234,.82)); }
.offering-card.wager-card { border-color: rgba(40,59,88,.38); background: linear-gradient(155deg, rgba(255,255,255,.96), rgba(225,237,248,.88)); }
.offering-badge { align-self: flex-start; padding: 5px 10px; border-radius: 999px; color: #8b281f; background: rgba(189,45,37,.1); font-size: 12px; font-weight: 800; }
.offering-symbol {
  width: 68px; height: 68px; margin: 22px 0 16px; display: grid; place-items: center; border-radius: 50%;
  color: #a51f1c; font-family: var(--serif); font-size: 31px; font-weight: 900;
  border: 1px solid rgba(215,168,56,.62); background: radial-gradient(circle, #fffdf2, #f2ddb0);
  box-shadow: 0 0 0 5px rgba(255,248,226,.8);
}
.offering-card h3 { margin: 0 0 10px; font-family: var(--serif); font-size: 23px; }
.offering-card p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.75; }
.offering-card ul { margin: 16px 0 0; padding-left: 1.25em; color: var(--ink-soft); font-size: 13px; line-height: 1.8; }
.charm-types { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 16px; }
.charm-types span { padding: 6px 9px; border: 1px solid rgba(169,113,15,.26); border-radius: 999px; color: #6f5119; background: rgba(255,249,232,.9); font-size: 11px; font-weight: 800; }
.offering-card > small { margin-top: 10px; color: #60717e; font-size: 11px; line-height: 1.6; }
.validity-label { align-self: flex-start; margin-top: 14px; padding: 6px 9px; border-radius: 8px; color: #735418; background: rgba(240,215,160,.4); font-size: 11px; font-weight: 800; }
.offering-price { margin-top: auto; padding-top: 20px; color: #8d251e; }
.offering-price strong { font-family: var(--serif); font-size: 38px; }
.offering-price span { margin-left: 4px; font-weight: 800; }
.support-prices { display: flex; flex-wrap: wrap; gap: 7px; margin-top: auto; padding-top: 24px; }
.support-prices span { padding: 9px 12px; border: 1px solid rgba(169,113,15,.3); border-radius: 999px; color: #895807; background: #fffaf0; font-weight: 800; font-size: 13px; }
.offering-card button { width: 100%; min-height: 48px; margin-top: 14px; border: 0; border-radius: 11px; color: #71808a; background: #e5edf1; font-weight: 800; cursor: not-allowed; }
.offering-note { margin: 22px 0 0; color: var(--muted); text-align: center; font-size: 12px; }
.omamori-book {
  width: min(1180px, calc(100% - 40px)); margin: 0 auto 28px; padding: 62px 34px 50px;
  border: 1px solid rgba(255,255,255,.82); border-radius: 26px;
  background: linear-gradient(145deg, rgba(255,255,255,.9), rgba(229,242,249,.84));
  box-shadow: 0 24px 65px rgba(35,77,104,.14);
}
.omamori-app-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); gap: 18px; }
.omamori-app-button { appearance: none; min-height: 132px; padding: 10px 7px; border: 0; border-radius: 18px; color: var(--ink); background: rgba(255,255,255,.45); cursor: pointer; transition: transform .2s ease, background .2s ease; }
.omamori-app-button:hover { transform: translateY(-3px); background: rgba(255,255,255,.84); }
.omamori-app-button:focus-visible { outline: 3px solid var(--gold-light); outline-offset: 3px; }
.omamori-app-icon {
  width: 76px; height: 76px; margin: 0 auto 9px; display: grid; place-items: center; border-radius: 20px;
  color: #fff8df; font-family: var(--serif); font-size: 29px; font-weight: 900;
  background: linear-gradient(145deg, #da4a3c, #891d1a); border: 2px solid #dfbb68;
  box-shadow: inset 0 0 0 4px rgba(255,255,255,.18), 0 10px 22px rgba(88,33,27,.25);
}
.omamori-app-button.is-expiring .omamori-app-icon { background: linear-gradient(145deg, #d59636, #8d5516); }
.omamori-app-button.is-fulfilled .omamori-app-icon { filter: grayscale(.78); opacity: .68; }
.omamori-app-button strong { display: block; font-size: 12px; line-height: 1.35; }
.omamori-app-button small { display: block; margin-top: 3px; color: var(--muted); font-size: 10px; }
.omamori-empty { margin: 0; padding: 26px; border: 1px dashed rgba(38,71,93,.24); border-radius: 16px; color: var(--muted); text-align: center; font-size: 13px; }
.omamori-dialog { width: min(460px, calc(100% - 28px)); border: 0; padding: 0; border-radius: 24px; background: transparent; box-shadow: 0 30px 100px rgba(0,0,0,.65); }
.omamori-dialog::backdrop { background: rgba(3,5,12,.8); backdrop-filter: blur(7px); }
.omamori-dialog-inner { position: relative; padding: 38px 30px 30px; border: 1px solid #c99c3e; border-radius: 24px; color: var(--ink); text-align: center; background: linear-gradient(155deg, #fffdf5, #e9f5fb); }
.omamori-large { width: 142px; height: 178px; margin: 0 auto 20px; display: grid; place-items: center; border-radius: 25px 25px 32px 32px; color: #fff7db; font-family: var(--serif); font-size: 52px; font-weight: 900; background: linear-gradient(145deg, #d94b3d, #811a17); border: 4px double #e0bd6a; box-shadow: inset 0 0 0 6px rgba(255,255,255,.12), 0 20px 36px rgba(85,27,23,.25); }
.omamori-dialog h2 { margin: 0 0 10px; font-family: var(--serif); font-size: 28px; }
.omamori-status { margin: 0 auto 18px; color: #8b281f; font-weight: 900; }
.omamori-dates { display: grid; grid-template-columns: 1fr 1fr; margin: 0 0 17px; border: 1px solid rgba(38,71,93,.14); border-radius: 13px; overflow: hidden; }
.omamori-dates div { padding: 12px; background: rgba(255,255,255,.62); }
.omamori-dates div + div { border-left: 1px solid rgba(38,71,93,.14); }
.omamori-dates dt { color: var(--muted); font-size: 10px; }
.omamori-dates dd { margin: 4px 0 0; font-size: 13px; font-weight: 800; }
.omamori-disclaimer { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.65; }
.daily-tools {
  width: min(1180px, calc(100% - 40px)); margin: 0 auto 28px; padding: 58px 34px 44px;
  border: 1px solid rgba(255,255,255,.82); border-radius: 26px;
  background: linear-gradient(145deg, rgba(255,255,255,.92), rgba(228,242,249,.86));
  box-shadow: 0 24px 65px rgba(35,77,104,.14);
}
.tools-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 18px; align-items: stretch; }
.memo-panel, .calendar-panel, .calculator-panel, .favorite-photo-panel { padding: 22px; border: 1px solid rgba(38,71,93,.15); border-radius: 19px; background: rgba(255,255,255,.72); }
.tool-title { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.tool-title > span { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 14px; color: white; background: linear-gradient(145deg, #c84a3e, #8b241e); font-family: var(--serif); font-size: 22px; }
.tool-title h3 { margin: 0; font-family: var(--serif); font-size: 22px; }
.tool-title p { margin: 3px 0 0; color: var(--muted); font-size: 11px; }
.memo-panel label, .calendar-note-editor label { display: block; margin-bottom: 7px; color: var(--ink-soft); font-size: 12px; font-weight: 800; }
.memo-panel textarea, .calendar-note-editor textarea { width: 100%; resize: vertical; border: 1px solid rgba(38,71,93,.18); border-radius: 13px; color: var(--ink); background: rgba(250,253,255,.92); font: 15px/1.7 var(--sans); }
.memo-panel textarea { min-height: 330px; padding: 15px; }
.calendar-note-editor textarea { min-height: 92px; padding: 11px; }
.memo-panel textarea:focus, .calendar-note-editor textarea:focus { outline: 3px solid rgba(169,113,15,.35); border-color: var(--gold); }
.memo-footer, .calendar-note-editor > div { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 9px; }
.memo-footer span, .calendar-note-editor > div span { color: var(--muted); font-size: 10px; }
.memo-footer button, .calendar-note-editor button { border: 1px solid rgba(38,71,93,.17); border-radius: 9px; padding: 7px 11px; color: var(--ink-soft); background: white; font-size: 11px; cursor: pointer; }
.memo-footer button:disabled, .calendar-note-editor button:disabled { opacity: .45; cursor: not-allowed; }
.calendar-toolbar { display: grid; grid-template-columns: 42px 1fr 42px; align-items: center; gap: 8px; margin-bottom: 13px; }
.calendar-toolbar h3 { margin: 0; text-align: center; font-family: var(--serif); font-size: 21px; }
.calendar-toolbar button { width: 42px; height: 42px; border: 1px solid rgba(38,71,93,.16); border-radius: 11px; color: var(--ink); background: white; font-size: 26px; cursor: pointer; }
.calendar-weekdays, .calendar-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.calendar-weekdays { margin-bottom: 4px; color: var(--muted); text-align: center; font-size: 10px; }
.calendar-weekdays span:first-child { color: #bb4137; }
.calendar-weekdays span:last-child { color: #337da2; }
.calendar-day { min-height: 47px; position: relative; border: 1px solid transparent; border-radius: 10px; color: var(--ink); background: rgba(244,249,252,.85); font-size: 12px; cursor: pointer; }
.calendar-day.sunday { color: #bb4137; background: rgba(255,241,239,.9); }
.calendar-day.saturday { color: #337da2; background: rgba(239,247,255,.92); }
.calendar-day.other-month { opacity: .35; }
.calendar-day.today { border-color: var(--gold); font-weight: 900; }
.calendar-day.selected { color: white; background: #a52b24; }
.calendar-day.has-note::after { content: ""; position: absolute; left: 50%; bottom: 5px; width: 5px; height: 5px; border-radius: 50%; background: #d29b31; transform: translateX(-50%); }
.calendar-day.selected.has-note::after { background: #fff1a8; }
.calendar-note-editor { margin-top: 15px; padding-top: 15px; border-top: 1px solid rgba(38,71,93,.13); }
.calculator-display { min-height: 76px; display: flex; align-items: center; justify-content: flex-end; overflow: hidden; margin-bottom: 12px; padding: 14px 16px; border: 1px solid rgba(38,71,93,.16); border-radius: 14px; color: var(--ink); background: rgba(244,249,252,.92); font: 700 32px/1.2 var(--sans); overflow-wrap: anywhere; }
.calculator-keys { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.calculator-keys button { min-height: 52px; border: 1px solid rgba(38,71,93,.15); border-radius: 12px; color: var(--ink); background: white; font: 700 18px/1 var(--sans); cursor: pointer; }
.calculator-keys button:active { transform: translateY(1px); background: #edf5f9; }
.calculator-keys [data-calc="operator"] { color: #9a2b24; background: #fff6ee; }
.calculator-keys .calc-clear { grid-column: span 2; color: #9a2b24; }
.calculator-keys .calc-zero { grid-column: span 2; }
.calculator-keys .calc-equals { color: white; background: linear-gradient(145deg, #c84a3e, #8b241e); }
.favorite-photo-panel { display: flex; flex-direction: column; }
.favorite-photo-frame { min-height: 330px; flex: 1; display: grid; place-items: center; overflow: hidden; border: 1px dashed rgba(38,71,93,.28); border-radius: 16px; background: linear-gradient(145deg, rgba(244,249,252,.9), rgba(255,247,238,.82)); cursor: pointer; }
.favorite-photo-frame img { width: 100%; height: 100%; min-height: 330px; max-height: 410px; object-fit: contain; background: rgba(255,255,255,.64); }
.favorite-photo-empty { display: grid; place-items: center; gap: 7px; padding: 26px; color: var(--muted); text-align: center; }
.favorite-photo-empty > span { width: 58px; height: 58px; display: grid; place-items: center; border: 1px solid rgba(38,71,93,.18); border-radius: 50%; color: #a52b24; background: white; font-size: 31px; }
.favorite-photo-empty strong { color: var(--ink); font-size: 16px; }
.favorite-photo-empty small { font-size: 12px; }
.favorite-photo-actions { display: grid; grid-template-columns: 1fr auto; gap: 9px; margin-top: 12px; }
.favorite-photo-actions button { min-height: 44px; border: 1px solid rgba(38,71,93,.16); border-radius: 11px; color: white; background: linear-gradient(145deg, #c84a3e, #8b241e); font: 700 14px/1 var(--sans); cursor: pointer; }
.favorite-photo-actions .photo-remove { padding-inline: 18px; color: var(--ink-soft); background: white; }
.favorite-photo-actions button:disabled { opacity: .42; cursor: not-allowed; }
.favorite-photo-status { min-height: 1.4em; margin: 9px 0 0; color: var(--muted); font-size: 12px; }
.tools-note { margin: 16px 0 0; color: var(--muted); text-align: center; font-size: 11px; }
.how-it-works { width: min(1180px, calc(100% - 40px)); margin: 0 auto 70px; display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid rgba(255,255,255,.82); border-radius: 16px; overflow: hidden; backdrop-filter: blur(18px); box-shadow: 0 20px 50px rgba(35,77,104,.14); }
.how-it-works > div { min-height: 110px; padding: 24px; display: flex; align-items: center; gap: 18px; background: rgba(255,255,255,.82); }
.how-it-works > div + div { border-left: 1px solid rgba(38,71,93,.13); }
.how-it-works b { font-family: var(--serif); color: var(--gold-light); font-size: 30px; }
.how-it-works span { color: var(--muted); font-size: 12px; line-height: 1.7; }
.how-it-works strong { display: block; color: var(--ink); font-size: 15px; margin-bottom: 2px; }
footer { width: min(1180px, calc(100% - 40px)); margin: 0 auto; padding: 26px 0 40px; border-top: 1px solid rgba(38,71,93,.16); display: flex; align-items: start; justify-content: space-between; gap: 30px; color: #526b7c; font-size: 11px; line-height: 1.6; text-shadow: 0 1px 8px rgba(255,255,255,.9); }
footer p { margin: 0; max-width: 620px; text-align: right; }

.fortune-dialog {
  --rank-color: #8f1d2c;
  --rank-deep: #541019;
  --rank-pale: #f2d6db;
  --rank-glow: rgba(143,29,44,.34);
  width: min(500px, calc(100% - 28px)); border: 0; padding: 0; border-radius: 22px;
  background: transparent; color: var(--ink); box-shadow: 0 30px 100px rgba(0,0,0,.7);
}
.fortune-dialog[data-rank="大吉"] { --rank-color: #c18a00; --rank-deep: #795000; --rank-pale: #fff1a8; --rank-glow: rgba(218,165,32,.46); }
.fortune-dialog[data-rank="中吉"] { --rank-color: #7e8995; --rank-deep: #48535f; --rank-pale: #edf2f6; --rank-glow: rgba(143,154,166,.4); }
.fortune-dialog[data-rank="小吉"] { --rank-color: #b66a3b; --rank-deep: #753b1f; --rank-pale: #f5ddcb; --rank-glow: rgba(182,106,59,.38); }
.fortune-dialog[data-rank="末吉"] { --rank-color: #4f789d; --rank-deep: #2e526f; --rank-pale: #e1eff9; --rank-glow: rgba(79,120,157,.36); }
.fortune-dialog[data-rank="凶"] { --rank-color: #8f1d2c; --rank-deep: #541019; --rank-pale: #f2d6db; --rank-glow: rgba(143,29,44,.34); }
.fortune-dialog::backdrop { background: rgba(3,5,12,.8); backdrop-filter: blur(7px); }
.dialog-inner { position: relative; overflow: hidden; background: var(--paper); padding: 40px 36px 30px; text-align: center; border: 1px solid var(--rank-color); border-radius: 22px; box-shadow: inset 0 0 42px var(--rank-glow); }
.dialog-inner::before, .dialog-inner::after { content: ""; position: absolute; inset: 10px; border: 1px solid var(--rank-glow); border-radius: 15px; pointer-events: none; }
.dialog-inner::after { inset: 15px; border-color: var(--rank-color); opacity: .34; }
.close-button { position: absolute; right: 15px; top: 12px; z-index: 3; width: 36px; height: 36px; border: 0; border-radius: 50%; background: rgba(9,13,28,.07); font-size: 24px; cursor: pointer; }
.result-kicker { color: var(--rank-deep); font-size: 11px; font-weight: 800; letter-spacing: .28em; margin: 0 0 18px; }
.rank-seal { margin: 0 auto 22px; width: 126px; height: 126px; border: 5px double var(--rank-color); color: var(--rank-deep); border-radius: 12px; display: grid; place-items: center; background: radial-gradient(circle at 35% 28%, #fff, var(--rank-pale) 52%, transparent 78%); font-family: var(--serif); font-size: 42px; font-weight: 900; transform: rotate(-2deg); text-shadow: 0 1px 0 rgba(255,255,255,.9); box-shadow: inset 0 0 0 5px var(--paper), inset 0 0 0 7px var(--rank-glow), 0 8px 28px var(--rank-glow); }
.divine-message { margin: 0 auto 24px; max-width: 360px; min-height: 72px; display: grid; place-items: center; font-family: var(--serif); font-size: 19px; line-height: 1.85; font-weight: 700; }
.reward-row { display: flex; justify-content: center; gap: 8px; margin-bottom: 18px; }
.reward-row span { padding: 7px 10px; border-radius: 999px; background: #ede1c8; color: #6e5223; font-size: 11px; font-weight: 800; }
.share-button, .secondary-button { position: relative; z-index: 2; width: 100%; min-height: 50px; border-radius: 10px; cursor: pointer; font-weight: 800; }
.share-button { border: 0; background: var(--ink); color: white; font-size: 15px; }
.share-button span { margin-right: 6px; }
.secondary-button { border: 0; background: transparent; color: #635b4c; margin-top: 5px; }
.dialog-inner > small { position: relative; z-index: 2; display: block; color: #918775; font-size: 10px; margin-top: 4px; }

@keyframes pulse { from { filter: brightness(.9); } to { filter: brightness(1.18); box-shadow: 0 14px 55px rgba(237,81,65,.5); } }
@keyframes goddess-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-11px); }
}
@keyframes reveal { from { opacity: 0; transform: translateY(14px) scale(.96); } to { opacity: 1; transform: none; } }
.fortune-dialog[open] .dialog-inner { animation: reveal .35s ease-out; }

@media (max-width: 900px) {
  body { background-position: 64% top; background-attachment: scroll; }
  .shrine-stage { grid-template-columns: 1fr; min-height: auto; padding: 30px 0 0; }
  .shrine-stage::before { display: none; }
  .main-copy { max-width: 640px; margin-right: 0; padding: 28px clamp(22px, 4vw, 34px); }
  .character-stage { min-height: 570px; margin-top: 6px; }
  .character-stage img { height: 650px; bottom: -45px; }
  .stamp-grid { grid-template-columns: repeat(3, 1fr); }
  .offering-grid { grid-template-columns: 1fr; }
  .offering-card { min-height: 0; }
  .devotion-rewards { grid-template-columns: 1fr 1fr; }
  .devotion-intro { grid-column: 1 / -1; }
  .devotion-owned { grid-column: 1 / -1; grid-template-columns: repeat(2, auto); justify-content: center; border-left: 0; border-top: 1px solid rgba(169,113,15,.25); }
  .tools-grid { grid-template-columns: 1fr; }
  .section-heading { grid-template-columns: auto 1fr; }
  .section-heading p { grid-column: 1 / -1; }
  .how-it-works { grid-template-columns: 1fr; }
  .how-it-works > div + div { border-left: 0; border-top: 1px solid rgba(38,71,93,.13); }
}

@media (max-width: 560px) {
  body { background-position: 70% top; }
  .site-header { width: calc(100% - 20px); height: 78px; padding-inline: 8px; }
  .brand { gap: 8px; padding: 5px 9px 5px 6px; }
  .brand-mark { width: 43px; height: 43px; flex-basis: 43px; font-size: 22px; border-width: 1.5px; }
  .brand b { font-size: 20px; letter-spacing: .09em; }
  .brand small { margin-top: 2px; font-size: 7px; letter-spacing: .16em; }
  .header-actions { gap: 5px; }
  .collection-link { font-size: 10px; padding: 8px 9px; }
  .shrine-stage { width: calc(100% - 28px); padding-top: 16px; }
  .main-copy { margin-right: 0; padding: 24px 18px; border-radius: 20px; }
  h1 { font-size: clamp(38px, 12vw, 54px); }
  .intro { font-size: 14px; margin-bottom: 20px; }
  .oracle-preview p { font-size: 14px; }
  .worship-button { min-height: 72px; }
  .worship-button > span:not(.button-shine) { font-size: 21px; }
  .character-stage { min-height: 460px; width: calc(100% + 28px); margin-left: -14px; }
  .character-stage img { height: 520px; max-width: none; bottom: -40px; }
  .vertical-seal { right: 4%; }
  .character-name { left: 4%; bottom: 6%; max-width: 94%; padding: 10px 13px; }
  .character-person-name { font-size: 27px; letter-spacing: .12em; }
  .character-name strong { font-size: 18px; letter-spacing: .06em; }
  .character-name small { max-width: 290px; line-height: 1.45; }
  .goshuin-section { width: calc(100% - 28px); padding: 52px 16px 44px; }
  .offering-section { width: calc(100% - 28px); padding: 52px 16px 44px; }
  .omamori-book { width: calc(100% - 28px); padding: 48px 16px 40px; }
  .omamori-app-grid { grid-template-columns: repeat(3, 1fr); gap: 10px; }
  .daily-tools { width: calc(100% - 28px); padding: 46px 16px 38px; }
  .memo-panel textarea { min-height: 220px; }
  .calendar-day { min-height: 43px; padding: 4px; }
  .favorite-photo-frame, .favorite-photo-frame img { min-height: 260px; }
  .devotion-rewards { grid-template-columns: 1fr; padding: 12px; }
  .devotion-intro, .devotion-owned { grid-column: auto; }
  .devotion-owned { grid-template-columns: 1fr 1fr; }
  .section-heading { display: block; }
  .section-heading h2 { font-size: 33px; margin: 4px 0 9px; }
  .stamp-grid { grid-template-columns: repeat(2, 1fr); gap: 9px; }
  .stamp-card { min-height: 172px; padding: 15px 10px; }
  .stamp-icon { width: 72px; height: 72px; }
  .how-it-works { width: calc(100% - 28px); }
  .how-it-works > div { min-height: 92px; padding: 18px; }
  footer { width: calc(100% - 28px); display: block; }
  footer p { text-align: left; margin-top: 8px; }
  .dialog-inner { padding: 36px 24px 26px; }
  .rank-seal { width: 112px; height: 112px; font-size: 37px; }
  .divine-message { font-size: 17px; }
  .welcome-card { padding: 30px 20px 26px; border-radius: 22px; }
  .welcome-card h1 { font-size: clamp(35px, 11vw, 48px); }
  .sound-control-row { width: calc(100% - 28px); margin-block: 10px 20px; }
  .sound-control-top { margin-bottom: 0; }
  .sound-toggle { min-width: 98px; min-height: 42px; }
}

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

/* Character-first shrine entrance and mobile navigation. */
body { background: #edf7fc; isolation: isolate; }
body::before {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(180deg, rgba(8,20,25,.08), rgba(8,20,25,.18)), var(--season-background) center top / cover no-repeat;
}
.welcome-gate { background: linear-gradient(180deg, rgba(9,20,25,.1), rgba(9,20,25,.3)), var(--season-background) center / cover no-repeat; }
.welcome-gate::before { background: none; }
.sound-control-top { padding: 6px 12px; border-radius: 12px; background: rgba(255,255,255,.9); }
.shrine-stage { display: block; min-height: 0; padding: 8px 0 0; overflow: visible; }
.shrine-stage::before { display: none; }
.character-stage { display: flex; flex-direction: column; align-items: center; min-height: 0; margin: 0; width: 100%; }
.character-stage img { position: relative; height: min(65svh, 620px); max-width: 100%; width: auto; bottom: auto; object-fit: contain; }
.character-name { position: relative; left: auto; bottom: auto; width: min(520px, 100%); max-width: 100%; margin-top: 0; padding: 12px 18px; text-align: center; border: 1px solid rgba(233,197,123,.65); border-radius: 16px; background: rgba(13,29,35,.88); }
.character-name time { font-size: 14px; }
.character-name small { max-width: none; font-size: 14px; line-height: 1.6; }
.character-name strong { font-size: 20px; }
.character-person-name { font-size: 28px; }
.vertical-seal { display: none; }
.shrine-menu { width: min(760px, calc(100% - 28px)); margin: 20px auto 16px; }
.menu-primary { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; min-height: 80px; padding: 16px; border: 1px solid #f0d194; border-radius: 16px; text-decoration: none; color: white; background: linear-gradient(135deg, #c5372b, #8d211d); box-shadow: 0 10px 28px rgba(30,15,9,.3); }
.shrine-menu > .menu-primary + .menu-primary { margin-top: 12px; }
.menu-primary strong { font-family: var(--serif); font-size: 22px; }
.menu-primary span { font-size: 14px; }
.shrine-menu-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 12px; }
.shrine-menu-grid a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 9px; min-height: 104px; padding: 13px 6px; border: 1px solid #d3b574; border-radius: 14px; color: #482d21; text-decoration: none; background: rgba(255,252,244,.96); box-shadow: 0 6px 20px rgba(22,21,14,.18); font-size: 16px; font-weight: 700; text-align: center; }
.shrine-menu-grid a > span { font-family: var(--serif); color: #a12a22; font-size: 25px; }
.shrine-menu a:hover { filter: brightness(1.06); }
.shooter-feature-entry{position:relative;display:flex;align-items:center;gap:16px;min-height:118px;margin-top:12px;padding:12px 18px;overflow:hidden;border:1px solid #7de8ff;border-radius:16px;background:radial-gradient(circle at 15% 30%,rgba(69,215,255,.25),transparent 38%),linear-gradient(135deg,#071a38,#112d58 56%,#531d43);color:#fff;text-decoration:none;box-shadow:0 10px 28px rgba(6,28,66,.38),inset 0 0 22px rgba(86,222,255,.12)}.shooter-feature-entry::after{content:"MISSION";position:absolute;top:10px;right:-27px;padding:4px 32px;background:#ffcc4b;color:#2a1a00;font:900 10px/1 system-ui;letter-spacing:.12em;transform:rotate(35deg)}.shooter-feature-entry img{flex:0 0 92px;width:92px;height:96px;object-fit:contain;filter:drop-shadow(0 7px 8px rgba(0,0,0,.42))}.shooter-feature-entry span{display:grid;gap:4px}.shooter-feature-entry small{color:#8eeeff;font-size:12px;font-weight:800;letter-spacing:.05em}.shooter-feature-entry strong{font-family:var(--serif);font-size:clamp(21px,5vw,29px);line-height:1.15}.shooter-feature-entry em{color:#ffe48a;font-size:14px;font-style:normal;font-weight:900}@media(max-width:440px){.shooter-feature-entry{gap:10px;padding-inline:10px}.shooter-feature-entry img{flex-basis:76px;width:76px;height:86px}.shooter-feature-entry strong{font-size:20px}}
.shrine-menu a:focus-visible, .back-to-menu:focus-visible { outline: 3px solid #ffce64; outline-offset: 4px; }
.home-unread{margin:0 0 14px;padding:13px 16px;border:2px solid #d0ab61;border-radius:13px;background:#fff9e7;color:#56351f;box-shadow:0 5px 18px #3020132b}
.home-unread>strong{display:block;margin-bottom:8px;font-size:17px}
.home-unread-links{display:flex;flex-wrap:wrap;gap:8px}
.home-unread-links a,.home-unread-links span{display:inline-block;padding:9px 12px;border:1px solid #d0ab61;border-radius:9px;background:white;color:#782a22;font-size:14px;font-weight:700;text-decoration:none}
.home-favorite { width: min(760px, calc(100% - 28px)); margin: 0 auto 28px; background: rgba(255,252,246,.96); padding: 22px; border: 1px solid #d3b574; border-radius: 20px; box-shadow: 0 10px 30px rgba(22,21,14,.18); }
.home-favorite .tool-title p, .home-favorite .favorite-photo-status { font-size: 14px; line-height: 1.6; }
.home-favorite .favorite-photo-actions button { font-size: 16px; min-height: 44px; }
.home-favorite .favorite-photo-frame, .home-favorite .favorite-photo-frame img { min-height: 220px; }
main > .main-copy { width: min(760px, calc(100% - 28px)); max-width: 760px; margin: 0 auto 28px; background: rgba(249,253,255,.96); }
.back-to-menu { display: inline-block; font-size: 14px; font-weight: 700; color: #8d211d; margin-bottom: 20px; text-underline-offset: 4px; }
[id] { scroll-margin-top: 20px; }
footer { padding: 22px; border-radius: 16px; background: rgba(255,255,255,.92); }
@media (max-width: 560px) {
  .site-header { height: 70px; }
  .site-header .header-actions { display: none; }
  .sound-control-top { margin: 8px auto 0; flex-wrap: wrap; gap: 6px; }
  .sound-control-top .current-bgm { margin-right: auto; font-size: 14px; }
  .shrine-stage { padding-top: 6px; }
  .character-stage { width: 100%; margin: 0; }
  .character-stage img { height: min(54svh, 490px); max-width: 100%; bottom: auto; }
  .character-name { margin-top: 0; padding: 10px 12px; }
  .character-person-name { font-size: 25px; }
  .character-name strong { font-size: 18px; }
  .shrine-menu-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .shrine-menu { margin-top: 14px; }
  .home-favorite { padding: 18px; }
  .main-copy h1 { font-size: clamp(34px, 10vw, 50px); }
}

.favorite-photo-frame [hidden] { display: none !important; }

/* A grounded courtyard scene and discrete menu screens. */
[hidden] { display: none !important; }
html { scroll-behavior: auto; }
.shrine-stage { width: min(1000px, 100%); }
.courtyard-scene { position: relative; width: 100%; height: clamp(400px, 66svh, 650px); overflow: hidden; border-radius: 20px; background: url("./assets/shrine-courtyard.webp") center center / cover no-repeat; }
.character-stage .courtyard-scene img { position: absolute; left: 50%; bottom: 1%; transform: translateX(-50%); height: 62%; width: auto; max-width: 96%; animation: none; will-change: auto; filter: drop-shadow(2px 3px 2px rgba(25,23,19,.2)); }
.foot-shadow { position: absolute; left: 50%; bottom: 2.2%; transform: translateX(-50%); width: 25%; max-width: 175px; height: 14px; border-radius: 50%; background: rgba(35,29,21,.32); filter: blur(6px); }
.character-name { margin-top: 10px; }
.screen-toolbar { width: min(1000px, calc(100% - 28px)); margin: 20px auto; display: flex; align-items: center; gap: 18px; padding: 14px; border-radius: 14px; background: #fffaf0; }
.screen-toolbar button { min-height: 44px; padding: 8px 16px; border: 1px solid #9b3229; border-radius: 8px; color: #8d211d; background: white; font: inherit; font-weight: 700; cursor: pointer; flex-shrink: 0; }
.screen-toolbar h2 { margin: 0; font-size: clamp(18px, 4.8vw, 25px); }
main .back-to-menu { display: none; }
body:not([data-screen="home"]) main > section { margin-top: 0; }
.single-item .section-heading { display: none; }
.single-item .tools-grid, .single-item .offering-grid { grid-template-columns: minmax(0, 1fr); }
.single-item { max-width: 760px; }
.single-item .calculator-panel { width: 100%; max-width: 450px; margin: auto; }
.weekday-roster { width: min(760px, calc(100% - 28px)); margin: 0 auto 28px; padding: 22px; border-radius: 18px; background: rgba(255,252,244,.97); border: 1px solid #d3b574; }
.weekday-roster h2 { font-family: var(--serif); font-size: 24px; margin: 0 0 16px; }
.weekday-roster dl { margin: 0; }
.weekday-roster dl > div { display: grid; grid-template-columns: 5em 1fr; gap: 12px; padding: 11px 0; border-top: 1px solid #e4d9c5; font-size: 16px; }
.weekday-roster dt { color: #8d211d; font-weight: 700; }
.weekday-roster dd { margin: 0; }
@media (max-width: 560px) {
  .courtyard-scene { border-radius: 0; height: clamp(360px, 57svh, 520px); }
  .character-name { width: calc(100% - 28px); }
  .screen-toolbar { gap: 12px; }
}

/* Mobile character: 62% × 1.7, with extra headroom above the feet. */
@media (max-width: 560px) {
  .courtyard-scene { height: calc(clamp(360px, 57svh, 520px) * 1.1); }
  .character-stage .courtyard-scene img { height: calc(clamp(360px, 57svh, 520px) * 1.054); max-width: none; }
  .foot-shadow { width: 42.5%; max-width: 240px; }
}

/* Shared seasonal image and four Japan-time lighting treatments. */
:root { --season-background: url("./assets/shrine-courtyard.webp"); }
body { --scene-light: brightness(1) saturate(1.05); --scene-tint: linear-gradient(transparent, transparent); }
body[data-time="morning"] { --scene-light: brightness(1.08) saturate(.95) sepia(.12); --scene-tint: linear-gradient(115deg, rgba(255,212,132,.26), transparent 65%); }
body[data-time="evening"] { --scene-light: brightness(.83) saturate(1.16) sepia(.24); --scene-tint: linear-gradient(110deg, rgba(255,130,57,.32), rgba(97,46,94,.12)); }
body[data-time="night"] { --scene-light: brightness(.43) saturate(.72); --scene-tint: linear-gradient(180deg, rgba(14,28,74,.38), rgba(12,24,57,.2)); }
body::before, .welcome-gate::before, .courtyard-scene::before {
  background: var(--scene-tint), var(--season-background) center center / cover no-repeat;
  filter: var(--scene-light);
}
.welcome-gate { background: #14202d; }
.courtyard-scene { background: #14202d; isolation: isolate; }
.courtyard-scene::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.scene-label { display: block; color: #f4dcb3; font-size: 14px; margin: 3px 0 6px; }
body[data-time="night"] .character-stage .courtyard-scene img { filter: brightness(.85) drop-shadow(2px 3px 2px rgba(0,0,0,.25)); }
body[data-time="evening"] .character-stage .courtyard-scene img { filter: sepia(.09) brightness(.97) drop-shadow(2px 3px 2px rgba(25,23,19,.2)); }

body[data-season="summer"][data-time="night"] { --scene-light: brightness(.95); --scene-tint: linear-gradient(transparent, rgba(12,24,57,.08)); }

@media (max-width: 560px) { body::before, .welcome-gate::before, .courtyard-scene::before { background-position: 35% center; } }

/* Public X profile and official timeline. */
.x-profile-button { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 10px; min-height: 52px; padding: 13px 18px; border-radius: 12px; background: #101010; color: #fff; text-decoration: none; font-size: 16px; font-weight: 700; }
.shrine-menu > .x-profile-button { margin-top: 12px; }
.x-profile-button .external-label { font-size: 14px; font-weight: 400; color: #ddd; }
.x-profile-button:focus-visible { outline: 3px solid #e6b54a; outline-offset: 4px; }
.x-follow-button { margin-top: 10px; }
.x-posts-panel { width: min(760px, calc(100% - 28px)); margin: 0 auto 28px; padding: 22px; border: 1px solid #d3b574; border-radius: 20px; background: rgba(255,252,246,.98); }
.x-posts-heading { display: flex; justify-content: space-between; align-items: center; gap: 14px; margin-bottom: 18px; }
.x-account { margin: 0 0 5px; font-size: 14px; color: #735944; }
.x-posts-heading h2 { margin: 0; font-family: var(--serif); font-size: clamp(20px, 5vw, 26px); }
.x-mark { font-size: 32px; color: #111; }
.x-timeline-container { overflow: hidden; border-radius: 12px; background: #fff; min-height: 100px; }
.x-timeline-container > a { display: block; padding: 30px 18px; color: #804020; font-size: 16px; }
.x-timeline-container iframe { max-width: 100% !important; }
.x-post-card { padding: 18px; margin-bottom: 12px; border: 1px solid #e4d2af; border-radius: 14px; background: #fff; color: #2c241e; }
.x-post-card-author { display: flex; gap: 10px; align-items: center; }
.x-post-card-author strong, .x-post-card-author span:not(.x-post-card-avatar) { display: block; }
.x-post-card-author span:not(.x-post-card-avatar) { color: #665d55; font-size: 14px; }
.x-post-card-avatar { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #843c36; font-size: 14px; }
.x-post-card p { white-space: pre-wrap; line-height: 1.7; font-size: 16px; overflow-wrap: anywhere; }
.x-post-card img { display: block; width: 100%; max-height: 420px; object-fit: contain; margin: 10px 0; border-radius: 8px; }
.x-post-card a { display: inline-block; padding: 8px 0; color: #7b3025; font-weight: 700; }
.x-embed-note { font-size: 14px; line-height: 1.6; color: #5f554c; margin: 14px 0; }
@media (max-width: 560px) { .x-posts-panel { padding: 18px; } }

/* Charm plans and purchase-gated chat information. */
.charm-plans { grid-column: 1 / -1; }
.chat-plan-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; margin: 18px 0; }
.chat-plan { padding: 20px; border: 1px solid #ceb47f; border-radius: 14px; background: #fffdf8; }
.chat-plan h4 { font-size: 20px; margin: 0; font-family: var(--serif); }
.chat-plan p, .human-reply-note p, .chat-screen p { font-size: 16px; line-height: 1.85; }
.chat-detail-link { display: inline-block; margin-top: 14px; color: #8d211d; font-size: 16px; text-underline-offset: 4px; }
.human-reply-note { padding: 16px; background: #f4ebd7; border-radius: 12px; font-size: 16px; line-height: 1.8; }
.human-reply-note p { margin: 6px 0; }
.charm-week-list { margin-top: 16px; font-size: 16px; }
.charm-week-list summary { cursor: pointer; padding: 12px 0; }
.chat-screen { width: min(760px,calc(100% - 28px)); margin: 0 auto 28px; padding: 24px; background: #fffdf8; border: 1px solid #ceb47f; border-radius: 20px; }
.chat-host { display: flex; align-items: center; gap: 14px; border-bottom: 1px solid #e4d9c5; padding-bottom: 18px; }
.chat-host h2 { font-family: var(--serif); font-size: 23px; margin: 0; }
.chat-host p { font-size: 14px; margin: 5px 0 0; }
.kizuna-avatar { display: block; position: relative; overflow: hidden; width: 72px; height: 72px; flex: 0 0 72px; border-radius: 50%; background: #e8d7b8; border: 2px solid #ccb47d; }
.kizuna-avatar img { position: absolute; width: 205px; max-width: none; height: auto; left: -72px; top: -2px; }
.chat-period { padding: 16px; border: 1px solid #ddcbaa; border-radius: 12px; }
.chat-period p { margin: 6px 0 0; }
.chat-unavailable { margin: 24px 0; padding: 20px; text-align: center; border: 1px dashed #b5a78e; border-radius: 12px; }
.chat-unavailable p { margin-bottom: 0; }
.chat-offering-link { display: block; padding: 15px; background: #8d211d; color: #fff; border-radius: 10px; text-align: center; font-size: 16px; text-decoration: none; }
@media (max-width: 560px) { .chat-plan-grid { grid-template-columns: 1fr; } .chat-screen { padding: 18px; } .chat-host h2 { font-size: 20px; } }

.chat-login {margin: 1.25rem 0; padding: 1.2rem; border: 1px solid #b39562; border-radius: 16px; background: #fff; color: #302333;}
.chat-login button {min-height: 48px; padding: .7rem 1.2rem; border-radius: 8px; border: 1px solid #766477; background: #fff; color: #302333; font: inherit; font-weight: 700; cursor: pointer;}
.chat-login button:disabled {opacity: .6; cursor: wait;}
.chat-login button:focus-visible {outline: 3px solid #824d71; outline-offset: 3px;}
.auth-privacy {font-size: .875rem; line-height: 1.7;}

/* Conversation controls follow the shrine's vermilion and paper palette. */
.chat-app { color: #30251f; margin: 1.5rem 0; }
.chat-app [hidden] { display: none !important; }
.chat-app label { display: block; font-size: 1rem; font-weight: 700; margin: .75rem 0 .5rem; }
.chat-app input, .chat-app textarea, .chat-app select { width: 100%; min-width: 0; padding: .8rem; color: #30251f; background: #fff; border: 1px solid #9c8266; border-radius: 8px; font: inherit; font-size: 1rem; }
.chat-app textarea { resize: vertical; min-height: 110px; }
.chat-app button { padding: .7rem 1rem; min-height: 46px; border: 1px solid #8d211d; border-radius: 8px; background: #fff; color: #8d211d; font: inherit; font-size: 1rem; cursor: pointer; }
.chat-app button:disabled { opacity: .5; cursor: default; }
.chat-app :is(button,input,textarea,select):focus-visible { outline: 3px solid #824d71; outline-offset: 3px; }
.chat-inline { display: flex; gap: .6rem; }
.chat-inline button { flex: 0 0 auto; }
.chat-state { padding: 1rem; background: #f4ebd7; border-radius: 10px; }
.chat-actions { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .75rem; margin-top: 1.2rem; }
.chat-quota { font-size: 1rem; font-weight: 700; }
.chat-screen .chat-history-note, .chat-screen .nickname-status { font-size: .875rem; }
.chat-messages { max-height: 480px; max-height: min(60svh,480px); overflow-y: auto; overscroll-behavior: contain; padding: 1rem .5rem; margin: .75rem 0; border-block: 1px solid #ddcbaa; }
.chat-message { padding: .9rem; margin: 0 1rem 1rem 0; background: #f4ebd7; border-radius: 12px; overflow-wrap: anywhere; }
.chat-message.is-mine { margin-right: 0; margin-left: 1rem; background: #f9e3df; }
.chat-message-heading { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; font-size: .875rem; }
.chat-message-heading time { font-size: .875rem; color: #665444; margin-left: auto; }
.chat-screen .chat-message p { white-space: pre-wrap; margin: .5rem 0 0; font-size: 1rem; }
.chat-mini-avatar { width: 36px; height: 36px; flex-basis: 36px; }
.chat-mini-avatar img { width: 103px; left: -36px; top: -1px; }
.chat-compose button { width: 100%; color: white; background: #8d211d; font-weight: 700; }
.chat-empty { text-align: center; }
@media (max-width: 420px) { .chat-inline { flex-wrap: wrap; } .chat-inline input { flex-basis: 100%; } .chat-message { margin-right: .5rem; } .chat-message.is-mine { margin-left: .5rem; } }

#weekdayGoddess[role="button"] { cursor: pointer; touch-action: manipulation; }
#weekdayGoddess[role="button"]:focus-visible { outline: 3px solid #f4dcb3; outline-offset: -3px; border-radius: 12px; }
#characterVoiceHint { display: block; margin: 7px 0; font-size: 14px; line-height: 1.6; color: #f4dcb3; }
/* Keep audio feedback available to screen readers without taking a visible row. */
.character-name #characterVoiceHint{position:absolute;width:1px;height:1px;margin:0;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media(max-width:560px){
  .character-name #weekdayDivinityTheme{display:block;width:100%;max-width:none;margin-top:4px;white-space:nowrap;font-size:clamp(9px,2.9vw,13px);letter-spacing:-.04em;line-height:1.4}
}

/* Subtle breathing and weight shift, anchored at the soles. */
.character-stage .courtyard-scene #weekdayGoddess {
  transform-origin: 50% 100%;
  animation: miko-breathe 8.8s ease-in-out infinite;
  will-change: transform;
}
@keyframes miko-breathe {
  0%, 50%, 100% { transform: translateX(-50%) scale(1, 1) skewX(0deg); }
  25% { transform: translateX(-50%) scale(1.003, 1.009) skewX(.2deg); }
  75% { transform: translateX(-50%) scale(1.003, 1.009) skewX(-.2deg); }
}
@media (prefers-reduced-motion: reduce) {
  .character-stage .courtyard-scene #weekdayGoddess {
    animation: none !important;
    transform: translateX(-50%);
    will-change: auto;
  }
}

.push-settings { margin: 1rem 0; padding: 1rem; border: 1px solid #cbb9a2; border-radius: 12px; background: rgba(255,255,255,.9); color: #382a25; }
.push-status { margin: 0 0 .75rem; font-size: 1rem; }
.push-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.push-settings button { padding: .65rem 1rem; border: 1px solid #a51f1c; border-radius: 8px; background: #a51f1c; color: white; font: inherit; cursor: pointer; }
.push-settings button:disabled { opacity: .5; cursor: default; }
.push-help, .push-admin p { font-size: .875rem; line-height: 1.7; }
.push-admin { margin-top: .75rem; }
.push-admin summary { cursor: pointer; font-size: .875rem; }
.push-sql { display: block; width: 100%; margin: .75rem 0; font: .875rem/1.5 monospace; }
.push-settings [hidden] { display: none !important; }

/* Home account summary, above the character without covering the courtyard. */
.home-account{box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:16px;width:min(620px,calc(100% - 28px));margin:4px auto 14px;padding:14px 18px;border:1px solid #d8bfa0;border-radius:16px;background:rgba(255,250,240,.96);color:#49362b;box-shadow:0 4px 18px #49362b12}
.home-account-person{display:flex;flex:1;min-width:0;flex-direction:column;gap:3px;text-align:left;overflow-wrap:anywhere}
.home-account-person>small{font-size:11px;color:#75604e}
.home-account-person>strong{font-size:17px;line-height:1.5}
#homeAccountStatus{font-size:11px;line-height:1.6;color:#75604e}
.home-account-points{display:flex;flex:none;flex-direction:column;gap:3px;align-items:flex-end;min-height:44px;color:#962b29;text-decoration:none}
.home-account-points>span{font-size:11px}.home-account-points>strong{font-size:26px;line-height:1.25;font-variant-numeric:tabular-nums}.home-account-points strong small{font-size:12px}
.home-account-points:focus-visible{outline:2px solid #962b29;outline-offset:5px;border-radius:4px}
@media(max-width:380px){.home-account{gap:10px;padding:12px}.home-account-person>strong{font-size:15px}.home-account-points>strong{font-size:23px}}

.push-room-preferences{border:1px solid #d5c49c;border-radius:10px;padding:12px;margin:0 0 14px}.push-room-preferences legend{font-weight:700;padding:0 6px}.push-room-preferences label{display:flex;align-items:center;gap:10px;min-height:44px;font-size:16px;cursor:pointer}.push-room-preferences input{width:20px;height:20px;accent-color:#a52323;flex-shrink:0}.push-room-preferences p{font-size:14px;line-height:1.6}

/* Conversation-first layout: compact rows, wide history, controls at its foot. */
.chat-screen { width: min(1120px,calc(100% - 24px)); padding: 16px 20px; border-radius: 14px; }
.chat-host { gap: 10px; padding-bottom: 10px; }
.chat-host > .kizuna-avatar { width: 44px; height: 44px; flex-basis: 44px; }
.chat-host h2 { font-size: 1.125rem; }
.chat-host p { margin: 2px 0 0; font-size: .8125rem; }
.chat-settings { margin: 8px 0; }
.chat-settings > summary, .chat-profile > summary { cursor: pointer; padding: 8px 4px; font-size: .875rem; color: #714536; min-height: 40px; }
.chat-settings[open] { padding-bottom: 12px; border-bottom: 1px solid #ddcbaa; }
.chat-app { margin: 6px 0 12px; }
.chat-screen .chat-state { margin: 4px 0; padding: 6px 10px; font-size: .8125rem; line-height: 1.5; border-radius: 6px; }
.chat-profile { margin: 0 0 4px; }
.chat-room { display: flex; flex-direction: column; height: 76vh; height: 76dvh; min-height: 360px; max-height: 1000px; background: #fffefa; border: 1px solid #dfd4c3; border-radius: 10px; overflow: hidden; }
.chat-actions { flex: 0 0 auto; margin: 0; padding: 6px 10px; gap: 8px; border-bottom: 1px solid #e8dece; }
.chat-actions button, .chat-older { font-size: .875rem; min-height: 40px; padding: 6px 10px; }
.chat-quota { font-size: .875rem; }
.chat-room > .chat-history-note { margin: 0; padding: 4px 10px; font-size: .75rem; line-height: 1.4; }
.chat-older { align-self: center; flex-shrink: 0; margin: 4px; }
.chat-messages { flex: 1 1 0; min-height: 0; max-height: none; margin: 0; padding: 8px 0; border: 0; overflow-y: auto; scrollbar-gutter: stable; }
.chat-message, .chat-message.is-mine { margin: 0; padding: 5px 14px; border-radius: 0; background: transparent; border: 0; box-shadow: none; }
.chat-message.is-mine { background: transparent; box-shadow: none; }
.chat-message:hover { background: transparent; }
.chat-message-heading { gap: 7px; line-height: 1.4; font-size: .875rem; }
.chat-message-heading strong { min-width: 0; overflow-wrap: anywhere; }
.chat-message-heading time { margin-left: 0; color: #796a5e; font-size: .75rem; }
.chat-mini-avatar { width: 22px; height: 22px; flex-basis: 22px; }
.chat-mini-avatar img { width: 63px; left: -22px; top: -1px; }
.chat-screen .chat-message p { font-size: .875rem; line-height: 1.55; margin: 2px 0 0; }
.chat-compose { flex: 0 0 auto; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 4px 8px; padding: 8px 10px; border-top: 1px solid #ded2c0; background: #faf6ef; }
.chat-compose label { grid-column: 1 / -1; margin: 0; font-size: .875rem; }
.chat-compose textarea { grid-column: 1; grid-row: 2; min-height: 48px; height: 54px; max-height: 120px; padding: 8px; font-size: 1rem; line-height: 1.4; }
.chat-compose button { grid-column: 2; grid-row: 2; width: auto; align-self: stretch; padding: 8px 12px; font-size: .875rem; }
.chat-screen .chat-compose .chat-history-note { grid-column: 1 / -1; margin: 0; font-size: .75rem; line-height: 1.4; }
.chat-screen .chat-send-status { grid-column: 1 / -1; margin: 0; font-size: .8125rem; line-height: 1.4; }
.chat-send-status:empty, .nickname-status:empty { display: none; }
.chat-offering-link { font-size: .875rem; padding: 10px; }
@media (max-width: 600px) {
 .chat-screen { width: calc(100% - 12px); padding: 10px 8px; border-radius: 10px; }
 .chat-host h2 { font-size: 1rem; }
 .chat-room { height: 74vh; height: 74dvh; min-height: 340px; }
 .chat-message, .chat-message.is-mine { padding: 5px 10px; margin: 0; }
 .chat-compose { padding: 7px; }
}
/* One chat entrance and an edge-to-edge conversation workspace. */
.chat-entry { display: grid; grid-template-columns: 1fr auto; gap: 5px 16px; margin: 12px 0 22px; padding: 22px 24px; border-radius: 16px; background: #752b35; color: #fff; text-decoration: none; box-shadow: 0 6px 18px #55233022; }
.chat-entry span { font-size: 1.25rem; font-weight: 800; }
.chat-entry small { grid-column: 1; font-size: .875rem; }
.chat-entry b { grid-column: 2; grid-row: 1 / 3; align-self: center; font-size: 1.5rem; }
body:is([data-screen="openChat"],[data-screen="privateChat"]) { overflow: hidden; }
body:is([data-screen="openChat"],[data-screen="privateChat"]) .screen-toolbar { visibility: hidden; }
#screenTitle:focus { outline: none; }
.chat-screen:not([hidden]) { position: fixed; z-index: 250; inset: var(--chat-top,0px) 0 auto; width: 100%; height: 100dvh; height: var(--chat-height,100dvh); margin: 0; padding: max(8px,env(safe-area-inset-top)) max(10px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left)); border: 0; border-radius: 0; display: flex; flex-direction: column; overflow: hidden; background: #fffdf8; }
.chat-host { flex: 0 0 auto; justify-content: space-between; padding: 0 0 8px; }
.chat-host button { min-height: 42px; padding: 8px 12px; font: inherit; font-size: .875rem; color: #752b35; background: #fff; border: 1px solid #d2beaa; border-radius: 8px; cursor: pointer; }
.chat-host h2 { font-family: var(--sans, sans-serif); font-size: 1rem; }
.chat-room-nav { display: flex; flex: 0 0 auto; align-items: center; justify-content: space-between; gap: 12px; padding: 7px 0; font-size: .875rem; }
.chat-room-nav label { display: flex; align-items: center; gap: 8px; min-width: 0; flex: 1; }
.chat-room-nav select { min-width: 0; max-width: 100%; width: 300px; font: inherit; font-size: 1rem; border: 1px solid #ddcbaa; border-radius: 6px; padding: 9px 6px; background: white; color: #30251f; }
.chat-room-nav a { color: #752b35; font-weight: 700; padding: 10px 4px; flex-shrink: 0; }
.chat-screen .chat-app { min-height: 0; flex: 1; display: flex; flex-direction: column; margin: 0; }
.chat-screen .chat-account { min-height: 0; flex: 1; display: flex; flex-direction: column; }
.chat-screen .chat-room { min-height: 0; max-height: none; height: auto; flex: 1; }
.chat-screen .chat-state { flex-shrink: 0; }
.chat-screen .chat-inbox { display: flex; align-items: center; gap: 8px; padding: 4px 0; }
.chat-screen .chat-inbox label { margin: 0; font-size: .875rem; flex-shrink: 0; }
.chat-screen .chat-inbox select { padding: 7px; }
.chat-screen .chat-settings { position: absolute; z-index: 5; right: 8px; top: max(60px,calc(env(safe-area-inset-top) + 54px)); width: min(520px,calc(100% - 16px)); max-height: calc(100% - 76px); overflow-y: auto; margin: 0; }
.chat-screen .chat-settings:not([open]) { display: none; }
.chat-screen .chat-settings[open] { padding: 16px; background: #fffdf8; border: 1px solid #ba9a76; border-radius: 12px; box-shadow: 0 10px 40px #30233355; }
.chat-settings input { width: 100%; font-size: 1rem; padding: 8px; }
.chat-settings button { min-height: 44px; font: inherit; padding: 8px 12px; cursor: pointer; }
.chat-settings .channel-manager { border-top: 1px solid #ddcbaa; margin-top: 16px; }
.chat-settings .channel-manager form { margin-bottom: 16px; }
.chat-screen [hidden] { display: none !important; }
.chat-locked { margin: auto; padding: 24px; max-width: 560px; border: 1px solid #ddcbaa; border-radius: 12px; }
.chat-locked a { color: #752b35; }
.chat-signin { align-self: center; margin: 24px; }
@media (max-width: 480px) { .chat-host h2 { font-size: .875rem; } .chat-host { gap: 6px; } .chat-room-nav { gap: 6px; } .chat-room-nav label { font-size: 0; gap: 0; } .chat-room-nav span { font-size: .75rem; } .chat-entry { padding: 18px; } }

.shrine-menu-grid a[href="#siteGuide"] { grid-column: 1 / -1; min-height: 64px; flex-direction: row; }

.chat-music-bar { flex: 0 0 auto; display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; padding: 5px 0 8px; border-bottom: 1px solid #e4d9c5; }
.chat-music-bar button { min-height: 40px; border: 1px solid #ba9a76; background: #fff; color: #752b35; border-radius: 7px; padding: 6px 10px; font-size: .875rem; cursor: pointer; }
.chat-music-bar label { display: flex; gap: 6px; align-items: center; font-size: .875rem; flex: 1; min-width: 0; }
.chat-music-bar select { width: 100%; max-width: 340px; min-width: 0; border: 1px solid #ddcbaa; background: white; color: #30251f; border-radius: 6px; padding: 7px; font-size: 1rem; }
.chat-music-bar a { font-size: .75rem; color: #71564b; }
.chat-bgm-status { flex-basis: 100%; font-size: .75rem; color: #8d211d; }
.chat-bgm-status:empty { display: none; }
@media (max-width: 440px) { .chat-music-bar { gap: 5px; } .chat-music-bar a { flex-basis: 100%; text-align: right; } }

.chat-message-menu { margin-left: auto; border: 0 !important; background: transparent !important; box-shadow: none; min-width: 36px; min-height: 28px !important; padding: 0 8px !important; color: #75665b !important; font-size: 1.125rem !important; line-height: 1; }
.chat-message.is-mine { -webkit-touch-callout: none; }
.chat-edited { font-size: .75rem; color: #796a5e; }
.chat-screen .chat-deleted { color: #796a5e; font-style: italic; }
.chat-message-dialog { width: min(480px,calc(100% - 24px)); max-height: 85dvh; overflow-y: auto; padding: 20px; border: 1px solid #c4a985; border-radius: 14px; background: #fffdf8; color: #30251f; }
.chat-message-dialog::backdrop { background: #19100d80; }
.chat-message-dialog-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.chat-message-dialog h2 { font-size: 1.125rem; margin: 0; }
.chat-message-dialog button { min-height: 44px; padding: 9px 14px; font: inherit; font-size: .875rem; border: 1px solid #b89c7c; border-radius: 8px; color: #752b35; background: white; cursor: pointer; }
.chat-message-dialog button:disabled { opacity: .5; cursor: wait; }
.chat-message-dialog .message-preview { white-space: pre-wrap; overflow-wrap: anywhere; max-height: 160px; overflow-y: auto; font-size: .875rem; line-height: 1.6; }
.message-choices { display: flex; gap: 10px; }
.chat-message-dialog textarea { display: block; width: 100%; min-height: 120px; margin: 8px 0 14px; padding: 10px; font: inherit; font-size: 1rem; }
.chat-message-dialog .message-confirm { background: #752b35; color: white; }
.chat-message-dialog [hidden] { display: none !important; }
.message-edit-status { font-size: .875rem; }

/* Owner-only moderation controls stay inside chat settings. */
.chat-moderation { margin: 16px 0; padding: 12px; border: 1px solid #bba78f; border-radius: 10px; }
.chat-moderation input { width:100%; box-sizing:border-box; padding:10px; }
.chat-moderation button { min-height:44px; margin:5px 0; }
.moderation-row { display:flex; gap:12px; align-items:center; justify-content:space-between; padding:6px 0; }
.moderation-row span { overflow-wrap:anywhere; min-width:0; }
.moderation-row button { flex-shrink:0; }

/* Text-only transparent tickers, with the shrine scenery visible behind them. */
.daily-info { box-sizing:border-box; width:100%; max-width:none; margin:0 0 4px; padding:0; color:rgba(255,255,255,.94); text-shadow:0 1px 3px #17110d,0 0 5px #17110db3; background:transparent; border:0; }
.ticker-row { display:flex; gap:10px; align-items:center; min-height:40px; }
.ticker-label { flex:none; font-size:.875rem; }
.ticker-window { min-width:0; flex:1; overflow:hidden; background:transparent; border:0; }
.ticker-track { display:flex; width:max-content; animation:ticker-scroll var(--ticker-duration,90s) linear infinite; will-change:transform; }
.ticker-group { display:flex; align-items:center; flex-shrink:0; }
.ticker-group>a,.ticker-group>span { display:block; white-space:nowrap; padding:8px 24px 8px 0; font-size:1rem; font-weight:600; text-decoration:none; }
@keyframes ticker-scroll { from { transform:translateX(0); } to { transform:translateX(-50%); } }
.ticker-track.paused { animation-play-state:paused; }
/* Do not pause on hover: touchscreens can retain a synthetic hover indefinitely. */
.ticker-window:has(a:focus-visible) .ticker-track { animation-play-state:paused; }
.daily-info a,.daily-info button,.daily-info summary { color:inherit; text-shadow:inherit; }
.daily-info button { background:transparent; border:0; padding:8px 4px; min-height:44px; font:inherit; font-size:.875rem; cursor:pointer; text-decoration:underline; text-underline-offset:4px; }
.daily-info summary { cursor:pointer; padding:5px 0; font-size:.875rem; }
.daily-note { font-size:.875rem; line-height:1.6; margin:6px 0; }
.news-details li { padding:7px 0; line-height:1.7; overflow-wrap:anywhere; }
.daily-info details[open] { padding-bottom:12px; }
.weather-details h2 { font-size:1rem; margin:10px 0; }
.general-news-links { display:flex; flex-wrap:wrap; gap:10px; font-size:.875rem; }
.weather-days { display:flex; flex-direction:column; gap:8px; }
.weather-day { display:flex; flex-wrap:wrap; gap:8px; line-height:1.7; }
.weather-footer { display:flex; flex-wrap:wrap; gap:12px; align-items:center; font-size:.875rem; }
.weather-region-dialog button { border:1px solid #ab795e; border-radius:7px; background:#fffaf2; color:#702e24; padding:8px 12px; min-height:44px; font:inherit; cursor:pointer; }
.weather-region-dialog { width:min(460px,calc(100% - 32px)); max-height:85dvh; overflow:auto; border:1px solid #ab795e; border-radius:16px; padding:24px; color:#34251e; background:#fffaf2; box-sizing:border-box; }
.weather-region-dialog::backdrop { background:#17100bb3; }
.weather-region-dialog h2 { margin-top:0; font-size:1.3rem; }
.weather-region-dialog p { line-height:1.7; }
.weather-region-dialog label { display:block; margin-top:16px; }
.weather-region-dialog select { display:block; width:100%; min-height:48px; margin-top:6px; padding:8px; font:inherit; border:1px solid #ad9376; border-radius:6px; background:white; }
.weather-dialog-actions { display:flex; justify-content:space-between; gap:12px; margin-top:16px; }
#weatherSave { background:#9d3028; color:white; }

/* Reduced motion starts paused in JS; pressing play explicitly enables normal speed. */
.ticker-track { animation-duration:var(--ticker-duration,90s) !important; }

.ticker-controls { display:flex; justify-content:flex-end; padding-inline:12px; }
.ticker-status { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }

/* Keep audio beside the brand; account details follow the character introduction. */
.header-brand-controls{display:flex;align-items:center;gap:14px;min-width:0}
.header-sound-toggle{flex-shrink:0;min-height:44px;font-size:14px;white-space:nowrap}
.site-header{height:auto;min-height:94px;gap:12px;flex-wrap:wrap;padding-block:8px}
.shrine-stage>.home-account{margin:16px auto 10px}
@media(max-width:560px){
 .site-header{min-height:70px;gap:0}
 .header-brand-controls{width:100%;justify-content:space-between;gap:8px}
 .header-sound-toggle{min-width:92px;padding:9px 8px;font-size:14px}
 .header-brand-controls .brand{min-width:0;flex-shrink:1}
 .header-brand-controls .brand b{white-space:nowrap}
 .shrine-stage>.home-account{margin-top:14px;margin-bottom:8px}
}
@media(max-width:360px){
 .header-brand-controls .brand{gap:6px;padding-right:7px}
 .header-brand-controls .brand-mark{width:36px;height:36px;flex-basis:36px}
 .header-brand-controls .brand b{font-size:18px}
}

/* Transparent news and weather scroll across the character's feet. */
.foot-tickers{position:absolute;z-index:4;left:0;right:0;bottom:0;width:100%;padding:0 12px 4px;background:transparent;pointer-events:none}
.fortune-announcement{height:31px;overflow:hidden;color:#ffefc6;text-shadow:0 2px 5px #271220,0 0 9px #5a2874;background:#3d244baa;border-radius:8px;margin-bottom:4px}
.fortune-announcement-track{display:flex;align-items:center;width:max-content;min-height:31px;white-space:nowrap;animation:fortune-announcement-scroll 22s linear infinite}
.fortune-announcement-track span{flex:none;padding-inline:15px;font-size:14px;font-weight:800}
@keyframes fortune-announcement-scroll{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.fortune-announcement-track{animation:none}.fortune-announcement{overflow:auto}}
.foot-tickers .daily-info{margin:0;min-width:0}
.foot-tickers #dailyNews{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:8px}
.foot-tickers #dailyNews>.ticker-window{grid-column:1;grid-row:1}
.foot-tickers .ticker-controls{grid-column:2;grid-row:1}
.foot-tickers #newsStatus{grid-column:1/-1}
.foot-tickers a,.foot-tickers button{pointer-events:auto}
.foot-tickers .ticker-status{font-size:14px;line-height:1.4;margin:2px 0}
.foot-tickers .ticker-status:empty{display:none}
@media(max-width:560px){.foot-tickers{padding-inline:8px}.foot-tickers .ticker-group>a,.foot-tickers .ticker-group>span{padding-block:6px}}

.shrine-menu-grid a.line-stickers-menu { grid-column: 1 / -1; min-height: 70px; flex-direction: row; }
.line-stickers { text-align: center; }
.sticker-purchase-visual { position: relative; width: min(100%, 700px); aspect-ratio: 2.35 / 1; margin: 0 auto; overflow: hidden; border: 1px solid #eadfcd; border-radius: 14px; background: #fff; box-shadow: 0 6px 18px rgba(71,48,28,.09); }
.sticker-purchase-image { display: block; width: 100%; height: auto; margin: 0; }
.line-stickers-buy { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; max-width: 100%; padding: 12px 24px; border-radius: 12px; color: #fff; background: #087d38; font-size: 17px; font-weight: 700; text-decoration: none; }
.sticker-purchase-visual .line-stickers-buy { position: absolute; right: clamp(8px, 4%, 25px); bottom: clamp(8px, 8%, 20px); min-height: 38px; max-width: 47%; padding: 7px 12px; font-size: clamp(12px, 1.8vw, 14px); line-height: 1.2; box-shadow: 0 4px 12px rgba(5,73,31,.19); }
.line-stickers-buy:hover { background: #05652c; }
.line-stickers-buy:focus-visible { outline: 3px solid #38281d; outline-offset: 4px; }
.line-stickers-unavailable,
.line-stickers-unavailable:hover { background: #8a8177; box-shadow: none; cursor: default; }
.line-stickers-note { font-size: 14px; line-height: 1.8; }

.sticker-product { padding: 4px 0 10px; }
.sticker-purchase-card { padding-inline: 0; }
.sticker-product + .sticker-product { border-top: 1px solid #d3b574; padding-top: 12px; margin-top: 8px; }
.sticker-coming-soon { display: inline-block; padding: 8px 18px; border-radius: 999px; color: #75371b; background: #ffe6ac; font-weight: 700; }

.shrine-menu-grid a.shrine-shop-entry { grid-column: 1 / -1; min-height: 76px; flex-direction: row; }
.shop-menu-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 600px) { .shop-menu-grid { grid-template-columns: 1fr; } .shop-menu-grid a { min-height: 88px; flex-direction: row; gap: 16px; } }

.fortune-purchase-history { margin: 16px 0; text-align: left; }
.fortune-purchase-history > summary { cursor: pointer; padding: 14px 18px; min-height: 48px; border: 1px solid #b58b4e; border-radius: 10px; background: #fff8e9; color: #603c23; font-size: 16px; font-weight: 700; }
.fortune-purchase-history > summary:focus-visible { outline: 3px solid #8f2924; outline-offset: 3px; }
.fortune-purchase-history[open] > summary { margin-bottom: 12px; }

.fortune-entrance-options { display: grid; gap: 18px; text-align: center; }
.shop-host { position: relative; height: clamp(270px, 48vw, 380px); width: 100%; overflow: hidden; border-radius: 16px; margin: 0 0 20px; background: url('/assets/shop-autumn.webp') center / cover; }
.shop-host img { display: block; position: absolute; width: 260px; max-width: 75%; height: 440px; object-fit: contain; object-position: top; left: 50%; top: 8px; transform: translateX(-50%); }
.shop-host-caption { position: absolute; bottom: 12px; left: 12px; right: 12px; margin: 0; padding: 10px; background: rgba(255,250,241,.95); color: #582e21; border-radius: 12px; text-align: center; font-size: 16px; line-height: 1.6; }
.shop-host-voice { position: absolute; top: 10px; right: 10px; min-height: 44px; padding: 8px 12px; font-size: 14px; }

.charm-gallery-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;border-radius:14px;background:#fffaf0;scrollbar-width:thin}.charm-gallery-slide{flex:0 0 100%;min-width:0;scroll-snap-align:start;scroll-snap-stop:always;display:grid;place-items:center}.charm-gallery-slide img{display:block;width:100%;height:clamp(300px,65vh,650px);object-fit:contain}.charm-gallery-empty{width:100%;min-height:240px;border:1px dashed #ba9b6c;border-radius:14px;background:#fffaf0;cursor:pointer;font:inherit}.charm-gallery-empty small{font-size:14px}.charm-gallery-nav{display:flex;justify-content:center;align-items:center;gap:24px;margin-top:12px}.charm-gallery-nav button{width:48px;height:48px;background:#fffaf0;color:#8d2222;border:1px solid #ba9b6c;border-radius:50%;font-size:28px;cursor:pointer}.charm-gallery-nav button:disabled{opacity:.35;cursor:default}.home-favorite .favorite-photo-actions{grid-template-columns:repeat(3,minmax(0,1fr))}.home-favorite .favorite-photo-actions button{line-height:1.4;padding:10px 4px}.home-favorite [hidden]{display:none!important}.home-favorite :focus-visible{outline:3px solid #416f9d;outline-offset:3px}
.charm-gallery-slide{position:relative}.charm-gallery-count{position:absolute;right:12px;bottom:12px;border-radius:18px;padding:6px 12px;background:#4c2c20eb;color:#fff;font-size:15px;font-weight:700}.owned-charm-count{font-weight:700;color:#693b21}

.menu-primary.menu-shop{margin-top:12px;background:linear-gradient(135deg,#367c75,#194b49);border-color:#cfbd7c}.shop-host{height:auto;aspect-ratio:3/2;background:#eadbc3}.shop-host img{position:static;width:100%;max-width:none;height:100%;object-fit:cover;object-position:center;transform:none}.shop-host-caption{bottom:8px;font-size:15px}.shop-host-voice{background:rgba(255,250,241,.96);color:#582e21;border:1px solid #bda06b;border-radius:8px}
.shrine-menu .menu-primary.menu-ruri{background:linear-gradient(135deg,#685b99,#352652);border-color:#d4bfea}
.shrine-menu .menu-primary.menu-bond{background:linear-gradient(135deg,#9a7237,#60421d);border-color:#f3db9a}
.shrine-menu .menu-primary.menu-shop{margin-top:12px}
.product-point-link{display:block;width:fit-content;margin:10px 0;padding:10px 14px;border:1px solid #b8904f;border-radius:10px;background:#ffefc8;color:#6e3e20!important;text-decoration:none;font-weight:700;font-size:.92rem;line-height:1.4}
.product-point-link:hover,.product-point-link:focus-visible{background:#f7db9e;outline:2px solid #8d5324;outline-offset:2px}

.shop-menu-grid{grid-template-columns:repeat(2,minmax(0,1fr))}@media(max-width:540px){.shop-menu-grid{grid-template-columns:1fr}}
/* Clear first-visit surface; seasonal scenery remains visible behind the text. */
.welcome-gate .welcome-card{background:transparent;border-color:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.welcome-gate .welcome-rule{background:none}
.welcome-gate::before{background-image:var(--welcome-tint,linear-gradient(transparent,transparent)),var(--season-background);filter:var(--welcome-light,brightness(1.12));transition:filter 1s ease}
body[data-time="morning"] .welcome-gate{--welcome-light:brightness(1.16) saturate(1.04);--welcome-tint:linear-gradient(120deg,rgba(255,211,133,.14),rgba(255,245,219,.03))}
body[data-time="day"] .welcome-gate{--welcome-light:brightness(1.2) saturate(1.04);--welcome-tint:linear-gradient(rgba(255,255,255,.02),rgba(255,255,255,.02))}
body[data-time="evening"] .welcome-gate{--welcome-light:brightness(1.04) saturate(1.12);--welcome-tint:linear-gradient(135deg,rgba(255,147,70,.25),rgba(130,58,83,.12))}
body[data-time="night"] .welcome-gate{--welcome-light:brightness(.78) saturate(.85);--welcome-tint:linear-gradient(rgba(20,40,94,.26),rgba(16,34,78,.18))}
.welcome-card h1{background:none;color:#8b201b;-webkit-text-fill-color:currentColor;text-shadow:0 1px 3px #fff8e8,0 0 12px #fff8e8}
.welcome-card>p,.welcome-card>p:first-of-type,.welcome-card .welcome-date,.welcome-card>small{color:#392018;text-shadow:0 1px 3px #fff8e8,0 0 9px #fff8e8;font-weight:700}
.welcome-card>small{font-size:13px}
body[data-time="night"] .welcome-card h1,body[data-time="night"] .welcome-card>p,body[data-time="night"] .welcome-card>small{color:#fff4d5;text-shadow:0 2px 4px #14202d,0 0 10px #14202d}
@media(prefers-reduced-motion:reduce){.welcome-gate::before{transition:none}}

/* Auspicious-day divine visitors; the normal courtyard returns the next day. */
.header-rokuyo{flex-shrink:0;white-space:nowrap;font-family:serif;font-size:24px;font-weight:900;line-height:1.2;color:#8c3526;text-shadow:0 1px 3px #fff}
body[data-divine="true"] .header-rokuyo{padding:5px 11px;border:2px solid #b36b12;border-radius:11px;background:linear-gradient(125deg,#fff4ad 0%,#f2ba43 38%,#ffe897 58%,#d68720 100%);color:#612515;text-shadow:0 1px 0 #fff9ce,0 0 9px #fff8ad;box-shadow:0 0 12px #ffd76e,0 2px 7px #ad632a82;animation:rokuyo-golden 3s ease-in-out infinite alternate}
@keyframes rokuyo-golden{to{box-shadow:0 0 19px #ffcb43,0 0 6px #fff2b8 inset,0 2px 7px #ad632a82}}
@media(prefers-reduced-motion:reduce){body[data-divine="true"] .header-rokuyo{animation:none}}
body[data-divine="true"] #fortuneRack{display:none!important}
body[data-divine="true"][data-time="night"]{--scene-light:brightness(.43) saturate(.72);--scene-tint:linear-gradient(180deg,rgba(14,28,74,.38),rgba(12,24,57,.2))}
@media(max-width:420px){.header-brand-controls{gap:6px}.header-rokuyo{font-size:20px}body[data-divine="true"] .header-rokuyo{padding:4px 6px}.header-sound-toggle{padding:8px;font-size:12px}}

/* Gods hover above the courtyard; their breathing is slower than their ascent. */
body[data-divine="true"] .character-stage .courtyard-scene #weekdayGoddess {
  bottom: 3%;
  transform-origin: 50% 60%;
  animation: divine-hover-breathe 8.4s ease-in-out infinite;
}
@keyframes divine-hover-breathe {
  0%,100% { transform: translate(-50%,-10px) rotate(-.25deg) scale(1,1); }
  25% { transform: translate(-50%,-17px) rotate(0deg) scale(1.003,1.009); }
  50% { transform: translate(-50%,-22px) rotate(.25deg) scale(1,1); }
  75% { transform: translate(-50%,-17px) rotate(0deg) scale(1.003,1.009); }
}
body[data-divine="true"] .foot-shadow {
  animation: divine-shadow 8.4s ease-in-out infinite;
}
@keyframes divine-shadow {
  0%,100% { transform: translateX(-50%) scale(1); opacity: .55; }
  50% { transform: translateX(-50%) scale(.84); opacity: .32; }
}
@media(max-width:560px) {
  body[data-divine="true"] .character-stage .courtyard-scene #weekdayGoddess { height:90%; }
}

/* Keep every weekday portrait fully inside narrow screens. Some portraits use
   more of their source canvas horizontally, so a height-only size can crop
   half of the character on phones. */
@media(max-width:560px) {
  .character-stage .courtyard-scene #weekdayGoddess,
  body[data-divine="true"] .character-stage .courtyard-scene #weekdayGoddess {
    width: auto;
    height: auto;
    max-width: calc(100% - 16px);
    max-height: 94%;
    object-fit: contain;
    object-position: center bottom;
  }
}
@media(prefers-reduced-motion:reduce) {
  body[data-divine="true"] .character-stage .courtyard-scene #weekdayGoddess {
    animation:none!important; transform:translate(-50%,-14px); will-change:auto;
  }
  body[data-divine="true"] .foot-shadow { animation:none; opacity:.42; }
}

/* Shinkuji consultation ticket and a private, two-account room. */
.consult-product{display:grid;grid-template-columns:160px 1fr;gap:28px;align-items:center;margin:24px 0}
.shinkuji-art{box-sizing:border-box;min-width:0;min-height:260px;padding:15px 5px;border:double 6px #b48b3f;background:linear-gradient(135deg,#fffdf2,#f5e5bc);color:#8d211d;display:flex;align-items:center;flex-direction:column;justify-content:space-between;gap:7px;border-radius:8px;text-align:center;overflow:hidden}
.shinkuji-art span{font:700 12px/1.2 var(--serif);white-space:nowrap;letter-spacing:0}.shinkuji-art strong{writing-mode:vertical-rl;text-orientation:upright;white-space:nowrap;font:800 34px/1 var(--serif);letter-spacing:.08em}.shinkuji-art small{font:700 11px/1.2 var(--serif);white-space:nowrap;letter-spacing:0}
.consult-buy{min-height:48px;padding:12px 24px;border-radius:8px;border:1px solid #8d211d;background:#a51f1c;color:#fff;font-family:inherit;font-size:16px;font-weight:700;cursor:pointer}.consult-buy:disabled{border-color:#ccb885;background:#eee6d6;color:#74654d;cursor:not-allowed}.consult-terms{line-height:1.9;padding-left:22px}
body[data-screen="consultationChat"]{overflow:hidden}body[data-screen="consultationChat"] .screen-toolbar{visibility:hidden}
.consult-screen:not([hidden]){position:fixed;z-index:250;inset:var(--chat-top,0px) 0 auto;width:100%;height:var(--chat-height,100dvh);padding:max(8px,env(safe-area-inset-top)) 12px max(8px,env(safe-area-inset-bottom));background:#fffdf8;display:flex;flex-direction:column;overflow:hidden;color:#322b24}
.consult-screen .chat-host{flex-shrink:0}.consult-screen .chat-host h2{font-size:clamp(16px,3vw,22px)}
.consult-screen .chat-login{display:flex;align-items:center;gap:8px;margin:0;font-size:12px}.consult-screen .chat-login p{margin:4px 0}.consult-screen .chat-login button{padding:6px;font-size:12px}
.consult-notice{font-size:12px;margin:3px 0;color:#756046}.consult-toolbar{display:flex;gap:8px;align-items:center;margin:6px 0}.consult-toolbar select{min-width:0;flex:1;max-width:650px;padding:7px}
.consult-timer-row{display:flex;align-items:center;gap:12px;background:#f3ead6;padding:8px 12px;border-radius:8px}.consult-timer-row strong{font-variant-numeric:tabular-nums;font-size:26px;margin-left:auto}.consult-timer-row span{font-size:12px}
#consultStatus{font-size:12px;margin:6px 0}#consultMessages{min-height:0;flex:1;overflow-y:auto;padding:10px 2px}.consult-screen .chat-message{font-size:14px}.consult-screen .chat-message p{white-space:pre-wrap;overflow-wrap:anywhere;margin:3px 0;line-height:1.5}.consult-screen .chat-message header{display:flex;gap:8px;align-items:center}.consult-screen .chat-message time{font-size:11px;color:#847563}.consult-screen .chat-message details{margin-left:auto}
.consult-screen .chat-compose{flex-shrink:0}.consult-screen .chat-compose textarea{min-width:0;font-size:16px}.consult-screen .consult-links,.consult-screen #consultAdmin{font-size:12px;max-height:26vh;overflow:auto;margin-top:5px}.consult-screen #consultAdmin select{max-width:100%}
@media(max-width:560px){.consult-product{grid-template-columns:110px 1fr;gap:16px}.shinkuji-art{min-height:220px;padding:11px 3px}.shinkuji-art span{font-size:10px}.shinkuji-art strong{font-size:30px}.shinkuji-art small{font-size:10px}.consult-product p{font-size:14px}.consult-timer-row{gap:6px;padding:6px}.consult-timer-row strong{font-size:23px}}

.consult-tabs{display:flex;gap:6px;margin:6px 0;flex-shrink:0}.consult-tabs button{flex:1;padding:9px;border:1px solid #d3be95;border-radius:7px;background:#faf4e6;color:#644829}.consult-tabs button[aria-pressed="true"]{background:#8d211d;color:white;border-color:#8d211d}
.consult-panel{min-height:0;flex:1;display:flex;flex-direction:column;overflow:hidden}.consult-panel[hidden]{display:none}
#consultBookingState{font-weight:700;color:#8d211d;font-size:14px;margin:5px 0}.booking-hours,.booking-help{font-size:12px;line-height:1.5;margin:4px 0}
#consultBookingForm{display:grid;grid-template-columns:auto minmax(0,1fr) auto minmax(0,1fr);gap:6px;align-items:center}#consultBookingForm label{font-size:12px}#consultBookingForm input,#consultBookingForm select{min-width:0;max-width:100%;font-size:16px;padding:7px}#consultRequest{grid-column:1/-1;padding:9px;background:#8d211d;color:white;border:0;border-radius:6px}
#consultBookingNotes{min-height:60px;flex:1;overflow-y:auto;padding:7px;background:#faf8f0;border-top:1px solid #e5dccb}.booking-note{padding:8px 4px;border-bottom:1px solid #e6dfd1;font-size:14px}.booking-note strong{font-size:11px;color:#7c6954}.booking-note p{white-space:pre-wrap;overflow-wrap:anywhere;margin:4px 0;line-height:1.5}.booking-event{color:#835726;background:#faf1d7}
#consultBookingMessage{display:grid;grid-template-columns:1fr auto;gap:5px;margin-top:5px}#consultBookingMessage label{grid-column:1/-1;font-size:12px}#consultBookingText{min-width:0;resize:none;font-size:16px;padding:8px}#consultBookingSend{background:#8d211d;color:white;border:0;border-radius:6px;padding:8px}#consultBookingFeedback{font-size:12px;margin:3px 0}
#consultNotifySettings{font-size:12px;flex-shrink:0;max-height:40vh;overflow:auto}#consultNotifySettings .push-settings{margin:6px 0;padding:10px}#consultBookingAdmin{display:flex;gap:6px}.consult-screen button:disabled{opacity:.5;cursor:not-allowed}
@media(max-width:420px){#consultBookingForm{grid-template-columns:1fr 1fr}#consultBookingForm label{display:none}.consult-notice{font-size:11px}.consult-screen .chat-login{font-size:11px}.booking-help{font-size:11px}}
/* Tappable reservation board: identities never appear on the shared calendar. */
#adminReservations[hidden]{display:none!important}
#consultBookingForm{display:block}
.reservation-week{display:flex;justify-content:space-between;gap:12px;margin:12px 0}
.reservation-days{display:flex;gap:7px;overflow-x:auto;padding:4px 0 12px}
.reservation-days button{flex:0 0 86px;min-height:54px}
.reservation-slots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:12px 0}
.reservation-slots button{min-height:48px;padding:10px 4px}
.reservation-days button[aria-pressed=true],.reservation-slots button[aria-pressed=true]{background:#a62125;color:#fff;border-color:#a62125}
.reservation-slots button:disabled{opacity:.5;background:#e7e2dc;color:#59534b}
#reservationList{display:grid;gap:10px;margin:16px 0}
.reservation-card{white-space:pre-line;text-align:left;padding:16px;min-height:64px}
#consultRequest{width:100%;min-height:48px;margin:10px 0}
#consultBookingTime[hidden]{display:none!important}
/* Owned items share one square size on both sides of the courtyard. */
.courtyard-scene{--home-item-size:clamp(32px,min(7svh,5vw,48px),56px)}
.foot-tickers .ticker-controls{position:relative;flex-direction:row;align-items:center;justify-content:flex-end;gap:0;padding-inline:12px}
.home-right-rail{position:absolute;z-index:10;top:8px;right:8px;display:flex;flex-direction:column;align-items:center;gap:8px}
.home-right-rail button{box-sizing:border-box;flex:none;width:var(--home-item-size);height:var(--home-item-size);cursor:pointer}
.home-right-rail .special-fortune-glow{display:grid;place-items:center;border:0;padding:0;background:transparent;filter:drop-shadow(0 0 7px #ffe576) drop-shadow(0 0 17px #ffbf3b);animation:fortune-icon-glow 2.8s ease-in-out infinite alternate}
.home-right-rail .special-fortune-glow svg{display:block;width:100%;height:100%;overflow:visible}
.home-right-rail button:focus-visible{outline:3px solid #ffe576;outline-offset:2px}
.home-right-rail .home-crystal-glow{display:grid;place-items:center;border:1px solid #d8eaff;border-radius:50%;padding:2px;background:radial-gradient(circle at 35% 20%,#fff,#eaf7ff 55%,#a4bee0);box-shadow:0 0 12px #f3fdff,0 0 24px #c1eaff;animation:crystal-icon-glow 2.9s ease-in-out infinite alternate}
.home-crystal-glow svg{display:block;width:100%;height:100%;filter:drop-shadow(0 0 4px #fff)}
.home-right-rail .home-fortune-ticket{position:relative;display:grid;place-items:center;flex:none;box-sizing:border-box;width:var(--home-item-size);height:var(--home-item-size);border-radius:8px;background:radial-gradient(circle at 50% 32%,#69598f,#241c42 80%);box-shadow:0 0 8px #f7dea6,0 0 19px #ad8fd1;cursor:pointer}
.home-right-rail .home-fortune-ticket[hidden]{display:none}
.home-fortune-ticket svg{display:block;width:100%;height:100%;filter:drop-shadow(0 1px 3px #2a183c)}
.home-fortune-ticket-count{position:absolute;right:-4px;bottom:-4px;min-width:16px;height:16px;padding:0 2px;border-radius:10px;border:1px solid #fff0cc;background:#683076;color:#fff;font:700 11px/16px sans-serif;text-align:center}
.home-right-rail .home-fortune-ticket:focus-visible{outline:3px solid #ffe576;outline-offset:2px}
@keyframes crystal-icon-glow{to{box-shadow:0 0 17px #ebffff,0 0 30px #b397ff;transform:translateY(-2px)}}
@keyframes fortune-icon-glow{to{filter:drop-shadow(0 0 12px #fff5ba) drop-shadow(0 0 26px #ffbd30);transform:translateY(-2px)}}
@media(max-width:560px){.courtyard-scene{--home-item-size:clamp(32px,min(6.2svh,11vw),48px)}.home-right-rail{top:6px;right:5px;gap:5px}}
@media(prefers-reduced-motion:reduce){.special-fortune-glow{animation:none}}
.consult-test-row{min-height:25px;margin:5px 0 0;display:flex;flex-wrap:wrap;align-items:center;gap:8px}.consult-test-row:has(>[hidden]:first-child):has(>[hidden]:last-child){display:none}.consult-test-row button,.consult-test-row a{font-family:inherit;font-size:12px;font-weight:600;line-height:1.4;color:#755b3d;background:none;border:0;padding:3px;text-decoration:underline;cursor:pointer}.consult-test-row [hidden]{display:none}
.home-right-rail .home-consult-ticket{padding:3px;border:2px double #a7762e;border-radius:5px;background:linear-gradient(135deg,#fff7de,#e4c889);color:#7a201a;writing-mode:vertical-rl;text-orientation:upright;font:800 clamp(12px,2vw,15px)/1 var(--serif);letter-spacing:.06em;box-shadow:0 3px 9px #29190d88}
#homeConsultDialog .home-charm-dialog-inner button{display:inline-block;min-height:44px;margin:7px;padding:8px 12px;border-radius:8px;border:1px solid #a94437;background:#a51f1c;color:white;font-family:inherit;font-size:15px;font-weight:700;cursor:pointer}

/* Tea room entry and focused one-to-one consultation. */
.tea-entrance{width:min(760px,calc(100% - 24px));margin:0 auto 28px}
.tea-welcome{position:relative;overflow:hidden;border-radius:18px;background:#754c31}
.tea-welcome img{display:block;width:100%;aspect-ratio:3/2;max-height:440px;object-fit:cover;object-position:center 43%}
.tea-welcome p{position:absolute;inset:auto 0 0;margin:0;padding:28px 8px 15px;background:linear-gradient(transparent,#21170cbb);color:white;font:700 clamp(12px,3.6vw,25px)/1.45 var(--serif);letter-spacing:-.025em;white-space:nowrap;text-align:center;text-shadow:0 2px 8px #21170c}
.tea-choices{display:grid;gap:12px;margin-top:15px}
.tea-choices .menu-primary.menu-shop{margin-top:0}
.tea-choices .menu-primary[aria-disabled="true"]{opacity:.55;filter:grayscale(.6);cursor:not-allowed}
#teaBusy{margin:0;color:#7b3325;font-size:14px;text-align:center}
.tea-auth{margin:16px 0;text-align:center}
.tea-auth .google-login{min-height:48px;padding:10px 18px;border:1px solid #a7593c;border-radius:10px;background:#fff7e7;color:#743621;font:700 16px var(--sans);cursor:pointer}
.tea-auth .google-logout,.chat-screen>.chat-settings .chat-login,.consult-screen>.chat-login{display:none!important}
.consult-screen[data-mode="session"] .consult-portrait{display:block;position:relative;flex:0 0 min(27dvh,280px);min-height:0;overflow:hidden;border-radius:13px;background:#8b694c}
.consult-screen[data-mode="booking"] .consult-portrait{display:none}
.consult-portrait img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 37%}
.consult-portrait strong{position:absolute;bottom:0;left:0;right:0;padding:17px 12px 8px;background:linear-gradient(transparent,#21180dd1);color:white;text-align:center;font:700 17px var(--serif);text-shadow:0 2px 5px #321b0d}
.consult-screen .consult-toolbar[hidden]{display:none}
.consult-ticket-purchase{display:block;margin:5px 0;padding:9px 12px;border:1px solid #b59964;border-radius:8px;background:#fff5da;color:#713026;font-size:13px;font-weight:700;text-align:center}
.consult-ticket-purchase[hidden]{display:none}
#consultSessionPanel .consult-conversation{min-height:0;flex:1;display:grid;grid-template-rows:repeat(2,minmax(0,1fr));gap:6px}
.consult-speaker{min-height:0;display:flex;flex-direction:column;padding:7px 10px;border:1px solid #d5b991;border-radius:12px;background:#f9f1de}
.consult-speaker>strong{flex:none;font-size:12px;color:#704331}
.consult-speaker-customer{margin-left:min(7vw,50px);background:#f7faf5;border-color:#a9c4aa}
.consult-speaker-kizuna{margin-right:min(7vw,50px)}
#consultSessionPanel .consult-speaker .chat-messages{min-height:0;flex:1;overflow-y:auto;padding:3px 2px}
.consult-speaker .chat-message{position:relative;max-width:min(90%,600px);margin:5px 0;padding:7px 9px;border-radius:11px;background:white;box-shadow:0 2px 6px #30201318}
.consult-speaker-customer .chat-message{margin-left:auto;background:#e5f1e2}
.consult-speaker .chat-message .chat-avatar{display:none}
.consult-screen #consultSessionPanel .chat-compose{margin:4px 0 0}
.consult-screen #consultSessionPanel .chat-compose label{font-size:12px}
@media(max-width:560px){.tea-welcome img{aspect-ratio:4/3}.consult-screen[data-mode="session"] .consult-portrait{flex-basis:27dvh}.consult-portrait strong{font-size:14px}.consult-screen .consult-notice{display:none}}
.consult-timer-row{flex-wrap:wrap;gap:7px}
.consult-timer-row button{min-height:38px;padding:7px 10px;border:1px solid #b89564;border-radius:8px;background:#fffaf0;color:#69402c;font:700 13px var(--sans)}
.consult-timer-row #consultStart,.consult-timer-row #consultResume{background:#27746a;border-color:#27746a;color:white}
.consult-timer-row #consultPause{background:#e8d4a8}
.consult-time-cue{margin:5px 0;color:#8d211d;font-size:14px;font-weight:800}
.consult-time-cue:empty{display:none}

/* Reservation management is reached from the free chat; the consultation keeps the portrait and conversation. */
body[data-screen="consultBooking"]{overflow:hidden}
body[data-screen="consultBooking"] .screen-toolbar{visibility:hidden}
.consult-booking-screen .consult-panel{overflow-y:auto}
.consult-booking-screen #consultBookingNotes{flex:0 0 auto;min-height:90px;max-height:32dvh}
.tea-guide{margin:24px 0 12px;padding:18px;border:1px solid #d6c39d;border-radius:15px;background:#fff9ea;line-height:1.7}
.tea-guide h3{margin:0 0 9px}.tea-guide p{margin:9px 0;font-size:14px}
.tea-chat-actions{display:grid;gap:7px;padding:8px 12px;background:#fcf8ef}
.tea-private-button{display:grid;gap:4px;padding:13px;border-radius:12px;background:#246a59;color:white;text-align:center;text-decoration:none}
.tea-private-button strong{font-size:17px}.tea-private-button small{font-size:11px}
.tea-booking-link{padding:6px 10px;color:#275d50;font-weight:bold;text-decoration:underline}
.tea-private-button[aria-disabled="true"]{opacity:.65;cursor:not-allowed}

.consult-booking-links{display:flex;flex-wrap:wrap;gap:8px 16px;padding:8px}.consult-booking-links a{color:#267261;font-weight:700}.tea-booking-entry{background:#80623f!important;color:#fff!important}
/* Courtyard's two lower destinations share the carved border of the main entrances. */
.shrine-menu > :is(.chat-entry,.world-entry){position:relative;display:grid;grid-template-columns:1fr auto;gap:5px 16px;align-items:center;min-height:80px;margin:12px 0;padding:17px 22px;border:3px solid #d3a362;border-radius:17px;background:linear-gradient(135deg,#854152,#572436);color:#fff;text-decoration:none;box-shadow:0 0 0 2px #74421f,0 8px 23px #24170e66,inset 0 0 0 2px #f1d59d}
.shrine-menu > .world-entry{background:linear-gradient(135deg,#526a50,#283f3a)}
.shrine-menu > :is(.chat-entry,.world-entry) > span{font:800 20px/1.25 var(--serif)}
.shrine-menu > :is(.chat-entry,.world-entry) > small{grid-column:1;font-size:13px}
.shrine-menu > :is(.chat-entry,.world-entry) > b{grid-column:2;grid-row:1/3;align-self:center;font-size:24px}
.shop-menu-grid a{border:2px solid #e6c78f;color:#fff;box-shadow:0 7px 20px #271c1852,inset 0 0 0 2px #ffffff36}
.shop-menu-grid a > span{color:#fff4c9}
.shop-menu-grid .shop-choice-charm{background:linear-gradient(135deg,#a62f2c,#6f1c24)}
.shop-menu-grid .shop-choice-stickers{background:linear-gradient(135deg,#465a90,#30396b)}
.shop-menu-grid .shop-choice-consult{background:linear-gradient(135deg,#39796b,#1e514f)}
.shop-menu-grid .shop-choice-free{background:linear-gradient(135deg,#ad4d33,#803026)}
.shop-menu-grid .shop-choice-fortune{background:linear-gradient(135deg,#8d6a37,#624a28)}
.shrine-shop .shop-menu-grid{margin-bottom:18px}
.shrine-shop .shop-fortune-note{margin:0 0 18px;font-size:14px;line-height:1.5;color:#614127}
.charm-picker{display:block;margin:0 0 14px;font-weight:700;color:#583b28;font-size:15px}
.charm-picker select{display:block;width:100%;min-height:48px;margin-top:8px;padding:9px 12px;border:2px solid #b8904f;border-radius:10px;background:#fffaf0;color:#492e22;font:inherit}
.shrine-menu > .menu-primary.menu-shop{margin-top:0}
.shrine-shop .shop-welcome{margin:0 0 14px;color:#563b29;font-size:15px;line-height:1.5}
.consult-booking-notice{padding:12px 15px;border:1px solid #c1a778;border-radius:12px;background:#fff8e8;color:#593b22;font-weight:700;line-height:1.65}
/* Today-only schedule: anonymous fifteen-minute start cells along a 19:00–01:00 ruler. */
.reservation-today{margin:13px 0 4px;font:800 19px var(--serif);color:#503221}
.reservation-legend{margin:4px 0 10px;color:#584f42;font-size:12px;line-height:1.45}
.reservation-axis{display:flex;justify-content:space-between;gap:2px;margin:10px 0 4px;color:#5d4933;font:700 11px/1.3 var(--sans)}
.reservation-axis span:last-child{text-align:right}
.reservation-timeline{display:grid;grid-template-columns:repeat(24,minmax(0,1fr));gap:2px;padding:5px;border:2px solid #a57b48;border-radius:10px;background:#f5e9d6;min-height:48px}
.reservation-segment{display:block;border-radius:3px;background:#e2d8ca}
.reservation-segment.free{background:#53a887}.reservation-segment.unavailable,.reservation-segment.reserved,.reservation-segment.closed{background:#c28d34}.reservation-segment.past,.reservation-segment.tail{background:#c7c1b7}
.reservation-slots{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:7px;max-height:225px;overflow-y:auto;padding:8px 2px}
.reservation-slots .reservation-slot{min-height:40px;padding:7px 5px;border:1px solid #bfa780;border-radius:7px;background:#eef8ee;color:#244735;font:700 13px var(--sans);cursor:pointer}
.reservation-slots .reservation-slot:disabled{background:#f0e8db;color:#574a3e;cursor:not-allowed}
.reservation-slots .reservation-slot[aria-pressed="true"]{background:#267259;color:#fff}
#consultBookingForm{display:grid;grid-template-columns:1fr;gap:5px}
#consultBookingForm label{display:block;margin-top:7px;font-size:14px;font-weight:800}
#consultBookingForm select,#consultBookingForm textarea{width:100%;min-height:44px;border:1px solid #bda67e;border-radius:8px;padding:9px;background:#fff;color:#322b24;font:16px var(--sans)}
#consultBookingForm #consultTopicDetail{min-height:64px}
#consultBookingTime[hidden]{display:block!important}
#consultBookingForm #consultRequest{margin:9px 0}
#reservationHolidayControls,#consultHolidayControls{margin:10px 0}
#reservationHolidayControls button,#consultHolidayControls button{min-height:44px;padding:9px 16px;border-radius:9px;border:1px solid #9b6338;background:#fff3dd;color:#583921;font-weight:800}
.consult-holiday-card:not([hidden]){display:grid;justify-items:center;gap:8px;margin:13px 0;padding:16px;border:2px solid #c99d62;border-radius:17px;background:#fff8e8;text-align:center}
.consult-holiday-card img{width:min(100%,520px);max-height:265px;object-fit:cover;object-position:center 40%;border-radius:11px}
.consult-holiday-card strong{font:800 clamp(19px,5vw,29px) var(--serif);color:#762e2d}
.consult-holiday-card p{margin:0 0 7px;line-height:1.5}
#shopConsultEntry[aria-disabled="true"]{opacity:.72;filter:grayscale(.35);cursor:not-allowed}
@media(max-width:480px){.reservation-axis{font-size:9px}.reservation-slots{grid-template-columns:repeat(3,minmax(0,1fr));max-height:190px}.reservation-slots .reservation-slot{font-size:11px}}
.shop-menu-grid #shopConsultLabel{font:700 16px/1.3 var(--sans);color:#fff}
/* A tiny shrine gate under cherry blossoms stays legible in the compact header. */
.brand-mark{background:#f5b7bd;border-color:#d99b61;box-shadow:0 0 0 3px #fff9f1,0 0 16px #df9e9c88,inset 0 1px #fff}
.welcome-torii{background:#f5b7bd;border-color:#d99b61;box-shadow:0 0 0 4px #fff9f1,0 0 24px #df9e9c88}
.chat-reaction-line{display:flex;align-items:center;flex-wrap:wrap;gap:4px;margin:4px 0 0}
.chat-reaction-line button{box-sizing:border-box;min-width:30px;min-height:30px;padding:2px 7px;border:1px solid #d7c0a7;border-radius:999px;background:#fffaf4;color:#634537;font:600 13px/1.4 var(--sans);cursor:pointer}
.chat-reaction-line .chat-reaction-chip.selected{background:#fff0f3;border-color:#d0889a;color:#8a3350}
.chat-reaction-line .chat-react-open{background:transparent;border-color:transparent;color:#846859;font-size:18px}
.chat-reaction-line:not(:has(.chat-reaction-chip)){height:0;margin:0}
.chat-reaction-line .chat-react-open{position:absolute;width:1px;height:1px;min-width:1px;min-height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.chat-reaction-line .chat-react-open:focus-visible{position:static;width:auto;height:auto;min-width:44px;min-height:30px;padding:4px 8px;overflow:visible;clip-path:none;font-size:12px}
.chat-reaction-line button:focus-visible,.chat-reaction-picker button:focus-visible{outline:2px solid #a54768;outline-offset:2px}
.chat-reaction-picker{position:fixed;z-index:1000;display:flex;flex-wrap:wrap;justify-content:center;gap:2px;width:min(310px,calc(100vw - 16px));padding:6px;border:1px solid #cfb696;border-radius:17px;background:#fffdf8;box-shadow:0 6px 25px #30201345}
.chat-reaction-picker button{display:grid;place-items:center;width:40px;height:40px;flex:none;border:0;border-radius:50%;background:transparent;font-size:21px;cursor:pointer}
.chat-reaction-picker .chat-reaction-actions{display:flex;justify-content:center;gap:8px;flex-basis:100%;padding-top:5px;border-top:1px solid #eadacc}
.chat-reaction-picker .chat-reaction-actions button{width:auto;min-width:80px;height:34px;padding:3px 12px;border:1px solid #d5bca1;border-radius:18px;background:#fff9f0;color:#753e37;font:700 13px var(--sans)}
.chat-reaction-picker button:hover{background:#ffe8ee}
.chat-message{-webkit-touch-callout:none}
@media(max-width:360px){.chat-reaction-picker button{width:35px;height:38px;font-size:19px}}
/* Anchor the portrait's center independently of its breathing animation. */
.character-stage .courtyard-scene #weekdayGoddess{left:50%;transform:translateX(-50%);animation:miko-breathe-centered 8.8s ease-in-out infinite}
@keyframes miko-breathe-centered{0%,50%,100%{transform:translateX(-50%) scale(1) skewX(0deg)}25%{transform:translateX(-50%) scale(1.003,1.009) skewX(.2deg)}75%{transform:translateX(-50%) scale(1.003,1.009) skewX(-.2deg)}}
body[data-divine="true"] .character-stage .courtyard-scene #weekdayGoddess{animation:divine-hover-centered 8.4s ease-in-out infinite}
@keyframes divine-hover-centered{0%,100%{transform:translate(-50%,-10px) rotate(-.25deg)}25%,75%{transform:translate(-50%,-17px) scale(1.003,1.009)}50%{transform:translate(-50%,-22px) rotate(.25deg)}}
@media(prefers-reduced-motion:reduce){.character-stage .courtyard-scene #weekdayGoddess{animation:none!important;transform:translateX(-50%)!important}body[data-divine="true"] .character-stage .courtyard-scene #weekdayGoddess{transform:translate(-50%,-14px)!important}}
/* Approved seven-panel Koyori artwork, with a separate weekday viewport. */
.character-stage .courtyard-scene #koyoriPortrait {
  position:absolute;z-index:2;left:50%;bottom:1%;height:90%;aspect-ratio:calc(1916 / 7) / 821;
  max-width:90%;transform:translateX(-50%);cursor:pointer;touch-action:manipulation;
  background-image:url('./assets/koyori-weekdays-cutout-20260929.png');background-size:700% 100%;background-repeat:no-repeat;
  filter:drop-shadow(2px 3px 3px rgba(25,23,19,.2));
  animation:miko-breathe-centered 8.8s ease-in-out infinite;
}
.character-stage .courtyard-scene #koyoriPortrait[hidden]{display:none}
.character-stage .courtyard-scene #koyoriPortrait.is-tuesday{aspect-ratio:2/3;background-image:url('./assets/koyori-tuesday-cutout-20260929.png');background-size:contain;background-position:center bottom!important}
#koyoriPortrait:focus-visible{outline:3px solid #f4dcb3;outline-offset:3px;border-radius:12px}
@media(max-width:560px){.character-stage .courtyard-scene #koyoriPortrait{height:min(94%,calc((100vw - 16px) * 821 * 7 / 1916))}.character-stage .courtyard-scene #koyoriPortrait.is-tuesday{height:min(94%,calc((100vw - 16px) * 1.5))}}
@media(prefers-reduced-motion:reduce){.character-stage .courtyard-scene #koyoriPortrait{animation:none;transform:translateX(-50%)}}

/* Individual portraits keep weekday accessories inside the full image. */
.character-stage .courtyard-scene #koyoriPortrait{height:90%;aspect-ratio:2/3;background-size:contain;background-position:center bottom!important}
.character-stage .courtyard-scene #koyoriPortrait[aria-label^="月曜日"]{background-image:url('./koyori-monday-full-20260930.png')}
.character-stage .courtyard-scene #koyoriPortrait[aria-label^="水曜日"]{background-image:url('./koyori-wednesday-full-20260930.png')}
.character-stage .courtyard-scene #koyoriPortrait[aria-label^="木曜日"]{background-image:url('./koyori-thursday-full-20260930.png')}
.character-stage .courtyard-scene #koyoriPortrait[aria-label^="金曜日"]{background-image:url('./koyori-friday-full-20260930.png')}
.character-stage .courtyard-scene #koyoriPortrait[aria-label^="土曜日"]{background-image:url('./koyori-saturday-full-20260930.png')}
.character-stage .courtyard-scene #koyoriPortrait[aria-label^="日曜日"]{background-image:url('./koyori-sunday-full-20260930.png')}
