/* Immersive chat-first homepage: a full-viewport comic chat stage (no phone frame),
 * Colette and Carrie as big tilted portraits, and a scroll-into-page transition.
 * Loaded after world-landing.css. Animates transform/opacity only. */
.imm-wrap { position:relative; background:radial-gradient(circle at 50% 0,#4A1B34 0,#241019 62%,#140A10 100%); }
.imm-hero.world-landing-hero { display:block; overflow:visible; isolation:auto; align-content:start; max-width:none; min-height:150svh; margin:0; padding:0; background:transparent; border:0; }
.imm-hero.world-landing-hero::before, .imm-hero.world-landing-hero::after { display:none; }
.imm-stage { position:sticky; top:0; box-sizing:border-box; height:100svh; min-height:560px; padding:84px 16px 12px; overflow:hidden; display:flex; justify-content:center; contain:paint; }
/* halftone dots under the whole stage */
.imm-stage::before { content:''; position:absolute; inset:0; pointer-events:none; opacity:.16; background-image:radial-gradient(#F4C9DC 1.1px,transparent 1.4px); background-size:11px 11px; -webkit-mask-image:linear-gradient(115deg,#000 0,transparent 45%,transparent 60%,#000 100%); mask-image:linear-gradient(115deg,#000 0,transparent 45%,transparent 60%,#000 100%); }
.imm-col { position:relative; z-index:2; display:flex; flex-direction:column; width:min(760px,100%); min-width:0; height:100%; padding-bottom:28px; }
.imm-col .world-hero-copy { flex:0 0 auto; max-width:none; padding:0 0 12px; text-align:center; }
.imm-col .world-hero-copy h1 { margin:0 0 6px; font-size:clamp(34px,4.4vw,56px); line-height:1; }
@media (min-width:821px) { html[lang] .imm-col .world-hero-copy h1 { font-size:min(44px,3.3vw); line-height:1.05; white-space:nowrap; letter-spacing:-.03em; } }
.imm-col .world-hero-copy h1 br { display:none; }
.imm-col .world-hero-copy h1 em { margin-left:.2em; }
.imm-col .world-hero-copy h1 em::after { opacity:.75; background:#F4C9DC; height:.1em; transform:rotate(-1deg); }
.imm-col .world-hero-sub { margin:0 auto; max-width:620px; color:#EBD9E2; font:500 clamp(14px,1.3vw,16px)/1.4 var(--w-sans); }
.imm-col .world-hero-sub .world-sub-short { display:none; }
.imm-col .world-hero-sub .world-sub-long b { color:var(--w-gold); }
.imm-col > .world-stage { position:relative; display:flex; flex-direction:column; flex:1 1 auto; min-height:0; max-width:none; width:100%; margin:0; padding:0; }
.imm-col .world-duel { display:none; }
.imm-col .world-chat { flex:1 1 auto; height:auto !important; min-height:0; width:100%; border:3px solid var(--w-ink); border-radius:18px; background:var(--w-cream); box-shadow:6px 7px 0 #E58AB1, 6px 7px 0 3px var(--w-ink); transform-origin:50% 100%; will-change:transform; }
.imm-col .world-chat-head { padding:6px 10px 6px 14px; min-height:0; background:var(--w-cream); border-bottom:2px solid var(--w-ink); gap:8px; }
.imm-col .world-chat-head > img, .imm-col .world-chat-tagline, .imm-col #world-presence { display:none; }
.imm-col .world-chat-head h2 { font:italic 700 17px/1.2 var(--w-serif); color:var(--w-plum); }
.imm-col .world-chat-head > div { flex:1 1 auto; }
.imm-col #world-thread { background:var(--w-paper) radial-gradient(#D9B26F22 1px,transparent 1.3px) 0 0/9px 9px; }
/* cafe caption: a small static comic pill above the first bubble (never sticky over it) */
.imm-col .world-scene-head { position:static; flex-wrap:nowrap; justify-content:center; gap:8px; margin:0 0 14px; padding:0; background:none; }
.imm-col .world-scene-head .world-scene-note { flex:0 1 auto; margin:0; padding:5px 12px; border:1.5px solid var(--w-ink); border-radius:999px; background:#fff; color:#5D2440; font:700 11px/1.35 var(--w-sans); text-align:center; box-shadow:2px 2px 0 var(--w-gold); }
/* sound: small icon button, same player */
.imm-col .world-voice-bar { padding:0; border:0; background:transparent; }
.imm-col .world-voice-bar button#world-voice-play { position:relative; width:40px; min-height:40px; height:40px; padding:0; border:2px solid var(--w-ink); border-radius:50%; background:var(--w-gold-soft); font-size:0; line-height:0; overflow:hidden; box-shadow:2px 2px 0 var(--w-ink); }
.imm-col .world-voice-bar button#world-voice-play::before { width:auto; height:auto; margin:0; border:0; content:'🔊'; font-size:17px; line-height:36px; display:block; text-align:center; }
.imm-col .world-voice-bar button#world-voice-play[aria-pressed="true"] { background:var(--w-rose); }
.imm-col .world-voice-bar [role="status"] { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
/* composer: big pill, photo first */
.imm-col #world-composer { padding:10px 12px 4px; background:var(--w-cream); border-top:2px solid var(--w-ink); }
.imm-col .world-composer-row { max-width:none; align-items:center; gap:8px; padding:5px 6px; border:2.5px solid var(--w-ink); border-radius:999px; background:#fff; box-shadow:3px 3px 0 #E58AB1; }
.imm-col .world-composer-row .world-photo-label { flex:0 0 46px; width:46px; height:46px; border-radius:50%; background:var(--w-gold); color:var(--w-ink); border:2px solid var(--w-ink); }
.imm-col #world-text { flex:1 1 auto; min-width:0; min-height:46px; border:0; background:transparent; font-size:17px; box-shadow:none; }
.imm-col #world-text:focus, .imm-col #world-text:focus-visible { outline:none; box-shadow:none; border:0; }
.imm-col .world-composer-row:focus-within { outline:3px solid #E0558F; outline-offset:2px; }
.imm-col #world-send { flex:0 0 46px; width:46px; height:46px; border-radius:50%; background:#E0558F; color:#fff; border:2px solid var(--w-ink); }
.imm-col .world-composer-meta { margin:0; min-height:0; }
.imm-col #world-status { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.imm-chips { flex:0 0 auto; order:3; display:flex; flex-wrap:wrap; justify-content:center; gap:8px 7px; margin:0; padding:8px 12px 0; list-style:none; background:var(--w-cream); }
.imm-chips button { min-height:40px; padding:0 13px; border:2px solid var(--w-ink); border-radius:999px; background:#fff; color:var(--w-plum); font:700 13px/1 var(--w-sans); cursor:pointer; box-shadow:2px 2px 0 var(--w-gold); }
.imm-chips button:hover { background:var(--w-rose-soft); }
.imm-col .world-chat-head { order:0; } .imm-col #world-thread { order:1; } .imm-col #world-composer { order:2; } .imm-col .imm-trust { order:4; }
.imm-col .imm-trust { margin:0; padding:4px 12px 8px; background:var(--w-cream); color:#6E5F66; font-size:12px; line-height:1.4; text-align:center; }
/* the composer and thread are opaque and usable from first paint; only characters, bubbles and stamps animate */
html.world-cinema-on .imm-hero .world-chat, html.world-cinema-on .imm-col .world-hero-copy > * { animation:none; opacity:1; }
.imm-col .world-proof-ticker, .imm-stage > .world-proof-ticker { display:none; }
/* characters */
.imm-char { position:absolute; z-index:1; top:min(150px,22svh); width:clamp(170px,18vw,250px); margin:0; padding:7px 7px 0; border:4px solid var(--w-ink); background:var(--w-gold); box-shadow:7px 8px 0 #E58AB1; transform:rotate(-5deg); animation:imm-pop .7s cubic-bezier(.2,1.4,.4,1) both, imm-bob 4s ease-in-out 1s 5 both; transition:transform .25s; }
.imm-colette { left:max(14px,calc(50% - 380px - clamp(170px,18vw,250px) - 30px)); }
.imm-carrie { right:max(14px,calc(50% - 380px - clamp(170px,18vw,250px) - 30px)); top:min(270px,36svh); background:var(--w-rose); box-shadow:-7px 8px 0 var(--w-gold); transform:rotate(5deg); animation-delay:.12s,2s; }
.imm-char img { display:block; width:100%; height:auto; aspect-ratio:1; object-fit:cover; background:#EFE6E0; }
.imm-char figcaption { display:flex; flex-direction:column; align-items:center; padding:6px 2px 8px; color:var(--w-ink); }
.imm-char figcaption b { font:italic 700 19px/1.1 var(--w-serif); }
.imm-char figcaption span { font:800 10.5px/1.3 var(--w-sans); letter-spacing:.07em; text-transform:uppercase; }
.imm-colette::after { content:'✦'; position:absolute; top:-18px; right:-14px; color:var(--w-gold); font-size:30px; text-shadow:2px 2px 0 var(--w-ink); animation:imm-fade 1.2s .6s both; }
@keyframes imm-pop { from { transform:translateX(-36px) rotate(-12deg) scale(.9); } }
.imm-carrie { animation-name:imm-pop-r, imm-bob; }
@keyframes imm-pop-r { from { transform:translateX(36px) rotate(12deg) scale(.9); } }
@keyframes imm-bob { 50% { translate:0 -3px; } }
@keyframes imm-fade { from { opacity:0; transform:scale(.2); } 50% { opacity:1; } to { opacity:0; } }
.imm-stage[data-imm-react="typing"] .imm-colette { transform:rotate(-2deg) translateX(10px) scale(1.04); }
.imm-stage[data-imm-react="photo"] .imm-char { transform:rotate(0) scale(1.07); }
.imm-stage[data-imm-react="jaw"] .imm-carrie { transform:rotate(3deg) scale(1.1) translateY(-6px); }
html.imm-calm .imm-char { animation:none; }
.imm-cue { position:absolute; z-index:3; left:50%; bottom:6px; transform:translateX(-50%); padding:4px 14px; color:var(--w-gold); font:800 12px/1.6 var(--w-sans); letter-spacing:.06em; text-transform:uppercase; text-decoration:none; white-space:nowrap; }
.imm-cue:hover { color:#fff; }
/* the next section is the page that turns over the pinned stage: cream sheet, ink edge, offset shadow */
.imm-what { position:relative; z-index:5; box-sizing:border-box; display:flex; align-items:center; justify-content:center; min-height:50svh; margin:calc(14px - 50svh) 0 0; padding:64px 20px 48px; border-top:3px solid var(--w-ink); border-radius:28px 28px 0 0; background:var(--w-cream) radial-gradient(#E58AB126 1.1px,transparent 1.4px) 0 0/11px 11px; box-shadow:0 -9px 0 #E58AB1, 0 -12px 0 var(--w-ink); color:var(--w-text); font:500 clamp(18px,2vw,22px)/1.5 var(--w-serif); text-align:center; }
.imm-what p { max-width:720px; margin:0; } .imm-what b { font-weight:700; color:var(--w-plum); }
/* docked input: masthead pill (desktop) / bottom bar (mobile) */
.world-masthead { position:fixed; top:0; left:0; right:0; background:transparent; transition:background-color .2s, border-color .2s; }
.world-masthead:not(.imm-solid) { border-bottom-color:transparent; }
.world-masthead.imm-solid, html.is-docked .world-masthead { background:#241019E6; }
.imm-dock { position:absolute; left:50%; top:50%; display:flex; align-items:center; gap:4px; width:min(340px,30vw); height:40px; padding:0 4px 0 16px; border:2px solid var(--w-ink); border-radius:999px; background:var(--w-cream); box-shadow:3px 3px 0 #E58AB1; transform:translate(-50%,-50%); opacity:0; visibility:hidden; pointer-events:none; transition:opacity .2s, visibility 0s .2s; }
.imm-dock input { flex:1 1 auto; min-width:0; height:34px; border:0; background:transparent; color:var(--w-text); font:500 16px/1 var(--w-sans); }
.imm-dock input:focus-visible { outline:none; } .imm-dock:focus-within { outline:3px solid var(--w-rose); }
.imm-dock button { flex:0 0 32px; width:32px; height:32px; border:0; border-radius:50%; background:#E0558F; color:#fff; }
/* only once the main composer has left the viewport (JS toggles imm-comp-out), so two inputs are never visible together */
html.imm-comp-out .imm-dock { opacity:1; visibility:visible; pointer-events:auto; transition:opacity .2s; }
html.imm-in-chat .imm-dock, body.chat-mode .imm-dock { display:none; }
/* scroll-driven page turn */
@supports (animation-timeline:scroll()) {
  @media (prefers-reduced-motion:no-preference) {
    html.imm-js .imm-col .world-chat { animation:imm-turn linear both; animation-timeline:scroll(root block); animation-range:0 50svh; }
    .imm-colette { animation-name:imm-pop, imm-bob, imm-aside-l; animation-timeline:auto, auto, scroll(root block); animation-range:normal, normal, 0 50svh; animation-duration:.6s, 4s, auto; animation-delay:0s, 1s, 0s; animation-iteration-count:1, 5, 1; animation-timing-function:cubic-bezier(.2,1.4,.4,1), ease-in-out, linear; }
    .imm-carrie { animation-name:imm-pop-r, imm-bob, imm-aside-r; animation-timeline:auto, auto, scroll(root block); animation-range:normal, normal, 0 50svh; animation-duration:.6s, 4s, auto; animation-delay:.12s, 2s, 0s; animation-iteration-count:1, 5, 1; animation-timing-function:cubic-bezier(.2,1.4,.4,1), ease-in-out, linear; }
    body.chat-mode .imm-col .world-chat, body.chat-mode .imm-col .world-hero-copy { animation:none; }
  }
}
@keyframes imm-turn { to { transform:perspective(1200px) rotateX(7deg) scale(.93) translateY(-5%); } }
@keyframes imm-aside-l { to { translate:-40px 24px; } }
@keyframes imm-aside-r { to { translate:40px 24px; } }
/* fallback: IntersectionObserver toggles is-docking / is-docked / is-page */
html.imm-fallback .imm-col .world-chat, html.imm-fallback .imm-col .world-hero-copy, html.imm-fallback .imm-char { transition:transform .5s, opacity .5s; }
html.imm-fallback.is-docking .imm-col .world-chat { transform:perspective(1100px) rotateX(5deg) scale(.95); }
html.imm-fallback.is-docked .imm-col .world-chat { transform:perspective(1200px) rotateX(7deg) scale(.93); }
html.imm-fallback.is-docked .imm-char { translate:0 24px; }
/* reduced motion: no sticky stage, no animation; dock is a plain sticky element once the hero has left */
@media (prefers-reduced-motion:reduce) {
  .imm-hero.world-landing-hero { min-height:0; }
  .imm-what { margin-top:0; }
  .imm-stage { position:relative; height:auto; min-height:100svh; }
  .imm-col { height:auto; min-height:calc(100svh - 72px); }
  .imm-col .world-chat { min-height:520px; }
  .imm-char, .imm-colette::after { animation:none; }
  .imm-dock, html.imm-comp-out .imm-dock { transition:none; }
}
html.imm-rm .imm-hero.world-landing-hero { min-height:0; }
html.imm-rm .imm-what { margin-top:0; }
html.imm-rm .imm-stage { position:relative; height:auto; min-height:100svh; }
html.imm-rm .imm-col { height:auto; min-height:calc(100svh - 72px); }
html.imm-rm .imm-col .world-chat { min-height:520px; }
/* chat mode: clean chat header (duo avatar, names, market, menu), no masthead, no chips/trust/cue/status, thread fills the height */
body.chat-mode { overflow-x:hidden; }
body.chat-mode .imm-wrap ~ *, body.chat-mode footer { display:none !important; }
body.chat-mode .imm-hero.world-landing-hero { min-height:0; }
body.chat-mode .imm-stage { position:fixed; inset:0; height:var(--imm-vh,100dvh); min-height:0; padding:0 16px; background:radial-gradient(circle at 50% 0,#4A1B34 0,#241019 62%,#140A10 100%); }
body.chat-mode .world-masthead, body.chat-mode .imm-dock { display:none; }
body.chat-mode .imm-col .world-hero-copy, body.chat-mode .imm-cue, body.chat-mode .imm-chips, body.chat-mode .imm-trust, body.chat-mode .imm-col .world-composer-meta { display:none; }
body.chat-mode .imm-col { padding:12px 0; }
body.chat-mode .imm-col .world-chat-head > img { display:block; width:36px; height:36px; }
body.chat-mode .imm-col .world-chat-head { min-height:52px; padding:8px 10px 8px 12px; }
body.chat-mode .imm-col .world-chat { transform:none; opacity:1; }
/* wide screens keep the big portraits fixed beside the column (clear of it); narrower ones show the avatar in the header only */
body.chat-mode .imm-char { animation:none; opacity:1; top:96px; }
body.chat-mode .imm-carrie { top:min(270px,36svh); }
body.chat-mode .imm-col #world-composer { padding-bottom:max(8px,env(safe-area-inset-bottom)); }
/* mobile: the page is the chat */
@media (max-width:820px) {
  .imm-stage { padding:48px 0 0; }
  .imm-col { width:100%; padding-bottom:0; }
  .imm-col .world-hero-copy { padding:10px 12px 8px; }
  html[lang] .imm-col .world-hero-copy h1 { font-size:clamp(25px,8.4vw,34px); letter-spacing:-.03em; margin:0 0 2px; white-space:normal; line-height:1.02; }
  html[lang="de"] .imm-col .world-hero-copy h1 { font-size:clamp(23px,7.4vw,30px); }
  .imm-col .world-hero-sub { font-size:14px; }
  .imm-col .world-hero-sub .world-sub-long { display:none; } .imm-col .world-hero-sub .world-sub-short { display:inline; }
  .imm-col .world-chat { border-width:2.5px 0 0; border-radius:16px 16px 0 0; box-shadow:0 -5px 0 #E58AB1; padding-bottom:env(safe-area-inset-bottom); }
  .world-masthead { padding:0 12px; min-height:48px; }
  .world-masthead nav > a:not([data-world-lang]) { display:none; }
  .world-masthead-brand small { display:none; }
  .imm-char { top:58px; width:76px; padding:3px 3px 0; border-width:2.5px; box-shadow:3px 3px 0 #E58AB1; }
  .imm-char figcaption { padding:1px 0 3px; } .imm-char figcaption b { font-size:13px; } .imm-char figcaption span { display:none; }
  .imm-colette { left:auto; right:calc(50% + 2px); } .imm-carrie { right:auto; left:calc(50% + 2px); top:62px; box-shadow:3px 3px 0 var(--w-gold); }
  .imm-colette::after { top:-12px; right:auto; left:-14px; font-size:22px; }
  .imm-col .world-hero-copy { padding-top:116px; }
  .imm-stage[data-imm-react] .imm-char { scale:1; }
  .imm-chips { flex-wrap:nowrap; justify-content:flex-start; overflow-x:auto; padding:8px 40px 6px 12px; scrollbar-width:none; -webkit-mask-image:linear-gradient(90deg,#000 82%,transparent); mask-image:linear-gradient(90deg,#000 82%,transparent); }
  .imm-chips::-webkit-scrollbar { display:none; }
  .imm-chips button, .imm-col .world-market select { min-height:44px; }
  .imm-col .world-menu summary { box-sizing:border-box; display:flex; align-items:center; justify-content:center; width:44px; height:44px; min-height:44px; }
  @keyframes imm-aside-l { to { translate:0 0; } } @keyframes imm-aside-r { to { translate:0 0; } }
  .imm-col .world-voice-bar button#world-voice-play { width:44px; height:44px; min-height:44px; }
  .imm-col .world-voice-bar button#world-voice-play::before { line-height:40px; }
  html:not(.imm-rm) body:not(.chat-mode) .imm-hero.world-landing-hero { min-height:160svh; }
  .imm-what { min-height:60svh; margin-top:calc(14px - 60svh); padding:48px 20px 40px; border-radius:22px 22px 0 0; }
  .imm-chips li { flex:0 0 auto; }
  .imm-col .imm-trust { font-size:12px; padding-bottom:6px; }
  .imm-chips { order:2; } .imm-col #world-composer { order:3; }
  .imm-cue { display:none; }
  .imm-col #world-composer { padding:8px 10px 4px; }
  .imm-dock { position:fixed; left:0; right:0; top:auto; bottom:0; width:auto; height:auto; padding:8px 12px calc(8px + env(safe-area-inset-bottom)); border:0; border-top:2px solid var(--w-ink); border-radius:0; background:var(--w-cream); box-shadow:none; transform:none; z-index:45; }
  .imm-dock input { height:44px; padding:0 12px; border:2px solid var(--w-ink); border-radius:999px; background:#fff; }
  .imm-dock button { flex:0 0 44px; width:44px; height:44px; }
  body.chat-mode .imm-stage { padding:0; }
  body.chat-mode .imm-col { padding:0; }
  body.chat-mode .imm-char { display:none; }
  body.chat-mode .imm-col .world-chat { border-width:0; border-radius:0; box-shadow:none; }
}
@media (min-width:821px) and (max-width:1180px) { .imm-char { display:none; } }
@media (min-width:821px) and (max-height:700px) { .imm-col .world-hero-sub { display:none; } }
/* chat mode product cards: comic cards, picture left, details right (market, currency and date lines unchanged) */
.imm-col .world-product { display:grid; grid-template-columns:112px minmax(0,1fr); column-gap:12px; align-items:start; max-width:520px; margin-top:12px; padding:10px; border:2px solid var(--w-ink); border-radius:12px; background:#fff; box-shadow:3px 3px 0 #E58AB1; }
.imm-col .world-product > * { grid-column:2; }
.imm-col .world-product > img, .imm-col .world-product > a:first-child { grid-column:1; grid-row:1 / span 9; }
.imm-col .world-product > img, .imm-col .world-product > a > img { height:112px; min-height:0; }
.imm-col .world-product h2, .imm-col .world-product h3, .imm-col .world-product .world-product-title { margin:2px 0 4px; font-size:13.5px; line-height:1.4; }
.imm-col .world-product .world-product-price { font-size:15px; line-height:1.35; }
.imm-col .world-product .world-truth, .imm-col .world-product .world-truth-badge, .imm-col .world-product .world-product-badge { margin:0 0 4px; }
.imm-col .world-product > a:last-child, .imm-col .world-product .world-retailer-link, .imm-col .world-product-link { margin-top:6px; border:2px solid var(--w-ink); border-radius:999px; box-shadow:2px 2px 0 var(--w-gold); }
@media (max-width:820px) { .imm-col .world-product { grid-template-columns:88px minmax(0,1fr); column-gap:10px; } .imm-col .world-product > img, .imm-col .world-product > a > img { height:88px; } }
/* /chat and /de/chat: viewport-tall app page, already in chat mode (body.chat-page). Rail left on desktop, slim header on phones. */
body.chat-page { --rail:208px; --cw:clamp(600px,calc(100vw - var(--rail) - 460px),720px); --gap:calc((100vw - var(--rail) - var(--cw)) / 2); --pw:clamp(150px,calc(var(--gap) - 44px),240px); margin:0; overflow:hidden; background:#140A10; }
.chat-page .imm-hero.world-landing-hero { min-height:0; }
body.chat-page .imm-stage { box-sizing:border-box; padding:0 16px 0 calc(var(--rail) + 16px); }
body.chat-page .imm-col { box-sizing:border-box; width:min(var(--cw),100%); padding:16px 0; }
.chat-page .imm-col > .world-stage { flex:1 1 auto; }
.chat-page .imm-col .world-chat-head > img { display:none; }
.chat-page .chat-head-new { display:none; }
/* the portraits sit centred in the free space either side of the column, as large as it allows (homepage-hero scale) */
body.chat-page .imm-char { box-sizing:border-box; width:var(--pw); top:max(56px,9svh); left:auto; right:auto; }
body.chat-page .imm-colette { left:calc(var(--rail) + (var(--gap) - var(--pw)) / 2); }
body.chat-page .imm-carrie { right:calc((var(--gap) - var(--pw)) / 2); top:max(250px,41svh); }
@media (prefers-reduced-motion:no-preference) {
  body.chat-page .imm-char { animation:imm-pop .7s cubic-bezier(.2,1.4,.4,1) both, imm-bob 4s ease-in-out 1s 5 both; }
  body.chat-page .imm-carrie { animation-name:imm-pop-r, imm-bob; animation-delay:.12s,2s; }
}
.chat-page .world-chat-head .world-market { display:none; }
.chat-page .imm-col .world-chat { border-radius:18px; }
.chat-rail { position:absolute; z-index:4; left:0; top:0; bottom:0; width:var(--rail); box-sizing:border-box; display:flex; flex-direction:column; gap:14px; padding:20px 18px calc(16px + var(--consent-h,0px)); border-right:2px solid #E58AB155; background:#140A10B3; color:#EBD9E2; font:600 14px/1.3 var(--w-sans); }
.chat-rail a { color:#EBD9E2; text-decoration:none; } .chat-rail a:hover { color:#fff; }
.chat-rail-brand { display:flex; align-items:center; gap:9px; margin:0 -4px 8px; white-space:nowrap; }
.chat-rail-brand img { border-radius:50%; flex:0 0 auto; } .chat-rail-brand b { display:block; font:italic 700 17px/1.15 var(--w-serif); color:#fff; } .chat-rail-brand small { display:block; margin-top:3px; white-space:normal; font:700 10.5px/1.2 var(--w-sans); letter-spacing:.08em; text-transform:uppercase; color:#C9AFBC; }
.chat-rail-new { display:flex; align-items:center; gap:8px; min-height:44px; padding:0 14px; border:2px solid var(--w-ink); border-radius:999px; background:var(--w-gold); color:var(--w-ink); font:800 14px/1 var(--w-sans); cursor:pointer; box-shadow:3px 3px 0 #E58AB1; }
.chat-rail-new:hover { background:#fff; }
.chat-rail-market { display:flex; flex-direction:column; gap:5px; font:700 11px/1.2 var(--w-sans); letter-spacing:.07em; text-transform:uppercase; color:#C9AFBC; }
.chat-rail-market select { min-height:44px; padding:0 10px; border:2px solid var(--w-ink); border-radius:12px; background:var(--w-cream); color:var(--w-ink); font:600 15px/1 var(--w-sans); text-transform:none; letter-spacing:0; }
.chat-rail-lang { display:flex; gap:6px; }
.chat-rail-lang a { display:flex; align-items:center; justify-content:center; min-width:44px; min-height:44px; border:2px solid #E58AB166; border-radius:999px; font-weight:800; }
.chat-rail-lang a[aria-current] { background:#E0558F; border-color:#E0558F; color:#fff; }
.chat-rail-links { display:flex; flex-direction:column; gap:2px; margin-top:auto; } .chat-rail-links a { display:flex; align-items:center; min-height:44px; color:#C9AFBC; font-weight:600; }
.chat-page .imm-col .imm-chips, .chat-page .imm-col .imm-trust { display:flex; }
.chat-page .imm-col .imm-trust { display:block; }
/* the intro-time portraits and rail only fit wide screens; between, the thread avatars carry the characters */
@media (min-width:821px) and (max-width:1259px) { .chat-page .imm-char { display:none; } } }
/* below 1260px the consent strip sits at the top: push the column down so it never covers the header controls */
@media (max-width:1259px) { body.chat-page .imm-stage { padding-top:var(--consent-h,0px); } }
@media (min-width:821px) and (max-height:620px) { .chat-page .imm-char { display:none; } }
@media (max-width:820px) {
  .chat-rail, .chat-page .imm-char { display:none; }
  body.chat-page .imm-stage { padding:var(--consent-h,0px) 0 0; }
  body.chat-page .imm-col { width:100%; padding:0; }
  .chat-page .imm-col .world-chat { border-width:0; border-radius:0; box-shadow:none; }
  /* one-line title and four 44px controls fit 360px: the thread avatars carry the faces, so the header drops its own */
  body.chat-page .imm-col .world-chat-head > img { display:none; }
  body.chat-page .imm-col .world-chat-head { gap:6px; padding:6px 10px 6px 14px; }
  .chat-page .imm-col .world-chat-head h2 { font-size:17px; white-space:nowrap; }
  .chat-page .imm-col .world-chat-head .world-market { display:block; }
  .chat-page .imm-col .world-market select { max-width:min(118px,30vw); text-overflow:ellipsis; }
  .chat-page .chat-head-new { order:3; display:flex; align-items:center; justify-content:center; width:44px; height:44px; padding:0; border:2px solid var(--w-ink); border-radius:50%; background:var(--w-gold-soft); color:var(--w-ink); cursor:pointer; }
  .chat-page .imm-col .imm-chips { display:flex; }
  .chat-page .imm-col .imm-trust { display:none; }
}
/* chat mode normally hides chips, trust line and status; the chat page keeps the chips (empty-state suggestions) and tucks the rest away */
body.chat-page .imm-col .imm-chips { display:flex; }
body.chat-page .imm-col .imm-trust { display:block; }
@media (max-width:820px) { body.chat-page .imm-col .imm-trust { display:none; } }
.chat-page .imm-col .world-product { max-width:100%; }
.chat-rail a:focus-visible, .chat-rail button:focus-visible, .chat-rail select:focus-visible, .chat-page .chat-head-new:focus-visible { outline:3px solid var(--w-gold); outline-offset:3px; }
body.chat-page.chat-started .imm-col .imm-chips { display:none; }