*{box-sizing:border-box}body{margin:0;background:#f5f8fc;color:#162337;font:16px/1.45 system-ui,sans-serif}header{background:#182638;color:white;padding:9px max(20px,calc((100vw - 1180px)/2));display:flex;justify-content:space-between;align-items:center;gap:18px}header a{color:white}.brand{display:flex;align-items:center;gap:10px;font-size:1.4rem;font-weight:700;text-decoration:none}.brand img{display:block;width:42px;height:42px;object-fit:contain}.brand small{font-size:.7rem;color:#bce1ed}main{max-width:1180px;margin:18px auto;padding:0 18px}.notice{background:#fff4d8;padding:12px 15px;border-radius:12px}#notice:not(:empty){background:#e6f3ff;border-radius:8px;padding:10px 12px}section,details{margin:14px 0}#sign-in,#content{background:white;padding:18px;border:1px solid #d8e1eb;border-radius:14px}.sign-in-logo{float:right;width:180px;height:240px;object-fit:contain;margin:0 0 18px 28px}#sign-in:after{content:"";display:block;clear:both}form{display:grid;gap:10px;max-width:640px;margin:14px 0}label{display:grid;gap:4px;font-weight:600}input,select,textarea,button{font:inherit}input,select,textarea{width:100%;padding:9px;border:1px solid #a8b9cc;border-radius:7px}textarea{min-height:76px}button{background:#245b8a;color:white;border:0;border-radius:8px;padding:9px 13px;cursor:pointer}button:disabled{opacity:.55}.top{display:flex;justify-content:space-between;align-items:center}.top h2,.top p{margin:.2rem 0}nav{display:flex;gap:7px;flex-wrap:wrap}nav button[aria-current=page]{background:#0d745c}.card{border:1px solid #d8e1eb;border-radius:9px;padding:10px 12px;margin:8px 0}.muted{color:#506178}summary{cursor:pointer;font-weight:700}h3{margin-bottom:5px}.job-summary{color:#506178;margin:.25rem 0}.job-detail{margin-top:10px;border-top:1px solid #d8e1eb;padding-top:10px}.rapid-task{background:#f4faf7;border:1px solid #b9ddcf;border-radius:10px;padding:12px;max-width:none;grid-template-columns:minmax(220px,1fr) minmax(300px,2fr) auto;align-items:end}.rapid-task h4{grid-column:1/-1;margin:0}.rapid-task textarea{min-height:43px}.task-list{display:grid;gap:7px}.task-row{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(145px,auto);gap:9px;align-items:start;border:1px solid #d8e1eb;border-radius:9px;padding:9px}.task-row.completed{background:#edf8f2}.task-row.completed>.task-copy>strong,.task-row.completed>.task-copy>small{text-decoration:line-through;color:#506178}.task-check{display:flex;grid-template-columns:none;align-items:center;margin-top:5px}.task-check input{width:auto}.task-copy strong{display:block}.task-copy small{display:block;color:#506178;white-space:pre-wrap}.task-status{padding:7px}.task-editor{margin:5px 0}.task-editor summary{font-size:.9rem;color:#245b8a}.task-editor form{max-width:none;margin:8px 0}.history-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px}.history-panel{border:1px solid #d8e1eb;border-radius:9px;padding:10px}.history-panel h4{margin-top:0}@media(max-width:700px){header{padding:9px 14px}.brand{font-size:1.15rem}.brand img{width:38px;height:38px}.sign-in-logo{float:none;display:block;width:120px;height:160px;margin:0 auto 14px}.top{gap:12px}.rapid-task{grid-template-columns:1fr}.rapid-task h4{grid-column:auto}.task-row{grid-template-columns:auto minmax(0,1fr)}.task-status{grid-column:2}.history-grid{grid-template-columns:1fr}}
.page-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.page-heading h3,.page-heading p{margin:4px 0}.crumb{display:flex;align-items:center;gap:7px;margin-bottom:12px;color:#506178}.crumb button{background:transparent;color:#245b8a;padding:3px 0;text-decoration:underline}.job-nav{border-block:1px solid #d8e1eb;padding:10px 0;margin:16px 0}.job-nav button{background:#eaf1f7;color:#162337}.job-nav button[aria-current=page]{background:#182638;color:#fff}.shortcut-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin:18px 0}.shortcut-grid button{text-align:left;background:white;color:#162337;border:1px solid #b9c8d5;padding:17px}.shortcut-grid button:hover,.job-card button:hover{background:#0d745c;color:white}.badge{display:inline-block;background:#e5edf5;border-radius:999px;padding:4px 10px;font-size:.82rem}.job-card{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:16px}.job-card h4,.job-card p{margin:.2rem 0}.job-card small{color:#506178}.site-row{display:flex;align-items:end;gap:10px;max-width:none}.site-row label{flex:1}.actions{display:flex;flex-wrap:wrap;gap:10px}#batch-form{max-width:760px}#batch-result{color:#0d745c}.task-row{margin:10px 0}@media(max-width:700px){.job-card,.site-row{align-items:stretch;flex-direction:column}.job-card button{align-self:flex-start}.job-nav{gap:5px}.job-nav button{flex:1 1 auto}}
.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}.media-grid img{display:block;width:100%;max-height:250px;object-fit:contain}.media-grid figure{margin:0}.media-grid figcaption{font-size:.85rem;color:#506178}.inline-check{display:flex;align-items:center;gap:8px}.inline-check input{width:auto}
.metric-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(245px,1fr));gap:12px}.metric-grid .card{margin:0}.metric-grid h4{margin:.1rem 0 .6rem}.metric-grid strong{font-size:1.1rem}.metric-grid small{color:#506178}
.duration-form{display:flex;max-width:520px;grid-template-columns:1fr auto;align-items:center;border-bottom:1px solid #d8e1eb;padding:8px 0;margin:0}.duration-form button{justify-self:end}
.music-upload-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(140px,220px) auto;gap:10px;align-items:center;border:1px solid #d8e1eb;border-radius:9px;padding:9px}.music-upload-row small{display:block;color:#506178;overflow-wrap:anywhere}.music-upload-row progress{width:100%;height:16px}.music-upload-row button{padding:7px 11px}@media(max-width:700px){.music-upload-row{grid-template-columns:1fr}.music-upload-row button{justify-self:start}}
.music-card{display:grid;gap:9px}.music-card audio{width:min(100%,640px)}.music-card small{color:#506178;overflow-wrap:anywhere}.music-card details{margin:0}.music-card form{max-width:760px}.music-lyrics{max-width:760px;margin-top:8px;padding:12px;background:#f5f8fc;border-radius:8px;white-space:pre-wrap;overflow-wrap:anywhere}
.app-footer{max-width:1180px;margin:34px auto 0;padding:22px 18px;border-top:1px solid #d8e1eb;display:flex;justify-content:space-between;gap:20px;color:#506178;font-size:.88rem}.app-footer nav{display:flex;gap:14px}.app-footer a{color:#245b8a}@media(max-width:700px){.app-footer{align-items:flex-start;flex-direction:column}.app-footer nav{gap:10px;flex-wrap:wrap}}

.control-filters{display:grid;grid-template-columns:2fr repeat(4,minmax(130px,1fr));gap:10px;align-items:end}.control-summary{margin:14px 0}.control-summary .card{display:grid;gap:3px}.control-summary strong{font-size:1.45rem}.control-summary small{text-transform:capitalize}.control-title{display:flex;justify-content:space-between;align-items:start;gap:12px}.control-title h4{margin:.2rem 0}.control-tag{display:inline-block;background:#e6eef8;border-radius:999px;padding:4px 8px;margin:2px;font-size:.78rem;text-transform:capitalize}.check-grid{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}.check-state{border-radius:7px;padding:5px 8px;background:#f1f4f7;font-size:.82rem;text-transform:capitalize}.check-state.verified{background:#dff5e9;color:#155d43}.check-state.partial{background:#fff0c7;color:#6b4b00}.check-state.pending{background:#fbe5e5;color:#7b2929}.check-state.not_applicable{background:#edf0f4;color:#506178}.control-card code{overflow-wrap:anywhere}@media(max-width:900px){.control-filters{grid-template-columns:1fr 1fr}.control-title{flex-direction:column}}@media(max-width:600px){.control-filters{grid-template-columns:1fr}}
.control-priority-group{margin:26px 0 38px}.control-priority-heading{display:flex;justify-content:space-between;align-items:center;gap:18px;margin:0 0 14px;padding:17px 18px;border-left:7px solid #2aa889;border-radius:10px;background:#182638;color:#fff;box-shadow:0 3px 9px rgba(23,40,62,.18)}.control-priority-copy{min-width:0}.control-priority-heading h3{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px;margin:0 0 6px;color:#fff;line-height:1.2}.control-priority-word{font-size:1.22rem;font-weight:850;letter-spacing:.08em;color:#72e0c5}.control-priority-separator{color:#b9c9d9;font-weight:700}.control-priority-caption{font-size:1.05rem;font-weight:700;color:#fff}.control-priority-heading p{margin:0;color:#d6e2ec;line-height:1.45}.control-priority-count{flex:none;display:inline-flex;align-items:center;justify-content:center;min-width:88px;padding:7px 11px;border:1px solid #8296aa;border-radius:999px;background:#fff;color:#182638;font-size:.82rem;font-weight:750;white-space:nowrap}.control-priority-group.priority-now .control-priority-heading{border-left-color:#16a47f}.control-priority-group.priority-next .control-priority-heading{border-left-color:#4da3df}.control-priority-group.priority-next .control-priority-word{color:#8dcdf8}.control-priority-group.priority-later .control-priority-heading{border-left-color:#ff7a1a}.control-priority-group.priority-later .control-priority-word{color:#ffb276}@media(max-width:600px){.control-priority-heading{align-items:flex-start;padding:14px}.control-priority-count{min-width:0}.control-priority-heading h3{gap:6px}.control-priority-word{font-size:1.1rem}.control-priority-caption{font-size:1rem}}
.field-timer{display:flex;justify-content:space-between;align-items:center;gap:16px;background:#182638;color:#fff;border-left:7px solid #f97316;border-radius:12px;padding:16px 18px;margin:16px 0}.field-timer.idle{border-left-color:#8ca0b5}.field-timer p{margin:3px 0;color:#d6e2ec}.field-job-grid{display:grid;gap:10px}.field-job{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:16px}.field-job h4,.field-job p{margin:6px 0}.field-actions{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}.summary-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:8px;margin:14px 0}.summary-strip span{display:grid;background:#edf4fa;border:1px solid #d0dde9;border-radius:9px;padding:10px;color:#506178}.summary-strip strong{color:#162337;font-size:1.08rem}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.split-forms{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.split-forms form{max-width:none;margin:0}.note-card p{white-space:pre-wrap}.inline-check{display:flex;grid-template-columns:auto 1fr;align-items:center}.inline-check input{width:auto}.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}.media-grid figure{margin:0}.media-grid img{width:100%;height:170px;object-fit:cover;border-radius:6px}@media(max-width:700px){.field-job,.field-timer{align-items:stretch;flex-direction:column}.field-actions{justify-content:stretch}.field-actions button{flex:1}.form-grid,.split-forms{grid-template-columns:1fr}.job-nav{position:sticky;top:0;z-index:5;background:#f5f8fc;padding:8px 0}.shortcut-grid{grid-template-columns:1fr 1fr}.summary-strip{grid-template-columns:1fr 1fr}}

.timer-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 0}.timer-actions button{min-height:54px;text-align:left;font-weight:700}.active-timer{border-left:6px solid #f28c28}.active-timer h4{margin-top:0}.timer-break{background:#fff0c7;border-radius:8px;padding:10px}.active-timer details{margin-top:14px}.active-timer form{margin-top:10px}@media(max-width:600px){.timer-actions{grid-template-columns:1fr}.timer-actions button{min-height:58px;font-size:1rem}}
.work-control-bar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:#182638;color:#fff;border-radius:12px;padding:14px 16px;margin:12px 0 18px;box-shadow:0 4px 16px #1020302b}.work-control-bar>div{display:grid;flex:1;min-width:210px}.work-control-bar strong{color:#7ee7c5;letter-spacing:.08em}.work-control-bar small{color:#c7d6e6}.work-control-bar button{min-height:48px;font-weight:750}.work-control-bar.idle strong{color:#fff}.task-row{grid-template-columns:minmax(0,1fr)}.task-controls{display:flex;gap:9px;flex-wrap:wrap;margin:12px 0}.task-controls button{min-height:50px;font-weight:750}.task-play{background:#0d745c}.task-pause{background:#c47700}.task-stop{background:#a52b35}.task-switch,.task-switch-finish{background:#245b8a}.task-finished{display:inline-block;background:#dff3e9;color:#075c47;border-radius:999px;padding:7px 12px;font-weight:700}.form-feedback:not(:empty){background:#e8f6ef;color:#075c47;border-radius:8px;padding:9px}@media(max-width:700px){.work-control-bar{align-items:stretch}.work-control-bar button,.task-controls button{flex:1 1 45%;font-size:1rem}.task-controls{display:grid;grid-template-columns:1fr 1fr}}
.work-control-bar.paused{background:#553c16}.work-control-bar.paused strong{color:#ffd889}.pause-reason{min-width:190px;color:inherit;font-size:.82rem}.pause-reason select{min-height:46px;background:#fff;color:#162337}.task-controls .pause-reason{flex:1 1 220px;color:#162337}@media(max-width:700px){.pause-reason{grid-column:1/-1}}
.work-control-bar{justify-content:flex-start}.work-state{flex:1 1 100%!important}.timer-primary-controls{display:flex;align-items:center;justify-content:flex-start;gap:10px;flex-wrap:wrap;width:100%}.timer-button{border:2px solid #ffffff55;border-radius:10px;min-height:54px;padding:11px 17px;font-size:1rem;font-weight:800;box-shadow:0 3px 8px #1020302b}.timer-start,.task-play{background:#08775c}.timer-pause,.task-pause{background:#b86a00}.timer-stop,.task-stop{background:#a62632}.timer-switch,.task-switch{background:#245b8a}.timer-clock{display:inline-grid;grid-template-columns:auto auto;align-items:center;column-gap:8px;min-width:174px;padding:8px 13px;border:2px solid #9fb1c4;border-radius:10px;background:#101b29;color:#fff;font-variant-numeric:tabular-nums;font-size:1.25rem;font-weight:800;letter-spacing:.06em}.timer-clock-icon{grid-row:1/3;font-size:1.4rem}.timer-clock small{font-size:.68rem;letter-spacing:.04em;color:#c7d6e6;text-transform:uppercase}.task-controls{justify-content:flex-start;align-items:flex-start}.task-controls .timer-primary-controls{order:-2}.task-controls .field-evidence{width:100%;flex-basis:100%;max-width:800px}.finish-task-button{background:#245b8a}@media(max-width:700px){.timer-primary-controls{display:grid;grid-template-columns:1fr}.timer-clock{width:100%;box-sizing:border-box}.timer-button{width:100%}}
.status-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:12px 14px;background:#182638;color:#fff;border-radius:10px}.status-actions strong{margin-right:auto}.timeline-row{display:grid;grid-template-columns:85px minmax(0,1fr);gap:12px;padding:11px 0;border-bottom:1px solid #e0e7ee}.timeline-row:last-child{border:0}.timeline-row p{margin:2px 0;white-space:pre-wrap}.timeline-row small{color:#506178}.timeline-type{align-self:start;text-align:center;background:#e8f1f8;border-radius:999px;padding:4px 7px;font-size:.78rem;font-weight:700}.invoice-sheet{border:2px solid #182638;border-radius:10px;padding:18px;background:#fff}.invoice-sheet table{width:100%;border-collapse:collapse}.invoice-sheet th,.invoice-sheet td{padding:11px;border-bottom:1px solid #d8e1eb;text-align:left}.invoice-sheet td:last-child{text-align:right;white-space:nowrap}@media(max-width:600px){.timeline-row{grid-template-columns:1fr}.timeline-type{justify-self:start}.invoice-sheet{padding:10px}.invoice-sheet th,.invoice-sheet td{padding:7px;font-size:.88rem}}@media print{header,.top,nav,.app-footer,#notice,.shortcut-grid,.status-actions,form,button{display:none!important}body,main,#content{background:#fff!important;margin:0!important;padding:0!important;border:0!important}.invoice-sheet,.card{break-inside:avoid}}
.studio-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(270px,.8fr);gap:20px;align-items:start}.studio-layout form{max-width:none;margin:0}.studio-photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(145px,1fr));gap:10px;margin:10px 0 18px}.studio-photo{position:relative;border:2px solid #d8e1eb;border-radius:10px;padding:7px;background:#fff}.studio-photo:has(input[type=checkbox]:checked){border-color:#0d745c;background:#edf8f3}.studio-photo>input[type=checkbox]{position:absolute;top:12px;left:12px;width:22px;height:22px;z-index:2}.studio-photo img{display:block;width:100%;height:120px;object-fit:cover;border-radius:6px}.studio-photo span{font-size:.82rem;color:#506178;text-transform:capitalize}.studio-photo input:last-child{font-size:.84rem;padding:6px}.studio-preview-panel{position:sticky;top:14px;background:#182638;color:#fff;border-radius:12px;padding:15px}.studio-preview-panel h4{margin-top:0}.studio-preview-panel .muted{color:#d6e2ec}.studio-preview{position:relative;margin:10px auto 14px;background:#07101c;border:1px solid #506178;overflow:hidden;display:grid;place-items:center}.studio-preview.portrait{width:min(100%,260px);aspect-ratio:9/16}.studio-preview.square{width:min(100%,330px);aspect-ratio:1}.studio-preview.landscape{width:100%;aspect-ratio:16/9}.studio-preview figure{position:absolute;inset:0;margin:0}.studio-preview img{width:100%;height:100%;object-fit:cover}.studio-preview figcaption{position:absolute;inset:auto 0 0;padding:24px 10px 10px;background:linear-gradient(transparent,rgba(0,0,0,.85));color:#fff;font-weight:700}.studio-preview>p{padding:20px;text-align:center}.studio-project{display:flex;justify-content:space-between;align-items:center;gap:12px}.studio-project p{margin:.3rem 0;color:#506178}@media(max-width:820px){.studio-layout{grid-template-columns:1fr}.studio-preview-panel{position:static}.studio-project{align-items:stretch;flex-direction:column}.studio-project button{align-self:start}}
.connection-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:18px 0}.connection-card{border:1px solid #cad7e3;border-left:6px solid #0d745c;border-radius:10px;padding:15px;background:#fff}.connection-card>div{display:flex;justify-content:space-between;gap:10px;align-items:center}.connection-card p{margin:.55rem 0 0;color:#506178}.connection-state{border-radius:999px;padding:4px 9px;font-size:.78rem;font-weight:800}.connection-state.ready{background:#dff5e9;color:#155d43}.connection-state.blocked{background:#fbe5e5;color:#7b2929}.communications-compose{border:2px solid #182638;border-radius:12px;padding:16px;background:#f8fbfe}.communications-compose form{max-width:none}.message-history{border-left:5px solid #8296aa}.message-history.accepted{border-left-color:#16a47f}.message-history.failed{border-left-color:#c54747}.message-history.unknown{border-left-color:#e39a21}@media(max-width:700px){.connection-grid{grid-template-columns:1fr}}
.reputation-case-form{border-left:6px solid #d57824;max-width:none}.reputation-case-form:has(select option[value="resolved"]:checked){border-left-color:#16a47f}.reputation-preference-form{max-width:none}.reputation-preference-form .inline-check{margin:.45rem 0}
.field-evidence{display:grid;grid-template-columns:minmax(170px,1fr) minmax(170px,auto);gap:8px;align-items:center;flex:1 1 360px}.field-evidence input{min-height:44px}.evidence-photo{display:grid;gap:3px;font-size:.8rem}.evidence-photo input{padding:7px;background:#fff;color:#162337}.task-row .field-evidence{margin-top:10px;max-width:720px}.work-control-bar .field-evidence{max-width:500px}.work-control-bar .field-evidence>[data-evidence-note]{background:#fff;color:#162337}#notice:not(:empty){position:sticky;top:0;z-index:60;box-shadow:0 4px 14px #10203026}@media(max-width:700px){.field-evidence{grid-template-columns:1fr}.work-control-bar .field-evidence{max-width:none;flex-basis:100%}}
.saved-evidence{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:.65rem;margin:.7rem 0}.saved-evidence article{border:1px solid #d7e2ec;border-radius:.65rem;padding:.65rem;background:#fff}.saved-evidence img{display:block;width:100%;max-height:150px;object-fit:cover;border-radius:.45rem;margin:.45rem 0}.saved-evidence p{margin:.4rem 0}.receipt-review{display:grid;grid-template-columns:minmax(120px,220px) 1fr;gap:1rem}.receipt-image img{width:100%;max-height:260px;object-fit:contain;background:#eef3f7;border-radius:.5rem}.receipt-review.duplicate{border-color:#d97706;background:#fff8e8}.success{padding:.8rem 1rem;border-radius:.6rem;background:#e8f8ef;color:#11603b}@media(max-width:720px){.receipt-review{grid-template-columns:1fr}.receipt-image img{max-height:200px}}
.verification-state{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:10px 12px;margin-bottom:12px;border-radius:8px;background:#eef3f8}.verification-state.verified{background:#e2f5ed;color:#075c45}.verification-state.invalid{background:#fde8e8;color:#8a1c25}.verification-state.unavailable{background:#fff2cf;color:#6d4b00}.verification-state span{font-weight:600}.verification-state small{margin-left:auto}
.workspace-menu-wrap{position:relative}.workspace-menu-toggle{display:flex;align-items:center;gap:8px;min-height:46px;font-weight:750}.workspace-menu-toggle span[aria-hidden=true]{font-size:1.35rem;line-height:1}.workspace-menu{position:absolute;z-index:100;top:calc(100% + 8px);right:0;width:min(920px,calc(100vw - 36px));max-height:min(76vh,720px);overflow:auto;padding:10px;background:#fff;border:1px solid #b9c8d5;border-radius:12px;box-shadow:0 14px 36px rgba(16,32,48,.24)}.workspace-menu-columns{display:grid;grid-template-columns:repeat(2,minmax(250px,1fr));gap:10px}.workspace-menu-columns:has(.workspace-menu-platform:not([hidden])){grid-template-columns:repeat(3,minmax(230px,1fr))}.workspace-menu-group{margin:0;border:1px solid #d8e1eb;border-radius:10px;background:#fbfdff}.workspace-menu-group>summary{padding:11px 12px;color:#304b69;font-weight:850;cursor:pointer}.workspace-menu section{margin:0;padding:8px}.workspace-menu section+section{border-top:1px solid #d8e1eb}.workspace-menu h3{margin:0 0 6px;color:#506178;font-size:.76rem;letter-spacing:.08em;text-transform:uppercase}.workspace-menu button{display:block;width:100%;margin:4px 0;text-align:left;background:#eef4f9;color:#162337}.workspace-menu button:hover,.workspace-menu button[aria-current=page]{background:#0d745c;color:#fff}.workspace-menu-quick{display:none}.workspace-menu-account{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px;padding-top:10px!important;border-top:1px solid #d8e1eb}.workspace-menu-account button{background:#245b8a;color:#fff;text-align:center}.primary-workspace-nav{margin:12px 0}.settings-groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px}.settings-groups .card{margin:0}.settings-groups h4{margin:.2rem 0}.settings-groups p{color:#506178}@media(max-width:700px){.top{align-items:flex-start}.workspace-menu-toggle span:last-child{display:none}.workspace-menu{position:fixed;top:70px;right:12px;left:12px;width:auto;max-height:calc(100vh - 90px)}.workspace-menu-columns{display:block}.workspace-menu-columns:has(.workspace-menu-platform:not([hidden])){display:block}.workspace-menu-group{margin:8px 0}.workspace-menu-group>summary{position:sticky;top:-10px;z-index:2;background:#eaf1f7}.workspace-menu-quick{display:grid;grid-template-columns:1fr 1fr;gap:6px}.workspace-menu-quick button{margin:0;min-height:46px;text-align:center}.workspace-menu .quick-duplicate{display:none}.primary-workspace-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.primary-workspace-nav button{min-height:46px}.primary-workspace-nav button:nth-child(3){grid-column:1/-1;grid-row:1}}
.accounting-choice-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem}.accounting-choice-grid>div{border:1px solid #d8e1eb;border-radius:.7rem;padding:1rem}.coming-soon{background:#f5f8fb}.reconciliation-row{display:flex;justify-content:space-between;gap:1rem;padding:.7rem 0;border-bottom:1px solid #e2e8f0}.reconciliation-row.excluded{opacity:.72;background:#fff4e5;text-decoration:none}.reconciliation-row span{text-align:right}@media(max-width:650px){.reconciliation-row{display:block}.reconciliation-row span{display:block;text-align:left;margin-top:.25rem}}
header{position:relative;z-index:80}.header-actions{display:flex;align-items:center;gap:16px}.header-actions .workspace-menu-toggle{background:#fff;color:#182638;border:2px solid #fff}.header-actions .workspace-menu-toggle:hover{background:#dceaf4}.header-actions .workspace-menu{top:calc(100% + 12px)}
.timeline-type-time{background:#dceeff;color:#174d78}.timeline-type-cost{background:#fff0cf;color:#714900}.timeline-type-task{background:#dcf4e8;color:#075c45}.timeline-type-note{background:#eee4ff;color:#58358a}.timeline-type-payment{background:#d9f3f1;color:#075e59}.timeline-type-media{background:#ffe3ec;color:#862b4b}.timeline-type-status{background:#e5e9ef;color:#334155}.timeline-type-no_charge{background:#fff0cf;color:#714900}.no-charge-card{border-left:6px solid #d18b00}.no-charge-invoice{border:2px solid #dfb85c;background:#fffaf0}
.abr-feedback:not(:empty){margin:0;background:#e7f5ee;color:#075c45;border-left:5px solid #0d745c}.abr-feedback[aria-busy=true]{background:#e8f1fb;color:#174d78;border-left-color:#245b8a}
@media(max-width:700px){.header-actions>a{display:none}.header-actions{gap:6px}.header-actions .workspace-menu{top:70px}.workspace-menu-toggle span:last-child{display:none}}
.seat-summary{display:flex;gap:10px;flex-wrap:wrap;align-items:center;padding:13px 15px;margin:14px 0;background:#182638;color:#fff;border-radius:11px}.seat-summary>*{padding-right:10px;border-right:1px solid #ffffff3d}.seat-summary>*:last-child{border:0}.member-invite-row{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr auto;gap:9px;align-items:end;padding:12px;margin:8px 0;border:1px solid #cad7e3;border-radius:10px;background:#f7fafc}.member-invite-row label{font-size:.82rem}.member-row-remove{background:#8f2933}.member-card{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px}.member-card span,.member-card small{display:block;color:#506178}.member-select{display:flex;align-items:center;gap:7px;white-space:nowrap}.member-select input{width:auto}.invite-token{display:grid;gap:4px;padding:8px 0;border-top:1px solid #b9ddcf}.invite-token code{overflow-wrap:anywhere;user-select:all}#member-remove-form{max-width:none}@media(max-width:850px){.member-invite-row{grid-template-columns:1fr 1fr}.member-invite-row label:first-child{grid-column:1/-1}.member-card{align-items:flex-start;flex-direction:column}}@media(max-width:520px){.member-invite-row{grid-template-columns:1fr}.member-invite-row label:first-child{grid-column:auto}.seat-summary{display:grid}.seat-summary>*{border:0;padding:0}}
.job-list-tools{display:grid;grid-template-columns:minmax(0,1fr) minmax(210px,280px);gap:12px;align-items:end;margin:10px 0}.job-list-tools label{margin:0}.triage-strip{display:flex;flex-wrap:wrap;gap:6px;margin:9px 0}.triage-strip span{background:#e8f1f8;color:#174d78;border-radius:999px;padding:5px 9px;font-size:.78rem;font-weight:700}.feature-review{margin-top:12px;padding:12px;border:1px solid #cad7e3;border-radius:9px;background:#f7fafc}.feature-evidence-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(145px,1fr));gap:9px}.feature-evidence-grid figure{margin:0}.feature-evidence-grid img{display:block;width:100%;height:130px;object-fit:cover;border-radius:7px}.feature-evidence-grid figcaption{font-size:.75rem;color:#506178;overflow-wrap:anywhere}@media(max-width:700px){.job-list-tools{grid-template-columns:1fr}}
.feature-evidence-grid video{display:block;width:100%;height:170px;background:#101b29;border-radius:7px}.evidence-admin-actions{display:flex;gap:6px;margin-top:6px}.evidence-admin-actions button{padding:5px 8px;font-size:.78rem}.evidence-admin-actions .danger{background:#8f2933}#feature-upload-progress{width:100%;height:18px}
.prototype-state{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;background:#fff0cf;color:#714900;font-size:.8rem;font-weight:800}.planning-tabs{display:flex;gap:7px;flex-wrap:wrap;margin:12px 0}.planning-tabs button{background:#e8f1f8;color:#174d78}.planning-tabs button[aria-current=page]{background:#0d745c;color:#fff}.planning-grid,.workflow-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px;margin:14px 0}.planning-grid .card{margin:0}.workflow-steps article{position:relative;padding:16px;border:1px solid #cad7e3;border-radius:10px;background:#fff}.workflow-steps article>span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#182638;color:#fff;font-weight:850}.workflow-steps h4{margin:.65rem 0 .25rem}.workflow-steps p{margin:0;color:#506178}.quote-rule{border-left:6px solid #0d745c}.leave-row{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.leave-row p{margin:.4rem 0;white-space:pre-wrap}@media(max-width:600px){.planning-tabs{display:grid;grid-template-columns:1fr}.leave-row{display:block}.prototype-state{margin-top:8px}}
.embed-link-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.embed-link-grid .card{margin:0}.embed-link-grid code{display:block;overflow-wrap:anywhere;user-select:all}.public-enquiry{display:grid;gap:4px;padding:12px 0;border-bottom:1px solid #d8e1eb}.public-enquiry:last-child{border-bottom:0}.public-enquiry span,.public-enquiry small{color:#506178}.public-enquiry p{margin:.3rem 0;white-space:pre-wrap}@media(max-width:700px){.embed-link-grid{grid-template-columns:1fr}}
.referral-hero{display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;align-items:center;margin:18px 0 22px;padding:22px;border:2px solid #f3b61f;border-radius:16px;background:linear-gradient(125deg,#fff7cf 0%,#ffe28a 48%,#dff6e8 100%);color:#203018;box-shadow:0 8px 24px rgba(132,92,0,.18)}.referral-money{display:grid;place-items:center;width:86px;height:86px;border-radius:50%;background:#08775c;color:#fff;font-size:3rem;box-shadow:0 5px 14px #075c4540}.referral-eyebrow{font-size:.78rem;font-weight:900;letter-spacing:.1em;color:#6b4a00}.referral-hero h3{margin:2px 0;font-size:clamp(1.65rem,3.5vw,2.6rem);color:#173927}.referral-hero p{margin:.45rem 0}.referral-value{font-size:1.05rem}.referral-actions{display:flex;gap:9px;flex-wrap:wrap;margin:12px 0}.referral-actions button{background:#08775c;font-weight:800}.referral-actions .referral-secondary{background:#fff;color:#174d3c;border:2px solid #08775c}.referral-hero small{display:block;color:#5f541f}.reputation-intro{padding:20px;border-left:7px solid #0d745c;border-radius:12px;background:#eef8f4}.reputation-intro h4{margin:.25rem 0;font-size:1.35rem}.reputation-kicker{color:#08775c;font-size:.78rem;font-weight:900;letter-spacing:.1em}.reputation-intro ol{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;padding:0;list-style:none;counter-reset:steps}.reputation-intro li{counter-increment:steps;display:grid;gap:4px;padding:12px;background:#fff;border:1px solid #c9dfd5;border-radius:9px}.reputation-intro li:before{content:counter(steps);display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:#182638;color:#fff;font-weight:800}.reputation-intro li span{color:#506178;font-size:.88rem}.reputation-requirements{padding:10px 12px;background:#fff4d8;border-radius:8px}.bulk-invite-heading{display:flex;justify-content:space-between;align-items:center;gap:14px}.bulk-invite-heading h4,.bulk-invite-heading p{margin:.25rem 0}.bulk-row-actions{display:flex;gap:6px}.bulk-row-actions button{min-width:52px;background:#0d745c;font-weight:800}.bulk-paste{padding:12px;border:1px solid #cad7e3;border-radius:10px;background:#f7fafc}.bulk-paste textarea{min-height:95px}.bulk-defaults{display:grid;grid-template-columns:auto repeat(3,minmax(130px,1fr));gap:9px;align-items:end;padding:12px;border-radius:10px;background:#eaf1f7}.bulk-defaults label{font-size:.82rem}.invite-summary{padding:10px 12px;border-left:5px solid #0d745c;border-radius:8px;background:#e8f6ef;color:#075c45;font-weight:700}.invite-summary.attention{border-left-color:#c47700;background:#fff4d8;color:#6d4b00}.send-invitations{min-height:48px;font-weight:800}.member-invite-row input:invalid:not(:placeholder-shown){border-color:#b32632;background:#fff2f2}@media(max-width:760px){.referral-hero{grid-template-columns:1fr}.referral-money{width:64px;height:64px;font-size:2.2rem}.reputation-intro ol{grid-template-columns:1fr 1fr}.bulk-invite-heading{align-items:flex-start;flex-direction:column}.bulk-defaults{grid-template-columns:1fr 1fr}.bulk-defaults>strong{grid-column:1/-1}}@media(max-width:480px){.reputation-intro ol,.bulk-defaults{grid-template-columns:1fr}.bulk-defaults>strong{grid-column:auto}.referral-actions{display:grid}.referral-actions button{width:100%}}
.closeout-checks{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;margin:16px 0}.closeout-checks article{display:grid;gap:6px;border-left:6px solid #c0392b}.closeout-checks article.ready{border-left-color:#0d745c}.closeout-checks article span{font-size:.78rem;font-weight:700;text-transform:uppercase;color:#506178}
.customer-record-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.customer-record-grid>details{margin:0}.customer-record-grid form,.property-profile form{max-width:none}.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px}.contact-card{display:grid;gap:4px}.contact-card p{margin:.25rem 0;white-space:pre-wrap}.contact-card span,.contact-card small{color:#506178}.property-profile{border-left:6px solid #245b8a}.property-profile>summary{font-size:1.05rem}.property-profile textarea{min-height:64px}@media(max-width:760px){.customer-record-grid{grid-template-columns:1fr}}
.customer-table{margin:1rem 0;border:1px solid var(--border);border-radius:12px;overflow:hidden;background:#fff}.customer-table-head,.customer-table-row{display:grid;grid-template-columns:minmax(180px,2fr) minmax(180px,2fr) 90px 80px minmax(150px,1fr);gap:1rem;align-items:center;padding:.8rem 1rem}.customer-table-head{font-weight:700;background:#edf3f8}.customer-table-row{border-top:1px solid var(--border)}.customer-table-row a{font-weight:650}.customer-table-row span:nth-child(3),.customer-table-row span:nth-child(4){text-align:center}@media(max-width:760px){.customer-table-head{display:none}.customer-table-row{grid-template-columns:1fr}.customer-table-row span:nth-child(3),.customer-table-row span:nth-child(4){text-align:left}.customer-table-row span:nth-child(3)::before{content:'Branches: '}.customer-table-row span:nth-child(4)::before{content:'People: '}}
.media-upload-progress{display:grid;gap:7px;margin-top:12px;padding:13px;border:1px solid #82bf94;border-radius:10px;background:#e8f6ed;color:#174d3c}.media-upload-progress progress{width:100%;height:16px}.media-upload-progress small{color:#365f52}
.work-control-bar{position:relative;top:auto;z-index:2}
.password-recovery{margin-top:1rem}.password-recovery form{margin-top:.75rem}.support-privacy{border-left:4px solid var(--accent,#f59e0b)}.diagnostic-preview{display:grid;gap:.4rem;margin:.8rem 0}.diagnostic-preview div{display:grid;grid-template-columns:minmax(8rem,12rem) 1fr;gap:.75rem;padding:.45rem .6rem;border-radius:.4rem;background:rgba(127,127,127,.08)}.diagnostic-preview dt{font-weight:700}.diagnostic-preview dd{margin:0;overflow-wrap:anywhere}.support-request .badge{margin-left:.5rem}
.time-alert-button{display:flex!important;align-items:center;gap:5px;min-width:48px;background:#fff!important;color:#7c2d12!important;border:2px solid #f59e0b!important}.time-alert-button span{display:grid;place-items:center;min-width:22px;height:22px;padding:0 5px;border-radius:999px;background:#b42318;color:#fff;font-size:.72rem;font-weight:900}.time-reconciliation-row{border-left:6px solid #0d745c}.time-reconciliation-row.time-attention,.metric-grid .time-attention{border-left:6px solid #b42318;background:#fff7ed}.time-reconciliation-metrics{display:grid;grid-template-columns:repeat(6,minmax(90px,1fr));gap:8px;margin:12px 0}.time-reconciliation-metrics span{display:grid;gap:2px;padding:9px;border-radius:8px;background:#edf3f8}.time-reconciliation-metrics small{color:#506178}.time-reconciliation-metrics .variance{background:#fee2e2;color:#8a1c1c}.time-flags{padding:10px 10px 10px 30px;border-radius:8px;background:#fff0cf;color:#714900}.time-review-form{max-width:none;padding-top:10px;border-top:1px solid #d8e1eb}@media(max-width:760px){.time-reconciliation-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.time-alert-button{padding:7px}.time-alert-button span{min-width:19px;height:19px}}
.job-card .job-open-primary{order:-1;align-self:stretch;min-width:132px;background:#0d745c;font-weight:850}.job-card-summary{min-width:0;flex:1}.job-card-summary>a{display:inline-block;margin-top:.45rem;font-size:.86rem}.job-card-summary small{display:block}
.calendar-quick-controls{max-width:none}.calendar-week-nav{display:flex;justify-content:center;gap:.5rem;margin-bottom:.8rem}.calendar-week-nav button{min-width:76px}.calendar-scroll{overflow-x:auto;margin:1rem 0;border:1px solid #b8c7d5;border-radius:12px;background:#fff}.week-calendar{display:grid;grid-template-columns:58px repeat(7,minmax(58px,1fr));grid-template-rows:auto auto;min-width:520px}.calendar-corner,.calendar-day-heading{position:sticky;top:0;z-index:6;padding:.55rem .2rem;border-bottom:1px solid #b8c7d5;border-right:1px solid #d8e1eb;background:#182638;color:#fff;text-align:center}.calendar-day-heading span{display:block;font-size:.72rem}.calendar-time-ruler{position:relative;height:952px;border-right:1px solid #b8c7d5;background:#f4f7fa}.calendar-time-ruler span{position:absolute;right:.35rem;transform:translateY(-.55rem);color:#526579;font-size:.68rem;white-space:nowrap}.calendar-day-column{position:relative;height:952px;border-right:1px solid #d8e1eb;background:repeating-linear-gradient(to bottom,#fff 0 27px,#dce5ed 27px 28px,#f2f6f9 28px 55px,#bccbd8 55px 56px)}.calendar-slot{position:relative;z-index:1;display:block;width:100%;height:28px;padding:0;border:0;border-radius:0;background:transparent}.calendar-slot:hover,.calendar-slot:focus{outline:2px solid #0d745c;outline-offset:-2px;background:#0d745c20}.calendar-event{position:absolute;z-index:3;top:var(--event-top);left:2px;right:2px;height:var(--event-height);min-height:20px;overflow:hidden;padding:3px 4px;border:1px solid #145b8a;border-radius:5px;background:#dceeff;color:#123f63;font-size:.72rem;font-weight:750;line-height:1.1;pointer-events:none}.calendar-event.personal{border-color:#6941a5;background:#eee4ff;color:#4b277b}.calendar-event.unavailable{border-color:#737373;background:#9e9e9e;color:#fff}.calendar-event-time{display:block;font-size:.61rem}.calendar-event.travel{display:flex;align-items:center;justify-content:flex-start;gap:1px;padding:2px;border-color:#9ca3af;background:repeating-linear-gradient(135deg,#d1d5db 0 8px,#fff 8px 16px);color:#111827;text-shadow:none;font-size:.6rem;font-weight:900;white-space:nowrap}.calendar-event.travel .calendar-event-label{writing-mode:horizontal-tb;text-orientation:mixed}.travel-car{font-size:.78rem}.calendar-leave{position:absolute;z-index:4;inset:0 2px;padding:4px;background:repeating-linear-gradient(135deg,rgba(123,41,41,.88) 0 10px,rgba(157,60,60,.88) 10px 20px);color:#fff;text-align:center;font-size:.68rem;font-weight:850;pointer-events:none}.calendar-leave span{display:inline-block;position:sticky;top:46px}
@media(max-width:700px){.job-card .job-open-primary{align-self:stretch;order:-1;min-height:50px}.calendar-scroll{overflow-x:hidden}.week-calendar{width:100%;min-width:0;grid-template-columns:40px repeat(7,minmax(0,1fr))}.calendar-corner{font-size:.58rem}.calendar-day-heading{padding:.42rem 0}.calendar-day-heading strong{font-size:.67rem}.calendar-day-heading span{font-size:.56rem}.calendar-time-ruler span{right:.2rem;font-size:.56rem}.calendar-event:not(.travel) .calendar-event-label,.calendar-leave span{display:block;writing-mode:vertical-rl;text-orientation:mixed;white-space:nowrap;margin:auto}.calendar-event-time{display:none}.calendar-event.travel{flex-direction:row;gap:1px}.calendar-event.travel .calendar-event-label{writing-mode:horizontal-tb;text-orientation:mixed}.travel-car{font-size:.7rem}.calendar-leave span{position:sticky;top:46px}}
.time-alert-button[hidden]{display:none!important}
.notification-button{position:fixed;z-index:95;top:18px;right:86px;display:grid!important;place-items:center;width:48px;height:48px;padding:0;border:2px solid #fff;border-radius:12px;background:#fff!important;color:#182638!important;box-shadow:0 3px 12px #0003}.notification-button[hidden]{display:none!important}.notification-bell{font-size:1.35rem;line-height:1}.notification-badge{position:absolute;top:-7px;right:-8px;display:grid;place-items:center;min-width:23px;height:23px;padding:0 5px;border:2px solid #fff;border-radius:999px;background:#c62828;color:#fff;font-size:.7rem;font-weight:900}.notification-badge[hidden]{display:none}.notification-card{border-left:6px solid #245b8a}.notification-card.severity-attention{border-left-color:#d97706;background:#fffaf0}.notification-card.severity-urgent{border-left-color:#b42318;background:#fff5f5}.notification-card.is-read{opacity:.78}.notification-card p{white-space:pre-wrap}.notification-card button{font-weight:800}@media(max-width:700px){.notification-button{top:18px;right:78px;width:44px;height:44px}.notification-badge{top:-6px;right:-7px}}
.receipt-exclusion{border:2px solid #b45309;border-radius:.65rem;padding:.8rem;background:#fff7ed}.receivable-plan.disputed,.receivable-plan.paused{border-left:6px solid #b45309}.receivable-plan.completed{border-left:6px solid #15803d}.receivable-plan form{margin-top:1rem}
.provider-invoice{border-left:6px solid #0d745c}.material-billing-review-form{display:grid;grid-template-columns:minmax(180px,1fr) minmax(220px,2fr) auto;gap:7px;max-width:620px;margin:7px 0 0 auto}.receipt-reconciliation-confirm-form{border-left:6px solid #d97706;background:#fffaf0}@media(max-width:700px){.material-billing-review-form{grid-template-columns:1fr;margin-left:0}.provider-invoice .summary-strip{grid-template-columns:1fr 1fr}}


/* Task-Centred Job Evidence Workspace (EZ-112) */
.evidence-workspace-header {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: center;
  justify-content: space-between;
  margin: 1rem 0;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--border-color, #e0e0e0);
}
.filter-pills {
  display: flex;
  gap: 0.4rem;
  flex-wrap: wrap;
}
.filter-pill {
  border-radius: 999px;
  padding: 0.35rem 0.8rem;
  font-size: 0.85rem;
  background: var(--bg-alt, #f0f3f6);
  border: 1px solid var(--border-color, #d0d7de);
  color: var(--text-color, #24292f);
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
}
.filter-pill.active {
  background: var(--primary, #0969da);
  color: #fff;
  border-color: var(--primary, #0969da);
  font-weight: 600;
}
.workspace-actions {
  display: flex;
  gap: 0.5rem;
}
.button-subtle {
  background: none;
  border: none;
  color: var(--primary, #0969da);
  cursor: pointer;
  font-size: 0.85rem;
  text-decoration: underline;
  padding: 0.2rem 0.4rem;
}
.task-evidence-groups {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}
.task-evidence-card {
  border: 1px solid var(--border-color, #d0d7de);
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}
.task-evidence-card summary.task-card-summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.85rem 1rem;
  background: #f8fafc;
  cursor: pointer;
  user-select: none;
  font-size: 0.95rem;
}
.summary-left {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}
.summary-counters {
  display: flex;
  gap: 0.4rem;
}
.counter-badge {
  background: #edf2f7;
  border: 1px solid #cbd5e1;
  border-radius: 4px;
  padding: 0.15rem 0.45rem;
  font-size: 0.78rem;
  color: #475569;
}
.task-evidence-body {
  padding: 1rem;
  border-top: 1px solid var(--border-color, #e2e8f0);
}
/* Horizontal touch-friendly thumbnail rail */
.thumbnail-rail-section {
  margin-bottom: 1rem;
}
.rail-title {
  display: block;
  font-weight: 600;
  font-size: 0.85rem;
  color: #475569;
  margin-bottom: 0.5rem;
}
.rail-title small {
  font-weight: 400;
  color: #64748b;
  margin-left: 0.35rem;
}
.thumbnail-rail {
  display: flex;
  gap: 0.75rem;
  overflow-x: auto;
  padding-bottom: 0.5rem;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
}
.thumbnail-item {
  flex: 0 0 110px;
  width: 110px;
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.thumbnail-trigger {
  width: 110px;
  height: 90px;
  padding: 0;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  overflow: hidden;
  background: #f1f5f9;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.thumbnail-trigger img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.thumb-stage {
  font-size: 0.72rem;
  color: #64748b;
  margin-top: 0.25rem;
  text-align: center;
  text-transform: capitalize;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* Lightbox modal */
.evidence-modal {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
}
.modal-backdrop {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0,0,0,0.65);
}
.modal-dialog {
  position: relative;
  z-index: 1001;
  background: #fff;
  border-radius: 8px;
  max-width: 90vw;
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-shadow: 0 10px 25px rgba(0,0,0,0.3);
}
.modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid #e2e8f0;
}
.modal-close {
  background: none;
  border: none;
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
  color: #64748b;
}
.modal-content {
  padding: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: auto;
}
.modal-content img {
  max-width: 85vw;
  max-height: 75vh;
  object-fit: contain;
}

.hidden, .evidence-modal.hidden {
  display: none !important;
}

.evidence-modal[hidden], [hidden] {
  display: none !important;
}

/* Expand / Collapse Indicator for Task Cards */
.task-card-summary {
  display: flex;
  align-items: center;
  cursor: pointer;
  user-select: none;
  list-style: none; /* Hide default browser marker */
}

.task-card-summary::-webkit-details-marker {
  display: none;
}

.task-card-summary::before {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  margin-right: 12px;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 7px solid #212529; /* Solid black/dark triangle pointing right */
  transition: transform 0.18s ease-in-out;
  flex-shrink: 0;
}

details[open] > .task-card-summary::before {
  transform: rotate(90deg); /* Rotates 90 deg clockwise pointing down */
}

/* Align card summary text left beside the indicator */
.task-card-summary {
  justify-content: flex-start !important;
  text-align: left !important;
  padding: 10px 14px !important;
}

.task-card-summary .summary-left {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  text-align: left !important;
  margin: 0 !important;
}

.task-card-summary .summary-counters {
  margin-left: auto !important; /* Pushes the count badges neatly to the right */
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* Work Control Bar Layout & Sizing */
.work-control-bar {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 20px !important;
}

/* 1. Slim down the left-hand timer controls */
.timer-primary-controls {
  max-width: 250px !important;
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}

.timer-task-picker select,
#timer-task-select {
  width: 100% !important;
  max-width: 250px !important;
}

.work-control-bar .timer-button {
  width: 100% !important;
  max-width: 250px !important;
  padding: 8px 12px !important;
}

.work-control-bar .timer-clock,
.work-control-bar .timer-ready,
.work-control-bar div[class*="timer"] {
  max-width: 250px !important;
}

/* 2. Fix field alignment and expand the note box */
.field-evidence {
  display: flex !important;
  align-items: flex-end !important; /* Forces the bottoms of both boxes to align */
  gap: 12px !important;
  flex: 1 !important;
}

/* Make the note input expand to fill available space */
.field-evidence input[data-evidence-note] {
  flex: 1 1 240px !important;
  min-height: 38px !important;
  padding: 6px 12px !important;
  border-radius: 6px !important;
  border: 1px solid #ced4da !important;
  box-sizing: border-box !important;
}

/* Container for upload photo input and label */
.field-evidence label.evidence-photo {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-end !important;
  gap: 4px !important;
  margin: 0 !important;
  font-size: 0.75rem !important;
  color: rgba(255, 255, 255, 0.75) !important;
}

.field-evidence input[data-evidence-photo] {
  min-height: 38px !important;
  line-height: 24px !important;
  border-radius: 6px !important;
  background: #fff !important;
  border: 1px solid #ced4da !important;
  padding: 4px 8px !important;
  box-sizing: border-box !important;
}

/* ========================================================
   1. Prominent Job Header Banner
   ======================================================== */
.job-header-card, 
.job-title-block {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  padding: 16px 20px;
  margin-bottom: 16px;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04);
}

/* Ensure the main title stands out immediately */
h2:has(+ .job-subtitle),
.job-header h2,
.workspace-heading h2,
div:has(> .badge-status) > h2 {
  font-size: 1.65rem !important;
  font-weight: 800 !important;
  color: #0f172a !important;
  letter-spacing: -0.5px !important;
  margin: 4px 0 !important;
}

/* ========================================================
   2. Work Control Bar: Uniform 320px Left Column
   ======================================================== */
.timer-primary-controls {
  width: 320px !important;
  max-width: 320px !important;
  flex: 0 0 320px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

.timer-task-picker,
.timer-task-picker select,
#timer-task-select,
.work-control-bar .timer-button,
.work-control-bar .timer-clock,
.work-control-bar .timer-ready {
  width: 100% !important;
  max-width: 320px !important;
  min-width: 320px !important;
  box-sizing: border-box !important;
}

/* ========================================================
   3. Work Control Bar: Stacked Right-Hand Evidence Column
   ======================================================== */
.field-evidence {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  align-items: stretch !important;
  flex: 1 1 auto !important;
  max-width: 440px !important;
  gap: 10px !important;
}

/* Taller note input */
.field-evidence input[data-evidence-note],
.field-evidence textarea[data-evidence-note] {
  width: 100% !important;
  min-height: 52px !important;
  padding: 10px 14px !important;
  border-radius: 8px !important;
  border: 1px solid #ced4da !important;
  box-sizing: border-box !important;
  font-size: 0.9rem !important;
  background: #ffffff !important;
  color: #1e293b !important;
}

/* Stacked photo upload container below note */
.field-evidence label.evidence-photo {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px dashed rgba(255, 255, 255, 0.3) !important;
  padding: 8px 12px !important;
  border-radius: 8px !important;
  margin: 0 !important;
  color: rgba(255, 255, 255, 0.9) !important;
  font-size: 0.8rem !important;
  cursor: pointer !important;
}

.field-evidence input[data-evidence-photo] {
  max-width: 260px !important;
  font-size: 0.8rem !important;
  background: #ffffff !important;
  border-radius: 6px !important;
  padding: 4px 8px !important;
}

/* ========================================================
   Work Control Bar: Perfect 50/50 Balanced Split
   ======================================================== */
.work-control-bar {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 28px !important;
  align-items: end !important;
  padding: 20px 24px !important;
}

/* LEFT COLUMN (50%): 3 elements stacked evenly */
.timer-primary-controls {
  width: 100% !important;
  max-width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

.timer-task-picker,
.timer-task-picker select,
#timer-task-select,
.work-control-bar .timer-button,
.work-control-bar .timer-clock,
.work-control-bar .timer-ready {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

#timer-task-select {
  height: 38px !important;
}

.work-control-bar .timer-button {
  height: 42px !important;
}

/* RIGHT COLUMN (50%): Photos on top, Notes below, matching total left height */
.field-evidence {
  width: 100% !important;
  max-width: 100% !important;
  display: flex !important;
  flex-direction: column-reverse !important; /* Reverses order: Photos TOP, Note BOTTOM */
  gap: 10px !important;
  justify-content: flex-end !important;
  box-sizing: border-box !important;
}

/* 1. Photos on Top */
.field-evidence label.evidence-photo {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  height: 42px !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px dashed rgba(255, 255, 255, 0.35) !important;
  border-radius: 6px !important;
  padding: 0 12px !important;
  color: #fff !important;
  font-size: 0.82rem !important;
  box-sizing: border-box !important;
  margin: 0 !important;
}

.field-evidence input[data-evidence-photo] {
  font-size: 0.8rem !important;
  background: #ffffff !important;
  border-radius: 4px !important;
  padding: 3px 6px !important;
}

/* 2. Note part cut off lower to match left height */
.field-evidence input[data-evidence-note],
.field-evidence textarea[data-evidence-note] {
  width: 100% !important;
  height: 82px !important;
  min-height: 82px !important;
  max-height: 82px !important;
  padding: 10px 12px !important;
  border-radius: 6px !important;
  border: 1px solid #ced4da !important;
  box-sizing: border-box !important;
  font-size: 0.88rem !important;
  background: #ffffff !important;
  color: #212529 !important;
  resize: none !important;
}

/* ========================================================
   Work Control Bar: Explicit 2-Column Grid Layout
   ======================================================== */
.work-control-bar {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  grid-template-areas: 
    "header  header"
    "leftcol rightcol" !important;
  gap: 12px 24px !important;
  padding: 16px 20px !important;
  align-items: start !important;
}

/* Header text across top-left */
.work-control-bar .work-state {
  grid-area: header !important;
  margin-bottom: 2px !important;
}

.work-control-bar .work-state strong {
  font-size: 1rem !important;
  display: block !important;
  color: #fff !important;
}

.work-control-bar .work-state small {
  color: rgba(255, 255, 255, 0.7) !important;
  font-size: 0.8rem !important;
}

/* LEFT COLUMN: Exactly 50% width */
.work-control-bar .timer-primary-controls {
  grid-area: leftcol !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

.work-control-bar .timer-task-picker,
.work-control-bar .timer-task-picker select,
.work-control-bar #timer-task-select,
.work-control-bar .timer-button,
.work-control-bar .timer-clock,
.work-control-bar .timer-ready {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

#timer-task-select {
  height: 38px !important;
}

.work-control-bar .timer-button {
  height: 40px !important;
}

/* RIGHT COLUMN: Exactly 50% width */
.work-control-bar .field-evidence {
  grid-area: rightcol !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column-reverse !important; /* Photos above Notes */
  gap: 8px !important;
  box-sizing: border-box !important;
  margin-top: 18px !important; /* Aligns top of right column with dropdown */
}

/* 1. Photos input on top */
.work-control-bar .field-evidence label.evidence-photo {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  height: 40px !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px dashed rgba(255, 255, 255, 0.35) !important;
  border-radius: 6px !important;
  padding: 0 10px !important;
  color: #fff !important;
  font-size: 0.8rem !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

.work-control-bar .field-evidence input[data-evidence-photo] {
  font-size: 0.8rem !important;
  background: #ffffff !important;
  border-radius: 4px !important;
  padding: 2px 6px !important;
}

/* 2. Note input below photos, matching left column height */
.work-control-bar .field-evidence input[data-evidence-note],
.work-control-bar .field-evidence textarea[data-evidence-note] {
  width: 100% !important;
  height: 82px !important;
  min-height: 82px !important;
  max-height: 82px !important;
  padding: 8px 12px !important;
  border-radius: 6px !important;
  border: 1px solid #ced4da !important;
  box-sizing: border-box !important;
  font-size: 0.85rem !important;
  background: #ffffff !important;
  color: #212529 !important;
  resize: none !important;
}

/* Shift from a 50/50 split to a 60/40 split to widen the left controls */
.work-control-bar {
  grid-template-columns: 60% 36% !important; /* Leaves 4% for the gap */
}

/* Force left column to be wider and right column to retain its width */
.work-control-bar {
  display: grid !important;
  grid-template-columns: 1fr 380px !important; /* Left takes all available widened space, right stays pinned */
  grid-template-areas: 
    "header  header"
    "leftcol rightcol" !important;
  gap: 16px 24px !important;
}

/* Remove the 320px clamp so the buttons and dropdown fill the widened left side */
.work-control-bar .timer-primary-controls,
.work-control-bar .timer-task-picker,
.work-control-bar .timer-task-picker select,
.work-control-bar #timer-task-select,
.work-control-bar .timer-button,
.work-control-bar .timer-clock,
.work-control-bar .timer-ready {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

/* Pinned right column */
.work-control-bar .field-evidence {
  width: 380px !important;
  max-width: 380px !important;
}

/* Pure 50/50 Symmetrical Grid */
.work-control-bar {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  grid-template-areas: 
    "header  header"
    "leftcol rightcol" !important;
  gap: 16px 24px !important;
  padding: 18px 24px !important;
}

/* Left Column: 100% of its 50% half, NO width clamps */
.work-control-bar .timer-primary-controls,
.work-control-bar .timer-task-picker,
.work-control-bar .timer-task-picker select,
.work-control-bar #timer-task-select,
.work-control-bar .timer-button,
.work-control-bar .timer-clock,
.work-control-bar .timer-ready {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 100% !important;
  box-sizing: border-box !important;
}

/* Right Column: 100% of its 50% half, NO width clamps */
.work-control-bar .field-evidence {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 100% !important;
  box-sizing: border-box !important;
}

/* Big High-Contrast Job Title Banner */
.job-page-hero-banner {
  background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%) !important;
  color: #ffffff !important;
  padding: 20px 24px !important;
  border-radius: 12px !important;
  margin-bottom: 20px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.15) !important;
  border-left: 6px solid #f97316 !important; /* Bold EzTradie safety-orange anchor */
}

.job-page-hero-banner h1 {
  font-size: 1.75rem !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  margin: 0 0 6px 0 !important;
  letter-spacing: -0.5px !important;
}

.job-page-hero-banner p {
  margin: 0 !important;
  color: #94a3b8 !important;
  font-size: 0.95rem !important;
}

.job-page-hero-banner .hero-badge {
  background: rgba(255, 255, 255, 0.15) !important;
  color: #f8fafc !important;
  padding: 6px 14px !important;
  border-radius: 20px !important;
  font-weight: 700 !important;
  font-size: 0.85rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
}

/* Align right column bottom edge exactly with the timer box */
.work-control-bar .field-evidence {
  justify-content: space-between !important;
  height: 100% !important;
  margin-top: 0 !important;
}

/* Extend Optional status note to match cursor baseline */
.work-control-bar .field-evidence input[data-evidence-note],
.work-control-bar .field-evidence textarea[data-evidence-note] {
  height: 98px !important;
  min-height: 98px !important;
  max-height: 98px !important;
}

/* ========================================================
   Work Control Bar: Pixel-Perfect Dual Column Alignment
   ======================================================== */
.work-control-bar {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  grid-template-areas: 
    "header  header"
    "leftcol rightcol" !important;
  gap: 14px 24px !important;
  padding: 20px 24px !important;
  align-items: start !important;
}

/* Ensure left column elements stack with controlled spacing */
.work-control-bar .timer-primary-controls {
  grid-area: leftcol !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Row 1 Left: Work Task Dropdown */
.work-control-bar .timer-task-picker {
  margin: 0 0 4px 0 !important;
}

.work-control-bar .timer-task-picker label {
  height: 18px !important;
  line-height: 18px !important;
  margin-bottom: 4px !important;
  display: block !important;
}

.work-control-bar #timer-task-select {
  height: 40px !important;
  box-sizing: border-box !important;
}

/* Row 2 Left: Start Button + Timer Display */
.work-control-bar .timer-button {
  height: 42px !important;
  box-sizing: border-box !important;
  margin: 0 !important;
}

.work-control-bar .timer-clock,
.work-control-bar .timer-ready {
  height: 52px !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* ========================================================
   Right Column: Matched Heights
   ======================================================== */
.work-control-bar .field-evidence {
  grid-area: rightcol !important;
  display: flex !important;
  flex-direction: column-reverse !important; /* Photos above Notes */
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Row 1 Right: Photos Container */
.work-control-bar .field-evidence label.evidence-photo {
  height: 40px !important;
  margin-top: 22px !important; /* Offsets label height to align flush with dropdown */
  margin-bottom: 4px !important;
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 12px !important;
}

/* Row 2 Right: Notes Box (42px button + 8px gap + 52px clock = 102px total) */
.work-control-bar .field-evidence input[data-evidence-note],
.work-control-bar .field-evidence textarea[data-evidence-note] {
  height: 102px !important;
  min-height: 102px !important;
  max-height: 102px !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  font-size: 0.88rem !important;
  line-height: 1.4 !important;
}

/* Lock Row 1 (Work Task & Photos) and Row 2 (Controls & Note) to identical baselines */
.work-control-bar .timer-primary-controls {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

/* Ensure right column matches left column's total height and structure */
.work-control-bar .field-evidence {
  display: flex !important;
  flex-direction: column-reverse !important;
  gap: 8px !important;
  height: 100% !important;
  margin: 0 !important;
}

/* Top of right side (photos): match the exact height and bottom margin of task-picker */
.work-control-bar .field-evidence label.evidence-photo {
  height: 40px !important;
  margin-top: 22px !important; /* Matches label height */
  margin-bottom: 0 !important;
  box-sizing: border-box !important;
}

/* Bottom of right side (note): flex to occupy the exact height of Start button + gap + Timer */
.work-control-bar .field-evidence input[data-evidence-note],
.work-control-bar .field-evidence textarea[data-evidence-note] {
  flex: 1 1 auto !important;
  height: 114px !important;
  min-height: 114px !important;
  max-height: 114px !important;
  box-sizing: border-box !important;
  margin: 0 !important;
}

/* ========================================================
   Work Control Bar: Pixel-Perfect Dual Column Alignment
   ======================================================== */
.work-control-bar {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  grid-template-areas: 
    "header  header"
    "leftcol rightcol" !important;
  gap: 14px 24px !important;
  padding: 20px 24px !important;
  align-items: start !important;
}

/* Ensure left column elements stack with controlled spacing */
.work-control-bar .timer-primary-controls {
  grid-area: leftcol !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Row 1 Left: Work Task Dropdown */
.work-control-bar .timer-task-picker {
  margin: 0 0 4px 0 !important;
}

.work-control-bar .timer-task-picker label {
  height: 18px !important;
  line-height: 18px !important;
  margin-bottom: 4px !important;
  display: block !important;
}

.work-control-bar #timer-task-select {
  height: 40px !important;
  box-sizing: border-box !important;
}

/* Row 2 Left: Start Button + Timer Display */
.work-control-bar .timer-button {
  height: 42px !important;
  box-sizing: border-box !important;
  margin: 0 !important;
}

.work-control-bar .timer-clock,
.work-control-bar .timer-ready {
  height: 52px !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* ========================================================
   Right Column: Matched Heights
   ======================================================== */
.work-control-bar .field-evidence {
  grid-area: rightcol !important;
  display: flex !important;
  flex-direction: column-reverse !important; /* Photos above Notes */
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Row 1 Right: Photos Container */
.work-control-bar .field-evidence label.evidence-photo {
  height: 40px !important;
  margin-top: 22px !important; /* Offsets label height to align flush with dropdown */
  margin-bottom: 4px !important;
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 12px !important;
}

/* Row 2 Right: Notes Box (42px button + 8px gap + 52px clock = 102px total) */
.work-control-bar .field-evidence input[data-evidence-note],
.work-control-bar .field-evidence textarea[data-evidence-note] {
  height: 102px !important;
  min-height: 102px !important;
  max-height: 102px !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  font-size: 0.88rem !important;
  line-height: 1.4 !important;
}

/* ========================================================
   Top Job Header Banner (Immediate Visual Prominence)
   ======================================================== */
#job-top-banner {
  width: 100% !important;
  margin: 14px 0 16px 0 !important;
}

.job-page-hero-banner {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%) !important;
  color: #ffffff !important;
  border-radius: 10px !important;
  padding: 18px 24px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  border-left: 6px solid #f97316 !important; /* Prominent ezTradie orange accent */
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.12) !important;
}

.job-page-hero-banner .hero-crumbs,
.job-page-hero-banner .hero-crumbs * {
  color: #94a3b8 !important;
  font-size: 0.82rem !important;
  margin-bottom: 4px !important;
  text-decoration: none !important;
}

.job-page-hero-banner .hero-crumbs button {
  background: none !important;
  border: none !important;
  padding: 0 !important;
  color: #cbd5e1 !important;
  cursor: pointer !important;
  font-weight: 500 !important;
}

.job-page-hero-banner h1.hero-title {
  font-size: 1.6rem !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  margin: 2px 0 4px 0 !important;
  letter-spacing: -0.3px !important;
  line-height: 1.2 !important;
}

.job-page-hero-banner p.hero-sub {
  margin: 0 !important;
  color: #cbd5e1 !important;
  font-size: 0.92rem !important;
  font-weight: 400 !important;
}

.job-page-hero-banner .hero-status-pill {
  background: rgba(255, 255, 255, 0.15) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.25) !important;
  padding: 6px 14px !important;
  border-radius: 20px !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

/* ========================================================
   Top Job Header Banner (Immediate Visual Prominence)
   ======================================================== */
#job-top-banner {
  width: 100% !important;
  margin: 14px 0 16px 0 !important;
}

.job-page-hero-banner {
  background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%) !important;
  color: #ffffff !important;
  border-radius: 10px !important;
  padding: 18px 24px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  border-left: 6px solid #f97316 !important; /* Prominent ezTradie orange accent */
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.12) !important;
}

.job-page-hero-banner .hero-crumbs,
.job-page-hero-banner .hero-crumbs * {
  color: #94a3b8 !important;
  font-size: 0.82rem !important;
  margin-bottom: 4px !important;
  text-decoration: none !important;
}

.job-page-hero-banner .hero-crumbs button {
  background: none !important;
  border: none !important;
  padding: 0 !important;
  color: #cbd5e1 !important;
  cursor: pointer !important;
  font-weight: 500 !important;
}

.job-page-hero-banner h1.hero-title {
  font-size: 1.6rem !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  margin: 2px 0 4px 0 !important;
  letter-spacing: -0.3px !important;
  line-height: 1.2 !important;
}

.job-page-hero-banner p.hero-sub {
  margin: 0 !important;
  color: #cbd5e1 !important;
  font-size: 0.92rem !important;
  font-weight: 400 !important;
}

.job-page-hero-banner .hero-status-pill {
  background: rgba(255, 255, 255, 0.15) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.25) !important;
  padding: 6px 14px !important;
  border-radius: 20px !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

/* ========================================================
   Prominent Top Job Banner
   ======================================================== */
#job-top-banner {
  width: 100% !important;
  margin: 10px 0 16px 0 !important;
}

.job-page-hero-banner {
  background: #0f172a !important;
  color: #ffffff !important;
  border-radius: 10px !important;
  padding: 18px 24px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  border-left: 6px solid #f97316 !important;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.12) !important;
}

.job-page-hero-banner .hero-crumbs,
.job-page-hero-banner .hero-crumbs * {
  color: #94a3b8 !important;
  font-size: 0.82rem !important;
  margin: 0 0 4px 0 !important;
  text-decoration: none !important;
}

.job-page-hero-banner .hero-crumbs button {
  background: none !important;
  border: none !important;
  padding: 0 !important;
  color: #cbd5e1 !important;
  cursor: pointer !important;
  font-weight: 500 !important;
}

.job-page-hero-banner h1.hero-title {
  font-size: 1.65rem !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  margin: 2px 0 4px 0 !important;
  letter-spacing: -0.3px !important;
  line-height: 1.2 !important;
}

.job-page-hero-banner p.hero-sub {
  margin: 0 !important;
  color: #cbd5e1 !important;
  font-size: 0.92rem !important;
}

.job-page-hero-banner .hero-status-pill {
  background: rgba(255, 255, 255, 0.12) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.25) !important;
  padding: 6px 14px !important;
  border-radius: 20px !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

/* Ensure Optional status note reaches bottom of timer */
.work-control-bar .field-evidence input[data-evidence-note],
.work-control-bar .field-evidence textarea[data-evidence-note] {
  height: 114px !important;
  min-height: 114px !important;
  max-height: 114px !important;
}

/* Breadcrumbs positioned above the banner */
.job-nav-breadcrumb {
  display: flex !important;
  align-items: center !important;
  margin-bottom: 10px !important;
  padding: 2px 4px !important;
}

.job-nav-breadcrumb .crumb,
.job-nav-breadcrumb div {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 0.9rem !important;
  color: #64748b !important;
}

.job-nav-breadcrumb button {
  background: none !important;
  border: none !important;
  padding: 0 !important;
  color: #0284c7 !important; /* Standout clickable primary blue */
  font-weight: 600 !important;
  font-size: 0.92rem !important;
  cursor: pointer !important;
  text-decoration: underline !important;
}

.job-nav-breadcrumb button:hover {
  color: #0369a1 !important;
}

.job-nav-breadcrumb span {
  color: #475569 !important;
  font-weight: 500 !important;
}

/* ========================================================
   Global Breadcrumb Bar (Immediately Below Header)
   ======================================================== */
.global-breadcrumb-bar {
  display: flex !important;
  align-items: center !important;
  padding: 8px 4px !important;
  margin-bottom: 12px !important;
  border-bottom: 1px solid #e2e8f0 !important;
}

.global-breadcrumb-bar .crumb,
.global-breadcrumb-bar div {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 0.88rem !important;
  color: #64748b !important;
}

.global-breadcrumb-bar button {
  background: none !important;
  border: none !important;
  padding: 0 !important;
  color: #0284c7 !important;
  font-weight: 600 !important;
  font-size: 0.88rem !important;
  cursor: pointer !important;
  text-decoration: underline !important;
}

.global-breadcrumb-bar button:hover {
  color: #0369a1 !important;
}

.global-breadcrumb-bar span {
  color: #334155 !important;
  font-weight: 600 !important;
}

/* Customer name link in the dark hero banner */
.job-page-hero-banner .hero-customer-link {
  color: #ffffff !important;
  text-decoration: underline !important;
  text-decoration-color: rgba(255, 255, 255, 0.4) !important;
  text-underline-offset: 4px !important;
  transition: color 0.15s ease, text-decoration-color 0.15s ease !important;
}

.job-page-hero-banner .hero-customer-link:hover {
  color: #38bdf8 !important;
  text-decoration-color: #38bdf8 !important;
}

/* Customer name link in Customer and site card */
.customer-card-link {
  color: #0284c7 !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
  font-size: 1.05rem !important;
}

.customer-card-link:hover {
  color: #0369a1 !important;
}

/* --- MOAT Calendar Parity Styling --- */
#calendar {
  background: #ffffff;
  padding: 16px;
  border-radius: 12px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
  margin-top: 12px;
}
.fc-toolbar {
  margin-bottom: 1rem !important;
  flex-wrap: wrap;
  gap: 8px;
}
.fc-toolbar-title {
  font-size: 1.35rem !important;
  font-weight: 700 !important;
  color: #1a1a1a;
}
.fc-timegrid-slot-label-cushion,
.fc-timegrid-axis-cushion {
  color: #333333 !important;
  font-weight: 600;
  font-size: 12px;
}
.fc-col-header-cell-cushion {
  color: #0d6efd !important;
  font-weight: 700;
  text-decoration: none !important;
}
.fc-event {
  cursor: pointer;
  font-size: 12px;
  font-weight: 600;
  border-radius: 4px;
}
.fc-event-unavailable, .fc-event.unavailable-block {
  background-color: #8c959f !important;
  border-color: #6e7781 !important;
  color: #ffffff !important;
}
.travel-buffer-event {
  background-color: #eeeeee !important;
  background-image: repeating-linear-gradient(
    135deg,
    rgba(0, 0, 0, 0.08) 0,
    rgba(0, 0, 0, 0.08) 6px,
    rgba(255, 255, 255, 0.65) 6px,
    rgba(255, 255, 255, 0.65) 12px
  ) !important;
  border-color: #cccccc !important;
  color: #333333 !important;
}
.travel-buffer-label {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1px;
    color: #333 !important;
    font-weight: 800;
    font-size: 11px;
    line-height: 1.1;
    text-align: center;
}
.fc-day-today {
  background-color: rgba(254, 249, 231, 0.5) !important;
}

/* --- MOAT Parity: Travel Buffers & Mobile Vertical Labels --- */
.travel-buffer-event {
  background-color: #f0f0f0 !important;
  background-image: repeating-linear-gradient(
    135deg,
    rgba(0, 0, 0, 0.08) 0,
    rgba(0, 0, 0, 0.08) 6px,
    rgba(255, 255, 255, 0.7) 6px,
    rgba(255, 255, 255, 0.7) 12px
  ) !important;
  border: 1px solid #c0c0c0 !important;
  color: #333333 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  padding: 1px 2px !important;
  line-height: 1.1 !important;
  overflow: hidden !important;
}
.travel-car {
  font-size: 13px;
  line-height: 1;
  display: block;
}
.travel-word {
  font-size: 10px;
  font-weight: 700;
  text-transform: lowercase;
  color: #333;
}
.fc-event-unavailable, .unavailable-block {
  background-color: #7f8287 !important;
  border-color: #6c7075 !important;
  color: #ffffff !important;
}
@media (max-width: 767px) {
  .unavailable-vertical {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    transform: rotate(180deg);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.5px;
    padding: 4px 1px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .fc-col-header-cell-cushion {
    font-size: 11px !important;
    padding: 4px 1px !important;
  }
}

/* Navigation Icon Fix: Replace missing icon fonts with explicit arrows */
.fc-icon-chevron-left::before {
  content: "‹" !important;
  font-family: inherit !important;
  font-size: 1.4rem !important;
  line-height: 1 !important;
}
.fc-icon-chevron-right::before {
  content: "›" !important;
  font-family: inherit !important;
  font-size: 1.4rem !important;
  line-height: 1 !important;
}

/* Mobile Parity: Vertical text for Unavailable slots while preserving horizontal travel car */
@media (max-width: 767px) {
  .fc-timegrid-event.unavailable-block .fc-event-main,
  .fc-timegrid-event.unavailable-block .unavailable-vertical {
    writing-mode: vertical-rl !important;
    text-orientation: mixed !important;
    transform: rotate(180deg) !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    padding: 4px 2px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 0.5px !important;
  }

  /* Keep travel buffer icons and text normal / horizontal */
  .fc-timegrid-event.travel-buffer-event .fc-event-main {
    writing-mode: horizontal-tb !important;
    transform: none !important;
    text-align: center !important;
  }
}

/* =========================================================
   MOAT Parity: Travel Buffer & Vertical Unavailable Labels
   ========================================================= */
.travel-buffer-event {
    background-color: #eeeeee !important;
    background-image: repeating-linear-gradient(
        135deg,
        rgba(0,0,0,0.08) 0,
        rgba(0,0,0,0.08) 6px,
        rgba(255,255,255,0.65) 6px,
        rgba(255,255,255,0.65) 12px
    ) !important;
    border-color: #cccccc !important;
    color: #333 !important;
    font-size: 11px !important;
    font-weight: 700 !important;
}

.travel-buffer-event .fc-event-time,
.travel-buffer-event .fc-event-title {
    display: none !important;
}

.travel-buffer-event .fc-event-main {
    color: #333 !important;
    padding: 0 !important;
}

.travel-buffer-label {
    width: 100%;
    height: 100%;
    min-height: 16px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 2px;
    color: #333 !important;
    font-weight: 800;
    font-size: 11px;
    line-height: 1;
    white-space: nowrap;
    overflow: visible;
    padding-left: 1px;
}

.travel-car {
    flex: 0 0 auto;
}

.travel-word {
    flex: 0 0 auto;
}

.unavailable-vertical {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    font-weight: 700;
    font-size: 12px;
    letter-spacing: 0.5px;
    padding: 3px 1px;
}

.travel-buffer-label {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  gap: 1px !important;
  line-height: 1.1 !important;
}

/* Stacked Travel Buffer Badge */
.travel-buffer-label {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  padding: 2px 0 !important;
  text-align: center !important;
}
.travel-buffer-label .travel-car {
  display: block !important;
  font-size: 14px !important;
  line-height: 1 !important;
  margin-bottom: 2px !important;
}
.travel-buffer-label .travel-word {
  display: block !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  font-weight: 800 !important;
  font-size: 7.5px !important;
  text-transform: uppercase !important;
  letter-spacing: -0.3px !important;
  transform: scaleX(0.85) !important;
  transform-origin: center center !important;
  color: #333 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  overflow: visible !important;
}

/* Stacked MOAT Travel Badge */
.travel-buffer-event {
    background-image: repeating-linear-gradient(
        135deg,
        rgba(0,0,0,0.06) 0,
        rgba(0,0,0,0.06) 6px,
        rgba(255,255,255,0.25) 6px,
        rgba(255,255,255,0.25) 12px
    ) !important;
    border: 1px solid #ccc !important;
}
.travel-buffer-label {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    height: 100% !important;
    width: 100% !important;
    text-align: center !important;
    gap: 1px !important;
}
.travel-buffer-label .travel-car {
    font-size: 15px !important;
    line-height: 1 !important;
}
.travel-buffer-label .travel-word {
    font-size: 10px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    color: #333 !important;
    line-height: 1 !important;
}

/* Allow full calendar height on mobile without internal clipping */
.fc-scroller-liquid-absolute,
.fc-scroller {
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
}

/* Eliminate padding on travel events so letters dont get clipped */
.travel-buffer-event,
.travel-buffer-event .fc-event-main {
  padding: 0 !important;
  margin: 0 !important;
  overflow: visible !important;
}

.travel-buffer-label {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  text-align: center !important;
  padding: 0 !important;
}

.travel-buffer-label .travel-car {
  display: block !important;
  font-size: 13px !important;
  line-height: 1.1 !important;
}

.travel-buffer-label .travel-word {
  display: block !important;
  font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: 7px !important;
  font-weight: 800 !important;
  letter-spacing: -0.4px !important;
  text-transform: uppercase !important;
  color: #222 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  transform: scaleX(0.8) !important;
}