/* 오른쪽 패널 탭: [비서] 비서별 초상화와 지금 맡은 일 · [오늘 할 일] */
.side-tabs { flex-shrink:0; display:grid; grid-template-columns:1fr 1fr; gap:4px; margin:10px 14px 0; padding:3px; border:1px solid #e6bad53b; border-radius:99px; background:#00000026; }
.side-tabs button { padding:6px 0; border:0; border-radius:99px; background:transparent; color:#cdb9d6; font-size:12px; font-weight:600; cursor:pointer; }
.side-tabs button[aria-selected='true'] { background:linear-gradient(180deg,#e8c27c,#c99a52); color:#2b2030; box-shadow:0 2px 8px -3px #000a; }
.today-panel[data-tab='crew'] > :not(.today-panel-head, .side-tabs, .crew-board) { display:none !important; }
.today-panel[data-tab='crew'] #today-calendar { display:none; }
.today-panel:not([data-tab='crew']) > .crew-board { display:none; }

.crew-board { flex:1; min-height:0; overflow:auto; scrollbar-width:thin; display:grid; align-content:start; gap:10px; padding:12px 12px 16px; }
.crew-card {
  --ring:#e2bfa8; display:grid; gap:8px; padding:10px; border:1px solid #ffffff14; border-radius:14px;
  background:linear-gradient(160deg,#ffffff10,#ffffff04); box-shadow:inset 0 1px #ffffff0d;
}
.crew-card.codex { --ring:#9fd0dc; }
.crew-card.gemini { --ring:#c6a5ea; }
.crew-card.beiko { --ring:#e4b7c4; }
.crew-card.selected { border-color:#d0b4ea77; box-shadow:inset 0 0 0 1px #d0b4ea44, 0 0 16px -6px #d2b2f2aa; }
.crew-top { display:flex; align-items:center; gap:11px; min-width:0; }
.crew-card .crew-face {
  position:relative; flex:none; width:58px; height:58px; padding:0; border:2px solid var(--ring); border-radius:50%;
  background:#5d4a5c; overflow:hidden; cursor:pointer; box-shadow:0 0 0 3px #00000026, 0 6px 14px -6px #000a; transition:transform .15s ease, box-shadow .15s ease;
}
.crew-card .crew-face:hover { transform:scale(1.05); }
.crew-card .crew-face img { position:absolute; left:50%; top:-22%; width:300%; height:auto; max-width:none; transform:translateX(-50%); pointer-events:none; }
.crew-card.is-working .crew-face { box-shadow:0 0 0 3px #9cd7b844, 0 0 16px #9cd7b866; }
.crew-info { display:grid; gap:3px; min-width:0; }
.crew-name-row { display:flex; flex-wrap:wrap; align-items:center; gap:4px 7px; }
.crew-name { color:#fbeff8; font-size:15px; font-weight:700; }
.crew-dot { flex:none; width:7px; height:7px; border-radius:50%; background:#9a8b9e; }
.crew-card.is-working .crew-dot { background:#8fdcb7; box-shadow:0 0 6px #8fdcb7; animation:work-tag-pulse 1.6s ease-in-out infinite; }
.crew-role { color:#bfa9c8; font-size:11px; line-height:1.4; }
.crew-tasks { list-style:none; margin:0; padding:0; display:grid; gap:6px; }

/* 상단 비서 카드 줄은 오른쪽 패널로 옮겼다: 넓은 화면에서도 대화 상대는 입력창 위 선택 줄에서 고른다 */
.pick-target-group { display:inline-flex; }
.pick-target-group .pick-select { display:inline-flex; align-items:center; gap:6px; padding-left:4px; font-weight:600; }
.pick-select .pick-face, .pick-option .pick-face { width:24px; height:24px; }
.pick-face-auto { display:grid; place-items:center; border-color:#d9bde9; color:#ecd7f7; font-size:13px; line-height:1; }
.pick-option:disabled { opacity:.45; cursor:default; }
.pick-option-meta { display:block; margin-top:1px; font-size:10px; font-weight:400; opacity:.75; }
.picker.single-agent .pick-group:not(.pick-target-group) > .pick-face,
.picker.single-agent .pick-group:not(.pick-target-group) > .pick-name { display:none; }
@media (min-width:1101px) {
  .topbar #target-picker { display:none; }
  .topbar { height:60px; padding-top:10px; padding-bottom:8px; }
  .app, .app.tasks-open, .app.today-open { padding-top:76px; }
}
@media (prefers-reduced-motion:reduce) { .crew-card .crew-face { transition:none; } .crew-card .crew-face:hover { transform:none; } .crew-card.is-working .crew-dot { animation:none; } }

/* 초상화 테두리 = 남은 주간 사용량: 12시 방향부터 시계 방향으로 남은 만큼 비서 색이 차고, 쓴 만큼은 어둡게 비운다 */
.crew-quota {
  --left:100; position:relative; flex:none; display:grid; place-items:center; width:66px; height:66px; border-radius:50%;
  background:conic-gradient(var(--ring) calc(var(--left) * 1%), #ffffff1c 0);
  box-shadow:0 0 10px -2px color-mix(in srgb, var(--ring) 70%, transparent);
}
.crew-quota.none { background:none; box-shadow:none; }
.crew-quota.low { --ring:#f08a7e; }
.crew-quota > .crew-face { width:58px; height:58px; margin:0; border:2px solid #2a2030; }
.crew-quota.none > .crew-face { border-color:var(--ring); }
.crew-quota-label {
  position:absolute; left:50%; bottom:-6px; transform:translateX(-50%); padding:0 6px; border:1px solid var(--ring); border-radius:99px;
  background:#2a2030; color:#fbeff8; font-size:10px; font-weight:800; line-height:15px; font-variant-numeric:tabular-nums; white-space:nowrap; pointer-events:none;
}
.crew-quota.low .crew-quota-label { color:#ffd2cc; }

/* 비서를 누르면 그 비서가 끝낸 일 목록이 카드 아래에 펼쳐진다 */
.crew-card button.crew-info { flex:1; padding:0; border:0; background:none; color:inherit; font:inherit; text-align:left; cursor:pointer; }
.crew-card button.crew-info:hover .crew-name { text-decoration:underline; text-underline-offset:3px; }
.crew-done-caret { margin-left:auto; color:#cdb9d6; font-size:12px; }
.crew-card.done-open { border-color:color-mix(in srgb, var(--ring) 55%, transparent); }
.crew-done { display:grid; gap:6px; padding-top:8px; border-top:1px solid #ffffff14; }
.crew-done-head { display:flex; align-items:center; gap:8px; color:#f3e3ee; font-size:12px; }
.crew-done-talk { margin-left:auto; padding:3px 10px; border:1px solid color-mix(in srgb, var(--ring) 60%, transparent); border-radius:99px; background:#ffffff0d; color:#fbeff8; font-size:11px; cursor:pointer; }
.crew-done-talk:hover { background:#ffffff1c; }
.crew-done-empty { margin:2px 0; color:#bfa9c8; font-size:12px; }
.crew-done-list { list-style:none; margin:0; padding:0; display:grid; gap:4px; max-height:320px; overflow:auto; scrollbar-width:thin; }
.crew-done-item { display:grid; gap:2px; width:100%; padding:7px 9px; border:1px solid #ffffff10; border-left:3px solid var(--ring); border-radius:9px; background:#00000022; color:inherit; font:inherit; text-align:left; cursor:pointer; }
.crew-done-item:hover { background:#ffffff12; }
.crew-done-what { color:#fbeff8; font-size:12.5px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.crew-done-what::before { content:'✓ '; color:#8fdcb7; }
.crew-done-meta { color:#b39fbd; font-size:11px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }