:root {
  color-scheme: dark;
  --ink: #f4ecdf;
  --muted: rgba(244, 236, 223, 0.68);
  --glass: rgba(24, 18, 31, 0.58);
  --glass-strong: rgba(22, 16, 29, 0.76);
  --line: rgba(255, 246, 232, 0.2);
  --glow: rgba(226, 199, 171, 0.34);
  --accent: #efe0cc;
  --danger: #ffd0d0;
}

* { box-sizing: border-box; }
html, body { min-height: 100%; }
body {
  margin: 0;
  min-height: 100vh;
  font-family: "Libertinus Serif", "Linux Libertine", Georgia, serif;
  color: var(--ink);
  background: #18191b;
}
button, input { font: inherit; }
a { color: inherit; }

.login-page,
.app-page {
  min-height: 100svh;
  overflow-x: hidden;
  overflow-y: auto;
  position: relative;
}

.scene {
  position: fixed;
  inset: 0;
  background-image: url('/assets/login-city.png');
  background-size: cover;
  background-position: center;
  transform: scale(1.01);
  filter: saturate(0.92) contrast(1.02);
}
.scene-overlay {
  position: fixed;
  inset: 0;
  background:
    radial-gradient(circle at 50% 44%, rgba(35, 25, 46, 0.02), rgba(11, 8, 15, 0.36) 68%, rgba(6, 5, 9, 0.72) 100%),
    linear-gradient(180deg, rgba(8, 6, 12, 0.12), rgba(11, 7, 15, 0.36));
  backdrop-filter: blur(0.3px);
}

.brand-bar {
  position: fixed;
  z-index: 4;
  inset: 0 0 auto 0;
  padding: clamp(22px, 3.2vw, 48px) clamp(24px, 4vw, 64px);
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  pointer-events: none;
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.26em;
  font-size: 0.78rem;
  font-weight: 600;
  text-shadow: 0 2px 24px rgba(0,0,0,0.55);
  pointer-events: auto;
}
.orbit-logo {
  width: 46px;
  height: 46px;
  display: inline-grid;
  place-items: center;
  border: 1px solid rgba(245, 232, 214, 0.78);
  border-radius: 50%;
  transform: rotate(-26deg);
  box-shadow: 0 0 22px rgba(245, 232, 214, 0.12);
  position: relative;
}
.orbit-logo::after {
  content: "";
  position: absolute;
  width: 58px;
  height: 16px;
  border-top: 1px solid rgba(245, 232, 214, 0.78);
  border-radius: 50%;
}
.orbit-logo span {
  width: 8px;
  height: 8px;
  background: var(--accent);
  border-radius: 50%;
  box-shadow: 0 0 12px rgba(239, 224, 204, 0.65);
}
.brand-motto {
  display: grid;
  gap: 3px;
  padding-right: 18px;
  border-right: 1px solid rgba(244, 236, 223, 0.55);
  text-transform: uppercase;
  text-align: right;
  letter-spacing: 0.2em;
  font-size: 0.66rem;
  line-height: 1.45;
  color: rgba(244, 236, 223, 0.78);
}

.login-shell,
.app-shell {
  position: relative;
  z-index: 3;
  min-height: 100svh;
  display: grid;
  place-items: center;
  padding: 112px 24px 70px;
}
.login-card,
.app-card {
  width: min(540px, 100%);
  padding: clamp(34px, 5vw, 58px);
  border: 1px solid rgba(255, 244, 230, 0.16);
  border-radius: 28px;
  background: linear-gradient(160deg, rgba(50, 39, 58, 0.64), rgba(22, 16, 30, 0.7));
  box-shadow:
    0 28px 80px rgba(0,0,0,0.42),
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 0 60px rgba(148, 120, 161, 0.08);
  backdrop-filter: blur(20px) saturate(1.08);
  -webkit-backdrop-filter: blur(20px) saturate(1.08);
  text-align: center;
}
.eyebrow {
  margin: 0 0 12px;
  text-transform: uppercase;
  letter-spacing: 0.24em;
  font-size: 0.64rem;
  color: rgba(244,236,223,0.56);
}
h1 {
  margin: 0;
  font-family: "Libertinus Serif", "Linux Libertine", Georgia, serif;
  font-size: clamp(2.45rem, 6vw, 4.1rem);
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.015em;
  text-shadow: 0 3px 24px rgba(0,0,0,0.35);
}
.title-rule {
  width: 34px;
  height: 1px;
  background: rgba(244,236,223,0.6);
  margin: 22px auto 14px;
}
.subtitle {
  margin: 0 auto 30px;
  font-family: "Libertinus Serif", "Linux Libertine", Georgia, serif;
  font-size: clamp(1rem, 2vw, 1.15rem);
  color: rgba(244,236,223,0.84);
}
.login-form { display: grid; gap: 18px; }
.field-wrap { position: relative; }
.field-wrap input {
  width: 100%;
  min-height: 56px;
  padding: 0 54px 0 48px;
  color: var(--ink);
  border-radius: 14px;
  border: 1px solid rgba(255, 245, 232, 0.38);
  outline: none;
  background: rgba(18, 14, 24, 0.26);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.02);
  transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}
.field-wrap input::placeholder { color: rgba(244,236,223,0.5); }
.field-wrap input:focus {
  border-color: rgba(255, 238, 218, 0.78);
  background: rgba(18, 14, 24, 0.42);
  box-shadow: 0 0 0 4px rgba(239,224,204,0.08), 0 0 28px rgba(239,224,204,0.08);
}
.field-icon,
.toggle-password {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  color: rgba(244,236,223,0.67);
}
.field-icon { left: 17px; font-size: 1.2rem; }
.toggle-password {
  right: 11px;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border: 0;
  background: transparent;
  color: rgba(244,236,223,0.6);
  cursor: pointer;
}
.primary-button,
.secondary-button {
  min-height: 56px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,0.26);
  cursor: pointer;
  transition: transform 160ms ease, filter 160ms ease, box-shadow 160ms ease;
}
.primary-button {
  color: #241b26;
  font-family: "Libertinus Serif", "Linux Libertine", Georgia, serif;
  font-size: 1.12rem;
  background: linear-gradient(100deg, rgba(247,225,199,0.96), rgba(219,209,238,0.95));
  box-shadow: 0 10px 32px rgba(177,150,190,0.2), inset 0 1px 0 rgba(255,255,255,0.78);
}
.primary-button:hover,
.secondary-button:hover { transform: translateY(-1px); filter: brightness(1.05); }
.primary-button:disabled { cursor: wait; opacity: 0.68; transform: none; }
.secondary-button {
  padding: 0 24px;
  color: var(--ink);
  background: rgba(255,255,255,0.07);
}
.form-status {
  min-height: 1.25em;
  margin: -4px 0 -2px;
  color: var(--danger);
  font-size: 0.86rem;
}
.private-note {
  margin: 28px 0 0;
  color: rgba(244,236,223,0.55);
  font-size: 0.75rem;
  letter-spacing: 0.08em;
}
.corner-copy {
  position: fixed;
  z-index: 3;
  left: clamp(24px, 4vw, 64px);
  bottom: clamp(22px, 3vw, 48px);
  display: grid;
  gap: 4px;
  text-transform: uppercase;
  letter-spacing: 0.22em;
  font-size: 0.62rem;
  color: rgba(244,236,223,0.7);
  text-shadow: 0 2px 16px rgba(0,0,0,0.45);
}

.app-card { max-width: 620px; }
.app-card p {
  color: var(--muted);
  line-height: 1.7;
  margin: 22px auto 28px;
  max-width: 38ch;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}

@media (max-width: 720px) {
  .brand-bar { padding: 20px; }
  .brand { gap: 10px; font-size: 0.64rem; letter-spacing: 0.18em; }
  .orbit-logo { width: 36px; height: 36px; }
  .orbit-logo::after { width: 46px; }
  .brand-motto,
  .corner-copy { display: none; }
  .login-shell,
  .app-shell { padding: 92px 16px 28px; align-items: center; }
  .login-card,
  .app-card { padding: 34px 22px; border-radius: 22px; }
  h1 { font-size: clamp(2.2rem, 12vw, 3.35rem); }
  .subtitle { margin-bottom: 26px; }
  .scene { background-position: 58% center; }
}

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


/* V1 universe hub, identity picker and private Homes */
.profile-picker { border: 0; padding: 0; margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.profile-picker legend { width: 100%; margin-bottom: 10px; color: var(--muted); font-size: .8rem; }
.profile-picker input { position: absolute; opacity: 0; pointer-events: none; }
.profile-picker span { display: grid; place-items: center; min-height: 46px; border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,.04); cursor: pointer; }
.profile-picker input:checked + span { border-color: rgba(255,238,218,.78); background: rgba(239,224,204,.13); box-shadow: 0 0 0 3px rgba(239,224,204,.05); }
.world-nav { display: flex; gap: 8px; pointer-events: auto; }
.world-nav button, .hub-grid button, .home-actions button, .home-actions a { border: 1px solid var(--line); border-radius: 12px; background: rgba(20,15,26,.55); color: var(--ink); padding: 11px 15px; text-decoration: none; cursor: pointer; }
.world-nav button:hover, .hub-grid button:not(:disabled):hover, .home-actions a:hover { background: rgba(255,255,255,.1); }
.hub-card { width: min(960px,100%); text-align: center; }
.hub-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; margin-top: 30px; }
.hub-grid article { min-height: 230px; padding: 26px 20px; border: 1px solid var(--line); border-radius: 22px; background: var(--glass); backdrop-filter: blur(16px); }
.hub-grid h2 { font-family: "Libertinus Serif", "Linux Libertine", Georgia, serif; font-weight: 400; margin: 10px 0; }
.hub-grid p { color: var(--muted); line-height: 1.55; min-height: 74px; }
.hub-grid button:disabled, .home-actions button:disabled { opacity: .55; cursor: default; }
.hub-icon { font-size: 1.5rem; }
.home-page { min-height: 100svh; background: radial-gradient(circle at 50% 20%, #40344d 0, #1b1522 48%, #100c14 100%); }
.home-shell { min-height: 100svh; display: grid; place-items: center; padding: 24px; }
.home-card { width: min(700px,100%); padding: clamp(34px,6vw,64px); text-align: center; border: 1px solid var(--line); border-radius: 28px; background: var(--glass-strong); box-shadow: 0 28px 80px rgba(0,0,0,.35); }
.home-actions { display: grid; grid-template-columns: repeat(2,1fr); gap: 12px; margin: 28px 0; }
.home-actions a { display: grid; place-items: center; }
@media (max-width:720px) { .hub-grid { grid-template-columns: 1fr; } .hub-grid article { min-height: auto; } .hub-grid p { min-height: auto; } .world-nav { position: fixed; right: 16px; bottom: 16px; } .home-actions { grid-template-columns: 1fr; } }

.hidden{display:none!important}.auth-tabs{display:flex;gap:.4rem;flex-wrap:wrap;margin:1rem 0}.auth-tabs button{flex:1;min-width:8rem}.auth-tabs button.active{outline:2px solid currentColor}.login-form input{width:100%;box-sizing:border-box;padding:.9rem 1rem;margin:.35rem 0;border-radius:12px;border:1px solid rgba(255,255,255,.18);background:rgba(8,7,15,.65);color:inherit}.recovery-box{margin:1rem 0;padding:1rem;border:1px solid rgba(255,255,255,.2);border-radius:14px}.recovery-box code{display:block;overflow-wrap:anywhere;font-size:.9rem}.link-button{display:inline-block;text-decoration:none;text-align:center}.avatar-shell{position:relative;z-index:2;display:grid;grid-template-columns:minmax(280px,.8fr) minmax(360px,1.4fr);gap:1.2rem;max-width:1200px;margin:6rem auto 2rem;padding:1rem}.avatar-preview,.avatar-editor{background:rgba(18,14,29,.88);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.12);border-radius:22px;padding:1.3rem}.avatar-preview{position:sticky;top:6rem;align-self:start}.avatar-doll{height:390px;border-radius:18px;display:flex;align-items:center;justify-content:center;position:relative;background:rgba(255,255,255,.04);overflow:hidden}.avatar-body{width:150px;height:260px;border-radius:70px 70px 40px 40px;background:linear-gradient(#d8b29a 0 35%,#444 35%);position:absolute;bottom:20px}.avatar-body[data-body="fine"]{width:125px}.avatar-body[data-body="ronde"]{width:185px}.avatar-face{position:absolute;top:58px;width:105px;height:125px;border-radius:48%;background:#d8b29a;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}.avatar-clothes{position:absolute;bottom:72px;font-size:.7rem;opacity:.7}.avatar-fieldset{border:1px solid rgba(255,255,255,.13);border-radius:16px;margin:0 0 1rem;padding:1rem;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}.avatar-fieldset legend{padding:0 .5rem;font-weight:700}.avatar-fieldset label{display:grid;gap:.35rem;font-size:.9rem}.avatar-fieldset select{width:100%;padding:.65rem;border-radius:10px;background:#171321;color:inherit;border:1px solid rgba(255,255,255,.18)}@media(max-width:760px){.avatar-shell{grid-template-columns:1fr;margin-top:5rem}.avatar-preview{position:relative;top:0}.avatar-fieldset{grid-template-columns:1fr}}

/* Scrollable long-form pages, especially iPad/Safari */
html { overflow-x: hidden; overflow-y: auto; }
body { overflow-x: hidden; overflow-y: auto; }
.login-page, .app-page { height: auto; min-height: 100svh; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; }
.login-shell, .app-shell { height: auto; }
.avatar-shell { min-height: 100svh; }

/* Avatar preview V1.1: human proportions while illustrated assets are prepared */
.avatar-body{width:156px;height:255px;background:none!important;border-radius:0;bottom:18px}
.avatar-body[data-body="fine"]{width:138px}.avatar-body[data-body="moyenne"]{width:156px}.avatar-body[data-body="ronde"]{width:180px}
.avatar-neck{position:absolute;z-index:2;top:4px;left:50%;width:38px;height:34px;transform:translateX(-50%);border-radius:12px;background:#d8b29a}
.avatar-torso{position:absolute;z-index:3;top:25px;left:50%;width:82%;height:116px;transform:translateX(-50%);border-radius:42% 42% 24% 24% / 25% 25% 18% 18%;background:#4b4650}
.avatar-waist{position:absolute;z-index:3;top:125px;left:50%;width:64%;height:58px;transform:translateX(-50%);border-radius:18px 18px 10px 10px;background:#4b4650}
.avatar-arm{position:absolute;z-index:1;top:35px;width:31px;height:142px;border-radius:18px;background:#d8b29a;transform-origin:top center}
.avatar-arm-left{left:4px;transform:rotate(4deg)}.avatar-arm-right{right:4px;transform:rotate(-4deg)}
.avatar-leg{position:absolute;z-index:2;bottom:0;width:40%;height:100px;border-radius:0 0 22px 22px;background:#444}
.avatar-leg-left{left:8%}.avatar-leg-right{right:8%}
.avatar-face{top:34px;width:112px;height:138px;border-radius:48% 48% 44% 44% / 43% 43% 54% 54%;gap:0;z-index:5;box-shadow:inset 0 -8px 18px rgba(104,61,44,.08)}
.avatar-face[data-skin="porcelaine"]{background:#f0cfba}.avatar-face[data-skin="claire"]{background:#dfb69d}.avatar-face[data-skin="dorée"]{background:#c99670}.avatar-face[data-skin="médium"]{background:#ad7658}.avatar-face[data-skin="brune"]{background:#81543f}.avatar-face[data-skin="foncée"]{background:#59392f}
.avatar-ear{position:absolute;top:58px;width:14px;height:25px;border-radius:50%;background:inherit}.avatar-ear-left{left:-7px}.avatar-ear-right{right:-7px}
.avatar-brow{position:absolute;top:47px;width:26px;height:7px;border-top:2px solid rgba(55,35,35,.75);border-radius:50%}.avatar-brow-left{left:18px;transform:rotate(-4deg)}.avatar-brow-right{right:18px;transform:rotate(4deg)}
.avatar-eye{position:absolute;top:62px;width:22px;height:12px;border-bottom:2px solid #3a2c2d;border-radius:50%}.avatar-eye:after{content:"";position:absolute;left:8px;top:4px;width:6px;height:6px;border-radius:50%;background:#4b342b}.avatar-eye-left{left:20px}.avatar-eye-right{right:20px}
.avatar-nose{position:absolute;top:77px;left:50%;width:10px;height:18px;transform:translateX(-50%);border-right:1.5px solid rgba(92,57,50,.4);border-bottom:1.5px solid rgba(92,57,50,.28);border-radius:0 0 8px 0}
.avatar-mouth{position:absolute;top:105px;left:50%;width:27px;height:10px;transform:translateX(-50%);border-bottom:2px solid rgba(125,66,72,.85);border-radius:50%}
.avatar-clothes{display:none}

/* Avatar base V1.2: anime-like body + configurable face */
.avatar-doll{min-height:430px}
.avatar-body{height:285px;bottom:16px}
.avatar-torso{top:22px;height:132px;border-radius:42% 42% 28% 28%/20% 20% 16% 16%;background:#dfb69d}
.avatar-waist{top:135px;height:62px;background:#dfb69d;border-radius:20% 20% 30% 30%}
.avatar-arm{height:178px;background:#dfb69d}.avatar-leg{height:132px;background:#dfb69d;border-radius:20px 20px 13px 13px}
.avatar-neck{background:#dfb69d}
.avatar-body[data-skin="porcelaine"]>*{background:#f0cfba}.avatar-body[data-skin="claire"]>*{background:#dfb69d}.avatar-body[data-skin="dorée"]>*{background:#c99670}.avatar-body[data-skin="médium"]>*{background:#ad7658}.avatar-body[data-skin="brune"]>*{background:#81543f}.avatar-body[data-skin="foncée"]>*{background:#59392f}
.avatar-face[data-face="rond"]{width:118px;height:126px;border-radius:50%}.avatar-face[data-face="carré doux"]{width:116px;height:136px;border-radius:43% 43% 38% 38%}.avatar-face[data-face="cœur"]{width:118px;height:140px;border-radius:48% 48% 55% 55%/42% 42% 62% 62%}.avatar-face[data-face="allongé"]{width:106px;height:148px}.avatar-face[data-face="diamant"]{width:116px;height:142px;border-radius:46% 46% 58% 58%/35% 35% 65% 65%}
.avatar-face[data-eye-color="brun"] .avatar-eye:after{background:#4b342b}.avatar-face[data-eye-color="noisette"] .avatar-eye:after{background:#80613d}.avatar-face[data-eye-color="ambre"] .avatar-eye:after{background:#b0782f}.avatar-face[data-eye-color="vert"] .avatar-eye:after{background:#66835e}.avatar-face[data-eye-color="bleu"] .avatar-eye:after{background:#6689a7}.avatar-face[data-eye-color="gris"] .avatar-eye:after{background:#7d858c}.avatar-face[data-eye-color="violet"] .avatar-eye:after{background:#79658d}
.avatar-face[data-eyes="grands"] .avatar-eye{height:17px}.avatar-face[data-eyes="fins"] .avatar-eye{height:7px}.avatar-face[data-eyes="ronds"] .avatar-eye{height:16px;border:2px solid #3a2c2d;border-top-color:transparent}.avatar-face[data-eyes="tombants"] .avatar-eye-left{transform:rotate(5deg)}.avatar-face[data-eyes="tombants"] .avatar-eye-right{transform:rotate(-5deg)}.avatar-face[data-eyes="étirés"] .avatar-eye{width:27px}.avatar-face[data-eyes="perçants"] .avatar-eye-left{transform:rotate(-6deg)}.avatar-face[data-eyes="perçants"] .avatar-eye-right{transform:rotate(6deg)}
.avatar-face[data-brows="droits"] .avatar-brow{border-radius:0}.avatar-face[data-brows="arqués"] .avatar-brow{top:43px}.avatar-face[data-brows="marqués"] .avatar-brow{border-top-width:4px}.avatar-face[data-brows="fins"] .avatar-brow{border-top-width:1px}
.avatar-face[data-nose="discret"] .avatar-nose{height:11px;opacity:.5}.avatar-face[data-nose="marqué"] .avatar-nose{height:22px;border-width:2px}.avatar-face[data-nose="retroussé"] .avatar-nose{height:13px;border-bottom-width:2px;transform:translateX(-50%) rotate(-8deg)}
.avatar-face[data-mouth="neutre"] .avatar-mouth,.avatar-face[data-mouth="sérieuse"] .avatar-mouth{height:2px;border-radius:0}.avatar-face[data-mouth="sourire léger"] .avatar-mouth{width:24px;height:7px}.avatar-face[data-mouth="sourire"] .avatar-mouth{width:31px;height:12px}.avatar-face[data-mouth="pensive"] .avatar-mouth{width:19px;transform:translateX(-50%) rotate(-4deg)}.avatar-face[data-mouth="pulpeuse"] .avatar-mouth{height:8px;border-top:1px solid rgba(125,66,72,.55);border-bottom-width:2px}

/* Avatar base V1.3: illustrated anime mannequin, replacing the CSS nugget */
.avatar-doll{min-height:500px}
.avatar-body{width:240px!important;height:430px!important;bottom:8px;background:none!important;z-index:2;transform-origin:50% 100%}
.avatar-body[data-body="fine"]{transform:scaleX(.88)}
.avatar-body[data-body="moyenne"]{transform:scaleX(1)}
.avatar-body[data-body="ronde"]{transform:scaleX(1.12)}
.avatar-base-svg{display:block;width:100%;height:100%;overflow:visible}
.avatar-base-svg .anime-neck,.avatar-base-svg .anime-torso,.avatar-base-svg .anime-arm,.avatar-base-svg .anime-leg{fill:#dfb69d;stroke:#6e5147;stroke-width:2;stroke-linejoin:round}
.avatar-base-svg .anime-outline{fill:none;stroke:#6e5147;stroke-width:1.6;stroke-linecap:round;opacity:.65}
.avatar-body[data-skin="porcelaine"] .anime-neck,.avatar-body[data-skin="porcelaine"] .anime-torso,.avatar-body[data-skin="porcelaine"] .anime-arm,.avatar-body[data-skin="porcelaine"] .anime-leg{fill:#f0cfba}
.avatar-body[data-skin="claire"] .anime-neck,.avatar-body[data-skin="claire"] .anime-torso,.avatar-body[data-skin="claire"] .anime-arm,.avatar-body[data-skin="claire"] .anime-leg{fill:#dfb69d}
.avatar-body[data-skin="dorée"] .anime-neck,.avatar-body[data-skin="dorée"] .anime-torso,.avatar-body[data-skin="dorée"] .anime-arm,.avatar-body[data-skin="dorée"] .anime-leg{fill:#c99670}
.avatar-body[data-skin="médium"] .anime-neck,.avatar-body[data-skin="médium"] .anime-torso,.avatar-body[data-skin="médium"] .anime-arm,.avatar-body[data-skin="médium"] .anime-leg{fill:#ad7658}
.avatar-body[data-skin="brune"] .anime-neck,.avatar-body[data-skin="brune"] .anime-torso,.avatar-body[data-skin="brune"] .anime-arm,.avatar-body[data-skin="brune"] .anime-leg{fill:#81543f}
.avatar-body[data-skin="foncée"] .anime-neck,.avatar-body[data-skin="foncée"] .anime-torso,.avatar-body[data-skin="foncée"] .anime-arm,.avatar-body[data-skin="foncée"] .anime-leg{fill:#59392f}
.avatar-face{top:28px;z-index:4;width:118px;height:145px;border:1.8px solid rgba(110,81,71,.72);box-shadow:none}
.avatar-face:after{content:"";position:absolute;left:50%;bottom:-15px;width:34px;height:20px;transform:translateX(-50%);background:inherit;z-index:-1}

/* Avatar asset compositor V2: reference-board geometry, transparent layered assets */
.avatar-doll{position:relative;min-height:520px;overflow:hidden}
.avatar-body{position:absolute!important;left:50%;bottom:10px;width:250px!important;height:430px!important;transform:translateX(-50%)!important;background:transparent!important;z-index:2}
.avatar-base-svg{display:none!important}
.avatar-body::before{content:"";position:absolute;inset:0;background:center bottom/contain no-repeat var(--avatar-body-image,none);pointer-events:none}
.avatar-body[data-body="fine"]{--avatar-body-image:url("/assets/avatar/body/body-fine-front.png")}
.avatar-body[data-body="moyenne"]{--avatar-body-image:url("/assets/avatar/body/body-medium-front.png")}
.avatar-body[data-body="ronde"]{--avatar-body-image:url("/assets/avatar/body/body-curvy-front.png")}
.avatar-face{position:absolute!important;left:50%;top:32px;width:128px!important;height:158px!important;transform:translateX(-50%)!important;border:0!important;border-radius:0!important;background:center/contain no-repeat var(--avatar-face-image,none)!important;box-shadow:none!important;z-index:4}
.avatar-face::after{display:none!important}.avatar-ear{display:none!important}
.avatar-face[data-face="ovale"]{--avatar-face-image:url("/assets/avatar/face/shape-oval.png")}
.avatar-face[data-face="rond"]{--avatar-face-image:url("/assets/avatar/face/shape-round.png")}
.avatar-face[data-face="carré doux"]{--avatar-face-image:url("/assets/avatar/face/shape-soft-square.png")}
.avatar-face[data-face="cœur"]{--avatar-face-image:url("/assets/avatar/face/shape-heart.png")}
.avatar-face[data-face="allongé"]{--avatar-face-image:url("/assets/avatar/face/shape-long.png")}
.avatar-face[data-face="diamant"]{--avatar-face-image:url("/assets/avatar/face/shape-diamond.png")}
.avatar-brow,.avatar-eye,.avatar-nose,.avatar-mouth{border:0!important;background:transparent!important;transform:none!important}
.avatar-eye{position:absolute;width:43px!important;height:27px!important;top:65px!important;background:center/contain no-repeat var(--eye-image)!important}
.avatar-eye-left{left:18px!important}.avatar-eye-right{right:18px!important;transform:scaleX(-1)!important}
.avatar-face[data-eyes="doux"]{--eye-image:url("/assets/avatar/face/eyes-soft.png")}
.avatar-face[data-eyes="neutres"]{--eye-image:url("/assets/avatar/face/eyes-neutral.png")}
.avatar-face[data-eyes="amande"]{--eye-image:url("/assets/avatar/face/eyes-almond.png")}
.avatar-face[data-eyes="grands"]{--eye-image:url("/assets/avatar/face/eyes-large.png")}
.avatar-face[data-eyes="tombants"]{--eye-image:url("/assets/avatar/face/eyes-downturned.png")}
.avatar-face[data-eyes="fins"]{--eye-image:url("/assets/avatar/face/eyes-thin.png")}
.avatar-face[data-eyes="étirés"]{--eye-image:url("/assets/avatar/face/eyes-elongated.png")}
.avatar-face[data-eyes="ronds"]{--eye-image:url("/assets/avatar/face/eyes-round.png")}
.avatar-face[data-eyes="perçants"]{--eye-image:url("/assets/avatar/face/eyes-sharp.png")}
.avatar-brow{position:absolute;width:43px!important;height:18px!important;top:45px!important;background:center/contain no-repeat var(--brow-image)!important}
.avatar-brow-left{left:18px!important}.avatar-brow-right{right:18px!important;transform:scaleX(-1)!important}
.avatar-face[data-brows="naturels"]{--brow-image:url("/assets/avatar/face/brow-natural.png")}
.avatar-face[data-brows="droits"]{--brow-image:url("/assets/avatar/face/brow-straight.png")}
.avatar-face[data-brows="arqués"]{--brow-image:url("/assets/avatar/face/brow-arched.png")}
.avatar-face[data-brows="doux"]{--brow-image:url("/assets/avatar/face/brow-soft.png")}
.avatar-face[data-brows="marqués"]{--brow-image:url("/assets/avatar/face/brow-bold.png")}
.avatar-face[data-brows="fins"]{--brow-image:url("/assets/avatar/face/brow-thin.png")}
.avatar-nose{position:absolute!important;left:50%!important;top:86px!important;width:34px!important;height:32px!important;transform:translateX(-50%)!important;background:center/contain no-repeat var(--nose-image)!important}
.avatar-face[data-nose="discret"]{--nose-image:url("/assets/avatar/face/nose-subtle.png")}
.avatar-face[data-nose="doux"]{--nose-image:url("/assets/avatar/face/nose-soft.png")}
.avatar-face[data-nose="marqué"]{--nose-image:url("/assets/avatar/face/nose-defined.png")}
.avatar-face[data-nose="retroussé"]{--nose-image:url("/assets/avatar/face/nose-upturned.png")}
.avatar-mouth{position:absolute!important;left:50%!important;top:121px!important;width:48px!important;height:28px!important;transform:translateX(-50%)!important;background:center/contain no-repeat var(--mouth-image)!important}
.avatar-face[data-mouth="neutre"]{--mouth-image:url("/assets/avatar/face/mouth-neutral.png")}
.avatar-face[data-mouth="sourire léger"]{--mouth-image:url("/assets/avatar/face/mouth-soft-smile.png")}
.avatar-face[data-mouth="sourire"]{--mouth-image:url("/assets/avatar/face/mouth-smile.png")}
.avatar-face[data-mouth="sourire ouvert"]{--mouth-image:url("/assets/avatar/face/mouth-open-smile.png")}
.avatar-face[data-mouth="sérieuse"]{--mouth-image:url("/assets/avatar/face/mouth-serious.png")}
.avatar-face[data-mouth="pensive"]{--mouth-image:url("/assets/avatar/face/mouth-thoughtful.png")}
.avatar-face[data-mouth="esquisse"]{--mouth-image:url("/assets/avatar/face/mouth-smirk.png")}
.avatar-face[data-mouth="pulpeuse"]{--mouth-image:url("/assets/avatar/face/mouth-full.png")}
.avatar-clothes{z-index:5;background:transparent!important;color:transparent!important;pointer-events:none}

/* Avatar Studio V3: visual creator */
.avatar-studio-page{background:radial-gradient(circle at 28% 28%,#252433 0,#11151f 46%,#0b0e15 100%)}
.avatar-studio{position:relative;z-index:2;display:grid;grid-template-columns:330px minmax(0,1fr);gap:18px;max-width:1500px;margin:86px auto 0;padding:16px 22px 34px}
.studio-preview,.studio-editor{border:1px solid rgba(255,255,255,.13);border-radius:18px;background:rgba(13,17,25,.72);box-shadow:0 24px 70px rgba(0,0,0,.24);backdrop-filter:blur(18px)}
.studio-preview{position:sticky;top:88px;align-self:start;padding:18px}.studio-editor{padding:12px}
.studio-doll{height:650px;min-height:0;background:radial-gradient(circle at 50% 35%,rgba(255,255,255,.08),transparent 58%);overflow:hidden}
.studio-person{--skin:#f2cfba;--iris:#543528;position:absolute;left:50%;top:36px;width:190px;height:590px;transform:translateX(-50%);filter:drop-shadow(0 12px 18px rgba(0,0,0,.18))}
.studio-head{position:absolute;z-index:8;left:50%;top:0;width:116px;height:142px;transform:translateX(-50%);border:1.5px solid rgba(94,61,55,.55);border-radius:48% 48% 46% 46%/42% 42% 58% 58%;background:var(--skin)}
.studio-head[data-face="rond"]{height:126px;border-radius:50%}.studio-head[data-face="carré doux"]{width:120px;border-radius:43% 43% 38% 38%}.studio-head[data-face="cœur"]{width:120px;border-radius:48% 48% 58% 58%/42% 42% 65% 65%}.studio-head[data-face="allongé"]{width:108px;height:150px}.studio-head[data-face="diamant"]{width:120px;border-radius:46% 46% 58% 58%/35% 35% 65% 65%}
.studio-ear{position:absolute;top:58px;width:12px;height:23px;border:1px solid rgba(94,61,55,.4);border-radius:50%;background:var(--skin)}.studio-ear.left{left:-7px}.studio-ear.right{right:-7px}
.studio-brow{position:absolute;top:44px;width:29px;height:10px;border-top:3px solid #65443c;border-radius:50%}.studio-brow.left{left:17px}.studio-brow.right{right:17px}.studio-head[data-brows="droits"] .studio-brow{border-radius:0}.studio-head[data-brows="arqués"] .studio-brow{top:40px}.studio-head[data-brows="marqués"] .studio-brow{border-top-width:5px}.studio-head[data-brows="fins"] .studio-brow{border-top-width:1px}
.studio-eye{position:absolute;top:61px;width:31px;height:16px;border:2px solid #493334;border-top-color:transparent;border-radius:50%;background:#fff}.studio-eye.left{left:16px}.studio-eye.right{right:16px}.studio-eye i{position:absolute;left:50%;top:50%;width:12px;height:12px;transform:translate(-50%,-42%);border-radius:50%;background:radial-gradient(circle at 38% 30%,#fff 0 10%,#111 12% 25%,var(--iris) 28% 100%)}
.studio-head[data-eyes="grands"] .studio-eye{height:21px}.studio-head[data-eyes="fins"] .studio-eye{height:9px}.studio-head[data-eyes="étirés"] .studio-eye{width:35px}.studio-head[data-eyes="ronds"] .studio-eye{height:22px}.studio-head[data-eyes="tombants"] .studio-eye.left{transform:rotate(5deg)}.studio-head[data-eyes="tombants"] .studio-eye.right{transform:rotate(-5deg)}.studio-head[data-eyes="perçants"] .studio-eye.left{transform:rotate(-7deg)}.studio-head[data-eyes="perçants"] .studio-eye.right{transform:rotate(7deg)}
.studio-nose{position:absolute;left:50%;top:82px;width:10px;height:18px;transform:translateX(-50%);border-right:1.5px solid rgba(117,73,65,.55);border-bottom:1.5px solid rgba(117,73,65,.35);border-radius:0 0 8px}.studio-head[data-nose="discret"] .studio-nose{height:11px;opacity:.55}.studio-head[data-nose="marqué"] .studio-nose{height:23px;border-width:2px}.studio-head[data-nose="retroussé"] .studio-nose{height:13px;transform:translateX(-50%) rotate(-8deg)}
.studio-mouth{position:absolute;left:50%;top:111px;width:28px;height:8px;transform:translateX(-50%);border-bottom:2px solid #a56268;border-radius:50%}.studio-head[data-mouth="sourire"] .studio-mouth{width:34px;height:13px}.studio-head[data-mouth="sourire ouvert"] .studio-mouth{height:16px;background:#7d3d48;border-radius:5px 5px 50% 50%}.studio-head[data-mouth="sérieuse"] .studio-mouth{height:1px;border-radius:0}.studio-head[data-mouth="pulpeuse"] .studio-mouth{height:10px;border-top:2px solid #b66d75}
.studio-head[data-expression="joyeuse"] .studio-mouth,.studio-head[data-expression="sourire"] .studio-mouth{width:35px;height:14px}.studio-head[data-expression="triste"] .studio-mouth,.studio-head[data-expression="inquiète"] .studio-mouth{border-bottom:0;border-top:2px solid #a56268;border-radius:50%}.studio-head[data-expression="en colère"] .studio-brow.left{transform:rotate(13deg)}.studio-head[data-expression="en colère"] .studio-brow.right{transform:rotate(-13deg)}.studio-head[data-expression="surprise"] .studio-eye{height:22px}.studio-head[data-expression="surprise"] .studio-mouth{width:15px;height:15px;border:2px solid #a56268;border-radius:50%}.studio-head[data-expression="taquine"] .studio-eye.right{height:4px;background:transparent;border-left:0;border-right:0}.studio-head[data-expression="gênée"]::after{content:"";position:absolute;left:8px;right:8px;top:91px;height:15px;background:radial-gradient(ellipse at 15% 50%,rgba(225,117,126,.3),transparent 50%),radial-gradient(ellipse at 85% 50%,rgba(225,117,126,.3),transparent 50%)}
.studio-neck{position:absolute;z-index:3;left:50%;top:125px;width:34px;height:52px;transform:translateX(-50%);background:var(--skin)}.studio-torso{position:absolute;z-index:4;left:50%;top:157px;width:122px;height:176px;transform:translateX(-50%);background:var(--skin);border:1.5px solid rgba(94,61,55,.45);border-radius:38% 38% 28% 28%/16% 16% 20% 20%}.studio-torso::after{content:"";position:absolute;left:13px;right:13px;top:27px;height:68px;border-radius:20px;background:#25262d;border-bottom:3px solid #18191f}
.studio-arm{position:absolute;z-index:3;top:170px;width:31px;height:250px;border:1.5px solid rgba(94,61,55,.45);border-radius:20px;background:var(--skin)}.studio-arm.left{left:18px;transform:rotate(3deg)}.studio-arm.right{right:18px;transform:rotate(-3deg)}
.studio-brief{position:absolute;z-index:6;left:50%;top:311px;width:113px;height:55px;transform:translateX(-50%);background:#25262d;clip-path:polygon(0 0,100% 0,83% 70%,60% 100%,40% 100%,17% 70%)}
.studio-leg{position:absolute;z-index:2;top:335px;width:52px;height:250px;border:1.5px solid rgba(94,61,55,.45);border-radius:22px 22px 15px 15px;background:var(--skin)}.studio-leg.left{left:40px}.studio-leg.right{right:40px}
.studio-person[data-body="fine"]{transform:translateX(-50%) scaleX(.9)}.studio-person[data-body="ronde"]{transform:translateX(-50%) scaleX(1.12)}
.studio-summary{font-size:.78rem;color:var(--muted);line-height:1.45;min-height:2.4em}
.studio-tabs{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:12px}.studio-tabs button{min-height:54px;border:1px solid rgba(255,255,255,.13);border-radius:10px;background:rgba(255,255,255,.035);color:var(--ink);cursor:pointer}.studio-tabs button.active{border-color:#e27db7;background:linear-gradient(180deg,rgba(219,112,173,.24),rgba(151,75,118,.16));box-shadow:inset 0 2px #e27db7}
.choice-sections{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.choice-section{border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:12px;background:rgba(0,0,0,.08)}.choice-section:nth-child(2),.choice-section:nth-last-child(1){grid-column:span 1}.choice-section h2{font-size:1rem;margin:0 0 10px}.choice-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:7px}.choice-card{min-height:72px;padding:6px;border:1px solid transparent;border-radius:9px;background:rgba(255,255,255,.05);color:var(--ink);cursor:pointer;display:grid;gap:5px;place-items:center;font-size:.72rem}.choice-card:hover{background:rgba(255,255,255,.09)}.choice-card.selected{border-color:#ef78ba;box-shadow:0 0 0 2px rgba(239,120,186,.18);background:rgba(239,120,186,.09)}.choice-art{width:58px;height:34px;border-radius:18px 18px 14px 14px;background:linear-gradient(160deg,#f2cfba,#dba78e);position:relative}.choice-card[data-kind="eyeColor"] .choice-art{width:31px;height:31px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff 0 9%,#111 11% 25%,#6c5847 27% 100%)}.choice-card[data-kind="eyes"] .choice-art::after{content:"◉  ◉";position:absolute;inset:7px 0;text-align:center;color:#493334}.choice-card[data-kind="brows"] .choice-art::after{content:"⌒  ⌒";position:absolute;inset:5px 0;text-align:center;color:#65443c}.choice-card[data-kind="nose"] .choice-art::after{content:"⌞";position:absolute;left:50%;top:5px;color:#9a6b5e}.choice-card[data-kind="mouth"] .choice-art::after{content:"⌣";position:absolute;inset:5px 0;text-align:center;color:#a56268}.choice-card[data-kind="expression"] .choice-art::after{content:"•ᴗ•";position:absolute;inset:6px 0;text-align:center;color:#65443c}
.studio-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:12px}.studio-actions .primary-button,.studio-actions .secondary-button{min-height:46px;padding:0 22px}
@media(max-width:900px){.avatar-studio{grid-template-columns:1fr;margin-top:72px}.studio-preview{position:relative;top:0}.studio-doll{height:540px}.studio-person{top:5px;transform:translateX(-50%) scale(.88)}.studio-person[data-body="fine"]{transform:translateX(-50%) scale(.88) scaleX(.9)}.studio-person[data-body="ronde"]{transform:translateX(-50%) scale(.88) scaleX(1.12)}.studio-tabs{grid-template-columns:repeat(3,1fr)}.choice-sections{grid-template-columns:1fr}.choice-section{grid-column:auto!important}}


/* Avatar Studio V4: real illustrated base from the approved reference board */
.studio-person{width:290px;height:600px;transform:translateX(-50%)!important}
.studio-body-art{position:absolute;z-index:2;left:50%;top:0;width:auto;height:590px;transform:translateX(-50%);object-fit:contain;pointer-events:none;user-select:none}
.studio-neck,.studio-torso,.studio-arm,.studio-brief,.studio-leg{display:none!important}
.studio-head{top:3px;z-index:8;background:transparent!important;border:0!important}
.studio-ear{display:none!important}
.studio-person[data-body="fine"] .studio-body-art{transform:translateX(-50%) scaleX(.92)}
.studio-person[data-body="moyenne"] .studio-body-art{transform:translateX(-50%) scaleX(1)}
.studio-person[data-body="ronde"] .studio-body-art{transform:translateX(-50%) scaleX(1.08)}
@media(max-width:900px){
  .studio-person{transform:translateX(-50%) scale(.88)!important}
}


/* Avatar Studio V5: proportions and facial language aligned with approved anime boards */
.studio-person{width:300px;height:650px;top:18px}
.studio-body-art{position:absolute;z-index:2;left:50%;top:0;width:270px;height:648px;transform:translateX(-50%);overflow:visible}
.studio-body-art .skin-fill{fill:var(--skin)}
.studio-body-art .outline{stroke:rgba(82,52,48,.72);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.studio-body-art .body-line{fill:none;stroke:rgba(118,76,67,.48);stroke-width:1.45;stroke-linecap:round}
.studio-body-art .body-line.subtle{opacity:.55}
.studio-body-art .underwear{fill:#292a31;stroke:rgba(24,24,30,.72);stroke-width:1.4}
.studio-head{top:13px;width:101px;height:128px}
.studio-head[data-face="rond"]{width:106px;height:116px}
.studio-head[data-face="carré doux"]{width:106px;height:126px;border-radius:42% 42% 35% 35%}
.studio-head[data-face="cœur"]{width:105px;height:130px}
.studio-head[data-face="allongé"]{width:94px;height:136px}
.studio-head[data-face="diamant"]{width:103px;height:132px}
.studio-brow{top:43px}
.studio-eye{top:59px}
.studio-nose{top:80px}
.studio-mouth{top:106px}
.studio-person[data-body="fine"] .studio-body-art{transform:translateX(-50%) scaleX(.92)}
.studio-person[data-body="moyenne"] .studio-body-art{transform:translateX(-50%) scaleX(1)}
.studio-person[data-body="ronde"] .studio-body-art{transform:translateX(-50%) scaleX(1.1)}
.choice-card[data-kind="face"] .choice-art{height:46px;width:42px;border-radius:48% 48% 45% 45%/40% 40% 58% 58%}
.choice-card[data-kind="face"]:nth-child(2) .choice-art{height:42px;width:44px;border-radius:50%}
.choice-card[data-kind="face"]:nth-child(3) .choice-art{width:44px;border-radius:42% 42% 34% 34%}
.choice-card[data-kind="face"]:nth-child(4) .choice-art{width:44px;border-radius:50% 50% 60% 60%/42% 42% 68% 68%}
.choice-card[data-kind="face"]:nth-child(5) .choice-art{width:38px;height:50px}
.choice-card[data-kind="face"]:nth-child(6) .choice-art{width:44px;border-radius:46% 46% 60% 60%/34% 34% 68% 68%}
.choice-card[data-kind="eyes"] .choice-art{height:40px;border-radius:10px}
.choice-card[data-kind="eyes"] .choice-art::after{content:"";left:8px;right:8px;top:12px;height:12px;border-bottom:2px solid #493334;border-radius:50%;position:absolute}
.choice-card[data-kind="eyes"] .choice-art::before{content:"";position:absolute;left:50%;top:17px;width:9px;height:9px;transform:translate(-50%,-50%);border-radius:50%;background:#543528;box-shadow:0 0 0 2px #fff}
.choice-card[data-kind="brows"] .choice-art{height:40px;border-radius:10px}
.choice-card[data-kind="nose"] .choice-art{height:40px;border-radius:10px}
.choice-card[data-kind="mouth"] .choice-art{height:40px;border-radius:10px}
@media(max-width:900px){.studio-person{transform:translateX(-50%) scale(.88)!important;transform-origin:top center}.studio-body-art{height:620px}}

/* World entrance V2: image-first hub with quiet navigation */
.world-entrance-page{min-height:100svh;overflow:hidden;background:#15111c}
.world-entrance-scene{position:fixed;inset:0;background:url('/assets/CBA38D8E-74A1-46FC-802B-BDE59612FE31.png') center/cover no-repeat;transform:scale(1.005)}
.world-entrance-shade{position:fixed;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(8,7,13,.32),rgba(8,7,13,.02) 30%,rgba(8,7,13,.02) 62%,rgba(8,7,13,.48))}
.world-topbar{position:fixed;z-index:5;top:0;left:0;right:0;display:flex;align-items:center;gap:12px;padding:max(18px,env(safe-area-inset-top)) clamp(18px,3vw,42px) 16px;pointer-events:none}
.world-home-link,.world-exit,.world-identity{min-height:40px;border:1px solid rgba(255,255,255,.18);border-radius:999px;color:var(--ink);background:rgba(15,12,22,.38);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 8px 30px rgba(0,0,0,.18)}
.world-home-link,.world-exit{pointer-events:auto;cursor:pointer;padding:0 15px}.world-home-link{display:flex;align-items:center;gap:8px;font-family:"Libertinus Serif", "Linux Libertine", Georgia, serif}.world-home-link:hover,.world-exit:hover{background:rgba(35,27,45,.62)}
.world-identity{display:flex;align-items:center;gap:8px;min-height:34px;padding:0 12px;margin-left:auto;font-size:.76rem;color:rgba(244,236,223,.82)}
.world-identity-dot{width:6px;height:6px;border-radius:50%;background:#efe0cc;box-shadow:0 0 10px rgba(239,224,204,.7)}.world-exit{min-height:34px;font-size:.72rem;color:rgba(244,236,223,.72)}
.world-entrance-main{position:relative;z-index:2;min-height:100svh;display:flex;align-items:flex-start;justify-content:center;pointer-events:none}
.world-welcome{margin-top:clamp(86px,11vh,130px);padding:16px 24px;text-align:center;color:rgba(250,244,235,.92);text-shadow:0 2px 18px rgba(0,0,0,.78);opacity:.92}.world-welcome h1{font-size:clamp(2rem,4vw,3.4rem)}.world-welcome p:last-child{margin:9px 0 0;font-family:"Libertinus Serif", "Linux Libertine", Georgia, serif;font-size:.95rem;color:rgba(250,244,235,.72)}
.world-dock{position:fixed;z-index:5;left:50%;bottom:max(22px,calc(env(safe-area-inset-bottom) + 12px));transform:translateX(-50%);width:min(760px,calc(100% - 32px));display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;padding:7px;border:1px solid rgba(255,255,255,.42);border-radius:19px;background:rgba(255,255,255,.13);box-shadow:0 18px 55px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.16);backdrop-filter:blur(18px) saturate(1.04);-webkit-backdrop-filter:blur(18px) saturate(1.04)}
.world-dock-item{min-width:0;min-height:58px;display:flex;align-items:center;justify-content:center;gap:9px;padding:8px 10px;border:0;border-radius:13px;color:rgba(248,240,231,.88);background:transparent;text-align:left}.world-dock-item:not(:disabled){cursor:pointer}.world-dock-item:not(:disabled):hover{background:rgba(255,255,255,.08)}.world-dock-item:disabled{opacity:.72}.world-dock-icon{font-size:1.05rem;opacity:.8}.world-dock-item span:last-child{min-width:0;display:grid;gap:2px}.world-dock-item strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:"Libertinus Serif", "Linux Libertine", Georgia, serif;font-size:.82rem;font-weight:400}.world-dock-item small{font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:rgba(248,240,231,.45)}
.world-status{position:fixed;z-index:6;left:50%;bottom:100px;transform:translateX(-50%);margin:0}
@media(max-width:720px){.world-topbar{padding-left:14px;padding-right:14px}.world-identity{display:none}.world-welcome{margin-top:88px}.world-welcome p:last-child{display:none}.world-dock{width:calc(100% - 24px);gap:2px;padding:5px}.world-dock-item{min-height:56px;display:grid;place-items:center;gap:2px;padding:6px 3px;text-align:center}.world-dock-item strong{font-size:.64rem}.world-dock-item small{display:none}}

/* Our Little Bubble scene */
.bubble-home,.journal-page{margin:0;min-height:100svh;overflow:hidden;background:#17111b;color:#f6eee5}.bubble-scene,.bubble-shade,.journal-bg{position:fixed;inset:0}.bubble-scene{background:url('/assets/A3A575E5-F47B-4315-A7BD-C60152C224EF.png') center/cover no-repeat}.bubble-shade{pointer-events:none;background:linear-gradient(180deg,rgba(10,7,13,.3),transparent 28%,transparent 70%,rgba(10,7,13,.24))}
.bubble-top{position:fixed;z-index:5;left:0;right:0;top:0;display:flex;align-items:center;gap:14px;padding:max(15px,env(safe-area-inset-top)) clamp(14px,3vw,38px) 12px;pointer-events:none}.bubble-title{font-family:"Libertinus Serif", "Linux Libertine", Georgia, serif;font-style:italic;font-size:clamp(1rem,2vw,1.35rem);text-shadow:0 2px 14px #000}.bubble-pill{pointer-events:auto;border:1px solid #ffffff2b;border-radius:999px;background:#130f18a0;color:#f6eee5;padding:10px 14px;text-decoration:none;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}#invite{margin-left:auto;cursor:pointer}
.bubble-hotspots{position:fixed;z-index:3;inset:0}.hotspot{position:absolute;display:grid;grid-template-columns:32px auto;column-gap:8px;align-items:center;min-width:150px;padding:9px 12px;border:1px solid #ffffff35;border-radius:18px;background:#120e18a6;color:#f8f0e7;text-decoration:none;text-align:left;box-shadow:0 8px 28px #0005;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);cursor:pointer}.hotspot span{grid-row:1/3;font-size:1.25rem;text-align:center}.hotspot b{font:400 .88rem "Libertinus Serif", "Linux Libertine", Georgia, serif}.hotspot small{font-size:.65rem;color:#f8f0e799}.hotspot:hover{background:#2b2031c4;transform:translateY(-1px)}.hs-dressing{left:8%;top:32%}.hs-terrace{right:11%;top:42%}.hs-journal{right:7%;bottom:22%}.hs-memories{left:48%;bottom:18%}
.bubble-toast{position:fixed;z-index:9;left:50%;bottom:24px;transform:translate(-50%,20px);padding:10px 16px;border-radius:999px;background:#17111de8;border:1px solid #ffffff26;opacity:0;transition:.2s;pointer-events:none}.bubble-toast.show{opacity:1;transform:translate(-50%,0)}
.invite-sheet[hidden]{display:none}.invite-sheet{position:fixed;z-index:20;inset:0;display:grid;place-items:center}.invite-backdrop,.editor-backdrop{position:absolute;inset:0;border:0;background:#08060a99}.invite-sheet section{position:relative;width:min(420px,calc(100% - 32px));padding:25px;border:1px solid #ffffff24;border-radius:24px;background:#1b1520f2;box-shadow:0 25px 80px #0008}.invite-close{position:absolute;right:15px;top:12px;border:0;background:none;color:#fff;font-size:1.6rem}.invite-list{display:grid;gap:8px;margin:18px 0}.invite-list button{display:flex;justify-content:space-between;padding:13px;border:1px solid #ffffff20;border-radius:12px;background:#ffffff0b;color:#fff}.invite-list small{opacity:.5}
/* Journal */
.journal-bg{background:url('/assets/E6187B3A-3F06-42A9-917B-E3E117B356AB.png') center/cover no-repeat}.journal-back{position:fixed;z-index:8;top:max(16px,env(safe-area-inset-top));left:18px;padding:9px 13px;border-radius:999px;background:#1a1018b8;color:#fff;text-decoration:none;border:1px solid #fff3}
.journal-ui{position:relative;z-index:3;width:min(1180px,90vw);height:min(680px,78vh);margin:11vh auto 0;display:grid;grid-template-columns:1fr 1fr;gap:6%;color:#3d2928}.journal-list{align-self:center;padding:9% 8% 7% 10%;max-height:62vh;overflow:auto}.journal-list>button,.journal-entry{width:100%;border:1px solid #704b4430;background:#fff7ee80;color:#49312f;border-radius:10px;padding:10px 12px;margin:4px 0;text-align:left}.journal-entry{display:flex;justify-content:space-between;gap:10px}.journal-entry small{opacity:.6}.journal-none{opacity:.55}.journal-paper{position:relative;align-self:stretch;padding:11% 10% 8% 3%;overflow:auto}.journal-paper time{font-size:.75rem;opacity:.55}.journal-paper h1{font:italic 2rem "Libertinus Serif", "Linux Libertine", Georgia, serif;margin:.3em 0 .7em}.entry-text{font:1rem/1.8 "Libertinus Serif", "Linux Libertine", Georgia, serif}.journal-empty{margin-top:25%;text-align:center;opacity:.45;font:italic 1rem "Libertinus Serif", "Linux Libertine", Georgia, serif}.edit-entry{float:right;border:0;background:transparent;color:#60413d;text-decoration:underline;cursor:pointer}
.journal-editor[hidden]{display:none}.journal-editor{position:fixed;z-index:30;inset:0;display:grid;place-items:center}.journal-editor section{position:relative;width:min(760px,90vw);height:min(700px,82svh);display:flex;flex-direction:column;padding:30px;border-radius:22px;background:#f4e6d2;color:#3b2927;box-shadow:0 30px 100px #0009;animation:journalZoom .24s ease-out}.editor-head{display:flex;gap:12px}.editor-head input{flex:1;border:0;border-bottom:1px solid #765a50;background:transparent;font:italic 1.7rem "Libertinus Serif", "Linux Libertine", Georgia, serif;color:#3b2927;outline:none}.editor-head button,.editor-actions button{border:1px solid #765a5040;border-radius:10px;background:#fff6;color:#49332f;padding:9px 13px}.journal-editor textarea{flex:1;resize:none;margin:22px 0;border:0;background:repeating-linear-gradient(transparent 0,transparent 30px,#856b5e20 31px);font:1rem/31px "Libertinus Serif", "Linux Libertine", Georgia, serif;color:#3b2927;outline:none}.editor-actions{display:flex;justify-content:flex-end;gap:8px}.editor-actions #delete{margin-right:auto;color:#8c4747}@keyframes journalZoom{from{transform:scale(.86);opacity:.3}to{transform:scale(1);opacity:1}}
@media(max-width:720px){.bubble-title{display:none}.hotspot{min-width:0;padding:8px 10px}.hotspot small{display:none}.hs-dressing{left:5%;top:28%}.hs-terrace{right:5%;top:42%}.hs-journal{right:5%;bottom:18%}.hs-memories{left:34%;bottom:13%}.journal-ui{width:96vw;height:76vh;gap:3%;grid-template-columns:42% 58%;margin-top:13vh}.journal-list{padding:10% 4%}.journal-paper{padding:12% 8% 8% 2%}.journal-entry{display:block}.journal-entry small{display:block;margin-top:3px}.journal-paper h1{font-size:1.35rem}.entry-text{font-size:.9rem}.journal-editor section{width:94vw;height:82svh;padding:20px}.editor-head input{font-size:1.25rem}}

/* Journal framing calibration: align HTML to the illustrated paper */
.journal-page{background:#17111b}
.journal-bg{background-size:cover;background-position:center center}
.journal-ui{position:fixed;z-index:3;left:50%;top:50%;transform:translate(-50%,-50%);width:min(1040px,72vw);height:min(650px,68vh);margin:0;grid-template-columns:48.5% 51.5%;gap:2.5%;pointer-events:none}
.journal-list{pointer-events:auto;align-self:stretch;display:flex;flex-direction:column;justify-content:flex-end;padding:10% 8% 11% 8%;max-height:none;overflow:auto}
.journal-paper{pointer-events:auto;align-self:stretch;padding:13% 8% 10% 7%;overflow:auto}
@media(max-width:1100px){.journal-ui{width:76vw;height:66vh}}
@media(max-width:720px){.journal-ui{width:82vw;height:64vh;grid-template-columns:48% 52%;gap:2%}.journal-list{padding:10% 5% 10%}.journal-paper{padding:13% 7% 9% 5%}}


/* Our Little Bubble coordinated environments V1 */
.world-entrance-scene{background-image:url('/assets/our-little-bubble-shared/city-hub.jpeg')}
.world-dock-item{text-decoration:none}.world-dock-item.is-current{background:rgba(255,255,255,.08)}
.bubble-scene{transition:transform .38s ease,filter .28s ease,background-image .18s ease;transform:scale(1.005)}
.bubble-subscene .bubble-hotspots{opacity:0;pointer-events:none}
.scene-controls{position:fixed;z-index:7;left:50%;bottom:max(22px,calc(env(safe-area-inset-bottom) + 10px));transform:translateX(-50%);display:flex;align-items:center;gap:8px;padding:7px;border:1px solid #ffffff24;border-radius:999px;background:#120e18a8;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.scene-controls[hidden]{display:none}.scene-caption{padding:0 10px;font:italic .82rem "Libertinus Serif", "Linux Libertine", Georgia, serif;color:#f8f0e7bb;white-space:nowrap}
.memory-focus .bubble-scene{transform:scale(1.85);transform-origin:var(--memory-x,50%) var(--memory-y,28%)}
.bubble-scene[data-home="home-01-city-sunset"]{--memory-x:35%;--memory-y:25%}
.bubble-scene[data-home="home-02-provence"]{--memory-x:88%;--memory-y:29%}
.bubble-scene[data-home="home-03-paris-art-deco"]{--memory-x:53%;--memory-y:24%}
.bubble-scene[data-home="home-04-industrial-loft"]{--memory-x:55%;--memory-y:30%}
.bubble-scene[data-home="home-05-bohemian-village"]{--memory-x:86%;--memory-y:26%}
.bubble-scene[data-home="home-06-alpine-chalet"]{--memory-x:38%;--memory-y:25%}
.bubble-scene[data-home="home-07-mediterranean-coast"]{--memory-x:42%;--memory-y:25%}
.bubble-scene[data-home="home-08-floral-cottage"]{--memory-x:88%;--memory-y:26%}
.bubble-scene[data-home="home-09-lakeside"]{--memory-x:86%;--memory-y:27%}
.bubble-scene[data-home="home-10-future-garden"]{--memory-x:39%;--memory-y:25%}
.home-picker[hidden]{display:none}.home-picker{position:fixed;z-index:24;inset:0;display:grid;place-items:center}.home-picker>section{position:relative;width:min(920px,calc(100% - 28px));max-height:min(760px,86svh);overflow:auto;padding:24px;border:1px solid #ffffff24;border-radius:24px;background:#17111df2;box-shadow:0 25px 90px #0009}.home-picker h2{font:400 clamp(1.5rem,3vw,2.2rem) "Libertinus Serif", "Linux Libertine", Georgia, serif;margin:5px 0 18px}
.home-choice-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.home-choice{display:grid;gap:7px;padding:7px;border:1px solid #ffffff1f;border-radius:14px;background:#ffffff08;color:#f6eee5;cursor:pointer;text-align:left}.home-choice:hover{background:#ffffff11;transform:translateY(-1px)}.home-choice-thumb{display:block;aspect-ratio:16/10;border-radius:9px;background:center/cover no-repeat}.home-choice b{padding:0 4px 5px;font:400 .76rem "Libertinus Serif", "Linux Libertine", Georgia, serif}
.cafe-page{margin:0;min-height:100svh;overflow:hidden;background:#17111b;color:#f6eee5}.cafe-scene,.cafe-shade{position:fixed;inset:0}.cafe-scene{background:url('/assets/our-little-bubble-shared/cafe-interior.jpeg') center/cover no-repeat}.cafe-shade{pointer-events:none;background:linear-gradient(180deg,rgba(8,7,13,.26),transparent 34%,rgba(8,7,13,.08) 72%,rgba(8,7,13,.34))}
.cafe-main{position:relative;z-index:2;min-height:100svh;display:grid;place-items:end center;padding:110px 22px 110px;pointer-events:none}.cafe-card{width:min(540px,90vw);padding:18px 22px;border:1px solid #ffffff20;border-radius:20px;background:#17111d99;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);text-align:center;box-shadow:0 20px 55px #0005}.cafe-card h1{font-size:clamp(2rem,5vw,3.2rem)}.cafe-card p:last-child{margin:10px 0 0;color:#f6eee5b3;font-family:"Libertinus Serif", "Linux Libertine", Georgia, serif}
@media(max-width:860px){.home-choice-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.bubble-top{gap:6px}.bubble-top .bubble-pill{padding:8px 10px;font-size:.72rem}#invite{margin-left:0}.bubble-title{margin-right:auto}.scene-controls{max-width:calc(100% - 20px);border-radius:18px;flex-wrap:wrap;justify-content:center}.scene-caption{display:none}.memory-focus .bubble-scene{transform:scale(2.1)}}


/* Bubble mobile horizontal panorama V1 */
@media (max-width:720px) and (orientation:portrait){
  html.bubble-doc{
    overflow-x:auto;
    overflow-y:hidden;
    overscroll-behavior-y:none;
  }
  body.bubble-home{
    width:150svh;
    min-width:100vw;
    height:100svh;
    min-height:100svh;
    overflow:visible;
    -webkit-overflow-scrolling:touch;
    touch-action:pan-x;
  }
  .bubble-home .bubble-scene{
    position:absolute;
    inset:0 auto auto 0;
    width:150svh;
    height:100svh;
    background-size:100% 100%;
    background-position:left center;
    transform:none;
  }
  /* The panorama and its hotspots are one coordinate space.
     Hotspots must travel with the illustrated room, not with the viewport. */
  .bubble-home .bubble-hotspots{
    position:absolute;
    inset:0 auto auto 0;
    width:150svh;
    height:100svh;
  }
  .bubble-home .bubble-shade,
  .bubble-home .bubble-top,
  .bubble-home .scene-controls,
  .bubble-home .bubble-toast{
    position:fixed;
  }
  .bubble-home.memory-focus .bubble-scene{
    transform:scale(1.35);
  }
}


/* Per-home journal paper calibration V1
   Each illustration has its own book geometry. */
.journal-page[data-home="home-01-city-sunset"] .journal-ui{left:50%;top:51%;width:min(1030px,70vw);height:min(620px,64vh);grid-template-columns:48% 52%;gap:2%}
.journal-page[data-home="home-02-provence"] .journal-ui{left:50%;top:51%;width:min(1050px,72vw);height:min(630px,65vh);grid-template-columns:48% 52%;gap:2%}
.journal-page[data-home="home-03-paris-art-deco"] .journal-ui{left:50%;top:51%;width:min(1040px,71vw);height:min(630px,65vh);grid-template-columns:48% 52%;gap:2%}
.journal-page[data-home="home-04-industrial-loft"] .journal-ui{left:50%;top:51%;width:min(1040px,71vw);height:min(630px,65vh);grid-template-columns:48% 52%;gap:2%}
.journal-page[data-home="home-05-bohemian-village"] .journal-ui{left:50%;top:51%;width:min(1040px,71vw);height:min(630px,65vh);grid-template-columns:48% 52%;gap:2%}
.journal-page[data-home="home-06-alpine-chalet"] .journal-ui{left:50%;top:51%;width:min(1040px,71vw);height:min(630px,65vh);grid-template-columns:48% 52%;gap:2%}
.journal-page[data-home="home-07-mediterranean-coast"] .journal-ui{left:50%;top:51%;width:min(1040px,71vw);height:min(630px,65vh);grid-template-columns:48% 52%;gap:2%}
.journal-page[data-home="home-08-floral-cottage"] .journal-ui{left:50%;top:51%;width:min(1040px,71vw);height:min(630px,65vh);grid-template-columns:48% 52%;gap:2%}
.journal-page[data-home="home-09-lakeside"] .journal-ui{left:50%;top:52%;width:min(1010px,68vw);height:min(600px,62vh);grid-template-columns:48% 52%;gap:2%}
.journal-page[data-home="home-10-future-garden"] .journal-ui{left:50%;top:51%;width:min(1040px,71vw);height:min(630px,65vh);grid-template-columns:48% 52%;gap:2%}


/* Per-home room hotspot calibration V1.
   Coordinates follow the furniture/doors drawn in each interior instead of one global layout. */
.bubble-home[data-home="home-01-city-sunset"]{--dress-x:8%;--dress-y:32%;--terrace-x:11%;--terrace-y:42%;--journal-x:7%;--journal-y:22%;--memory-xh:48%;--memory-yh:18%}
.bubble-home[data-home="home-02-provence"]{--dress-x:7%;--dress-y:36%;--terrace-x:8%;--terrace-y:35%;--journal-x:9%;--journal-y:20%;--memory-xh:45%;--memory-yh:16%}
.bubble-home[data-home="home-03-paris-art-deco"]{--dress-x:9%;--dress-y:30%;--terrace-x:10%;--terrace-y:39%;--journal-x:8%;--journal-y:21%;--memory-xh:47%;--memory-yh:17%}
.bubble-home[data-home="home-04-industrial-loft"]{--dress-x:7%;--dress-y:34%;--terrace-x:8%;--terrace-y:38%;--journal-x:8%;--journal-y:19%;--memory-xh:50%;--memory-yh:16%}
.bubble-home[data-home="home-05-bohemian-village"]{--dress-x:8%;--dress-y:35%;--terrace-x:9%;--terrace-y:40%;--journal-x:7%;--journal-y:21%;--memory-xh:46%;--memory-yh:17%}
.bubble-home[data-home="home-06-alpine-chalet"]{--dress-x:7%;--dress-y:31%;--terrace-x:8%;--terrace-y:37%;--journal-x:8%;--journal-y:20%;--memory-xh:44%;--memory-yh:17%}
.bubble-home[data-home="home-07-mediterranean-coast"]{--dress-x:8%;--dress-y:33%;--terrace-x:7%;--terrace-y:36%;--journal-x:8%;--journal-y:21%;--memory-xh:48%;--memory-yh:16%}
.bubble-home[data-home="home-08-floral-cottage"]{--dress-x:7%;--dress-y:34%;--terrace-x:9%;--terrace-y:39%;--journal-x:8%;--journal-y:20%;--memory-xh:46%;--memory-yh:17%}
.bubble-home[data-home="home-09-lakeside"]{--dress-x:8%;--dress-y:32%;--terrace-x:11%;--terrace-y:42%;--journal-x:7%;--journal-y:22%;--memory-xh:48%;--memory-yh:18%}
.bubble-home[data-home="home-10-future-garden"]{--dress-x:8%;--dress-y:33%;--terrace-x:8%;--terrace-y:37%;--journal-x:8%;--journal-y:20%;--memory-xh:47%;--memory-yh:16%}
.bubble-home[data-home] .hs-dressing{left:var(--dress-x);top:var(--dress-y)}
.bubble-home[data-home] .hs-terrace{right:var(--terrace-x);top:var(--terrace-y)}
.bubble-home[data-home] .hs-journal{right:var(--journal-x);bottom:var(--journal-y)}
.bubble-home[data-home] .hs-memories{left:var(--memory-xh);bottom:var(--memory-yh)}


/* Journal image-space layout V2: JS projects each page rectangle from the
   original illustration onto the current viewport. */
.journal-ui{position:fixed;z-index:3;inset:0;width:100vw;height:100vh;margin:0;display:block;transform:none;pointer-events:none}
.journal-ui .journal-list,.journal-ui .journal-paper{position:absolute;box-sizing:border-box;max-height:none;align-self:auto;pointer-events:auto}


/* Basic Hiko Universe phone V1 */
.phone-sheet[hidden]{display:none}
.phone-sheet{position:fixed;z-index:30;inset:0;display:grid;place-items:center}
.phone-panel{position:relative;width:min(390px,calc(100vw - 28px));max-height:min(760px,88svh);overflow:auto;padding:24px 18px 20px;border:1px solid #ffffff24;border-radius:32px;background:#15131aec;color:#f7f1eb;box-shadow:0 28px 100px #000b;backdrop-filter:blur(22px)}
.phone-panel h2,.phone-panel h3{font:400 1.65rem "Libertinus Serif", "Linux Libertine", Georgia, serif;margin:5px 0 18px}
.phone-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.phone-grid>button,.phone-list>button,.contact-actions>button{border:1px solid #ffffff1c;border-radius:16px;background:#ffffff0b;color:inherit;padding:14px;text-align:left;cursor:pointer}
.phone-grid>button{min-height:105px;display:grid;align-content:start;gap:5px}
.phone-grid span{font-size:1.35rem}.phone-grid b,.phone-list button,.contact-actions button{font:500 .94rem "Libertinus Serif", "Linux Libertine", Georgia, serif}
.phone-grid small,.digital-empty small{color:#d6cbd0;font:.76rem/1.35 "Libertinus Serif", "Linux Libertine", Georgia, serif}
.phone-subview[hidden]{display:none}.phone-subview{min-height:380px}
#phone-back{margin-bottom:14px}
.phone-list{display:grid;gap:9px}.phone-list>button:disabled{opacity:.45;cursor:default}
.contact-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.digital-empty{min-height:270px;border:1px solid #ffffff18;border-radius:20px;background:linear-gradient(145deg,#ffffff09,#ffffff03);display:grid;place-items:center;align-content:center;gap:9px;text-align:center;padding:28px}
.digital-empty>b{font:500 1rem "Libertinus Serif", "Linux Libertine", Georgia, serif}.digital-empty>small{max-width:240px}
@media(max-width:520px){.phone-panel{border-radius:25px;padding:22px 14px 16px}.phone-grid{gap:8px}.phone-grid>button{min-height:96px;padding:12px}}


/* Shared city locations V1 */
.location-picker[hidden]{display:none}
.location-picker{position:fixed;z-index:20;inset:0;display:grid;place-items:end center;padding:20px}
.location-picker-backdrop{position:absolute;inset:0;border:0;background:rgba(7,6,10,.56);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);cursor:pointer}
.location-picker-panel{position:relative;width:min(820px,100%);max-height:min(78svh,760px);overflow:auto;padding:18px;border:1px solid rgba(255,255,255,.16);border-radius:24px;background:rgba(20,16,27,.9);box-shadow:0 24px 80px rgba(0,0,0,.5);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.location-picker-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px}.location-picker-head h2{margin:3px 0 0;font:400 clamp(1.5rem,4vw,2.2rem) "Libertinus Serif", "Linux Libertine", Georgia, serif}
.location-picker-x{flex:0 0 auto;width:40px;height:40px;border:1px solid rgba(255,255,255,.14);border-radius:50%;background:rgba(255,255,255,.07);color:var(--ink);font-size:1.4rem;cursor:pointer}
.location-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.location-card{position:relative;isolation:isolate;min-height:150px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;gap:3px;padding:16px;border:1px solid rgba(255,255,255,.12);border-radius:18px;color:#fff;text-decoration:none;background:#17111b;box-shadow:inset 0 0 0 1px rgba(255,255,255,.02)}
.location-card::before{content:"";position:absolute;z-index:-2;inset:0;background:var(--location-image) center/cover no-repeat;transition:transform .2s ease}.location-card::after{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(180deg,rgba(8,7,13,.04),rgba(8,7,13,.8))}
.location-card:hover::before,.location-card:focus-visible::before{transform:scale(1.025)}.location-card>span{font-size:1.15rem}.location-card strong{font-family:"Libertinus Serif", "Linux Libertine", Georgia, serif;font-weight:400;font-size:1.05rem}.location-card small{color:rgba(255,255,255,.68)}
.location-card-wide{grid-column:1/-1;min-height:175px}
body.picker-open{overflow:hidden}
.place-page{margin:0;min-height:100svh;overflow:hidden;background:#17111b;color:#f6eee5}
.place-scene,.place-shade{position:fixed;inset:0}.place-scene{background:var(--place-image) center/cover no-repeat;transform:scale(1.005);transition:background-image .18s ease}.place-shade{pointer-events:none;background:linear-gradient(180deg,rgba(8,7,13,.18),transparent 30%,transparent 66%,rgba(8,7,13,.32))}
.place-main{position:relative;z-index:2;min-height:100svh;display:flex;align-items:flex-end;justify-content:flex-start;padding:110px clamp(22px,4vw,64px) max(30px,calc(env(safe-area-inset-bottom) + 24px));pointer-events:none}
.place-card{width:min(430px,36vw);padding:15px 18px;border:1px solid rgba(255,255,255,.16);border-radius:17px;background:rgba(23,17,29,.42);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);text-align:left;box-shadow:0 14px 38px #0004;pointer-events:auto}
.place-card .eyebrow{display:none}.place-card h1{margin:0 0 5px;font-size:clamp(1.45rem,2.6vw,2.15rem);line-height:1.05}.place-card>p:last-of-type{margin:0;color:rgba(246,238,229,.78);font-family:"Libertinus Serif", "Linux Libertine", Georgia, serif;font-size:.95rem;line-height:1.35}
.restaurant-variant-switch{display:flex;justify-content:flex-start;gap:7px;margin-top:12px}.restaurant-variant-switch button{border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:7px 12px;background:rgba(20,16,25,.28);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:rgba(255,255,255,.78);cursor:pointer}.restaurant-variant-switch button.is-active{background:rgba(255,255,255,.16);color:#fff}
/* Tablet/iPad keeps the panoramic, floating desktop language instead of becoming a large phone. */
@media(min-width:641px) and (max-width:1180px){.place-scene{background-size:cover;background-position:center center}.place-main{padding-left:clamp(22px,4vw,46px);padding-right:clamp(22px,4vw,46px)}.place-card{width:min(390px,42vw);padding:14px 17px}.place-card h1{font-size:clamp(1.45rem,3vw,2rem)}}
/* Phones get their own compact treatment. */
@media(max-width:640px){.location-picker{padding:10px}.location-picker-panel{padding:14px;border-radius:22px}.location-grid{grid-template-columns:1fr}.location-card,.location-card-wide{grid-column:auto;min-height:118px}.place-main{justify-content:center;padding-left:14px;padding-right:14px}.place-card{width:min(520px,94vw);padding:14px 16px;text-align:center}.place-card h1{font-size:clamp(1.65rem,8vw,2.25rem)}.restaurant-variant-switch{justify-content:center}}
/* Mobile places: preserve the panorama and let the user explore it horizontally, like Home. */
@media(max-width:640px) and (orientation:portrait){
  html:has(body.place-page){overflow-x:auto;overflow-y:hidden;overscroll-behavior-y:none;-webkit-overflow-scrolling:touch}
  body.place-page{width:150svh;min-width:100vw;height:100svh;min-height:100svh;overflow:visible;touch-action:pan-x}
  .place-page .place-scene{position:absolute;inset:0 auto auto 0;width:150svh;height:100svh;background-size:100% 100%;background-position:left center;transform:none}
  .place-page .place-shade,.place-page .world-topbar{position:fixed}
  .place-page .place-main{position:fixed;inset:0;width:100vw;height:100svh;min-height:0;padding:110px 14px max(22px,calc(env(safe-area-inset-bottom) + 16px));pointer-events:none}
  .place-page .place-card{pointer-events:auto}
}

/* Utility: native hidden state must win over component display rules. */
.bubble-home [hidden]{display:none !important}

/* Journal V1: JS positions these zones directly on the illustrated pages.
   Remove legacy flex/grid spacing so absolute coordinates stay exact. */
.journal-ui .journal-list{
  margin:0 !important;
  padding:6% 4% 5% !important;
  justify-content:flex-start !important;
  overflow:auto;
}
.journal-ui .journal-paper{
  margin:0 !important;
  padding:6% 5% !important;
  overflow:auto;
}

/* Journal absolute zones: percentage padding must not be relative to viewport width. */
.journal-ui .journal-list{
  padding:22px 18px !important;
}
.journal-ui .journal-paper{
  padding:24px 22px !important;
}

/* Journal: neutralize legacy absolute offsets before JS places each page zone. */
.journal-ui .journal-list,
.journal-ui .journal-paper{
  right:auto !important;
  bottom:auto !important;
  transform:none !important;
}

/* Journal final isolation: override per-home legacy rules that reapply a 50% origin. */
.journal-page .journal-ui{
  position:fixed !important;
  inset:0 !important;
  left:0 !important;
  top:0 !important;
  right:0 !important;
  bottom:0 !important;
  width:100vw !important;
  height:100vh !important;
  margin:0 !important;
  display:block !important;
  transform:none !important;
}

/* Memories: one collection, physical wall and digital phone presentations. */
.memory-library[hidden]{display:none!important}
.memory-library{position:fixed;z-index:6;inset:90px 6vw 6vh;display:flex;flex-direction:column;pointer-events:none}
.memory-library-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;color:#fff;text-shadow:0 2px 14px #0008;pointer-events:auto}
.memory-library-head h2{margin:3px 0;font:400 clamp(2rem,4vw,3.4rem) "Libertinus Serif", "Linux Libertine", Georgia, serif}
.memory-polaroids{flex:1;display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,220px));align-content:start;justify-content:start;gap:24px;padding:24px 2vw;overflow:auto;pointer-events:auto}
.memory-polaroid{background:#f5efe5;color:#403431;padding:12px 12px 15px;box-shadow:0 12px 30px #0006;transform:rotate(-1deg);width:100%;box-sizing:border-box}
.memory-polaroid:nth-child(even){transform:rotate(1.2deg)}
.memory-polaroid{position:relative}.memory-polaroid-delete{position:absolute;z-index:2;top:6px;right:6px;width:28px;height:28px;border:1px solid #40343133;border-radius:50%;background:#f5efe5e8;color:#403431;font:400 1.1rem/1 Arial,sans-serif;display:grid;place-items:center;cursor:pointer;box-shadow:0 3px 10px #0002}.memory-polaroid-delete:hover,.memory-polaroid-delete:focus-visible{outline:none;background:#fff}.memory-polaroid-delete:disabled{opacity:.45;cursor:wait}
.memory-photo{aspect-ratio:1/1;background:#d8d0c7;display:grid;place-items:center;overflow:hidden;font-size:2rem}
.memory-photo img,.phone-memory-card img{width:100%;height:100%;object-fit:cover}
.memory-polaroid b,.memory-polaroid small{display:block}.memory-polaroid b{margin-top:10px;font-size:1rem;line-height:1.08}.memory-polaroid small{margin-top:7px;opacity:.62;font-size:.75rem}
.memory-empty{grid-column:1/-1;justify-self:center;margin-top:12vh;padding:28px 34px;border:1px solid #ffffff30;border-radius:22px;background:#17111bbd;color:#fff;text-align:center;backdrop-filter:blur(14px)}
.memory-empty span,.memory-empty b,.memory-empty small{display:block}.memory-empty span{font-size:2rem}.memory-empty b{margin:9px}.memory-empty small{opacity:.72}
.phone-memory-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.phone-memory-grid .digital-empty{grid-column:1/-1}
.phone-memory-card{min-width:0;border:1px solid #ffffff18;border-radius:15px;background:#ffffff08;padding:8px}.phone-memory-card>div{aspect-ratio:1/1;border-radius:10px;background:#ffffff0a;display:grid;place-items:center;overflow:hidden}.phone-memory-card b,.phone-memory-card small{display:block;margin-top:6px}.phone-memory-card small{color:#cdbfd8;font-size:.72rem}
@media(max-width:640px){
 .bubble-home .memory-library{position:fixed;top:112px;left:14px;right:auto;bottom:95px;width:calc(100vw - 28px);max-width:calc(100vw - 28px);box-sizing:border-box}
 .bubble-home .memory-library-head{flex-direction:column;align-items:flex-start;gap:12px;min-width:0}
 .bubble-home .memory-library-head h2{font-size:1.8rem;overflow-wrap:anywhere}
 .bubble-home #memory-create{align-self:flex-start;max-width:100%;min-height:40px;white-space:normal;text-align:center;padding:9px 14px}
 .bubble-home .memory-polaroids{min-width:0;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:16px 2px}
 .bubble-home .memory-empty{box-sizing:border-box;max-width:100%;margin-top:3vh;padding:22px 18px}
}

/* Immersive walk navigation: elegant glass diamonds between outdoor locations */
.walk-nav{position:fixed;z-index:8;top:50%;transform:translateY(-50%);display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;filter:drop-shadow(0 8px 18px rgba(0,0,0,.32));-webkit-tap-highlight-color:transparent}
.walk-nav-prev{left:clamp(14px,2.2vw,34px);flex-direction:row}.walk-nav-next{right:clamp(14px,2.2vw,34px);flex-direction:row-reverse}
.walk-nav-diamond{width:46px;height:46px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.42);border-radius:9px;background:rgba(25,20,31,.18);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);transform:rotate(45deg);box-shadow:inset 0 0 18px rgba(255,255,255,.05),0 5px 22px rgba(0,0,0,.18);transition:transform .18s ease,background .18s ease,border-color .18s ease}
.walk-nav-diamond>span{display:block;transform:rotate(-45deg);font:300 2rem/1 "Libertinus Serif", "Linux Libertine", Georgia, serif;margin-top:-3px;text-shadow:0 1px 7px rgba(0,0,0,.4)}
.walk-nav small{max-width:0;overflow:hidden;opacity:0;white-space:nowrap;padding:7px 0;font:500 .76rem/1 "Libertinus Serif", "Linux Libertine", Georgia, serif;letter-spacing:.02em;text-shadow:0 2px 8px rgba(0,0,0,.65);transition:max-width .22s ease,opacity .18s ease,padding .22s ease}
.walk-nav:hover .walk-nav-diamond,.walk-nav:focus-visible .walk-nav-diamond{transform:rotate(45deg) scale(1.08);background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.72)}
.walk-nav:hover small,.walk-nav:focus-visible small{max-width:130px;opacity:1;padding-left:4px;padding-right:4px}
.walk-nav:focus-visible{outline:none}
@media(max-width:640px){
 .walk-nav{position:fixed;top:50%;z-index:12}
 .walk-nav-prev{left:12px}.walk-nav-next{right:12px}
 .walk-nav-diamond{width:40px;height:40px;border-radius:8px;background:rgba(25,20,31,.2)}
 .walk-nav-diamond>span{font-size:1.75rem}
 .walk-nav small{display:none}
}

/* City panorama: on phones, keep the full wide illustration and allow horizontal exploration. */
@media(max-width:640px) and (orientation:portrait){
  html:has(body.world-entrance-page){overflow-x:auto;overflow-y:hidden;overscroll-behavior-y:none;-webkit-overflow-scrolling:touch}
  body.world-entrance-page{width:150svh;min-width:100vw;height:100svh;min-height:100svh;overflow:visible;touch-action:pan-x}
  .world-entrance-page .world-entrance-scene{position:absolute;inset:0 auto auto 0;width:150svh;height:100svh;background-size:100% 100%;background-position:left center;transform:none}
  .world-entrance-page .world-entrance-shade,.world-entrance-page .world-topbar,.world-entrance-page .world-dock,.world-entrance-page .world-status{position:fixed}
  .world-entrance-page .world-entrance-main{position:fixed;inset:0;width:100vw;height:100svh;min-height:0}
}

/* Rin presence engine V0: one world sprite, one Bubble sprite, ready for state-driven swaps. */
.rin-presence{position:fixed;z-index:3;border:0;background:none;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent;filter:drop-shadow(0 14px 18px rgba(0,0,0,.24));transition:transform .18s ease,filter .18s ease}
.rin-presence img{display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom;pointer-events:none}
.rin-city{right:12%;bottom:72px;width:min(29vw,390px);height:min(76svh,760px)}
.rin-bubble{right:8%;bottom:0;width:min(30vw,410px);height:min(78svh,790px)}
.rin-presence:hover,.rin-presence:focus-visible{transform:translateY(-3px);filter:drop-shadow(0 18px 24px rgba(0,0,0,.34))}
.rin-presence:focus-visible{outline:1px solid rgba(255,255,255,.55);outline-offset:6px;border-radius:18px}
.rin-presence-hint{position:absolute;left:50%;bottom:9%;transform:translateX(-50%) translateY(5px);padding:6px 11px;border:1px solid rgba(255,255,255,.2);border-radius:999px;background:rgba(20,16,27,.45);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:#fff;font:500 .75rem "Libertinus Serif", "Linux Libertine", Georgia, serif;opacity:0;transition:opacity .18s ease,transform .18s ease}
.rin-presence:hover .rin-presence-hint,.rin-presence:focus-visible .rin-presence-hint{opacity:1;transform:translateX(-50%) translateY(0)}
@media(max-width:640px){.rin-city{right:7vw;bottom:86px;width:52vw;height:64svh}.rin-bubble{right:2vw;width:56vw;height:66svh}.rin-presence-hint{display:none}}

/* City perspective correction: Rin should read at the same scale as nearby doors and architecture. */
.rin-city{right:14%;bottom:88px;width:min(22vw,300px);height:min(61svh,610px)}
@media(max-width:640px){.rin-city{right:9vw;bottom:92px;width:41vw;height:53svh}}

/* City camera: zoom the environment instead of shrinking characters to miniature scale. */
.world-entrance-scene{background-size:auto 125%;background-position:center 58%}
.rin-city{right:12%;bottom:72px;width:min(29vw,390px);height:min(76svh,760px)}
@media(max-width:640px) and (orientation:portrait){
  body.world-entrance-page{width:187.5svh}
  .world-entrance-page .world-entrance-scene{width:187.5svh;height:100svh;background-size:100% 125%;background-position:left 58%}
  .rin-city{right:7vw;bottom:86px;width:52vw;height:64svh}
}

/* Final city character scale: keep Rin at the smaller perspective-correct size, grounded slightly lower. */
.rin-city{right:14%;bottom:58px;width:min(22vw,300px);height:min(61svh,610px)}
@media(max-width:640px){.rin-city{right:9vw;bottom:66px;width:41vw;height:53svh}}

/* Desktop city panorama: preserve the zoomed scene as a wider draggable world. */
@media(min-width:641px){
  html:has(body.world-entrance-page){overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
  html:has(body.world-entrance-page)::-webkit-scrollbar{display:none}
  body.world-entrance-page{width:125vw;min-width:125vw;height:100svh;min-height:100svh;overflow:visible;cursor:grab}
  .world-entrance-page .world-entrance-scene{position:absolute;inset:0 auto auto 0;width:125vw;height:100svh;background-size:100% 125%;background-position:center 58%;transform:none}
  .world-entrance-page .world-entrance-shade,.world-entrance-page .world-topbar,.world-entrance-page .world-dock,.world-entrance-page .world-status{position:fixed}
  .world-entrance-page .world-entrance-main{position:fixed;inset:0;width:100vw;height:100svh;min-height:0;pointer-events:none}
  body.world-entrance-page.city-dragging{cursor:grabbing;user-select:none}
}

/* Bubble composition: keep Rin on the quieter left side, away from terrace and foreground plant. */
.rin-bubble{left:4%;right:auto;bottom:0;width:min(30vw,410px);height:min(78svh,790px)}
@media(max-width:640px){.rin-bubble{left:2vw;right:auto;width:56vw;height:66svh}}

/* Full-body Rin placement lab: consistent baseline across human-scale scenes. */
.rin-world-test{z-index:6;left:4%;right:auto;bottom:0;width:min(23vw,330px);height:min(78svh,760px)}
.rin-world-test img{object-fit:contain;object-position:center bottom}
@media(max-width:640px){.rin-world-test{left:3vw;right:auto;bottom:0;width:45vw;height:67svh}}

/* Rin placement pass: keep the pier reference scale, enlarge closer scenes, and clear place descriptions. */
.place-page .rin-world-test{left:auto;right:6%;bottom:0}
.place-page:has(.place-scene[style*="1DBA540E"]) .rin-world-test{width:min(27vw,385px);height:min(86svh,820px)}
.place-page:has(.place-scene[style*="A86EA1F8"]) .rin-world-test{width:min(27vw,385px);height:min(86svh,820px)}
.place-page:has(.place-scene[style*="BA4BF8EF"]) .rin-world-test{width:min(23vw,330px);height:min(78svh,760px)}
.place-page:has(.place-scene[style*="7BDC4CC8"]) .rin-world-test,
.place-page:has(.place-scene[style*="33D29EAA"]) .rin-world-test{width:min(27vw,385px);height:min(86svh,820px)}
.bubble-home .rin-world-test{left:5%;right:auto;width:min(27vw,385px);height:min(86svh,820px)}
@media(max-width:640px){
 .place-page .rin-world-test{left:auto;right:4vw}
 .place-page:has(.place-scene[style*="1DBA540E"]) .rin-world-test,
 .place-page:has(.place-scene[style*="A86EA1F8"]) .rin-world-test,
 .place-page:has(.place-scene[style*="7BDC4CC8"]) .rin-world-test,
 .place-page:has(.place-scene[style*="33D29EAA"]) .rin-world-test,
 .bubble-home .rin-world-test{width:51vw;height:73svh}
 .place-page:has(.place-scene[style*="BA4BF8EF"]) .rin-world-test{width:45vw;height:67svh}
}

/* Bubble placement: park Rin by the central steel column so Dressing stays fully clickable. */
.bubble-home .rin-world-test{left:32%;right:auto;bottom:0;transform:translateX(-50%)}
.bubble-home .rin-world-test:hover,.bubble-home .rin-world-test:focus-visible{transform:translateX(-50%) translateY(-3px)}
@media(max-width:640px){.bubble-home .rin-world-test{left:34%;right:auto;transform:translateX(-50%)}.bubble-home .rin-world-test:hover,.bubble-home .rin-world-test:focus-visible{transform:translateX(-50%) translateY(-3px)}}

/* Outdoor scale pass: pier stays the reference; other outdoor scenes need Rin closer to camera. */
.place-page:has(.place-scene[style*="1DBA540E"]) .rin-world-test,
.place-page:has(.place-scene[style*="A86EA1F8"]) .rin-world-test,
.place-page:has(.place-scene[style*="7BDC4CC8"]) .rin-world-test,
.place-page:has(.place-scene[style*="33D29EAA"]) .rin-world-test{width:min(31vw,440px);height:min(92svh,880px)}
@media(max-width:640px){
 .place-page:has(.place-scene[style*="1DBA540E"]) .rin-world-test,
 .place-page:has(.place-scene[style*="A86EA1F8"]) .rin-world-test,
 .place-page:has(.place-scene[style*="7BDC4CC8"]) .rin-world-test,
 .place-page:has(.place-scene[style*="33D29EAA"]) .rin-world-test{width:58vw;height:78svh}
}

/* Bubble placement refinement: move Rin slightly deeper into the bedroom area. */
.bubble-home .rin-world-test{left:35%;bottom:5svh}
.bubble-home .rin-world-test:hover,.bubble-home .rin-world-test:focus-visible{transform:translateX(-50%) translateY(-3px)}
@media(max-width:640px){.bubble-home .rin-world-test{left:36%;bottom:4svh}}

/* Placement pass: outdoor Rin moves inward without sitting dead-center. */
.place-page .rin-world-test{left:61%;right:auto;transform:translateX(-50%)}
.place-page .rin-world-test:hover,.place-page .rin-world-test:focus-visible{transform:translateX(-50%) translateY(-3px)}
@media(max-width:640px){
 .place-page .rin-world-test{left:62%;right:auto;transform:translateX(-50%)}
 .place-page .rin-world-test:hover,.place-page .rin-world-test:focus-visible{transform:translateX(-50%) translateY(-3px)}
}
/* Home returns to an interaction-style half-body portrait. */
.bubble-home .rin-world-test{left:35%;bottom:0;width:min(30vw,410px);height:min(78svh,790px)}


/* Character-ready backgrounds: shift Rin slightly upward and toward center.
   The pier keeps its existing placement as the reference scene. */
.cafe-page .rin-world-test,
.place-page:has(.place-scene[style*="Parc%20avec%20banc"]) .rin-world-test,
.place-page:has(.place-scene[style*="Fontaine.png"]) .rin-world-test,
.restaurant-place-page .rin-world-test{
  left:56%;
  bottom:3.5svh;
}
@media(max-width:640px){
  .cafe-page .rin-world-test,
  .place-page:has(.place-scene[style*="Parc%20avec%20banc"]) .rin-world-test,
  .place-page:has(.place-scene[style*="Fontaine.png"]) .rin-world-test,
  .restaurant-place-page .rin-world-test{
    left:57%;
    bottom:3svh;
  }
}


/* Scale pass: +15% on rebuilt scenes, with the pier kept unchanged. */
.cafe-page .rin-world-test,
.place-page:has(.place-scene[style*="Parc%20avec%20banc"]) .rin-world-test,
.place-page:has(.place-scene[style*="Fontaine.png"]) .rin-world-test,
.restaurant-place-page .rin-world-test{
  width:min(35.65vw,506px);
  height:min(105.8svh,1012px);
}
@media(max-width:640px){
  .cafe-page .rin-world-test,
  .place-page:has(.place-scene[style*="Parc%20avec%20banc"]) .rin-world-test,
  .place-page:has(.place-scene[style*="Fontaine.png"]) .rin-world-test,
  .restaurant-place-page .rin-world-test{
    width:66.7vw;
    height:89.7svh;
  }
}


/* Placement correction after +15% scale.
   New named backgrounds need selectors on the body's --place-image, not .place-scene inline styles.
   Keep the pier unchanged. */
.cafe-page .rin-world-test,
.place-page[style*="Parc%20avec%20banc"] .rin-world-test,
.place-page[style*="Fontaine.png"] .rin-world-test,
.restaurant-place-page .rin-world-test{
  left:56%;
  bottom:0;
  width:min(35.65vw,506px);
  height:min(105.8svh,1012px);
}
@media(max-width:640px){
  .cafe-page .rin-world-test,
  .place-page[style*="Parc%20avec%20banc"] .rin-world-test,
  .place-page[style*="Fontaine.png"] .rin-world-test,
  .restaurant-place-page .rin-world-test{
    left:57%;
    bottom:0;
    width:66.7vw;
    height:89.7svh;
  }
}


/* Scale refinement: +8% instead of +15% on rebuilt scenes; pier unchanged. */
.cafe-page .rin-world-test,
.place-page[style*="Parc%20avec%20banc"] .rin-world-test,
.place-page[style*="Fontaine.png"] .rin-world-test,
.restaurant-place-page .rin-world-test{
  width:min(33.48vw,475px);
  height:min(99.36svh,950px);
}
@media(max-width:640px){
  .cafe-page .rin-world-test,
  .place-page[style*="Parc%20avec%20banc"] .rin-world-test,
  .place-page[style*="Fontaine.png"] .rin-world-test,
  .restaurant-place-page .rin-world-test{
    width:62.64vw;
    height:84.24svh;
  }
}


/* Scale refinement: +5% test on rebuilt scenes; pier unchanged. */
.cafe-page .rin-world-test,
.place-page[style*="Parc%20avec%20banc"] .rin-world-test,
.place-page[style*="Fontaine.png"] .rin-world-test,
.restaurant-place-page .rin-world-test{
  width:min(32.55vw,462px);
  height:min(96.6svh,924px);
}
@media(max-width:640px){
  .cafe-page .rin-world-test,
  .place-page[style*="Parc%20avec%20banc"] .rin-world-test,
  .place-page[style*="Fontaine.png"] .rin-world-test,
  .restaurant-place-page .rin-world-test{
    width:60.9vw;
    height:81.9svh;
  }
}


/* Scene-specific scale refinement: park and fountain +3%.
   Cafe and restaurant stay at +5%; pier stays unchanged. */
.place-page[style*="Parc%20avec%20banc"] .rin-world-test,
.place-page[style*="Fontaine.png"] .rin-world-test{
  width:min(31.93vw,453px);
  height:min(94.76svh,906px);
}
@media(max-width:640px){
  .place-page[style*="Parc%20avec%20banc"] .rin-world-test,
  .place-page[style*="Fontaine.png"] .rin-world-test{
    width:59.74vw;
    height:80.34svh;
  }
}


/* Ambient light pass: subtly blend outdoor Rin into the warm sunset scenes.
   Kept on the image itself so position/scale remain untouched and this can later
   become the basis for day/night lighting states. */
.cafe-page .rin-world-test img,
.place-page .rin-world-test img,
.restaurant-place-page .rin-world-test img{
  filter: sepia(.10) saturate(.95) brightness(.95) hue-rotate(-4deg);
}


/* Warm ambient light for Rin on the private-home terrace too. */
.bubble-home .rin-world-test img{
  filter: sepia(.10) saturate(.95) brightness(.95) hue-rotate(-4deg);
}


/* Half-body presence system: characters use a consistent visual-novel framing.
   Idle sprites look away until approached; interaction sprites can later swap in-place. */
.cafe-page .rin-world-test,
.place-page .rin-world-test,
.restaurant-place-page .rin-world-test{
  left:50%;
  bottom:0;
  width:min(31vw,440px);
  height:min(67svh,650px);
}
@media(max-width:640px){
  .cafe-page .rin-world-test,
  .place-page .rin-world-test,
  .restaurant-place-page .rin-world-test{
    left:50%;
    bottom:0;
    width:62vw;
    height:55svh;
  }
}


/* Mobile half-body refinement: keep Rin visually behind the location card,
   and enlarge the portrait by 2% without changing desktop framing. */
@media(max-width:640px){
  .cafe-page .rin-world-test,
  .place-page .rin-world-test,
  .restaurant-place-page .rin-world-test{
    z-index:2;
    width:63.24vw;
    height:56.1svh;
  }
  .cafe-page .place-main,
  .place-page .place-main,
  .restaurant-place-page .place-main{
    z-index:7;
  }
}


/* Mobile Home refinement: bring Rin out of Minimoys mode.
   Home/terrace only; public locations remain untouched. */
@media(max-width:640px){
  .bubble-home .rin-world-test{
    width:min(39vw,533px);
    height:min(101.4svh,1027px);
  }
}


/* Presence refinement:
   - tablet/desktop cafe + restaurant: +3% and a slight shift right
   - mobile Home/terrace: larger portrait
   - mobile public-location idle Rin belongs to the scrolling world, not the viewport */
@media(min-width:641px){
  .cafe-page .rin-world-test,
  .restaurant-place-page .rin-world-test{
    left:52%;
    width:min(31.93vw,453px);
    height:min(69.01svh,670px);
  }
}
@media(max-width:640px){
  .bubble-home .rin-world-test{
    width:min(50vw,683px);
    height:min(115svh,1165px);
  }

  .place-page .rin-world-test{
    position:absolute;
  }
}


/* Mobile Home presence V2: larger Rin, while room controls keep touch priority. */
@media(max-width:640px){
  .bubble-home .rin-world-test{
    width:min(57.5vw,785px);
    height:min(132.25svh,1340px);
    z-index:3;
  }
  .bubble-home .bubble-hotspots{
    z-index:7;
  }
  .bubble-home .bubble-top,
  .bubble-home .scene-controls{
    z-index:8;
  }
}


/* Mobile visual-novel framing V1:
   the location card becomes a straight bottom panel and the idle half-body
   portrait terminates exactly at the panel's top edge. */
@media(max-width:640px){
  .place-page .place-main{
    align-items:flex-end;
    justify-content:stretch;
    padding:0;
  }
  .place-page .place-card{
    --mobile-location-card-h:240px;
    width:100vw;
    min-height:var(--mobile-location-card-h);
    margin:0;
    padding:19px 24px max(19px,calc(env(safe-area-inset-bottom) + 14px));
    border-left:0;
    border-right:0;
    border-bottom:0;
    border-radius:0;
    display:flex;
    flex-direction:column;
    justify-content:center;
    position:relative;
    z-index:7;
  }
  .place-page .rin-world-test{
    bottom:240px;
    z-index:6;
  }
}


/* Mobile location panel micro-adjustment: slightly lower/shorter,
   keeping the idle portrait aligned to its top edge. */
@media(max-width:640px){
  .place-page .place-card{
    --mobile-location-card-h:220px;
    min-height:var(--mobile-location-card-h);
  }
  .place-page .rin-world-test{
    bottom:220px;
  }
}


/* Mobile location panel: requested final 20px lower adjustment. */
@media(max-width:640px){
  .place-page .place-card{
    --mobile-location-card-h:200px;
    min-height:var(--mobile-location-card-h);
  }
  .place-page .rin-world-test{
    bottom:200px;
  }
}


/* Mobile location panel: about 20% shorter than the previous 170px frame.
   Keep every idle character portrait aligned to the panel edge. */
@media(max-width:640px){
  .place-page .place-card{
    --mobile-location-card-h:136px;
    min-height:var(--mobile-location-card-h);
  }
  .place-page .rin-world-test{
    bottom:136px;
  }
}


/* Mobile idle portrait alignment by sprite.
   The side-facing sprite already aligns visually; the back 3/4 sprite has
   more transparent canvas below the body, so compensate to match the same
   visible cut line at the top of the text panel. */
@media(max-width:640px){
  .place-page[style*="Parc%20avec%20banc"] .rin-world-test,
  .place-page[style*="Embarcad"] .rin-world-test{
    bottom:61px;
  }
  .cafe-page .rin-world-test,
  .place-page[style*="Fontaine.png"] .rin-world-test,
  .restaurant-place-page .rin-world-test{
    bottom:136px;
  }
}


/* Park only: the back 3/4 sprite still ended above the panel.
   Lower the sprite until its visible bottom meets the 170px panel edge.
   Pier remains unchanged. */
@media(max-width:640px){
  .place-page[style*="Parc%20avec%20banc"] .rin-world-test{
    bottom:20px;
  }
}


/* Dialogue invariant:
   whenever a character enters dialogue mode, the visible portrait is anchored
   to the top edge of the text panel. Future dialogue states should keep this
   class instead of positioning portraits independently. */
@media(max-width:640px){
  .place-page .rin-world-test.is-dialogue,
  .place-page .character-presence.is-dialogue{
    bottom:136px;
    z-index:6;
  }
}


/* Park mobile baseline correction only:
   preserve the existing sprite scale and move its canvas so the visible body
   meets the 136px location panel edge, matching the cafe composition. */
@media(max-width:640px){
  .place-page[style*="Parc%20avec%20banc"] .rin-world-test{
    bottom:61px;
  }
}

/* Desktop presence refinement: resize from the existing bottom anchor.
   Keep tablet and phone framing unchanged. */
@media(min-width:1181px){
  .cafe-page .rin-world-test,
  .restaurant-place-page .rin-world-test{
    transform-origin:center bottom;
    scale:1.1576;
  }
  .place-page[style*="Parc%20avec%20banc"] .rin-world-test,
  .place-page[style*="Fontaine.png"] .rin-world-test{
    transform-origin:center bottom;
    scale:.9124;
  }
}


/* Presence engine V1: interaction menu layered above the scene. */
.rin-presence[hidden]{display:none!important}
.rin-action-panel{position:fixed;z-index:20;left:50%;bottom:28px;transform:translateX(-50%);width:min(560px,calc(100vw - 32px));box-sizing:border-box;padding:16px;border:1px solid #ffffff2b;border-radius:22px;background:#17131feF;box-shadow:0 22px 70px #0008;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);color:#fff}
.rin-action-panel[hidden]{display:none}
.rin-action-title{font-weight:800;font-size:1.05rem;margin-bottom:4px}.rin-action-status{color:#d9cee3;min-height:1.4em;margin-bottom:12px;font-size:.92rem}
.rin-action-menu{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.rin-action-menu button,.rin-game-menu button,.rin-game-menu a{box-sizing:border-box;border:1px solid #ffffff24;background:#ffffff0d;color:#fff;border-radius:14px;padding:11px 13px;text-decoration:none;text-align:left;cursor:pointer;font:inherit}
.rin-action-menu button:hover,.rin-game-menu button:hover,.rin-game-menu a:hover{background:#ffffff18}.rin-game-menu{display:grid;grid-template-columns:1fr 1fr;gap:8px}.rin-game-menu p{grid-column:1/-1;margin:0 0 4px;color:#d9cee3}.rin-game-menu[hidden]{display:none}
@media(max-width:640px){.rin-action-panel{bottom:max(12px,env(safe-area-inset-bottom));width:calc(100vw - 20px);padding:12px;border-radius:18px}.rin-action-menu{grid-template-columns:1fr 1fr;gap:6px}.rin-action-menu button,.rin-game-menu button,.rin-game-menu a{padding:10px;font-size:.9rem}}

/* Persistent shell reserves the top-right HUD slot. */
@media(min-width:721px){
  html.hu-inside-shell .world-identity{
    position:fixed;
    top:max(82px,calc(env(safe-area-inset-top) + 82px));
    right:clamp(18px,3vw,42px);
    margin-left:0;
    z-index:7;
  }
}

/* Shell HUD owns top-right; move identity and exit underneath it. */
@media(min-width:721px){
  body.hu-inside-shell .world-topbar{padding-right:clamp(18px,3vw,42px)}
  body.hu-inside-shell .world-identity{
    position:fixed!important;
    top:82px!important;
    right:clamp(18px,3vw,42px)!important;
    left:auto!important;
    margin:0!important;
  }
  body.hu-inside-shell .world-exit{
    position:fixed!important;
    top:122px!important;
    right:clamp(18px,3vw,42px)!important;
  }
}

/* Align shell-side account controls to the phone button centerline. */
@media(min-width:721px){
  body.hu-inside-shell .world-identity,
  body.hu-inside-shell .world-exit{
    right:18px!important;
    width:82px!important;
    box-sizing:border-box!important;
    justify-content:center!important;
    text-align:center!important;
    padding-left:8px!important;
    padding-right:8px!important;
  }
  body.hu-inside-shell .world-identity{top:96px!important}
  body.hu-inside-shell .world-exit{top:138px!important}
}

/* Auth navigation: same glass language on desktop, tablet and phone */
.auth-tabs{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
  margin:18px 0 20px;
  padding:5px;
  border:1px solid rgba(255,245,232,.12);
  border-radius:16px;
  background:rgba(10,8,15,.22);
}
.auth-tabs button{
  min-width:0;
  min-height:46px;
  padding:9px 12px;
  border:1px solid transparent;
  border-radius:12px;
  background:transparent;
  color:rgba(244,236,223,.68);
  cursor:pointer;
  line-height:1.15;
  transition:background 160ms ease,border-color 160ms ease,color 160ms ease,box-shadow 160ms ease;
}
.auth-tabs button:hover{
  background:rgba(255,255,255,.06);
  color:var(--ink);
}
.auth-tabs button.active{
  outline:0;
  border-color:rgba(255,245,232,.26);
  background:rgba(255,255,255,.10);
  color:var(--ink);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 6px 18px rgba(0,0,0,.12);
}
@media(max-width:520px){
  .auth-tabs{gap:5px;padding:4px}
  .auth-tabs button{padding:8px 6px;font-size:.82rem}
}
/* Hiko Universe city reference panorama */
.world-entrance-scene{background-image:url('/assets/Hiko%20Universe%20city.png')}

/* City title card over the brighter Hiko Universe panorama */
.world-welcome{
  margin-top:clamp(62px,7vh,88px);
  padding:18px 30px 20px;
  border:1px solid rgba(255,255,255,.48);
  border-radius:20px;
  background:rgba(255,255,255,.10);
  box-shadow:0 12px 38px rgba(24,10,32,.18),inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter:blur(9px);
  -webkit-backdrop-filter:blur(9px);
}
@media(max-width:720px){.world-welcome{margin-top:72px;padding:13px 18px;border-radius:16px}}

/* City welcome spacing refinement */
.world-welcome{margin-top:clamp(86px,10vh,118px)}
@media(max-width:720px){.world-welcome{margin-top:82px}}

/* Restore account controls beneath the shell phone HUD. */
@media(min-width:721px){
  body.hu-inside-shell .world-identity,
  body.hu-inside-shell .world-exit{
    position:fixed!important;
    right:18px!important;
    left:auto!important;
    width:82px!important;
    margin:0!important;
    box-sizing:border-box!important;
    justify-content:center!important;
    text-align:center!important;
  }
  body.hu-inside-shell .world-identity{top:78px!important}
  body.hu-inside-shell .world-exit{top:118px!important}
}

/* HU typography system */
html,body,button,input,textarea,select{font-family:"Libertinus Serif", "Linux Libertine", Georgia, serif!important}h1,h2,h3,h4,h5,h6,p,a,span,strong,small,label{font-family:"Libertinus Serif", "Linux Libertine", Georgia, serif!important}


/* City navigation V2: hubs use a bottom destination menu; walking routes keep arrows. */
.world-entrance-page .world-entrance-scene{background-image:var(--hub-image,url('/assets/Panorama%20urbain%20en%20lumi%C3%A8re%20naturelle.png'))}
.place-destination-menu{
 position:fixed;z-index:12;left:50%;bottom:max(22px,env(safe-area-inset-bottom));transform:translateX(-50%);
 display:flex;gap:10px;width:min(680px,calc(100vw - 32px));padding:10px;
 border:1px solid rgba(255,255,255,.34);border-radius:20px;background:rgba(255,255,255,.11);
 box-shadow:0 14px 42px rgba(0,0,0,.18);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)
}
.place-destination-menu a{
 flex:1;min-width:0;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:10px;align-items:center;
 padding:11px 14px;border:1px solid color-mix(in srgb,var(--accent,#efe0cc) 60%,transparent);border-radius:14px;
 background:rgba(20,20,24,.68);color:inherit;text-decoration:none
}
.place-destination-menu a>span{grid-row:1/3;font-size:1.25rem}.place-destination-menu strong{font-size:.92rem}.place-destination-menu small{opacity:.68;font-size:.72rem}
.place-destination-menu a:hover,.place-destination-menu a:focus-visible{background:color-mix(in srgb,var(--accent,#efe0cc) 18%,rgba(20,20,24,.72));outline:none}
@media(max-width:640px){
 .place-destination-menu{bottom:max(10px,env(safe-area-inset-bottom));gap:6px;padding:7px;border-radius:16px}
 .place-destination-menu a{padding:9px 8px;column-gap:6px}.place-destination-menu a>span{font-size:1.05rem}.place-destination-menu strong{font-size:.78rem}.place-destination-menu small{display:none}
 .commercial-place-page .place-card{padding-bottom:74px}
}


/* City hub menu refinement: quiet glass signage, no app-button styling. */
.place-destination-menu{
 width:min(620px,calc(100vw - 40px));padding:0 14px;gap:0;
 border-color:rgba(255,255,255,.32);border-radius:16px;background:rgba(30,30,32,.42);
}
.place-destination-menu a{
 position:relative;display:flex;flex-direction:column;justify-content:center;gap:3px;min-height:62px;
 padding:9px 20px;border:0;border-radius:0;background:transparent;text-align:center;
}
.place-destination-menu a+a::before{
 content:"";position:absolute;left:0;top:15px;bottom:15px;width:1px;background:rgba(255,255,255,.20);
}
.place-destination-menu a>span{display:none}
.place-destination-menu strong{font-weight:400;font-size:.96rem;letter-spacing:.015em}
.place-destination-menu small{font-weight:400;font-size:.72rem;opacity:.58}
.place-destination-menu a:hover,.place-destination-menu a:focus-visible{
 background:color-mix(in srgb,var(--accent,#efe0cc) 11%,transparent);box-shadow:none
}
@media(max-width:640px){
 .place-destination-menu{width:calc(100vw - 24px);padding:0 6px}
 .place-destination-menu a{min-height:52px;padding:8px 6px}
 .place-destination-menu strong{font-size:.78rem}
 .place-destination-menu small{display:none}
}

/* HU global typography */
html,body,button,input,textarea,select{font-family:"Libertinus Serif","Linux Libertine",Georgia,serif!important}h1,h2,h3,h4,h5,h6,p,a,span,strong,small,label,b{font-family:"Libertinus Serif","Linux Libertine",Georgia,serif!important}


/* City place layout + readable theme contrast */
.commercial-place-page .place-main{padding-bottom:122px}
.commercial-place-page .place-card{margin-bottom:0}
.commercial-place-page .place-destination-menu{bottom:max(22px,env(safe-area-inset-bottom))}
html[data-hu-theme="dark"] .place-card{color:#f6f2ec!important;background:rgba(27,28,31,.88)!important}
html[data-hu-theme="dark"] .place-card>p:last-of-type{color:rgba(246,242,236,.80)!important}
html[data-hu-theme="light"] .place-card{color:#29272a!important;background:rgba(250,250,248,.94)!important}
html[data-hu-theme="light"] .place-card>p:last-of-type{color:#57545a!important;opacity:1!important}
html[data-hu-theme="light"] .place-card .eyebrow{color:#69656d!important}
html[data-hu-theme="light"] .place-destination-menu{background:rgba(250,250,248,.86)!important;border-color:rgba(45,45,48,.16)!important;color:#29272a!important}
html[data-hu-theme="light"] .place-destination-menu a{color:#29272a!important}
html[data-hu-theme="light"] .place-destination-menu a+a::before{background:rgba(45,45,48,.18)!important}
@media(max-width:640px){
 .commercial-place-page .place-main{padding-bottom:72px}
 .commercial-place-page .place-card{padding-bottom:24px}
}


/* Shell HUD spacing: identity + exit sit below phone and language controls. */
@media(min-width:721px){
 body.hu-inside-shell .world-identity{top:174px!important}
 body.hu-inside-shell .world-exit{top:216px!important}
}
@media(max-width:720px){
 body.hu-inside-shell .world-identity{top:160px!important}
 body.hu-inside-shell .world-exit{top:202px!important}
}


/* Horizontal exploration for city scenery */
.hu-pannable-scene{cursor:grab;will-change:background-position;touch-action:pan-y}
body:has(.hu-pannable-scene):active .hu-pannable-scene{cursor:grabbing}


/* Pannable scenery V2: guarantee real horizontal overflow on every viewport. */
.place-page .place-scene,
.world-entrance-page .world-entrance-scene{
 position:fixed!important;
 top:0!important;left:0!important;right:auto!important;bottom:auto!important;
 width:max(125vw,150svh)!important;height:100svh!important;
 background-size:cover!important;background-position:center center!important;
 transform:translate3d(-12.5vw,0,0);
 transition:none!important;
}
.hu-pannable-scene{cursor:grab;will-change:transform;touch-action:pan-y;user-select:none}
body:has(.hu-pannable-scene):active .hu-pannable-scene{cursor:grabbing}


/* Café terrace hotspot: anchored over the bay-side exit. */
.cafe-terrace-hotspot{
 position:fixed;z-index:9;left:88%;top:58%;transform:translate(-50%,-50%);
 display:grid;place-items:center;gap:7px;color:#fff;text-decoration:none;
 filter:drop-shadow(0 3px 9px rgba(0,0,0,.5))
}
.cafe-terrace-hotspot>span{
 width:18px;height:18px;border-radius:50%;background:#fff;
 border:2px solid rgba(255,255,255,.72);box-shadow:0 0 0 5px rgba(255,255,255,.18),0 2px 10px rgba(0,0,0,.35);
 transition:transform .16s ease,box-shadow .16s ease
}
.cafe-terrace-hotspot small{
 opacity:0;padding:5px 9px;border-radius:10px;background:rgba(25,25,27,.72);
 font-size:.72rem;font-weight:400;transition:opacity .16s ease
}
.cafe-terrace-hotspot:hover>span,.cafe-terrace-hotspot:focus-visible>span{transform:scale(1.18);box-shadow:0 0 0 7px rgba(255,255,255,.2),0 2px 12px rgba(0,0,0,.4)}
.cafe-terrace-hotspot:hover small,.cafe-terrace-hotspot:focus-visible small{opacity:1}
.cafe-terrace-hotspot:focus-visible{outline:none}
@media(max-width:640px){.cafe-terrace-hotspot{left:86%;top:57%}.cafe-terrace-hotspot>span{width:16px;height:16px}}


/* City hub second row: community + games */
.world-entrance-page .hub-destination-menu{bottom:max(84px,calc(env(safe-area-inset-bottom) + 84px))}
.world-entrance-page .hub-secondary-menu{bottom:max(22px,env(safe-area-inset-bottom));width:min(410px,calc(100vw - 40px))}
.world-entrance-page .hub-secondary-menu a{min-height:50px}
@media(max-width:640px){
 .world-entrance-page .hub-destination-menu{bottom:max(70px,calc(env(safe-area-inset-bottom) + 70px))}
 .world-entrance-page .hub-secondary-menu{bottom:max(10px,env(safe-area-inset-bottom));width:min(330px,calc(100vw - 24px))}
 .world-entrance-page .hub-secondary-menu a{min-height:46px}
}


/* Home visual system V2: neutral anthracite surfaces, selected accent only for interaction. */
.bubble-home,.journal-page{background:#18191b!important}
.bubble-shade{background:linear-gradient(180deg,rgba(15,16,18,.30),transparent 28%,transparent 70%,rgba(15,16,18,.25))!important}
.bubble-pill,.hotspot,.bubble-toast{
 background:rgba(30,31,34,.72)!important;
 border-color:rgba(255,255,255,.20)!important;
 color:#f6f4f0!important;
}
.bubble-pill:hover,.bubble-pill:focus-visible,
.hotspot:hover,.hotspot:focus-visible{
 background:color-mix(in srgb,var(--accent,#efe0cc) 13%,rgba(30,31,34,.86))!important;
 border-color:color-mix(in srgb,var(--accent,#efe0cc) 52%,rgba(255,255,255,.18))!important;
 outline:none;
}
.hotspot small{color:rgba(246,244,240,.66)!important}
.invite-backdrop,.editor-backdrop{background:rgba(12,13,15,.62)!important}
.invite-sheet section,.home-picker>section{
 background:rgba(28,29,32,.96)!important;
 border-color:rgba(255,255,255,.15)!important;
 color:#f6f4f0!important;
}
.invite-list button,.home-choice{
 background:rgba(255,255,255,.035)!important;
 border-color:rgba(255,255,255,.13)!important;
 color:#f6f4f0!important;
}
.invite-list button:hover,.invite-list button:focus-visible,
.home-choice:hover,.home-choice:focus-visible{
 background:color-mix(in srgb,var(--accent,#efe0cc) 12%,rgba(255,255,255,.035))!important;
 border-color:color-mix(in srgb,var(--accent,#efe0cc) 50%,rgba(255,255,255,.14))!important;
 outline:none;
}
.journal-back{background:rgba(30,31,34,.76)!important;border-color:rgba(255,255,255,.20)!important}

/* Legacy/simple Home pages */
.home-page{background:#18191b!important;color:#f6f4f0!important}
.home-card{background:rgba(28,29,32,.94)!important;border-color:rgba(255,255,255,.15)!important}
.home-actions button,.home-actions a{
 background:rgba(255,255,255,.035)!important;
 border-color:rgba(255,255,255,.13)!important;
 color:#f6f4f0!important;
}
.home-actions a:hover,.home-actions a:focus-visible{
 background:color-mix(in srgb,var(--accent,#efe0cc) 12%,rgba(255,255,255,.035))!important;
 border-color:color-mix(in srgb,var(--accent,#efe0cc) 50%,rgba(255,255,255,.14))!important;
 outline:none;
}
html[data-hu-theme="light"] .bubble-pill,
html[data-hu-theme="light"] .hotspot,
html[data-hu-theme="light"] .bubble-toast,
html[data-hu-theme="light"] .invite-sheet section,
html[data-hu-theme="light"] .home-picker>section,
html[data-hu-theme="light"] .home-card{
 background:rgba(248,248,246,.92)!important;color:#292a2d!important;border-color:rgba(35,36,39,.16)!important;
}
html[data-hu-theme="light"] .hotspot small{color:rgba(41,42,45,.66)!important}
html[data-hu-theme="light"] .invite-list button,
html[data-hu-theme="light"] .home-choice,
html[data-hu-theme="light"] .home-actions button,
html[data-hu-theme="light"] .home-actions a{
 background:rgba(35,36,39,.035)!important;color:#292a2d!important;border-color:rgba(35,36,39,.14)!important;
}


/* Neutral pre-paint backgrounds: prevent legacy violet flashes before scenery loads. */
html,body,.login-page,.app-page,.world-entrance-page,.place-page,.bubble-home,.journal-page{background-color:#18191b!important}
html[data-hu-theme="light"] body,
html[data-hu-theme="light"] .login-page,
html[data-hu-theme="light"] .app-page,
html[data-hu-theme="light"] .world-entrance-page,
html[data-hu-theme="light"] .place-page,
html[data-hu-theme="light"] .bubble-home,
html[data-hu-theme="light"] .journal-page{background-color:#f3f3f1!important}


/* Rin interaction submenus */
.rin-destination-menu{
 display:grid;
 grid-template-columns:repeat(2,minmax(0,1fr));
 gap:8px;
}
.rin-destination-menu[hidden]{display:none}
.rin-destination-menu p{
 grid-column:1/-1;
 margin:2px 0 6px;
 color:rgba(246,244,240,.72);
 font-size:.88rem;
}
.rin-destination-menu button{
 box-sizing:border-box;
 min-height:48px;
 border:1px solid rgba(255,255,255,.14);
 border-radius:14px;
 background:rgba(255,255,255,.035);
 color:#f6f4f0;
 padding:11px 14px;
 text-align:left;
 cursor:pointer;
 font:inherit;
 font-weight:400;
}
.rin-destination-menu button:hover,
.rin-destination-menu button:focus-visible{
 background:color-mix(in srgb,var(--accent,#efe0cc) 12%,rgba(255,255,255,.035));
 border-color:color-mix(in srgb,var(--accent,#efe0cc) 48%,rgba(255,255,255,.14));
 outline:none;
}
.rin-destination-menu button[data-rin-action="back"]{
 grid-column:1/-1;
 min-height:42px;
 text-align:center;
 color:rgba(246,244,240,.72);
 background:transparent;
}
html[data-hu-theme="light"] .rin-destination-menu p{color:rgba(41,42,45,.68)}
html[data-hu-theme="light"] .rin-destination-menu button{
 color:#292a2d;
 background:rgba(35,36,39,.035);
 border-color:rgba(35,36,39,.14);
}
@media(max-width:640px){
 .rin-destination-menu{grid-template-columns:1fr 1fr;gap:6px}
 .rin-destination-menu button{min-height:44px;padding:10px 11px;font-size:.9rem}
}

/* Rin panel neutral palette + strict submenu visibility */
.rin-action-panel{
 background:rgba(27,28,31,.96)!important;
 border-color:rgba(255,255,255,.16)!important;
 color:#f6f4f0!important;
}
.rin-action-status,.rin-game-menu p,.rin-destination-menu p{
 color:rgba(246,244,240,.72)!important;
}
.rin-action-menu button,.rin-game-menu button,.rin-game-menu a,.rin-destination-menu button{
 background:rgba(255,255,255,.035)!important;
 border-color:rgba(255,255,255,.15)!important;
 color:#f6f4f0!important;
}
.rin-action-menu button:hover,.rin-action-menu button:focus-visible,
.rin-game-menu button:hover,.rin-game-menu button:focus-visible,.rin-game-menu a:hover,.rin-game-menu a:focus-visible,
.rin-destination-menu button:hover,.rin-destination-menu button:focus-visible{
 background:color-mix(in srgb,var(--accent,#efe0cc) 12%,rgba(255,255,255,.035))!important;
 border-color:color-mix(in srgb,var(--accent,#efe0cc) 48%,rgba(255,255,255,.15))!important;
 outline:none;
}
.rin-game-menu[hidden],.rin-destination-menu[hidden],.rin-action-menu[hidden]{display:none!important}


/* Rin panel V2: exclusive submenus + neutral palette */
.rin-action-panel{
 background:rgba(28,29,32,.96)!important;
 border-color:rgba(255,255,255,.16)!important;
 color:#f6f4f0!important;
}
.rin-action-status{
 color:rgba(246,244,240,.72)!important;
}
.rin-game-menu[hidden],
.rin-destination-menu[hidden]{
 display:none!important;
}
.rin-game-menu p,
.rin-destination-menu p{
 color:rgba(246,244,240,.72)!important;
}
.rin-action-menu button,
.rin-game-menu button,
.rin-game-menu a,
.rin-destination-menu button{
 background:rgba(255,255,255,.035)!important;
 border-color:rgba(255,255,255,.14)!important;
 color:#f6f4f0!important;
}
.rin-action-menu button:hover,.rin-action-menu button:focus-visible,
.rin-game-menu button:hover,.rin-game-menu button:focus-visible,
.rin-game-menu a:hover,.rin-game-menu a:focus-visible,
.rin-destination-menu button:hover,.rin-destination-menu button:focus-visible{
 background:color-mix(in srgb,var(--accent,#efe0cc) 12%,rgba(255,255,255,.035))!important;
 border-color:color-mix(in srgb,var(--accent,#efe0cc) 48%,rgba(255,255,255,.14))!important;
 outline:none;
}
html[data-hu-theme="light"] .rin-action-panel{
 background:rgba(248,248,246,.96)!important;color:#292a2d!important;border-color:rgba(35,36,39,.16)!important;
}
html[data-hu-theme="light"] .rin-action-status,
html[data-hu-theme="light"] .rin-game-menu p,
html[data-hu-theme="light"] .rin-destination-menu p{color:rgba(41,42,45,.68)!important}
html[data-hu-theme="light"] .rin-action-menu button,
html[data-hu-theme="light"] .rin-game-menu button,
html[data-hu-theme="light"] .rin-game-menu a,
html[data-hu-theme="light"] .rin-destination-menu button{
 background:rgba(35,36,39,.035)!important;color:#292a2d!important;border-color:rgba(35,36,39,.14)!important;
}


/* Walking branch orientation: scenery follows Park ← Fountain ← Passage 1 ← City.
   Flip only the photographic scene; HUD, arrows and interactive UI stay untouched. */
body.hu-scene-mirror .place-scene{
 transform:translate3d(-12.5vw,0,0) scaleX(-1);
}

/* City hub: unclutter the mobile header without affecting desktop or other places. */
@media (max-width: 720px) {
  .world-entrance-page #home-button {
    width: 44px;
    min-width: 44px;
    height: 44px;
    min-height: 44px;
    padding: 0;
    display: grid;
    place-items: center;
    gap: 0;
    border: 0 !important;
    border-radius: 0;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
  .world-entrance-page #home-button .world-home-label { display: none; }
  .world-entrance-page #home-button > span:first-child { font-size: 1.5rem; line-height: 1; }
  .world-entrance-page #home-button:hover { background: transparent !important; }
  .world-entrance-page .world-welcome { margin-top: 130px; }
}

/* City mobile header: the former pill behind the player is the logout control. */
@media (max-width: 720px) {
  .world-entrance-page .world-topbar {
    padding-left: 14px;
    padding-right: 14px;
  }
  .world-entrance-page #logout {
    position: fixed !important;
    top: 130px !important;
    left: auto !important;
    right: 10px !important;
    margin: 0 !important;
    width: 48px !important;
    min-height: 32px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    text-align: center;
  }
}

/* Mobile Marie Home: Rin +12%, retain bottom anchor and native tap target. */
@media (max-width: 640px) {
  .bubble-home .rin-bubble {
    width: 62.72vw;
    height: 73.92svh;
    bottom: 0;
  }
}

/* New Notice board event: small indicator over the existing City link. */
.world-entrance-page .hub-secondary-menu #notice-board-link{position:relative}
.world-entrance-page .hub-secondary-menu #notice-board-link>.board-unread-dot{
 position:absolute;top:8px;right:13px;z-index:2;display:block;
 width:9px;height:9px;min-width:9px;min-height:9px;padding:0;
 border:1px solid rgba(255,255,255,.8);border-radius:50%;
 background:var(--hu-accent,#efe0cc);
 box-shadow:0 0 0 3px rgba(0,0,0,.18),0 0 9px rgba(255,255,255,.35);
 pointer-events:none;
}
.world-entrance-page .hub-secondary-menu #notice-board-link>.board-unread-dot[hidden]{display:none!important}


/* Hiko: independent world encounter, without changing Rin's placement. */
.hiko-world-presence{
  position:fixed;
  z-index:6;
  left:46%;
  right:auto;
  bottom:0;
  width:min(23vw,330px);
  height:min(78svh,760px);
  transform:translateX(-50%);
}
.hiko-world-presence img{object-fit:contain;object-position:center bottom}
.hiko-world-presence:hover,.hiko-world-presence:focus-visible{
  transform:translateX(-50%) translateY(-3px);
}
.hiko-world-presence.is-dialogue{z-index:8}
.hiko-action-panel{z-index:22}
@media(max-width:640px){
  .hiko-world-presence{left:48%;width:45vw;height:67svh}
  .hiko-world-presence:hover,.hiko-world-presence:focus-visible{
    transform:translateX(-50%) translateY(-3px);
  }
}


/* Desktop/tablet composition: fixed public-scene positions, identical solo/duet alignment. */
@media(min-width:641px){
  .place-page .hiko-world-presence{
    left:38%!important;
  }
  .place-page:has(.rin-world-test:not([hidden])) .hiko-world-presence{
    left:38%!important;
  }
  .place-page .rin-world-test{
    left:38%!important;
    right:auto!important;
    width:36.6324vw!important;
    height:80.3698svh!important;
    transform:translateX(-50%)!important;
  }
  .place-page:has(.hiko-world-presence:not([hidden])) .rin-world-test{
    left:38%!important;
    right:auto!important;
    width:37.73vw!important;
    height:82.7806svh!important;
    transform:translateX(-50%)!important;
  }
}

/* Resident sleep and private dream reveal. */
.hu-sleep-overlay[hidden]{display:none!important}
.hu-sleep-overlay{position:fixed;inset:0;z-index:1200;display:grid;place-items:center;padding:20px;background:rgba(15,16,19,.96);color:#eee;overflow:auto;font-family:Inter,system-ui,sans-serif}
.hu-sleep-dialog{width:min(560px,100%);max-height:90vh;overflow:auto;text-align:center;padding:32px 24px;background:#242528;border:1px solid #ffffff30;border-radius:24px;box-shadow:0 20px 90px #0009}
.hu-sleep-stars{display:flex;align-items:center;justify-content:center;gap:10px;color:var(--hu-accent,#BE84A2);font-size:26px;letter-spacing:0}
.hu-sleep-stars span{display:block;animation:hu-star-wave 1.45s ease-in-out infinite}
.hu-sleep-stars span:nth-child(2){animation-delay:.18s}.hu-sleep-stars span:nth-child(3){animation-delay:.36s}
@keyframes hu-star-wave{0%,100%{opacity:.28;transform:translateY(1px) scale(.9)}50%{opacity:1;transform:translateY(-2px) scale(1.08)}}
@media(prefers-reduced-motion:reduce){.hu-sleep-stars span{animation:none;opacity:.8}}
.hu-sleep-dialog h2{font:400 1.8rem Georgia,serif;margin:20px 0}.hu-sleep-dialog p{line-height:1.7;white-space:pre-line;overflow-wrap:anywhere}
.hu-sleep-dialog button{margin-top:20px;padding:12px 24px;border:1px solid #ffffff50;border-radius:999px;background:#36373a;color:inherit;font:inherit;cursor:pointer}.hu-sleep-dialog button:disabled{opacity:.5}
@keyframes hu-sleep-pulse{50%{opacity:.35;transform:translateY(3px)}}
.bubble-hotspots .hs-bed,.bubble-hotspots .hs-sofa{z-index:3}

/* Rin's solo scene presence: larger without touching Hiko's canonical dimensions. */
.place-page .rin-world-test{width:min(33vw,470px);height:min(91svh,890px)}
@media(max-width:640px){.place-page .rin-world-test{width:58vw;height:78svh}}

/* Park: Rin and Hiko can meet without overlapping their interactive silhouettes. */
.place-page:has(.hiko-world-presence:not([hidden])) .rin-world-test{left:auto;right:0;width:min(35vw,500px);height:min(91svh,890px)}
@media(max-width:640px){.place-page:has(.hiko-world-presence:not([hidden])) .rin-world-test{right:0;width:52vw;height:76svh}}

/* Park composition: keep Hiko centered; move Rin's visible silhouette beside the bench. */
.place-page:has(.hiko-world-presence:not([hidden])) .rin-world-test{
  left:auto!important;right:3vw!important;bottom:0!important;
  width:35.23vw!important;max-width:none!important;height:77.3svh!important;
  transform:none!important;z-index:7;
}
.place-page:has(.hiko-world-presence:not([hidden])) .rin-world-test img{
  width:100%;height:100%;object-fit:contain;object-position:right bottom;
}
.place-page:has(.hiko-world-presence:not([hidden])) .rin-world-test:hover,
.place-page:has(.hiko-world-presence:not([hidden])) .rin-world-test:focus-visible{transform:translateY(-3px)!important}
@media(max-width:640px){
 .place-page:has(.hiko-world-presence:not([hidden])) .rin-world-test{
  right:1vw!important;width:47.95vw!important;height:70.45svh!important;
 }
}


/* Unified Rin scale in public scenes. The shared-scene variant shifts Rin left. */
.place-page .rin-world-test{
  left:61%!important;right:auto!important;bottom:0!important;
  width:37.38vw!important;height:82.01svh!important;max-width:none!important;
  transform:translateX(-50%)!important;scale:1!important;
}
.place-page .rin-world-test img{
  width:100%;height:100%;object-fit:contain;object-position:center bottom;
}
.place-page:has(.hiko-world-presence:not([hidden])) .rin-world-test{
  left:auto!important;right:14vw!important;transform:none!important;
  width:38.50vw!important;height:84.47svh!important;
}
@media(max-width:640px){
 .place-page .rin-world-test{
   left:61%!important;right:auto!important;width:50.87vw!important;height:74.74svh!important;
   transform:translateX(-50%)!important;scale:1!important;
 }
 .place-page:has(.hiko-world-presence:not([hidden])) .rin-world-test{
   left:auto!important;right:12vw!important;transform:none!important;
   width:52.40vw!important;height:76.98svh!important;
 }
}

/* Mobile-only duet composition: preserve the established desktop framing. */
@media(max-width:640px){
  .place-page .hiko-world-presence{
    left:39%!important;
    bottom:-5svh!important;
    /* Match the park's existing inline dimensions in every public location. */
    width:clamp(280px,31vw,440px)!important;
    height:min(85svh,860px)!important;
  }
  .place-page .rin-world-test{
    left:64%!important;
    bottom:5svh!important;
    width:51.89vw!important;
    height:76.23svh!important;
    right:auto!important;
    transform:translateX(-50%)!important;
  }
  .place-page:has(.hiko-world-presence:not([hidden])) .rin-world-test{
    left:auto!important;
    right:9vw!important;
    bottom:5svh!important;
    width:53.45vw!important;
    height:78.52svh!important;
    transform:none!important;
  }
}

/* Mobile: align Rin's visible lower body with Hiko, without resizing either. */
@media(max-width:640px){
 .place-page:has(.hiko-world-presence:not([hidden])) .rin-world-test{
   bottom:10svh!important;
 }
}

/* Mobile resident framing and independent touch repositioning. */
@media(max-width:640px){
 .place-page .rin-world-test{
   bottom:calc(5svh + 30px)!important;
   width:54.48vw!important;
   height:80.04svh!important;
   touch-action:none!important;
   user-select:none!important;
   -webkit-user-select:none!important;
 }
 .place-page:has(.hiko-world-presence:not([hidden])) .rin-world-test{
   bottom:calc(10svh + 30px)!important;
   width:56.12vw!important;
   height:82.45svh!important;
 }
 .place-page .hiko-world-presence{
   touch-action:none!important;
   user-select:none!important;
   -webkit-user-select:none!important;
 }
 .place-page .rin-world-test img,.place-page .hiko-world-presence img{
   pointer-events:none;
   -webkit-user-drag:none;
 }
}

/* Desktop duet perspective: Rin is visually in front of Hiko, including
   when Hiko is selected. Restrict this to their shared scene so solo and
   mobile layering remain untouched. No geometry is modified. */
@media(min-width:641px){
  .place-page:has(.hiko-world-presence:not([hidden])) .rin-world-test{
    z-index:10!important;
  }
  .place-page:has(.hiko-world-presence:not([hidden])) .hiko-world-presence,
  .place-page:has(.hiko-world-presence:not([hidden])) .hiko-world-presence.is-dialogue{
    z-index:6!important;
  }
}

/* Mobile navigation: stack City beneath its arrow so it no longer
   competes with the central music HUD. Desktop remains unchanged. */
@media(max-width:720px){
 .place-page .world-topbar{padding-left:14px!important}
 .place-page .world-home-link,
 .world-entrance-page .world-home-link{
  box-sizing:border-box;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:center!important;
  gap:0!important;
  width:64px!important;min-width:64px!important;
  min-height:62px!important;height:62px!important;
  padding:3px 4px!important;
  border-radius:18px!important;
  line-height:1.05!important;
  font-size:21px!important;
  text-decoration:none;
 }
 .place-page .world-home-link span,
 .world-entrance-page .world-home-link span{
  display:block!important;
  margin-top:2px!important;
  font-size:12px!important;
  line-height:1.1!important;
  text-decoration:none!important;
 }
}


/* Reserve the fourth desktop HUD slot for Admin on eligible accounts.
   Contextual identity and exit remain beneath it, with no displacement for residents. */
@media(min-width:721px){
 body.hu-inside-shell.hu-admin-column .world-identity{top:216px!important}
 body.hu-inside-shell.hu-admin-column .world-exit{top:258px!important}
}

/* Shell scene controls share the same 82px desktop lane as FR/EN and stickers. */
@media(min-width:721px){
 body.hu-inside-shell .world-identity,body.hu-inside-shell .world-exit{box-sizing:border-box!important;width:82px!important;min-width:82px!important;max-width:82px!important;right:18px!important;padding-left:5px!important;padding-right:5px!important}
}

/* Go out: visually match the Rules pill, never inherit the legacy plum hover. */
.world-exit,
html[data-hu-theme] body .world-exit{
 background:rgba(255,255,255,.20)!important;
 color:#fff!important;
 border-color:rgba(255,255,255,.18)!important;
}
.world-exit:hover,.world-exit:focus-visible,
html[data-hu-theme] body .world-exit:hover,
html[data-hu-theme] body .world-exit:focus-visible{
 background:rgba(255,255,255,.28)!important;
 color:#fff!important;
 border-color:rgba(255,255,255,.45)!important;
}


/* FINAL desktop/tablet public character positioning.
   Hiko follows Rin's responsive viewport sizing model, with one fixed +10% scale.
   Must stay after legacy presence rules so older !important declarations cannot win. */
@media(min-width:641px){
  .place-page .hiko-world-presence,
  .place-page:has(.rin-world-test:not([hidden])) .hiko-world-presence{
    left:38%!important;
    right:auto!important;
    width:23vw!important;
    height:78svh!important;
    max-width:none!important;
    transform-origin:center bottom!important;
    scale:1.10!important;
  }

  .place-page .rin-world-test,
  .place-page:has(.hiko-world-presence:not([hidden])) .rin-world-test{
    left:42%!important;
    right:auto!important;
    transform:translateX(-50%)!important;
  }
}


/* Café menu v1: paper-style single-choice ordering panel. */
.cafe-menu-open{
  margin-top:14px;padding:10px 22px;border:1px solid rgba(255,255,255,.28);
  border-radius:999px;background:rgba(255,255,255,.20);color:#fff;
  font:600 14px Inter,system-ui,sans-serif;cursor:pointer;backdrop-filter:blur(8px)
}
.cafe-menu-open:hover,.cafe-menu-open:focus-visible{background:rgba(255,255,255,.28);border-color:rgba(255,255,255,.48)}
.cafe-menu-sheet[hidden]{display:none!important}
.cafe-menu-sheet{position:fixed;inset:0;z-index:1100;display:grid;place-items:center;padding:18px;font-family:Inter,system-ui,sans-serif}
.cafe-menu-backdrop{position:absolute;inset:0;border:0;background:rgba(20,14,10,.35);backdrop-filter:blur(5px);cursor:pointer}
.cafe-menu-panel{
  position:relative;z-index:1;width:min(620px,100%);max-height:min(760px,90svh);overflow:hidden;
  display:flex;flex-direction:column;padding:26px 24px 22px;border:1px solid rgba(91,59,36,.24);
  border-radius:26px;background:rgba(233,218,190,.75);color:#4b3020;
  box-shadow:0 24px 80px rgba(36,22,13,.35);backdrop-filter:blur(18px)
}
.cafe-menu-panel h2{margin:0 44px 18px 0;font:600 1.65rem Georgia,serif;color:#3f281a}
.cafe-menu-close{
  position:absolute;top:14px;right:15px;width:38px;height:38px;border:0;border-radius:50%;
  background:rgba(75,48,32,.09);color:#4b3020;font-size:24px;cursor:pointer
}
.cafe-menu-tabs{display:flex;gap:7px;padding-bottom:13px;overflow-x:auto;scrollbar-width:none}
.cafe-menu-tabs::-webkit-scrollbar{display:none}
.cafe-menu-tabs button{
  flex:0 0 auto;padding:8px 13px;border:0;border-bottom:2px solid transparent;
  background:transparent;color:#62442f;font:600 13px Inter,system-ui,sans-serif;cursor:pointer
}
.cafe-menu-tabs button[aria-selected="true"]{border-bottom-color:#5a3824;color:#352116;background:rgba(90,56,36,.07);border-radius:10px 10px 0 0}
.cafe-menu-list{min-height:280px;overflow:auto;padding:3px 4px 4px}
.cafe-menu-item{
  display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:10px;
  min-height:48px;padding:9px 8px;border-bottom:1px solid rgba(75,48,32,.13);cursor:pointer
}
.cafe-menu-item:hover{background:rgba(255,248,235,.26);border-radius:12px}
.cafe-radio{position:relative;width:19px;height:19px}
.cafe-radio input{position:absolute;inset:0;opacity:0;cursor:pointer}
.cafe-radio i{
  display:block;width:17px;height:17px;border:2px solid rgba(75,48,32,.55);border-radius:50%;
  box-shadow:inset 0 0 0 4px transparent;transition:.15s ease
}
.cafe-radio input:checked+i{border-color:#4b3020;background:#4b3020;box-shadow:inset 0 0 0 4px rgba(233,218,190,.95)}
.cafe-menu-item-copy{display:flex;flex-direction:column;min-width:0}
.cafe-menu-item-copy b{font-size:14px;font-weight:650}
.cafe-menu-item-copy small{margin-top:2px;color:#765640;font-size:11px;line-height:1.35}
.cafe-menu-item strong{white-space:nowrap;font-size:13px;color:#4b3020}
.cafe-menu-footer{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  margin-top:15px;padding-top:15px;border-top:1px solid rgba(75,48,32,.22)
}
.cafe-menu-total{display:flex;flex-direction:column;gap:2px;font-size:12px;color:#765640}
.cafe-menu-total b{font-size:16px;color:#3f281a}
.cafe-order-button{
  min-width:128px;padding:11px 18px;border:1px solid #4b3020;border-radius:999px;
  background:#4b3020;color:#f5ead6;font:650 14px Inter,system-ui,sans-serif;cursor:pointer
}
.cafe-order-button:disabled{opacity:.42;cursor:not-allowed}
.cafe-menu-message{min-height:18px;margin:10px 0 0;color:#6a2f24;font-size:12px;text-align:right}
@media(max-width:640px){
 .cafe-menu-sheet{padding:10px}
 .cafe-menu-panel{max-height:84svh;padding:22px 16px 17px;border-radius:22px}
 .cafe-menu-list{min-height:240px}
 .cafe-menu-tabs{margin-right:28px}
 .cafe-menu-item{padding-left:4px;padding-right:4px}
}


/* Restaurant menu v1: cool translucent paper, single dishes and composed set menus. */
.restaurant-menu-open{
  margin-top:14px;padding:10px 22px;border:1px solid rgba(255,255,255,.28);
  border-radius:999px;background:rgba(255,255,255,.20);color:#fff;
  font:600 14px Inter,system-ui,sans-serif;cursor:pointer;backdrop-filter:blur(8px)
}
.restaurant-menu-open:hover,.restaurant-menu-open:focus-visible{background:rgba(255,255,255,.28);border-color:rgba(255,255,255,.48)}
.restaurant-menu-sheet[hidden],.restaurant-compose-sheet[hidden]{display:none!important}
.restaurant-menu-sheet,.restaurant-compose-sheet{position:fixed;inset:0;z-index:1100;display:grid;place-items:center;padding:18px;font-family:Inter,system-ui,sans-serif}
.restaurant-menu-backdrop{position:absolute;inset:0;border:0;background:rgba(22,22,24,.34);backdrop-filter:blur(5px);cursor:pointer}
.restaurant-menu-panel{
  position:relative;z-index:1;width:min(650px,100%);max-height:min(790px,90svh);overflow:hidden;
  display:flex;flex-direction:column;padding:26px 24px 22px;border:1px solid rgba(45,45,48,.18);
  border-radius:26px;background:rgba(238,238,236,.75);color:#2f3033;
  box-shadow:0 24px 80px rgba(15,15,17,.28);backdrop-filter:blur(18px)
}
.restaurant-menu-panel h2{margin:0 44px 18px 0;font:600 1.65rem Georgia,serif;color:#242528}
.restaurant-menu-close{
  position:absolute;top:14px;right:15px;width:38px;height:38px;border:0;border-radius:50%;
  background:rgba(47,48,51,.08);color:#2f3033;font-size:24px;cursor:pointer
}
.restaurant-menu-tabs{display:flex;gap:7px;padding-bottom:13px;overflow-x:auto;scrollbar-width:none}
.restaurant-menu-tabs::-webkit-scrollbar{display:none}
.restaurant-menu-tabs button{
  flex:0 0 auto;padding:8px 13px;border:0;border-bottom:2px solid transparent;
  background:transparent;color:#4d4e52;font:600 13px Inter,system-ui,sans-serif;cursor:pointer
}
.restaurant-menu-tabs button[aria-selected="true"]{border-bottom-color:#343538;color:#222326;background:rgba(52,53,56,.06);border-radius:10px 10px 0 0}
.restaurant-menu-list{min-height:310px;overflow:auto;padding:3px 4px 4px}
.restaurant-menu-item{
  display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:10px;
  min-height:48px;padding:9px 8px;border-bottom:1px solid rgba(47,48,51,.11);cursor:pointer
}
.restaurant-menu-item:hover{background:rgba(255,255,255,.28);border-radius:12px}
.restaurant-radio{position:relative;width:19px;height:19px}
.restaurant-radio input{position:absolute;inset:0;opacity:0;cursor:pointer}
.restaurant-radio i{
  display:block;width:17px;height:17px;border:2px solid rgba(47,48,51,.48);border-radius:50%;
  box-shadow:inset 0 0 0 4px transparent;transition:.15s ease
}
.restaurant-radio input:checked+i{border-color:#2f3033;background:#2f3033;box-shadow:inset 0 0 0 4px rgba(238,238,236,.96)}
.restaurant-menu-item-copy{display:flex;flex-direction:column;min-width:0}
.restaurant-menu-item-copy b{font-size:14px;font-weight:650}
.restaurant-menu-item-copy small{margin-top:2px;color:#66686d;font-size:11px;line-height:1.35}
.restaurant-menu-item strong{white-space:nowrap;font-size:13px;color:#2f3033}
.restaurant-menu-footer{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  margin-top:15px;padding-top:15px;border-top:1px solid rgba(47,48,51,.18)
}
.restaurant-menu-total{display:flex;flex-direction:column;gap:2px;font-size:12px;color:#66686d}
.restaurant-menu-total b{font-size:16px;color:#2f3033}
.restaurant-order-button,.restaurant-secondary-button{
  min-width:128px;padding:11px 18px;border:1px solid #2f3033;border-radius:999px;
  background:#2f3033;color:#f3f3f1;font:650 14px Inter,system-ui,sans-serif;cursor:pointer
}
.restaurant-secondary-button{background:transparent;color:#2f3033}
.restaurant-order-button:disabled{opacity:.42;cursor:not-allowed}
.restaurant-menu-message{min-height:18px;margin:10px 0 0;color:#7a3434;font-size:12px;text-align:right}
.restaurant-compose-panel{width:min(760px,100%);max-height:min(840px,92svh)}
#restaurant-compose-body{overflow:auto;padding-right:3px}
.restaurant-compose-section{padding:10px 0 2px}
.restaurant-compose-section h3{margin:0 0 6px;font:650 14px Inter,system-ui,sans-serif;color:#242528}
.restaurant-compose-section + .restaurant-compose-section{border-top:1px solid rgba(47,48,51,.13);margin-top:8px;padding-top:16px}
.restaurant-duo-choice{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
.restaurant-duo-choice button{
  padding:12px;border:1px solid rgba(47,48,51,.23);border-radius:14px;background:rgba(255,255,255,.22);
  color:#2f3033;font:600 13px Inter,system-ui,sans-serif;cursor:pointer
}
.restaurant-duo-choice button:hover{background:rgba(255,255,255,.38)}
.restaurant-compose-summary{
  display:flex;align-items:flex-end;justify-content:space-between;gap:18px;
  margin-top:14px;padding:14px 2px 2px;border-top:1px solid rgba(47,48,51,.18)
}
.restaurant-compose-summary div{display:flex;flex-direction:column;gap:3px;font-size:12px;color:#5d5f63}
.restaurant-compose-summary div b{font-size:13px;color:#2f3033;margin-bottom:2px}
.restaurant-compose-summary strong{white-space:nowrap;font-size:17px}
@media(max-width:640px){
 .restaurant-menu-sheet,.restaurant-compose-sheet{padding:10px}
 .restaurant-menu-panel{max-height:85svh;padding:22px 16px 17px;border-radius:22px}
 .restaurant-menu-list{min-height:250px}
 .restaurant-menu-tabs{margin-right:28px}
 .restaurant-menu-item{padding-left:4px;padding-right:4px}
 .restaurant-duo-choice{grid-template-columns:1fr}
 .restaurant-menu-footer{align-items:flex-end}
}

/* Restaurant menu refinements 2026-10-06. */
.restaurant-loading-stars{gap:18px!important}
.restaurant-compose-section{
  margin:0!important;padding:0!important;border:0!important;
  border-bottom:1px solid rgba(47,48,51,.15)!important
}
.restaurant-compose-section summary{
  list-style:none;display:grid;grid-template-columns:minmax(0,1fr) auto 22px;
  align-items:center;gap:10px;min-height:52px;padding:9px 4px;
  cursor:pointer;color:#242528;font:650 14px Inter,system-ui,sans-serif
}
.restaurant-compose-section summary::-webkit-details-marker{display:none}
.restaurant-compose-section summary::after{
  content:'⌄';font-size:16px;text-align:center;transition:transform .18s ease
}
.restaurant-compose-section[open] summary::after{transform:rotate(180deg)}
.restaurant-compose-section summary small{
  min-width:0;max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  color:#686a6f;font-size:11px;font-weight:500
}
.restaurant-compose-options{padding:0 2px 10px}
@media(max-width:640px){
 .restaurant-compose-section summary small{max-width:140px}
 .restaurant-loading-stars{gap:16px!important}
}

.restaurant-compose-topback{
 position:absolute;top:14px;left:15px;width:38px;height:38px;border:0;border-radius:50%;
 background:rgba(47,48,51,.08);color:#2f3033;font-size:20px;cursor:pointer
}
.restaurant-compose-panel h2{margin-left:48px}

/* Reliable activity loader wave + bottom placement */
.hu-sleep-dialog{
  display:flex;
  flex-direction:column;
  align-items:center;
}
.hu-sleep-dialog .hu-sleep-stars{
  order:3;
  margin-top:14px;
}
.hu-sleep-dialog h2{order:1}
.hu-sleep-dialog p{order:2}
.hu-sleep-stars span{
  display:block;
  animation:hu-loader-bottom-wave 1.45s ease-in-out infinite;
}
.hu-sleep-stars span:nth-child(2){animation-delay:.18s}
.hu-sleep-stars span:nth-child(3){animation-delay:.36s}
@keyframes hu-loader-bottom-wave{
  0%,100%{opacity:.28;transform:translateY(1px) scale(.9)}
  50%{opacity:1;transform:translateY(-3px) scale(1.08)}
}
@media (prefers-reduced-motion:reduce){
  .hu-sleep-stars span{animation:none!important;opacity:1;transform:none}
}

/* In-scene navigation hotspots for waterfront routes */
.scene-hotspots{position:fixed;inset:0;z-index:50;pointer-events:none}
.scene-hotspot{position:absolute;display:grid;place-items:center;width:34px;height:34px;border:1px solid rgba(255,255,255,.7);border-radius:50%;background:rgba(35,31,31,.62);color:#fff;text-decoration:none;box-shadow:0 4px 18px rgba(0,0,0,.25);backdrop-filter:blur(5px);pointer-events:auto;transition:transform .16s ease,background .16s ease}
.scene-hotspot:hover{transform:scale(1.08);background:rgba(35,31,31,.82)}
.scene-hotspot>span{font-size:14px;line-height:1}
.scene-hotspot>small{position:absolute;top:40px;left:50%;transform:translateX(-50%);padding:5px 8px;border-radius:8px;background:rgba(35,31,31,.72);white-space:nowrap;font:600 11px Inter,system-ui,sans-serif;opacity:0;transition:opacity .16s ease}
.scene-hotspot:hover>small,.scene-hotspot:focus-visible>small{opacity:1}
.waterfront-view-hotspot{left:49.5%;top:52.5%}
.waterfront-pier-hotspot{left:49.5%;top:75%}
.waterfront-bar-terrace-hotspot{left:43.5%;top:66%}
.waterfront-bar-interior-hotspot{left:74.5%;top:62%}
@media(max-width:720px){.scene-hotspot{width:30px;height:30px}.waterfront-view-hotspot{left:50%;top:53%}.waterfront-pier-hotspot{left:50%;top:74%}.waterfront-bar-terrace-hotspot{left:43.5%;top:66%}.waterfront-bar-interior-hotspot{left:74.5%;top:62%}}

/* Shopping square: direct scenic route down to the waterfront bar. */
.commercial-waterfront-bar-hotspot{position:fixed;left:75.5%;top:66%;z-index:50}
@media(max-width:720px){.commercial-waterfront-bar-hotspot{left:75%;top:66%}}

/* City center: scenic route to the waterfront. */
.hub-waterfront-hotspot{position:fixed;z-index:50}

/* Waterfront bar menu: same glass opacity as restaurant, charcoal palette. */
.bar-menu-sheet .restaurant-menu-panel{background:rgba(54,54,54,.75);color:#f5f5f5;border-color:rgba(245,245,245,.18)}
.bar-menu-sheet .restaurant-menu-panel h2,.bar-menu-sheet .restaurant-menu-item strong,.bar-menu-sheet .restaurant-menu-total b,.bar-menu-sheet .restaurant-compose-section summary,.bar-menu-sheet .restaurant-compose-summary div b{color:#f5f5f5}
.bar-menu-sheet .restaurant-menu-close,.bar-menu-sheet .restaurant-compose-topback{background:rgba(245,245,245,.08);color:#f5f5f5}
.bar-menu-sheet .restaurant-menu-tabs button{color:rgba(245,245,245,.72)}
.bar-menu-sheet .restaurant-menu-tabs button[aria-selected="true"]{color:#f5f5f5;border-bottom-color:#f5f5f5;background:rgba(245,245,245,.06)}
.bar-menu-sheet .restaurant-menu-item{border-bottom-color:rgba(245,245,245,.11)}
.bar-menu-sheet .restaurant-menu-item:hover{background:rgba(245,245,245,.07)}
.bar-menu-sheet .restaurant-radio i{border-color:rgba(245,245,245,.48)}
.bar-menu-sheet .restaurant-radio input:checked+i{border-color:#f5f5f5;background:#f5f5f5;box-shadow:inset 0 0 0 4px rgba(54,54,54,.96)}
.bar-menu-sheet .restaurant-menu-item-copy small,.bar-menu-sheet .restaurant-menu-total,.bar-menu-sheet .restaurant-compose-summary div,.bar-menu-sheet .restaurant-compose-section summary small{color:rgba(245,245,245,.64)}
.bar-menu-sheet .restaurant-menu-footer,.bar-menu-sheet .restaurant-compose-summary,.bar-menu-sheet .restaurant-compose-section{border-color:rgba(245,245,245,.15)!important}
.bar-menu-sheet .restaurant-order-button{border-color:#f5f5f5;background:#f5f5f5;color:#363636}
.bar-menu-sheet .restaurant-secondary-button{border-color:#f5f5f5;background:transparent;color:#f5f5f5}
.bar-menu-sheet .restaurant-menu-message{color:#ffd0d0}

/* Waterfront bar palette hard override: keep restaurant glass opacity, force charcoal. */
#bar-menu-sheet .restaurant-menu-panel,
#bar-compose-sheet .restaurant-menu-panel{
  background:rgba(54,54,54,.75)!important;
  color:#f5f5f5!important;
  border-color:rgba(245,245,245,.18)!important;
}
#bar-menu-sheet .restaurant-menu-panel *,
#bar-compose-sheet .restaurant-menu-panel *{color:inherit}
#bar-menu-sheet .restaurant-menu-item-copy small,
#bar-compose-sheet .restaurant-menu-item-copy small,
#bar-menu-sheet .restaurant-menu-total,
#bar-compose-sheet .restaurant-compose-section summary small,
#bar-compose-sheet .restaurant-compose-summary div{color:rgba(245,245,245,.68)!important}
#bar-menu-sheet .restaurant-menu-tabs button{color:rgba(245,245,245,.72)!important}
#bar-menu-sheet .restaurant-menu-tabs button[aria-selected="true"]{color:#f5f5f5!important;border-bottom-color:#f5f5f5!important}
#bar-menu-sheet .restaurant-radio i,
#bar-compose-sheet .restaurant-radio i{border-color:rgba(245,245,245,.5)!important}
#bar-menu-sheet .restaurant-radio input:checked+i,
#bar-compose-sheet .restaurant-radio input:checked+i{border-color:#f5f5f5!important;background:#f5f5f5!important;box-shadow:inset 0 0 0 4px rgba(54,54,54,.96)!important}
#bar-menu-sheet .restaurant-order-button,
#bar-compose-sheet .restaurant-order-button{background:#f5f5f5!important;color:#363636!important;border-color:#f5f5f5!important}
#bar-compose-sheet .restaurant-secondary-button{background:transparent!important;color:#f5f5f5!important;border-color:#f5f5f5!important}
#bar-menu-sheet .restaurant-menu-close,
#bar-compose-sheet .restaurant-menu-close,
#bar-compose-sheet .restaurant-compose-topback{color:#f5f5f5!important;background:rgba(245,245,245,.08)!important}


/* Memories V1: optional action in the existing order loader. */
.hu-memory-offer-actions{display:flex;justify-content:center;gap:9px;flex-wrap:wrap;margin-top:18px}
.hu-memory-offer-actions button{min-height:40px;padding:9px 14px;border-radius:999px;font:inherit;cursor:pointer}
.hu-memory-create{border:1px solid color-mix(in srgb,var(--accent,#efe0cc) 70%,transparent);background:color-mix(in srgb,var(--accent,#efe0cc) 18%,rgba(24,25,27,.72));color:inherit}
.hu-memory-skip{border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.05);color:inherit}
.hu-memory-offer-actions button:disabled{opacity:.55;cursor:wait}

/* Home cleanup: remove legacy purple-tinted surfaces that predate the neutral anthracite system. */
.bubble-home .scene-controls{
  background:rgba(30,31,34,.82)!important;
  border-color:rgba(255,255,255,.20)!important;
}
.bubble-home .scene-caption{
  color:rgba(246,244,240,.72)!important;
}
.bubble-home .memory-empty{
  background:rgba(30,31,34,.82)!important;
  border-color:rgba(255,255,255,.20)!important;
  color:#f6f4f0!important;
}
.bubble-home .rin-action-panel{
  background:rgba(30,31,34,.94)!important;
  border-color:rgba(255,255,255,.20)!important;
  color:#f6f4f0!important;
}
.bubble-home .rin-action-status,
.bubble-home .rin-game-menu p{
  color:rgba(246,244,240,.72)!important;
}
.bubble-home .rin-action-menu button,
.bubble-home .rin-game-menu button,
.bubble-home .rin-game-menu a{
  background:rgba(255,255,255,.045)!important;
  border-color:rgba(255,255,255,.15)!important;
  color:#f6f4f0!important;
}
.bubble-home .rin-action-menu button:hover,
.bubble-home .rin-game-menu button:hover,
.bubble-home .rin-game-menu a:hover{
  background:color-mix(in srgb,var(--accent,#efe0cc) 12%,rgba(255,255,255,.045))!important;
}
html[data-hu-theme="light"] .bubble-home .scene-controls,
html[data-hu-theme="light"] .bubble-home .memory-empty,
html[data-hu-theme="light"] .bubble-home .rin-action-panel{
  background:rgba(248,248,246,.94)!important;
  border-color:rgba(35,36,39,.16)!important;
  color:#292a2d!important;
}
html[data-hu-theme="light"] .bubble-home .scene-caption,
html[data-hu-theme="light"] .bubble-home .rin-action-status,
html[data-hu-theme="light"] .bubble-home .rin-game-menu p{
  color:rgba(41,42,45,.68)!important;
}
html[data-hu-theme="light"] .bubble-home .rin-action-menu button,
html[data-hu-theme="light"] .bubble-home .rin-game-menu button,
html[data-hu-theme="light"] .bubble-home .rin-game-menu a{
  background:rgba(35,36,39,.035)!important;
  border-color:rgba(35,36,39,.14)!important;
  color:#292a2d!important;
}

.hu-chat-badge-pair{display:inline-flex;flex-wrap:wrap;gap:4px;margin-left:5px;vertical-align:middle}
.hu-chat-badge-pair .hu-text-badge{display:inline-block;border:1px solid var(--hu-accent,#a989cc);border-radius:6px;padding:2px 6px;background:color-mix(in srgb,var(--hu-accent,#a989cc) 9%,transparent);font-size:10px;font-weight:500;line-height:1.4;overflow-wrap:anywhere}

/* Park entrance: keep its single destination compact instead of stretching across the multi-link menu width. */
.park-destination-menu{
 width:min(420px,calc(100vw - 32px));
 padding:0 10px;
}
.park-destination-menu a{
 min-width:0;
 padding-inline:16px;
}
@media(max-width:640px){
 .park-destination-menu{width:min(360px,calc(100vw - 24px));padding:0 8px}
}

/* Plaza: compact single entrance to the lobby. */
.place-destination-menu.plaza-lobby-menu{width:min(200px,calc(100vw - 32px));padding:6px}
.place-destination-menu.plaza-lobby-menu a{justify-content:center;text-align:center;padding:9px 10px}


/* Novalis shared layout: description and destinations occupy separate bottom corners.
   Preserve the full text, and keep the description equally inset from left and bottom.
   Mobile visual-novel panels retain their existing layout. */
@media (min-width:761px) {
  .place-page {
    --novalis-edge:clamp(22px,4vw,64px);
  }
  .place-page:has(.place-destination-menu) .place-main {
    padding-left:var(--novalis-edge);
    padding-bottom:var(--novalis-edge);
  }
  .place-page .place-card {
    box-sizing:border-box;
    max-width:100%;
    overflow-wrap:break-word;
  }
  .place-page:has(.place-destination-menu) .place-card {
    width:min(360px,40vw);
  }
  .place-page .place-destination-menu {
    left:50%;
    right:auto;
    bottom:var(--novalis-edge);
    transform:translateX(-50%);
    box-sizing:border-box;
    width:min(430px,40vw);
  }
  .place-page .place-destination-menu:not(:has(a:nth-child(3))) {
    width:min(350px,36vw);
  }
  .place-page .place-destination-menu:not(:has(a:nth-child(2))) {
    width:min(220px,28vw);
  }
}
/* Compact nested Inside / Terrace choices in Rin and Hiko invitation menus. */
.rin-destination-menu .hu-ai-destination-card{
  box-sizing:border-box;
  min-width:0;
  padding:9px 11px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:14px;
  background:rgba(255,255,255,.025);
}
.rin-destination-menu .hu-ai-destination-card > b{
  display:block;
  margin-bottom:6px;
  font-size:.88rem;
}
.rin-destination-menu .hu-ai-destination-card > span{
  display:flex;
  align-items:center;
  gap:7px;
}
.rin-destination-menu .hu-ai-destination-card > span > button{
  flex:1 1 0;
  min-width:0;
  min-height:34px;
  padding:6px 8px;
  border-radius:10px;
  font-size:.78rem;
  line-height:1.2;
  text-align:center;
}
.rin-destination-menu .hu-ai-destination-card > span > i{
  flex:0 0 auto;
  opacity:.55;
  font-style:normal;
}
html[data-hu-theme="light"] .rin-destination-menu .hu-ai-destination-card{
  border-color:rgba(35,36,39,.14);
  background:rgba(35,36,39,.025);
}
@media(max-width:640px){
  .rin-destination-menu .hu-ai-destination-card{padding:7px}
  .rin-destination-menu .hu-ai-destination-card > span{gap:4px}
  .rin-destination-menu .hu-ai-destination-card > span > button{
    min-height:32px;
    padding:5px 4px;
    font-size:.72rem;
  }
}

/* Novalis location description audit (all places, with or without destinations).
   One card size, one left/bottom inset, and content-driven height. */
@media(min-width:641px){
  .place-page{
    --novalis-edge:clamp(22px,4vw,64px);
  }
  .place-page .place-main,
  .commercial-place-page .place-main{
    box-sizing:border-box;
    padding-left:var(--novalis-edge);
    padding-bottom:var(--novalis-edge);
  }
  .place-page .place-card,
  .commercial-place-page .place-card{
    box-sizing:border-box;
    width:min(360px,calc(100vw - 2 * var(--novalis-edge)));
    max-width:100%;
    height:auto;
    min-height:0;
    margin-bottom:0;
    padding:15px 18px;
    overflow-wrap:break-word;
  }
  .place-page .place-card h1{
    font-size:clamp(1.45rem,2.6vw,2.15rem);
    line-height:1.08;
  }
  .place-page .place-card > p:last-of-type{
    font-size:.95rem;
    line-height:1.35;
  }
  .place-page .place-destination-menu,
  .commercial-place-page .place-destination-menu{
    bottom:var(--novalis-edge);
  }
}
/* Keep every location description on the same bottom baseline.
   The destination menu remains centered and compact, but never lifts the card. */
@media(min-width:641px){
  .place-page:has(.place-destination-menu) .place-main,
  .commercial-place-page:has(.place-destination-menu) .place-main{
    padding-bottom:var(--novalis-edge);
  }
}
/* The recording studio has a long title. Avoid a fixed-width title overflowing
   into character sprites; the shared card still grows vertically as needed. */
.place-page .place-card h1{
  overflow-wrap:break-word;
  hyphens:auto;
}
/* Retain the shared mobile visual-novel panel, including the shopping square. */
@media(max-width:640px){
  .commercial-place-page .place-main{padding-bottom:0}
  .commercial-place-page .place-card{
    min-height:var(--mobile-location-card-h,136px);
    padding:19px 24px max(19px,calc(env(safe-area-inset-bottom) + 14px));
  }
}

/* Bar basket layout: keep category tabs and checkout reachable with large orders. */
#bar-menu-sheet .restaurant-menu-panel{
  max-height:min(790px,90svh);
  min-height:0;
}
#bar-menu-sheet .restaurant-menu-panel > h2,
#bar-menu-sheet .restaurant-menu-tabs,
#bar-menu-sheet .restaurant-menu-footer,
#bar-menu-sheet .restaurant-menu-message{flex-shrink:0}
#bar-menu-sheet .restaurant-menu-tabs{min-height:42px}
#bar-menu-sheet .restaurant-menu-list{
  flex:1 1 230px;
  min-height:90px;
  overflow-y:auto;
  overscroll-behavior:contain;
}
#bar-menu-sheet #hu-bar-basket{
  flex:0 1 auto;
  min-height:0;
  max-height:min(210px,28svh);
  overflow-y:auto;
  overscroll-behavior:contain;
  border-top:1px solid rgba(245,245,245,.15);
}
#bar-menu-sheet #hu-bar-basket:empty{display:none!important}
#bar-menu-sheet .restaurant-menu-footer{margin-top:8px;padding-top:10px}
@media(max-height:650px){
  #bar-menu-sheet .restaurant-menu-list{flex-basis:120px;min-height:60px}
  #bar-menu-sheet #hu-bar-basket{max-height:20svh}
}

/* Mobile Safari + installed PWA: Rin is 20% larger and anchored to the viewport bottom.
   Hiko keeps her existing geometry. Both characters remain behind location panels. */
@media(max-width:640px){
 .place-page .rin-world-test,
 .place-page:has(.hiko-world-presence:not([hidden])) .rin-world-test{
   bottom:0!important;
   width:67.344vw!important;
   height:98.94svh!important;
   transform-origin:center bottom!important;
   z-index:3!important;
 }
 .place-page .hiko-world-presence,
 .place-page .hiko-world-presence.is-dialogue{
   z-index:3!important;
 }
 .place-page .place-main{
   position:relative;
   z-index:12!important;
   pointer-events:none;
 }
 .place-page .place-card{pointer-events:auto}
 .place-page .place-destination-menu{z-index:20!important}
}