/* The source site's CSS supplies the visual design; these styles support the demo. */
[hidden] { display:none!important; }
.demo-badge { position:fixed; z-index:999; right:14px; bottom:14px; display:flex; align-items:center; gap:7px; padding:7px 11px; background:#17172bed; border:1px solid #47437c; border-radius:8px; color:#d7d4f3; font:12px/1.3 Arial,sans-serif; box-shadow:0 3px 18px #0004; }
.demo-badge::before { content:''; width:6px; height:6px; background:#a398ff; border-radius:50%; }
.demo-dialog,.demo-auth-dialog { margin:auto; width:min(480px,calc(100% - 32px)); max-height:90dvh; padding:28px; color:#fff; border:1px solid #393550; border-radius:16px; background:#17152e; box-shadow:0 30px 100px #0008; overflow:auto; }
.demo-dialog::backdrop,.demo-auth-dialog::backdrop { background:#030314ba; backdrop-filter:blur(8px); }
.demo-dialog h2 { font-size:26px; font-weight:700; margin:8px 32px 16px 0; }
.demo-dialog p { color:#b2aec7; line-height:1.6; font-size:15px; }
.demo-dialog .demo-close { position:absolute; top:15px; right:15px; color:#b4b0ca; background:#27233e; border:0; border-radius:8px; width:30px; height:30px; font-size:23px; cursor:pointer; }
.demo-dialog .demo-cover { width:130px; height:175px; object-fit:cover; border-radius:10px; margin:8px auto 18px; display:block; }
.demo-dialog .demo-primary { width:100%; border:0; border-radius:8px; padding:13px 18px; font-weight:700; color:white; background:#6157fa; margin-top:20px; cursor:pointer; }
.demo-auth-dialog { padding:20px 0 0; }
.demo-auth-note { color:#b4afcf; font-size:13px; padding:0 24px 12px; }
.demo-auth-dialog > .h-full { height:auto; }
.demo-auth-dialog input:not([type="checkbox"]) { background:#121731; outline:1px solid #303653; color:#fff; }
.demo-auth-dialog input:focus { outline:2px solid #7970f7; }
.demo-auth-dialog .demo-form-status { padding:12px 0; color:#b0f1bd; font-size:14px; }
.demo-auth-dialog > button.demo-close { position:absolute; right:12px; top:9px; border:none; background:transparent; color:#b4afcf; font-size:24px; z-index:50; }
.demo-originals-menu { position:fixed; z-index:120; top:76px; left:130px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; width:390px; padding:16px; border:1px solid #3b3558; border-radius:12px; background:#17142d; box-shadow:0 20px 50px #0008; }
.demo-originals-menu a { display:flex; align-items:center; gap:8px; border-radius:8px; padding:8px; color:#e2def4; font-size:13px; font-weight:600; }
.demo-originals-menu a:hover { background:#2b2545; }
.demo-originals-menu img { width:30px; height:40px; border-radius:4px; object-fit:cover; }
.demo-chat-closed .demo-chat-column { display:none!important; }
.demo-chat-mobile { display:none!important; }
.demo-chat-backdrop { display:none!important; }
.demo-chat-forced .demo-chat-mobile { display:block!important; }
.demo-chat-closed { --duel-chat-width:0px!important; }
.demo-chat-open { position:fixed; left:16px; bottom:20px; z-index:200; background:#282443; border:1px solid #48406e; color:#ddd7f5; border-radius:8px; padding:10px 16px; font-weight:600; cursor:pointer; }
.demo-search-status { color:#a09ab9; font-size:14px; margin:10px 0 18px; }
.demo-grid .flex-no-wrap { display:grid!important; grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:16px; overflow:visible!important; }
.demo-grid [data-testid="slots-list-tile"] { width:100%!important; min-width:0!important; max-width:none!important; height:auto!important; }
[data-demo-category-tab][aria-selected="true"],.demo-auth-dialog [role="tab"][aria-selected="true"] { color:white!important; }
.demo-category-tablist .tab-indicator-slide,.demo-auth-dialog .tab-indicator-slide { transition:transform .2s cubic-bezier(.4,0,.2,1),width .2s cubic-bezier(.4,0,.2,1); border-radius:8px!important; }
.demo-message { margin:8px 16px; padding:10px 12px; background:#19172d; color:#bdb6d3; border-radius:8px; font-size:13px; line-height:1.5; }
body { padding-right:0!important; }
.demo-wordmark { display:inline-block; color:#fff; font-size:30px; line-height:1.1; letter-spacing:-1.1px; font-weight:850; transition:filter .15s ease; }
a:hover .demo-wordmark { filter:brightness(1.2); }
.demo-originals-heading { color:#fff; font-size:32px; font-weight:800; font-style:italic; line-height:1.25; letter-spacing:-.8px; margin:0 0 32px; text-align:center; }
.demo-original-card h4 { font-size:11px; letter-spacing:-.3px; white-space:nowrap; }
/* Recreate the interactive layers that a static HTML capture cannot preserve. */
.demo-original-card { outline:none; perspective:800px; }
.demo-original-card [data-testid="game-card-container"] { transform:rotateX(var(--demo-tilt-y,0deg)) rotateY(var(--demo-tilt-x,0deg)); transition:transform .22s ease,filter .15s ease,box-shadow .2s ease; }
.demo-original-card:is(:hover,:focus-visible) [data-testid="game-card-container"] { filter:brightness(1.15); box-shadow:inset 0 0 0 1px #ffffff28,0 8px 24px #0003; }
.demo-original-card:is(:hover,:focus-visible) [data-testid="game-card-container"] > img { animation:demo-art-float 2.8s ease-in-out infinite; }
.demo-original-card .demo-card-motion { pointer-events:none; opacity:0; mix-blend-mode:screen; transition:opacity .18s ease; }
.demo-original-card:is(:hover,:focus-visible) .demo-card-motion { opacity:1; }
.demo-original-card:focus-visible [data-testid="game-card-container"],[data-demo-game]:focus-visible { outline:2px solid #a09aff; outline-offset:-2px; }
@keyframes demo-art-float { 0%,100% { transform:scale(1.05) translateY(0); } 50% { transform:scale(1.07) translateY(-1.2%); } }
[data-testid="slots-list-tile"] { transition:filter .18s ease,transform .18s ease; cursor:pointer; }
[data-testid="slots-list-tile"]:is(:hover,:focus-visible) { filter:brightness(1.13); }
[data-testid="slots-list-tile"]:is(:hover,:focus-visible) > img { transform:scale(1.035); }
[data-testid="slots-list-tile"]:active { transform:scale(.98); }
[data-demo-category-tab]:hover:not([aria-selected="true"]) { background:#ffffff08; color:#fff; }
.demo-originals-menu a { transition:background .15s ease,transform .15s ease; }
.demo-originals-menu a:is(:hover,:focus-visible) { background:#2b2545; transform:translateY(-2px); outline:none; }
.demo-originals-menu a img { transition:transform .2s ease; }
.demo-originals-menu a:is(:hover,:focus-visible) img { transform:scale(1.08); }
.demo-primary,.demo-close,.demo-chat-open { transition:filter .15s ease,transform .15s ease; }
.demo-primary:hover,.demo-close:hover,.demo-chat-open:hover { filter:brightness(1.15); }
.demo-primary:active,.demo-close:active,.demo-chat-open:active { transform:scale(.97); }
@media(prefers-reduced-motion:reduce){.demo-original-card:is(:hover,:focus-visible) [data-testid="game-card-container"] > img { animation:none; transform:scale(1.05); }.demo-original-card [data-testid="game-card-container"] { transform:none; }.demo-card-motion { display:none; }}
@media(max-width:1023px){
  .demo-chat-forced .demo-chat-backdrop { display:block!important; background:#030314; }
  .demo-leaderboard-summary { flex-wrap:wrap; gap:16px; }
  .demo-originals-menu { left:12px; right:12px; width:auto; top:64px; }
  .demo-chat-closed .demo-chat-column { display:none!important; }
  .demo-badge { bottom:68px; right:8px; font-size:11px; }
}
@media(max-width:600px){.demo-wordmark{font-size:22px;letter-spacing:-.9px}.demo-originals-heading{font-size:26px;margin-bottom:24px}.demo-original-card h4{font-size:9px}[data-demo-mobile="Duel"] p{font-size:10px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:0.01ms!important;animation-duration:0.01ms!important;animation-iteration-count:1!important}}
