.device{aspect-ratio:71.6/146.6;isolation:isolate;position:relative;container-type:inline-size}.device-frame{--pt:.2385cqw;background:linear-gradient(160deg,#6b6864 0%,#2f2d2a 18%,#191b1d 50%,#3a3834 82%,#66635d 100%);background:linear-gradient(160deg,lab(44.3423% .475973 3.0261) 0%,lab(18.8163% .365034 2.27516) 18%,lab(9.50293% -.240758 -1.85762) 50%,lab(23.4565% .360936 2.27228) 82%,lab(42.0271% .608444 3.79193) 100%);border-radius:16.4cqw;padding:1.05cqw;position:absolute;inset:0;box-shadow:inset 0 0 0 .25cqw #8986808c,inset 0 .6cqw 1cqw #fff7ea38,0 0 0 .2cqw #020202e6,0 4cqw 10cqw -2cqw #0000008c,0 14cqw 26cqw -8cqw #00000080;box-shadow:inset 0 0 0 .25cqw lab(55.9477% .597149 3.78412/.55),inset 0 .6cqw 1cqw lab(97.775% 2.67181 15.351/.22),0 0 0 .2cqw lab(.462488% 0 0/.9),0 4cqw 10cqw -2cqw lab(0% 0 0/.55),0 14cqw 26cqw -8cqw lab(0% 0 0/.5)}.device-bezel{background:#020203;border-radius:15.4cqw;height:100%;padding:2.35cqw;position:relative}.device-screen{background:var(--app-bg,#0d0d0f);height:100%;color:var(--app-text,#f7f4ed);border-radius:13.1cqw;position:relative;overflow:hidden;transform:translateZ(0)}.device-screen:after{content:"";pointer-events:none;transform:translate3d(var(--sheen-x,0%), 0, 0);mix-blend-mode:screen;z-index:40;background:linear-gradient(112deg,#ffffff1c 0%,#ffffff09 26%,#fff0 44% 100%);background:linear-gradient(112deg,lab(100% 0 0/.11) 0%,lab(100% 0 0/.035) 26%,lab(100% 0 0/0) 44% 100%);position:absolute;inset:-20%}.device-capture .device-screen:after{display:none}.device-island{top:calc(11 * var(--pt));width:calc(124 * var(--pt));height:calc(36 * var(--pt));z-index:50;background:#000;border-radius:999px;position:absolute;left:50%;translate:-50%}.device-button{z-index:-1;background:linear-gradient(90deg,#4f4d49,#252421);background:linear-gradient(90deg,lab(32.7368% .355065 2.26826),lab(14.1736% .30309 1.8952));border-radius:.6cqw;width:.9cqw;position:absolute}.app-dark{--app-bg:#0d0d0f;--app-card:#18191e;--app-card-2:#1e2026;--app-line:#ffffff14;--app-text:#f7f4ed;--app-text-2:#aaa39a;--app-accent:#f0be42;--app-accent-soft:#e6b74629;--app-on-accent:#11100d}.app-light{--app-bg:#f6f4ef;--app-card:#fff;--app-card-2:#f0ece3;--app-line:#e5dec9;--app-text:#17130f;--app-text-2:#6b6358;--app-accent:#a47012;--app-accent-soft:#b982181f;--app-on-accent:#fffefb}.scr{font-family:var(--font-sans);font-size:calc(15 * var(--pt));background:var(--app-bg);color:var(--app-text);flex-direction:column;line-height:1.35;display:flex;position:absolute;inset:0}.scr-status{height:calc(54 * var(--pt));padding-inline:calc(34 * var(--pt)) calc(30 * var(--pt));padding-top:calc(4 * var(--pt));font-size:calc(16 * var(--pt));letter-spacing:-.01em;direction:ltr;flex:none;justify-content:space-between;align-items:center;font-weight:600;display:flex}.scr-body{min-height:0;padding-inline:calc(18 * var(--pt));flex:1;overflow:hidden}.scr-title{font-family:var(--font-display);font-size:calc(32 * var(--pt));letter-spacing:-.02em;font-weight:500;line-height:1.1}:lang(ar) .scr-title{font-family:var(--font-sans-arabic), sans-serif;font-weight:600;font-size:calc(28 * var(--pt))}.scr-label{font-size:calc(11 * var(--pt));letter-spacing:.12em;text-transform:uppercase;color:var(--app-text-2);font-weight:600}:lang(ar) .scr-label{text-transform:none;font-size:calc(12.5 * var(--pt))}.scr-card{background:var(--app-card);border:var(--hairline) solid var(--app-line);border-radius:calc(22 * var(--pt))}.scr-small{font-size:calc(13 * var(--pt));color:var(--app-text-2)}.scr-tabbar{padding:calc(8 * var(--pt)) calc(10 * var(--pt)) calc(30 * var(--pt));border-top:var(--hairline) solid var(--app-line);background:color-mix(in oklch, var(--app-bg) 86%, transparent);font-size:calc(10 * var(--pt));color:var(--app-text-2);text-align:center;flex:none;grid-template-columns:repeat(5,1fr);font-weight:500;display:grid}.scr-tabbar svg{width:calc(24 * var(--pt));height:calc(24 * var(--pt));margin:0 auto calc(3 * var(--pt))}.scr-tabbar [data-active]{color:var(--app-accent)}.scr-home{bottom:calc(8 * var(--pt));width:calc(136 * var(--pt));height:calc(5 * var(--pt));opacity:.85;z-index:30;background:currentColor;border-radius:99px;position:absolute;left:50%;translate:-50%}.scr-quran{font-family:var(--font-quran);letter-spacing:0;direction:rtl;line-height:2.05}
