:root{--ink:#17231f;--muted:#68746e;--line:#dde5df;--paper:#fffefa;--wash:#f3f7f3;--green:#176b50;--green-dark:#0e503a;--cream:#f7f3ea;--red:#b94c4c}*{box-sizing:border-box}html.app-booting .topbar,html.app-booting main,html.app-booting .site-footer{visibility:hidden}body{margin:0;background:var(--wash);color:var(--ink);font-family:ui-rounded,"SF Pro Rounded","Noto Sans Thai",system-ui,sans-serif;font-size:15px}.topbar{height:70px;background:rgba(255,254,250,.94);border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 max(24px,calc((100vw - 1180px)/2));gap:34px;position:sticky;top:0;z-index:5;backdrop-filter:blur(14px)}.brand{color:var(--ink);font-weight:800;text-decoration:none;white-space:nowrap;font-size:17px}.brand span{background:var(--green);color:white;border-radius:9px;padding:5px 8px;margin-right:7px}nav{display:flex;gap:5px;flex:1}.nav-link{padding:9px 12px;border-radius:8px;text-decoration:none;color:var(--muted);font-weight:650}.nav-link.active,.nav-link:hover{background:#e7f0e9;color:var(--green-dark)}button,input,select,textarea{font:inherit}button{cursor:pointer}.shell{max-width:1180px;margin:0 auto;padding:48px 24px 70px}.page-heading,.section-heading,.dialog-heading,.heading-actions{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}.page-heading{margin-bottom:28px}.page-heading h1{font-size:34px;letter-spacing:-1px;margin:3px 0 5px}.eyebrow{text-transform:uppercase;letter-spacing:1.3px;font-size:11px;font-weight:800;color:var(--green);margin:0}.muted{color:var(--muted);margin:0;line-height:1.55}.heading-actions{align-items:center}.select-label{font-weight:650;color:var(--muted)}select,input,textarea{border:1px solid var(--line);border-radius:9px;background:white;color:var(--ink);padding:10px 11px}select:focus,input:focus,textarea:focus{outline:3px solid #bce4d0;border-color:var(--green)}.primary,.secondary{border-radius:9px;border:1px solid transparent;padding:10px 14px;font-weight:750}.primary{background:var(--green);color:white}.primary:hover{background:var(--green-dark)}.secondary{background:white;border-color:var(--line);color:var(--ink)}.secondary:hover{background:var(--cream)}.compact{padding:8px 11px}.summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;margin-bottom:18px}.summary-card,.panel{background:var(--paper);border:1px solid var(--line);border-radius:15px;box-shadow:0 1px 1px rgba(20,40,30,.02)}.summary-card{padding:20px}.summary-card p{color:var(--muted);font-weight:600;margin:0 0 10px}.summary-card strong{display:block;font-size:25px;letter-spacing:-.8px;margin-bottom:8px}.summary-card small{color:var(--muted)}.summary-card.accent{background:var(--green);color:white;border-color:var(--green)}.summary-card.accent p,.summary-card.accent small{color:#d6ecdf}.panel{padding:22px;margin-bottom:18px}.section-heading{align-items:center;margin-bottom:18px}.section-heading h2{font-size:18px;margin:0 0 3px}.text-link{color:var(--green);font-weight:750;text-decoration:none}.button-link{border:0;background:none;padding:0}.bar-chart{height:205px;display:flex;gap:8px;align-items:end;border-bottom:1px solid var(--line);padding:10px 3px 0}.bar-wrap{height:100%;flex:1;display:flex;flex-direction:column;justify-content:end;align-items:center;min-width:20px}.bar{width:min(100%,42px);background:linear-gradient(#48a47e,var(--green));border-radius:6px 6px 0 0;min-height:2px}.bar-label{font-size:11px;color:var(--muted);padding-top:7px}.bar-value{font-size:10px;color:var(--green-dark);font-weight:700;margin-bottom:4px;white-space:nowrap}.recent-list{display:grid;gap:8px}.recent-item{display:grid;grid-template-columns:100px 1fr auto;gap:16px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}.recent-item:first-child{border-top:0}.recent-item strong{display:block}.recent-item small{color:var(--muted)}.amount{font-variant-numeric:tabular-nums;font-weight:750;white-space:nowrap}.filters{display:flex;gap:10px;padding:15px;margin-bottom:18px}.filters input{flex:1;min-width:220px}.table-panel{padding:0;overflow:hidden}.table-panel>.section-heading{padding:16px 20px;margin:0}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;min-width:780px}th,td{text-align:left;padding:13px 20px;border-top:1px solid var(--line)}th{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.5px;background:#fbfcfa}.number{text-align:right}td.number{text-align:right}.job-cell strong{display:block}.job-cell small{color:var(--muted)}.status{border-radius:99px;padding:4px 8px;font-size:11px;font-weight:750;display:inline-block;white-space:nowrap}.status.good{background:#e0f2e7;color:#11633f}.status.wait{background:#fbf0d8;color:#875d16}.row-actions{display:flex;gap:5px}.row-actions button{border:0;background:none;color:var(--green);font-weight:750;padding:5px}.row-actions .delete{color:var(--red)}.pagination{padding:16px 20px;display:flex;justify-content:center;align-items:center;gap:15px;border-top:1px solid var(--line);color:var(--muted);font-size:13px}.hidden{display:none!important}dialog{border:0;padding:0;border-radius:16px;width:min(660px,calc(100vw - 26px));box-shadow:0 25px 80px rgba(0,0,0,.22)}dialog::backdrop{background:rgba(17,37,29,.42);backdrop-filter:blur(2px)}dialog form{padding:25px}.dialog-heading h2{margin:3px 0 0;font-size:24px}.icon-button{border:0;background:transparent;font-size:30px;line-height:1;color:var(--muted);padding:0}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin:22px 0}.form-grid label{font-weight:700;font-size:13px;display:grid;gap:6px}.form-grid input,.form-grid textarea{width:100%;font-weight:500}.form-grid .full{grid-column:1/-1}.check-label{display:flex!important;align-items:center;gap:8px;align-self:end;padding:11px 0}.check-label input{width:auto!important}.dialog-actions{display:flex;justify-content:flex-end;gap:9px;border-top:1px solid var(--line);padding-top:18px}.upload-box{display:block;border:2px dashed #b9ccc0;border-radius:11px;background:#f9fcf9;padding:25px;text-align:center;color:var(--green);font-weight:750;margin:20px 0}.upload-box input{display:block;margin:12px auto 0;border:0;background:transparent}.empty-state{text-align:center;padding:35px;color:var(--muted)}.empty-state strong{color:var(--ink);display:block;margin-bottom:5px}#toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%) translateY(80px);background:var(--ink);color:white;padding:11px 15px;border-radius:9px;transition:.25s;z-index:9;box-shadow:0 8px 25px #0004}#toast.show{transform:translateX(-50%) translateY(0)}
@media(max-width:780px){.topbar{padding:0 15px;gap:10px}.brand{font-size:0}.brand span{font-size:17px;margin:0}.topbar nav{justify-content:center}.shell{padding:30px 15px 55px}.page-heading h1{font-size:28px}.summary-grid{grid-template-columns:1fr 1fr}.summary-card{padding:15px}.summary-card strong{font-size:20px}.filters{flex-direction:column}.filters input,.filters select,.filters button{width:100%}.recent-item{grid-template-columns:75px 1fr;gap:8px}.recent-item .amount{grid-column:2}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}.heading-actions{gap:8px}.heading-actions .secondary{font-size:0}.heading-actions .secondary:after{content:'นำเข้า';font-size:14px}.page-heading>.primary{display:none}}
.form-grid select{width:100%;font-weight:500}
.preview-dialog{padding:25px}.preview-summary{display:flex;justify-content:space-between;gap:15px;align-items:center;border:1px solid #b9d7c5;background:#f1f8f3;border-radius:11px;padding:13px 14px;margin:22px 0 15px}.preview-summary strong{font-size:16px}.preview-summary span{font-size:12px;font-weight:750;color:var(--green-dark)}.preview-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.preview-grid>div{border:1px solid var(--line);border-radius:9px;padding:11px 12px;display:grid;gap:4px}.preview-grid span,.preview-notes>span{font-size:11px;color:var(--muted);font-weight:700}.preview-grid strong{font-size:14px}.preview-grid .preview-net{background:#eff8f1;border-color:#a8ceb5}.preview-grid .preview-net strong{font-size:18px;color:var(--green-dark)}.preview-notes{margin-top:14px;border:1px solid var(--line);border-radius:9px;padding:11px 12px}.preview-notes p{white-space:pre-line;margin:5px 0 0;line-height:1.5}@media(max-width:780px){.preview-grid{grid-template-columns:1fr}}
.customer-input{position:relative}.suggestions{position:absolute;z-index:8;top:calc(100% + 5px);left:0;right:0;max-height:180px;overflow:auto;background:white;border:1px solid var(--line);border-radius:9px;box-shadow:0 9px 24px rgba(20,40,30,.15)}.suggestions button{display:block;width:100%;text-align:left;border:0;background:white;padding:10px 12px;color:var(--ink)}.suggestions button:hover{background:#e7f0e9}.money-input::-webkit-outer-spin-button,.money-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.money-input{-moz-appearance:textfield}#withholding-tax,#fee,#fee-vat,#net-amount{background:#f4f7f4;color:var(--ink)}
td small{display:block;color:var(--muted);margin-top:3px}
.top-fields{margin-bottom:16px}.form-section{border-top:1px solid var(--line);padding:18px 0 3px}.form-section h3{font-size:14px;margin:0 0 14px;color:var(--green-dark)}.money-section{background:#f7faf7;margin:0 -25px 16px;padding:18px 25px 5px;border-bottom:1px solid var(--line)}.net-field input{font-size:18px;font-weight:800}.delete-channel{display:flex;align-items:end;padding-bottom:1px}.delete-channel button{border:0;background:none;color:var(--red);font-weight:700;padding:10px 0}
.order-input{display:flex;border:1px solid var(--line);border-radius:9px;background:white;overflow:hidden}.order-input span{display:grid;place-items:center;padding:0 12px;background:#e7f0e9;color:var(--green-dark);font-weight:800;border-right:1px solid var(--line)}.order-input input{border:0!important;border-radius:0!important;outline:0!important}.fee-note{font-size:12px;margin:5px 0 12px;color:var(--muted)}
.fastwork-link-choices{padding:8px 0 1px}.fastwork-link-choices small{color:var(--muted);font-weight:600}.fastwork-link-choices div{display:flex;gap:7px;flex-wrap:wrap;margin-top:6px}.fastwork-link-choices button{border:1px solid #b9d7c5;background:#eef8f1;color:var(--green-dark);border-radius:99px;padding:5px 9px;font-size:12px;font-weight:700}.fastwork-link-choices button:hover{background:#dcefe2}
.customer-directory{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.customer-card{border:1px solid var(--line);border-radius:12px;padding:17px;background:#fff}.customer-card-top{display:flex;align-items:start;justify-content:space-between;gap:12px}.customer-card h3{font-size:17px;margin:0 0 4px}.customer-card p{margin:0;color:var(--muted);font-size:13px}.customer-edit-button{padding:6px 9px;font-size:12px}.customer-contact{margin-top:12px;padding:8px 10px;border-radius:8px;background:#f5f8f5;color:var(--muted);font-size:12px;white-space:pre-line}.customer-fastwork,.customer-orders,.customer-items{border-top:1px solid var(--line);margin-top:14px;padding-top:12px;display:grid;gap:7px}.customer-fastwork>span,.customer-orders>span,.customer-items>span{font-size:12px;font-weight:750;color:var(--muted)}.customer-fastwork>div,.customer-orders>div{display:flex;gap:7px;flex-wrap:wrap;align-items:center}.fastwork-name-chip,.order-chip{cursor:default;border:1px solid #b9d7c5;background:#eef8f1;color:var(--green-dark);border-radius:99px;padding:5px 9px;font-size:12px;font-weight:700}.order-chip{cursor:pointer;background:#f6f7f4;border-color:var(--line);color:var(--ink)}.order-chip:hover,.customer-item-link:hover,.customer-order-item:hover{border-color:#9fcab0;background:#f0f8f2}.customer-orders small{font-size:12px;color:var(--muted)}.customer-edit-name,.customer-contact-field{font-weight:700;font-size:13px;display:grid;gap:6px;margin:22px 0}.customer-edit-name input,.customer-contact-field textarea{width:100%}.customer-links-editor,.customer-order-history{border-top:1px solid var(--line);padding-top:18px;margin-bottom:22px}.customer-links-editor h3,.customer-order-history h3{font-size:15px;margin:0 0 4px;color:var(--green-dark)}.customer-links-editor>p,.customer-order-history>p{font-size:12px;margin-bottom:14px}.customer-links-editor>div,.customer-order-history>div,.customer-items>div{display:grid;gap:8px}.customer-fastwork-edit-row{font-size:13px;font-weight:700;display:grid!important;grid-template-columns:1fr auto;gap:6px 8px}.customer-fastwork-edit-row input{width:100%;grid-column:1/-1}.remove-fastwork-link{grid-column:2;border:0;background:none;color:var(--red);font-weight:750;padding:2px 0 0}.add-fastwork-link{margin-top:13px;font-size:13px;padding:8px 10px}.customer-links-editor input{width:100%}.customer-order-item,.customer-item-link{display:grid;gap:2px;border:1px solid var(--line);border-radius:8px;padding:9px 10px;background:#fff;text-align:left}.customer-order-item{cursor:pointer;width:100%}.customer-order-item strong,.customer-item-link strong{font-size:13px;color:var(--green-dark)}.customer-order-item span,.customer-item-link small{font-size:12px;color:var(--muted)}@media(max-width:780px){.customer-directory{grid-template-columns:1fr}}
#fastwork-card{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:15px;padding:18px;border:1px solid #b9d7c5;border-radius:13px;background:#fbfefb;margin-top:2px}#fastwork-card:before{content:'Fastwork';grid-column:1/-1;color:var(--green-dark);font-size:15px;font-weight:800;padding-bottom:3px}.money-section .net-field-wide{grid-column:1/-1;max-width:calc(50% - 8px);padding-top:4px}.money-section .net-field-wide input{background:#e5f3e9;border-color:#a8ceb5;color:var(--green-dark)}#fastwork-card .check-label{align-self:center;padding:8px 0}.fee-lock-note{grid-column:1/-1;color:#875d16;background:#fff4d9;border-radius:8px;padding:8px 10px;font-size:12px;font-weight:650}#fastwork-card .fee-note{grid-column:1/-1;margin:0;font-size:12px}@media(max-width:780px){#fastwork-card{grid-template-columns:1fr}.money-section .net-field-wide{max-width:none}}
dialog{max-height:calc(100dvh - 24px)}dialog form{max-height:calc(100dvh - 24px);overflow-y:auto}.form-grid textarea{resize:vertical;max-height:45dvh}.check-label.hidden{display:none!important}
.notes-resize-handle{display:none}
@media(max-width:780px){
  #transaction-dialog .notes-field{position:relative}
  #transaction-dialog #notes{min-height:96px;max-height:60dvh;padding-right:38px;padding-bottom:28px;resize:none;overflow:auto}
  #transaction-dialog .notes-resize-handle{position:absolute;right:2px;bottom:2px;z-index:1;display:block;width:34px;height:34px;cursor:ns-resize;touch-action:none}
  #transaction-dialog .notes-resize-handle:before,
  #transaction-dialog .notes-resize-handle:after{position:absolute;right:6px;height:2px;border-radius:999px;background:#7d8795;content:"";transform:rotate(-45deg);transform-origin:right center}
  #transaction-dialog .notes-resize-handle:before{bottom:10px;width:16px}
  #transaction-dialog .notes-resize-handle:after{bottom:5px;width:9px}
  html.iphone-interaction-locked #transaction-dialog #dialog-delete,
  html.iphone-interaction-locked #transaction-dialog #save-template{
    position:relative;
    display:block;
    align-self:center;
    flex:0 0 42px;
    width:42px;
    height:42px;
    min-width:42px;
    padding:0;
    border-radius:10px;
    font-size:0;
    line-height:0;
  }
  html.iphone-interaction-locked #transaction-dialog #dialog-delete{margin-right:0!important}
  html.iphone-interaction-locked #transaction-dialog #save-template{
    margin-right:0;
    border-color:#bfd0f0;
    background:#fff;
    color:#155eef;
  }
  html.iphone-interaction-locked #transaction-dialog #dialog-delete:before,
  html.iphone-interaction-locked #transaction-dialog #save-template:before{
    position:absolute;
    top:50%;
    left:50%;
    width:23px;
    height:23px;
    background:currentColor;
    content:"";
    transform:translate(-50%,-50%);
  }
  html.iphone-interaction-locked #transaction-dialog #dialog-delete:before{
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5.5 6.5h13M9 6.5l.8-2h4.4l.8 2M7.2 6.5l.7 13h8.2l.7-13M10 10v6M14 10v6' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
    mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5.5 6.5h13M9 6.5l.8-2h4.4l.8 2M7.2 6.5l.7 13h8.2l.7-13M10 10v6M14 10v6' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  }
  html.iphone-interaction-locked #transaction-dialog #save-template:before{
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 3.5h7l4 4v13H7zM14 3.5v4h4M12.5 11v5M10 13.5h5' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
    mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 3.5h7l4 4v13H7zM14 3.5v4h4M12.5 11v5M10 13.5h5' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  }
  html.iphone-interaction-locked #transaction-dialog #dialog-delete:hover{background:#fff1f1!important;border-color:#eabbbb!important}
  html.iphone-interaction-locked #transaction-dialog #save-template:hover{background:#eef4ff;border-color:#b9cdf8}
}

.transaction-mobile-card-cell{display:none}
@media(max-width:520px){
  #transactions-view #transaction-rows .transaction-card-row{
    display:block;
    padding:16px 18px 11px;
  }
  #transactions-view #transaction-rows .transaction-card-row::after{display:none}
  #transactions-view #transaction-rows .transaction-card-row>td:not(.transaction-mobile-card-cell){display:none!important}
  #transactions-view #transaction-rows .transaction-mobile-card-cell{
    display:block!important;
    width:100%;
    padding:0!important;
    border:0!important;
    background:transparent;
  }
  #transactions-view #transaction-rows .transaction-mobile-card-cell::before{display:none!important}
  #transactions-view .transaction-mobile-top{
    display:flex;
    min-width:0;
    align-items:center;
    justify-content:space-between;
    gap:10px;
  }
  #transactions-view .transaction-mobile-top time{
    flex:none;
    color:#5d6c84;
    font-size:14px;
    font-weight:700;
    line-height:1.4;
    white-space:nowrap;
  }
  #transactions-view .transaction-mobile-channel{
    display:inline-flex;
    width:max-content;
    max-width:calc(100% - 112px);
    min-height:22px;
    align-items:center;
    justify-content:flex-end;
    gap:4px;
    overflow:hidden;
    padding:3px 7px;
    border:1px solid #d9e5dc;
    border-radius:6px;
    background:#f1f5f2;
    color:#49665a;
    font-size:10px;
    font-weight:800;
    line-height:1.2;
    white-space:nowrap;
  }
  #transactions-view .transaction-mobile-channel:has(.channel-fastwork){border-color:#cbd8fb;background:#eaf0ff;color:#3156bc}
  #transactions-view .transaction-mobile-channel:has(.channel-line){border-color:#baeacb;background:#e8f9ee;color:#087b34}
  #transactions-view .transaction-mobile-channel:has(.channel-facebook){border-color:#d9c9fa;background:#f2edff;color:#7041b4}
  #transactions-view .transaction-mobile-channel:has(.channel-instagram){border-color:#f2c4da;background:#fff0f6;color:#ae256a}
  #transactions-view .transaction-mobile-channel:has(.channel-tiktok){border-color:#17191d;background:#17191d;color:#fff}
  #transactions-view .transaction-mobile-channel:has(.channel-direct){border-color:#d6dcda;background:#eff1f0;color:#343a37}
  #transactions-view .transaction-mobile-channel>.channel-chip{
    display:inline!important;
    width:auto;
    max-width:none;
    min-height:0;
    padding:0;
    border:0!important;
    border-radius:0;
    background:transparent!important;
    color:inherit!important;
    font-size:inherit;
    font-weight:inherit;
    line-height:inherit;
  }
  #transactions-view .transaction-mobile-channel>.channel-order{
    display:inline!important;
    width:auto;
    max-width:88px;
    margin:0!important;
    overflow:hidden;
    padding:0;
    color:inherit;
    font-size:inherit;
    font-weight:750;
    line-height:inherit;
    opacity:.78;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  #transactions-view .transaction-mobile-body{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:start;
    gap:12px;
    margin-top:8px;
  }
  #transactions-view .transaction-mobile-copy{
    display:grid;
    min-width:0;
    gap:4px;
  }
  #transactions-view .transaction-mobile-job{
    display:block;
    width:100%;
    min-width:0;
    overflow:hidden;
    padding:0;
    border:0;
    background:transparent;
    color:#17233a;
    font:inherit;
    font-size:16px;
    font-weight:850;
    line-height:1.5;
    text-align:left;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  #transactions-view .transaction-mobile-customer{
    overflow:hidden;
    color:#71809b;
    font-size:13px;
    line-height:1.5;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  #transactions-view .transaction-mobile-net{
    display:grid;
    min-width:98px;
    align-self:start;
    justify-items:end;
    gap:3px;
    white-space:nowrap;
  }
  #transactions-view .transaction-mobile-net>span{
    color:#7b879a;
    font-size:11px;
    font-weight:750;
    line-height:1.2;
  }
  #transactions-view .transaction-mobile-net>strong{
    color:#155eef;
    font-size:20px;
    font-weight:900;
    line-height:1.2;
  }
  #transactions-view .transaction-mobile-footer{
    display:flex;
    min-width:0;
    min-height:47px;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-top:12px;
    padding-top:15px;
    border-top:1px solid #e5ebf3;
  }
  #transactions-view .transaction-mobile-gross{
    display:flex;
    min-width:0;
    flex:1;
    align-items:center;
    flex-wrap:wrap;
    gap:2px 6px;
    color:#5d6c84;
    font-size:12px;
    font-weight:750;
    line-height:1.2;
  }
  #transactions-view .transaction-mobile-gross>span{flex:0 0 100%;white-space:nowrap}
  #transactions-view .transaction-mobile-gross>span>strong{font-size:13px;font-weight:850}
  #transactions-view .transaction-mobile-gross>.deduction-info{
    display:flex;
    flex:0 0 100%;
    min-height:0!important;
    align-items:center;
    flex-wrap:wrap;
    gap:2px 6px;
    margin:0;
    color:#74839a;
    font-size:11px;
    line-height:1.35;
  }
  #transactions-view .transaction-mobile-gross>.deduction-info span{display:inline-flex;align-items:baseline;gap:3px;white-space:nowrap}
  #transactions-view .transaction-mobile-gross>.deduction-info span+span::before{margin-right:1px;color:#a1acbc;content:'·'}
  #transactions-view .transaction-mobile-status{
    display:flex;
    flex:none;
    align-items:center;
    justify-content:flex-end;
    flex-wrap:wrap;
    gap:6px;
  }
}
.customer-order-item b{font-size:12px;color:var(--ink)}
#customers-view .page-heading{margin-bottom:18px}#customers-view .page-heading h1{font-size:28px;letter-spacing:-.5px}#customers-view .page-heading .eyebrow{display:none}#customers-view .page-heading .muted{font-size:14px}#customers-view .customer-directory-panel{padding:0;background:transparent;border:0;box-shadow:none}#customers-view .customer-directory-panel>.section-heading{margin:0 0 12px;padding:0}#customers-view .customer-directory-panel h2{font-size:16px}#customers-view .customer-directory{gap:10px}#customers-view .customer-card{padding:15px 16px;border-radius:11px;box-shadow:none}#customers-view .customer-card h3{font-size:16px;margin-bottom:2px}#customers-view .customer-card p{font-size:12px}#customers-view .customer-edit-button{padding:5px 8px;background:transparent}#customers-view .customer-contact{margin-top:10px;padding:7px 9px;font-size:11px}#customers-view .customer-fastwork{margin-top:10px;padding-top:10px;display:flex;align-items:center;gap:8px}#customers-view .customer-fastwork>span{white-space:nowrap;font-size:11px}#customers-view .fastwork-name-chip{padding:4px 7px;font-size:11px}#customers-view .customer-orders{display:none}#customers-view .customer-items{margin-top:10px;padding-top:10px}#customers-view .customer-items>span{font-size:11px}#customers-view .customer-items>div{display:block}#customers-view .customer-item-link{padding:8px 9px}#customers-view .customer-item-link:not(:first-child){display:none}#customers-view .customer-item-link strong{font-size:13px}#customers-view .customer-item-link small{font-size:11px}@media(max-width:780px){#customers-view .page-heading h1{font-size:25px}}
#customers-view .customer-items>div.customer-slide-track{display:flex;gap:8px;overflow-x:auto;padding:1px 1px 8px;scroll-snap-type:x proximity;scrollbar-width:thin}#customers-view .customer-slide-track .customer-item-link,#customers-view .customer-slide-track .customer-item-link:not(:first-child){display:grid;flex:0 0 min(250px,78vw);min-height:64px;scroll-snap-align:start}#customers-view .customer-slide-track::-webkit-scrollbar{height:7px}#customers-view .customer-slide-track::-webkit-scrollbar-thumb{background:#cbd9cf;border-radius:99px}
#customers-view .customer-directory{grid-auto-rows:250px}#customers-view .customer-card{height:250px;overflow:hidden;display:flex;flex-direction:column}#customers-view .customer-items{margin-top:auto}@media(max-width:780px){#customers-view .customer-directory{grid-auto-rows:auto}#customers-view .customer-card{height:auto;min-height:230px}}
#customers-view .customer-directory-panel>.section-heading{display:flex;align-items:end;justify-content:space-between;gap:14px}#customers-view .customer-directory-tools{width:min(270px,100%)}#customers-view .customer-directory-tools input{width:100%;height:38px;padding:0 12px;border:1px solid var(--line);border-radius:9px;background:#fff;font-size:13px;color:var(--ink)}#customers-view .customer-contact{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;white-space:normal;line-height:1.45;max-height:46px;background:#f5f8ff}@media(max-width:780px){#customers-view .customer-directory-panel>.section-heading{align-items:stretch;flex-direction:column}#customers-view .customer-directory-tools{width:100%}}
#customers-view .customer-fastwork{min-height:48px;align-items:center}#customers-view .customer-fastwork.is-empty{color:var(--muted)}#customers-view .customer-fastwork.is-empty small{font-size:11px;color:var(--muted)}
#customer-dialog{width:min(720px,calc(100vw - 26px));background:var(--paper)}#customer-dialog form{padding:0;background:var(--paper)}#customer-dialog .dialog-heading{position:sticky;top:0;z-index:2;padding:21px 26px 16px;background:var(--paper);border-bottom:1px solid var(--line)}#customer-dialog .customer-edit-name,#customer-dialog .customer-contact-field{margin:0;padding:18px 26px 0;font-size:13px}#customer-dialog .customer-contact-field{padding-bottom:18px}#customer-dialog .customer-links-editor{margin:0 26px 22px;padding:17px;border:1px solid #c8ded0;border-radius:13px;background:#f5faf6}#customer-dialog .customer-links-editor h3{font-size:16px;margin-bottom:3px}#customer-dialog .customer-links-editor>p{line-height:1.45;margin:0 0 12px}#customer-dialog .customer-fastwork-edit-row{padding:10px 11px;border:1px solid var(--line);border-radius:9px;background:#fff;align-items:center}#customer-dialog .customer-fastwork-edit-row input{padding:8px 9px}#customer-dialog .remove-fastwork-link{font-size:12px;align-self:center}#customer-dialog .add-fastwork-link{background:#fff;margin-top:10px}#customer-dialog .customer-order-history{margin:0;padding:19px 26px 22px;background:#fff;border-top:1px solid var(--line)}#customer-dialog .customer-order-history h3{font-size:16px}#customer-dialog .customer-order-history>p{margin:0 0 11px}#customer-dialog .customer-order-item{padding:11px 12px;border-radius:10px;background:#fff}#customer-dialog .customer-order-item:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(20,55,35,.06)}#customer-dialog .dialog-actions{position:sticky;bottom:0;z-index:2;padding:15px 26px;background:var(--paper);box-shadow:0 -8px 20px rgba(30,55,42,.05)}@media(max-width:780px){#customer-dialog .dialog-heading{padding:18px 18px 14px}#customer-dialog .customer-edit-name,#customer-dialog .customer-contact-field{padding-left:18px;padding-right:18px}#customer-dialog .customer-links-editor{margin-left:18px;margin-right:18px}#customer-dialog .customer-order-history{padding-left:18px;padding-right:18px}#customer-dialog .dialog-actions{padding-left:18px;padding-right:18px}}
#customer-dialog .customer-links-editor{background:#fafcfb;border-color:#d9e2dc}#customer-dialog .customer-links-editor h3{color:var(--ink)}#customer-dialog .customer-links-editor>p{color:#53615a;font-weight:500}#customer-dialog .customer-fastwork-edit-row{border-color:#d6dfd9;box-shadow:0 1px 2px rgba(20,40,30,.025)}#customer-dialog .add-fastwork-link{border-color:#cfd9d2;color:var(--green-dark)}
#customer-dialog .customer-links-editor{padding:0;background:#fff;border-color:#d7e0da;overflow:hidden}#customer-dialog .customer-links-editor h3{margin:0;padding:15px 18px 2px;background:var(--green-dark);color:#fff}#customer-dialog .customer-links-editor>p{margin:0;padding:0 18px 15px;background:var(--green-dark);color:#e1f0e7;font-weight:500}#customer-dialog #customer-fastwork-editor{padding:15px 18px 0;background:#fff}#customer-dialog .add-fastwork-link{margin:12px 18px 16px;background:#fff}
#customer-dialog .customer-links-editor{border-color:#cbdcd0;background:#f7fbf8}#customer-dialog .customer-links-editor h3{background:#e5f1e8;color:#164d39}#customer-dialog .customer-links-editor>p{background:#e5f1e8;color:#40594c}#customer-dialog #customer-fastwork-editor{background:#f7fbf8}#customer-dialog .customer-fastwork-edit-row{display:grid!important;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:end;padding:12px;background:#fff;border-color:#d6e1da}#customer-dialog .customer-fastwork-edit-row label{display:grid;gap:6px;font-size:13px;font-weight:750;color:var(--ink)}#customer-dialog .customer-fastwork-edit-row input{grid-column:auto;width:100%}#customer-dialog .remove-fastwork-link{grid-column:auto;align-self:end;margin:0 0 8px;padding:0 2px;color:#b84b4b;font-size:13px}
#customer-dialog .customer-fastwork-edit-row input{color:var(--green-dark);font-weight:750}
.status-toggle{border:0;transition:transform .15s,filter .15s}.status-toggle:hover{transform:translateY(-1px);filter:brightness(.96)}.status-toggle:focus-visible{outline:3px solid #bce4d0}
.job-edit-button{display:block;padding:0;border:0;background:transparent;color:var(--ink);font-weight:750;text-align:left;font-size:15px;line-height:1.35}.job-edit-button:hover{color:var(--green);text-decoration:underline;text-underline-offset:3px}.transaction-card-edit{display:none}.row-actions .compact-delete{width:28px;height:28px;padding:0;border:1px solid #f0d7d7;border-radius:8px;background:#fff7f7;color:var(--red);font-size:22px;line-height:22px}.row-actions .compact-delete:hover{background:#fdecec}
.table-panel .amount strong{display:block}.deduction-info{display:grid;justify-items:end;gap:2px;margin-top:5px;color:var(--muted);font-size:11px;font-weight:600;line-height:1.35;white-space:nowrap}.deduction-info span{display:flex;gap:5px}.deduction-info b{font-weight:750;color:#56665d}.deduction-info.no-deduction{display:block;color:#8b968f;font-weight:500}.net-table-amount{font-size:15px;font-weight:900;letter-spacing:-.15px;color:#075f3d}.status.certificate-pending{background:#fde7e7;color:#a33b3b}.status.individual{background:#fbf0d8;color:#875d16}.row-actions{justify-content:flex-end}
.tax-heading{align-items:center}.tax-summary-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-bottom:16px}.tax-summary-grid article{padding:18px;border:1px solid var(--line);border-radius:13px;background:var(--paper)}.tax-summary-grid span{display:block;font-size:13px;color:var(--muted);font-weight:650;margin-bottom:8px}.tax-summary-grid strong{font-size:24px;letter-spacing:-.5px}.tax-year-panel{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 20px}.tax-year-panel h2{font-size:16px;margin:0 0 3px}.tax-year-status{border:0;padding:9px 12px;font-weight:750;white-space:nowrap}.tax-pending-item{width:100%;display:flex;justify-content:space-between;align-items:center;gap:15px;text-align:left;border:0;border-top:1px solid var(--line);background:transparent;padding:13px 0}.tax-pending-item:first-child{border-top:0}.tax-pending-item strong{display:block}.tax-pending-item small{display:block;color:var(--muted);margin-top:3px}.tax-pending-item b{color:var(--green-dark);white-space:nowrap}.tax-pending-item:hover strong{color:var(--green);text-decoration:underline}.tax-empty{color:var(--muted);padding:10px 0}@media(max-width:780px){.tax-summary-grid{grid-template-columns:1fr}.tax-year-panel{align-items:flex-start;flex-direction:column}}
.filters{align-items:center}.filters .filter-reset{border:0;background:transparent;color:var(--muted);white-space:nowrap;padding:7px 5px;font-size:13px;font-weight:650}.filters .filter-reset:hover{background:transparent;color:var(--green-dark);text-decoration:underline;text-underline-offset:3px}.table-panel>.section-heading{justify-content:space-between}.table-export{border:1px solid transparent;background:transparent;color:var(--muted);padding:5px 7px;border-radius:7px;font-size:12px;font-weight:750;letter-spacing:.1px}.table-export:hover{color:var(--green-dark);background:#f0f6f1;border-color:#d8e5db}.table-export:focus-visible{outline:3px solid #bce4d0}.job-customer-row{display:contents}
.filters{align-items:center}.filters .filter-reset{border:0;background:transparent;color:var(--muted);white-space:nowrap;padding:7px 5px;font-size:13px;font-weight:650}.filters .filter-reset:hover{background:transparent;color:var(--green-dark);text-decoration:underline;text-underline-offset:3px}.table-panel>.section-heading{justify-content:space-between}.table-export{border:1px solid transparent;background:transparent;color:var(--muted);padding:5px 7px;border-radius:7px;font-size:12px;font-weight:750;letter-spacing:.1px}.table-export:hover{color:var(--green-dark);background:#f0f6f1;border-color:#d8e5db}.table-export:focus-visible{outline:3px solid #bce4d0}.channel-cell{min-width:122px}.channel-chip{display:inline-flex;align-items:center;min-height:27px;padding:4px 9px;border:1px solid transparent;border-radius:7px;font-size:12px;line-height:1;font-weight:800;letter-spacing:.05px;white-space:nowrap}.channel-order{margin-top:5px!important;color:#6f7d75;font-size:11px;font-weight:650;font-variant-numeric:tabular-nums;letter-spacing:.05px}.channel-fastwork{color:#3156bc;background:#eaf0ff;border-color:#cbd8fb}.channel-line{color:#087b34;background:#e8f9ee;border-color:#baeacb}.channel-facebook{color:#7041b4;background:#f2edff;border-color:#d9c9fa}.channel-instagram{color:#ae256a;background:#fff0f6;border-color:#f2c4da}.channel-direct{color:#343a37;background:#eff1f0;border-color:#d6dcda}.channel-custom{color:#49665a;background:#f1f5f2;border-color:#d9e5dc}
.template-dialog{padding:25px}.template-dialog>.muted{margin:12px 0 16px}.template-list{display:grid;gap:8px;max-height:52dvh;overflow:auto}.template-choice{display:grid;grid-template-columns:1fr auto;align-items:stretch;border:1px solid var(--line);border-radius:11px;background:#fff;overflow:hidden}.template-use{border:0;background:transparent;padding:13px 14px;text-align:left}.template-choice:hover{border-color:#a8cdb5;background:#f5faf6}.template-use strong{display:block;color:var(--green-dark);font-size:15px}.template-use small{display:block;margin-top:4px;color:var(--muted)}.template-remove{width:42px;border:0;border-left:1px solid var(--line);background:transparent;color:#a8b2ac;font-size:20px;line-height:1}.template-remove:hover{background:#fff3f3;color:var(--red)}#quick-template{border-color:#c7d8ce;background:rgba(255,255,255,.76);color:var(--green-dark);box-shadow:none;transform:none}#quick-template:hover{background:#edf7f0;border-color:#9bc8aa;transform:none}#save-template{border-color:var(--line);background:#fff;color:var(--ink);padding:9px 11px;font-size:13px}#save-template:hover{background:var(--cream);border-color:#bdccc2}.job-customer{display:flex!important;align-items:center;gap:6px}.client-kind{display:inline-flex;align-items:center;flex:none;padding:2px 6px;border-radius:999px;font-size:10px;font-weight:800;line-height:1.25;white-space:nowrap}.client-kind.company{background:#e1f3e8;color:#167247}.client-kind.individual{background:#fff0d4;color:#986815}

/* ตารางรายการ: กำหนดสัดส่วนคอลัมน์ให้สมดุลและคงที่ */
.table-panel .table-wrap{overflow-x:auto}
.table-panel table{min-width:920px;table-layout:fixed}
.table-panel .col-date{width:13%}
.table-panel .col-job{width:30%}
.table-panel .col-channel{width:11%}
.table-panel .col-gross{width:16%}
.table-panel .col-net{width:14%}
.table-panel .col-status{width:16%}
.table-panel th,.table-panel td{padding:16px 20px;vertical-align:middle}
.table-panel .status-cell{position:relative}
.table-panel .status-heading,.table-panel .status-cell{text-align:center}
.table-panel .status-heading{white-space:nowrap;letter-spacing:0}
.table-panel .status-heading span{display:block}

/* Blue visual theme — channel and status tags keep their own colors. */
:root{--ink:#17233a;--muted:#66758d;--line:#dce5f2;--paper:#fff;--wash:#f5f8ff;--green:#155eef;--green-dark:#0d45b8;--cream:#f0f5ff;--red:#b94c4c}
body{background:linear-gradient(180deg,#fbfcff 0,#f4f7ff 100%)}
.topbar{background:rgba(255,255,255,.94);border-color:#dce5f2}
.brand span{background:linear-gradient(135deg,#246fff,#155eef);box-shadow:0 5px 12px rgba(21,94,239,.2)}
.nav-link.active,.nav-link:hover{background:#eaf1ff;color:#155eef}
select:focus,input:focus,textarea:focus{outline-color:#bdd2ff;border-color:#155eef}
.primary{background:linear-gradient(135deg,#246fff,#155eef);box-shadow:0 7px 16px rgba(21,94,239,.18)}
.primary:hover{background:#0d45b8}
.dashboard-heading{margin-bottom:24px}
.dashboard-heading h1{font-size:38px;color:#13213d}
.summary-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:20px}
.summary-card{position:relative;overflow:hidden;padding:19px 20px;min-height:148px;border-color:#dce5f2;box-shadow:0 9px 24px rgba(30,66,130,.055)}
.summary-card:before{content:'';position:absolute;inset:0 auto 0 0;width:4px;background:#c9d9ff}
.summary-card .summary-icon{width:32px;height:32px;border-radius:10px;background:#edf3ff;color:#155eef;display:grid;place-items:center;font-size:17px;font-weight:900;margin-bottom:10px}
.summary-card .summary-icon svg{width:21px;height:21px;display:block}
.summary-card p{font-size:13px;margin-bottom:5px;color:#64748b}
.summary-card strong{font-size:26px;color:#17233a}
.summary-card small{font-size:12px}
.summary-card.accent{background:linear-gradient(135deg,#155eef,#2e7aff);border-color:#155eef;box-shadow:0 11px 25px rgba(21,94,239,.22)}
.summary-card.accent:before{background:#83b0ff}
.summary-card.accent .summary-icon{background:rgba(255,255,255,.17);color:#fff}
.summary-card.accent p,.summary-card.accent small,.summary-card.accent strong{color:#fff}
.summary-card.net-summary{background:linear-gradient(135deg,#fff,#f1f6ff)}
.summary-card.tax-summary{background:linear-gradient(135deg,#fff,#f5f7ff)}
.summary-card.pending-summary{background:linear-gradient(135deg,#fff,#f5f8ff)}
.dashboard-main-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(290px,.9fr);gap:18px;margin-bottom:18px}
.dashboard-main-grid .panel{margin-bottom:0}
.chart-panel,.top-customers-panel,.recent-panel{border-color:#dce5f2;box-shadow:0 9px 25px rgba(33,64,121,.045)}
.chart-panel h2,.top-customers-panel h2,.recent-panel h2{color:#17233a}
.bar-chart{height:255px;border-color:#e4ebf6;padding:16px 8px 0;gap:10px}
.bar{background:linear-gradient(180deg,#5b92ff,#155eef);box-shadow:0 -4px 13px rgba(21,94,239,.16)}
.bar-value{color:#155eef;font-size:10px}
.bar-value-mobile{display:none}
.bar-label{font-size:11px}
.top-customers{display:grid;gap:14px;padding-top:4px}
.top-customer{display:flex;align-items:center;gap:10px}
.customer-rank{width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:#f0f4fb;color:#52617a;font-size:12px;font-weight:800}
.customer-rank-info{flex:1;min-width:0}
.customer-rank-info>div{display:flex;gap:10px;justify-content:space-between;align-items:center}
.customer-rank-info strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;color:#17233a}
.customer-rank-info b{white-space:nowrap;font-size:12px;color:#263758}
.customer-rank-info i{display:block;height:5px;background:#e5ebf6;border-radius:99px;overflow:hidden;margin-top:7px}
.customer-rank-info em{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#2f77ff,#155eef)}
.recent-panel .recent-item{padding:12px 0}
.text-link{color:#155eef}
@media(max-width:780px){.dashboard-main-grid{grid-template-columns:1fr}.summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.summary-card{min-height:132px}.dashboard-heading h1{font-size:32px}.bar-chart{height:220px}}

/* Dashboard year control */
.dashboard-year-picker{display:flex;align-items:center;gap:9px;padding:7px 9px 7px 13px;border:1px solid #cfdcf4;border-radius:12px;background:#fff;box-shadow:0 6px 18px rgba(26,71,148,.06);color:#62718b;font-size:13px;font-weight:800}
.dashboard-year-picker:before{content:'◷';display:grid;place-items:center;width:23px;height:23px;border-radius:7px;background:#eef4ff;color:#155eef;font-size:15px;line-height:1}
.dashboard-year-picker span{white-space:nowrap}
.dashboard-year-picker select{min-width:93px;padding:6px 31px 6px 9px;border:0;border-radius:8px;background-color:#f5f8ff;color:#17233a;font-size:17px;font-weight:850;line-height:1.2;cursor:pointer}
.dashboard-year-picker select:focus{outline:2px solid #a9c5ff;border-color:transparent}
@media(max-width:780px){.dashboard-year-picker{padding:6px 7px 6px 10px}.dashboard-year-picker select{min-width:82px;font-size:16px}.dashboard-year-picker:before{width:21px;height:21px}}

/* Dashboard: compact year selector and detailed recent activity */
.dashboard-heading{margin-bottom:24px}.dashboard-title-line{display:flex;align-items:baseline;gap:12px}.dashboard-title-line h1{margin:3px 0 5px}.dashboard-year-picker{display:inline-flex;align-items:baseline;gap:4px;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;color:#71809b;font-size:13px;font-weight:750}.dashboard-year-picker:before{display:none}.dashboard-year-picker select{min-width:0;padding:1px 2px 2px;border:0;border-bottom:1px solid #cfdcf4;border-radius:0;background:transparent;color:#155eef;font-size:14px;font-weight:850;line-height:1.2;box-shadow:none}.dashboard-year-picker select:focus{outline:0;border-color:#155eef}.dashboard-main-grid{grid-template-columns:minmax(0,1fr);margin-bottom:18px}.recent-panel{padding:0;overflow:hidden}.recent-panel .section-heading{padding:20px 22px 15px;margin:0}.recent-list{display:grid;gap:0}.recent-panel .recent-item{display:grid;grid-template-columns:106px minmax(185px,1.35fr) minmax(165px,.78fr) minmax(135px,.58fr);gap:18px;align-items:center;padding:16px 22px!important;border-top:1px solid #e0e7f0}.recent-item time{color:#5d6c84;font-size:13px;font-weight:700;white-space:nowrap}.recent-job{min-width:0;display:grid;gap:4px}.recent-job-button{width:max-content;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border:0;background:transparent;padding:0;color:#17233a;font:inherit;font-weight:850;text-align:left}.recent-job-button:hover{color:#155eef;text-decoration:underline;text-underline-offset:3px}.recent-job small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#71809b}.recent-gross,.recent-net{display:grid;gap:3px;align-content:center;font-variant-numeric:tabular-nums}.recent-gross>span,.recent-net>span{font-size:11px;color:#7b879a;font-weight:750}.recent-gross>strong{color:#17233a;font-weight:850}.recent-net>strong{color:#087443;font-size:17px;font-weight:900}.recent-gross .deduction-info{gap:6px;font-size:10px;line-height:1.25}.recent-gross .deduction-info span{white-space:nowrap}.recent-gross .deduction-info b{font-weight:800}.recent-gross .no-deduction{color:#98a2b3}
@media(max-width:780px){.dashboard-title-line{gap:9px}.dashboard-year-picker{padding:0}.dashboard-year-picker select{min-width:0;font-size:14px}.recent-panel .section-heading{padding:18px 16px 12px}.recent-panel .recent-item{grid-template-columns:78px minmax(0,1fr);gap:7px 12px;padding:14px 16px!important}.recent-item time{grid-row:1/4;align-self:start}.recent-gross,.recent-net{grid-column:2;grid-template-columns:1fr auto;column-gap:8px}.recent-gross>span,.recent-net>span{align-self:center}.recent-gross .deduction-info{grid-column:1/-1}.recent-net>strong{font-size:16px}}

/* Final blue theme pass: keep channel and status tags untouched. */
.recent-panel .recent-item{grid-template-columns:106px minmax(185px,1.35fr) minmax(180px,.82fr) minmax(145px,.62fr)}
.recent-gross{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:8px;row-gap:1px}
.recent-gross>span{flex:0 0 100%}
.recent-gross>strong{font-size:16px;letter-spacing:-.01em}
.recent-gross .deduction-info{display:flex;flex:0 0 100%;align-items:center;flex-wrap:wrap;gap:3px;margin:0;color:#74839a;font-size:10px;line-height:1.35}
.recent-gross .deduction-info:not(.no-deduction):before{content:'หัก';margin-right:2px;color:#8a96a9;font-weight:750}
.recent-gross .deduction-info span{display:inline-flex;align-items:center;gap:3px}
.recent-gross .deduction-info span+span:before{content:'·';margin-right:2px;color:#a1acbc}
.recent-gross .deduction-info b{color:#5e6d84;font-weight:850}
.recent-net>strong,.net-table-amount{color:#155eef!important}
.preview-summary{border-color:#cbdafb;background:#f3f7ff}.preview-summary span{color:#0d45b8}
.preview-grid .preview-net{background:#f1f6ff;border-color:#bfd3ff}.preview-grid .preview-net strong{color:#0d45b8}
#transaction-preview-dialog .dialog-actions{border-top:0}
#withholding-tax,#fee,#fee-vat,#net-amount{background:#f5f8ff;color:#17233a;border-color:#d5e0f3}
.money-section{background:#f6f8ff}
.money-section h3,.form-section h3{color:#0d45b8}
.money-section .net-field-wide input{background:#edf4ff;border-color:#bcd2ff;color:#0d45b8}
#fastwork-card{border-color:#cbdafb;background:#fbfcff;overflow-anchor:none}#fastwork-card:before{color:#0d45b8}
#fastwork-card #fee-applies-field{grid-column:1/-1;width:100%;min-height:32px;align-self:start;align-items:center;padding:0!important;border:0;background:transparent;white-space:nowrap}
#fastwork-card #fee-percent-field{grid-column:1/-1}
#fastwork-card #fee-percent{width:100%;height:42px;min-height:42px;padding:0 40px 0 12px;border:1px solid #bcd0fb;border-radius:9px;background:#eef3ff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='20' viewBox='0 0 24 30' fill='none' stroke='%232d5cc2' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 9 5-5 5 5'/%3E%3Cpath d='m7 21 5 5 5-5'/%3E%3C/svg%3E") no-repeat right 12px center;color:#155eef;font-size:14px;font-weight:700;line-height:1.2;-webkit-appearance:none;appearance:none}
.order-input span{background:#edf4ff;color:#0d45b8;border-right-color:#d5e0f3}
.fastwork-link-choices button{border-color:#cbdafb;background:#f2f6ff;color:#0d45b8}.fastwork-link-choices button:hover{background:#e5efff}
.customer-contact{background:#f6f8ff}.fastwork-name-chip{border-color:#cbdafb;background:#f2f6ff;color:#0d45b8}
.customer-order-item strong,.customer-item-link strong{color:#0d45b8}.customer-order-item:hover,.customer-item-link:hover{border-color:#b9cefb;background:#f3f7ff}
#customer-dialog .customer-links-editor{border-color:#cedaf3;background:#f7f9ff}#customer-dialog .customer-links-editor h3{background:#eaf1ff;color:#0d45b8}#customer-dialog .customer-links-editor>p{background:#eaf1ff;color:#4a6088}
#customer-dialog #customer-fastwork-editor{background:#f7f9ff}#customer-dialog .customer-fastwork-edit-row{border-color:#d5e0f3}#customer-dialog .customer-fastwork-edit-row input{color:#0d45b8}#customer-dialog .add-fastwork-link{border-color:#c9d6ee;color:#0d45b8}
.table-export:hover{color:#0d45b8;background:#f0f5ff;border-color:#d4e0f3}.filters .filter-reset:hover{color:#0d45b8}
.upload-box{border-color:#bfd0f1;background:#f7faff;color:#155eef}.suggestions{box-shadow:0 9px 24px rgba(25,65,140,.15)}.suggestions button:hover{background:#edf3ff}
dialog::backdrop{background:rgba(20,42,83,.42)}
@media(max-width:780px){.recent-panel .recent-item{grid-template-columns:78px minmax(0,1fr)}.recent-gross{display:grid;grid-template-columns:1fr auto;column-gap:8px}.recent-gross>span{grid-column:1;grid-row:1}.recent-gross>strong{grid-column:2;grid-row:1}.recent-gross .deduction-info{grid-column:1/-1;grid-row:2}.recent-gross .deduction-info:before{display:none}}

/* iPhone dashboard: compact chart values and true baseline alignment for recent rows. */
@media(max-width:520px){
  #dashboard-view .bar-chart{gap:4px;padding-right:2px;padding-left:2px}
  #dashboard-view .bar-wrap{min-width:0}
  #dashboard-view .bar-value{margin-bottom:5px;font-size:8px;font-weight:850;letter-spacing:-.25px}
  #dashboard-view .bar-value-full{display:none}
  #dashboard-view .bar-value-mobile{display:inline}
  #dashboard-view .recent-panel .recent-item{align-items:baseline}
  #dashboard-view .recent-job{display:contents}
  #dashboard-view .recent-item time{grid-column:1;grid-row:1;align-self:baseline;line-height:1.25}
  #dashboard-view .recent-job-button{grid-column:2;grid-row:1;align-self:baseline;line-height:1.25}
  #dashboard-view .recent-job-meta{grid-column:2;grid-row:2;align-self:start}
  #dashboard-view .recent-gross{grid-column:2;grid-row:3}
  #dashboard-view .recent-net{grid-column:2;grid-row:4}
}

/* Dashboard hierarchy and final blue pass for shared table surfaces. */
.summary-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:14px}
.summary-card.primary-summary{grid-column:span 3;min-height:164px}
.summary-card.small-summary{grid-column:span 2;min-height:134px;padding:16px 18px}
.summary-card.small-summary .summary-icon{width:29px;height:29px;margin-bottom:8px}
.summary-card.small-summary strong{font-size:22px}
.summary-card.net-summary.primary-summary{background:linear-gradient(135deg,#f7faff,#e7f0ff);border-color:#bdd2ff;box-shadow:0 11px 25px rgba(21,94,239,.11)}
.summary-card.net-summary.primary-summary:before{background:#4d83f5}
.summary-card.net-summary.primary-summary strong{color:#0d45b8}
.summary-card.fee-summary{background:linear-gradient(135deg,#fff,#f3f7ff)}
.summary-card.fee-summary .summary-icon{background:#edf3ff;color:#155eef}

/* Soft color coding keeps the dashboard lively while preserving the blue-led visual system. */
.summary-card.net-summary.primary-summary{background:linear-gradient(135deg,#effbff,#e6f1ff);border-color:#b9dcff;box-shadow:0 11px 25px rgba(31,131,205,.12)}
.summary-card.net-summary.primary-summary:before{background:#38a3df}
.summary-card.net-summary.primary-summary .summary-icon{background:#dcf3ff;color:#0878b7}
.summary-card.net-summary.primary-summary strong{color:#075f9e}
.summary-card.net-summary.primary-summary small{color:#527895}

/* Green emphasis for net income summary */
.summary-card.net-summary.primary-summary{
  background:linear-gradient(135deg,#f0fbf6,#dcf6e8);
  border-color:#a8dfc1;
  box-shadow:0 11px 25px rgba(24,142,82,.12);
}

/* Compact transaction filters: search first, optional filters on demand. */
#transactions-view section.filters.transaction-filter-toolbar{
  position:relative;
  display:block!important;
  width:100%!important;
  padding:12px!important;
  overflow:visible;
}
#transactions-view .transaction-filter-toolbar>*{width:100%!important;max-width:none!important;min-width:0!important}
#transactions-view .filter-primary-row{display:flex;width:100%;align-items:center;gap:10px}
#transactions-view .filter-primary-row .filter-search{flex:1 1 auto!important;min-width:0!important}
#transactions-view .filter-toggle{
  display:inline-flex;
  flex:0 0 auto;
  width:auto!important;
  min-width:112px;
  height:44px;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:0 14px;
  border:1px solid #c8d7f2;
  border-radius:13px;
  background:#f5f8ff;
  color:#245fd8;
  font-size:14px;
  font-weight:850;
  line-height:1;
  box-shadow:none;
}
#transactions-view .filter-toggle:hover,
#transactions-view .filter-toggle[aria-expanded="true"],
#transactions-view .filter-toggle.has-active-filters{border-color:#8eacf0;background:#eaf1ff;color:#155eef}
.filter-toggle-icon{display:block;flex:0 0 18px;width:18px;height:18px;border:0;background:center/18px 18px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18' fill='none' stroke='%23155eef' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M3 5h12M5.5 9h7M7 13h4'/%3E%3C/svg%3E")}
.filter-toggle-icon:after{display:none}
#transactions-view .filter-toggle>span:not(.filter-toggle-icon){display:inline-flex;align-items:center;line-height:1.15}
#filter-count:not(:empty){display:inline;color:inherit;font-size:12px;font-weight:900;white-space:nowrap}
#transactions-view .active-filter-chips{display:flex!important;flex-wrap:wrap;gap:7px;margin-top:10px;padding:0 2px}
#transactions-view .active-filter-chips.hidden{display:none!important}
.active-filter-chip{display:inline-flex;width:auto!important;min-height:30px;align-items:center;gap:7px;padding:4px 9px 4px 11px;border:1px solid #f2bdc5;border-radius:999px;background:#fff0f2;color:#c93445;font-size:12px;font-weight:800}
.active-filter-chip b{font-size:16px;font-weight:500;line-height:1}
.active-filter-chip:hover{border-color:#e58d9b;background:#ffe4e9}
#transactions-view section.filters.transaction-filter-toolbar>.filter-panel{
  position:absolute;
  top:calc(100% + 9px);
  right:0;
  z-index:25;
  display:grid!important;
  width:min(720px,calc(100vw - 48px))!important;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  padding:18px;
  border:1px solid #d3def1;
  border-radius:18px;
  background:rgba(255,255,255,.97);
  box-shadow:0 20px 55px rgba(28,52,96,.2);
  backdrop-filter:blur(18px);
}
#transactions-view section.filters.transaction-filter-toolbar>.filter-panel.hidden{display:none!important}
.filter-panel-header{display:flex;grid-column:1/-1;align-items:center;justify-content:space-between;padding:0 40px 3px 0}
.filter-panel-header strong,.filter-panel-header small{display:block}
.filter-panel-header strong{color:#17233a;font-size:17px}
.filter-panel-header small{margin-top:3px;color:#748199;font-size:12px}
.filter-panel-header button{position:absolute;top:12px;right:12px;display:grid;width:32px!important;height:32px;padding:0;border:0;border-radius:999px;background:#f0f4fb;color:#5f6f88;font-size:0;line-height:0;place-items:center;transition:background-color .16s ease,color .16s ease}
.filter-panel-header button:before,.filter-panel-header button:after{position:absolute;top:50%;left:50%;width:13px;height:2px;border-radius:999px;background:currentColor;content:""}
.filter-panel-header button:before{transform:translate(-50%,-50%) rotate(45deg)}
.filter-panel-header button:after{transform:translate(-50%,-50%) rotate(-45deg)}
.filter-panel-header button:hover,.filter-panel-header button:focus-visible{outline:0;background:#e5edff;color:#155eef;box-shadow:none;transform:none}
#transactions-view .filter-field{display:grid;min-width:0;gap:7px}
.filter-field-label{color:#687791;font-size:11px;font-weight:850}
#transactions-view .filter-field .filter-menu{display:flex!important;width:100%!important;min-width:0!important;flex:none!important}
#transactions-view .filter-field .filter-menu-button{height:42px;align-items:center;border:1px solid #d5e0f2;border-radius:11px;background:#f9fbff;color:#245fd8;font-size:14px;line-height:1.2}
#transactions-view .filter-field .filter-menu-button:hover,
#transactions-view .filter-field .filter-menu-button:focus{border-color:#94b0ec;background:#edf3ff}
#transactions-view .filter-panel .filter-reset{grid-column:1/-1;align-self:end;width:100%!important;height:46px;border:1px solid #efb9c0;border-radius:11px;background:#fff7f8;color:#b93845;text-decoration:none!important;box-shadow:none}
#transactions-view .filter-panel .filter-reset:hover,#transactions-view .filter-panel .filter-reset:focus-visible{outline:0;border-color:#e79ca6;background:#ffedef;color:#a82f3b;text-decoration:none!important;box-shadow:none}
.filter-backdrop{display:none}
#transactions-view section.filters.transaction-filter-toolbar .filter-search input:hover,
#transactions-view section.filters.transaction-filter-toolbar .filter-search input:focus{background:transparent!important;box-shadow:none!important}

@media(max-width:780px){
  #transactions-view section.filters.transaction-filter-toolbar{padding:10px!important;border-radius:16px}
  #transactions-view .filter-primary-row{gap:4px}
  #transactions-view .filter-toggle{min-width:74px;height:42px;gap:4px;padding:0 6px 1px;font-size:12px}
  #transactions-view .filter-toggle .filter-toggle-icon{flex-basis:16px;width:16px;height:16px;background-size:16px 16px}
  #transactions-view section.filters.transaction-filter-toolbar .filter-search input{display:block;height:42px!important;padding:0 2px 2px 32px!important;font-size:16px!important;line-height:1.25!important;-webkit-appearance:none;appearance:none}
  #transactions-view .filter-search:before{left:10px}
  #transactions-view section.filters.transaction-filter-toolbar>.filter-panel{
    position:fixed;
    inset:auto 0 0 0;
    z-index:45;
    width:100%!important;
    max-height:min(82dvh,700px);
    grid-template-columns:1fr;
    gap:13px;
    overflow-y:auto;
    padding:14px 18px calc(22px + env(safe-area-inset-bottom));
    border:0;
    border-top:1px solid rgba(255,255,255,.9);
    border-radius:25px 25px 0 0;
    background:rgba(249,251,255,.96);
    box-shadow:0 -18px 55px rgba(17,34,66,.24);
    backdrop-filter:blur(24px) saturate(1.25);
  }
  #transactions-view section.filters.transaction-filter-toolbar>.filter-panel:before{display:block;grid-column:1/-1;width:42px;height:5px;margin:0 auto -2px;border-radius:999px;background:#c5cfdf;content:""}
  #transactions-view .filter-panel-header button{top:10px;right:14px}
  #transactions-view .filter-field .filter-menu-button{justify-content:space-between;padding:0 15px}
  #transactions-view .filter-field .filter-menu-options{left:0;right:0;width:100%;max-width:none;transform:none}
  #transactions-view .filter-panel .filter-reset{margin-top:4px}
  #filter-backdrop:not(.hidden){position:fixed;inset:0;z-index:44;display:block!important;border:0;background:rgba(17,29,52,.28);backdrop-filter:blur(2px)}
  html.filter-panel-open,body.filter-panel-open{overflow:hidden!important;overscroll-behavior:none}
}

@media(max-width:380px){
  #transactions-view .filter-toggle{min-width:46px;width:46px;padding:0;font-size:0}
  #transactions-view .filter-toggle #filter-count{font-size:11px}
}
.summary-card.net-summary.primary-summary:before{background:#32b875}
.summary-card.net-summary.primary-summary .summary-icon{background:#d9f4e5;color:#087443}
.summary-card.net-summary.primary-summary p{color:#39735a}
.summary-card.net-summary.primary-summary strong{color:#087443}
.summary-card.net-summary.primary-summary small{color:#527b67}

/* Dashboard summaries: four equal cards above, net amount featured below */
.summary-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
}
.summary-card.top-summary{
  grid-column:span 1;
  min-height:148px;
  padding:18px 20px;
}
.summary-card.top-summary .summary-icon{
  width:32px;
  height:32px;
  margin-bottom:10px;
}
.summary-card.top-summary strong{font-size:24px}
.summary-card.net-feature-summary{
  grid-column:1 / -1;
  min-height:176px;
  padding:26px 30px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
}
.summary-card.net-feature-summary .summary-icon{margin:0 auto 10px}
.summary-card.net-feature-summary strong{font-size:40px}

@media(max-width:900px){
  .summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .summary-card.top-summary{grid-column:span 1}
  .summary-card.net-feature-summary{grid-column:1 / -1}
}
@media(max-width:560px){
  .summary-grid{grid-template-columns:1fr}
  .summary-card.top-summary,
  .summary-card.net-feature-summary{grid-column:1}
}
.summary-card.tax-summary{background:linear-gradient(135deg,#fffaf0,#fff1d6);border-color:#ffdca5;box-shadow:0 9px 24px rgba(202,133,24,.09)}
.summary-card.tax-summary:before{background:#f5ae37}
.summary-card.tax-summary .summary-icon{background:#fff0cf;color:#aa6200}
.summary-card.tax-summary strong{color:#9d5900}
.summary-card.tax-summary p,.summary-card.tax-summary small{color:#8f7043}
.summary-card.fee-summary{background:linear-gradient(135deg,#f8f5ff,#eeeaff);border-color:#d9ccff;box-shadow:0 9px 24px rgba(114,85,205,.09)}
.summary-card.fee-summary:before{background:#8f72e8}
.summary-card.fee-summary .summary-icon{background:#eee8ff;color:#6547c7}
.summary-card.fee-summary strong{color:#5940b3}
.summary-card.fee-summary p,.summary-card.fee-summary small{color:#756997}
.summary-card.pending-summary{background:linear-gradient(135deg,#fff6f7,#ffe9ed);border-color:#ffcbd4;box-shadow:0 9px 24px rgba(202,74,101,.08)}
.summary-card.pending-summary:before{background:#ef7188}
.summary-card.pending-summary .summary-icon{background:#ffe6eb;color:#bb435a}
.summary-card.pending-summary strong{color:#ad3b51}
.summary-card.pending-summary p,.summary-card.pending-summary small{color:#96707a}
.table-panel,.table-panel>.section-heading,.table-panel .table-wrap{background:#fff}
.table-panel>.section-heading{border-color:#dce5f2}
.table-panel thead th{background:#f7f9ff;color:#61708a}
.table-panel td,.table-panel th{border-color:#dce5f2}
.table-panel tbody tr{background:#fff}
.table-panel tbody tr:hover{background:#f7faff}
.table-panel,.table-panel .pagination{border-color:#dce5f2}
#transactions-view .table-panel{overflow-anchor:none}
#transactions-view .table-panel tbody tr,
#transactions-view .table-panel tbody td{height:104px}
#transactions-view .table-panel .deduction-info{min-height:0;align-content:start}
.site-footer{display:flex;max-width:1180px;align-items:center;justify-content:center;gap:7px;margin:-38px auto 0;padding:0 24px 30px;color:#8a96aa;font-size:11px;font-weight:700;letter-spacing:.02em}
#app-version{font-variant-numeric:tabular-nums}
#transaction-dialog .top-fields{grid-template-columns:repeat(2,minmax(0,1fr))}
#transaction-dialog .top-fields>label{min-width:0}
#transaction-dialog #date,
#transaction-dialog .client-type-control{width:100%;height:42px;min-height:42px}
#transaction-dialog .client-type-control{position:relative;display:flex;align-items:center;justify-content:center;border:1px solid #d5e0f3;border-radius:9px;background:#fff;transition:border-color .16s ease,box-shadow .16s ease,background-color .16s ease}
#transaction-dialog #client-type{width:100%;height:40px;min-height:40px;padding:2px 64px 3px 14px;border:0;border-radius:8px;background:transparent;color:#155eef;font-size:16px;font-weight:850;line-height:1.4;text-align:center;text-align-last:center;appearance:none;cursor:pointer}
#transaction-dialog .client-type-control:hover{border-color:#b8caf0;background:#f8faff}
#transaction-dialog .client-type-control:focus-within{border-color:#8fb0f4;box-shadow:0 0 0 3px rgba(21,94,239,.1);background:#fff}
#transaction-dialog #client-type:focus{outline:0;background:transparent}
#transaction-dialog .client-type-control>.year-chevron{position:absolute;top:50%;right:14px;left:auto;width:11px;height:18px;color:#155eef;transform:translateY(-50%);pointer-events:none}
@media(max-width:780px){#transaction-dialog .top-fields{grid-template-columns:1fr}#transaction-dialog #date,#transaction-dialog .client-type-control{height:42px;min-height:42px}#transaction-dialog #client-type{height:40px;min-height:40px}}
#transaction-dialog #channel{width:100%;height:42px;min-height:42px;padding:1px 42px 2px 14px;border:1px solid #d5e0f3;border-radius:9px;background-color:#fff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='18' viewBox='0 0 11 18' fill='none' stroke='%23155eef' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m2 6 3.5-4L9 6'/%3E%3Cpath d='m2 12 3.5 4L9 12'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:11px 18px;color:#155eef;font-size:15px;font-weight:850;line-height:1.4;text-align:center;text-align-last:center;-webkit-appearance:none;appearance:none;cursor:pointer;transition:background-color .16s ease,border-color .16s ease,box-shadow .16s ease}
#transaction-dialog #channel:hover{border-color:#b8caf0;background-color:#f8faff}
#transaction-dialog #channel:focus{outline:0;border-color:#8fb0f4;box-shadow:0 0 0 3px rgba(21,94,239,.1);background-color:#fff}
@media(max-width:780px){#transaction-dialog #channel{height:42px;min-height:42px}}
@media(min-width:781px){#transaction-dialog #fastwork-order-field{min-width:0;grid-column:auto}}
@media(max-width:780px){.summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.summary-card.primary-summary{grid-column:span 2}.summary-card.small-summary{grid-column:span 1}}

/* Dashboard year control and customer cards: final clarity pass. */
.dashboard-title-line{align-items:center;gap:16px}
.dashboard-year-picker{display:inline-flex;align-items:center;gap:9px;padding:9px 11px 9px 13px;border:1px solid #bfd0f2;border-radius:12px;background:#fff;box-shadow:0 6px 18px rgba(26,71,148,.08);color:#62718b;font-size:17px;font-weight:850}
.dashboard-year-picker:before{content:'◷';display:grid;place-items:center;width:29px;height:29px;border-radius:9px;background:#eef4ff;color:#155eef;font-size:18px;line-height:1}
.dashboard-year-picker select{min-width:126px;padding:5px 29px 5px 9px;border:0;border-radius:8px;background-color:#f5f8ff;color:#155eef;font-size:24px;font-weight:900;line-height:1.25;box-shadow:none;cursor:pointer}
.dashboard-year-picker select:focus{outline:2px solid #a9c5ff;border-color:transparent}
#customers-view .customer-directory{grid-auto-rows:auto;align-items:start}
#customers-view .customer-card{height:auto;min-height:286px;overflow:hidden}
#customers-view .customer-contact{display:grid;grid-template-columns:68px minmax(0,1fr);align-items:start;gap:8px;margin:10px 0 0;padding:8px 10px;max-height:none;border:1px solid #dbe5f5;border-radius:9px;background:#f7f9ff;color:#5f708d;line-height:1.35}
#customers-view .customer-contact span{font-size:12px;font-weight:800;color:#42618d}
#customers-view .customer-contact p{margin:0;min-width:0;white-space:normal;overflow-wrap:anywhere;font-size:13px;line-height:1.35}

/* Larger, more touch-friendly year selector on the dashboard. */
.dashboard-title-line{align-items:center;gap:20px}
.dashboard-year-picker{gap:12px;padding:13px 16px 13px 17px;border-radius:16px;font-size:22px}
.dashboard-year-picker:before{width:36px;height:36px;border-radius:11px;font-size:22px}
.dashboard-year-picker select{min-width:152px;padding:7px 34px 7px 10px;border-radius:10px;font-size:32px;line-height:1.1}
@media(max-width:680px){
  .dashboard-title-line{gap:10px}
  .dashboard-year-picker{padding:9px 11px;font-size:17px}
  .dashboard-year-picker:before{width:29px;height:29px;font-size:18px}
  .dashboard-year-picker select{min-width:116px;font-size:24px}
}
@media(max-width:780px){.dashboard-title-line{align-items:flex-start;flex-wrap:wrap;gap:10px}.dashboard-year-picker{padding:9px 11px;font-size:17px}.dashboard-year-picker:before{width:29px;height:29px;font-size:18px}.dashboard-year-picker select{min-width:116px;font-size:24px}#customers-view .customer-directory{grid-auto-rows:auto}#customers-view .customer-card{height:auto;min-height:0}}

/* Keep the year visible and comfortably clickable beside the dashboard title. */
.dashboard-title-line .dashboard-year-picker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:8px 12px;
  border:1px solid #cfdcf4;
  border-radius:12px;
  background:#fff;
  box-shadow:0 6px 18px rgba(26,71,148,.08);
  color:#62718b;
  font-size:22px;
  font-weight:850;
}
.dashboard-title-line .dashboard-year-picker:before{display:none}
.dashboard-title-line .dashboard-year-picker select{
  min-width:132px;
  padding:6px 31px 6px 10px;
  border:0;
  border-radius:8px;
  background-color:#f5f8ff;
  color:#155eef;
  font-size:30px;
  font-weight:900;
  line-height:1.1;
}
.dashboard-title-line .dashboard-year-picker select:focus{
  outline:2px solid #a9c5ff;
  border-color:transparent;
}
@media(max-width:780px){
  .dashboard-title-line .dashboard-year-picker{font-size:17px;padding:8px 10px}
  .dashboard-title-line .dashboard-year-picker select{min-width:112px;font-size:24px}
}

/* Dashboard year control: keep both the label and selected year easy to see and click. */
#dashboard-view .dashboard-title-line{
  align-items:center;
  gap:20px;
}
#dashboard-view .dashboard-title-line .dashboard-year-picker{
  gap:12px;
  padding:11px 15px;
  border-radius:14px;
  font-size:25px;
  line-height:1;
}
#dashboard-view .dashboard-title-line .dashboard-year-picker select{
  min-width:150px;
  min-height:52px;
  padding:7px 38px 7px 13px;
  border-radius:10px;
  font-size:34px;
  line-height:1;
  cursor:pointer;
}
@media(max-width:780px){
  #dashboard-view .dashboard-title-line .dashboard-year-picker{
    gap:9px;
    padding:9px 12px;
    font-size:21px;
  }
  #dashboard-view .dashboard-title-line .dashboard-year-picker select{
    min-width:126px;
    min-height:46px;
    font-size:28px;
  }
}

/* iPhone transaction list: replace the wide desktop table with complete vertical cards. */
@media(max-width:700px){
  #transactions-view .table-panel{
    overflow:visible;
    border:0;
    background:transparent;
    box-shadow:none;
  }
  #transactions-view .table-panel>.section-heading{
    padding:13px 4px;
    border:0;
    background:transparent;
  }
  #transactions-view .table-wrap{
    overflow:visible;
    background:transparent;
  }
  #transactions-view .table-wrap table,
  #transactions-view .table-wrap tbody{
    display:block;
    width:100%;
    min-width:0;
  }
  #transactions-view .table-wrap colgroup,
  #transactions-view .table-wrap thead{display:none}
  #transaction-rows{
    display:grid!important;
    gap:12px;
  }
  #transaction-rows .transaction-card-row{
    position:relative;
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    grid-template-areas:
      "job job"
      "date channel"
      "gross net"
      "status status";
    gap:15px 14px;
    overflow:hidden;
    padding:16px;
    border:1px solid #d8e3f4;
    border-radius:17px;
    background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(246,249,255,.94));
    box-shadow:0 7px 20px rgba(35,57,96,.055),inset 0 1px 0 rgba(255,255,255,.9);
  }
  #transaction-rows .transaction-card-row::before{
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    width:4px;
    background:#2f6fed;
    content:"";
  }
  #transaction-rows .transaction-card-row>td{
    display:grid;
    min-width:0;
    gap:5px;
    padding:0;
    border:0;
    background:transparent;
    text-align:left;
    vertical-align:top;
  }
  #transaction-rows .transaction-card-row>td::before{
    content:attr(data-label);
    color:#8a96a9;
    font-size:9px;
    font-weight:750;
    line-height:1.2;
  }
  #transaction-rows .job-cell{
    grid-area:job;
    grid-template-columns:minmax(0,1fr) auto;
    column-gap:10px;
    row-gap:5px;
    padding-bottom:13px!important;
    border-bottom:1px solid #e3e9f3!important;
  }
  #transaction-rows .job-cell::before{display:none}
  #transaction-rows .job-edit-button{
    grid-column:1;
    grid-row:1;
    min-width:0;
    overflow:visible;
    width:auto;
    padding:0;
    color:#17233a;
    font-size:15px;
    line-height:1.4;
    text-align:left;
    text-overflow:clip;
    white-space:normal;
  }
  #transaction-rows .transaction-card-edit{
    display:inline-flex;
    grid-column:2;
    grid-row:1 / 3;
    min-height:38px;
    align-items:center;
    align-self:center;
    justify-content:center;
    padding:8px 14px;
    border:1px solid #c4d3f5;
    border-radius:11px;
    background:#f4f7ff;
    color:#155eef;
    font-size:13px;
    font-weight:800;
    line-height:1;
    -webkit-tap-highlight-color:transparent;
  }
  #transaction-rows .transaction-card-edit:active{background:#e8efff}
  #transaction-rows .job-customer{
    display:flex!important;
    flex:0 1 auto;
    min-width:0;
    flex-wrap:nowrap;
    align-self:center;
    overflow:hidden;
    gap:6px;
    color:#66758d;
    font-size:11px;
    line-height:1.4;
  }
  #transaction-rows .job-customer-row{
    display:grid;
    grid-column:1;
    grid-row:2;
    grid-template-columns:minmax(0,1fr);
    min-width:0;
    align-items:center;
    justify-content:flex-start;
    gap:6px;
    overflow:visible;
  }
  #transaction-rows .job-customer-name{
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  #transaction-rows .fastwork-customer-tag{
    flex:0 1 auto;
    align-self:center;
    width:max-content!important;
    min-width:0;
    max-width:100%;
    margin:0!important;
    overflow:visible;
    white-space:normal;
  }
  #transaction-rows .fastwork-customer-tag-text{
    display:block;
    min-width:0;
    overflow:visible;
    overflow-wrap:anywhere;
    text-overflow:clip;
    white-space:normal;
  }
  #transaction-rows .transaction-date{grid-area:date}
  #transaction-rows .channel-cell{grid-area:channel;min-width:0}
  #transaction-rows .transaction-gross{grid-area:gross}
  #transaction-rows .net-table-amount{grid-area:net}
  #transaction-rows .transaction-gross,
  #transaction-rows .net-table-amount{text-align:left!important}
  #transaction-rows .transaction-gross>strong,
  #transaction-rows .net-table-amount{
    color:#25334b;
    font-size:15px;
    font-weight:850;
  }
  #transaction-rows .net-table-amount{color:#155eef}
  #transaction-rows .deduction-info{
    display:grid;
    gap:2px;
    margin:1px 0 0;
    color:#7c899d;
    font-size:9px;
    font-weight:650;
    white-space:normal;
  }
  #transaction-rows .deduction-info span{display:block}
  #transaction-rows .status-cell{
    grid-area:status;
    display:flex!important;
    min-height:35px;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding-top:12px!important;
    border-top:1px solid #e3e9f3!important;
    text-align:left!important;
  }
  #transaction-rows .status-cell::before{
    display:block;
    flex:1;
  }
  #transaction-rows .status-cell>.status{flex:none}
  #transaction-rows .transaction-empty-row{display:block}
  #transaction-rows .transaction-empty-row td{display:block;padding:0;border:0}
  #transactions-view .pagination{
    margin-top:14px;
    padding:14px 0;
    border:0;
    background:transparent;
  }
  #transaction-rows .channel-cell{
    display:grid!important;
    grid-template-columns:max-content minmax(0,1fr);
    grid-template-rows:11px 24px;
    align-self:stretch;
    align-content:start;
    align-items:center;
    gap:5px 6px;
  }
  #transaction-rows .channel-cell::before{
    display:block;
    grid-column:1/-1;
    grid-row:1;
  }
  #transaction-rows .channel-chip{
    display:inline-flex;
    grid-column:1;
    grid-row:2;
    width:max-content;
    max-width:100%;
    height:auto;
    min-height:0;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    padding:3px 7px;
    border-radius:6px;
    font-size:10px;
    line-height:1.2;
    text-overflow:ellipsis;
    transform:none;
  }
  #transaction-rows .channel-order{
    display:inline-flex;
    grid-column:2;
    grid-row:2;
    width:auto;
    max-width:100%;
    align-items:center;
    align-self:center;
    justify-self:start;
    margin:0!important;
    overflow:hidden;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    color:#99a3b2;
    font-size:9px;
    font-weight:600;
    line-height:1.2;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  #transaction-rows .transaction-date{
    grid-template-rows:11px 24px;
    align-content:start;
    align-items:center;
    row-gap:5px;
    line-height:24px;
  }
  #transaction-rows .transaction-gross,
  #transaction-rows .net-table-amount{
    grid-template-rows:11px 24px auto;
    align-content:start;
    align-items:center;
    row-gap:5px;
  }
  #transaction-rows .transaction-gross>strong{
    grid-row:2;
    align-self:center;
    line-height:24px;
  }
  #transaction-rows .transaction-gross .deduction-info{
    grid-row:3;
  }
  #transaction-rows .net-table-amount{
    line-height:24px;
  }
  html.iphone-interaction-locked #transaction-rows .transaction-card-row{
    grid-template-rows:auto auto auto;
    row-gap:12px;
  }
  html.iphone-interaction-locked #transaction-rows .transaction-gross,
  html.iphone-interaction-locked #transaction-rows .net-table-amount{
    align-self:start;
    align-content:start;
  }
  html.iphone-interaction-locked #transaction-rows .transaction-gross .deduction-info{
    min-height:0!important;
    align-content:start;
    justify-items:start;
    text-align:left;
  }
  html.iphone-interaction-locked #transaction-rows .status-cell{
    align-items:center;
    justify-content:space-between;
    text-align:left!important;
  }
  html.iphone-interaction-locked #transaction-rows .status-cell::before{
    flex:1;
    margin-left:0;
    line-height:1.2;
  }
  html.iphone-interaction-locked #transaction-rows .status-cell>.status{align-self:center}
}

/* Monthly chart metric switcher */
.chart-heading{align-items:flex-start;gap:18px}
.chart-controls{display:flex;align-items:center;justify-content:flex-end;gap:14px;margin-left:auto}
.chart-control-group{display:grid;gap:5px}
.chart-control-group>small{color:#71809a;font-size:11px;font-weight:800}
.chart-date-basis{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:170px;overflow:hidden;padding:3px;border:1px solid #cfdbef;border-radius:11px;background:#f5f7fb}
.chart-date-basis button{min-width:0;min-height:34px;padding:5px 4px;border:0;border-radius:8px;background:transparent;color:#71809a;font-size:13px;font-weight:800;white-space:nowrap}
.chart-date-basis button[aria-pressed="true"]{background:#fff;color:#155eef;box-shadow:0 2px 8px rgba(33,64,121,.12)}
@media(min-width:521px){.chart-date-basis button{display:flex;height:34px;min-height:34px;align-items:center;justify-content:center;padding-block:0;line-height:1}}
.chart-metric-select{display:block;min-width:196px}
.chart-metric-select select{width:100%;min-height:46px;padding:0 46px 0 16px;border:1px solid #b9cdf8;border-radius:14px;background:#f4f7ff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23155eef' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 15px center;color:#155eef;font:inherit;font-size:15px;font-weight:800;appearance:none;cursor:pointer;box-shadow:0 6px 18px rgba(21,94,239,.1),inset 0 1px 0 rgba(255,255,255,.9);transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease}
.chart-metric-select select:hover{background-color:#edf3ff;border-color:#7fa4f4;transform:translateY(-1px)}
.chart-metric-select select:focus{outline:0;background-color:#fff;border-color:#155eef;box-shadow:0 0 0 4px rgba(21,94,239,.12),0 7px 20px rgba(21,94,239,.12)}
@media(max-width:780px){.chart-heading{flex-direction:column}.chart-metric-select{width:auto;align-self:flex-end;margin-left:auto}}
@media(max-width:520px){
  #dashboard-view .chart-heading{
    display:grid;
    grid-template-columns:minmax(0,1fr) 120px;
    align-items:center;
    gap:6px 8px;
  }
  #dashboard-view .chart-heading>.chart-title-copy,#dashboard-view .chart-controls,#dashboard-view .chart-control-group{display:contents}
  #dashboard-view .chart-control-group>small{display:none}
  #dashboard-view .chart-heading h2{
    grid-column:1;
    grid-row:1;
    min-width:0;
    margin:0;
    font-size:16px;
    white-space:nowrap;
  }
  #dashboard-view .chart-heading .muted{
    grid-column:1/-1;
    grid-row:2;
  }
  #dashboard-view .chart-date-basis{display:grid;grid-template-columns:1fr 1fr;grid-column:1/-1;grid-row:3;justify-self:stretch;width:100%;margin-top:6px}
  #dashboard-view .chart-date-basis button{width:100%;min-height:40px}
  #dashboard-view .chart-metric-select{
    grid-column:2;
    grid-row:1;
    width:120px;
    min-width:0!important;
    align-self:center;
    margin:0;
    transform:translateX(10px);
  }
  #dashboard-view #chart-metric-button{
    width:120px!important;
    gap:6px!important;
    padding-right:2px!important;
    font-size:13px!important;
  }
  #dashboard-view #chart-metric-button .year-chevron{
    flex:0 0 8px;
    width:8px;
    height:14px;
    align-self:center;
    top:0;
  }
  #dashboard-view #chart-metric-button .year-chevron:before,
  #dashboard-view #chart-metric-button .year-chevron:after{
    left:1px;
    width:5px;
    height:5px;
    border-top-width:1.5px;
    border-left-width:1.5px;
  }
  #dashboard-view #chart-metric-button .year-chevron:before{top:1px}
  #dashboard-view #chart-metric-button .year-chevron:after{bottom:1px}
}
/* Refined transaction search and filter toolbar */
#transactions-view .filters {
  display: grid;
  width: 100%;
  grid-template-columns:
    minmax(700px, 4fr)
    minmax(150px, 1fr)
    minmax(220px, 1.5fr)
    minmax(230px, 1.6fr)
    minmax(180px, 1.2fr)
    minmax(100px, .7fr);
  align-items: center;
  gap: 9px;
  padding: 14px;
  border: 1px solid #d8e3f7;
  border-radius: 18px;
  background: linear-gradient(180deg, #fff 0%, #fbfcff 100%);
  box-shadow: 0 8px 26px rgba(31, 85, 170, .07);
}

#transactions-view .filters > * {
  width: 100%;
  min-width: 0;
  max-width: none;
}

.filter-search {
  position: relative;
  display: block;
  min-width: 0;
}

.filter-search::before {
  content: "";
  position: absolute;
  left: 16px;
  top: 50%;
  width: 18px;
  height: 18px;
  transform: translateY(-50%);
  background: no-repeat center / 18px 18px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%237489a9' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");
  pointer-events: none;
}

#transactions-view .filter-search input {
  width: 100%;
  min-width: 0;
  height: 46px;
  padding: 0 44px;
  border: 0;
  border-radius: 14px;
  background: transparent;
  color: #15203a;
  font-size: 16px;
  font-weight: 650;
  box-shadow: none;
  transition: color .18s ease, background .18s ease;
}

#transactions-view .filter-search input::placeholder {
  color: #7489a9;
  font-weight: 400;
}

#transactions-view .filter-search input:hover,
#transactions-view .filter-search input:focus {
  outline: none;
  background: #edf3ff;
  box-shadow: none;
}

#transactions-view .filter-select {
  width: 100%;
  min-width: 0;
  height: 46px;
  appearance: none;
  -webkit-appearance: none;
  border: 1px solid #cbd8ee;
  border-radius: 12px;
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%235c6f91' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 10 5 5 5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 16px;
  padding: 0 37px 0 13px;
  color: #18243d;
  font-size: 15px;
  font-weight: 750;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(35, 72, 137, .04);
  transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

#transactions-view .filter-select:hover {
  border-color: #9bb4e5;
  background-color: #fbfdff;
}

#transactions-view .filter-select:focus {
  outline: none;
  border-color: #5f8ff5;
  box-shadow: 0 0 0 4px rgba(37, 99, 235, .1);
}

#transactions-view .filter-year,
#transactions-view .filter-channel,
#transactions-view .filter-client-type,
#transactions-view .filter-certificate {
  min-width: 0;
}

#transactions-view .filter-reset {
  height: 44px;
  width: 100%;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0 9px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #71809a;
  font-size: 15px;
  font-weight: 750;
  box-shadow: none;
}

#transactions-view .filter-reset:hover {
  color: #245fd8;
  background: #eef4ff;
}

@media (max-width: 1200px) {
  #transactions-view .filters {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  #transactions-view .filter-search { grid-column: 1 / -1; }

  #transactions-view .filter-select,
  #transactions-view .filter-reset {
    width: 100%;
    min-width: 0;
  }
}

@media (max-width: 780px) {
  #transactions-view .filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 12px;
    gap: 11px;
  }

  #transactions-view .filter-search { grid-column: 1 / -1; }

  #transactions-view .filter-select,
  #transactions-view .filter-reset {
    width: 100%;
    min-width: 0;
  }
  #transactions-view .filter-reset {
    justify-content: center;
    border: 1px solid #d8e3f7;
  }
}

@media (max-width: 520px) {
  #transactions-view .filters { grid-template-columns: 1fr; }
  #transactions-view .filter-search { grid-column: auto; }
}
.withholding-option{align-items:center;gap:10px;min-height:48px;padding:12px 14px!important;border:1px solid var(--line);border-radius:12px;background:#f6f9ff;color:var(--ink)}
.withholding-option input{width:18px!important;height:18px;accent-color:var(--green)}
#transaction-form .money-section-heading{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:4px 15px;margin:0 0 14px}
#transaction-form .money-section-heading>h3{margin:0;font-size:16px;font-weight:800;line-height:1.45}
#transaction-form .money-section-heading #withholding-applies-field{align-self:center;gap:8px;min-height:44px;margin:0;padding:4px 0!important;border:0;border-radius:0;background:transparent;font-size:13px;font-weight:700;line-height:1.45;white-space:nowrap}
#transaction-form .money-section-heading #withholding-applies{flex:0 0 18px;margin:0;accent-color:#155eef}
#transaction-form #fastwork-card #fee-applies-field{align-self:center;gap:8px;min-height:44px;padding:4px 0!important;font-size:13px;font-weight:700;line-height:1.45;white-space:normal}
#transaction-form #fastwork-fee-applies{flex:0 0 18px;width:18px!important;min-width:18px;height:18px;min-height:18px;margin:0;padding:0;accent-color:#155eef}
@media(max-width:780px){#transaction-form #fastwork-card #fee-applies-field{font-size:12px}}
@media(max-width:780px){#transaction-form .money-section-heading{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:2px 10px}#transaction-form .money-section-heading #withholding-applies-field{font-size:12px}}
.heading-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}
@media(max-width:780px){.page-heading{align-items:flex-start}.heading-actions{width:100%;justify-content:flex-start}.heading-actions button{flex:1 1 auto}#quick-template{font-size:14px}#quick-template:after{content:none}}

#import-document{border-color:#b9cdf5;background:#f3f7ff;color:#155eef;box-shadow:none;transform:none}
#import-document:hover{border-color:#8eace9;background:#e8f0ff;color:#0d45b8;transform:none}
#import-document:focus-visible{outline:3px solid rgba(21,94,239,.2);outline-offset:2px}
#import-document.is-loading{cursor:wait;opacity:.72}
.pdf-import-summary{display:flex;align-items:flex-start;gap:12px;margin:18px 0 4px;padding:14px 15px;border:1px solid #b8ddc7;border-radius:12px;background:#f0faf4;color:#174d31}
.pdf-import-summary.is-warning{border-color:#edcf8c;background:#fff8e8;color:#76530e}
.pdf-import-summary-icon{display:grid;flex:0 0 28px;width:28px;height:28px;place-items:center;border-radius:999px;background:#d8f2e2;color:#167247;font-size:15px;font-weight:900}
.pdf-import-summary.is-warning .pdf-import-summary-icon{background:#f8e7b9;color:#986815}
.pdf-import-summary strong{display:block;font-size:14px;line-height:1.35}
.pdf-import-summary p{margin:3px 0 2px;font-size:12px;font-weight:750;line-height:1.45}
.pdf-import-summary small{display:block;color:#5f7468;font-size:11px;line-height:1.45}
.pdf-import-summary.is-warning small{color:#7c6a40}
@media(max-width:780px){#transactions-view .heading-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}#transactions-view .heading-actions button{width:100%;min-width:0}.pdf-import-summary{margin-top:16px;padding:13px}.pdf-import-summary p{overflow-wrap:anywhere}}
.fastwork-customer-tag{display:inline-flex!important;width:max-content;align-items:center;margin-top:4px;padding:4px 8px!important;border:0;border-radius:999px;background:#eaf0ff;color:#3156bc!important;font-size:11px!important;font-weight:800;line-height:1.15;white-space:nowrap}

/* Dashboard year selector: larger and easier to tap. */
#dashboard-view .dashboard-title-line .dashboard-year-picker{
  gap:14px;
  min-height:70px;
  padding:10px 17px;
  border-radius:17px;
  font-size:29px;
}
#dashboard-view .dashboard-title-line .dashboard-year-picker select{
  min-width:178px;
  min-height:60px;
  padding:8px 42px 8px 15px;
  border-radius:12px;
  font-size:40px;
}
@media(max-width:780px){
  #dashboard-view .dashboard-title-line .dashboard-year-picker{
    min-height:58px;
    padding:8px 13px;
    font-size:24px;
  }
  #dashboard-view .dashboard-title-line .dashboard-year-picker select{
    min-width:150px;
    min-height:52px;
    font-size:34px;
  }
}

/* Transaction filters: stretch across the full desktop toolbar. */
@media(min-width:1001px){
  #transactions-view .filters{
    display:flex;
    align-items:center;
    gap:12px;
  }
  #transactions-view .filters > *{width:auto;max-width:none}
  #transactions-view .filter-search{flex:2.5 1 340px;min-width:280px}
  #transactions-view .filter-year{flex:0 0 110px}
  #transactions-view .filter-channel{flex:1 1 190px}
  #transactions-view .filter-client-type{flex:1.15 1 210px}
  #transactions-view .filter-certificate{flex:.9 1 175px}
  #transactions-view .filter-reset{flex:0 0 82px}
}
.channel-tiktok{color:#fff!important;background:#17191d!important;border-color:#17191d!important}
.recent-channel-tag{display:inline-flex;align-items:center;padding:3px 7px;border:1px solid transparent;border-radius:6px;font-size:10px;font-weight:800;line-height:1.2;vertical-align:middle}
.recent-job-meta > span[aria-hidden="true"]{display:none!important}

/* Tax center: group work by company and keep every entry editable. */
.tax-pending-panel{overflow:hidden;padding:0}.tax-pending-panel>.section-heading{padding:22px 24px 18px;margin:0;border-bottom:1px solid var(--line)}
.tax-company-group{border-bottom:1px solid var(--line)}.tax-company-group:last-child{border-bottom:0}
.tax-company-heading{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:17px 24px;background:#f5f8ff}.tax-company-heading span{display:block;margin-bottom:2px;color:var(--blue);font-size:10px;font-weight:850;letter-spacing:.08em;text-transform:uppercase}.tax-company-heading h3{margin:0;color:var(--ink);font-size:16px;line-height:1.35}.tax-company-heading>strong{flex:none;padding:5px 9px;border-radius:999px;background:#e7efff;color:var(--blue);font-size:11px}
.tax-company-jobs{padding:0 24px}.tax-job-row{display:flex;align-items:center;gap:16px;border-top:1px solid var(--line)}.tax-job-row:first-child{border-top:0}.tax-job-main{min-width:0;flex:1;padding:15px 0;border:0;background:transparent;text-align:left;color:var(--ink)}.tax-job-main>strong{display:block;font-size:14px;line-height:1.4}.tax-job-main>small{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:5px;color:var(--muted);font-size:11px;line-height:1.5}.tax-job-main>small span{white-space:nowrap}.tax-job-main:hover>strong{color:var(--blue);text-decoration:underline}.tax-job-status{flex:none;min-width:74px;text-align:center;justify-content:center}
.tax-pending-panel .tax-empty{padding:26px 24px}
@media(max-width:780px){.tax-pending-panel>.section-heading,.tax-company-heading{padding-left:16px;padding-right:16px}.tax-company-jobs{padding:0 16px}.tax-job-row{align-items:flex-start;gap:10px}.tax-job-main{padding:14px 0}.tax-job-main>small{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3px 10px}.tax-job-status{margin-top:14px;min-width:68px}}

/* Tax center readability pass. */
.tax-pending-panel{background:#fff}.tax-pending-panel>.section-heading{background:#fff}
#tax-entry-list,#tax-pending-list{display:grid;gap:12px;padding:14px;background:#f6f8fc}
.tax-company-group{overflow:hidden;border:1px solid #dbe4f3!important;border-radius:14px;background:#fff;box-shadow:0 4px 12px rgba(31,58,112,.04)}
.tax-company-heading{padding:15px 18px;background:#edf3ff;border-bottom:1px solid #dbe4f3}.tax-company-heading span{margin-bottom:4px}.tax-company-heading h3{font-size:17px}.tax-company-heading>strong{background:#fff;border:1px solid #d5e2fb}
.tax-company-jobs{padding:0 18px}.tax-job-row{gap:18px;padding:0}.tax-job-main{padding:17px 0}.tax-job-main>strong{font-size:15px;line-height:1.45}
.tax-job-main>small{display:grid;grid-template-columns:1.05fr 1.35fr 1fr 1fr 1fr;gap:12px;margin-top:10px;font-size:11px}.tax-job-main>small span{display:grid;gap:2px;min-width:0;white-space:normal}.tax-job-main>small em{color:#8995aa;font-size:10px;font-style:normal;font-weight:700}.tax-job-main>small b{overflow:hidden;color:#53627b;font-size:12px;font-weight:750;line-height:1.35;text-overflow:ellipsis;white-space:nowrap}.tax-job-main>small .tax-net-detail b{color:var(--blue)}
.tax-job-status{min-width:82px;padding:7px 10px;border-radius:999px;font-size:11px}
@media(max-width:900px){.tax-job-main>small{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:620px){#tax-entry-list,#tax-pending-list{gap:10px;padding:10px}.tax-company-heading{padding:13px 14px}.tax-company-heading h3{font-size:15px}.tax-company-jobs{padding:0 14px}.tax-job-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}.tax-job-main{padding:14px 0}.tax-job-main>small{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 12px}.tax-job-status{margin-top:14px;min-width:70px}.tax-job-main>small span:last-child{grid-column:span 2}}

/* Tax center full card redesign. */
#tax-entry-list,#tax-pending-list{gap:18px;padding:18px;background:#f4f7fc}
.tax-company-card{overflow:hidden;border:1px solid #d9e3f2;border-radius:18px;background:#fff;box-shadow:0 8px 24px rgba(30,55,100,.06)}
.tax-company-card-head{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 20px;border-bottom:1px solid #dde6f3;background:linear-gradient(135deg,#edf3ff,#f8faff)}
.tax-company-identity{display:flex;align-items:center;min-width:0;gap:12px}.tax-company-avatar{display:grid;flex:none;width:40px;height:40px;place-items:center;border-radius:12px;background:var(--blue);color:#fff;font-size:17px;font-weight:900}.tax-company-identity p{margin:0 0 2px;color:#6f82a2;font-size:10px;font-weight:850;letter-spacing:.08em}.tax-company-identity h3{overflow:hidden;margin:0;color:#17233a;font-size:18px;line-height:1.35;text-overflow:ellipsis;white-space:nowrap}.tax-company-count{flex:none;padding:6px 10px;border:1px solid #d4e0f5;border-radius:999px;background:#fff;color:var(--blue);font-size:11px;font-weight:850}
.tax-entry-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:16px;background:#f8faff}
.tax-entry-card{display:flex;min-width:0;flex-direction:column;padding:17px;border:1px solid #dce5f2;border-radius:14px;background:#fff;box-shadow:0 3px 10px rgba(36,61,107,.035)}
.tax-entry-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.tax-entry-title{min-width:0}.tax-entry-title h4{margin:0;color:#17233a;font-size:15px;line-height:1.45}.tax-entry-meta{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin-top:7px;color:#71809a;font-size:11px;font-weight:700}.tax-entry-meta>span:first-child{padding:3px 7px;border-radius:6px;background:#f0f3f8}.tax-entry-status{flex:none;min-width:76px;padding:7px 10px;border-radius:999px;text-align:center;justify-content:center;font-size:11px}
.tax-money-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:16px}.tax-money-summary>div{min-width:0;padding:10px;border-radius:10px;background:#f5f7fb}.tax-money-summary span{display:block;margin-bottom:4px;color:#8490a5;font-size:9px;font-weight:750;line-height:1.3}.tax-money-summary strong{display:block;overflow:hidden;color:#34435c;font-size:13px;line-height:1.3;text-overflow:ellipsis;white-space:nowrap}.tax-money-summary .tax-money-net{background:#eaf1ff}.tax-money-summary .tax-money-net strong{color:var(--blue)}
.tax-edit-entry{display:flex;align-items:center;justify-content:space-between;width:100%;margin-top:14px;padding:9px 11px;border:1px solid #d8e3f4;border-radius:9px;background:#fff;color:#52647f;font-size:11px;font-weight:800}.tax-edit-entry:hover{border-color:#a9c2f2;background:#f2f6ff;color:var(--blue)}.tax-edit-entry span{font-size:15px;line-height:1}
@media(max-width:900px){.tax-entry-grid{grid-template-columns:1fr}}
@media(max-width:620px){#tax-entry-list,#tax-pending-list{gap:12px;padding:10px}.tax-company-card{border-radius:14px}.tax-company-card-head{padding:14px}.tax-company-avatar{width:36px;height:36px;border-radius:10px}.tax-company-identity h3{font-size:15px}.tax-entry-grid{gap:10px;padding:10px}.tax-entry-card{padding:14px}.tax-entry-card-top{gap:8px}.tax-entry-title h4{font-size:14px}.tax-entry-status{min-width:68px;padding:6px 8px}.tax-money-summary{gap:6px}.tax-money-summary>div{padding:8px 7px}.tax-money-summary strong{font-size:11px}}

/* Tax center simple grouped table. */
#tax-entry-list,#tax-pending-list{display:grid;gap:20px;padding:18px 22px 22px;background:#fff}
.tax-simple-group{overflow:hidden;border:1px solid #dce4ef;border-radius:12px;background:#fff}
.tax-simple-company{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:15px 18px;border-bottom:1px solid #dce4ef;background:#f5f7fa}.tax-simple-company span{display:block;margin-bottom:2px;color:#7c899d;font-size:9px;font-weight:800;letter-spacing:.08em}.tax-simple-company h3{margin:0;color:#17233a;font-size:16px;line-height:1.4}.tax-simple-company>strong{flex:none;color:#63738b;font-size:11px;font-weight:750}
.tax-simple-columns,.tax-simple-row{display:grid;grid-template-columns:minmax(260px,2.2fr) minmax(90px,.7fr) minmax(90px,.7fr) minmax(100px,.8fr) minmax(126px,.9fr);gap:16px;align-items:center}.tax-simple-columns{padding:10px 18px;border-bottom:1px solid #e6ebf2;background:#fff;color:#8a96a8;font-size:9px;font-weight:800}.tax-simple-columns span:not(:first-child){text-align:right}
.tax-simple-row{padding:14px 18px;border-top:1px solid #e6ebf2}.tax-simple-row:first-child{border-top:0}.tax-simple-row:hover{background:#fafcff}.tax-simple-info{min-width:0}.tax-simple-info h4{overflow:hidden;margin:0;color:#17233a;font-size:14px;line-height:1.45;text-overflow:ellipsis;white-space:nowrap}.tax-simple-info small{display:flex;flex-wrap:wrap;gap:5px 12px;margin-top:4px;color:#73819a;font-size:10px;font-weight:650}.tax-simple-info small span{white-space:nowrap}
.tax-simple-money{text-align:right}.tax-simple-money>span{display:none}.tax-simple-money strong{color:#46546b;font-size:13px;white-space:nowrap}.tax-simple-net strong{color:var(--blue)}
.tax-simple-actions{display:flex;align-items:center;justify-content:flex-end;gap:7px}.tax-simple-actions .status{flex:none;min-width:68px;text-align:center;justify-content:center}.tax-simple-edit{padding:6px 9px;border:1px solid #d7e0ec;border-radius:7px;background:#fff;color:#596b84;font-size:10px;font-weight:800}.tax-simple-edit:hover{border-color:#a9bfe3;background:#f3f7ff;color:var(--blue)}
@media(max-width:900px){.tax-simple-columns{display:none}.tax-simple-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"info info" "gross tax" "net actions";gap:12px 18px;padding:16px}.tax-simple-info{grid-area:info}.tax-simple-row>.tax-simple-money:nth-child(2){grid-area:gross}.tax-simple-row>.tax-simple-money:nth-child(3){grid-area:tax}.tax-simple-row>.tax-simple-money:nth-child(4){grid-area:net}.tax-simple-actions{grid-area:actions;align-self:end}.tax-simple-money{text-align:left}.tax-simple-money>span{display:block;margin-bottom:3px;color:#8a96a8;font-size:9px;font-weight:750}.tax-simple-actions{justify-content:flex-end}}
@media(max-width:620px){#tax-entry-list,#tax-pending-list{gap:14px;padding:12px}.tax-simple-company{padding:13px 14px}.tax-simple-company h3{font-size:14px}.tax-simple-row{gap:11px 14px;padding:14px}.tax-simple-info h4{font-size:13px}.tax-simple-money strong{font-size:12px}.tax-simple-actions{gap:5px}.tax-simple-actions .status{min-width:62px;padding:6px 7px;font-size:9px}.tax-simple-edit{padding:6px 8px;font-size:9px}}

/* Tax center classic list, based on the original design. */
#tax-entry-list,#tax-pending-list{display:block;padding:4px 24px 22px;background:#fff}
.tax-classic-company{margin-top:18px}.tax-classic-company:first-child{margin-top:12px}
.tax-classic-company-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:11px 13px;border-radius:8px;background:#f3f6fb}.tax-classic-company-head span{display:block;margin-bottom:1px;color:#7d8ba1;font-size:9px;font-weight:800;letter-spacing:.07em}.tax-classic-company-head h3{margin:0;color:#24324a;font-size:14px;line-height:1.4}.tax-classic-company-head>strong{flex:none;color:#77859a;font-size:10px;font-weight:750}
.tax-classic-list{padding:0 2px}.tax-classic-row{display:flex;align-items:center;gap:18px;border-bottom:1px solid #e2e8f1}.tax-classic-row:last-child{border-bottom:0}.tax-classic-main{min-width:0;flex:1;padding:14px 0;border:0;background:transparent;text-align:left;color:#17233a}.tax-classic-main>strong{display:block;font-size:14px;line-height:1.45}.tax-classic-main>small{display:flex;flex-wrap:wrap;align-items:center;gap:5px 0;margin-top:3px;color:#728099;font-size:10px;font-weight:650;line-height:1.5}.tax-classic-main>small span{white-space:nowrap}.tax-classic-main>small span+span{margin-left:9px;padding-left:9px;border-left:1px solid #ccd5e2}.tax-classic-main:hover>strong{color:var(--blue);text-decoration:underline}.tax-classic-status{display:flex;flex:none;align-items:center;justify-content:flex-end;min-width:78px}.tax-classic-status .status{min-width:70px;text-align:center;justify-content:center}
@media(max-width:620px){#tax-entry-list,#tax-pending-list{padding:2px 14px 16px}.tax-classic-company{margin-top:14px}.tax-classic-company-head{padding:10px 11px}.tax-classic-company-head h3{font-size:13px}.tax-classic-row{align-items:flex-start;gap:10px}.tax-classic-main{padding:13px 0}.tax-classic-main>strong{font-size:13px}.tax-classic-main>small{display:grid;grid-template-columns:repeat(2,minmax(0,max-content));gap:3px 10px}.tax-classic-main>small span+span{margin:0;padding:0;border:0}.tax-classic-status{min-width:64px;padding-top:13px}.tax-classic-status .status{min-width:62px;padding:6px 7px;font-size:9px}}

/* Tax center grouped ledger. */
#tax-entry-list,#tax-pending-list{display:block;padding:0;background:#fff}
.tax-ledger-company+.tax-ledger-company{border-top:8px solid #f2f4f8}
.tax-ledger-company-head{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 22px;border-bottom:1px solid #e2e7ef;background:#f8fafc}.tax-ledger-company-head>div:first-child{min-width:0}.tax-ledger-company-head h3{overflow:hidden;margin:0;color:#24324a;font-size:15px;line-height:1.4;text-overflow:ellipsis;white-space:nowrap}.tax-ledger-company-head>div:first-child span{display:block;margin-top:2px;color:#8490a3;font-size:10px;font-weight:700}.tax-ledger-company-head>div:last-child{display:grid;flex:none;justify-items:end;gap:1px}.tax-ledger-company-head>div:last-child span{color:#8994a6;font-size:9px;font-weight:700}.tax-ledger-company-head>div:last-child strong{color:#334159;font-size:13px}
.tax-ledger-row{display:grid;grid-template-columns:4px minmax(230px,1fr) minmax(300px,.9fr) 82px 20px;gap:16px;align-items:center;min-height:76px;padding:0 22px;border-bottom:1px solid #e8ecf2;background:#fff}.tax-ledger-row:last-child{border-bottom:0}.tax-ledger-row:hover{background:#fbfcff}.tax-ledger-mark{align-self:stretch;width:4px;margin:12px 0;border-radius:999px;background:#d5dbe5}.tax-ledger-row--waiting .tax-ledger-mark{background:#e3a33f}.tax-ledger-row--filed .tax-ledger-mark{background:#36a269}.tax-ledger-row--certificate .tax-ledger-mark{background:#d96a67}
.tax-ledger-main{min-width:0;padding:14px 0;border:0;background:transparent;text-align:left;color:#17233a}.tax-ledger-main>strong{display:block;overflow:hidden;font-size:14px;line-height:1.45;text-overflow:ellipsis;white-space:nowrap}.tax-ledger-main>small{display:flex;flex-wrap:wrap;gap:5px 13px;margin-top:4px;color:#77859b;font-size:10px;font-weight:650}.tax-ledger-main>small span{white-space:nowrap}.tax-ledger-main:hover>strong{color:var(--blue);text-decoration:underline}
.tax-ledger-money{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.tax-ledger-money>span{display:grid;min-width:0;justify-items:end;gap:2px}.tax-ledger-money small{color:#8a95a7;font-size:9px;font-weight:700}.tax-ledger-money strong{overflow:hidden;max-width:100%;color:#46546b;font-size:12px;text-overflow:ellipsis;white-space:nowrap}.tax-ledger-money .tax-ledger-net strong{color:var(--blue)}
.tax-ledger-status{display:flex;justify-content:flex-end}.tax-ledger-status .status{min-width:72px;text-align:center;justify-content:center}.tax-ledger-open{display:grid;width:20px;height:32px;padding:0;place-items:center;border:0;background:transparent;color:#9aa5b5;font-size:24px;font-weight:400}.tax-ledger-open:hover{color:var(--blue)}
@media(max-width:900px){.tax-ledger-row{grid-template-columns:4px minmax(0,1fr) auto;grid-template-areas:"mark main status" "mark money open";gap:10px 14px;padding:12px 18px}.tax-ledger-mark{grid-area:mark;margin:0}.tax-ledger-main{grid-area:main;padding:0}.tax-ledger-money{grid-area:money}.tax-ledger-status{grid-area:status}.tax-ledger-open{grid-area:open}.tax-ledger-money>span{justify-items:start}}
@media(max-width:620px){.tax-ledger-company-head{padding:12px 14px}.tax-ledger-company-head h3{font-size:13px}.tax-ledger-row{grid-template-columns:4px minmax(0,1fr) auto;gap:10px;padding:12px 14px}.tax-ledger-main>strong{font-size:13px}.tax-ledger-main>small{gap:4px 9px}.tax-ledger-money{gap:10px}.tax-ledger-money small{font-size:8px}.tax-ledger-money strong{font-size:10px}.tax-ledger-status .status{min-width:64px;padding:6px 7px;font-size:9px}.tax-ledger-open{width:18px}}

/* Tax center expandable data table. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
#tax-entry-list,#tax-pending-list{display:block;padding:0;background:#fff}
.tax-table-group+.tax-table-group{border-top:8px solid #f1f3f7}.tax-table-group>summary{display:flex;align-items:center;gap:22px;padding:15px 22px;border-bottom:1px solid #dfe5ed;background:#f8fafc;cursor:pointer;list-style:none}.tax-table-group>summary::-webkit-details-marker{display:none}.tax-table-company{min-width:0;flex:1}.tax-table-company h3{overflow:hidden;margin:0;color:#1d2a40;font-size:15px;line-height:1.4;text-overflow:ellipsis;white-space:nowrap}.tax-table-company>span{display:block;margin-top:2px;color:#8390a3;font-size:10px;font-weight:700}.tax-table-totals{display:flex;flex:none;gap:28px}.tax-table-totals>span{display:grid;min-width:88px;justify-items:end;gap:1px}.tax-table-totals small{color:#8a95a6;font-size:9px;font-weight:700}.tax-table-totals strong{color:#3d4b61;font-size:12px}.tax-table-chevron{flex:none;color:#8794a8;font-size:24px;line-height:1;transform:rotate(0deg);transition:transform .15s ease}.tax-table-group[open] .tax-table-chevron{transform:rotate(90deg)}
.tax-table-scroll{overflow-x:auto}.tax-data-table{width:100%;border-collapse:collapse;table-layout:fixed}.tax-data-table th,.tax-data-table td{padding:12px 10px;border-bottom:1px solid #e7ebf1;text-align:left;vertical-align:middle}.tax-data-table th:first-child,.tax-data-table td:first-child{padding-left:22px}.tax-data-table th:last-child,.tax-data-table td:last-child{padding-right:22px}.tax-data-table th{background:#fff;color:#8591a3;font-size:9px;font-weight:800;letter-spacing:.02em}.tax-data-table th:nth-child(1){width:110px}.tax-data-table th:nth-child(2){width:25%}.tax-data-table th:nth-child(3){width:15%}.tax-data-table th:nth-child(4),.tax-data-table th:nth-child(5),.tax-data-table th:nth-child(6){width:11%}.tax-data-table th:nth-child(7){width:90px}.tax-data-table th:nth-child(8){width:62px}.tax-data-table .numeric{text-align:right}.tax-data-table tbody tr:nth-child(even){background:#fafbfd}.tax-data-table tbody tr:hover{background:#f4f8ff}.tax-data-table tbody tr:last-child td{border-bottom:0}.tax-data-table td{color:#59677d;font-size:11px;font-weight:650}.tax-cell-date{white-space:nowrap}.tax-cell-job button{overflow:hidden;max-width:100%;padding:0;border:0;background:transparent;color:#17233a;font-size:12px;font-weight:800;text-align:left;text-overflow:ellipsis;white-space:nowrap}.tax-cell-job button:hover{color:var(--blue);text-decoration:underline}.tax-cell-net{color:var(--blue)!important;font-weight:850!important}.tax-cell-status{text-align:center!important}.tax-cell-status .status{min-width:68px;text-align:center;justify-content:center}.tax-cell-edit{text-align:right!important}.tax-cell-edit button{padding:6px 8px;border:1px solid #d7e0ec;border-radius:7px;background:#fff;color:#596b84;font-size:9px;font-weight:800}.tax-cell-edit button:hover{border-color:#a9bfe3;background:#f1f5ff;color:var(--blue)}
@media(max-width:700px){.tax-table-group>summary{gap:12px;padding:13px 14px}.tax-table-company h3{font-size:13px}.tax-table-totals{gap:12px}.tax-table-totals>span{min-width:68px}.tax-table-totals>span:first-child{display:none}.tax-data-table,.tax-data-table tbody{display:block;min-width:0}.tax-data-table thead{display:none}.tax-data-table tbody tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px 14px;padding:14px;border-bottom:1px solid #e2e7ef}.tax-data-table th,.tax-data-table td,.tax-data-table th:first-child,.tax-data-table td:first-child,.tax-data-table th:last-child,.tax-data-table td:last-child{width:auto;padding:0;border:0}.tax-data-table td{display:grid;gap:2px;text-align:left!important}.tax-data-table td:before{content:attr(data-label);color:#8b96a7;font-size:8px;font-weight:750}.tax-data-table .tax-cell-job{grid-column:1/-1;grid-row:1}.tax-data-table .tax-cell-job:before{display:none}.tax-cell-date{grid-row:2}.tax-cell-channel{grid-row:2}.tax-data-table td:nth-child(4),.tax-data-table td:nth-child(5){grid-row:3}.tax-data-table .tax-cell-net{grid-column:1;grid-row:4}.tax-data-table .tax-cell-status{grid-column:2;grid-row:4;justify-items:end}.tax-data-table .tax-cell-edit{grid-column:1/-1;grid-row:5}.tax-cell-edit button{width:100%;padding:8px}.tax-cell-status .status{min-width:66px}}

/* Tax company headers are now static; all rows remain visible. */
.tax-table-group>.tax-table-group-head{display:flex;align-items:center;gap:22px;padding:15px 22px;border-bottom:1px solid #dfe5ed;background:#f8fafc}.tax-table-group-head .tax-table-company{flex:1}.tax-table-group-head .tax-table-totals{margin-left:auto}
@media(max-width:700px){.tax-table-group>.tax-table-group-head{gap:12px;padding:13px 14px}}

/* Visually separate each company section. */
#tax-entry-list,#tax-pending-list{display:grid;gap:16px;padding:16px;background:#f4f6fa}
.tax-table-group{overflow:hidden;border:1px solid #d8e1ed;border-radius:12px;background:#fff;box-shadow:0 3px 12px rgba(33,52,85,.045)}
.tax-table-group+.tax-table-group{border-top:1px solid #d8e1ed}
.tax-table-group>.tax-table-group-head{position:relative;padding-left:26px;background:#eef3fb}
.tax-table-group>.tax-table-group-head:before{position:absolute;top:7px;bottom:7px;left:7px;width:5px;border-radius:999px;background:#2f6fed;content:""}
.tax-table-company h3{font-size:16px}.tax-table-company>span{color:#687891}
@media(max-width:700px){#tax-entry-list,#tax-pending-list{gap:12px;padding:10px}.tax-table-group{border-radius:10px}.tax-table-group>.tax-table-group-head{padding-left:19px}.tax-table-group>.tax-table-group-head:before{top:6px;bottom:6px;left:6px;width:4px}.tax-table-company h3{font-size:14px}}

/* iPhone tax groups: stack totals below the company and status controls. */
@media(max-width:700px){
  .tax-table-group>.tax-table-group-head{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:"company status" "totals totals";
    align-items:start!important;
    gap:12px 10px!important;
    padding:14px 14px 13px 19px!important;
  }
  .tax-table-group-head>.tax-table-company{
    grid-area:company;
    min-width:0!important;
  }
  .tax-table-group-head>.tax-company-status{
    grid-area:status;
    position:relative!important;
    align-self:start;
    margin:0 6px 0 0!important;
  }
  .tax-table-group-head>.tax-table-totals{
    grid-area:totals;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr));
    width:100%;
    margin:0!important;
    padding-top:11px;
    gap:8px!important;
    border-top:1px solid rgba(185,202,231,.72);
  }
  .tax-table-group-head>.tax-table-totals>span{
    min-width:0!important;
    padding:9px 10px;
    border-radius:9px;
    background:rgba(255,255,255,.72);
    justify-items:start!important;
  }
  .tax-table-group-head>.tax-table-totals strong{
    max-width:100%;
    overflow:hidden;
    font-size:14px!important;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  html.iphone-interaction-locked .tax-table-group-head>.tax-company-status .certificate-notification-count,
  html.iphone-interaction-locked .tax-cell-status .certificate-notification-count{
    top:-8px;
    right:-12px;
  }
  html.iphone-interaction-locked #transaction-rows .status[data-toggle-certificate]:has(.certificate-notification-count) .certificate-notification-count{
    top:-7px;
    right:-10px;
    width:17px;
    min-width:17px;
    height:17px;
    font-size:8px;
  }
  html.iphone-interaction-locked #tax-view .tax-cell-status .status:has(.certificate-notification-count) .certificate-notification-count{
    top:-8px;
    right:-12px;
  }
}

/* Tax page quick search and jump. */
.tax-search-panel{position:relative;z-index:4;display:grid;grid-template-columns:minmax(240px,.75fr) minmax(420px,1.25fr);align-items:center;gap:28px;padding:20px 24px;overflow:visible;border-color:#d9e3f2;background:#fff}
.tax-search-copy h2{margin:0 0 4px;color:#1d2a40;font-size:18px;line-height:1.35}.tax-search-copy p{margin:0;color:#71809a;font-size:12px;font-weight:650;line-height:1.55}
.tax-search-form{position:relative;min-width:0}.tax-search-control{display:flex;align-items:center;gap:6px;padding:5px;border:1px solid #c9d8ef;border-radius:14px;background:#fff;box-shadow:0 4px 14px rgba(38,68,122,.06);transition:border-color .18s ease,box-shadow .18s ease}.tax-search-control:focus-within{border-color:#6f9af3;box-shadow:0 0 0 4px rgba(37,99,235,.1)}
.tax-search-control input{min-width:0;flex:1;height:44px;padding:0 13px;border:0;border-radius:10px;background:transparent;color:#17233a;font-size:14px;font-weight:700;box-shadow:none}.tax-search-control input:focus{outline:0}.tax-search-control input::placeholder{color:#8b99ae;font-weight:650}
.tax-search-control button{flex:none;height:44px;padding:0 20px;border:0;border-radius:10px;background:#2563eb;color:#fff;font-family:inherit;font-size:13px;font-weight:850;box-shadow:0 5px 12px rgba(37,99,235,.2)}.tax-search-control button:hover{background:#174fc8}.tax-search-control button:focus-visible{outline:3px solid rgba(37,99,235,.25);outline-offset:2px}
.tax-search-feedback{margin:7px 3px 0;color:#8794a8;font-size:10px;font-weight:650;line-height:1.4}
.tax-search-results{position:absolute;top:58px;right:0;left:0;z-index:30;max-height:360px;overflow:auto;overscroll-behavior:contain;border:1px solid #cbd8ec;border-radius:13px;background:#fff;box-shadow:0 18px 42px rgba(24,45,82,.18)}
.tax-search-result{display:grid;width:100%;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:18px;padding:13px 15px;border:0;border-top:1px solid #e6ebf3;background:#fff;color:#17233a;font-family:inherit;text-align:left}.tax-search-result:first-child{border-top:0}.tax-search-result:hover,.tax-search-result.is-active{background:#eef4ff}.tax-search-result:focus-visible{position:relative;z-index:1;outline:2px solid #6f9af3;outline-offset:-2px}
.tax-search-result-copy{display:grid;min-width:0;gap:4px}.tax-search-result-copy strong{overflow:hidden;font-size:13px;font-weight:850;line-height:1.35;text-overflow:ellipsis;white-space:nowrap}.tax-search-result-copy small{display:flex;min-width:0;flex-wrap:wrap;gap:4px 10px;color:#6f7f98;font-size:10px;font-weight:700;line-height:1.4}.tax-search-result-copy small>span{color:#385d9e}
.tax-search-result-meta{display:grid;flex:none;justify-items:end;gap:4px}.tax-search-result-meta b{padding:4px 7px;border-radius:999px;background:#eaf1ff;color:#245fd8;font-size:9px;font-weight:850;white-space:nowrap}.tax-search-result-meta time{color:#8a96a8;font-size:9px;font-weight:700;white-space:nowrap}.tax-search-empty{padding:18px;color:#71809a;font-size:12px;font-weight:700;text-align:center}
.tax-data-table tr.tax-search-target>td{animation:tax-search-flash 2.2s ease-out}
@keyframes tax-search-flash{0%,38%{background:#dfeaff;box-shadow:inset 0 2px #7da5f5,inset 0 -2px #7da5f5}100%{background:transparent;box-shadow:none}}
@media(max-width:780px){.tax-search-panel{grid-template-columns:1fr;gap:12px;padding:16px}.tax-search-copy h2{font-size:16px}.tax-search-copy p{font-size:11px}.tax-search-control input{font-size:13px}.tax-search-control button{padding:0 16px}.tax-search-results{top:58px}}
@media(max-width:480px){.tax-search-panel{padding:14px}.tax-search-control{gap:4px}.tax-search-control input{padding:0 9px}.tax-search-control button{padding:0 13px}.tax-search-result{gap:10px;padding:12px}.tax-search-result-meta time{display:none}}

/* Minimal tax search: one clean field only. */
.tax-search-panel{display:block;position:relative;z-index:4;padding:0;margin:0 0 18px;border:0;background:transparent;box-shadow:none}
.tax-search-panel .tax-search-copy,.tax-search-panel .tax-search-control button,.tax-search-panel .tax-search-feedback{display:none!important}
.tax-search-form{width:100%;max-width:none}
.tax-search-control{position:relative;display:block;padding:0;border:1px solid #d2dced;border-radius:14px;background:#fff;box-shadow:0 2px 8px rgba(38,68,122,.035)}
.tax-search-control:before{position:absolute;top:50%;left:18px;width:13px;height:13px;border:2px solid #8090a8;border-radius:50%;content:"";transform:translateY(-58%);pointer-events:none}
.tax-search-control:after{position:absolute;top:50%;left:31px;width:7px;height:2px;border-radius:999px;background:#8090a8;content:"";transform:translateY(5px) rotate(45deg);transform-origin:left center;pointer-events:none}
.tax-search-control:focus-within{border-color:#7fa2ec;box-shadow:0 0 0 4px rgba(37,99,235,.08)}
.tax-search-control input{width:100%;height:52px;padding:0 46px;border:0;border-radius:14px;background:transparent;font-size:14px;font-weight:700}
.tax-search-results{top:60px}
@media(max-width:780px){.tax-search-panel{padding:0}.tax-search-control input{height:50px;padding-right:38px;padding-left:44px}.tax-search-results{top:58px}}

/* Tax search mirrors the customer-directory search. */
#tax-view .tax-directory-tools{width:min(270px,100%);margin:0 0 18px auto}
#tax-view .tax-directory-tools input{width:100%;height:38px;padding:0 12px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink);font-size:13px}
@media(max-width:780px){#tax-view .tax-directory-tools{width:100%}}

/* Tax summary cards: income on the first row, statuses on the second. */
#tax-view .tax-summary-grid{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:14px;
  margin:0 0 22px;
}
#tax-view .tax-summary-card{
  --tax-summary-accent:#155eef;
  --tax-summary-soft:#edf3ff;
  position:relative;
  min-width:0;
  min-height:122px;
  overflow:hidden;
  padding:19px 19px 17px;
  border:1px solid #dbe4f2;
  border-radius:16px;
  background:linear-gradient(160deg,#fff 62%,var(--tax-summary-soft) 145%);
  box-shadow:0 7px 20px rgba(29,56,103,.055);
}
#tax-view .tax-summary-card:before{
  position:absolute;
  top:0;
  right:0;
  left:0;
  height:4px;
  background:var(--tax-summary-accent);
  content:"";
}
#tax-view .tax-summary-label{
  display:flex;
  min-width:0;
  align-items:center;
  gap:9px;
}
#tax-view .tax-summary-label>span{
  display:block;
  flex:none;
  width:9px;
  height:9px;
  margin:0;
  border-radius:999px;
  background:var(--tax-summary-accent);
  box-shadow:0 0 0 5px var(--tax-summary-soft);
}
#tax-view .tax-summary-label>p{
  overflow:hidden;
  margin:0;
  color:#64738b;
  font-size:12px;
  font-weight:820;
  line-height:1.35;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#tax-view .tax-summary-card>strong{
  display:block;
  margin-top:15px;
  color:#17233a;
  font-size:25px;
  font-weight:900;
  letter-spacing:-.55px;
  line-height:1.1;
  white-space:nowrap;
}
#tax-view .tax-summary-card>small{
  display:block;
  margin-top:7px;
  color:#8793a6;
  font-size:10px;
  font-weight:680;
  line-height:1.35;
}
#tax-view .tax-summary-company{--tax-summary-accent:#2563eb;--tax-summary-soft:#eaf1ff}
#tax-view .tax-summary-individual{--tax-summary-accent:#07855a;--tax-summary-soft:#e8f7f1}
#tax-view .tax-summary-company,
#tax-view .tax-summary-individual{grid-column:span 3}
#tax-view .tax-summary-withholding,
#tax-view .tax-summary-unfiled,
#tax-view .tax-summary-certificate{grid-column:span 2}
#tax-view .tax-summary-withholding{--tax-summary-accent:#7251c9;--tax-summary-soft:#f2eeff}
#tax-view .tax-summary-unfiled{--tax-summary-accent:#b67508;--tax-summary-soft:#fff5da}
#tax-view .tax-summary-certificate{--tax-summary-accent:#c23f49;--tax-summary-soft:#ffebed}
@media(max-width:880px){
  #tax-view .tax-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  #tax-view .tax-summary-card{grid-column:span 1}
}
@media(max-width:520px){
  #tax-view .tax-summary-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
  #tax-view .tax-summary-card{min-height:128px;padding:15px 11px 13px}
  #tax-view .tax-summary-company,
  #tax-view .tax-summary-individual{grid-column:span 3}
  #tax-view .tax-summary-withholding,
  #tax-view .tax-summary-unfiled,
  #tax-view .tax-summary-certificate{grid-column:span 2}
  #tax-view .tax-summary-label>p{font-size:10px;white-space:normal}
  #tax-view .tax-summary-card>strong{font-size:22px}
  #tax-view .tax-summary-withholding>strong,
  #tax-view .tax-summary-unfiled>strong,
  #tax-view .tax-summary-certificate>strong{font-size:19px}
}

/* Template controls follow the app's blue theme. */
#quick-template{
  border-color:#b9cdf7;
  background:#f7faff;
  color:#155eef;
  box-shadow:0 5px 14px rgba(21,94,239,.08);
  transform:none;
  transition:border-color .16s ease,background-color .16s ease,color .16s ease,box-shadow .16s ease;
}
#quick-template:hover{
  border-color:#86a8ed;
  background:#eaf1ff;
  color:#0d45b8;
  box-shadow:0 5px 14px rgba(21,94,239,.08);
  transform:none;
}
#quick-template:focus-visible{
  border-color:#6f98ec;
  outline:3px solid rgba(21,94,239,.14);
  outline-offset:2px;
}
#template-dialog .template-choice{
  border-color:#d1ddf1;
  background:#fbfdff;
  box-shadow:0 3px 10px rgba(31,67,129,.04);
  transition:border-color .16s ease,background-color .16s ease,box-shadow .16s ease;
}
#template-dialog .template-choice:hover{
  border-color:#9bb8ef;
  background:#f1f6ff;
  box-shadow:0 5px 14px rgba(31,67,129,.08);
}
#template-dialog .template-use strong{color:#155eef}
#template-dialog .template-use small{color:#66758d}
#template-dialog .template-remove{
  border-left-color:#d8e2f2;
  color:#8492a8;
}
#template-dialog .template-remove:hover{
  border-left-color:#efcaca;
  background:#fff1f1;
  color:#b7444b;
}

/* Customer notes use an isolated class so Safari's legacy contact line-clamp
   cannot collapse or cover the text when Fastwork links follow the note. */
#customers-view .customer-note-row{
  display:flex;
  flex:none;
  align-items:center;
  gap:10px;
  box-sizing:border-box;
  width:100%;
  min-width:0;
  height:auto;
  margin:10px 0 0;
  padding:9px 10px;
  border:1px solid #dbe5f5;
  border-radius:9px;
  background:#f8faff;
  overflow:visible;
}
#customers-view .customer-note-label{
  display:block;
  flex:none;
  position:static;
  margin:0;
  padding:2px 7px;
  border-radius:999px;
  background:#eaf1ff;
  color:#155eef;
  font-size:11px;
  font-weight:800;
  line-height:1.4;
  transform:none;
}
#customers-view .customer-note-text{
  display:block;
  flex:1 1 auto;
  position:static;
  min-width:0;
  margin:0;
  padding:2px 0;
  color:#55657f;
  font-size:12px;
  font-weight:600;
  line-height:1.45;
  white-space:pre-wrap;
  overflow:visible;
  overflow-wrap:anywhere;
  transform:none;
}
#customers-view .customer-fastwork{flex:0 0 auto}

/* Customer cards must grow with the carousel after optional note/Fastwork rows
   are added. Removing the fixed flex column prevents the last row being cut. */
#customers-view .customer-directory{
  grid-auto-rows:1fr;
  align-items:stretch;
}
#customers-view .customer-card{
  display:flex;
  flex-direction:column;
  box-sizing:border-box;
  width:100%;
  height:100%;
  min-height:0;
  max-height:none;
  padding-bottom:17px;
  overflow:hidden;
}
#customers-view .customer-items{
  display:block;
  flex:0 0 auto;
  width:100%;
  min-width:0;
  min-height:0;
  margin-top:auto;
  padding-top:12px;
  overflow:visible;
}
#customers-view .customer-items>span{
  display:block;
  margin-bottom:8px;
}
#customers-view .customer-items>div.customer-slide-track{
  display:flex;
  align-items:stretch;
  width:100%;
  min-width:0;
  min-height:82px;
  height:auto;
  padding:1px 1px 10px;
  overflow-x:auto;
  overflow-y:hidden;
}
#customers-view .customer-slide-track .customer-item-link,
#customers-view .customer-slide-track .customer-item-link:not(:first-child){
  box-sizing:border-box;
  height:auto;
  min-height:72px;
  align-content:center;
}
#customers-view .customer-meta-area{
  display:flex;
  flex:1 1 auto;
  flex-direction:column;
  justify-content:center;
  gap:10px;
  min-width:0;
  min-height:0;
  padding:12px 0;
  border-top:1px solid var(--line);
}
#customers-view .customer-meta-area.is-empty{padding:0}
#customers-view .customer-meta-area .customer-note-row,
#customers-view .customer-meta-area .customer-fastwork{
  flex:0 0 auto;
  margin:0;
}
#customers-view .customer-meta-area .customer-fastwork{
  min-height:42px;
  padding:0;
  border-top:0;
}
#customers-view .customer-fastwork,
#customers-view .customer-fastwork>div{
  align-items:center;
}
#customers-view .customer-fastwork>span{
  display:flex;
  align-items:center;
  line-height:1.35;
}
#customers-view .fastwork-name-chip{
  display:inline-flex;
  align-items:center;
  line-height:1.2;
}
.brand{
  display:inline-flex;
  align-items:center;
  gap:8px;
  line-height:0;
}
.brand-icon{
  display:block;
  width:34px;
  height:34px;
  flex:none;
  border-radius:20%;
  object-fit:contain;
}
.brand-name{
  display:block;
  width:132px;
  height:auto;
  flex:none;
  object-fit:contain;
}
@media(max-width:780px){
  .brand-name{display:block;width:126px}
  #customers-view .customer-directory{grid-auto-rows:auto;align-items:start}
  #customers-view .customer-card{display:block;height:auto}
  #customers-view .customer-items{margin-top:14px}
  #customers-view .customer-meta-area{flex:none;justify-content:flex-start;padding:10px 0}
  #customers-view .customer-meta-area.is-empty{display:none}
}

/* iPhone dashboard: use one full-width, compact summary card per row. */
@media(max-width:780px){
  #dashboard-view .summary-grid{
    grid-template-columns:minmax(0,1fr);
    width:100%;
    gap:12px;
  }
  #dashboard-view .summary-card,
  #dashboard-view .summary-card.top-summary,
  #dashboard-view .summary-card.primary-summary,
  #dashboard-view .summary-card.net-feature-summary{
    grid-column:1 / -1;
    width:100%;
    min-width:0;
    min-height:120px;
    padding:18px;
  }
  #dashboard-view .summary-card.net-feature-summary{
    min-height:145px;
  }
}

/* iPhone transactions heading: keep the copy readable and Template compact. */
@media(max-width:780px){
  #transactions-view .page-heading{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:start;
    gap:14px;
  }
  #transactions-view .page-heading>div:first-child{
    min-width:0;
  }
  #transactions-view .page-heading h1{
    font-size:30px;
    line-height:1.2;
    letter-spacing:-.6px;
    white-space:nowrap;
  }
  #transactions-view .page-heading .muted{
    font-size:14px;
  }
  #transactions-view .heading-actions{
    width:auto;
    justify-content:flex-end;
    margin-top:18px;
  }
  #transactions-view #quick-template{
    flex:none;
    width:auto;
    min-width:116px;
    height:44px;
    padding:0 14px;
    font-size:14px;
    white-space:nowrap;
  }
}

/* iPhone transaction form: normalize Safari's intrinsic date control. */
@media(max-width:780px){
  #transaction-dialog #date{
    -webkit-appearance:none;
    appearance:none;
    display:block;
    width:100%;
    min-width:0;
    max-width:100%;
    height:42px;
    min-height:42px;
    padding:0 14px;
    border:1px solid #d5e0f3;
    border-radius:9px;
    font-size:18px;
    font-weight:750;
    line-height:40px;
    text-align:center;
  }
  #transaction-dialog #date::-webkit-date-and-time-value{
    min-height:0;
    margin:0;
    text-align:center;
  }
  #transaction-dialog #date::-webkit-datetime-edit{
    padding:0;
  }
}

/* iPhone selects: align both double chevrons and use the same blue. */
@media(max-width:780px){
  #transaction-dialog .client-type-control>.year-chevron{
    top:50%;
    right:18px;
    left:auto;
    width:12px;
    height:18px;
    color:#155eef;
    transform:translateY(-50%);
  }
  #transaction-dialog #client-type{
    padding-right:48px;
    padding-left:14px;
  }
  #transaction-dialog #channel{
    -webkit-appearance:none;
    appearance:none;
    padding-right:48px;
    padding-left:14px;
    background-color:#fff;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='18' viewBox='0 0 12 18' fill='none' stroke='%23155eef' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m2 6 4-4 4 4'/%3E%3Cpath d='m2 12 4 4 4-4'/%3E%3C/svg%3E");
    background-repeat:no-repeat;
    background-position:right 18px center;
    background-size:12px 18px;
  }
}

.navigation-shell{display:contents}

/* iPhone liquid-glass bottom navigation. Desktop keeps the original header. */
@media(max-width:780px){
  .topbar{
    position:relative;
    top:auto;
    height:70px;
    padding:10px 15px 0;
    gap:0;
    justify-content:center;
    -webkit-backdrop-filter:none;
    backdrop-filter:none;
  }
  .navigation-shell{
    position:fixed;
    right:auto;
    bottom:calc(21px + env(safe-area-inset-bottom));
    left:50%;
    z-index:60;
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    align-items:stretch;
    width:min(calc(100vw - 24px),430px);
    min-height:64px;
    padding:4px 6px;
    border:1px solid rgba(255,255,255,.58);
    border-radius:32px;
    background:linear-gradient(180deg,rgba(255,255,255,.36),rgba(235,240,247,.22));
    box-shadow:0 8px 24px rgba(28,39,58,.12),inset 0 1px 0 rgba(255,255,255,.68),inset 0 -1px 0 rgba(111,126,150,.09);
    -webkit-backdrop-filter:blur(26px) saturate(150%);
    backdrop-filter:blur(26px) saturate(150%);
    transform:translateX(-50%);
  }
  .navigation-shell nav{
    display:contents;
  }
  .navigation-shell .nav-link,
  .navigation-shell #new-transaction{
    display:flex;
    min-width:0;
    min-height:54px;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:3px;
    margin:0;
    padding:4px 3px 3px;
    border:0;
    border-radius:27px;
    background:transparent;
    box-shadow:none;
    color:#303743;
    font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display",system-ui,sans-serif;
    font-size:0;
    line-height:1;
    text-decoration:none;
    transition:background .18s ease,box-shadow .18s ease,color .18s ease,transform .18s ease;
  }
  .navigation-shell .nav-link::before,
  .navigation-shell #new-transaction::before{
    display:grid;
    width:22px;
    height:22px;
    place-items:center;
    color:currentColor;
    background-color:currentColor;
    font-size:21px;
    font-weight:700;
    line-height:1;
    -webkit-mask-position:center;
    mask-position:center;
    -webkit-mask-repeat:no-repeat;
    mask-repeat:no-repeat;
    -webkit-mask-size:contain;
    mask-size:contain;
  }
  .navigation-shell .nav-link::after,
  .navigation-shell #new-transaction::after{
    color:currentColor;
    font-size:9.5px;
    font-weight:650;
    line-height:1.1;
    white-space:nowrap;
  }
  .navigation-shell .nav-link[data-view="dashboard"]::before{content:'';-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 10.5 12 3l9 7.5V21h-6v-6H9v6H3z' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 10.5 12 3l9 7.5V21h-6v-6H9v6H3z' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
  .navigation-shell .nav-link[data-view="dashboard"]::after{content:'หน้าแรก'}
  .navigation-shell .nav-link[data-view="transactions"]::before{content:'';-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='3' width='16' height='4' rx='2' fill='none' stroke='black' stroke-width='1.8'/%3E%3Crect x='4' y='10' width='16' height='4' rx='2' fill='none' stroke='black' stroke-width='1.8'/%3E%3Crect x='4' y='17' width='16' height='4' rx='2' fill='none' stroke='black' stroke-width='1.8'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='3' width='16' height='4' rx='2' fill='none' stroke='black' stroke-width='1.8'/%3E%3Crect x='4' y='10' width='16' height='4' rx='2' fill='none' stroke='black' stroke-width='1.8'/%3E%3Crect x='4' y='17' width='16' height='4' rx='2' fill='none' stroke='black' stroke-width='1.8'/%3E%3C/svg%3E")}
  .navigation-shell .nav-link[data-view="transactions"]::after{content:'รายการ'}
  .navigation-shell .nav-link[data-view="customers"]::before{content:'';-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='7.5' r='4' fill='none' stroke='black' stroke-width='1.8'/%3E%3Cpath d='M3.75 21c.45-4.7 3.2-7.1 8.25-7.1s7.8 2.4 8.25 7.1' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='7.5' r='4' fill='none' stroke='black' stroke-width='1.8'/%3E%3Cpath d='M3.75 21c.45-4.7 3.2-7.1 8.25-7.1s7.8 2.4 8.25 7.1' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E")}
  .navigation-shell .nav-link[data-view="customers"]::after{content:'ลูกค้า'}
  .navigation-shell .nav-link[data-view="tax"]::before{content:'';background-color:currentColor;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5.5 2.75h10.75l2.25 2.3v7.2' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M13.4 21.25H5.5V2.75M8.5 7h6.5M8.5 10.5h5M8.5 14h2.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ccircle cx='16.5' cy='17.25' r='4.25' fill='none' stroke='black' stroke-width='1.8'/%3E%3Cpath d='m14.55 17.25 1.3 1.3 2.65-2.75' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5.5 2.75h10.75l2.25 2.3v7.2' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M13.4 21.25H5.5V2.75M8.5 7h6.5M8.5 10.5h5M8.5 14h2.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ccircle cx='16.5' cy='17.25' r='4.25' fill='none' stroke='black' stroke-width='1.8'/%3E%3Cpath d='m14.55 17.25 1.3 1.3 2.65-2.75' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
  .navigation-shell .nav-link[data-view="tax"]::after{content:'ภาษี'}
  .navigation-shell .nav-link[data-view="links"]::before{content:'';-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.6 13.4a4 4 0 0 0 5.7 0l2.1-2.1a4 4 0 1 0-5.7-5.7l-1.2 1.2M13.4 10.6a4 4 0 0 0-5.7 0l-2.1 2.1a4 4 0 1 0 5.7 5.7l1.2-1.2' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.6 13.4a4 4 0 0 0 5.7 0l2.1-2.1a4 4 0 1 0-5.7-5.7l-1.2 1.2M13.4 10.6a4 4 0 0 0-5.7 0l-2.1 2.1a4 4 0 1 0 5.7 5.7l1.2-1.2' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round'/%3E%3C/svg%3E")}
  .navigation-shell .nav-link[data-view="links"]::after{content:'Links'}
  .navigation-shell #new-transaction::before{
    content:'＋';
    border-radius:50%;
    background:#155eef;
    color:#fff;
    font-size:17px;
    font-weight:700;
    -webkit-mask-image:none;
    mask-image:none;
    box-shadow:0 3px 8px rgba(21,94,239,.24),inset 0 1px 0 rgba(255,255,255,.3);
  }
  .navigation-shell #new-transaction::after{content:'เพิ่ม';color:#155eef}
  .navigation-shell .nav-link[data-view="dashboard"]{order:1}
  .navigation-shell .nav-link[data-view="transactions"]{order:2}
  .navigation-shell #new-transaction{order:3}
  .navigation-shell .nav-link[data-view="customers"]{order:4}
  .navigation-shell .nav-link[data-view="tax"]{order:5}
  .navigation-shell .nav-link[data-view="links"]{order:6}
  .navigation-shell .nav-link.active{
    min-height:56px;
    border:0;
    border-radius:999px;
    background:linear-gradient(180deg,rgba(218,222,227,.9),rgba(193,199,207,.78));
    color:#155eef;
    box-shadow:0 4px 12px rgba(37,48,67,.12),inset 0 -1px 0 rgba(88,101,121,.1);
    transform:translateY(-1px);
  }
  .navigation-shell .nav-link.active::before{transform:scale(1.18)}
  .navigation-shell .nav-link.active::after{font-size:10.5px;font-weight:800}
  .shell{
    padding-bottom:calc(85px + env(safe-area-inset-bottom));
  }
  .site-footer{
    padding-bottom:calc(112px + env(safe-area-inset-bottom));
  }
  html.iphone-interaction-locked .site-footer{margin-top:-64px}
}

/* Pull to refresh appears only when JavaScript detects an iPhone home-screen app. */
.pull-refresh{display:none}
@media(max-width:780px){
  html.iphone-interaction-locked,
  html.iphone-interaction-locked body{touch-action:pan-x pan-y}
  html.iphone-interaction-locked a,
  html.iphone-interaction-locked button,
  html.iphone-interaction-locked [role="button"]{
    -webkit-touch-callout:none;
    -webkit-user-drag:none;
    -webkit-user-select:none;
    user-select:none;
    touch-action:manipulation;
  }
  html.iphone-interaction-locked #transaction-rows .job-edit-button,
  html.iphone-interaction-locked #recent-list .recent-job-button{
    -webkit-appearance:none;
    appearance:none;
    -webkit-tap-highlight-color:transparent;
  }
  html.iphone-interaction-locked #transaction-rows .job-edit-button:focus,
  html.iphone-interaction-locked #transaction-rows .job-edit-button:focus-visible,
  html.iphone-interaction-locked #transaction-rows .job-edit-button:active,
  html.iphone-interaction-locked #transaction-rows .job-edit-button:hover,
  html.iphone-interaction-locked #recent-list .recent-job-button:focus,
  html.iphone-interaction-locked #recent-list .recent-job-button:focus-visible,
  html.iphone-interaction-locked #recent-list .recent-job-button:active,
  html.iphone-interaction-locked #recent-list .recent-job-button:hover{
    outline:0;
    background:transparent;
    color:#17233a;
    box-shadow:none;
    text-decoration:none;
  }
  html.iphone-interaction-locked dialog .icon-button[data-close],
  html.iphone-interaction-locked dialog .icon-button[data-close]:focus,
  html.iphone-interaction-locked dialog .icon-button[data-close]:focus-visible{
    border-color:transparent!important;
    outline:0!important;
    box-shadow:none!important;
    -webkit-appearance:none;
    appearance:none;
    -webkit-tap-highlight-color:transparent;
  }
  html.iphone-interaction-locked input:not([type="checkbox"]):not([type="radio"]),
  html.iphone-interaction-locked textarea,
  html.iphone-interaction-locked select{font-size:16px!important}
  html.pull-refresh-enabled .pull-refresh{
    --pull-offset:0px;
    position:fixed;
    top:8px;
    left:50%;
    z-index:90;
    display:flex;
    width:max-content;
    min-height:42px;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:8px 13px;
    border:1px solid rgba(255,255,255,.78);
    border-radius:999px;
    background:rgba(248,251,255,.84);
    color:#5f6f88;
    font-size:12px;
    font-weight:800;
    line-height:1;
    opacity:0;
    pointer-events:none;
    box-shadow:0 8px 24px rgba(28,45,76,.16),inset 0 1px 0 rgba(255,255,255,.92);
    -webkit-backdrop-filter:blur(18px) saturate(145%);
    backdrop-filter:blur(18px) saturate(145%);
    transform:translate3d(-50%,calc(-62px + var(--pull-offset)),0);
    transition:transform .16s ease,opacity .16s ease,background-color .16s ease,color .16s ease;
    will-change:transform,opacity;
  }
  html.pull-refresh-enabled .pull-refresh.is-pulling{transition:none}
  html.pull-refresh-enabled .pull-refresh.is-ready{background:rgba(236,243,255,.94);color:#155eef}
  #pull-refresh-text{display:block;line-height:1.2;text-align:center;white-space:nowrap}
  .pull-refresh-icon{
    display:block;
    flex:0 0 17px;
    width:17px;
    height:17px;
    background:currentColor;
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 4v14M6.5 12.5 12 18l5.5-5.5' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
    mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 4v14M6.5 12.5 12 18l5.5-5.5' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
    transition:transform .18s ease;
  }
  .pull-refresh.is-ready .pull-refresh-icon{transform:rotate(180deg)}
  .pull-refresh.is-refreshing .pull-refresh-icon{
    width:16px;
    height:16px;
    border:2px solid rgba(21,94,239,.22);
    border-top-color:#155eef;
    border-radius:50%;
    background:transparent;
    -webkit-mask:none;
    mask:none;
    animation:pull-refresh-spin .8s linear infinite;
    transition:none;
    transform:translateZ(0) rotate(0deg);
    transform-origin:50% 50%;
    will-change:transform;
    -webkit-backface-visibility:hidden;
    backface-visibility:hidden;
  }
  .pull-refresh.is-success{color:#176b50}
  .pull-refresh.is-success .pull-refresh-icon{
    width:17px;
    height:17px;
    border:0;
    border-radius:0;
    background:#176b50;
    animation:none;
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m5 12.5 4.2 4.2L19 7' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
    mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m5 12.5 4.2 4.2L19 7' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  }
  .pull-refresh.is-error{color:var(--red)}
  .pull-refresh.is-error .pull-refresh-icon{border-color:var(--red);animation:none}
}
@keyframes pull-refresh-spin{from{transform:translateZ(0) rotate(0deg)}to{transform:translateZ(0) rotate(360deg)}}

/* Dashboard cards: light glass surface with translucent diagonal reflection. */
#dashboard-view .summary-card{
  --dashboard-glass-start:rgba(244,248,255,.94);
  --dashboard-glass-end:rgba(222,233,255,.82);
  isolation:isolate;
  background:linear-gradient(145deg,var(--dashboard-glass-start),var(--dashboard-glass-end));
  box-shadow:0 13px 30px rgba(35,57,96,.075),inset 0 1px 0 rgba(255,255,255,.9);
  -webkit-backdrop-filter:blur(14px) saturate(118%);
  backdrop-filter:blur(14px) saturate(118%);
}
#dashboard-view .summary-card::before{
  inset:0;
  width:auto;
  height:auto;
  background:
    linear-gradient(122deg,rgba(255,255,255,.34) 0%,rgba(255,255,255,.08) 39%,rgba(255,255,255,0) 53%),
    linear-gradient(122deg,rgba(255,255,255,0) 55%,rgba(255,255,255,.42) 56%,rgba(255,255,255,.12) 64%,rgba(255,255,255,0) 73%);
  filter:none;
  opacity:1;
  pointer-events:none;
  z-index:0;
}
#dashboard-view .summary-card>*{position:relative;z-index:1}
#dashboard-view .summary-card.accent{
  --dashboard-glass-start:rgba(241,246,255,.96);
  --dashboard-glass-end:rgba(214,228,255,.86);
  color:#155eef;
  border-color:#b9d0ff;
}
#dashboard-view .summary-card.accent p,
#dashboard-view .summary-card.accent small{color:#55729f}
#dashboard-view .summary-card.accent strong{color:#155eef}
#dashboard-view .summary-card.accent .summary-icon{background:#dfeaff;color:#155eef}
#dashboard-view .summary-card.fee-summary{
  --dashboard-glass-start:rgba(253,251,255,.96);
  --dashboard-glass-end:rgba(237,231,255,.85);
}
#dashboard-view .summary-card.tax-summary{
  --dashboard-glass-start:rgba(255,253,247,.96);
  --dashboard-glass-end:rgba(255,239,207,.86);
}
#dashboard-view .summary-card.pending-summary{
  --dashboard-glass-start:rgba(255,251,252,.96);
  --dashboard-glass-end:rgba(255,231,236,.85);
}
#dashboard-view .summary-card.net-summary{
  --dashboard-glass-start:rgba(247,255,251,.96);
  --dashboard-glass-end:rgba(218,246,231,.86);
}
@media(max-width:560px){
  #dashboard-view .summary-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px!important;
  }
  #dashboard-view .summary-card.top-summary{
    grid-column:span 1!important;
    width:auto!important;
    min-height:166px;
    padding:15px;
  }
  #dashboard-view .summary-card.net-feature-summary{
    grid-column:1 / -1!important;
    width:auto!important;
    min-height:164px;
  }
}

/* Final mobile layout overrides for compact ledger cards. */
@media(max-width:700px){
  #transaction-rows .transaction-card-row,
  #transaction-rows .transaction-card-row>td{height:auto!important}

  .tax-table-scroll{overflow-x:hidden}
  .tax-data-table tbody tr{
    display:flex!important;
    flex-wrap:wrap;
    align-items:start;
    gap:12px 14px;
    padding:15px 14px;
  }
  .tax-data-table .tax-cell-job{
    flex:0 0 calc(100% - 80px);
    min-width:0;
    padding-right:0!important;
    order:1;
  }
  .tax-data-table .tax-cell-status{
    position:static!important;
    flex:0 0 66px;
    align-self:start;
    justify-items:end;
    order:2;
  }
  .tax-data-table .tax-cell-status::before{display:none}
  .tax-data-table .tax-cell-date,
  .tax-data-table .tax-cell-gross,
  .tax-data-table .tax-cell-withholding,
  .tax-data-table .tax-cell-net{
    flex:0 0 calc((100% - 14px)/2);
    font-size:12px;
    line-height:13px;
  }
  .tax-data-table .tax-cell-date::before,
  .tax-data-table .tax-cell-gross::before,
  .tax-data-table .tax-cell-withholding::before,
  .tax-data-table .tax-cell-net::before{
    font-size:9px;
    line-height:10px;
  }
  .tax-data-table .tax-cell-date{order:3}
  .tax-data-table .tax-cell-gross{order:4}
  .tax-data-table .tax-cell-withholding{order:5}
  .tax-data-table .tax-cell-net{order:6}
  .tax-data-table .tax-cell-job button{
    line-height:1.4!important;
    text-overflow:clip!important;
    white-space:normal!important;
  }
}

/* Customer directory accordion: mirrors the grouped tax workflow. */
#customers-view #customer-directory.customer-directory{
  display:grid;
  grid-template-columns:1fr;
  grid-auto-rows:auto!important;
  align-items:start!important;
  gap:14px;
}
#customers-view .customer-accordion-card{
  width:100%;
  overflow:hidden;
  border:1px solid #d8e1ed;
  border-radius:14px;
  background:#fff;
  box-shadow:0 5px 17px rgba(33,52,85,.055);
}
#customers-view .customer-accordion-head{
  position:relative;
  display:grid;
  grid-template-columns:minmax(220px,1fr) auto auto;
  align-items:center;
  gap:18px;
  padding:18px 20px 18px 27px;
  background:#eef3fb;
}
#customers-view .customer-accordion-head::before{
  position:absolute;
  top:8px;
  bottom:8px;
  left:8px;
  width:5px;
  border-radius:999px;
  background:#2f6fed;
  content:"";
}
#customers-view .customer-accordion-copy{min-width:0}
#customers-view .customer-accordion-copy h3{
  overflow:hidden;
  margin:0;
  color:#1d2a40;
  font-size:20px;
  line-height:1.4;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#customers-view .customer-accordion-copy p{
  overflow:hidden;
  margin:4px 0 0;
  color:#6c7b92;
  font-size:13px;
  font-weight:700;
  line-height:1.4;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#customers-view .customer-accordion-top-fastwork{
  display:flex;
  min-width:0;
  flex-wrap:wrap;
  gap:5px;
  margin-top:6px;
}
#customers-view .customer-accordion-top-fastwork>span{
  display:inline-flex;
  max-width:100%;
  align-items:center;
  overflow:hidden;
  padding:5px 10px;
  border:1px solid #bfd0f5;
  border-radius:999px;
  background:#edf3ff;
  color:#2456b8;
  font-size:12px;
  font-weight:800;
  line-height:1.2;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#customers-view .customer-accordion-totals{
  display:grid;
  width:210px;
  grid-template-columns:88px 112px;
  gap:10px;
}
#customers-view .customer-accordion-totals>span{
  display:grid;
  min-width:0;
  gap:3px;
  padding:8px 11px;
  border:1px solid rgba(194,208,233,.78);
  border-radius:10px;
  background:rgba(255,255,255,.72);
}
#customers-view .customer-accordion-totals small{
  color:#7d8ba1;
  font-size:11px;
  font-weight:750;
}
#customers-view .customer-accordion-totals strong{
  color:#334159;
  font-size:17px;
  line-height:1.25;
  white-space:nowrap;
}
#customers-view .customer-accordion-totals>span:first-child{padding-right:8px;padding-left:8px}
#customers-view .customer-accordion-totals>span strong{text-align:center}
@media(min-width:901px){
  #customers-view .customer-accordion-totals>span:nth-child(2){padding-right:8px;padding-left:8px}
  #customers-view .customer-total-amount.is-compact{font-size:14px;letter-spacing:-.03em}
  #customers-view .customer-total-amount.is-tight{font-size:12px;letter-spacing:-.04em}
}
#customers-view .customer-accordion-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
}
#customers-view .customer-jobs-toggle,
#customers-view .customer-edit-button{
  display:inline-flex;
  min-height:40px;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:8px 13px;
  border:1px solid #b9caf0;
  border-radius:9px;
  background:#fff;
  color:#155eef;
  font-family:inherit;
  font-size:13px;
  font-weight:800;
  line-height:1.2;
  white-space:nowrap;
  cursor:pointer;
}
#customers-view .customer-edit-button{border-color:#d2dce9;color:#5c6c84}
#customers-view .customer-jobs-toggle [data-customer-toggle-label]{display:inline-block;width:5.8em;text-align:center}
#customers-view .customer-jobs-toggle:hover,
#customers-view .customer-edit-button:hover{border-color:#8eace9;background:#f7faff;color:#0d45b8}
#customers-view .customer-toggle-chevron{
  color:#7f8da3;
  font-size:21px;
  line-height:1;
  transition:transform .16s ease;
}
#customers-view .customer-accordion-card.is-expanded .customer-toggle-chevron{transform:rotate(90deg)}
#customers-view .customer-accordion-meta{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  padding:13px 18px;
  border-top:1px solid #dfe6f0;
  background:#fbfcff;
}
#customers-view .customer-accordion-meta--note-only{grid-template-columns:minmax(0,1fr)}
#customers-view .customer-accordion-note{
  display:flex;
  min-width:0;
  align-items:center;
  gap:9px;
}
#customers-view .customer-accordion-note strong{
  flex:none;
  color:#7a879b;
  font-size:12px;
  font-weight:800;
}
#customers-view .customer-accordion-note strong{
  padding:3px 8px;
  border-radius:999px;
  background:#eaf1ff;
  color:#155eef;
}
#customers-view .customer-accordion-note>span{
  overflow:hidden;
  color:#55657f;
  font-size:13px;
  font-weight:650;
  line-height:1.45;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#customers-view .customer-job-list{border-top:1px solid #dfe6f0;background:#fff}
#customers-view .customer-job-list-head,
#customers-view .customer-job-row{
  display:grid;
  grid-template-columns:minmax(250px,1fr) 128px 124px 128px 128px 22px;
  align-items:center;
  gap:14px;
}
#customers-view .customer-job-list-head{
  padding:11px 18px;
  background:#f8fafc;
  color:#8793a5;
  font-size:11px;
  font-weight:800;
}
#customers-view .customer-job-list-head span:nth-child(4),
#customers-view .customer-job-list-head span:nth-child(5){text-align:right}
#customers-view .customer-job-row{
  position:relative;
  width:100%;
  min-height:74px;
  padding:14px 18px;
  border:0;
  border-top:1px solid #e7ebf1;
  background:#fff;
  color:#5c6980;
  font-family:inherit;
  font-size:14px;
  font-weight:650;
  text-align:left;
  cursor:pointer;
}
#customers-view .customer-job-row:hover{background:#f5f8ff}
#customers-view .customer-job-main{display:grid;min-width:0;gap:4px}
#customers-view .customer-job-main strong{
  overflow:hidden;
  color:#17233a;
  font-size:16px;
  font-weight:850;
  line-height:1.4;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#customers-view .customer-job-main small{
  overflow:hidden;
  color:#7b889d;
  font-size:11px;
  font-weight:650;
  line-height:1.4;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#customers-view .customer-job-main small:empty{display:none}
#customers-view .customer-job-money{text-align:right;font-weight:800;white-space:nowrap}
#customers-view .customer-job-net{color:#155eef;font-weight:900}
#customers-view .customer-job-open{color:#98a3b4;font-size:24px;line-height:1;text-align:right}

@media(min-width:901px){
  #customers-view .customer-job-list-head span:nth-child(3){text-align:center}
  #customers-view .customer-job-channel{display:flex;min-width:0;align-items:center;justify-content:center}
  #customers-view .customer-channel-tag{overflow:hidden;text-overflow:ellipsis}
}

#customers-view .customer-channel-tag{display:inline-flex;width:max-content;max-width:100%;min-height:31px;align-items:center;justify-self:start;padding:5px 11px;border:1px solid transparent;border-radius:8px;font-size:13px;font-weight:800;line-height:1;white-space:nowrap}
#customers-view .customer-channel-order{display:none}
#customers-view .customer-channel-fastwork{color:#3156bc;background:#eaf0ff;border-color:#cbd8fb}
#customers-view .customer-channel-line{color:#087b34;background:#e8f9ee;border-color:#baeacb}
#customers-view .customer-channel-facebook{color:#7041b4;background:#f2edff;border-color:#d9c9fa}
#customers-view .customer-channel-instagram{color:#ae256a;background:#fff0f6;border-color:#f2c4da}
#customers-view .customer-channel-tiktok{color:#fff;background:#17191d;border-color:#17191d}
#customers-view .customer-channel-direct{color:#343a37;background:#eff1f0;border-color:#d6dcda}
#customers-view .customer-channel-custom{color:#49665a;background:#f1f5f2;border-color:#d9e5dc}

@media(max-width:900px){
  #customers-view .customer-accordion-head{
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:"copy actions" "totals totals";
    gap:13px 10px;
  }
  #customers-view .customer-accordion-copy{grid-area:copy}
  #customers-view .customer-accordion-totals{grid-area:totals;width:100%;grid-template-columns:repeat(2,minmax(0,1fr))}
  #customers-view .customer-accordion-actions{grid-area:actions}
  #customers-view .customer-job-list-head,
  #customers-view .customer-job-row{grid-template-columns:minmax(180px,1fr) 100px 110px 94px 94px 18px;gap:10px}
}

@media(max-width:700px){
  #customers-view .customer-directory-panel>.section-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(150px,52vw);align-items:end;gap:10px}
  #customers-view .customer-directory-tools{width:100%;max-width:none;justify-self:end}
  #customers-view .customer-directory-tools input{width:100%;max-width:none}
  #customers-view #customer-directory.customer-directory{gap:12px}
  #customers-view .customer-accordion-card{border-radius:12px}
  #customers-view .customer-accordion-head{padding:15px 14px 14px 20px}
  #customers-view .customer-accordion-head::before{top:7px;bottom:7px;left:6px;width:4px}
  #customers-view .customer-accordion-copy h3{font-size:16px}
  #customers-view .customer-accordion-copy p{font-size:11px}
  #customers-view .customer-accordion-top-fastwork{gap:4px;margin-top:5px}
  #customers-view .customer-accordion-top-fastwork>span{padding:3px 7px;font-size:10px}
  #customers-view .customer-accordion-actions{gap:6px}
  #customers-view .customer-jobs-toggle,
  #customers-view .customer-edit-button{min-height:36px;padding:6px 9px;font-size:11px}
  #customers-view .customer-toggle-chevron{display:block;flex:none;width:5px;height:5px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;font-size:0;line-height:0;transform:rotate(-45deg);transform-origin:center}
  #customers-view .customer-accordion-card.is-expanded .customer-toggle-chevron{transform:rotate(45deg)}
  #customers-view .customer-accordion-totals{gap:8px}
  #customers-view .customer-accordion-totals>span{min-width:0;padding:8px 9px}
  #customers-view .customer-accordion-totals small{font-size:12px}
  #customers-view .customer-accordion-totals strong{font-size:15px}
  #customers-view .customer-accordion-meta{grid-template-columns:1fr;padding:11px 13px;gap:9px}
  #customers-view .customer-accordion-fastwork{display:none!important}
  #customers-view .customer-accordion-meta:not(:has(.customer-accordion-note)){display:none}
  #customers-view .customer-accordion-note{align-items:center}
  #customers-view .customer-accordion-note strong{display:inline-flex;height:22px;align-items:center;padding:0 8px;line-height:1}
  #customers-view .customer-accordion-note>span{white-space:normal}
  #customers-view .customer-channel-tag{height:23px!important;min-height:23px!important;justify-content:center;padding:0 9px!important;line-height:1!important}
  #customers-view .customer-job-list-head{display:none}
  #customers-view .customer-job-row{
    grid-template-columns:repeat(2,minmax(0,1fr));
    grid-template-areas:"main main" "date channel" "gross net";
    gap:11px 14px;
    min-height:0;
    padding:14px 34px 14px 14px;
  }
  #customers-view .customer-job-main{grid-area:main}
  #customers-view .customer-job-order-meta,#customers-view .customer-job-meta-separator{display:none}
  #customers-view .customer-job-meta:not(.has-customer){display:none}
  #customers-view .customer-channel-order{display:inline}
  #customers-view .customer-job-row time{grid-area:date}
  #customers-view .customer-job-row>span:nth-of-type(2){grid-area:channel}
  #customers-view .customer-job-row>.customer-job-money:not(.customer-job-net){grid-area:gross}
  #customers-view .customer-job-row>.customer-job-net{grid-area:net}
  #customers-view .customer-job-row time,
  #customers-view .customer-job-row>span[data-label]{display:grid;gap:3px;text-align:left}
  #customers-view .customer-job-row time::before,
  #customers-view .customer-job-row>span[data-label]::before{
    content:attr(data-label);
    color:#8b96a7;
    font-size:8px;
    font-weight:750;
  }
  #customers-view .customer-job-open{position:absolute;top:50%;right:13px;transform:translateY(-50%)}
  #customers-view .customer-job-main strong{font-size:15px;white-space:normal}
}

/* iOS: remove the native gray tap flash while preserving keyboard focus styles. */
a,
button,
input,
select,
textarea,
summary,
label[for],
[role="button"],
[tabindex]:not([tabindex="-1"]){
  -webkit-tap-highlight-color:transparent!important;
}

/* iOS: keep native select controls in a stable light pressed state. */
@media(max-width:780px){
  #transaction-dialog select{
    color-scheme:light!important;
    -webkit-tap-highlight-color:transparent!important;
    -webkit-touch-callout:none!important;
    -webkit-user-select:none!important;
    user-select:none!important;
    opacity:1!important;
  }
  #transaction-dialog #client-type,
  #transaction-dialog #channel{
    -webkit-appearance:none!important;
    appearance:none!important;
    background-color:#fff!important;
    color:#155eef!important;
    filter:none!important;
  }
  #transaction-dialog #client-type:active,
  #transaction-dialog #channel:active{
    background-color:#fff!important;
    color:#155eef!important;
    opacity:1!important;
    filter:none!important;
  }
}

/* iPhone: render the two main form pickers in-page so Safari never paints a native pressed overlay. */
.form-select-button,
.form-select-options{display:none}
.form-select-control{position:relative;display:block;width:100%}
@media(max-width:780px){
  #transaction-dialog .form-native-select{display:none!important}
  #transaction-dialog .client-type-control>.year-chevron{display:none!important}
  #transaction-dialog .client-type-control,
  #transaction-dialog .form-select-control{position:relative;overflow:visible}
  #transaction-dialog .client-type-control:focus-within{border-color:#d5e0f3;box-shadow:none;background:#fff}
  #transaction-dialog .form-select-button{
    position:relative;
    display:flex;
    width:100%;
    height:40px;
    min-height:40px;
    align-items:center;
    justify-content:center;
    padding:0 48px 0 14px;
    border:0;
    border-radius:8px;
    background:#fff;
    color:#155eef;
    font:inherit;
    font-size:16px;
    font-weight:850;
    line-height:1.2;
    box-shadow:none;
    outline:0;
    transition:none;
  }
  #transaction-dialog .form-select-control>.form-select-button{
    height:42px;
    min-height:42px;
    border:1px solid #d5e0f3;
    border-radius:9px;
  }
  #transaction-dialog .form-select-button:active,
  #transaction-dialog .form-select-button:focus{
    background:#fff;
    color:#155eef;
    box-shadow:none;
    outline:0;
    filter:none;
  }
  #transaction-dialog [data-form-select-control].is-open>.form-select-button{
    border-color:#8fb0f4;
    box-shadow:0 0 0 3px rgba(21,94,239,.1);
  }
  #transaction-dialog .form-select-button>.year-chevron{
    position:absolute;
    top:50%;
    right:18px;
    width:12px;
    height:18px;
    color:#155eef;
    transform:translateY(-50%);
    pointer-events:none;
  }
  #transaction-dialog .form-select-options{
    position:absolute;
    z-index:40;
    top:calc(100% + 6px);
    right:0;
    left:0;
    display:grid;
    max-height:246px;
    overflow:auto;
    padding:5px;
    border:1px solid #c8d7f1;
    border-radius:12px;
    background:#fff;
    box-shadow:0 14px 34px rgba(25,49,91,.2);
    overscroll-behavior:contain;
  }
  #transaction-dialog .form-select-options.hidden{display:none!important}
  #transaction-dialog .form-select-options button{
    width:100%;
    min-height:42px;
    padding:8px 12px;
    border:0;
    border-radius:8px;
    background:#fff;
    color:#26344d;
    font:inherit;
    font-size:15px;
    font-weight:750;
    line-height:1.25;
    text-align:left;
    box-shadow:none;
    outline:0;
    transition:none;
  }
  #transaction-dialog .form-select-options button:active{background:#eef4ff;color:#155eef}
  #transaction-dialog .form-select-options button[aria-selected="true"]{background:#eaf1ff;color:#155eef}
}

/* Transaction form pickers use the same palette as their selected tags. */
#transaction-dialog [data-form-select-control]{
  --form-picker-bg:#f1f5f2;
  --form-picker-border:#d9e5dc;
  --form-picker-text:#49665a;
  color:var(--form-picker-text);
}
#transaction-dialog [data-form-select-control].form-tone-individual{--form-picker-bg:#fff4d9;--form-picker-border:#efd18a;--form-picker-text:#9a6500}
#transaction-dialog [data-form-select-control].form-tone-company{--form-picker-bg:#e8f7ee;--form-picker-border:#b8e2c8;--form-picker-text:#147247}
#transaction-dialog [data-form-select-control].form-tone-fastwork{--form-picker-bg:#eaf0ff;--form-picker-border:#cbd8fb;--form-picker-text:#3156bc}
#transaction-dialog [data-form-select-control].form-tone-line{--form-picker-bg:#e8f9ee;--form-picker-border:#baeacb;--form-picker-text:#087b34}
#transaction-dialog [data-form-select-control].form-tone-facebook{--form-picker-bg:#f2edff;--form-picker-border:#d9c9fa;--form-picker-text:#7041b4}
#transaction-dialog [data-form-select-control].form-tone-instagram{--form-picker-bg:#fff0f6;--form-picker-border:#f2c4da;--form-picker-text:#ae256a}
#transaction-dialog [data-form-select-control].form-tone-tiktok{--form-picker-bg:#17191d;--form-picker-border:#17191d;--form-picker-text:#fff}
#transaction-dialog [data-form-select-control].form-tone-direct{--form-picker-bg:#eff1f0;--form-picker-border:#d6dcda;--form-picker-text:#343a37}
#transaction-dialog [data-form-select-control].form-tone-custom{--form-picker-bg:#f1f5f2;--form-picker-border:#d9e5dc;--form-picker-text:#49665a}
#transaction-dialog .client-type-control[data-form-select-control]{
  border-color:var(--form-picker-border)!important;
  background:var(--form-picker-bg)!important;
}
#transaction-dialog [data-form-select-control] #client-type,
#transaction-dialog [data-form-select-control] #channel,
#transaction-dialog [data-form-select-control]>.form-select-button{
  border-color:var(--form-picker-border)!important;
  background-color:var(--form-picker-bg)!important;
  color:var(--form-picker-text)!important;
}
#transaction-dialog [data-form-select-control] #client-type:active,
#transaction-dialog [data-form-select-control] #client-type:focus,
#transaction-dialog [data-form-select-control] #channel:active,
#transaction-dialog [data-form-select-control] #channel:focus,
#transaction-dialog [data-form-select-control]>.form-select-button:active,
#transaction-dialog [data-form-select-control]>.form-select-button:focus{
  background-color:var(--form-picker-bg)!important;
  color:var(--form-picker-text)!important;
}
#transaction-dialog [data-form-select-control]>.year-chevron,
#transaction-dialog [data-form-select-control]>.form-select-button>.year-chevron{color:var(--form-picker-text)!important}
#transaction-dialog [data-form-select-control="channel"] #channel{background-image:none!important}
#transaction-dialog [data-form-select-control="channel"]>.form-select-button>.year-chevron{display:none!important}
#transaction-dialog .form-select-control[data-form-select-control="channel"],
#transaction-dialog .form-select-control[data-form-select-control="channel"]:focus-within{
  border-radius:9px;
  background:transparent!important;
}
#transaction-dialog .form-select-control[data-form-select-control="channel"]:focus-within #channel{
  border-color:var(--form-picker-text)!important;
}
#transaction-dialog [data-form-select-control="channel"]:after{
  position:absolute;
  z-index:3;
  top:50%;
  right:14px;
  width:11px;
  height:18px;
  background:currentColor;
  content:"";
  pointer-events:none;
  transform:translateY(-50%);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='18' viewBox='0 0 11 18' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m2 6 3.5-4L9 6'/%3E%3Cpath d='m2 12 3.5 4L9 12'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='18' viewBox='0 0 11 18' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m2 6 3.5-4L9 6'/%3E%3Cpath d='m2 12 3.5 4L9 12'/%3E%3C/svg%3E") center/contain no-repeat;
}
#transaction-dialog [data-form-select-control].is-open>.form-select-button,
#transaction-dialog [data-form-select-control]:focus-within{
  border-color:var(--form-picker-text)!important;
  background:var(--form-picker-bg)!important;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--form-picker-text) 12%,transparent)!important;
}
@media(max-width:780px){
  #transaction-dialog [data-form-select-control="channel"]:after{right:18px;width:12px}
  html.iphone-interaction-locked #transaction-dialog .client-type-control[data-form-select-control]{
    border:0!important;
    background:transparent!important;
  }
  html.iphone-interaction-locked #transaction-dialog .client-type-control[data-form-select-control].form-tone-company{
    --form-picker-border:#a9dabb;
  }
  html.iphone-interaction-locked #transaction-dialog .client-type-control[data-form-select-control]>.form-select-button{
    border:1px solid var(--form-picker-border)!important;
    border-radius:9px;
  }
  html.iphone-interaction-locked #transaction-dialog .client-type-control[data-form-select-control],
  html.iphone-interaction-locked #transaction-dialog .form-select-control[data-form-select-control],
  html.iphone-interaction-locked #transaction-dialog .client-type-control[data-form-select-control].is-open,
  html.iphone-interaction-locked #transaction-dialog .form-select-control[data-form-select-control].is-open,
  html.iphone-interaction-locked #transaction-dialog .client-type-control[data-form-select-control]:focus-within,
  html.iphone-interaction-locked #transaction-dialog .form-select-control[data-form-select-control]:focus-within,
  html.iphone-interaction-locked #transaction-dialog [data-form-select-control]>.form-select-button,
  html.iphone-interaction-locked #transaction-dialog [data-form-select-control]>.form-select-button:active,
  html.iphone-interaction-locked #transaction-dialog [data-form-select-control]>.form-select-button:focus{
    outline:0!important;
    box-shadow:none!important;
    filter:none!important;
  }
  html.iphone-interaction-locked #transaction-dialog [data-form-select-control].is-open,
  html.iphone-interaction-locked #transaction-dialog [data-form-select-control]:focus-within{
    box-shadow:none!important;
  }
  html.iphone-interaction-locked #transaction-dialog input[type="checkbox"]{
    -webkit-appearance:none;
    appearance:none;
    display:grid;
    width:18px!important;
    min-width:18px;
    height:18px;
    min-height:18px;
    margin:0;
    padding:0;
    border:1.5px solid #aebed4;
    border-radius:5px;
    place-content:center;
    background:#fff;
    box-shadow:none!important;
    outline:0!important;
    filter:none!important;
    transition:none;
    -webkit-tap-highlight-color:transparent!important;
  }
  html.iphone-interaction-locked #transaction-dialog input[type="checkbox"]::before{
    width:5px;
    height:9px;
    border:solid #fff;
    border-width:0 2px 2px 0;
    content:"";
    transform:translateY(-1px) rotate(45deg) scale(0);
  }
  html.iphone-interaction-locked #transaction-dialog input[type="checkbox"]:checked{
    border-color:#155eef;
    background:#155eef;
  }
  html.iphone-interaction-locked #transaction-dialog input[type="checkbox"]:checked::before{
    transform:translateY(-1px) rotate(45deg) scale(1);
  }
  html.iphone-interaction-locked #transaction-dialog input[type="checkbox"]:active{
    border-color:#aebed4!important;
    background:#fff!important;
    box-shadow:none!important;
    filter:none!important;
  }
  html.iphone-interaction-locked #transaction-dialog input[type="checkbox"]:checked:active{
    border-color:#155eef!important;
    background:#155eef!important;
  }
  html.iphone-interaction-locked #transaction-dialog .check-label,
  html.iphone-interaction-locked #transaction-dialog .check-label *{
    -webkit-tap-highlight-color:rgba(0,0,0,0)!important;
    -webkit-touch-callout:none;
    -webkit-user-select:none;
    user-select:none;
  }
}

/* Desktop: prevent browser focus chrome from stacking outside app controls. */
@media(min-width:781px) and (pointer:fine){
  :where(a,button,summary,[role="button"],[tabindex]):focus:not(:focus-visible){
    outline:0!important;
  }
  #transaction-dialog [data-form-select-control]:focus-within{
    box-shadow:none!important;
  }
  #transaction-dialog [data-form-select-control] #client-type:focus,
  #transaction-dialog [data-form-select-control] #channel:focus{
    outline:0!important;
    box-shadow:none!important;
  }
}

/* Keyboard focus follows the visible Fastwork order field, not its borderless input. */
#transaction-dialog .order-input{
  transition:border-color .16s ease,box-shadow .16s ease;
}
#transaction-dialog .order-input:focus-within{
  border-color:#3156bc;
  box-shadow:inset 0 0 0 1px rgba(49,86,188,.16);
}
#transaction-dialog .order-input:focus-within>span{
  border-right-color:#3156bc;
  background:#dfe8ff;
  color:#1749ad;
}

/* Customer profile: structured contact fields and compact information tags. */
/* Freeze the page behind the customer editor on desktop and iOS, without
   blocking scrolling inside the native dialog or resetting the page position. */
html.customer-editor-scroll-locked{overflow:hidden!important;overscroll-behavior:none}
body.customer-editor-scroll-locked{
  position:fixed!important;
  top:var(--customer-editor-page-top)!important;
  left:var(--customer-editor-page-left)!important;
  width:100%;
  overflow:hidden!important;
  overscroll-behavior:none;
}
#customer-dialog{overscroll-behavior:contain}
#customer-dialog .dialog-actions{align-items:center;gap:12px}
#customer-dialog .customer-save-actions{display:flex;align-items:center;gap:9px}
#customer-dialog .dialog-actions button{min-height:42px;padding:9px 12px;font-size:14px;white-space:nowrap}
#customer-dialog #delete-customer{flex:0 0 auto;width:auto;margin-right:auto;border:1px solid #c93445;border-radius:9px;background:#c93445;color:#fff;font-family:inherit;font-weight:700}
#customer-dialog #delete-customer:hover:not(:disabled){background:#b42c3c}
#customer-dialog #delete-customer:disabled{background:#fff0f2;border-color:#f2bdc5;color:#bd6671;opacity:1;cursor:not-allowed}
#customer-dialog #delete-customer-hint{margin:0;padding:0 26px 16px;font-size:13px;line-height:1.5;color:#64748b}
@media(max-width:780px){#customer-dialog #delete-customer-hint{padding-inline:18px}#customer-dialog .dialog-actions{padding-bottom:max(15px,env(safe-area-inset-bottom))}}
@media(max-width:480px){#customer-dialog .dialog-actions{gap:6px}#customer-dialog .customer-save-actions{gap:6px}#customer-dialog .dialog-actions button{font-size:12px;padding:9px 8px}}
#customer-dialog .customer-profile-fields{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:15px;
  padding:20px 26px 22px;
}
#customer-dialog .customer-profile-fields label{
  display:grid;
  min-width:0;
  gap:7px;
  color:#17233a;
  font-size:13px;
  font-weight:750;
}
#customer-dialog .customer-profile-fields input,
#customer-dialog .customer-profile-fields textarea{width:100%}
#customer-dialog .customer-profile-name,
#customer-dialog .customer-profile-contact-name,
#customer-dialog .customer-profile-note{grid-column:1/-1}
#customer-dialog .customer-profile-note textarea{min-height:84px;resize:vertical}
#customers-view .customer-profile-list{
  display:grid!important;
  grid-template-columns:minmax(0,1fr);
  gap:0;
  padding:12px 16px;
  border-top:1px solid #dfe6f0;
  background:#fbfcff;
}
#customers-view .customer-profile-row{
  display:flex;
  min-width:0;
  align-items:center;
  gap:10px;
  padding:7px 0;
  color:#55657f;
  font-size:12px;
  line-height:1.45;
}
#customers-view .customer-profile-row+.customer-profile-row{border-top:1px solid #edf1f7}
#customers-view .customer-profile-row strong{
  flex:none;
  min-width:82px;
  padding:2px 7px;
  border-radius:999px;
  background:#eaf1ff;
  color:#155eef;
  font-size:11px;
  font-weight:800;
  line-height:1.4;
  text-align:center;
}
#customers-view .customer-profile-row span,
#customers-view .customer-profile-row a{
  min-width:0;
  color:#55657f;
  font-weight:650;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}
#customers-view .customer-phone-link{
  color:#155eef!important;
  font-weight:850!important;
  text-decoration:none;
  text-underline-offset:3px;
}
#customers-view .customer-phone-link:hover,
#customers-view .customer-phone-link:focus-visible{text-decoration:underline}
#customers-view .customer-profile-row--line strong{
  background:#e8f9ee;
  color:#087b34;
}
#customers-view .customer-profile-row--facebook strong{
  background:#f2edff;
  color:#7041b4;
}
#customers-view .customer-profile-row--instagram strong{
  background:#fff0f6;
  color:#ae256a;
}
#customers-view .customer-profile-row--note strong{
  background:#eef1f5;
  color:#64748b;
}
@media(max-width:700px){
  #customer-dialog .customer-profile-fields{grid-template-columns:1fr;padding:18px}
  #customer-dialog .customer-profile-name,
  #customer-dialog .customer-profile-contact-name,
  #customer-dialog .customer-profile-note{grid-column:auto}
  #customers-view .customer-profile-list{padding:8px 12px}
  #customers-view .customer-profile-row{align-items:flex-start;gap:9px;font-size:14px}
  #customers-view .customer-profile-row strong{min-width:82px;font-size:12px}
  #customers-view .customer-directory-tools input{font-size:12px}
  #customers-view .customer-phone-link,
  #customers-view .customer-phone-link:hover,
  #customers-view .customer-phone-link:focus,
  #customers-view .customer-phone-link:focus-visible,
  #customers-view .customer-phone-link:active{text-decoration:none!important}
}

@media(min-width:701px){
  .tax-data-table thead th:last-child,
  .tax-data-table tbody td:last-child{padding-right:10px}
  .tax-data-table thead th:last-child{text-align:center}
}

#toast{
  z-index:2147483647;
  width:max-content;
  max-width:calc(100vw - 32px);
  pointer-events:none;
  text-align:center;
}
#toast.is-success{background:var(--green);color:#fff;box-shadow:0 10px 28px rgba(23,107,80,.3)}
#toast.is-error{background:var(--red);color:#fff}
@media(max-width:780px){
  #toast{bottom:max(16px,calc(env(safe-area-inset-bottom) + 12px))}
}
/* Supabase sign-in gate. The existing app remains hidden until Auth succeeds. */
.auth-gate{min-height:100dvh;display:grid;place-items:center;padding:24px;background:linear-gradient(145deg,#f7faff,#edf3ff)}
.auth-gate[hidden]{display:none}
.auth-card{width:min(100%,420px);display:grid;gap:18px;padding:34px;border:1px solid #d9e3f3;border-radius:24px;background:#fff;box-shadow:0 20px 60px rgba(27,55,104,.13)}
.auth-card img{width:190px;max-width:60%;margin:0 auto 10px}
.auth-card h1,.auth-card p{margin:0}
.auth-card label{display:grid;gap:8px;font-weight:800}
.auth-card input{width:100%;min-height:52px;padding:0 15px;border:1px solid #cbd8ee;border-radius:12px;font:inherit;font-size:16px}
.auth-card button{min-height:50px}
.auth-message{min-height:1.5em;color:var(--muted);font-weight:700}
.auth-message.is-error{color:var(--red)}
body.cloud-auth-required>.topbar,body.cloud-auth-required>main,body.cloud-auth-required>.site-footer,body.cloud-auth-required>dialog,body.cloud-auth-required>#toast{display:none!important}
.footer-sign-out{margin-left:8px;padding:2px 8px;border:0;background:transparent;color:#e53935;font:inherit;text-decoration:underline;cursor:pointer}
@media(max-width:780px){.auth-gate{padding:18px}.auth-card{padding:28px 22px;border-radius:20px}}

/* Desktop data refresh stays on the current view and reuses the live data loader. */
.desktop-refresh-button{display:inline-flex;align-items:center;justify-content:center;gap:5px;color:#155eef;white-space:nowrap}
.desktop-refresh-button>span{font-size:20px;line-height:1}
.desktop-refresh-button:disabled{cursor:wait;opacity:.62}
.desktop-refresh-status{position:fixed;top:14px;left:50%;z-index:2147483646;display:flex;min-height:46px;align-items:center;gap:10px;padding:9px 16px;border:1px solid rgba(187,204,234,.86);border-radius:999px;background:rgba(247,249,253,.94);color:#52627a;font-size:13px;font-weight:800;box-shadow:0 13px 34px rgba(40,61,98,.16),inset 0 1px 0 rgba(255,255,255,.9);opacity:0;pointer-events:none;-webkit-backdrop-filter:blur(18px) saturate(145%);backdrop-filter:blur(18px) saturate(145%);transform:translate(-50%,-14px);transition:opacity .16s ease,transform .16s ease,color .16s ease}
.desktop-refresh-status.is-visible{opacity:1;transform:translate(-50%,0)}
.desktop-refresh-status-icon{display:block;width:17px;height:17px;flex:0 0 17px;border:2px solid rgba(21,94,239,.22);border-top-color:#155eef;border-radius:50%;animation:desktop-refresh-spin .7s linear infinite}
.desktop-refresh-status.is-success{color:#176b50}
.desktop-refresh-status.is-success .desktop-refresh-status-icon{border:0;background:#176b50;animation:none;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m5 12.5 4.2 4.2L19 7' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m5 12.5 4.2 4.2L19 7' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
.desktop-refresh-status.is-error{color:var(--red)}
.desktop-refresh-status.is-error .desktop-refresh-status-icon{border-color:var(--red);animation:none}
@keyframes desktop-refresh-spin{to{transform:rotate(360deg)}}

/* One-tap clear buttons for every search field. */
.search-clear-control{position:relative;display:block;width:100%;min-width:0}
.tax-search-control>.search-clear-control{flex:1}
.search-clear-control>input[type="search"]{width:100%;padding-right:40px!important}
.search-clear-control>input[type="search"]::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
.search-clear-control>.search-clear-button{position:absolute;top:50%;right:10px;z-index:2;display:grid;width:20px;height:20px;min-height:20px;padding:0;border:0;border-radius:50%;place-items:center;background:#d9e1ee;color:#53647f;box-shadow:none;transform:translateY(-50%);-webkit-tap-highlight-color:transparent}
.search-clear-control>.search-clear-button::before,.search-clear-control>.search-clear-button::after{position:absolute;width:9px;height:1.5px;border-radius:999px;background:currentColor;content:""}
.search-clear-control>.search-clear-button::before{transform:rotate(45deg)}
.search-clear-control>.search-clear-button::after{transform:rotate(-45deg)}
.search-clear-control>.search-clear-button:hover{background:#cbd7e8;color:#2f4567}
.search-clear-control>.search-clear-button:focus-visible{outline:3px solid rgba(37,99,235,.2);outline-offset:2px}
.search-clear-control>.search-clear-button[hidden]{display:none!important}
@media(max-width:780px){.desktop-refresh-button,.desktop-refresh-status{display:none!important}.search-clear-control>.search-clear-button{right:9px;width:21px;height:21px;min-height:21px}.search-clear-control:has(>.search-clear-button[hidden])>input[type="search"]{padding-right:12px!important}}

/* Payment tracking augments existing views without adding another navigation tab. */
.payment-overview{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;margin:-3px 0 18px}
.financial-flow-grid{display:block!important;margin-bottom:15px}
#dashboard-view .financial-flow-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.65fr) minmax(0,1.15fr);align-items:stretch;gap:12px;width:100%;min-height:184px;padding:18px;border-color:#c9d9f3;background:linear-gradient(135deg,#f7faff,#eef4ff);box-shadow:0 10px 28px rgba(35,72,135,.08)}
#dashboard-view .financial-flow-item{display:flex;min-width:0;flex-direction:column;justify-content:center;padding:14px 16px;border-radius:13px}
#dashboard-view .financial-flow-item .summary-icon{display:grid;width:32px;height:32px;place-items:center;margin:0 0 10px;border-radius:10px;font-size:14px;font-weight:900}
#dashboard-view .financial-flow-item p{margin:0 0 7px;color:#64748b;font-size:15px;font-weight:800;line-height:1.4}
#dashboard-view .financial-flow-item strong{display:block;overflow:hidden;margin:0 0 5px;color:#1f4f9f;font-size:30px;letter-spacing:-.5px;line-height:1.2;text-overflow:ellipsis;white-space:nowrap}
#dashboard-view .financial-flow-item small{color:#74839a;font-size:13px;font-weight:700;line-height:1.45}
#dashboard-view .financial-flow-income .summary-icon{background:#dce9ff;color:#155eef}
#dashboard-view .financial-flow-income{border:1px solid #8eb5ff;background:linear-gradient(135deg,#f5f8ff,#dfeaff);box-shadow:0 9px 22px rgba(55,105,190,.1)}
#dashboard-view .financial-flow-income p,#dashboard-view .financial-flow-income strong{color:#155eef}
#dashboard-view .financial-flow-fee .summary-icon{position:relative;margin-bottom:6px;background:#eee7ff;color:#6946c6;transform:none}
#dashboard-view .financial-flow-fee .summary-icon{font-size:0}
#dashboard-view .financial-flow-fee .summary-icon::before{position:absolute;top:50%;left:50%;width:16px;height:16px;background:currentColor;content:"";transform:translate(-50%,-50%) translateY(1px);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 3h12v18l-2-1.5-2 1.5-2-1.5-2 1.5-2-1.5L6 21V3Zm4 5h4m-4 4h6m-6 4h4' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 3h12v18l-2-1.5-2 1.5-2-1.5-2 1.5-2-1.5L6 21V3Zm4 5h4m-4 4h6m-6 4h4' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
#dashboard-view .financial-flow-fee strong{color:#6545bd}
#dashboard-view .financial-flow-tax .summary-icon{border:0;background:#fbeee7;color:#d05b18}
#dashboard-view .financial-flow-tax strong{color:#d05b18}
#dashboard-view .financial-flow-deductions{display:flex;min-width:0;flex-direction:column;padding:12px;border:1px solid #ffdca5;border-radius:13px;background:linear-gradient(135deg,#fffaf0,#fff1d6);box-shadow:0 9px 24px rgba(202,133,24,.09)}
#dashboard-view .financial-flow-deductions-title{margin:0 0 5px;color:#8f7043;font-size:14px;font-weight:850;line-height:1.4;text-align:center}
#dashboard-view .financial-flow-deduction-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));flex:1}
#dashboard-view .financial-flow-deduction-grid>.financial-flow-item+ .financial-flow-item{border-left:0}
#dashboard-view .financial-flow-net{border:1px solid #83d2a4;background:linear-gradient(135deg,#f1fcf6,#d8f3e4);box-shadow:0 9px 22px rgba(35,135,78,.1)}
#dashboard-view .financial-flow-net .summary-icon{background:#d2f1df;color:#087443}
#dashboard-view .financial-flow-net p,#dashboard-view .financial-flow-net strong{color:#087443}
#dashboard-view .financial-flow-cash{display:inline-flex;align-items:center;gap:5px;margin:2px 0 7px;padding:5px 9px;border-radius:999px;background:rgba(8,116,67,.09);color:#527b67;font-size:12px;font-weight:750;line-height:1.3;white-space:nowrap}
#dashboard-view .financial-flow-cash b{color:#087443;font-size:13px;font-weight:900}
#dashboard-view .financial-flow-income,#dashboard-view .financial-flow-deductions,#dashboard-view .financial-flow-net{position:relative;overflow:hidden;isolation:isolate}
#dashboard-view .financial-flow-income::before,#dashboard-view .financial-flow-deductions::before,#dashboard-view .financial-flow-net::before{position:absolute;inset:0;z-index:0;background:linear-gradient(122deg,rgba(255,255,255,.34) 0%,rgba(255,255,255,.08) 39%,rgba(255,255,255,0) 53%),linear-gradient(122deg,rgba(255,255,255,0) 55%,rgba(255,255,255,.42) 56%,rgba(255,255,255,.12) 64%,rgba(255,255,255,0) 73%);content:"";pointer-events:none}
#dashboard-view .financial-flow-income>*,#dashboard-view .financial-flow-deductions>*,#dashboard-view .financial-flow-net>*{position:relative;z-index:1}
#dashboard-view .financial-flow-operator{display:grid;place-items:center;color:#94a3b8;font-size:25px;font-weight:700}
@media(min-width:781px){
  #dashboard-view .financial-flow-item{align-items:center;text-align:center}
  #dashboard-view .financial-flow-operator{width:34px;align-self:center;justify-self:center;line-height:1;text-align:center}
}
.tracking-overview>.payment-outstanding-summary{grid-column:auto}
.tracking-overview>.tracking-card{display:grid;min-height:142px;grid-template-rows:30px auto auto auto;align-content:center;justify-items:center;gap:5px;padding:15px 19px;text-align:center}
.tracking-overview>.tracking-card .summary-icon{display:grid;width:28px;height:28px;place-items:center;margin:0;border-radius:9px;font-size:13px}
.tracking-overview>.tracking-card p{align-self:center;margin:0;font-size:16px;line-height:1.4}
.tracking-overview>.tracking-card strong{align-self:center;margin:0;font-size:30px;line-height:1.2}
.tracking-overview>.tracking-card small{display:grid;align-self:start;justify-items:center;gap:2px;margin:0;font-size:13px;line-height:1.4;text-align:center}
.tracking-overview>.tracking-card small>span{display:block}
.tracking-overview>.tracking-card .tracking-action{display:none}
.tracking-overview>.tracking-card::after{position:absolute;top:12px;right:14px;color:#bd6677;font-size:18px;font-weight:850;line-height:1;content:'›'}
.payment-summary-card{min-height:104px;padding:17px 19px;border:1px solid #cfe0f5;border-radius:15px;background:linear-gradient(140deg,#f7fbff,#edf5ff);color:#55708e;text-align:left;box-shadow:0 8px 22px rgba(39,77,128,.07)}
.payment-summary-card>span,.payment-summary-card>small{display:block;font-weight:750}
.payment-summary-card>span{margin-bottom:7px;font-size:13px}
.payment-summary-card>strong{display:block;margin-bottom:5px;color:#155eef;font-size:25px;letter-spacing:-.5px}
.payment-summary-card>small{font-size:11px;color:#70839a}
button.payment-summary-card{width:100%;font:inherit;cursor:pointer}
button.summary-card.pending-summary{width:100%;font:inherit;-webkit-appearance:none;appearance:none;cursor:pointer;transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease}
button.summary-card.pending-summary:hover{border-color:#f09aae;box-shadow:0 11px 28px rgba(202,74,101,.13);transform:translateY(-1px)}
button.summary-card.pending-summary:focus-visible{outline:3px solid rgba(194,63,73,.18);outline-offset:3px}
.payment-outstanding-summary{border-color:#f2d3a2;background:linear-gradient(140deg,#fffaf1,#fff3df)}
.payment-overview>.payment-outstanding-summary{grid-column:1/-1}
.payment-outstanding-summary>strong{color:#a76500}
.payment-outstanding-summary:hover{border-color:#e2b972;transform:translateY(-1px)}
.tracking-overview>.payment-outstanding-summary{grid-column:auto}
.tracking-overview>.payment-outstanding-summary,.tracking-overview>.tracking-card{border:0}
#dashboard-view .tracking-overview>.pending-summary{
  border:1px solid #df6b7f!important;
}
#dashboard-view .tracking-overview>.pending-summary::before{display:block!important}
#dashboard-view .tracking-overview>.pending-summary:hover{
  border-color:#cf536b!important;
}
.payment-status-badge{display:inline-flex;width:max-content;max-width:100%;align-items:center;margin-top:7px;padding:4px 8px;border-radius:999px;font-size:10px;font-weight:850;line-height:1.2;white-space:nowrap}
.payment-status-badge.payment-paid{background:#e3f6ea;color:#127247}
.payment-status-badge.payment-deposit{background:#fff1d6;color:#966000}
.payment-status-badge.payment-unpaid{background:#ffe8eb;color:#ae3f52}
button.payment-status-badge{border:0;font-family:inherit;cursor:pointer}
button.payment-status-badge:focus-visible{outline:3px solid rgba(174,63,82,.18);outline-offset:2px}
#tax-view .tax-table-company h3,#tax-view .tax-job-edit-button{padding-top:3px!important;padding-bottom:3px!important;line-height:1.55!important}
#dashboard-view .recent-panel .recent-item{grid-template-columns:106px minmax(185px,1.25fr) minmax(160px,.72fr) minmax(130px,.55fr) minmax(128px,.55fr)}
#dashboard-view .recent-item[data-recent-preview]{touch-action:manipulation}
#dashboard-view .recent-footer{display:contents}
#dashboard-view .recent-gross{grid-column:3}
#dashboard-view .recent-net{grid-column:4}
#dashboard-view .recent-status{grid-column:5}
#dashboard-view .recent-status{display:grid;min-width:0;align-content:center;justify-items:start;gap:5px}
#dashboard-view .recent-status>span{color:#7b879a;font-size:11px;font-weight:750}
#dashboard-view .recent-status-tags{display:flex;max-width:100%;align-items:center;flex-wrap:wrap;gap:10px}
#dashboard-view .recent-status .payment-status-badge{margin:0}
#dashboard-view .recent-certificate-status{position:relative;display:inline-flex;align-items:center;padding:4px 8px;border-radius:999px;background:#ffe8eb;color:#ae3f52;font-size:10px;font-weight:850;line-height:1.2;white-space:nowrap}
button.recent-certificate-status{border:0;font-family:inherit;cursor:pointer;transition:filter .15s ease,transform .15s ease}
button.recent-certificate-status:hover{filter:brightness(.97);transform:translateY(-1px)}
button.recent-certificate-status:focus-visible{outline:3px solid rgba(21,94,239,.18);outline-offset:2px}
#dashboard-view .recent-certificate-status.good{background:#e3f6ea;color:#127247}
#dashboard-view .recent-certificate-status:has(.certificate-notification-count){margin-right:5px}
@media(min-width:781px){
  #dashboard-view .recent-panel .recent-item{
    min-height:112px;
    padding:22px 22px!important;
    gap:22px;
  }
  #dashboard-view .recent-item>time{font-size:15px;line-height:1.45}
  #dashboard-view .recent-job{gap:6px}
  #dashboard-view .recent-job-button{font-size:17px;line-height:1.45}
  #dashboard-view .recent-job small{font-size:14px;line-height:1.45}
  #dashboard-view .recent-job-meta .recent-channel-tag{font-size:12px!important;padding:4px 9px!important}
  #dashboard-view .recent-gross{row-gap:3px}
  #dashboard-view .recent-gross>span,
  #dashboard-view .recent-net>span,
  #dashboard-view .recent-status>span{font-size:13px;line-height:1.35}
  #dashboard-view .recent-gross>strong{font-size:19px;line-height:1.35}
  #dashboard-view .recent-gross .deduction-info{font-size:12px;line-height:1.45}
  #dashboard-view .recent-net>strong{font-size:21px;line-height:1.35}
  #dashboard-view .recent-certificate-status,
  #dashboard-view .recent-status .payment-status-badge{padding:5px 10px;font-size:12px;line-height:1.25}
  #dashboard-view .recent-item>time{grid-column:1;grid-row:1}
  #dashboard-view .recent-item>.recent-job{grid-column:2;grid-row:1}
  #dashboard-view .recent-footer>.recent-gross{grid-column:3;grid-row:1}
  #dashboard-view .recent-item>.recent-net{grid-column:4;grid-row:1}
  #dashboard-view .recent-footer>.recent-status{grid-column:5;grid-row:1}
}
@media(max-width:780px){
  #dashboard-view .recent-panel .recent-item{grid-template-columns:78px minmax(0,1fr)}
  #dashboard-view .recent-status{grid-column:2;justify-items:start}
  #dashboard-view .recent-status>span{display:none}
}

/* Desktop optical correction: match the Latin Links label to the Thai navigation labels. */
@media(min-width:781px){
  .topbar .nav-link[data-view="links"]{
    font-size:16px;
    font-weight:700;
    line-height:1.35;
  }
}
@media(max-width:520px){#dashboard-view .recent-status{grid-row:5}}

/* iPhone recent list: compact layout B, with the net amount as the visual anchor. */
@media(max-width:520px){
  #dashboard-view .recent-panel{background:#f5f8fe}
  #dashboard-view .recent-panel .section-heading{margin:0;background:#fff}
  #dashboard-view .recent-list{gap:14px;padding:14px 12px 18px}
  #dashboard-view .recent-panel .recent-item{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-rows:auto auto auto auto;
    column-gap:12px;
    row-gap:6px;
    align-items:start;
    min-height:0;
    padding:18px 18px 11px!important;
    border:1px solid #dce5f2!important;
    border-radius:14px;
    background:#fff;
    box-shadow:0 3px 10px rgba(33,64,121,.045);
    cursor:pointer;
  }
  #dashboard-view .recent-job{display:grid;grid-column:1;grid-row:2;gap:4px;min-width:0}
  #dashboard-view .recent-item time{grid-column:1;grid-row:1;align-self:start;margin:0 0 2px;font-size:14px;line-height:1.4}
  #dashboard-view .recent-job-button{display:block;width:100%;max-width:100%;grid-column:auto;grid-row:auto;align-self:auto;font-size:16px;line-height:1.5}
  #dashboard-view .recent-job-meta{width:100%;max-width:100%;grid-column:auto;grid-row:auto;align-self:auto;min-width:0;overflow:hidden}
  #dashboard-view .recent-job-meta>span:first-child{flex:1 1 auto;min-width:0;font-size:13px;line-height:1.5}
  #dashboard-view .recent-job-meta .recent-channel-tag{display:none!important}
  #dashboard-view .recent-footer{
    display:flex;
    grid-column:1/-1;
    grid-row:3;
    min-width:0;
    align-items:stretch;
    justify-content:space-between;
    gap:12px;
    min-height:47px;
    margin-top:12px;
    padding-top:17px;
    border-top:1px solid #e5ebf3;
  }
  #dashboard-view .recent-gross{
    display:flex;
    flex:1 1 auto;
    min-width:0;
    align-self:center;
    align-items:center;
    flex-wrap:wrap;
    gap:2px 6px;
    margin:0;
  }
  #dashboard-view .recent-gross>span{display:inline;flex:0 0 auto;grid-column:auto;grid-row:auto;font-size:0}
  #dashboard-view .recent-gross>span::after{content:'ค่าจ้าง';color:#7b879a;font-size:12px;font-weight:750}
  #dashboard-view .recent-gross>strong{grid-column:auto;grid-row:auto;color:#5d6c84;font-size:13px}
  #dashboard-view .recent-gross .deduction-info{
    display:flex;
    flex:0 0 100%;
    grid-column:auto;
    grid-row:auto;
    gap:3px;
    margin:0;
    font-size:11px;
  }
  #dashboard-view .recent-net{
    display:grid;
    grid-template-columns:1fr;
    grid-auto-flow:row;
    grid-column:2;
    grid-row:1/3;
    align-self:center;
    justify-items:end;
    gap:4px;
    min-width:98px;
  }
  #dashboard-view .recent-net>span,#dashboard-view .recent-net>strong{grid-column:1;white-space:nowrap}
  #dashboard-view .recent-net>span{grid-row:1;font-size:0}
  #dashboard-view .recent-net>span::after{content:'เงินสุทธิ';font-size:11px}
  #dashboard-view .recent-net>strong{grid-row:2;font-size:20px}
  #dashboard-view .recent-status{
    display:flex;
    flex:0 1 auto;
    min-width:0;
    align-self:stretch;
    align-items:center;
    margin:0;
    padding:0;
    border:0;
  }
  #dashboard-view .recent-status-tags{align-items:center;justify-content:flex-end;flex-wrap:nowrap;gap:6px}
  #dashboard-view .recent-status .payment-status-badge,
  #dashboard-view .recent-status .recent-certificate-status{min-height:28px;align-items:center;justify-content:center;padding:5px 10px;font-size:11px;line-height:1.2}
}
@media(min-width:701px){
  #tax-view .tax-data-table th{font-size:12px!important}
  #tax-view .tax-data-table td{font-size:14px!important}
  #tax-view .tax-data-table .tax-cell-job button{font-size:14px!important}
  #tax-view .tax-data-table .tax-cell-status .status{font-size:11px!important}
}
#transactions-view .transaction-gross>.payment-status-badge{display:flex;margin-top:9px}
@media(min-width:701px){#transactions-view .transaction-gross>.payment-status-badge{margin-left:auto}}
.payment-section{margin:0 -25px 12px;padding:14px 25px 16px;border-bottom:1px solid #dce5f2;background:#f8fbff}
.payment-section select,.payment-section input,.payment-section textarea{width:100%}
.payment-section input[readonly]{background:#eef4ff;color:#155eef;font-weight:850}
.payment-help{display:none!important}
.preview-payment .payment-status-badge{margin:0}
.entry-history-dialog{padding:25px}
.entry-history-dialog>.muted{margin:10px 0 18px}
.entry-history-list{display:grid;gap:10px;max-height:min(58vh,520px);overflow:auto}
.entry-history-item{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:14px;padding:14px;border:1px solid #dae4f2;border-radius:12px;background:#f8faff}
.entry-history-item strong,.entry-history-item time,.entry-history-item p{display:block;margin:0}
.entry-history-item>.entry-history-content>strong{color:#173b75;font-size:14px}
.entry-history-item time{margin-top:3px;color:#718096;font-size:11px}
.entry-history-item button{align-self:center;white-space:nowrap;color:#155eef;border-color:#bfd0f0}
.history-change-list{display:grid;gap:8px;margin-top:11px}
.history-change{display:grid;gap:5px;padding:9px 10px;border:1px solid #e0e8f4;border-radius:9px;background:#fff}
.history-change-label{color:#455b7d;font-size:11px;font-weight:850}
.history-change-values{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:8px}
.history-value{display:grid;min-width:0;gap:2px;padding:6px 8px;border-radius:7px;background:#f4f6fa}
.history-value small{color:#8290a5;font-size:9px;font-weight:800}
.history-value b{overflow-wrap:anywhere;color:#43516a;font-size:11px;line-height:1.4}
.history-after{background:#edf4ff}
.history-after b{color:#155eef}
.history-change-arrow{color:#8c9bb1;font-size:13px;font-weight:900}
#save-template,#entry-history-button{position:relative;display:grid;flex:0 0 44px;width:44px;height:44px;min-width:44px;padding:0;place-items:center;border-color:#bfd0f0;background:#fff;color:#155eef;font-size:0;line-height:0}
#save-template::before,#entry-history-button::before{width:23px;height:23px;background:currentColor;content:""}
#save-template::before{-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 3.5h7l4 4v13H7zM14 3.5v4h4M12.5 11v5M10 13.5h5' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 3.5h7l4 4v13H7zM14 3.5v4h4M12.5 11v5M10 13.5h5' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
#entry-history-button{margin-right:auto}
#entry-history-button::before{-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4.5 8V4m0 4h4M5 8a8 8 0 1 1-1 7M12 7v5l3 2' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4.5 8V4m0 4h4M5 8a8 8 0 1 1-1 7M12 7v5l3 2' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
#entry-history-button:hover{border-color:#bdccc2;background:var(--cream);color:#155eef;transform:none;filter:none}
#dialog-delete:hover{border-color:#dfa4ab!important;background:#ffeaed!important;color:#a42f3a!important}
.status[data-toggle-certificate],.status[data-tax-certificate-entry],.status[data-tax-company-certificate],.status[data-tax-company-file]{position:relative;overflow:visible}
.certificate-notification-count{position:absolute;top:-8px;right:-14px;display:grid;width:20px;min-width:20px;height:20px;place-items:center;padding:0;border:0;border-radius:50%;background:#f04444;color:#fff;font-size:9px;font-weight:900;line-height:1;box-shadow:none;font-variant-numeric:tabular-nums;text-align:center}
#transactions-view #transaction-rows .status[data-toggle-certificate].good{background:#e3f6ea!important;color:#127247!important}
#transactions-view #transaction-rows .transaction-mobile-status{column-gap:14px}
#transactions-view #transaction-rows .transaction-mobile-status .status:has(.certificate-notification-count){margin-right:8px}
#dashboard-view .recent-certificate-status>.certificate-notification-count{top:-6px;right:-11px;display:grid;width:18px;min-width:18px;height:18px;place-items:center;padding:0;border-radius:50%;font-size:8px;line-height:1;text-align:center}
.tax-pending-installments{display:inline-grid;width:max-content;max-width:100%;align-items:stretch;gap:5px;margin-top:8px}
.tax-pending-installment{display:inline-flex;width:100%;max-width:100%;min-height:30px;align-items:center;gap:7px;padding:5px 8px;border:1px solid #f3cbd1;border-radius:8px;background:#fff4f5;color:#a33b4b;font-size:10px;line-height:1.35}
.tax-pending-installment b,.tax-pending-installment small{display:inline-flex;min-height:18px;align-items:center;margin:0;font-size:10px;line-height:18px}
.tax-pending-installment b{flex:none;white-space:nowrap}
.tax-pending-installment small{min-width:0;color:#92515b;font-weight:750;white-space:normal}
#tax-entry-list .tax-cell-status .status,#tax-pending-list .tax-cell-status .status{display:inline-flex;width:max-content;min-width:0;min-height:30px;align-items:center;justify-content:center;padding:5px 9px;border-radius:999px;white-space:nowrap}
#transactions-view .filter-payment{flex:.95 1 175px}
@media(max-width:700px){.tax-pending-installment{align-items:flex-start;flex-direction:column;gap:2px}.tax-pending-installment small{overflow:visible;white-space:normal}}
@media(max-width:780px){
  .payment-overview{gap:10px;margin-top:-2px}
  #dashboard-view .financial-flow-grid{display:block!important}
  #dashboard-view .financial-flow-card{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:8px;width:100%!important;min-height:0!important;padding:10px!important}
  #dashboard-view .financial-flow-item{min-height:122px;align-items:center;padding:13px;text-align:center}
  #dashboard-view .financial-flow-item p{font-size:13px}
  #dashboard-view .financial-flow-item strong{font-size:23px}
  #dashboard-view .financial-flow-item small{font-size:11px}
  #dashboard-view .financial-flow-deductions-title{font-size:12px}
  #dashboard-view .financial-flow-cash{font-size:11px}
  #dashboard-view .financial-flow-cash b{font-size:12px}
  #dashboard-view .financial-flow-cash{width:max-content;max-width:100%;align-self:center;padding:4px 8px}
  #dashboard-view .financial-flow-operator{display:none}
  #dashboard-view .financial-flow-deductions{padding:10px}
  #dashboard-view .financial-flow-deduction-grid>.financial-flow-item{min-height:112px;padding:10px}
  .tracking-overview{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tracking-overview>.payment-summary-card,.tracking-overview>.tracking-card{min-height:108px;padding:14px 13px}
  .tracking-overview>.tracking-card{grid-column:auto!important;width:auto!important;min-height:116px;grid-template-rows:auto auto auto;gap:9px;padding:17px 16px!important}
  .tracking-overview>.tracking-card .summary-icon,.tracking-overview>.tracking-card .tracking-action{display:none}
  .tracking-overview>.tracking-card::after{position:absolute;top:10px;right:12px;color:#bd6677;font-size:18px;font-weight:850;line-height:1;content:'›'}
  .tracking-overview>.tracking-card p{font-size:14px;line-height:1.5}
  .tracking-overview>.tracking-card strong{font-size:24px;line-height:1.3}
  .tracking-overview>.tracking-card small{font-size:12px;line-height:1.5}
  .payment-summary-card{min-height:96px;padding:14px 13px;border-radius:13px}
  .payment-summary-card>strong{font-size:21px}
  .payment-summary-card>span{font-size:12px}
  .payment-summary-card>small{font-size:10px}
  #transaction-rows .payment-status-badge{margin-top:7px}
  .entry-history-dialog{padding:21px 18px}
  .entry-history-item{grid-template-columns:1fr;gap:10px}
  .entry-history-item button{width:100%;min-height:40px}
  .history-change-values{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:6px}
  #transaction-form .dialog-actions{flex-wrap:wrap}
  #save-template,#entry-history-button{flex:0 0 44px;width:44px;min-width:44px;margin-bottom:0}
  #entry-history-button{margin-right:auto}
}

/* Multiple payment installments inside one job. */
.payment-section-heading{display:flex;min-height:44px;align-items:center;justify-content:space-between;gap:18px;margin-bottom:10px}
.payment-section-heading-copy{display:flex;min-width:0;align-items:center;align-self:center;gap:12px;flex-wrap:wrap}
.payment-section-heading h3{margin:0;font-size:18px}
.payment-section-heading p{margin:0;color:#687b95;font-size:13px;line-height:1.5}
.payment-section-heading button{display:inline-flex;height:34px;min-height:34px;align-items:center;align-self:center;justify-content:center;flex:none;margin:0;padding:0 11px;color:#155eef;border-color:#bfd0f0;background:#fff;font-size:12px;line-height:1}
#add-payment-installment{border-color:#155eef;background:#155eef;color:#fff}
#add-payment-installment:hover{border-color:#0d4dcc;background:#0d4dcc;color:#fff}
#add-payment-installment:disabled{border-color:#a9bff0;background:#a9bff0;color:rgba(255,255,255,.9);cursor:not-allowed}
.payment-draft-status{margin:0}
.payment-draft-status .payment-status-badge{margin:0;padding:6px 11px;font-size:12px}
.payment-draft-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}
.payment-draft-summary article{min-width:0;padding:10px 12px;border:1px solid #d8e4f3;border-radius:11px;background:#fff}
.payment-draft-summary span,.payment-draft-summary strong{display:block}
.payment-draft-summary span{min-height:20px;color:#718198;font-size:12px;font-weight:750;line-height:1.4}
.payment-draft-summary strong{margin-top:3px;color:#155eef;font-size:20px;letter-spacing:-.2px}
.payment-draft-summary .payment-draft-outstanding{border-color:#ecd8b7;background:#fffaf2}
.payment-draft-summary .payment-draft-outstanding strong{color:#a76400}
.payment-progress{height:6px;margin:9px 0 11px;overflow:hidden;border-radius:999px;background:#e5edf8}
.payment-progress span{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#2a6df5,#35b77a);transition:width .2s ease}
.payment-installment-list{display:grid;gap:10px}
.payment-installment-empty{display:grid;gap:3px;padding:13px;border:1px dashed #cbd9eb;border-radius:12px;text-align:center;background:rgba(255,255,255,.65)}
.payment-installment-empty strong{color:#405571;font-size:15px}
.payment-installment-empty span{color:#7a899d;font-size:12px}
.payment-installment-card{padding:14px;border:1px solid #d7e3f2;border-radius:13px;background:#fff;box-shadow:0 5px 14px rgba(31,69,119,.05)}
.payment-installment-card header{display:flex;min-height:38px;align-items:center;justify-content:space-between;gap:12px}
.payment-installment-card header small,.payment-installment-card header strong{display:block}
.payment-installment-card header small{margin-bottom:3px;color:#718198;font-size:11px;font-weight:800;text-transform:uppercase}
.payment-installment-card header strong{color:#203552;font-size:16px}
.payment-installment-note{display:block;margin-top:4px;color:#718198;font-size:12px;font-weight:650;line-height:1.45}
.payment-certificate-badge{display:inline-flex;min-height:38px;align-items:center;justify-content:center;flex:none;padding:7px 13px;border:0;border-radius:999px;font:inherit;font-size:12px;font-weight:850;line-height:1.35;white-space:nowrap}
button.payment-certificate-badge{cursor:pointer;transition:filter .15s ease,transform .15s ease}
button.payment-certificate-badge:hover{filter:brightness(.97);transform:translateY(-1px)}
button.payment-certificate-badge:focus-visible{outline:3px solid rgba(21,94,239,.18);outline-offset:2px}
.payment-certificate-badge.is-received{background:#e2f5e9;color:#147148}
.payment-certificate-badge.is-pending{background:#ffe8eb;color:#ae3f52}
.payment-certificate-badge.is-none{background:#edf1f6;color:#65758a}
.payment-installment-figures{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px;padding:11px 0;border-top:1px solid #e5ebf3;border-bottom:1px solid #e5ebf3}
.payment-installment-figures span{min-width:0}
.payment-installment-figures small,.payment-installment-figures strong{display:block}
.payment-installment-figures small{color:#7b8a9e;font-size:11px;font-weight:750}
.payment-installment-figures strong{margin-top:3px;color:#253954;font-size:16px}
.payment-installment-card footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:10px;color:#718198;font-size:12px;font-weight:700}
.payment-installment-card footer>div{display:flex;gap:6px}
.payment-installment-card footer button{min-height:34px;padding:6px 11px;font-size:12px}
.payment-installment-card footer [data-payment-edit]{border-color:#b9cdf5;background:#f7faff;color:#155eef}
.payment-installment-card footer [data-payment-edit]:hover{border-color:#92aff0;background:#edf3ff;color:#0f4fce}
.payment-installment-card footer .payment-delete{color:#b3414b;border-color:#ecc8cc;background:#fff8f8}
.payment-installment-card footer .payment-delete:hover{border-color:#dfa4ab;background:#ffeaed;color:#a42f3a}
.payment-installment-editor{margin-top:12px;padding:16px;border:1px solid #b9cff3;border-radius:14px;background:#f2f7ff;box-shadow:0 10px 24px rgba(31,79,157,.08)}
.payment-installment-editor-heading{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:14px}
.payment-installment-editor-heading small{display:block;margin-bottom:2px;color:#155eef;font-size:11px;font-weight:850;text-transform:uppercase}
.payment-installment-editor-heading h4{margin:0;color:#1e3557;font-size:18px}
.payment-installment-editor input[readonly]{background:#e8f0fc}
#installment-amount{-moz-appearance:textfield;appearance:textfield}
#installment-amount::-webkit-inner-spin-button,#installment-amount::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.payment-withholding-toggle{padding:11px 12px!important;border:1px solid #d0dff2;border-radius:10px;background:#fff}
.payment-editor-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}
.payment-editor-actions button{min-width:112px}
#transaction-form>.dialog-actions{border-top:0}
#transaction-form #net-amount{color:#155eef!important}
#transaction-dialog #job-name{height:42px;min-height:42px;padding-top:0;padding-bottom:0}
#transaction-form input:not([type="checkbox"]):not([type="hidden"]),
#transaction-form select,
#transaction-form .form-select-button{height:42px;min-height:42px}
#transaction-form .order-input{height:42px}
#transaction-form .order-input input{height:100%;min-height:0}
#transaction-form #fastwork-order-field{align-self:start;align-content:start}
#transaction-form #installment-certificate-field{display:none!important}
#transaction-form .installment-amount-label{position:relative}
#transaction-form .payment-percent-quick{position:absolute;top:-4px;right:0;display:flex;gap:5px}
#transaction-form .payment-percent-quick button{display:inline-flex;height:24px;min-height:24px;align-items:center;justify-content:center;padding:0 8px;border:1px solid #bcd0fb;border-radius:999px;background:#f1f5ff;color:#155eef;font-family:inherit;font-size:10px;font-weight:850;line-height:1;cursor:pointer}
#transaction-form .payment-percent-quick button:hover{border-color:#8fb0f4;background:#e5edff}
#transaction-form #fastwork-progress{grid-column:1/-1;margin-top:-8px;white-space:nowrap}
#transaction-form .fastwork-link-choices button{display:inline-flex;height:28px;min-height:28px;align-items:center;justify-content:center;padding:0 10px;line-height:1;text-align:center}
#transaction-form .fastwork-link-choices>div{transform:translateY(3px)}
@media(max-width:780px){
  #transaction-form #fastwork-progress{white-space:pre-line}
  #transaction-form .fastwork-link-choices>div{
    justify-content:flex-start;
    margin-top:11px;
    margin-bottom:-4px;
    transform:none;
  }
}
@media(max-width:780px){
  #transaction-form .payment-installment-editor .form-grid>label{min-width:0}
  #transaction-form #installment-date{
    -webkit-appearance:none;
    appearance:none;
    display:block;
    width:100%;
    min-width:0;
    max-width:100%;
    height:42px;
    min-height:42px;
    padding:0 14px;
    border:1px solid #d5e0f3;
    border-radius:9px;
    font-size:18px;
    font-weight:750;
    line-height:40px;
    text-align:center;
  }
  #transaction-form #installment-date::-webkit-date-and-time-value{min-height:0;margin:0;text-align:center}
  #transaction-form #installment-date::-webkit-datetime-edit{padding:0}
  #transaction-form .payment-percent-quick{position:absolute;top:-4px;right:0;margin:0}
  #transaction-form #installment-note{min-height:78px;resize:vertical;overflow:auto}
}

@media(max-width:780px){
  #transactions-view #transaction-rows .transaction-card-row{cursor:pointer;touch-action:manipulation}
  .payment-section-heading{align-items:stretch;flex-direction:column;gap:10px}
  .payment-section-heading button{width:100%;height:44px;min-height:44px;border-radius:10px;font-size:13px}
  .payment-draft-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
  .payment-draft-summary article{padding:11px}
  .payment-draft-summary span{min-height:0;font-size:11px}
  .payment-draft-summary strong{font-size:18px}
  .payment-installment-card header{align-items:center}
  .payment-installment-card header small{font-size:10px}
  .payment-installment-card header strong{font-size:15px}
  .payment-installment-note{font-size:11px}
  .payment-certificate-badge{min-height:36px;padding:7px 11px;font-size:11px}
  .payment-installment-figures small{font-size:10px}
  .payment-installment-figures strong{font-size:15px}
  .payment-installment-card footer{font-size:11px}
  .payment-installment-card footer button{font-size:11px}
  .payment-installment-card footer{align-items:flex-start;flex-direction:column}
  .payment-installment-card footer>div{width:100%}
  .payment-installment-card footer button{flex:1;min-height:38px}
  .payment-installment-editor{padding:14px 12px}
  .payment-editor-actions button{flex:1;min-width:0}
}


@media(max-width:420px){
  .payment-installment-figures{grid-template-columns:1fr 1fr}
  .payment-installment-figures span:last-child{grid-column:1/-1}
  .payment-certificate-badge{white-space:normal;text-align:center}
}

/* iPhone transaction cards mirror the dashboard's latest-items hierarchy. */
.transaction-mobile-status{display:none}
@media(max-width:520px){
  #transactions-view #transaction-rows{gap:14px}
  #transactions-view #transaction-rows .transaction-card-row{
    display:grid;
    grid-template-columns:minmax(90px,1fr) auto;
    grid-template-rows:auto auto auto auto;
    grid-template-areas:
      "date channel"
      "title title"
      "customer net"
      "gross status";
    min-height:0;
    align-items:start;
    gap:4px 12px;
    overflow:visible;
    padding:18px 18px 12px;
    border:1px solid #dce5f2;
    border-radius:14px;
    background:#fff;
    box-shadow:0 3px 10px rgba(33,64,121,.045);
  }
  #transactions-view #transaction-rows .transaction-card-row::before{display:none}
  #transactions-view #transaction-rows .transaction-card-row::after{
    display:block;
    grid-column:1/-1;
    grid-row:4;
    align-self:start;
    height:1px;
    margin-top:12px;
    background:#e5ebf3;
    content:"";
    pointer-events:none;
  }
  #transactions-view #transaction-rows .transaction-card-row>td{height:auto!important}
  #transactions-view #transaction-rows .transaction-date{
    display:block;
    grid-area:date;
    align-self:start;
    margin:0 0 2px;
    color:#5d6c84;
    font-size:14px;
    font-weight:700;
    line-height:1.4;
  }
  #transactions-view #transaction-rows .transaction-date::before{display:none}
  #transactions-view #transaction-rows .job-cell{
    display:contents;
  }
  #transactions-view #transaction-rows .job-edit-button{
    display:block;
    grid-area:title;
    width:100%;
    min-width:0;
    align-self:auto;
    overflow:hidden;
    padding:0;
    color:#17233a;
    font-size:16px;
    font-weight:850;
    line-height:1.5;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  #transactions-view #transaction-rows .transaction-card-edit{display:none!important}
  #transactions-view #transaction-rows .job-customer-row{
    display:block;
    grid-area:customer;
    min-width:0;
    overflow:hidden;
  }
  #transactions-view #transaction-rows .job-customer{
    display:block!important;
    min-width:0;
    overflow:hidden;
    color:#71809b;
    font-size:13px;
    font-weight:500;
    line-height:1.5;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  #transactions-view #transaction-rows .client-kind,
  #transactions-view #transaction-rows .fastwork-customer-tag{display:none!important}
  #transactions-view #transaction-rows .job-customer-name{
    display:block;
    min-width:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  #transactions-view #transaction-rows .channel-cell{
    display:inline-flex!important;
    grid-area:channel;
    width:max-content;
    max-width:100%;
    min-width:0;
    min-height:22px;
    align-self:center;
    align-items:center;
    justify-self:end;
    justify-content:flex-end;
    gap:4px;
    overflow:hidden;
    padding:3px 7px;
    border:1px solid #d9e5dc;
    border-radius:6px;
    background:#f1f5f2;
    color:#49665a;
    font-size:10px;
    font-weight:800;
    line-height:1.2;
    white-space:nowrap;
  }
  #transactions-view #transaction-rows .channel-cell::before{display:none}
  #transactions-view #transaction-rows .channel-cell:has(.channel-fastwork){border-color:#cbd8fb;background:#eaf0ff;color:#3156bc}
  #transactions-view #transaction-rows .channel-cell:has(.channel-line){border-color:#baeacb;background:#e8f9ee;color:#087b34}
  #transactions-view #transaction-rows .channel-cell:has(.channel-facebook){border-color:#d9c9fa;background:#f2edff;color:#7041b4}
  #transactions-view #transaction-rows .channel-cell:has(.channel-instagram){border-color:#f2c4da;background:#fff0f6;color:#ae256a}
  #transactions-view #transaction-rows .channel-cell:has(.channel-tiktok){border-color:#17191d;background:#17191d;color:#fff}
  #transactions-view #transaction-rows .channel-cell:has(.channel-direct){border-color:#d6dcda;background:#eff1f0;color:#343a37}
  #transactions-view #transaction-rows .channel-cell>.channel-chip{
    display:inline!important;
    width:auto;
    max-width:none;
    min-height:0;
    padding:0;
    border:0!important;
    border-radius:0;
    background:transparent!important;
    color:inherit!important;
    font-size:inherit;
    font-weight:inherit;
    line-height:inherit;
  }
  #transactions-view #transaction-rows .channel-cell>.channel-order{
    display:inline!important;
    width:auto;
    max-width:88px;
    margin:0!important;
    overflow:hidden;
    padding:0;
    color:inherit;
    font-size:inherit;
    font-weight:750;
    line-height:inherit;
    opacity:.78;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  #transactions-view #transaction-rows .net-table-amount{
    display:flex!important;
    grid-area:net;
    align-items:baseline;
    align-self:center;
    justify-content:flex-end;
    min-width:112px;
    gap:5px;
    color:#155eef!important;
    font-size:20px;
    font-weight:900;
    line-height:1.25;
    white-space:nowrap;
  }
  #transactions-view #transaction-rows .net-table-amount::before{
    display:inline;
    flex:0 0 auto;
    color:#7b879a;
    content:'เงินสุทธิ';
    font-size:11px;
    font-weight:750;
    line-height:1.2;
  }
  #transactions-view #transaction-rows .transaction-gross{
    display:flex!important;
    grid-area:gross;
    min-width:0;
    align-self:stretch;
    align-content:center;
    align-items:center;
    flex-wrap:wrap;
    gap:2px 6px;
    margin-top:12px;
    padding-top:16px!important;
    border-top:0!important;
    color:#5d6c84;
    line-height:1.2;
  }
  #transactions-view #transaction-rows .transaction-gross::before{
    display:block;
    flex:0 0 auto;
    align-self:center;
    color:#7b879a;
    content:'ค่าจ้าง';
    font-size:12px;
    font-weight:750;
    line-height:1.2;
  }
  #transactions-view #transaction-rows .transaction-gross>strong{
    flex:0 0 auto;
    align-self:center;
    color:#5d6c84;
    font-size:13px;
    font-weight:850;
    line-height:1.2;
  }
  #transactions-view #transaction-rows .transaction-gross>.deduction-info{
    display:flex;
    flex:0 0 100%;
    min-height:0!important;
    align-items:center;
    flex-wrap:wrap;
    gap:2px 6px;
    margin:0;
    color:#74839a;
    font-size:11px;
    line-height:1.35;
  }
  #transactions-view #transaction-rows .transaction-gross>.deduction-info span{display:inline-flex;align-items:baseline;gap:3px;white-space:nowrap}
  #transactions-view #transaction-rows .transaction-gross>.deduction-info span+span::before{margin-right:1px;color:#a1acbc;content:'·'}
  #transactions-view #transaction-rows .transaction-gross>.payment-status-badge{display:none!important}
  #transactions-view #transaction-rows .status-cell{
    display:flex!important;
    grid-area:status;
    min-width:0;
    min-height:0;
    align-self:stretch;
    align-items:center;
    justify-content:flex-end;
    overflow:visible;
    gap:0;
    margin-top:12px;
    padding-top:16px!important;
    border-top:0!important;
    text-align:right!important;
  }
  #transactions-view #transaction-rows .status-cell::before,
  #transactions-view #transaction-rows .status-cell>.status{display:none!important}
  #transactions-view #transaction-rows .transaction-mobile-status{
    display:flex;
    min-width:0;
    align-items:center;
    justify-content:flex-end;
    flex-wrap:wrap;
    gap:12px;
  }
  #transactions-view #transaction-rows .transaction-mobile-status .payment-status-badge,
  #transactions-view #transaction-rows .transaction-mobile-status .status{
    display:inline-flex;
    min-height:28px;
    align-items:center;
    justify-content:center;
    margin:0;
    padding:5px 10px;
    border:0;
    border-radius:999px;
    font-size:11px;
    font-weight:850;
    line-height:1.2;
    white-space:nowrap;
  }
  #transactions-view #transaction-rows .transaction-mobile-status .status{position:relative;overflow:visible}
  #transactions-view #transaction-rows .transaction-mobile-status .status.good{
    background:#e3f6ea;
    color:#127247;
  }
  #transactions-view #transaction-rows .transaction-mobile-status .status:has(.certificate-notification-count){margin-right:6px}
  #transactions-view #transaction-rows .transaction-mobile-status .certificate-notification-count{
    top:-6px;
    right:-8px;
    width:18px;
    min-width:18px;
    height:18px;
    font-size:8px;
  }
}

@media(max-width:520px){
  #transactions-view #transaction-rows .transaction-card-row{
    display:block;
    padding:16px 18px 11px;
  }
  #transactions-view #transaction-rows .transaction-card-row::after{display:none}
  #transactions-view #transaction-rows .transaction-card-row>td:not(.transaction-mobile-card-cell){display:none!important}
  #transactions-view #transaction-rows .transaction-mobile-card-cell{
    display:block!important;
    width:100%;
    height:auto!important;
    padding:0!important;
    border:0!important;
    background:transparent;
    cursor:pointer;
    touch-action:manipulation;
  }
  #transactions-view #transaction-rows .transaction-mobile-card-cell::before{display:none!important}
  #transactions-view .transaction-mobile-body{
    align-items:baseline;
    margin-top:17px;
  }
  #transactions-view .transaction-mobile-net{
    position:relative;
    display:block;
    align-self:auto;
    padding:0;
  }
  #transactions-view .transaction-mobile-net>span{
    position:absolute;
    right:0;
    bottom:calc(100% - 1px);
  }
  #transactions-view .transaction-mobile-net>strong{
    display:block;
    line-height:1.5;
  }
}

@media(max-width:520px){
  #transactions-view .transaction-mobile-body{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-rows:auto auto;
    align-items:baseline;
    gap:4px 12px;
    margin-top:8px;
  }
  #transactions-view .transaction-mobile-copy,
  #transactions-view .transaction-mobile-net{display:contents}
  #transactions-view .transaction-mobile-job{
    grid-column:1;
    grid-row:1;
  }
  #transactions-view .transaction-mobile-customer{
    grid-column:1;
    grid-row:2;
  }
  #transactions-view .transaction-mobile-net>span{
    position:static;
    grid-column:2;
    grid-row:1;
    align-self:baseline;
    justify-self:end;
  }
  #transactions-view .transaction-mobile-net>strong{
    grid-column:2;
    grid-row:2;
    align-self:baseline;
    justify-self:end;
    line-height:1.5;
  }
}

.recent-mobile-channel{display:none}
@media(max-width:520px){
  #dashboard-view .recent-panel .recent-item{
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-rows:auto auto auto auto;
    gap:0 12px;
    padding:16px 18px 11px!important;
  }
  #dashboard-view .recent-item>time{
    grid-column:1;
    grid-row:1;
    align-self:center;
    margin:0;
  }
  #dashboard-view .recent-mobile-channel{
    display:inline-flex;
    grid-column:2;
    grid-row:1;
    width:max-content;
    max-width:calc(100vw - 158px);
    min-height:22px;
    align-items:center;
    justify-self:end;
    justify-content:flex-end;
    gap:4px;
    overflow:hidden;
    padding:3px 7px;
    border:1px solid #d9e5dc;
    border-radius:6px;
    background:#f1f5f2;
    color:#49665a;
    font-size:10px;
    font-weight:800;
    line-height:1.2;
    white-space:nowrap;
  }
  #dashboard-view .recent-mobile-channel:has(.channel-fastwork){border-color:#cbd8fb;background:#eaf0ff;color:#3156bc}
  #dashboard-view .recent-mobile-channel:has(.channel-line){border-color:#baeacb;background:#e8f9ee;color:#087b34}
  #dashboard-view .recent-mobile-channel:has(.channel-facebook){border-color:#d9c9fa;background:#f2edff;color:#7041b4}
  #dashboard-view .recent-mobile-channel:has(.channel-instagram){border-color:#f2c4da;background:#fff0f6;color:#ae256a}
  #dashboard-view .recent-mobile-channel:has(.channel-tiktok){border-color:#17191d;background:#17191d;color:#fff}
  #dashboard-view .recent-mobile-channel:has(.channel-direct){border-color:#d6dcda;background:#eff1f0;color:#343a37}
  #dashboard-view .recent-mobile-channel>.channel-chip{
    display:inline!important;
    width:auto;
    max-width:none;
    min-height:0;
    padding:0;
    border:0!important;
    border-radius:0;
    background:transparent!important;
    color:inherit!important;
    font-size:inherit;
    font-weight:inherit;
    line-height:inherit;
  }
  #dashboard-view .recent-mobile-channel>.channel-order{
    display:inline!important;
    width:auto;
    max-width:88px;
    margin:0!important;
    overflow:hidden;
    padding:0;
    color:inherit;
    font-size:inherit;
    font-weight:750;
    line-height:inherit;
    opacity:.78;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  #dashboard-view .recent-job,
  #dashboard-view .recent-net{display:contents}
  #dashboard-view .recent-job-button{
    grid-column:1;
    grid-row:2;
    align-self:baseline;
    margin-top:8px;
  }
  #dashboard-view .recent-job-meta{
    grid-column:1;
    grid-row:3;
    align-self:baseline;
    margin-top:4px;
  }
  #dashboard-view .recent-net>span{
    grid-column:2;
    grid-row:2;
    align-self:baseline;
    justify-self:end;
    margin-top:8px;
    font-size:0;
  }
  #dashboard-view .recent-net>span::after{
    color:#7b879a;
    content:'เงินสุทธิ';
    font-size:11px;
    font-weight:750;
    line-height:1.2;
  }
  #dashboard-view .recent-net>strong{
    grid-column:2;
    grid-row:3;
    align-self:baseline;
    justify-self:end;
    margin-top:4px;
    color:#155eef!important;
    font-size:20px;
    font-weight:900;
    line-height:1.5;
  }
  #dashboard-view .recent-footer{
    display:flex;
    grid-column:1/-1;
    grid-row:4;
    min-width:0;
    min-height:47px;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    margin-top:12px;
    padding-top:15px;
    border-top:1px solid #e5ebf3;
  }
  #dashboard-view .recent-certificate-status.good{
    background:#e3f6ea;
    color:#127247;
  }
}

/* Transaction details: payment-tracking layout (Design C). */
#transaction-preview-dialog{
  width:min(880px,calc(100vw - 32px));
  max-height:calc(100dvh - 32px);
  overflow:hidden;
  border-radius:20px;
  background:#fff;
}
#transaction-preview-dialog .preview-dialog{
  display:flex;
  max-height:calc(100dvh - 32px);
  min-height:0;
  flex-direction:column;
  padding:0;
  background:#fff;
}
#transaction-preview-dialog .dialog-heading{
  flex:none;
  align-items:center;
  padding:23px 28px 18px;
  border-bottom:1px solid #e5ebf3;
  background:#fff;
}
#transaction-preview-dialog .dialog-heading h2{
  max-width:720px;
  overflow:hidden;
  color:#101a31;
  font-size:27px;
  line-height:1.35;
  text-overflow:ellipsis;
  white-space:nowrap;
}
#transaction-preview-dialog .dialog-heading .eyebrow{color:#155eef;font-size:13px}
#transaction-preview-content{
  min-height:0;
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
  padding:20px 28px 26px;
}
#transaction-preview-dialog .dialog-actions{
  position:relative;
  z-index:2;
  flex:none;
  margin:0;
  padding:15px 28px 19px;
  border-top:1px solid #e5ebf3;
  background:rgba(255,255,255,.97);
  box-shadow:0 -9px 24px rgba(30,58,110,.055);
  backdrop-filter:blur(12px);
}
#transaction-preview-dialog .dialog-actions button{min-height:44px;padding-inline:18px}
#transaction-preview-dialog #preview-edit{background:#155eef;box-shadow:0 8px 20px rgba(21,94,239,.18)}
@media(max-width:780px){
  html.preview-dialog-open,
  body.preview-dialog-open{
    overflow:hidden!important;
    overscroll-behavior:none!important;
  }
  body.preview-dialog-open{
    position:fixed!important;
    top:var(--preview-page-offset,0)!important;
    right:0;
    left:0;
    width:100%;
  }
  #transaction-preview-dialog::backdrop{touch-action:none}
}
.preview-c-identity{
  display:flex;
  min-width:0;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-bottom:18px;
}
.preview-c-identity>strong{
  min-width:0;
  overflow:hidden;
  color:#26354e;
  font-size:16px;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.preview-c-identity>div{
  display:flex;
  flex:none;
  align-items:center;
  justify-content:flex-end;
  gap:7px;
  color:#66758e;
  font-size:12px;
  font-weight:750;
}
.preview-c-identity>div>time,.preview-c-identity>div>span:not(.preview-c-channel){white-space:nowrap}
.preview-c-identity>div>span:not(.preview-c-channel)::before{margin-right:7px;color:#b1bbca;content:'·'}
.preview-c-channel{
  display:inline-flex;
  max-width:210px;
  min-height:26px;
  align-items:center;
  gap:5px;
  overflow:hidden;
  padding:4px 9px;
  border:1px solid #d9e5dc;
  border-radius:999px;
  background:#f1f5f2;
  color:#49665a;
  font-size:11px;
  font-weight:850;
  line-height:1.2;
  white-space:nowrap;
}
.preview-c-channel:has(.channel-fastwork){border-color:#cbd8fb;background:#eaf0ff;color:#3156bc}
.preview-c-channel:has(.channel-line){border-color:#baeacb;background:#e8f9ee;color:#087b34}
.preview-c-channel:has(.channel-facebook){border-color:#d9c9fa;background:#f2edff;color:#7041b4}
.preview-c-channel:has(.channel-instagram){border-color:#f2c4da;background:#fff0f6;color:#ae256a}
.preview-c-channel:has(.channel-tiktok){border-color:#17191d;background:#17191d;color:#fff}
.preview-c-channel:has(.channel-direct){border-color:#d6dcda;background:#eff1f0;color:#343a37}
.preview-c-channel>.channel-chip{
  display:inline!important;
  width:auto;
  min-height:0;
  padding:0;
  border:0!important;
  border-radius:0;
  background:transparent!important;
  color:inherit!important;
  font:inherit;
}
.preview-c-channel>.channel-order{
  display:inline!important;
  max-width:92px;
  margin:0!important;
  overflow:hidden;
  color:inherit;
  font:inherit;
  opacity:.78;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.preview-c-hero{
  position:relative;
  display:grid;
  min-height:176px;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:24px;
  overflow:hidden;
  padding:24px 28px;
  border:1px solid #d7e4ff;
  border-radius:18px;
  background:linear-gradient(135deg,#f2f7ff 0%,#e9f1ff 100%);
}
.preview-c-hero::before{
  position:absolute;
  top:-70px;
  right:55px;
  width:260px;
  height:260px;
  border-radius:50%;
  background:rgba(255,255,255,.42);
  content:'';
}
.preview-c-hero>div,.preview-c-hero-icon{position:relative;z-index:1}
.preview-c-hero>div>span{
  display:block;
  margin-bottom:4px;
  color:#405575;
  font-size:14px;
  font-weight:800;
}
.preview-c-hero>div>strong{
  display:block;
  color:#1649c4;
  font-size:42px;
  font-weight:950;
  letter-spacing:-1.2px;
  line-height:1.15;
  white-space:nowrap;
}
.preview-c-breakdown{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:5px 9px;
  margin-top:13px;
  color:#65748c;
  font-size:12px;
  font-weight:700;
}
.preview-c-breakdown>span{display:inline-flex;align-items:baseline;gap:4px;white-space:nowrap}
.preview-c-breakdown>span+span::before{margin-right:5px;color:#96a4b8;content:'−'}
.preview-c-breakdown b{color:#4e5f78;font-weight:850}
.preview-c-hero-icon{
  display:grid;
  width:78px;
  height:78px;
  place-items:center;
  border:1px solid rgba(87,132,223,.16);
  border-radius:25px;
  background:rgba(255,255,255,.57);
  color:#6590ee;
  font-size:31px;
  font-weight:950;
  box-shadow:0 12px 28px rgba(64,107,191,.1);
}
.preview-c-progress-section{padding:25px 5px 23px;border-bottom:1px solid #dfe7f2}
.preview-c-progress-section>header,.preview-c-timeline-section>header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}
.preview-c-progress-section h3,.preview-c-timeline-section h3,.preview-c-extras h3{
  margin:0;
  color:#14213a;
  font-size:20px;
  font-weight:900;
  line-height:1.35;
}
.preview-c-progress-section .payment-status-badge{min-height:30px;margin:0;padding:6px 11px;font-size:11px}
.preview-c-progress{
  position:relative;
  height:15px;
  margin-top:17px;
  overflow:hidden;
  border-radius:999px;
  background:#dce8fb;
}
.preview-c-progress>span{
  position:relative;
  display:block;
  height:100%;
  min-width:0;
  border-radius:inherit;
  background:linear-gradient(90deg,#316cf3,#155eef);
  transition:width .25s ease;
}
.preview-c-progress>span>b{
  position:absolute;
  top:50%;
  right:7px;
  color:#fff;
  font-size:9px;
  font-weight:900;
  line-height:1;
  transform:translateY(-50%);
}
.preview-c-progress-values{display:flex;align-items:start;justify-content:space-between;gap:18px;margin-top:11px}
.preview-c-progress-values>span{display:grid;gap:2px}
.preview-c-progress-values>span:last-child{justify-items:end;text-align:right}
.preview-c-progress-values small{color:#78859a;font-size:11px;font-weight:750}
.preview-c-progress-values strong{color:#0c8a4b;font-size:18px;font-weight:900;white-space:nowrap}
.preview-c-progress-values>span:last-child strong{color:#17233a}
.preview-c-timeline-section{padding:23px 5px 3px}
.preview-c-timeline-section>header>span{
  flex:none;
  padding:4px 8px;
  border-radius:999px;
  background:#edf3ff;
  color:#3156bc;
  font-size:10px;
  font-weight:850;
  white-space:nowrap;
}
.preview-c-timeline{position:relative;display:grid;gap:13px;margin-top:16px;padding-left:39px}
.preview-c-timeline::before{
  position:absolute;
  top:25px;
  bottom:25px;
  left:14px;
  width:2px;
  border-radius:99px;
  background:linear-gradient(#72d7a1,#f0c764);
  content:'';
}
.preview-c-timeline:not(:has(.preview-c-installment + .preview-c-installment))::before{display:none}
.preview-c-installment{
  position:relative;
  padding:17px 19px;
  border:1px solid #cdebd9;
  border-radius:15px;
  background:linear-gradient(135deg,#f0fbf5,#f8fcfa);
}
.preview-c-installment.is-pending{border-color:#f0deae;background:linear-gradient(135deg,#fffaf0,#fffdf7)}
.preview-c-timeline-dot{
  position:absolute;
  top:18px;
  left:-39px;
  display:grid;
  width:29px;
  height:29px;
  place-items:center;
  border:3px solid #1db26a;
  border-radius:50%;
  background:#1db26a;
  color:#fff;
  font-size:13px;
  font-weight:950;
  box-shadow:0 0 0 4px #fff;
}
.preview-c-installment.is-pending .preview-c-timeline-dot{border-color:#efb43e;background:#fff8e8;color:transparent}
.preview-c-installment>header{display:flex;align-items:start;justify-content:space-between;gap:12px}
.preview-c-installment>header>div{display:grid;gap:2px}
.preview-c-installment>header strong{color:#17315f;font-size:14px;font-weight:900}
.preview-c-installment>header time,.preview-c-installment>header small{color:#71809a;font-size:10px;font-weight:700}
.preview-c-installment-status{
  display:inline-flex;
  min-height:27px;
  flex:none;
  align-items:center;
  padding:5px 9px;
  border-radius:999px;
  background:#dff5e8;
  color:#087443;
  font-size:10px;
  font-weight:900;
  line-height:1.2;
  white-space:nowrap;
}
.is-pending .preview-c-installment-status{background:#fff0ce;color:#956000}
.preview-c-installment-figures{
  display:grid;
  grid-template-columns:1.2fr 1fr 1fr;
  gap:0;
  margin-top:14px;
  padding-top:14px;
  border-top:1px solid rgba(85,130,105,.15);
}
.preview-c-installment-figures>span{display:grid;min-width:0;gap:3px;padding:0 16px;border-left:1px solid rgba(85,130,105,.16)}
.preview-c-installment-figures>span:first-child{padding-left:0;border-left:0}
.preview-c-installment-figures>span:last-child{padding-right:0}
.preview-c-installment-figures small,.preview-c-pending-amount small{color:#71809a;font-size:10px;font-weight:750}
.preview-c-installment-figures strong,.preview-c-pending-amount strong{color:#15213a;font-size:15px;font-weight:900;white-space:nowrap}
.preview-c-installment>footer{display:flex;align-items:center;flex-wrap:wrap;gap:5px;margin-top:12px}
.preview-c-installment>footer>span{
  max-width:100%;
  overflow-wrap:anywhere;
  padding:3px 7px;
  border-radius:999px;
  background:rgba(255,255,255,.8);
  color:#687991;
  font-size:9px;
  font-weight:750;
}
.preview-c-pending-amount{display:grid;gap:3px;margin-top:13px;padding-top:13px;border-top:1px solid rgba(151,117,46,.14)}
.preview-c-pending-amount strong{font-size:20px}
.preview-c-no-payments{padding:18px;border:1px dashed #d6dfed;border-radius:13px;color:#71809a;text-align:center}
.preview-c-extras{margin:22px 5px 0;padding-top:20px;border-top:1px solid #dfe7f2}
.preview-c-extras>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.preview-c-extras>div>div{display:grid;min-width:0;gap:6px;padding:16px 18px;border:1px solid #c9d9fa;border-radius:12px;background:#eef4ff}
.preview-c-extras span{color:#315eb8;font-size:14px;font-weight:800}
.preview-c-extras strong{overflow-wrap:anywhere;color:#293850;font-size:17px;line-height:1.5;white-space:pre-wrap}
.preview-c-extra-notes{grid-column:1/-1}

@media(max-width:700px){
  #transaction-preview-dialog{
    width:calc(100vw - 12px);
    max-height:calc(100dvh - 28px);
    border-radius:22px;
  }
  #transaction-preview-dialog .preview-dialog{
    height:calc(100dvh - 28px);
    max-height:calc(100dvh - 28px);
  }
  #transaction-preview-dialog .dialog-heading{padding:17px 18px 13px}
  #transaction-preview-dialog .dialog-heading h2{max-width:calc(100vw - 105px);font-size:24px}
  #transaction-preview-dialog .dialog-heading .eyebrow{font-size:12px}
  #transaction-preview-content{padding:15px 16px 22px}
  #transaction-preview-dialog .dialog-actions{
    gap:9px;
    padding:11px 16px max(16px,calc(env(safe-area-inset-bottom) + 8px));
  }
  #transaction-preview-dialog .dialog-actions button{min-height:48px}
  #transaction-preview-dialog .dialog-actions .secondary{flex:1}
  #transaction-preview-dialog #preview-edit{flex:1.65}
  .preview-c-identity{display:grid;gap:8px;margin-bottom:14px}
  .preview-c-identity>strong{font-size:15px}
  .preview-c-identity>div{min-width:0;justify-content:flex-start;flex-wrap:wrap;gap:6px;font-size:11px}
  .preview-c-channel{max-width:180px;min-height:25px;padding:4px 8px;font-size:10px}
  .preview-c-hero{min-height:0;grid-template-columns:1fr;padding:18px;border-radius:16px}
  .preview-c-hero::before{top:-95px;right:-70px}
  .preview-c-hero>div>span{font-size:13px}
  .preview-c-hero>div>strong{font-size:35px;letter-spacing:-.8px}
  .preview-c-hero-icon{display:none}
  .preview-c-breakdown{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 10px;margin-top:12px}
  .preview-c-breakdown>span{display:grid;gap:2px;padding:8px 9px;border-radius:9px;background:rgba(255,255,255,.58)}
  .preview-c-breakdown>span+span::before{display:none}
  .preview-c-progress-section{padding:21px 2px 20px}
  .preview-c-progress-section h3,.preview-c-timeline-section h3,.preview-c-extras h3{font-size:18px}
  .preview-c-progress-section>header{align-items:center}
  .preview-c-progress-section .payment-status-badge{min-height:28px;padding:5px 9px;font-size:10px}
  .preview-c-progress{height:14px;margin-top:15px}
  .preview-c-progress-values strong{font-size:17px}
  .preview-c-timeline-section{padding:20px 2px 2px}
  .preview-c-timeline{gap:11px;margin-top:14px;padding-left:34px}
  .preview-c-timeline::before{left:12px}
  .preview-c-installment{padding:15px 14px;border-radius:14px}
  .preview-c-timeline-dot{top:16px;left:-34px;width:25px;height:25px;border-width:3px;font-size:11px}
  .preview-c-installment>header strong{font-size:13px}
  .preview-c-installment-status{min-height:25px;padding:4px 8px;font-size:9px}
  .preview-c-installment-figures{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px 0;margin-top:12px;padding-top:12px}
  .preview-c-installment-figures>span{padding:0 11px}
  .preview-c-installment-figures>.preview-c-installment-primary{grid-column:1/-1;padding:0 0 11px;border:0;border-bottom:1px solid rgba(85,130,105,.14)}
  .preview-c-installment-figures>.preview-c-installment-primary+span{padding-left:0;border-left:0}
  .preview-c-installment-figures small,.preview-c-pending-amount small{font-size:9px}
  .preview-c-installment-figures strong{font-size:14px}
  .preview-c-pending-amount strong{font-size:18px}
  .preview-c-extras{margin-inline:2px}
  .preview-c-extras>div{grid-template-columns:1fr}
  .preview-c-extra-notes{grid-column:auto}
}

@media(max-width:380px){
  #transaction-preview-dialog .dialog-heading{padding-inline:15px}
  #transaction-preview-content{padding-inline:13px}
  #transaction-preview-dialog .dialog-actions{padding-inline:13px}
  .preview-c-progress-section>header{align-items:flex-start;flex-direction:column;gap:8px}
  .preview-c-hero>div>strong{font-size:31px}
}

/* Transaction details: sectioned summary layout (Design A). */
.preview-a-identity{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  min-width:0;
  align-items:center;
  gap:13px 22px;
  margin-bottom:18px;
  padding:15px 17px;
  border:1px solid #e0e7f2;
  border-radius:13px;
  background:#f8faff;
}
.preview-a-identity-copy{
  display:grid;
  min-width:0;
  align-content:center;
  justify-items:start;
  gap:2px;
}
.preview-a-identity-label{color:#8190a5;font-size:12px;font-weight:800;line-height:1.3}
.preview-a-identity-copy>strong{
  min-width:0;
  overflow:hidden;
  color:#26354e;
  font-size:22px;
  font-weight:850;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.preview-a-identity-facts{display:flex;grid-column:1/-1;min-width:0;align-items:center;padding-top:12px;border-top:1px solid #dbe4f1;color:#66758e;font-size:13px;font-weight:750}
.preview-a-identity-facts>span{display:flex;min-width:0;align-items:center;gap:6px;white-space:nowrap}
.preview-a-identity-facts>span+span{margin-left:18px;padding-left:18px;border-left:1px solid #dbe4f1}
.preview-a-identity-facts small{color:#8190a5;font-size:12px;font-weight:800;line-height:1.3;white-space:nowrap}
.preview-a-identity-facts time,.preview-a-identity-facts b{color:#566781;font-size:15px;font-weight:850;white-space:nowrap}
.preview-a-identity-facts time{color:#155eef}
.preview-a-client-type{display:inline-flex;min-height:30px;align-items:center;justify-content:center;padding:5px 10px;border:1px solid transparent;border-radius:999px;line-height:1.1}
.preview-a-client-type.company{border-color:#bfe7cd;background:#e5f6eb;color:#147247}
.preview-a-client-type.individual{border-color:#f0d69e;background:#fff2d8;color:#936313}
.preview-a-channel-value{display:inline-flex;min-width:0;align-items:center;gap:7px}
.preview-a-channel-value .preview-c-channel{max-width:none;min-height:30px;padding:5px 10px;font-size:13px}
.preview-a-channel-customer{display:inline-flex!important;min-width:0;align-items:center;gap:6px;color:#3156bc!important}
.preview-a-channel-customer::before{margin-right:1px;color:#a7b2c4;content:'·';font-size:14px;font-weight:800}
.preview-a-channel-customer>small{color:#7f8da3;font-size:12px;font-weight:800;white-space:nowrap}
.preview-a-channel-customer>b{display:inline-flex;min-height:30px;align-items:center;justify-content:center;padding:5px 10px;border:1px solid #cbd8fb;border-radius:999px;background:#eef3ff;color:#3156bc!important;line-height:1.1}
@media(min-width:701px){
  .preview-a-identity-facts>span{height:32px}
  .preview-a-identity-facts>span>small,
  .preview-a-identity-facts>span>time{display:inline-flex;height:32px;align-items:center;line-height:1}
  .preview-a-identity-facts>span>time{transform:translateY(-1px)}
  .preview-a-client-type,
  .preview-a-channel-value,
  .preview-a-channel-value .preview-c-channel,
  .preview-a-channel-customer>b{height:32px;min-height:32px;line-height:1}
  .preview-a-client-type,
  .preview-a-channel-value .preview-c-channel,
  .preview-a-channel-customer>b{padding-top:0;padding-bottom:0}
}
.preview-a-summary,.preview-a-payment,.preview-a-outstanding{
  border:1px solid #d9e4f4;
  border-radius:17px;
}
.preview-a-section-icon{
  position:relative;
  display:grid;
  width:46px;
  height:46px;
  flex:none;
  place-items:center;
  border-radius:15px;
  background:#dfeaff;
  color:#155eef;
  font-size:19px;
  font-weight:950;
  line-height:1;
}
.preview-a-section-icon{font-size:0!important}
.preview-a-section-icon::before{
  display:block;
  position:absolute;
  top:50%;
  left:50%;
  width:24px;
  height:24px;
  background:currentColor;
  content:'';
  transform:translate(-50%,-50%);
}
.preview-a-summary .preview-a-section-icon::before{
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cellipse cx='12' cy='6' rx='7.5' ry='3' fill='none' stroke='black' stroke-width='1.8'/%3E%3Cpath d='M4.5 6v5c0 1.7 3.4 3 7.5 3s7.5-1.3 7.5-3V6M4.5 11v5c0 1.7 3.4 3 7.5 3s7.5-1.3 7.5-3v-5' fill='none' stroke='black' stroke-width='1.8'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cellipse cx='12' cy='6' rx='7.5' ry='3' fill='none' stroke='black' stroke-width='1.8'/%3E%3Cpath d='M4.5 6v5c0 1.7 3.4 3 7.5 3s7.5-1.3 7.5-3V6M4.5 11v5c0 1.7 3.4 3 7.5 3s7.5-1.3 7.5-3v-5' fill='none' stroke='black' stroke-width='1.8'/%3E%3C/svg%3E") center/contain no-repeat;
}
.preview-a-payment .preview-a-section-icon::before{
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 7.5h15.5v11H4zM4 7.5l2.5-3h10l3 3M15 11h5v4h-5a2 2 0 0 1 0-4Z' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 7.5h15.5v11H4zM4 7.5l2.5-3h10l3 3M15 11h5v4h-5a2 2 0 0 1 0-4Z' fill='none' stroke='black' stroke-width='1.8' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
}
.preview-a-outstanding .preview-a-section-icon::before{
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='8' fill='none' stroke='black' stroke-width='1.8'/%3E%3Cpath d='M12 7.5V12l3 2' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='8' fill='none' stroke='black' stroke-width='1.8'/%3E%3Cpath d='M12 7.5V12l3 2' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;
}
.preview-a-summary{
  overflow:hidden;
  border-color:#cfe0ff;
  background:linear-gradient(135deg,#f1f6ff,#eaf2ff);
}
.preview-a-summary>header{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:13px;
  padding:22px 24px 18px;
}
.preview-a-summary>header>div:not(.preview-a-net){display:grid;gap:2px}
.preview-a-summary h3,.preview-a-payment h3,.preview-a-outstanding h3{
  margin:0;
  color:#14213a;
  font-size:21px;
  font-weight:900;
  line-height:1.35;
}
.preview-a-summary header small,.preview-a-payment header small,.preview-a-outstanding header small{
  color:#70809a;
  font-size:12px;
  font-weight:700;
  line-height:1.35;
}
.preview-a-net{display:grid;justify-items:end;gap:2px;padding-left:22px;border-left:1px solid #cbdaf5}
.preview-a-net>small{color:#657590!important;font-size:13px!important;font-weight:800!important}
.preview-a-net>strong{
  color:#1649c4;
  font-size:34px;
  font-weight:950;
  letter-spacing:-.8px;
  line-height:1.2;
  white-space:nowrap;
}
.preview-a-calculation{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(135px,1fr));
  margin:0 20px 20px;
  overflow:hidden;
  border:1px solid rgba(203,218,245,.78);
  border-radius:13px;
  background:rgba(255,255,255,.68);
}
.preview-a-calculation>span{
  position:relative;
  display:grid;
  min-width:0;
  justify-items:center;
  gap:3px;
  padding:13px 12px;
  border-left:1px solid #dce6f5;
  text-align:center;
}
.preview-a-calculation>span:first-child{border-left:0}
.preview-a-calculation>span:not(:first-child)::before{
  position:absolute;
  top:50%;
  left:-7px;
  display:grid;
  width:14px;
  height:20px;
  place-items:center;
  background:#f6f9ff;
  color:#8494ac;
  content:'−';
  font-size:12px;
  transform:translateY(-50%);
}
.preview-a-calculation small,.preview-a-payment-grid small,.preview-a-outstanding-grid small{
  color:#71809a;
  font-size:12px;
  font-weight:750;
  line-height:1.3;
}
.preview-a-calculation strong{color:#263750;font-size:17px;font-weight:900;white-space:nowrap}
.preview-a-payment,.preview-a-outstanding{margin-top:17px;padding:20px;background:#fff}
.preview-a-payment>header,.preview-a-outstanding>header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}
.preview-a-payment>header>div,.preview-a-outstanding>header>div{display:flex;min-width:0;align-items:center;gap:12px}
.preview-a-payment>header>div>span:last-child,.preview-a-outstanding>header>div>span:last-child{display:grid;min-width:0;gap:2px}
.preview-a-payment .preview-a-section-icon{background:#fff0cf;color:#a46a00}
.preview-a-payment .payment-status-badge{min-height:32px;flex:none;margin:0;padding:6px 12px;font-size:12px}
.preview-a-payment-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  margin-top:17px;
  overflow:hidden;
  border-radius:13px;
  background:#f6f9fe;
}
.preview-a-payment-grid>span{
  display:grid;
  min-width:0;
  align-content:center;
  justify-items:center;
  gap:4px;
  padding:15px 17px;
  border-left:1px solid #dfe7f3;
  text-align:center;
}
.preview-a-payment-grid>span:first-child{border-left:0}
.preview-a-payment-grid strong{color:#17233a;font-size:18px;font-weight:900;white-space:nowrap}
.preview-a-payment-grid>span:nth-child(2) strong{color:#087443}
.preview-a-payment-grid.has-platform-fees{grid-template-columns:repeat(4,minmax(0,1fr))}
.preview-a-payment-grid>span:nth-child(2) strong{color:#17233a}
.preview-a-payment-grid>.preview-a-payment-actual{background:#edf9f2}
.preview-a-payment-grid>.preview-a-payment-actual strong{color:#087443}
.preview-a-outstanding{border-color:#efd79a;background:linear-gradient(135deg,#fffdf7,#fff8df)}
.preview-a-outstanding .preview-a-section-icon{background:#ffefc3;color:#a66a00}
.preview-a-outstanding h3{color:#865707}
.preview-a-outstanding header small{color:#98712d}
.preview-a-outstanding-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(220px,.9fr);
  align-items:center;
  gap:22px;
  margin-top:17px;
  padding:15px 17px;
  border-radius:13px;
  background:#fff0c7;
}
.preview-a-outstanding-grid>span{display:grid;gap:3px}
.preview-a-outstanding-grid>span>strong{color:#a86600;font-size:30px;font-weight:950;line-height:1.2;white-space:nowrap}
.preview-a-outstanding-grid>div{display:grid;gap:8px}
.preview-a-outstanding-grid>div>span{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.preview-a-outstanding-grid>div>span>strong{color:#96620a;font-size:15px;font-weight:900}
.preview-a-progress{height:9px;overflow:hidden;border-radius:999px;background:#ead7aa}
.preview-a-progress>span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#f0b63e,#d9930d)}
.preview-a-outstanding.is-settled{border-color:#bfe5ce;background:linear-gradient(135deg,#f8fffa,#edfaf2)}
.preview-a-outstanding.is-settled .preview-a-section-icon{background:#dff5e7;color:#168451}
.preview-a-outstanding.is-settled .preview-a-section-icon::before{
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='8' fill='none' stroke='black' stroke-width='1.8'/%3E%3Cpath d='m8.3 12.1 2.4 2.4 5-5' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='8' fill='none' stroke='black' stroke-width='1.8'/%3E%3Cpath d='m8.3 12.1 2.4 2.4 5-5' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;
}
.preview-a-outstanding.is-settled h3{color:#126b45}
.preview-a-outstanding.is-settled header small{color:#58806d}
.preview-a-settled-percent{margin-left:auto;color:#168451;font-size:22px;font-weight:950;line-height:1;white-space:nowrap}

@media(max-width:700px){
  #transaction-preview-dialog .dialog-heading h2{
    display:-webkit-box;
    overflow:hidden;
    white-space:normal;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
  }
  .preview-a-identity{grid-template-columns:1fr;gap:12px;margin-bottom:14px;padding:13px 14px}
  .preview-a-identity-copy{align-items:start;gap:2px}
  .preview-a-identity-label{font-size:11px}
  .preview-a-identity-copy>strong{font-size:19px}
  .preview-a-identity-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 12px;padding-top:11px}
  .preview-a-identity-facts>span{display:grid;gap:2px;white-space:normal}
  .preview-a-identity-facts>span+span{margin-left:0;padding-left:12px}
  .preview-a-identity-facts>.preview-a-channel-fact{
    display:grid;
    width:100%;
    grid-column:1/-1;
    grid-template-columns:minmax(105px,.85fr) minmax(0,1.15fr);
    align-items:center;
    gap:9px 12px;
    margin-top:2px;
    padding:10px 11px;
    border-left:0;
    border-radius:8px;
    background:#f0f4fb;
  }
  .preview-a-identity-facts>.preview-a-channel-fact:not(:has(.channel-fastwork)){
    grid-template-columns:auto auto;
    justify-content:center;
    column-gap:12px;
  }
  .preview-a-identity-facts>.preview-a-channel-fact:has(.channel-fastwork){
    grid-template-columns:minmax(0,1fr);
    justify-items:center;
    gap:4px;
    text-align:center;
  }
  .preview-a-identity-facts>.preview-a-channel-fact:has(.channel-fastwork)>small{
    justify-self:center;
    text-align:center;
  }
  .preview-a-identity-facts>.preview-a-channel-fact>small,
  .preview-a-identity-facts>.preview-a-channel-fact .preview-a-channel-customer>small{font-size:12px}
  .preview-a-identity-facts>.preview-a-channel-fact>.preview-a-channel-value{display:contents}
  .preview-a-identity-facts>.preview-a-channel-fact .preview-c-channel{
    width:max-content;
    max-width:100%;
    min-width:0;
    min-height:30px;
    justify-self:start;
    padding:5px 10px;
  }
  .preview-a-identity-facts>.preview-a-channel-fact:has(.channel-fastwork) .preview-c-channel{
    justify-content:center;
    justify-self:center;
    flex-wrap:wrap;
    white-space:normal;
  }
  .preview-a-identity-facts>.preview-a-channel-fact:has(.channel-fastwork) .preview-c-channel>.channel-order{
    max-width:none;
    overflow:visible;
    text-overflow:clip;
    white-space:normal;
    overflow-wrap:anywhere;
  }
  .preview-a-identity-facts>.preview-a-channel-fact .preview-a-channel-customer{
    display:grid!important;
    grid-column:1/-1;
    grid-template-columns:minmax(0,1fr);
    justify-items:center;
    align-items:center;
    gap:4px;
    padding-top:14px;
  }
  .preview-a-identity-facts>.preview-a-channel-fact .preview-a-channel-customer>small{
    justify-self:center;
    text-align:center;
  }
  .preview-a-identity-facts>.preview-a-channel-fact .preview-a-channel-customer::before{display:none}
  .preview-a-identity-facts>.preview-a-channel-fact .preview-a-channel-customer>b{
    display:inline-flex;
    width:max-content;
    max-width:100%;
    min-height:30px;
    align-items:center;
    justify-content:center;
    justify-self:center;
    padding:5px 10px;
    border:1px solid #cbd8fb;
    border-radius:999px;
    background:#eef3ff;
    line-height:1.35;
    text-align:left;
    white-space:normal;
    overflow-wrap:anywhere;
  }
  .preview-a-identity-facts small{font-size:11px}
  .preview-a-identity-facts time,.preview-a-identity-facts b{font-size:14px}
  .preview-a-channel-value .preview-c-channel{font-size:12px}
  .preview-a-summary,.preview-a-payment,.preview-a-outstanding{border-radius:15px}
  .preview-a-summary>header{
    grid-template-columns:auto minmax(0,1fr);
    gap:11px;
    padding:17px 17px 14px;
  }
  .preview-a-section-icon{width:42px;height:42px;border-radius:13px;font-size:0!important}
  .preview-a-summary h3,.preview-a-payment h3,.preview-a-outstanding h3{font-size:19px}
  .preview-a-net{
    grid-column:1/-1;
    justify-items:start;
    margin-top:3px;
    padding:13px 0 0;
    border-top:1px solid #cfddf5;
    border-left:0;
  }
  .preview-a-net>strong{max-width:100%;font-size:clamp(27px,8vw,32px);white-space:normal;overflow-wrap:anywhere}
  .preview-a-calculation{grid-template-columns:repeat(2,minmax(0,1fr));margin:0 14px 14px;border:0;background:transparent;gap:7px}
  .preview-a-calculation>span{
    justify-items:start;
    padding:10px 11px;
    border:0;
    border-radius:10px;
    background:rgba(255,255,255,.65);
    text-align:left;
  }
  .preview-a-calculation>span:not(:first-child)::before{display:none}
  .preview-a-calculation strong{font-size:16px}
  .preview-a-payment,.preview-a-outstanding{margin-top:14px;padding:16px 15px}
  .preview-a-payment>header,.preview-a-outstanding>header{align-items:flex-start}
  .preview-a-payment>header>div,.preview-a-outstanding>header>div{gap:10px}
  .preview-a-payment .payment-status-badge{min-height:29px;padding:5px 10px;font-size:11px}
  .preview-a-payment-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;margin-top:14px;background:transparent}
  .preview-a-payment-grid>span{
    padding:11px;
    border:0;
    border-radius:10px;
    background:#f6f9fe;
  }
  .preview-a-payment-grid>span:first-child{grid-column:1/-1}
  .preview-a-payment-grid.has-platform-fees{grid-template-columns:repeat(2,minmax(0,1fr))}
  .preview-a-payment-grid.has-platform-fees>.preview-a-payment-actual{grid-column:1/-1}
  .preview-a-payment-grid strong{font-size:16px}
  .preview-a-outstanding-grid{grid-template-columns:1fr;gap:13px;margin-top:14px;padding:13px}
  .preview-a-outstanding-grid>span>strong{max-width:100%;font-size:clamp(21px,6.5vw,24px);white-space:normal;overflow-wrap:anywhere}
}

@media(max-width:380px){
  .preview-a-payment>header{align-items:flex-start;flex-direction:column}
  .preview-a-net>strong{font-size:29px}
  .preview-a-identity{grid-template-columns:1fr}
  .preview-a-identity-facts{grid-template-columns:1fr}
  .preview-a-identity-facts>span+span{padding-left:0;border-left:0}
  .preview-a-identity-facts>.preview-a-channel-fact{grid-column:auto}
}

/* Keep every main page heading hierarchy consistent. */
:is(#dashboard-view,#transactions-view,#customers-view,#links-view,#tax-view)>.page-heading .eyebrow{font-size:13px;line-height:1.4}
:is(#dashboard-view,#transactions-view,#customers-view,#links-view,#tax-view)>.page-heading h1{font-size:34px;line-height:1.18;letter-spacing:-.7px;margin:4px 0 6px}
:is(#dashboard-view,#transactions-view,#customers-view,#links-view,#tax-view)>.page-heading .muted{font-size:16px;line-height:1.5}
@media(max-width:780px){
  :is(#dashboard-view,#transactions-view,#customers-view,#links-view,#tax-view)>.page-heading .eyebrow{font-size:12px}
  :is(#dashboard-view,#transactions-view,#customers-view,#links-view,#tax-view)>.page-heading h1{font-size:28px;line-height:1.2;margin:3px 0 5px}
  :is(#dashboard-view,#transactions-view,#customers-view,#links-view,#tax-view)>.page-heading .muted{font-size:14px;line-height:1.45}
}

/* Work Links manager mirrors the existing Cloudflare admin while staying in the app shell. */
.work-links-heading{align-items:flex-end}
.work-links-heading .eyebrow{display:none}
.work-links-preview-badge{display:inline-flex;align-items:center;min-height:28px;padding:5px 10px;border:1px solid #edcf94;border-radius:999px;background:#fff7df;color:#93610a;font-size:11px;font-weight:850;white-space:nowrap}
.work-links-preview-badge.is-live{border-color:#b9dec9;background:#eef9f2;color:#18764d}
.work-links-create-card{padding:21px 22px}
.work-links-auth-prompt{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;margin-bottom:18px;padding:14px 15px;border:1px solid #d9e5f9;border-radius:12px;background:#f4f8ff}
.work-links-auth-prompt[hidden]{display:none}
.work-links-auth-prompt strong{display:block;color:#17233a;font-size:13px}.work-links-auth-prompt p{margin:4px 0 0;color:#68758b;font-size:12px;line-height:1.45}
.work-links-auth-prompt>button,.work-links-auth-form button{height:40px;padding:0 15px;border:1px solid #1769e0;border-radius:9px;background:#1769e0;color:#fff;font-size:12px;font-weight:850;white-space:nowrap}
.work-links-auth-form{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr auto;align-items:end;gap:10px;padding-top:13px;border-top:1px solid #dce6f6}
.work-links-auth-form[hidden]{display:none}
.work-links-auth-form label{display:grid;gap:6px;color:#45516a;font-size:11px;font-weight:800}.work-links-auth-form input{width:100%;height:42px;border-color:#d6deeb;border-radius:9px;background:#fff}
.work-links-auth-form>div{display:flex;gap:7px}.work-links-auth-form button{height:42px}.work-links-auth-form #work-links-auth-cancel{border-color:#d6deeb;background:#fff;color:#536079}
.work-links-auth-form>p{grid-column:1/-1;min-height:16px;margin:0;color:#c83232;font-size:11px;font-weight:700}
.work-links-form{display:grid;grid-template-columns:minmax(180px,1fr) minmax(300px,2fr) auto;align-items:end;gap:10px 12px}
.work-links-form label{display:grid;gap:7px;color:#45454b;font-size:12px;font-weight:800}
.work-links-form input{width:100%;height:44px;border-color:#deded9;border-radius:10px;background:#fbfbfa;color:#17171b;font-size:14px}
.work-links-form input::placeholder{color:#a5a5a8}
.work-links-form input:focus{border-color:#8d8d92;outline:0;box-shadow:0 0 0 3px rgba(0,0,0,.05)}
.work-links-form-actions{display:flex;gap:7px}
.work-links-form-actions button{height:44px;padding:0 17px;border:1px solid #111;border-radius:10px;background:#111;color:#fff;font-size:12px;font-weight:850;white-space:nowrap}
.work-links-form-actions #work-link-cancel{border-color:#deded9;background:#f5f5f2;color:#4f4f54}
.work-links-status{grid-column:1/-1;min-height:18px;margin:0;color:#77777d;font-size:12px;font-weight:650;line-height:1.4}
.work-links-status.is-error{color:#c83232}.work-links-status.is-success{color:#18764d}
.work-links-list-card{padding:20px 22px 12px}
.work-links-searchbar{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;margin-bottom:14px;padding:10px 12px;border:1px solid #e2e2dd;border-radius:14px;background:#f6f6f3}
.work-links-search{position:relative;display:block}
.work-links-search>.work-links-search-icon{position:absolute;top:50%;left:15px;z-index:3;width:15px;height:15px;border:2px solid #717178;border-radius:50%;transform:translateY(-55%);pointer-events:none}
.work-links-search>.work-links-search-icon::after{content:'';position:absolute;right:-5px;bottom:-3px;width:6px;height:2px;border-radius:2px;background:#717178;transform:rotate(45deg)}
.work-links-search input{width:100%;height:46px;padding:0 15px 0 42px;border-color:#deded9;border-radius:10px;background:#fff;font-size:14px}
.work-links-searchbar>strong{min-width:48px;color:#77777d;font-size:12px;text-align:right}
.work-links-list{display:grid}
.work-link-row{display:grid;grid-template-columns:minmax(140px,.8fr) minmax(310px,2fr) auto;align-items:center;gap:18px;padding:19px 2px;border-top:1px solid #ecece8}
.work-link-row:first-child{border-top:0}
.work-link-name{min-width:0}
.work-link-name>strong{display:block;color:#17171b;font-size:16px;font-weight:850;line-height:1.25;overflow-wrap:anywhere}
.work-link-badge{display:inline-flex;margin-top:7px;padding:4px 8px;border:1px solid;border-radius:999px;font-size:9px;font-weight:900;letter-spacing:.65px}
.work-link-badge.is-drive{border-color:#cfe3ff;background:#eef6ff;color:#1769d2}
.work-link-badge.is-photos{border-color:#ffd0df;background:#fff0f5;color:#d92d68}
.work-link-info{display:grid;min-width:0;grid-template-columns:max-content minmax(0,1fr);grid-template-rows:auto 22px;align-items:center;gap:6px 12px}
.work-link-short-url{grid-column:1/-1;min-width:0;color:#17171b;font-size:16px;font-weight:850;overflow-wrap:anywhere}
.work-link-destination-toggle{grid-column:1;grid-row:2;width:max-content;padding:0;border:0;background:transparent;color:#8a8a90;font-size:11px;font-weight:650}
.work-link-destination-toggle::after{content:'⌄';margin-left:4px}.work-link-destination-toggle[aria-expanded="true"]::after{content:'⌃'}
.work-link-destination{grid-column:2;grid-row:2;min-width:0;padding-left:10px;border-left:1px solid #deded9;color:#77777d!important;font-size:11px!important;font-weight:600!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.work-link-actions{display:grid;grid-template-columns:86px 58px 70px;gap:7px}
.work-link-actions button{height:40px;padding:0 12px;border:1px solid #e2e2de;border-radius:10px;background:#f6f6f3;color:#333338;font-size:12px;font-weight:800}
.work-link-actions button:hover{background:#eeeeea}.work-link-actions button.is-delete{border-color:#f2d5d2;background:#fff3f1;color:#c83232}
.work-link-actions button.is-copied{border-color:#9dd5b6;background:#e9f8ef;color:#137a49}
.work-links-empty{padding:32px 12px;color:#8a8a90;text-align:center}
@media(max-width:900px){
  .work-links-form{grid-template-columns:minmax(160px,.8fr) minmax(260px,1.4fr)}
  .work-links-form-actions{grid-column:1/-1}.work-links-form-actions button{flex:1}
  .work-link-row{grid-template-columns:minmax(120px,.7fr) minmax(240px,1.5fr)}
  .work-link-actions{grid-column:1/-1;grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:780px){
  .work-links-heading{align-items:flex-start;flex-direction:column;gap:12px}
  .work-links-preview-badge{min-height:25px;padding:4px 9px;font-size:10px}
  .work-links-create-card{padding:17px 15px}.work-links-list-card{padding:14px 14px 8px}
  .work-links-auth-prompt{grid-template-columns:1fr}.work-links-auth-prompt>button{width:100%}.work-links-auth-form{grid-template-columns:1fr}.work-links-auth-form>div{display:grid;grid-template-columns:1fr 1fr}
  .work-links-form{grid-template-columns:1fr;gap:12px}
  .work-links-form-actions{grid-column:auto}
  .work-links-form-actions button{flex:1}
  .work-links-status{grid-column:auto}
  .work-links-searchbar{grid-template-columns:1fr;gap:9px;padding:10px 10px 12px;margin-bottom:11px;border-radius:13px}
  .work-links-search input{height:46px;padding-left:42px;font-size:14px;line-height:1.3}
  .work-links-searchbar>strong{min-width:0;padding-left:5px;font-size:11px;line-height:1.2;text-align:left}
  .work-link-row{grid-template-columns:1fr;gap:13px;padding:20px 2px}
  .work-link-name{display:flex;align-items:center;flex-wrap:wrap;gap:9px}
  .work-link-name>strong{font-size:17px;line-height:1.3}.work-link-badge{margin-top:0;padding:4px 9px;font-size:9px;line-height:1.1}
  .work-link-info{grid-template-columns:1fr;grid-template-rows:auto auto auto;gap:8px}
  .work-link-short-url{grid-column:1;grid-row:1;font-size:15px;line-height:1.4}
  .work-link-destination-toggle{grid-column:1;grid-row:2;font-size:12px;line-height:1.4}
  .work-link-destination{grid-column:1;grid-row:3;padding:7px 0 0;border-top:1px solid #ecece8;border-left:0;white-space:normal;overflow-wrap:anywhere}
  .work-link-actions{grid-column:auto;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 10px;margin-top:2px}
  .work-link-actions button{width:100%;height:46px;padding:0 10px;font-size:13px;line-height:1.2}
  .work-link-actions button[data-work-link-copy]{grid-column:1/-1}
}

/* Canonical Work Links styling adapted directly from work.jamesnap.com/admin. */
#links-view{max-width:980px;margin-right:auto;margin-left:auto;color:#111;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",sans-serif;--work-line:#e9e9e6;--work-muted:#8a8a90}
#links-view>.work-links-heading{align-items:flex-end;margin-bottom:26px}
#links-view>.work-links-heading h1{margin:0;font-size:36px;font-weight:780;line-height:1.15;letter-spacing:-.045em}
#links-view>.work-links-heading .muted{margin:8px 0 0;color:var(--work-muted);font-size:14px;line-height:1.45}
#links-view .work-links-create-card,#links-view .work-links-list-card{padding:22px;border:1px solid #dbe5f5;border-radius:18px;background:#fff;box-shadow:none}
#links-view .work-links-create-card{margin-bottom:16px}
#links-view .work-links-list-card{margin-bottom:16px}
#links-view .work-links-form{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px 14px;align-items:start}
#links-view .work-links-form label,#links-view .work-link-field-heading{display:block;margin:0;color:#55555b;font-size:12px;font-weight:700;line-height:1.3}
#links-view .work-link-form-field{display:block;min-width:0}
#links-view .work-link-field-heading{display:flex;align-items:center;justify-content:space-between;min-height:28px;gap:10px}
#links-view .work-link-field-heading label{font:inherit;color:inherit}
#links-view .work-link-field-heading #work-link-generate{min-width:102px;height:28px;padding:0 11px;border:1px solid #c9d9f5;border-radius:8px;background:#edf4ff;color:#155eef;font-family:inherit;font-size:11px;font-weight:750;line-height:1;box-shadow:none;transition:background-color .18s ease,border-color .18s ease,transform .18s ease}
#links-view .work-link-field-heading #work-link-generate:disabled{cursor:default;opacity:.55}
#links-view .work-link-destination-row{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:12px}
#links-view .work-link-destination-field{min-width:0}
#links-view .work-links-form input{display:block;width:100%;height:46px;margin-top:8px;padding:0 14px;border:1px solid #d5e0f2;border-radius:12px;background:#fafafa;color:#111;font-size:15px;font-weight:400;outline:0;box-shadow:none}
#links-view .work-links-form input::placeholder{color:#aaa;font-weight:400;opacity:1}
#links-view .work-links-form input:focus{border-color:#8cace8;background:#fff;box-shadow:0 0 0 3px rgba(21,94,239,.09)}
#links-view .work-link-suggestions{display:flex;flex-wrap:wrap;gap:7px;margin-top:9px}
#links-view .work-link-suggestions[hidden]{display:none}
#links-view .work-link-suggestions button{display:inline-grid;grid-template-columns:minmax(0,1fr);align-items:center;min-width:0;height:36px;padding:0 12px;border:1px solid #d5e0f2;border-radius:9px;background:#f7f9fd;color:#536078;font-family:inherit;font-size:12.5px;font-weight:700;line-height:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;-webkit-tap-highlight-color:transparent}
#links-view .work-link-suggestions button.is-active{border-color:#8cace8;background:#eaf1ff;color:#155eef;box-shadow:inset 0 0 0 1px rgba(21,94,239,.08)}
#links-view .work-link-suggestion-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#links-view .work-links-form-actions{display:flex;justify-content:flex-end;gap:8px}
#links-view .work-links-form-actions button{height:46px;padding:0 15px;border:0;border-radius:11px;background:#155eef;color:#fff;font-size:13px;font-weight:700;line-height:1;box-shadow:none;transition:background-color .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease,transform .18s ease}
#links-view .work-links-form-actions #work-link-save{min-width:148px}
#links-view .work-links-form-actions #work-link-cancel{border:1px solid #d5e0f2;background:#f5f7fb;color:#222}
#links-view .work-links-status{grid-column:1/-1;min-height:0;margin:0;color:var(--work-muted);font-size:13px;font-weight:400;line-height:1.4}
#links-view .work-links-status:empty{display:none}
#links-view .work-links-status:not(:empty){display:block;margin-top:4px;padding-top:14px;border-top:1px solid var(--work-line)}
#links-view .work-links-status.is-success{color:#087a4b}#links-view .work-links-status.is-error{color:#b42318}
#links-view .work-links-searchbar{display:flex;grid-template-columns:none;align-items:center;gap:12px;margin:0 0 14px;padding:10px 12px;border:1px solid #d8e3f4;border-radius:14px;background:#f5f7fb}
#links-view .work-links-search{position:relative;display:block;flex:1;min-width:0}
#links-view .work-links-search>.work-links-search-icon{position:absolute;top:50%;left:14px;z-index:3;width:24px;height:24px;border:0;border-radius:0;color:#55555b;transform:translateY(-50%);pointer-events:none}
#links-view .work-links-search>.work-links-search-icon::after{content:none}
#links-view .work-links-search input{width:100%;height:48px;padding:0 42px 0 48px;border:1px solid #cfdcf4;border-radius:12px;background:#fff;color:#111;font-size:15px;outline:0}
#links-view .work-links-search input::-webkit-search-decoration{-webkit-appearance:none;appearance:none}
#links-view .work-links-search input:focus{border-color:#8cace8;box-shadow:0 0 0 3px rgba(21,94,239,.09)}
#links-view .work-links-list-tools{display:flex;align-items:center;gap:9px;white-space:nowrap}
#links-view .work-links-list-tools>strong{min-width:0;padding-right:1px;color:#77777d;font-size:12px;font-weight:700;line-height:1.2;text-align:left;white-space:nowrap}
#links-view .work-links-sort{display:flex;padding:2px;border:1px solid #cfdcf4;border-radius:9px;background:#fff}
#links-view .work-links-sort button{min-width:46px;height:30px;padding:0 10px;border:0;border-radius:7px;background:transparent;color:#71809b;font-family:inherit;font-size:11px;font-weight:700;line-height:1;box-shadow:none}
#links-view .work-links-sort button.is-active{background:#eaf1ff;color:#155eef}
@media(hover:hover) and (pointer:fine){#links-view .work-links-sort button:not(.is-active):hover{background:#f2f6fd;color:#344054}}
#links-view .work-links-list{display:grid}
#links-view .work-link-row{display:grid;grid-template-columns:minmax(150px,.8fr) minmax(0,2fr) auto;align-items:center;gap:18px;padding:18px 2px;border-top:1px solid var(--work-line)}
#links-view .work-link-row:first-child{border-top:0}
#links-view .work-link-name{display:flex;min-width:0;align-self:stretch;align-items:flex-start;flex-direction:column}
#links-view .work-link-name>strong.work-link-display-name{display:block;margin:0;padding-top:3px;color:#111;font-size:15px;font-weight:760;line-height:1.3;letter-spacing:-.015em;overflow-wrap:anywhere}
#links-view .work-link-badge{display:inline-flex;margin-top:7px;padding:5px 9px;border:1px solid #e5e5e2;border-radius:999px;font-size:10px;font-weight:800;line-height:1.1;letter-spacing:.07em;text-transform:uppercase}
#links-view .work-link-info{display:grid;grid-template-columns:max-content minmax(0,1fr);grid-template-rows:auto 24px;align-self:stretch;align-content:start;min-width:0;column-gap:12px;row-gap:7px}
#links-view .work-link-short-url{grid-column:1/-1;grid-row:1;min-width:0;color:#111;font-size:18px;font-weight:800;line-height:1.25;letter-spacing:-.025em;overflow-wrap:anywhere}
#links-view .work-link-destination-toggle{grid-column:1;grid-row:2;align-self:center;width:auto;margin:0;padding:1px 0;border:0;border-radius:0;background:transparent;color:#8a8a90;font-size:13px;font-weight:600;line-height:1.45;box-shadow:none}
#links-view .work-link-destination-toggle::after{content:'›';display:inline-block;margin-left:4px;font-size:15px;line-height:1;transform:rotate(90deg);transition:transform .15s ease}
#links-view .work-link-destination-toggle[aria-expanded="true"]::after{content:'›';transform:rotate(-90deg)}
#links-view .work-link-destination{grid-column:2;grid-row:2;align-self:center;min-width:0;height:24px;margin:0;padding:0 0 0 10px;border:0;border-left:1px solid #deded9;border-radius:0;background:transparent;color:#77777d!important;font-size:12px!important;font-weight:600!important;line-height:24px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#links-view .work-link-actions{display:flex;grid-template-columns:none;gap:7px}
#links-view .work-link-actions button{box-sizing:border-box;width:auto;height:42px;padding:0 15px;border:1px solid #e7e7e4;border-radius:11px;background:#f5f5f3;color:#222;font-size:13px;font-weight:700;line-height:1;white-space:nowrap;box-shadow:none;transition:background-color .18s ease,border-color .18s ease,color .18s ease,box-shadow .18s ease,transform .18s ease}
#links-view .work-link-actions button[data-work-link-copy]{width:96px;min-width:96px;border-color:#c9d9f5;background:#edf4ff;color:#155eef}
#links-view .work-link-actions button.is-delete{border-color:#f3dfdc;background:#fff5f4;color:#b42318}
#links-view .work-link-actions button.is-copied{padding-right:7px;padding-left:7px;border-color:#cfe7d7;background:#edf8f1;color:#167044;font-size:11px}
#links-view .work-links-empty{padding:28px 0 18px;color:#9a9aa0;font-size:14px;text-align:center}
@media(hover:hover) and (pointer:fine){#links-view .work-link-actions button:hover{border-color:#d7d7d3;background:#ececea;color:#111;box-shadow:0 6px 14px rgba(0,0,0,.08);transform:translateY(-2px)}#links-view .work-link-actions button[data-work-link-copy]:not(.is-copied):hover{border-color:#aac4f2;background:#e1ecff;color:#0d4fd6;box-shadow:0 6px 14px rgba(21,94,239,.12)}#links-view .work-link-actions button.is-delete:hover{border-color:#efc5c0;background:#ffedeb;color:#a91f15;box-shadow:0 6px 14px rgba(180,35,24,.09)}#links-view .work-link-actions button.is-copied:hover{border-color:#bddfc9;background:#e5f5eb;color:#12633c}}
@media(hover:hover) and (pointer:fine){#links-view .work-link-field-heading #work-link-generate:not(:disabled):hover{border-color:#aac4f2;background:#e1ecff;transform:translateY(-1px)}#links-view .work-links-form-actions #work-link-save:not(:disabled):hover{background:#0d4fd6;box-shadow:0 7px 16px rgba(21,94,239,.22);transform:translateY(-2px)}#links-view .work-links-form-actions #work-link-cancel:not(:disabled):hover{border-color:#efb4ad;background:#fff1ef;color:#b42318;box-shadow:0 7px 16px rgba(180,35,24,.13);transform:translateY(-2px)}#links-view .work-links-form-actions button:not(:disabled):active{box-shadow:0 2px 6px rgba(21,94,239,.12);transform:translateY(0)}}
@media(max-width:760px){
  #links-view>.work-links-heading{align-items:flex-start;margin-bottom:26px}
  #links-view>.work-links-heading h1{font-size:32px}
  #links-view .work-links-create-card,#links-view .work-links-list-card{padding:22px}
  #links-view .work-links-form{grid-template-columns:1fr;gap:11px}
  #links-view .work-link-destination-row{grid-column:auto;grid-template-columns:1fr;gap:12px}
  #links-view .work-links-form input,#links-view .work-links-search input{font-size:16px!important}
  #links-view .work-link-suggestions{display:grid;grid-template-columns:1fr;gap:5px;margin-top:9px;padding:8px;border:1px solid #e0e8f6;border-radius:12px;background:#f4f7fc}
  #links-view .work-link-suggestions[hidden]{display:none}
  #links-view .work-link-suggestions button{display:grid;grid-template-columns:minmax(0,1fr);align-items:center;width:100%;height:42px;padding:0 13px;border:1px solid transparent;border-radius:8px;background:#fff;color:#536078;font-size:13.5px;text-align:left;box-shadow:0 1px 3px rgba(44,62,92,.04)}
  #links-view .work-link-suggestions button.is-active{border-color:#9ab7ec;background:#e8f0ff;color:#155eef;box-shadow:none}
  #links-view .work-link-suggestion-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  #links-view .work-links-form-actions{grid-column:auto}
  #links-view .work-links-form-actions button{width:100%}
  #links-view .work-links-status{grid-column:auto}
  #links-view .work-links-searchbar{align-items:stretch;flex-direction:column;gap:8px;padding:10px}
  #links-view .work-links-search input{height:50px;padding-left:50px}
  #links-view .work-links-search>.work-links-search-icon{left:13px;width:26px;height:26px}
  #links-view .work-links-list-tools{justify-content:space-between;min-height:0;padding:0 4px 1px}
  #links-view .work-link-row{grid-template-columns:minmax(0,1fr);gap:12px;padding:18px 2px}
  #links-view .work-link-name{display:flex;align-items:center;flex-direction:row;flex-wrap:wrap;width:100%;column-gap:8px;row-gap:6px}
  #links-view .work-link-name>strong.work-link-display-name{flex:1 1 180px;margin:0;padding:0;font-size:16px;line-height:1.3}
  #links-view .work-link-badge{flex:0 0 auto;margin-top:0}
  #links-view .work-link-info{display:block;width:100%;text-align:left}
  #links-view .work-link-short-url{display:block;font-size:17px;line-height:1.25}
  #links-view .work-link-destination-toggle{display:inline-flex;align-items:center;margin-top:6px;font-size:12.5px;line-height:1.45}
  #links-view .work-link-destination{display:block;height:auto;margin-top:6px;padding:5px 9px;border-top:0;border-left:2px solid #e2e2dd;font-size:12px!important;line-height:1.45;white-space:normal;overflow-wrap:anywhere;word-break:break-word}
  #links-view .work-link-destination[hidden]{display:none!important}
  #links-view .work-link-actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;width:100%;margin:0}
  #links-view .work-link-actions button{width:100%;min-width:0;height:44px}
  #links-view .work-link-actions button[data-work-link-copy]{grid-column:1/-1;width:100%;min-width:0;padding-right:15px;padding-left:15px;font-size:13px}
  #links-view .work-links-list-tools>strong{order:2;padding:0;border:0;border-radius:0;background:transparent;color:#71809b;font-size:12px;font-weight:700;line-height:1.2;text-align:right}
  #links-view .work-links-sort{order:1;padding:2px;border-radius:9px}
  #links-view .work-links-sort button{min-width:50px;height:28px;padding:0 10px;border-radius:7px;font-size:11.5px}
}

/* Row structure and measurements copied from work.jamesnap.com/admin; only selectors are scoped. */
#links-view .row{display:grid;grid-template-columns:minmax(150px,.8fr) minmax(0,2fr) auto;align-items:center;gap:18px;padding:18px 2px;border-top:1px solid var(--work-line)}
#links-view .row:first-child{border-top:0}
#links-view .row>div{min-width:0}
#links-view .slug{font-weight:760;line-height:normal;letter-spacing:-.015em;overflow-wrap:anywhere}
#links-view .badge{display:inline-flex;margin-top:7px;padding:5px 9px;border:1px solid #e5e5e2;border-radius:999px;font-size:10px;font-weight:800;line-height:normal;letter-spacing:.07em;text-transform:uppercase}
#links-view .badge.drive{border-color:#cfe3ff;background:#eef6ff;color:#1769d2}
#links-view .badge.photos{border-color:#ffd0df;background:#fff0f5;color:#d92d68}
#links-view .linkinfo{min-width:0}
#links-view .linkinfo>.slug{color:#111;font-size:18px;font-weight:800;line-height:1.25;letter-spacing:-.025em;overflow-wrap:anywhere}
#links-view .destination-toggle{display:inline-flex;align-items:center;gap:4px;width:auto;max-width:100%;margin-top:7px;padding:1px 0;border:0;border-radius:0;background:transparent;color:#8a8a90;font-family:inherit;font-size:13px;font-weight:600;line-height:1.45;box-shadow:none}
#links-view .destination-toggle::after{content:'›';display:inline-block;margin:0;font-size:15px;line-height:1;transform:rotate(90deg);transition:transform .15s ease}
#links-view .destination-toggle[aria-expanded="true"]::after{content:'›';transform:rotate(-90deg)}
#links-view .destination-detail{display:block;height:auto;margin-top:6px;padding:5px 9px;border:0;border-left:2px solid #e2e2dd;border-radius:0;background:transparent;color:#77777d!important;font-size:12px!important;font-weight:600!important;line-height:1.45;white-space:normal;overflow-wrap:anywhere;word-break:break-word}
#links-view .destination-detail[hidden]{display:none!important}
#links-view .actions{display:flex;gap:7px}
#links-view .actions button{box-sizing:border-box;height:42px;padding:0 15px;border:1px solid #e7e7e4;border-radius:11px;background:#f5f5f3;color:#222;font-family:inherit;font-size:13px;font-weight:700;line-height:1;white-space:nowrap;box-shadow:none}
#links-view .actions .copy-button{width:96px;min-width:96px}
#links-view .actions .danger{border-color:#f3dfdc;background:#fff5f4;color:#b42318}
@media(min-width:761px){
  #links-view .row>div:first-child,#links-view .row>.linkinfo{align-self:stretch!important}
  #links-view .row>div:first-child>.slug{padding-top:3px}
  #links-view .row>.linkinfo{display:grid;grid-template-columns:max-content minmax(0,1fr);grid-template-rows:auto 30px;align-content:start;column-gap:12px;row-gap:7px}
  #links-view .linkinfo>.slug{grid-column:1/-1;grid-row:1}
  #links-view .linkinfo>.destination-toggle{grid-column:1;grid-row:2;align-self:center;justify-self:start;margin:0}
  #links-view .linkinfo>.destination-detail{
    grid-column:2;
    grid-row:2;
    display:flex;
    align-self:center;
    align-items:center;
    min-width:0;
    width:auto;
    height:30px;
    margin:0;
    padding:0 0 0 11px;
    border:0;
    border-left:1px solid #d9e1ee;
    border-radius:0;
    background:transparent;
    color:#858991!important;
    font-size:10.5px!important;
    font-weight:450!important;
    line-height:1.3;
    text-decoration:none;
    white-space:normal;
    overflow:visible;
    overflow-wrap:anywhere;
    word-break:break-all;
  }
  #links-view .linkinfo>.destination-detail.is-long{font-size:9.5px!important}
  #links-view .linkinfo>.destination-detail.is-very-long{font-size:8.5px!important;letter-spacing:-.01em}
  #links-view .linkinfo>.destination-detail:hover{color:#155eef!important;text-decoration:underline;text-decoration-color:#aac2f3;text-underline-offset:2px}
  #links-view .linkinfo>.destination-detail[hidden]{display:none!important}
}
@media(max-width:760px){
  #links-view .row{grid-template-columns:minmax(0,1fr);gap:12px;padding:18px 2px}
  #links-view .row>div{width:100%;min-width:0}
  #links-view .row>div:first-child{display:flex;align-items:center;flex-wrap:wrap;column-gap:8px;row-gap:6px}
  #links-view .row>div:first-child>.slug{padding:0;font-size:16px;line-height:1.25}
  #links-view .row>div:first-child>.badge{flex:0 0 auto;margin-top:0}
  #links-view .linkinfo>.slug{font-size:17px}
  #links-view .destination-toggle{margin-top:12px;font-size:12.5px}
  #links-view .destination-detail{font-size:12px!important;padding-top:4px;padding-bottom:4px}
  #links-view .actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;width:100%;margin-top:8px}
  #links-view .actions button{width:100%;min-width:0;height:44px}
  #links-view .actions .copy-button{grid-column:1/-1;width:100%;min-width:0;padding-right:15px;padding-left:15px;font-size:13px}
}

/* Work Link views and history. */
#links-view .work-link-stats{display:flex;align-items:center;justify-self:start;min-width:0;max-width:100%;margin:0;padding:5px 8px;border:0;border-radius:8px;background:transparent;color:#858991;font-family:inherit;font-size:11.5px;font-weight:520;line-height:1.35;text-align:left;box-shadow:none;cursor:pointer;transition:background-color .15s ease,color .15s ease}
#links-view .work-link-stat{display:inline-flex;align-items:center;gap:5px;min-width:0}
#links-view .work-link-stat svg{width:16px;height:16px;flex:none}
#links-view .work-link-stat-divider{width:1px;height:14px;margin:0 9px;background:#d7dce4;flex:none}
#links-view .work-link-last-opened{min-width:0}
#links-view .work-link-last-opened span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#links-view .work-link-history-chevron{position:relative;display:none;width:20px;height:20px;margin-left:auto;color:#71809b;flex:0 0 20px;transform:rotate(0deg);transform-origin:center;transition:transform .16s ease}
#links-view .work-link-history-chevron::before{position:absolute;top:50%;left:50%;width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;content:"";transform:translate(-50%,-62%) rotate(45deg)}
#links-view .work-link-inline-history{grid-column:1/-1;min-width:0;margin-top:4px;padding:12px 13px 8px;border:1px solid #dbe5f5;border-radius:11px;background:#f7faff}
#links-view .work-link-inline-history[hidden]{display:none!important}
@media(hover:hover) and (pointer:fine){#links-view .work-link-stats:hover{background:#f1f5fb;color:#536078}}
@media(min-width:761px){
  #links-view .row>.linkinfo{grid-template-rows:auto 30px auto}
  #links-view .linkinfo>.work-link-stats{grid-column:1/-1;grid-row:3}
  #links-view .linkinfo>.work-link-inline-history{display:none!important}
}
.work-link-history-backdrop{position:fixed;inset:0;z-index:1200;background:rgba(18,31,52,.42);opacity:0;transition:opacity .22s ease-in}
.work-link-history-backdrop.is-open{opacity:1;transition-timing-function:ease-out}
.work-link-history-drawer{position:fixed;top:0;right:0;z-index:1201;width:min(420px,calc(100vw - 40px));height:100dvh;padding:28px 26px 34px;border-left:1px solid #e1e8f3;background:#fff;box-shadow:-18px 0 50px rgba(23,35,58,.18);overflow-y:auto;pointer-events:none;transform:translateX(105%);transition:transform .22s ease-in,visibility 0s linear .22s;visibility:hidden}
.work-link-history-drawer.is-open{pointer-events:auto;transform:translateX(0);transition-timing-function:ease-out;transition-delay:0s;visibility:visible}
.work-link-history-drawer-head{display:flex;align-items:center;justify-content:space-between;gap:16px}
.work-link-history-heading{display:flex;align-items:center;gap:11px}.work-link-history-heading h2{margin:0;color:#17233a;font-size:20px;line-height:1.2}.work-link-history-mark{display:grid;width:34px;height:34px;place-items:center;border-radius:10px;background:#155eef;color:#fff}.work-link-history-mark svg{width:21px;height:21px}
.work-link-history-identity{display:grid;gap:5px;margin-top:27px}.work-link-history-identity strong{color:#17233a;font-size:15px;line-height:1.4}.work-link-history-identity a{color:#155eef;font-size:13px;line-height:1.45;overflow-wrap:anywhere;text-decoration:none}
.work-link-history-summary{display:grid;grid-template-columns:.8fr 1.2fr;margin-top:18px;padding:13px 14px;border:1px solid #dbe5f5;border-radius:12px;background:#f8faff}
.work-link-history-summary>div{display:flex;align-items:center;gap:10px;min-width:0}.work-link-history-summary>div+div{margin-left:13px;padding-left:13px;border-left:1px solid #dbe5f5}.work-link-history-summary>div.work-link-history-total{justify-content:center;text-align:center}.work-link-history-summary-icon{display:grid;width:23px;height:23px;place-items:center;color:#344054;flex:none}.work-link-history-summary-icon svg{width:22px;height:22px}.work-link-history-summary p{display:grid;gap:3px;min-width:0;margin:0}.work-link-history-summary strong{color:#17233a;font-size:13px;line-height:1.3}.work-link-history-summary small{color:#71809b;font-size:10.5px;line-height:1.4}.work-link-history-summary small>span{display:block}
.work-link-history-drawer>h3{margin:22px 0 10px;color:#17233a;font-size:14px}.work-link-history-content{display:grid;gap:0}.work-link-history-group{padding:0 2px;border-top:1px solid #e7edf6}.work-link-history-group:first-child{border-top:0}.work-link-history-date{display:flex;width:100%;min-height:42px;align-items:center;justify-content:space-between;gap:12px;padding:7px 3px;border:0;border-radius:7px;background:transparent;color:#71809b;font-family:inherit;font-size:11px;line-height:1.3;text-align:left;box-shadow:none}.work-link-history-date:hover{background:#f5f8fd}.work-link-history-date-label{display:flex;align-items:center;gap:7px;min-width:0}.work-link-history-date strong{color:#344054;font-size:12.5px}.work-link-history-date-chevron{position:relative;display:inline-block;width:18px;height:18px;color:#344054;flex:0 0 18px;transform:rotate(0deg);transform-origin:center;transition:transform .16s ease}.work-link-history-date-chevron::before{position:absolute;top:50%;left:50%;width:6px;height:6px;border-top:2px solid currentColor;border-right:2px solid currentColor;content:"";transform:translate(-65%,-50%) rotate(45deg)}.work-link-history-date[aria-expanded="true"] .work-link-history-date-chevron{transform:rotate(90deg)}.work-link-history-times{display:grid;grid-template-rows:0fr;opacity:.25;transition:grid-template-rows .17s ease,opacity .13s ease}.work-link-history-times>div{min-height:0;overflow:hidden}.work-link-history-group.is-open .work-link-history-times{grid-template-rows:1fr;opacity:1}.work-link-history-group ul{display:grid;gap:0;margin:0;padding:0 0 6px 29px;list-style:none}.work-link-history-group li{position:relative;padding:5px 0 5px 12px;border-bottom:1px solid #edf1f7;color:#536078;font-size:11.5px}.work-link-history-group li::before{content:'';position:absolute;top:50%;left:-2px;width:5px;height:5px;border-radius:50%;background:#155eef;transform:translateY(-50%)}.work-link-history-more{display:flex;width:100%;min-height:34px;align-items:center;justify-content:center;gap:5px;margin:0 0 8px;padding:5px 10px;border:1px solid #d5e2f7;border-radius:8px;background:#edf4ff;color:#155eef;font-family:inherit;font-size:11.5px;font-weight:750;line-height:1.3;box-shadow:none}.work-link-history-more-chevron{position:relative;width:16px;height:16px;flex:0 0 16px;transform:rotate(0deg);transform-origin:center;transition:transform .16s ease}.work-link-history-more-chevron::before{position:absolute;top:50%;left:50%;width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;content:"";transform:translate(-50%,-62%) rotate(45deg)}.work-link-history-more[data-expanded="true"] .work-link-history-more-chevron{transform:rotate(180deg)}.work-link-history-more:hover{border-color:#b7cdf2;background:#e3edff}.work-link-history-empty{margin:0;padding:24px 8px;color:#8b96a8;font-size:12px;text-align:center}.work-link-history-empty.is-error{color:#b42318}
body.work-link-history-open{overflow:hidden}
@media(max-width:760px){
  #links-view .work-link-stats{display:grid;grid-template-columns:1fr auto;gap:6px 12px;width:100%;margin-top:10px;padding:9px 8px;background:#f7faff;font-size:12px}
  #links-view .work-link-stat{gap:8px}.work-link-stat-divider{display:none}
  #links-view .work-link-last-opened{grid-column:1;grid-row:2}
  #links-view .work-link-last-opened span{white-space:normal}
  #links-view .work-link-history-chevron{display:block;grid-column:2;grid-row:1/3;align-self:center;justify-self:end;margin-right:2px}
  #links-view .work-link-stats[aria-expanded="true"] .work-link-history-chevron{transform:rotate(180deg)}
  #links-view .work-link-inline-history{margin-top:0;padding:10px 11px 6px;border-top:0;border-radius:0 0 11px 11px}
  #links-view .work-link-stats[aria-expanded="true"]{border-radius:11px 11px 0 0;background:#edf4ff;color:#344054}
  #links-view .work-link-history-date strong{font-size:12px}
  #links-view .work-link-history-group li{font-size:11.5px}
  .work-link-history-backdrop,.work-link-history-drawer{display:none!important}
}

/* Reference-matched pastel artwork for Dashboard and Tax summary cards only. */
.summary-card-art,.tax-summary-art{display:block;max-width:none;pointer-events:none;user-select:none}

#dashboard-view .financial-flow-card{
  display:grid!important;
  grid-template-areas:"income net" "deductions deductions"!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:16px!important;
  min-height:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
}
#dashboard-view .financial-flow-income{grid-area:income}
#dashboard-view .financial-flow-net{grid-area:net}
#dashboard-view .financial-flow-deductions{grid-area:deductions}
#dashboard-view .financial-flow-income,#dashboard-view .financial-flow-net{
  min-height:252px;
  align-items:flex-start!important;
  justify-content:center!important;
  padding:25px 285px 25px 28px!important;
  border-radius:20px!important;
  text-align:left!important;
}
#dashboard-view .financial-flow-income{border-color:#afd1fb!important;background:linear-gradient(135deg,#f1f8ff 0%,#dcecff 100%)!important;box-shadow:0 9px 24px rgba(65,119,190,.08)!important}
#dashboard-view .financial-flow-net{border-color:#a8e4c7!important;background:linear-gradient(135deg,#f0fff7 0%,#d9f8e9 100%)!important;box-shadow:0 9px 24px rgba(38,139,91,.08)!important}
#dashboard-view .financial-flow-income .summary-icon,#dashboard-view .financial-flow-net .summary-icon{width:46px;height:46px;margin-bottom:12px;border-radius:13px;font-size:21px}
#dashboard-view .financial-flow-item p{font-size:18px!important}
#dashboard-view .financial-flow-income strong,#dashboard-view .financial-flow-net strong{font-size:40px!important;letter-spacing:-1px!important}
#dashboard-view .financial-flow-income small,#dashboard-view .financial-flow-net small{font-size:14px!important}
#dashboard-view .financial-flow-income>.summary-card-art,#dashboard-view .financial-flow-net>.summary-card-art{position:absolute;right:20px;bottom:13px;z-index:0;width:275px;height:220px;object-fit:contain}
#dashboard-view .financial-flow-net>.summary-card-art{right:17px;width:270px}
#dashboard-view .financial-flow-cash{align-self:flex-start!important;font-size:13px!important}
#dashboard-view .financial-flow-cash b{font-size:14px!important}

#dashboard-view .financial-flow-deductions{
  min-height:212px;
  padding:19px!important;
  border-color:#f0dcac!important;
  border-radius:20px!important;
  background:linear-gradient(135deg,#fffdf5 0%,#fff6df 100%)!important;
  box-shadow:0 9px 24px rgba(183,132,38,.065)!important;
}
#dashboard-view .financial-flow-deductions-title{margin:0 0 12px!important;color:#9a431d!important;font-size:19px!important;text-align:left!important}
#dashboard-view .financial-flow-deduction-grid{gap:16px!important}
#dashboard-view .financial-flow-deduction-grid>.financial-flow-item{
  position:relative;
  min-height:174px;
  align-items:flex-start!important;
  justify-content:center!important;
  overflow:hidden;
  padding:20px 230px 20px 20px!important;
  border:1px solid rgba(255,255,255,.9)!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.74)!important;
  box-shadow:0 6px 18px rgba(109,91,51,.045)!important;
  text-align:left!important;
}
#dashboard-view .financial-flow-deduction-grid>.financial-flow-item::before{position:absolute;inset:0;z-index:0;background:linear-gradient(122deg,rgba(255,255,255,.34) 0%,rgba(255,255,255,.08) 39%,rgba(255,255,255,0) 53%),linear-gradient(122deg,rgba(255,255,255,0) 55%,rgba(255,255,255,.42) 56%,rgba(255,255,255,.12) 64%,rgba(255,255,255,0) 73%);content:"";pointer-events:none}
#dashboard-view .financial-flow-deduction-grid>.financial-flow-item>.summary-icon,#dashboard-view .financial-flow-deduction-grid>.financial-flow-item>p,#dashboard-view .financial-flow-deduction-grid>.financial-flow-item>strong,#dashboard-view .financial-flow-deduction-grid>.financial-flow-item>small{position:relative;z-index:1}
#dashboard-view .financial-flow-deduction-grid>.financial-flow-item+ .financial-flow-item{border-left:1px solid rgba(255,255,255,.9)!important}
#dashboard-view .financial-flow-deduction-grid .summary-icon{width:42px;height:42px;margin:0 0 10px!important;border-radius:12px!important;font-size:19px!important}
#dashboard-view .financial-flow-deduction-grid .financial-flow-fee .summary-icon{font-size:0!important}
#dashboard-view .financial-flow-deduction-grid .financial-flow-fee .summary-icon::before{width:20px;height:20px}
#dashboard-view .financial-flow-deduction-grid strong{font-size:32px!important}
#dashboard-view .financial-flow-deduction-grid small{font-size:13px!important}
#dashboard-view .financial-flow-deduction-grid .summary-card-art{position:absolute;right:10px;bottom:-1px;z-index:0;width:225px;height:165px;object-fit:contain}
#dashboard-view .financial-flow-fee .summary-card-art{right:5px}

#dashboard-view .tracking-overview{gap:16px!important;margin-top:0!important}
#dashboard-view .tracking-overview>.tracking-card{
  position:relative;
  display:grid!important;
  grid-template-columns:48px minmax(0,1fr)!important;
  grid-template-rows:auto auto auto!important;
  min-height:174px!important;
  align-content:center!important;
  align-items:center!important;
  justify-items:start!important;
  column-gap:12px!important;
  row-gap:3px!important;
  overflow:hidden!important;
  padding:22px 250px 22px 24px!important;
  border:1px solid #f2bfd0!important;
  border-radius:19px!important;
  background:linear-gradient(135deg,#fff6fa 0%,#ffe8f0 100%)!important;
  box-shadow:0 8px 22px rgba(190,73,119,.07)!important;
  text-align:left!important;
}
#dashboard-view .tracking-overview>.tracking-card .summary-icon{grid-column:1;grid-row:1 / span 3;align-self:start;display:grid!important;width:42px;height:42px;margin:0!important;border-radius:12px!important;background:#ffe0ea!important;color:#dc1761!important;font-size:17px!important}
#dashboard-view .tracking-overview>.tracking-card p{position:relative;z-index:2;grid-column:2;grid-row:1;align-self:end!important;margin:0!important;color:#a92855!important;font-size:18px!important;text-align:left!important}
#dashboard-view .tracking-overview>.tracking-card strong{position:relative;z-index:2;grid-column:2;grid-row:2;align-self:center!important;margin:0!important;color:#e11d62!important;font-size:36px!important;text-align:left!important}
#dashboard-view .tracking-overview>.tracking-card small{position:relative;z-index:2;grid-column:2;grid-row:3;align-self:start!important;justify-items:start!important;margin:1px 0 0!important;color:#9e4b69!important;font-size:13px!important;text-align:left!important}
#dashboard-view .tracking-overview>.tracking-card::after{top:17px!important;right:18px!important;z-index:3;color:#e11d62!important;font-size:30px!important}
#dashboard-view .tracking-overview>.tracking-card>.summary-card-art{position:absolute;right:20px;bottom:2px;z-index:0;width:235px;height:165px;object-fit:contain}
#dashboard-view .payment-outstanding-item-count{display:inline}
#dashboard-view .payment-outstanding-item-count::before{content:' · '}

#tax-view.tax-card-reference-design .tax-summary-grid{gap:14px!important}
#tax-view.tax-card-reference-design .tax-income-summary-group{display:grid!important;grid-column:1 / -1!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:14px!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
#tax-view.tax-card-reference-design .tax-summary-total{grid-column:1 / -1!important}
#tax-view.tax-card-reference-design .tax-summary-company,#tax-view.tax-card-reference-design .tax-summary-individual{grid-column:span 3!important}
#tax-view.tax-card-reference-design .tax-summary-withholding,#tax-view.tax-card-reference-design .tax-summary-certificate,#tax-view.tax-card-reference-design .tax-summary-unfiled{grid-column:span 2!important}
#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-card{
  position:relative!important;
  align-items:flex-start!important;
  justify-content:center!important;
  overflow:hidden!important;
  padding:22px 220px 21px 24px!important;
  border-radius:18px!important;
  text-align:left!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
}
#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-card::before{background:linear-gradient(122deg,rgba(255,255,255,.34) 0%,rgba(255,255,255,.08) 39%,rgba(255,255,255,0) 53%),linear-gradient(122deg,rgba(255,255,255,0) 55%,rgba(255,255,255,.42) 56%,rgba(255,255,255,.12) 64%,rgba(255,255,255,0) 73%)!important}
#tax-view.tax-card-reference-design .tax-summary-label{align-items:flex-start!important;gap:7px!important}
#tax-view.tax-card-reference-design .tax-summary-label>span{flex-basis:40px!important;width:40px!important;height:40px!important;border-radius:12px!important}
#tax-view.tax-card-reference-design .tax-summary-label>p{font-size:15px!important}
#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-card>strong{margin-top:8px!important;font-size:31px!important}
#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-card>small{margin-top:7px!important;font-size:12px!important}
#tax-view.tax-card-reference-design .tax-summary-art{position:absolute;right:9px;bottom:0;z-index:0;width:215px;height:145px;object-fit:contain}

#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-total{min-height:178px!important;padding:26px 390px 25px 28px!important;border-color:#83dfbf!important;background:linear-gradient(135deg,#f2fff9 0%,#dcfaed 100%)!important;box-shadow:0 8px 22px rgba(32,141,95,.065)!important}
#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-total .tax-summary-label{align-items:flex-start!important}
#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-total>strong{font-size:44px!important}
#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-total .tax-summary-art{right:25px;bottom:6px;width:365px;height:165px}
#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-company,#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-individual{min-height:150px!important}
#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-company{border-color:#a9c9ff!important;background:linear-gradient(135deg,#f5f9ff 0%,#e4eeff 100%)!important;box-shadow:0 7px 20px rgba(39,96,190,.055)!important}
#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-individual{border-color:#9ee4ea!important;background:linear-gradient(135deg,#f3feff 0%,#ddf8fa 100%)!important;box-shadow:0 7px 20px rgba(18,139,154,.055)!important}
#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-withholding,#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-certificate,#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-unfiled{min-height:142px!important;padding-right:145px!important}
#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-withholding{border-color:#f0d68d!important;background:linear-gradient(135deg,#fffdf5 0%,#fff4d3 100%)!important;box-shadow:0 7px 20px rgba(185,124,15,.05)!important}
#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-certificate{border-color:#f1bac9!important;background:linear-gradient(135deg,#fff8fa 0%,#ffe8ef 100%)!important;box-shadow:0 7px 20px rgba(185,62,95,.05)!important}
#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-unfiled{border-color:#f3c49f!important;background:linear-gradient(135deg,#fffaf5 0%,#ffeadb 100%)!important;box-shadow:0 7px 20px rgba(199,91,28,.05)!important}
#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-withholding .tax-summary-art,#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-certificate .tax-summary-art,#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-unfiled .tax-summary-art{right:3px;width:145px;height:120px}

/* Keep the three compact tax-card captions readable without covering their 3D artwork. */
@media(max-width:1040px) and (min-width:781px){
  #dashboard-view .financial-flow-income,#dashboard-view .financial-flow-net{padding-right:210px!important}
  #dashboard-view .financial-flow-income>.summary-card-art,#dashboard-view .financial-flow-net>.summary-card-art{width:210px}
  #dashboard-view .financial-flow-deduction-grid>.financial-flow-item{padding-right:170px!important}
  #dashboard-view .financial-flow-deduction-grid .summary-card-art{width:170px}
  #dashboard-view .tracking-overview>.tracking-card{padding-right:185px!important}
  #dashboard-view .tracking-overview>.tracking-card>.summary-card-art,#dashboard-view .tracking-overview>.tracking-card>.summary-card-art-wrap{width:180px}
}

@media(max-width:780px){
  #dashboard-view .financial-flow-card{grid-template-areas:"income" "net" "deductions"!important;grid-template-columns:minmax(0,1fr)!important;gap:10px!important;padding:0!important}
  #dashboard-view .financial-flow-income,#dashboard-view .financial-flow-net{min-height:196px!important;align-items:flex-start!important;padding:16px 175px 16px 17px!important;text-align:left!important}
  #dashboard-view .financial-flow-income .summary-icon,#dashboard-view .financial-flow-net .summary-icon{width:42px;height:42px;margin-bottom:8px;font-size:19px}
  #dashboard-view .financial-flow-item p{font-size:16px!important}
  #dashboard-view .financial-flow-income strong,#dashboard-view .financial-flow-net strong{font-size:31px!important}
  #dashboard-view .financial-flow-income small,#dashboard-view .financial-flow-net small{font-size:12px!important}
  #dashboard-view .financial-flow-income>.summary-card-art,#dashboard-view .financial-flow-net>.summary-card-art{right:2px;bottom:2px;width:190px;height:165px}
  #dashboard-view .financial-flow-net>.summary-card-art{right:-1px;width:186px}
  #dashboard-view .financial-flow-cash{align-self:flex-start!important;font-size:11px!important}
  #dashboard-view .financial-flow-cash b{font-size:12px!important}
  #dashboard-view .financial-flow-deductions{min-height:0!important;padding:12px!important}
  #dashboard-view .financial-flow-deductions-title{margin-bottom:9px!important;font-size:17px!important}
  #dashboard-view .financial-flow-deduction-grid{gap:8px!important}
  #dashboard-view .financial-flow-deduction-grid>.financial-flow-item{min-height:150px!important;align-items:flex-start!important;padding:10px 8px!important;text-align:left!important}
  #dashboard-view .financial-flow-deduction-grid .summary-icon{width:34px;height:34px;margin-bottom:6px!important;border-radius:10px!important;font-size:16px!important}
  #dashboard-view .financial-flow-deduction-grid p{position:relative;z-index:2;max-width:82%;font-size:12px!important}
  #dashboard-view .financial-flow-deduction-grid strong{position:relative;z-index:2;font-size:23px!important}
  #dashboard-view .financial-flow-deduction-grid small{position:relative;z-index:2;max-width:68%;font-size:10px!important;line-height:1.35!important}
  #dashboard-view .financial-flow-deduction-grid .summary-card-art{right:-10px;bottom:-3px;width:106px;height:92px}
  #dashboard-view .tracking-overview{gap:8px!important}
  #dashboard-view .tracking-overview>.tracking-card{grid-template-columns:35px minmax(0,1fr)!important;min-height:146px!important;align-items:center!important;column-gap:7px!important;padding:11px 9px!important;text-align:left!important}
  #dashboard-view .tracking-overview>.tracking-card .summary-icon{display:grid!important;width:34px;height:34px;margin:0!important;border-radius:10px!important;font-size:14px!important}
  #dashboard-view .tracking-overview>.tracking-card p{max-width:82%;font-size:12px!important;line-height:1.35!important}
  #dashboard-view .tracking-overview>.tracking-card strong{font-size:25px!important}
  #dashboard-view .tracking-overview>.tracking-card small{max-width:74%;font-size:10px!important;line-height:1.35!important}
  #dashboard-view .tracking-overview>.tracking-card::after{top:8px!important;right:10px!important;font-size:23px!important}
  #dashboard-view .tracking-overview>.tracking-card>.summary-card-art{right:-7px;bottom:-1px;width:108px;height:91px}
  #dashboard-view .payment-outstanding-item-count{display:block}
  #dashboard-view .payment-outstanding-item-count::before{content:''}
}

@media(max-width:520px){
  #tax-view.tax-card-reference-design .tax-summary-grid{gap:8px!important}
  #tax-view.tax-card-reference-design .tax-income-summary-group{grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:8px!important}
  #tax-view.tax-card-reference-design .tax-summary-total{grid-column:1 / -1!important}
  #tax-view.tax-card-reference-design .tax-summary-company,#tax-view.tax-card-reference-design .tax-summary-individual{grid-column:span 3!important}
  #tax-view.tax-card-reference-design .tax-summary-withholding,#tax-view.tax-card-reference-design .tax-summary-certificate,#tax-view.tax-card-reference-design .tax-summary-unfiled{grid-column:span 2!important}
  #tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-card{align-items:flex-start!important;justify-content:center!important;border-radius:14px!important;text-align:left!important}
  #tax-view.tax-card-reference-design .tax-summary-label{align-items:flex-start!important;gap:5px!important}
  #tax-view.tax-card-reference-design .tax-summary-label>span{flex-basis:31px!important;width:31px!important;height:31px!important;border-radius:9px!important}
  #tax-view.tax-card-reference-design .tax-summary-label>p{font-size:10px!important;line-height:1.3!important}
  #tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-card>strong{margin-top:6px!important;font-size:22px!important}
  #tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-card>small{position:relative;z-index:2;max-width:72%;margin-top:5px!important;font-size:10.5px!important;line-height:1.35!important}
  #tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-card>small{width:100%;max-width:100%;text-align:left!important}
  #tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-total{min-height:146px!important;padding:15px 150px 14px 15px!important}
  #tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-total .tax-summary-label{align-items:flex-start!important}
  #tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-total>strong{font-size:32px!important}
  #tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-total .tax-summary-art{right:-8px;bottom:0;width:165px;height:135px}
  #tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-company,#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-individual{min-height:138px!important;padding:11px 68px 10px 10px!important}
  #tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-company>small,#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-individual>small{width:100%;max-width:100%}
  #tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-company .tax-summary-art,#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-individual .tax-summary-art{right:-4px;bottom:-2px;width:96px;height:86px}
  #tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-withholding,#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-certificate,#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-unfiled{min-height:132px!important;padding:10px 7px!important}
  #tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-withholding>strong,#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-certificate>strong,#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-unfiled>strong{font-size:19px!important}
  #tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-withholding .tax-summary-art,#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-certificate .tax-summary-art,#tax-view.tax-card-reference-design .tax-summary-grid .tax-summary-unfiled .tax-summary-art{right:-12px;bottom:-5px;width:82px;height:70px}
}
@media(prefers-reduced-motion:reduce){.work-link-history-backdrop,.work-link-history-drawer,.work-link-history-times,.work-link-history-date-chevron{transition:none}}

/* Wider desktop canvas across every app page; mobile measurements stay unchanged. */
@media(min-width:781px){
  .shell{max-width:1360px;padding-right:28px;padding-left:28px}
  .topbar{padding-right:max(28px,calc((100vw - 1360px)/2));padding-left:max(28px,calc((100vw - 1360px)/2))}
  #links-view{max-width:none}
}

/* Stable Work Link toggles and balanced View History summary. */
.work-link-history-summary{position:relative;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;padding-right:0;padding-left:0}
.work-link-history-summary::before{position:absolute;top:13px;bottom:13px;left:50%;width:1px;background:#dbe5f5;content:"";transform:translateX(-.5px)}
.work-link-history-summary>div,.work-link-history-summary>div.work-link-history-total{display:grid;grid-template-columns:23px max-content;min-height:58px;align-items:center;justify-content:center;gap:10px;margin:0;padding:0 12px;text-align:left}
.work-link-history-summary>div+div{margin:0;padding:0 12px;border-left:0}
.work-link-history-summary p{text-align:left}
#links-view .work-link-history-chevron,.work-link-history-date-chevron,.work-link-history-more-chevron{transform:none}
#links-view .work-link-history-chevron::before,.work-link-history-more-chevron::before{transform:translate(-50%,-50%) rotate(45deg);transition:transform .16s ease}
.work-link-history-date-chevron::before{transform:translate(-50%,-50%) rotate(45deg);transition:transform .16s ease}
#links-view .work-link-stats[aria-expanded="true"] .work-link-history-chevron{transform:none}
#links-view .work-link-stats[aria-expanded="true"] .work-link-history-chevron::before{transform:translate(-50%,-50%) rotate(225deg)}
.work-link-history-date[aria-expanded="true"] .work-link-history-date-chevron{transform:none}
.work-link-history-date[aria-expanded="true"] .work-link-history-date-chevron::before{transform:translate(-50%,-50%) rotate(135deg)}
.work-link-history-more[data-expanded="true"] .work-link-history-more-chevron{transform:none}
.work-link-history-more[data-expanded="true"] .work-link-history-more-chevron::before{transform:translate(-50%,-50%) rotate(225deg)}
.work-link-history-group li{border-bottom:0}
.work-link-history-group li+li{border-top:1px solid #edf1f7}

/* Shared Add action menu: compact desktop dropdown and iPhone bottom sheet. */
#new-transaction{display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap}
.add-action-chevron{position:relative;width:14px;height:14px;flex:0 0 14px}
.add-action-chevron::before{position:absolute;top:50%;left:50%;width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;content:"";transform:translate(-50%,-68%) rotate(45deg)}
.add-action-menu[hidden],.add-action-backdrop[hidden],.pdf-drop-overlay[hidden]{display:none!important}
.add-action-menu{position:fixed;top:68px;right:max(28px,calc((100vw - 1360px)/2));z-index:1302;width:348px;padding:10px 18px;border:1px solid #dce5f2;border-radius:21px;background:#fff;box-shadow:0 18px 44px rgba(23,35,58,.16);opacity:0;pointer-events:none;transform:translateY(-6px) scale(.985);transform-origin:top right;transition:opacity .16s ease,transform .16s ease}
.add-action-menu.is-open{opacity:1;pointer-events:auto;transform:translateY(0) scale(1)}
.add-action-menu-head,.add-action-cancel{display:none}
.add-action-item{display:grid;width:100%;grid-template-columns:56px minmax(0,1fr) 20px;align-items:center;column-gap:24px;min-height:94px;padding:14px 4px;border:0;border-radius:0;border-bottom:1px solid #e3e9f2;background:transparent;color:#17233a;text-align:left;box-shadow:none}
.add-action-item:last-of-type{border-bottom:0}
.add-action-item:hover,.add-action-item:focus-visible{outline:0;background:#f7f9fc}
.add-action-icon{display:grid;width:56px;height:56px;place-items:center;align-self:center;flex:none}
.add-action-icon img{display:block;width:56px;height:56px;max-width:none;object-fit:contain}
.add-action-menu #add-menu-new .add-action-icon img{width:63px;height:63px}
.add-action-menu #quick-template .add-action-icon img{width:60px;height:60px}
.add-action-copy{display:grid;min-width:0;height:auto;align-self:center;align-content:center;gap:3px}.add-action-copy strong{color:#111f43;font-size:17px;line-height:1.3}.add-action-copy small{display:block;min-height:0;color:#73819c;font-size:13px;font-weight:400;line-height:1.38}
.add-action-menu .add-action-copy strong{color:#111f43}
.add-action-menu #add-menu-new,.add-action-menu #import-document,.add-action-menu #quick-template{border:0;border-bottom:1px solid #e3e9f2;border-radius:0;background:transparent!important;color:#17233a;box-shadow:none!important;transform:none!important}
.add-action-menu #quick-template{border-bottom:0}
.add-action-menu #import-document:hover,.add-action-menu #quick-template:hover,.add-action-menu #import-document:focus-visible,.add-action-menu #quick-template:focus-visible{outline:0;background:#f7f9fc;color:#17233a;box-shadow:none;transform:none}
.add-action-item-chevron{position:relative;display:block;width:20px;height:20px;color:#111f43}.add-action-item-chevron::before{position:absolute;top:50%;left:50%;width:8px;height:8px;border-top:2px solid currentColor;border-right:2px solid currentColor;content:"";transform:translate(-65%,-50%) rotate(45deg)}
.add-action-backdrop{display:none}

/* Desktop PDF drag and drop reuses the existing import flow. */
.pdf-drop-overlay{position:fixed;top:70px;right:0;bottom:0;left:0;z-index:1100;padding:14px;background:rgba(220,234,255,.68);opacity:0;pointer-events:none;transition:opacity .14s ease}
.pdf-drop-overlay.is-visible{opacity:1}
.pdf-drop-overlay-frame{display:flex;width:100%;height:100%;align-items:center;justify-content:center;flex-direction:column;gap:9px;border:2px dashed #155eef;border-radius:18px;color:#155eef;text-align:center;backdrop-filter:blur(2px)}
.pdf-drop-icon{display:grid;width:70px;height:70px;place-items:center}.pdf-drop-icon svg{width:58px;height:58px}
.pdf-drop-overlay-frame strong{color:#17233a;font-size:22px;line-height:1.35}.pdf-drop-overlay-frame>span:last-child{color:#536078;font-size:14px;font-weight:650}
.pdf-drop-overlay-progress{min-width:112px;padding:8px 18px;border:1px solid #9fc2ff;border-radius:999px;background:rgba(255,255,255,.9);box-shadow:0 8px 24px rgba(21,94,239,.12);color:#155eef;font-size:30px;font-weight:800;line-height:1;text-align:center}.pdf-drop-overlay.is-processing{pointer-events:auto;background:rgba(220,234,255,.82)}.pdf-drop-overlay.is-processing .pdf-drop-overlay-frame{border-style:solid;background:rgba(248,251,255,.62)}.pdf-drop-overlay.is-processing .pdf-drop-icon{animation:pdf-drop-processing 1.1s ease-in-out infinite alternate}@keyframes pdf-drop-processing{to{transform:translateY(-5px);opacity:.72}}
.pdf-drop-overlay.is-invalid{background:rgba(255,235,235,.72)}.pdf-drop-overlay.is-invalid .pdf-drop-overlay-frame{border-color:#c94040;color:#c94040}.pdf-drop-overlay.is-invalid .pdf-drop-overlay-frame>span:last-child{color:#a62828}
.pdf-review-field input,.pdf-review-field select{border-color:#e3bd62!important;background:#fff9e8!important;box-shadow:0 0 0 3px rgba(227,189,98,.13)!important}
.pdf-review-hint{display:block;margin-top:2px;color:#9a6811;font-size:11px;font-weight:750}
.pdf-review-hint-placeholder{visibility:hidden}

@media(max-width:780px){
  #transactions-view>.page-heading{margin-bottom:18px!important}
  #transactions-view .heading-actions{display:none!important}
  #links-view .work-link-stats{position:relative;grid-template-columns:minmax(0,1fr);padding-right:44px}
  #links-view .work-link-history-chevron{position:absolute;top:50%;right:12px;display:block;margin:0;transform:translateY(-50%)}
  #links-view .work-link-stats[aria-expanded="true"] .work-link-history-chevron{transform:translateY(-50%)}
  #links-view .work-link-stats[aria-expanded="true"] .work-link-history-chevron::before{transform:translate(-50%,-50%) rotate(225deg)}
  .pdf-drop-overlay{display:none!important}
  .add-action-chevron{display:none}
  .add-action-backdrop{position:fixed;inset:0;z-index:1300;display:block;background:rgba(19,29,47,.46);opacity:0;transition:opacity .2s ease}
  .add-action-backdrop.is-open{opacity:1}
  .add-action-menu{top:auto;right:0;bottom:0;left:0;box-sizing:border-box;width:auto;max-height:calc(100dvh - env(safe-area-inset-top));padding:9px 18px calc(14px + env(safe-area-inset-bottom));border:0;border-radius:28px 28px 0 0;background:#fff;box-shadow:0 -16px 52px rgba(20,31,50,.24);overflow-y:auto;opacity:1;transform:translateY(calc(100% + 30px));transform-origin:bottom center;transition:transform .22s ease-in;backdrop-filter:none}
  .add-action-menu.is-open{transform:translateY(0);transition-timing-function:ease-out}
  .add-action-menu-head{display:grid;gap:11px;padding:0 6px 13px;border-bottom:1px solid #e2e8f1}.add-action-menu-head strong{font-size:22px;line-height:1.3}.add-action-handle{justify-self:center;width:54px;height:5px;border-radius:999px;background:#c6cfdd}
  .add-action-item{grid-template-columns:56px minmax(0,1fr) 18px;column-gap:24px;min-height:94px;padding:12px 7px;border-radius:0;border-bottom:1px solid #e2e8f1;background:transparent!important}
  .add-action-menu #add-menu-new,.add-action-menu #import-document,.add-action-menu #quick-template{border:0;border-bottom:1px solid #e2e8f1;background:transparent!important}
  .add-action-menu #quick-template{border-bottom:0}
  .add-action-menu #import-document:hover,.add-action-menu #quick-template:hover,.add-action-menu #import-document:focus-visible,.add-action-menu #quick-template:focus-visible{border-bottom-color:#e2e8f1;background:transparent!important}
  .add-action-icon{width:56px;height:56px}.add-action-icon img{width:56px;height:56px}
  .add-action-copy{gap:3px}.add-action-copy strong{font-size:17px}.add-action-copy small{display:block;font-size:13px;line-height:1.35}
  .add-action-item-chevron{width:18px;height:18px;color:#111f43}.add-action-item-chevron::before{width:7px;height:7px}
  .add-action-cancel{display:block;width:100%;height:52px;margin-top:10px;border:0;border-radius:15px;background:#edf1f6;color:#17233a;font-size:17px;font-weight:780;box-shadow:none}
  body.add-action-open{overflow:hidden}
}

@media(min-width:781px){
  .add-action-menu #add-menu-new:hover,
  .add-action-menu #import-document:hover,
  .add-action-menu #quick-template:hover,
  .add-action-menu #add-menu-new:focus-visible,
  .add-action-menu #import-document:focus-visible,
  .add-action-menu #quick-template:focus-visible{
    border-radius:0!important;
    background:#eaf2ff!important;
    box-shadow:none!important;
    transition:none!important;
  }
}

@media(max-width:780px){
  #dashboard-view .financial-flow-deduction-grid>.financial-flow-item{min-height:132px!important;padding-top:8px!important;padding-bottom:8px!important}
  #dashboard-view .tracking-overview>.tracking-card{min-height:122px!important;padding-top:8px!important;padding-bottom:8px!important}
}

#dashboard-view .tracking-overview{
  min-height:212px!important;
  padding:19px!important;
  border:1px solid #f2b9cc!important;
  border-radius:20px!important;
  background:linear-gradient(135deg,#fff7fa 0%,#ffe5ee 100%)!important;
  box-shadow:0 9px 24px rgba(190,54,101,.055)!important;
}
#dashboard-view .tracking-overview>.tracking-card{border:0!important;background:rgba(255,255,255,.48)!important;box-shadow:none!important}

@media(min-width:781px){
  .add-action-menu{padding:0;overflow:hidden}
  .add-action-menu .add-action-item{
    width:100%;
    min-height:100px;
    margin-left:0;
    padding-right:22px;
    padding-left:22px;
  }
  #links-view .work-links-list-card{padding-bottom:4px}
}

@media(max-width:780px){
  #dashboard-view .tracking-overview{min-height:156px!important;gap:8px!important;padding:12px!important}
  #dashboard-view .tracking-overview>.tracking-card{
    min-height:132px!important;
    grid-template-rows:32px 32px 36px!important;
    align-content:center!important;
  }
  #dashboard-view .tracking-overview>.tracking-card>p,
  #dashboard-view .tracking-overview>.tracking-card>strong{display:flex;min-height:32px;align-items:center;margin:0!important}
  #dashboard-view .tracking-overview>.tracking-card>small{display:flex!important;min-height:36px;flex-direction:column;justify-content:center;margin:0!important}
  #dashboard-view .tracking-overview>.tracking-card::after{top:10px!important;right:10px!important;line-height:1!important}
}

@media(max-width:760px){
  #links-view .work-link-stats{font-size:14px;line-height:1.45}
  #links-view .work-link-stat{gap:9px}
  #links-view .work-link-stat svg{width:18px;height:18px}
  #links-view .work-link-history-chevron{top:50%;right:12px;width:22px;height:22px;transform:translateY(-50%)}
  #links-view .work-link-stats[aria-expanded="true"] .work-link-history-chevron{top:50%;transform:translateY(-50%)}
  #links-view .work-link-inline-history{font-size:13px}
  #links-view .work-link-history-date{min-height:46px;font-size:13px}
  #links-view .work-link-history-date strong{font-size:14px}
  #links-view .work-link-history-date-label{align-items:center}
  #links-view .work-link-history-date-chevron{display:grid;width:20px;height:20px;place-items:center;align-self:center;flex:0 0 20px}
  #links-view .work-link-history-group li{font-size:13px;line-height:1.45}
  #links-view .work-link-history-more{min-height:38px;font-size:13px}
  #links-view .work-link-history-more [data-work-link-more-label]{font-size:13px;font-weight:750;line-height:1.3;-webkit-text-size-adjust:100%;text-size-adjust:100%}
  #links-view .work-link-history-more-chevron{display:grid;width:18px;height:18px;place-items:center;align-self:center;flex:0 0 18px}
}

@media(prefers-reduced-motion:reduce){#links-view .work-link-history-chevron::before,.work-link-history-date-chevron::before,.work-link-history-more-chevron::before,.add-action-menu,.add-action-backdrop,.pdf-drop-overlay{transition:none}}

/* iPhone tax header keeps the year beside the title and moves search below summary cards. */
@media(max-width:780px){
  #tax-view .tax-heading{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;align-items:center!important;gap:6px 10px!important}
  #tax-view .tax-heading>div:first-child{display:contents!important}
  #tax-view .tax-heading .eyebrow{grid-column:1/-1;grid-row:1;margin:0!important}
  #tax-view .tax-heading h1{grid-column:1;grid-row:2;margin:0!important}
  #tax-view .tax-heading .muted{grid-column:1/-1;grid-row:3;margin:0!important}
  #tax-view .tax-heading-tools{grid-column:2;grid-row:2;width:auto!important;max-width:none!important;align-items:center!important;gap:0!important;margin:0!important}
  #tax-view .tax-heading-tools .tax-year-picker{order:initial!important;margin:0!important}
  #tax-view>.tax-directory-tools{display:block!important;width:100%!important;max-width:none!important;margin:0 0 18px!important;padding:8px!important;border:1px solid #d8e3f4!important;border-radius:17px!important;background:#f3f7ff!important;box-shadow:0 5px 16px rgba(38,68,122,.07)!important}
  #tax-view>.tax-directory-tools:focus-within{border-color:#aac2ef!important;box-shadow:0 0 0 3px rgba(21,94,239,.08),0 5px 16px rgba(38,68,122,.07)!important}
  #tax-view>.tax-directory-tools input{width:100%!important;height:50px!important;padding:0 42px 0 48px!important;border-color:#b9ccef!important;border-radius:12px!important;background-color:#fff!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23155eef' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='m15.5 15.5 4.5 4.5'/%3E%3C/svg%3E")!important;background-position:16px center!important;background-repeat:no-repeat!important;background-size:22px 22px!important;font-size:16px!important;box-shadow:0 1px 4px rgba(37,74,137,.06)!important}
}

/* iPhone search cards share one visual language across Transactions and Customers. */
@media(max-width:780px){
  #transactions-view section.filters.transaction-filter-toolbar{padding:8px!important;border:1px solid #d8e3f4!important;border-radius:17px!important;background:#f3f7ff!important;box-shadow:0 5px 16px rgba(38,68,122,.07)!important}
  #transactions-view section.filters.transaction-filter-toolbar:focus-within{border-color:#aac2ef!important;box-shadow:0 0 0 3px rgba(21,94,239,.08),0 5px 16px rgba(38,68,122,.07)!important}
  #transactions-view .filter-primary-row{gap:8px!important}
  #transactions-view .filter-search:before{left:16px!important;z-index:3;width:22px!important;height:22px!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23155eef' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='m15.5 15.5 4.5 4.5'/%3E%3C/svg%3E")!important;background-size:22px 22px!important}
  #transactions-view section.filters.transaction-filter-toolbar .filter-search input{height:50px!important;padding:0 40px 0 48px!important;border:1px solid #b9ccef!important;border-radius:12px!important;background:#fff!important;box-shadow:0 1px 4px rgba(37,74,137,.06)!important}
  #transactions-view section.filters.transaction-filter-toolbar .filter-search input:hover,
  #transactions-view section.filters.transaction-filter-toolbar .filter-search input:focus{border-color:#8cace8!important;background:#fff!important;box-shadow:0 0 0 3px rgba(21,94,239,.08)!important}
  #transactions-view .filter-toggle{min-width:86px!important;height:50px!important;padding:0 10px!important;border-color:#b9ccef!important;border-radius:12px!important;background:#fff!important;box-shadow:0 1px 4px rgba(37,74,137,.05)!important}

  #customers-view .customer-directory-panel>.section-heading{display:grid!important;grid-template-columns:minmax(0,1fr)!important;align-items:stretch!important;gap:9px!important}
  #customers-view .customer-directory-panel>.section-heading>div:first-child{display:flex!important;align-items:baseline!important;gap:7px!important;min-width:0!important}
  #customers-view .customer-directory-panel>.section-heading h2{margin:0!important;white-space:nowrap!important}
  #customers-view #customer-directory-count{margin:0!important;font-size:12px!important;white-space:nowrap!important}
  #customers-view #customer-directory-count:before{content:'· ';color:#9aa7bb}
  #customers-view .customer-directory-tools{display:block!important;width:100%!important;max-width:none!important;margin:0!important;padding:8px!important;border:1px solid #d8e3f4!important;border-radius:17px!important;background:#f3f7ff!important;box-shadow:0 5px 16px rgba(38,68,122,.07)!important}
  #customers-view .customer-directory-tools:focus-within{border-color:#aac2ef!important;box-shadow:0 0 0 3px rgba(21,94,239,.08),0 5px 16px rgba(38,68,122,.07)!important}
  #customers-view .customer-directory-tools input{width:100%!important;height:50px!important;padding:0 42px 0 48px!important;border:1px solid #b9ccef!important;border-radius:12px!important;background-color:#fff!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23155eef' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='m15.5 15.5 4.5 4.5'/%3E%3C/svg%3E")!important;background-position:16px center!important;background-repeat:no-repeat!important;background-size:22px 22px!important;font-size:16px!important;box-shadow:0 1px 4px rgba(37,74,137,.06)!important}
}

/* iPhone navigation: five balanced destinations with Add as a separate floating action. */
@media(max-width:780px){
  .navigation-shell{
    grid-template-columns:repeat(5,minmax(0,1fr));
    overflow:visible;
    border:1px solid rgba(132,150,180,.22);
    background:rgba(242,246,252,.08);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.42),
      inset 0 -1px 0 rgba(105,124,156,.12),
      0 4px 12px rgba(28,39,58,.07);
    -webkit-backdrop-filter:blur(3px) saturate(120%) contrast(106%);
    backdrop-filter:blur(3px) saturate(120%) contrast(106%);
  }
  .navigation-shell .nav-link.active{
    align-self:stretch;
    height:auto;
    min-height:54px;
    background:transparent;
    color:#155eef;
    box-shadow:none;
    transform:none;
  }
  .navigation-shell .nav-link.active::before{transform:scale(1.08)}
  .navigation-shell .nav-link::before{
    width:26px;
    height:26px;
  }
  .navigation-shell .nav-link::after{
    font-size:10.5px;
    font-weight:700;
  }
  .navigation-shell .nav-link.active::after{
    font-size:11px;
  }
  .navigation-shell #new-transaction{
    position:absolute;
    right:22px;
    bottom:calc(100% + 20px);
    z-index:3;
    width:52px;
    min-width:52px;
    height:52px;
    min-height:52px;
    padding:0;
    border:0;
    border-radius:50%;
    overflow:visible;
    background:#155eef;
    color:#fff;
    box-shadow:0 9px 22px rgba(21,94,239,.34),inset 0 1px 0 rgba(255,255,255,.28);
    opacity:1;
    visibility:visible;
    transform:translateY(0) scale(1);
    transform-origin:center;
    -webkit-backface-visibility:hidden;
    backface-visibility:hidden;
    will-change:opacity,transform;
    transition:none;
  }
  .navigation-shell #new-transaction::before{
    content:'';
    display:block;
    width:26px;
    height:26px;
    flex:0 0 auto;
    margin:0;
    border:0;
    border-radius:0;
    background:
      linear-gradient(#fff,#fff) center/3px 26px no-repeat,
      linear-gradient(#fff,#fff) center/26px 3px no-repeat;
    color:#fff;
    box-shadow:none;
  }
  .navigation-shell #new-transaction::after{display:none}
  .shell{padding-bottom:calc(75px + env(safe-area-inset-bottom))}
  .site-footer{padding-bottom:calc(110px + env(safe-area-inset-bottom))}
}

/* iPhone monthly chart: balanced two-column controls. */
@media(max-width:520px){
  #dashboard-view .chart-heading{
    grid-template-columns:repeat(2,minmax(0,1fr));
    align-items:end;
    gap:7px 10px;
  }
  #dashboard-view .chart-heading h2{grid-column:1/-1;grid-row:1;font-size:17px}
  #dashboard-view .chart-heading .muted{grid-column:1/-1;grid-row:2;margin-bottom:4px}
  #dashboard-view .chart-control-group>small{
    display:block;
    align-self:end;
    color:#71809a;
    font-size:12px;
    font-weight:800;
  }
  #dashboard-view .chart-control-group:first-child>small{grid-column:1;grid-row:3}
  #dashboard-view .chart-control-group:last-child>small{grid-column:2;grid-row:3}
  #dashboard-view .chart-date-basis{
    grid-column:1;
    grid-row:4;
    width:100%;
    min-height:52px;
    padding:4px;
    border-radius:13px;
    margin:0;
  }
  #dashboard-view .chart-date-basis button{min-height:42px;font-size:13px;border-radius:9px}
  #dashboard-view .chart-metric-select{
    grid-column:2;
    grid-row:4;
    width:100%;
    min-width:0!important;
    margin:0;
    transform:none;
  }
  #dashboard-view .chart-metric-select .chart-menu{width:100%}
  #dashboard-view #chart-metric-button{position:relative;width:100%!important;min-height:52px!important;height:52px!important;padding:0 9px!important;gap:8px!important;font-size:14px!important;border-radius:13px!important}
  #dashboard-view #chart-metric-button .year-chevron{
    position:relative;
    top:0;
    right:auto;
    left:auto;
    margin:0;
    transform:none;
  }
  #dashboard-view .bar-chart{height:200px;margin-top:2px}
}

/* v2.4.18: align every main heading to Work Links and keep iPhone controls readable. */
:is(#dashboard-view,#transactions-view,#customers-view,#links-view,#tax-view)>.page-heading{
  align-items:flex-end;
  margin-bottom:26px;
}
:is(#dashboard-view,#transactions-view,#customers-view,#links-view,#tax-view)>.page-heading .eyebrow{display:none!important}
:is(#dashboard-view,#transactions-view,#customers-view,#links-view,#tax-view)>.page-heading h1{
  margin:0;
  font-size:36px;
  font-weight:780;
  line-height:1.15;
  letter-spacing:-.045em;
}
:is(#dashboard-view,#transactions-view,#customers-view,#links-view,#tax-view)>.page-heading .muted{
  margin:8px 0 0;
  font-size:14px;
  line-height:1.45;
}

/* Work Links gets the same one-tap clear X as the other search fields. */
#links-view .work-links-search>.search-clear-control{display:block;min-width:0}
#links-view .work-links-search .search-clear-button{right:13px;background:#e4ebf7;color:#496383}
#links-view .work-links-search .search-clear-button:hover{background:#d7e3f5;color:#155eef}

@media(max-width:780px){
  .shell{padding-top:24px}
  :is(#dashboard-view,#transactions-view,#customers-view,#links-view,#tax-view)>.page-heading{
    margin-bottom:22px;
  }
  :is(#dashboard-view,#transactions-view,#customers-view,#links-view,#tax-view)>.page-heading h1{
    margin:0;
    font-size:32px;
    line-height:1.15;
  }
  :is(#dashboard-view,#transactions-view,#customers-view,#links-view,#tax-view)>.page-heading .muted{
    margin-top:7px;
    font-size:14px;
    line-height:1.45;
  }

  #transactions-view .page-heading{align-items:center;gap:10px}
  #transactions-view .heading-actions{align-self:center;margin-top:0}
  #transactions-view section.filters.transaction-filter-toolbar .filter-search input{
    font-size:14px!important;
    letter-spacing:-.2px;
  }
  #transactions-view .active-filter-chips{overflow:visible!important}
  #transactions-view .active-filter-chip{
    flex:0 0 auto;
    max-width:none!important;
  }
  #transactions-view .active-filter-chip>span{
    overflow:visible!important;
    text-overflow:clip!important;
    white-space:nowrap!important;
  }

  #tax-view .tax-heading{grid-template-rows:auto auto!important}
  #tax-view .tax-heading h1{grid-column:1!important;grid-row:1!important}
  #tax-view .tax-heading .muted{grid-column:1/-1!important;grid-row:2!important}
  #tax-view .tax-heading-tools{grid-column:2!important;grid-row:1!important}

  .site-footer{
    display:grid;
    grid-template-columns:auto auto auto;
    justify-content:start;
    gap:3px 7px;
    width:100%;
    margin-top:-38px;
    padding-right:88px;
    padding-bottom:calc(110px + env(safe-area-inset-bottom));
    padding-left:20px;
  }
  .site-footer .footer-sign-out{
    grid-column:1/-1;
    justify-self:start;
    margin:2px 0 0;
    padding:2px 0;
  }
}

@media(max-width:380px){
  #transactions-view section.filters.transaction-filter-toolbar .filter-search input{font-size:13.5px!important}
}

/* v2.4.19: use one search-card language on desktop and iPhone. */
:is(#dashboard-view,#transactions-view,#customers-view,#links-view,#tax-view)>.page-heading{
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",sans-serif;
}

#transactions-view section.filters.transaction-filter-toolbar,
#customers-view .customer-directory-tools,
#tax-view>.tax-directory-tools,
#links-view .work-links-searchbar{
  border:1px solid #d8e3f4!important;
  border-radius:17px!important;
  background:#f3f7ff!important;
  box-shadow:0 5px 16px rgba(38,68,122,.07)!important;
}
#customers-view .customer-directory-tools,
#tax-view>.tax-directory-tools{
  display:block!important;
  padding:8px!important;
}
#customers-view .customer-directory-tools:focus-within,
#tax-view>.tax-directory-tools:focus-within,
#links-view .work-links-searchbar:focus-within,
#transactions-view section.filters.transaction-filter-toolbar:focus-within{
  border-color:#aac2ef!important;
  box-shadow:0 0 0 3px rgba(21,94,239,.08),0 5px 16px rgba(38,68,122,.07)!important;
}
#customers-view .customer-directory-tools{width:min(420px,100%)!important}
#tax-view>.tax-directory-tools{
  width:100%!important;
  max-width:none!important;
  margin:2px 0 18px!important;
}
#customers-view .customer-directory-tools input,
#tax-view>.tax-directory-tools input{
  width:100%!important;
  height:50px!important;
  padding:0 42px 0 48px!important;
  border:1px solid #b9ccef!important;
  border-radius:12px!important;
  background-color:#fff!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23155eef' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='m15.5 15.5 4.5 4.5'/%3E%3C/svg%3E")!important;
  background-position:16px center!important;
  background-repeat:no-repeat!important;
  background-size:22px 22px!important;
  font-size:16px!important;
  box-shadow:0 1px 4px rgba(37,74,137,.06)!important;
}
#links-view .work-links-searchbar{padding:10px!important}
#links-view .work-links-search input{height:50px!important;border-color:#b9ccef!important}
#links-view .work-links-search>.work-links-search-icon{color:#155eef!important}
#transactions-view section.filters.transaction-filter-toolbar{padding:8px!important}
#transactions-view section.filters.transaction-filter-toolbar .filter-search input{
  height:50px!important;
  padding:0 40px 0 48px!important;
  border:1px solid #b9ccef!important;
  border-radius:12px!important;
  background:#fff!important;
  box-shadow:0 1px 4px rgba(37,74,137,.06)!important;
}
#transactions-view .filter-search:before{
  left:16px!important;
  z-index:3;
  width:22px!important;
  height:22px!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23155eef' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5'/%3E%3Cpath d='m15.5 15.5 4.5 4.5'/%3E%3C/svg%3E")!important;
  background-size:22px 22px!important;
}
#transactions-view .filter-toggle{height:50px!important}

@media(max-width:780px){
  #links-view .work-links-form{row-gap:18px!important}
  #links-view .work-link-destination-row{row-gap:14px!important}
  #transactions-view section.filters.transaction-filter-toolbar{margin-top:8px!important}
  #customers-view .customer-directory-tools{width:100%!important}
}

/* v2.4.20: final heading, year and search spacing pass. */
#links-view>.work-links-heading{
  width:100%!important;
  margin-right:0!important;
  margin-left:0!important;
  padding-right:0!important;
  padding-left:0!important;
  transform:none!important;
}

/* Search fields stay white and quiet while focused; no blue glow or halo. */
#customers-view .customer-directory-tools:focus-within,
#tax-view>.tax-directory-tools:focus-within,
#links-view .work-links-searchbar:focus-within,
#transactions-view section.filters.transaction-filter-toolbar:focus-within{
  border-color:#d8e3f4!important;
  box-shadow:0 5px 16px rgba(38,68,122,.07)!important;
}
#customers-view .customer-directory-tools input:focus,
#tax-view>.tax-directory-tools input:focus,
#links-view .work-links-search input:focus,
#transactions-view section.filters.transaction-filter-toolbar .filter-search input:focus{
  outline:0!important;
  border-color:#b9ccef!important;
  background-color:#fff!important;
  box-shadow:0 1px 4px rgba(37,74,137,.06)!important;
}
:is(#customers-view,#tax-view,#links-view,#transactions-view) .search-clear-button:focus-visible{outline:0!important}

/* Move Transactions search down but reclaim the space below it. */
#transactions-view>.page-heading{margin-bottom:34px!important}
#transactions-view section.filters.transaction-filter-toolbar{
  margin-top:0!important;
  margin-bottom:10px!important;
}

@media(min-width:781px){
  :is(#dashboard-view,#transactions-view,#customers-view,#links-view,#tax-view)>.page-heading .muted{
    font-size:16px!important;
    line-height:1.5!important;
  }

  /* Desktop year controls share the description baseline. */
  #dashboard-view .dashboard-heading>div:first-child{
    position:relative;
    width:100%;
  }
  #dashboard-view .dashboard-title-line{display:block!important}
  #dashboard-view .dashboard-title-line .dashboard-year-picker{
    position:absolute!important;
    right:0!important;
    bottom:0!important;
    margin:0!important;
  }
  #tax-view .tax-heading{
    position:relative!important;
    display:block!important;
  }
  #tax-view .tax-heading>div:first-child{width:100%}
  #tax-view .tax-heading-tools{
    position:absolute!important;
    right:0!important;
    bottom:0!important;
    width:auto!important;
    max-width:none!important;
    margin:0!important;
  }

  /* Customer search remains compact on desktop. */
  #customers-view .customer-directory-tools{
    width:300px!important;
    padding:6px!important;
    border-radius:14px!important;
  }
  #customers-view .customer-directory-tools input{
    height:44px!important;
    padding-right:38px!important;
    padding-left:42px!important;
    background-position:14px center!important;
    background-size:19px 19px!important;
    font-size:14px!important;
  }
}

@media(max-width:780px){
  #links-view{width:100%!important;max-width:none!important;margin-right:0!important;margin-left:0!important}
  #links-view>.work-links-heading{margin-bottom:22px!important}
  #transactions-view>.page-heading{margin-bottom:34px!important}
  #transactions-view section.filters.transaction-filter-toolbar{margin-bottom:10px!important}
}

/* v2.4.21: keep search controls neutral and rebalance the compact layouts. */
#customers-view .customer-directory-tools input,
#customers-view .customer-directory-tools input:hover,
#customers-view .customer-directory-tools input:focus,
#customers-view .customer-directory-tools input:focus-visible,
#customers-view .customer-directory-tools input:active,
#tax-view>.tax-directory-tools input,
#tax-view>.tax-directory-tools input:hover,
#tax-view>.tax-directory-tools input:focus,
#tax-view>.tax-directory-tools input:focus-visible,
#tax-view>.tax-directory-tools input:active,
#links-view .work-links-search input,
#links-view .work-links-search input:hover,
#links-view .work-links-search input:focus,
#links-view .work-links-search input:focus-visible,
#links-view .work-links-search input:active,
#transactions-view section.filters.transaction-filter-toolbar .filter-search input,
#transactions-view section.filters.transaction-filter-toolbar .filter-search input:hover,
#transactions-view section.filters.transaction-filter-toolbar .filter-search input:focus,
#transactions-view section.filters.transaction-filter-toolbar .filter-search input:focus-visible,
#transactions-view section.filters.transaction-filter-toolbar .filter-search input:active{
  outline:0!important;
  border-color:#b9ccef!important;
  background-color:#fff!important;
  box-shadow:0 1px 4px rgba(37,74,137,.06)!important;
  -webkit-appearance:none!important;
  appearance:none!important;
}
#links-view .work-links-search input,
#links-view .work-links-search input:hover,
#links-view .work-links-search input:focus,
#links-view .work-links-search input:focus-visible,
#links-view .work-links-search input:active,
#transactions-view section.filters.transaction-filter-toolbar .filter-search input,
#transactions-view section.filters.transaction-filter-toolbar .filter-search input:hover,
#transactions-view section.filters.transaction-filter-toolbar .filter-search input:focus,
#transactions-view section.filters.transaction-filter-toolbar .filter-search input:focus-visible,
#transactions-view section.filters.transaction-filter-toolbar .filter-search input:active{
  background:#fff!important;
}

@media(min-width:781px){
  #customers-view .customer-directory-tools{
    padding:4px!important;
    border-radius:12px!important;
  }
  #customers-view .customer-directory-tools input{
    height:36px!important;
    padding-right:36px!important;
    padding-left:38px!important;
    background-position:12px center!important;
    background-size:17px 17px!important;
    font-size:13px!important;
  }
}

@media(max-width:780px){
  #links-view>.work-links-heading{
    display:flex!important;
    align-items:flex-start!important;
    text-align:left!important;
  }
  #links-view>.work-links-heading>div{
    width:100%!important;
    text-align:left!important;
  }
  #links-view .work-links-form{
    gap:0!important;
    row-gap:0!important;
  }
  #links-view .work-link-display-field,
  #links-view .work-link-slug-field{
    margin:0 0 22px!important;
  }
  #links-view .work-link-field-heading{
    min-height:0!important;
    margin:0 0 8px!important;
  }
  #links-view .work-links-form input{
    margin-top:0!important;
  }
  #links-view .work-link-destination-row{
    gap:14px!important;
    row-gap:14px!important;
  }
  #links-view .work-link-destination-field{
    display:block!important;
    margin:0!important;
  }
  #links-view .work-link-destination-field>input{
    margin-top:8px!important;
  }

  #transactions-view>.page-heading{margin-bottom:26px!important}
  #transactions-view section.filters.transaction-filter-toolbar{margin-bottom:2px!important}
}

/* v2.4.24: match the shared desktop width and equalize every mobile label-to-field gap. */
.work-link-destination-label{display:block}
@media(min-width:781px){
  #links-view{width:100%!important;max-width:none!important}
}
@media(max-width:780px){
  #links-view .work-link-field-heading,
  #links-view .work-link-destination-label{
    display:flex!important;
    align-items:flex-end!important;
    height:28px!important;
    min-height:28px!important;
    margin:0 0 8px!important;
    line-height:1.3!important;
  }
  #links-view .work-link-destination-field>input{margin-top:0!important}
}

/* v2.4.25: improve desktop readability in the Transactions table only. */
@media(min-width:781px){
  #transactions-view .table-panel>.section-heading #result-count{font-size:16px}
  #transactions-view .table-panel>.section-heading .table-export{font-size:14px}
  #transactions-view .table-panel thead th{font-size:13px}
  #transactions-view .table-panel tbody td{font-size:16px}
  #transactions-view .table-panel .job-edit-button{font-size:16px}
  #transactions-view .table-panel .job-customer{font-size:14px}
  #transactions-view .table-panel .client-kind,
  #transactions-view .table-panel .fastwork-customer-tag{font-size:11px}
  #transactions-view .table-panel .channel-chip{font-size:13px}
  #transactions-view .table-panel .channel-order{font-size:12px}
  #transactions-view .table-panel .transaction-gross>strong,
  #transactions-view .table-panel .net-table-amount{font-size:17px}
  #transactions-view .table-panel .deduction-info{font-size:12px}
  #transactions-view .table-panel .status{font-size:12px}
  #transactions-view .table-panel .payment-status-badge{font-size:11px}
}

/* v2.5.0: keep both document-import actions usable without squeezing the iPhone heading. */
@media(max-width:780px){
  #transactions-view .page-heading{
    grid-template-columns:minmax(0,1fr);
    align-items:start;
    gap:14px;
  }
  #transactions-view .heading-actions{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    width:100%;
    margin-top:0;
    gap:8px;
  }
  #transactions-view .heading-actions #import-document,
  #transactions-view .heading-actions #quick-template{
    width:100%;
    min-width:0;
    height:44px;
    padding:0 10px;
    font-size:14px;
    white-space:nowrap;
  }
}

/* v2.5.1: keep the desktop channel heading on one line and center empty values. */
@media(min-width:781px){
  #transactions-view .table-panel thead th:nth-child(3){white-space:nowrap}
  #transactions-view .table-panel .channel-cell.channel-empty{text-align:center}
}

/* v2.8.5: align the existing Work Links form and add quiet field cues. */
#links-view .work-links-form{column-gap:14px!important;row-gap:12px!important}
#links-view .work-link-field-heading{min-height:26px!important;align-items:center!important}
#links-view .work-link-destination-label{display:flex;min-height:26px;align-items:center;margin:0 0 6px}
#links-view .work-links-form input{
  height:46px!important;
  margin-top:6px!important;
  padding-right:14px!important;
  padding-left:44px!important;
  background-color:#fafafa!important;
  background-position:15px center!important;
  background-repeat:no-repeat!important;
  background-size:19px 19px!important;
}
#links-view .work-links-form input:focus{background-color:#fff!important}
#links-view #work-link-display-name{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23677b99' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='3.5' width='14' height='17' rx='2'/%3E%3Cpath d='M8.5 8h7M8.5 12h7M8.5 16h4.5'/%3E%3C/svg%3E")!important}
#links-view #work-link-slug{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23677b99' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9.5 14.5 5-5'/%3E%3Cpath d='M7.2 16.8 5.7 18.3a3.25 3.25 0 0 1-4.6-4.6l3-3a3.25 3.25 0 0 1 4.6 0' transform='translate(3 0)'/%3E%3Cpath d='m16.8 7.2 1.5-1.5a3.25 3.25 0 0 1 4.6 4.6l-3 3a3.25 3.25 0 0 1-4.6 0' transform='translate(-3 0)'/%3E%3C/svg%3E")!important}
#links-view #work-link-destination{margin-top:0!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23677b99' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3a14 14 0 0 1 0 18M12 3a14 14 0 0 0 0 18'/%3E%3C/svg%3E")!important}
#links-view .work-link-destination-row{gap:12px!important;align-items:end!important}
#links-view .work-links-form-actions{align-items:center!important}

@media(max-width:780px){
  #links-view .work-links-form{gap:0!important;row-gap:0!important}
  #links-view .work-link-display-field,
  #links-view .work-link-slug-field{margin:0 0 14px!important}
  #links-view .work-link-field-heading,
  #links-view .work-link-destination-label{
    height:24px!important;
    min-height:24px!important;
    align-items:center!important;
    margin:0 0 6px!important;
  }
  #links-view .work-links-form input{height:48px!important;margin-top:0!important;padding-left:44px!important;background-position:14px center!important;background-size:20px 20px!important}
  #links-view .work-link-destination-row{gap:14px!important;row-gap:14px!important}
  #links-view .work-links-form-actions button{height:48px!important}
}

/* v2.8.17: align the two mobile tracking cards with the deduction cards. */
@media(max-width:780px){
  #dashboard-view .tracking-overview>.tracking-card{
    display:flex!important;
    min-height:132px!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:center!important;
    gap:0!important;
    padding:8px!important;
  }
  #dashboard-view .tracking-overview>.tracking-card .summary-icon{
    display:grid!important;
    width:38px!important;
    height:38px!important;
    flex:0 0 38px!important;
    align-self:flex-start!important;
    margin:0 0 6px!important;
  }
  #dashboard-view .tracking-overview>.tracking-card>p,
  #dashboard-view .tracking-overview>.tracking-card>strong,
  #dashboard-view .tracking-overview>.tracking-card>small{
    display:block!important;
    min-height:0!important;
    align-self:flex-start!important;
    margin:0!important;
    text-align:left!important;
  }
  #dashboard-view .tracking-overview>.tracking-card>p{max-width:82%;margin-bottom:3px!important}
  #dashboard-view .tracking-overview>.tracking-card>strong{margin-bottom:3px!important}
  #dashboard-view .tracking-overview>.tracking-card>small{max-width:68%!important}
  #dashboard-view .tracking-overview>.tracking-card>.summary-card-art{right:-10px!important;bottom:-3px!important;width:106px!important;height:92px!important}
}

/* v2.8.18: keep both mobile tracking cards on identical vertical tracks. */
@media(max-width:780px){
  #dashboard-view .financial-flow-deduction-grid>.financial-flow-item{min-height:148px!important}
  #dashboard-view .tracking-overview{min-height:172px!important}
  #dashboard-view .tracking-overview>.tracking-card{
    display:grid!important;
    min-height:148px!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:38px 22px 34px 30px!important;
    align-content:center!important;
    align-items:start!important;
    justify-items:start!important;
  }
  #dashboard-view .tracking-overview>.tracking-card .summary-icon,
  #dashboard-view .tracking-overview>.tracking-card>p,
  #dashboard-view .tracking-overview>.tracking-card>strong,
  #dashboard-view .tracking-overview>.tracking-card>small{
    grid-column:1!important;
    align-self:start!important;
  }
  #dashboard-view .tracking-overview>.tracking-card .summary-icon{grid-row:1!important;margin:0!important}
  #dashboard-view .tracking-overview>.tracking-card>p{grid-row:2!important;max-width:calc(100% - 18px)!important;margin:0!important}
  #dashboard-view .tracking-overview>.tracking-card>strong{grid-row:3!important;margin:0!important}
  #dashboard-view .tracking-overview>.tracking-card>small{grid-row:4!important;margin:0!important}
}

/* v2.8.20: unified mobile sheets and matching summary icons. */
#dashboard-view .tracking-overview>.tracking-card .summary-icon{font-size:19px!important}
@media(max-width:780px){
  #dashboard-view .tracking-overview>.tracking-card .summary-icon{width:34px!important;height:34px!important;flex-basis:34px!important;font-size:16px!important}
  /* v2.8.34: move the complete text block down 2px, matching the deduction
     cards' 6px icon gap without moving the icons/arrows or changing card height. */
  #dashboard-view .tracking-overview>.tracking-card>p,
  #dashboard-view .tracking-overview>.tracking-card>strong,
  #dashboard-view .tracking-overview>.tracking-card>small{top:2px!important}
  .add-action-menu{
    padding-bottom:calc(28px + env(safe-area-inset-bottom))!important;
    background:#fff!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    -webkit-backface-visibility:hidden;
    backface-visibility:hidden;
    will-change:transform;
  }
  .add-action-cancel{margin-top:12px!important;margin-bottom:4px!important}
  #transactions-view section.filters.transaction-filter-toolbar>.filter-panel{
    display:grid!important;
    background:#fff!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    opacity:1;
    transform:translate3d(0,calc(100% + 30px),0);
    transition:transform .22s ease-in;
    -webkit-backface-visibility:hidden;
    backface-visibility:hidden;
    will-change:transform;
  }
  #transactions-view section.filters.transaction-filter-toolbar>.filter-panel.is-open{transform:translate3d(0,0,0);transition-timing-function:ease-out}
  #filter-backdrop:not(.hidden){display:block!important;opacity:0;transition:opacity .2s ease}
  #filter-backdrop:not(.hidden).is-open{opacity:1}
}

/* v2.8.21: stable mobile sheet surfaces and viewport-aware filter menus. */
@media(max-width:780px){
  #transactions-view .filter-menu.opens-up .filter-menu-options{
    top:auto!important;
    bottom:calc(100% + 6px)!important;
  }
  .add-action-backdrop[hidden]{
    display:block!important;
    visibility:hidden!important;
    opacity:0!important;
    pointer-events:none!important;
  }
  .add-action-backdrop{
    background:rgba(19,29,47,.46)!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    -webkit-backface-visibility:hidden;
    backface-visibility:hidden;
    will-change:opacity;
  }
  .add-action-backdrop.is-open{
    visibility:visible!important;
    pointer-events:auto!important;
  }
  #filter-backdrop{
    position:fixed!important;
    inset:0!important;
    z-index:44!important;
    display:block!important;
    visibility:visible;
    border:0!important;
    background:rgba(19,29,47,.46)!important;
    opacity:0;
    pointer-events:none;
    transition:opacity .2s ease;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    -webkit-backface-visibility:hidden;
    backface-visibility:hidden;
    will-change:opacity;
  }
  #filter-backdrop.hidden{
    display:block!important;
    visibility:hidden!important;
    opacity:0!important;
    pointer-events:none!important;
  }
  #filter-backdrop.is-open{
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
  }
  #transactions-view section.filters.transaction-filter-toolbar>.filter-panel,
  .add-action-menu{
    background:#fff!important;
    -webkit-transform-style:preserve-3d;
    transform-style:preserve-3d;
  }
  html.add-action-open,
  body.add-action-open,
  html.filter-panel-open,
  body.filter-panel-open{
    overflow:hidden!important;
    overscroll-behavior:none!important;
  }
}

/* v2.8.22: avoid iOS viewport repaint while mobile sheets animate. */
@media(max-width:780px){
  .add-action-backdrop,
  #filter-backdrop{
    touch-action:none!important;
    overscroll-behavior:contain!important;
  }
  .add-action-menu,
  #transactions-view section.filters.transaction-filter-toolbar>.filter-panel{
    background-color:#fff!important;
    background-image:none!important;
    background-clip:padding-box!important;
    border-top:0!important;
    isolation:isolate;
    contain:paint;
  }
  .add-action-menu-head,
  #transactions-view .filter-panel-header{
    background:#fff!important;
  }
  #transactions-view .filter-panel-header button{
    top:18px!important;
    right:22px!important;
  }
  html.add-action-open,
  body.add-action-open,
  html.filter-panel-open,
  body.filter-panel-open{
    overflow:visible!important;
    overscroll-behavior:auto!important;
  }
}

/* v2.8.23: keep mobile sheets mounted and transition in one paint phase. */
@media(max-width:780px){
  html{
    /* v2.8.32: sheet sliding is independent of the page/status-area dimming. */
    --mobile-sheet-slide-duration:.2s;
    /* v2.8.31: a flatter velocity curve reduces contrast from the native tint's frame lag. */
    --mobile-sheet-dim-duration:.24s;
    --mobile-sheet-dim-easing:cubic-bezier(.25,.1,.75,.9);
    --mobile-sheet-native-frame-lag:16.667ms;
  }
  .add-action-menu[hidden]{display:block!important}
  #transactions-view section.filters.transaction-filter-toolbar>.filter-panel.hidden{display:grid!important}
  .add-action-menu,
  #transactions-view section.filters.transaction-filter-toolbar>.filter-panel{
    visibility:hidden!important;
    pointer-events:none!important;
    transition:transform var(--mobile-sheet-slide-duration) ease-in,visibility 0s linear var(--mobile-sheet-slide-duration)!important;
  }
  .add-action-menu.is-open,
  #transactions-view section.filters.transaction-filter-toolbar>.filter-panel.is-open{
    visibility:visible!important;
    pointer-events:auto!important;
    transition:transform var(--mobile-sheet-slide-duration) ease-out,visibility 0s linear 0s!important;
  }
  .add-action-backdrop,
  #filter-backdrop{
    visibility:hidden!important;
    pointer-events:none!important;
    transition:opacity var(--mobile-sheet-dim-duration) var(--mobile-sheet-dim-easing),visibility 0s linear var(--mobile-sheet-dim-duration)!important;
  }
  .add-action-backdrop.is-open,
  #filter-backdrop.is-open{
    visibility:visible!important;
    pointer-events:auto!important;
    transition:opacity var(--mobile-sheet-dim-duration) var(--mobile-sheet-dim-easing),visibility 0s linear 0s!important;
  }
}

/* v2.8.26: dim the document without triggering Safari's fixed-edge status-bar tint. */
@media(max-width:780px){
  .add-action-backdrop,
  #filter-backdrop,
  #filter-backdrop:not(.hidden){
    position:absolute!important;
    inset:auto 0 auto 0!important;
    /* JS tracks the visual viewport in document coordinates, including after scrolling. */
    top:var(--sheet-backdrop-top,0px)!important;
    height:100dvh;
  }
}

/* v2.8.29: one dimming timeline for the page and a persistent, opaque top-edge surface.
   WebKit samples a fixed element's background-color, not its animated opacity.
   Keeping this small edge surface mounted avoids switching native sampling targets. */
@property --mobile-sheet-dim-progress{
  syntax:"<number>";
  inherits:true;
  initial-value:0;
}
@property --mobile-sheet-page-progress{
  syntax:"<number>";
  inherits:true;
  initial-value:0;
}
#mobile-sheet-top-surface{display:none}
@media(max-width:780px){
  html.iphone-interaction-locked{
    --mobile-sheet-dim-progress:0;
    --mobile-sheet-page-progress:0;
    /* v2.8.33: native status tint is presented one frame after its sampled CSS color.
       Delay the visible page, not the sheet; both fade curves remain identical. */
    transition:--mobile-sheet-dim-progress var(--mobile-sheet-dim-duration) var(--mobile-sheet-dim-easing),--mobile-sheet-page-progress var(--mobile-sheet-dim-duration) var(--mobile-sheet-dim-easing) var(--mobile-sheet-native-frame-lag);
  }
  html.iphone-interaction-locked:has(.add-action-backdrop.is-open,#filter-backdrop.is-open){
    --mobile-sheet-dim-progress:1;
    --mobile-sheet-page-progress:1;
  }
  html.iphone-interaction-locked #mobile-sheet-top-surface{
    display:block;
    position:fixed;
    inset:0 0 auto;
    height:12px;
    z-index:1301;
    pointer-events:none;
    /* More than 10px tall so WebKit uses the resolved opaque color, not a pixel snapshot. */
    background-color:rgb(calc(255 - var(--mobile-sheet-dim-progress) * 108.56) calc(255 - var(--mobile-sheet-dim-progress) * 103.96) calc(255 - var(--mobile-sheet-dim-progress) * 95.68));
    /* WebKit reads background-color for native tint; the flat image paints the
       same delayed color as the page so the 12px strip never exposes a lead. */
    background-image:linear-gradient(rgb(calc(255 - var(--mobile-sheet-page-progress) * 108.56) calc(255 - var(--mobile-sheet-page-progress) * 103.96) calc(255 - var(--mobile-sheet-page-progress) * 95.68)),rgb(calc(255 - var(--mobile-sheet-page-progress) * 108.56) calc(255 - var(--mobile-sheet-page-progress) * 103.96) calc(255 - var(--mobile-sheet-page-progress) * 95.68)));
  }
  html.iphone-interaction-locked .add-action-backdrop,
  html.iphone-interaction-locked #filter-backdrop,
  html.iphone-interaction-locked .add-action-backdrop.is-open,
  html.iphone-interaction-locked #filter-backdrop.is-open{
    opacity:var(--mobile-sheet-page-progress)!important;
    transition:visibility 0s linear calc(var(--mobile-sheet-dim-duration) + var(--mobile-sheet-native-frame-lag))!important;
  }
  html.iphone-interaction-locked .add-action-backdrop.is-open,
  html.iphone-interaction-locked #filter-backdrop.is-open{
    transition-delay:0s!important;
  }
}
@media(max-width:780px) and (prefers-reduced-motion:reduce){
  html{--mobile-sheet-slide-duration:0s;--mobile-sheet-dim-duration:0s;--mobile-sheet-native-frame-lag:0s!important}
  html.iphone-interaction-locked{transition:none}
}

/* Shared placeholder weight, including dynamically created form fields.
   Keep the existing font family, colors and typed-value weights unchanged. */
input::placeholder,
textarea::placeholder{font-weight:400!important}

/* Equal space on both sides keeps picker text centered independently of its
   right-side chevron, in native desktop selects and mobile custom buttons. */
#transaction-dialog #client-type,
#transaction-dialog #channel{
  padding:0 48px!important;
  text-align:center;
  text-align-last:center;
}
#transaction-dialog #client-type{height:100%!important;min-height:0!important}
#transaction-dialog .form-select-button{padding:0 48px!important}

/* Compact money/deductions section only; existing inputs, calculations and
   the rest of the transaction modal keep their original behavior/design. */
#transaction-form .money-section{background:#fff;margin:0 0 16px;padding:16px 0 0;border-bottom:0}
#transaction-form .money-section-heading{display:block;margin:0 0 12px}
#transaction-form .money-section>.form-grid{gap:8px 15px;margin:0}
#transaction-form .money-section .money-gross-field{grid-column:1/-1;min-width:0;gap:8px}
#transaction-form .money-gross-control{display:flex;align-items:center;gap:10px;width:100%;min-width:0;padding:3px 16px;border:1px solid #bcd0fb;border-radius:12px;background:#f5f8ff}
#transaction-form .money-currency-symbol{flex:none;font-size:24px;font-weight:700;color:#155eef}
#transaction-form .money-gross-control #gross-amount{height:52px;min-height:52px;min-width:0;padding:8px 0;border:0;border-radius:0;background:transparent;color:#155eef;font-size:26px;font-weight:800;font-variant-numeric:tabular-nums}
#transaction-form .money-tax-row{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0}
#transaction-form .money-tax-row:has(>#withholding-applies-field.hidden){display:none}
#transaction-form .money-tax-row #withholding-applies-field{flex:1;align-self:center;gap:8px;min-height:44px;margin:0;padding:4px 0!important;border:0;border-radius:0;background:transparent;font-size:13px;font-weight:700;line-height:1.45;white-space:normal}
#transaction-form .money-tax-row #withholding-applies{flex:0 0 18px;margin:0;accent-color:#155eef}
#transaction-form .money-tax-value{display:flex;align-items:center;gap:5px;flex:0 0 auto;min-width:0;font-size:12px;color:#7b8aa4}
#transaction-form .money-tax-value #withholding-tax{width:108px;height:38px;min-height:38px;padding:4px 0;border:0;background:transparent;text-align:right;font-weight:600;font-variant-numeric:tabular-nums;color:#61718b}
#transaction-form #fastwork-card{min-width:0;gap:10px 15px;margin:0;padding:0;border:0;border-radius:0;background:transparent}
#transaction-form .money-tax-row:not(:has(>#withholding-applies-field.hidden)) + #fastwork-card{margin-top:-8px}
#transaction-form #fastwork-card::before{content:none}
#transaction-form #fastwork-card #fee-applies-field{margin:0;min-height:28px;padding:4px 0}
#transaction-form #fastwork-card .fastwork-fee-controls{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 12px;min-width:0}
#transaction-form #fastwork-card .fastwork-fee-controls #fee-applies-field{flex:1 1 220px;width:auto;min-width:0}
#transaction-form #fastwork-card .fastwork-fee-controls #fee-percent-field{flex:0 0 auto;width:auto;margin:0 0 0 auto;justify-content:flex-end;gap:8px}
#transaction-form #fastwork-card .fee-rate-caption{display:none}
#transaction-form #fastwork-card .fastwork-fee-controls #fee-percent-field.hidden{display:flex!important;visibility:hidden;pointer-events:none}
@media(max-width:780px){
  #transaction-form #fastwork-card .fastwork-fee-controls{flex-wrap:nowrap;column-gap:8px}
  #transaction-form #fastwork-card .fastwork-fee-controls #fee-applies-field{flex-basis:0}
}
#transaction-form #fastwork-card #fee-percent-field{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0}
#transaction-form #fastwork-card #fee-percent{flex:0 0 68px;width:68px;min-width:0;height:34px;min-height:34px;padding:0 18px;text-align:center;text-align-last:center;font-size:14px;background-size:14px 18px;background-position:right 4px center}
#transaction-form #fastwork-card #fee-amount-field,
#transaction-form #fastwork-card #fee-vat-field{min-width:0;gap:6px}
#transaction-form #fastwork-card #fee,
#transaction-form #fastwork-card #fee-vat{font-variant-numeric:tabular-nums}
#transaction-form #fastwork-card .fee-note{font-weight:400;line-height:1.55}
#transaction-form #fastwork-card .fee-label-mobile{display:none}
#transaction-form #fastwork-note .fee-note-mobile{display:none}
#transaction-form .money-section .net-field-wide{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 16px;width:100%;max-width:none;min-width:0;margin:0;padding:14px 16px;border:1px solid #b9dfca;border-radius:12px;background:#edf9f2;color:#087443}
#transaction-form .money-section .net-field-wide #net-amount{flex:1 1 180px;width:180px;min-width:0;height:38px;min-height:38px;margin:0;padding:0;border:0;border-radius:0;background:transparent;color:#087443!important;text-align:right;font-size:24px;font-weight:800;font-variant-numeric:tabular-nums}
@media(min-width:781px){
  #transaction-form .money-section :is(#gross-amount,#net-amount,#withholding-tax):focus{outline:0;box-shadow:none}
  #transaction-form .money-gross-control:focus-within{border-color:#155eef;box-shadow:0 0 0 2px rgba(21,94,239,.12)}
  #transaction-form .net-field-wide:focus-within{border-color:#79bf98}
}
@media(max-width:780px){
  #transaction-form .money-section{padding:16px 0 0}
  #transaction-form .money-gross-control{padding-inline:12px}
  #transaction-form .money-tax-row{gap:6px;flex-wrap:wrap}
  #transaction-form .money-tax-row #withholding-applies-field{font-size:12px;flex:1 1 170px}
  #transaction-form .money-tax-value{margin-left:auto}
  #transaction-form .money-tax-value #withholding-tax{width:94px}
  #transaction-form #fastwork-card{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  #transaction-form #fastwork-card .fee-label-desktop{display:none}
  #transaction-form #fastwork-card .fee-label-mobile{display:block;font-size:11px;line-height:1.45;white-space:nowrap}
  #transaction-form #fastwork-card #fee-percent{flex-basis:68px;width:68px;font-size:16px}
  #transaction-form #fastwork-note .fee-note-desktop{display:none}
  #transaction-form #fastwork-note .fee-note-mobile{display:block;white-space:nowrap;font-size:11px}
  #transaction-form .money-section .net-field-wide{padding:12px;gap:6px 10px}
  #transaction-form .money-section .net-field-wide #net-amount{flex-basis:145px;width:145px;font-size:20px}
}
@media(max-width:360px){#transaction-form #fastwork-note .fee-note-mobile{white-space:normal}}
@media(max-width:360px){#transaction-form #fastwork-card .fee-label-mobile{font-size:10px}}

/* Desktop header: equal side tracks center navigation on the header itself.
   Reuse the iPhone SVG masks verbatim; mobile rules and controls are unchanged. */
.header-actions{display:contents}
@media(min-width:781px){
  .topbar{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);height:84px;gap:0}
  .add-action-menu{top:92px}
  .pdf-drop-overlay{top:84px}
  .topbar>.brand{grid-column:1;grid-row:1;justify-self:start}
  .topbar .navigation-shell>nav{grid-column:2;grid-row:1;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:12px;width:max-content;max-width:calc(100vw - 552px);min-width:0;margin:0}
  .topbar .header-actions{grid-column:3;grid-row:1;display:flex;align-items:center;justify-content:flex-end;justify-self:end;gap:12px;white-space:nowrap}
  .topbar .navigation-shell>nav>.nav-link{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:9px 12px;border-radius:8px;background:transparent;color:#687b98;font-size:15px;font-weight:650;line-height:1.35;white-space:nowrap}
  .topbar .navigation-shell>nav>.nav-link:hover{background:#f3f7ff;color:#155eef}
  .topbar .navigation-shell>nav>.nav-link.active{background:#eaf1ff;color:#155eef}
  .topbar .navigation-shell>nav>.nav-link::before{display:block;flex:0 0 22px;width:22px;height:22px;background-color:currentColor;-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain}
  .navigation-shell .nav-link[data-view="dashboard"]::before{content:'';-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 10.5 12 3l9 7.5V21h-6v-6H9v6H3z' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 10.5 12 3l9 7.5V21h-6v-6H9v6H3z' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
  .navigation-shell .nav-link[data-view="transactions"]::before{content:'';-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='3' width='16' height='4' rx='2' fill='none' stroke='black' stroke-width='1.8'/%3E%3Crect x='4' y='10' width='16' height='4' rx='2' fill='none' stroke='black' stroke-width='1.8'/%3E%3Crect x='4' y='17' width='16' height='4' rx='2' fill='none' stroke='black' stroke-width='1.8'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='3' width='16' height='4' rx='2' fill='none' stroke='black' stroke-width='1.8'/%3E%3Crect x='4' y='10' width='16' height='4' rx='2' fill='none' stroke='black' stroke-width='1.8'/%3E%3Crect x='4' y='17' width='16' height='4' rx='2' fill='none' stroke='black' stroke-width='1.8'/%3E%3C/svg%3E")}
  .navigation-shell .nav-link[data-view="customers"]::before{content:'';-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='7.5' r='4' fill='none' stroke='black' stroke-width='1.8'/%3E%3Cpath d='M3.75 21c.45-4.7 3.2-7.1 8.25-7.1s7.8 2.4 8.25 7.1' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='7.5' r='4' fill='none' stroke='black' stroke-width='1.8'/%3E%3Cpath d='M3.75 21c.45-4.7 3.2-7.1 8.25-7.1s7.8 2.4 8.25 7.1' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E")}
  .navigation-shell .nav-link[data-view="tax"]::before{content:'';background-color:currentColor;-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5.5 2.75h10.75l2.25 2.3v7.2' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M13.4 21.25H5.5V2.75M8.5 7h6.5M8.5 10.5h5M8.5 14h2.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ccircle cx='16.5' cy='17.25' r='4.25' fill='none' stroke='black' stroke-width='1.8'/%3E%3Cpath d='m14.55 17.25 1.3 1.3 2.65-2.75' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5.5 2.75h10.75l2.25 2.3v7.2' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M13.4 21.25H5.5V2.75M8.5 7h6.5M8.5 10.5h5M8.5 14h2.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ccircle cx='16.5' cy='17.25' r='4.25' fill='none' stroke='black' stroke-width='1.8'/%3E%3Cpath d='m14.55 17.25 1.3 1.3 2.65-2.75' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
  .navigation-shell .nav-link[data-view="links"]::before{content:'';-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.6 13.4a4 4 0 0 0 5.7 0l2.1-2.1a4 4 0 1 0-5.7-5.7l-1.2 1.2M13.4 10.6a4 4 0 0 0-5.7 0l-2.1 2.1a4 4 0 1 0 5.7 5.7l1.2-1.2' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10.6 13.4a4 4 0 0 0 5.7 0l2.1-2.1a4 4 0 1 0-5.7-5.7l-1.2 1.2M13.4 10.6a4 4 0 0 0-5.7 0l-2.1 2.1a4 4 0 1 0 5.7 5.7l1.2-1.2' fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round'/%3E%3C/svg%3E")}
}
@media(min-width:781px) and (max-width:1100px){
  .topbar .navigation-shell>nav{gap:6px}
  .topbar .navigation-shell>nav>.nav-link{gap:5px;min-height:32px;padding:5px 6px;font-size:12.5px}
  .topbar .navigation-shell>nav>.nav-link::before{flex-basis:17px;width:17px;height:17px}
}

/* Field focus: one colored border, without an outer halo or iOS square outline.
   Keep keyboard focus styles on navigation and other action buttons intact. */
:is(input,textarea,select,.form-select-button,.filter-menu-button):is(:focus,:focus-visible){outline:0!important;box-shadow:none!important}
:is(input:not([type="checkbox"]):not([type="radio"]),textarea,select):focus{border-color:#155eef!important}
#transaction-dialog [data-form-select-control]:focus-within,
#transaction-dialog [data-form-select-control].is-open>.form-select-button,
#transaction-dialog [data-form-select-control]>.form-select-button:focus{outline:0!important;box-shadow:none!important}
#customers-view .customer-directory-tools input:focus,
#tax-view>.tax-directory-tools input:focus,
#links-view .work-links-search input:focus,
#transactions-view section.filters.transaction-filter-toolbar .filter-search input:focus{outline:0!important;border-color:#155eef!important;box-shadow:none!important}
.tax-search-control:focus-within{border-color:#155eef;box-shadow:none!important}
#customers-view .customer-directory-tools:focus-within,
#tax-view>.tax-directory-tools:focus-within,
#links-view .work-links-searchbar:focus-within,
#transactions-view section.filters.transaction-filter-toolbar:focus-within{border-color:#155eef!important;box-shadow:0 5px 16px rgba(38,68,122,.07)!important}
#transaction-form .money-gross-control:focus-within{border-color:#155eef;outline:0!important;box-shadow:none!important}
#transaction-form .money-section .net-field-wide{font-size:16px}
#transaction-form .money-section .net-field-wide:focus-within{border-color:#79bf98;outline:0!important;box-shadow:none!important}
@media(max-width:780px){#transaction-form .money-section .net-field-wide{font-size:15px}}

/* Nudge red status counts left on desktop and iPhone without changing their size. */
.certificate-notification-count{transform:translateX(-4px)}

/* Typed data uses regular weight; labels, pickers and readonly totals stay as designed. */
input:not([readonly]):not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="file"]),
textarea:not([readonly]){font-weight:400!important}
#transaction-form .money-gross-control #gross-amount{font-weight:800!important}

/* Balance the percentage against its chevron; enlarge desktop branding/actions only. */
#transaction-form #fastwork-card #fee-percent{padding-left:8px;padding-right:22px}
@media(min-width:781px){
  .topbar .brand-name{width:164px}
  .topbar .header-actions #refresh-data,.topbar .header-actions #new-transaction{min-height:44px;padding:10px 16px;font-size:16px}
  .topbar .header-actions #refresh-data>span{font-size:23px}
}
/* Restore original upper spacing; lower spacing accounts for the heading's font inset. */
#transaction-form .money-section{padding-top:16px;padding-bottom:20px;margin-bottom:0}
@media(min-width:781px) and (max-width:1100px){
  .topbar .header-actions #refresh-data,.topbar .header-actions #new-transaction{padding:10px 12px;font-size:14px}
}
