@import "https://fonts.googleapis.com/css2?family=Amiri:wght@400;700&family=Noto+Naskh+Arabic:wght@400;700&family=Noto+Sans+Arabic:wght@400;700;800&display=swap";:root{color:#182019;font-synthesis:none;text-rendering:geometricprecision;-webkit-font-smoothing:antialiased;background:#f6f2e7;font-family:IBM Plex Sans,Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{background:#f6f2e7;min-width:320px;min-height:100vh;margin:0}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.56}a{color:inherit}.app-shell{--paper:#f6f2e7;--panel:#fffaf0;--ink:#162017;--muted:#66705f;--line:#1620172e;--ayah:#13966b;--voice:#367fc8;--theme:#c17622;--font:#8c5ad8;--translation:#0f9287;--ratio:#b45a2a;--render:#247d4c;--accent:#13966b;width:min(1180px,100% - 32px);color:var(--ink);margin:0 auto;padding:22px 0 54px}.topbar,.hero-minimal,.control-row,.preview-card,.job-panel,.font-proof button{border:1px solid var(--line);background:color-mix(in srgb, var(--panel) 92%, white 8%)}.topbar{border-radius:16px;justify-content:space-between;align-items:center;gap:14px;min-height:58px;padding:11px 13px;display:flex;box-shadow:0 1px #00000008}.ticket{border:1px solid var(--line);letter-spacing:.08em;border-radius:5px;margin-inline-end:9px;padding:5px 7px;font:800 .68rem/1 IBM Plex Mono,ui-monospace,monospace;display:inline-flex}.strap{letter-spacing:.2em;text-transform:uppercase;color:var(--muted);font:800 .68rem/1 IBM Plex Mono,ui-monospace,monospace}.health{border:1px solid var(--line);color:var(--muted);border-radius:999px;align-items:center;gap:7px;padding:7px 10px;font-size:.78rem;font-weight:900;display:inline-flex}.health i{background:#ce7a22;border-radius:50%;width:8px;height:8px;box-shadow:0 0 0 4px #ce7a221f}.health.online i{background:#13966b;box-shadow:0 0 0 4px #13966b1f}.hero-minimal{border-bottom:3px solid var(--ink);background:radial-gradient(circle at 12% 10%, #13966b29, transparent 18rem), radial-gradient(circle at 80% 20%, #c1762224, transparent 15rem), var(--panel);border-radius:18px;margin:12px 0;padding:20px}h1{letter-spacing:-.065em;margin:0 0 8px;font-family:Bricolage Grotesque,IBM Plex Sans,sans-serif;font-size:clamp(1.9rem,4.4vw,3.35rem);line-height:.9}.hero-minimal p{max-width:800px;color:var(--muted);margin:0;font-size:.96rem;line-height:1.5}.workspace{grid-template-columns:minmax(0,1.16fr) minmax(315px,.84fr);align-items:start;gap:12px;display:grid}.control-list{gap:10px;display:grid}.control-row{--stage:var(--accent);border-radius:16px;grid-template-columns:68px minmax(0,1fr) minmax(160px,.32fr);align-items:center;gap:18px;min-height:116px;padding:15px 16px 15px 23px;transition:transform .18s,box-shadow .18s,border-color .18s;display:grid;position:relative;overflow:hidden}.control-row:before{content:"";background:var(--stage);width:7px;position:absolute;inset:0 auto 0 0}.control-row:hover{border-color:color-mix(in srgb, var(--stage) 46%, var(--line));transform:translateY(-2px);box-shadow:0 14px 30px #1e281412}.stage-ayah{--stage:var(--ayah)}.stage-voice{--stage:var(--voice)}.stage-theme{--stage:var(--theme)}.stage-font{--stage:var(--font)}.stage-translation{--stage:var(--translation)}.stage-ratio{--stage:var(--ratio)}.stage-render{--stage:var(--render)}.index{color:var(--stage);letter-spacing:-.05em;font:850 3.2rem/.85 Bricolage Grotesque,IBM Plex Sans,sans-serif}.row-main{min-width:0}.row-main p{color:var(--muted);margin:8px 0 0;font-weight:650;line-height:1.35}.row-main b[lang=ar]{color:var(--ink);margin-inline-start:4px;font-size:1.08rem;line-height:1.7;display:inline-block}.field-label,label>span,.card-label{color:var(--muted);letter-spacing:.15em;text-transform:uppercase;margin-bottom:7px;font:850 .66rem/1 IBM Plex Mono,ui-monospace,monospace;display:block}input,select{border:1px solid var(--line);width:100%;color:var(--ink);background:#ffffff9e;border-radius:10px;outline:none;padding:10px 11px;font-weight:800}input:focus,select:focus{border-color:var(--stage,var(--accent));box-shadow:0 0 0 4px color-mix(in srgb, var(--stage,var(--accent)) 14%, transparent)}.mini-grid{grid-template-columns:1fr 1fr;gap:9px;display:grid}.start-button{color:#fff;background:var(--render);box-shadow:0 12px 24px color-mix(in srgb, var(--render) 24%, transparent);border:0;border-radius:12px;padding:13px 14px;font-weight:950}.font-proof{grid-template-columns:repeat(5,1fr);gap:8px;display:grid}.font-proof button{min-height:95px;color:var(--ink);text-align:start;border-radius:14px;padding:9px;transition:transform .18s,border-color .18s,background .18s}.font-proof button:hover{border-color:color-mix(in srgb, var(--font) 52%, var(--line));transform:translateY(-1px)}.font-proof button.selected{background:color-mix(in srgb, var(--font) 10%, var(--panel));border-color:color-mix(in srgb, var(--font) 60%, var(--line))}.font-proof span{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;font:850 .62rem/1.2 IBM Plex Mono,monospace;display:block}.font-proof strong{text-align:center;margin-top:8px;font-size:1.18rem;line-height:1.8;display:block}.status-stack{gap:12px;display:grid;position:sticky;top:12px}.preview-card,.job-panel{border-radius:18px;padding:16px}.reel-preview{text-align:center;color:#fff;background:linear-gradient(180deg, #0000000f, #000000a3), radial-gradient(circle at 48% 15%, color-mix(in srgb, var(--accent) 48%, transparent), transparent 42%), #07110d;border-radius:22px;align-content:center;place-items:center;gap:22px;min-height:330px;margin:12px 0;padding:28px 18px;transition:aspect-ratio .2s,background .2s;display:grid}.preview-card[data-render-theme=cinematic_mountain_fog] .reel-preview{--accent:#638f70;background:linear-gradient(#0a14122e,#020807b8),radial-gradient(circle at 42% 8%,#d7ddcd7a,#0000 35%),linear-gradient(145deg,#3a5848,#09120e 72%)}.preview-card[data-render-theme=emerald_field_guide] .reel-preview{--accent:#13966b;background:linear-gradient(#00000014,#000000a8),radial-gradient(circle at 55% 12%,#1db0768a,#0000 40%),#06120d}.preview-card[data-render-theme=amber_dawn_minimal] .reel-preview{--accent:#c17622;background:linear-gradient(#2b18051a,#0c0803b3),radial-gradient(circle at 50% 12%,#df953494,#0000 42%),linear-gradient(145deg,#3d2a12,#07130c 75%)}.preview-card[data-render-theme=forest_quiet] .reel-preview{--accent:#175f3b;background:linear-gradient(#00000014,#000000b8),radial-gradient(circle at 42% 20%,#1c603ab8,#0000 43%),#030a06}.preview-card[data-render-theme=mono_moon_slate] .reel-preview{--accent:#6f7b87;background:linear-gradient(#0000000d,#000000ab),radial-gradient(circle at 46% 12%,#b6c4cf66,#0000 39%),#091015}.reel-preview[data-aspect="9:16"]{aspect-ratio:9/16;width:min(100%,310px);max-height:520px;margin-inline:auto}.reel-preview[data-aspect="1:1"]{aspect-ratio:1;width:min(100%,360px);min-height:0;margin-inline:auto}.reel-preview[data-aspect="16:9"]{aspect-ratio:16/9;width:100%;min-height:0}.reel-preview strong{text-shadow:0 2px 22px #000000d1;font-size:clamp(1.75rem,5vw,2.8rem);line-height:1.9}.reel-preview p{color:#e8efe8;max-width:300px;margin:0;line-height:1.65}.compact-facts{flex-wrap:wrap;gap:7px;display:flex}.compact-facts span{border:1px solid color-mix(in srgb, var(--accent) 34%, var(--line));color:color-mix(in srgb, var(--accent) 75%, var(--ink));background:color-mix(in srgb, var(--accent) 9%, white);border-radius:999px;padding:6px 8px;font-size:.75rem;font-weight:850}.job-head{justify-content:space-between;align-items:start;gap:12px;margin-bottom:14px;display:flex}.job-head strong{letter-spacing:-.04em;font-size:1.4rem;line-height:1.05;display:block}.status-dot{text-transform:capitalize;border-radius:999px;padding:7px 10px;font-size:.72rem;font-weight:950}.status-dot.success{color:#084326;background:#b9f4cf}.status-dot.danger{color:#752014;background:#ffd0c8}.status-dot.active{color:#143d76;background:#cde5ff}.status-dot.queued{color:#744315;background:#ffe0ad}.progress-track{border:1px solid var(--line);background:#1620171a;border-radius:999px;height:12px;overflow:hidden}.progress-track span{border-radius:inherit;background:linear-gradient(90deg, var(--render), var(--theme));width:0%;height:100%;transition:width .42s;display:block}.job-panel>p{color:var(--muted);margin:8px 0 0;font-weight:750}.video-result{margin-top:16px}.video-result video{border:1px solid var(--line);background:#050807;border-radius:16px;width:100%;max-height:520px}.artifact-actions{flex-wrap:wrap;gap:8px;margin-top:8px;display:flex}.artifact-actions a{border:1px solid color-mix(in srgb, var(--accent) 40%, var(--line));color:color-mix(in srgb, var(--accent) 70%, var(--ink));border-radius:999px;padding:8px 10px;font-size:.82rem;font-weight:900;text-decoration:none;display:inline-flex}.technical{border-top:1px dashed var(--line);color:var(--muted);margin-top:12px;padding-top:10px}.technical summary{cursor:pointer;font-weight:900}dl{gap:8px;margin:10px 0 0;display:grid}dl div{grid-template-columns:78px 1fr;gap:10px;display:grid}dt{color:var(--muted);font-weight:900}dd{overflow-wrap:anywhere;color:var(--ink);margin:0}.error-box{color:#6d1b14;background:#fff1ee;border:1px solid #be222252;border-left:7px solid #be3b2f;border-radius:14px;grid-column:1/-1;padding:13px 14px}.error-box>span{letter-spacing:.14em;color:#a1271e;margin-bottom:6px;font:950 .68rem/1 IBM Plex Mono,monospace;display:block}.error-box strong{font-size:1.02rem;display:block}.error-box p{color:#7b332b;margin:6px 0 0;font-weight:700;line-height:1.4}.error-box details{margin-top:9px}.error-box summary{cursor:pointer;font-weight:900}.error-box pre{white-space:pre-wrap;color:#5d1d17;max-height:210px;overflow:auto}@media (width<=980px){.app-shell{width:min(100% - 22px,720px);padding-top:12px}.workspace{grid-template-columns:1fr}.status-stack{position:static}.font-proof{grid-template-columns:repeat(2,1fr)}.font-proof button:last-child{grid-column:1/-1}}@media (width<=880px){.control-row{grid-template-columns:54px 1fr;gap:13px;padding:14px 14px 14px 20px}.control-row:before{width:6px}.index{font-size:2.55rem}.mini-grid,.start-button{grid-column:2}.reel-preview{min-height:280px}}@media (width<=560px){.topbar{align-items:flex-start}.strap{letter-spacing:.12em;margin-top:6px;display:block}.health{font-size:.72rem}.hero-minimal{padding:16px}h1{font-size:2.1rem}.control-row{grid-template-columns:42px 1fr}.index{font-size:2.15rem}.mini-grid{grid-template-columns:1fr 1fr}.reel-preview strong{font-size:1.7rem}.font-proof{grid-template-columns:1fr}.font-proof button:last-child{grid-column:auto}}