/* 办公室更方便 (office_quick.js): one bar of number chips that filter, a 显示 menu, and 现在要处理 above the floor.
   Calm blue/purple from the theme tokens; red only for late work. */
.office-quickbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin:0 0 12px}
.office-chips{display:flex;flex-wrap:wrap;gap:6px}
html[data-theme] .office-chip:not(#office){display:inline-flex;align-items:baseline;gap:5px;padding:5px 11px;border:1px solid var(--line,#d5dce6);border-radius:16px;background:var(--panel,#fff);color:var(--dim,#66758a);box-shadow:none;font-size:12px;line-height:1.4;white-space:nowrap}
.office-chip b{font-size:14px;color:var(--txt,#1f2b3a);font-variant-numeric:tabular-nums}
html[data-theme] .office-chip:not(#office):hover{border-color:var(--acc,#2f6fd6);color:var(--txt,#1f2b3a)}
html[data-theme] .office-chip:not(#office).on{background:var(--acc,#2f6fd6);border-color:var(--acc,#2f6fd6);color:#fff}
.office-chip.on b{color:#fff}
.office-chip.warn b{color:#c2410c}
.office-chip.warn.on b{color:#fff}
html[data-theme] .office-chip:not(#office).static{cursor:default}
.office-quickbar-views{display:flex;flex-wrap:wrap;align-items:center;gap:8px}

/* 显示: 按部门/按项目 and 紧凑/卡片/卡通 behind one small menu */
.office-view-menu{position:relative}
.office-view-menu>summary{list-style:none;cursor:pointer;padding:5px 12px;border:1px solid var(--line,#d5dce6);border-radius:16px;background:var(--panel,#fff);color:var(--txt,#1f2b3a);font-size:12px;user-select:none}
.office-view-menu>summary::-webkit-details-marker{display:none}
.office-view-menu[open]>summary{border-color:var(--acc,#2f6fd6);color:var(--acc,#2f6fd6)}
.office-view-pop{position:absolute;inset-inline-end:0;top:calc(100% + 6px);z-index:30;display:grid;gap:6px;min-width:190px;padding:12px;border:1px solid var(--line,#d5dce6);border-radius:10px;background:var(--panel,#fff);box-shadow:0 14px 34px -12px rgba(20,34,60,.35)}
.office-view-pop small{font-size:11px;color:var(--dim,#66758a)}
.office-view-pop .office-group-switch{width:max-content}

/* 现在要处理 */
.office-needs{margin:0 0 12px;padding:8px 12px;border:1px solid color-mix(in srgb,var(--acc,#2f6fd6) 30%,var(--line,#d5dce6));border-radius:10px;background:var(--surface1,var(--panel,#fff))}
.office-needs>header{margin:0 0 6px}
.office-needs.folded>header{margin:0}
html[data-theme] .office-needs-fold:not(#office){display:flex;align-items:baseline;gap:10px;width:100%;padding:0;border:0;background:none;box-shadow:none;color:var(--txt,#1f2b3a);text-align:start}
.office-needs-fold b{font-size:13px}
.office-needs-fold small{font-size:12px;color:var(--dim,#66758a)}
.office-needs-fold small .late{color:#c2410c}
.office-needs-fold i{margin-inline-start:auto;font-style:normal;color:var(--dim,#66758a)}
.office-need{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto auto;align-items:center;gap:10px;padding:3px 0;border-top:1px solid var(--line,#e3e8ef);cursor:grab}
.office-need.dragging{opacity:.5}
.office-need-tag{font-style:normal;font-size:11px;padding:1px 7px;border-radius:9px;color:var(--wh-violet,#5b4bb7);background:color-mix(in srgb,var(--wh-violet,#5b4bb7) 12%,transparent);white-space:nowrap}
.office-need[data-kind="late"] .office-need-tag{color:#b42318;background:#fdecea}
html[data-theme] .office-need-title:not(#office){min-width:0;padding:0;border:0;background:none;box-shadow:none;color:var(--txt,#1f2b3a);font-size:13px;text-align:start;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html[data-theme] .office-need-title:not(#office):hover{color:var(--acc,#2f6fd6);text-decoration:underline}
.office-need-owner{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--dim,#66758a);white-space:nowrap}
.office-need-due{font-size:12px;color:var(--dim,#66758a);white-space:nowrap;font-variant-numeric:tabular-nums}
.office-need[data-kind="late"] .office-need-due{color:#b42318}
html[data-theme] .office-need button:not(.office-need-title):not(#office){padding:2px 10px;font-size:12px;border-radius:7px;white-space:nowrap}
html[data-theme] .office-need .office-next:not(#office){border-color:var(--acc,#2f6fd6);color:var(--acc,#2f6fd6);box-shadow:0 0 0 3px color-mix(in srgb,var(--acc,#2f6fd6) 22%,transparent)}
html[data-theme] .office-needs-more:not(#office){margin-top:6px;padding:4px 0;border:0;background:none;box-shadow:none;color:var(--acc,#2f6fd6);font-size:12px}

/* 工作栏 toggle in the top row: a real button, the dot only while the panel is open */
#office-panel-toggle{cursor:pointer}
#office-panel-toggle.off i{background:var(--dim,#94a3b8);box-shadow:none}

/* The person card sits low on the right so the toolbar stays usable; 派任务 is the next step. */
.office-mode .team-map-focus{top:auto;bottom:18px;max-height:min(460px,calc(100% - 140px));overflow:auto}
/* the colleague card beside the person clicked (officePlaceFocus) */
.office-mode .team-map-focus.anchored{position:fixed!important;right:auto!important;bottom:auto!important;z-index:70;max-height:min(460px,calc(100vh - 16px))}
/* the chat bar at the bottom (chat_windows.js) replaces the old 工作讨论 button, which sat under it */
body:has(.chat-dock) #studio-chat-launcher{display:none!important}
.office-mode .team-map-focus-actions button.primary{box-shadow:0 0 0 3px color-mix(in srgb,var(--acc,#2f6fd6) 24%,transparent)}

@media(max-width:720px){
  .office-need{grid-template-columns:auto minmax(0,1fr) auto;row-gap:2px}
  .office-need-owner{grid-column:2}
  .office-need-due{grid-column:3;grid-row:2}
  .office-need>button:last-child{grid-column:3;grid-row:1}
  .office-view-pop{inset-inline-end:auto;inset-inline-start:0}
}

/* The row above the office moves into the heading (工作栏 / 真实地点 / ＋派任务); the row stays for 真实地点 mode. */
.office-mode .team-map-toolbar{display:none}
.office-head-tool{display:inline-flex;align-items:center;gap:6px;font-size:12px}
.office-head-tool i{width:7px;height:7px;border-radius:50%;background:var(--ops-green,#16a34a)}
.office-head-tool.off i{background:var(--dim,#94a3b8)}
html[data-theme] .office-assign-new:not(#office){box-shadow:0 0 0 3px color-mix(in srgb,var(--acc,#2f6fd6) 24%,transparent),0 4px 14px -4px var(--wh-glow,rgba(70,112,170,.26))}
.office-need-actions{display:inline-flex;gap:6px}
@media(max-width:720px){.office-panel-toggle{display:none}}
.arrange-mode .office-real-places{display:none}
.studio-scene-heading h2{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* 本周完成 on each department's header and its list */
html[data-theme] .org-zone-done:not(#office){padding:0 7px;border:1px solid color-mix(in srgb,var(--wh-violet,#5b4bb7) 35%,transparent);border-radius:8px;background:color-mix(in srgb,var(--wh-violet,#5b4bb7) 10%,transparent);color:var(--wh-violet,#5b4bb7);box-shadow:none;font-size:10.5px;line-height:1.6;white-space:nowrap}
html[data-theme] .org-zone-done:not(#office).none{opacity:.55}
html[data-theme] .org-zone-done:not(#office).on{background:var(--wh-violet,#5b4bb7);color:#fff}
.office-done-list{margin:4px 0 10px;padding:6px 10px;border:1px dashed color-mix(in srgb,var(--wh-violet,#5b4bb7) 35%,var(--line,#d5dce6));border-radius:8px;background:var(--panel,#fff);font-size:12px}
.office-done-list.empty{color:var(--dim,#66758a)}
.office-done-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;align-items:center;padding:2px 0}
.office-done-row span{color:var(--dim,#66758a);white-space:nowrap}
html[data-theme] .office-done-title:not(#office){min-width:0;padding:0;border:0;background:none;box-shadow:none;color:var(--txt,#1f2b3a);font-size:12px;text-align:start;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html[data-theme] .office-done-title:not(#office):hover{color:var(--acc,#2f6fd6);text-decoration:underline}
.office-done-list small{color:var(--dim,#66758a)}
.org-zone>header .office-plaque,.org-zone>header .org-enter{white-space:nowrap}
.org-zone>header>small{white-space:nowrap}

/* 组内待分配: the department's 没人负责 work on its header; glows on the viewer's own department */
html[data-theme] .org-zone-pool:not(#office){padding:0 7px;border:1px solid color-mix(in srgb,var(--acc,#2f6fd6) 45%,transparent);border-radius:8px;background:color-mix(in srgb,var(--acc,#2f6fd6) 10%,transparent);color:var(--acc,#2f6fd6);box-shadow:none;font-size:10.5px;line-height:1.6;white-space:nowrap}
html[data-theme] .org-zone-pool:not(#office).mine{box-shadow:0 0 0 3px color-mix(in srgb,var(--acc,#2f6fd6) 24%,transparent);font-weight:600}
html[data-theme] .org-zone-pool:not(#office).on{background:var(--acc,#2f6fd6);color:#fff}
.office-pool-list{margin:4px 0 10px;padding:6px 10px;border:1px solid color-mix(in srgb,var(--acc,#2f6fd6) 35%,var(--line,#d5dce6));border-radius:8px;background:var(--panel,#fff);font-size:12px}
.office-pool-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:6px;align-items:center;padding:3px 0;cursor:grab}
.office-pool-row+.office-pool-row{border-top:1px solid var(--line,#e3e8ef)}
.office-pool-due{color:var(--dim,#66758a);white-space:nowrap;font-variant-numeric:tabular-nums}
.office-pool-row.late .office-pool-due{color:#b42318}
html[data-theme] .office-pool-row>button:not(.office-done-title):not(#office){padding:2px 8px;font-size:11.5px;border-radius:7px;white-space:nowrap}
html[data-theme] .office-pool-row .office-next:not(#office){border-color:var(--acc,#2f6fd6);color:var(--acc,#2f6fd6);box-shadow:0 0 0 3px color-mix(in srgb,var(--acc,#2f6fd6) 22%,transparent)}
.org-zone-chips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 6px}
.org-zone-chips:empty{display:none}
.office-pool-row{grid-template-columns:1fr auto auto}
.office-pool-row .office-done-title{grid-column:1/-1}
.office-pool-row .office-pool-due{grid-column:1}

/* Wide screens: department columns centred under the GM instead of packed to the left (cartoon rooms still fill). */
#worldview .org-zones{grid-template-columns:repeat(auto-fit,minmax(230px,340px));justify-content:center}
#worldview .look-simple .org-zones{grid-template-columns:repeat(auto-fit,minmax(280px,420px))}
#worldview .look-cartoon .org-zones{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
/* Inside one department */
.office-team-back{display:flex;align-items:center;gap:10px;margin:0 0 10px}
html[data-theme] .office-team-back button:not(#office){padding:5px 12px;border-radius:16px;font-size:12px}
.office-team-back b{font-size:14px;color:var(--txt,#1f2b3a)}
@media(max-width:760px){
  #worldview .org-zones{grid-template-columns:1fr}
  .office-real-places{display:none}
  .office-need{grid-template-columns:auto minmax(0,1fr) auto}
  .office-need>.office-need-actions,.office-need>button:last-child{grid-column:3;grid-row:1 / span 2;align-self:center}
  .office-need-actions{flex-direction:column;gap:4px}
  .office-need-owner{grid-column:2;grid-row:2}
  .office-need-due{grid-column:1;grid-row:2;font-size:11px}
}

/* Workload bubbles in a department's room: calm count, red N! when late (same as the floor's legend) */
.studio-team-detail .studio-station{position:relative}
.office-bubble.office-bubble-count{background:var(--panel,#fff);color:var(--acc,#2f6fd6);border-color:var(--acc,#2f6fd6)}
.office-bubble.office-bubble-count.review{color:var(--wh-violet,#5b4bb7);border-color:var(--wh-violet,#5b4bb7)}
.studio-team-detail .studio-person:has(.office-bubble) .studio-person-alert{display:none}
.studio-office .studio-team-detail .studio-station>.office-bubble:not(#office){display:block;top:4px;right:auto;left:56px;cursor:help;min-width:22px;padding:1px 6px;font-size:12.5px;line-height:1.35;border-width:2px;box-shadow:0 2px 6px rgba(20,34,60,.25)}
/* 现在要处理 in the work column: narrow two-line rows, its own scroll when opened in full. */
#office-panel-content .office-panel-needs{margin:0 0 10px;padding:8px 10px}
#office-panel-content .office-panel-needs .office-needs-rows{max-height:46vh;overflow-y:auto}
#office-panel-content .office-panel-needs .office-need{grid-template-columns:auto minmax(0,1fr) auto;row-gap:2px;gap:4px 8px;padding:5px 0}
#office-panel-content .office-panel-needs .office-need-title{grid-column:2 / span 2}
#office-panel-content .office-panel-needs .office-need-owner{grid-column:2;grid-row:2;min-width:0;overflow:hidden;text-overflow:ellipsis}
#office-panel-content .office-panel-needs .office-need-due{grid-column:1;grid-row:2;font-size:11px}
#office-panel-content .office-panel-needs .office-need>.office-need-actions,#office-panel-content .office-panel-needs .office-need>button:last-child{grid-column:3;grid-row:2;justify-self:end}
html[data-theme] .office-needs-link:not(#office){display:flex;align-items:baseline;gap:10px;width:100%;margin:0 0 12px;padding:7px 12px;border:1px solid color-mix(in srgb,var(--acc,#2f6fd6) 30%,var(--line,#d5dce6));border-radius:10px;background:var(--surface1,var(--panel,#fff));box-shadow:none;color:var(--txt,#1f2b3a);text-align:start}
.office-needs-link b{font-size:13px}
.office-needs-link small{font-size:12px;color:var(--dim,#66758a)}
.office-needs-link small .late{color:#c2410c}
.office-needs-link i{margin-inline-start:auto;font-style:normal;font-size:12px;color:var(--acc,#2f6fd6)}
html[data-theme] .office-needs-link:not(#office):hover{border-color:var(--acc,#2f6fd6)}
