:root{--page:#0d0d14;--raised:#16161f;--sunken:#08080d;--line:#26262f;--control:#626274;--ink:#eeeef3;--muted:#9a9aab;--indigo:#8f8ee6;--on-indigo:#15151f;--attention:#f59e5b;--sans:"IBM Plex Sans Arabic", "IBM Plex Sans", system-ui, -apple-system, "SF Arabic", "Geeza Pro", "Segoe UI", Tahoma, sans-serif;--mono:"IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*,:before,:after{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--page);color:var(--ink);font:400 15px/1.6 var(--sans);-webkit-text-size-adjust:100%}button,input,textarea,select{font:inherit;color:inherit}a{color:var(--indigo)}:focus-visible{outline:2px solid var(--indigo);outline-offset:2px}#app{height:100%;container:app/inline-size}[hidden]{display:none!important}.label{font:500 11px/16px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.muted{color:var(--muted);margin:0}.note{color:var(--muted);margin:0;font-size:13px;line-height:21px}.note.warn{color:var(--attention)}.stack-4{flex-direction:column;gap:4px;display:flex}.grow{flex:1;min-height:0}.icon{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;flex:none;width:20px;height:20px}[dir=rtl] .flip-rtl{transform:scaleX(-1)}.btn{border:1px solid var(--control);min-height:44px;color:var(--ink);cursor:pointer;white-space:nowrap;background:0 0;border-radius:4px;justify-content:center;align-items:center;gap:8px;padding:0 16px;font-size:14px;font-weight:500;text-decoration:none;display:inline-flex}.btn:hover{background:#1d1d28}.btn-primary{background:var(--indigo);border-color:var(--indigo);color:var(--on-indigo);font-weight:600}.btn-primary:hover{background:#a6a5ee}.btn-quiet{color:var(--muted);border-color:#0000}.btn-quiet:hover{color:var(--ink)}.btn-icon{width:44px;padding:0}.input{border:1px solid var(--control);background:var(--sunken);border-radius:4px;width:100%;min-height:44px;padding:0 12px}.input::placeholder,.script-area::placeholder{color:var(--muted)}.chips{flex-wrap:wrap;gap:8px;display:flex}.chip{border:1px solid var(--control);cursor:pointer;background:0 0;border-radius:999px;min-height:44px;padding:0 16px;font-size:14px;font-weight:500}.chip.on{background:var(--ink);border-color:var(--ink);color:#15151f}.seg{background:var(--sunken);border:1px solid var(--line);border-radius:8px;grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;gap:4px;padding:4px;display:grid}.seg-btn{min-height:40px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:4px;font-size:14px;font-weight:500}.seg-btn.on{background:var(--raised);color:var(--ink);box-shadow:inset 0 0 0 1px var(--control)}.shell{height:100%;display:flex}.side{border-inline-end:1px solid var(--line);flex-direction:column;flex:none;gap:32px;width:232px;padding:24px 16px;display:flex}.brand{flex-direction:column;gap:2px;padding:0 12px;display:flex}.brand-name{font:700 24px/28px var(--sans);letter-spacing:-.01em}.side-nav{flex-direction:column;gap:4px;display:flex}.nav-btn{min-height:44px;color:var(--muted);cursor:pointer;text-align:start;background:0 0;border:0;border-radius:4px;align-items:center;gap:12px;padding:0 12px;font-weight:500;text-decoration:none;display:flex}.nav-btn:hover{color:var(--ink)}.nav-btn.on{background:var(--raised);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}.nav-btn.off{opacity:.45;cursor:default}.lang-mark{text-align:center;width:20px;font-weight:600}.main{flex:1;min-width:0;min-height:0;overflow:auto}.lib{flex-direction:column;gap:24px;max-width:1200px;padding:40px 48px;display:flex}.lib-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;display:flex}.page-title{font:700 32px/38px var(--sans);letter-spacing:-.015em;margin:0}.lib-tools{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.lib-tools .input{flex:260px;width:auto}.grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:24px;display:grid}.card{border:1px solid var(--line);background:var(--raised);border-radius:8px;flex-direction:column;min-width:0;display:flex}.card:hover{border-color:var(--control)}.card-open{color:inherit;flex-direction:column;gap:12px;padding:16px 16px 8px;text-decoration:none;display:flex}.card-title{font-size:17px;font-weight:600;line-height:26px}.card-preview{color:var(--muted)}.clamp{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.card-foot{justify-content:space-between;align-items:center;gap:8px;padding:0 8px 4px 16px;display:flex}[dir=rtl] .card-foot{padding:0 16px 4px 8px}.card-actions{display:flex}.toasts{inset-inline:0;pointer-events:none;justify-content:center;padding:0 16px;display:flex;position:fixed;bottom:24px}.toast{pointer-events:auto;border:1px solid var(--control);background:var(--raised);border-radius:8px;align-items:center;gap:12px;max-width:100%;padding:4px 4px 4px 16px;display:flex;box-shadow:0 12px 32px #0009}[dir=rtl] .toast{padding:4px 16px 4px 4px}.editor{flex-direction:column;height:100%;display:flex}.ed-head{border-bottom:1px solid var(--line);flex-wrap:wrap;align-items:center;gap:8px 12px;padding:16px 32px;display:flex}.title-input{background:0 0;border-color:#0000;flex:200px;min-width:0;padding:0 8px;font-size:20px;font-weight:600}.title-input:hover{border-color:var(--line)}.tabs{margin:12px 16px 0;display:none}.ed-body{flex:1;min-height:0;display:flex}.ed-pane{flex-direction:column;flex:1;gap:12px;min-width:0;padding:24px 32px;display:flex}.ed-preview{border-inline-start:1px solid var(--line);background:var(--sunken);overflow:auto}.pe{border:1px solid var(--line);background:var(--sunken);white-space:pre-wrap;overflow-wrap:anywhere;min-height:240px;caret-color:var(--indigo);border-radius:8px;outline:none;flex:1;padding:20px 24px;font-size:19px;line-height:1.75;position:relative;overflow-y:auto}.pe:focus-visible{border-color:var(--indigo)}.pe-line{text-align:start;min-height:1.75em}.pe.is-empty:before{content:attr(data-placeholder);inset-inline-start:24px;color:var(--muted);pointer-events:none;position:absolute;top:20px}.dir-bar{flex-wrap:wrap;align-items:center;gap:8px 12px;display:flex}.dir-bar .seg{grid-auto-columns:minmax(64px,auto)}.dir-bar .seg-btn{min-height:36px;padding:0 12px}.preview-body{flex-direction:column;gap:16px;font-size:22px;font-weight:500;line-height:1.6;display:flex}.pv-para{unicode-bidi:isolate;margin:0}.pv-cue{color:var(--muted);font-size:15px;font-family:var(--mono)}.narrow-only{display:none}@container app (width<=1000px){.tabs{display:grid}.tab-off{display:none}.ed-preview{border-inline-start:0}.ed-pane{padding:16px 24px}.ed-head{padding:12px 16px}}@container app (width<=720px){.shell{flex-direction:column}.side{width:auto;padding:4px 8px calc(4px + env(safe-area-inset-bottom));border-inline-end:0;border-top:1px solid var(--line);flex-direction:row;order:2;gap:0}.brand,.side>.note{display:none}.side-nav{flex-direction:row;flex:1}.nav-btn{text-align:center;flex-direction:column;flex:1;justify-content:center;gap:2px;padding:6px 4px;font-size:12px;line-height:16px}.lib{gap:16px;padding:20px 16px}.page-title{font-size:28px;line-height:34px}.grid{grid-template-columns:minmax(0,1fr);gap:12px}.ed-pane{padding:12px 16px}.pe{padding:16px;font-size:17px}.pe.is-empty:before{inset-inline-start:16px;top:16px}.narrow-only{display:inline-flex}}.presenting .side{display:none}.icon-fill{fill:currentColor;stroke:none}.pr{z-index:50;--pr-bg:#000;--pr-ink:#fff;--pr-cue:#8a8a99;--pr-guide:#8f8ee6;--pr-bar:#0a0a10e0;--pr-bar-ink:#eeeef3;--pr-bar-line:#2c2c38;--pr-btn:#1d1d28;--pr-btn-line:#626274;background:var(--pr-bg);color:var(--pr-ink);position:fixed;inset:0;overflow:hidden}.pr[data-theme=light]{--pr-bg:#fff;--pr-ink:#000;--pr-cue:#5d5d6e;--pr-guide:#242287;--pr-bar:#ffffffeb;--pr-bar-ink:#15151f;--pr-bar-line:#d9d9e2;--pr-btn:#f0f0f5;--pr-btn-line:#7a7a8a}.pr-stage{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;cursor:grab;outline:none;position:absolute;inset:0;overflow:hidden}.pr-stage:active{cursor:grabbing}.pr-mirror,.pr-area{position:absolute;inset:0}.pr-col{will-change:transform;font-family:var(--sans);overflow-wrap:break-word;margin:0 auto;position:relative}.pr-para{text-align:start;unicode-bidi:isolate;margin:0 0 .6em}.pr-cue{color:var(--pr-cue);font-size:.55em;font-family:var(--mono)}.pr-tail{pointer-events:none}.pr-guide{pointer-events:none;height:0;position:absolute;inset-inline:0}.pr-guide:before{content:"";inset-inline:0;background:var(--pr-guide);opacity:.35;height:2px;position:absolute;top:-1px}.pr-guide-mark{border-block:14px solid #0000;width:0;height:0;position:absolute;top:-14px}.pr-guide-mark.start{border-left:18px solid var(--pr-guide);left:0}.pr-guide-mark.end{border-right:18px solid var(--pr-guide);right:0}.pr-empty{color:var(--pr-cue);place-items:center;margin:0;font-size:20px;display:grid;position:absolute;inset:0}.pr-meter{top:8px;z-index:3;color:#58c48c;font:500 12px/18px var(--mono);pointer-events:none;background:#0009;border-radius:4px;padding:2px 8px;position:absolute;inset-inline-start:8px}.pr-chrome{z-index:2;padding:12px max(16px, env(safe-area-inset-left));background:var(--pr-bar);color:var(--pr-bar-ink);flex-wrap:wrap;align-items:center;gap:8px 12px;transition:opacity .25s,visibility .25s;display:flex;position:absolute;inset-inline:0}.pr-top{border-bottom:1px solid var(--pr-bar-line);padding-top:max(12px, env(safe-area-inset-top));top:0}.pr-bottom{border-top:1px solid var(--pr-bar-line);padding-bottom:max(12px, env(safe-area-inset-bottom));justify-content:center;gap:12px 28px;bottom:0}.pr.chrome-hidden .pr-chrome{opacity:0;visibility:hidden}.pr-title{white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0;font-size:16px;font-weight:600;overflow:hidden}.pr-group{align-items:center;gap:10px;display:flex}.pr-btn{border:1px solid var(--pr-btn-line);background:var(--pr-btn);min-width:52px;height:52px;color:inherit;font:600 18px/1 var(--sans);cursor:pointer;touch-action:manipulation;border-radius:999px;justify-content:center;align-items:center;gap:8px;padding:0 12px;text-decoration:none;display:inline-flex}.pr-btn .icon{width:24px;height:24px}.pr-text{font-size:15px;font-weight:500}.pr-play{background:var(--pr-bar-ink);width:76px;height:76px;color:var(--pr-bar);border-color:var(--pr-bar-ink)}.pr-play .icon{width:32px;height:32px}.pr-a-small{font-size:15px}.pr-a-large{font-size:21px}.pr-speed{flex-direction:column;align-items:center;min-width:52px;display:flex}.pr-cap{font:500 10px/14px var(--mono);letter-spacing:.08em;text-transform:uppercase;opacity:.7}.pr-speed .pr-val{font:600 17px/22px var(--mono);color:inherit}.pr-drawer{z-index:4;width:min(380px,92vw);padding:max(16px, env(safe-area-inset-top)) 20px 32px;color:#eeeef3;background:#16161f;border-inline-start:1px solid #26262f;flex-direction:column;gap:20px;display:none;position:absolute;inset-block:0;inset-inline-end:0;overflow-y:auto;box-shadow:0 12px 32px #0009}.pr.drawer-open .pr-drawer{display:flex}.pr-drawer-head{justify-content:space-between;align-items:center;display:flex}.pr-drawer h2{margin:0;font-size:20px}.pr-sec{border-top:1px solid #26262f;flex-direction:column;gap:12px;padding-top:16px;display:flex}.pr-sec h3{font:500 11px/16px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0}.pr-row{flex-direction:column;gap:4px;display:flex}.pr-row-head{align-items:baseline;gap:8px;font-size:15px;display:flex}.pr-row-head>span:first-child{flex:1}.pr-val{font:400 14px/20px var(--mono);color:var(--muted);font-variant-numeric:tabular-nums}.pr-link{color:var(--indigo);cursor:pointer;background:0 0;border:0;padding:4px;font-size:14px}.pr-row-ctl{align-items:center;gap:8px;display:flex}.pr-step{border:1px solid var(--control);width:44px;height:44px;color:inherit;cursor:pointer;touch-action:manipulation;background:0 0;border-radius:8px;flex:none;font-size:20px}.pr-range{min-width:0;height:44px;accent-color:var(--indigo);flex:1;margin:0}.pr-check{cursor:pointer;align-items:center;gap:12px;min-height:44px;font-size:15px;display:flex}.pr-check input{width:22px;height:22px;accent-color:var(--indigo);margin:0}.pr-drawer .seg{grid-auto-columns:minmax(0,1fr)}.pr-drawer .seg-btn{min-height:44px}@media (max-width:700px){.pr-drawer{border-inline-start:0;border-top:1px solid #26262f;border-radius:16px 16px 0 0;width:auto;height:58%;inset-block:auto 0;inset-inline:0}.pr-hide-narrow{display:none}.pr-bottom{gap:10px 16px}.pr-btn{min-width:48px;height:48px}.pr-play{width:64px;height:64px}}.pr-preset{flex-direction:column;justify-content:center;align-items:center;gap:0;min-height:52px;display:flex}.pr-speed .pr-cap{white-space:nowrap}.pr.locked .pr-chrome{opacity:0;visibility:hidden}.pr-hint{z-index:5;color:#eeeef3;max-width:80%;font:500 16px/1.4 var(--sans);text-align:center;pointer-events:none;opacity:0;background:#16161feb;border-radius:12px;padding:12px 20px;transition:opacity .2s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.pr-hint.on{opacity:1}.pr-btn.armed{border-color:var(--attention);box-shadow:0 0 0 3px #f59e5b59}