.workspace-notification-panel { width: min(420px, calc(100vw - 24px)); max-height: min(620px, calc(100dvh - var(--workspace-notification-top, 74px) - 12px)); border-color: #cbdff1; }
.workspace-notification-header { background: #f8fbff; }
.workspace-notification-header h2 { font-size: 15px; font-weight: 700; }
.workspace-notification-content { padding: 0 16px 8px; overscroll-behavior: contain; }
.workspace-notification-notice { display: block; padding: 16px 0 0; }
.workspace-notification-copy strong { color: #1c4c77; font-weight: 700; }
.workspace-notification-copy p { font-size: 11px; overflow-wrap: anywhere; }
.notice-filters { display: flex; flex-wrap: wrap; gap: 5px; margin: 13px 0; }
.notice-filters button { padding: 5px 8px; min-height: 29px; border: 1px solid #dbe8f4; border-radius: 5px; background: #fff; color: #657d96; font: inherit; font-size: 11px; font-weight: 500; cursor: pointer; }
.notice-filters button[aria-pressed="true"] { color: #116acb; border-color: #bad6f2; background: #eef6ff; }
.notice-filters button:focus-visible, .notice-summary:focus-visible { outline: 2px solid #1688f5; outline-offset: 1px; }
.workspace-notification-list { margin-top: 0; }
.notice-item { min-width: 0; border-bottom: 1px solid #e6eef7; }
.notice-item:last-child { border-bottom: 0; }
.notice-summary { display: grid; grid-template-columns: 7px minmax(0, 1fr) 12px; align-items: start; gap: 7px 9px; padding: 14px 0; cursor: pointer; list-style: none; }
.notice-summary::-webkit-details-marker { display: none; }
.notice-summary::after { content: "⌄"; grid-column: 3; grid-row: 1; color: #7c93ac; text-align: center; }
.notice-detail[open] .notice-summary::after { content: "⌃"; }
.notice-dot { width: 6px; height: 6px; border-radius: 50%; margin-top: 6px; background: #116acb; }
.notice-title { color: #24435f; font-size: 13px; line-height: 1.6; font-weight: 650; overflow-wrap: anywhere; }
.notice-tags { grid-column: 2; display: flex; flex-wrap: wrap; gap: 5px; }
.notice-tag { padding: 2px 6px; border-radius: 4px; color: #116acb; background: #eef6ff; font-size: 10px; line-height: 1.6; font-weight: 500; }
.notice-tag.notice-tone-overdue { color: #b23c50; background: #fff0f3; }
.notice-dot.notice-tone-overdue { background: #d85168; }
.notice-tag.notice-tone-today { color: #116acb; background: #edf5ff; }
.notice-tag.notice-tone-soon { color: #967022; background: #fff7e8; }
.notice-dot.notice-tone-soon { background: #b18a32; }
.notice-tag.notice-tone-waiting { color: #72579d; background: #f3effb; }
.notice-dot.notice-tone-waiting { background: #8c70b3; }
.notice-date { grid-column: 2; color: #71869b; font-size: 11px; line-height: 1.6; }
.notice-body { margin: 0 0 14px 16px; padding: 12px; border-left: 2px solid #cbdff1; border-radius: 0 5px 5px 0; background: #f7faff; }
.notice-body p { margin: 0 0 7px; line-height: 1.7; font-size: 11px; color: #56708b; white-space: pre-wrap; overflow-wrap: anywhere; }
.notice-body .notice-path { color: #116acb; }
.notice-facts { display: grid; grid-template-columns: 55px minmax(0, 1fr); gap: 8px; margin: 10px 0 0; font-size: 11px; line-height: 1.7; }
.notice-facts dt { color: #77899c; }
.notice-facts dd { margin: 0; color: #2e4d69; white-space: pre-wrap; overflow-wrap: anywhere; }
.workspace-notification-empty { padding: 32px 0; font-weight: 500; }
@media (prefers-reduced-motion: reduce) { .workspace-notification-panel * { transition: none; } }