:root{--green: #0b3d2e;--green-2: #115640;--gold: #d4af37;--bg: #f4f1ea;--card: #ffffff;--ink: #1d2b25;--muted: #6b7c74;--line: #e3ddcf;--danger: #b3261e;--radius: 16px;--shadow: 0 2px 10px rgba(11, 61, 46, .08)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,system-ui,sans-serif;background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased}.ayah-ar,.dua-ar{font-family:Amiri,Scheherazade New,Traditional Arabic,serif}.app{max-width:560px;margin:0 auto;min-height:100%;display:flex;flex-direction:column;background:var(--bg)}.app-header{position:sticky;top:0;z-index:10}.topbar{display:flex;align-items:center;justify-content:space-between;padding:15px 18px;background:linear-gradient(120deg,var(--green) 0%,var(--green-2) 100%);color:#fff;box-shadow:0 2px 12px #0b3d2e2e}.brand{display:flex;align-items:center;gap:9px;font-size:21px;font-weight:700;letter-spacing:.2px}.brand-logo{height:40px;width:auto;border-radius:8px;display:block}.brand strong{color:var(--gold);font-weight:800}.brand-mark{color:var(--gold);font-size:18px;width:30px;height:30px;display:grid;place-items:center;border:1.5px solid var(--gold);border-radius:9px}.settings-link{color:#fff;text-decoration:none;font-size:22px;opacity:.85}.settings-link:hover{opacity:1}.durood-bar{background:linear-gradient(90deg,var(--gold),#e9c75a);color:#2a2200;overflow:hidden;white-space:nowrap;border-bottom:1px solid rgba(0,0,0,.08)}.durood-track{display:inline-flex;white-space:nowrap;will-change:transform;animation:durood-scroll 44s linear infinite reverse}.durood-track span{font-family:Aref Ruqaa,Scheherazade New,Amiri,serif;font-size:22px;font-weight:700;line-height:1;padding:9px 0}@keyframes durood-scroll{0%{transform:translate(0)}to{transform:translate(-50%)}}@media(prefers-reduced-motion:reduce){.durood-track{animation:none}}.content{flex:1;padding:18px 16px 90px}.app-footer{margin-top:24px;padding:16px 0 4px;text-align:center;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}.app-footer a{color:var(--green-2);font-weight:600}.tabbar{position:fixed;bottom:0;left:0;right:0;max-width:560px;margin:0 auto;display:flex;background:var(--card);border-top:1px solid var(--line);padding:6px 4px calc(6px + env(safe-area-inset-bottom))}.tab{flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 0;text-decoration:none;color:var(--muted);font-size:11px}.tab-icon{font-size:20px;filter:grayscale(.4)}.tab.active{color:var(--green);font-weight:700}.tab.active .tab-icon{filter:none}.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px;margin-bottom:14px}h1{font-size:22px;margin:4px 0 14px}h2{font-size:16px;margin:0 0 10px}.muted{color:var(--muted)}.center{text-align:center}.row{display:flex;gap:10px;align-items:center}.spread{justify-content:space-between}.wrap{flex-wrap:wrap}.stack>*+*{margin-top:10px}button,.btn{font:inherit;border:none;border-radius:12px;padding:11px 16px;background:var(--green);color:#fff;cursor:pointer;font-weight:600}button.ghost,.btn.ghost{background:transparent;color:var(--green);border:1px solid var(--green)}button.gold{background:var(--gold);color:#2a2200}button:disabled{opacity:.5;cursor:default}button.small{padding:6px 12px;font-size:13px;border-radius:10px}input,select,textarea{font:inherit;width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--ink)}label{display:block;font-size:13px;color:var(--muted);margin-bottom:4px}.field{margin-bottom:12px}.pill{display:inline-block;padding:3px 10px;border-radius:999px;font-size:12px;background:#eef3f0;color:var(--green-2);font-weight:600}.error{color:var(--danger);font-size:14px}.next-prayer{background:linear-gradient(135deg,var(--green),var(--green-2));color:#fff;text-align:center;border-radius:var(--radius);padding:22px 16px;margin-bottom:16px}.next-prayer .label{opacity:.8;font-size:14px}.next-prayer .name{font-size:30px;font-weight:800;margin:4px 0}.next-prayer .countdown{font-size:18px;color:var(--gold);font-weight:700}.prayer-row{display:flex;justify-content:space-between;align-items:center;padding:13px 4px;border-bottom:1px solid var(--line)}.prayer-row:last-child{border-bottom:none}.prayer-row.active{background:#f0f7f3;border-radius:10px;padding-left:10px;padding-right:10px}.prayer-row .pname{font-weight:600}.prayer-row .ptime{font-variant-numeric:tabular-nums;font-weight:700}.compass{position:relative;width:260px;height:260px;margin:16px auto;border-radius:50%;border:3px solid var(--line);background:radial-gradient(circle at 50% 40%,#fff,#f1ece0)}.compass .needle{position:absolute;top:50%;left:50%;width:6px;height:110px;margin:-110px 0 0 -3px;transform-origin:bottom center;transition:transform .2s ease-out}.compass .needle .kaaba{font-size:26px;position:absolute;top:-14px;left:-10px}.compass .needle .stem{width:4px;height:100%;margin:0 auto;background:linear-gradient(var(--gold),transparent)}.compass .center-dot{position:absolute;top:50%;left:50%;width:12px;height:12px;margin:-6px;border-radius:50%;background:var(--green)}.compass .mark{position:absolute;font-size:12px;color:var(--muted);font-weight:700}.compass .n{top:6px;left:50%;transform:translate(-50%)}.compass .s{bottom:6px;left:50%;transform:translate(-50%)}.compass .e{right:8px;top:50%;transform:translateY(-50%)}.compass .w{left:8px;top:50%;transform:translateY(-50%)}.surah-item{display:flex;align-items:center;gap:12px;padding:12px 4px;border-bottom:1px solid var(--line);cursor:pointer}.surah-num{width:34px;height:34px;flex:none;display:grid;place-items:center;border-radius:8px;transform:rotate(45deg);background:#eef3f0;color:var(--green);font-size:12px;font-weight:700}.surah-num span{transform:rotate(-45deg)}.ayah{padding:14px 0;border-bottom:1px solid var(--line)}.ayah-ar{font-size:26px;line-height:2;text-align:right;font-family:Traditional Arabic,Scheherazade New,serif;direction:rtl}.ayah-en{color:var(--muted);margin-top:8px;font-size:15px}.ayah-no{display:inline-block;min-width:24px;height:24px;line-height:24px;text-align:center;border-radius:50%;background:var(--green);color:#fff;font-size:11px;margin-left:8px}.tasbih{text-align:center}.tasbih .count{font-size:64px;font-weight:800;color:var(--green);font-variant-numeric:tabular-nums}.tasbih-btn{width:160px;height:160px;border-radius:50%;font-size:18px;background:var(--green);margin:10px auto;display:block}.dua-ar{font-size:22px;line-height:1.9;text-align:right;direction:rtl}.dua-tl{font-style:italic;color:var(--green-2);margin-top:8px}.dua-en{margin-top:6px}.dua-ref{font-size:12px;color:var(--muted);margin-top:6px}.mosque{border-left:3px solid var(--gold)}.times-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px}.time-cell{background:#f5f8f6;border-radius:10px;padding:8px;text-align:center}.time-cell .t-name{font-size:11px;color:var(--muted);text-transform:uppercase}.time-cell .t-val{font-weight:700;font-variant-numeric:tabular-nums}.chat-wrap{display:flex;flex-direction:column;height:calc(100vh - 230px)}.room-tabs{display:flex;gap:8px;margin-bottom:10px}.room-tabs button{flex:1;background:#eef3f0;color:var(--green)}.room-tabs button.active{background:var(--green);color:#fff}.messages{flex:1;overflow-y:auto;padding:4px;display:flex;flex-direction:column;gap:8px}.msg{max-width:80%;padding:8px 12px;border-radius:14px;background:#fff;box-shadow:var(--shadow)}.msg.mine{align-self:flex-end;background:var(--green);color:#fff}.msg .who{font-size:11px;font-weight:700;opacity:.7;margin-bottom:2px}.msg .when{font-size:10px;opacity:.6;margin-top:2px}.composer{display:flex;gap:8px;margin-top:10px}.composer input{flex:1}.card{border:1px solid rgba(227,221,207,.7)}h1{letter-spacing:-.3px;font-weight:800}h2{letter-spacing:-.2px}.tab.active{position:relative}.tab.active:before{content:"";position:absolute;top:0;left:50%;transform:translate(-50%);width:26px;height:3px;border-radius:0 0 3px 3px;background:var(--gold)}.next-prayer{position:relative;overflow:hidden;box-shadow:0 8px 24px #0b3d2e38}.next-prayer:after{content:"☪";position:absolute;right:-10px;bottom:-30px;font-size:130px;opacity:.06;line-height:1}.room-tabs button{transition:background .15s,color .15s;font-weight:600}button{transition:filter .15s,opacity .15s}button:hover:not(:disabled){filter:brightness(1.06)}.surah-item:hover,.prayer-row:hover{background:#f7faf8}a{color:var(--green-2)}.quick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px}.quick-tile{display:flex;flex-direction:column;align-items:center;gap:6px;padding:16px 8px;text-decoration:none;color:var(--ink);background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}.quick-tile:hover{background:#f7faf8}.quick-tile .qi{font-size:24px}.quick-tile .ql{font-size:12px;font-weight:600;text-align:center}.spinner{text-align:center;color:var(--muted);padding:30px}.spinner:after{content:"";display:inline-block;width:18px;height:18px;margin-left:8px;vertical-align:middle;border:2px solid var(--line);border-top-color:var(--green);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.banner{background:#fff8e1;border:1px solid #f0e2a8;border-radius:12px;padding:12px;font-size:14px;margin-bottom:14px}.list-reset{list-style:none;padding:0;margin:0}
