:root{font-family:system-ui,-apple-system,Segoe UI,sans-serif;color:#182436;background:#f4f6f9}*{box-sizing:border-box}body{margin:0}a{color:#075d94}header{background:#101d31;color:#fff}.wrap{max-width:1320px;margin:0 auto;padding:20px 22px}.nav{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}.brand{color:#fff;text-decoration:none;font-size:22px;font-weight:700}.brand strong{color:#67bbeb}.brand span{font-size:13px;font-weight:400;letter-spacing:.15em;margin-left:8px}nav{display:flex;flex-wrap:wrap;gap:16px}nav a{color:#e0ecf6;text-decoration:none;font-size:14px}h1{font-size:28px;margin:16px 0 22px}h2{font-size:20px}.panel{background:#fff;border:1px solid #dce3ed;border-radius:12px;padding:22px;margin:16px 0 24px;box-shadow:0 2px 8px #16243a09}.narrow{max-width:480px}.fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:15px;margin-bottom:20px}.wide{grid-column:1/-1}label{font-weight:600;font-size:13px;display:flex;flex-direction:column;gap:7px;margin-bottom:12px}input,select,textarea{font:inherit;border:1px solid #bfcbd8;border-radius:7px;padding:10px;width:100%;background:#fff;color:#182436}textarea{resize:vertical}button,.button{background:#12639a;color:white;padding:10px 16px;border:none;border-radius:7px;cursor:pointer;text-decoration:none;display:inline-block;font:inherit;font-size:14px}.secondary{background:#e4eaf0;color:#24334a}.error{background:#ffe6e6;border-left:4px solid #bc3131;padding:12px}.ok{background:#e2f6e9;border-left:4px solid #1b9852;padding:12px}.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}.stats div{padding:18px;background:#fff;border:1px solid #dce3ed;border-radius:12px}.stats b{display:block;font-size:30px}.stats span{color:#5c6b7a}.filters{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:20px 0}.filters input{width:300px}.filters select{width:auto}.filters label{margin:0}.inline{flex-direction:row;align-items:center}.inline input{width:auto}.tablewrap{overflow:auto;background:#fff;border:1px solid #dce3ed;border-radius:10px}table{border-collapse:collapse;min-width:1100px;width:100%;font-size:13px}th{text-align:left;background:#e8edf3}td,th{padding:13px 11px;border-bottom:1px solid #e2e8ef}tr:hover td{background:#f5f9ff}.pager{display:flex;gap:6px;margin-top:14px}.activity{padding:12px 0;border-bottom:1px solid #ddd}.activity small{color:#596a79}.staffrow{display:flex;flex-wrap:wrap;align-items:center;gap:15px;padding:10px 0;border-bottom:1px solid #ddd}.staffrow input{max-width:250px}footer{font-size:12px;color:#788596;padding-top:0;padding-bottom:30px}@media(max-width:700px){.wrap{padding:16px}.filters input{width:100%}nav{gap:9px}}

.quicklinks{display:flex;gap:10px;flex-wrap:wrap}input[type=number]{max-width:240px}


/* Staff manual */
.manual-intro{max-width:850px;color:#4b5c6e}.manual-grid{display:grid;grid-template-columns:225px minmax(0,1fr);align-items:start;gap:24px}.manual-nav{position:sticky;top:12px;display:flex;flex-direction:column;gap:10px;margin-top:0}.manual-nav a{text-decoration:none;font-size:14px}.manual-content .panel{margin-top:0;scroll-margin-top:20px;line-height:1.65}.manual-content h2{margin-top:0}.manual-content li{margin-bottom:9px}.manual-content code{overflow-wrap:anywhere;background:#edf1f6;padding:2px 4px;border-radius:3px}@media(max-width:850px){.manual-grid{display:block}.manual-nav{position:static}}


/* UKSS LIVE WEBSITE-MATCHED THEME — visual only, no database or PHP changes */
:root{color-scheme:light;--ukss-ink:#10141b;--ukss-navy:#101d31;--ukss-amber:#f9a51a;--ukss-amber-hover:#e89009;--ukss-line:#dbe2e9;--ukss-text:#182436;--ukss-muted:#536174;font-family:Arial,Helvetica,system-ui,sans-serif;color:var(--ukss-text);background:#f3f5f8}
body{background:linear-gradient(180deg,#e9edf2 0,#f3f5f8 240px);min-height:100vh}
header{background:#10141b;color:#fff;border-bottom:3px solid var(--ukss-amber);box-shadow:0 5px 18px #0b182528}
header .wrap{max-width:1450px}
header .nav{padding-top:17px;padding-bottom:17px}
.brand{font-weight:900;letter-spacing:.015em;font-size:25px;white-space:nowrap}
.brand strong{color:var(--ukss-amber)}
.brand span{font-size:13px;font-weight:600;letter-spacing:.17em;color:#d4dbe3}
nav{gap:7px 13px;align-items:center}
nav a{color:#f0f2f5;padding:7px 6px;font-weight:600;font-size:13px;transition:color .15s ease}
nav a:hover,nav a:focus-visible{color:var(--ukss-amber);text-decoration:underline;text-underline-offset:5px}
main.wrap{padding-top:32px;padding-bottom:30px}
h1{font-size:clamp(27px,3.2vw,40px);letter-spacing:-.025em;font-weight:800;color:#172132;margin:8px 0 26px}
h1:after{content:'';display:block;width:76px;height:4px;background:var(--ukss-amber);margin-top:13px;border-radius:2px}
h2{font-weight:800;color:#162132;letter-spacing:-.012em}
a{color:#a55c00}a:hover{color:#7f4800}
.panel,.stats div,.tablewrap{background:#fff;border:1px solid var(--ukss-line);box-shadow:0 3px 13px #15253b0a}
.panel{border-radius:13px;padding:24px}
.stats div{border-top:4px solid var(--ukss-amber);border-radius:9px}
.stats b{font-weight:900;color:#172132}
.stats span,.manual-intro{color:var(--ukss-muted)}
button,.button{background:var(--ukss-amber);color:#10141b;border:1px solid #e4950c;font-weight:800;letter-spacing:.018em;border-radius:6px;box-shadow:none}
button:hover,.button:hover{background:var(--ukss-amber-hover);color:#10141b}
button:focus-visible,.button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #e89a22;outline-offset:2px}
.secondary,button.secondary,.button.secondary{background:#19283a;border-color:#19283a;color:#fff}
.secondary:hover,button.secondary:hover,.button.secondary:hover{background:#2b415a;color:#fff}
input,select,textarea{border-color:#b8c3cf;background:#fff;border-radius:6px}
input:focus,select:focus,textarea:focus{border-color:#bd7b08}
label{color:#263245}
th{background:#172435;color:#fff;font-weight:700}
td,th{border-bottom-color:#e4e9ef}
tr:hover td{background:#fff8eb}
.staffrow,.activity{border-bottom-color:#e1e6ed}
.pager a{padding:4px 8px}
.manual-nav a{color:#955806;font-weight:600}
.manual-nav a:hover{color:#7a4400}
.manual-content code{background:#fff0d5;color:#694000}
footer.wrap{border-top:1px solid #d9e0e8;color:#657185;margin-top:24px;padding-top:25px}
@media(max-width:960px){header .nav{align-items:flex-start}nav{width:100%}}
@media(max-width:700px){.brand{font-size:22px}.panel{padding:18px}main.wrap{padding-top:20px}nav a{padding:7px 3px}}