:root{
  --paper:#F5F7FA;
  --paper-light:#FFFFFF;
  --ink:#1F2A37;
  --ink-light:#4B5563;
  --stamp:#B4532A;
  --stamp-dark:#8A3D1E;
  --olive:#0F766E;
  --kraft:#D89A2B;
  --border:#D8DEE8;
  --border-light:#E8EDF4;
  --muted:#7A8696;
  --surface:#FFFFFF;
  --surface-soft:#F8FAFC;
  --nav:#182230;
  --focus:#2F80ED;
  --shadow-sm:0 1px 2px rgba(16,24,40,0.06);
  --shadow-md:0 10px 28px rgba(16,24,40,0.12);
}
*{box-sizing:border-box;}
body{
  margin:0;
  font-family:'Sarabun',sans-serif;
  background:var(--paper);
  color:var(--ink);
  min-height:100vh;
}
.hidden{display:none !important;}
button{font-family:inherit;cursor:pointer;}
button:disabled{cursor:not-allowed;opacity:0.65;}
input,textarea,select{font-family:inherit;}
button,input,textarea,select{font-size:14px;}
button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--focus);outline-offset:2px;}

/* ---------- layout helpers ---------- */
.container{max-width:1040px;margin:0 auto;padding:0 18px;}
.center-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;}
.flex{display:flex;}
.flex-col{display:flex;flex-direction:column;}
.items-center{align-items:center;}
.justify-between{justify-content:space-between;}
.gap-2{gap:8px;}
.gap-3{gap:12px;}

/* ---------- auth ---------- */
.auth-wrap{min-height:100vh;background:linear-gradient(135deg,#182230 0%,#24364A 58%,#31555B 100%);display:flex;align-items:center;justify-content:center;padding:16px;}
.auth-box{width:100%;max-width:380px;}
.auth-header{text-align:center;margin-bottom:24px;}
.auth-badge{
  width:56px;height:56px;border-radius:8px;background:var(--stamp);border:1px solid rgba(255,255,255,0.18);
  display:flex;align-items:center;justify-content:center;margin:0 auto 12px;
  color:white;font-size:24px;font-weight:700;
  box-shadow:var(--shadow-md);
}
.auth-title{font-family:'Taviraj',serif;font-weight:600;color:var(--paper);font-size:22px;margin:0;}
.auth-sub{color:#c7cdd4;font-size:13px;margin-top:6px;}
.auth-card{background:var(--surface);border:1px solid rgba(255,255,255,0.18);border-radius:8px;padding:24px;box-shadow:var(--shadow-md);}
.tab-row{display:flex;border:1px solid var(--border);border-radius:8px;overflow:hidden;margin-bottom:20px;background:var(--surface-soft);padding:3px;}
.tab-btn{flex:1;padding:8px 0;font-size:14px;font-weight:500;background:transparent;color:var(--ink);border:none;}
.tab-btn.active{background:var(--nav);color:white;border-radius:6px;box-shadow:var(--shadow-sm);}
.field{margin-bottom:14px;}
.field label{display:block;font-size:12px;font-weight:600;color:var(--ink-light);margin-bottom:5px;}
.input-row{display:flex;align-items:center;gap:8px;background:white;border:1px solid var(--border);border-radius:8px;padding:9px 12px;transition:border-color .15s ease, box-shadow .15s ease;}
.input-row:focus-within{border-color:var(--focus);box-shadow:0 0 0 3px rgba(47,128,237,0.12);}
.input-row input, .input-row select{border:none;outline:none;background:transparent;flex:1;min-width:0;font-size:14px;color:var(--ink);}
.input-row svg{flex-shrink:0;color:var(--olive);}
textarea.plain{width:100%;background:white;border:1px solid var(--border);border-radius:8px;padding:10px 12px;font-size:14px;outline:none;resize:vertical;min-height:104px;transition:border-color .15s ease, box-shadow .15s ease;}
textarea.plain:focus{border-color:var(--focus);box-shadow:0 0 0 3px rgba(47,128,237,0.12);}
.btn-primary{
  width:100%;display:flex;align-items:center;justify-content:center;gap:8px;
  background:var(--olive);color:white;border:none;border-radius:8px;padding:11px 14px;font-size:14px;font-weight:700;
  box-shadow:var(--shadow-sm);transition:background .15s ease, transform .15s ease, box-shadow .15s ease;
}
.btn-primary:hover{background:#0B625C;box-shadow:0 4px 12px rgba(15,118,110,0.22);}
.btn-secondary{display:flex;align-items:center;justify-content:center;border:1px solid var(--border);background:var(--surface);color:var(--ink);border-radius:8px;padding:9px 12px;font-size:13px;font-weight:700;white-space:nowrap;box-shadow:var(--shadow-sm);}
.btn-secondary:hover{border-color:var(--olive);color:var(--olive);}
.btn-primary:active{transform:scale(0.98);}
.btn-secondary:active{transform:scale(0.98);}
.error-box{font-size:12px;background:#FFF3EF;color:#9A3412;border:1px solid #FED7AA;border-radius:8px;padding:9px 12px;margin-bottom:12px;}
.success-box{font-size:13px;background:#ECFDF5;color:#065F46;border:1px solid #A7F3D0;border-radius:8px;padding:11px 14px;margin-bottom:14px;font-weight:700;}
.auth-footnote{text-align:center;font-size:12px;color:#8a95a1;margin-top:16px;}

/* ---------- topbar ---------- */
.topbar{background:var(--nav);border-bottom:1px solid rgba(255,255,255,0.08);position:sticky;top:0;z-index:20;box-shadow:0 1px 16px rgba(16,24,40,0.18);}
.topbar-inner{max-width:1040px;margin:0 auto;padding:12px 18px;display:flex;align-items:center;justify-content:space-between;gap:12px;}
.topbar-logo{width:36px;height:36px;border-radius:8px;background:var(--olive);display:flex;align-items:center;justify-content:center;color:white;flex-shrink:0;}
.topbar-title{font-family:'Taviraj',serif;font-weight:600;color:var(--paper);font-size:17px;line-height:1.2;margin:0;}
.topbar-sub{font-size:11px;color:#9aa5b1;margin:0;}
.nav-btn{display:flex;align-items:center;gap:6px;padding:7px 12px;border-radius:8px;font-size:14px;font-weight:600;border:1px solid rgba(255,255,255,0.13);background:rgba(255,255,255,0.04);color:#D4DAE4;transition:background .15s ease, border-color .15s ease, color .15s ease;}
.nav-btn:hover{background:rgba(255,255,255,0.09);border-color:rgba(255,255,255,0.24);}
.nav-btn.active{background:var(--olive);color:white;border-color:var(--olive);}
.nav-btn.logout{color:#F3B7A3;margin-left:4px;}

/* ---------- search and settings ---------- */
.page-heading{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:14px;}
.page-heading p{margin:0 0 3px;color:var(--olive);font-size:12px;font-weight:800;}
.page-heading h2{margin:0;font-family:'Taviraj',serif;font-size:24px;color:var(--nav);}
.search-panel{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:16px;box-shadow:var(--shadow-sm);margin-bottom:14px;}
.search-query{margin-bottom:12px;}
.search-filter-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;}
.search-filter-grid .field{margin-bottom:0;}
.search-filter-grid input,.search-filter-grid select,.settings-form input{width:100%;height:40px;border:1px solid var(--border);border-radius:8px;background:white;color:var(--ink);padding:8px 10px;}
.search-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px;}
.search-actions .btn-primary,.search-actions .btn-secondary{width:auto;min-width:112px;}
.search-result-head{display:flex;align-items:center;justify-content:space-between;margin:16px 0 10px;color:var(--nav);}
.search-result-head span{font-size:12px;color:var(--stamp);}
.search-results{display:grid;gap:10px;}
.search-task{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;background:white;border:1px solid var(--border);border-left:4px solid var(--olive);border-radius:8px;padding:14px;box-shadow:var(--shadow-sm);}
.search-task-main{min-width:0;flex:1;}
.search-task h3{font-size:16px;margin:1px 0 5px;color:var(--nav);}
.search-task-date{margin:0;color:var(--stamp);font-size:12px;font-weight:800;}
.search-open{flex-shrink:0;}
.search-thumbs{display:flex;gap:6px;margin-top:9px;overflow-x:auto;}
.search-thumbs img{width:58px;height:58px;object-fit:cover;border:1px solid var(--border);border-radius:6px;}
.search-empty{min-height:180px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:white;border:1px dashed var(--border);border-radius:8px;color:var(--muted);padding:24px;}
.search-empty h3{margin:0 0 5px;color:var(--nav);}
.search-empty p{margin:4px 0 0;}
.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:start;}
.settings-section{background:white;border:1px solid var(--border);border-radius:8px;padding:18px;box-shadow:var(--shadow-sm);}
.settings-section-head{display:flex;align-items:flex-start;gap:10px;padding-bottom:13px;margin-bottom:14px;border-bottom:1px solid var(--border-light);color:var(--olive);}
.settings-section-head h3{margin:0;color:var(--nav);font-size:16px;}
.settings-section-head p{margin:3px 0 0;color:var(--muted);font-size:12px;}
.settings-section-head.danger{color:var(--stamp);}
.settings-form .btn-primary{margin-top:4px;}
.settings-divider{height:1px;background:var(--border);margin:20px 0;}
.backup-download{text-decoration:none;}
.btn-danger{width:100%;display:flex;align-items:center;justify-content:center;background:var(--stamp);color:white;border:none;border-radius:8px;padding:11px 14px;font-weight:700;}
.btn-danger:hover{background:var(--stamp-dark);}
.settings-alert{font-size:13px;}

/* ---------- calendar ---------- */
.cal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:12px 14px;box-shadow:var(--shadow-sm);}
.cal-nav-btn{padding:8px;border-radius:8px;border:1px solid var(--border);background:var(--surface-soft);color:var(--ink);display:flex;}
.cal-nav-btn:hover{border-color:var(--olive);color:var(--olive);}
.cal-title{font-family:'Taviraj',serif;font-weight:600;font-size:22px;margin:0;}
.cal-grid-wrap{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:8px;overflow:hidden;box-shadow:var(--shadow-sm);}
.cal-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,0.6);z-index:5;}
.cal-dow-row{display:grid;grid-template-columns:repeat(7,1fr);border-bottom:1px solid var(--border);background:var(--surface-soft);}
.cal-dow{text-align:center;font-size:12px;font-weight:700;padding:10px 4px;color:var(--ink-light);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.cal-dow.sun{color:var(--stamp);}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);}
.cal-cell-empty{height:92px;border-right:1px solid var(--border-light);border-bottom:1px solid var(--border-light);background:#FBFCFE;}
.cal-cell{
  position:relative;height:92px;display:flex;flex-direction:column;align-items:flex-start;padding:8px;
  border-right:1px solid var(--border-light);border-bottom:1px solid var(--border-light);
  background:white;border-top:none;border-left:none;text-align:left;transition:background .15s ease, box-shadow .15s ease;
}
.cal-cell:hover{background:#F0FDFA;box-shadow:inset 0 0 0 1px rgba(15,118,110,0.18);}
.cal-daynum{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:500;color:var(--ink);}
.cal-daynum.today{background:var(--olive);color:white;font-weight:700;}
.cal-count{margin-top:7px;font-size:10px;padding:2px 6px;border-radius:999px;font-family:'Courier Prime',monospace;font-weight:700;}
.cal-count.has-task{background:#CCFBF1;color:#115E59;}
.cal-count.zero-task{background:#F1F5F9;color:#94A3B8;}
.cal-stamp{
  position:absolute;top:6px;right:6px;width:22px;height:22px;border-radius:999px;background:var(--stamp);
  border:2px solid white;color:white;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;
  font-family:'Courier Prime',monospace;box-shadow:var(--shadow-sm);
}
.cal-hint{font-size:12px;color:#8a8172;margin-top:12px;}

/* ---------- dashboard ---------- */
.dashboard-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;background:linear-gradient(135deg,#111827 0%,#1E3A4A 58%,#0F766E 100%);color:white;border-radius:8px;padding:24px;margin-bottom:18px;box-shadow:var(--shadow-md);}
.dashboard-eyebrow{font-family:'Courier Prime',monospace;letter-spacing:0.14em;font-size:12px;color:#A7F3D0;margin:0 0 6px;font-weight:700;}
.dashboard-hero h2{font-family:'Taviraj',serif;font-size:28px;line-height:1.2;margin:0;}
.dashboard-hero p{margin:6px 0 0;color:#D6F5F2;font-weight:700;}
.dashboard-controls{display:flex;align-items:center;gap:8px;flex-shrink:0;}
.dashboard-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:14px;}
.dashboard-kpi{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:16px;border-top:4px solid var(--olive);box-shadow:var(--shadow-sm);}
.dashboard-kpi:nth-child(2){border-top-color:var(--focus);}
.dashboard-kpi:nth-child(3){border-top-color:var(--stamp);}
.dashboard-kpi span{display:block;color:var(--muted);font-size:12px;font-weight:800;margin-bottom:6px;}
.dashboard-kpi strong{font-size:34px;line-height:1;color:var(--nav);font-weight:900;}
.dashboard-kpi small{margin-left:6px;color:var(--ink-light);font-weight:700;}
.dashboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:14px;}
.dashboard-panel{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:16px;box-shadow:var(--shadow-sm);}
.dashboard-panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--border-light);}
.dashboard-panel-head h3{margin:0;font-size:16px;color:var(--nav);}
.dashboard-panel-head span{font-size:12px;color:var(--olive);font-weight:800;background:#CCFBF1;border-radius:999px;padding:4px 9px;}
.dashboard-list{display:grid;gap:8px;}
.dashboard-row{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--surface-soft);border:1px solid var(--border-light);border-radius:8px;padding:10px 12px;}
.dashboard-row span{color:var(--ink-light);font-size:13px;}
.dashboard-row strong{color:var(--nav);font-size:13px;white-space:nowrap;}
.dashboard-recent-list{display:grid;gap:10px;}
.dashboard-recent-item{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;border:1px solid var(--border-light);border-left:4px solid var(--olive);border-radius:8px;padding:12px;background:white;}
.dashboard-recent-item strong{display:block;color:var(--nav);font-size:14px;margin-bottom:3px;}
.dashboard-recent-item p{margin:0;color:var(--ink-light);font-size:12px;}
.dashboard-recent-meta{text-align:right;white-space:nowrap;}
.dashboard-recent-meta span{display:block;color:var(--olive);font-size:12px;font-weight:800;}
.dashboard-recent-meta small{color:var(--muted);font-size:11px;}
.dashboard-empty{background:var(--surface);border:1px dashed var(--border);border-radius:8px;padding:34px 18px;text-align:center;box-shadow:var(--shadow-sm);}
.dashboard-empty h3{margin:0 0 6px;color:var(--nav);}
.dashboard-empty p{margin:0;color:var(--muted);}

/* ---------- modals ---------- */
.modal-overlay{position:fixed;inset:0;background:rgba(15,23,42,0.52);z-index:30;display:flex;align-items:flex-end;justify-content:center;backdrop-filter:blur(3px);}
.modal-box{width:100%;max-width:560px;background:var(--surface);border-radius:8px 8px 0 0;max-height:85vh;display:flex;flex-direction:column;box-shadow:var(--shadow-md);border:1px solid rgba(255,255,255,0.22);}
@media (min-width:768px){
  .modal-overlay{align-items:center;}
  .modal-box{border-radius:8px;max-height:88vh;}
}
.modal-header{display:flex;align-items:center;justify-content:space-between;padding:17px 20px;border-bottom:1px solid var(--border);background:var(--surface-soft);}
.modal-eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:0.06em;color:var(--olive);margin:0;font-weight:700;}
.modal-title{font-family:'Taviraj',serif;font-weight:600;font-size:18px;margin:2px 0 0;}
.icon-btn{border:none;background:transparent;padding:6px;border-radius:50%;color:var(--ink);}
.icon-btn:hover{background:rgba(0,0,0,0.05);}
.modal-body{flex:1;overflow-y:auto;padding:16px 20px;}
.modal-footer{padding:16px 20px;border-top:1px solid var(--border);display:flex;gap:8px;background:var(--surface-soft);}
.location-grid{display:grid;grid-template-columns:1fr;gap:8px;}
.coord-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;}
.coord-actions{display:flex;gap:8px;}
.draft-notice{display:flex;flex-direction:column;gap:2px;background:#EFF6FF;border:1px solid #BFDBFE;color:#1E40AF;border-radius:8px;padding:10px 12px;margin-bottom:14px;font-size:12px;}
.draft-status{font-size:11px;color:var(--muted);margin:4px 0 0;text-align:center;}
.map-picker-box{max-width:820px;height:min(720px,90vh);}
.map-picker-help{padding:9px 16px;background:#EFF6FF;color:#1E40AF;font-size:12px;border-bottom:1px solid #BFDBFE;}
#map-picker-canvas{flex:1;min-height:360px;background:#E5E7EB;}
.map-picker-footer{align-items:center;justify-content:space-between;}
.map-picker-footer code{font-family:'Courier Prime',monospace;font-size:13px;color:var(--nav);}
.map-picker-footer .btn-primary{width:auto;min-width:140px;}

.task-card{background:white;border:1px solid var(--border);border-radius:8px;padding:14px;margin-bottom:12px;box-shadow:var(--shadow-sm);}
.task-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;}
.task-card h4{margin:0;font-size:15px;font-weight:700;color:var(--ink);}
.task-loc{display:flex;align-items:center;gap:4px;font-size:12px;color:var(--olive);margin:6px 0 0;font-weight:600;}
.task-desc{font-size:14px;margin:6px 0 0;color:var(--ink-light);white-space:pre-wrap;}
.task-images{display:flex;gap:7px;margin-top:10px;overflow-x:auto;padding-bottom:3px;}
.task-images img{width:64px;height:64px;object-fit:cover;border-radius:8px;border:1px solid var(--border);flex-shrink:0;}
.task-meta{font-size:11px;color:var(--muted);margin-top:10px;}
.task-actions{display:flex;align-items:center;gap:4px;flex-shrink:0;}
.edit-btn{border:1px solid var(--border);background:var(--surface-soft);color:var(--olive);padding:5px;border-radius:6px;flex-shrink:0;display:flex;}
.edit-btn:hover{background:#ECFDF5;border-color:var(--olive);}
.del-btn{border:1px solid var(--border);background:var(--surface-soft);color:var(--stamp);padding:5px;border-radius:6px;flex-shrink:0;display:flex;}
.del-btn:hover{background:#FFF3EF;border-color:var(--stamp);}
.empty-msg{text-align:center;font-size:14px;color:var(--muted);padding:32px 0;}
.center-loading{display:flex;justify-content:center;padding:32px 0;}

.img-thumb-wrap{position:relative;display:inline-block;}
.img-thumb-wrap img{width:64px;height:64px;object-fit:cover;border-radius:8px;border:1px solid var(--border);}
.img-remove-btn{position:absolute;top:-6px;right:-6px;width:18px;height:18px;border-radius:50%;background:var(--stamp);color:white;border:none;display:flex;align-items:center;justify-content:center;font-size:11px;}
.img-size-badge{position:absolute;left:4px;right:4px;bottom:4px;background:rgba(24,34,48,0.82);color:white;border-radius:4px;padding:2px 3px;font-size:8px;text-align:center;line-height:1.15;}
.img-upload-btn{width:64px;height:64px;border-radius:8px;border:1.5px dashed var(--olive);color:var(--olive);background:#F0FDFA;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;}
.img-upload-btn:hover{background:#CCFBF1;}
.img-upload-btn span{font-size:9px;}
.images-row{display:flex;flex-wrap:wrap;gap:8px;}
.upload-note{display:flex;align-items:center;gap:6px;margin:8px 0 0;color:var(--muted);font-size:11px;}
.upload-note svg{width:14px;height:14px;flex-shrink:0;}

/* ---------- report ---------- */
.report-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px;background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:12px;box-shadow:var(--shadow-sm);}
.report-tabs{display:flex;border:1px solid var(--border);border-radius:8px;overflow:hidden;background:var(--surface-soft);padding:3px;}
.report-tab{padding:8px 16px;font-size:14px;font-weight:700;border:none;background:transparent;color:var(--ink);}
.report-tab.active{background:var(--nav);color:white;border-radius:6px;box-shadow:var(--shadow-sm);}
.report-controls{display:flex;align-items:center;gap:8px;}
.date-input{border-radius:8px;padding:8px 12px;font-size:14px;background:white;border:1px solid var(--border);color:var(--ink);}
.btn-print{display:flex;align-items:center;gap:6px;padding:8px 14px;border-radius:8px;font-size:14px;font-weight:700;background:var(--stamp);color:white;border:none;box-shadow:var(--shadow-sm);}
.btn-print:hover{background:var(--stamp-dark);}
.btn-pdf{display:flex;align-items:center;gap:6px;padding:8px 14px;border-radius:8px;font-size:14px;font-weight:700;background:var(--olive);color:white;border:none;box-shadow:var(--shadow-sm);}
.btn-pdf:hover{background:#0B625C;}

.report-paper{background:white;border:1px solid var(--border);border-radius:8px;padding:30px;box-shadow:var(--shadow-sm);}
.official-report{position:relative;overflow:hidden;background:#FFFFFF;border:1px solid #B8C0CC;padding:0;box-shadow:0 8px 24px rgba(16,24,40,0.10);}
.official-report::before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:#182230;z-index:1;}
.report-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin:0;padding:30px 34px 24px;border-bottom:4px double #182230;background:#FFFFFF;color:var(--nav);}
.report-eyebrow{font-size:14px;letter-spacing:0;text-transform:none;color:#4B5563;font-family:'Sarabun',sans-serif;margin:0 0 6px;font-weight:700;}
.report-h2{font-family:'Taviraj',serif;font-weight:700;font-size:30px;line-height:1.24;margin:0;color:var(--nav);}
.report-date{display:inline-flex;font-size:14px;color:var(--nav);margin:10px 0 0;font-weight:700;background:#F8FAFC;border:1px solid #CBD5E1;border-radius:4px;padding:5px 10px;}
.report-head-mark{border:1px solid #182230;border-radius:4px;padding:8px 12px;font-weight:800;color:var(--nav);letter-spacing:0;white-space:nowrap;background:#F8FAFC;}
.report-official-body{padding:24px 28px 26px;}
.report-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:22px;}
.report-stat{background:#FFFFFF;border:1px solid #CBD5E1;border-radius:4px;padding:14px 14px 13px;box-shadow:none;border-top:3px solid #182230;}
.report-stat:nth-child(2){border-top-color:#475569;}
.report-stat:nth-child(3){border-top-color:#B4532A;}
.report-stat span{display:block;font-size:12px;color:var(--muted);font-weight:800;margin-bottom:5px;letter-spacing:0.02em;}
.report-stat strong{display:block;font-size:22px;color:var(--nav);font-weight:900;line-height:1.15;}
.report-section{display:grid;gap:12px;}
.report-section.compact{gap:8px;}
.report-task{border:1px solid #CBD5E1;border-left:4px solid #182230;border-radius:4px;padding:14px 14px 12px;background:white;box-shadow:none;break-inside:avoid;page-break-inside:avoid;}
.report-task.compact{padding:11px 12px;background:white;border-left-color:#475569;}
.report-task .task-loc,.report-task .task-desc,.report-task .task-meta{margin-left:20px;}
.report-task.compact .task-desc{font-size:13px;}
.report-item-title{display:flex;align-items:baseline;gap:8px;}
.report-item-num{font-size:12px;font-family:'Courier Prime',monospace;color:var(--kraft);font-weight:700;}
.report-item-title h4{margin:0;font-family:'Taviraj',serif;font-weight:700;font-size:17px;color:var(--nav);}
.report-item-title span:not(.report-item-num){font-weight:700;font-size:14px;color:var(--nav);}
.report-day-section{border:1px solid #CBD5E1;border-radius:4px;padding:14px;margin-bottom:14px;background:#FFFFFF;box-shadow:none;}
.report-day-section:last-child{margin-bottom:0;}
.report-day-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;padding-bottom:10px;border-bottom:1px solid var(--border-light);}
.report-day-badge{font-family:'Sarabun',sans-serif;background:var(--nav);color:white;padding:5px 10px;border-radius:4px;font-size:13px;font-weight:700;display:inline-block;}
.report-day-count{font-size:12px;color:var(--nav);font-weight:800;background:#E2E8F0;border-radius:4px;padding:4px 9px;}
.report-image-btn{border:none;background:transparent;padding:0;border-radius:6px;line-height:0;flex-shrink:0;}
.report-image-btn:hover{outline:2px solid var(--olive);outline-offset:2px;}
.report-image-btn:focus-visible{outline:2px solid var(--stamp);outline-offset:2px;}
.report-images{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:10px;overflow:visible;margin-top:12px !important;}
.report-images-sm{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:9px;overflow:visible;margin-top:10px !important;}
.report-images img{width:148px;height:110px;object-fit:cover;border-radius:8px;border:1px solid var(--border);}
.report-images-sm img{width:120px;height:88px;object-fit:cover;border-radius:8px;border:1px solid var(--border);}
.report-images .report-image-btn,.report-images-sm .report-image-btn{justify-self:start;}
.report-footer{margin:0;padding:12px 24px;border-top:1px solid #CBD5E1;font-size:11px;color:var(--muted);text-align:center;background:#F8FAFC;}

.image-preview-overlay{align-items:center;padding:18px;background:rgba(15,23,42,0.82);}
.image-preview-box{position:relative;max-width:min(96vw,1100px);max-height:92vh;display:flex;align-items:center;justify-content:center;}
.image-preview-box img{max-width:100%;max-height:92vh;object-fit:contain;border-radius:8px;background:white;box-shadow:0 16px 48px rgba(0,0,0,0.35);}
.image-preview-close{position:absolute;top:8px;right:8px;background:rgba(255,255,255,0.9);z-index:1;}
.image-preview-nav{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border:none;border-radius:50%;background:rgba(255,255,255,0.9);color:var(--ink);display:flex;align-items:center;justify-content:center;z-index:1;}
.image-preview-nav:hover{background:white;}
.image-preview-prev{left:10px;}
.image-preview-next{right:10px;}
.image-preview-count{position:absolute;left:50%;bottom:10px;transform:translateX(-50%);background:rgba(43,58,74,0.88);color:white;border-radius:999px;padding:4px 10px;font-size:12px;font-family:'Courier Prime',monospace;}

/* ---------- misc ---------- */
.spin{animation:spin 0.8s linear infinite;}
@keyframes spin{from{transform:rotate(0deg);}to{transform:rotate(360deg);}}

@media (max-width:640px){
  .container{padding:0 12px;}
  .topbar-inner{align-items:flex-start;flex-direction:column;}
  .topbar-inner > .flex:first-child{min-width:0;width:100%;}
  .topbar-inner > .flex:last-child{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:6px;}
  .topbar-title{font-size:15px;}
  .nav-btn{justify-content:center;margin:0;padding:7px 6px;font-size:12px;white-space:nowrap;}
  .nav-btn.logout{margin-left:0;}
  .dashboard-hero{align-items:stretch;flex-direction:column;padding:18px;}
  .dashboard-controls{flex-direction:column;align-items:stretch;}
  .dashboard-kpis,.dashboard-grid{grid-template-columns:1fr;}
  .dashboard-recent-item{flex-direction:column;}
  .dashboard-recent-meta{text-align:left;}
  .search-filter-grid,.settings-grid{grid-template-columns:1fr;}
  .search-task{flex-direction:column;}
  .search-open{width:100%;}
  .search-actions{display:grid;grid-template-columns:1fr 1fr;}
  .search-actions .btn-primary,.search-actions .btn-secondary{width:100%;min-width:0;}
  .cal-cell,.cal-cell-empty{height:72px;}
  .cal-dow{font-size:10px;padding-left:2px;padding-right:2px;}
  .cal-count{font-size:9px;padding:1px 4px;}
  .modal-header,.modal-body,.modal-footer{padding-left:14px;padding-right:14px;}
  .modal-title{font-size:16px;line-height:1.35;}
  .coord-row{grid-template-columns:1fr;}
  .coord-actions{display:grid;grid-template-columns:1fr;}
  .btn-secondary{width:100%;}
  .map-picker-box{height:92vh;}
  #map-picker-canvas{min-height:300px;}
  .map-picker-footer{align-items:stretch;flex-direction:column;}
  .map-picker-footer .btn-primary{width:100%;}
  .report-toolbar{align-items:stretch;}
  .report-tabs,.report-controls{width:100%;}
  .report-tab{flex:1;padding-left:8px;padding-right:8px;}
  .report-controls{flex-direction:column;align-items:stretch;}
  .date-input,.btn-print,.btn-pdf{width:100%;justify-content:center;}
  .report-paper{padding:16px;border-radius:8px;}
  .official-report{padding:0;}
  .report-head{padding:24px 18px 22px;}
  .report-head{flex-direction:column;gap:10px;}
  .report-head-mark{align-self:flex-start;}
  .report-h2{font-size:22px;}
  .report-official-body{padding:16px;}
  .report-stats{grid-template-columns:1fr;}
  .report-task .task-loc,.report-task .task-desc,.report-task .task-meta{margin-left:0;}
  .report-images{grid-template-columns:repeat(auto-fill,minmax(112px,1fr));}
  .report-images-sm{grid-template-columns:repeat(auto-fill,minmax(96px,1fr));}
  .report-images img{width:112px;height:84px;}
  .report-images-sm img{width:96px;height:72px;}
  .image-preview-nav{width:38px;height:38px;}
  .image-preview-prev{left:6px;}
  .image-preview-next{right:6px;}
}

@media print{
  .no-print{display:none !important;}
  body{background:white !important;}
  .container{max-width:none;padding:0 !important;}
  .report-paper{border:none !important;padding:0 !important;box-shadow:none !important;}
  .official-report::before{display:none !important;}
  .report-head{background:white !important;color:#111 !important;border-bottom:2px solid #111 !important;padding:0 0 16px !important;margin-bottom:16px !important;}
  .report-h2,.report-head-mark{color:#111 !important;}
  .report-eyebrow,.report-date{color:#333 !important;background:white !important;border-color:#ddd !important;}
  .report-official-body{padding:0 !important;}
  .report-stats{grid-template-columns:repeat(3,1fr) !important;}
  .report-stat,.report-task,.report-day-section{break-inside:avoid;border-color:#ddd !important;}
  .report-image-btn{outline:none !important;}
}
