.arena-lobby-toolbar { display:flex; justify-content:flex-end; margin:0 0 10px; }
.arena-howto-btn { min-height:44px; padding:0 14px; border:1px solid #635039; border-radius:12px; background:#171a1e; color:#f2f4f7; font:700 13px/1.2 Outfit,system-ui,sans-serif; }
/* The legacy slide container is retired; the parent opens createGuidedTour. */
.arena-tutorial { display:none !important; }
.guided-tour { position:fixed; inset:0; z-index:3000; pointer-events:none; }
.guided-tour--no-target { background:rgba(5,6,8,.72); }
.guided-tour__spotlight { position:fixed; box-sizing:border-box; border:2px solid #e9a23b; border-radius:12px; box-shadow:0 0 0 100vmax rgba(5,6,8,.72); pointer-events:none; }
.guided-tour__spotlight[hidden] { display:none; }
.guided-tour__popup { position:fixed; box-sizing:border-box; width:360px; padding:18px; border-radius:16px; background:#1e2227; color:#f2f4f7; box-shadow:0 16px 40px rgba(0,0,0,.45); pointer-events:auto; overflow:auto; overscroll-behavior:contain; scrollbar-color:#6b747f #1e2227; font:500 14px/1.5 Outfit,system-ui,sans-serif; overflow-wrap:anywhere; }
.guided-tour__title { margin:0 0 8px; color:#f2f4f7; font:700 18px/1.25 Outfit,system-ui,sans-serif; }
.guided-tour__text { margin:0; color:#b8bfc8; }
.guided-tour__footer { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:16px; }
.guided-tour__count { margin-left:auto; color:#b8bfc8; font-size:12px; font-variant-numeric:tabular-nums; }
.guided-tour__actions { display:flex; justify-content:flex-end; gap:8px; width:100%; }
.guided-tour__popup button { min-height:44px; padding:0 14px; border:1px solid #535b65; border-radius:12px; background:transparent; color:#f2f4f7; font:700 13px/1.2 Outfit,system-ui,sans-serif; cursor:pointer; }
.guided-tour__popup .guided-tour__skip { padding:0 8px; border-color:transparent; color:#b8bfc8; }
.guided-tour__popup .guided-tour__next { background:#e9a23b; border-color:#e9a23b; color:#16130c; }


.guided-tour__popup button:disabled { opacity:.45; cursor:default; }
.guided-tour__popup:focus-visible,.guided-tour__popup button:focus-visible,.arena-howto-btn:focus-visible { outline:2px solid #f5c070; outline-offset:3px; }
.guided-tour__popup ::selection { background:#e9a23b; color:#16130c; }
@media (max-width:420px) { .guided-tour__popup { padding:16px; } }
@media (prefers-reduced-motion:reduce) { .guided-tour__popup,.guided-tour__spotlight,.arena-howto-btn { animation:none; transition:none; scroll-behavior:auto; } }

/* Compact coachmark, isolated from the page's button styles. Never in document flow. */
.guided-tour .guided-tour__popup { padding:16px; border:1px solid var(--border); border-radius:18px; background:var(--bg-card,#171a1e); color:var(--text,#f2f4f7); box-shadow:0 12px 36px #0005; transition:top .26s cubic-bezier(.16,1,.3,1),left .26s cubic-bezier(.16,1,.3,1); }
.guided-tour .guided-tour__meta { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:-6px -4px 6px 0; }
.guided-tour .guided-tour__count { margin:0; font-size:11px; color:var(--text-sub,#9aa3ae); letter-spacing:.06em; }
.guided-tour .guided-tour__title { color:var(--text,#f2f4f7); font:700 17px/1.3 Outfit,system-ui,sans-serif; margin:0 0 8px; }
.guided-tour .guided-tour__text { color:var(--text-sub,#9aa3ae); font:400 13px/1.55 Outfit,system-ui,sans-serif; margin:0; }
.guided-tour .guided-tour__track { height:2px; border-radius:2px; background:var(--border); overflow:hidden; margin-top:16px; }
.guided-tour .guided-tour__progress { display:block; height:100%; background:#e9a23b; transform-origin:left; transition:transform .28s ease; }
.guided-tour .guided-tour__footer { margin-top:12px; }
.guided-tour .guided-tour__actions { width:100%; display:flex; justify-content:space-between; gap:10px; }
.guided-tour .guided-tour__popup button { appearance:none; min-height:40px; min-width:72px; padding:0 14px; border-radius:10px; font:600 13px/1 Outfit,system-ui,sans-serif; box-shadow:none; text-transform:none; letter-spacing:0; transition:background .16s,color .16s,transform .16s; }
.guided-tour .guided-tour__popup .guided-tour__skip { min-width:0; min-height:36px; padding:0 4px; color:var(--text-sub,#9aa3ae); background:transparent; border:0; font-size:11px; }
.guided-tour .guided-tour__popup .guided-tour__back { border:0; background:transparent; color:var(--text-sub,#9aa3ae); padding-left:0; text-align:left; }
.guided-tour .guided-tour__popup .guided-tour__next { background:#e9a23b; color:#17130c; border:1px solid #e9a23b; }
.guided-tour .guided-tour__popup .guided-tour__next:active { background:#d9922c; color:#17130c; transform:scale(.97); }
.guided-tour .guided-tour__popup .guided-tour__back:disabled { visibility:hidden; }
.guided-tour .guided-tour__spotlight { border-width:1px; box-shadow:0 0 0 100vmax #050608b8; transition:top .26s cubic-bezier(.16,1,.3,1),left .26s cubic-bezier(.16,1,.3,1),width .26s cubic-bezier(.16,1,.3,1),height .26s cubic-bezier(.16,1,.3,1); }
@media(hover:hover) { .guided-tour .guided-tour__popup .guided-tour__next:hover { background:#f1b854; color:#17130c; } }
@media(prefers-reduced-motion:reduce) { .guided-tour .guided-tour__popup,.guided-tour .guided-tour__spotlight,.guided-tour .guided-tour__progress,.guided-tour .guided-tour__popup button { transition:none; animation:none; } }
