:root{
    --bg:#f3f6fb;--surface:#fff;--surface-2:#f8fafc;--text:#172033;--muted:#667085;
    --brand:#5b5bd6;--brand-2:#7c3aed;--success:#059669;--warning:#d97706;--danger:#dc2626;
    --info:#0284c7;--border:#e5e7eb;--shadow:0 14px 36px rgba(15,23,42,.08);--radius:18px;
}
*{box-sizing:border-box}html{font-size:16px}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;line-height:1.5}
a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer}.hidden{display:none!important}
.app-shell{min-height:100vh;display:grid;grid-template-columns:260px 1fr}.sidebar{position:sticky;top:0;height:100vh;background:linear-gradient(180deg,#15162b 0%,#20204a 100%);color:#fff;padding:22px 16px;overflow:auto}.brand{display:flex;align-items:center;gap:12px;padding:6px 8px 22px;font-weight:800}.brand-mark{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(135deg,#8b5cf6,#4f46e5);box-shadow:0 10px 24px rgba(124,58,237,.35)}.brand small{display:block;color:#aab0cf;font-weight:500;font-size:.72rem}.nav-title{font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;color:#8f95b7;margin:18px 10px 8px}.side-nav{display:grid;gap:5px}.side-nav a{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:12px;color:#d8dcf0;font-weight:650;font-size:.92rem}.side-nav a:hover,.side-nav a.active{background:rgba(255,255,255,.11);color:#fff}.nav-icon{width:24px;text-align:center}
.content-wrap{min-width:0}.topbar{height:72px;background:rgba(255,255,255,.9);backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:space-between;padding:0 28px;border-bottom:1px solid rgba(229,231,235,.8);position:sticky;top:0;z-index:20}.topbar-title strong{display:block;font-size:1rem}.topbar-title span{font-size:.78rem;color:var(--muted)}.user-chip{display:flex;align-items:center;gap:10px}.avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:800;background:linear-gradient(135deg,var(--brand),var(--brand-2))}.icon-btn{border:0;background:#eef2ff;color:#4338ca;border-radius:11px;padding:9px 12px}.main{padding:28px;max-width:1500px;margin:auto}.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:22px}.page-head h1{font-size:1.55rem;margin:0}.page-head p{margin:.35rem 0 0;color:var(--muted)}.toolbar{display:flex;flex-wrap:wrap;gap:9px}
.btn{border:0;border-radius:11px;padding:10px 15px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:7px;transition:.18s}.btn:hover{transform:translateY(-1px)}.btn-primary{color:#fff;background:linear-gradient(135deg,var(--brand),var(--brand-2));box-shadow:0 8px 20px rgba(91,91,214,.22)}.btn-secondary{background:#eef2f7;color:#344054}.btn-success{background:#ecfdf5;color:#047857}.btn-danger{background:#fef2f2;color:#b91c1c}.btn-warning{background:#fff7ed;color:#c2410c}.btn-sm{padding:7px 10px;font-size:.84rem}.btn-block{width:100%}
.card{background:var(--surface);border:1px solid rgba(229,231,235,.82);border-radius:var(--radius);box-shadow:var(--shadow)}.card-pad{padding:20px}.grid{display:grid;gap:18px}.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.kpi{padding:20px;position:relative;overflow:hidden}.kpi:after{content:"";position:absolute;width:100px;height:100px;border-radius:50%;right:-28px;top:-30px;background:rgba(91,91,214,.08)}.kpi-label{color:var(--muted);font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em}.kpi-value{font-size:1.45rem;font-weight:850;margin-top:6px;letter-spacing:-.03em}.kpi-note{font-size:.7rem;color:var(--muted);margin-top:5px}.kpi.primary{background:linear-gradient(135deg,#4f46e5,#7c3aed);color:#fff;border:0}.kpi.primary .kpi-label,.kpi.primary .kpi-note{color:#e7e7ff}.kpi.success .kpi-value{color:var(--success)}.kpi.warning .kpi-value{color:var(--warning)}.kpi.danger .kpi-value{color:var(--danger)}
.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}.section-title h2{font-size:.95rem;margin:0}.muted{color:var(--muted)}.small{font-size:.82rem}.text-end{text-align:right}.text-center{text-align:center}.fw-bold{font-weight:800}.mt-1{margin-top:6px}.mt-2{margin-top:12px}.mt-3{margin-top:18px}.mb-0{margin-bottom:0}.mb-2{margin-bottom:12px}.gap{height:18px}
.table-wrap{overflow:auto;border-radius:15px;border:1px solid var(--border)}table{width:100%;border-collapse:collapse;background:#fff}th,td{padding:13px 14px;text-align:left;border-bottom:1px solid #eef0f3;vertical-align:middle}th{font-size:.76rem;text-transform:uppercase;letter-spacing:.06em;color:#667085;background:#f8fafc;white-space:nowrap}td{font-size:.9rem}tbody tr:hover{background:#fafbff}tbody tr:last-child td{border-bottom:0}.amount{font-variant-numeric:tabular-nums;font-weight:750;white-space:nowrap}.badge{display:inline-flex;align-items:center;padding:5px 9px;border-radius:999px;font-size:.72rem;font-weight:800}.badge-success{background:#ecfdf3;color:#027a48}.badge-warning{background:#fff7ed;color:#c2410c}.badge-danger{background:#fef2f2;color:#b42318}.badge-info{background:#eff8ff;color:#026aa2}.badge-neutral{background:#f2f4f7;color:#475467}
.form-card{max-width:980px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.field{display:grid;gap:7px}.field.full{grid-column:1/-1}.field label{font-size:.82rem;font-weight:750;color:#344054}.required:after{content:" *";color:var(--danger)}.form-control{width:100%;border:1px solid #d0d5dd;background:#fff;border-radius:11px;padding:11px 12px;color:var(--text);outline:none;transition:.16s}.form-control:focus{border-color:#818cf8;box-shadow:0 0 0 3px rgba(99,102,241,.12)}textarea.form-control{min-height:92px;resize:vertical}.help{font-size:.76rem;color:var(--muted)}.error{font-size:.78rem;color:#b42318}.check-row{display:flex;align-items:center;gap:9px}.form-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:20px;padding-top:18px;border-top:1px solid var(--border)}
.alert{padding:13px 15px;border-radius:12px;margin-bottom:18px;border:1px solid}.alert-success{background:#ecfdf3;border-color:#abefc6;color:#067647}.alert-danger{background:#fef3f2;border-color:#fecdca;color:#b42318}.alert ul{margin:4px 0 0 18px;padding:0}.filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:15px}.filters .form-control{width:auto;min-width:170px}.search{min-width:250px!important}
.detail-hero{padding:23px;background:linear-gradient(135deg,#fff,#f8f7ff)}.detail-title{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.detail-title h1{margin:0;font-size:1.4rem}.stats-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px}.mini-stat{padding:14px;border-radius:13px;background:#f8fafc}.mini-stat span{display:block;color:var(--muted);font-size:.76rem;font-weight:700}.mini-stat strong{font-size:1.12rem}.timeline{display:grid;gap:12px}.timeline-item{display:flex;gap:12px}.timeline-dot{width:10px;height:10px;border-radius:50%;background:var(--brand);margin-top:7px;box-shadow:0 0 0 5px #eef2ff}.timeline-content{flex:1;padding-bottom:12px;border-bottom:1px solid var(--border)}
.quick-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.quick-action{padding:15px;text-align:center;background:#fff;border:1px solid var(--border);border-radius:14px;font-weight:750}.quick-action span{display:block;font-size:1.35rem;margin-bottom:4px}.allocation-row{display:grid;grid-template-columns:1fr 180px 42px;gap:9px;margin-bottom:9px}.allocation-summary{display:flex;justify-content:flex-end;gap:22px;padding:12px;background:#f8fafc;border-radius:12px;font-size:.88rem}.attachment-list{display:grid;gap:8px}.attachment-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 13px;border:1px solid var(--border);border-radius:11px}
.login-page{min-height:100vh;display:grid;grid-template-columns:1.1fr .9fr;background:#f7f8fc}.login-art{background:radial-gradient(circle at 20% 20%,#8b5cf6 0,transparent 35%),radial-gradient(circle at 80% 80%,#4f46e5 0,transparent 40%),#17172f;color:#fff;padding:70px;display:flex;flex-direction:column;justify-content:space-between}.login-art h1{font-size:3rem;line-height:1.04;margin:0;max-width:560px}.login-art p{color:#c9cbea;max-width:530px}.login-panel{display:grid;place-items:center;padding:30px}.login-card{width:min(430px,100%);background:#fff;border-radius:24px;padding:30px;box-shadow:0 25px 65px rgba(15,23,42,.12)}.login-card h2{margin:0 0 6px}.login-card .field{margin-top:15px}
.pagination{display:flex;gap:6px;list-style:none;padding:0;justify-content:flex-end}.page-link{display:block;padding:7px 10px;border:1px solid var(--border);border-radius:8px;background:#fff}.active>.page-link{background:var(--brand);color:#fff;border-color:var(--brand)}.disabled>.page-link{opacity:.45}.mobile-bottom,.mobile-top{display:none}.quick-fab{display:none}.print-only{display:none}
@media(max-width:1100px){.grid-4{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(2,1fr)}}

.searchable-select-wrap{position:relative;min-width:0}.searchable-select-native{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}.searchable-select-input{padding-right:34px;background:#fff}.searchable-select-menu{position:absolute;left:0;right:0;top:calc(100% + 5px);z-index:120;background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:0 14px 32px rgba(15,23,42,.14);max-height:280px;overflow:auto;padding:6px}.searchable-select-option{width:100%;border:0;background:transparent;border-radius:9px;padding:9px 10px;text-align:left;color:var(--text);display:flex;flex-direction:column;gap:2px}.searchable-select-option:hover,.searchable-select-option:focus,.searchable-select-option.selected{background:#f1f5f9;outline:0}.searchable-select-option small{color:var(--muted);font-size:.7rem;font-weight:700}.searchable-select-empty{padding:12px;color:var(--muted);font-size:.85rem;text-align:center}
@media(max-width:820px){body{padding-bottom:74px}.app-shell{display:block}.sidebar{display:none}.topbar{height:62px;padding:0 14px}.main{padding:16px}.topbar-title span{display:none}.user-chip .user-meta{display:none}.mobile-top{display:inline-flex}.page-head{align-items:center}.page-head h1{font-size:1.3rem}.page-head p{display:none}.page-head .toolbar .btn-secondary{display:none}.grid-4,.grid-3,.grid-2{grid-template-columns:1fr}.quick-actions{grid-template-columns:repeat(2,1fr)}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.stats-row{grid-template-columns:1fr 1fr}.filters{display:grid;grid-template-columns:1fr 1fr}.filters .form-control,.search{width:100%!important;min-width:0!important}.table-wrap{border:0;overflow:visible}.mobile-cards table,.mobile-cards thead,.mobile-cards tbody,.mobile-cards th,.mobile-cards td,.mobile-cards tr{display:block}.mobile-cards thead{display:none}.mobile-cards tbody{display:grid;gap:12px}.mobile-cards tr{background:#fff;border:1px solid var(--border);border-radius:14px;padding:12px;box-shadow:0 6px 18px rgba(15,23,42,.04)}.mobile-cards td{border:0;padding:6px 4px;display:flex;justify-content:space-between;gap:12px;text-align:right}.mobile-cards td:before{content:attr(data-label);font-size:.74rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:750;text-align:left}.mobile-cards td[data-label=""]:before{display:none}.mobile-cards td.actions{justify-content:flex-end;padding-top:10px;border-top:1px solid var(--border);margin-top:5px}.allocation-row{grid-template-columns:1fr 120px 38px}.mobile-bottom{position:fixed;display:grid;grid-template-columns:repeat(5,1fr);left:0;right:0;bottom:0;z-index:50;background:#fff;border-top:1px solid var(--border);box-shadow:0 -8px 30px rgba(15,23,42,.08);padding:7px 5px calc(7px + env(safe-area-inset-bottom))}.mobile-bottom a{display:grid;place-items:center;gap:2px;color:#667085;font-size:.68rem;font-weight:700}.mobile-bottom a .mi{font-size:1.18rem}.mobile-bottom a.active{color:var(--brand)}.mobile-bottom .add-circle{width:42px;height:42px;margin-top:-18px;border-radius:50%;background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;font-size:1.5rem;box-shadow:0 8px 18px rgba(91,91,214,.3)}.quick-fab{position:fixed;right:16px;bottom:86px;z-index:40}.form-actions{position:sticky;bottom:72px;background:#fff;padding:12px 0 4px;z-index:10}.login-page{display:block}.login-art{display:none}.login-panel{min-height:100vh;padding:18px}.login-card{padding:24px}.detail-title{display:block}.detail-title .toolbar{margin-top:12px}}
@media(max-width:480px){.grid-4{grid-template-columns:1fr}.stats-row{grid-template-columns:1fr}.filters{grid-template-columns:1fr}.allocation-row{grid-template-columns:1fr 100px 38px}.kpi-value{font-size:1.25rem}.main{padding:13px}}
@media print{body{background:#fff;padding:0}.sidebar,.topbar,.mobile-bottom,.no-print,.btn,.filters{display:none!important}.app-shell{display:block}.main{padding:0;max-width:none}.card{box-shadow:none;border:0}.print-only{display:block}.table-wrap{overflow:visible;border:1px solid #ddd}table{font-size:11px}th,td{padding:7px}.page-break{page-break-before:always}}
.list-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 2px;border-bottom:1px solid var(--border)}.list-row:last-child{border-bottom:0}.list-row:hover strong{color:var(--brand)}.empty-state{padding:26px 12px;text-align:center;color:var(--muted);background:var(--surface-2);border-radius:13px}.note-box{padding:13px 15px;border-radius:12px;background:#f5f3ff;color:#5b21b6;border:1px solid #ddd6fe}.warning-box{padding:13px 15px;border-radius:12px;background:#fff7ed;color:#9a3412;border:1px solid #fed7aa}.info-grid{display:grid;grid-template-columns:170px 1fr;gap:8px 16px}.info-grid dt{color:var(--muted);font-size:.8rem;font-weight:700}.info-grid dd{margin:0;font-weight:650}.divider{height:1px;background:var(--border);margin:18px 0}.danger-zone{border:1px dashed #fca5a5;background:#fffafa}.file-input{padding:10px;background:#f8fafc}.inline-form{display:flex;gap:10px;align-items:end;flex-wrap:wrap}.inline-form .field{min-width:180px}.pill-credit{background:#ecfdf3;color:#047857}.pill-due{background:#fef2f2;color:#b91c1c}.metric-row{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px dashed var(--border)}.metric-row:last-child{border-bottom:0}.statement-balance.negative{color:var(--success)}.statement-balance.positive{color:var(--danger)}.mobile-only{display:none}
@media(max-width:820px){.info-grid{grid-template-columns:1fr;gap:3px}.info-grid dd{margin-bottom:10px}.mobile-only{display:block}.desktop-only{display:none}.list-row{padding:13px 0}.inline-form{display:grid;grid-template-columns:1fr}.inline-form .field{min-width:0}}
.report-card{transition:.18s}.report-card:hover{transform:translateY(-3px);box-shadow:0 18px 45px rgba(15,23,42,.12);border-color:#c7d2fe}.report-card h2{margin:10px 0 4px;font-size:1.05rem}.report-card p{min-height:50px}.report-icon{width:44px;height:44px;border-radius:13px;background:#eef2ff;color:#4338ca;display:grid;place-items:center;font-size:1.25rem;font-weight:800}
.audit-json{max-width:420px}.audit-json pre{white-space:pre-wrap;word-break:break-word;background:#0f172a;color:#e2e8f0;padding:10px;border-radius:9px;font-size:.72rem;max-height:190px;overflow:auto}details summary{cursor:pointer;color:var(--brand);font-weight:700}

/* Development work payment modal */
.payment-paid{color:var(--success)}.payment-due{color:var(--danger)}.payment-cleared{color:var(--success)}.work-actions{white-space:nowrap}.work-actions .btn,.work-actions .badge{margin:2px 2px 2px 0}
.modal-overlay{position:fixed;inset:0;z-index:1000;background:rgba(15,23,42,.58);backdrop-filter:blur(4px);display:grid;place-items:center;padding:18px;overflow:auto}.modal-sheet{width:min(720px,100%);max-height:calc(100vh - 36px);overflow:auto;background:#fff;border:1px solid rgba(255,255,255,.7);border-radius:22px;box-shadow:0 28px 90px rgba(15,23,42,.28);animation:modalIn .16s ease-out}.modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:20px 22px 15px;border-bottom:1px solid var(--border);position:sticky;top:0;background:#fff;z-index:2}.modal-head h2{margin:1px 0 2px;font-size:1.25rem}.modal-kicker{font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;color:var(--brand);font-weight:850}.modal-close{width:38px;height:38px;border:0;border-radius:11px;background:#f2f4f7;color:#475467;font-size:1.5rem;line-height:1;display:grid;place-items:center}.modal-close:hover{background:#e4e7ec}.payment-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:16px 22px;background:linear-gradient(135deg,#f8faff,#f7f5ff)}.payment-summary>div{padding:12px;border:1px solid #e7e9f8;border-radius:13px;background:rgba(255,255,255,.88)}.payment-summary span{display:block;font-size:.71rem;color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.05em}.payment-summary strong{display:block;margin-top:3px;font-size:1.05rem}.payment-summary .due strong{color:var(--danger)}#workPaymentForm{padding:20px 22px 22px}.modal-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px;padding-top:16px;border-top:1px solid var(--border)}body.modal-open{overflow:hidden}@keyframes modalIn{from{opacity:.5;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}}
@media(max-width:820px){.work-actions{white-space:normal;display:flex!important;flex-wrap:wrap;justify-content:flex-end!important}.work-actions:before{display:none!important}.modal-overlay{place-items:end center;padding:0}.modal-sheet{width:100%;max-height:92vh;border-radius:22px 22px 0 0;animation:sheetIn .18s ease-out}.modal-head{padding:17px 16px 13px}.payment-summary{padding:13px 16px;gap:7px}.payment-summary>div{padding:10px 8px}.payment-summary strong{font-size:.95rem}#workPaymentForm{padding:16px 16px calc(18px + env(safe-area-inset-bottom))}.payment-form-grid{gap:13px}.modal-actions{position:sticky;bottom:0;background:#fff;margin-left:-16px;margin-right:-16px;padding:12px 16px calc(4px + env(safe-area-inset-bottom));z-index:2}.modal-actions .btn{flex:1}@keyframes sheetIn{from{transform:translateY(30px);opacity:.7}to{transform:none;opacity:1}}}
@media(max-width:480px){.payment-summary{grid-template-columns:1fr 1fr}.payment-summary .due{grid-column:1/-1}.payment-summary .due strong{font-size:1.12rem}}

/* Current user profile */
.user-profile-link{display:flex;align-items:center;gap:10px;border-radius:12px;padding:3px 5px;transition:.16s}.user-profile-link:hover{background:#f5f7fb}.profile-grid{align-items:start}.profile-grid .card{height:100%}
@media(max-width:820px){.user-profile-link{padding:0}.profile-grid{grid-template-columns:1fr}.profile-grid .form-actions{bottom:72px}}

/* Database backup */
.backup-panel{display:flex;align-items:center;gap:16px;padding:4px 0 18px}.backup-icon{width:58px;height:58px;border-radius:17px;display:grid;place-items:center;background:linear-gradient(135deg,#eef2ff,#f5f3ff);color:var(--brand);font-size:1.7rem;font-weight:900}.backup-main h2{margin:0 0 5px;font-size:1.08rem}.backup-db{font-size:.88rem;color:var(--muted);word-break:break-all}.backup-action{padding-top:18px;border-top:1px solid var(--border);max-width:360px}
@media(max-width:820px){.backup-action{max-width:none}.backup-panel{padding-top:0}.backup-icon{width:52px;height:52px;border-radius:15px}}

/* Hide native number spinners while retaining numeric fields and validation. */
input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield;appearance:textfield}

/* Dashboard toolbar alignment */
@media(max-width:820px){.dashboard-head{flex-direction:column;align-items:stretch;justify-content:flex-start;gap:12px}.dashboard-head .toolbar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:100%}.dashboard-head .toolbar .btn{justify-content:center;white-space:nowrap;padding:10px 6px;font-size:.82rem}}
@media(max-width:480px){.dashboard-head .toolbar{grid-template-columns:1fr}}
.btn-solid-success{color:#fff;background:linear-gradient(135deg,#059669,#10b981);box-shadow:0 8px 20px rgba(5,150,105,.22)}.btn-solid-warning{color:#fff;background:linear-gradient(135deg,#d97706,#f59e0b);box-shadow:0 8px 20px rgba(217,119,6,.22)}

/* Simple work changes */
.change-description{min-width:280px;max-width:560px;white-space:normal;line-height:1.55}.change-thumbs{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-start}.change-thumbs a{display:block;width:54px;height:54px;border-radius:10px;overflow:hidden;border:1px solid var(--border);background:#f8fafc;box-shadow:0 2px 8px rgba(15,23,42,.06)}.change-thumbs img{width:100%;height:100%;object-fit:cover;display:block}.change-thumbs a:hover{border-color:#a5b4fc;transform:translateY(-1px)}.change-actions form{display:inline}.change-form{padding:20px 22px 22px}.change-modal-sheet{width:min(680px,100%)}
@media(max-width:820px){.change-description{min-width:0;max-width:none}.change-thumbs{justify-content:flex-end}.change-actions{display:flex!important;justify-content:flex-end!important}.change-actions:before{display:none!important}.change-form{padding:16px 16px calc(18px + env(safe-area-inset-bottom))}}

/* Change image source choices */
.change-upload-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.change-upload-choice{position:relative;min-height:82px;border:1px dashed #c7d2fe;border-radius:14px;background:#fafaff;color:#4338ca;display:flex!important;align-items:center;justify-content:center;gap:9px;padding:14px;font-weight:800;cursor:pointer;text-align:center;transition:.16s}.change-upload-choice:hover{border-color:#818cf8;background:#f5f3ff;transform:translateY(-1px)}.change-upload-choice input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.change-upload-icon{font-size:1.25rem;line-height:1}

/* Settings maintenance actions */
.maintenance-card{max-width:980px}.maintenance-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.maintenance-actions form{margin:0}.maintenance-btn{width:100%;min-height:74px;border:1px solid var(--border);border-radius:14px;background:#f8fafc;color:#344054;padding:12px;display:flex;align-items:center;gap:10px;text-align:left;font-weight:800;transition:.16s}.maintenance-btn:hover{background:#f5f3ff;border-color:#c7d2fe;transform:translateY(-1px)}.maintenance-primary{background:#eef2ff;color:#4338ca;border-color:#c7d2fe}.maintenance-icon{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;flex:0 0 34px;background:#fff;border:1px solid #e4e7ec;color:var(--brand);font-weight:900}.maintenance-output{border-top:1px solid var(--border);padding-top:14px}.maintenance-output summary{font-size:.85rem}.maintenance-output pre{white-space:pre-wrap;word-break:break-word;background:#0f172a;color:#e2e8f0;padding:12px;border-radius:11px;font-size:.75rem;max-height:260px;overflow:auto}
@media(max-width:820px){.change-upload-options{grid-template-columns:1fr 1fr}.maintenance-actions{grid-template-columns:1fr 1fr}.maintenance-btn{min-height:68px}.maintenance-card{padding-bottom:calc(20px + env(safe-area-inset-bottom))}}
@media(max-width:480px){.change-upload-options{grid-template-columns:1fr}.maintenance-actions{grid-template-columns:1fr}}

/* Changes save/compression progress. */
.change-processing{display:flex;align-items:center;gap:12px;margin-top:16px;padding:12px 14px;border:1px solid #dbe5ff;border-radius:13px;background:#f7f9ff;color:#344054}.change-processing-copy{display:flex;flex-direction:column;gap:2px;min-width:0}.change-processing-copy strong{font-size:.9rem}.change-processing-copy span{font-size:.78rem;color:var(--muted)}.change-processing-spinner,.change-submit-spinner{display:inline-block;border-radius:50%;border:2px solid currentColor;border-right-color:transparent;animation:changeSpin .7s linear infinite}.change-processing-spinner{width:24px;height:24px;color:var(--brand);flex:0 0 auto}.change-submit-spinner{width:14px;height:14px;margin-right:7px;vertical-align:-2px}.btn[data-change-submit]{display:inline-flex;align-items:center;justify-content:center}.btn[data-change-submit]:disabled{cursor:wait;opacity:.78}.modal-close:disabled,.btn[data-close-change-modal]:disabled{cursor:not-allowed;opacity:.55}@keyframes changeSpin{to{transform:rotate(360deg)}}

/* Change edit modal: existing screenshots can be explicitly marked for deletion. */
.change-edit-existing{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}.change-edit-existing-item{position:relative;width:96px;padding:6px;border:1px solid var(--border);border-radius:13px;background:#fff;transition:.16s}.change-edit-preview{display:block;width:82px;height:74px;border-radius:9px;overflow:hidden;background:#f8fafc}.change-edit-preview img{width:100%;height:100%;object-fit:cover;display:block}.change-edit-delete{display:flex!important;align-items:center;justify-content:center;gap:5px;margin-top:6px;font-size:.76rem;font-weight:800;color:#b42318;cursor:pointer}.change-edit-delete input{margin:0}.change-edit-existing-item.pending-delete{opacity:.5;border-color:#fda29b;background:#fff5f4}.change-edit-existing-item.pending-delete .change-edit-preview{filter:grayscale(1)}
@media(max-width:480px){.change-edit-existing{gap:8px}.change-edit-existing-item{width:88px}.change-edit-preview{width:74px;height:68px}}

/* Sidebar toggle */
.mobile-menu-toggle{display:inline-flex;border:0;background:#eef2ff;color:#4338ca;border-radius:10px;width:38px;height:38px;font-size:1.3rem;line-height:1;align-items:center;justify-content:center;cursor:pointer;flex:0 0 auto}
.sidebar-backdrop{display:none}
@media(max-width:820px){
.sidebar{position:fixed;top:0;left:0;bottom:0;height:100vh;width:min(300px,84vw);transform:translateX(-100%);transition:transform .25s ease;z-index:1001;display:block;overflow:auto}
body.sidebar-open .sidebar{transform:translateX(0)}
body.sidebar-open{overflow:hidden}
.sidebar-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.55);z-index:1000}
body.sidebar-open .sidebar-backdrop{display:block}
}
@media(min-width:821px){
body.sidebar-collapsed .app-shell{grid-template-columns:1fr}
body.sidebar-collapsed .sidebar{display:none}
}