:root{--surface-page: #F4F6F5;--surface-card: #FFFFFF;--surface-sunken: #E9EEEC;--ink: #132321;--ink-muted: #4E5F5B;--line: #DCE3E0;--brand-500: #0E5F5B;--on-brand: #FFFFFF;--brand-soft: #DCEFEC;--brand-ink: #0A4744;--present-ink: #1B6B3A;--present-soft: #DDF3E4;--late-ink: #2747A8;--late-soft: #E1E8FB;--absent-ink: #A3262A;--absent-soft: #FBE3E3;--excused-ink: #6A3B9C;--excused-soft: #EEE5F8;--warn-ink: #A3304F;--warn-soft: #FCE4EA;--team-500: #0B5F86;--team-soft: #DDEFF7;--on-team: #FFFFFF;--shadow-card: 0 1px 2px rgba(19,35,33,.06), 0 4px 12px rgba(19,35,33,.06);--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--radius-full: 999px;--font: "IBM Plex Sans Arabic", "Noto Kufi Arabic", Tahoma, sans-serif;color-scheme:light}:root[data-theme=dark]{--surface-page: #0E1514;--surface-card: #16201F;--surface-sunken: #0A100F;--ink: #E8EFED;--ink-muted: #A3B3AF;--line: #26332F;--brand-500: #5CC2B8;--on-brand: #062221;--brand-soft: #12302D;--brand-ink: #8FDCD3;--present-ink: #7FD9A0;--present-soft: #13301F;--late-ink: #A9BCF5;--late-soft: #1A2547;--absent-ink: #F5A3A5;--absent-soft: #3A1617;--excused-ink: #CFB3F0;--excused-soft: #2A1C3B;--warn-ink: #F7A9BC;--warn-soft: #3B1820;--team-500: #86CDEB;--team-soft: #10293A;--on-team: #071E2B;--shadow-card: 0 1px 2px rgba(0,0,0,.4), 0 4px 12px rgba(0,0,0,.25);color-scheme:dark}*,*:before,*:after{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--surface-page);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.6;-webkit-tap-highlight-color:transparent}button,input,textarea{font:inherit;color:inherit}button{cursor:pointer}h1,h2,h3,p{margin:0}:focus-visible{outline:2px solid var(--brand-500);outline-offset:2px}.num{font-variant-numeric:tabular-nums}@media (prefers-reduced-motion: no-preference){.btn,.chip,.pc,.choice,.seg button,.switch,.switch span{transition:background-color .18s ease-out,color .18s ease-out,box-shadow .18s ease-out}}.app{min-height:100%;display:flex;justify-content:center}.screen{width:100%;max-width:480px;min-height:100dvh;display:flex;flex-direction:column;background:var(--surface-page);padding-top:env(safe-area-inset-top)}.scroll{flex:1;overflow-y:auto;padding:8px 16px 32px;display:flex;flex-direction:column;gap:16px}.dock{position:sticky;bottom:0;padding:12px 16px calc(16px + env(safe-area-inset-bottom));background:var(--surface-card);border-top:1px solid var(--line);display:flex;flex-direction:column;gap:8px}.head{display:flex;flex-direction:column;gap:2px}.head-row{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:28px}.mosque-name{font-size:15px;font-weight:700;color:var(--brand-ink)}.context{font-size:13px;color:var(--ink-muted)}.title{font-size:24px;font-weight:700;line-height:1.3}.muted{color:var(--ink-muted)}.caption{font-size:13px}.small{font-size:14px}.row{display:flex;align-items:center;gap:8px}.between{justify-content:space-between}.stack{display:flex;flex-direction:column}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:8px}.btn{min-height:48px;padding:0 20px;border:0;border-radius:var(--radius-md);font-size:16px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:8px}.btn-lg{min-height:52px;width:100%}.btn-sm{min-height:44px;padding:0 16px;font-size:14px}.btn-pill{border-radius:var(--radius-full)}.btn-primary{background:var(--brand-500);color:var(--on-brand)}.btn-secondary{background:var(--surface-card);color:var(--brand-ink);box-shadow:inset 0 0 0 1px var(--brand-500)}.btn-quiet{background:transparent;color:var(--brand-ink);padding:0 8px}.btn-danger{background:var(--absent-ink);color:var(--surface-card)}.btn-danger-outline{background:transparent;color:var(--absent-ink);box-shadow:inset 0 0 0 1px var(--absent-ink)}.btn:disabled{opacity:.5;cursor:not-allowed}.back{align-self:flex-start;min-height:44px;padding:0;border:0;background:none;display:flex;align-items:center;gap:4px;font-size:15px;font-weight:600;color:var(--brand-ink)}.icon-btn{width:44px;height:44px;border:0;border-radius:var(--radius-md);background:transparent;color:var(--ink-muted);display:inline-flex;align-items:center;justify-content:center}.flip{transform:scaleX(-1)}.field{display:flex;flex-direction:column;gap:4px}.field-label{font-size:14px;font-weight:600}.input{height:52px;padding:0 16px;border:0;border-radius:var(--radius-md);background:var(--surface-sunken);color:var(--ink);font-size:16px;width:100%;box-shadow:inset 0 0 0 1px var(--line);outline:none}.input:focus{box-shadow:inset 0 0 0 2px var(--brand-500)}.input[dir=ltr]{text-align:left}.input.error{box-shadow:inset 0 0 0 2px var(--absent-ink)}textarea.input{height:auto;min-height:96px;padding:12px 16px;resize:vertical;line-height:1.6}.field-error{font-size:13px;font-weight:600;color:var(--absent-ink)}.field-hint{font-size:13px;color:var(--ink-muted)}.otp{text-align:center!important;font-size:24px;font-weight:700;font-variant-numeric:tabular-nums}.chip{display:inline-flex;align-items:center;padding:2px 10px;border-radius:var(--radius-sm);font-size:13px;font-weight:600;white-space:nowrap}.chip-row{padding:4px 12px;font-size:14px}.chip-ring{box-shadow:inset 0 0 0 1px currentColor}.alert{padding:12px 16px;border-radius:var(--radius-md);font-size:14px;font-weight:600}.s-present{background:var(--present-soft);color:var(--present-ink)}.s-late{background:var(--late-soft);color:var(--late-ink)}.s-absent{background:var(--absent-soft);color:var(--absent-ink)}.s-excused{background:var(--excused-soft);color:var(--excused-ink)}.s-warn{background:var(--warn-soft);color:var(--warn-ink)}.s-brand{background:var(--brand-soft);color:var(--brand-ink)}.s-none{background:var(--surface-sunken);color:var(--ink-muted)}.card{background:var(--surface-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-card)}.card-pad{padding:16px}.card-list>*{border-bottom:1px solid var(--line)}.card-list>*:last-child{border-bottom:0}.card-title{padding:12px 16px;font-size:16px;font-weight:700}.list-row{padding:10px 16px;display:flex;justify-content:space-between;align-items:center;gap:8px}.tap-card{width:100%;border:0;text-align:start;padding:16px;display:flex;align-items:center;gap:12px;color:var(--ink)}.stat{padding:12px 16px;display:flex;flex-direction:column}.stat-value{font-size:28px;font-weight:700;line-height:1.3;font-variant-numeric:tabular-nums}.arch{width:220px;height:250px;border-radius:110px 110px 0 0;background:var(--brand-500);color:var(--on-brand);display:flex;flex-direction:column;align-items:center;justify-content:flex-end;padding:0 16px 32px;gap:4px;text-align:center}.arch img{width:72px;height:72px;object-fit:contain;border-radius:var(--radius-md);background:var(--surface-card);margin-bottom:8px}.choices{display:flex;flex-wrap:wrap;gap:6px}.choice{min-height:44px;padding:0 14px;border:0;border-radius:var(--radius-md);font-size:14px;font-weight:600;background:var(--surface-card);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}.choice.on{background:var(--brand-soft);color:var(--brand-ink);box-shadow:inset 0 0 0 1px var(--brand-500)}.seg{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:4px;padding:4px;border-radius:var(--radius-md);background:var(--surface-sunken)}.seg button{min-height:44px;border:0;border-radius:8px;background:transparent;color:var(--ink-muted);font-size:15px;font-weight:600}.seg button.on{background:var(--surface-card);color:var(--ink);box-shadow:var(--shadow-card)}.logo-box{width:56px;height:56px;border-radius:var(--radius-md);background:var(--surface-sunken);box-shadow:inset 0 0 0 1px var(--line);display:flex;align-items:center;justify-content:center;font-size:13px;color:var(--ink-muted);flex:none;overflow:hidden}.logo-box img{width:100%;height:100%;object-fit:contain}.brand-opt{border:0;background:var(--surface-card);display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 4px;border-radius:var(--radius-md);box-shadow:inset 0 0 0 1px var(--line);color:var(--ink)}.brand-opt.on{box-shadow:inset 0 0 0 2px var(--ink)}.swatch{width:36px;height:36px;border-radius:var(--radius-full)}.toggle-row{width:100%;border:0;background:transparent;min-height:56px;padding:8px 16px;display:flex;align-items:center;gap:12px;text-align:start;color:var(--ink);font-size:15px}.switch{width:44px;height:26px;border-radius:var(--radius-full);padding:3px;display:flex;background:var(--line);flex:none}.switch span{width:20px;height:20px;border-radius:var(--radius-full);background:var(--surface-card)}.switch.on{background:var(--brand-500);justify-content:flex-start}.switch:not(.on){justify-content:flex-end}.skeleton{background:var(--surface-sunken);border-radius:var(--radius-lg)}.present-text{color:var(--present-ink)}.warn-text{color:var(--warn-ink)}.pc{flex:none;border:0;border-radius:var(--radius-full);display:inline-flex;align-items:center;justify-content:center;font-size:15px;font-weight:700;padding:0}.pc:disabled{cursor:default}.pc-present{background:var(--present-soft);color:var(--present-ink);box-shadow:inset 0 0 0 2px var(--present-ink)}.pc-absent{background:var(--absent-soft);color:var(--absent-ink);box-shadow:inset 0 0 0 2px var(--absent-ink)}.pc-open{background:var(--surface-card);color:var(--brand-ink);box-shadow:inset 0 0 0 2px var(--brand-500)}.pc-upcoming,.pc-off{background:var(--surface-sunken);color:var(--ink-muted);box-shadow:inset 0 0 0 1px var(--line)}.prayer-head,.prayer-row{display:grid;grid-template-columns:minmax(0,1fr) repeat(5,44px);gap:6px;align-items:center}.prayer-head{padding:10px 12px;position:sticky;top:0;z-index:2;background:var(--surface-card);border-bottom:1px solid var(--line);border-radius:var(--radius-lg) var(--radius-lg) 0 0}.prayer-head .ph{text-align:center;font-size:13px;font-weight:600;line-height:1.3}.prayer-head .ph.now{color:var(--brand-ink)}.prayer-row{padding:8px 12px;min-height:60px;border-bottom:1px solid var(--line)}.prayer-row:last-child{border-bottom:0}.prayer-row .who{min-width:0;display:flex;flex-direction:column}.prayer-row .who b{font-size:15px;font-weight:600;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (max-width: 360px){.prayer-head,.prayer-row{grid-template-columns:minmax(0,1fr) repeat(5,38px);gap:4px}.prayer-row .pc{width:38px!important;height:38px!important}}.tabbar{position:sticky;bottom:0;z-index:5;display:grid;grid-template-columns:repeat(3,1fr);background:var(--surface-card);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}.tabbar button{min-height:60px;border:0;background:transparent;color:var(--ink-muted);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:13px;font-weight:600}.tabbar button.on{color:var(--brand-ink)}.tabbar-dock{position:sticky;bottom:0;z-index:5}.tabbar-dock .dock{position:static;border-top:1px solid var(--line);padding-bottom:12px}.tabbar-dock .tabbar{position:static}.sheet-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;background:#0a100f80;display:flex;align-items:flex-end;justify-content:center}.sheet{width:100%;max-width:480px;max-height:92dvh;overflow-y:auto;background:var(--surface-page);border-radius:16px 16px 0 0;padding:12px 16px calc(24px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:16px}.cam{position:relative;width:100%;aspect-ratio:3 / 4;max-height:56dvh;border-radius:var(--radius-lg);overflow:hidden;background:#0a100f}.cam video{width:100%;height:100%;object-fit:cover}.cam.mirror video{transform:scaleX(-1)}.cam .frame{position:absolute;top:18%;right:14%;bottom:18%;left:14%;border-radius:var(--radius-lg);box-shadow:0 0 0 2px #ffffffe6,0 0 0 999px #00000059}.cam .frame.round{top:14%;right:18%;bottom:14%;left:18%;border-radius:50%}.cam .cam-msg{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;padding:24px;text-align:center;color:#e8efed;font-size:15px}.idcard{border-radius:var(--radius-lg);background:var(--brand-500);color:var(--on-brand);padding:16px;display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center}.idcard .qr{width:132px;height:132px;border-radius:var(--radius-md);background:#fff;padding:6px}.idcard .qr img{width:100%;height:100%;image-rendering:pixelated}.avatar{width:40px;height:40px;border-radius:var(--radius-full);background:var(--surface-sunken);color:var(--ink-muted);display:flex;align-items:center;justify-content:center;font-weight:600;flex:none;overflow:hidden}.avatar img{width:100%;height:100%;object-fit:cover}.date-nav{display:flex;align-items:center;gap:4px}.date-nav input{height:44px;border:0;border-radius:var(--radius-md);background:var(--surface-sunken);box-shadow:inset 0 0 0 1px var(--line);padding:0 12px;color:var(--ink);flex:1;min-width:0}@media print{body *{visibility:hidden}.print-area,.print-area *{visibility:visible}.print-area{position:fixed;top:0;right:0;bottom:0;left:0;margin:auto;width:86mm;height:fit-content;-webkit-print-color-adjust:exact;print-color-adjust:exact}}