:root{--green:#173e35;--ink:#223d34;--muted:#7b8178;--gold:#bca16b;--paper:#f7f6f0;--line:#e4e7dc}*{box-sizing:border-box}body{margin:0;background:#eeefe7;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}button,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid var(--gold);outline-offset:4px}button:disabled{opacity:.55;cursor:wait}button{color:var(--ink)}[hidden]{display:none!important}.app{max-width:520px;min-height:100dvh;margin:auto;background:var(--paper);padding:0 26px 110px;position:relative}header{height:100px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--green);font-family:Georgia,serif;font-size:23px}.brand-icon{font-size:34px;transform:rotate(-20deg)}.brand small{font-family:-apple-system,sans-serif;display:block;font-size:8px;letter-spacing:2px;margin-top:6px}.icon-button{border:1px solid var(--line);border-radius:50%;width:40px;height:40px;background:none;font-size:21px}.intro{padding:34px 0 28px}.eyebrow{font-size:10px;font-weight:650;letter-spacing:2.2px}.intro .eyebrow{color:#8f805d}h1{font:normal 43px/1.12 Georgia,serif;letter-spacing:-1.5px;margin:17px 0 23px}.arabic{font:21px/1.9 Georgia,serif;margin:0 0 8px}.verse{font-size:11px;line-height:1.8;color:var(--muted);margin:0}.verse span{display:block;font-size:9px;letter-spacing:1px;margin-top:5px}.location-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid var(--line);padding:17px 0 8px}.location-bar strong{font-size:12px}.location-bar small{display:block;color:var(--muted);font-size:10px;margin:7px 0 0 13px}.status-dot{display:inline-block;background:var(--gold);width:6px;height:6px;border-radius:50%;margin-right:7px}.small-button{font-size:11px;border:0;background:#e9ede4;border-radius:20px;padding:11px 12px;white-space:nowrap}.notice{font-size:11px;color:var(--muted);line-height:1.6;margin:4px 0 20px}.next-card{background:var(--green);color:#f7f3e7;border-radius:18px;padding:24px;position:relative;overflow:hidden;min-height:205px;isolation:isolate}.next-top{display:flex;align-items:center;justify-content:space-between;color:#d3c29b}.moon{font-size:27px}.next-card h2{font:normal 33px/1.2 Georgia,serif;margin:12px 0 24px}.next-bottom{display:flex;justify-content:space-between;align-items:end;gap:10px;font-size:13px}.next-bottom #countdown{font-size:11px;color:#d7cfb6;font-variant-numeric:tabular-nums}.arch{position:absolute;width:195px;height:270px;border:1px solid #ffffff13;right:-25px;top:25px;border-radius:110px 110px 0 0;transform:rotate(-15deg);z-index:-1}.arch:before,.arch:after{content:"";position:absolute;inset:15px;border:1px solid #ffffff13;border-radius:inherit}.arch:after{inset:30px}.section-heading{display:flex;justify-content:space-between;align-items:center;margin:27px 0 8px}.section-heading h2{font:normal 22px Georgia,serif;margin:0}.section-heading span{font-size:11px;color:var(--muted)}.prayer-list{margin-top:12px}.prayer-row{display:flex;align-items:center;gap:14px;padding:16px 13px;border-bottom:1px solid var(--line)}.prayer-row.next{background:#e9eddf;border-radius:12px;border-color:transparent}.prayer-symbol{font-size:20px;width:25px;text-align:center;color:#8b977d}.prayer-names{flex:1}.prayer-names strong{font-size:14px;font-weight:550}.prayer-names small{font-size:11px;color:var(--muted);margin-left:10px}.prayer-time{font-size:15px;font-weight:550;font-variant-numeric:tabular-nums}.next-pill{font-size:8px;color:#6c7c5e;letter-spacing:1px;margin-left:6px}.empty{text-align:center;padding:28px 10px;border:1px dashed var(--line);border-radius:15px}.empty>span{font-size:26px;color:var(--gold)}.empty h3{font-size:15px;font-weight:500}.empty p{font-size:12px;color:var(--muted)}.secondary{border:1px solid #cbd1bf;border-radius:20px;padding:12px 16px;background:transparent;font-size:12px}.method-summary{display:flex;justify-content:space-between;gap:12px;font-size:10px;color:var(--muted);margin:18px 0 28px}.method-summary button{border:0;border-bottom:1px solid #a5ad98;padding:0 0 3px;background:none;font-size:10px}.qibla-teaser{display:flex;align-items:center;text-align:left;gap:15px;width:100%;border:1px solid #dfe3d6;border-radius:13px;background:transparent;padding:18px}.teaser-icon{font-size:32px;color:var(--gold)}.qibla-teaser strong{display:block;font:19px Georgia,serif}.qibla-teaser small{display:block;color:var(--muted);font-size:11px;margin-top:6px}.trailing{margin-left:auto;font-size:23px}.footnote{color:var(--muted);font-size:10px;line-height:1.6;margin-top:22px}nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);max-width:520px;width:100%;background:#f7f6f0f7;backdrop-filter:blur(12px);border-top:1px solid var(--line);display:flex;padding:12px 20px max(14px,env(safe-area-inset-bottom));z-index:5}nav button{flex:1;background:none;border:0;color:#8a9183;font-size:10px;padding:0 12px;letter-spacing:.5px}nav button span{display:block;font-size:25px;margin-bottom:4px}nav button.active{color:var(--green);font-weight:650}footer{text-align:center;font-size:8px;letter-spacing:1.7px;color:#9ca390;margin-top:30px}.compact{padding-bottom:12px}.muted{color:var(--muted);font-size:13px;line-height:1.7}#qibla{text-align:center}#qibla .intro{text-align:left}.compass-wrap{padding:20px 0}.compass{width:280px;height:280px;border-radius:50%;border:1px solid #d5dccb;margin:auto;position:relative;background:repeating-conic-gradient(from 0deg,#b3bcaa 0deg 1deg,transparent 1deg 10deg);box-shadow:0 0 0 9px var(--paper),0 0 0 10px #e4e8da}.compass:before{content:"";position:absolute;inset:12px;border-radius:50%;background:var(--paper)}.compass-inner{position:absolute;inset:47px;border:1px solid #e2e6da;border-radius:50%}.compass>span{position:absolute;font-size:11px;color:#8a947e;z-index:1}.north{top:23px;left:50%;transform:translateX(-50%)}.south{bottom:23px;left:50%;transform:translateX(-50%)}.east{right:25px;top:48%}.west{left:23px;top:48%}.needle{position:absolute;inset:48px 93px;z-index:2;transform-origin:50% 50%}.needle svg{width:100%;height:100%}.compass-dot{width:10px;height:10px;background:var(--gold);border:3px solid var(--paper);border-radius:50%;position:absolute;left:calc(50% - 5px);top:calc(50% - 5px);z-index:3}.compass .compass-placeholder{top:35%;left:39%;font-size:60px;color:var(--gold)}#bearing{font:29px Georgia,serif;margin:24px 0 12px}.turn{font-size:13px;color:#697a5e;min-height:32px;line-height:1.7}.primary{display:block;background:var(--green);color:white;width:100%;border:0;border-radius:12px;padding:17px;font-size:14px;margin-top:20px}.compass-help{font-size:12px;line-height:1.8;color:var(--muted);margin:20px 8px}.info-box{text-align:left;border-top:1px solid var(--line);padding:23px 0 5px;margin-top:23px;font-size:12px;line-height:1.8;color:var(--muted)}.info-box strong{color:var(--ink);font-size:14px;font-weight:550}.info-box a{color:var(--ink)}form label{display:block;font-size:12px;margin-top:24px}select{display:block;width:100%;padding:15px 10px;margin-top:10px;background:#eef0e7;border:1px solid #dfe3d6;border-radius:10px;color:var(--ink);font-size:16px}.check{line-height:1.8}.check input{margin-right:8px}.form-help{font-size:12px;color:var(--muted);line-height:1.7}@media(min-width:700px){.app{margin-top:25px;margin-bottom:25px;border-radius:24px;box-shadow:0 10px 70px #233c3310}nav{border-radius:0 0 24px 24px}}@media(max-width:360px){.app{padding-left:19px;padding-right:19px}h1{font-size:38px}.prayer-names small{margin-left:4px}.location-bar{gap:5px}.small-button{padding:10px 8px}}
