.sf-label-workspace { display: grid; grid-template-columns: minmax(248px, 292px) minmax(0, 1fr); gap: 18px; align-items: start; }
.sf-label-notification-panel { position: sticky; top: 86px; border: 1px solid var(--border); border-radius: 16px; background: var(--surface); box-shadow: 0 12px 30px -27px rgb(15 23 42 / .52); overflow: hidden; }
.sf-label-panel-heading { display: flex; align-items: start; justify-content: space-between; gap: 12px; padding: 18px 18px 11px; }
.sf-label-panel-heading span { display: block; color: var(--text-muted); font-size: 10px; font-weight: 750; letter-spacing: .09em; text-transform: uppercase; }
.sf-label-panel-heading h2 { margin: 4px 0 0; color: var(--text); font-family: var(--font-display, inherit); font-size: 18px; line-height: 1.15; }
.sf-label-panel-heading strong { display: grid; min-width: 28px; height: 28px; place-items: center; border-radius: 9px; color: var(--accent-solid); background: color-mix(in srgb, var(--accent-solid) 11%, var(--surface)); font-size: 12px; }
.sf-label-panel-intro { margin: 0; padding: 0 18px 16px; color: var(--text-secondary); font-size: 12px; line-height: 1.5; }
.sf-label-list { max-height: calc(100vh - 232px); overflow: auto; padding: 0 10px 10px; }
.sf-label-item { padding: 12px 8px 11px; border-top: 1px solid var(--border); }
.sf-label-filter { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 8px; color: var(--text); font-size: 13px; font-weight: 750; text-align: left; }
.sf-label-filter:hover .sf-label-name, .sf-label-filter:focus-visible .sf-label-name { color: var(--accent-solid); text-decoration: underline; text-underline-offset: 3px; }
.sf-label-filter:focus-visible, .sf-label-edit:focus-visible, .sf-label-save:focus-visible, .sf-label-cancel:focus-visible { outline: 2px solid var(--accent-solid); outline-offset: 2px; }
.sf-label-arrow { color: var(--accent-solid); font-size: 16px; transition: transform 150ms ease; }
.sf-label-filter:hover .sf-label-arrow { transform: translateX(2px); }
.sf-label-item p { margin: 5px 0 0; color: var(--text-muted); font-size: 11px; line-height: 1.42; }
.sf-label-delivery { margin-top: 8px; color: var(--text-secondary); font-size: 10px; font-weight: 650; }
.sf-label-edit { margin-top: 7px; color: var(--accent-solid); font-size: 11px; font-weight: 750; text-decoration: underline; text-underline-offset: 3px; }
.sf-label-smtp-warning { margin: 0 12px 12px; padding: 9px 10px; border-left: 3px solid #d97706; border-radius: 7px; background: color-mix(in srgb, #f59e0b 10%, var(--surface)); color: var(--text-secondary); font-size: 11px; line-height: 1.45; }
.sf-label-empty { padding: 12px 8px; color: var(--text-muted); font-size: 12px; }
.sf-label-editor { margin: 4px 10px 10px; padding: 12px; border: 1px solid color-mix(in srgb, var(--accent-solid) 35%, var(--border)); border-radius: 10px; background: var(--surface-2); }
.sf-label-editor-title { color: var(--text); font-size: 12px; font-weight: 750; }
.sf-label-editor label { display: block; margin-top: 10px; color: var(--text-secondary); font-size: 11px; font-weight: 700; }
.sf-label-editor input { width: 100%; margin-top: 5px; padding: 8px 9px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); color: var(--text); font-size: 12px; }
.sf-label-editor p, .sf-label-editor-message { margin: 8px 0 0; color: var(--text-muted); font-size: 10px; line-height: 1.4; }
.sf-label-editor-message { color: var(--danger); }
.sf-label-editor-actions { display: flex; gap: 8px; margin-top: 11px; }
.sf-label-editor-actions button { padding: 7px 9px; border-radius: 8px; font-size: 11px; font-weight: 750; }
.sf-label-cancel { border: 1px solid var(--border); color: var(--text-secondary); background: var(--surface); }
.sf-label-save { color: #fff; background: var(--accent-solid); }
@media (max-width: 1120px) { .sf-label-workspace { grid-template-columns: 1fr; } .sf-label-notification-panel { position: static; } .sf-label-list { max-height: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); column-gap: 14px; } }
@media (max-width: 620px) { .sf-label-list { display: block; } .sf-label-panel-heading { padding-top: 15px; } }
