:root{
  --bg:#0f172a; --card:#1e293b; --accent:#06b6d4; --accent2:#6c5ce7;
  --text:#e2e8f0; --muted:#94a3b8; --border:#334155; --ok:#10b981; --warn:#f59e0b;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,'Segoe UI',Roboto,'Noto Nastaliq Urdu','Jameel Noori Nastaleeq',Arial,sans-serif;overflow-y:auto;-ms-overflow-style:none;scrollbar-width:none}
.app-header{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:14px 18px;background:rgba(15,23,42,.9);backdrop-filter:blur(8px);border-bottom:1px solid var(--border)}
.logo{font-weight:700;font-size:18px;letter-spacing:.01em}
.icon-btn{background:var(--card);border:1px solid var(--border);color:var(--text);width:44px;height:44px;border-radius:12px;font-size:18px;cursor:pointer}
.container{padding:18px;max-width:1100px;margin:0 auto}
h2{font-size:18px;color:var(--muted);margin:0 0 10px}
.cards-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media(min-width:760px){.cards-grid{grid-template-columns:repeat(5,1fr)}}
.card{background:linear-gradient(180deg,#1e293b,#0f172a);border:1px solid var(--border);border-radius:18px;padding:18px 14px;text-align:center;cursor:pointer;transition:.15s transform,.15s border-color;user-select:none;-webkit-tap-highlight-color:transparent}
.card:hover{border-color:#475569}
.card:active{transform:translateY(2px)}
.card .icon{font-size:28px;margin-bottom:8px}
.card .label{font-size:14px;color:var(--text);line-height:1.3}
.cat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:8px}
@media(min-width:760px){.cat-grid{grid-template-columns:repeat(3,1fr)}}
.cat{background:#111b2b;border:1px solid var(--border);border-radius:16px;padding:16px;cursor:pointer;display:flex;align-items:center;gap:12px;transition:.15s border-color}
.cat:hover{border-color:#475569}
.cat .cat-icon{width:48px;height:48px;display:grid;place-items:center;background:#1e293b;border-radius:14px;font-size:22px}
.cat .cat-title{font-weight:600;font-size:15px;color:var(--text)}
.screen{display:none}
.screen.active{display:block}
.overlay{position:fixed;inset:0;background:#0008;z-index:100;display:grid;place-items:center;padding:18px}
.overlay-content{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:18px;width:100%;max-width:480px;max-height:90vh;overflow:auto}
.overlay h3{margin:0 0 10px}
.overlay button{background:#334155;color:#fff;border:none;padding:10px 14px;border-radius:10px;margin:6px 6px 0 0;font-size:14px;cursor:pointer}
.overlay .close{background:#ef4444;margin-top:14px}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:#0f172a;border:1px solid var(--border);color:#fff;padding:10px 14px;border-radius:999px;font-size:14px;z-index:200;opacity:.95}
.hidden{display:none!important}