/* wall-board.css — the coloured Master Board chips and the full-screen wall board
   (Nick, 2026-11-10). Department colours come from plan-results.js (Results.color),
   passed in as --dc (fill) and --dt (the text colour that reads on it). Attention is
   a bright amber with diagonal stripes, a dark border, ⚠ and a word: it never relies
   on colour alone, and the stripes keep it apart from Social Science's amber. */

:root{
  --wb-attn:#FFD21F; --wb-attn2:#FFF0A0; --wb-attn-edge:#1B1B1B; --wb-attn-text:#2B1A00;
  --wb-bg:#F4F2EE; --wb-cell:#FFFFFF; --wb-line:#D9D4CB; --wb-bar:#1E3A5F; --wb-bartext:#FFFFFF;
}

/* ---------------------------------------------------------- Master Board chips */
.board .schip.dfill{background:var(--dc); color:var(--dt); border:1px solid rgba(0,0,0,.18); border-left:3px solid rgba(0,0,0,.28);}
.board .schip.dfill .n, .board .schip.dfill .n span, .board .schip.dfill .link{color:var(--dt) !important;}
.board .schip.dfill .sub2{display:block; color:var(--dt); opacity:.9; font-weight:400; font-size:.68rem;}
.board .schip.dfill .tpill{background:rgba(255,255,255,.85); color:#1b1b1b;}
.board .schip.dfill .needs{color:inherit; font-weight:800;}
.board .schip.dfill.attn, .wb-chip.attn{
  background:repeating-linear-gradient(135deg, var(--wb-attn) 0 12px, var(--wb-attn2) 12px 18px);
  color:var(--wb-attn-text); border:2px dashed var(--wb-attn-edge); border-left:7px solid var(--dc);
}
.board .schip.dfill.attn .n, .board .schip.dfill.attn .n span, .board .schip.dfill.attn .link,
.board .schip.dfill.attn .sub2{color:var(--wb-attn-text) !important;}
.board .schip .attnword{display:inline-block; margin-top:2px; font-weight:800; font-size:.66rem; letter-spacing:.01em;
  background:var(--wb-attn-edge); color:#fff; border-radius:4px; padding:0 5px;}
.legend .wb-sw-attn{background:repeating-linear-gradient(135deg, var(--wb-attn) 0 4px, var(--wb-attn2) 4px 8px) !important;
  outline:2px solid var(--wb-attn-edge); outline-offset:-1px;}
.legend .wb-sw-lock{background:none !important; width:auto !important; height:auto !important;}
.legend .wb-legend-attn{color:var(--wb-attn-text); font-weight:700;}
.wallopen{display:inline-flex; align-items:center; gap:6px; background:var(--nav,#1E3A5F) !important; color:#fff !important;
  border:none; border-radius:8px; padding:9px 16px; font-weight:700; cursor:pointer; font-size:.9rem;}
.wallopen:hover{filter:brightness(1.15);}
.wallopen:focus-visible{outline:3px solid var(--wb-attn); outline-offset:2px;}

/* ------------------------------------------------------------- the wall board */
html.wb-lock, html.wb-lock body{overflow:hidden;}
.wb{position:fixed; inset:0; z-index:2147483000; display:none; flex-direction:column; background:var(--wb-bg);
  color:#1b1b1b; font-family:inherit; --wb-fs:14px; font-size:var(--wb-fs);}
.wb.on{display:flex;}
.wb > .wb-bar, .wb > .wb-legend, .wb > .wb-msg{flex:0 0 auto;}
.wb th{text-transform:none; letter-spacing:normal;}
.wb:fullscreen{width:100vw; height:100vh;}
.wb button, .wb select{font:inherit; font-size:max(13px, calc(var(--wb-fs) * .8));}
.wb-bar{display:flex; align-items:center; justify-content:space-between; gap:10px 16px; flex-wrap:wrap;
  background:var(--wb-bar); color:var(--wb-bartext); padding:8px 14px;}
.wb-title{display:flex; flex-direction:column; line-height:1.15; min-width:0;}
.wb-title b{font-size:max(16px, calc(var(--wb-fs) * 1.1));}
.wb-title span{opacity:.8; font-size:max(12px, calc(var(--wb-fs) * .75));}
.wb-ctrls{display:flex; align-items:center; gap:6px; flex-wrap:wrap;}
.wb-ctrls button{background:rgba(255,255,255,.12); color:#fff; border:1px solid rgba(255,255,255,.3); border-radius:7px; padding:5px 10px; cursor:pointer; min-height:34px;}
.wb-ctrls button:hover{background:rgba(255,255,255,.22);}
.wb-ctrls button:focus-visible, .wb-ctrls select:focus-visible{outline:3px solid var(--wb-attn); outline-offset:1px;}
.wb-ctrls button.on, .wb-ctrls button[aria-pressed="true"]{background:#fff; color:var(--wb-bar); font-weight:700;}
.wb-ctrls button[disabled]{opacity:.45; cursor:default;}
.wb-ctrls .wb-attnbtn{background:var(--wb-attn); color:var(--wb-attn-text); border-color:var(--wb-attn-edge); font-weight:800;}
.wb-ctrls .wb-attnbtn.on{background:var(--wb-attn); color:var(--wb-attn-text); box-shadow:0 0 0 3px #fff inset;}
.wb-ctrls .wb-exit{background:#fff; color:var(--wb-bar); font-weight:800;}
.wb-ctrls kbd{font:inherit; font-size:.75em; border:1px solid currentColor; border-radius:4px; padding:0 4px; margin-left:4px; opacity:.7;}
.wb-lbl{display:inline-flex; align-items:center; gap:5px; color:#fff;}
.wb-lbl select{border-radius:7px; padding:4px 6px; min-height:34px; max-width:14em;}
.wb-zoom{display:inline-flex;} .wb-zoom button{border-radius:0;} .wb-zoom button:first-child{border-radius:7px 0 0 7px;} .wb-zoom button:last-child{border-radius:0 7px 7px 0;}
.wb-ro{background:var(--wb-attn); color:var(--wb-attn-text); font-weight:800; border-radius:7px; padding:5px 10px;}
.wb-legend{display:flex; flex-wrap:wrap; gap:4px 14px; padding:5px 14px; background:#fff; border-bottom:1px solid var(--wb-line);
  font-size:max(12px, calc(var(--wb-fs) * .78));}
.wb-legend .sw{display:inline-block; width:1em; height:1em; border-radius:3px; margin-right:5px; vertical-align:-2px;}
.wb-msg{padding:5px 14px; font-size:max(12px, calc(var(--wb-fs) * .8)); background:#fff; border-bottom:1px solid var(--wb-line); color:#3d3a35; min-height:1.6em;}
.wb-msg.ok{background:#E7F3EC; color:#1E5A3F; font-weight:700;}
.wb-msg.err{background:var(--wb-attn2); color:var(--wb-attn-text); font-weight:700; border-bottom:2px solid var(--wb-attn-edge);}
.wb-scroll{flex:1 1 auto; overflow:auto; position:relative; overscroll-behavior:contain;}
.wb-grid{border-collapse:separate; border-spacing:0; width:max-content; min-width:100%; table-layout:fixed;}
.wb-grid th, .wb-grid td{font-size:var(--wb-fs); line-height:1.2;}
.wb-grid thead{position:sticky; top:0; z-index:4;}
.wb-grid thead th{background:var(--wb-bar); color:#fff; font-weight:800; text-align:center; padding:3px 4px; white-space:nowrap;}
.wb-grid thead tr:nth-child(2) th{background:#2C4E78; font-size:calc(var(--wb-fs) * .85);}
.wb-grid thead th.wb-corner{position:sticky; left:0; z-index:5; text-align:left; vertical-align:bottom;}
.wb-grid th.wb-term{border-left:3px solid var(--wb-bg);}
.wb-grid .wb-tstart{border-left:3px solid var(--wb-bar) !important;}
.wb-grid tbody th.wb-name{position:sticky; left:0; z-index:2; text-align:left; background:var(--dc); color:var(--dt);
  width:min(11em, 16vw); min-width:min(11em, 16vw); max-width:min(11em, 16vw); padding:3px 6px; border-bottom:1px solid rgba(0,0,0,.15); vertical-align:middle;}
.wb-grid tbody th.wb-name .wb-n{display:block; font-weight:800; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.wb-grid tbody th.wb-name .wb-s{display:block; font-size:.75em; font-weight:600; opacity:.9; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.wb-grid tbody th.wb-name.attn{box-shadow:inset -8px 0 0 var(--wb-attn);}
.wb-grid tbody th.wb-name .wb-w{display:inline-block; font-size:.72em; font-weight:800; background:var(--wb-attn); color:var(--wb-attn-text); border:1px solid var(--wb-attn-edge); border-radius:4px; padding:0 4px;}
.wb-grid tr.wb-dstart > *{border-top:3px solid var(--wb-bar);}
.wb-grid tr.wb-none th.wb-name{background:repeating-linear-gradient(135deg, var(--wb-attn) 0 10px, var(--wb-attn2) 10px 20px); color:var(--wb-attn-text); border-left:8px solid var(--dc);}
.wb-cell{background:var(--wb-cell); border-right:1px solid var(--wb-line); border-bottom:1px solid var(--wb-line); padding:2px; vertical-align:top;
  width:calc(var(--wb-fs) * 7.6); min-width:calc(var(--wb-fs) * 7.6); max-width:calc(var(--wb-fs) * 7.6); outline:none;}
.wb-cell.empty{background:repeating-linear-gradient(0deg, #FAF9F6 0 1px, #FFFFFF 1px 6px);}
.wb-cell:focus-visible, .wb-cell[tabindex="0"]:focus{box-shadow:inset 0 0 0 3px #111;}
.wb-chip{display:block; background:var(--dc); color:var(--dt); border-radius:5px; padding:2px 5px; margin:1px 0; line-height:1.2;
  cursor:grab; touch-action:none; user-select:none; -webkit-user-select:none; border:1px solid rgba(0,0,0,.18); min-height:2.4em;}
.wb-grid.locked .wb-chip{cursor:default;}
.wb-chip .wb-n{display:block; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.wb-chip .wb-s{display:block; font-size:.78em; opacity:.92; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.wb-chip .wb-w{display:block; font-size:.78em; font-weight:800; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.wb-chip.attn{color:var(--wb-attn-text);}
.wb-chip.dim{opacity:.28;}
.wb-chip.sel{outline:4px solid #111; outline-offset:1px; box-shadow:0 0 0 7px #fff;}
.wb-chip.just{animation:wbjust 1.2s ease-out 1;}
@keyframes wbjust{0%{box-shadow:0 0 0 6px #111;} 100%{box-shadow:0 0 0 0 transparent;}}
.wb-chip.lifting{opacity:.35;}
.wb-ghost{position:fixed; left:0; top:0; z-index:2147483600; pointer-events:none; opacity:.95; box-shadow:0 10px 26px rgba(0,0,0,.35); cursor:grabbing; transform-origin:0 0;}
.wb.dragging .wb-cell.can, .wb.picking .wb-cell.can{background:#E3F4EA; box-shadow:inset 0 0 0 2px #2F7D5B;}
.wb.dragging .wb-cell.cannot, .wb.picking .wb-cell.cannot{background:repeating-linear-gradient(135deg, #FFF3C4 0 6px, #FFE9A0 6px 12px);}
.wb.dragging .wb-cell.over.can{background:#BFE5CD; box-shadow:inset 0 0 0 4px #1E5A3F;}
.wb.dragging .wb-cell.over.cannot{box-shadow:inset 0 0 0 4px var(--wb-attn-edge);}
.wb-emptymsg{padding:30px; text-align:center; font-size:1.2em; color:#555;}
@media (max-width:700px){ .wb-bar{padding:6px 8px;} .wb-legend{display:none;} }
@media (prefers-reduced-motion:reduce){ .wb-chip.just{animation:none;} }
@media print{ .wb{display:none !important;} }