/* Compact layout for the three staff pages. */
header{height:64px}
header .brand{margin:0;font-size:21px;letter-spacing:0}
main{padding-top:20px}
.btn,button{padding:9px 14px;border-radius:8px;font-weight:650}
.primary{background:var(--blue)}
.small{padding:7px 10px;font-size:13px}
.card{padding:20px;margin:14px 0;border-radius:12px;box-shadow:none}
h2{font-size:18px;margin-bottom:14px}
.section-head{margin-bottom:14px}
.section-head h2{margin:0}
.grid{gap:14px}
.span3{grid-column:span 3}
textarea{min-height:72px}
.dropzone{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:0;margin:0;background:none;border:0;border-radius:6px}
.dropzone.drag{background:var(--pale);outline:2px dashed var(--teal);outline-offset:6px}
input[type=file]{margin:0;font-size:14px;flex:1;min-width:200px}
input[type=file]::file-selector-button{font:inherit;font-weight:650;padding:9px 12px;margin-right:10px;border:1px solid var(--line);border-radius:7px;background:var(--bg);color:var(--navy);cursor:pointer}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.filters{margin:12px 0;gap:6px}
.filters button{font-size:13px;padding:7px 11px;border-radius:7px}
.empty{padding:20px}
.pnr-group{border-radius:8px}
.footer-actions{padding:12px 16px;margin-top:16px;border-radius:10px;background:var(--white);backdrop-filter:none}
.review-box{padding:16px;border-radius:8px}
.review-box p:last-child{margin-bottom:0}
.history-row{padding:14px 0}
.offer{padding:16px;border-radius:8px}
.offer .section-head{margin-bottom:8px}
.readonly input,.readonly select,.readonly textarea{background:var(--bg)}
@media(max-width:850px){
  main{padding:18px 18px 48px}
  .span3{grid-column:span 2}
}
@media(max-width:540px){
  header{height:60px;padding:0 14px}
  header .brand{font-size:18px}
  main{padding:14px 12px 24px}
  .card{padding:16px 14px;margin:12px 0}
  .span3{grid-column:auto}
  .dropzone{gap:6px}
  input[type=file]{width:100%;min-width:0}
  .section-head{gap:8px}
  .footer-actions{padding:12px;gap:10px}
}
html[data-theme="dark"]{
  --white:#17232d;
  --navy:#edf4f8;
  --ink:#edf4f8;
  --blue:#126b95;
  --pale:#173745;
}
html[data-theme="dark"] :is(.btn,button){background:#1b2a35;color:#dcebf5;border-color:#425460}
html[data-theme="dark"] :is(.btn,button):hover{background:#213a4b}
html[data-theme="dark"] :is(.staff-menu-links .active,.filters .active){background:#214556;color:#e6faff;border-color:#529ca7}
html[data-theme="dark"] .primary{background:var(--blue);color:#fff;border-color:transparent}
html[data-theme="dark"] .pnr-head{background:#1b2a35}
html[data-theme="dark"] .notice{background:#183244;border-color:#36576f;color:#d8eaf5}
html[data-theme="dark"] .error{background:#3c2225;border-color:#79504b;color:#ffd3cb}
html[data-theme="dark"] .warning{background:#3d2b17;border-color:#75643d;color:#f1dba6}

.staff-heading{display:flex;align-items:center;gap:12px;min-width:0}
.staff-menu-toggle{width:44px;height:44px;flex-shrink:0;padding:10px}
#staff-menu{margin:0;padding:24px;width:min(330px,90vw);max-width:none;height:100dvh;max-height:none;border:0;border-right:1px solid var(--line);border-radius:0;background:var(--white);color:var(--ink)}
#staff-menu::backdrop{background:#173b5b85}
#staff-menu h2{margin-bottom:24px}
.staff-menu-links{display:flex;flex-direction:column;gap:10px}
.staff-menu-links .btn{justify-content:flex-start;min-height:44px}
.staff-menu-links .active{background:#e4f3f6;border-color:#a3d6da;color:#0d577d}
html.staff-menu-visible,html.staff-menu-visible body{overflow:hidden}
@media(max-width:540px){
  header{gap:8px}
  .staff-heading{gap:8px}
  header .brand{font-size:16px}
  .staff-menu-toggle{width:40px;height:40px;padding:8px}
  header>.btn{font-size:11px;padding:8px}
  #staff-menu{padding:20px}
}
@media(max-width:360px){header{padding:0 10px}.staff-heading{gap:6px}header .brand{font-size:14px}header>.btn{padding:8px 6px}}