
/* NG design system v2. Render-blocking on public documents only; fixed-palette
   consoles and games deliberately do not load this stylesheet.
   Layout belongs to components; palettes never change component dimensions. */
:root {
  --font-sans:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;
  --font-xs:12px;--font-sm:13px;--font-body:14px;--font-md:16px;--font-title:18px;--font-lg:20px;--font-xl:24px;
  --line-tight:1.25;--line-title:1.35;--line-body:1.65;--line-relaxed:1.8;
  --spacing-2:2px;--spacing-4:4px;--spacing-6:6px;--spacing-8:8px;--spacing-10:10px;--spacing-12:12px;--spacing-16:16px;--spacing-20:20px;--spacing-24:24px;--spacing-32:32px;--spacing-40:40px;--spacing-48:48px;
  --radius-xs:6px;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-dialog:20px;--radius-pill:999px;
  --shadow-sm:inset 0 1px rgb(255 255 255 / .45),0 2px 8px rgb(20 35 60 / .05);--shadow-md:inset 0 1px rgb(255 255 255 / .35),0 8px 24px rgb(20 35 60 / .1);--shadow-dialog:inset 0 1px rgb(255 255 255 / .3),0 20px 60px rgb(0 10 30 / .2);
  --duration-press:120ms;--duration-control:180ms;--duration-panel:240ms;
  --ease-standard:cubic-bezier(.2,.8,.2,1);--ease-emphasized:cubic-bezier(.2,1,.36,1);
  --content-max:1180px;--admin-content-max:1440px;--control-compact:36px;--control-height:44px;--control-large:48px;
  --layer-base:0;--layer-sticky:40;--layer-menu:80;--layer-overlay:200;--layer-modal:220;--layer-toast:240;
  --color-primary:var(--admin-accent,var(--ng-accent,#245fce));
  --color-secondary:var(--admin-accent-soft,var(--ng-soft,#edf3fb));
  --color-bg:var(--admin-page,var(--ng-page,#f5f7fb));
  --color-surface:var(--ng-surface-fill,color-mix(in srgb,#fff 78%,transparent));
  --color-border:var(--admin-border,var(--ng-line,#dce3ef));
  --color-text:var(--admin-text,var(--ng-ink,#172438));
  --color-muted:var(--admin-text-soft,var(--ng-muted,#52647d));
  --color-on-primary:var(--admin-on-accent,var(--ng-on-accent,#fff));
  --color-success:#087557;--color-warning:#865c0a;--color-error:#b32943;--color-info:#245fce;
}
html[data-theme="dark"] {--shadow-sm:inset 0 1px rgb(255 255 255 / .09),0 2px 8px rgb(0 0 0 / .14);--shadow-md:inset 0 1px rgb(255 255 255 / .08),0 8px 24px rgb(0 0 0 / .2);--shadow-dialog:inset 0 1px rgb(255 255 255 / .1),0 20px 60px rgb(0 0 0 / .4);--color-success:#6dd2ae;--color-warning:#e8be70;--color-error:#ff8d9f;--color-info:#97b8ff;}
html[data-ui-theme][data-theme] {
  --ng-accent:#245fce;--ng-accent-2:#16828a;--ng-accent-rgb:36,95,206;--ng-on-accent:#fff;
  --ng-page:#f5f7fb;--ng-page-deep:#edf1f7;--ng-panel:var(--ng-surface-fill);--ng-panel-solid:#fff;--ng-ink:#172438;--ng-muted:#52647d;--ng-line:#dce3ef;
  /* Opaque palette anchors are retained for contrast calculations, not panel paint.
     Surface alpha changes the fill only: content and controls remain fully legible. */
  --ng-surface-fill:color-mix(in srgb,var(--ng-panel-solid) 24%,transparent);
  --ng-surface-strong:color-mix(in srgb,var(--ng-panel-solid) 32%,transparent);
  --ng-surface-soft:color-mix(in srgb,var(--ng-panel-solid) 16%,transparent);
  --ng-shell-surface:var(--ng-surface-fill);--ng-shell-surface-strong:var(--ng-surface-strong);
  --ng-theme-color:var(--ng-page);--ng-radius:var(--radius-lg);--ng-radius-small:var(--radius-md);--ng-control-radius:var(--radius-md);
  --ng-shadow:var(--shadow-sm);--ng-blur:0px;--ng-button:var(--ng-accent);--ng-modal-head:var(--ng-accent);
  --ng-button-shadow:none;--ng-button-decoration:none;--ng-button-edge:var(--ng-line);--ng-float-shadow:var(--shadow-md);--ng-float-decoration:none;
  --ng-soft:color-mix(in srgb,var(--ng-accent) 7%,var(--ng-panel-solid));--ng-control:var(--ng-soft);--ng-control-hover:color-mix(in srgb,var(--ng-accent) 13%,var(--ng-panel-solid));
  --ng-success:var(--color-success);--ng-warning:var(--color-warning);--ng-danger:var(--color-error);--ng-focus-ring:color-mix(in srgb,var(--ng-accent) 25%,transparent);
  --ng-shell-action-text:var(--ng-on-accent);--ng-shell-content-max:var(--content-max);--ng-shell-radius:var(--radius-lg);--ng-shell-radius-small:var(--radius-md);
  --ng-shell-shadow:var(--shadow-sm);--ng-shell-card-bg:var(--ng-surface-decor),linear-gradient(145deg,var(--ng-surface-fill),var(--ng-surface-soft));--ng-shell-card-decor:none;
  --ui-shadow-card:var(--shadow-sm);--ui-shadow-hover:var(--shadow-md);--ui-content-max:var(--content-max);--ui-section-max:var(--content-max);
  --ui-card-radius:var(--radius-lg);--ui-control-radius:var(--radius-md);--ui-font-sans:var(--font-sans);
  --primary:var(--ng-accent);--accent:var(--ng-accent-2);--card:var(--ng-surface-fill);--panel:var(--ng-surface-fill);--text:var(--ng-ink);--muted:var(--ng-muted);--line:var(--ng-line);--border:var(--ng-line);
  --color-success-soft:color-mix(in srgb,var(--color-success) 10%,var(--ng-panel-solid));--color-warning-soft:color-mix(in srgb,var(--color-warning) 11%,var(--ng-panel-solid));--color-error-soft:color-mix(in srgb,var(--color-error) 9%,var(--ng-panel-solid));--color-info-soft:color-mix(in srgb,var(--color-info) 9%,var(--ng-panel-solid));
  color-scheme:light;
}
html[data-ui-theme][data-theme="dark"] {--ng-accent:#94b7ff;--ng-accent-2:#74cacc;--ng-accent-rgb:148,183,255;--ng-on-accent:#142039;--ng-page:#101827;--ng-page-deep:#0b1320;--ng-panel:var(--ng-surface-fill);--ng-panel-solid:#192538;--ng-ink:#edf2fa;--ng-muted:#b0bfd4;--ng-line:#34455f;color-scheme:dark;}
html[data-ui-theme="cosmic"][data-theme="light"] {--ng-accent:#6550ce;--ng-accent-2:#337fab;--ng-accent-rgb:101,80,206;--ng-page:#f6f5fc;--ng-page-deep:#eeecf8;--ng-ink:#252443;--ng-muted:#625d7d;--ng-line:#ddd9ee;}
html[data-ui-theme="cosmic"][data-theme="dark"] {--ng-accent:#b5a6ff;--ng-accent-2:#8bcde6;--ng-accent-rgb:181,166,255;--ng-page:#151529;--ng-page-deep:#101021;--ng-panel:var(--ng-surface-fill);--ng-panel-solid:#22223d;--ng-ink:#f1eefc;--ng-muted:#c0b9db;--ng-line:#41405f;}
html[data-ui-theme="aurora"][data-theme="light"] {--ng-accent:#137866;--ng-accent-2:#5e69aa;--ng-accent-rgb:19,120,102;--ng-page:#f2f8f6;--ng-page-deep:#e6f1ed;--ng-ink:#183830;--ng-muted:#4e6a63;--ng-line:#d3e3dd;}
html[data-ui-theme="aurora"][data-theme="dark"] {--ng-accent:#8dd8bf;--ng-accent-2:#b1baf1;--ng-accent-rgb:141,216,191;--ng-page:#10221f;--ng-page-deep:#0c1c1a;--ng-panel:var(--ng-surface-fill);--ng-panel-solid:#1b342e;--ng-ink:#eaf7f2;--ng-muted:#accdc1;--ng-line:#34564b;}
html[data-ui-theme="particles"][data-theme="light"] {--ng-accent:#126c91;--ng-accent-2:#267f77;--ng-accent-rgb:18,108,145;--ng-page:#f1f7fa;--ng-page-deep:#e5eef3;--ng-ink:#183445;--ng-muted:#465c6b;--ng-line:#d1e0e8;}
html[data-ui-theme="particles"][data-theme="dark"] {--ng-accent:#8bcfe9;--ng-accent-2:#87d6bf;--ng-accent-rgb:139,207,233;--ng-page:#11212b;--ng-page-deep:#0c1a22;--ng-panel:var(--ng-surface-fill);--ng-panel-solid:#1b303d;--ng-ink:#e7f3fa;--ng-muted:#abc6d5;--ng-line:#355262;}
html[data-ui-theme="esports"][data-theme="light"] {--ng-accent:#b02652;--ng-accent-2:#6354a5;--ng-accent-rgb:176,38,82;--ng-page:#fcf5f8;--ng-page-deep:#f3e9ef;--ng-ink:#392331;--ng-muted:#76576a;--ng-line:#ead5e0;}
html[data-ui-theme="esports"][data-theme="dark"] {--ng-accent:#f3a1be;--ng-accent-2:#c6b3f0;--ng-accent-rgb:243,161,190;--ng-page:#261823;--ng-page-deep:#1d111a;--ng-panel:var(--ng-surface-fill);--ng-panel-solid:#382535;--ng-ink:#f9edf5;--ng-muted:#d5b8ca;--ng-line:#5a3d51;}
html[data-ui-theme="arcade"][data-theme="light"] {--ng-accent:#7149ac;--ng-accent-2:#a26334;--ng-accent-rgb:113,73,172;--ng-page:#f9f5fc;--ng-page-deep:#f0e9f7;--ng-ink:#362743;--ng-muted:#6c587b;--ng-line:#e4d8ed;}
html[data-ui-theme="arcade"][data-theme="dark"] {--ng-accent:#c9a8ed;--ng-accent-2:#e7bd93;--ng-accent-rgb:201,168,237;--ng-page:#221a2c;--ng-page-deep:#191320;--ng-panel:var(--ng-surface-fill);--ng-panel-solid:#33283f;--ng-ink:#f4eefb;--ng-muted:#cbbbdb;--ng-line:#514361;}
html[data-ui-theme="gold"][data-theme="light"] {--ng-accent:#806025;--ng-accent-2:#87724c;--ng-accent-rgb:128,96,37;--ng-page:#f9f7f2;--ng-page-deep:#f0ebe0;--ng-ink:#362e21;--ng-muted:#72634d;--ng-line:#e5ddcd;}
html[data-ui-theme="gold"][data-theme="dark"] {--ng-accent:#dfc18b;--ng-accent-2:#bdb598;--ng-accent-rgb:223,193,139;--ng-page:#221f18;--ng-page-deep:#19170f;--ng-panel:var(--ng-surface-fill);--ng-panel-solid:#332d22;--ng-ink:#f6f0e4;--ng-muted:#cfc2a9;--ng-line:#554a37;}

/* Low-specificity shared controls; component geometry and game canvases stay local. */
body {font-family:var(--font-sans);font-synthesis:none;}
html {-webkit-text-size-adjust:100%;text-size-adjust:100%;}
html[data-ui-theme][data-theme]:not([data-ui-layout="game"]) body {color:var(--color-text);background:var(--color-bg);}
:where(button,input,textarea,select) {font:inherit;}
:where(button,a,input,textarea,select,summary,[tabindex]):focus-visible {outline:2px solid var(--color-primary);outline-offset:3px;}
:where(input,textarea,select) {accent-color:var(--color-primary);}
:where(input,textarea)::placeholder {color:var(--color-muted);opacity:1;}
:where(button,a) {touch-action:manipulation;}
:where(button,.button,a,input,textarea,select,summary,[role="button"],[role="tab"]) {transition-duration:var(--duration-control);transition-timing-function:var(--ease-standard);}
:where(button)[aria-busy="true"] {cursor:wait;}
:where(time,td,.stat-value,.ng-admin-stat strong) {font-variant-numeric:tabular-nums;}
:where(h1,h2,h3,p,td,th,label) {overflow-wrap:anywhere;}
:where(dialog,[role="dialog"]) {overscroll-behavior:contain;}
dialog[open],.ng-auth-card,.ng-confirm-card {max-height:calc(var(--ui-viewport-height,100dvh) - 24px);overflow-y:auto;}

@media (prefers-reduced-motion:reduce) {
  :where(*,::before,::after) {scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;}
}
@media (forced-colors:active) {
  :where(button,.button,input,textarea,select,[role="button"],[role="tab"],dialog,[role="dialog"]) {border-color:CanvasText;forced-color-adjust:auto;}
}

:root {
  color-scheme: light;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
  --page: #edf4ff;
  --page-deep: #e4eefb;
  --surface: rgba(255, 255, 255, .78);
  --surface-solid: #fff;
  --ink: #26384f;
  --muted: #74849a;
  --line: rgba(86, 121, 168, .18);
  --blue: #397df4;
  --cyan: #20b9d4;
  --green: #24bb6f;
  --danger: #e35e73;
  --scan-progress: 0;
  color: var(--ink);
  background: var(--page);
}

html[data-theme="dark"] {
  color-scheme: dark;
  --page: #071120;
  --page-deep: #0a1729;
  --surface: rgba(13, 27, 47, .84);
  --surface-solid: #0e1d32;
  --ink: #edf5ff;
  --muted: #91a6c0;
  --line: rgba(137, 173, 218, .2);
  --blue: #659cff;
  --cyan: #3bcde0;
  --green: #42d287;
  --danger: #ff7890;
}

html[data-ui-theme][data-theme] {
  --page: var(--ng-page); --page-deep: var(--ng-page-deep);
  --surface: var(--ng-surface-fill); --surface-solid: var(--ng-panel-solid);
  --ink: var(--ng-ink); --muted: color-mix(in srgb,var(--ng-muted) 70%,var(--ng-ink)); --line: var(--ng-line);
  --blue: var(--ng-accent); --cyan: var(--ng-accent-2);
  --green: var(--color-success); --danger: var(--color-error);
}

* { box-sizing: border-box; }
html { width: 100%; min-width: 320px; min-height: 100%; background: var(--page); }
body {
  width: 100%;
  min-width: 320px;
  min-height: 100svh;
  min-height: 100dvh;
  margin: 0;
  overflow-x: hidden;
  color: var(--ink);
  background: linear-gradient(145deg, var(--page), #f5f8fd 56%, #e9f4f4);
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}
button { font: inherit; }
[hidden] { display: none !important; }

.line-stage {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-rows: 1fr auto;
  width: min(1180px, 100%);
  min-height: 100svh;
  min-height: 100dvh;
  margin: 0 auto;
  padding:
    max(24px, calc(env(safe-area-inset-top) + 18px))
    max(24px, calc(env(safe-area-inset-right) + 20px))
    max(20px, calc(env(safe-area-inset-bottom) + 14px))
    max(24px, calc(env(safe-area-inset-left) + 20px));
  transition: opacity .24s ease, filter .24s ease, transform .24s cubic-bezier(.22,1,.36,1);
}

.security-card {
  position: relative;
  align-self: center;
  justify-self: center;
  width: min(540px, 100%);
  margin: 18px auto;
  padding: clamp(30px, 5vh, 48px) clamp(24px, 5vw, 48px) 28px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.78);
  border-radius: 34px;
  background:var(--ng-surface-decor),var(--surface);
  box-shadow: 0 32px 82px rgba(43, 66, 96, .14), 0 8px 24px rgba(43, 66, 96, .06), inset 0 1px rgba(255,255,255,.94);
  
  text-align: center;
  opacity: 0;
  transform: translateY(14px) scale(.985);
  animation: card-arrive 200ms cubic-bezier(.22,1,.36,1) forwards;
  transition: border-color .28s ease, box-shadow .28s ease, background .28s ease;
}
.security-card::before {
  position: absolute;
  top: 0;
  right: 12%;
  left: 12%;
  height: 1px;
  content: "";
  background: linear-gradient(90deg, transparent, color-mix(in srgb,var(--blue) 65%,transparent), color-mix(in srgb,var(--cyan) 48%,transparent), transparent);
}
.security-card::after {
  position: absolute;
  top: -120px;
  left: 50%;
  width: 310px;
  height: 190px;
  border-radius: 50%;
  content: "";
  background: radial-gradient(ellipse,color-mix(in srgb,var(--blue) 10%,transparent),transparent 68%);
  transform: translateX(-50%);
  pointer-events: none;
}
.security-card.is-ready { border-color: rgba(36,187,111,.25); box-shadow: 0 34px 86px rgba(43,66,96,.15), 0 0 0 1px rgba(36,187,111,.05) inset; }
.security-card.is-error { border-color: rgba(227,94,115,.25); }

.security-eyebrow {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  gap: 7px;
  padding: 0 11px;
  border: 1px solid color-mix(in srgb,var(--blue) 20%,transparent);
  border-radius: 999px;
  color: var(--muted);
  background:var(--ng-surface-decor),var(--ng-surface-fill);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
}
.security-eyebrow i { width: 6px; height: 6px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 5px rgba(36,187,111,.09); }
.security-card h1 { position: relative; z-index: 1; margin: 19px 0 0; color: var(--ink); font-size: clamp(28px, 4.1vw, 38px); line-height: 1.18; letter-spacing: .05em; }
.security-subtitle { position: relative; z-index: 1; margin: 10px 0 0; color: var(--muted); font-size: 13px; line-height: 1.65; }

.scan-orbit {
  position: relative;
  z-index: 1;
  display: grid;
  width: clamp(154px, 28vw, 190px);
  aspect-ratio: 1;
  margin: clamp(24px, 4.5vh, 38px) auto 24px;
  place-items: center;
  border-radius: 50%;
  isolation: isolate;
}
.scan-orbit::before {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  content: "";
  background: conic-gradient(from -90deg, var(--blue) 0 calc(var(--scan-progress) * 1%), rgba(86,121,168,.1) calc(var(--scan-progress) * 1%) 100%);
  filter: drop-shadow(0 6px 11px rgba(57,125,244,.19));
  -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 7px), #000 calc(100% - 6px));
  mask: radial-gradient(farthest-side, transparent calc(100% - 7px), #000 calc(100% - 6px));
  transition: background .18s linear;
}
.scan-orbit::after {
  position: absolute;
  inset: 14px;
  border: 2px solid transparent;
  border-top-color: var(--cyan);
  border-right-color: color-mix(in srgb,var(--cyan) 50%,transparent);
  border-radius: 50%;
  content: "";
  animation: orbit-spin 3.6s linear infinite;
}
.scan-ring-secondary {
  position: absolute;
  inset: 28px;
  border: 1px solid rgba(57,125,244,.13);
  border-bottom-color: rgba(36,187,111,.65);
  border-radius: 50%;
  animation: orbit-spin 5.2s linear infinite reverse;
}
.scan-core {
  position: relative;
  display: grid;
  width: 98px;
  aspect-ratio: 1;
  place-content: center;
  border: 1px solid rgba(255,255,255,.9);
  border-radius: 50%;
  background:var(--ng-surface-decor),var(--ng-surface-strong);
  box-shadow: 0 12px 34px rgba(54,83,123,.12), inset 0 1px #fff;
}
.scan-core strong { color: var(--blue); font-size: 47px; line-height: 1; font-variant-numeric: tabular-nums; }
.scan-core small { margin-top: 5px; color: var(--muted); font-size: 7px; font-weight: 850; letter-spacing: .2em; }
.security-card.is-ready .scan-orbit::before { background: conic-gradient(var(--green) 0 100%); filter: drop-shadow(0 6px 11px rgba(36,187,111,.18)); }
.security-card.is-ready .scan-orbit::after { border-top-color: var(--green); border-right-color: rgba(36,187,111,.42); animation-duration: 8s; }
.security-card.is-ready .scan-core strong { color: var(--green); font-size: 43px; }
.security-card.is-error .scan-orbit::before { background: conic-gradient(var(--danger) 0 22%, rgba(227,94,115,.1) 22%); }
.security-card.is-error .scan-core strong { color: var(--danger); }

.connection-state {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  gap: 9px;
  margin: 0;
  padding: 0 16px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  background:var(--ng-surface-decor),var(--ng-surface-fill);
  font-size: 12px;
  font-weight: 720;
}
.state-orb { width: 7px; height: 7px; border-radius: 50%; background:var(--ng-surface-decor),color-mix(in srgb,#76cc91 80%,transparent); box-shadow: 0 0 0 5px rgba(118,204,145,.1); animation: state-pulse 1.3s ease-in-out infinite; }
.connection-state.is-ready { color: #2f7d53; border-color: rgba(36,187,111,.18); background:var(--ng-surface-decor),var(--ng-surface-fill); }
.connection-state.is-ready .state-orb { background:var(--ng-surface-decor),var(--green); }
.connection-state.is-error { color: #a1495a; border-color: rgba(227,94,115,.18); background:var(--ng-surface-decor),var(--ng-surface-fill); }
.connection-state.is-error .state-orb { background:var(--ng-surface-decor),var(--danger); }

.scan-steps {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin: 22px 0 0;
  padding: 0;
  list-style: none;
}
.scan-steps::before { position: absolute; top: 7px; right: 16.5%; left: 16.5%; height: 1px; content: ""; background: var(--line); }
.scan-steps li { position: relative; display: grid; justify-items: center; gap: 8px; color: var(--muted); font-size: 11px; font-weight: 750; }
.scan-steps li i { z-index: 1; width: 15px; height: 15px; border: 4px solid rgba(255,255,255,.92); border-radius: 50%; background: #cbd5e2; box-shadow: 0 0 0 1px rgba(101,127,163,.13); }
.scan-steps li.is-active { color: var(--blue); }
.scan-steps li.is-active i { background: var(--blue); box-shadow: 0 0 0 1px rgba(57,125,244,.2), 0 0 0 5px rgba(57,125,244,.08); }
.scan-steps li.is-complete { color: #4f8d6a; }
.scan-steps li.is-complete i { background: var(--green); }

.film-timeline { width: calc(100% - 30px); height: 3px; margin: 22px auto 0; overflow: hidden; border-radius: 999px; background: rgba(90,119,157,.1); }
.film-timeline span { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--blue), var(--cyan), var(--green)); box-shadow: 0 0 10px rgba(32,185,212,.28); transition: width .16s linear; }
.auto-hint { margin: 10px 0 0; color: var(--muted); font-size: 11px; line-height: 1.55; letter-spacing: .025em; }

.fault-state {
  position: fixed;
  z-index: 5;
  right: max(18px, env(safe-area-inset-right));
  bottom: max(18px, calc(env(safe-area-inset-bottom) + 12px));
  left: max(18px, env(safe-area-inset-left));
  width: min(430px, calc(100% - 36px));
  margin: auto;
  padding: 14px 15px;
  border: 1px solid rgba(227,94,115,.18);
  border-radius: 18px;
  background:var(--ng-surface-decor),var(--ng-surface-fill);
  box-shadow: 0 18px 44px rgba(43,66,96,.15);
  
  text-align: center;
}
.fault-state strong, .fault-state span { display: block; }
.fault-state strong { font-size: 12px; }
.fault-state span { margin-top: 4px; color: var(--muted); font-size: 10px; }
.fault-state button { min-height: 38px; margin-top: 9px; padding: 0 17px; border: 1px solid rgba(227,94,115,.18); border-radius: 12px; color: #a1495a; background: #fff2f4; font-size: 10px; font-weight: 800; cursor: pointer; }

.line-footer { display: flex; align-items: center; justify-content: center; gap: 11px; color: var(--muted); font-size: 10px; font-weight: 760; letter-spacing: .1em; }
.line-footer i { width: 3px; height: 3px; border-radius: 50%; background: color-mix(in srgb,var(--blue) 40%,transparent); }
.screen-reader-status { position: fixed; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.fault-state button:focus-visible { outline: 3px solid rgba(57,125,244,.25); outline-offset: 3px; }

body.is-leaving .cinema-stage { opacity: 0; filter: blur(9px); transform: scale(1.018); }
body.is-suspended * { animation-play-state: paused !important; }

html[data-theme="dark"] body {
  background: linear-gradient(145deg, #071120, #0a1730 56%, #081d27);
}
html[data-theme="dark"] .security-card {
  border-color: rgba(147,181,224,.2);
  background:var(--ng-surface-decor),var(--surface);
  box-shadow: 0 36px 92px rgba(0,0,0,.32), inset 0 1px rgba(255,255,255,.05);
}
html[data-theme="dark"] .security-card::after { background: color-mix(in srgb,var(--blue) 11%,transparent); }
html[data-theme="dark"] .security-card.is-ready {
  border-color: rgba(66,210,135,.28);
  box-shadow: 0 36px 92px rgba(0,0,0,.3), 0 0 0 1px rgba(66,210,135,.06) inset;
}
html[data-theme="dark"] .security-eyebrow {
  color: var(--muted);
  border-color: color-mix(in srgb,var(--blue) 20%,transparent);
  background:var(--ng-surface-decor),var(--ng-surface-fill);
}
html[data-theme="dark"] .security-card h1 { color: var(--ink); }
html[data-theme="dark"] .scan-orbit::before {
  background: conic-gradient(from -90deg, var(--blue) 0 calc(var(--scan-progress) * 1%), rgba(137,173,218,.13) calc(var(--scan-progress) * 1%) 100%);
}
html[data-theme="dark"] .scan-ring-secondary { border-color: rgba(137,173,218,.16); border-bottom-color: rgba(66,210,135,.65); }
html[data-theme="dark"] .scan-core {
  border-color: rgba(151,183,225,.16);
  background:var(--ng-surface-decor),var(--ng-surface-strong);
  box-shadow: 0 14px 38px rgba(0,0,0,.25), inset 0 1px rgba(255,255,255,.05);
}
html[data-theme="dark"] .scan-core small { color: var(--muted); }
html[data-theme="dark"] .connection-state {
  color: var(--muted);
  background:var(--ng-surface-decor),var(--ng-surface-fill);
}
html[data-theme="dark"] .connection-state.is-ready {
  color: #8ee8b6;
  background:var(--ng-surface-decor),var(--ng-surface-fill);
}
html[data-theme="dark"] .connection-state.is-error {
  color: #ffb0be;
  background:var(--ng-surface-decor),var(--ng-surface-fill);
}
html[data-theme="dark"] .scan-steps li { color: var(--muted); }
html[data-theme="dark"] .scan-steps li i {
  border-color: rgba(14,29,50,.95);
  background: #52657d;
  box-shadow: 0 0 0 1px rgba(145,178,220,.16);
}
html[data-theme="dark"] .scan-steps li.is-active { color: var(--blue); }
html[data-theme="dark"] .scan-steps li.is-complete { color: #79dba5; }
html[data-theme="dark"] .scan-steps li.is-active i { background: var(--blue); }
html[data-theme="dark"] .scan-steps li.is-complete i { background: var(--green); }
html[data-theme="dark"] .film-timeline { background: rgba(137,173,218,.12); }
html[data-theme="dark"] .auto-hint { color: var(--muted); }
html[data-theme="dark"] .fault-state {
  border-color: rgba(255,120,144,.22);
  background:var(--ng-surface-decor),var(--ng-surface-fill);
  box-shadow: 0 20px 50px rgba(0,0,0,.3);
}
html[data-theme="dark"] .fault-state button { color: #ffb0be; background: rgba(82,28,44,.62); }

@keyframes card-arrive { to { opacity: 1; transform: none; } }
@keyframes orbit-spin { to { transform: rotate(360deg); } }
@keyframes state-pulse { 50% { opacity: .45; transform: scale(.72); } }

@media (max-width: 640px) {
  .line-stage { padding: max(16px, calc(env(safe-area-inset-top) + 10px)) max(13px, calc(env(safe-area-inset-right) + 11px)) max(15px, calc(env(safe-area-inset-bottom) + 10px)) max(13px, calc(env(safe-area-inset-left) + 11px)); }
  .security-card { margin: 12px auto; padding: 26px 20px 21px; border-radius: 27px;  }
  .security-card h1 { margin-top: 16px; font-size: 28px; }
  .security-subtitle { font-size: 12px; }
  .scan-orbit { width: 154px; margin-top: 24px; margin-bottom: 20px; }
  .scan-core { width: 84px; }
  .scan-core strong { font-size: 40px; }
  .security-card.is-ready .scan-core strong { font-size: 37px; }
  .connection-state { min-height: 36px; padding: 0 13px; font-size: 11px; }
  .scan-steps { margin-top: 19px; }
  .film-timeline { margin-top: 19px; }
  .line-footer { gap: 8px; letter-spacing: .06em; }
}

@media (max-height: 700px) {
  .line-stage { min-height: max(100svh, 600px); min-height: max(100dvh, 600px); }
  .security-card { padding-top: 24px; padding-bottom: 20px; }
  .security-card h1 { margin-top: 13px; }
  .scan-orbit { width: 140px; margin-top: 17px; margin-bottom: 15px; }
  .scan-core { width: 78px; }
  .scan-core strong { font-size: 36px; }
  .scan-steps { margin-top: 16px; }
  .film-timeline { margin-top: 11px; }
}

@media (max-height: 520px) and (orientation: landscape) {
  body { overflow-y: auto; }
  .line-stage { min-height: 610px; }
}

@media (prefers-reduced-transparency: reduce) {
  .security-card, .fault-state { background:var(--ng-surface-decor),var(--surface-solid);  }
}

@media (prefers-reduced-motion: reduce) {
  .scan-orbit::after, .scan-ring-secondary, .state-orb{ animation: none !important; }
  .security-card { opacity: 1; transform: none; animation: none; }
  .line-stage { transition-duration: .01ms; }
}

/* Resource-matched native ports. Exact previews/licences: MOTION-REFERENCES.txt. */
:root {
  --ng-motion-fast:120ms;--ng-motion-control:180ms;--ng-motion-panel:200ms;
  --ng-motion-ease:cubic-bezier(.2,.8,.2,1);--ng-motion-play-state:running;
  --arcade-fast:var(--ng-motion-fast);--arcade-normal:var(--ng-motion-control);--arcade-ease:var(--ng-motion-ease);
  --ng-motion-primary:var(--ng-accent,var(--admin-accent,var(--blue,#397df4)));
  --ng-motion-secondary:var(--ng-accent-2,var(--cyan,#20b9d4));
  --ng-motion-line:var(--ng-line,var(--admin-border,var(--line,#dce3ef)));
  --ng-motion-surface:var(--ng-panel-solid,var(--admin-surface,var(--surface-solid,#fff)));
  --ng-motion-ink:var(--ng-ink,var(--admin-text,var(--ink,#172438)));
  --ng-surface-fill:color-mix(in srgb,var(--ng-motion-surface) 24%,transparent);
  --ng-surface-strong:color-mix(in srgb,var(--ng-motion-surface) 32%,transparent);
  --ng-surface-decor:radial-gradient(circle at 100% 0,transparent 44px,color-mix(in srgb,var(--ng-motion-primary) 14%,transparent) 45px,transparent 46px),radial-gradient(ellipse at 100% 0,color-mix(in srgb,var(--ng-motion-primary) 11%,transparent),transparent 52%),linear-gradient(130deg,rgb(255 255 255 / .1),transparent 42%,color-mix(in srgb,var(--ng-motion-secondary) 6%,transparent));
}
html.ng-motion-ready body{isolation:isolate}
html.ng-motion-ready body:not(.ng-fullscreen-experience){background-image:none!important}
html.ng-motion-ready body:not(.ng-fullscreen-experience)::before,html.ng-motion-ready body:not(.ng-fullscreen-experience)::after{content:none!important;display:none!important;animation:none!important;filter:none!important}
html.ng-motion-ready :is(.wm,canvas#bg-particles,.ng-mobile-theme-atmosphere,.ng-theme-scene,.ng-theme-hero-art){display:none!important;animation:none!important}


/* Original Vanta BIRDS, one flight profile with seven theme palettes.
   Native SVG is a same-family fallback only when WebGL cannot initialise. */
.ng-motion-ambient{position:fixed;inset:0;z-index:-1;overflow:hidden;contain:strict;pointer-events:none;opacity:1;background:var(--ng-page-deep,#edf1f7)}
.ng-motion-ambient::before,.ng-motion-ambient::after{content:none}
.ng-motion-ambient canvas{position:absolute;inset:0;display:block;pointer-events:none;transform:scale(1.015)}
.ng-motion-ambient canvas,.ng-vanta-fallback{filter:blur(2px);opacity:.55}
.ng-vanta-fallback{position:absolute;inset:0;width:100%;height:100%;fill:var(--ng-motion-primary);stroke:none;animation:ng-vanta-drift 16s ease-in-out -4s infinite alternate}
.ng-vanta-bird{animation:ng-vanta-flight 9s ease-in-out var(--bird-delay) infinite alternate}
.ng-vanta-wing{fill:var(--ng-motion-secondary)}
@keyframes ng-vanta-drift{from{transform:translate3d(-2%,2%,0) scale(1)}to{transform:translate3d(2%,-2%,0) scale(1.08)}}
@keyframes ng-vanta-flight{from{transform:translate3d(-18px,12px,0)}to{transform:translate3d(24px,-18px,0)}}
@keyframes ng-header-light{from{transform:translate3d(-3%,0,0);opacity:.65}to{transform:translate3d(3%,2%,0);opacity:1}}
@media(max-width:600px),(pointer:coarse){.ng-vanta-bird:nth-child(even){display:none}}
/* Full-width masthead light. */
.ng-motion-header{position:absolute;inset:0;z-index:0;width:100%;overflow:hidden;pointer-events:none;contain:strict}
.ng-motion-header::before,.ng-motion-preview::before{content:"";position:absolute;inset:-40%;pointer-events:none;background:radial-gradient(ellipse at 25% 50%,color-mix(in srgb,var(--ng-motion-primary) 12%,transparent),transparent 65%),radial-gradient(ellipse at 80% 60%,color-mix(in srgb,var(--ng-motion-secondary) 10%,transparent),transparent 62%);animation:var(--ng-header-animation)}
.theme-live-preview.ng-motion-preview{background:#11213a}
/* Theme motion profiles. */
:root{
 --ng-card-edge:linear-gradient(120deg,var(--ng-motion-primary),var(--ng-motion-secondary),transparent 75%);--ng-nav-glow:radial-gradient(ellipse at 20% 0,rgb(255 255 255 / .16),transparent 65%);
 --ng-card-hover:translateY(-1px);--ng-card-press:none;--ng-card-travel:240ms;
 --ng-panel-animation:ng-panel-original;--ng-header-animation:ng-header-light 18s ease-in-out infinite alternate;
 --ng-loader-mask:none;--ng-loader-animation:ng-load-original .9s linear infinite;--ng-loader-radius:50%;--ng-loader-border:2px;--ng-loader-background:none;--ng-loader-top:currentColor;
 --ng-skeleton-animation:ng-skeleton-original 1.6s ease-in-out infinite;--ng-podium-highlight:radial-gradient(ellipse at center,color-mix(in srgb,var(--rank-accent,var(--ng-motion-primary)) 12%,transparent),transparent 72%);
}
html[data-ui-theme="cosmic"],[data-preview-theme="cosmic"]{
 --ng-card-edge:conic-gradient(from 45deg,var(--ng-motion-secondary),transparent,var(--ng-motion-primary),transparent,var(--ng-motion-secondary));--ng-nav-glow:radial-gradient(ellipse at 50% 0,rgb(255 255 255 / .24),transparent 60%);
 --ng-panel-animation:ng-panel-cosmic;--ng-header-animation:ng-header-light 18s ease-in-out infinite alternate;
 --ng-loader-animation:ng-load-cosmic 1.15s linear infinite;--ng-loader-radius:50%;--ng-loader-background:radial-gradient(circle at 50% 0,currentColor 2px,transparent 3px);
 --ng-skeleton-animation:ng-skeleton-cosmic 1.8s ease-in-out infinite;--ng-podium-highlight:repeating-radial-gradient(ellipse at 50% 100%,transparent 0 20px,color-mix(in srgb,var(--rank-accent,var(--ng-motion-primary)) 14%,transparent) 21px 22px,transparent 23px 36px);
}
html[data-ui-theme="aurora"],[data-preview-theme="aurora"]{
 --ng-card-edge:linear-gradient(135deg,var(--ng-motion-secondary),transparent 35%,var(--ng-motion-primary),transparent 80%);--ng-nav-glow:linear-gradient(115deg,transparent 20%,rgb(255 255 255 / .2) 50%,transparent 80%);
 --ng-panel-animation:ng-panel-aurora;--ng-header-animation:ng-header-light 18s ease-in-out infinite alternate;
 --ng-loader-animation:ng-load-aurora 1.3s ease-in-out infinite;--ng-loader-border:0px;--ng-loader-background:radial-gradient(circle,transparent 20%,currentColor 24% 32%,transparent 36% 49%,color-mix(in srgb,currentColor 65%,transparent) 53% 61%,transparent 65%);
 --ng-skeleton-animation:ng-skeleton-aurora 1.9s ease-in-out infinite;--ng-podium-highlight:linear-gradient(135deg,transparent,color-mix(in srgb,var(--rank-accent,var(--ng-motion-primary)) 16%,transparent),transparent);
}
html[data-ui-theme="particles"],[data-preview-theme="particles"]{
 --ng-card-edge:linear-gradient(90deg,var(--ng-motion-primary),transparent 32% 68%,var(--ng-motion-secondary));--ng-nav-glow:linear-gradient(90deg,rgb(255 255 255 / .15),transparent 28% 72%,rgb(255 255 255 / .1));
 --ng-panel-animation:ng-panel-particles;--ng-header-animation:ng-header-light 18s ease-in-out infinite alternate;
 --ng-loader-animation:ng-load-particles 1s ease-in-out infinite;--ng-loader-border:0px;--ng-loader-radius:2px;--ng-loader-background:linear-gradient(90deg,currentColor 0 20%,transparent 21% 39%,currentColor 40% 60%,transparent 61% 79%,currentColor 80%);
 --ng-skeleton-animation:ng-skeleton-particles 1.25s linear infinite;--ng-podium-highlight:repeating-linear-gradient(90deg,transparent 0 20px,color-mix(in srgb,var(--rank-accent,var(--ng-motion-primary)) 10%,transparent) 21px 22px);
}
html[data-ui-theme="esports"],[data-preview-theme="esports"]{
 --ng-card-edge:linear-gradient(150deg,var(--ng-motion-primary),transparent 45% 70%,var(--ng-motion-secondary));--ng-nav-glow:linear-gradient(135deg,rgb(255 255 255 / .18),transparent 48%);
 --ng-panel-animation:ng-panel-esports;--ng-header-animation:ng-header-light 18s ease-in-out infinite alternate;
 --ng-loader-animation:ng-load-esports 1s ease-in-out infinite;--ng-loader-radius:3px;--ng-loader-background:none;
 --ng-skeleton-animation:ng-skeleton-esports 1.15s ease-out infinite;--ng-podium-highlight:linear-gradient(135deg,transparent 25%,color-mix(in srgb,var(--rank-accent,var(--ng-motion-primary)) 15%,transparent) 26% 35%,transparent 36% 58%,color-mix(in srgb,var(--rank-accent,var(--ng-motion-primary)) 10%,transparent) 59% 64%,transparent 65%);
}
html[data-ui-theme="arcade"],[data-preview-theme="arcade"]{
 --ng-card-edge:conic-gradient(from 90deg,var(--ng-motion-primary),var(--ng-motion-secondary),transparent 40% 60%,var(--ng-motion-primary));--ng-nav-glow:radial-gradient(circle at 50% 20%,rgb(255 255 255 / .22),transparent 70%);
 --ng-panel-animation:ng-panel-arcade;--ng-header-animation:ng-header-light 18s ease-in-out infinite alternate;
 --ng-loader-animation:ng-load-arcade 1.2s ease-in-out infinite;--ng-loader-border:0px;--ng-loader-background:radial-gradient(circle at 25% 50%,currentColor 2.5px,transparent 3px),radial-gradient(circle at 75% 50%,currentColor 2.5px,transparent 3px);
 --ng-skeleton-animation:ng-skeleton-arcade 1.5s ease-in-out infinite;--ng-podium-highlight:radial-gradient(circle at 25% 50%,color-mix(in srgb,var(--rank-accent,var(--ng-motion-primary)) 18%,transparent),transparent 25%),radial-gradient(circle at 75% 50%,color-mix(in srgb,var(--rank-accent,var(--ng-motion-primary)) 12%,transparent),transparent 28%);
}
html[data-ui-theme="gold"],[data-preview-theme="gold"]{
 --ng-card-edge:linear-gradient(110deg,transparent 20%,var(--ng-motion-secondary) 44%,transparent 70%);--ng-nav-glow:linear-gradient(110deg,transparent 25%,rgb(255 255 255 / .24) 48%,transparent 72%);
 --ng-panel-animation:ng-panel-gold;--ng-header-animation:ng-header-light 18s ease-in-out infinite alternate;
 --ng-loader-animation:ng-load-gold 1.35s linear infinite;--ng-loader-background:conic-gradient(from 0deg,transparent 0 45%,currentColor 70% 100%);--ng-loader-border:0px;--ng-loader-top:transparent;--ng-loader-mask:radial-gradient(circle,transparent 48%,#000 52%);
 --ng-skeleton-animation:ng-skeleton-gold 2.1s ease-in-out infinite;--ng-podium-highlight:conic-gradient(from 30deg at 50% 100%,transparent 0 30%,color-mix(in srgb,var(--rank-accent,var(--ng-motion-primary)) 14%,transparent) 40%,transparent 60% 100%);
}
html.ng-motion-ready :is(.card,.game-card,.collector-card,.gh-platform-card,.ng-hub-card,.ng-discover-card,.ng-category-card){opacity:1;transform:none;backdrop-filter:none;-webkit-backdrop-filter:none;transition:transform var(--ng-motion-control) var(--ng-motion-ease),border-color var(--ng-motion-control) ease,box-shadow var(--ng-motion-control) ease}
/* Hover.dev free AI Gradient / Hover.dev Cards port. Border-only opacity:
   no continuous conic-angle updates, backdrop blur or logo-covering curtain. */
html.ng-motion-ready :is(.card,.game-card,.collector-card,.gh-platform-card,.ng-hub-card,.ng-discover-card,.ng-category-card)::before{content:"";position:absolute;inset:0;z-index:0;width:auto;height:auto;padding:1px;box-sizing:border-box;border:0;border-radius:inherit;box-shadow:none;pointer-events:none;background:var(--ng-card-edge);opacity:0;transform:none;animation:none!important;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;transition:opacity var(--ng-motion-control) ease}
html.ng-motion-ready :is(.card,.game-card,.collector-card,.gh-platform-card,.ng-hub-card,.ng-discover-card,.ng-category-card)::after{content:none;display:none;animation:none!important}
html.ng-motion-ready .card[data-ng-resource-type="platform"]{--ng-card-hover:translateY(-1px);--ng-card-press:none;--ng-control-press-scale:1;--ng-platform-logo-hover:none;color:inherit;text-decoration:none}
@media(hover:hover) and (pointer:fine){html.ng-motion-ready :is(.card,.game-card,.collector-card,.gh-platform-card,.ng-hub-card,.ng-discover-card,.ng-category-card):hover{transform:var(--ng-card-hover)!important;border-color:color-mix(in srgb,var(--ng-motion-primary) 36%,var(--ng-motion-line))!important;box-shadow:0 5px 16px color-mix(in srgb,var(--ng-motion-primary) 10%,transparent)!important}html.ng-motion-ready :is(.card,.game-card,.collector-card,.gh-platform-card,.ng-hub-card,.ng-discover-card,.ng-category-card):hover::before{opacity:.85}}
@media(hover:none),(pointer:coarse){html.ng-motion-ready :is(.card,.game-card,.collector-card,.gh-platform-card,.ng-hub-card,.ng-discover-card,.ng-category-card):hover{transform:none!important}}
html.ng-motion-ready :is(.card,.game-card,.collector-card,.gh-platform-card,.ng-hub-card,.ng-discover-card,.ng-category-card).ng-motion-card-active{transform:none!important;border-color:color-mix(in srgb,var(--ng-motion-primary) 36%,var(--ng-motion-line))!important}
html.ng-motion-ready :is(.card,.game-card,.collector-card,.gh-platform-card,.ng-hub-card,.ng-discover-card,.ng-category-card).ng-motion-card-active::before{animation:ng-card-edge var(--ng-card-travel) var(--ng-motion-ease)!important}
@keyframes ng-card-edge{0%,100%{opacity:0}35%,70%{opacity:.9}}
html.ng-motion-ready :is(button,.go,.el-button,[role="button"]):active{scale:var(--ng-control-press-scale,.98)}
html.ng-motion-ready .ng-interaction-pressed{filter:none!important;scale:var(--ng-control-press-scale,.98)!important}
html.ng-motion-ready :is(.ng-segmented-item,.ng-community-nav a,.ng-rank-tab,.nav-item){background-image:var(--ng-nav-glow);transition:color var(--ng-motion-control) ease,background-color var(--ng-motion-control) ease,box-shadow var(--ng-motion-control) ease}
@media(hover:hover) and (pointer:fine){html.ng-motion-ready :is(.ng-segmented-item,.ng-community-nav a,.ng-rank-tab,.nav-item):not(:disabled):hover{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ng-motion-primary) 24%,transparent)}}
html.ng-motion-ready :is(.ng-ai-icon,.ng-symbol-icon,.ng-community-icon,.ng-segmented-icon,.ng-category-card__icon,.nav-icon,[data-ng-symbol-slot]){transform-origin:50% 65%}
html.ng-motion-ready :is(.ng-shell-svg,.ng-community-icon>svg,.ng-segmented-icon>svg){stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
/* Dialogs are opaque reading surfaces. Rebind only inside their content
   boundary; backdrop masks and ordinary page cards keep their existing skin.
   The semantic selectors also cover dynamically generated future dialogs. */
html body :is(dialog,[role="dialog"],[popover],.popup-modal,.ng-home-popup-card,.engagement-modal,.site-share-panel,.ng-age-gate__panel,.gh-room-picker-sheet,.row-action-menu-popover) {
  --ng-dialog-solid:var(--ng-panel-solid,var(--admin-surface,var(--ct-surface,var(--s28-panel,var(--fg-surface,#fff)))));
  --ng-panel:var(--ng-dialog-solid);--panel:var(--ng-dialog-solid);--card:var(--ng-dialog-solid);
  --ng-surface-fill:var(--ng-dialog-solid);--ng-surface-strong:var(--ng-dialog-solid);--ng-surface-soft:var(--ng-dialog-solid);
  --ng-shell-surface:var(--ng-dialog-solid);--ng-shell-surface-strong:var(--ng-dialog-solid);
  --ng-shell-card-bg:var(--ng-surface-decor),var(--ng-dialog-solid);
  --admin-glass:var(--ng-dialog-solid);--member-admin-surface:var(--ng-dialog-solid);
  background-color:var(--ng-dialog-solid)!important;
}
/* Preserve each standalone game's own solid palette and readable foreground. */
html body :is(.ct-modal-card,.ct-quick-card,.ct-bill-detail-card,.ct-room-layer,.ct-win-layer) {--ng-dialog-solid:var(--ct-surface,var(--ng-panel-solid,#fff));}
html body :is(.s28-dialog,.s28-prize-stage,.s28-win) {--ng-dialog-solid:var(--s28-panel,var(--ng-panel-solid,#fff));}
html body :is(.fg-info,.fg-menu section) {--ng-dialog-solid:var(--fg-surface,var(--ng-panel-solid,#fff));}
html body :is(.modal,.engagement-modal,.ng-admin-identity-dialog) {--ng-dialog-solid:var(--admin-surface,var(--ng-panel-solid,#fff));}
html body :is(.toast,.ng-toast,.admin-toast,.ng-hub-toast,.gh-toast,.ct-toast,.s28-toast,.fg-toast) {
  background-color:var(--ng-ink,var(--admin-text,var(--ct-text,var(--s28-text,var(--fg-text,#172438)))))!important;color:var(--ng-panel-solid,var(--admin-surface,var(--ct-surface,var(--s28-panel,var(--fg-surface,#fff)))))!important;
}
html.ng-motion-ready :is(dialog,.ng-auth-overlay,.modal-backdrop,.ng-support-panel,.activity-application-backdrop,.activity-hall-backdrop,.stage-submission-overlay,.ng-member-reward-overlay){opacity:1;transition:opacity var(--ng-motion-panel) ease,display var(--ng-motion-panel) allow-discrete,overlay var(--ng-motion-panel) allow-discrete}
html.ng-motion-ready :is(dialog:not([open]),.ng-auth-overlay.hidden,.modal-backdrop[hidden],.ng-support-panel[hidden],.activity-application-backdrop[hidden],.activity-hall-backdrop[hidden],.stage-submission-overlay[hidden],.ng-member-reward-overlay[hidden]){opacity:0;pointer-events:none}
html.ng-motion-ready :is(dialog[open],[role="dialog"]:not(dialog),.popup-modal,.ng-home-popup-card,.activity-hall-panel,.site-share-panel,.ng-support-panel,.activity-application-panel,.ng-member-reward-card,.ng-admin-dialog){animation:var(--ng-panel-animation) var(--ng-motion-panel) var(--ng-motion-ease)}
@starting-style{html.ng-motion-ready :is(dialog[open],.ng-auth-overlay:not(.hidden),.activity-application-backdrop:not([hidden]),.activity-hall-backdrop:not([hidden])){opacity:0}}
@keyframes ng-panel-original{from{opacity:0;transform:scale(.985)}to{opacity:1;transform:none}}
@keyframes ng-panel-cosmic{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:none}}
@keyframes ng-panel-aurora{from{opacity:0;transform:translateY(6px) scale(.995)}to{opacity:1;transform:none}}
@keyframes ng-panel-particles{from{opacity:0;transform:translateX(4px)}to{opacity:1;transform:none}}
@keyframes ng-panel-esports{from{opacity:0;transform:translateX(-5px) scale(.99)}to{opacity:1;transform:none}}
@keyframes ng-panel-arcade{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}
@keyframes ng-panel-gold{from{opacity:0;transform:translateY(3px) scale(.995)}to{opacity:1;transform:none}}
html.ng-motion-ready dialog::backdrop{background:color-mix(in srgb,var(--ng-motion-ink) 38%,transparent);backdrop-filter:none}
.ng-motion-loader,html.ng-motion-ready .ng-profile-dialog__spinner{display:inline-block;flex:0 0 auto;width:20px;height:20px;box-sizing:border-box;border:2px solid color-mix(in srgb,currentColor 18%,transparent);border-top-color:currentColor;border-radius:var(--ng-loader-radius);background:var(--ng-loader-background);border-width:var(--ng-loader-border);border-top-color:var(--ng-loader-top);mask:var(--ng-loader-mask);-webkit-mask:var(--ng-loader-mask);animation:var(--ng-loader-animation);vertical-align:middle}
button[aria-busy="true"]{cursor:wait}
html.ng-motion-ready button[aria-busy="true"]::after{content:"";display:inline-block;width:14px;height:14px;margin-inline-start:8px;box-sizing:border-box;border:2px solid color-mix(in srgb,currentColor 22%,transparent);border-top-color:currentColor;border-radius:var(--ng-loader-radius);background:var(--ng-loader-background);border-width:var(--ng-loader-border);border-top-color:var(--ng-loader-top);mask:var(--ng-loader-mask);-webkit-mask:var(--ng-loader-mask);animation:var(--ng-loader-animation);vertical-align:middle;pointer-events:none}
html.ng-motion-ready :is(.ng-community-state--loading,.ng-rank-prize-state[role="status"],.trial-game-loading,.lottery-inline-loading)::before{content:"";display:block;width:22px;height:22px;margin:0 auto 12px;box-sizing:border-box;border:2px solid var(--ng-motion-line);border-top-color:var(--ng-motion-primary);border-radius:var(--ng-loader-radius);background:var(--ng-loader-background);border-width:var(--ng-loader-border);border-top-color:var(--ng-loader-top);animation:var(--ng-loader-animation)}
html.ng-motion-ready .collector-refresh-indicator{animation:var(--ng-skeleton-animation)}
/* CSSLoaders gallery ports: circle01/03/05/06, line01, rect01, bubble01.
   Layout/clip-path animation is replaced by transform/opacity. MIT notice in
   MOTION-REFERENCES.txt, distributed with the CSS. */
@keyframes ng-load-original{to{transform:rotate(1turn)}}
@keyframes ng-load-cosmic{to{transform:rotate(1turn)}}
@keyframes ng-load-aurora{50%{transform:scale(.65);opacity:.45}}
@keyframes ng-load-particles{50%{transform:scaleY(.35);opacity:.6}}
@keyframes ng-load-esports{0%{transform:rotate(45deg) scale(.9)}50%{transform:rotate(225deg) scale(.65)}100%{transform:rotate(405deg) scale(.9)}}
@keyframes ng-load-arcade{50%{transform:rotate(180deg) scale(.72);opacity:.65}to{transform:rotate(1turn)}}
@keyframes ng-load-gold{to{transform:rotate(1turn)}}
html.ng-motion-ready :is(.skeleton,.is-placeholder>*,.loading-placeholder,.collector-skeleton-card .collector-cover){position:relative;overflow:hidden;background:color-mix(in srgb,var(--ng-motion-primary) 8%,var(--ng-motion-surface))!important}
html.ng-motion-ready :is(.skeleton,.is-placeholder>*,.loading-placeholder,.collector-skeleton-card .collector-cover)::after{content:"";display:block;position:absolute;inset:0;background:linear-gradient(100deg,transparent 20%,color-mix(in srgb,var(--ng-motion-surface) 80%,transparent) 50%,transparent 80%);transform:translateX(-100%);animation:var(--ng-skeleton-animation);pointer-events:none}
@keyframes ng-skeleton-original{to{transform:translateX(100%)}}
@keyframes ng-skeleton-cosmic{50%{opacity:.5}to{transform:translateX(100%) rotate(5deg)}}
@keyframes ng-skeleton-aurora{to{transform:translateX(100%) skewX(-15deg)}}
@keyframes ng-skeleton-particles{to{transform:translateX(100%) scaleX(.75)}}
@keyframes ng-skeleton-esports{to{transform:translateX(100%) skewX(20deg)}}
@keyframes ng-skeleton-arcade{50%{opacity:.4;transform:translateX(0) scale(.95)}to{transform:translateX(100%)}}
@keyframes ng-skeleton-gold{to{transform:translateX(100%) scaleX(.6)}}
.ng-rank-change{display:inline-block;min-width:12px;margin-inline-start:3px;color:var(--ng-motion-primary);font-size:11px;line-height:1}
.ng-rank-change[data-direction="down"]{color:var(--ng-danger,#b32943)}
.ng-rank-podium-card .ng-rank-podium-plaque{background:var(--ng-podium-highlight)}
[data-rank-value]{display:inline-block}
html.ng-interaction-paused{--ng-motion-play-state:paused}
html[data-motion="off"],html.ng-motion-reduced{--ng-motion-play-state:paused;--ng-motion-panel:0ms}
html.ng-interaction-paused *,html.ng-interaction-paused *::before,html.ng-interaction-paused *::after{animation-play-state:paused!important}
html[data-motion="off"] *,html[data-motion="off"] *::before,html[data-motion="off"] *::after,html.ng-motion-reduced *,html.ng-motion-reduced *::before,html.ng-motion-reduced *::after{animation:none!important;transition-duration:.01ms!important}
html[data-motion="off"]{--ng-card-hover:none;--ng-card-press:none}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition-duration:.01ms!important;scroll-behavior:auto!important}html.ng-motion-ready :is(.card,.game-card,.collector-card,.gh-platform-card,.ng-hub-card,.ng-discover-card,.ng-category-card).ng-motion-card-active::before{animation:none!important}html.ng-motion-ready :is(.card,.game-card,.collector-card,.gh-platform-card,.ng-hub-card,.ng-discover-card):hover{transform:none!important}}
@media(forced-colors:active){.ng-motion-ambient{display:none}.ng-motion-loader{border-color:CanvasText;border-top-color:Highlight}}

/* CSSLoaders: Copyright (c) 2021 CSS Loaders, MIT.
   Animista: COPYRIGHT 2017 ANA TRAVAS, FreeBSD.
   Full redistribution terms in the accompanying MOTION-REFERENCES.txt.
   That file is also included in every independent line-page distribution. */

/* Local controls extend the retained reference card without changing its arcade skin. */
.entry-actions {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 22px;
}
.entry-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 44px;
  padding: 11px 14px;
  border: 1px solid var(--line);
  border-radius: 13px;
  color: var(--ink);
  background: var(--ng-surface-decor), var(--ng-surface-fill);
  font: inherit;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.4;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease, opacity .18s ease;
}
.entry-action-primary {
  border-color: var(--blue);
  color: var(--ng-on-accent);
  background: var(--blue);
  box-shadow: 0 5px 15px color-mix(in srgb, var(--blue) 14%, transparent);
}
.entry-action:focus-visible, .preview-target:focus-visible {
  outline: 3px solid var(--blue);
  outline-offset: 4px;
}
.entry-action:not([aria-disabled="true"]):not(:disabled):hover {
  border-color: var(--blue);
  filter: brightness(1.04);
}
.entry-action[aria-disabled="true"], .entry-action:disabled {
  opacity: .48;
  cursor: wait;
  pointer-events: none;
  box-shadow: none;
}
.preview-target {
  display: block;
  margin-top: 13px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.7;
  overflow-wrap: anywhere;
  text-underline-offset: 3px;
}
.security-card .fault-state {
  position: relative;
  inset: auto;
  width: 100%;
  margin: 18px 0 0;
  box-shadow: none;
}
.security-card .fault-state button { min-height: 44px; font-size: 12px; }
.noscript-hint { margin: 16px 0 0; color: var(--muted); font-size: 12px; line-height: 1.7; }
.connection-state { max-width: 100%; padding-top: 8px; padding-bottom: 8px; }
.state-orb { flex: 0 0 7px; }
#status-text { overflow-wrap: anywhere; }
html[data-ui-theme][data-theme] body { background: var(--page); }
@media (max-width: 640px) {
  .entry-actions { margin-top: 18px; gap: 9px; }
  .entry-action { padding-right: 9px; padding-left: 9px; }
}
@media (prefers-reduced-motion: reduce) {
  .entry-action { transition: none; }
  body.is-leaving .cinema-stage { filter: none; transform: none; }
}

  
/* Playback adaptation: source layout and motion are retained. */
.security-subtitle{font-size:16px;line-height:1.9;margin-top:14px}
.security-subtitle strong{color:var(--blue);font-weight:750}
.film-info{font-size:12px;line-height:1.8;color:var(--muted);margin:14px 0 0;overflow-wrap:anywhere}
.film-info span{font-weight:650;color:var(--ink);margin-left:7px}
.destination-note{font-size:11px;line-height:1.8;color:var(--muted);margin:14px 0 0;overflow-wrap:anywhere}
.quality-note{font-size:10px;color:var(--muted);line-height:1.8;margin:17px 0 0}
.entry-action[aria-disabled="true"]{opacity:.5;pointer-events:none}
.entry-actions{display:flex;justify-content:center;margin-top:24px}
.entry-action-primary{width:min(100%,300px);min-height:50px;gap:16px;padding:14px 24px;border-radius:15px;font-size:14px;letter-spacing:.04em;background:linear-gradient(115deg,var(--blue),color-mix(in srgb,var(--blue) 80%,var(--cyan)));box-shadow:0 8px 22px color-mix(in srgb,var(--blue) 20%,transparent),inset 0 1px rgb(255 255 255 / .2)}
.entry-action-primary svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;transition:transform .18s ease}
.entry-action-primary:hover svg{transform:translateX(3px)}
.security-card .auto-hint{margin-top:15px}
.security-card .destination-note{margin-top:8px}
@media(max-width:480px){.entry-action-primary{width:min(100%,280px);min-height:49px}.entry-actions{margin-top:21px}}
.security-card.is-paused .scan-orbit::after,.security-card.is-paused .scan-ring-secondary{animation-play-state:paused}
.entry-error{font-size:12px;line-height:1.8;color:var(--danger);margin-top:16px}
@media(max-width:480px){.security-subtitle{font-size:14px}.security-card{padding-top:28px;padding-bottom:24px}}
