:root{--home-ground-height:clamp(56px,14.4vh,82px);--home-sky:#8fdcf8;--home-ground:#647279;--home-ground-edge:#809096;--home-label:#ffffff}.player-shell,.player-viewport{width:100%;height:100%}.player-shell{position:fixed;inset:0;overflow:hidden;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}.player-shell img{-webkit-user-drag:none}.player-shell :is(button,[role=button],a,img,svg),.player-shell :is(button,[role=button],a,img,svg) *{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}.player-shell :is(button,[role=button],a,img,svg) ::selection,.player-shell :is(button,[role=button],a,img,svg)::selection{background:transparent}.player-shell :is(.support-preview__chat,.support-preview__chat *){user-select:text;-webkit-user-select:text;-webkit-touch-callout:default}.player-viewport{position:relative}.player-desktop-hint{display:none}@media (hover:hover) and (pointer:fine) and (min-width:900px) and (min-height:600px){.player-shell{display:grid;grid-template-rows:minmax(0,1fr) auto;justify-items:center;gap:12px;padding:24px 32px 18px;background:#28343b}.player-viewport{align-self:center;width:min(1280px,calc(100vw - 64px),calc(177.78vh - 192px));height:auto;aspect-ratio:16/9;overflow:hidden;border:6px solid #171c20;border-radius:20px;background:var(--home-sky);box-shadow:0 20px 54px rgba(0,0,0,.34);transform:translateZ(0)}.player-desktop-hint{display:block;color:#eef6f8;font-family:var(--font-yekan-bakh);font-size:14px;font-weight:700;line-height:1.5;text-align:center}}@media (display-mode:fullscreen),(display-mode:standalone){.player-desktop-hint{display:none}}.home{position:fixed;inset:0;overflow:hidden;display:flex;flex-direction:column;isolation:isolate;background:var(--home-sky)}.published-stage-info,.published-state{position:fixed;inset:0;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 18% 18%,rgba(255,255,255,.72) 0 8%,transparent 8.5%),linear-gradient(180deg,#8fdcf8,#dff6ff)}.published-state-card{width:min(90vw,470px);display:grid;justify-items:center;gap:16px;padding:clamp(24px,6vw,42px);border:solid #e5e5e5;border-width:3px 3px 8px;border-radius:28px;background:#ffffff;color:var(--ink);text-align:center}.published-state-card h1,.published-state-card p{line-height:1.6}.published-refresh,.published-state-card button{min-height:50px;border:0;border-radius:16px;padding:10px 24px;background:var(--duo-blue);box-shadow:0 5px 0 var(--duo-blue-dark);color:#ffffff;cursor:pointer}.published-refresh:focus-visible,.published-state-card button:focus-visible{outline:4px solid #ffd83d;outline-offset:4px}.published-state-mascot{color:var(--duo-blue);font-size:clamp(44px,10vw,72px);line-height:1}.draft-preview,.draft-preview-state{position:fixed;inset:0;overflow:auto;padding:clamp(16px,4vw,40px);background:radial-gradient(circle at 18% 12%,rgba(255,255,255,.7) 0 7%,transparent 7.5%),linear-gradient(180deg,#8fdcf8,#e8f9ff);color:var(--ink)}.draft-preview-state{display:grid;place-items:center}.draft-preview-header,.draft-preview-issues,.draft-preview-stage{width:min(100%,920px);margin-inline:auto;border:solid #e5e5e5;border-width:3px 3px 7px;border-radius:24px;background:#fff}.draft-preview-header{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px}.draft-preview-header h1,.draft-preview-stage h2{margin:4px 0}.draft-preview-header button{min-height:46px;border:0;border-radius:14px;padding:10px 18px;background:var(--duo-blue);box-shadow:0 5px 0 var(--duo-blue-dark);color:#fff;cursor:pointer}.draft-preview-issues{margin-block:18px;padding:16px 20px;border-color:#f6c86b;background:#fff8df}.draft-preview-ayahs,.draft-preview-pages,.draft-preview-phases,.draft-preview-stages{list-style:none;margin:0;padding:0}.draft-preview-stages{display:grid;gap:18px;width:min(100%,920px);margin:18px auto 40px}.draft-preview-primary-media{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;width:min(100%,920px);margin:18px auto}.draft-preview-media{margin:12px 0 0}.draft-preview-media figcaption{margin-bottom:8px;font-weight:800}.draft-preview-stage{width:100%;padding:20px}.draft-preview-stage-heading{display:flex;align-items:center;gap:14px}.draft-preview-stage-heading>span{display:grid;width:44px;height:44px;place-items:center;border-radius:50%;background:var(--duo-blue);color:#fff;font-weight:800}.draft-preview-ayah{font-size:clamp(22px,5vw,38px);line-height:2;text-align:center}.draft-preview-ayahs,.draft-preview-pages,.draft-preview-phases{display:grid;gap:12px;margin-top:16px}.draft-preview-ayahs>li,.draft-preview-pages>li,.draft-preview-phases>li{padding:14px;border:2px solid #e5e5e5;border-radius:16px;background:#f9fcfd}.draft-preview-audio,.draft-preview-image,.draft-preview-video{display:block;max-width:100%;margin:12px auto 0}.draft-preview-image,.draft-preview-video{max-height:360px;border-radius:14px;object-fit:contain}.draft-preview-audio{width:min(100%,520px)}.draft-preview-media-error{margin-block:10px 0;border-radius:12px;padding:10px 12px;background:#fff0ee;color:#9b2d22;font-weight:700}@media (max-width:680px){.draft-preview-header{align-items:stretch;flex-direction:column}}.published-refresh{position:absolute;right:max(16px,env(safe-area-inset-right));bottom:calc(var(--home-ground-height) + 14px);z-index:9;min-height:44px;padding:8px 16px;font-size:14px}.published-stage-kind{width:82px;height:74px;display:grid;place-items:center;border-radius:50%;background:var(--duo-blue);box-shadow:0 7px 0 var(--duo-blue-dark);color:#ffffff;font-size:32px}.published-stage-kind.summary{border-radius:28%;background:var(--duo-yellow);box-shadow:0 7px 0 var(--duo-yellow-dark)}.published-stage-kind.video{border-radius:30% 46% 30% 46%;background:var(--duo-blue)}.published-stage-kind.book{border-radius:22% 38% 38% 22%;background:var(--duo-purple);box-shadow:0 7px 0 var(--duo-purple-dark)}.home-ground{bottom:0;left:0;right:0;height:var(--home-ground-height);background:var(--home-ground);border-top:clamp(6px,1.8vh,9px) solid var(--home-ground-edge);box-shadow:inset 0 2px 0 rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;z-index:3;flex-shrink:0}.clouds,.home-ground{position:absolute;overflow:hidden}.clouds{inset:0;pointer-events:none;z-index:2}.cloud{position:absolute;left:0;display:block;background:transparent;will-change:transform;animation-timing-function:linear;animation-iteration-count:infinite}.cloud--far{filter:blur(.6px);z-index:1}.cloud--mid{filter:blur(.25px);z-index:2}.cloud--near{z-index:3}.cloud--ltr{animation-name:cloud-drift-ltr}.cloud--rtl{animation-name:cloud-drift-rtl}.cloud:after,.cloud:before{content:"";position:absolute;background:inherit;border-radius:50%;box-shadow:inherit}.cloud--svg:after,.cloud--svg:before{content:none}.cloud--svg svg{display:block;width:100%;height:auto;overflow:visible;filter:drop-shadow(0 10px 18px rgba(71,160,206,.1))}.cloud--far.cloud--svg svg{filter:drop-shadow(0 8px 16px rgba(71,160,206,.06))}.cloud--near.cloud--svg svg{filter:drop-shadow(0 12px 20px rgba(71,160,206,.13))}.cloud--shape-1{border-radius:50px}.cloud--shape-1:before{width:48%;height:190%;top:-80%;left:10%}.cloud--shape-1:after{width:32%;height:140%;top:-50%;left:52%}.cloud--shape-2{border-radius:50px}.cloud--shape-2:before{width:45%;height:190%;top:-80%;left:15%}.cloud--shape-2:after{width:38%;height:165%;top:-60%;left:45%}.cloud--shape-3{border-radius:45px}.cloud--shape-3:before{width:36%;height:160%;top:-60%;left:22%}.cloud--shape-3:after{width:42%;height:180%;top:-75%;left:50%}@keyframes cloud-drift-ltr{0%{transform:translate3d(-18vw,0,0)}to{transform:translate3d(108vw,0,0)}}@keyframes cloud-drift-rtl{0%{transform:translate3d(108vw,0,0)}to{transform:translate3d(-18vw,0,0)}}@media (max-height:340px){:root{--home-ground-height:52px}}@media (prefers-reduced-motion:reduce){.cloud{animation-play-state:paused}}.screen{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:18px}.device{width:min(96vw,960px);aspect-ratio:16/9;border-radius:22px;overflow:hidden;position:relative;border:6px solid #20264e;background:#000;box-shadow:0 20px 60px rgba(0,0,0,.5)}.device-hint{margin-top:14px;color:#2a4a57;font-size:13px;text-align:center;max-width:760px}