* { margin: 0; padding: 0; box-sizing: border-box; user-select: none; }
  :root {
    --neon: #00ff88; --neon-dim: #00aa55; --silver: #8899aa;
    --silver-light: #b0c0cc; --panel-bg: #0e1020;
  }

  body {
    background: #06040c;
    color: #fff;
    font-family: 'Segoe UI', Tahoma, sans-serif;
    overflow: hidden;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    touch-action: manipulation; /* prevent double-tap zoom */
    -webkit-touch-callout: none;
    -webkit-tap-highlight-color: transparent;
  }

  /* ===== GAME CONTAINER with BG IMAGE ===== */
  #game-container {
    width: 1100px;
    height: 825px;
    position: relative;
    overflow: hidden;
    border-radius: 8px;
  }

  /* Background image layer */
  #game-bg {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    z-index: 0;
    background: url('slotgame.webp') center/cover no-repeat;
    background-image: -webkit-image-set(url('slotgame.webp') type('image/webp'), url('slotgame.jpg') type('image/jpeg'));
  }

  /* ===== INFO BOXES — positioned individually ===== */
  .top-bar { display:none; } /* replaced by individual positioned boxes */

  .info-box {
    position:absolute; z-index:6;
    background: rgba(6,10,20,0.8);
    border: 1px solid rgba(0,255,136,0.3);
    border-radius: 8px; padding: 4px 18px; text-align: center;
  }
  .info-box-label { font-size: 10px; color: var(--neon); text-transform: uppercase; letter-spacing: 2px; opacity:0.8; }
  .info-box-value { font-size: 26px; font-weight: 900; color: #fff; text-shadow: 0 0 12px rgba(0,255,136,0.4); }

  .box-balance { display:none; }
  .box-lines   { display:none; }
  .box-win     { display:none; }

  .box-jackpot {
    left: 16px; top: 4px; min-width: 100px;
    background:rgba(6,10,20,0.85); border:1px solid rgba(255,215,0,0.5);
  }
  .box-jackpot .info-box-label { color:#ffd700; }
  .box-jackpot .info-box-value {
    font-size:22px;
    background:linear-gradient(90deg,#ffd700,#ffaa00,#ffd700);
    background-size:200% 100%;
    -webkit-background-clip:text; -webkit-text-fill-color:transparent;
    animation:shimmer 2s ease-in-out infinite;
  }

  .game-title { display:none; } /* title is in the BG image */
  @keyframes shimmer { 0%,100%{background-position:0% 50%} 50%{background-position:200% 50%} }
  .info-bar { display:none; }

  /* ===== REEL FRAME — transparent, positioned precisely over BG grid ===== */
  .reel-frame {
    position: absolute;
    left: calc(50% + 5px); top: 169px;
    transform: translateX(-50%);
    width: 960px;
    background: transparent;
    border-radius: 0; border: none; box-shadow: none;
    overflow: hidden; z-index: 2; padding: 8px 10px;
  }
  .reels-row { display: flex; justify-content: center; gap: 14px; }
  .reel-container {
    width: 165px; height: 468px; overflow: hidden; position: relative;
    border-radius: 8px;
    background: transparent;
    border: none;
    box-shadow: none;
  }
  .reel-canvas { position: absolute; left: 0; width: 165px; will-change: transform; }
  .reel-container::before, .reel-container::after {
    content:''; position:absolute; left:0; right:0; height:0;
    z-index:2; pointer-events:none;
  }
  .reel-container::before{top:156px} .reel-container::after{top:312px}
  .reel-fade-top,.reel-fade-bot { display:none; }

  #win-overlay { position:absolute; top:0; left:0; right:0; bottom:0; pointer-events:none; z-index:5; }
  .win-cell {
    position:absolute; border:2px solid var(--neon); border-radius:10px;
    box-shadow:0 0 25px rgba(0,255,136,0.6), inset 0 0 12px rgba(0,255,136,0.15);
  }

  /* ===== WIN / MSG ===== */
  #win-display { color:#fff; text-shadow:0 0 12px rgba(0,255,136,0.5); transition:all 0.2s; }
  #win-display.big { animation: big-pulse 0.3s ease-in-out infinite alternate; }
  @keyframes big-pulse { 0%{transform:scale(1)} 100%{transform:scale(1.06);color:var(--neon)} }
  .msg-area {
    position:absolute; bottom:160px; left:0; right:0;
    text-align:center; height:18px; font-size:13px; color:rgba(0,255,136,0.8); z-index:6;
    text-shadow: 0 0 10px rgba(0,255,136,0.4);
  }

  /* Spin button — centered over steering wheel */
  .btn-spin-wrap {
    position:absolute; bottom:43px; left:calc(50% + 3px); transform:translateX(-50%); z-index:6;
  }

  /* ===== BOTTOM CONTROL BAR — left aligned ===== */
  .controls {
    position:absolute; bottom:62px; left:80px;
    display:flex; align-items:center; gap:12px;
    padding:0; z-index:5;
  }

  .ctrl-group { display:flex; flex-direction:column; align-items:center; gap:2px; }
  .ctrl-label { font-size:12px; color:#3a5a4a; text-transform:uppercase; letter-spacing:2px; opacity:1; }
  .ctrl-value {
    font-size:18px; font-weight:900; color:#fff; min-width:80px; text-align:center;
    background:rgba(6,10,20,0.7);
    padding:4px 12px; border-radius:8px; border:1px solid rgba(0,255,136,0.2);
    text-shadow:0 0 8px rgba(0,255,136,0.3);
  }

  .btn { font-weight:700; border:none; cursor:pointer; border-radius:8px; transition:all 0.12s; text-transform:uppercase; letter-spacing:1px; }
  .btn:active{transform:scale(0.95)} .btn:disabled{opacity:0.35;cursor:not-allowed;transform:none}

  /* SPIN button — neon green, positioned where steering wheel is */
  .btn-spin {
    width:110px; height:110px; border-radius:50%; font-size:24px;
    background: radial-gradient(circle at 40% 35%, #33ff99, #00cc66 50%, #008844 100%);
    color:#fff; letter-spacing:3px;
    border:3px solid rgba(0,255,136,0.6);
    box-shadow:
      0 0 30px rgba(0,255,136,0.5),
      0 0 60px rgba(0,255,136,0.15),
      inset 0 -3px 10px rgba(0,0,0,0.4),
      inset 0 2px 6px rgba(255,255,255,0.15);
    text-shadow: 0 2px 8px rgba(0,0,0,0.6);
  }
  .btn-spin:hover:not(:disabled){
    background: radial-gradient(circle at 40% 35%, #66ffbb, #22ee77 50%, #00cc66 100%);
    box-shadow: 0 0 50px rgba(0,255,136,0.7), 0 0 100px rgba(0,255,136,0.25),
      inset 0 -3px 10px rgba(0,0,0,0.4), inset 0 2px 6px rgba(255,255,255,0.15);
  }

  .btn-sm {
    width:36px; height:36px; font-size:18px; border-radius:50%;
    background:linear-gradient(180deg, #3388cc, #2266aa);
    color:#fff; border:2px solid #55aadd;
    box-shadow: 0 2px 6px rgba(0,0,0,0.3);
  }
  .btn-sm:hover:not(:disabled){background:linear-gradient(180deg,#44aaee,#3388cc)}
  .btn-sm:last-of-type {
    background:linear-gradient(180deg, #dd8833, #bb6622);
    border-color: #eeaa55;
  }
  .btn-sm:last-of-type:hover:not(:disabled){background:linear-gradient(180deg,#eeaa44,#dd8833)}

  .btn-max {
    position:absolute; bottom:48px; right:235px; z-index:5;
    height:56px; padding:0 18px; font-size:14px; font-weight:900;
    background:linear-gradient(180deg, var(--silver-light), var(--silver));
    color:#111; border:1px solid var(--silver-light);
    box-shadow:0 2px 8px rgba(0,0,0,0.3);
    line-height:1.1;
  }
  .btn-max:hover:not(:disabled){ filter:brightness(1.15); }

  .btn-balance {
    position:absolute; bottom:48px; right:80px; z-index:5;
    height:56px; padding:0 18px; font-size:14px; font-weight:900;
    background:linear-gradient(180deg, #33cc88, #22aa66);
    color:#fff; border:1px solid #44dd99;
    box-shadow:0 2px 8px rgba(0,0,0,0.3);
    line-height:1.1;
  }
  .btn-balance:hover{ filter:brightness(1.15); }

  .btn-auto {
    /* styled same as bottom-btn, positioned in nav-right */
    padding:5px 16px; font-size:10px; font-weight:700;
    background:rgba(6,10,20,0.6);
    color:rgba(0,255,136,0.7); border:1px solid rgba(0,255,136,0.15); border-radius:6px;
    text-transform:uppercase; letter-spacing:1px; backdrop-filter:blur(4px);
  }
  .btn-auto:hover{background:rgba(10,20,30,0.8); border-color:var(--neon); color:var(--neon);}
  .btn-auto.on{box-shadow:0 0 12px rgba(0,255,136,0.4); border-color:var(--neon); color:var(--neon);}

  .bet-row { display:flex; align-items:center; gap:6px; }

  /* Nav buttons — right side */
  .nav-right {
    position:absolute; bottom:5px; right:50px;
    display:flex; gap:8px; z-index:5;
  }
  .bottom-btn {
    padding:5px 16px; font-size:10px; font-weight:700; cursor:pointer;
    background:rgba(6,10,20,0.6);
    color:rgba(0,255,136,0.7); border:1px solid rgba(0,255,136,0.15); border-radius:6px;
    text-transform:uppercase; letter-spacing:1px; transition:all 0.12s;
    backdrop-filter:blur(4px);
  }
  .bottom-btn:hover { background:rgba(10,20,30,0.8); border-color:var(--neon); color:var(--neon); }

  /* Robber hunt canvas */
  #robber-canvas { border-radius:10px; border:2px solid rgba(0,255,136,0.2); cursor:pointer; display:block; }
  #robber-panel.show { display:flex; }

  .paytable-btn, .map-btn { display:none !important; }

  /* ===== HAND PAY OVERLAY ===== */
  .handpay-overlay {
    display:none; position:absolute; top:0; left:0; right:0; bottom:0;
    background:rgba(0,0,0,0.95); z-index:55;
    flex-direction:column; align-items:center; justify-content:center; gap:10px;
  }
  .handpay-overlay.show { display:flex; }
  .handpay-title {
    font-size:48px; font-weight:900; letter-spacing:6px;
    background:linear-gradient(90deg, #ffd700, #ff6b35, #ffd700);
    background-size:200% 100%;
    -webkit-background-clip:text; -webkit-text-fill-color:transparent;
    animation:shimmer 1.5s ease-in-out infinite;
    filter:drop-shadow(0 0 20px rgba(255,215,0,0.6));
  }
  .handpay-amount {
    font-size:40px; font-weight:900; color:#ffd700;
    text-shadow:0 0 30px rgba(255,215,0,0.5);
  }
  .handpay-prize {
    font-size:32px; font-weight:700; color:var(--neon);
    text-shadow:0 0 20px rgba(0,255,136,0.5);
    margin:8px 0;
    padding:10px 30px;
    border:2px solid rgba(0,255,136,0.4);
    border-radius:12px;
    background:rgba(0,255,136,0.05);
  }
  .handpay-msg {
    font-size:14px; color:#888; margin-top:6px;
  }
  .handpay-pin-row {
    display:flex; align-items:center; gap:10px; margin-top:10px;
  }
  .handpay-pin-input {
    width:160px; height:46px; text-align:center; font-size:24px; letter-spacing:10px;
    background:rgba(10,10,20,0.8); border:2px solid rgba(255,215,0,0.4); color:#ffd700;
    border-radius:8px; font-family:inherit;
  }
  .handpay-pin-input:focus { border-color:#ffd700; outline:none; }
  .handpay-pin-btn {
    padding:10px 24px; font-size:14px; font-weight:700; cursor:pointer;
    background:linear-gradient(180deg, #ffd700, #cc9900); color:#111;
    border:1px solid #ffee66; border-radius:8px;
  }
  .handpay-error { color:#ff4444; font-size:12px; height:16px; }
  .handpay-coupon { max-width:300px; max-height:200px; border-radius:12px; border:2px solid rgba(0,255,136,0.4); margin-bottom:6px; }
  .addmoney-overlay {
    display:none; position:absolute; top:0; left:0; right:0; bottom:0;
    background:rgba(0,0,0,0.95); z-index:55;
    flex-direction:column; align-items:center; justify-content:center; gap:10px;
  }
  .addmoney-overlay.show { display:flex; }
  .addmoney-title {
    font-size:40px; font-weight:900; letter-spacing:4px; color:#ffd700;
    text-shadow:0 0 20px rgba(255,215,0,0.5);
  }
  .addmoney-image { max-width:340px; max-height:180px; border-radius:12px; border:2px solid rgba(255,215,0,0.3); margin-bottom:4px; }
  .daddy-bank-body { display:flex; gap:30px; align-items:flex-start; margin-top:8px; }
  .bank-side { display:flex; flex-direction:column; align-items:center; gap:10px; padding:16px 24px; border-radius:12px; min-width:200px; }
  .bank-side-withdraw { background:rgba(68,221,136,0.06); border:1px solid rgba(68,221,136,0.25); }
  .bank-side-debt { background:rgba(255,68,68,0.06); border:1px solid rgba(255,68,68,0.25); }
  .bank-side-title { font-size:16px; font-weight:900; letter-spacing:2px; text-transform:uppercase; }
  .bank-input {
    width:140px; height:46px; text-align:center; font-size:22px;
    background:rgba(10,10,20,0.8); border:2px solid rgba(68,221,136,0.4); color:#44dd88;
    border-radius:8px; font-family:inherit;
  }
  .bank-input:focus { border-color:#44dd88; outline:none; }
  .bank-pin-input {
    width:140px; height:46px; text-align:center; font-size:24px; letter-spacing:10px;
    background:rgba(10,10,20,0.8); border:2px solid rgba(68,221,136,0.4); color:#44dd88;
    border-radius:8px; font-family:inherit;
  }
  .bank-pin-input:focus { border-color:#44dd88; outline:none; }
  .bank-btn-withdraw {
    padding:10px 24px; font-size:14px; font-weight:700; cursor:pointer;
    background:linear-gradient(180deg, #44dd88, #22aa55); color:#111;
    border:1px solid #66ffaa; border-radius:8px; width:100%;
  }
  .bank-debt-amount {
    font-size:36px; font-weight:900; color:#ff4444;
    text-shadow:0 0 15px rgba(255,68,68,0.4);
  }
  .bank-debt-label { font-size:12px; color:#aa6666; }
  .addmoney-cancel {
    padding:8px 20px; font-size:13px; font-weight:700; cursor:pointer;
    background:transparent; color:#888; border:1px solid #444; border-radius:8px; margin-top:8px;
  }
  .addmoney-error { color:#ff4444; font-size:12px; height:16px; }
  .img-lightbox { display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.85);z-index:100000;align-items:center;justify-content:center;cursor:pointer; }
  .img-lightbox.show { display:flex; }
  .img-lightbox img { max-width:90vw;max-height:90vh;border-radius:8px;border:2px solid rgba(100,60,180,0.5);box-shadow:0 0 40px rgba(100,60,180,0.4); }

  /* ===== COLLECTION GALLERY ===== */
  .collection-panel { background:rgba(5,5,15,0.97); overflow-y:auto; padding:30px; }
  .collection-panel.show { display:block; }
  .collection-inner { max-width:750px; margin:0 auto; }
  .collection-inner h2 { color:#ffd700; text-align:center; margin-bottom:16px; font-size:22px; }
  .collection-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
  .collection-card {
    background:rgba(20,20,40,0.8); border:1px solid rgba(0,255,136,0.2); border-radius:10px;
    padding:10px; text-align:center; transition:all 0.2s;
  }
  .collection-card.redeemed { opacity:0.45; border-color:rgba(100,100,100,0.2); }
  .collection-card img { width:100%; max-height:140px; object-fit:cover; border-radius:8px; margin-bottom:6px; }
  .collection-card .cc-placeholder { width:100%; height:100px; background:rgba(40,40,60,0.5); border-radius:8px; margin-bottom:6px; display:flex; align-items:center; justify-content:center; color:#555; font-size:36px; }
  .collection-card .cc-name { font-size:14px; font-weight:700; color:var(--neon); }
  .collection-card .cc-amount { font-size:12px; color:#ffd700; }
  .collection-card .cc-date { font-size:10px; color:#666; margin-top:2px; }
  .collection-card .cc-redeem-btn {
    margin-top:6px; padding:4px 14px; font-size:10px; font-weight:700; cursor:pointer;
    background:linear-gradient(180deg,var(--neon),#00aa55); color:#111; border:none; border-radius:5px;
  }
  .collection-card.redeemed .cc-redeem-btn { display:none; }
  .collection-card.redeemed .cc-name { text-decoration:line-through; color:#666; }
  .collection-empty { text-align:center; color:#555; font-size:14px; padding:40px; }
  .btn-close-coll { display:block; margin:18px auto 0; padding:10px 30px; font-size:14px; background:linear-gradient(180deg,#ff6b35,#cc4400); color:#fff; border:1px solid #ff8855; border-radius:8px; cursor:pointer; font-weight:700; }
  .collection-badge {
    position:absolute; top:-6px; right:-6px; width:18px; height:18px; border-radius:50%;
    background:#ff4444; color:#fff; font-size:9px; font-weight:900;
    display:flex; align-items:center; justify-content:center; line-height:1;
  }

  /* ===== MAP REVEAL ===== */
  .map-panel { background:rgba(5,5,15,0.97); }
  .map-panel.show { display:flex; }
  .map-inner { display:flex; flex-direction:column; align-items:center; gap:14px; max-width:95vw; width:100%; }
  .map-title { font-size:32px; font-weight:900; color:#ffd700; letter-spacing:3px; }
  .map-progress { font-size:17px; color:#88aa66; }
  .map-canvas-wrap {
    position:relative; width:min(990px,90vw); height:min(560px,55vh);
    border:2px solid #3a5a2a; border-radius:12px; overflow:hidden;
    background:#111;
  }
  .map-canvas-wrap canvas { position:absolute; top:0; left:0; width:100%; height:100%; }
  .map-close-btn {
    padding:14px 40px; font-size:18px;
    background:linear-gradient(180deg,#ff6b35,#cc4400); color:#fff; border:1px solid #ff8855;
  }
  .map-stage-toast {
    position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
    font-size:36px; font-weight:900; color:#ffd700;
    text-shadow:0 0 30px rgba(255,215,0,0.7), 0 0 60px rgba(255,215,0,0.3);
    opacity:0; transition:opacity 0.5s;
    pointer-events:none; text-align:center;
  }
  .map-stage-toast.show { opacity:1; }
  .map-journey-complete {
    font-size:36px;
    background:linear-gradient(90deg,#00ffcc,#ffd700,#ff6b35,#ffd700,#00ffcc);
    background-size:300% 100%;
    -webkit-background-clip:text; -webkit-text-fill-color:transparent;
    animation:rainbow 2s linear infinite;
  }
  .overlay-panel { display:none; position:absolute; top:0; left:0; right:0; bottom:0; z-index:20; flex-direction:column; align-items:center; justify-content:center; }
  .overlay-panel.show{display:flex}
  .paytable-panel { background:rgba(5,5,20,0.96); overflow-y:auto; padding:30px; }
  .paytable-panel.show{display:block}
  .pt-inner { max-width:680px; margin:0 auto; }
  .pt-inner h2 { color:#ffd700; text-align:center; margin-bottom:18px; font-size:24px; }
  .pt-row { display:flex; align-items:center; gap:14px; padding:7px 10px; border-bottom:1px solid rgba(100,60,180,0.15); }
  .pt-row canvas { width:48px; height:48px; flex-shrink:0; }
  .pt-name { width:95px; font-weight:700; color:#ccaaff; }
  .pt-vals { flex:1; font-size:13px; color:#8888cc; }
  .pt-vals span { margin-right:14px; }
  .pt-section { margin:14px 0; padding:10px; background:rgba(40,20,80,0.25); border-radius:8px; }
  .pt-section h3 { color:#ff6b35; font-size:14px; margin-bottom:6px; }
  .pt-section p { color:#8888cc; font-size:13px; line-height:1.5; }
  .btn-close-pt { display:block; margin:18px auto 0; padding:10px 30px; font-size:14px; background:linear-gradient(180deg,#ff6b35,#cc4400); color:#fff; border:1px solid #ff8855; }

  .bonus-panel{background:rgba(5,2,15,0.97)}
  .bonus-title { font-size:50px; font-weight:900; margin-bottom:10px; background:linear-gradient(90deg,#00ffcc,#00aaff,#aa44ff,#ff44aa,#00ffcc); background-size:300% 100%; -webkit-background-clip:text; -webkit-text-fill-color:transparent; animation:rainbow 2s linear infinite; }
  @keyframes rainbow{0%{background-position:0% 50%}100%{background-position:300% 50%}}
  .bonus-sub{font-size:17px;color:#8888cc;margin-bottom:22px}
  .bonus-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
  .bonus-cell { width:153px; height:153px; background:linear-gradient(135deg,#1a0a3a,#2a1a5a); border:3px solid #4a2a8a; border-radius:16px; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all 0.2s; position:relative; overflow:hidden; }
  .bonus-cell:hover:not(.open){border-color:#8a5aff;box-shadow:0 0 28px rgba(138,90,255,0.4);transform:translateY(-2px)}
  .bonus-cell.open{cursor:default}
  .bonus-cell.open.prize{border-color:#ffd700;background:linear-gradient(135deg,#2a1a0a,#3a2a1a)}
  .bonus-cell.open.skull{border-color:#ff4444;background:linear-gradient(135deg,#3a0a0a,#2a0000)}
  .qmark { font-size:55px; font-weight:900; color:#6a4aaa; text-shadow:0 0 22px rgba(106,74,170,0.5); animation:bob 2s ease-in-out infinite; }
  .tile-back-img { width:100%; height:100%; object-fit:cover; border-radius:13px; position:absolute; top:0; left:0; }
  .bonus-cell.open .tile-back-img { display:none; }
  @keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
  .reveal-content{display:none;align-items:center;justify-content:center;position:absolute;top:0;left:0;right:0;bottom:0}
  .bonus-cell.open .qmark{display:none} .bonus-cell.open .reveal-content{display:flex}
  .reveal-content canvas{position:absolute;top:0;left:0;width:100%;height:100%}
  .reveal-content img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:contain}
  .reveal-content .reveal-amount{position:absolute;bottom:6px;left:0;right:0;z-index:2;text-shadow:0 0 8px rgba(0,0,0,0.9),0 0 16px rgba(0,0,0,0.7);font-size:18px;text-align:center}
  .reveal-amount{font-size:20px;font-weight:700;color:#ffd700}
  .bonus-total{margin-top:20px;font-size:26px;font-weight:700;color:#ffd700}
  .bonus-strikes{font-size:16px;color:#aa88dd;margin-top:8px}
  .btn-collect { display:none; margin-top:18px; padding:16px 50px; font-size:21px; background:linear-gradient(180deg,#ff6b35,#cc4400); color:#fff; border:2px solid #ff8855; box-shadow:0 0 25px rgba(255,107,53,0.4); }

  .splash-panel{background:rgba(5,2,15,0.92)}
  .splash-label { font-size:60px; font-weight:900; background:linear-gradient(90deg,#ffd700,#ff6b35,#ffd700); background-size:200% 100%; -webkit-background-clip:text; -webkit-text-fill-color:transparent; animation:shimmer 1s ease-in-out infinite; }
  .splash-amt { font-size:48px; font-weight:700; color:#ffd700; margin-top:8px; text-shadow:0 0 30px rgba(255,215,0,0.5); }
  #confetti { position:absolute; top:0; left:0; width:100%; height:100%; pointer-events:none; z-index:40; }

  /* ===== ADMIN PANEL ===== */
  .admin-overlay {
    display:none; position:absolute; top:0; left:0; right:0; bottom:0;
    background:rgba(2,2,12,0.98); z-index:50; overflow-y:auto; padding:20px;
  }
  .admin-overlay.show { display:block; }

  .admin-inner { max-width:900px; margin:0 auto; }
  .admin-inner h2 { color:#ff6b35; text-align:center; font-size:22px; margin-bottom:4px; }
  .admin-inner .admin-sub { color:#666; text-align:center; font-size:11px; margin-bottom:16px; }

  .admin-tabs { display:flex; gap:4px; margin-bottom:14px; flex-wrap:wrap; justify-content:center; }
  .admin-tab {
    padding:7px 16px; font-size:12px; font-weight:700; cursor:pointer;
    background:rgba(40,20,80,0.4); color:#8877bb; border:1px solid #3a2a5a; border-radius:6px;
    transition:all 0.15s;
  }
  .admin-tab:hover { background:rgba(60,30,100,0.5); color:#aa99dd; }
  .admin-tab.active { background:rgba(100,40,180,0.4); color:#ffd700; border-color:#ffd700; }

  .admin-section { display:none; }
  .admin-section.active { display:block; }

  .admin-section h3 { color:#ccaaff; font-size:15px; margin:12px 0 8px; border-bottom:1px solid rgba(100,60,180,0.2); padding-bottom:4px; }

  .adm-table { width:100%; border-collapse:collapse; font-size:12px; table-layout:auto; }
  .adm-table th { text-align:left; color:#8877bb; padding:6px 6px; font-size:10px; text-transform:uppercase; letter-spacing:1px; border-bottom:1px solid rgba(100,60,180,0.3); white-space:nowrap; }
  .adm-table td { padding:4px 4px; border-bottom:1px solid rgba(100,60,180,0.1); vertical-align:middle; white-space:nowrap; }
  .adm-table canvas { width:36px; height:36px; vertical-align:middle; }

  .adm-input {
    background:rgba(0,0,0,0.4); border:1px solid #3a2a5a; color:#ddd; padding:4px 8px;
    border-radius:4px; font-size:12px; font-family:inherit; width:100%;
    overflow:visible;
  }
  .adm-input:focus { border-color:#8a5aff; outline:none; }
  .adm-input-sm { width:70px; }
  .adm-input-xs { width:58px; }
  .adm-check { width:16px; height:16px; accent-color:#aa44ff; cursor:pointer; }

  .adm-btn {
    padding:5px 12px; font-size:11px; font-weight:700; cursor:pointer;
    border-radius:5px; border:1px solid; transition:all 0.12s;
    text-transform:uppercase; letter-spacing:0.5px;
  }
  .adm-btn:hover { filter:brightness(1.2); }
  .adm-btn-primary { background:#ff6b35; color:#fff; border-color:#ff8855; }
  .adm-btn-danger { background:#aa2222; color:#fff; border-color:#cc4444; }
  .adm-btn-secondary { background:rgba(60,30,100,0.5); color:#aa88dd; border-color:#5a4a7a; }
  .adm-btn-success { background:#228822; color:#fff; border-color:#44aa44; }

  .adm-row { display:flex; gap:10px; align-items:center; margin:6px 0; flex-wrap:wrap; }
  .adm-row label { color:#9988bb; font-size:12px; min-width:120px; }
  .adm-row .adm-input { flex:1; max-width:250px; }

  .adm-actions { display:flex; gap:10px; justify-content:center; margin:20px 0 10px; flex-wrap:wrap; }

  .adm-weight-bar { display:flex; height:18px; border-radius:4px; overflow:hidden; margin:4px 0; }
  .adm-weight-seg { height:100%; display:flex; align-items:center; justify-content:center; font-size:9px; color:rgba(255,255,255,0.7); font-weight:700; overflow:hidden; white-space:nowrap; }

  .adm-file-input { display:none; }
  .adm-upload-btn { display:inline-block; padding:5px 12px; font-size:11px; cursor:pointer; background:rgba(60,30,100,0.5); color:#aa88dd; border:1px solid #5a4a7a; border-radius:5px; }
  .adm-upload-btn:hover { filter:brightness(1.2); }

  .adm-symbol-preview { width:64px; height:64px; border:1px solid #3a2a5a; border-radius:6px; background:rgba(0,0,0,0.3); display:inline-block; vertical-align:middle; }

  /* PIN modal */
  .pin-modal {
    display:none; position:absolute; top:0; left:0; right:0; bottom:0;
    background:rgba(2,2,12,0.95); z-index:55;
    flex-direction:column; align-items:center; justify-content:center;
  }
  .pin-modal.show { display:flex; }
  .pin-modal h3 { color:#ff6b35; font-size:20px; margin-bottom:14px; }
  .pin-modal input {
    width:180px; height:50px; text-align:center; font-size:28px; letter-spacing:12px;
    background:rgba(0,0,0,0.5); border:2px solid #5a4a7a; color:#ffd700; border-radius:8px;
    font-family:inherit;
  }
  .pin-modal input:focus { border-color:#ff6b35; outline:none; }
  .pin-modal .pin-error { color:#ff4444; font-size:12px; margin-top:8px; height:16px; }
  .pin-modal .pin-btns { margin-top:14px; display:flex; gap:10px; }

  .adm-mult-tag {
    display:inline-flex; align-items:center; gap:4px; padding:3px 8px;
    background:rgba(60,30,100,0.4); border:1px solid #5a4a7a; border-radius:4px;
    font-size:12px; color:#ccaaff; margin:2px;
  }
  .adm-mult-tag button {
    background:none; border:none; color:#ff6666; cursor:pointer; font-size:14px; font-weight:700;
    padding:0 2px;
  }

  /* ===== CROP MODAL ===== */
  .crop-modal {
    display:none; position:absolute; top:0; left:0; right:0; bottom:0;
    background:rgba(2,2,12,0.97); z-index:60;
    flex-direction:column; align-items:center; justify-content:center; gap:12px;
  }
  .crop-modal.show { display:flex; }
  .crop-modal h3 { color:#ff6b35; font-size:18px; }
  .crop-modal .crop-hint { color:#8888aa; font-size:12px; }
  .crop-area {
    position:relative; border:2px solid #3a2a5a; border-radius:8px; overflow:hidden;
    background:#111; cursor:crosshair;
  }
  .crop-area canvas { display:block; }
  .crop-preview-row { display:flex; align-items:center; gap:16px; }
  .crop-preview-label { color:#9988bb; font-size:12px; }
  .crop-preview-box {
    width:96px; height:96px; border:2px solid #5a4a7a; border-radius:8px;
    background:rgba(0,0,0,0.4); overflow:hidden;
  }
  .crop-preview-box canvas { width:100%; height:100%; }
  .crop-btns { display:flex; gap:10px; }

  /* ===== ANALYTICS ===== */
  .analytics-card {
    background:rgba(20,20,40,0.8); border:1px solid rgba(0,255,136,0.2);
    border-radius:10px; padding:10px 16px; text-align:center; min-width:140px; flex:1;
  }
  .analytics-card .an-label { font-size:10px; color:#6a7a9a; text-transform:uppercase; letter-spacing:1px; }
  .analytics-card .an-value { font-size:22px; font-weight:900; color:#fff; margin-top:2px; }
  .analytics-card .an-value.positive { color:#44dd88; }
  .analytics-card .an-value.negative { color:#ff4444; }

  /* ===== DEAL OR NO DEAL ===== */
  .dond-case {
    width:120px; height:120px; border-radius:10px; cursor:pointer;
    border:2px solid #8866aa; background:linear-gradient(135deg,#2a1a4a,#1a0a3a);
    display:flex; align-items:center; justify-content:center;
    position:relative; transition:all 0.15s; overflow:hidden;
  }
  .dond-case:hover:not(.opened):not(.picked){ border-color:#cc88ff; transform:translateY(-2px); }
  .dond-case.picked { border-color:var(--neon); box-shadow:0 0 16px rgba(0,255,136,0.4); }
  .dond-case.opened { opacity:0.3; cursor:default; border-color:#444; }
  .dond-case .case-num { font-size:44px; font-weight:900; color:#111; text-shadow:0 1px 2px rgba(255,255,255,0.3); z-index:1; margin-top:10px; }
  .dond-case .case-img { position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; border-radius:8px; }
  .dond-case .case-val { display:none; font-size:14px; font-weight:700; color:#ff4444; z-index:1; }
  .dond-case.opened .case-num { display:none; }
  .dond-case.opened .case-val { display:block; }
  .dond-case.opened .case-img { opacity:0.2; }
  .dond-board-val {
    padding:8px 16px; border-radius:8px; font-size:22px; font-weight:900;
    text-align:center; min-width:130px; transition:all 0.2s;
  }
  .dond-board-val.low { background:rgba(68,136,255,0.25); color:#88bbff; border:1px solid rgba(68,136,255,0.3); }
  .dond-board-val.high { background:rgba(255,215,0,0.2); color:#ffd700; border:1px solid rgba(255,215,0,0.3); }
  .dond-board-val.gone { opacity:0.2; text-decoration:line-through; }