:root {
  --navy: #0b2447; --navy-2: #153b6b; --blue: #176bdb; --cyan: #35a7ff;
  --ink: #172033; --muted: #697386; --line: #dde3ec; --soft: #f4f7fb;
  --white: #fff; --success: #16865b; --warning: #c57816; --danger: #d53d4c;
  --sidebar: 420px; --header-h: 98px; --radius: 12px;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  color: var(--ink); background: #e8edf4; font-synthesis: none;
}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { margin: 0; min-height: 100%; }
body { min-width: 320px; background: #e8edf4; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }
button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible, [tabindex]:focus-visible { outline: 3px solid rgba(23,107,219,.28); outline-offset: 2px; }
.skip-link { position: fixed; left: 12px; top: -50px; z-index: 99; padding: 10px 16px; border-radius: 8px; color: #fff; background: var(--blue); }
.skip-link:focus { top: 12px; }
.app-shell { min-height: 100vh; display: flex; flex-direction: column; }
.app-header { height: var(--header-h); padding: 14px 26px 10px; display: grid; grid-template-columns: 1fr auto; gap: 6px 20px; background: #fff; border-bottom: 1px solid var(--line); position: relative; z-index: 20; }
.brand-lockup { display: flex; align-items: center; gap: 13px; min-width: 0; }
.brand-mark { width: 42px; height: 42px; flex: 0 0 42px; display: grid; place-items: center; color: #fff; background: linear-gradient(145deg,var(--navy),var(--blue)); border-radius: 11px; font-weight: 900; font-size: 22px; box-shadow: 0 7px 18px rgba(11,36,71,.2); }
.title-row { display: flex; align-items: center; gap: 14px; }
.title-row h1 { font-size: 18px; line-height: 1; margin: 0; letter-spacing: -.25px; color: var(--navy); }
.title-row h1 span { font-weight: 500; color: #627086; }
.brand-lockup p { margin: 5px 0 0; color: var(--muted); font-size: 12px; }
.badges { display: flex; gap: 5px; }
.badges span { padding: 3px 7px; color: var(--blue); background: #eef6ff; border: 1px solid #cfe5ff; border-radius: 99px; font-size: 9px; font-weight: 800; letter-spacing: .04em; }
.header-actions { display: flex; align-items: center; justify-content: flex-end; gap: 16px; }
.language-select { display: flex; align-items: center; gap: 7px; font-size: 11px; font-weight: 700; color: var(--muted); }
.language-select select { border: 1px solid var(--line); border-radius: 8px; padding: 7px 24px 7px 8px; background: #fff; font-weight: 800; color: var(--navy); }
.legal-note { grid-column: 1/-1; margin: 0 0 0 55px; padding-top: 7px; border-top: 1px solid #edf0f5; color: #778196; font-size: 10px; line-height: 1.25; }
.workspace { display: grid; grid-template-columns: var(--sidebar) minmax(0,1fr); height: calc(100vh - var(--header-h) - 35px); min-height: 620px; }
.sidebar { overflow-y: auto; background: #fff; border-right: 1px solid var(--line); scrollbar-width: thin; }
.project-bar { min-height: 62px; padding: 12px 18px; display: flex; align-items: center; gap: 8px; border-bottom: 1px solid var(--line); }
.project-bar > div { min-width: 0; margin-right: auto; }
.project-bar strong { display:block; margin-top: 3px; max-width: 275px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size: 13px; }
.eyebrow, .step { font-size: 9px; letter-spacing: .11em; color: #8290a5; font-weight: 800; }
.small-icon, .icon-btn { width: 34px; height: 34px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: #526176; font-weight: 700; }
.small-icon:hover, .icon-btn:hover { color: var(--blue); border-color: #a9c9ef; background: #f5faff; }
.tabs { height: 65px; display: grid; grid-template-columns: repeat(6, 1fr); border-bottom: 1px solid var(--line); padding: 0 8px; position: sticky; top: 0; background: #fff; z-index: 5; }
.tab { position: relative; border: 0; background: transparent; display: flex; flex-direction: column; gap: 4px; align-items:center; justify-content:center; padding: 8px 2px; color: #7a8598; font-size: 9px; font-weight: 700; }
.tab span { font-size: 8px; color: #a2adbd; }
.tab.active { color: var(--blue); }
.tab.active::after { content:""; position:absolute; left:7px; right:7px; bottom:0; height:3px; border-radius:4px 4px 0 0; background:var(--blue); }
.tab-panel { display:none; padding: 20px 20px 8px; }
.tab-panel.active { display:block; }
.section-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; }
.section-heading.divider { margin-top: 25px; padding-top: 22px; border-top:1px solid #e8ecf2; }
.section-heading h2 { margin:3px 0 0; font-size:15px; color: var(--navy); letter-spacing:-.15px; }
.count { font-size:10px; padding:4px 8px; background:#eff4fa; color:#6b778b; border-radius:99px; }
.model-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; margin-bottom:18px; }
.model-card { border:1px solid var(--line); border-radius:9px; padding:10px; background:#fff; text-align:left; min-height:72px; position:relative; }
.model-card:hover { border-color:#9fc3ef; }
.model-card.active { border-color:var(--blue); box-shadow:0 0 0 2px rgba(23,107,219,.1); background:#f8fbff; }
.model-card strong { display:block; font-size:11px; color:var(--navy); margin-bottom:4px; padding-right:15px; }
.model-card small { display:block; color:#7a8494; line-height:1.25; font-size:9px; }
.model-card i { position:absolute; right:8px; top:8px; width:14px; height:14px; border:1px solid #cad2df; border-radius:50%; }
.model-card.active i { border:4px solid var(--blue); }
.field-group { position:relative; margin-bottom:13px; }
.field-group > label, .field-group > label:first-child { display:flex; justify-content:space-between; margin-bottom:6px; color:#344158; font-size:10px; font-weight:750; }
.optional { color:#9aa3b2; font-size:9px; font-weight:500; }
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]), textarea, select { width:100%; min-height:38px; padding:9px 11px; border:1px solid #d8dee8; border-radius:8px; background:#fff; color:var(--ink); font-size:11px; transition:.15s; }
textarea { resize:vertical; line-height:1.45; }
input:hover, textarea:hover, select:hover { border-color:#b7c2d2; }
input:focus, textarea:focus, select:focus { border-color:var(--blue); }
input.invalid, select.invalid { border-color:var(--danger)!important; background:#fffafa!important; }
.field-status { position:absolute; right:10px; top:29px; color:var(--success); font-weight:900; display:none; }
.required-field.valid .field-status { display:block; }
.required-field.valid input { padding-right:30px!important; }
.two-cols { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.hint { margin:5px 0 0; color:#7d8798; font-size:9px; line-height:1.45; }
.hint:not([hidden]) { display:block; }
.check-grid { display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.check-grid label, .check-stack label { display:flex; align-items:flex-start; gap:8px; padding:8px; border:1px solid #e2e6ed; border-radius:7px; font-size:9.5px; color:#465268; cursor:pointer; }
input[type="checkbox"], input[type="radio"] { accent-color:var(--blue); }
.conditional { display:none; }
.conditional.visible { display:grid; }
.radio-stack { display:grid; gap:7px; }
.radio-option { display:flex; align-items:flex-start; gap:9px; padding:10px; border:1px solid var(--line); border-radius:8px; cursor:pointer; }
.radio-option:has(input:checked) { border-color:var(--blue); background:#f6faff; }
.radio-option div { font-size:10px; line-height:1.35; }
.radio-option strong { display:block; color:#29364b; margin-bottom:2px; }
.radio-option small { color:#7b8799; }
.info-dot { width:22px; height:22px; border:1px solid #b7c8df; border-radius:50%; color:var(--blue); background:#f3f8ff; font:700 11px Georgia,serif; }
.notice { display:flex; gap:9px; padding:10px; border-radius:8px; font-size:9px; line-height:1.4; }
.notice.warning { color:#75521e; background:#fff8e9; border:1px solid #f4dfb9; }
.notice span { width:18px; height:18px; display:grid; place-items:center; flex:none; border-radius:50%; background:#f3d18d; font-weight:800; }
.notice p { margin:0; }
.toggle-card { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px; border:1px solid var(--line); border-radius:9px; margin-bottom:12px; }
.toggle-card strong { display:block; color:#354156; font-size:10.5px; }
.toggle-card small { display:block; margin-top:3px; color:#7c8798; font-size:9px; }
.switch-control { display:flex; align-items:center; gap:8px; font-size:11px; font-weight:700; white-space:nowrap; }
.switch-control input { position:absolute; opacity:0; pointer-events:none; }
.switch-control i { width:34px; height:19px; position:relative; display:block; border-radius:99px; background:#bdc6d2; transition:.2s; }
.switch-control i::after { content:""; width:15px; height:15px; position:absolute; left:2px; top:2px; background:#fff; border-radius:50%; box-shadow:0 1px 4px #687488; transition:.2s; }
.switch-control input:checked + i { background:var(--blue); }
.switch-control input:checked + i::after { transform:translateX(15px); }
.nested-fields { padding:12px; background:#f7f9fc; border-radius:9px; margin-bottom:12px; }
.nested-fields.visible { display:block; }
.input-action { display:flex; }
.input-action input { border-radius:8px 0 0 8px!important; }
.input-action button { flex:none; border:0; padding:0 10px; border-radius:0 8px 8px 0; background:var(--blue); color:#fff; font-size:9px; font-weight:700; }
.error-text { display:block; color:var(--danger); font-size:9px; margin-top:4px; min-height:12px; }
.link-btn { border:0; padding:3px 0; background:transparent; color:var(--blue); font-size:9px; font-weight:700; text-align:left; }
.link-btn.danger { color:var(--danger); }
body:not(.advanced) .advanced-section { display:none!important; }
.design-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; margin-bottom:16px; }
.design-option { border:1px solid var(--line); border-radius:8px; padding:7px; background:#fff; text-align:left; }
.design-option.active { border-color:var(--blue); box-shadow:0 0 0 2px rgba(23,107,219,.1); }
.design-swatch { height:45px; border-radius:5px; display:grid; place-items:center; font-weight:900; font-size:7px; letter-spacing:.05em; margin-bottom:6px; }
.design-option strong { font-size:9px; color:#344158; }
.color-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:7px; margin-bottom:13px; }
.color-grid label { font-size:8px; color:#6f7a8d; text-align:center; }
input[type="color"] { display:block; width:100%; height:35px; margin-top:5px; padding:2px; border:1px solid var(--line); background:#fff; border-radius:7px; }
input[type="range"] { width:100%; accent-color:var(--blue); }
output { color:var(--blue); font-size:9px; margin-left:auto; }
.secondary-btn, .primary-btn { min-height:38px; padding:8px 13px; border-radius:8px; font-size:10px; font-weight:750; }
.secondary-btn { border:1px solid #ccd5e1; background:#fff; color:#3c4b61; }
.primary-btn { border:1px solid var(--blue); background:var(--blue); color:#fff; box-shadow:0 5px 14px rgba(23,107,219,.18); }
.secondary-btn:hover { border-color:var(--blue); color:var(--blue); }
.primary-btn:hover { background:#0d5fc8; }
.full { width:100%; }
.upload-zone { padding:18px; border:1px dashed #b9c5d5; border-radius:9px; text-align:center; background:#fafcff; }
.upload-zone button { border:0; color:var(--blue); background:transparent; font-size:10px; font-weight:800; }
.upload-zone small { display:block; margin-top:5px; color:#8b95a5; font-size:8px; }
.segmented { display:grid; grid-template-columns:1fr 1fr; padding:3px; margin-bottom:16px; background:#edf1f6; border-radius:9px; }
.segmented input { position:absolute; opacity:0; }
.segmented label { padding:9px; border-radius:7px; font-size:10px; text-align:center; cursor:pointer; }
.segmented input:checked + label { background:#fff; color:var(--blue); box-shadow:0 2px 7px rgba(25,45,75,.12); font-weight:700; }
.size-summary { display:flex; align-items:center; gap:14px; padding:14px; margin-top:10px; background:#f5f8fc; border-radius:9px; }
.size-summary > span { width:42px; height:59px; border:2px solid var(--blue); background:#fff; border-radius:2px; box-shadow:0 3px 8px #ccd5e2; }
.size-summary small { font-size:8px; color:#7d8798; }
.size-summary strong { display:block; margin-top:3px; font-size:12px; color:var(--navy); }
.size-summary p { margin:3px 0 0; font-size:8px; color:#8c95a4; }
.check-stack { display:grid; gap:8px; }
.check-stack label { align-items:center; padding:11px; }
.check-stack strong { display:block; font-size:10px; }
.check-stack small { display:block; margin-top:2px; color:#8490a1; font-size:8px; }
.action-list { display:grid; gap:7px; }
.action-list > button { display:flex; align-items:center; gap:11px; padding:10px; border:1px solid var(--line); border-radius:8px; background:#fff; text-align:left; }
.action-list > button > span { width:31px; height:31px; display:grid; place-items:center; background:#edf5ff; color:var(--blue); border-radius:7px; }
.action-list strong { display:block; font-size:10px; }
.action-list small { display:block; margin-top:2px; color:#8791a1; font-size:8px; }
.action-list .danger > span, .action-list .danger strong { color:var(--danger); }
.saved-projects { margin-top:10px; border:1px solid var(--line); border-radius:8px; overflow:hidden; }
.saved-projects button { width:100%; padding:9px; border:0; border-bottom:1px solid var(--line); background:#fff; text-align:left; font-size:9px; }
.saved-projects button:last-child { border:0; }
.two-button { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.export-cards { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.export-cards button { padding:14px 9px; border:1px solid var(--line); border-radius:9px; background:#fff; text-align:left; }
.export-cards b { display:block; color:var(--blue); font-size:12px; }
.export-cards span { display:block; color:#8490a1; font-size:8px; margin-top:4px; }
.compliance-card { margin:15px; padding:14px; border:1px solid var(--line); border-radius:10px; background:#fbfcfe; }
.compliance-head { display:flex; justify-content:space-between; gap:10px; }
.compliance-head h2 { margin:3px 0; font-size:13px; }
.status { align-self:center; padding:4px 8px; border-radius:99px; font-size:8px; font-weight:800; }
.status.incomplete { color:#a72c38; background:#ffedef; }.status.review { color:#946116; background:#fff2d8; }.status.complete { color:#126e4d; background:#dff6ec; }
.progress { height:5px; margin:10px 0; background:#e7ebf0; border-radius:9px; overflow:hidden; }.progress i { display:block; width:0; height:100%; background:var(--danger); transition:.25s; }
.compliance-card ul { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.compliance-card li { font-size:8.5px; color:#7f8999; }.compliance-card li::before { content:"○"; margin-right:5px; }.compliance-card li.done { color:#236e53; }.compliance-card li.done::before { content:"✓"; font-weight:900; }
.compliance-card > p { margin:10px 0 0; padding-top:9px; border-top:1px solid #e7ebf0; font-size:8px; line-height:1.4; color:#7e8898; }
.preview-area { min-width:0; display:grid; grid-template-rows:auto auto minmax(0,1fr) auto; background:#edf1f6; }
.preview-toolbar { height:54px; display:flex; align-items:center; justify-content:space-between; padding:0 20px; background:#f8fafc; border-bottom:1px solid #d9e0e9; }
.preview-toolbar > div:first-child { display:flex; align-items:center; gap:8px; font-size:11px; }.preview-toolbar strong { color:#354258; }.preview-toolbar #previewMeta { padding-left:9px; border-left:1px solid #d4dbe5; color:#8490a0; font-size:9px; }
.live-dot { width:7px; height:7px; border-radius:50%; background:#27a871; box-shadow:0 0 0 4px rgba(39,168,113,.12); }
.preview-tools { display:flex; align-items:center; gap:8px; }.zoom-group { display:flex; padding:3px; border:1px solid #d8dfe8; border-radius:8px; background:#fff; }.zoom-group button { padding:5px 8px; border:0; border-radius:5px; color:#748094; background:transparent; font-size:8px; }.zoom-group button.active { color:var(--blue); background:#edf5ff; font-weight:800; }
.validation-banner { display:flex; align-items:center; gap:10px; margin:10px 18px 0; padding:9px 12px; border:1px solid #f1d39e; border-radius:9px; color:#795418; background:#fff9ec; }.validation-banner > span { width:22px; height:22px; display:grid; place-items:center; border-radius:50%; background:#f4d28e; font-weight:900; }.validation-banner p { margin:0; display:flex; flex-direction:column; font-size:9px; }.validation-banner small { margin-top:2px; color:#9a7b47; font-size:8px; }.validation-banner button { margin-left:auto; border:0; background:transparent; color:#9b6110; font-size:8px; font-weight:800; }
.validation-banner.complete { border-color:#bde3d4; background:#f0fbf7; color:#187555; }.validation-banner.complete > span { background:#cceee1; }.validation-banner.complete small { color:#59917d; }
.canvas-stage { position:relative; min-height:0; overflow:auto; display:grid; place-items:center; padding:38px 48px 45px; background-color:#e5eaf1; background-image:linear-gradient(rgba(255,255,255,.38) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.38) 1px,transparent 1px); background-size:20px 20px; }
.ruler { position:absolute; z-index:0; opacity:.45; }.ruler-x { top:0; left:30px; right:0; height:18px; border-bottom:1px solid #bbc5d2; background:repeating-linear-gradient(90deg,transparent 0 9px,#9aa7b9 10px 10px); }.ruler-y { top:18px; left:12px; bottom:0; width:18px; border-right:1px solid #bbc5d2; background:repeating-linear-gradient(0deg,transparent 0 9px,#9aa7b9 10px 10px); }
.panel-scale { transform-origin:top left; transition:transform .2s; }
.sign-panel { --sign-primary:#0b3265; --sign-secondary:#1f78d1; --sign-text:#142033; --sign-bg:#fff; --sign-border:4px; --sign-radius:6px; --sign-title:38px; --sign-body:14px; --sign-qr:116px; width:560px; height:792px; position:relative; display:flex; flex-direction:column; overflow:hidden; background:var(--sign-bg); color:var(--sign-text); border:var(--sign-border) solid var(--sign-primary); border-radius:var(--sign-radius); box-shadow:0 12px 35px rgba(34,53,79,.22); container-type:size; print-color-adjust:exact; -webkit-print-color-adjust:exact; }
.sign-accent { height:16px; flex:none; background:linear-gradient(90deg,var(--sign-primary) 0 72%,var(--sign-secondary) 72%); }
.sign-header { padding:35px 38px 23px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:18px; }
.camera-icon { width:120px; height:82px; color:var(--sign-primary); display:grid; place-items:center; }.camera-icon svg { width:100%; height:100%; overflow:visible; }
.sign-title-wrap { width:100%; }.sign-kicker { margin:0 0 9px; color:var(--sign-secondary); font-size:calc(var(--sign-body) * .72); font-weight:900; letter-spacing:.15em; }.sign-header h2 { margin:0; color:var(--sign-primary); font-size:var(--sign-title); line-height:.96; letter-spacing:-.025em; font-weight:900; }.sign-header #signIntro { max-width:430px; margin:15px auto 0; font-size:var(--sign-body); line-height:1.45; color:#536176; }
.sign-content { min-height:0; flex:1; display:grid; grid-template-columns:minmax(0,1fr) 146px; gap:25px; margin:0 34px; padding:23px 4px; border-top:2px solid rgba(53,78,110,.16); }
.sign-details { min-width:0; display:flex; flex-direction:column; justify-content:center; gap:15px; }.sign-field { overflow-wrap:anywhere; }.sign-field > span, .sign-footer span { display:block; margin-bottom:4px; color:var(--sign-secondary); font-size:calc(var(--sign-body) * .66); font-weight:900; letter-spacing:.11em; }.sign-field strong { font-size:calc(var(--sign-body) * 1.12); color:var(--sign-primary); }.sign-field p { margin:0; color:var(--sign-text); font-size:var(--sign-body); line-height:1.36; }.sign-field small { display:block; margin-top:2px; font-size:calc(var(--sign-body) * .74); color:#68768b; }.conditional-sign { display:none; }.conditional-sign.visible { display:block; }
.qr-block { align-self:center; display:flex; flex-direction:column; align-items:center; gap:11px; text-align:center; min-width:0; }.qr-code { width:var(--sign-qr); height:var(--sign-qr); display:grid; place-items:center; padding:7px; background:#fff; border:1px solid #d6dde7; border-radius:5px; }.qr-code img, .qr-code canvas { width:100%!important; height:100%!important; }.qr-block strong { display:block; color:var(--sign-primary); font-size:calc(var(--sign-body) * .68); line-height:1.15; }.qr-block p { margin:5px 0; color:#5f6b7f; font-size:calc(var(--sign-body) * .62); line-height:1.3; }.qr-block small { display:block; max-width:135px; color:var(--sign-secondary); font-size:calc(var(--sign-body) * .57); overflow-wrap:anywhere; }
.sign-footer { min-height:84px; padding:15px 38px; display:flex; align-items:center; justify-content:space-between; gap:18px; background:var(--sign-primary); color:#fff; }.sign-footer span { color:#b9d9f5; }.sign-footer strong { font-size:calc(var(--sign-body) * .92); }.sign-footer small { display:block; margin-top:2px; font-size:calc(var(--sign-body) * .66); color:#dbe5f2; }.sign-footer > p { margin:0; text-align:right; color:#d5dfeb; font-size:calc(var(--sign-body) * .57); }.sign-footer b { color:#fff; font-size:calc(var(--sign-body) * .76); }
.panel-logo { position:absolute; z-index:3; max-height:90px; object-fit:contain; }.panel-logo.top-left{top:28px;left:25px}.panel-logo.top-center{top:25px;left:50%;transform:translateX(-50%)}.panel-logo.top-right{top:28px;right:25px}.panel-logo.bottom-left{bottom:12px;left:22px}.panel-logo.bottom-right{bottom:12px;right:22px}
.safe-guide { display:none; position:absolute; z-index:10; inset:16px; border:1px dashed rgba(255,60,60,.65); pointer-events:none; }.sign-panel.show-safe .safe-guide { display:block; }.crop-guides { display:none; position:absolute; inset:0; z-index:11; pointer-events:none; background:linear-gradient(#111,#111) 12px 0/1px 11px no-repeat,linear-gradient(#111,#111) calc(100% - 12px) 0/1px 11px no-repeat,linear-gradient(#111,#111) 12px 100%/1px 11px no-repeat,linear-gradient(#111,#111) calc(100% - 12px) 100%/1px 11px no-repeat; }.sign-panel.show-crops .crop-guides{display:block}
.sign-panel.show-bleed::after { content:"BLEED 3 MM"; position:absolute; z-index:12; inset:5px; border:1px dotted rgba(23,107,219,.55); color:rgba(23,107,219,.72); font-size:7px; letter-spacing:.12em; padding:2px 4px; pointer-events:none; }
.exporting .safe-guide, .exporting .sign-panel.show-bleed::after { display:none!important; }
.design-warning { --sign-primary:#151a22; --sign-secondary:#eab308; }.design-warning .sign-accent { height:25px; background:repeating-linear-gradient(135deg,#111 0 18px,#f2c319 18px 36px); }.design-warning .sign-panel{}.design-warning .sign-header h2 { color:#111; }.design-warning .sign-content { border-color:#111; }
.design-minimal { --sign-primary:#111827; --sign-secondary:#64748b; --sign-text:#1f2937; }.design-minimal .sign-accent { height:7px; background:#111827; }.design-minimal .sign-header { padding-top:45px; }.design-minimal .sign-content { border-top:1px solid #d5d9df; }.design-minimal .sign-footer { background:#f1f3f5; color:#1f2937; }.design-minimal .sign-footer strong,.design-minimal .sign-footer b{color:#111827}.design-minimal .sign-footer small,.design-minimal .sign-footer>p{color:#596273}
.design-black { --sign-primary:#05070a; --sign-secondary:#d4af37; --sign-text:#eef1f4; --sign-bg:#0d1117; border-color:#d4af37; }.design-black .sign-accent { background:#d4af37; }.design-black .sign-header #signIntro,.design-black .sign-field small { color:#b6bec9; }.design-black .sign-content { border-color:#383e47; }.design-black .sign-footer { background:#05070a; border-top:1px solid #d4af37; }
.design-institutional { --sign-primary:#17375e; --sign-secondary:#8b1e2d; }.design-institutional .sign-accent { height:12px; background:linear-gradient(90deg,#17375e 0 33%,#f5d547 33% 66%,#8b1e2d 66%); }.design-institutional .sign-header h2 { font-family:Georgia,serif; letter-spacing:.01em; }.design-institutional .sign-panel{}
.design-sticker .sign-accent { height:10px; }.design-sticker .sign-header { padding:24px 28px 15px; gap:10px; }.design-sticker .camera-icon { width:90px; height:60px; }.design-sticker .sign-header h2 { font-size:calc(var(--sign-title) * .82); }.design-sticker .sign-content { margin:0 24px; padding:16px 0; grid-template-columns:1fr 120px; }.design-sticker .extended-field,.design-sticker .sign-field:nth-of-type(n+3),.design-sticker #signContactExtra,.design-sticker .sign-footer>p { display:none!important; }.design-sticker .sign-footer { min-height:62px; padding:12px 27px; }
.model-compact .extended-field { display:none!important; }.model-compact .sign-header { padding-bottom:16px; }.model-compact .sign-details { gap:12px; }.model-extended .sign-content { padding-top:17px; padding-bottom:17px; }.model-extended .sign-details { gap:9px; }.model-extended .sign-field p { line-height:1.25; }
.qr-left .sign-content { grid-template-columns:146px minmax(0,1fr); }.qr-left .qr-block { grid-column:1; grid-row:1; }.qr-left .sign-details { grid-column:2; }.qr-center .sign-content { display:flex; flex-direction:column; }.qr-center .qr-block { flex-direction:row; text-align:left; }.qr-center .qr-block small { max-width:240px; }
.icon-left .sign-header { flex-direction:row; text-align:left; }.icon-left .sign-title-wrap { flex:1; }.icon-left .sign-header #signIntro { margin-left:0; }.icon-left .camera-icon { flex:0 0 110px; }.icon-right .sign-header { flex-direction:row-reverse; text-align:left; }.icon-right .sign-title-wrap { flex:1; }.icon-right .sign-header #signIntro { margin-left:0; }.icon-right .camera-icon { flex:0 0 110px; }
.perspective-overlay { position:absolute; right:22px; top:22px; z-index:15; width:235px; padding:13px; color:#fff; background:rgba(8,25,49,.94); border-radius:10px; box-shadow:0 10px 30px rgba(0,0,0,.25); }.perspective-overlay > div { display:flex; justify-content:space-between; align-items:center; font-size:10px; }.perspective-overlay button { border:0;background:transparent;color:#fff;font-size:20px}.perspective-overlay ol { margin:10px 0 0; padding-left:25px; display:grid; gap:6px; }.perspective-overlay li { padding:5px 7px; border-radius:5px; color:#dce8f5; font-size:9px; cursor:pointer; }.perspective-overlay li:hover { background:rgba(255,255,255,.1); }.perspective-highlight { outline:5px solid #ffcc32!important; outline-offset:4px; }
.bottom-actions { min-height:64px; display:flex; align-items:center; justify-content:space-between; gap:15px; padding:10px 20px; background:#fff; border-top:1px solid #d8e0e9; }.autosave { display:flex; align-items:center; gap:9px; }.autosave > span { width:27px;height:27px;display:grid;place-items:center;border-radius:50%;color:var(--success);background:#e7f7f1;font-weight:900}.autosave p { margin:0;display:flex;flex-direction:column;font-size:9px}.autosave small { color:#8893a3;font-size:8px;margin-top:2px}.primary-actions { display:flex;gap:7px}.app-disclaimer { min-height:35px; padding:8px 24px; background:#0d213d; color:#b8c5d7; font-size:8px; line-height:1.35; text-align:center; }
.mobile-only { display:none; }
.toast-region { position:fixed; right:18px; bottom:18px; z-index:100; display:grid; gap:8px; }.toast { min-width:250px; max-width:360px; padding:11px 14px; border-radius:9px; color:#fff; background:#142b4b; box-shadow:0 8px 30px rgba(5,20,40,.25); font-size:10px; animation:toastIn .2s ease-out; }.toast.error{background:#8d2732}.toast.success{background:#136e4e}@keyframes toastIn{from{transform:translateY(10px);opacity:0}}
dialog { border:0; border-radius:13px; box-shadow:0 20px 60px rgba(0,0,0,.25); padding:0; }.dialog::backdrop,dialog::backdrop{background:rgba(10,23,42,.55)}dialog form{padding:22px;width:min(380px,90vw)}dialog h2{margin:0 0 8px;font-size:16px}dialog p{color:#687487;font-size:11px;line-height:1.5}dialog form>div{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}

@container (max-height: 620px) {
  .sign-header { padding-top:18px; padding-bottom:13px; gap:9px; }.camera-icon{width:85px;height:55px}.sign-header #signIntro{margin-top:9px}.sign-content{padding:13px 4px}.sign-details{gap:8px}.sign-footer{min-height:60px;padding-top:9px;padding-bottom:9px}
}
@media (max-width: 1050px) { :root{--sidebar:370px}.workspace{grid-template-columns:var(--sidebar) minmax(0,1fr)}.canvas-stage{padding-left:35px;padding-right:30px}.badges{display:none}.legal-note{margin-left:0}.sign-panel{width:500px;height:707px}.panel-scale{transform:scale(.8)} }
@media (max-width: 760px) {
  :root{--header-h:auto}.mobile-only{display:block}.app-header{height:auto;padding:12px 14px;grid-template-columns:1fr auto}.brand-mark{width:36px;height:36px;flex-basis:36px}.title-row h1{font-size:15px}.title-row h1 span{display:block;margin-top:4px;font-size:11px}.brand-lockup p,.badges,.language-select{display:none}.header-actions{gap:10px}.legal-note{display:none}.workspace{display:block;height:auto;min-height:0}.sidebar{border:0;min-height:calc(100vh - 62px);overflow:visible}.preview-area{display:none;position:fixed;inset:0;z-index:50;grid-template-rows:auto auto minmax(0,1fr) auto}.preview-area.mobile-active{display:grid}.preview-toolbar{height:50px;padding:0 12px}.preview-toolbar #previewMeta{display:none}.preview-tools .zoom-group{display:none}.validation-banner{margin:7px 8px 0}.canvas-stage{padding:32px 25px;min-height:0}.bottom-actions{padding:8px 10px}.autosave{display:none}.primary-actions{width:100%}.primary-actions button{flex:1}.mobile-preview-actions{position:absolute;left:10px;top:9px;z-index:60}.mobile-preview-actions button{border:0;background:#fff;color:var(--blue);font-size:10px;font-weight:800}.preview-toolbar>div:first-child{margin-left:100px}.model-grid{grid-template-columns:1fr 1fr}.app-disclaimer{padding-bottom:76px}.mobile-view-btn{position:fixed;z-index:30;left:14px;right:14px;bottom:14px;width:calc(100% - 28px);height:48px;border:0;border-radius:11px;background:var(--blue);color:#fff;font-weight:800;box-shadow:0 8px 25px rgba(23,107,219,.35)}.mobile-view-btn span{float:right}.sign-panel{width:380px;height:537px}.sign-header h2{font-size:calc(var(--sign-title) * .82)}.sign-content{margin-left:24px;margin-right:24px;grid-template-columns:minmax(0,1fr) 110px;gap:14px}.qr-code{--sign-qr:90px}.sign-footer{padding-left:25px;padding-right:25px}.perspective-overlay{right:8px;top:8px}.compliance-card ul{grid-template-columns:1fr}.tabs{top:0}.toast-region{left:14px;right:14px;bottom:75px}.toast{min-width:0;max-width:none}
}
@media (max-width: 400px) { .tab-panel{padding-left:14px;padding-right:14px}.two-cols{grid-template-columns:1fr}.check-grid{grid-template-columns:1fr}.sign-panel{width:340px;height:481px}.title-row h1{font-size:13px}.header-actions .switch-control span{display:none} }

@page { margin:0; size:auto; }
@media print {
  html,body{margin:0!important;padding:0!important;background:#fff!important}.app-header,.sidebar,.preview-toolbar,.validation-banner,.bottom-actions,.app-disclaimer,.ruler,.perspective-overlay,.mobile-view-btn{display:none!important}.workspace,.preview-area,.canvas-stage{display:block!important;width:auto!important;height:auto!important;min-height:0!important;margin:0!important;padding:0!important;background:#fff!important;overflow:visible!important}.panel-scale{transform:none!important}.sign-panel{width:var(--print-width)!important;height:var(--print-height)!important;max-width:none!important;max-height:none!important;margin:0!important;box-shadow:none!important;border-radius:0!important}.safe-guide{display:none!important}
}