:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;color:#18304d;background:#f4f7fb}*{box-sizing:border-box}body{margin:0}header{background:#102e55;color:white;display:flex;gap:25px;align-items:center;padding:20px max(22px,calc((100vw - 1200px)/2));flex-wrap:wrap}.brand{font-weight:900;letter-spacing:.4px;font-size:20px}.brand span{color:#ffd044}.brand small{display:block;font-weight:500;color:#b9cbe1;font-size:10px;letter-spacing:1.3px;margin-top:4px}nav{display:flex;gap:18px;flex-wrap:wrap}a{color:inherit;text-decoration:none}nav a{font-size:14px;color:#e1ebf8}.user{font-size:12px;margin-left:auto;display:flex;gap:12px;align-items:center}.logout{background:transparent;border:1px solid #9cb6d3;color:white;padding:8px 12px;border-radius:8px;cursor:pointer}main{max-width:1240px;padding:35px 20px 65px;margin:auto}.intro{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:25px;flex-wrap:wrap}.eyebrow{font-size:12px;font-weight:800;letter-spacing:2px;color:#137db5}.intro h1{margin:4px 0;font-size:30px}.intro p{color:#65768c}.action,button:not(.logout){display:inline-block;background:#0878ba;color:white;padding:12px 18px;border-radius:9px;border:0;cursor:pointer;font-weight:700}.secondary{padding:12px 18px;border-radius:9px;background:#e1ebf5;color:#16436a}.actions{display:flex;gap:8px}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:15px;margin-bottom:28px}.metric{display:flex;flex-direction:column;background:white;border:1px solid #e0e8f1;border-radius:15px;padding:22px;min-height:160px;box-shadow:0 5px 20px #102e5508}.metric span{font-size:14px;font-weight:650}.metric strong{font-size:39px;margin:10px 0;color:#12395c}.metric small{color:#6d8094}.featured{background:#123e6d;color:white}.featured strong,.featured small{color:#fff}.panel{background:white;border:1px solid #e0e8f1;border-radius:16px;padding:22px;box-shadow:0 5px 20px #102e5508}.panel h2{margin-top:0}.tablewrap{overflow:auto}table{width:100%;border-collapse:collapse;text-align:left;font-size:13px}th{background:#f0f5fb;color:#44627c}td,th{padding:14px;border-bottom:1px solid #e7edf5;vertical-align:top}.pill{background:#eaf1f9;padding:5px 9px;border-radius:99px;white-space:nowrap}.sub{display:block;color:#728397;margin-top:5px;max-width:360px;overflow-wrap:anywhere}.formpanel{max-width:720px}label{display:block;font-size:13px;font-weight:700;margin:18px 0 7px}input,textarea,select{width:100%;border:1px solid #cad7e5;border-radius:8px;padding:12px;font:inherit;background:white;color:#1b3049}.formpanel button,.login button{margin-top:20px}.inline{display:flex;gap:6px}.inline select{min-width:125px;padding:6px}.inline button{padding:8px!important}.login{max-width:440px;background:white;margin:40px auto;padding:38px;border:1px solid #e0e8f1;border-radius:20px;box-shadow:0 12px 40px #102e5515}.login .icon{font-size:44px}.login h1{font-size:25px}.login p{color:#74859a}.login button{width:100%}.flash{padding:12px 18px;border-radius:9px;background:#e7f7e9;margin-bottom:15px}.flash.error{background:#ffe8e8}footer{text-align:center;color:#8b99aa;font-size:12px;padding:24px}@media(max-width:650px){header{padding:18px}.user{margin-left:0}.intro h1{font-size:24px}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.metric{padding:15px;min-height:135px}.metric strong{font-size:32px}}

/* Shared workspace and operational modules */
:root{--surface:#fff;--canvas:#f3f6fa;--ink:#162d46;--muted:#536a80;--line:#dce5ee;--primary:#006fa1;--sidebar:#102b45;--accent:#ffd34e;--radius:14px;background:var(--canvas);color:var(--ink)}
.workspace{display:grid;grid-template-columns:232px minmax(0,1fr);min-height:100vh}
.workspace-main{min-width:0}
.sidebar{position:sticky;top:0;align-self:start;height:100vh;overflow:auto;background:var(--sidebar);color:white;padding:24px 16px}
.sidebar .brand{display:flex;align-items:center;gap:10px;font-size:14px;letter-spacing:0;line-height:1.35;padding:0 4px 16px}
.sidebar .brand img{object-fit:contain;border-radius:7px;background:#fff}
.sidebar .brand span{color:#fff}
.sidebar .brand small{margin-top:3px;letter-spacing:.04em;font-size:11px}
.sidebar nav{display:block}
.sidebar nav p{margin:20px 10px 6px;color:#afc4d7;font-size:11px;font-weight:750;letter-spacing:.09em;text-transform:uppercase}
.sidebar nav a{display:block;border-inline-start:3px solid transparent;border-radius:7px;padding:10px 9px;color:#e4eef7}
.sidebar nav a:hover{background:#224660}
.sidebar nav a[aria-current="page"]{border-inline-start-color:var(--accent);background:#234862;color:white;font-weight:750}
.workspace-bar{display:flex;justify-content:space-between;gap:12px;padding:12px clamp(16px,4vw,42px);background:#fff;color:var(--ink);border-bottom:1px solid var(--line)}
.workspace-context{font-size:13px;font-weight:700}
.workspace-context span{margin-inline:5px;color:#667d91}
.workspace-bar .user{margin-left:auto;gap:12px}
.workspace-bar .user small{display:block;color:var(--muted)}
.workspace-bar .secondary{padding:8px 12px}
.workspace-bar .menu-toggle{display:none}
#main-content{width:100%;max-width:1440px;padding:32px clamp(16px,4vw,44px) 44px}
.skip-link{position:fixed;z-index:10;inset:8px auto auto 8px;transform:translateY(-160%);padding:10px;background:#fff;color:#102b45}
.skip-link:focus{transform:none}
:focus-visible{outline:3px solid #1288b6;outline-offset:3px}
.page-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:24px}
.page-heading h1{margin:0;font-size:clamp(28px,4vw,40px);letter-spacing:-.04em;line-height:1.12}
.page-heading p{margin:7px 0 0;color:var(--muted)}
.page-heading .eyebrow{margin:0 0 8px;color:#00628e;text-transform:uppercase;letter-spacing:.08em}
.action,button:not(.logout){background:var(--primary)}
.secondary,button.secondary{display:inline-flex;align-items:center;justify-content:center;color:#174967;background:#edf4fa;border:1px solid #d6e3ee;padding:9px 13px;border-radius:9px;font-weight:700}
button:disabled,button[aria-disabled="true"]{opacity:.62;cursor:wait}
input[type="checkbox"],input[type="radio"]{width:auto;accent-color:var(--primary)}
input[type="file"]{max-width:100%}
img,svg,video{max-width:100%}
.actions{flex-wrap:wrap}
.tablewrap{max-width:100%}
.tablewrap:focus-visible{outline-offset:-3px}
.panel,.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:clamp(15px,3vw,25px);box-shadow:none;min-width:0}
.panel h2,.card h2{font-size:18px;margin:0 0 14px}
.section-heading{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.section-heading a{color:#006791;font-weight:700;font-size:14px}
.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:18px}
.dashboard-attention{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;background:#103856;color:#fff;border-radius:var(--radius);padding:clamp(18px,3vw,28px)}
.dashboard-attention h2{margin:0;font-size:23px}
.dashboard-attention p{color:#d8eaf5}
.dashboard-attention .eyebrow{color:#ffe281;margin:0 0 10px;text-transform:uppercase}
.attention-count{font-size:clamp(30px,6vw,58px);font-variant-numeric:tabular-nums;line-height:1}
.dashboard-shortcuts a,.dashboard-categories a{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:4px 10px;padding:11px 0;border-top:1px solid var(--line);font-size:14px}
.dashboard-shortcuts a small{grid-column:1;color:var(--muted)}
.dashboard-shortcuts a span{grid-column:2;grid-row:1 / span 2;color:#006791}
.dashboard-categories a strong{font-variant-numeric:tabular-nums}
.empty-state{padding:16px;border:1px dashed var(--line);border-radius:9px;color:var(--muted)}
.module-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:18px;align-items:start}
.module-stack{display:grid;gap:16px;min-width:0}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.form-grid label{margin:0 0 6px}
.form-grid .full{grid-column:1/-1}
.form-grid input[readonly]{background:#edf3f8;color:#41596d}
.upload-box{background:#f6fafe;border:1px dashed #9dbbd0;border-radius:10px;padding:14px}
.form-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:16px}
.form-hint,.form-progress{font-size:13px;color:var(--muted);margin:6px 0}
.form-progress{background:#edf6fb;padding:9px 12px;border-radius:8px}
.status-badge{display:inline-flex;background:#e9f1fb;color:#1f4c73;border-radius:99px;padding:4px 10px;font-size:12px;font-weight:750;white-space:nowrap}
.status-badge.submitted{background:#e2f6ec;color:#176141}
.status-badge.uncertain,.status-badge.pending{background:#fff2d4;color:#735100}
.cctv-report dl{display:grid;grid-template-columns:auto minmax(0,1fr);gap:7px 12px;font-size:13px;margin:14px 0}
.cctv-report dt{font-weight:700;color:var(--muted)}
.cctv-report dd{margin:0;overflow-wrap:anywhere}
.cctv-report + .cctv-report{border-top:1px solid var(--line);padding-top:16px;margin-top:16px}
.cctv-report .section-heading{align-items:center}
.cctv-send{margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.cctv-send label{display:flex;gap:8px;align-items:baseline;margin:0 0 10px}
details.panel>summary{cursor:pointer;font-weight:750}
details.panel[open]>summary{margin-bottom:14px}
.daily-layout{max-width:1000px}
.daily-layout form{display:grid;gap:16px}
.daily-layout .upload{margin-top:14px}
.daily-layout .upload img{max-height:240px;object-fit:contain}
.daily-layout .notice{margin:0}
.legacy-module{min-width:0}
.legacy-module header{display:block}
.legacy-module :is(.table-wrap,.tablewrap,.table-scroll){overflow:auto;max-width:100%}
@media(max-width:1040px){.module-grid{grid-template-columns:minmax(0,1fr)}}
@media(max-width:850px){
  .workspace{display:block}
  .sidebar{position:static;height:auto;max-height:none}
  body:has(.menu-toggle:not([hidden])) .sidebar:not(.is-open){display:none}
  .workspace-bar .menu-toggle:not([hidden]){display:inline-flex}
  #main-content{padding-top:22px}
}
@media(max-width:620px){
  .dashboard-grid,.form-grid{grid-template-columns:minmax(0,1fr)}
  .workspace-context{display:none}
  .workspace-bar{padding:10px 14px}
  .page-heading{margin-bottom:18px}
  .inline{flex-wrap:wrap}
  .formpanel,.login{padding:18px}
}
@media print{.sidebar,.workspace-bar,.skip-link{display:none!important}.workspace{display:block}}

/* HSSE Control Centre brand and module marks */
.sidebar .brand { gap:12px; padding-inline:0; }
.sidebar .brand img { width:66px; height:66px; flex:none; background:transparent; object-fit:contain; }
.sidebar nav a { display:flex; align-items:center; gap:9px; }
.module-mark { display:inline-block; flex:none; object-fit:contain; vertical-align:middle; }
.module-mark--icon { width:19px; height:19px; }
.module-mark--badge { width:44px; height:44px; }
.branded-heading { display:flex; align-items:center; gap:10px; }
.dashboard-shortcuts a.module-shortcut { grid-template-columns:auto minmax(0,1fr) auto; }
.dashboard-shortcuts a.module-shortcut span { grid-column:3; grid-row:1; }
.dashboard-shortcuts a.module-shortcut .module-mark { width:38px; height:38px; }
.hsse-lm-card .module-mark--badge { width:36px; height:36px; }
.smc-page .branded-heading { flex-wrap:wrap; }
.upload .module-mark--badge { width:30px; height:30px; margin-inline-end:6px; }
@media(max-width:620px) {
  .workspace-context { display:block; font-size:11px; }
  .workspace-bar .user { gap:6px; }
  .workspace-bar .user > span { display:none; }
}

.back-navigation { margin-bottom:14px; }
.back-link {
  display:inline-flex; align-items:center; gap:7px; padding:7px 10px;
  border:1px solid var(--line); border-radius:8px; background:var(--surface);
  color:#075985; font-size:13px; font-weight:700; line-height:1.35;
}
.back-link:hover { background:#edf6fb; border-color:#95bed2; }
.back-link[aria-disabled="true"] { opacity:.65; cursor:wait; }
.upload .back-link { margin-top:10px; }
@media print { .back-navigation { display:none!important; } }
