/* Yearly comparisons and compact transaction entry. */
.workspace-clock { display: inline-flex; align-items: baseline; gap: 9px; margin-left: auto; font-variant-numeric: tabular-nums; white-space: nowrap; }
.workspace-clock-date { color: var(--accent-dark); font-size: 20px; font-weight: 800; }
.workspace-clock-time { color: var(--ink); font-size: 15px; font-weight: 650; }
.secret-label { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.secret-state { border-radius: 6px; padding: 2px 6px; color: var(--muted); background: var(--ground); font-size: 12px; font-weight: 650; }
.secret-state[data-secret-state=saved] { color: var(--accent-dark); background: var(--accent-soft); }
.secret-feedback { color: var(--accent-dark); margin: 4px 0 0; font-size: 14px; }
.secret-feedback:empty { display: none; }
input[type=password]::placeholder { color: var(--muted); opacity: 1; }
.annual-paired-bars { width: 100%; height: clamp(118px, 24vh, 218px); display: block; }
.annual-zero { stroke: var(--muted); stroke-width: 1; stroke-dasharray: 4 3; }
.annual-sale { fill: #4979e0; }
.annual-profit { fill: #269478; }
.annual-loss { fill: #cb5267; }
.annual-legend { display: flex; flex-wrap: wrap; gap: 12px; color: var(--muted); font-size: 13px; }
.annual-legend span::before { content: ""; display: inline-block; width: 9px; height: 9px; margin-right: 5px; border-radius: 2px; background: #4979e0; }
.annual-legend span:last-child::before { background: #269478; }
.annual-axis { display: grid; grid-template-columns: repeat(12,minmax(0,1fr)); gap: 1px; }
.annual-axis button { padding: 5px 0; min-width: 0; font-size: clamp(10px,1.6vw,14px); color: var(--muted); background: var(--ground); border-radius: 4px; }
.annual-axis button[aria-pressed=true] { color: var(--accent-dark); background: var(--accent-soft); font-weight: 750; }
.report-year-plot { flex: 1; min-height: 165px; overflow: auto; }
.report-year-plot > .chart-area { min-width: 840px; height: 100%; min-height: 165px; }
.chart-panel:has(.report-year-plot) .chart-months { flex-wrap: wrap; }
#trade-filter { min-height: 40px; height: auto; padding-block: 7px; line-height: 1.4; }
.receipt-items { min-width: 0; white-space: normal; overflow-wrap: anywhere; }
.receipt-items > summary { line-height: 1.5; padding: 5px 0; cursor: pointer; white-space: normal; overflow: visible; }
.receipt-items ol { padding-inline-start: 25px; }
.receipt-items li { padding: 5px 0; line-height: 1.45; }
.receipt-items li span { display: block; color: var(--muted); }

#transaction-dialog { width: min(910px,calc(100vw - 24px)); max-width: calc(100vw - 24px); max-height: calc(100dvh - 20px); height: auto; inset: 0; margin: auto; border-radius: 16px; }
#transaction-dialog .dialog-header { padding: 10px 16px; }
#transaction-dialog .dialog-header p { display: none; }
#transaction-dialog .dialog-footer { padding: 8px 16px; }
#transaction-dialog .dialog-body { padding: 9px 16px; }
#transaction-form { gap: 8px; }
.transaction-columns,.tx-proof-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; align-items: start; }
.transaction-columns[hidden],.tx-proof-fields[hidden],.tx-photo-fields[hidden] { display: none; }
.transaction-columns > section { display: grid; gap: 8px; min-width: 0; }
#transaction-form .tx-basic-fields { grid-template-columns: repeat(2,minmax(0,1fr)); }
#transaction-form .tx-basic-fields > .field:has(#kind-label,#tx-name,#tx-content) { grid-column: 1/-1; }
#transaction-form .field:has(#tx-name) { grid-template-columns: minmax(0,1fr) auto; align-items: center; }
#transaction-form .field:has(#tx-name) > :is(label,p) { grid-column: 1/-1; }
#transaction-form .field:has(#tx-name) .lookup-button { min-height: 34px; height: 34px; padding: 4px 7px; font-size: 12px; }
#transaction-form #tx-company-hint { display: none; }
#transaction-form :is(.field,.field-pair) { gap: 4px; min-width: 0; }
#transaction-form :is(input:not([type=checkbox]),select) { min-width: 0; min-height: 34px; height: auto; padding: 5px 8px; font-size: 15px; }
#transaction-form .amount-input input { padding-inline-end: 30px; }
#transaction-form :is(.segmented button,.checkbox-line) { min-height: 32px; padding-block: 3px; }
#transaction-form .form-summary { padding: 5px 8px; font-size: 13px; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 4px; }
#transaction-form .form-summary .calc-line { flex-wrap: wrap; gap: 2px 5px; line-height: 1.35; }
#transaction-form .form-summary > p { grid-column: 1/-1; margin: 0; }
#transaction-form .helper { font-size: 12px; margin: 0; line-height: 1.35; }
#transaction-form #tx-advanced { padding: 4px 6px; min-width: 0; }
#transaction-form #tx-advanced > .form-stack { gap: 6px; }
.tx-proof-fields > #tx-advanced { grid-column: 1/-1; }
.tx-photo-fields { display: grid; gap: 8px; }
.tx-ocr-pager { display: flex; gap: 8px; align-items: center; justify-content: flex-end; font-size: 13px; }
.erp-item[hidden] { display: none; }

.business-fields,.doc-recipient-fields,.doc-terms { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.business-fields,.business-brands,.mail-settings { padding: 12px 18px; }
.business-fields label,.document-editor label,.mail-settings label,.ai-meter-heading label { display: grid; gap: 4px; min-width: 0; font-size: 14px; }
.business-fields input,.document-editor :is(input,select,textarea),.mail-settings input,#document-email-form input,#document-email-form textarea { min-width: 0; width: 100%; }
.business-brands { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.brand-field { display: grid; grid-template-columns: 76px minmax(0,1fr); gap: 9px; padding: 9px; background: var(--ground); border-radius: 10px; }
.brand-preview { display: grid; place-items: center; min-height: 59px; border: 1px dashed var(--line); border-radius: 8px; text-align: center; font-size: 11px; color: var(--muted); }
.brand-preview img { display: block; max-width: 68px; max-height: 62px; object-fit: contain; }
.brand-field .btn { padding: 4px 7px; font-size: 12px; min-height: 27px; }
.brand-field strong { display: block; margin-bottom: 4px; }
.brand-status { grid-column: 1/-1; color: var(--muted); }
.mail-status,.doc-status { color: var(--accent-dark); font-size: 14px; margin: 0; overflow-wrap: anywhere; }
.mail-status:empty,.doc-status:empty,.brand-status:empty { display: none; }
#mail-guide-dialog { width: min(700px,calc(100vw - 24px)); }
.mail-guide-steps { display: grid; gap: 10px; margin: 0 0 14px; padding: 0; list-style: none; }
.mail-guide-steps li { display: grid; grid-template-columns: 42px 1fr; align-items: start; gap: 11px; background: var(--ground); border: 1px solid var(--line); border-radius: 12px; padding: 10px; }
.mail-guide-steps li > span { display: grid; place-items: center; border-radius: 10px; min-height: 40px; background: var(--accent-soft); color: var(--accent-dark); font-weight: 750; }
.mail-guide-steps h3,.mail-guide-steps p { margin: 0 0 3px; overflow-wrap: anywhere; }
.mail-guide-steps p { color: var(--muted); font-size: 14px; }
.ai-usage-meter { border: 1px solid var(--line); border-radius: 12px; padding: 12px; }
.ai-meter-heading { display: flex; gap: 10px; align-items: center; justify-content: space-between; flex-wrap: wrap; margin-bottom: 9px; }
.ai-meter-heading input { width: 114px; }
#ai-usage-totals { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
#ai-usage-totals > div { display: grid; gap: 4px; padding: 9px; min-width: 0; background: var(--ground); border-radius: 9px; }
#ai-usage-totals strong { font-size: 20px; overflow-wrap: anywhere; }
#ai-usage-totals small { color: var(--muted); font-size: 12px; }
#ai-usage-totals p { margin: 0; font-size: 13px; }

.document-workspace { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(0,46fr) minmax(0,33fr) minmax(0,21fr); gap: 12px; overflow: hidden; }
.document-workspace > .panel { min-width: 0; min-height: 0; }
.document-editor,.doc-history { overflow: auto; padding: 13px; }
.document-editor,.doc-preview-card,.doc-history { display: flex; flex-direction: column; gap: 12px; }
.document-editor > * { flex: none; }
.doc-card-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.doc-card-head h2 { display: flex; align-items: center; gap: 7px; font-size: 19px; margin: 0; }
.doc-card-head h2 .od-icon { color: var(--accent-dark); --od-icon-size: 19px; }
.doc-editor-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.doc-editor-actions .btn,.doc-preview-actions .btn { min-height: 36px; padding-inline: 10px; }
.document-editor fieldset { min-width: 0; margin: 0; padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; }
.document-editor legend { font-weight: 700; padding: 0 5px; }
.doc-recipient-fields,.doc-company-pair { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.doc-recipient-fields,.doc-disclosure > .doc-terms { margin-top: 8px; }
.doc-disclosure { padding: 7px 9px; border-radius: 8px; background: var(--ground); }
fieldset .doc-disclosure { margin-top: 8px; }
.doc-disclosure summary { cursor: pointer; color: var(--ink); font-size: 14px; font-weight: 650; }
.doc-form-head { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,105px),1fr)); gap: 8px; }
.doc-item { display: grid; grid-template-columns: minmax(0,2.6fr) minmax(0,.9fr) minmax(0,1.2fr) minmax(0,1.3fr) 26px; gap: 5px; align-items: end; padding-block: 5px; }
.doc-item + .doc-item { border-top: 1px solid var(--line); margin-top: 4px; }
.doc-item input,.doc-form-head input,.doc-form-head select { min-height: 38px; padding-inline: 6px; }
.doc-item .icon-btn { min-width: 26px; width: 26px; }
.doc-item-controls,.doc-issue-footer,.doc-issue-footer > div { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.doc-item-controls { justify-content: space-between; margin-top: 7px; }
.doc-issue-footer { justify-content: space-between; border-top: 1px solid var(--line); padding-top: 10px; }
.doc-issue-footer span { color: var(--muted); font-size: 13px; }
.document-editor .doc-vat-switch { display: flex; align-items: center; gap: 7px; position: relative; cursor: pointer; }
.doc-vat-switch input { position: absolute; opacity: 0; width: 40px; height: 24px; }
.doc-vat-switch i { width: 42px; height: 23px; border-radius: 20px; background: var(--muted); display: inline-block; padding: 2px; }
.doc-vat-switch input:checked + i { background: var(--accent); }
.doc-vat-switch input:focus-visible + i { outline: 2px solid var(--accent); outline-offset: 2px; }
.doc-vat-switch i::before { content: ""; display: block; width: 19px; height: 19px; border-radius: 50%; background: white; transition: transform 140ms; }
.doc-vat-switch input:checked + i::before { transform: translateX(19px); }
.doc-history .doc-card-head { margin-bottom: 1px; }
.doc-history button { display: grid; gap: 3px; width: 100%; text-align: left; color: var(--ink); background: var(--ground); border-radius: 8px; padding: 9px; margin-bottom: 6px; overflow-wrap: anywhere; }
.doc-history button :is(span,small) { color: var(--muted); }

.doc-preview-card { padding: 13px; overflow: hidden; }
.doc-state { padding: 4px 8px; border-radius: 99px; background: var(--accent-soft); color: var(--accent-dark); font-size: 12px; font-weight: 750; white-space: nowrap; }
.doc-state.confirmed,.doc-history-date b { background: #dff5eb; color: #135b41; }
.doc-preview-body { flex: 1; min-height: 0; overflow: auto; }
.doc-preview-body .issued-paper { padding: clamp(9px,1vw,17px); border: 1px solid #d9e3ee; }
.doc-preview-body .issued-paper h2 { font-size: clamp(21px,1.8vw,30px); }
.doc-preview-body .issued-items :is(td,th) { padding: 5px 3px; font-size: 13px; }
.doc-preview-body .issued-items td:not(:first-child) { font-variant-numeric: tabular-nums; }
.doc-preview-body .issued-total { gap: 5px 10px; }
.doc-preview-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; border-top: 1px solid var(--line); padding-top: 9px; }
.doc-preview-actions .doc-status:not(:empty) { flex: 1 0 100%; }
.doc-preview-actions button:disabled { opacity: .55; cursor: not-allowed; }
.doc-history-entry:has(button[aria-pressed=true]) { outline: 2px solid var(--accent); outline-offset: -2px; }
.doc-history-date,.doc-history-total { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 4px; }
.doc-history-date b { border-radius: 99px; padding: 1px 6px; font-size: 11px; }
.doc-history button .doc-history-total { color: var(--ink); font-weight: 750; font-variant-numeric: tabular-nums; }
.doc-history-total span { font-size: 12px; font-weight: 500; }
.issued-scroll { background: var(--ground); }
.issued-paper { color: #17233b; background: #fff; border-radius: 10px; padding: clamp(12px,3vw,28px); overflow-wrap: anywhere; }
.issued-paper > header,.issued-meta,.issued-total,.issued-notes { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.issued-paper > header { border-top: 4px solid #264c91; padding-top: 10px; margin-bottom: 12px; }
.issued-paper header img { max-width: 130px; max-height: 62px; object-fit: contain; }
.issued-paper h2 { font-size: clamp(24px,5vw,36px); margin: 4px 0; }
.issued-paper small,.issued-meta { color: #516077; }
.issued-paper .issued-party-label { color:#264c91; font-weight:750; }
.issued-meta { justify-content: flex-start; border-block: 1px solid #d9e3ee; padding-block: 7px; font-size: 13px; }
.issued-parties { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; margin: 12px 0; }
.issued-parties section { background: #f2f6fd; border-radius: 8px; padding: 9px; }
.issued-parties h3,.issued-parties p { margin: 3px 0; font-size: 13px; }
.issued-parties h3 { font-size: 17px; }
.issued-items { width: 100%; border-collapse: collapse; font-size: 14px; }
.issued-items th { color: #264c91; background: #eef4fd; }
.issued-items :is(td,th) { text-align: right; padding: 6px; border-bottom: 1px solid #d9e3ee; }
.issued-items tr > :first-child { text-align: left; }
.issued-total { margin-top: 12px; background: #eef4fd; color: #264c91; border-radius: 8px; padding: 9px; font-size: 13px; align-items: center; }
.issued-total strong { font-size: 18px; }
.issued-notes { margin-top: 10px; align-items: flex-end; white-space: pre-wrap; font-size: 13px; }
.issued-notes > div { flex: 1; min-width: 0; }
.issued-notes img { max-width: 105px; max-height: 78px; object-fit: contain; }
#document-email-dialog { width: min(590px,calc(100vw - 24px)); }
#document-email-form label { display: grid; gap: 4px; }
.doc-attachment { padding: 8px; border-radius: 8px; background: var(--ground); overflow-wrap: anywhere; }

@media (max-width: 700px) {
  .transaction-columns { grid-template-columns: 1fr; gap: 6px; }
  .transaction-columns > section { gap: 5px; }
  .tx-settlement-fields { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .tx-settlement-fields > .field:has(#settlement-label),#tx-credit-row { grid-column: 1/-1; }
  #transaction-dialog .dialog-body { padding: 6px 9px; }
  #transaction-dialog .dialog-header,#transaction-dialog .dialog-footer { padding: 6px 9px; }
  .business-brands,.doc-terms { grid-template-columns: 1fr; }
  .doc-form-head,.doc-recipient-fields { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .doc-item { grid-template-columns: repeat(2,minmax(0,1fr)) 30px; }
  .doc-item > label:first-child { grid-column: 1/-1; }
  .doc-item-amount { grid-column: 1/3; }
  .issued-items :is(td,th) { padding: 4px; font-size: 12px; }
  .report-year-plot > .chart-area { height: 178px; }
}
@media (max-width: 950px) {
  .topbar { display: grid; grid-template-columns: minmax(0,1fr) auto; height: auto; min-height: 80px; gap: 2px 8px; padding-block: 5px 6px; }
  .topbar > .top-actions { grid-column: 2; grid-row: 1; }
  .workspace-clock { grid-column: 1/-1; grid-row: 2; margin-left: 0; }
  .workspace-clock-date { font-size: 16px; }
  .workspace-clock-time { font-size: 14px; }
}
@media (max-height: 660px) {
  #transaction-form :is(.helper,.form-summary .helper) { display: none; }
  #transaction-form { gap: 4px; }
  #transaction-form .field > label { font-size: 13px; }
}
@media (max-width: 700px) and (max-height: 690px) {
  #transaction-form :is(.field-label,.field > label) { font-size: 13px; line-height: 1.3; }
  #transaction-form #tx-advanced .field-pair { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (prefers-reduced-motion: reduce) {
  .doc-vat-switch i::before { transition: none; }
}
/* Keep the entry shell visible from the first paint, including narrow displays. */
#auth-actions:empty { display: none; }
#auth-overlay { overflow-y: auto; }
.auth-brand { display: flex; align-items: center; gap: 12px; }
.auth-brand img, .sidebar .brand img { flex: none; }
.auth-brand span { font-size: 12px; font-weight: 700; letter-spacing: 1px; }
#auth-actions { display: grid; gap: 8px; }
.sidebar { overflow-y: auto; }
.sidebar .nav-list, .sidebar .sidebar-bottom { flex-shrink: 0; }
.mobile-nav .mobile-credit img { vertical-align: middle; margin-inline-end: 4px; }
@media (max-width: 420px) {
  #auth-overlay { padding: 16px; }
  .auth-card { padding: 24px; gap: 16px; }
}
.doc-item-spec { grid-column: 1/3; }
.doc-item-unit { grid-column: 3/5; }
.doc-preview-spec { display: block; margin-top: 4px; color: #52647b; overflow-wrap: anywhere; }
.btn.doc-confirm { background: #137451; color: #fff; border-color: #137451; }
.btn.doc-confirm:hover:not(:disabled) { background: #0b5b3e; }
.btn.doc-danger { color: #fff; border-color: #ab2840; background: #ab2840; }
.btn.doc-danger:hover:not(:disabled) { background: #881c31; border-color: #881c31; }
.doc-history-entry { border-radius: 9px; margin-block: 6px; border: 1px solid var(--line); border-inline-start: 3px solid #1b9870; background: color-mix(in srgb, #20a67a 8%, var(--paper)); }
.doc-history .doc-history-entry button { margin: 0; background: transparent; }
.doc-history-entry small b { color: var(--ink); }
#quote-compare-dialog, #quote-original-dialog { width: min(860px,calc(100vw - 24px)); }
#quote-catalog-dialog, #document-delivery-dialog { width: min(660px,calc(100vw - 24px)); }
#quote-compare-dialog .dialog-footer { flex-wrap: wrap; }
#quote-compare-dialog button:disabled { opacity: .55; cursor: not-allowed; }
:is(#quote-compare-form,#quote-catalog-form,#document-delivery-form) label { display: grid; gap: 4px; min-width: 0; }
:is(#quote-compare-form,#quote-catalog-form,#document-delivery-form) :is(input,select,textarea) { width: 100%; min-width: 0; }
.quote-catalog-prices { display: grid; grid-template-columns: minmax(54px,.55fr) repeat(2,minmax(0,1fr)); gap: 8px; }
.quote-catalog-list { display: grid; gap: 6px; margin-top: 15px; }
.quote-catalog-list article { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; border-top: 1px solid var(--line); padding-block: 6px; }
.quote-catalog-list article > div { flex: 1 1 160px; overflow-wrap: anywhere; }
.quote-catalog-list small, .quote-plans article small { display: block; color: var(--muted); }
.quote-examples { display: grid; gap: 5px; }
.quote-progress { display: flex; align-items: center; gap: 10px; color: var(--accent-dark); }
.quote-progress[hidden] { display: none; }
/* 21st.dev loading-ui Bouncing Dots, demo 19909. CSS port for this vanilla UI. */
.quote-dots { display: inline-flex; align-items: center; gap: 12%; width: 33px; flex: none; }
.quote-dots i { display: inline-block; flex: 1; aspect-ratio: 1; border-radius: 50%; background: currentColor; animation: loading-ui-bouncing-dots 1.4s ease-in-out infinite; }
.quote-dots i:nth-child(2) { animation-delay: .2s; }
.quote-dots i:nth-child(3) { animation-delay: .4s; }
@keyframes loading-ui-bouncing-dots { 0%,100% { transform: scale(.8); opacity: .5; } 50% { transform: scale(1.2); opacity: 1; } }
.quote-references, .quote-plans { display: grid; gap: 8px; border-top: 1px solid var(--line); padding-top: 13px; margin-top: 12px; }
.quote-references details, .quote-plans article, .quote-notice { padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--ground); overflow-wrap: anywhere; }
.quote-references details > :not(summary) { margin-top: 7px; }
.quote-references summary { cursor: pointer; font-weight: 700; }
.quote-reference-lines > div { display: flex; gap: 5px 12px; flex-wrap: wrap; padding-block: 5px; border-top: 1px solid var(--line); font-size: 14px; }
.quote-reference-lines > div > span:last-child { margin-inline-start: auto; }
.quote-plans article { display: grid; gap: 5px; }
.quote-plans article:has(input:checked) { border-color: var(--accent); background: var(--accent-soft); }
.quote-plan-select { display: flex; align-items: center; gap: 8px; font-weight: 750; }
.quote-over-budget { color: light-dark(#a7283c,#ffb2be); }
/* 21st.dev ibelick Tilt, demo 1640. The pointer mapping is applied by release035.js. */
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .insight-dashboard :is(.insight-kpi,.insight-card) { transition: transform .22s cubic-bezier(.2,.7,.25,1), box-shadow .22s ease; }
  .insight-dashboard :is(.insight-kpi,.insight-card):hover { transform: translateY(-2px); box-shadow: 0 8px 20px #213f691c; }
}
@media (prefers-reduced-motion: reduce) {
  .quote-dots i { animation: none; }
  .insight-dashboard :is(.insight-kpi,.insight-card) { transition: none; }
}
@media (max-width: 700px) {
  .doc-item-spec { grid-column: 1/-1; }
  .doc-item-unit { grid-column: 1/3; }
  .quote-reference-lines > div > span:last-child { margin-inline-start: 0; width: 100%; }
}
@media (max-width: 1190px) {
  .document-workspace { grid-template-columns: minmax(0,1.13fr) minmax(0,1fr); overflow: auto; align-content: start; }
  .document-workspace > .panel,.doc-preview-body { overflow: visible; }
  .doc-history { grid-column: 1/-1; }
  .doc-history-list { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,220px),1fr)); gap: 7px; }
}
@media (max-width: 850px) {
  .document-workspace { grid-template-columns: minmax(0,1fr); }
  .doc-history { grid-column: auto; }
}
.doc-history-filters { display: grid; gap: 7px; }
.doc-history-filters label { display: grid; gap: 3px; font-size: 13px; }
.doc-history-filters :is(input,select) { width: 100%; min-width: 0; min-height: 36px; }
.doc-history [hidden],.issued-paper [hidden] { display: none; }
.doc-field-options { display: flex; flex-wrap: wrap; align-items: center; gap: 5px 10px; margin-top: 6px; }
.document-editor .doc-field-options label { display: flex; align-items: center; gap: 4px; font-size: 12px; }
.doc-field-options input[type=checkbox] { width: auto; }
.doc-disclosure > label { margin-top: 8px; }
.doc-form-head { margin-top: 7px; }
.doc-internal { margin-top: 9px; padding: 9px; background: var(--ground); border: 1px solid var(--line); border-radius: 8px; overflow-wrap: anywhere; }
.doc-internal p { white-space: pre-wrap; margin-top: 4px; }
.doc-deal-history details { margin-top: 7px; padding: 6px; border-top: 1px solid var(--line); }
.doc-deal-history summary { cursor: pointer; }
.doc-deal-history ul { padding-inline-start: 18px; }
#document-deal-dialog { width: min(720px,calc(100vw - 24px)); }
#business-profile-dialog { width: min(650px,calc(100vw - 24px)); }
#document-message-dialog { width: min(425px,calc(100vw - 24px)); }
#document-deal-form label,#business-profile-form label { display: grid; gap: 4px; min-width: 0; }
#document-deal-form .checkbox-line,#business-profile-form .checkbox-line { display: flex; }
#document-deal-form .doc-item input,#business-profile-form input:not([type=checkbox]) { min-width: 0; width: 100%; }
.doc-deal-total { font-weight: 750; color: var(--accent-dark); }
.business-profile-list { display: grid; gap: 8px; padding: 13px 18px; border-top: 1px solid var(--line); }
.business-profile-list > div { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.business-profile-list > div > span { flex: 1; min-width: 130px; }
.business-profile-list b { font-size: 12px; color: var(--accent-dark); margin-left: 4px; }
.business-profile-list > .btn { justify-self: start; }
.quote-examples ol { margin: 0; padding-inline-start: 19px; font-size: 12px; color: var(--muted); user-select: none; }
.quote-examples li + li { margin-top: 3px; }

/* 21st.dev Origin UI Button (demo 140), ported to the app's native buttons and theme. */
:is(button.btn,button.icon-btn,.sidebar .nav-item,.mobile-nav button:not(.mobile-credit)) {
  border-radius: 8px;
  transition: background-color .15s ease,color .15s ease,border-color .15s ease;
}
button.btn .od-icon,button[data-menu-icon] .od-icon { flex-shrink: 0; pointer-events: none; }
:is(button.btn,button.icon-btn,.sidebar .nav-item,.mobile-nav button:not(.mobile-credit)):focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
button.btn:disabled { opacity: .5; }
.document-workspace :is(.btn,.icon-btn)[data-menu-icon],
#document-issue-details-dialog .btn[data-menu-icon] { gap: 6px; }
.document-workspace button :is(.od-icon) { --od-icon-size: 16px; }
.document-editor { gap: 8px; }
.document-editor label { gap: 3px; font-size: 13px; line-height: 1.3; }
.document-editor :is(input:not([type=checkbox]),select) { min-height: 34px; padding-block: 4px; line-height: 1.35; font-size: 14px; }
.doc-parties-input { display: grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.55fr); gap:7px; }
.doc-recipient-choice { display:flex; align-items:end; gap:5px; min-width:0; }
.doc-recipient-choice > label { flex:1; min-width:0; }
.doc-recipient-choice > .btn { min-height:34px; padding:4px 8px; white-space:nowrap; color:var(--accent-dark); }
.doc-recipient-choice > .btn[aria-expanded=true] { background:var(--accent-soft); border-color:var(--accent); }
.doc-party-details { margin-top:7px; padding:6px 9px; background:var(--accent-soft); border-radius:8px; }
.doc-party-details[hidden] { display:none; }
.doc-party-heading { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.doc-party-heading h3 { margin:0; font-size:15px; }
.doc-party-heading small { color:var(--muted); }
.doc-party-heading .btn { margin-inline-start:auto; min-height:25px; padding-block:2px; }
.doc-party-details .doc-recipient-fields { margin-top:5px; gap:6px; }
.doc-party-details .doc-recipient-fields > label:last-child { grid-column:1/-1; }
.doc-party-details .doc-disclosure fieldset { margin-top:6px; }
.doc-more-row { display:flex; flex-wrap:wrap; gap:6px; }
.doc-more-row > details[open] { flex:1 1 100%; }
.document-editor .doc-item { padding-block: 3px; }
.document-editor .doc-item[hidden],.doc-pager[hidden] { display: none; }
.doc-pager { display: inline-flex; align-items: center; gap: 5px; color: var(--muted); font-size: 12px; white-space: nowrap; }
.doc-pager .btn { min-height: 29px; min-width: 29px; padding: 2px 5px; }
.doc-pager .od-icon { --od-icon-size: 15px; }
.doc-preview-body { display: flex; flex-direction: column; gap: 7px; }
.doc-preview-body > .issued-paper { flex:none; min-width:0; }
.doc-preview-body .issued-items { table-layout:fixed; overflow-wrap:anywhere; }
.doc-preview-body .issued-items :is(td,th):first-child { width:37%; }
.doc-preview-tools,.doc-return-row { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; }
.doc-preview-tools .btn,.doc-return-row .btn { min-height: 32px; padding: 4px 8px; font-size: 12px; }
.doc-preview-actions .btn { min-height: 34px; padding: 5px 8px; font-size: 12px; line-height: 1.3; }
.doc-return-row .btn { background: var(--accent-soft); color: var(--accent-dark); }
.doc-history { overflow: hidden; }
.doc-history > :not(.doc-history-list) { flex-shrink: 0; }
.doc-history-list { min-height: 0; overflow: auto; }
#document-issue-details-dialog { width: min(710px,calc(100vw - 24px)); }
@media (min-width: 1191px) {
  #main[data-view=documents] { padding-top: 13px; gap: 8px; }
  #main[data-view=documents] > .page-heading { margin-bottom: 0; min-height: 0; }
  #document-form .doc-item {
    grid-template-columns: minmax(0,1.55fr) minmax(0,1.65fr) minmax(0,.72fr) minmax(0,.56fr) minmax(0,1fr) minmax(0,1fr) 26px;
  }
  #document-form .doc-item > label { grid-column: auto; }
}
@media (min-width: 1191px) and (max-height: 900px) {
  .document-editor,.doc-preview-card { padding: 9px; gap: 6px; }
  .document-editor > fieldset { padding: 5px 7px; }
  .doc-item-controls > .btn { min-height: 30px; padding: 3px 7px; line-height: 1.3; }
  .doc-preview-body { gap: 5px; }
  .doc-preview-actions { padding-top: 6px; }
}
@media (max-width: 700px) {
  .doc-parties-input { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .doc-parties-input > :last-child { grid-column: 1/-1; }
}
@media (prefers-reduced-motion: reduce) {
  :is(button.btn,button.icon-btn,.sidebar .nav-item,.mobile-nav button:not(.mobile-credit)) { transition: none; }
}

/* Account, report, and quote additions reuse the ERP theme tokens. */
.secret-field { display:grid; gap:5px; min-width:0; }
.secret-control { position:relative; min-width:0; }
.secret-control input { width:100%; padding-inline-end:46px; }
.secret-eye { position:absolute; inset-inline-end:5px; top:50%; transform:translateY(-50%); display:grid; place-items:center; width:36px; height:34px; border:0; border-radius:8px; background:transparent; color:var(--muted); }
.secret-eye:hover,.secret-eye[aria-pressed=true] { background:var(--accent-soft); color:var(--accent); }
.secret-eye:focus-visible { outline:2px solid var(--accent); }
.password-rules ul { display:flex; flex-wrap:wrap; gap:4px 10px; list-style:none; margin:2px 0; padding:0; font-size:12px; color:var(--muted); }
.password-rules li[data-met=true] { color:var(--accent); font-weight:700; }
.password-feedback { font-size:12px; color:var(--muted); }
#auth-overlay[data-mode=signup] .auth-card { width:min(100%,650px); padding:24px 30px; gap:12px; }
.signup-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px 14px; }
.signup-grid .signup-wide { grid-column:1/-1; }
.signup-grid input:not([type=checkbox]) { min-height:40px; height:40px; padding-block:6px; }
.signup-grid .checkbox-line { display:flex; gap:8px; align-items:center; }
.signup-grid .checkbox-line input { width:17px; height:17px; }
.signup-consent { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:4px; }
.signup-grid .erp-button-row { justify-content:flex-end; }
#erp-account-dialog,#company-profile,#mfa-dialog { width:min(680px,calc(100vw - 24px)); max-height:calc(100dvh - 24px); }
#erp-account-dialog .dialog-body,#company-profile .dialog-body,#mfa-dialog .dialog-body { overflow:auto; }
#erp-account-dialog .dialog-body > p { line-height:1.65; }
[data-account-status]:empty { display:none; }
.owner-card-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,235px),1fr)); align-content:start; gap:12px; padding:2px 2px 12px; min-height:0; overflow:auto; }
.owner-card { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:6px 10px; min-height:94px; padding:16px; text-align:left; color:var(--ink); background:var(--paper); }
#erp-account-dialog form label,#mfa-dialog label { display:grid; gap:5px; min-width:0; }
#erp-account-dialog form label.checkbox-line { display:flex; }
#erp-account-dialog form :is(textarea,input:not([type=checkbox]),select),#mfa-dialog :is(textarea,input) { width:100%; }
.owner-card strong,.owner-card span:not(.od-icon) { grid-column:1; overflow-wrap:anywhere; }
.owner-card span:not(.od-icon) { color:var(--muted); font-size:13px; }
.owner-card .od-icon { grid-area:1/2/3/3; align-self:center; color:var(--accent); }
.owner-card:hover,.owner-card:focus-visible,.report-aging-cards button[aria-pressed=true] { background:var(--accent-soft); border-color:var(--accent); }
.company-profile-memo p { margin-block:6px 0; white-space:pre-wrap; overflow-wrap:anywhere; }
.ledger-trend-scroll { overflow-x:auto; }
.ledger-trend-scroll.trend-year > div { min-width:715px; }
.ledger-sales-summary > p { margin-bottom:6px; font-size:13px; }
.report-settlement { display:flex; flex-direction:column; min-height:0; }
.report-settlement > .panel-header,.report-settlement > .mini-summary { flex-shrink:0; }
.report-settlement > .mini-summary { padding:12px; }
.report-aging-cards { display:flex; flex-wrap:wrap; gap:7px; padding:0 12px 12px; }
.report-aging-cards .btn { display:grid; gap:3px; text-align:left; padding:7px 11px; min-height:50px; }
.report-aging-cards small { color:var(--muted); }
.quote-vat-note { font-size:12px; font-weight:700; color:var(--accent); white-space:nowrap; }
.issued-total [hidden] { display:none; }
.mail-guide-webp { display:block; width:100%; height:auto; margin-bottom:12px; border-radius:14px; }
.doc-preview-heading { display:flex; align-items:center; flex-wrap:wrap; gap:6px 10px; min-width:0; }
.doc-template-choice { display:flex; align-items:center; gap:4px; }
.doc-template-choice select { min-height:32px; max-width:145px; font-size:13px; }
#toast { pointer-events:none; }
.issued-paper[data-template="2"] { --quote-ink:#222; --quote-accent:#333; --quote-line:#d6d4d0; --quote-surface:#f8f7f5; --quote-table:#f3f2ef; --quote-table-text:#222; --quote-total:#f3f2ef; --quote-total-text:#222; color:var(--quote-ink); }
.issued-paper[data-template="3"] { --quote-ink:#162b43; --quote-accent:#12645e; --quote-line:#d5e1eb; --quote-surface:#edf4fa; --quote-table:#142c4a; --quote-table-text:#fff; --quote-total:#12645e; --quote-total-text:#fff; color:var(--quote-ink); }
.issued-paper[data-template="4"] { --quote-ink:#14352c; --quote-accent:#27634e; --quote-line:#d6e7df; --quote-surface:#edf7f1; --quote-table:#27634e; --quote-table-text:#fff; --quote-total:#e1f2e8; --quote-total-text:#14352c; color:var(--quote-ink); }
.issued-paper:is([data-template="2"],[data-template="3"],[data-template="4"]) .issued-meta,
.issued-paper:is([data-template="2"],[data-template="3"],[data-template="4"]) .issued-items :is(th,td) { border-color:var(--quote-line); }
.issued-paper:is([data-template="2"],[data-template="3"],[data-template="4"]) .issued-party-label { color:var(--quote-accent); }
.issued-paper:is([data-template="2"],[data-template="3"],[data-template="4"]) .issued-parties section { background:var(--quote-surface); }
.issued-paper:is([data-template="2"],[data-template="3"],[data-template="4"]) .issued-items th { color:var(--quote-table-text); background:var(--quote-table); }
.issued-paper:is([data-template="2"],[data-template="3"],[data-template="4"]) .issued-total { color:var(--quote-total-text); background:var(--quote-total); }
.issued-paper[data-template="2"] > header { border-top:2px solid #333; }
.issued-paper[data-template="2"] :is(.issued-total,.issued-parties section) { border-radius:0; }
.issued-paper[data-template="3"] > header { border-top:8px solid #142c4a; }
.issued-paper[data-template="4"] > header { border-top-color:#27634e; }
.quote-layout { container-type:inline-size; }
.quote-layout .quote-title { min-width:0; }
.quote-layout .quote-title small { display:block; font-size:11px; font-weight:750; }
.quote-layout .quote-title h2 { line-height:1.18; letter-spacing:-.025em; }
.quote-layout .quote-dates p { margin:0; font-size:12px; }
.quote-layout .quote-party-details p { font-size:12px; }
.quote-layout .quote-party-details b { font-weight:650; }

.quote-layout[data-template="2"] > .quote-editorial-head { display:grid; justify-items:center; justify-content:stretch; gap:5px; padding-top:10px; margin-bottom:8px; text-align:center; }
.quote-layout .quote-editorial-head img { max-width:90px; max-height:32px; }
.quote-layout[data-template="2"] .quote-dates { justify-content:center; border-top:0; }
.quote-layout[data-template="2"] .quote-parties { grid-template-columns:minmax(0,1fr); gap:0; }
.quote-layout[data-template="2"] .quote-party { display:grid; grid-template-columns:72px minmax(0,1fr); gap:7px; padding:7px 0; border-bottom:1px solid var(--quote-line); background:transparent; }
.quote-layout[data-template="2"] .quote-party h3 { margin-top:0; }
.quote-layout[data-template="2"] .quote-party-details { display:flex; gap:0 9px; flex-wrap:wrap; }
.quote-layout[data-template="2"] .issued-items th { border-block:1px solid #333; background:transparent; }
.quote-layout[data-template="2"] .quote-closing { display:grid; grid-template-columns:minmax(0,1fr) minmax(0, .8fr); gap:12px; align-items:start; margin-top:12px; }
.quote-layout[data-template="2"] .quote-closing:has(.quote-amounts[hidden]) { grid-template-columns:minmax(0,1fr); }
.quote-layout[data-template="2"] .quote-closing:has(.quote-terms > img[hidden]):not(:has(.quote-terms p:not([hidden]))) { grid-template-columns:minmax(0,1fr); }
.quote-layout[data-template="2"] .quote-terms { display:grid; gap:5px; margin:0; }
.quote-layout[data-template="2"] .quote-amounts { justify-self:end; width:min(100%,210px); display:grid; gap:4px; margin:0; padding:0; background:transparent; text-align:right; }
.quote-layout[data-template="2"] .quote-amounts strong { border-top:2px solid #333; padding-top:6px; }

.quote-layout[data-template="3"] > .quote-letter-head { align-items:center; flex-wrap:nowrap; padding:12px 13px; border:0; border-radius:7px 7px 0 0; margin:0; color:white; background:#142c4a; }
.quote-layout .quote-letter-head small { color:#bcebe3; }
.quote-layout .quote-letter-head img { max-width:92px; max-height:43px; padding:5px; border-radius:4px; background:#fff; }
.quote-layout[data-template="3"] .quote-dates { justify-content:flex-end; padding-inline:8px; background:#edf4fa; }
.quote-layout[data-template="3"] .quote-party { border:1px solid var(--quote-line); border-radius:5px; background:#fff; }
.quote-layout[data-template="3"] .issued-items tbody tr:nth-child(even) { background:#f1f6fa; }
.quote-layout[data-template="3"] .quote-amounts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); padding:0; overflow:hidden; gap:0; background:#edf4fa; color:#162b43; }
.quote-layout[data-template="3"] .quote-amounts > span { padding:6px 9px; }
.quote-layout[data-template="3"] .quote-amounts strong { grid-column:1/-1; display:flex; flex-wrap:wrap; justify-content:space-between; gap:5px; padding:8px 9px; background:#12645e; color:#fff; }
.quote-layout[data-template="3"] .quote-terms { padding-top:7px; border-top:1px solid var(--quote-line); }

.quote-layout[data-template="4"] > .quote-summary-head { display:grid; grid-template-columns:minmax(0,1fr) minmax(135px,.84fr); gap:12px; align-items:start; padding-top:8px; margin-bottom:9px; }
.quote-layout[data-template="4"] > .quote-summary-head:has(.quote-amounts[hidden]) { grid-template-columns:minmax(0,1fr); }
.quote-layout .quote-summary-title img { max-width:85px; max-height:30px; margin-bottom:3px; }
.quote-layout[data-template="4"] .quote-amounts { display:flex; flex-direction:column; align-items:stretch; gap:2px; margin:0; padding:7px 9px; border-left:4px solid #27634e; border-radius:0 8px 8px 0; }
.quote-layout[data-template="4"] .quote-amounts strong { order:-1; display:grid; border-bottom:1px solid #bcd8c9; padding-bottom:4px; }
.quote-layout[data-template="4"] .quote-amounts strong > span:first-child { font-size:11px; }
.quote-layout[data-template="4"] .quote-breakdown,.quote-layout[data-template="4"] .quote-vat-note { font-size:11px; }
.quote-layout[data-template="4"] .quote-party { border-left:3px solid #87b79d; border-radius:0 8px 8px 0; }
.quote-layout[data-template="4"] .issued-items { border-collapse:separate; border-spacing:0 4px; }
.quote-layout[data-template="4"] .issued-items th { color:#27634e; background:transparent; border:0; }
.quote-layout[data-template="4"] .issued-items td { background:#f1f7f3; border:0; }
.quote-layout[data-template="4"] .issued-items td:first-child { border-radius:5px 0 0 5px; }
.quote-layout[data-template="4"] .issued-items td:last-child { border-radius:0 5px 5px 0; }
.quote-layout[data-template="4"] .quote-terms { padding:6px 8px; border:1px solid var(--quote-line); border-radius:7px; }
.quote-layout .quote-amounts[hidden],.quote-layout .quote-terms:has(> img[hidden]):not(:has(p:not([hidden]))) { display:none; }
@container (max-width:340px) {
  .quote-layout[data-template="4"] > .quote-summary-head,
  .quote-layout[data-template="2"] .quote-closing { grid-template-columns:minmax(0,1fr); }
  .quote-layout .quote-letter-head img { max-width:67px; }
}
.settings-workspace:has(.settings-split) { max-width:1440px; }
.settings-split { display:grid; grid-template-columns:minmax(0,1.18fr) minmax(0,1fr); gap:12px; align-items:stretch; }
.settings-split:has(>aside[hidden]) { grid-template-columns:minmax(0,1fr); }
.settings-split:has(>aside[hidden]) .settings-stack { max-width:960px; }
.settings-stack { display:grid; align-content:start; gap:12px; min-width:0; }
#settings-side-slot:not([hidden]) { display:grid; min-width:0; }
#settings-side-slot > .panel { min-width:0; margin:0; }
.shop-menu:has([data-switch-business]) { max-height:min(66vh,440px); overflow:auto; }
.login-security-card { container-type:inline-size; overflow:hidden; }
.login-security-card > .panel-header { gap:12px; }
.login-security-heading { display:flex; align-items:center; gap:12px; min-width:0; }
.login-security-heading > div { min-width:0; }
.login-security-mark { display:grid; place-items:center; flex:none; width:40px; height:40px; border-radius:10px; color:var(--accent-dark); background:var(--accent-soft); }
.login-security-mark .od-icon { width:22px; height:22px; }
.login-security-card .login-identity { margin:3px 0 0; color:var(--muted); font-size:13px; overflow-wrap:anywhere; }
.login-security-card .login-identity b { margin-left:3px; color:var(--ink); }
.login-password-body { display:grid; gap:11px; padding:14px 18px; }
.login-password-body h3 { margin:0; font-size:16px; }
.login-password-body h3 + p { margin:3px 0 0; color:var(--muted); font-size:13px; }
.login-password-body .secret-field label { font-size:14px; font-weight:650; }
.login-password-body .secret-control input { min-height:42px; padding-inline-end:44px; }
.login-password-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; gap:12px; }
.login-password-rules { padding:9px 12px; border:1px solid var(--line); border-radius:9px; background:var(--ground); }
.login-password-rules strong { font-size:13px; }
.login-password-rules ul { gap:4px 6px; margin:5px 0 0; }
.login-password-rules li { padding:3px 7px; border:1px solid var(--line); border-radius:6px; background:var(--paper); }
.login-password-rules li[data-met="true"] { color:var(--accent-dark); border-color:var(--accent); background:var(--accent-soft); }
.login-password-rules .password-feedback { display:block; margin-top:4px; }
.login-password-rules .password-feedback:empty,.login-security-actions p:empty { display:none; }
.login-security-actions { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:8px; padding:9px 18px; border-top:1px solid var(--line); background:var(--ground); }
.login-security-actions p { margin:0 auto 0 0; }
@container (max-width:460px) {
  .login-password-pair { grid-template-columns:minmax(0,1fr); }
  .login-password-body,.login-security-actions { padding-inline:14px; }
}
.login-security-options { display:grid; grid-template-columns:1fr auto; align-items:start; gap:10px; padding:10px 15px; border-top:1px solid var(--line); }
.login-security-options summary { cursor:pointer; padding:8px 0; font-weight:650; }
.login-security-options details form { padding-inline:0; }
.auth-motion { position:absolute; inset:0; overflow:hidden; pointer-events:none; display:none; }
#auth-overlay[data-mode="login"] { background:radial-gradient(ellipse at 50% 52%,#17243e 0%,#0b1428 54%,#070c18 100%); }
#auth-overlay[data-mode="login"] .auth-motion { display:block; }
.auth-motion > div { position:absolute; width:max(0px,calc((100% - 526px)/2)); height:min(72vh,700px); overflow:hidden; }
.auth-motion > div:first-child {
  inset:auto auto 0 0;
  mask-image:radial-gradient(ellipse 100% 100% at left bottom,#000 28%,#000b 56%,#0004 78%,transparent 96%);
}
.auth-motion > div:last-child {
  inset:0 0 auto auto;
  mask-image:radial-gradient(ellipse 100% 100% at right top,#000 28%,#000b 56%,#0004 78%,transparent 96%);
}
.auth-motion video { width:100%; height:100%; object-fit:cover; }
.auth-motion > div:last-child video { transform:scale(-1); }
#auth-overlay .auth-card { position:relative; z-index:1; }
@property --auth-wipe-edge { syntax:"<percentage>"; inherits:true; initial-value:-17%; }
#auth-overlay.auth-entry-bands {
  overflow:hidden;
  mask-image:linear-gradient(135deg,transparent var(--auth-wipe-edge),#000 var(--auth-wipe-edge));
}
#auth-overlay.auth-entry-bands::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:linear-gradient(135deg,
    transparent var(--auth-wipe-edge),
    #5686ff var(--auth-wipe-edge) calc(var(--auth-wipe-edge) + 4%),
    #284acb calc(var(--auth-wipe-edge) + 4%) calc(var(--auth-wipe-edge) + 10%),
    #172e71 calc(var(--auth-wipe-edge) + 10%) calc(var(--auth-wipe-edge) + 17%),
    transparent calc(var(--auth-wipe-edge) + 17%));
}
.sidebar .studio-wordmark img { width:min(100%,154px); height:auto; object-fit:contain; }
[data-theme="dark"] .sidebar .studio-wordmark img { padding:5px 7px; border-radius:7px; background:#ecf1ff; }
.settings-workspace:has(.subscription-grid) { max-width:1440px; }
.subscription-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; align-items:stretch; }
.subscription-admin { grid-template-columns:minmax(260px,1fr) minmax(0,1.5fr); }
.subscription-card { min-width:0; }
.subscription-card .panel-body { padding:14px 16px; }
.subscription-card .panel-body > h3,.subscription-dialog-info h3 { margin:13px 0 7px; font-size:14px; }
.subscription-facts { display:grid; gap:0; margin:0 0 12px; }
.subscription-facts > div { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:10px 0; border-bottom:1px solid var(--line); }
.subscription-facts dt { color:var(--muted); font-size:13px; }
.subscription-facts dd { margin:0; font-size:15px; font-weight:750; font-variant-numeric:tabular-nums; }
.subscription-rows { list-style:none; margin:0; padding:0; max-height:min(38vh,360px); overflow:auto; }
.subscription-rows li { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:8px; padding:9px 0; border-bottom:1px solid var(--line); }
.subscription-rows strong { display:block; font-size:14px; overflow-wrap:anywhere; }
.subscription-rows small { display:block; margin-top:2px; color:var(--muted); font-size:12px; }
.subscription-rows strong > small { display:inline; }
.subscription-value { text-align:right; font-variant-numeric:tabular-nums; }
.subscription-value .credit-add { color:var(--accent-dark); }
.subscription-feedback { margin:7px 0; color:var(--accent-dark); font-size:13px; }
.subscription-feedback:empty { display:none; }
.subscription-admin > .subscription-feedback { grid-column:1/-1; }
.subscription-dialog-info > .btn { margin-top:12px; }
.subscription-card [data-subscription-request] + p { margin-top:8px; }
.subscription-request-status .badge { white-space:nowrap; }
@media (max-width:800px) {
  .subscription-grid,.subscription-admin { grid-template-columns:minmax(0,1fr); }
  #auth-overlay[data-mode="login"] .auth-card { max-height:calc(100dvh - 138px); }
  .auth-motion > div { width:100%; height:min(64px,10vh); }
  .auth-motion > div:first-child { mask-image:linear-gradient(to top,#000,transparent); }
  .auth-motion > div:last-child { mask-image:linear-gradient(to bottom,#000,transparent); }
}
@media (max-height:560px) {
  #auth-overlay[data-mode="login"] .auth-motion { display:none; }
  #auth-overlay[data-mode="login"] .auth-card { max-height:calc(100dvh - 40px); }
}
.mail-guide-card > .panel-body { min-width:0; }
.mail-guide-card .mail-guide-webp { width:100%; max-height:560px; object-fit:contain; object-position:top center; }
.doc-item-controls .doc-amount-options { position:relative; margin-left:auto; }
.doc-amount-options[open] { flex-basis:100%; }
.doc-amount-options .doc-field-options { margin:6px 0 0; }
@media (min-width:1100px) {
  .settings-stack .setting-row { padding-block:8px; }
  .settings-split .business-fields,.settings-split .business-brands { padding-block:8px; }
  .settings-split .business-profile-list { max-height:185px; overflow:auto; }
  .settings-split #business-profile-form { gap:8px; }
  .settings-split .settings-stack :is(.form-stack,.field-pair) { gap:9px; }
  .settings-split .settings-stack .field-pair { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .account-settings-split .settings-stack .panel > .panel-header { min-height:50px; padding-block:8px; }
  .account-settings-split .settings-stack .panel > .form-stack { padding-block:9px; }
  .account-settings-split .settings-stack input:not([type="checkbox"]) { min-height:38px; padding-block:7px; }
  .settings-split .business-fields label,
  .settings-split #business-profile-form > label:not(.checkbox-line) { gap:4px; line-height:1.35; }
  .settings-split :is(.business-fields,#business-profile-form) :is(input:not([type="checkbox"],[type="file"]),select) {
    min-height:38px;
    padding-block:7px;
  }
}
@media (max-width:900px) {
  .settings-split { grid-template-columns:minmax(0,1fr); }
}
#transaction-dialog { width:min(790px,calc(100vw - 20px)); }
#transaction-dialog .dialog-body { padding-block:6px; }
#transaction-dialog .dialog-footer { padding-block:6px; }
#transaction-form .transaction-columns > section { gap:5px; }
#transaction-form .field > label { font-size:14px; }
#transaction-form :is(input:not([type=checkbox]),select) { min-height:32px; padding-block:3px; }
#transaction-form #tx-content { min-height:32px; }
#document-deal-dialog { width:min(680px,calc(100vw - 22px)); max-height:calc(100dvh - 22px); }
#document-deal-form label { display:grid; gap:4px; min-width:0; }
#document-deal-form label.checkbox-line { display:flex; }
#document-deal-form :is(input:not([type=checkbox]),select,textarea) { width:100%; min-width:0; }
.deal-section { border:1px solid var(--line); border-radius:11px; padding:9px 12px; min-width:0; display:grid; gap:8px; }
.deal-section legend { font-weight:750; padding-inline:4px; }
.deal-total-grid,.member-credit-overview { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; }
.deal-total-grid > div,.member-credit-overview > div { display:grid; gap:3px; min-width:0; padding:6px 8px; background:var(--ground); border-radius:7px; overflow-wrap:anywhere; }
.deal-total-grid small,.deal-balance small,.member-credit-overview small,.member-credit-history small { color:var(--muted); }
.deal-total-grid > div:last-child,.deal-balance strong { color:var(--accent-dark); }
.deal-balance { display:grid; align-content:center; gap:4px; }
.deal-extra { padding:7px 9px; border:1px solid var(--line); border-radius:8px; }
.deal-extra > summary { cursor:pointer; }
.member-credit-overview { grid-template-columns:repeat(2,minmax(0,1fr)); }
.member-credit-section { border-top:1px solid var(--line); padding-top:10px; }
.member-credit-section h3 { margin:0 0 6px; }
.member-credit-history { max-height:240px; overflow:auto; }
.member-credit-history > div { display:flex; justify-content:space-between; gap:10px; padding:6px; border-bottom:1px solid var(--line); }
.member-credit-history span { display:grid; gap:2px; }
.member-credit-history span:last-child { text-align:right; }
#mail-guide-dialog { width:min(780px,calc(100vw - 24px)); }
@media(max-width:520px) {
  #auth-overlay[data-mode=signup] .auth-card { padding:16px; }
  .signup-grid { gap:7px 9px; }
  .signup-grid .erp-button-row .btn { flex:1; }
}