/* 赛博산사 mobile chrome polish (2026-11-04). Loaded after game CSS. */
:root{--cs-bottom-clear:calc(env(safe-area-inset-bottom,0px) + 92px)}

/* Dialog polyfill (iOS without HTMLDialogElement.showModal) */
dialog:not([open]),
#wish-wall-dialog:not([open]),
.ema-wish-dialog:not([open]),
#room-dialog:not([open]),
#settings-dialog:not([open]),
#support-dialog:not([open]),
#people-dialog:not([open]){
  display:none!important;
  pointer-events:none!important;
}
/* Sheet layout without fit-content/translate — reliable on older iOS WebKit */
html.cs-need-dialog-poly dialog[open],
html.cs-need-dialog-poly dialog.cs-dlg-poly[open]{
  display:block!important;
  position:fixed!important;
  left:8px!important;
  right:8px!important;
  top:max(12px,env(safe-area-inset-top,0px))!important;
  bottom:max(12px,env(safe-area-inset-bottom,0px))!important;
  width:auto!important;
  max-width:none!important;
  height:auto!important;
  max-height:none!important;
  margin:0!important;
  transform:none!important;
  z-index:10120!important;
  overflow:auto!important;
  -webkit-overflow-scrolling:touch;
  visibility:visible!important;
  opacity:1!important;
  animation:none!important;
  pointer-events:auto!important;
  box-sizing:border-box!important;
  isolation:isolate;
}
html.cs-need-dialog-poly #room-dialog[open],
html.cs-need-dialog-poly #settings-dialog[open],
html.cs-need-dialog-poly #support-dialog[open],
html.cs-need-dialog-poly #people-dialog[open]{
  padding:18px 14px 16px!important;
}
html.cs-need-dialog-poly #wish-wall-dialog[open],
html.cs-need-dialog-poly dialog#wish-wall-dialog[open]{
  inset:0!important;
  left:0!important;right:0!important;top:0!important;bottom:0!important;
  width:100%!important;height:100%!important;
  max-width:none!important;max-height:none!important;
  margin:0!important;
  transform:none!important;border-radius:0!important;
}
.cs-dlg-poly-backdrop{
  position:fixed;inset:0;z-index:10110;background:#0a100ccc;
  -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);
  pointer-events:auto;
}
.cs-dlg-poly-backdrop[hidden]{display:none!important}
#cs-close-shield{
  position:fixed;inset:0;z-index:10200;background:transparent;
  touch-action:none;-webkit-tap-highlight-color:transparent;
}
#cs-close-shield[hidden]{display:none!important}
/* While a dialog is open, kill chrome hit pads / debug HUD that steal taps */
body.cs-dialog-visible #cs-chrome-hit,
body.cs-dialog-visible #cs-dbg-fab,
body.cs-dialog-visible #cs-dbg,
body.cs-dialog-visible #cs-walk-stick{
  display:none!important;
  pointer-events:none!important;
  visibility:hidden!important;
}
/* Close / pay controls must stay tappable */
dialog[open] .dialog-close,
dialog[open] .ema-close,
dialog[open] [data-wish-close],
dialog[open] #cyber-incense-pay,
dialog[open] .cyber-incense-amt,
dialog[open] .support-pay,
dialog[open] .solid-button,
dialog[open] .room-choice,
dialog[open] .ema-tab,
dialog[open] .ema-cat,
dialog[open] .ema-filter,
dialog[open] .ema-submit,
dialog[open] button,
dialog[open] a{
  position:relative;z-index:6;pointer-events:auto!important;
  touch-action:manipulation;-webkit-tap-highlight-color:transparent;
}
dialog[open] input,
dialog[open] textarea,
dialog[open] select{
  position:relative;z-index:8;pointer-events:auto!important;
  -webkit-user-select:text!important;user-select:text!important;
  touch-action:manipulation;-webkit-tap-highlight-color:rgba(0,0,0,.08);
}
dialog[open] .dialog-close,
dialog[open] .ema-close,
dialog[open] [data-wish-close]{
  min-width:44px;min-height:44px;
}

/* Hide BMC QR + Buy Me a Coffee CTA in incense / support dialog. */
#support-dialog .support-qr,
#support-dialog #support-link,
#support-dialog #support-bmc-divider,
#support-dialog #cyber-incense-support,
.support-qr[hidden]{display:none!important}

/* Controls hint: only shown once as a short toast (see cyber-mobile-ui.js). */
.game-hint[data-essential="false"]{opacity:0!important;visibility:hidden;transition:opacity .6s,visibility 0s .6s}
body.cs-hint-once .game-hint[data-essential="false"]{opacity:1!important;visibility:visible;transition:opacity .4s}
.game-hint[data-essential="false"]{padding:7px 14px;border-radius:999px;background:#1d2a23b8;width:max-content;max-width:calc(100vw - 32px)}

/* Moktak (added action) */
.game-modes .liquid-nav-source>#cs-moktak{position:relative}
.cs-merit-pop{position:absolute;left:50%;top:-6px;transform:translate(-50%,0);font-size:12px;font-weight:650;color:#fff0c8;text-shadow:0 1px 6px #06130dcc;pointer-events:none;white-space:nowrap;animation:cs-merit .9s ease-out forwards}
@keyframes cs-merit{0%{opacity:0;transform:translate(-50%,4px)}20%{opacity:1}100%{opacity:0;transform:translate(-50%,-26px)}}
#cs-moktak.is-tok svg{animation:cs-tok .18s ease-out}
@keyframes cs-tok{50%{transform:scale(.88) rotate(-6deg)}}

/* Bottom action labels never overflow (en/es/pt) */
.game-modes .liquid-nav-source>button>span:not(.dance-symbol):not(.cs-merit-pop){display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Recent offerings float: always above the bottom bar */
#cyber-incense-float{left:max(12px,env(safe-area-inset-left))!important;bottom:var(--cs-bottom-clear)!important;transition:opacity .6s}
#cyber-incense-float>div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#cyber-incense-float.cs-faded{opacity:0}

/* Mobile settings entry for language / sister sites (injected into settings dialog) */
.cs-net-row{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:46px;margin:6px 0 2px;padding:0 14px;border:1px solid #8a806840;border-radius:12px;background:transparent;color:inherit;font:inherit;font-size:14px;cursor:pointer}
.cs-net-row span:last-child{opacity:.6}
.cs-occ{display:none!important}
#game-presence-count{display:none!important}

/* Coarse-pointer / H5: hide top language even if viewport >820 (desktop width + touch) */
html.is-mobile-h5 #cyber-lang-switcher,
body.is-mobile-h5 #cyber-lang-switcher{
  display:none!important;visibility:hidden!important;pointer-events:none!important;
  width:0!important;height:0!important;min-width:0!important;margin:0!important;padding:0!important;
  overflow:hidden!important;border:0!important
}
/* Kill liquid lens circle on H5 even outside the 820px MQ */
html.is-mobile-h5 .liquid-nav-lens,
body.is-mobile-h5 .liquid-nav-lens{
  display:none!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important
}
html.is-mobile-h5 .game-entry-tools,
body.is-mobile-h5 .game-entry-tools{
  position:relative;z-index:9;pointer-events:auto!important
}

/* Phone H5 chrome: also keyed off .is-mobile-h5 so coarse pointers get the same layout */
@media (max-width:820px){
  html.is-mobile-h5 .game-header,
  body.is-mobile-h5 .game-header,
  .game-header{
    flex-wrap:nowrap!important;align-items:center!important;gap:6px!important;
    /* Sit clearly below notch / Dynamic Island / status bar */
    top:max(12px,calc(env(safe-area-inset-top,0px) + 10px))!important;
    left:max(10px,env(safe-area-inset-left,0px))!important;
    right:max(10px,env(safe-area-inset-right,0px))!important;
    /* Above wish labels (z:4) and idle beads-host (z:2) so room/wish/rice receive taps */
    z-index:20!important;
    touch-action:manipulation;
  }
  .game-tools,.game-entry-tools,.game-modes,.liquid-nav-source{pointer-events:auto!important;touch-action:manipulation}
  .game-header button,.game-tools button,.game-entry-tools button{
    pointer-events:auto!important;touch-action:manipulation;-webkit-tap-highlight-color:transparent
  }
  /* While beading, keep main chrome fully inert so it cannot cover beads-back */
  .is-beading .game-header,
  .is-beading .game-bottom,
  .is-beading .game-context,
  .is-beading .game-tools,
  .is-beading .game-entry-tools,
  .is-beading .game-modes{
    opacity:0!important;visibility:hidden!important;pointer-events:none!important
  }
  .is-beading .game-header button,
  .is-beading .game-tools button,
  .is-beading .game-entry-tools button,
  .is-beading .game-modes button,
  .is-beading #cyber-lang-switcher{
    pointer-events:none!important
  }

  /* Left: one pill = exit | room — keep above lang / wish labels so taps work */
  .game-entry-tools{
    position:relative;z-index:9;
    flex:0 1 auto!important;flex-basis:auto!important;min-width:0;max-width:48%;
    height:48px;padding:3px!important;gap:0!important;
    border:1px solid #effaff38;border-radius:28px;background:#27372f;
    box-shadow:0 6px 20px #05150e18,inset 0 1px #ffffff38;
    pointer-events:auto!important;
  }
  .game-entry-tools>#game-exit,.game-entry-tools>#game-room{
    border:0!important;background:transparent!important;box-shadow:none!important;
    -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
    pointer-events:auto!important;position:relative;z-index:1;
  }
  .game-entry-tools>#game-exit{width:42px;height:42px;flex:0 0 42px}
  .game-entry-tools>#game-room{
    min-height:42px!important;height:42px;padding:0 10px 0 4px!important;
    border-left:1px solid #ffffff2e!important;border-radius:0!important;min-width:0;flex:1 1 auto;
  }
  .game-entry-tools>#game-room>svg,.game-entry-tools>#game-room>span{display:none!important}
  .game-entry-tools>#game-room small{
    display:inline-flex!important;align-items:center;margin:0!important;padding:0 0 0 6px!important;
    border:0!important;font-size:14px!important;font-weight:650;letter-spacing:.01em;color:#fbfaf2;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;
  }
  .game-entry-tools #game-room-number{font-size:13px!important;font-weight:500;opacity:.9;flex:none}
  .game-entry-tools #game-room-name>i{flex:none;opacity:.75}
  .cs-occ{display:none!important}

  /* Right pill: wish + rice/support + sound + settings (lang/guide stay in settings) */
  .game-tools{
    position:relative;z-index:8;
    flex:0 0 auto!important;margin-left:auto!important;
    min-height:48px;padding:3px!important;border-radius:28px;
    pointer-events:auto!important;
  }
  .game-tools .liquid-nav-source{
    height:42px!important;gap:0!important;align-items:center;
    pointer-events:auto!important;
  }
  /* Kill top-chrome language entirely on phones — it overlaps exit/room and steals taps */
  #cyber-lang-switcher,
  .game-tools .liquid-nav-source>#cyber-lang-switcher,
  .game-tools #cyber-lang-switcher,
  .game-header #cyber-lang-switcher{
    display:none!important;visibility:hidden!important;pointer-events:none!important;
    width:0!important;height:0!important;min-width:0!important;margin:0!important;padding:0!important;
    overflow:hidden!important;border:0!important
  }
  .game-tools .liquid-nav-source>#game-people,
  .game-tools .liquid-nav-source>#game-guide,
  .game-tools #game-people,
  .game-tools #game-guide,
  .game-tools #cyber-network-settings-btn,
  .game-tools #game-nav,
  .game-tools .liquid-nav-source>#game-nav{display:none!important}
  .game-tools #cyber-network-settings-root{flex:0 0 0!important;width:0!important;min-width:0!important;margin:0!important;padding:0!important;border:0!important;order:9}
  .game-tools #game-photo,
  .game-tools .liquid-nav-source>#game-photo{order:1;display:flex!important;pointer-events:auto!important}
  .game-tools #game-wish,
  .game-tools .liquid-nav-source>#game-wish{order:2;display:flex!important;pointer-events:auto!important}
  .game-tools #game-support,
  .game-tools .liquid-nav-source>#game-support{order:3;display:flex!important;pointer-events:auto!important}
  .game-tools #game-sound,
  .game-tools .liquid-nav-source>#game-sound{order:4;display:flex!important;pointer-events:auto!important}
  .game-tools #game-settings,
  .game-tools .liquid-nav-source>#game-settings{order:5;display:flex!important;pointer-events:auto!important}
  .game-tools .liquid-nav-source>.tool{
    width:42px!important;min-width:42px!important;height:42px!important;
    flex:0 0 42px!important;
    pointer-events:auto!important;
    touch-action:manipulation!important;
  }
  .game-tools .liquid-nav-lens,
  .game-modes .liquid-nav-lens,
  .liquid-nav-lens{
    display:none!important;opacity:0!important;pointer-events:none!important;visibility:hidden!important
  }
  .game-tools.has-liquid-selection,
  .game-modes.has-liquid-selection,
  .is-lens-pressed,.is-lens-dragging{/* keep layout; lens already killed */}

  /* Chant invite under header, clear of tools */
  .game-context{
    top:calc(max(12px,env(safe-area-inset-top,0px) + 10px) + 56px)!important;
    left:max(12px,env(safe-area-inset-left,0px))!important;
    right:max(12px,env(safe-area-inset-right,0px))!important;
  }
  .chant-invite,.chant-banner{min-height:36px!important;padding:6px 14px!important;font-size:13px!important}

  /* Bottom bar tight to home indicator — avoid floating over a black void */
  .game-bottom{
    width:calc(100% - 20px)!important;max-width:440px;
    bottom:max(8px,calc(env(safe-area-inset-bottom,0px) + 4px))!important;
  }
  .game-modes .liquid-nav-source>button{flex:1 1 0!important;min-width:0!important;padding:5px 2px!important;min-height:52px}
  .game-modes .liquid-nav-source>button>span{font-size:12px}

  /* Wish-wall floating label: keep compact on phones */
  .wish-wall-label{
    max-width:min(240px,calc(100vw - 28px));
    padding:8px 12px!important;
    font-size:13px!important;
    line-height:1.25!important;
    z-index:5;
  }

  #cyber-incense-float{max-width:calc(100vw - 24px)!important}
  #cyber-incense-float>div{max-width:calc(100vw - 24px)}
  .game-toast{max-width:calc(100vw - 32px)}
}
@media (max-width:360px){
  .game-entry-tools>#game-room small{font-size:14px!important}
  .cs-occ{padding:0 9px 0 8px}
  .game-modes .liquid-nav-source>button>span{font-size:11px}
  .game-tools .liquid-nav-source>.tool{width:42px!important;min-width:42px!important;flex-basis:42px!important}
}

/* Mobile chrome debug HUD */
#cs-dbg-fab{
  position:fixed;z-index:10080;right:max(8px,env(safe-area-inset-right));
  bottom:calc(var(--cs-bottom-clear,92px) + 8px);
  width:44px;height:44px;border-radius:999px;border:1px solid #efe6d266;
  background:#1c241eef;color:#f3ead8;font:700 11px/1 system-ui,sans-serif;
  pointer-events:auto;touch-action:manipulation;-webkit-tap-highlight-color:transparent;
  box-shadow:0 8px 20px #00000066
}
#cs-dbg-fab.is-on{background:#988762;color:#1a1f18;border-color:#cbb789}
#cs-dbg{
  position:fixed;z-index:10081;left:8px;right:8px;
  top:max(8px,env(safe-area-inset-top));
  max-height:min(46vh,360px);overflow:auto;
  border:1px solid #efe6d255;border-radius:12px;
  background:#0d120fee;color:#e8f0d8;font:11px/1.35 ui-monospace,Menlo,monospace;
  box-shadow:0 12px 40px #00000088;pointer-events:auto
}
#cs-dbg[hidden]{display:none!important}
#cs-dbg .cs-dbg-bar{
  display:flex;align-items:center;gap:6px;padding:6px 8px;
  border-bottom:1px solid #ffffff18;position:sticky;top:0;background:#0d120ff5
}
#cs-dbg .cs-dbg-bar strong{flex:1;font-size:12px;color:#f5ecd2}
#cs-dbg .cs-dbg-bar button{
  appearance:none;border:1px solid #ffffff33;background:#ffffff12;color:inherit;
  border-radius:8px;min-height:28px;padding:0 8px;font:600 11px/1 system-ui,sans-serif;
  touch-action:manipulation
}
#cs-dbg .cs-dbg-pre{
  margin:0;padding:8px;white-space:pre-wrap;word-break:break-word
}

/* Invisible hit pads over top chrome — sit above WebGL so iOS taps always land */
#cs-chrome-hit{
  position:fixed;inset:0;z-index:10050;pointer-events:none;
}
#cs-chrome-hit[hidden]{display:none!important}
#cs-chrome-hit>[data-cs-hit]{
  position:fixed;margin:0;padding:0;border:0;border-radius:14px;
  background:transparent;pointer-events:auto!important;
  touch-action:manipulation;-webkit-tap-highlight-color:transparent;
  appearance:none;-webkit-appearance:none;cursor:pointer;
}
body.sansa-landing-active #cs-chrome-hit,
body:has(.sansa-game.is-beading) #cs-chrome-hit{display:none!important}
/* Dedicated beads-back hit pad — above canvas / chrome while beading */
#cs-beads-back-hit{
  position:fixed;z-index:10090;margin:0;padding:0;border:0;background:transparent;
  -webkit-tap-highlight-color:transparent;touch-action:manipulation;pointer-events:auto!important
}
#cs-beads-back-hit[hidden]{display:none!important}
body:not(:has(.sansa-game.is-beading)) #cs-beads-back-hit{display:none!important;pointer-events:none!important}

/* Virtual walk stick — Honor-of-Kings style, bottom-left above action bar */
.cs-walk-stick{
  position:fixed;z-index:40;
  left:max(10px,env(safe-area-inset-left,0px));
  bottom:calc(var(--cs-bottom-clear,92px) + 6px);
  width:96px;height:96px;
  touch-action:none;-webkit-user-select:none;user-select:none;
  pointer-events:auto!important;
  opacity:.92;
  transition:opacity .2s;
}
.cs-walk-stick[hidden]{display:none!important}
.cs-walk-stick-base{
  position:relative;width:100%;height:100%;border-radius:50%;
  border:1.5px solid #f0e6d244;
  background:
    radial-gradient(circle at 50% 42%,#ffffff14,#00000000 55%),
    #1a241ccc;
  box-shadow:0 10px 28px #00000055, inset 0 1px #ffffff22;
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
}
.cs-walk-stick-cross{
  position:absolute;inset:18%;border-radius:50%;
  background:
    linear-gradient(#ffffff18,#ffffff18) center/2px 42% no-repeat,
    linear-gradient(#ffffff18,#ffffff18) center/42% 2px no-repeat;
  pointer-events:none;opacity:.55;
}
.cs-walk-stick-knob{
  position:absolute;left:50%;top:50%;width:46%;height:46%;
  border-radius:50%;
  transform:translate(-50%,-50%);
  border:1px solid #efe6d266;
  background:radial-gradient(circle at 35% 30%,#d8c7a0aa,#3d4a40ee 70%);
  box-shadow:0 4px 14px #00000066, inset 0 1px #ffffff33;
  pointer-events:none;
  transition:transform .05s linear;
}
.cs-walk-stick.is-active{opacity:1}
.cs-walk-stick.is-active .cs-walk-stick-knob{transition:none;border-color:#f5ecd28a}
/* Only hide stick for beads / landing / explicit class — NOT for stuck opacity:0 dialogs */
.sansa-game.is-beading ~ .cs-walk-stick,
body:has(.sansa-game.is-beading) .cs-walk-stick,
body.sansa-landing-active .cs-walk-stick,
body.cs-dialog-visible .cs-walk-stick{
  display:none!important;pointer-events:none!important
}
@media (min-width:821px) and (pointer:fine){
  html:not(.is-mobile-h5) body:not(.is-mobile-h5) .cs-walk-stick{display:none!important}
}
@media (max-width:360px){
  .cs-walk-stick{width:84px;height:84px}
}

/* Donation reminder card (cyber-donate-remind.js) */
.cs-remind{position:fixed;z-index:10040;left:50%;bottom:var(--cs-bottom-clear);transform:translate(-50%,12px);width:min(380px,calc(100vw - 24px));padding:18px 18px 14px;border:1px solid #e3d3b340;border-radius:20px;background:#f5f1e8f5;color:#3d3f36;box-shadow:0 14px 40px #00000040;font:14px/1.55 "Sansa Quiet UI",system-ui,-apple-system,sans-serif;opacity:0;transition:opacity .35s,transform .35s}
.cs-remind.is-open{opacity:1;transform:translate(-50%,0)}
.cs-remind h3{margin:0 0 6px;font-size:16px;font-weight:650;letter-spacing:.01em}
.cs-remind p{margin:0 0 14px;color:#55584b}
.cs-remind-actions{display:flex;flex-direction:column;gap:8px}
.cs-remind-actions button,.cs-remind-actions a{display:flex;align-items:center;justify-content:center;min-height:44px;padding:0 14px;border-radius:12px;border:1px solid #8a806855;background:transparent;color:#3d3f36;font:inherit;font-weight:600;text-decoration:none;cursor:pointer;text-align:center}
.cs-remind-actions .cs-primary{background:#3d4638;color:#f5f1e8;border-color:#3d4638}
.cs-remind-actions .cs-bmc{background:#ffdd00;border-color:#e6c600;color:#1f1f1f}
.cs-remind-actions .cs-later{border:0;min-height:36px;font-weight:500;color:#6b6e60}
.cs-remind-close{position:absolute;top:8px;right:8px;width:36px;height:36px;border:0;border-radius:50%;background:transparent;color:#6b6e60;font-size:20px;line-height:1;cursor:pointer}
@media (min-width:700px){.cs-remind{left:auto;right:24px;transform:translate(0,12px)}.cs-remind.is-open{transform:none}}
@media (prefers-reduced-motion:reduce){.cs-remind,.cs-merit-pop,#cs-moktak.is-tok svg{transition:none;animation:none}}
.game-header:has(#cyber-network-settings-panel.is-open){z-index:6!important}

/* Coming-soon special temples */
.room-choice.is-coming-soon{opacity:.55;filter:grayscale(1);cursor:not-allowed}
.room-choice.is-coming-soon strong,.room-choice.is-coming-soon .room-choice-detail{color:#8a8a82!important}
.room-choice strong{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.room-flag{display:inline-flex;width:22px;height:15px;flex:none;border-radius:3px;overflow:hidden;box-shadow:0 0 0 1px #ffffff26}
.room-flag svg{width:100%;height:100%;display:block}
.room-country{font-size:11px;font-weight:500;line-height:1.4;color:var(--regular-muted,#8B7B65);margin-left:auto;letter-spacing:.02em}

/* —— Wish Wall · Ema wooden panel —— */
.wish-wall-labels{position:fixed;inset:0;pointer-events:none;z-index:4}
.wish-wall-label{position:fixed;left:0;top:0;pointer-events:auto;margin:0;padding:7px 14px;border:1px solid #efe6d26a;border-radius:999px;background:#2a352ccc;color:#f6f0e2;font:600 13px/1.2 system-ui,sans-serif;letter-spacing:.04em;cursor:pointer;box-shadow:0 8px 24px #0a120c55;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:4}
.wish-wall-label:hover,.wish-wall-label:focus-visible{background:#354338e6;outline:none}
/* Beads / dialogs: fixed wish labels sit above the game shell and steal taps */
.is-beading .wish-wall-labels,
.is-beading .wish-wall-label,
/* Use body class — :has([open]) can stick on some iOS WebKits after close */
body.cs-wish-open .wish-wall-labels,
body.cs-wish-open .wish-wall-label{
  display:none!important;pointer-events:none!important;visibility:hidden!important
}

/* Beads host: stay UNDER header while idle so iOS hit-testing reaches room/exit.
   Only lift above chrome when actually beading. */
#beads-host{
  position:absolute;inset:0;z-index:2;pointer-events:none;
}
.sansa-game.is-beading #beads-host,
#beads-host:has(.sansa-beads-view:not([hidden])),
#beads-host:has(.sansa-beads-view.is-visible){
  z-index:80!important;
  pointer-events:auto!important;
}
.sansa-beads-view{
  z-index:80!important;
  pointer-events:auto!important;
}
.beads-header{
  z-index:5!important;
  top:max(14px,calc(env(safe-area-inset-top,0px) + 12px))!important;
  left:max(12px,env(safe-area-inset-left,0px))!important;
  right:max(12px,env(safe-area-inset-right,0px))!important;
  pointer-events:none!important;
}
.beads-back,.beads-sound{
  pointer-events:auto!important;
  touch-action:manipulation!important;
  -webkit-tap-highlight-color:transparent;
  position:relative;
  z-index:6;
}
.beads-back{
  min-height:48px!important;
  min-width:96px!important;
  padding:0 16px 0 12px!important;
}

.ema-wish-backdrop{position:fixed;inset:0;z-index:40;background:#0c0a08c7;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
/* Game CSS dialog-in only has 0%{opacity:0} — on iOS it freezes there (tap → blue lens, no panel).
   Kill the animation entirely and force visible. */
@keyframes dialog-in{
  0%{opacity:1;transform:none}
  100%{opacity:1;transform:none}
}
.game-dialog[open],
dialog.game-dialog[open],
dialog[open].game-dialog,
#room-dialog[open],
#settings-dialog[open],
#people-dialog[open],
#support-dialog[open],
#wish-wall-dialog[open],
.ema-wish-dialog.wish-wall-dialog[open],
.ema-wish-dialog.game-dialog[open]{
  opacity:1!important;
  transform:none!important;
  visibility:visible!important;
  animation:none!important;
}
/* Phone: room picker must be a readable full-width sheet with probe list */
@media (max-width:820px){
  #room-dialog.game-dialog,
  #room-dialog[open]{
    width:calc(100vw - 16px)!important;
    max-width:calc(100vw - 16px)!important;
    max-height:min(88dvh,760px)!important;
    margin:max(12px,env(safe-area-inset-top,0px)) auto max(12px,env(safe-area-inset-bottom,0px))!important;
    padding:18px 14px 16px!important;
    box-sizing:border-box;
  }
  #room-dialog .room-list{
    grid-template-columns:1fr!important;
    max-height:min(58dvh,520px)!important;
    gap:10px!important;
  }
  #room-dialog .room-choice{
    min-height:64px!important;
    padding:12px 14px!important;
  }
  #room-dialog .room-directory-heading{
    flex-wrap:wrap;gap:8px;font-size:14px!important
  }
  #room-dialog #room-refresh{
    min-height:40px!important;padding:0 12px!important;font-weight:600
  }
}
.ema-wish-dialog.wish-wall-dialog,.ema-wish-dialog.game-dialog{
  width:min(1080px,calc(100vw - 24px));max-width:1080px;height:min(720px,85vh);max-height:85vh;padding:0;
  border:1px solid #5a4a36aa;border-radius:16px;background:#29251F;color:#F1E8D8;
  overflow:hidden;box-shadow:0 28px 90px #00000099, inset 0 1px 0 #ffffff0d;
  opacity:1;
  animation:dialog-in .25s cubic-bezier(.22,1,.36,1) forwards;
}
.ema-wish-dialog::backdrop{background:#0c0a08cc;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.ema-shell{display:flex;flex-direction:column;height:100%;max-height:85vh;position:relative;background:
  radial-gradient(120% 80% at 50% -10%,#3a3228 0%,#29251F 55%);overflow:hidden}
.ema-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1px solid #403326;background:linear-gradient(180deg,#342c24,#29251Fee);z-index:3;flex:none}
.ema-brand{display:flex;gap:10px;align-items:center;min-width:0}
.ema-lotus{display:inline-flex;width:28px;height:28px;flex:none;color:#B99A62;opacity:.92}
.ema-lotus svg{width:100%;height:100%;display:block}
.ema-header h2{margin:0;font:600 22px/1.1 "Cormorant Garamond","Noto Serif SC",serif;color:#F1E8D8;letter-spacing:.02em}
.ema-sub{margin:2px 0 0;font:400 12px/1.3 system-ui,-apple-system,"PingFang SC",sans-serif;color:#8B7B65}
.ema-header-right{display:flex;align-items:center;gap:8px;flex:none}
.ema-count-pill{font:600 11px/1 system-ui,sans-serif;color:#B99A62;border:1px solid #B99A6244;padding:6px 10px;border-radius:999px;background:#40332655;white-space:nowrap}
.ema-close{flex:none;min-width:36px;min-height:36px;border:0;background:transparent;color:#F1E8D8;font-size:22px;line-height:1;cursor:pointer;border-radius:8px}
.ema-close:hover,.ema-close:focus-visible{background:#ffffff12;outline:none}

.ema-body{flex:1;min-height:0;display:flex;flex-direction:column;padding:10px 14px 12px;gap:10px;overflow:hidden}
.ema-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;flex:none}
.ema-stat{padding:8px 10px;border-radius:8px;background:#40332655;border:1px solid #5a4a3633}
.ema-stat span{display:block;font:500 10px/1.2 system-ui,sans-serif;color:#8B7B65;letter-spacing:.04em;text-transform:uppercase}
.ema-stat strong{display:block;margin-top:4px;font:600 20px/1 "Cormorant Garamond",serif;color:#B99A62}

.ema-tabs{display:flex;gap:6px;flex:none}
.ema-tab{padding:8px 18px;border-radius:999px;border:1px solid #5a4a36;background:transparent;color:#D9CBB5;font:600 13px/1 system-ui,sans-serif;cursor:pointer}
.ema-tab.is-active{border-color:#B99A62;color:#B99A62;background:#B99A6214}

.ema-main{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}

.ema-compose{margin:0;padding:14px 14px 12px;border-radius:12px;background:linear-gradient(180deg,#F6EEE0,#F1E8D8 40%,#EADFCC);color:#40362B;box-shadow:inset 0 0 0 1px #D9CBB5,0 8px 22px #00000033;position:relative;display:flex;flex-direction:column;min-height:0;overflow:auto;flex:1}
.ema-compose::before{content:"";position:absolute;inset:8px;border:1px solid #D9CBB566;border-radius:8px;pointer-events:none}
.ema-compose h3{margin:0 0 4px;font:600 20px/1.15 "Cormorant Garamond","Noto Serif SC",serif;color:#40362B;position:relative;flex:none}
.ema-hint{margin:0 0 10px;font:400 12px/1.4 system-ui,-apple-system,"PingFang SC",sans-serif;color:#8B7B65;position:relative}
.ema-cats{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 10px;position:relative;flex:none}
.ema-cat{display:inline-flex;align-items:center;gap:5px;padding:6px 9px;border-radius:999px;border:1px solid #D9CBB5;background:#fffdf8aa;color:#40362B;font:600 11px/1 system-ui,sans-serif;cursor:pointer}
.ema-cat em{font-style:normal}
.ema-cat .ema-ico{display:inline-flex;width:12px;height:12px;opacity:.75}
.ema-cat .ema-ico svg{width:100%;height:100%}
.ema-cat.is-active{border-color:#B99A62;color:#6d5428;box-shadow:inset 0 0 0 1px #B99A62;background:#f7efd8}
.ema-cat.is-active .ema-ico{opacity:1;color:#B99A62}
.ema-write{display:block;position:relative;flex:1;min-height:0}
.ema-write textarea{width:100%;height:100%;min-height:84px;max-height:140px;box-sizing:border-box;padding:10px 12px;border:1px solid #D9CBB5;border-radius:8px;background:#fffdf8;color:#40362B;font:400 14px/1.5 "Noto Serif SC","Noto Serif",serif;resize:none;outline:none}
.ema-write textarea:focus{border-color:#B99A62;box-shadow:0 0 0 3px #B99A6222}
.ema-compose-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px;flex-wrap:wrap;position:relative;flex:none}
.ema-compose-left{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ema-anon,.ema-public{display:inline-flex;align-items:center;gap:6px;font:500 12px/1 system-ui,sans-serif;color:#8B7B65;cursor:pointer}
.ema-anon input,.ema-public input{accent-color:#403326;width:14px;height:14px}
.ema-char{font:500 11px/1 system-ui,sans-serif;color:#8B7B65;font-variant-numeric:tabular-nums}
.ema-submit{min-height:40px;padding:0 16px;border:0;border-radius:999px;background:#403326;color:#B99A62;font:650 13px/1 system-ui,sans-serif;cursor:pointer;transition:box-shadow .22s ease,background .15s}
.ema-submit:hover{box-shadow:0 0 18px #B99A6255;background:#4a3b2c}
.ema-submit.is-loading{opacity:.72;pointer-events:none}
.ema-submit.is-loading::after{content:"";display:inline-block;width:11px;height:11px;margin-left:7px;border:2px solid #B99A6644;border-top-color:#B99A62;border-radius:50%;animation:emaSpin .7s linear infinite;vertical-align:-1px}
.wish-status{margin:8px 0 0;font-size:12px;color:#8B7B65;position:relative;flex:none}
.wish-status.is-error{color:#c46a55}

.ema-feed{min-height:0;display:flex;flex-direction:column;overflow:hidden;padding:2px 2px 0;flex:1}
.ema-feed-head{flex:none}
.ema-feed h3{margin:0 0 2px;font:600 18px/1.15 "Cormorant Garamond","Noto Serif SC",serif;color:#F1E8D8}
.ema-feed .ema-hint{margin:0 0 8px;color:#8B7B65;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.ema-filters{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 8px;flex:none}
.ema-filter{padding:5px 10px;border-radius:999px;border:1px solid #5a4a36;background:transparent;color:#D9CBB5;font:600 11px/1 system-ui,sans-serif;cursor:pointer}
.ema-filter.is-active{border-color:#B99A62;color:#B99A62;background:#B99A6214}
.ema-feed-status{margin:0 0 6px;font:400 12px/1.3 system-ui,sans-serif;color:#8B7B65;min-height:1em;flex:none}
.ema-feed-scroll{flex:1;min-height:0;overflow:auto;padding-right:2px;scrollbar-width:thin;scrollbar-color:#5a4a36 transparent;-webkit-overflow-scrolling:touch}
.ema-feed-scroll::-webkit-scrollbar{width:6px}
.ema-feed-scroll::-webkit-scrollbar-thumb{background:#5a4a36aa;border-radius:6px}

.ema-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;align-content:start}
.ema-card{position:relative;display:flex;flex-direction:column;gap:8px;min-height:118px;max-height:150px;padding:12px 12px 10px;border-radius:8px;color:#40362B;
  background:
    radial-gradient(circle at 50% 7px,#00000022 0 2.5px,transparent 3.5px),
    repeating-linear-gradient(92deg,#00000008 0 1px,transparent 1px 7px),
    linear-gradient(145deg,#d8be95 0%,#C9AD82 46%,#b89768 100%);
  box-shadow:0 8px 16px #00000044, inset 0 1px 0 #ffffff33;
  transform:rotate(calc((var(--r,0) - .5)*1.6deg))}
.ema-card:nth-child(3n+1){--r:.18}.ema-card:nth-child(3n+2){--r:.72}.ema-card:nth-child(3n){--r:.44}
.ema-card-top{display:flex;align-items:center;gap:6px;font:600 10px/1 system-ui,sans-serif;color:#6d5428;letter-spacing:.04em;text-transform:uppercase;flex:none}
.ema-card-icon{display:inline-flex;width:12px;height:12px;opacity:.85;color:#6d5428}
.ema-card-icon svg{width:100%;height:100%}
.ema-card-text{margin:0;flex:1;min-height:0;overflow:hidden;font:400 13px/1.45 "Noto Serif SC","Noto Serif",serif;white-space:pre-wrap;word-break:break-word;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical}
.ema-card-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:6px;flex:none}
.ema-card-foot strong{display:block;font:650 11px/1.2 system-ui,sans-serif;color:#40362B}
.ema-card-foot time{display:block;margin-top:2px;font:400 10px/1 system-ui,sans-serif;color:#8B7B65}
.ema-bless{border:0;background:#00000012;color:#6d5428;border-radius:999px;padding:5px 8px;font:600 11px/1 system-ui,sans-serif;cursor:pointer;display:inline-flex;align-items:center;gap:4px}
.ema-bless svg{width:11px;height:11px}
.ema-bless.is-active{color:#8a3d2f;background:#8a3d2f1c}
.ema-bless.is-active svg{fill:currentColor}

.ema-foot{margin-top:8px;padding-top:6px;text-align:center;color:#8B7B65;flex:none;border-top:1px solid #40332666}
.ema-foot p{margin:0;font:400 12px/1.4 "Cormorant Garamond","Noto Serif SC",serif;font-style:italic;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ema-foot-ornament{display:none}

.ema-success{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:24px;background:#29251Ff5;text-align:center}
.ema-success[hidden]{display:none!important}
.ema-success.is-show{animation:emaIn .7s ease}
.ema-success-glow{position:absolute;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,#B99A6238,transparent 68%);pointer-events:none;animation:emaGlow 1.4s ease}
.ema-card-success{width:min(260px,78%);z-index:1;animation:emaFloat .85s ease;transform:none!important;max-height:none}
.ema-success h3{margin:8px 0 0;font:600 22px/1.25 "Cormorant Garamond","Noto Serif SC",serif;color:#F1E8D8;z-index:1}
.ema-success p{margin:0;color:#8B7B65;z-index:1;font:400 13px/1.45 system-ui,sans-serif}
.ema-return{z-index:1;margin-top:6px;min-height:40px;padding:0 18px;border-radius:999px;border:1px solid #B99A62;background:transparent;color:#B99A62;font:650 13px/1 system-ui,sans-serif;cursor:pointer}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
@keyframes emaIn{from{opacity:0}to{opacity:1}}
@keyframes emaFloat{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes emaGlow{from{opacity:0;transform:scale(.82)}to{opacity:1;transform:scale(1)}}
@keyframes emaSpin{to{transform:rotate(360deg)}}

@media (max-width:900px){
  .ema-wish-dialog.wish-wall-dialog{width:calc(100vw - 14px);height:min(760px,90vh);max-height:90vh;border-radius:14px}
  .ema-shell{max-height:90vh}
  .ema-grid{grid-template-columns:1fr}
}
@media (max-width:720px){
  /* True edge-to-edge sheet — kills the thin white side/top gap from
     native <dialog> centering + .game-dialog light borders */
  .ema-wish-dialog.wish-wall-dialog,
  .ema-wish-dialog.game-dialog,
  dialog#wish-wall-dialog{
    position:fixed!important;
    inset:0!important;
    left:0!important;right:0!important;top:0!important;bottom:0!important;
    width:100%!important;width:100dvw!important;
    max-width:none!important;
    height:100%!important;height:100dvh!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    box-sizing:border-box!important;
    opacity:1!important;transform:none!important;
    animation:none!important;
  }
  .ema-wish-dialog.wish-wall-dialog[open],
  .ema-wish-dialog.game-dialog[open],
  dialog#wish-wall-dialog[open]{
    opacity:1!important;transform:none!important;
  }
  .ema-wish-dialog::backdrop,
  dialog#wish-wall-dialog::backdrop{
    background:#29251F!important;
  }
  .ema-wish-backdrop{background:#29251F;display:none!important}
  .ema-shell{max-height:none!important;height:100%!important;min-height:100%;border:0;border-radius:0}
  .ema-header{
    padding:10px 12px;
    padding-top:max(10px,env(safe-area-inset-top,0px));
    border-radius:0;
  }
  .ema-header h2{font-size:18px}
  .ema-count-pill{display:none}
  .ema-body{padding:8px 10px max(12px,env(safe-area-inset-bottom,0px));gap:8px;overflow:auto}
  .ema-compose{overflow:visible}
  .ema-write textarea{max-height:96px;min-height:72px;height:72px}
  .ema-feed{min-height:220px}
  .ema-feed-scroll{max-height:none}
  .ema-feed .ema-hint{display:none}
  .ema-submit{width:100%}
  .ema-compose-bar{align-items:stretch}
  .ema-compose-left{width:100%;justify-content:space-between}
  .ema-grid{grid-template-columns:1fr}
  .ema-foot p{white-space:normal}
}


/* SEO landing → temple handoff overrides */
html.sansa-in-temple,
body.sansa-in-temple{
  height:100%!important;
  height:100dvh!important;
  min-height:-webkit-fill-available;
  max-height:none!important;
  overflow:hidden!important;
  overscroll-behavior:none!important;
}
body.sansa-in-temple #sansa-game-shell,
body.sansa-in-temple #app{
  height:100%!important;
  height:100dvh!important;
  min-height:-webkit-fill-available;
  max-height:none!important;
  overflow:hidden!important;
}
body.sansa-in-temple #sansa-seo{display:none!important}
html.sansa-landing-active{
  overflow:auto!important;
  overflow-y:scroll!important;
  height:auto!important;
  max-height:none!important;
}
body.sansa-landing-active{
  overflow:auto!important;
  overflow-x:hidden!important;
  height:auto!important;
  max-height:none!important;
  min-height:100dvh;
}
body.sansa-landing-active #app{
  height:100dvh!important;
  overflow:hidden!important;
}
body.sansa-landing-active #sansa-seo{
  position:relative;
  z-index:2;
}
#sansa-seo{position:relative;z-index:2}


/* hide retired game-nav */
#game-nav,.game-tools #game-nav{display:none!important}


/* Landing feature chips (mobile polish shared) */
body.sansa-landing-active .sansa-game-shell canvas{opacity:1}