.badge-app{max-width:1100px;margin:0 auto;padding:1.5rem 1rem 2rem;display:grid;grid-template-columns:360px 1fr;gap:1rem}@media(max-width:900px){.badge-app{grid-template-columns:1fr}}.badge-app .badge-preview-canvas{width:auto;max-width:100%;height:auto;display:block;margin:0 auto;border-radius:10px;border:1px solid var(--border, #2c3d52);background:#0b1220;touch-action:none}.badge-app .badge-preview-canvas.dragging{cursor:grabbing}.badge-app .field-grid.badge-fields{display:grid;grid-template-columns:1fr;gap:.75rem}.badge-app .badge-hint-small{font-size:.82rem;color:var(--muted, #94a8bf);margin-top:.25rem}.badge-typography-block{margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--border, #2c3d52)}.badge-subheading{margin:.65rem 0 .4rem;font-size:.95rem;font-weight:700;color:#dbeafe}.badge-mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:.55rem}.badge-line-typo-grid .badge-line-controls{display:flex;flex-wrap:wrap;align-items:center;gap:.45rem;margin-top:.2rem}.badge-line-typo-grid .badge-line-controls input[type=number]{flex:1 1 72px;min-width:64px}.badge-line-typo-grid .badge-line-controls select{flex:0 0 auto;min-width:92px;padding:.35rem .5rem;border-radius:8px;border:1px solid var(--border, #2c3d52);background:#0f172a;color:var(--text, #edf2f7);font-family:inherit}.badge-gap-sliders{display:flex;flex-direction:column;gap:.65rem}.badge-gap-sliders label{display:flex;flex-direction:column;gap:.25rem;font-size:.88rem}:root{--bg: #0f1419;--surface: #192534;--border: #2c3d52;--text: #edf2f7;--muted: #94a8bf;--accent: #3b82f6;--accent-hover: #2563eb;--radius: 12px;--font: "DinNextArabicCustom"}*{box-sizing:border-box}body{margin:0;background:linear-gradient(160deg,#0f1419,#152131,#0f1419);color:var(--text);font-family:var(--font)}.landing{min-height:100vh;width:100%;max-width:1100px;margin:0 auto;padding:2.4rem 1rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.9rem}.logo-mark{width:130px;height:130px;border-radius:50%;border:2px solid var(--border);background:radial-gradient(circle at 30% 20%,#27415d,#132131);display:flex;align-items:center;justify-content:center;font-weight:700;color:#dbeafe;letter-spacing:.2px;overflow:hidden}.logo-image{width:100%;height:100%;object-fit:cover}.landing-headline{margin:0;font-size:clamp(1.8rem,2.8vw,2.35rem);text-align:center}.landing-kicker{margin:0;color:#9ec5ff;font-size:.92rem;letter-spacing:.3px}.landing-subtitle{margin:0 0 .55rem;color:var(--muted);font-size:.98rem;text-align:center;max-width:620px;line-height:1.7}.service-grid{width:min(940px,100%);display:grid;grid-template-columns:repeat(2,minmax(250px,1fr));gap:.9rem}.service-widget{border:1px solid var(--border);border-radius:var(--radius);padding:1rem 1.1rem;background:linear-gradient(180deg,#1a2a3b,#17283a);color:var(--text);font-family:var(--font);text-align:right;cursor:pointer;transition:transform .16s ease,border-color .16s ease,background .16s ease;display:flex;align-items:center;justify-content:flex-start;gap:.55rem;min-height:64px}.service-widget:hover{transform:translateY(-2px);border-color:#4d6e92;background:#20344a}.service-name{font-size:1rem;font-weight:600;font-family:var(--font)}.service-icon{display:inline-flex;align-items:center;justify-content:center;color:#7dd3fc;font-size:.7rem;flex:0 0 auto}@media(max-width:740px){.service-grid{grid-template-columns:1fr}}.app{max-width:1100px;margin:0 auto;padding:1.5rem 1rem 2rem;display:grid;grid-template-columns:360px 1fr;gap:1rem}.app.app-profile-picture{direction:ltr;grid-template-columns:minmax(0,1fr) 360px}.app.app-profile-picture .preview{grid-column:1;direction:rtl;text-align:right}.app.app-profile-picture .controls{grid-column:2;direction:rtl;text-align:right}.app.app-profile-picture .controls label,.app.app-profile-picture .controls .hint,.app.app-profile-picture .controls h1,.app.app-profile-picture .controls .status{text-align:right}.app.app-profile-picture .controls select,.app.app-profile-picture .controls input,.app.app-profile-picture .controls option{direction:rtl;text-align:right}.app.app-profile-picture .preview-canvas{max-height:min(72vh,700px)}@media(max-width:900px){.app,.app.app-profile-picture{grid-template-columns:1fr}}.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1rem;min-width:0}.service-header{display:flex;align-items:start;justify-content:flex-start;gap:.8rem;flex-wrap:wrap}h1,h2{margin:0 0 .5rem}h1{font-size:1.3rem}h2{font-size:1.05rem}.hint{margin:0 0 1rem;color:var(--muted);font-size:.9rem}.removal-tip{margin:.2rem 0 0;color:var(--muted);font-size:.82rem;line-height:1.45}.removal-tip a{color:var(--accent)}.removal-tip a:hover{color:var(--accent-hover);text-decoration:underline}.field-grid{display:grid;grid-template-columns:1fr;gap:.8rem}.field-grid label,.sliders label{display:flex;flex-direction:column;gap:.35rem;font-size:.9rem}input[type=file],input[type=range],input[type=text],input[type=number],select{width:100%}input[type=text],input[type=number],select{border:1px solid var(--border);background:#0f1a29;color:var(--text);border-radius:8px;padding:.55rem .65rem;font:inherit}.sliders{margin-top:.9rem}.line-offsets{margin-top:.6rem;display:grid;grid-template-columns:1fr;gap:.45rem}.line-offsets span{display:inline-block;min-width:58px;text-align:center;padding:.1rem .35rem;border-radius:6px;background:#0f1a29;border:1px solid var(--border);color:#7dd3fc;font-size:.82rem}#line-gap-value,[id^=line-offset-value-]{display:inline-block;min-width:42px;text-align:center;padding:.1rem .35rem;border-radius:6px;background:#0f1a29;border:1px solid var(--border);color:#7dd3fc;font-size:.82rem}.actions{margin-top:1rem;display:flex;flex-wrap:wrap;gap:.6rem}.actions .btn{min-height:42px}#reset-btn{display:none}.btn{border:none;border-radius:10px;padding:.6rem 1rem;cursor:pointer;font:inherit}.btn.primary{background:var(--accent);color:#fff}.btn.primary:hover{background:var(--accent-hover)}.btn.secondary{background:#33485f;color:var(--text)}.btn.secondary:hover{background:#3d5773}.status{margin:.8rem 0 0;color:#7dd3fc;font-size:.9rem}.preview{display:flex;flex-direction:column}.preview-canvas{width:100%;max-height:calc(100vh - 220px);object-fit:contain;border:1px dashed var(--border);border-radius:10px;background:#0d1622;touch-action:none;cursor:grab}.preview-canvas.dragging{cursor:grabbing}.field-grid .span-2{grid-column:1 / -1}@media(min-width:640px){.email-signature-app .field-grid{grid-template-columns:1fr}}@media(max-width:900px){.app.app-profile-picture .preview,.app.app-profile-picture .controls{grid-column:1}.app.app-profile-picture .controls{order:1}.app.app-profile-picture .preview{order:2}}@media(max-width:700px){.app{padding:1rem .7rem 1.2rem;gap:.7rem}.panel{padding:.85rem}.service-header{gap:.55rem}h1{font-size:1.1rem}h2{font-size:.98rem}.hint{font-size:.84rem;margin-bottom:.75rem}.field-grid{gap:.6rem}.field-grid label,.sliders label{font-size:.86rem;gap:.3rem}input[type=text],input[type=number],select{padding:.52rem .58rem}.actions{flex-direction:column;gap:.5rem}.actions .btn{width:100%}.app.app-profile-picture .preview-canvas{max-height:56vh}}@media(max-width:460px){.app{padding:.8rem .55rem 1rem}.panel{padding:.75rem}.btn{padding:.58rem .8rem}.status{font-size:.84rem}.app.app-profile-picture .preview-canvas{max-height:50vh}}.sig-layout-section{margin-bottom:.75rem}.sig-subhead{margin:0 0 .5rem;font-size:1rem}.sig-tight-grid{gap:.55rem!important}.sig-slider-row{display:flex;align-items:center;gap:.5rem}.sig-slider-row input[type=range]{flex:1;min-width:0}.sig-slider-row--sm input[type=range]{max-width:100%}.sig-value{min-width:3.5rem;text-align:center;font-size:.82rem;color:#7dd3fc;flex-shrink:0}.sig-lines-details summary{cursor:pointer;margin:.65rem 0 .35rem;font-weight:600;color:var(--text)}.sig-per-line-grid{display:grid;gap:.65rem;margin:.35rem 0 .5rem}.sig-per-line-block{border:1px solid var(--border);border-radius:8px;padding:.5rem .55rem;display:grid;gap:.4rem;background:#0f1a29}.sig-per-line-label{font-size:.82rem;font-weight:600;color:var(--muted)}.sig-layout-actions{margin-top:.65rem}.email-sign-preview-viewport{overflow:auto;border:1px dashed var(--border);border-radius:10px;background:#0d1622;min-height:220px;max-height:min(70vh,560px)}.email-sign-preview-wrap{position:relative;width:100%;max-width:960px;margin:0 auto;padding:1rem;container-type:inline-size}.email-sign-preview-wrap--canvas{display:flex;justify-content:center;align-items:flex-start}.email-sign-preview-canvas{display:block;width:100%;max-width:960px;height:auto;image-rendering:auto;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none}.email-sign-preview-canvas.is-dragging-text{cursor:grabbing}.sig-weight-select{width:100%;margin-top:.25rem;border:1px solid var(--border);background:#0f1a29;color:var(--text);border-radius:8px;padding:.5rem .65rem;font:inherit}.email-sign-bg{display:block;width:100%;height:auto;vertical-align:middle}.email-sign-placeholder{padding:3rem 1rem;text-align:center;color:var(--muted)}.email-sign-text-layer{position:absolute;display:flex;flex-direction:column;font-family:var(--font);pointer-events:none;line-height:1.2}.sig-ar-name{font-weight:700;color:#182544}.sig-en-name{font-weight:400;color:#182544}.sig-ar-title{font-weight:700;color:#e85d32}.sig-en-title{font-weight:400;color:#e85d32}.sig-phone{font-weight:400;color:#182544;margin-top:.12em}.inline-code{font-family:ui-monospace,monospace;font-size:.85em;background:#0f1a29;padding:.1em .35em;border-radius:4px;border:1px solid var(--border)}.phone-preview{display:block;margin-top:.35rem;color:#7dd3fc;font-size:.95rem}
