/* KalEdge casino-luxury homepage (2026-10-02). FORM from ChatGPT's brief; content per Abdi's corrections.
 * Scoped to .kal.casino so removing that class restores the previous look. Background never animates.
 * Glow order: mic > Ask > avatar > Start free > outer panel. Gold = trim/accents, purple = Scout/AI, green = live. */
.kal.casino {
  --cz-bg: #05040A; --cz-panel: #090711; --cz-panel-p: #100B1C; --cz-purple: #A855F7; --cz-purple-b: #C084FC;
  --cz-violet: #7C3AED; --cz-gold: #F6C453; --cz-gold-b: #FFD978; --cz-gold-d: #B7791F; --cz-green: #34D399;
  --cz-red: #F43F5E; --cz-text: #F8FAFC; --cz-text2: #C8C3D5; --cz-muted: #8E879E;
  background:
    linear-gradient(rgba(5,3,10,.42), rgba(5,3,10,.68) 70%, #05040A) top center / 100% 1150px no-repeat,
    url('/images/kaledge-casino-bg.jpg') top center / max(100%, 2050px) auto no-repeat,
    #05040A;
  background:
    linear-gradient(rgba(5,3,10,.42), rgba(5,3,10,.68) 70%, #05040A) top center / 100% 1150px no-repeat,
    image-set(url('/images/kaledge-casino-bg.webp') type('image/webp'), url('/images/kaledge-casino-bg.jpg') type('image/jpeg'))
      top center / max(100%, 2050px) auto no-repeat,
    #05040A;
}

/* ── nav: floating glass bar with gold trim ── */
.kal.casino .nav { top: 14px; background: none; border: 0; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
.kal.casino .nav .wrap { max-width: 1420px; height: 74px; margin: 14px auto 0; padding: 0 26px; border-radius: 24px;
  background: rgba(5,4,10,.88); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);
  border: 1px solid rgba(246,196,83,.65); box-shadow: 0 0 28px rgba(246,196,83,.10), 0 8px 40px rgba(0,0,0,.35); }
.kal.casino .nav .brand { color: #fff; }
.kal.casino .nav .brand b { color: var(--cz-purple); }
.kal.casino .nav nav a { color: var(--cz-text2); }
.kal.casino .nav nav a:hover { color: var(--cz-gold-b); }
.kal.casino .nav .live { color: var(--cz-text2); }
.kal.casino .nav .btn-primary { position: relative; overflow: hidden; color: #120C04; border: 0; font-weight: 700;
  background: linear-gradient(135deg, #FFE08A, #F6C453, #E3A72F); box-shadow: 0 0 18px rgba(246,196,83,.28); }
.kal.casino .nav .btn-primary::after { content: ''; position: absolute; inset: 0; transform: translateX(-120%);
  background: linear-gradient(100deg, transparent 30%, rgba(255,255,255,.55) 50%, transparent 70%); transition: transform .6s ease; }
.kal.casino .nav .btn-primary:hover::after { transform: translateX(120%); }

/* ── the main panel ── */
.kal.casino #scout-stage { position: relative; max-width: 1280px; margin: 28px auto 8px; color: var(--cz-text); animation: cz-in .5s ease-out; }
@keyframes cz-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.kal.casino #scout-stage .ss-wrap { grid-template-columns: minmax(300px, 40%) 1fr; gap: 26px; padding: 20px; border-radius: 28px;
  background: linear-gradient(135deg, rgba(9,7,17,.96), rgba(4,3,9,.94)); border: 1px solid rgba(246,196,83,.60);
  box-shadow: 0 0 34px rgba(246,196,83,.10), 0 0 60px rgba(168,85,247,.08), 0 30px 80px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.05); }
.kal.casino #scout-stage .ss-wrap:fullscreen { max-width: none; border-radius: 0; overflow: auto; }

/* robot column */
.kal.casino .cz-robotcol { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.kal.casino #scout-stage .ss-robot { border-radius: 22px; border: 1px solid rgba(246,196,83,.72);
  box-shadow: inset 0 0 40px rgba(168,85,247,.28), 0 0 26px rgba(168,85,247,.22); background: #0b0614; }
.kal.casino #scout-stage .ss-badge { top: 12px; bottom: auto; left: 12px; background: rgba(5,5,11,.82); border: 1px solid rgba(246,196,83,.42); }
/* toward the smiling robot: happy-arc eyes and a smile when he's not showing another expression */
.kal.casino #scout-stage .ss-robot:not(.ex-sad):not(.ex-focused):not(.ex-excited):not(.ex-wink):not(.is-sleepy):not(.blink) .ss-eye {
  clip-path: inset(0 0 52% 0 round 50%); transform: translateY(18%); }
.kal.casino #scout-stage .ss-mouth { width: calc(15% * var(--mw)); height: 5.5%; top: 50%; background: none;
  border: 3px solid rgba(255,236,255,.92); border-top: 0; border-radius: 0 0 999px 999px;   /* a smile, like the mockup */
  box-shadow: 0 6px 14px -6px rgba(214,140,255,.9); opacity: calc(.8 + var(--mouth) * .2);
  transform: translate(-50%, -50%) scaleY(calc(.85 + var(--mouth) * 1.2 * var(--mh))); }
/* speaker pill, bottom centre of the robot */
.kal.casino #scout-stage .cz-speaker { position: absolute; left: 50%; bottom: 14px; transform: translateX(-50%); z-index: 3;
  padding: 10px 16px; border-radius: 14px; background: rgba(5,5,11,.82); border: 1px solid rgba(246,196,83,.42);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); font-size: 14px; }
.kal.casino #scout-stage .ss-robot.is-speaking .cz-speaker { box-shadow: 0 0 14px rgba(52,211,153,.35); border-color: rgba(52,211,153,.6); }
/* control bar */
.kal.casino .cz-ctrl { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 18px;
  background: rgba(5,4,10,.86); border: 1px solid rgba(246,196,83,.40); }
.kal.casino .cz-status { display: inline-flex; align-items: center; gap: 8px; margin-right: auto; font-size: 13px; color: var(--cz-text2); min-width: 0; }
.kal.casino .cz-status i { flex: 0 0 auto; width: 9px; height: 9px; border-radius: 50%; background: var(--cz-green);
  box-shadow: 0 0 10px var(--cz-green); animation: cz-pulse 2.2s ease-in-out infinite; }
.kal.casino .cz-status.off i { background: var(--cz-red); box-shadow: 0 0 10px var(--cz-red); }
@keyframes cz-pulse { 50% { opacity: .45; } }
.kal.casino #scout-stage .cz-icon { width: 46px; height: 46px; padding: 0; display: inline-grid; place-items: center; border-radius: 14px;
  font-size: 18px; background: rgba(10,7,16,.85); border: 1px solid rgba(246,196,83,.45); }
.kal.casino #scout-stage .cz-mic { white-space: nowrap; padding: 12px 18px; border-radius: 16px; border: 0; color: #fff;
  background: linear-gradient(135deg, #7C3AED, #A855F7, #D946EF);
  box-shadow: 0 0 26px rgba(168,85,247,.65), 0 0 46px rgba(217,70,239,.35); animation: cz-breathe 3.4s ease-in-out infinite; }
@keyframes cz-breathe { 50% { box-shadow: 0 0 34px rgba(168,85,247,.85), 0 0 60px rgba(217,70,239,.45); } }
.kal.casino #scout-stage .cz-hands { padding: 10px 12px; font-size: 13px; background: rgba(10,7,16,.85); border: 1px solid rgba(246,196,83,.35); }

/* right column */
.kal.casino #scout-stage .ss-name { font-size: clamp(48px, 5vw, 68px); font-weight: 800; letter-spacing: -.04em;
  background: linear-gradient(180deg, #FFFFFF, #EFE2C0); -webkit-background-clip: text; background-clip: text; color: transparent; }
.kal.casino #scout-stage .ss-light { font-size: 16px; color: var(--cz-green); opacity: 1; }
.kal.casino #scout-stage .ss-role { color: var(--cz-text2); opacity: 1; }
.kal.casino .cz-disclaimer { margin: 6px 0 12px; padding: 14px 18px; border-radius: 18px;
  background: linear-gradient(135deg, rgba(57,35,14,.30), rgba(21,13,26,.72)); border: 1px solid rgba(246,196,83,.65); }
.kal.casino .cz-disc-head { color: var(--cz-gold); font-weight: 800; font-size: 13px; letter-spacing: .06em; margin-bottom: 6px; }
.kal.casino #scout-stage .cz-disclaimer .ss-say { font-size: 14px; color: var(--cz-text2); opacity: 1; margin: 0; }
.kal.casino .cz-said { display: flex; gap: 14px; align-items: flex-start; }
.kal.casino .cz-said-icon { flex: 0 0 auto; width: 56px; height: 56px; border-radius: 50%; object-fit: cover;
  border: 1px solid rgba(168,85,247,.55); box-shadow: 0 0 14px rgba(168,85,247,.35); }
.kal.casino #scout-stage .cz-said .ss-bubble { flex: 1; height: auto; max-height: 190px; border-radius: 18px;
  background: linear-gradient(135deg, rgba(31,18,45,.86), rgba(17,12,29,.92)); border: 1px solid rgba(168,85,247,.40); }
.kal.casino #scout-stage .ss-bets { color: var(--cz-text); font-weight: 500; font-size: 16px; }
.kal.casino #scout-stage .ss-controls .ss-btn { background: rgba(10,7,16,.75); border: 1px solid rgba(246,196,83,.55); color: #F9E2A7;
  transition: transform .18s, border-color .18s, box-shadow .18s; }
.kal.casino #scout-stage .ss-controls .ss-btn:hover { border-color: var(--cz-gold-b); box-shadow: 0 0 14px rgba(246,196,83,.22); transform: translateY(-1px); }
.kal.casino #scout-stage .ss-form input { height: 64px; border-radius: 18px; background: rgba(5,4,10,.92); border: 1px solid rgba(246,196,83,.55);
  box-shadow: inset 0 0 18px rgba(168,85,247,.10); color: var(--cz-text); }
.kal.casino #scout-stage .ss-form input::placeholder { color: var(--cz-muted); }
.kal.casino #scout-stage .ss-form .ss-btn { border-radius: 16px; border: 0; color: #fff; font-weight: 700; padding: 0 26px;
  background: linear-gradient(135deg, #7C3AED, #A855F7); box-shadow: 0 0 18px rgba(168,85,247,.45); }
.kal.casino #scout-stage .ss-chips .ss-chip { background: rgba(7,5,12,.82); border: 1px solid rgba(246,196,83,.38); color: var(--cz-text);
  transition: transform .18s, border-color .18s, background .18s; }
.kal.casino #scout-stage .ss-chips .ss-chip:hover { background: rgba(57,35,14,.22); border-color: rgba(255,217,120,.80); transform: translateY(-1px); }
.kal.casino #scout-stage .ss-interests .ss-chip { background: rgba(8,6,14,.82); border: 1px solid rgba(246,196,83,.40); color: var(--cz-text); }
.kal.casino #scout-stage .ss-interests .ss-chip[aria-pressed="true"] { border-color: var(--cz-gold); background: rgba(246,196,83,.10);
  box-shadow: 0 0 12px rgba(246,196,83,.22); }
.kal.casino #scout-stage .ss-chip[data-sport="Basketball"]::before { content: '🏀 '; }
.kal.casino #scout-stage .ss-chip[data-sport="Football"]::before { content: '🏈 '; }
.kal.casino #scout-stage .ss-chip[data-sport="Boxing"]::before { content: '🥊 '; }
.kal.casino #scout-stage .ss-chip[data-sport="MMA"]::before { content: '🤼 '; }
/* the play-money board stays by Scout, slimmer; its numbers moved to the stat cards */
.kal.casino #scout-stage .ss-board { border-color: transparent;
  background: linear-gradient(#090711, #090711) padding-box, linear-gradient(135deg, #F6C453, #A855F7 60%, #34D399) border-box; }
.kal.casino #scout-stage .ss-board-flag { color: var(--cz-gold); }

/* the chat log only takes space once there's a conversation */
.kal.casino #scout-stage .ss-log:empty, .kal.casino #scout-stage .ss-agents:empty { display: none; }

/* stat cards under the panel (real data from the record) */
.kal.casino .cz-cards { margin: 18px 0; }
.kal.casino #scout-stage .cz-cards .ss-board-grid { grid-template-columns: repeat(6, 1fr); gap: 12px; margin: 0; }
.kal.casino #scout-stage .cz-cards .ss-tile { padding: 14px 16px; border-radius: 18px;
  background: linear-gradient(145deg, rgba(9,7,15,.94), rgba(13,8,18,.90)); border: 1px solid rgba(246,196,83,.36); }
.kal.casino #scout-stage .cz-cards .ss-tile span { color: var(--cz-gold); opacity: 1; font-size: 12px; letter-spacing: .04em; }
.kal.casino #scout-stage .cz-cards .ss-tile b { font-size: 19px; color: var(--cz-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kal.casino #scout-stage .cz-cards .ss-tile b.up { color: var(--cz-green); } .kal.casino #scout-stage .cz-cards .ss-tile b.down { color: var(--cz-red); }
.kal.casino #scout-stage .ss-panel { background: linear-gradient(145deg, rgba(9,7,15,.94), rgba(13,8,18,.90)); border: 1px solid rgba(246,196,83,.30); }

/* desktop-only decorations outside the panel (gold, wide spacing, never bigger than Scout) */
.kal.casino .cz-deco { display: none; }
@media (min-width: 1720px) {
  .kal.casino .cz-deco { display: flex; flex-direction: column; position: absolute; top: 60px; width: 190px; gap: 14px; }
  .kal.casino .cz-deco-left { left: -212px; width: 196px; top: 120px; color: var(--cz-gold); font: 700 18px/1.3 var(--sans, sans-serif);
    letter-spacing: .20em; text-shadow: 0 0 18px rgba(246,196,83,.35); }
  .kal.casino .cz-deco-right { right: -212px; width: 196px; }
  .kal.casino .cz-words { display: flex; flex-direction: column; gap: 4px; color: var(--cz-gold); font-weight: 700; letter-spacing: .20em; font-size: 15px; }
  .kal.casino .cz-sideboard { padding: 14px; border-radius: 16px; background: rgba(5,4,10,.82); border: 1px solid rgba(246,196,83,.55);
    box-shadow: 0 0 22px rgba(246,196,83,.10); }
  .kal.casino .cz-sb-head { color: var(--cz-gold); font-weight: 800; letter-spacing: .14em; font-size: 14px; margin-bottom: 8px; }
  .kal.casino .cz-sb-row { padding: 7px 0; border-top: 1px solid rgba(246,196,83,.18); }
  .kal.casino .cz-sb-row:first-child { border-top: 0; }
  .kal.casino .cz-sb-name { font-size: 12px; font-weight: 700; color: var(--cz-text); }
  .kal.casino .cz-sb-nums { font: 11px/1.4 var(--mono, monospace); color: var(--cz-green); }
  .kal.casino .cz-sb-foot, .kal.casino .cz-sb-empty { margin-top: 8px; font-size: 11px; color: var(--cz-muted); }
}

@media (max-width: 1050px) {
  .kal.casino #scout-stage .ss-wrap { gap: 18px; }
  .kal.casino #scout-stage .ss-name { font-size: clamp(40px, 6vw, 54px); }
  .kal.casino #scout-stage .cz-cards .ss-board-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 800px) {
  .kal.casino { background: linear-gradient(rgba(5,3,10,.62), rgba(5,3,10,.82) 60%, #05040A) top center / 100% 900px no-repeat,
    url('/images/kaledge-casino-bg.jpg') top center / auto 900px no-repeat, #05040A; }
  .kal.casino .nav .wrap { margin: 8px 10px 0; height: 64px; padding: 0 14px; }
  .kal.casino #scout-stage .ss-wrap { grid-template-columns: 1fr; padding: 14px; border-radius: 22px; }
  .kal.casino .cz-robotcol { max-width: 420px; width: 100%; margin: 0 auto; }
  .kal.casino #scout-stage .cz-cards .ss-board-grid { grid-template-columns: repeat(2, 1fr); }
  .kal.casino .cz-said-icon { width: 44px; height: 44px; }
}
@media (prefers-reduced-motion: reduce) {
  .kal.casino #scout-stage, .kal.casino .cz-status i, .kal.casino #scout-stage .cz-mic { animation: none; }
  .kal.casino .nav .btn-primary::after { display: none; }
}
/* Windows High Contrast: backgrounds/gradients drop out; keep text, borders and focus visible */
@media (forced-colors: active) {
  .kal.casino #scout-stage .ss-name { color: CanvasText; background: none; }
  .kal.casino .cz-disclaimer, .kal.casino .cz-ctrl, .kal.casino #scout-stage .cz-cards .ss-tile, .kal.casino .nav .wrap,
  .kal.casino #scout-stage .ss-wrap { border: 1px solid CanvasText; }
  .kal.casino .cz-status i { forced-color-adjust: none; background: Highlight; }
}