.spb{--spb-bg: #f3f6fa;--spb-surface: #ffffff;--spb-surface-2: #f7f9fc;--spb-line: #dce4ed;--spb-text: #172230;--spb-muted: #647487;--spb-brand: #147ea8;--spb-brand-2: #0d5e80;--spb-brand-soft: #e2f2f8;--spb-orange: #ef8b3d;display:block;min-height:calc(100vh - 5rem);padding:18px 0 48px;color:var(--spb-text);background:var(--spb-bg);font-family:Tajawal,IBM Plex Sans Arabic,system-ui,sans-serif}html.dark .spb{--spb-bg: #0d141d;--spb-surface: #151f2b;--spb-surface-2: #1b2836;--spb-line: #2c3a49;--spb-text: #f0f5f9;--spb-muted: #aab8c5;--spb-brand: #48b7df;--spb-brand-2: #83d6f1;--spb-brand-soft: #123546;--spb-orange: #f1a15c}.spb *,.spb *:before,.spb *:after{box-sizing:border-box}.spb__hero,.spb__layout{width:min(1240px,calc(100% - 32px));margin-inline:auto}.spb__hero{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;padding:20px 0 26px}.spb__hero-copy{min-width:0}.spb__eyebrow,.spb-kicker{color:var(--spb-brand);font-size:11px;font-weight:800;letter-spacing:.08em}.spb__eyebrow{display:inline-flex;align-items:center;gap:8px;direction:ltr}.spb__dot,.spb-live i{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--spb-orange);box-shadow:0 0 0 4px color-mix(in srgb,var(--spb-orange) 15%,transparent)}.spb h1,.spb h2,.spb p{margin:0}.spb__hero h1{margin-top:8px;font-size:clamp(25px,3vw,38px);line-height:1.2;letter-spacing:-.04em}.spb__hero p{max-width:690px;margin-top:10px;color:var(--spb-muted);font-size:15px;line-height:1.9}.spb__badges{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}.spb__badges span{border:1px solid var(--spb-line);border-radius:999px;padding:5px 10px;color:var(--spb-muted);background:var(--spb-surface);font-size:11px;font-weight:700}.spb__hero-actions{display:flex;flex:none;gap:8px}.spb__layout{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:20px;align-items:start}.spb-card{min-width:0;border:1px solid var(--spb-line);border-radius:18px;background:var(--spb-surface);box-shadow:0 10px 30px #182f4412;overflow:hidden}.spb-card__head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:21px 22px 17px;border-bottom:1px solid var(--spb-line)}.spb-card__head h2{margin-top:4px;font-size:20px;line-height:1.35}.spb-progress,.spb-live{flex:none;color:var(--spb-muted);font-size:11px;font-weight:700}.spb-live{display:inline-flex;align-items:center;gap:8px;padding-top:5px}.spb-live i{width:6px;height:6px;box-shadow:none;background:#28b884}.spb-form{padding-bottom:20px}.spb-fields{display:grid;grid-template-columns:1fr 1fr;gap:13px;padding:0 22px}.spb-field{display:grid;gap:6px;min-width:0;margin-top:16px}.spb-field--wide{grid-column:1 / -1}.spb-field span{color:var(--spb-text);font-size:13px;font-weight:700}.spb-field input,.spb-field textarea{width:100%;border:1px solid var(--spb-line);border-radius:10px;outline:none;color:var(--spb-text);background:var(--spb-surface-2);font:inherit;font-size:14px;line-height:1.75;padding:10px 12px;transition:border-color .16s,box-shadow .16s}.spb-field input{min-height:44px}.spb-field textarea{min-height:86px;resize:vertical}.spb-field input::-moz-placeholder,.spb-field textarea::-moz-placeholder{color:var(--spb-muted);opacity:.78}.spb-field input::placeholder,.spb-field textarea::placeholder{color:var(--spb-muted);opacity:.78}.spb-field input:focus,.spb-field textarea:focus{border-color:var(--spb-brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--spb-brand) 17%,transparent)}.spb-ltr{direction:ltr;text-align:left;font-family:ui-monospace,SFMono-Regular,monospace!important;font-size:13px!important}.spb-section-divider{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 12px;margin:24px 22px 0;padding-top:18px;border-top:1px solid var(--spb-line)}.spb-section-divider span{color:var(--spb-text);font-size:13px;font-weight:800}.spb-section-divider small{color:var(--spb-muted);font-size:11px}.spb-fields--tracking{grid-template-columns:1fr 1fr}.spb-hint{margin:14px 22px 0;color:var(--spb-muted);font-size:12px;line-height:1.75}.spb-saved{margin:20px 22px 0;padding-top:16px;border-top:1px solid var(--spb-line)}.spb-saved__title{color:var(--spb-muted);font-size:12px;font-weight:800}.spb-saved__list{display:flex;flex-wrap:wrap;gap:7px;margin-top:9px}.spb-saved__item{display:inline-flex;overflow:hidden;border:1px solid var(--spb-line);border-radius:999px;background:var(--spb-surface-2)}.spb-saved__item button{border:0;color:var(--spb-text);background:transparent;cursor:pointer;font:inherit;font-size:12px;padding:7px 11px}.spb-saved__item button+button{border-inline-start:1px solid var(--spb-line);color:var(--spb-muted)}.spb-btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px;border:1px solid transparent;border-radius:10px;cursor:pointer;font:inherit;font-size:13px;font-weight:800;padding:8px 15px;transition:transform .16s,background .16s,border-color .16s}.spb-btn:hover{transform:translateY(-1px)}.spb-btn:active{transform:scale(.98)}.spb-btn--primary{border-color:var(--spb-brand);color:#fff;background:var(--spb-brand)}.spb-btn--primary:hover{background:var(--spb-brand-2)}.spb-btn--ghost{border-color:var(--spb-line);color:var(--spb-text);background:var(--spb-surface)}.spb-btn--ghost:hover{border-color:var(--spb-brand);color:var(--spb-brand)}.spb-output{position:sticky;top:84px}.spb-tabs{display:flex;gap:5px;padding:12px 17px 0;border-bottom:1px solid var(--spb-line)}.spb-tabs button{border:0;border-bottom:3px solid transparent;border-radius:8px 8px 0 0;color:var(--spb-muted);background:transparent;cursor:pointer;font:inherit;font-size:13px;font-weight:800;padding:8px 13px 10px}.spb-tabs button:hover{color:var(--spb-text)}.spb-tabs button.is-active{border-bottom-color:var(--spb-brand);color:var(--spb-brand);background:var(--spb-brand-soft)}.spb-output__body{height:460px;padding:0;background:#0b1118}.spb-output__body pre{height:100%;margin:0;overflow:auto;padding:20px 22px;color:#dbe8f2;direction:ltr;text-align:left;white-space:pre-wrap;word-break:break-word;font:12px/1.9 ui-monospace,SFMono-Regular,Consolas,monospace;scrollbar-gutter:stable}.spb-output__actions{display:flex;gap:8px;padding:13px 17px;border-top:1px solid var(--spb-line)}.spb-output__actions .spb-btn--primary{flex:1}.spb-output__note{padding:0 18px 18px;color:var(--spb-muted);font-size:12px;line-height:1.8}.spb-output__note code{border-radius:4px;color:var(--spb-brand);background:var(--spb-brand-soft);padding:1px 4px;direction:ltr}.spb-toast{position:fixed;z-index:80;inset-inline-start:50%;bottom:28px;transform:translate(50%);border:1px solid var(--spb-line);border-radius:10px;color:var(--spb-text);background:var(--spb-surface);box-shadow:0 10px 30px #0000002e;font-size:13px;font-weight:800;padding:10px 18px}@media(max-width:1050px){.spb__layout{grid-template-columns:1fr}.spb-output{position:static;order:-1}}@media(max-width:640px){.spb{padding-top:8px}.spb__hero,.spb__layout{width:min(100% - 20px,1240px)}.spb__hero{display:block;padding:16px 0 18px}.spb__hero h1{font-size:26px}.spb__hero-actions{margin-top:16px}.spb__hero-actions .spb-btn{flex:1}.spb-card__head{padding:17px 15px 14px}.spb-fields{grid-template-columns:1fr;gap:0;padding-inline:15px}.spb-field--wide{grid-column:auto}.spb-section-divider,.spb-hint,.spb-saved{margin-inline:15px}.spb-tabs{padding-inline:9px;overflow-x:auto}.spb-tabs button{flex:1;white-space:nowrap;padding-inline:8px}.spb-output__body{height:390px}.spb-output__body pre{padding:15px;font-size:11px}.spb-output__actions{padding:11px 12px}}