:root {
    --space-dark: #0a0e27;
    --neon-purple: #7c3aed;
    --neon-blue: #00f5ff;
  }
  * { margin: 0; padding: 0; box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
  body {
    background: var(--space-dark);
    min-height: 100vh;
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
    color: #fff;
    overflow-x: hidden;
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }
  .stars { position: fixed; inset: 0; pointer-events: none; z-index: 0; }
  .star { position: absolute; border-radius: 50%; background: #fff; animation: twinkle var(--d,3s) ease-in-out infinite alternate; }
  @keyframes twinkle { from{opacity:.2;transform:scale(.8)} to{opacity:1;transform:scale(1.2)} }
  .nebula { position: fixed; border-radius: 50%; filter: blur(60px); opacity: .14; pointer-events: none; }
  .nb1 { width:280px;height:280px;background:var(--neon-purple);top:-60px;left:-60px; }
  .nb2 { width:220px;height:220px;background:#b45309;bottom:80px;right:-40px; }

  .app { position: relative; z-index: 1; max-width: 420px; margin: 0 auto; padding: 0 0 calc(90px + env(safe-area-inset-bottom, 0px)); }

  .top-bar {
    display: flex; align-items: center; gap: 12px;
    padding: 18px 20px 12px;
    background: linear-gradient(180deg,rgba(10,14,39,1) 0%,transparent 100%);
    position: sticky; top: 0; z-index: 10;
  }
  .back-btn { width:38px;height:38px;background:rgba(255,255,255,.08);border-radius:50%;border:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;font-size:1.15rem;cursor:pointer;text-decoration:none;color:#fff;flex-shrink:0;box-shadow:0 4px 0 rgba(0,0,0,.15),inset 0 1px 0 rgba(255,255,255,.1); }
  .top-title { font-size:1.05rem;font-weight:800;flex:1; }
  .points-chip {
    background: linear-gradient(135deg,#b45309,#f59e0b);
    border-radius:999px;padding:7px 14px;
    display:flex;align-items:center;gap:7px;
    font-weight:800;font-size:.8rem;
    box-shadow:0 0 16px rgba(245,158,11,.4), 0 4px 0 #78350f;
    cursor:pointer;text-decoration:none;color:#fff;
  }
  .pts-orb { width:17px;height:17px;background:radial-gradient(circle at 35% 35%,#fde68a,#d97706);border-radius:50%;box-shadow:0 0 6px #f59e0b; }

  .sec-title { padding:18px 20px 10px;font-size:.75rem;color:#94a3b8;font-weight:800;letter-spacing:.12em;text-transform:uppercase; }

  .not-enough {
    margin:0 20px 14px;
    background:rgba(239,68,68,.12);border:1px solid rgba(239,68,68,.35);
    border-radius:16px;padding:11px 14px;
    font-size:.78rem;color:#f87171;font-weight:700;text-align:center;
    display:none;
    backdrop-filter: blur(8px);
  }
  .not-enough.show { display:block; }

  .dr-wrap { padding:0 20px; }
  .dr-meta { display:flex;justify-content:space-between;align-items:center;margin-bottom:12px; }
  .dr-streak { font-size:.82rem; }
  .dr-streak strong { color:#fbbf24; }
  .dr-next { font-size:.72rem;color:#94a3b8; }
  .dr-countdown { color:var(--neon-blue);font-weight:700; }

  .dr-scroll { display:flex;gap:10px;overflow-x:auto;padding-bottom:8px;scrollbar-width:none; }
  .dr-scroll::-webkit-scrollbar { display:none; }
  .dr-item { display:flex;flex-direction:column;align-items:center;gap:4px;min-width:62px; }

  .dr-chest {
    width:54px;height:54px;border-radius:16px;
    display:flex;flex-direction:column;align-items:center;justify-content:center;
    position:relative;font-size:1.45rem;
    background: rgba(255,255,255,.08);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 2px solid rgba(255,255,255,.22);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 6px 16px rgba(0,0,0,.2);
    transition:transform .2s;
    gap:2px;
  }
  .dr-chest.active {
    border-color:rgba(245,158,11,.65);
    background:rgba(245,158,11,.14);
    box-shadow:0 0 20px rgba(245,158,11,.4), inset 0 1px 0 rgba(255,255,255,.2);
    animation:chestPulse 1.2s ease-in-out infinite alternate;
  }
  @keyframes chestPulse{from{box-shadow:0 0 12px rgba(245,158,11,.35)}to{box-shadow:0 0 28px rgba(245,158,11,.65)}}
  .dr-chest.claimed { border-color:rgba(34,197,94,.45);background:rgba(34,197,94,.1);opacity:.75; }
  .dr-chest.locked { opacity:.38;filter:grayscale(1); }
  .dr-chest.legendary {
    border-color:rgba(168,85,247,.55);
    background:rgba(124,58,237,.12);
    box-shadow:0 0 18px rgba(124,58,237,.35), inset 0 1px 0 rgba(255,255,255,.15);
  }

  .dr-pts-tag { font-size:.5rem;font-weight:800;color:#fbbf24;line-height:1; }
  .dr-lock { position:absolute;top:2px;right:2px;font-size:.55rem;opacity:.6; }

  .dr-dot { width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center;font-size:.5rem; }
  .dr-dot.done { background:#22c55e; }
  .dr-dot.cur { background:#f59e0b;animation:dotPulse .8s ease-in-out infinite alternate; }
  @keyframes dotPulse{from{transform:scale(.8)}to{transform:scale(1.2)}}

  .dr-day-label { font-size:.58rem;color:#94a3b8;font-weight:600; }
  .dr-claim-btn {
    background:linear-gradient(135deg,#b45309,#f59e0b);
    border:none;border-radius:10px;padding:5px 8px;
    color:#fff;font-size:.58rem;font-weight:800;cursor:pointer;
    text-align:center;line-height:1.3;
    box-shadow:0 0 12px rgba(245,158,11,.45);
    transition:transform .15s;
  }
  .dr-claim-btn:active { transform:scale(.93); }
  .dr-claimed-lbl { font-size:.52rem;color:#22c55e;font-weight:700; }

  .cta-row { display:flex;gap:10px;padding:0 20px;margin-bottom:6px; }
  .ad-btn {
    flex:1;padding:14px;border:none;border-radius:18px;
    background:linear-gradient(135deg,#1d4ed8,var(--neon-purple));
    color:#fff;font-size:.8rem;font-weight:800;cursor:pointer;
    display:flex;align-items:center;justify-content:center;gap:8px;
    box-shadow:0 6px 0 rgba(49,46,129,.5), 0 10px 24px rgba(124,58,237,.35);
    transition:transform .15s;
    border:2px solid rgba(255,255,255,.12);
  }
  .ad-btn:active { transform:scale(.97) translateY(2px); }
  .special-btn {
    flex:1;padding:14px;border:none;border-radius:18px;
    background:linear-gradient(135deg,#065f46,#059669);
    color:#fff;font-size:.8rem;font-weight:800;cursor:pointer;
    display:flex;align-items:center;justify-content:center;gap:8px;
    box-shadow:0 6px 0 rgba(6,78,59,.6), 0 8px 20px rgba(5,150,105,.3);
    border:2px solid rgba(255,255,255,.1);
    transition:transform .15s;
  }
  .special-btn:active { transform:scale(.97) translateY(2px); }

  .free-bar {
    margin:10px 20px 0;
    background:rgba(255,255,255,.06);
    backdrop-filter: blur(10px);
    border:1px solid rgba(255,255,255,.12);
    border-radius:14px;padding:11px 14px;
    display:flex;align-items:center;justify-content:space-between;
    font-size:.72rem;color:#94a3b8;
  }
  .free-time { color:var(--neon-blue);font-weight:700; }

  .iap-grid { display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:0 20px; }
  .iap-card {
    background: rgba(255,255,255,.07);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 2px solid rgba(255,255,255,.2);
    border-radius:22px;padding:17px 12px 15px;
    display:flex;flex-direction:column;align-items:center;gap:6px;
    cursor:pointer;position:relative;overflow:hidden;
    transition:transform .15s, box-shadow .15s;
    text-align:center;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 8px 0 rgba(0,0,0,.18), 0 12px 28px rgba(0,0,0,.25);
  }
  .iap-card:active { transform:scale(.97) translateY(3px); box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 4px 0 rgba(0,0,0,.2); }
  .iap-card.popular {
    border-color:rgba(99,102,241,.55);
    background:rgba(99,102,241,.12);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.22), 0 0 24px rgba(99,102,241,.3), 0 8px 0 rgba(49,46,129,.4);
  }
  .iap-card.gold {
    border-color:rgba(245,158,11,.5);
    background:rgba(245,158,11,.1);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 0 22px rgba(245,158,11,.25), 0 8px 0 rgba(120,53,15,.45);
  }
  .iap-badge {
    position:absolute;top:0;left:0;right:0;
    background:linear-gradient(90deg,#6366f1,#8b5cf6);
    padding:4px 6px;font-size:.55rem;font-weight:800;
    letter-spacing:.5px;text-align:center;
  }
  .iap-card.gold .iap-badge { background:linear-gradient(90deg,#b45309,#f59e0b); }
  .iap-icon { font-size:2.1rem;margin-top:14px; filter: drop-shadow(0 4px 8px rgba(0,0,0,.3)); }
  .iap-pts { font-size:1rem;font-weight:900;color:#fbbf24; }
  .iap-pts-lbl { font-size:.58rem;color:#cbd5e1;font-weight:700;letter-spacing:.5px; }
  .iap-price-btn {
    background:rgba(255,255,255,.12);
    backdrop-filter: blur(6px);
    border:1px solid rgba(255,255,255,.25);
    border-radius:20px;padding:7px 14px;
    color:#fff;font-size:.78rem;font-weight:800;cursor:pointer;
    transition:background .2s;margin-top:4px;
  }
  .iap-price-btn:hover { background:rgba(255,255,255,.2); }
  .iap-desc { font-size:.6rem;color:#94a3b8; }

  .toast {
    position:fixed;bottom:100px;left:50%;transform:translateX(-50%);
    background:linear-gradient(135deg,#059669,#10b981);
    border-radius:20px;padding:12px 22px;
    font-size:.88rem;font-weight:700;
    box-shadow:0 6px 24px rgba(5,150,105,.5);
    opacity:0;pointer-events:none;
    transition:opacity .3s,transform .3s;
    z-index:200;white-space:nowrap;
  }
  .toast.show { opacity:1;transform:translateX(-50%) translateY(-10px); }

  .ad-overlay {
    position:fixed;inset:0;background:rgba(10,14,39,.97);
    z-index:300;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;
    opacity:0;pointer-events:none;transition:opacity .3s;
  }
  .ad-overlay.show { opacity:1;pointer-events:all; }
  .ad-screen { width:280px;height:180px;background:linear-gradient(135deg,#1e3a8a,#4338ca);border-radius:20px;display:flex;align-items:center;justify-content:center;font-size:3rem;box-shadow:0 0 30px rgba(99,102,241,.4);border:2px solid rgba(0,245,255,.2); }
  .ad-timer { font-size:1.3rem;font-weight:900;color:#fbbf24; }
  .ad-label { font-size:.82rem;color:#94a3b8; }
  .ad-skip { background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:12px;padding:10px 20px;color:#fff;font-size:.82rem;font-weight:700;cursor:pointer;display:none; }
  .ad-skip.show { display:block; }

  nav {
    position:fixed;bottom:0;left:50%;transform:translateX(-50%);
    width:100%;max-width:430px;
    background:rgba(7,11,21,.97);
    backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);
    border-top:1px solid rgba(255,255,255,.06);
    display:flex;align-items:flex-end;justify-content:space-around;
    padding:10px 4px 24px;
    z-index:200;
  }
  .nav-btn{display:flex;flex-direction:column;align-items:center;gap:3px;background:none;border:none;color:#6B7280;font-family:inherit;font-size:10px;font-weight:500;cursor:pointer;padding:0 6px;min-width:52px;transition:color .15s;text-decoration:none;}
  .nav-btn .nav-ico{width:22px;height:22px;display:block;margin-bottom:1px;}
  .nav-btn .nav-ico img{width:100%;height:100%;object-fit:contain;display:block;opacity:.45;transition:opacity .15s;}
  .nav-btn.active{color:#8B5CF6;}
  .nav-btn.active .nav-ico img{opacity:1;filter:brightness(0) saturate(100%) invert(49%) sepia(97%) saturate(1283%) hue-rotate(235deg) brightness(101%) contrast(94%);}
  .nav-center{display:flex;flex-direction:column;align-items:center;gap:4px;margin-top:-26px;cursor:pointer;}
  .nav-disc{width:58px;height:58px;border-radius:50%;background:linear-gradient(135deg,#6d28d9 0%,#8b5cf6 60%,#a78bfa 100%);box-shadow:0 4px 28px rgba(109,40,217,.7),0 0 0 3px #070B15;display:flex;align-items:center;justify-content:center;font-size:27px;}
  .nav-center-lbl{font-size:10px;font-weight:700;color:#6B7280;}
  .nav-item{display:none;}
  .nav-orb {
    display:none;
    animation:orbPulse 2s ease-in-out infinite alternate;
  }
  @keyframes orbPulse{from{box-shadow:0 0 14px rgba(124,58,237,.45)}to{box-shadow:0 0 30px rgba(0,245,255,.25)}}