:root{--navy: #061626;--navy-2: #0A2540;--orange: #FF6B35;--ink: #16202B;--line: #D9DEE5}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{font-family:Inter,system-ui,-apple-system,sans-serif;background:#eef1f5;color:var(--ink);-webkit-font-smoothing:antialiased}.app{display:flex;min-height:100%}.form-pane{width:420px;flex:0 0 420px;background:var(--navy);color:#eaf0f7;padding:24px 22px 40px;overflow-y:auto;height:100vh;position:sticky;top:0}.preview-pane{flex:1;padding:40px;display:flex;justify-content:center;align-items:flex-start;overflow-y:auto;height:100vh}.brandbar{display:flex;align-items:center;gap:13px;margin-bottom:26px}.logo{width:42px;height:42px;border-radius:10px}.bb-title{font-size:20px;font-weight:800;color:#fff;letter-spacing:-.01em}.bb-sub{font-size:12px;font-weight:600;color:#ffffff73;letter-spacing:.1em;text-transform:uppercase}.grp{margin-bottom:18px;display:flex;flex-direction:column;gap:8px}.grp.two{display:grid;grid-template-columns:1fr 1fr;gap:10px}.grp.three{display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:10px}.grp.two>div,.grp.three>div{display:flex;flex-direction:column;gap:6px}.lbl{font-size:11px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:#ffffff80}input,select,textarea{width:100%;font:inherit;font-size:14px;color:#fff;background:#ffffff12;border:1px solid rgba(255,255,255,.14);border-radius:9px;padding:10px 12px;outline:none}input::placeholder,textarea::placeholder{color:#ffffff54}input:focus,select:focus,textarea:focus{border-color:var(--orange);background:#ffffff1a}select option{background:var(--navy-2);color:#fff}textarea{resize:vertical}input[type=date]{color-scheme:dark}.items{display:flex;flex-direction:column;gap:7px}.items-head,.items-row{display:grid;grid-template-columns:1fr 58px 78px 84px 26px;gap:6px;align-items:center}.items-head span{font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#fff6}.items-head .ih-qty,.items-head .ih-rate,.items-head .ih-amt{text-align:right}.items-row input{padding:8px 10px;font-size:13px}.items-row .ih-qty,.items-row .ih-rate{text-align:right}.amt{font-size:13px;font-weight:700;text-align:right;color:#fff}.rowx{font:inherit;font-size:19px;line-height:1;cursor:pointer;background:none;border:none;color:#ffffff59;padding:0}.rowx:hover:not(:disabled){color:#ff8a5e}.rowx:disabled{opacity:.25;cursor:not-allowed}.add{margin-top:2px;align-self:flex-start}.btn{font:inherit;font-size:14px;font-weight:700;cursor:pointer;border-radius:10px;padding:12px 18px;border:1px solid transparent}.btn.primary{background:var(--orange);color:#0b1a26;flex:1}.btn.primary:hover{background:coral}.btn.ghost{background:#ffffff12;color:#eaf0f7;border-color:#ffffff29}.btn.ghost:hover{background:#ffffff1f}.btn.wide{width:100%;text-align:left}.actions{display:flex;gap:10px;margin:22px 0 18px}.biz{display:flex;flex-direction:column;gap:8px;margin-top:10px}.hint{font-size:11.5px;color:#fff6;line-height:1.45}.hist-head{display:flex;justify-content:space-between;align-items:baseline}.io{display:flex;gap:12px}.linky{font:inherit;font-size:11px;background:none;border:none;cursor:pointer;color:#ffffff73;text-decoration:underline}.linky:hover:not(:disabled){color:var(--orange)}.linky:disabled{opacity:.3;cursor:not-allowed;text-decoration:none}.search{font-size:13px;padding:9px 11px}.hist{list-style:none;display:flex;flex-direction:column;gap:5px;max-height:320px;overflow-y:auto}.hist li{display:flex;align-items:stretch;gap:4px}.hist li>button:first-child{flex:1;min-width:0;font:inherit;cursor:pointer;text-align:left;display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"no date amt" "name name amt";gap:3px 10px;align-items:baseline;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:8px 11px;color:#eaf0f7}.hist li>button:first-child:hover{background:#ffffff1a}.hist li.on>button:first-child{border-color:var(--orange);background:#ff6b351f}.h-no{grid-area:no;font-size:10.5px;font-weight:700;color:var(--orange);letter-spacing:.02em}.h-date{grid-area:date;font-size:10.5px;color:#fff6}.h-name{grid-area:name;font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.h-amt{grid-area:amt;align-self:center;font-size:13.5px;font-weight:700;text-align:right}.hist .rowx{font-size:17px;padding:0 5px}.footnote{margin-top:20px;font-size:11px;line-height:1.5;color:#ffffff59}.sheet{--accent: var(--orange);width:148mm;min-height:210mm;background:#fff;color:var(--ink);padding:11mm 12mm 9mm;display:flex;flex-direction:column;box-shadow:0 14px 44px #0a254029;font-size:9pt;line-height:1.4}.sheet-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8mm}.sheet-brandline{display:flex;align-items:center;gap:3mm;flex:none}.sheet-mark{width:11mm;height:11mm;flex:none}.sheet-name{font-size:14pt;font-weight:900;letter-spacing:-.02em;color:var(--navy-2);line-height:1.1;white-space:nowrap}.sheet-tag{font-size:7.5pt;font-weight:600;color:#6b7785;letter-spacing:.06em;white-space:nowrap}.sheet-contact{text-align:right;font-size:7pt;color:#5a6775;line-height:1.5;flex:1;min-width:0}.sheet-rule{height:1.1mm;background:var(--accent);margin:4mm 0 0;border-radius:1mm}.sheet-title-row{display:flex;justify-content:space-between;align-items:flex-end;margin-top:4mm}.sheet-title{font-size:19pt;font-weight:900;letter-spacing:.01em;color:var(--navy-2);text-transform:uppercase}.sheet-meta{text-align:right;font-size:8.5pt;line-height:1.55}.sheet-meta span{color:#7a8694}.sheet-meta b{color:var(--ink)}.sheet-label{font-size:7pt;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#8c98a6}.sheet-billto{margin-top:4mm}.sheet-cust-name{font-size:11.5pt;font-weight:800;color:var(--navy-2);margin-top:.8mm}.sheet-cust-line{font-size:8.5pt;color:#4e5c6a}.sheet-table{width:100%;border-collapse:collapse;margin-top:5mm}.sheet-table th{font-size:7pt;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#fff;background:var(--navy-2);padding:2.2mm 2mm;text-align:left}.sheet-table td{padding:2mm;border-bottom:.3mm solid var(--line);vertical-align:top}.sheet-table .c-sn{width:9mm;text-align:center}.sheet-table .c-qty{width:14mm;text-align:right}.sheet-table .c-rate{width:22mm;text-align:right}.sheet-table .c-amt{width:26mm;text-align:right;font-weight:700}.sheet-table th.c-qty,.sheet-table th.c-rate,.sheet-table th.c-amt{text-align:right}.sheet-table tr.blank td{height:5.5mm}.sheet-totals{display:flex;justify-content:space-between;gap:8mm;margin-top:5mm}.sheet-words{flex:1}.sheet-words-text{font-size:8.5pt;font-weight:600;color:var(--navy-2);margin-top:1mm;line-height:1.45}.sheet-sums{width:62mm;flex:none}.sheet-sums>div{display:flex;justify-content:space-between;padding:1.2mm 0;font-size:9pt}.sheet-sums span{color:#6b7785}.sheet-sums b{font-weight:700}.sheet-sums .grand{margin-top:1.5mm;padding-top:2mm;border-top:.5mm solid var(--navy-2);font-size:12pt}.sheet-sums .grand span{color:var(--navy-2);font-weight:800}.sheet-sums .grand b{color:var(--accent);font-weight:900}.sheet-foot{display:flex;justify-content:flex-end;align-items:flex-end;margin-top:auto;padding-top:6mm}.sheet-sign{text-align:center;width:48mm;flex:none}.sign-line{border-top:.3mm solid #9AA5B1;margin-bottom:1.5mm}.sign-cap{font-size:8pt;color:#5a6775}.sheet-cg{margin-top:1.2mm;font-size:6.8pt;color:#a5afba;letter-spacing:.02em}.sheet-thanks{margin-top:4mm;padding-top:2.5mm;border-top:.3mm dashed var(--line);text-align:center;font-size:7.5pt;color:#8c98a6;letter-spacing:.04em}@page{size:A5 portrait;margin:0}@media print{html,body,#root{height:auto;background:#fff}.no-print{display:none!important}.app{display:block}.preview-pane{display:block;padding:0;height:auto;overflow:visible}.sheet{width:148mm;height:208mm;min-height:0;box-shadow:none;page-break-after:avoid}*{-webkit-print-color-adjust:exact;print-color-adjust:exact}}@media screen and (max-width: 1040px){.app{flex-direction:column}.form-pane{width:100%;flex:none;height:auto;position:static}.preview-pane{height:auto;padding:24px 12px 60px}}.fysel{font-size:13px;padding:9px 11px}.status{text-transform:none;letter-spacing:.02em}.status.synced{color:#4ade80}.status.syncing{color:#ffffff80}.status.offline{color:#fbbf24}.status.local{color:#ffffff73}
