/* Follow the app's system theme, with explicit theme selection taking priority. */
:root{--tw-task-tint:80%;--tw-scheme:light;--tw-overtime:#b45309}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--tw-task-tint:20%;--tw-scheme:dark;--tw-overtime:#fbbf24}}
:root[data-theme=dark]{--tw-task-tint:20%;--tw-scheme:dark;--tw-overtime:#fbbf24}
:where(.tw-layout,.hour-plan-sheet){color-scheme:var(--tw-scheme)}
/* Shared, horizontally scrollable staffing timeline. */
.tw-week-choice{display:flex;gap:7px;align-items:end}.tw-week-choice select{width:96px;min-height:32px;height:32px;padding:4px 7px;border:1px solid var(--line);border-radius:6px;background:var(--card);color:var(--ink);font:inherit;font-size:12px;font-weight:500;cursor:pointer}.tw-week-choice select[data-week-year]{width:80px}.tw-week-choice select:focus-visible{outline:2px solid var(--hivis);outline-offset:2px}
#org3.tw-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:12px}
.tw-layout .hero{grid-column:1/-1;position:static;padding:10px 16px;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:12px}
.tw-layout .hero>div:first-child{display:flex;gap:18px;align-items:center}.tw-layout .hero .nav{width:auto;display:flex;gap:6px}.tw-layout .hero .nav button{padding:7px 12px}
.tw-layout .board{min-width:0}.tw-layout .puls{display:block;position:sticky;top:70px;max-height:calc(100vh - 110px);overflow:auto;padding:0}
.tw-layout .tw-scroll{overflow:auto;max-height:calc(100vh - 320px);min-height:280px;scrollbar-gutter:stable;overscroll-behavior:contain}
.tw-board{width:max-content;min-width:100%;--tw-label:210px}
.tw-head,.tw-row{display:flex;position:relative;width:max-content;min-width:100%}.tw-head{position:sticky;top:0;z-index:16;background:var(--card);height:58px;border-bottom:1px solid var(--line)}
.tw-board .tw-label{box-sizing:border-box;position:sticky;left:0;z-index:10;flex:0 0 var(--tw-label);width:var(--tw-label);background:var(--card);padding:12px;border-right:1px solid var(--line);box-shadow:4px 0 8px #18243b08;display:flex;flex-direction:column;gap:5px;white-space:normal}
.tw-label b{font-size:13px}.tw-label small{font-size:11px;color:var(--ink2)}
.tw-date{box-sizing:border-box;flex:none;border:0;border-right:1px solid var(--line);background:var(--board);color:var(--ink);padding:7px 8px;cursor:pointer}.tw-date small{display:flex;justify-content:space-between;margin-top:7px;color:var(--ink2);font-size:10px}.tw-date.today{background:color-mix(in srgb,var(--hivis) 14%,var(--card))}
.tw-track{position:relative;flex:none;height:100%;background:var(--card)}
.tw-day{position:absolute;top:0;height:100%;box-sizing:border-box;border:0;border-right:1px solid var(--line);border-radius:0;background:transparent;color:var(--ink2);text-align:left;cursor:pointer;padding:3px 7px}.tw-day.weekend{background:var(--board)}.tw-day.today{box-shadow:inset 2px 0 #ffb600}.tw-day>span{position:absolute;top:4px;left:7px;font-size:10px}.tw-day>small{position:absolute;bottom:9px;left:7px;font-size:10px;opacity:1}.tw-day:hover{background:color-mix(in srgb,var(--ink) 6%,var(--card))}.tw-day:hover>small{opacity:1;text-decoration:underline}
.tw-bubble{position:absolute;box-sizing:border-box;height:39px;border:1px solid #94a3b855;border-radius:6px;background:color-mix(in srgb,var(--task-color,#e2e8f0) var(--tw-task-tint),var(--card));color:var(--ink);padding:4px 6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;cursor:grab;touch-action:none;box-shadow:0 1px 2px #17243a16;z-index:2}
.tw-bubble b,.tw-bubble small{display:block;overflow:hidden;text-overflow:ellipsis}.tw-bubble b{font-size:11px}.tw-bubble small{font-size:10px;margin-top:2px}.tw-bubble:hover{filter:brightness(.96);box-shadow:0 2px 7px #17243a35;z-index:4}.tw-bubble.overtime{border-bottom:4px dashed var(--tw-overtime)}.tw-bubble.inferred{border-top-style:dashed}.tw-bubble.conflict{outline:2px solid #c83c40;outline-offset:-2px}.tw-bubble.travel{background:var(--soft)}.tw-bubble.absence,.tw-bubble.private{background:repeating-linear-gradient(135deg,var(--board) 0 5px,var(--soft) 5px 7px);cursor:pointer}.tw-bubble.job{background:color-mix(in srgb,#7dd3fc var(--tw-task-tint),var(--card))}.tw-bubble.dragging{z-index:30;opacity:.8;box-shadow:0 8px 18px #17243a55}.tw-bubble.invalid{outline:3px solid #dc2626}
.tw-project{background:var(--soft);height:34px;border-bottom:1px solid var(--line)}.tw-project>button{position:sticky;left:0;background:transparent;border:0;padding:8px 12px;font-weight:750;color:var(--ink);cursor:pointer;max-width:600px}
.tw-scale{display:flex;align-items:center;gap:7px;margin-left:auto;font-size:12px;white-space:nowrap}.tw-scale-title{font-size:10px;font-weight:800;color:var(--ink2);margin-right:2px}.tw-scale input[type=range]{width:130px;accent-color:#b77f00}.tw-scale button{display:grid;place-items:center;width:32px;height:32px;flex:none;border:1px solid var(--line);border-radius:7px;background:var(--card);color:var(--ink);font-size:16px;font-weight:800;cursor:pointer}.tw-scale button:hover:not(:disabled){border-color:var(--hivis);background:color-mix(in srgb,var(--hivis) 11%,var(--card))}.tw-scale button:focus-visible{outline:2px solid var(--hivis);outline-offset:2px}.tw-scale button:disabled{opacity:.4;cursor:not-allowed}.tw-layout .filters{flex-wrap:wrap}.tw-layout input[type=date]{border:1px solid var(--line);border-radius:6px;padding:5px;background:var(--card);color:var(--ink)}
.tw-panel-tabs{position:sticky;top:0;z-index:2;background:var(--card);display:flex;padding:8px;gap:6px;border-bottom:1px solid var(--line)}.tw-panel-tabs button{flex:1;border:0;border-radius:7px;padding:9px;background:var(--soft);color:var(--ink2);cursor:pointer;font-weight:750}.tw-panel-tabs button.on{background:var(--navy);color:white}
.tw-panel-tools{padding:12px;display:flex;flex-direction:column;gap:9px}.tw-panel-tools input,.tw-panel-tools select{box-sizing:border-box;width:100%;padding:8px;border:1px solid var(--line);border-radius:7px;background:var(--card);color:var(--ink)}.tw-panel-tools label,.tw-panel-tools small{font-size:11px;color:var(--ink2)}.tw-people{padding:0 10px 12px;display:flex;flex-direction:column;gap:7px}.tw-person{display:flex;flex-direction:column;text-align:left;gap:5px;padding:10px;border:1px solid var(--line);border-left:4px solid #2c855f;border-radius:8px;background:var(--card);color:var(--ink);cursor:grab;touch-action:none}.tw-person[hidden]{display:none}.tw-person.tw-status-partial{border-left-color:#c49220}.tw-person.tw-status-busy{border-left-color:#64748b}.tw-person.tw-status-unavailable{border-left-color:#a0a7b4;background:var(--board)}.tw-person span{font-size:12px}.tw-person small{font-size:10px;color:var(--ink2)}
.tw-person.overview-only{cursor:pointer;touch-action:auto}.tw-person-no-results{padding:12px 8px;margin:0;color:var(--ink2);font-size:11px}
#tw-drag-status{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);z-index:2000;background:var(--navy);color:#fff;border-radius:9px;padding:12px 20px;box-shadow:0 6px 24px #17243a44;pointer-events:none}
.tw-day-projects,.tw-day-context{margin-top:16px;border-top:1px solid var(--line);padding-top:14px}.tw-day-projects p{font-size:12px;color:var(--ink2)}.tw-day-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:8px;max-height:240px;overflow:auto}.tw-task-choice{display:flex;flex-direction:column;gap:5px;text-align:left;padding:10px;border:1px solid var(--line);border-radius:8px;background:var(--board);color:var(--ink);cursor:grab;touch-action:none}.tw-task-choice span{font-size:11px}.tw-empty{padding:25px}.tw-board button:focus-visible,.tw-person:focus-visible{outline:3px solid #2563eb;outline-offset:-3px}.ghostdrag{pointer-events:none}
@media(max-width:1100px){#org3.tw-layout{grid-template-columns:minmax(0,1fr) 240px}.tw-board{--tw-label:170px}.tw-layout .tw-scroll{max-height:65vh}}
@media(max-width:760px){#org3.tw-layout{grid-template-columns:minmax(0,1fr)}.tw-layout .puls{position:static;max-height:350px}.tw-board{--tw-label:135px}.tw-layout .hero>div:first-child{flex-direction:column;gap:3px;align-items:flex-start}.tw-layout .hero span{font-size:11px}.tw-layout .lens{flex-wrap:wrap}.tw-layout .tw-scroll{min-height:250px;max-height:60vh}}

.tw-layout .hero .nav button{height:32px;min-width:38px;white-space:nowrap;flex:none}

.tw-pan{display:flex;gap:10px;align-items:center}.tw-pan input{flex:1;min-width:0;accent-color:#7487a2}.tw-pan button{width:28px;height:24px;border:1px solid var(--line);border-radius:5px;color:var(--ink);background:var(--card);cursor:pointer}

.tw-layout .hintbar{background:color-mix(in srgb,var(--hivis) 5%,var(--card));color:var(--ink2)}

:root{--tw-ot-bg:#ffdfb3;--tw-ot-ink:#713500}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--tw-ot-bg:#793d12;--tw-ot-ink:#fff1db}}:root[data-theme=dark]{--tw-ot-bg:#793d12;--tw-ot-ink:#fff1db}
.tw-bubble.overtime{background:var(--tw-ot-bg);color:var(--tw-ot-ink);border:2px solid var(--tw-overtime)}.tw-pause{position:absolute;top:0;bottom:0;pointer-events:none;background:repeating-linear-gradient(135deg,transparent 0 3px,#64748b44 3px 5px);border-inline:1px dashed #64748b;opacity:.65}.tw-bubble b,.tw-bubble small{position:relative;z-index:1}.hour-plan-row:has(.hour-overtime input:checked){border-left:4px solid var(--tw-overtime);background:var(--tw-ot-bg);color:var(--tw-ot-ink)}

.tw-day-gap{color:var(--tw-missing);font-weight:800;background:color-mix(in srgb,var(--tw-missing) 9%,var(--card));border-radius:4px;padding:2px 4px}.tw-missing-resource{border-color:var(--red);background:color-mix(in srgb,var(--red) 6%,var(--card))}.tw-missing-resource b{color:var(--red)}

:root{--tw-missing:#b42318}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--tw-missing:#ff9b91}}:root[data-theme=dark]{--tw-missing:#ff9b91}.tw-day-gap,.tw-missing-resource b{color:var(--tw-missing)}.pb-layout .tw-missing-resource{border-color:var(--tw-missing);background:color-mix(in srgb,var(--tw-missing) 7%,var(--card))}

/* Phase totals cover the whole phase; day totals count each assigned resource once. */
.tw-board .tw-label{overflow:auto}.tw-phase-summary{display:flex;flex-direction:column;gap:5px}.tw-phase-summary small b{font-size:inherit}.tw-phase-status{font-size:11px;font-weight:750;line-height:1.35}.tw-phase-status.missing{color:var(--tw-missing)}.tw-phase-status.over,.tw-phase-status.unknown{color:var(--tw-overtime)}.tw-phase-status.over{border-left:3px solid currentColor;padding-left:5px}.tw-phase-status.covered{color:var(--ink2)}.tw-day>span{max-width:calc(100% - 14px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tw-day>small{max-width:calc(100% - 14px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.hour-day-nav{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin:10px 0}.hour-day-nav button,.hour-day-nav input{border:1px solid var(--line);border-radius:7px;padding:7px 10px;background:var(--card);color:var(--ink);font:inherit;font-size:12px;min-height:36px}.hour-day-nav button{cursor:pointer;font-weight:700}.hour-day-nav button:hover{background:var(--soft)}.hour-overtime-help{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding-bottom:12px;font-size:12px;color:var(--ink2)}.hour-overtime-help span{flex:1;min-width:220px}.hour-add-overtime{color:var(--tw-overtime)!important;border:1px solid currentColor!important}.hour-open-day{margin-top:10px}.hour-day-nav button:focus-visible{outline:2px solid var(--ink)}

.tw-layout .hero,.tw-layout .hero .nav{flex-wrap:wrap}.pb-layout .bem-nav button{width:auto;white-space:nowrap}
@media(min-width:761px){.hour-plan-sheet .hour-plan-row{grid-template-columns:54px minmax(160px,1fr) 92px 92px 84px 90px 28px}.hour-plan-sheet .hour-plan-row>b{white-space:nowrap}.hour-plan-sheet .hour-plan-row>b small{display:block;font-size:10px;line-height:1.4;margin-top:4px;white-space:normal}}

.tw-bubble.needs-replacement{border-left:4px solid var(--bad,#c83c40)}

/* Resource selection floats above the board, with its own bounded scroll area. */
.hourly-resource-picker .overview-picker-menu{position:fixed;right:auto;bottom:auto;min-width:0;box-sizing:border-box;overflow:auto;overscroll-behavior:contain;z-index:55}
.hourly-resource-picker .overview-picker-menu section{max-height:none;overflow:visible}
.hourly-resource-picker section label>span:last-child{min-width:0;overflow-wrap:anywhere}

/* Work stays neutral in both themes; a small dot identifies the project. */
:root{--tw-work-bg:#f2f3f4}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--tw-work-bg:#29303b}}
:root[data-theme=dark]{--tw-work-bg:#29303b}
.tw-bubble.work{padding-left:17px}
.tw-bubble.work::before{content:'';position:absolute;left:6px;top:7px;width:7px;height:7px;border-radius:50%;background:var(--task-accent);box-shadow:0 0 0 1px color-mix(in srgb,var(--task-accent) 35%,var(--card));z-index:1}
.tw-bubble.work:not(.overtime){border:1px solid var(--line);background:var(--tw-work-bg)}
.tw-bubble.work.needs-replacement{border-left:4px solid var(--tw-missing)}
.tw-bubble.job{background:var(--soft)}
.tw-board.compact .tw-date small{display:none}
.tw-board.compact .tw-date{padding-inline:5px}
.tw-board.compact .tw-date b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}
.tw-board button:focus-visible{outline:3px solid var(--hivis);outline-offset:-3px}
.tw-row.tw-over-budget{outline:2px solid var(--budget-over);outline-offset:-2px}
.tw-row.tw-over-budget .tw-label{background:color-mix(in srgb,var(--budget-over) 5%,var(--card));box-shadow:inset 0 0 0 2px var(--budget-over)}
.tw-row.tw-over-budget .tw-phase-status.over{color:var(--budget-over)}
.hour-plan-sheet .hour-editor-block.work{background:var(--tw-work-bg)}

/* The right panel shows actionable project phases beside resource rows. */
.tw-project-tasks{display:flex;flex-direction:column;gap:14px;padding:0 10px 12px}.tw-task-group{display:flex;flex-direction:column;gap:7px}.tw-task-group h3{font-size:11px;font-weight:800;color:var(--ink2);margin:2px 2px 0}.tw-project-task{display:flex;flex-direction:column;gap:4px;text-align:left;width:100%;padding:10px;border:1px solid var(--line);border-left:4px solid var(--line);border-radius:8px;background:var(--card);color:var(--ink);cursor:grab;touch-action:none}.tw-project-task.needs-staffing{border-left-color:var(--tw-missing)}.tw-project-task b{font-size:12px}.tw-project-task span{font-size:11px;font-weight:750;color:var(--ink2)}.tw-project-task.needs-staffing span{color:var(--tw-missing)}.tw-project-task small{font-size:10px;color:var(--ink2)}.tw-project-task:hover{background:var(--soft);border-color:var(--hivis)}.tw-project-task:focus-visible{outline:2px solid var(--hivis);outline-offset:2px}.tw-project-task[hidden],.tw-task-group[hidden],.tw-task-no-results[hidden]{display:none}

/* A continuous, low-contrast frame marks each fag's planned dates in project timelines. */
.tw-day.fag-in-period{background:color-mix(in srgb,var(--hivis) 6%,var(--card));border-top:2px solid color-mix(in srgb,var(--hivis) 55%,var(--line));border-bottom:2px solid color-mix(in srgb,var(--hivis) 55%,var(--line))}.tw-day.fag-in-period.weekend{background:color-mix(in srgb,var(--hivis) 6%,var(--board))}.tw-day.fag-outside-period{background:color-mix(in srgb,var(--ink2) 4%,var(--card))}.tw-day.fag-outside-period.weekend{background:var(--board)}.tw-day.fag-period-start{border-left:4px solid var(--hivis)}.tw-day.fag-period-end{border-right:4px solid var(--hivis)}.tw-day.fag-period-clipped-start{border-left:3px dashed color-mix(in srgb,var(--hivis) 65%,var(--line))}.tw-day.fag-period-clipped-end{border-right:3px dashed color-mix(in srgb,var(--hivis) 65%,var(--line))}.tw-day.fag-in-period:hover{background:color-mix(in srgb,var(--hivis) 12%,var(--card))}

/* A missing day gets its own red frame without replacing the fag-period borders. */
.tw-day.has-missing{outline:2px solid var(--tw-missing);outline-offset:-3px;z-index:1}

/* Missing staffing is visible across the whole phase; a dashed frame distinguishes it from solid over-budget warnings. */
.tw-row.tw-missing-staffing:not(.tw-over-budget){outline:2px dashed var(--tw-missing);outline-offset:-2px}
.tw-row.tw-missing-staffing:not(.tw-over-budget) .tw-label{background:color-mix(in srgb,var(--tw-missing) 5%,var(--card));box-shadow:inset 0 0 0 2px var(--tw-missing)}
.pb-summary .tw-phase-status.missing{display:inline-flex;width:fit-content;padding:3px 7px;border-radius:6px;background:color-mix(in srgb,var(--tw-missing) 10%,var(--card))}

/* Partial absence is a time block, not an all-day state: make its hours visible beside neutral work. */
:root{--tw-away-bg:#fff1cc;--tw-away-ink:#6e4b10;--tw-away-border:#a66b0a;--tw-health-bg:#ffe2e7;--tw-health-ink:#7f2332;--tw-health-border:#b42338}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--tw-away-bg:#4c361b;--tw-away-ink:#ffe5af;--tw-away-border:#f2b85c;--tw-health-bg:#552733;--tw-health-ink:#ffe7ed;--tw-health-border:#ff9aab}}
:root[data-theme=dark]{--tw-away-bg:#4c361b;--tw-away-ink:#ffe5af;--tw-away-border:#f2b85c;--tw-health-bg:#552733;--tw-health-ink:#ffe7ed;--tw-health-border:#ff9aab}
.tw-bubble.absence{border:2px solid var(--tw-away-border);background:repeating-linear-gradient(135deg,var(--tw-away-bg) 0 8px,color-mix(in srgb,var(--tw-away-border) 16%,var(--tw-away-bg)) 8px 12px);color:var(--tw-away-ink);box-shadow:0 1px 3px color-mix(in srgb,var(--tw-away-border) 24%,transparent)}
.tw-bubble.absence.health-absence{border-color:var(--tw-health-border);background:repeating-linear-gradient(135deg,var(--tw-health-bg) 0 8px,color-mix(in srgb,var(--tw-health-border) 17%,var(--tw-health-bg)) 8px 12px);color:var(--tw-health-ink);box-shadow:0 1px 3px color-mix(in srgb,var(--tw-health-border) 25%,transparent)}
.tw-bubble.absence b{font-weight:900;letter-spacing:.01em}.tw-bubble.private{border:1px dashed var(--line);background:repeating-linear-gradient(135deg,var(--board) 0 6px,var(--soft) 6px 10px)}
.tw-day.has-partial-absence>span{top:4px;left:4px;max-width:calc(100% - 8px);padding:2px 4px;border-radius:4px;background:var(--tw-away-bg);color:var(--tw-away-ink);font-weight:850}
.tw-day.has-health-absence>span{background:var(--tw-health-bg);color:var(--tw-health-ink)}
/* Full-day sickness covers the day cell; partial sickness keeps only its existing time bubble. */
.tw-day.has-full-health-absence{background:repeating-linear-gradient(135deg,var(--tw-health-bg) 0 11px,color-mix(in srgb,var(--tw-health-border) 14%,var(--tw-health-bg)) 11px 17px);outline:2px solid var(--tw-health-border);outline-offset:-2px;z-index:1}
.tw-day.has-full-health-absence>span{top:5px;left:5px;max-width:calc(100% - 10px);padding:2px 5px;border-radius:4px;background:var(--tw-health-bg);color:var(--tw-health-ink);font-weight:850}
.tw-day.has-full-health-absence>small{color:var(--tw-health-ink)}
.tw-person-absence{display:block;padding:4px 6px;border-radius:5px;background:var(--tw-away-bg);color:var(--tw-away-ink);font-size:10px;font-style:normal;font-weight:850}
.tw-person-absence.health{background:var(--tw-health-bg);color:var(--tw-health-ink)}
.tw-person.tw-health-absence{border-left-color:var(--tw-health-border);background:color-mix(in srgb,var(--tw-health-bg) 40%,var(--card))}

/* Overtime stays legible at compact day widths and alongside ordinary work. */
.tw-bubble.overtime b{font-weight:900}.tw-day.has-overtime{border-top:4px solid var(--tw-overtime)}.tw-day.has-overtime>span{top:4px;left:4px;max-width:calc(100% - 35px);padding:2px 4px;border-radius:4px;background:var(--tw-ot-bg);color:var(--tw-ot-ink);font-weight:850}.tw-day.has-overtime::after{content:'OT';position:absolute;top:5px;right:4px;padding:1px 3px;border-radius:3px;background:var(--tw-overtime);color:var(--card);font-size:9px;font-weight:900}.tw-day.has-partial-absence.has-overtime>span{background:var(--tw-away-bg);color:var(--tw-away-ink)}.tw-day.has-health-absence.has-overtime>span{background:var(--tw-health-bg);color:var(--tw-health-ink)}

/* Small jobs can be assigned directly from a person's day plan. */
.smalljob-day-search{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:750}.smalljob-day-search input{border:1px solid var(--line);border-radius:7px;padding:9px;background:var(--card);color:var(--ink)}.smalljob-day-options{max-height:min(45vh,360px)}.smalljob-day-options .tw-task-choice{width:100%}.smalljob-day-options .tw-task-choice[hidden]{display:none}
.tw-day-projects .tw-task-choice:disabled{cursor:default;opacity:.6;touch-action:auto}
.tw-staffing-filter{display:flex;flex-direction:column;gap:5px;max-width:300px;font-size:12px;font-weight:650;margin-top:16px}.tw-staffing-filter select{width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:7px;background:var(--card);color:var(--ink);font:inherit}.tw-staffing-picker #tw-staffing-count{font-size:12px;color:var(--ink2);margin:10px 0}.tw-staffing-picker .tw-day-options{max-height:min(50vh,420px)}.tw-staffing-picker .tw-task-choice{cursor:pointer;touch-action:auto}.tw-staffing-picker .tw-task-choice:disabled{cursor:default;opacity:.6}.tw-staffing-picker .tw-task-choice:not(:disabled):hover{border-color:var(--ink2);background:var(--soft)}.tw-staffing-picker .tw-task-choice:focus-visible{outline:2px solid var(--hivis);outline-offset:2px}.tw-staffing-empty{grid-column:1/-1;padding:16px;background:var(--board);border-radius:7px;color:var(--ink2);font-size:13px}
.hour-plan-sheet .hour-editor-block.movable{border:0;font-family:inherit;line-height:16px;text-align:left;cursor:grab;touch-action:none;user-select:none}
.hour-plan-sheet .hour-editor-block.movable:hover{outline:1px solid var(--ink3);outline-offset:1px}
.hour-plan-sheet .hour-editor-block.movable:focus-visible{outline:2px solid var(--hivis);outline-offset:1px}
.hour-plan-sheet .hour-editor-block.dragging{cursor:grabbing;z-index:5;box-shadow:0 2px 6px #15233830}
.hour-plan-sheet .hour-editor-block.invalid{outline:2px solid var(--red);outline-offset:1px}
.hour-editor-help{display:block;min-height:18px;margin:0 0 12px;font-size:11px;line-height:1.6;color:var(--ink2)}
.hour-plan-sheet .hour-editor-block.movable{padding-inline:16px}
.hour-editor-label{display:block;overflow:hidden;text-overflow:ellipsis;pointer-events:none}
.hour-editor-resize{position:absolute;top:0;bottom:0;width:12px;max-width:40%;cursor:ew-resize;touch-action:none;z-index:1;background:color-mix(in srgb,currentColor 12%,transparent)}
.hour-editor-resize.start{left:0}.hour-editor-resize.end{right:0}
.hour-editor-resize::after{content:"";position:absolute;top:6px;bottom:6px;left:calc(50% - 1px);width:2px;border-radius:1px;background:currentColor;opacity:.8}
.hour-editor-resize:hover{background:color-mix(in srgb,currentColor 24%,transparent)}
.hour-plan-sheet .hour-editor-block.resizing{cursor:ew-resize}


/* The date range and time-span slider are shared by Ressursplan and project staffing. */
.tw-date-range{display:flex;align-items:end;gap:7px;flex-wrap:wrap}.tw-date-range label{display:flex;flex-direction:column;gap:3px;font-size:10px;font-weight:800;color:var(--ink2)}.tw-date-range input[type=date]{width:137px;min-height:32px}.tw-custom-range{font-size:10px;font-weight:800;color:var(--ink2);white-space:nowrap}.tw-scale-title b{color:var(--ink);font-size:11px;margin-left:3px}.tw-scale input[type=range]{cursor:ew-resize}.tw-scale input[type=range]{width:150px}.tw-layout .filters .tw-date-range{margin-left:auto}@media(max-width:760px){.tw-layout .filters .tw-date-range{margin-left:0}.tw-scale{margin-left:0}}

.hour-plan-sheet .hour-editor-block.absence{box-sizing:border-box;border:1px solid var(--tw-away-border);color:var(--tw-away-ink);background:repeating-linear-gradient(135deg,var(--tw-away-bg) 0 8px,color-mix(in srgb,var(--tw-away-border) 17%,var(--tw-away-bg)) 8px 12px);cursor:default}
.hour-plan-sheet .hour-editor-block.absence.health{border-color:var(--tw-health-border);color:var(--tw-health-ink);background:repeating-linear-gradient(135deg,var(--tw-health-bg) 0 8px,color-mix(in srgb,var(--tw-health-border) 17%,var(--tw-health-bg)) 8px 12px)}
.hour-plan-sheet .hour-editor-block.private{box-sizing:border-box;background:var(--soft);color:var(--ink2);border:1px dashed var(--ink3)}
.hour-plan-row.absence-conflict{box-shadow:inset 3px 0 0 var(--red);background:color-mix(in srgb,var(--red) 5%,var(--card));padding-left:8px}
.hour-plan-row .hour-absence-conflict{color:var(--red);font-weight:800}

/* Keep row boundaries visible across the sticky label and the scrolled timeline. */
.tw-board{--tw-row-divider:color-mix(in srgb,var(--ink2) 42%,var(--line))}
.tw-board .tw-row>.tw-label,.tw-board .tw-row>.tw-track{box-sizing:border-box;border-bottom:2px solid var(--tw-row-divider)}
.tw-board .tw-project{box-sizing:border-box;border-top:3px solid var(--tw-row-divider)}

/* Flexible smalljobs are a work queue, never a reservation on the time axis. */
.tw-flex-job:focus-visible{outline:2px solid var(--hivis);outline-offset:2px}
.tw-flex-panel-note{font-size:11px;font-style:normal;color:var(--ink2)}
.tw-flex-jobs{padding:12px 0;margin:10px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.tw-flex-jobs h3{margin:0 0 5px;font-size:13px}.tw-flex-jobs>p{font-size:12px;color:var(--ink2);margin:0 0 9px}
.tw-flex-jobs>div{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:8px}
.tw-flex-job{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:10px 12px;text-align:left;border:1px dashed var(--ink2);border-radius:7px;background:var(--soft);color:var(--ink);cursor:pointer;overflow-wrap:anywhere}
.tw-flex-job:hover{background:var(--card);border-color:var(--ink)}.tw-flex-job>b{font-size:12px}.tw-flex-job>span,.tw-flex-job>small{font-size:11px;color:var(--ink2)}.tw-flex-job.overdue>small{color:var(--red)}
.hour-editor-block.smalljob{background:var(--soft);color:var(--ink);border:1px dashed var(--ink2);padding:5px 8px;cursor:pointer;text-align:left;touch-action:none;user-select:none}
.hour-editor-block.smalljob.reserves-time{border-style:solid;border-left:3px solid var(--tv-petrol,#315d78)}
.hour-plan-sheet .hour-editor-track{overflow:visible}
.hour-editor-block.smalljob.flexible{overflow:visible}
.hour-editor-block.smalljob.flexible .hour-editor-label{position:sticky;left:8px;display:inline-block;max-width:300px;vertical-align:top}
.hour-editor-block.smalljob.movable{cursor:grab}.hour-editor-block.smalljob.dragging{cursor:grabbing;z-index:5;box-shadow:0 2px 8px #0003}.hour-editor-block.smalljob.invalid{outline:2px solid var(--red)}
.tw-flex-jobs>summary{font-weight:700;font-size:12px;cursor:pointer}.tw-flex-jobs>summary+ p{font-size:12px;color:var(--ink2)}
/* Company-wide smalljobs remain visible before a person is assigned. */
#v-tavla .tw-panel-tabs.tw-with-smalljobs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
#v-tavla .tw-panel-tabs.tw-with-smalljobs>.tw-panel-smalljobs:last-child:nth-child(3){grid-column:1/-1}
.tw-job-count{display:inline-flex;align-items:center;justify-content:center;min-width:18px;padding:1px 5px;margin-left:3px;border-radius:5px;background:var(--soft);color:var(--ink);font-size:11px;font-variant-numeric:tabular-nums}
.tw-smalljob-queue{display:flex;flex-direction:column;gap:7px;padding:0 10px 12px}
.tw-queue-job{cursor:pointer;touch-action:pan-y;user-select:none;overflow-wrap:anywhere}
.tw-queue-job.unassigned{border-left-color:var(--tw-missing)}
.tw-queue-job.draggable{cursor:grab;touch-action:none}.tw-queue-job.dragging{opacity:.45;cursor:grabbing}.tw-queue-job.invalid{border-color:var(--red)}
.tw-queue-job[hidden]{display:none}
.tw-queue-owner.missing,.tw-queue-job.overdue>.tw-queue-deadline{color:var(--red)}
.tw-queue-job .tw-queue-mode{border-top:1px solid var(--line);padding-top:5px;margin-top:2px}
.tw-day-smalljob{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:7px;overflow:hidden;background:var(--card)}
.tw-day-smalljob>.tw-flex-job{width:100%;flex:1;border:0;border-radius:0}
.tw-job-unassign{padding:8px 12px;border:0;border-top:1px solid var(--line);background:var(--card);color:var(--ink);font-size:12px;font-weight:700;text-align:left;cursor:pointer}
.tw-job-unassign:hover{background:var(--soft);color:var(--red)}.tw-job-unassign:disabled{opacity:.65;cursor:wait}
.tw-job-locked{padding:8px 12px;border-top:1px solid var(--line);color:var(--ink2);font-size:11px}
.tw-job-unassign:focus-visible,.tw-queue-job:focus-visible{outline:2px solid var(--hivis);outline-offset:-3px}
