html,body,#root{margin:0;min-height:100%}:root{--green: #5f8f6f;--mint: #ecf7ef;--beige: #f7f1e3;--gold: #c9a44c;--ink: #193026;--card: #ffffff}*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ink);background:radial-gradient(circle at 20% 0%,#eef7f1 0,transparent 40%),radial-gradient(circle at 80% 20%,#f8f2e7 0,transparent 45%),#fff}body.dark{--ink: #e8f3ec;--card: #112019;background:#0b1410}.app-shell{max-width:1200px;margin:0 auto;padding:24px}.hero{text-align:center;padding:24px;border-radius:20px;background:linear-gradient(135deg,#f9fcfa,#f6f2e8);border:1px solid #e4ece6;margin-bottom:20px}body.dark .hero{background:linear-gradient(135deg,#16261e,#2a241a);border-color:#294337}.badge{display:inline-block;background:var(--mint);color:var(--green);padding:6px 12px;border-radius:999px;border:1px solid #cde6d4;font-weight:600}.controls{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:12px}.controls select,.controls button,.manual-grid input,.search{border-radius:10px;border:1px solid #cfe2d6;padding:8px 10px;background:#fff}body.dark .controls select,body.dark .controls button,body.dark .manual-grid input,body.dark .search{background:#172820;color:#e5f2e9;border-color:#355544}.grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}.card{background:var(--card);border:1px solid #e7ece8;border-radius:16px;padding:16px;box-shadow:0 6px 18px #0000000a}body.dark .card{border-color:#2f4a3c}.card h2{margin-top:0;color:#2a4c3a;border-left:3px solid var(--gold);padding-left:10px}body.dark .card h2{color:#bddcc9}.times-grid{display:grid;gap:8px;grid-template-columns:1fr 1fr}.times-grid div{background:#f7fbf8;border:1px solid #dceae1;border-radius:12px;padding:10px;display:flex;justify-content:space-between}body.dark .times-grid div{background:#172820;border-color:#2f4a3c}.compass{width:170px;height:170px;border-radius:50%;margin:10px auto;border:2px solid #d8e8de;background:conic-gradient(from 0deg,#f6fbf7,#fff7e9,#f6fbf7);position:relative}.needle{width:4px;height:70px;background:linear-gradient(to bottom,var(--gold),#846523);position:absolute;left:50%;top:50%;transform-origin:center bottom;border-radius:8px;transition:transform .35s ease}.center-dot{width:12px;height:12px;background:var(--green);border-radius:50%;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}.manual-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.tracker-row{display:flex;gap:10px;flex-wrap:wrap}.prayer-dot{width:44px;height:44px;border-radius:50%;border:1px solid #bdd7c6;background:#f3fbf5;color:#2e5a43;font-weight:700;cursor:pointer}.prayer-dot.done{background:var(--green);color:#fff;border-color:var(--green)}.list-item{border:1px solid #e8efe9;border-radius:12px;padding:10px;margin-top:10px;background:#fcfefc}body.dark .list-item{background:#172820;border-color:#2f4a3c}.zikr-grid{display:grid;gap:8px}.zikr-grid button{padding:10px;border-radius:10px;border:1px solid #cfe2d6;background:#f7fbf8;cursor:pointer}body.dark .zikr-grid button{background:#172820;color:#e5f2e9;border-color:#355544}.bars{height:120px;display:grid;grid-template-columns:repeat(30,1fr);gap:3px;align-items:end;margin-top:10px}.bar-wrap{background:#edf5ef;border-radius:4px;height:100%;display:flex;align-items:end}.bar{width:100%;background:linear-gradient(180deg,#79af89,#4f7d60);border-radius:4px}body.dark .bar-wrap{background:#203328}.footer-note{grid-column:1 / -1}