/* CMM30 - all classes prefixed with cmm- so existing site CSS se clash na ho */
:root{
  --cmm-bg:#06120f; --cmm-card:#0c1f1a; --cmm-line:#18372f;
  --cmm-teal:#14b8a6; --cmm-emerald:#059669; --cmm-gold:#fbbf24; --cmm-rose:#fb7185;
  --cmm-text:#e8fff8; --cmm-muted:#8fb9ad;
}
.cmm-body{margin:0;background:radial-gradient(1200px 600px at 50% -10%,#0d3b32 0%,var(--cmm-bg) 60%);color:var(--cmm-text);
  font-family:'Outfit',system-ui,sans-serif;min-height:100vh;-webkit-font-smoothing:antialiased}
.cmm-body *{box-sizing:border-box}

/* ---------- hero ---------- */
.cmm-hero{text-align:center;padding:38px 16px 54px;background:linear-gradient(135deg,#064e3b 0%,#0f766e 55%,#115e59 100%);
  border-radius:0 0 42px 42px;position:relative;overflow:hidden;box-shadow:0 20px 50px rgba(0,0,0,.45)}
.cmm-hero::before,.cmm-hero::after{content:"";position:absolute;border-radius:50%;background:rgba(251,191,36,.12)}
.cmm-hero::before{width:220px;height:220px;left:-70px;top:-90px}
.cmm-hero::after{width:260px;height:260px;right:-90px;bottom:-140px}
.cmm-hero h1{margin:14px 0 6px;font-size:clamp(34px,7vw,64px);font-weight:800;letter-spacing:1px;
  text-shadow:0 6px 24px rgba(0,0,0,.4);position:relative;z-index:1}
.cmm-date{margin:0;font-family:'JetBrains Mono',monospace;font-weight:800;font-size:20px;color:var(--cmm-gold);position:relative;z-index:1}
.cmm-sub{margin:8px 0 0;color:#c8f5e9;font-size:15px;position:relative;z-index:1}
.cmm-pill{display:inline-flex;align-items:center;gap:8px;padding:8px 20px;border-radius:999px;font-weight:700;font-size:15px;
  color:#3b2a00;background:linear-gradient(90deg,#fbbf24,#f59e0b);position:relative;z-index:1}
.cmm-dot{width:10px;height:10px;border-radius:50%;background:#dc2626;animation:cmmPulse 1.2s infinite}
@keyframes cmmPulse{0%{box-shadow:0 0 0 0 rgba(220,38,38,.7)}100%{box-shadow:0 0 0 10px rgba(220,38,38,0)}}

/* ---------- layout ---------- */
.cmm-wrap{max-width:980px;margin:-26px auto 40px;padding:0 14px;position:relative;z-index:2}
.cmm-card{background:#e7fff3;border:1px solid #b7efd4;border-radius:16px;overflow:hidden;box-shadow:0 8px 18px rgba(0,0,0,.18)}
.cmm-scroll{overflow-x:auto}
.cmm-center{text-align:center;margin-top:22px}
.cmm-foot{text-align:center;color:#d7fff2;font-size:13px;margin:12px 8px}
.cmm-card .cmm-foot{color:#145246}
.cmm-empty{text-align:center;padding:30px;color:#145246}

/* ---------- buttons ---------- */
.cmm-btn{display:inline-block;border:0;cursor:pointer;text-decoration:none;font:700 16px 'Outfit',sans-serif;color:#3b2a00;
  padding:13px 28px;border-radius:999px;background:linear-gradient(90deg,#fbbf24,#f59e0b);box-shadow:0 8px 22px rgba(245,158,11,.35);transition:transform .15s}
.cmm-btn:hover{transform:translateY(-2px)}
.cmm-btn-sm{padding:10px 22px;font-size:15px;margin-top:16px;position:relative;z-index:1}
.cmm-btn-ghost{background:#134e4a;color:#d1fae5;box-shadow:none}

/* ---------- live table: light rows, purple panna, red jodi ---------- */
.cmm-table{width:100%;border-collapse:collapse;min-width:0;background:#d9ffe9}
.cmm-table th{padding:14px 8px;font-size:13px;letter-spacing:.4px;text-transform:uppercase;
  color:#0c2e28;background-color:#b7f6d6;text-align:center;border:1px solid #7ed9b4;font-weight:800}
.cmm-table td{padding:12px 8px;text-align:center;border:1px solid #b7efd0;font-size:16px;
  color:#10211c;font-weight:800;background-color:#e7fff4}
.cmm-table tbody tr:nth-child(even) td{background-color:#c8f8de}
.cmm-table td.cmm-time{color:#10211c;font-weight:800;font-size:16px}
.cmm-table td.cmm-panna,.cmm-table td.cmm-close{font-family:'JetBrains Mono',ui-monospace,monospace;
  font-weight:800;font-size:20px;color:#7b1fa2;letter-spacing:1px}
.cmm-table td.cmm-jodi{font-family:'JetBrains Mono',ui-monospace,monospace;font-weight:900;font-size:26px;color:#c0392b;letter-spacing:1px}
.cmm-table td.is-pending{color:#5f6f6a}
.is-running td{box-shadow:inset 4px 0 0 #d97706}

/* ---------- panel chart ---------- */
.cmm-filter{display:flex;flex-wrap:wrap;gap:14px;align-items:flex-end;background:var(--cmm-card);border:1px solid var(--cmm-line);
  border-radius:20px;padding:18px;margin-bottom:20px}
.cmm-filter label{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:700;color:#99f6e4}
.cmm-filter input{background:#06120f;color:var(--cmm-text);border:1px solid var(--cmm-line);border-radius:12px;padding:10px 12px;font:inherit}
.cmm-filter .cmm-btn-sm{margin-top:0}
.cmm-daycard{background:var(--cmm-card);border:1px solid var(--cmm-line);border-radius:22px;margin-bottom:18px;overflow:hidden}
.cmm-daycard h2{margin:0;padding:14px 20px;font-size:20px;background:linear-gradient(90deg,#0f766e,#064e3b);display:flex;justify-content:space-between;align-items:baseline}
.cmm-daycard h2 small{font-size:13px;color:#b6f3e2;font-weight:500}
.cmm-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:10px;padding:14px}
.cmm-tile{background:#e7fff4;border:1px solid #9fe6c6;border-radius:14px;padding:10px 6px;text-align:center;display:flex;flex-direction:column;gap:2px}
.t-time{font-size:11px;color:#145246;font-weight:800}
.t-panna{font-family:'JetBrains Mono',ui-monospace,monospace;font-weight:800;font-size:15px;color:#6d28d9;letter-spacing:1px}
.t-sep{color:#145246;letter-spacing:0}
.t-close{color:#6d28d9}
.t-digit{font-family:'JetBrains Mono',ui-monospace,monospace;font-weight:900;font-size:24px;color:#d01212;line-height:1.1}
.cmm-tile.is-empty .t-panna,.cmm-tile.is-empty .t-digit,.cmm-tile.is-empty .t-close{color:#5f6f6a}

@media (max-width:520px){
  .cmm-tiles{grid-template-columns:repeat(3,1fr);gap:8px;padding:10px}
  .t-time{font-size:10px}
  .cmm-table{min-width:0}
  .cmm-table th{font-size:10px;padding:8px 2px;letter-spacing:0}
  .cmm-table td{font-size:12px;padding:8px 2px}
  .cmm-table td.cmm-time{font-size:11px}
  .cmm-table td.cmm-panna,.cmm-table td.cmm-close{font-size:15px}
  .cmm-table td.cmm-jodi{font-size:18px}
}