
.top-bell { position: relative; }
.top-bell .bell-num:empty { display: none; }
.top-bell .bell-num { position: absolute; top: 1px; inset-inline-end: 0; min-width: 16px; height: 16px; padding: 0 4px; border-radius: var(--r-pill);
  background: var(--danger-fill); color: var(--on-fill); font-size: 10px; font-weight: 600; line-height: 16px; text-align: center; }

.bell-panel { width: min(420px, calc(100vw - 16px)); display: flex; flex-direction: column; padding: 0; }
.bell-list { overflow: auto; flex: 1 1 auto; }
.bell-item { display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: var(--sp-2); width: 100%; text-align: start;
  background: none; border: 0; border-top: 1px solid var(--line-2); padding: var(--sp-2) var(--sp-3); color: var(--text); }
.bell-item:hover { background: var(--hover-bg); }
.bell-item.unread { background: var(--sel-bg); }
.bell-item.unread:hover { background: var(--hover-bg); }
.bell-kind { grid-row: 1 / span 2; align-self: start; font-size: var(--fs-xs); color: var(--text-2); background: var(--chip-bg); border: 1px solid var(--chip-line);
  border-radius: var(--r-pill); padding: 0 var(--sp-2); white-space: nowrap; }
.bell-text { font-size: var(--fs-sm); overflow-wrap: anywhere; }
.bell-when { grid-column: 2; }
.bell-empty { padding: var(--sp-4) var(--sp-3); }
.bell-foot { display: flex; justify-content: space-between; gap: var(--sp-2); padding: var(--sp-2) var(--sp-3); border-top: 1px solid var(--line); }
.bell-proj { padding-top: var(--sp-2); }

.mention { background: var(--accent-2); color: var(--link); border-radius: var(--r-sm); padding: 0 3px; font-weight: 600; }
.mention-dd { min-width: 220px; }
.mention-dd .dd-item.active { background: var(--accent-2); }

.ep-work { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-2) var(--sp-3); align-items: end; margin: var(--sp-2) 0; }
.ep-work .ep-watch { justify-self: start; }
.ep-work .row { gap: var(--sp-2); align-items: center; }
.ep-overdue, .mw-due.overdue { color: var(--danger); font-weight: 600; font-size: var(--fs-xs); }

.mw-page { display: grid; gap: var(--gap); max-width: 980px; }
.mw-count { margin-inline-start: var(--sp-2); font-size: var(--fs-xs); color: var(--text-2); background: var(--chip-bg); border-radius: var(--r-pill); padding: 0 var(--sp-2); }
.mw-list { list-style: none; margin: 0; padding: 0; }
.mw-item { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--sp-2); padding: var(--sp-2) 0; border-top: 1px solid var(--line-2); }
.mw-item:first-child { border-top: 0; }
.mw-item > a { flex: 1 1 260px; overflow-wrap: anywhere; }
.mw-due { font-size: var(--fs-xs); color: var(--text-2); }
.notify-settings { display: flex; flex-wrap: wrap; align-items: end; gap: var(--sp-3); }
.notify-settings select { min-width: 260px; }

.mw-summary { margin: 0; font-size: var(--fs-lg); font-weight: 600; color: var(--text); }
.mw-acts { display: inline-flex; flex-wrap: wrap; gap: var(--sp-1); margin-inline-start: auto; }
.mw-new { font-size: var(--fs-xs); font-weight: 600; color: var(--info); background: var(--info-bg); border-radius: var(--r-pill); padding: 0 var(--sp-2); }
.mw-item[data-read="true"] > a { color: var(--text-2); }
.mw-item .mw-meta { flex: 0 1 auto; }
.notify-settings .checkbox { display: flex; gap: var(--sp-2); align-items: flex-start; margin-top: var(--sp-2); }
@media (max-width: 600px) { .mw-acts { margin-inline-start: 0; width: 100%; } }

.rv-page { max-width: 820px; margin: 0 auto; padding: var(--sp-4) 0 var(--sp-6); display: grid; gap: var(--sp-4); }
.rv-kicker { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2); }
.rv-num { font-family: var(--mono); font-size: var(--fs-sm); color: var(--text-2); }
.rv-title { margin: var(--sp-1) 0 0; font-size: var(--fs-2xl); line-height: 1.2; overflow-wrap: anywhere; }
.rv-strip .req-appr { border: 1px solid var(--line); border-radius: var(--r-card); padding: var(--sp-2) var(--sp-3); background: var(--panel-2); }
.rv-sec { border-top: 1px solid var(--line-2); padding-top: var(--sp-3); }
.rv-h { font-size: var(--fs-md); margin: 0 0 var(--sp-2); color: var(--text-2); text-transform: none; }
.rv-desc { font-size: var(--fs-lg); line-height: 1.6; }
.rv-facts { display: grid; grid-template-columns: minmax(120px, max-content) 1fr; gap: var(--sp-1) var(--sp-4); margin: 0; }
.rv-facts dt { color: var(--text-2); font-size: var(--fs-sm); }
.rv-facts dd { margin: 0; overflow-wrap: anywhere; }
.rv-trace dd > div + div { margin-top: 2px; }
.rv-cmt-dialog { min-width: min(560px, 80vw); }
@media (max-width: 600px) { .rv-facts { grid-template-columns: 1fr; } .rv-facts dd { margin-bottom: var(--sp-2); } }
.rv-doc-strip { margin: var(--sp-2) 0; border: 1px solid var(--line); border-radius: var(--r-card); padding: var(--sp-2) var(--sp-3); background: var(--panel-2); }
.doc-read-label { padding: 0 var(--sp-2); }
.rv-doc-strip { display: flex; flex-direction: column; align-items: stretch; gap: var(--sp-2); }
.rv-strip-head { display: flex; align-items: center; flex-wrap: wrap; gap: var(--sp-2); }
.rv-answers { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.rv-answer { display: flex; align-items: center; flex-wrap: wrap; gap: var(--sp-2); }
.rv-answer-name { min-width: 10em; }
.rv-pick-list { display: flex; flex-direction: column; gap: 6px; max-height: 50vh; overflow: auto; }
.rv-pick-row { display: flex; align-items: center; gap: 6px; }
.rv-pick .input { width: 100%; }
.rv-diagrams { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
