/* Shared viewport typography; keep navigation and icon geometry independent. */
.mobile-nav,.admin-nav { grid-template-columns:none!important; grid-auto-flow:column; grid-auto-columns:minmax(0,1fr); }
#audiblePage { display:none; }
body.audible-page .container { display:none!important; }
body.audible-page #audiblePage { display:block; padding:16px; min-height:60vh; }
.audible-filter { display:flex; align-items:center; gap:10px; margin:12px 0; }
.audible-filter select { padding:8px; border:1px solid #cbd5e1; border-radius:9px; background:#fff; font:inherit; }
.audible-entry { display:block; width:100%; margin:10px 0; padding:14px; border:1px solid #d5dfef; border-radius:12px; background:#fff; text-align:left; color:#1f2937; font:inherit; font-size:var(--page-text); cursor:pointer; }
.audible-entry span { display:inline-block; margin:0 10px; padding:4px 8px; border-radius:12px; background:#eff6ff; color:#2563eb; font-size:var(--page-small); }
.audible-entry p { display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.6; margin:10px 0 0; }
#audibleModal .edit-modal-card { width:min(760px,calc(100vw - 24px)); max-height:90dvh; overflow:auto; }
#audibleModal .edit-field { display:block; margin-bottom:12px; }
#audibleModal .edit-modal-input { display:block; width:100%; box-sizing:border-box; padding:10px 12px; border:1px solid #cbd5e1; border-radius:10px; background:#fff; color:#1f2937; font:inherit; }
#audibleTranscript { min-height:280px; height:40vh; resize:vertical; line-height:1.6!important; }
@media(max-width:600px) { body.audible-page #audiblePage { padding:10px; } #audibleTranscript { min-height:200px; } }
.budget-brand-heading { display:flex; align-items:center; gap:8px; min-width:0; }
.budget-brand-heading img { display:block; flex:0 0 auto; width:clamp(28px,2.8vw,36px); height:auto; border-radius:7px; }
#stocksSection .stocks-head .stock-links-edit-toggle,#stocksSection .stock-delete,#stocksSection .stocks-head > span:last-child { display:none!important; }
#stocksSection .stock-config-heading,#stocksSection .stock-config-cell { display:none!important; }
#stocksSection .stock-legacy-config-price, #stocksSection .stock-money:has(.stock-config-price) { display:none!important; }
#stocksSection .stocks-head,#stocksSection .stock-row { font-size:var(--page-text)!important; min-width:72.5em; grid-template-columns:3.5em 8em minmax(15em,1fr) 9em 4em 4em repeat(2,8.5em) 12em!important; }
#stocksSection .stock-row { cursor:pointer; }
#stocksSection .stock-row input,#stocksSection .stock-row select,#stocksSection .stock-config-edit { pointer-events:none; }
#stocksSection .stock-row .stock-supplier-name.has-link { pointer-events:auto; }
#stocksSection .new-stock-editing .stock-name { pointer-events:auto; }
#stocksSection .new-stock-editing .stock-name:not([readonly]) { border:0!important; outline:none!important; box-shadow:none!important; border-radius:0!important; background:transparent!important; }
#stocksSection .stock-supplier-name.has-link:focus-visible { outline:2px solid #2563eb; outline-offset:-2px; }
#stocksSection .stock-row:focus-visible { outline:2px solid #2563eb; outline-offset:-2px; }
.stock-row-modal .edit-modal-card { width:min(94vw,clamp(360px,36vw,620px)); max-height:calc(100dvh - 24px); overflow-y:auto; box-sizing:border-box; padding:clamp(12px,1vw,20px); font-size:clamp(13px,.9vw,16px); }
.stock-modal-fields { display:grid; grid-template-columns:minmax(0,1fr); gap:7px; }
.stock-modal-fields .edit-field { min-width:0; margin:0; display:grid; gap:3px; }
.stock-modal-fields .edit-modal-input { display:block; width:100%; box-sizing:border-box; min-width:0; min-height:34px; padding:6px 9px; border:1px solid #cbd5e1; border-radius:8px; font:inherit; }
.stock-row-modal { z-index:2000; padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left)); overflow:hidden; }
.stock-row-modal .edit-modal-card { display:grid; grid-template-rows:auto minmax(0,1fr) auto; overflow:hidden; max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); }
.stock-modal-body { min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:2px 5px 4px 0; }
.stock-row-modal .edit-modal-actions { position:static; background:white; padding:10px 0 0; margin-top:8px; border-top:1px solid #e2e8f0; }
body:has(.stock-row-modal) { overflow:hidden; }
.stock-photo-field { display:grid; gap:6px; margin-top:10px; }
.stock-photo-field label { display:grid; gap:5px; }
.stock-photo-field input { width:100%; min-width:0; font:inherit; }
.stock-photo-field img { width:90px; height:70px; object-fit:contain; border:1px solid #dce2ea; border-radius:8px; }
.stock-photo-field button { justify-self:start; }
.stock-photo-field small { color:#64748b; }
.stock-photo-list { display:flex; flex-wrap:wrap; gap:8px; }
.stock-photo-list > div { display:grid; gap:4px; width:90px; }
.stock-photo-list img { touch-action:none; user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; cursor:grab; }
.stock-photo-list .photo-dragging { opacity:.55; }
.stock-photo-list .photo-dragging img { cursor:grabbing; }
.stock-photo-list .photo-drop-target img { outline:3px solid #2563eb; outline-offset:2px; }
.stock-photo-list img:focus-visible { outline:2px solid #2563eb; }
.stock-photo-zoom[open] { position:fixed; inset:0; margin:auto; box-sizing:border-box; display:flex; flex-direction:column; width:min(1000px,94vw); height:88dvh; max-height:88dvh; padding:16px; border:0; border-radius:12px; background:white; }
.stock-photo-zoom::backdrop { background:#000b; }
.stock-photo-zoom > img { min-height:0; flex:1; width:100%; object-fit:contain; }
.stock-photo-zoom > div { display:flex; justify-content:space-between; align-items:center; gap:8px; flex-wrap:wrap; padding-top:12px; }
.stock-photo-zoom button { padding:10px; min-height:44px; }
.variant-photo-editor img { cursor:zoom-in; }
.stock-photo-list button { font:inherit; font-size:11px; border:1px solid #cbd5e1; border-radius:5px; padding:4px; background:white; cursor:pointer; }
.stock-modal-fields textarea { resize:vertical; }
.stock-variants { border:1px solid #dce2ea; border-radius:8px; margin:10px 0; padding:10px; min-width:0; }
.stock-variants small { display:block; color:#64748b; margin-bottom:8px; }
.stock-variant-entry { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; padding:10px 0; border-bottom:1px solid #dce2ea; }
.stock-variant-entry label { min-width:0; font-size:12px; }
.stock-variant-entry input { width:100%; min-width:0; box-sizing:border-box; padding:6px; }
.stock-variants button { margin-top:6px; padding:6px 9px; }
.variant-photo-editor { grid-column:1/-1; display:grid; gap:6px; min-width:0; }
.variant-photo-editor label { display:grid; gap:5px; }
.variant-photo-editor img { width:90px; height:75px; object-fit:contain; background:white; border:1px solid #dce2ea; border-radius:7px; }
.variant-photo-editor button { justify-self:start; }
@media(max-width:600px) { .stock-modal-fields .edit-modal-input { font-size:16px; } }
@media(min-width:900px) {
 .stock-row-modal .edit-modal-card { width:min(76vw,1040px); padding:clamp(20px,2vw,32px); font-size:clamp(15px,1.05vw,18px); }
 .stock-row-modal .edit-modal-title { font-size:clamp(20px,1.5vw,26px); }
 .stock-row-modal .stock-modal-fields { gap:10px; }
 .stock-row-modal .edit-field, .stock-row-modal .stock-variant-entry label { font-size:inherit; }
 .stock-row-modal .edit-modal-input { font-size:inherit; min-height:42px; padding:9px 12px; }
 .stock-row-modal textarea.edit-modal-input { min-height:110px; }
 .stock-row-modal .stock-photo-list > div { width:clamp(104px,8vw,140px); }
 .stock-row-modal .stock-photo-list img { width:100%; height:clamp(85px,7vw,120px); }
 .stock-row-modal .stock-photo-list button { font-size:13px; padding:6px; }
 .stock-row-modal .edit-modal-actions button { font-size:15px; min-height:42px; padding:10px 18px; }
}
/* Wrapped labels determine row height instead of being clipped by fixed cells. */
#stocksSection .stocks-head, #vapeSection .vape-head,
.supplier-order-head,.vape-supplier-head { align-items:stretch; }
#stocksSection .stocks-head > span,#vapeSection .vape-head > span,
.supplier-order-head > span,.vape-supplier-head > span { height:auto!important; min-height:44px; white-space:normal; overflow-wrap:anywhere; line-height:1.3; display:flex; align-items:center; padding-top:8px; padding-bottom:8px; }
#stocksSection .stock-row { align-items:stretch; }
#stocksSection .stock-row > * { height:auto!important; min-height:38px; box-sizing:border-box; }
#stocksSection .stock-name-cell { display:flex; align-items:center; min-width:0; padding:7px; border-right:1px solid #cbd5e1; border-bottom:1px solid #cbd5e1; background:white; }
#stocksSection .stock-name-display { white-space:normal; overflow-wrap:anywhere; line-height:1.4; font-size:var(--page-text); }
#stocksSection .stock-name-cell { gap:8px; }
#stocksSection .stock-cover-thumb { width:clamp(32px,3vw,44px); height:clamp(32px,3vw,44px); flex-shrink:0; display:flex; align-items:center; justify-content:center; background:#fff; border:1px solid #e2e8f0; border-radius:5px; overflow:hidden; color:#94a3b8; font-size:8px; text-align:center; line-height:1.2; }
#stocksSection .stock-cover-thumb img { display:block; width:100%; height:100%; object-fit:contain; }
#stocksSection .stock-name-cell input { width:100%; min-width:0; border:0; padding:0; background:transparent; }
#stocksSection .stock-name-cell:has(input[readonly]) input { display:none; }
#stocksSection .stock-name-cell:has(input:not([readonly])) .stock-name-display { display:none; }
#stocksSection .stock-row.no-stock .stock-name-display { color:#94a3b8; }
#stocksSection .stock-row .stock-money { display:flex; align-items:center; }
#stocksSection .stock-row .stock-net { display:flex; flex-direction:column; justify-content:center; }
#stocksSection .stock-money input { width:100%; min-width:0; box-sizing:border-box; padding:6px 8px; }
#stocksSection .stock-net { min-width:0; padding:6px 8px; text-align:right; }
#stocksSection .stock-net > span { max-width:100%; white-space:normal; overflow-wrap:anywhere; line-height:1.4; }
#stocksSection .stocks-head > span { overflow-wrap:normal; }
#stocksSection .stock-link-head,#stocksSection .stock-item-head,#stocksSection .stock-supplier-name-head { padding-right:6px!important; }
:root { --page-text:clamp(11px,1vw,16px); --page-small:clamp(10px,.85vw,14px); --page-heading:clamp(15px,1.3vw,21px); }
.container,.wrap { min-width:0; max-width:100%; }
.card-title,.bank-title-row h2,.vpn-title-row h2,.portal-title-row h2,.card h2 { font-size:var(--page-heading); }
#stocksSection .stock-row input,#stocksSection .stock-row select,
#vapeSection .vape-row input,.supplier-order-row > *, .vape-supplier-row > *,
.portal-row,.vpn-month,.payment-account-name,.payment-account-number,
.task-table td,.user-row,.field input { font-size:var(--page-text)!important; }
.stock-config-edit,.stock-net-total,.stock-net-unit,.vape-net-total,.vape-net-unit,
.portal-link,.portal-edit,.stock-copy,.vape-copy,.stocks-head,.supplier-order-head,
.vape-head,.vape-supplier-head,.portal-head,.field,.card-note,.page-head p { font-size:var(--page-small)!important; }
/* Stock actions and totals should be as readable as the item and price text. */
#stocksSection .stock-copy,#stocksSection .stock-link-open,#stocksSection .stock-net-total { font-size:var(--page-text)!important; }
#stocksSection .stock-copy { padding:2px; }
#stocksSection .stock-copy.copied { font-size:var(--page-small)!important; }
.edit-modal .edit-modal-input { font-size:clamp(13px,1vw,16px); }
.login-card .brand h1 { font-size:clamp(18px,1.5vw,24px)!important; }
.login-card .brand p,.login-card .notice,.login-card .error,.login-card .submit { font-size:clamp(12px,1vw,16px); }
.login-card .field input,.profile-grid .field input { font-size:clamp(14px,1vw,16px)!important; }
.modal input,.modal select,.modal textarea { font-size:clamp(13px,1vw,16px); }
.vape-transaction-row > * { font-size:var(--page-text)!important; }
#stocksSection .stock-row,#vapeSection .vape-row { min-height:36px; }
@media(min-width:1100px) {
 .user-row button,.save,.add-btn,.bank-add-btn,.portal-add { font-size:var(--page-small); }
 .task-table td,.vape-transaction-row > * { font-size:var(--page-text); }
 #stocksSection .stock-row > *,#vapeSection .vape-row > * { min-height:38px; }
}
@media(max-width:760px) {
 .card,.section-card,.wrap,.container { min-width:0; }
 .page-head,.bank-title-row,.stocks-title-row,.stock-tools { flex-wrap:wrap; gap:7px; }
 .stock-tools,.stocks-total,.supplier-order-total,.vape-supplier-total { min-width:0!important; }
 #stocksSection .stocks-head,#stocksSection .stock-row { width:100%; min-width:72.5em; }
 #stocksSection .stock-row > *,#vapeSection .vape-row > * { min-width:0; }
 #vapeSection .vape-head,#vapeSection .vape-row { width:100%; min-width:580px; grid-template-columns:28px 35px minmax(135px,1fr) 35px 80px 85px 100px 25px; }
 .supplier-order-head,.supplier-order-row { min-width:430px; grid-template-columns:35px 65px minmax(140px,1fr) 90px 100px; }
 .vape-supplier-head,.vape-supplier-row { min-width:430px; grid-template-columns:35px 65px minmax(140px,1fr) 90px 100px; }
 .portal-head,.portal-row { min-width:360px; grid-template-columns:minmax(100px,1fr) 42px 80px 90px 42px; }
 .stock-order-info { display:flex; flex-wrap:wrap; gap:8px; }
 #stockOrderAddress,.stock-order-info input { max-width:100%; }
 .profile-grid,.permissions { min-width:0; }
 .user-row { overflow-wrap:anywhere; }
 .edit-modal .edit-modal-card { max-width:calc(100vw - 24px); }
}
/* Save warnings stay visible in every budget view without covering the editor. */
#globalBudgetSaveStatus { margin-right:auto; padding-right:10px; font-size:clamp(10px,.9vw,13px); line-height:1.3; min-width:0; }
#budgetSaveNotice { position:fixed; z-index:2500; bottom:calc(78px + env(safe-area-inset-bottom)); left:12px; right:12px; width:fit-content; max-width:calc(100% - 24px); margin:auto; padding:12px; display:flex; align-items:center; flex-wrap:wrap; gap:8px; border:1px solid #f5c56a; border-radius:12px; background:#fff8e8; color:#713f12; box-shadow:0 4px 18px #0002; font:13px/1.4 Arial,sans-serif; }
#budgetSaveNotice[hidden], #budgetSaveNotice [hidden] { display:none!important; }
#budgetSaveNotice span { flex:1 1 300px; }
#budgetSaveNotice button, #budgetSaveNotice a, .budget-load-error button { padding:8px 10px; border:1px solid #cbd5e1; border-radius:8px; background:#fff; color:#1e40af; cursor:pointer; font:inherit; }
.budget-load-error { position:fixed; inset:0; z-index:10000; display:grid; place-items:center; padding:24px; background:#eef5fc; }
.budget-load-error > div { max-width:440px; padding:24px; border-radius:14px; background:#fff; box-shadow:0 4px 20px #0001; font:16px/1.5 Arial,sans-serif; }
body.app-loading > .budget-load-error { visibility:visible!important; }
button, a, [role="button"], input, select, textarea { touch-action:manipulation; }