/* The guide lives over the running stream. Native dialog keeps background controls inert. */
html.hud-guide-active { overflow:hidden; scroll-behavior:auto!important; }
body:is(.hud-watch,.home-page) .room-guide { position:fixed; inset:0; width:100%; height:100dvh; max-width:none; max-height:none; margin:0; padding:0; border:0; overflow:hidden; background:transparent; color:var(--ui-text); font-family:var(--ui-font); }
.room-guide:not([open]) { display:none; }
.room-guide::backdrop { background:transparent; }
.room-guide.is-unanchored { background:#000c; }
.room-guide-spotlight { position:fixed; z-index:0; box-sizing:border-box; border:2px solid #b6b8ff; border-radius:22px; background:transparent; box-shadow:0 0 0 150vmax #000c,0 0 28px #7477f566,inset 0 0 18px #7477f512; pointer-events:none; }
body:is(.hud-watch,.home-page) .room-guide-card { position:fixed; z-index:1; box-sizing:border-box; display:flex; flex-direction:column; width:374px; max-width:calc(100vw - 32px); max-height:calc(100dvh - 32px); overflow:hidden; padding:24px; border:1px solid #5a5a704f; border-radius:24px; background:linear-gradient(145deg,#232328,#17171b); box-shadow:0 18px 70px #0009,inset 0 1px #ffffff0c; }
.room-guide-copy { min-height:0; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#7477f577 transparent; }
.room-guide-head,.room-guide-progress,.room-guide-actions { flex-shrink:0; }
.room-guide-head { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:16px; }
.room-guide-head span { font-size:11px; font-weight:800; letter-spacing:.13em; color:var(--ui-link); text-transform:uppercase; }
body:is(.hud-watch,.home-page) .room-guide button { font-family:inherit!important; text-transform:none!important; letter-spacing:normal!important; cursor:pointer; }
body:is(.hud-watch,.home-page) .room-guide-close { display:grid; place-items:center; width:32px; height:32px; padding:0; border:0; border-radius:50%; background:#ffffff08; color:var(--ui-muted); }
.room-guide-close svg { width:16px; height:16px; }
body:is(.hud-watch,.home-page) .room-guide-card h2 { margin:0 0 19px; padding:0; font:800 24px/1.25 var(--ui-font); letter-spacing:-.045em; color:var(--ui-text); text-transform:none; }
.room-guide-points { display:flex; flex-direction:column; gap:15px; margin:0; padding:0; list-style:none; }
.room-guide-points li { display:flex; flex-direction:column; gap:4px; }
.room-guide-points b { color:#eeeef5; font-size:14px; font-weight:700; }
.room-guide-points span { color:#bcbcc7; font-size:14px; line-height:1.6; }
.room-guide-progress { display:flex; align-items:center; justify-content:space-between; margin:24px 0 17px; padding-top:17px; border-top:1px solid #ffffff10; }
.room-guide-dots { display:flex; align-items:center; gap:5px; }
.room-guide-dots span { width:6px; height:6px; border-radius:8px; background:#ffffff26; }
.room-guide-dots .current { width:20px; background:var(--ui-accent); }
.room-guide-dots .complete { background:#7477f580; }
#room-guide-count { color:var(--ui-muted); font-size:12px; font-weight:600; font-variant-numeric:tabular-nums; }
.room-guide-actions { display:flex; align-items:center; gap:9px; }
body:is(.hud-watch,.home-page) .room-guide-actions button { min-height:42px; padding:0 16px; border:1px solid #ffffff1d; border-radius:12px; background:#ffffff05; font-size:14px; font-weight:700; color:var(--ui-text); }
body:is(.hud-watch,.home-page) .room-guide-actions .room-guide-skip { margin-right:auto; padding-left:0; border:0; background:none; color:var(--ui-muted); font-weight:500; }
body:is(.hud-watch,.home-page) .room-guide-actions .room-guide-next { min-width:82px; border-color:var(--ui-accent); background:var(--ui-accent); color:white; }
body:is(.hud-watch,.home-page) .room-guide button:disabled { opacity:.3; cursor:default; }
body:is(.hud-watch,.home-page) .room-guide button:not(:disabled):hover { filter:brightness(1.15); }
body:is(.hud-watch,.home-page) .room-guide button:focus-visible { outline:2px solid #d7d8ff; outline-offset:3px; }
@media(max-width:600px) {
  body:is(.hud-watch,.home-page) .room-guide-card { padding:20px; border-radius:20px; }
  .room-guide-head { margin-bottom:10px; }
  body:is(.hud-watch,.home-page) .room-guide-card h2 { font-size:22px; margin-bottom:14px; }
  .room-guide-points { gap:12px; }
  .room-guide-points li { display:block; }
  .room-guide-points b { margin-right:5px; }
  .room-guide-points span { line-height:1.5; }
  .room-guide-progress { margin-top:18px; padding-top:14px; }
}
@media(prefers-reduced-motion:no-preference) {
  .room-guide-spotlight { transition:left .2s ease,top .2s ease,width .2s ease,height .2s ease; }
  .room-guide-dots span { transition:width .2s ease,background .2s ease; }
}