.strm-admin { min-width: 0; }
.sites-console { min-width: 0; display: grid; gap: 18px; }
.sites-console [hidden], .sites-dialog [hidden] { display: none !important; }
.sites-console h2 { margin: 0; font-size: 18px; }
.sites-console .button { gap: 7px; }
.sites-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); padding: 18px 0 24px; gap: 20px; border-bottom: 1px solid var(--line); }
.sites-metrics > div { display: flex; align-items: center; gap: 14px; }
.sites-metrics > div > .ui-icon { width: 22px; height: 22px; color: var(--accent-color); }
.sites-metrics > div:nth-child(2) > .ui-icon { color: var(--success); }
.sites-metrics > div:nth-child(3) > .ui-icon { color: var(--warning); }
.sites-metrics > div:nth-child(4) > .ui-icon { color: var(--muted); }
.sites-metrics small, .site-card small, .site-meta, .sites-muted { color: var(--muted); font-size: 12px; }
.sites-metrics strong { display: block; font-size: 27px; font-weight: 600; margin-top: 4px; font-variant-numeric: tabular-nums; }
.sites-toolbar, .sites-toolbar > div, .sites-selection, .sites-selection > div { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.sites-toolbar, .sites-selection { justify-content: space-between; }
.sites-toolbar > span, .sites-toolbar > div > span { font-size: 12px; color: var(--muted); }
.sites-filters { display: grid; grid-template-columns: minmax(0, 1fr) 180px auto; gap: 12px; }
.sites-search { display: flex; align-items: center; position: relative; min-width: 0; margin: 0; }
.sites-search > .ui-icon { position: absolute; left: 12px; color: var(--muted); pointer-events: none; width: 17px; }
.sites-search input { padding-left: 38px; width: 100%; min-width: 0; }
.sites-console input, .sites-console select, .sites-dialog input, .sites-dialog textarea, .sites-dialog select { max-width: 100%; }
.sites-console .checkbox, .sites-dialog .checkbox { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 13px; min-height: 32px; cursor: pointer; }
.sites-console input[type=checkbox], .sites-dialog input[type=checkbox] { width: 16px; height: 16px; flex: 0 0 16px; margin: 0; accent-color: var(--accent-color); }
.sites-selection { font-size: 12px; color: var(--muted); min-height: 36px; }
.sites-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 16px; align-items: stretch; }
.site-card { min-width: 0; width: 100%; max-width: 400px; box-sizing: border-box; padding: 16px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); display: flex; flex-direction: column; }
.site-card > header { display: grid; grid-template-columns: 16px 40px minmax(0, 1fr); gap: 8px 10px; align-items: center; }
.site-card img { border-radius: 6px; object-fit: contain; }
.site-card h3 { margin: 0 0 4px; font-size: 15px; overflow-wrap: anywhere; }
.site-card header small { display: block; overflow-wrap: anywhere; }
.site-card .badge { grid-column: 3; justify-self: start; font-size: 12px; max-width: 100%; white-space: normal; text-align: center; }
.site-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding: 20px 0; margin: 0; }
.site-stats dt { color: var(--muted); font-size: 12px; margin-bottom: 7px; }
.site-stats dd { margin: 0; font-size: 15px; font-weight: 600; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.site-meta { display: flex; gap: 10px; justify-content: space-between; flex-wrap: wrap; }
.site-card > footer { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; justify-content: space-between; border-top: 1px solid var(--line); padding-top: 12px; margin-top: auto; }
.site-card > footer > small { flex: 1 1 125px; min-width: 0; overflow-wrap: anywhere; }
.site-card .site-meta { margin-bottom: 16px; }
.site-card > footer > div { display: flex; flex: 0 0 auto; gap: 4px; align-items: center; margin-left: auto; }
.sites-console .icon-command { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 34px; width: 34px; height: 34px; border-radius: 6px; }
.site-menu { position: relative; }
.site-menu > summary { list-style: none; cursor: pointer; }
.site-menu > summary::-webkit-details-marker { display: none; }
.site-menu > div { position: absolute; right: 0; top: 38px; z-index: 10; min-width: 148px; background: var(--surface); border: 1px solid var(--line); border-radius: 6px; padding: 5px; box-shadow: 0 8px 28px #0002; }
.site-menu a, .site-menu button { display: flex; align-items: center; width: 100%; gap: 8px; padding: 10px; color: var(--text); background: none; border: 0; border-radius: 4px; font: inherit; font-size: 13px; text-align: left; white-space: nowrap; cursor: pointer; }
.site-menu a:hover, .site-menu button:hover { background: var(--accent-muted); }
.sites-console .sites-error, .sites-dialog .sites-error { color: var(--danger); overflow-wrap: anywhere; font-size: 12px; line-height: 1.7; }
.sites-feedback, .sites-runtime { margin: 0; font-size: 13px; overflow-wrap: anywhere; }
.sites-feedback:empty, .sites-runtime:empty, .sites-error:empty { display: none; }
.sites-runtime { color: var(--accent-color); }
.sites-empty { grid-column: 1 / -1; display: flex; min-height: 180px; align-items: center; justify-content: center; gap: 12px; color: var(--muted); font-size: 14px; }
.sites-empty strong { font-weight: 500; }
.sites-section { padding: 0; min-width: 0; }
.sites-section > h2, .sites-section > .sites-toolbar { margin-bottom: 20px; }
.sites-segment { display: flex; align-items: center; gap: 3px; padding: 3px; border: 1px solid var(--line); border-radius: 6px; width: fit-content; }
.sites-segment button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; border: 0; border-radius: 4px; padding: 8px 14px; background: transparent; color: var(--muted); cursor: pointer; font: inherit; font-size: 13px; }
.sites-segment button[aria-pressed=true] { background: var(--accent-muted); color: var(--accent-color); }
.sites-resource-filter { display: grid; grid-template-columns: 200px minmax(0, 1fr) auto auto; align-items: center; gap: 10px; }
.sites-resource-filter > *, .sites-filters > * { min-width: 0; }
.sites-resource-status { margin: 16px 0; font-size: 12px; color: var(--muted); overflow-wrap: anywhere; }
.site-resource { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 20px; align-items: center; border-bottom: 1px solid var(--line); padding: 18px 0; }
.site-resource strong { font-size: 14px; font-weight: 550; overflow-wrap: anywhere; }
.site-resource small { display: block; margin-top: 6px; font-size: 12px; color: var(--muted); overflow-wrap: anywhere; }
.site-resource p { margin: 8px 0 0; font-size: 12px; color: var(--muted); overflow-wrap: anywhere; line-height: 1.6; }
.site-resource > div:last-child { display: flex; align-items: center; gap: 14px; font-size: 12px; color: var(--muted); }
.sites-pager { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 18px; font-size: 12px; color: var(--muted); }
.sites-pager > div { display: flex; align-items: center; gap: 12px; font-variant-numeric: tabular-nums; }
.site-event { display: grid; grid-template-columns: minmax(150px, 1fr) minmax(0, 2fr) 90px; align-items: center; gap: 22px; padding: 18px 0; border-bottom: 1px solid var(--line); }
.site-event strong { font-size: 13px; overflow-wrap: anywhere; }
.site-event small { display: block; margin-top: 6px; color: var(--muted); font-size: 12px; }
.site-event p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; }
.site-event .badge { justify-self: end; }
.sites-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 24px; }
.sites-form-grid .field { margin: 0; min-width: 0; }
.sites-signin { max-width: 900px; }
.sites-signin-selection { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 8px 16px; padding: 20px 0; border-bottom: 1px solid var(--line); }
.sites-warning { color: var(--warning); font-size: 12px; line-height: 1.7; overflow-wrap: anywhere; padding-block: 10px; }
.sites-dialog { width: min(640px, calc(100vw - 28px)); max-height: calc(100dvh - 32px); padding: 0; border-radius: 8px; }
.sites-dialog[open] { display: flex; flex-direction: column; }
.sites-dialog .dialog-head { padding: 18px 22px; flex-shrink: 0; }
.sites-dialog .dialog-head h2 { font-size: 18px; margin: 0; }
.sites-dialog form { display: flex; flex-direction: column; overflow: hidden; min-height: 0; }
.sites-dialog-body { overflow-y: auto; min-height: 0; padding: 20px 22px; }
.sites-dialog .dialog-actions { flex-shrink: 0; padding: 14px 22px; border-top: 1px solid var(--line); margin: 0; }
.sites-dialog .field > span { display: block; margin-bottom: 8px; font-size: 13px; }
.sites-dialog .field { min-width: 0; }
.sites-dialog .sites-segment { margin: 22px 0 16px; }
.sites-address { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 10px; }
.sites-address .field { margin-bottom: 0; }
.sites-identity { display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: center; gap: 14px; margin-top: 18px; }
.sites-identity img { object-fit: contain; }
.sites-identity .field { margin-bottom: 0; }
.sites-identity small { font-size: 12px; color: var(--muted); }
.sites-primary-switches { display: flex; align-items: center; flex-wrap: wrap; gap: 18px; padding: 18px 0; }
.sites-advanced { border-top: 1px solid var(--line); }
.sites-advanced > summary { display: flex; align-items: center; gap: 8px; padding-block: 16px; cursor: pointer; font-size: 13px; }
.sites-advanced h3 { font-size: 14px; margin: 24px 0 14px; }
.sites-dialog textarea { width: 100%; min-height: 86px; resize: vertical; }
@media (max-width: 1000px) {
  .sites-filters { grid-template-columns: minmax(0, 1fr) 170px; }
  .sites-filters > .button { grid-column: 1 / -1; justify-self: end; }
}
@media (max-width: 640px) {
  .sites-console { gap: 14px; }
  .sites-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); padding-top: 8px; gap: 20px 12px; }
  .sites-metrics > div { gap: 9px; }
  .sites-metrics strong { font-size: 24px; }
  .sites-toolbar .button, .sites-filters .button { font-size: 12px; padding-inline: 10px; }
  .sites-filters { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px; }
  .sites-filters .sites-search { grid-column: 1 / -1; grid-row: 1; }
  .sites-filters > .button { grid-column: auto; }
  .sites-selection { gap: 8px; }
  .sites-selection > div { gap: 4px; }
  .site-card { padding: 14px; }
  .site-card > header { grid-template-columns: 16px 32px minmax(0, 1fr); gap: 8px; }
  .site-card header img { width: 32px; height: 32px; }
  .site-card header .badge { grid-column: 3; justify-self: start; }
  .site-stats { gap: 8px; padding-block: 18px; }
  .site-stats dd { font-size: 14px; }
  .sites-resource-filter { grid-template-columns: minmax(0, 1fr) auto auto; gap: 8px; }
  .sites-resource-filter .sites-search { grid-column: 1 / -1; grid-row: 1; }
  .sites-resource-filter .button { padding-inline: 10px; font-size: 12px; }
  .site-resource { gap: 10px; }
  .site-resource > div:last-child { flex-direction: column; gap: 5px; }
  .site-event { grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
  .site-event p { grid-row: 2; grid-column: 1 / -1; }
  .site-event .badge { grid-column: 2; grid-row: 1; }
  .sites-form-grid { grid-template-columns: 1fr; gap: 14px; }
  .sites-dialog .dialog-head, .sites-dialog-body, .sites-dialog .dialog-actions { padding: 14px; }
}
.strm-admin-head, .strm-admin-head > div, .strm-admin-task > header, .strm-admin-actions, .strm-admin-task > footer, .strm-run-progress > div:first-child {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
}
.strm-admin-head { margin: 22px 0 16px; }
.strm-admin-head h2 { margin: 0; font-size: 20px; }
.strm-probe-help, .strm-probe-progress small, .strm-probe-file small { color: var(--muted); font-size: 12px; }
.strm-probe-counts { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; margin: 20px 0; }
.strm-probe-counts > div { display: grid; gap: 10px; padding: 16px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.strm-probe-counts span { font-size: 12px; color: var(--muted); }
.strm-probe-counts strong { font-size: 24px; font-variant-numeric: tabular-nums; }
.strm-probe-progress { display: grid; gap: 8px; margin-bottom: 12px; font-size: 13px; }
.strm-probe-progress progress { width: 100%; height: 6px; accent-color: var(--accent-secondary); }
.strm-probe-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; padding: 20px 0; border-bottom: 1px solid var(--line); }
.strm-probe-file { min-width: 0; display: grid; gap: 7px; overflow-wrap: anywhere; }
.strm-probe-file strong { font-size: 14px; }
.strm-probe-file p { margin: 0; font-size: 12px; white-space: pre-wrap; }
.strm-probe-technical { color: var(--muted); }
.strm-probe-state { display: flex; align-items: flex-start; justify-content: flex-end; gap: 10px; }
.strm-probe-state .icon-command { width: 30px; height: 30px; }
[data-strm-probe-status] { overflow-wrap: anywhere; font-size: 13px; }
@media (max-width: 700px) {
  .strm-probe-counts { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .strm-probe-counts > div { padding: 12px; }
  .strm-probe-row { gap: 10px; }
  .strm-probe-state { flex-direction: column; align-items: flex-end; }
  [data-strm-view="media-info"] .strm-admin-head { align-items: flex-start; flex-direction: column; gap: 12px; }
  [data-strm-view="media-info"] .strm-admin-head > div { flex-wrap: wrap; }
  [data-strm-view="media-info"] .strm-admin-head .button { white-space: normal; }
}
.strm-admin-tasks { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 540px), 1fr)); gap: 18px; }
.strm-admin-task { min-width: 0; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); padding: 20px; }
.strm-admin-task h3, .strm-run-entry h3 { margin: 0 0 6px; font-size: 17px; overflow-wrap: anywhere; }
.strm-admin-task small, .strm-admin-task footer, .strm-run-entry small, .strm-file-row small, .strm-cleanup-row small, .strm-cleanup-row time { color: var(--muted); font-size: 12px; }
.strm-admin-actions { gap: 4px; justify-content: flex-end; }
.strm-admin-actions form { margin: 0; }
.strm-admin-actions .icon-command { width: 34px; height: 34px; flex: 0 0 34px; }
.strm-task-more { position: relative; }
.strm-task-more > summary { list-style: none; cursor: pointer; }
.strm-task-more > summary::-webkit-details-marker { display: none; }
.strm-task-more > div { position: absolute; right: 0; top: 40px; z-index: 4; display: flex; padding: 6px; background: var(--surface); border: 1px solid var(--line); border-radius: 6px; }
.strm-admin-paths { display: grid; grid-template-columns: minmax(0, 1fr) 20px minmax(0, 1fr); align-items: center; gap: 12px; margin: 20px 0; padding: 14px 0; border-block: 1px solid var(--line); }
.strm-admin-paths small { display: block; margin-bottom: 8px; }
.strm-admin-paths code, .strm-current-path, .strm-file-property code { display: block; overflow-wrap: anywhere; white-space: normal; font-size: 12px; }
.strm-admin-paths > span { color: var(--muted); }
.strm-admin-task footer { margin-top: 18px; border-top: 1px solid var(--line); padding-top: 14px; }
.strm-admin-task footer a { display: inline-flex; gap: 6px; align-items: center; }
.strm-run-progress > div:first-child { justify-content: flex-start; font-size: 12px; }
.strm-run-progress time { margin-left: auto; color: var(--muted); }
.strm-run-progress progress { width: 100%; height: 6px; margin: 14px 0 6px; accent-color: var(--accent-secondary); }
.strm-stages { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 20px; margin-top: 18px; }
.strm-stage { display: grid; gap: 6px; min-width: 0; border-left: 2px solid var(--line); padding-left: 10px; }
.strm-stage span { color: var(--muted); font-size: 12px; }
.strm-stage strong { font-size: 13px; font-weight: 500; overflow-wrap: anywhere; }
.strm-stage.ok { border-color: var(--success); }
.strm-stage.warning { border-color: var(--warning); }
.strm-stage.error { border-color: var(--danger); }
.strm-current-path { margin-top: 14px; color: var(--muted); }
.strm-inline-error { color: var(--warning); display: flex; gap: 8px; align-items: flex-start; overflow-wrap: anywhere; font-size: 12px; }
.strm-run-entry { padding: 24px 0; border-bottom: 1px solid var(--line); }
.strm-run-entry .strm-stages { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 16px; }
.strm-run-entry > a { font-size: 12px; }
.strm-file-search { display: grid; grid-template-columns: minmax(160px, 1fr) minmax(140px, 220px) minmax(140px, 180px) 38px; align-items: center; gap: 10px; margin-bottom: 18px; }
.strm-file-search > * { min-width: 0; max-width: 100%; }
.strm-file-row, .strm-cleanup-row { display: grid; grid-template-columns: minmax(0, 1fr) auto 38px; gap: 16px; align-items: center; padding: 16px 0; border-bottom: 1px solid var(--line); }
.strm-file-row.selectable { grid-template-columns: 20px minmax(0, 1fr) auto 38px; }
.strm-file-select input { width: 16px; height: 16px; accent-color: var(--accent-color); }
.strm-file-row > div, .strm-cleanup-row > div { display: grid; gap: 6px; min-width: 0; overflow-wrap: anywhere; }
.strm-file-row strong, .strm-cleanup-row strong { font-size: 14px; }
.strm-file-dialog { width: min(700px, calc(100vw - 24px)); max-height: calc(100dvh - 24px); overflow-y: auto; }
.strm-file-dialog [data-strm-file-detail], .strm-file-dialog [data-strm-file-message] { padding: 0 20px; }
.strm-file-dialog [data-strm-file-message] { margin-bottom: 20px; }
.strm-resource-dialog { width: min(480px, calc(100vw - 24px)); }
.strm-resource-dialog > form { padding: 0 20px 20px; }
.strm-file-property { padding: 10px 0; display: grid; gap: 5px; border-bottom: 1px solid var(--line); }
.strm-file-property small { color: var(--muted); }
.strm-check-result { margin-top: 14px; }
.strm-check { display: grid; grid-template-columns: 100px minmax(0, 1fr); gap: 10px; padding: 9px 0; font-size: 12px; border-bottom: 1px solid var(--line); overflow-wrap: anywhere; }
.strm-check strong { font-weight: 500; }
.strm-check.ok strong { color: var(--success); }
.strm-check.warning strong { color: var(--warning); }
.strm-check.error strong, .strm-action-status.error { color: var(--danger); }
.strm-check-summary { margin: 0 0 6px; font-size: 13px; }
.strm-check-summary.ok { color: var(--success); }
.strm-check-summary.error { color: var(--danger); }
.strm-check-summary.warning { color: var(--warning); }
.strm-check.info { color: var(--muted); }

/* Admin viewing reports share one layout for the built-in service and EMBY. */
.watch-page { display: grid; gap: 22px; margin-top: 28px; }
.watch-heading, .watch-toolbar, .watch-podium header, .watch-live-heading, .watch-pagination { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.watch-heading h1 { margin: 5px 0 8px; font-size: 28px; }
.watch-heading p, .watch-hint { color: var(--muted); font-size: 13px; margin: 0; line-height: 1.7; }
.watch-eyebrow { font-size: 12px; letter-spacing: .14em; color: #a89beb; font-weight: 700; }
.watch-actions { display: flex; gap: 10px; flex-shrink: 0; }
.watch-toolbar { flex-wrap: wrap; padding: 16px 0; border-bottom: 1px solid var(--line); }
.watch-toolbar nav { display: flex; gap: 8px; }
.watch-toolbar nav a { padding: 10px 16px; border-radius: 24px; color: var(--muted); font-weight: 600; text-decoration: none; white-space: nowrap; }
.watch-toolbar nav a[aria-current] { background: var(--surface-soft); color: var(--text); }
.watch-toolbar nav span { margin-left: 5px; font-size: 12px; }
.watch-filters { display: flex; align-items: flex-end; gap: 10px; flex-wrap: wrap; }
.watch-filters label { display: grid; gap: 5px; color: var(--muted); font-size: 12px; }
.watch-filters select, .watch-filters input { max-width: 200px; min-height: 36px; padding: 7px 9px; border-radius: 8px; border: 1px solid var(--line); background: var(--surface); color: var(--text); }
.watch-filters > a { padding: 10px 0; font-size: 12px; }
.watch-custom { width: 100%; font-size: 12px; color: var(--muted); }
.watch-custom label { display: inline-grid; margin: 10px 12px 0 0; }
.watch-custom small { display: block; margin-top: 8px; }
.watch-collection { display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: 12px; color: var(--muted); }
.watch-collector i { display: inline-block; width: 6px; height: 6px; margin-right: 7px; border-radius: 50%; background: var(--success); }
.watch-collector.error { color: var(--danger); }.watch-collector.error i { background: var(--danger); }
.watch-collector.waiting i { background: var(--muted); }.watch-poster img[hidden] { display: none; }
.watch-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.watch-metric { padding: 24px; border: 1px solid var(--line); background: var(--surface); border-radius: 18px; display: grid; gap: 14px; }
.watch-metric:first-child { background: linear-gradient(130deg, rgba(104, 126, 200, .12), var(--surface)); border-color: #596db2; }
.watch-metric small { color: var(--muted); font-size: 13px; }.watch-metric strong { font-size: clamp(23px, 2.5vw, 36px); letter-spacing: -.04em; }.watch-metric span { color: var(--muted); font-size: 12px; line-height: 1.6; }
.watch-panel { border: 1px solid var(--line); border-radius: 18px; padding: 24px; min-width: 0; background: var(--surface); }
.watch-panel h2 { font-size: 16px; margin: 0 0 20px; }.watch-panel h2 small { color: var(--muted); font-weight: 400; margin-left: 8px; }
.watch-podium { padding: 28px 32px 32px; background: radial-gradient(ellipse at 50% 80%, rgba(143, 87, 59, .13), transparent 70%), var(--surface); }
.watch-podium header { justify-content: flex-start; flex-wrap: wrap; gap: 12px; margin-bottom: 30px; }.watch-podium header h2 { margin: 0; }.watch-podium header > span { color: #101929; background: #83aefe; padding: 4px 9px; border-radius: 4px; letter-spacing: .06em; font-size: 12px; font-weight: 800; }.watch-podium header small { color: var(--muted); font-size: 12px; }
.watch-podium-grid { display: grid; grid-template-columns: 1fr 1.4fr 1fr; align-items: end; gap: 24px; }
.watch-podium-entry:first-child { grid-column: 2; grid-row: 1; }
.watch-podium-entry:nth-child(2) { grid-column: 1; grid-row: 1; }
.watch-podium-entry:nth-child(3) { grid-column: 3; grid-row: 1; }
.watch-podium-entry { position: relative; display: flex; align-items: end; gap: 18px; min-width: 0; padding: 16px 0 0 46px; isolation: isolate; }
.watch-podium-entry > div:last-child { padding-bottom: 4px; min-width: 0; }.watch-podium-entry h3 { font-size: 17px; margin: 8px 0; line-height: 1.5; overflow-wrap: anywhere; }.watch-podium-entry p { margin: 7px 0; font-size: 12px; line-height: 1.6; color: var(--muted); }.watch-podium-entry small { color: var(--muted); font-size: 12px; }.watch-podium-entry strong { font-size: 13px; }
.watch-poster { position: relative; flex: 0 0 108px; width: 108px; aspect-ratio: 2 / 3; overflow: hidden; border-radius: 9px; border: 1px solid rgba(255,255,255,.13); box-shadow: 0 12px 28px rgba(0,0,0,.18); background: linear-gradient(150deg, #253b59, #302843 55%, #151d2f); display: grid; place-items: center; }
.watch-poster > span { color: #d1d7ed; font-size: 28px; font-weight: 700; writing-mode: vertical-rl; letter-spacing: .18em; }.watch-poster img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.watch-rank { position: absolute; left: -6px; bottom: -18px; z-index: -1; color: transparent; -webkit-text-stroke: 2px rgba(170,175,187,.5); font: 700 154px/1 Arial,sans-serif; letter-spacing: -.1em; }
.watch-podium-entry:first-child { padding-left: 54px; }.watch-podium-entry:first-child .watch-poster { flex-basis: 150px; width: 150px; }.watch-podium-entry:first-child .watch-rank { font-size: 208px; }.watch-podium-entry:first-child h3 { font-size: 22px; }.watch-podium-entry:first-child .watch-poster { background: linear-gradient(140deg, #643827, #472c37 55%, #192030); }
.watch-podium-entry:nth-child(3) .watch-poster { background: linear-gradient(140deg, #1d5670, #22395b 55%, #20203b); }
.watch-chart { width: 100%; display: block; color: var(--muted); }.watch-rankings { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }.watch-table-wrap { overflow-x: auto; }.watch-panel table { width: 100%; border-collapse: collapse; font-size: 12px; }.watch-panel th { color: var(--muted); font-weight: 500; text-align: left; white-space: nowrap; }.watch-panel th, .watch-panel td { padding: 13px 10px; border-bottom: 1px solid var(--line); }.watch-panel td small { display: block; color: var(--muted); margin-top: 6px; font-size: 12px; }.watch-panel td:first-child { color: var(--muted); }.watch-panel td strong { font-weight: 600; }
.watch-client-list { display: flex; gap: 12px; flex-wrap: wrap; }.watch-client-list > span { background: var(--surface-soft); border-radius: 9px; padding: 10px 14px; font-size: 12px; }.watch-client-list strong { margin-left: 10px; }
.watch-empty { padding: 45px 18px; text-align: center; color: var(--muted); font-size: 13px; grid-column: 1 / -1; }.watch-pagination { justify-content: flex-end; font-size: 13px; color: var(--muted); }.watch-definitions { color: var(--muted); font-size: 12px; line-height: 1.9; }.watch-definitions summary { cursor: pointer; }.watch-live-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }.watch-live-card { padding: 22px; border-radius: 16px; border: 1px solid var(--line); background: var(--surface); }.watch-live-card h3 { margin: 20px 0 8px; font-size: 19px; }.watch-live-card p { color: var(--muted); font-size: 12px; }.watch-live-card small { display: block; color: var(--muted); line-height: 1.8; }.watch-live-card progress { width: 100%; accent-color: var(--primary); height: 6px; }
@media (max-width: 1250px) { .watch-podium-grid { gap: 14px; }.watch-podium-entry { padding-left: 26px; gap: 10px; }.watch-podium-entry:first-child { padding-left: 38px; }.watch-poster { flex-basis: 80px; width: 80px; }.watch-podium-entry:first-child .watch-poster { flex-basis: 115px; width: 115px; }.watch-podium-entry h3 { font-size: 15px; }.watch-podium-entry:first-child h3 { font-size: 18px; }.watch-rank { font-size: 120px; }.watch-podium-entry:first-child .watch-rank { font-size: 172px; } }
@media (max-width: 950px) { .watch-podium-entry:nth-child(n) { grid-column: auto; grid-row: auto; }.watch-podium-entry:first-child { grid-column: 1 / -1; justify-content: center; }.watch-podium-grid { grid-template-columns: 1fr 1fr; gap: 26px; }.watch-podium-entry:first-child { grid-column: 1 / -1; }.watch-podium-entry:first-child .watch-poster { flex-basis: 150px; width: 150px; }.watch-rankings { grid-template-columns: 1fr; }.watch-live-grid { grid-template-columns: 1fr 1fr; }.watch-metric { padding: 18px; }.watch-heading { align-items: flex-start; } }
@media (max-width: 600px) { .watch-podium-entry:first-child { justify-content: flex-start; }.watch-page { gap: 16px; }.watch-heading { flex-direction: column; }.watch-heading h1 { font-size: 24px; }.watch-metrics { grid-template-columns: 1fr 1fr; gap: 10px; }.watch-metric { padding: 16px; }.watch-metric strong { font-size: 25px; }.watch-toolbar nav { width: 100%; gap: 0; }.watch-toolbar nav a { flex: 1; padding: 10px; text-align: center; font-size: 13px; }.watch-filters { width: 100%; }.watch-filters label { flex: 1 1 100px; }.watch-filters select { width: 100%; max-width: none; }.watch-panel { padding: 18px 14px; }.watch-podium-grid { grid-template-columns: 1fr; gap: 24px; }.watch-podium-entry:first-child { grid-column: auto; }.watch-podium-entry { padding-left: 42px; gap: 18px; }.watch-podium-entry:first-child .watch-poster { flex-basis: 130px; width: 130px; }.watch-poster { flex-basis: 95px; width: 95px; }.watch-podium-entry h3 { font-size: 18px; }.watch-podium-entry:first-child h3 { font-size: 21px; }.watch-live-grid { grid-template-columns: 1fr; }.watch-panel th,.watch-panel td { padding: 12px 7px; }.watch-definitions { padding-bottom: 12px; } }
.strm-action-status { padding: 12px 0; overflow-wrap: anywhere; }
.strm-presets { border: 0; padding: 16px 0; margin: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.strm-presets legend { font-weight: 600; margin-bottom: 10px; }
.strm-presets label { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 6px; cursor: pointer; }
.strm-presets label:has(input:checked) { border-color: var(--accent-color); background: var(--accent-muted); }
.strm-presets input { width: 16px; height: 16px; margin: 0; accent-color: var(--accent-color); }
.strm-advanced > section { padding: 20px 0; border-top: 1px solid var(--line); }
.strm-editor-current > .strm-presets { padding: 20px; }
.strm-editor-current > .strm-presets legend { padding: 12px 20px 0; }
.strm-editor-current > .strm-advanced { padding: 20px; }
@media (max-width: 700px) {
  .strm-admin-task { padding: 16px; }
  .strm-admin-task > header { align-items: flex-start; }
  .strm-admin-actions { justify-content: flex-start; flex-wrap: wrap; }
  .strm-run-entry .strm-stages { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .strm-file-search { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 38px; }
  .strm-file-search > input[type="search"] { grid-column: 1 / -1; }
  .strm-file-row, .strm-cleanup-row { grid-template-columns: minmax(0, 1fr) 34px; gap: 10px; }
  .strm-file-row > .badge, .strm-cleanup-row > .badge { grid-column: 1; grid-row: 2; justify-self: start; }
  .strm-file-row > button, .strm-cleanup-row > button { grid-column: 2; grid-row: 1 / 3; }
  .strm-file-row.selectable { grid-template-columns: 20px minmax(0, 1fr) 34px; }
  .strm-file-row.selectable > .strm-file-select { grid-column: 1; grid-row: 1 / 3; }
  .strm-file-row.selectable > .badge { grid-column: 2; }
  .strm-file-row.selectable > button { grid-column: 3; }
  .strm-admin-paths { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .strm-admin-paths > span { display: none; }
  .strm-run-progress time { width: 100%; margin-left: 0; }
  .strm-file-dialog .dialog-actions { display: flex; flex-wrap: wrap; }
  .strm-presets { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .strm-presets label { padding: 8px; font-size: 12px; }
}

:root {
  color-scheme: dark;
  /* The admin canvas uses the whole area beside the sidebar.  Keep a small
     gutter for breathing room, but do not trap pages in a centered desktop
     column on wide screens. */
  --page-content-width: 100%;
  --page-gutter: clamp(20px, 1.8vw, 42px);
  --bg-primary: #0d0f17;
  --bg-card: #161925;
  --bg-subtle: #1d2130;
  --border-color: #292d3d;
  --text-primary: #f3f4f8;
  --text-secondary: #969fb3;
  --accent-color: #7c3aed;
  --accent-secondary: #06b6d4;
  --brand-primary: #8174f2;
  --brand-secondary: #52c7d8;
  --brand-word-secondary: #9a9fe8;
  --brand-surface: #10131e;
  --brand-outline: rgba(139, 92, 246, .34);
  --brand-core: #f8fbff;
  --accent-muted: #29213f;
  --accent-contrast: #ffffff;
  --accent-focus: color-mix(in srgb, var(--accent-color) 34%, transparent);
  --success: #35c995;
  --success-soft: #153a31;
  --danger: #ff6f7d;
  --warning: #efb45e;
  --icon-violet: #a78bfa;
  --icon-cyan: #50c7db;
  --icon-blue: #82b5ff;
  --icon-teal: #71dcc7;
  --icon-sky: #8dd8fc;
  --card-shadow: 0 1px 0 rgba(255, 255, 255, .025), 0 14px 40px rgba(0, 0, 0, .26);
  --card-hover-shadow: 0 1px 0 rgba(255, 255, 255, .04), 0 20px 54px rgba(0, 0, 0, .36);
  --button-gradient: linear-gradient(135deg, #8b5cf6, #6658e8);
  --login-bg: #0d0f17;
  --login-card-bg: rgba(22, 25, 37, .84);
  --login-input-bg: rgba(29, 33, 48, .9);
  --bg: var(--bg-primary);
  --surface: var(--bg-card);
  --surface-soft: var(--bg-subtle);
  --line: var(--border-color);
  --text: var(--text-primary);
  --muted: var(--text-secondary);
  --primary: var(--accent-color);
  --primary-soft: var(--accent-muted);
  --shadow: var(--card-shadow);
  /* Native semantic tokens adapted from shadcn/ui's composable theme model (MIT). */
  --ui-background: var(--bg-primary);
  --ui-foreground: var(--text-primary);
  --ui-card: var(--bg-card);
  --ui-card-foreground: var(--text-primary);
  --ui-popover: var(--bg-card);
  --ui-popover-foreground: var(--text-primary);
  --ui-primary: var(--accent-color);
  --ui-primary-foreground: var(--accent-contrast);
  --ui-secondary: var(--bg-subtle);
  --ui-secondary-foreground: var(--text-primary);
  --ui-muted: color-mix(in srgb, var(--bg-subtle) 78%, var(--bg-card));
  --ui-muted-foreground: var(--text-secondary);
  --ui-accent: var(--accent-muted);
  --ui-accent-foreground: var(--text-primary);
  --ui-destructive: var(--danger);
  --ui-destructive-foreground: #fff;
  --ui-border: var(--border-color);
  --ui-input: color-mix(in srgb, var(--border-color) 82%, transparent);
  --ui-ring-color: var(--accent-color);
  --ui-sidebar: color-mix(in srgb, var(--bg-card) 96%, var(--bg-primary));
  --ui-sidebar-foreground: var(--text-primary);
  --ui-sidebar-accent: var(--bg-subtle);
  --ui-sidebar-accent-foreground: var(--text-primary);
  --ui-sidebar-border: var(--border-color);
  --ui-radius: 8px;
  --ui-radius-sm: calc(var(--ui-radius) * .6);
  --ui-radius-md: calc(var(--ui-radius) * .8);
  --ui-radius-lg: var(--ui-radius);
  --ui-radius-xl: calc(var(--ui-radius) * 1.4);
  --ui-radius-2xl: calc(var(--ui-radius) * 1.8);
  --ui-control-xs: 28px;
  --ui-control-sm: 32px;
  --ui-control-md: 36px;
  --ui-control-lg: 40px;
  --ui-card-spacing: 22px;
  --ui-shadow-xs: 0 1px 2px color-mix(in srgb, black 10%, transparent);
  --ui-shadow-sm: 0 6px 18px color-mix(in srgb, black 16%, transparent);
  --ui-shadow-lg: 0 28px 80px color-mix(in srgb, black 52%, transparent);
  --ui-ring: 0 0 0 3px color-mix(in srgb, var(--ui-ring-color) 28%, transparent);
  --ui-overlay: color-mix(in srgb, #030406 74%, transparent);
  --feature-hero-background: linear-gradient(135deg, color-mix(in srgb, var(--surface) 96%, var(--primary) 4%), var(--surface));
}

:root[data-theme="amethyst"] {
  color-scheme: dark;
}

:root[data-theme="transparent"] {
  color-scheme: dark;
  --bg-primary: #0b0d13;
  --bg-card: rgba(18, 21, 30, .58);
  --bg-subtle: rgba(240, 244, 255, .055);
  --border-color: rgba(226, 232, 240, .09);
  --text-primary: #f2f4f8;
  --text-secondary: #9aa3b2;
  --accent-color: #9a6df5;
  --accent-secondary: #4cc7d4;
  --brand-primary: #a47af6;
  --brand-secondary: #59ced7;
  --brand-word-secondary: #aaa8d9;
  --brand-surface: rgba(13, 15, 23, .5);
  --brand-outline: rgba(164, 122, 246, .28);
  --brand-core: #f8fbff;
  --accent-muted: rgba(154, 109, 245, .15);
  --accent-contrast: #ffffff;
  --success: #44d0a3;
  --success-soft: rgba(35, 190, 143, .13);
  --danger: #f57987;
  --warning: #e7b967;
  --card-shadow: 0 1px 0 rgba(255, 255, 255, .02), 0 12px 34px rgba(0, 0, 0, .18);
  --card-hover-shadow: 0 1px 0 rgba(255, 255, 255, .035), 0 18px 46px rgba(0, 0, 0, .26);
  --button-gradient: linear-gradient(135deg, rgba(157, 112, 245, .96), rgba(92, 91, 222, .94));
  --login-bg: linear-gradient(135deg, #0a0c12, #151725 54%, #0b1117);
  --login-card-bg: rgba(18, 21, 30, .54);
  --login-input-bg: rgba(240, 244, 255, .055);
  --ui-sidebar: rgba(15, 18, 27, .48);
  --ui-sidebar-accent: rgba(240, 244, 255, .06);
  --ui-overlay: color-mix(in srgb, #05060a 66%, transparent);
}

:root[data-theme="glass"] {
  color-scheme: dark;
  --bg-primary: #08121c;
  --bg-card: rgba(13, 21, 35, .62);
  --bg-subtle: rgba(255, 255, 255, .075);
  --border-color: rgba(255, 255, 255, .14);
  --text-primary: #f4f7fb;
  --text-secondary: #a8b5c7;
  --accent-color: #9b7cf6;
  --accent-secondary: #55d0d8;
  --brand-primary: #a890ff;
  --brand-secondary: #66d7df;
  --brand-word-secondary: #b4b7e5;
  --brand-surface: rgba(8, 16, 28, .48);
  --brand-outline: rgba(168, 144, 255, .34);
  --brand-core: #ffffff;
  --accent-muted: rgba(155, 124, 246, .18);
  --accent-contrast: #ffffff;
  --success: #56d5ad;
  --success-soft: rgba(39, 194, 148, .16);
  --danger: #ff8291;
  --warning: #f1c16f;
  --card-shadow: inset 0 1px rgba(255, 255, 255, .08), 0 16px 48px rgba(1, 6, 15, .24);
  --card-hover-shadow: inset 0 1px rgba(255, 255, 255, .12), 0 24px 64px rgba(1, 6, 15, .34);
  --button-gradient: linear-gradient(135deg, rgba(168, 126, 250, .98), rgba(91, 101, 226, .96));
  --login-bg: linear-gradient(135deg, #07121c 0%, #123043 48%, #21172f 100%);
  --login-card-bg: rgba(13, 21, 35, .54);
  --login-input-bg: rgba(255, 255, 255, .075);
  --ui-sidebar: rgba(7, 15, 27, .5);
  --ui-sidebar-accent: rgba(255, 255, 255, .075);
  --ui-overlay: color-mix(in srgb, #030710 58%, transparent);
}

:root[data-theme="porcelain"] {
  color-scheme: light;
  --bg-primary: #f2f6fc;
  --bg-card: #ffffff;
  --bg-subtle: #edf3fb;
  --border-color: #dbe4f0;
  --text-primary: #1b2533;
  --text-secondary: #647083;
  --accent-color: #315fdd;
  --accent-secondary: #0f8f83;
  --brand-primary: #416de3;
  --brand-secondary: #159b8d;
  --brand-word-secondary: #526899;
  --brand-surface: #f8fbff;
  --brand-outline: rgba(49, 95, 221, .2);
  --brand-core: #17191d;
  --accent-muted: #e7edff;
  --accent-contrast: #ffffff;
  --success: #148663;
  --success-soft: #e2f3ed;
  --danger: #c94f60;
  --warning: #9b6b20;
  --icon-violet: #7045bd;
  --icon-cyan: #087e89;
  --icon-blue: #315fbd;
  --icon-teal: #087d6d;
  --icon-sky: #226f9b;
  --card-shadow: 0 1px 2px rgba(34, 63, 105, .025), 0 10px 30px rgba(34, 63, 105, .055);
  --card-hover-shadow: 0 2px 4px rgba(34, 63, 105, .04), 0 18px 42px rgba(34, 63, 105, .085);
  --button-gradient: linear-gradient(135deg, #416fe8, #315fdd);
  --login-bg: #f2f6fc;
  --login-card-bg: rgba(255, 255, 255, .9);
  --login-input-bg: rgba(242, 246, 252, .92);
  --ui-sidebar: #eaf2fc;
  --ui-sidebar-accent: #f7faff;
  --ui-sidebar-border: #d6e2f0;
  --ui-overlay: color-mix(in srgb, #1a2130 48%, transparent);
}


* {
  box-sizing: border-box;
  scrollbar-color: color-mix(in srgb, var(--text-secondary) 10%, transparent) transparent;
  scrollbar-width: thin;
}
.ui-icon { width: 1em; height: 1em; display: inline-block; flex: 0 0 auto; overflow: visible; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; vertical-align: -0.14em; }
.nav-icon .ui-icon, .bottom-nav-icon .ui-icon, .portal-nav-icon .ui-icon { width: 19px; height: 19px; }
.settings-nav-mark .ui-icon { width: 20px; height: 20px; }
.settings-section-icon .ui-icon { width: 22px; height: 22px; }
.icon-command .ui-icon, .designed-empty > span .ui-icon, .empty-icon .ui-icon { width: 1em; height: 1em; }
.button > .ui-icon, .file-tool-button > .ui-icon { width: 15px; height: 15px; }
.plugin-card-icon .ui-icon, .plugin-preview-icon .ui-icon { width: 22px; height: 22px; }
.plugin-card-icon > img { width: 100%; height: 100%; border-radius: inherit; object-fit: cover; }
.composer-head > span .ui-icon, .emby-mark .ui-icon, .profile-runtime-icon .ui-icon, .license-device-icon .ui-icon { width: 21px; height: 21px; }
.system-menu-icon .ui-icon, .search-results > :is(a, button) > span .ui-icon, .archive-choice-icon .ui-icon, .archive-panel-icon .ui-icon, .archive-config-icon .ui-icon { width: 19px; height: 19px; }
.notification-channel-mark .ui-icon, .recommendation-video-empty > span .ui-icon, .emby-artwork-automation-mark .ui-icon { width: 20px; height: 20px; }
*::-webkit-scrollbar { width: 8px; height: 8px; background: transparent; }
*::-webkit-scrollbar-track,
*::-webkit-scrollbar-track-piece {
  border: 0;
  background: transparent;
  box-shadow: none;
}
*::-webkit-scrollbar-thumb {
  min-width: 24px;
  min-height: 24px;
  border: 2px solid transparent;
  border-radius: 999px;
  background: color-mix(in srgb, var(--text-secondary) 20%, transparent);
  background-clip: padding-box;
  box-shadow: none;
}
*::-webkit-scrollbar-thumb:hover {
  background: color-mix(in srgb, var(--text-secondary) 36%, transparent);
  background-clip: padding-box;
}
*::-webkit-scrollbar-button { width: 0; height: 0; display: none; }
*::-webkit-scrollbar-corner { background: transparent; }
html {
  min-height: 100%;
  overflow-y: scroll;
  scrollbar-gutter: stable;
}
html, body { margin: 0; min-height: 100%; }
body {
  background: var(--ui-background);
  color: var(--ui-foreground);
  font-family: Inter, "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  transition: background-color .24s ease, color .24s ease;
}
small { font-size: 12px; }
@media (display-mode: standalone), (display-mode: fullscreen) {
  html { min-height: 100dvh; overflow-x: hidden; overscroll-behavior-y: none; }
  body { min-height: 100dvh; padding-top: env(safe-area-inset-top); padding-right: env(safe-area-inset-right); padding-bottom: env(safe-area-inset-bottom); padding-left: env(safe-area-inset-left); overscroll-behavior-y: none; }
  .app-shell, .member-portal, .login-page, .auth-page, .license-lock-page { min-height: calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom)); }
  .sidebar { height: calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom)); }
  .member-portal-head { padding-left: max(20px, env(safe-area-inset-left)); padding-right: max(20px, env(safe-area-inset-right)); }
  .member-portal-content { padding-bottom: max(50px, env(safe-area-inset-bottom)); }
}
html.pwa-mode { min-height: 100dvh; overflow-x: hidden; overscroll-behavior-y: none; }
html.pwa-mode body { min-height: 100dvh; padding-top: env(safe-area-inset-top); padding-right: env(safe-area-inset-right); padding-bottom: env(safe-area-inset-bottom); padding-left: env(safe-area-inset-left); overscroll-behavior-y: none; }
html.pwa-mode :is(.app-shell, .member-portal, .login-page, .auth-page, .license-lock-page) { min-height: calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom)); }
html.pwa-mode .sidebar { height: calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom)); }
html.pwa-mode .member-portal-head { padding-left: max(20px, env(safe-area-inset-left)); padding-right: max(20px, env(safe-area-inset-right)); }
html.pwa-mode .member-portal-content { padding-bottom: max(50px, env(safe-area-inset-bottom)); }
:root[data-theme="transparent"] body {
  background: linear-gradient(135deg, #0a0c12 0%, #151725 54%, #0b1117 100%);
  background-attachment: fixed;
}
:root[data-theme="glass"] body {
  background: linear-gradient(135deg, #07121c 0%, #123043 48%, #21172f 100%);
  background-attachment: fixed;
}
:root[data-theme="transparent"] :is(.sidebar, .card, .tool-dialog, .system-menu, .theme-menu, .profile-command-center, .profile-summary-grid > article, .profile-attention-panel, .profile-playback-panel, .profile-device-panel, .profile-library-overview, .profile-runtime-panel, .profile-shortcuts, .profile-activity-panel, .profile-account-panel) {
  background-image: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
:root[data-theme="glass"] :is(.sidebar, .card, .tool-dialog, .system-menu, .theme-menu, .member-portal-head, .profile-command-center, .profile-summary-grid > article, .profile-attention-panel, .profile-playback-panel, .profile-device-panel, .profile-library-overview, .profile-runtime-panel, .profile-shortcuts, .profile-activity-panel, .profile-account-panel) {
  background-image: linear-gradient(145deg, rgba(255, 255, 255, .055), transparent 38%);
  backdrop-filter: blur(20px) saturate(145%);
  -webkit-backdrop-filter: blur(20px) saturate(145%);
}
:root[data-theme="glass"] .sidebar { box-shadow: inset -1px 0 rgba(255, 255, 255, .055); }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
::selection { color: var(--ui-primary-foreground); background: color-mix(in srgb, var(--ui-primary) 72%, transparent); }
:where(a, button, summary, [role="button"], [tabindex]:not([tabindex="-1"])):focus-visible {
  outline: 2px solid color-mix(in srgb, var(--ui-ring-color) 76%, white);
  outline-offset: 2px;
}

.app-shell { min-height: 100vh; display: grid; grid-template-columns: 238px minmax(0, 1fr); }
.sidebar {
  position: sticky; top: 0; width: 238px; height: 100vh; padding: 24px 16px 16px;
  color: var(--ui-sidebar-foreground); background: var(--ui-sidebar); border-right: 1px solid var(--ui-sidebar-border);
  display: flex; flex-direction: column; z-index: 20;
}
.sidebar-collapse,
.sidebar-reveal {
  width: 34px; height: 34px; padding: 0; place-items: center;
  border: 0; border-radius: 50%; color: var(--muted); background: transparent; box-shadow: none;
  cursor: pointer; transition: left .24s cubic-bezier(.22, 1, .36, 1), color .16s ease, background-color .16s ease;
}
.sidebar-panel-button { position: relative; flex: 0 0 auto; }
.sidebar-panel-button svg {
  width: 19px; height: 19px; display: block; fill: none; stroke: currentColor;
  stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
}
.sidebar-panel-button::after {
  content: attr(data-tooltip); position: absolute; top: 50%; left: calc(100% + 10px); z-index: 80;
  padding: 9px 13px; border-radius: 10px; color: #18181b; background: #f4f4f5;
  box-shadow: 0 8px 24px rgba(0,0,0,.22); font-size: 14px; font-weight: 600; line-height: 1; white-space: nowrap;
  opacity: 0; pointer-events: none; transform: translate(4px, -50%); transition: opacity .14s ease, transform .14s ease;
}
.sidebar-panel-button:hover::after,
.sidebar-panel-button:focus-visible::after { opacity: 1; transform: translate(0, -50%); }
.sidebar-collapse { display: grid; }
.sidebar-reveal { display: none; }
.sidebar-collapse:hover,
.sidebar-reveal:hover { color: var(--text); background: var(--surface-soft); }
.sidebar-collapse:focus-visible,
.sidebar-reveal:focus-visible { outline: 2px solid var(--accent-focus); outline-offset: 2px; }
@media (min-width: 981px) {
  .app-shell { transition: grid-template-columns .24s cubic-bezier(.22, 1, .36, 1); }
  .sidebar { transition: width .24s cubic-bezier(.22, 1, .36, 1), padding .24s cubic-bezier(.22, 1, .36, 1); }
  :root[data-sidebar-collapsed="true"] .app-shell { grid-template-columns: 72px minmax(0, 1fr); }
  :root[data-sidebar-collapsed="true"] .sidebar { width: 72px; padding: 24px 10px 14px; }
  :root[data-sidebar-collapsed="true"] .sidebar-header { min-height: 48px; padding: 0 0 24px; }
  :root[data-sidebar-collapsed="true"] .sidebar-header .brand { display: none; }
  :root[data-sidebar-collapsed="true"] .sidebar-collapse { left: 9px; border-radius: 10px; background: var(--surface-soft); }
  :root[data-sidebar-collapsed="true"] .sidebar-collapse svg { transform: rotate(180deg); }
  :root[data-sidebar-collapsed="true"] .nav-label { display: none; }
  :root[data-sidebar-collapsed="true"] .nav { margin-top: 12px; gap: 5px; }
  :root[data-sidebar-collapsed="true"] .nav-item { width: 50px; min-height: 44px; margin-inline: auto; padding: 0; justify-content: center; gap: 0; border-radius: 11px; }
  :root[data-sidebar-collapsed="true"] .nav-item > span:last-child { display: none; }
  :root[data-sidebar-collapsed="true"] .nav-item .nav-icon { width: 24px; display: grid; place-items: center; font-size: 19px; }
  :root[data-sidebar-collapsed="true"] .nav-item .nav-icon svg { width: 20px; height: 20px; }
  :root[data-sidebar-collapsed="true"] .nav-item.active { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary) 30%, transparent); }
  :root[data-sidebar-collapsed="true"] .nav-item.active::before { content: ""; position: absolute; left: -10px; width: 3px; height: 22px; border-radius: 0 4px 4px 0; background: var(--primary); }
  :root[data-sidebar-collapsed="true"] .nav-item::after {
    content: attr(data-tooltip); position: absolute; top: 50%; left: calc(100% + 12px); z-index: 80;
    padding: 9px 12px; border: 1px solid color-mix(in srgb, var(--line) 82%, transparent); border-radius: 9px;
    color: var(--text); background: color-mix(in srgb, var(--surface) 96%, var(--bg)); box-shadow: 0 10px 28px rgba(0,0,0,.24);
    font-size: 13px; font-weight: 700; line-height: 1; white-space: nowrap; opacity: 0; pointer-events: none;
    transform: translate(4px, -50%); transition: opacity .14s ease, transform .14s ease;
  }
  :root[data-sidebar-collapsed="true"] .nav-item:hover::after,
  :root[data-sidebar-collapsed="true"] .nav-item:focus-visible::after { opacity: 1; transform: translate(0, -50%); }
  :root[data-sidebar-collapsed="true"] .sidebar > .telegram-community-link { width: 50px; min-height: 46px; margin-inline: auto; padding: 4px; justify-content: center; }
  :root[data-sidebar-collapsed="true"] .sidebar > .telegram-community-link > span,
  :root[data-sidebar-collapsed="true"] .sidebar > .telegram-community-link .telegram-community-external { display: none; }
  :root[data-sidebar-collapsed="true"] .sidebar > .telegram-community-link > .ui-icon:first-child { width: 36px; height: 36px; padding: 8px; flex-basis: 36px; }
  :root[data-sidebar-collapsed="true"] .sidebar > .telegram-community-link::after { content: attr(data-tooltip); position: absolute; top: 50%; left: calc(100% + 12px); z-index: 80; padding: 9px 12px; border: 1px solid color-mix(in srgb, var(--line) 82%, transparent); border-radius: 9px; color: var(--text); background: color-mix(in srgb, var(--surface) 96%, var(--bg)); box-shadow: 0 10px 28px rgba(0,0,0,.24); font-size: 13px; font-weight: 700; line-height: 1; white-space: nowrap; opacity: 0; pointer-events: none; transform: translate(4px, -50%); transition: opacity .14s ease, transform .14s ease; }
  :root[data-sidebar-collapsed="true"] .sidebar > .telegram-community-link:hover::after,
  :root[data-sidebar-collapsed="true"] .sidebar > .telegram-community-link:focus-visible::after { opacity: 1; transform: translate(0, -50%); }
  :root[data-sidebar-collapsed="true"] .sidebar-reveal { display: none; }
}
.sidebar-header { position: relative; min-height: 48px; display: flex; align-items: center; gap: 4px; padding: 0 0 24px 4px; }
.sidebar-header .sidebar-collapse { position: absolute; top: 7px; left: calc(100% - 34px); }
.brand { display: flex; gap: 12px; align-items: center; padding: 0 8px 24px; }
.sidebar-header .brand { min-width: 0; flex: 1; gap: 11px; padding: 0 38px 0 0; }
.brand > span { min-width: 0; }
.brand-logo { width: 48px; height: 48px; flex: 0 0 auto; display: block; }
.brand-mark {
  overflow: hidden;
  object-fit: cover;
  border-radius: 14px;
  background: #190b35;
  box-shadow: 0 0 0 1px rgba(128, 221, 230, .18), 0 9px 20px rgba(77, 42, 151, .25);
}
.brand-lockup { min-width: 0; display: inline-flex; align-items: baseline; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.brand-word-base { color: var(--text); }
.brand-word-accent {
  color: #8f91dc;
}
.brand-name { font-size: 18px; font-weight: 820; letter-spacing: -.025em; }
.version { color: var(--muted); font-size: 14px; margin-top: 3px; }
.nav-label { padding: 10px 12px 7px; color: var(--muted); font-size: 13px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.nav { display: grid; gap: 5px; }
.sidebar > .nav { min-height: 0; flex: 1 1 auto; align-content: start; overflow-y: auto; scrollbar-width: none; }
.sidebar > .nav::-webkit-scrollbar { display: none; }
.nav-item {
  display: flex; align-items: center; gap: 10px; min-height: var(--ui-control-lg); padding: 0 10px;
  position: relative; border-radius: var(--ui-radius-md); color: var(--muted); font-weight: 600;
  transition: color .16s ease, background-color .16s ease, box-shadow .16s ease;
}
.nav-item:hover { background: var(--ui-sidebar-accent); color: var(--ui-sidebar-accent-foreground); }
.nav-item.active {
  color: var(--ui-sidebar-accent-foreground);
  background: color-mix(in srgb, var(--primary) 13%, var(--ui-sidebar));
  box-shadow: inset 3px 0 0 var(--primary), inset 0 0 0 1px color-mix(in srgb, var(--primary) 10%, transparent);
}
.nav-item.active .nav-icon { color: var(--primary); }
.nav-icon { font-size: 17px; width: 22px; text-align: center; }
.sidebar-bottom { margin-top: auto; display: grid; gap: 8px; padding-top: 16px; }
.sidebar-action {
  width: 100%; min-height: 42px; border: 1px solid var(--line); border-radius: 11px; background: transparent;
  color: var(--text); display: flex; align-items: center; justify-content: center; gap: 9px; cursor: pointer; transition: all .2s ease;
}
.sidebar-action:hover { background: var(--surface-soft); }
.theme-switcher { position: relative; }
.theme-switcher-trigger { padding: 0 10px; justify-content: flex-start; }
.theme-current-swatch, .theme-swatch { flex: 0 0 auto; border: 1px solid color-mix(in srgb, white 22%, var(--line)); box-shadow: inset 0 0 0 1px rgba(0,0,0,.12); }
.theme-current-swatch, .theme-swatch { background: linear-gradient(135deg, var(--preview-side) 0 48%, var(--preview-accent) 49% 100%); }
.theme-current-swatch { width: 24px; height: 24px; border-radius: 7px; }
.theme-switcher-label { min-width: 0; display: grid; gap: 1px; text-align: left; }
.theme-switcher-label strong { overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.theme-switcher-label small { color: var(--muted); font-size: 12px; }
.theme-chevron { margin-left: auto; color: var(--muted); font-size: 14px; transition: transform .2s ease; }
.theme-switcher-trigger[aria-expanded="true"] .theme-chevron { transform: rotate(180deg); }
.theme-menu { position: absolute; right: 0; bottom: calc(100% + 8px); left: 0; z-index: 60; padding: 8px; border: 1px solid var(--border-color); border-radius: 12px; background: color-mix(in srgb, var(--bg-card) 92%, transparent); box-shadow: 0 18px 46px rgba(0,0,0,.3); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
.theme-menu[hidden] { display: none; }
.theme-menu-title { display: block; padding: 4px 7px 8px; color: var(--muted); font-size: 13px; font-weight: 700; }
.theme-menu button { width: 100%; min-height: 48px; padding: 6px 7px; display: grid; grid-template-columns: 28px minmax(0, 1fr) 18px; align-items: center; gap: 9px; border: 0; border-radius: 8px; color: var(--text); background: transparent; cursor: pointer; text-align: left; transition: all .2s ease; }
.theme-menu button:hover { background: var(--surface-soft); }
.theme-menu button.active { color: var(--primary); background: var(--primary-soft); }
.theme-swatch { width: 28px; height: 28px; border-radius: 8px; }
.theme-menu-copy { min-width: 0; display: grid; gap: 2px; }
.theme-menu-copy strong { font-size: 14px; }
.theme-menu-copy small { color: var(--muted); font-size: 12px; }
.theme-check { color: var(--primary); opacity: 0; font-size: 14px; font-weight: 900; }
.theme-menu button.active .theme-check { opacity: 1; }
[data-theme-preview="amethyst"] { --preview-bg: #0d0f17; --preview-side: #161925; --preview-card: #1d2130; --preview-line: #2b3041; --preview-accent: #8b5cf6; }
[data-theme-preview="porcelain"] { --preview-bg: #f2f6fc; --preview-side: #eaf2fc; --preview-card: #ffffff; --preview-line: #dbe4f0; --preview-accent: #315fdd; }
[data-theme-preview="transparent"] { --preview-bg: linear-gradient(135deg, #0a0c12, #1a1b2b 58%, #0b1117); --preview-side: rgba(22, 24, 34, .58); --preview-card: rgba(240, 244, 255, .075); --preview-line: rgba(226, 232, 240, .16); --preview-accent: #9a6df5; }
[data-theme-preview="glass"] { --preview-bg: linear-gradient(135deg, #07121c, #174057 52%, #2b1939); --preview-side: rgba(12, 21, 35, .58); --preview-card: rgba(255, 255, 255, .12); --preview-line: rgba(255, 255, 255, .22); --preview-accent: #a98aff; }
.logout-form { margin: 0; }
.mobile-bottom-nav { display: none; }
.mobile-nav-popover { display: none; }
.telegram-community-link {
  position: fixed;
  left: max(20px, env(safe-area-inset-left));
  bottom: max(20px, env(safe-area-inset-bottom));
  z-index: 45;
  min-height: 52px;
  padding: 7px 9px 7px 7px;
  display: flex;
  align-items: center;
  gap: 9px;
  border: 1px solid color-mix(in srgb, var(--primary) 18%, var(--line));
  border-radius: 8px;
  color: var(--text);
  background: color-mix(in srgb, var(--panel) 88%, transparent);
  box-shadow: 0 12px 30px color-mix(in srgb, #09111f 22%, transparent), inset 0 1px 0 color-mix(in srgb, white 48%, transparent);
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  text-decoration: none;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.telegram-community-link:hover { border-color: color-mix(in srgb, #229ed9 55%, var(--line)); box-shadow: 0 16px 36px color-mix(in srgb, #09111f 28%, transparent), 0 0 0 3px color-mix(in srgb, #229ed9 10%, transparent); transform: translateY(-2px); }
.telegram-community-link:active { transform: translateY(0) scale(.98); }
.telegram-community-link:focus-visible { outline: 3px solid color-mix(in srgb, #229ed9 34%, transparent); outline-offset: 3px; }
.telegram-community-link > .ui-icon:first-child { width: 38px; height: 38px; padding: 9px; flex: 0 0 38px; border-radius: 6px; color: white; background: #229ed9; box-shadow: 0 7px 18px rgba(34, 158, 217, .3); }
.telegram-community-link > span { min-width: 0; display: grid; gap: 1px; }
.telegram-community-link strong { font-size: 13px; line-height: 1.25; }
.telegram-community-link small { color: var(--muted); font-size: 12px; line-height: 1.25; white-space: nowrap; }
.telegram-community-link .telegram-community-external { width: 14px; height: 14px; color: var(--muted); }
.telegram-community-link.is-admin-mobile { display: none; }
.sidebar > .telegram-community-link { position: relative; left: auto; bottom: auto; width: 100%; margin-top: 14px; flex: 0 0 auto; justify-content: center; background: color-mix(in srgb, var(--ui-sidebar-accent) 70%, transparent); box-shadow: inset 0 1px 0 color-mix(in srgb, white 28%, transparent); }
.one15-settings-card { margin-bottom: 18px; }
.one15-authorize-grid { display: grid; grid-template-columns: minmax(310px, .7fr) minmax(0, 1.3fr); gap: 24px; align-items: stretch; margin-top: 22px; }
.one15-qr-panel { display: grid; justify-items: center; align-content: center; gap: 12px; min-height: 330px; padding: 22px; border: 1px dashed color-mix(in srgb, var(--primary) 32%, var(--line)); border-radius: 14px; background: color-mix(in srgb, var(--primary-soft) 34%, var(--surface)); text-align: center; }
.one15-client-select { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; gap: 7px; width: min(100%, 320px); color: var(--muted); font-size: 14px; font-weight: 700; text-align: left; }
.one15-client-select select { min-width: 0; height: 42px; padding: 0 32px 0 11px; border: 1px solid var(--line); border-radius: 10px; color: var(--text); background: var(--surface); font: inherit; }
.one15-qr { width: 184px; height: 184px; display: grid; place-items: center; overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: white; color: var(--primary); font-weight: 850; }
.one15-qr img { width: 100%; height: 100%; object-fit: contain; }
.one15-qr-panel strong { font-size: 14px; }
.one15-qr-panel small, .one15-cookie-panel .help { color: var(--muted); }
.one15-cookie-panel { display: grid; align-content: center; gap: 16px; min-width: 0; }
.one15-cookie-panel textarea { min-height: 118px; resize: vertical; }
.one15-cookie-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; flex-wrap: wrap; }
.one15-cookie-actions form { margin: 0; }
.one15-optional-panel { margin-top: 18px; padding: 14px 16px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 16px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft); }
.one15-optional-panel > .plugin-form-result { grid-column: 1 / -1; display: block; width: 100%; box-sizing: border-box; margin: 0; }
.one15-optional-panel > div { min-width: 0; display: grid; gap: 4px; }
.one15-optional-panel strong { font-size: 14px; }
.one15-optional-panel small { color: var(--muted); font-size: 13px; line-height: 1.55; }
.one15-optional-panel form { flex: 0 0 auto; margin: 0; }
.settings-action-bar { min-height: 68px; padding: 12px 14px; display: flex; align-items: center; justify-content: space-between; gap: 10px; border: 1px solid var(--line); border-radius: 10px; background: color-mix(in srgb, var(--surface-soft) 74%, var(--surface)); }
.one15-form-actions { justify-content: flex-end; border-inline: 0; border-bottom: 0; border-radius: 0; }
.one15-form-actions .button { min-width: 146px; }
.one15-automation-card { margin-bottom: 18px; padding: 0; overflow: hidden; border-color: color-mix(in srgb, #7c5ce6 24%, var(--line)); background: linear-gradient(180deg, color-mix(in srgb, var(--surface) 96%, #7c5ce6), var(--surface)); }
.one15-automation-head { margin: 0; padding: 24px 28px 21px; border-bottom: 1px solid var(--line); }
.one15-automation-head > .badge { margin-left: auto; white-space: nowrap; }
.settings-section-icon.automation { color: white; background: linear-gradient(145deg, #7c5ce6, #4f46b8); box-shadow: 0 9px 20px color-mix(in srgb, #7c5ce6 25%, transparent); }
.one15-automation-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-bottom: 1px solid var(--line); }
.one15-automation-port { min-width: 0; padding: 24px 28px 22px; display: grid; align-content: start; gap: 17px; }
.one15-automation-port + .one15-automation-port { border-left: 1px solid var(--line); }
.one15-automation-port.offline { background: color-mix(in srgb, #168bb3 4%, transparent); }
.one15-automation-port.transfer { background: color-mix(in srgb, #2e9b70 4%, transparent); }
.one15-port-head { display: flex; align-items: center; gap: 11px; }
.one15-port-head > span { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 9px; color: var(--primary); background: var(--primary-soft); font-size: 13px; font-weight: 900; }
.one15-port-head > div { min-width: 0; flex: 1; }
.one15-port-head h3 { margin: 0; font-size: 15px; }
.one15-port-head p { margin: 4px 0 0; color: var(--muted); font-size: 13px; }
.one15-port-head > strong { padding: 5px 8px; border-radius: 999px; color: var(--primary); background: var(--primary-soft); font-size: 12px; letter-spacing: .08em; }
.one15-automation-port.transfer .one15-port-head > span, .one15-automation-port.transfer .one15-port-head > strong { color: #2e9b70; background: color-mix(in srgb, #2e9b70 12%, var(--surface)); }
.one15-automation-port .field { display: grid; gap: 8px; }
.one15-automation-port .field input { min-height: 46px; font-family: Consolas, "SFMono-Regular", monospace; letter-spacing: .02em; }
.one15-automation-port code { padding: 2px 4px; border-radius: 4px; color: var(--primary); background: var(--primary-soft); font-family: Consolas, monospace; }
.one15-port-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.one15-port-actions > span { min-width: 0; color: var(--muted); font-size: 13px; }
.one15-automation-control { padding: 22px 28px 24px; display: grid; gap: 17px; }
.one15-control-copy { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.one15-control-copy > div { min-width: 0; }
.one15-control-copy h3 { margin: 0; font-size: 14px; }
.one15-control-copy p { max-width: 720px; margin: 5px 0 0; color: var(--muted); font-size: 13px; line-height: 1.6; }
.one15-automation-status { min-height: 36px; padding: 9px 12px; display: flex; align-items: center; justify-content: space-between; gap: 14px; border: 1px solid var(--line); border-radius: 9px; color: var(--muted); background: var(--surface-soft); font-size: 13px; }
.one15-automation-status > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.one15-automation-status > span:first-child { color: var(--text); }
.one15-automation-status i { width: 7px; height: 7px; display: inline-block; margin-right: 6px; border-radius: 50%; background: var(--muted); box-shadow: 0 0 0 3px color-mix(in srgb, var(--muted) 12%, transparent); }
.one15-automation-status i.ready { background: var(--success); box-shadow: 0 0 0 3px var(--success-soft); }
.one15-control-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 9px; }
.one15-control-actions .button { min-height: 38px; }
.reverse-overview { margin-bottom: 22px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.reverse-overview > div { min-height: 104px; padding: 18px 22px; display: grid; align-content: center; gap: 5px; border: 1px solid var(--border-color); border-radius: 12px; background: var(--bg-card); box-shadow: var(--card-shadow); }
.reverse-overview span, .reverse-overview small { color: var(--muted); font-size: 14px; }
.reverse-overview strong { font-size: 24px; line-height: 1.1; }
.emby-navigation { margin-bottom: 24px; }
.emby-feature-hero { min-height: 134px; margin: 18px 0; padding: 24px 26px; display: flex; align-items: center; justify-content: space-between; gap: 28px; overflow: hidden; border: 1px solid color-mix(in srgb, var(--primary) 18%, var(--line)); border-radius: 12px; background: var(--feature-hero-background); }
.emby-feature-hero-copy { min-width: 0; max-width: 820px; }
.emby-feature-hero-copy > span { color: var(--primary); font-size: 13px; font-weight: 850; letter-spacing: .08em; }
.emby-feature-hero-copy h2 { margin: 7px 0 8px; font-size: 30px; }
.emby-feature-hero-copy p { max-width: 760px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.emby-feature-hero-side { width: min(330px, 36%); min-width: 270px; display: grid; justify-items: stretch; gap: 9px; }
.emby-feature-hero-state { min-width: 0; padding: 14px 16px; display: grid; grid-template-columns: 44px minmax(0, 1fr); align-items: center; gap: 12px; border: 1px solid color-mix(in srgb, var(--primary) 24%, var(--line)); border-radius: 11px; background: color-mix(in srgb, var(--surface) 84%, transparent); box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
.emby-feature-hero-mark { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 10px; color: var(--primary); background: var(--primary-soft); font-size: 20px; font-weight: 900; }
.emby-feature-state-copy { min-width: 0; display: grid; gap: 3px; }
.emby-feature-state-copy small { color: var(--muted); font-size: 13px; }
.emby-feature-state-copy strong { overflow: hidden; color: var(--text); font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.emby-feature-state-copy > span { overflow: hidden; color: var(--primary); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.emby-feature-hero-side > .button, .emby-feature-hero-side > form .button { width: 100%; }
.reverse-summary-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.reverse-summary-card { min-width: 0; padding: 20px; }
.reverse-summary-head { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; }
.reverse-summary-head h3 { margin: 0; font-size: 17px; }
.reverse-summary-head p { margin: 4px 0 0; overflow: hidden; color: var(--muted); font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.reverse-summary-card dl { margin: 18px 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--line); border-radius: 7px; background: var(--surface-soft); }
.reverse-summary-card dl > div { min-width: 0; padding: 12px; border-left: 1px solid var(--line); }
.reverse-summary-card dl > div:first-child { border-left: 0; }
.reverse-summary-card dt { color: var(--muted); font-size: 13px; }
.reverse-summary-card dd { margin: 5px 0 0; font-size: 16px; font-weight: 800; }
.reverse-summary-card > .button { width: 100%; }
.reverse-summary-error { margin: -8px 0 14px; color: var(--danger); font-size: 13px; }
.reverse-emby-grid { display: grid; gap: 18px; }
.builtin-media-page { width: 100%; display: grid; gap: 20px; padding-bottom: 24px; }
.builtin-media-page > .settings-section-head { margin: 0; justify-content: space-between; align-items: start; }
.builtin-media-page > .settings-section-head > div { min-width: 0; }
.builtin-media-page > .settings-section-head > .badge { flex: 0 0 auto; white-space: nowrap; }
.builtin-media-page .card { min-width: 0; padding: 22px; border-radius: 8px; }
.builtin-media-page .card h3 { margin: 0 0 18px; font-size: 17px; }
.builtin-media-page .card form { display: grid; gap: 16px; }
.builtin-media-page .card > .field, .builtin-media-page .card > form + form { margin-top: 18px; }
.builtin-media-page .card .button { justify-self: start; }
.builtin-media-page .card .settings-section-head { justify-content: space-between; margin-bottom: 20px; }
.builtin-media-page .card .settings-section-head h2 { margin: 0; font-size: 17px; }
.builtin-media-page .card .settings-section-head p { overflow-wrap: anywhere; }
.builtin-media-page .reverse-emby-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); align-items: start; }
@media (max-width: 600px) { .builtin-media-page { gap: 16px; } .builtin-media-page .card { padding: 18px; } .builtin-media-page > .settings-section-head { gap: 10px; } }
.builtin-navigation { margin-bottom: 22px; }
.builtin-library-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: 18px; align-items: start; container-type: inline-size; }
.builtin-library-card { min-width: 0; position: relative; }
.builtin-library-card[draggable="true"] .builtin-library-art { cursor: grab; user-select: none; }
.builtin-library-card.is-dragging { opacity: .45; }
.builtin-library-card.is-dragging .builtin-library-art { cursor: grabbing; }
.builtin-library-card.drop-before::before, .builtin-library-card.drop-after::after { content: ''; position: absolute; z-index: 2; top: 0; bottom: 46px; width: 4px; border-radius: 4px; background: var(--success); box-shadow: 0 0 0 3px color-mix(in srgb, var(--success) 20%, transparent); pointer-events: none; }
.builtin-library-card.drop-before::before { left: -10px; }
.builtin-library-card.drop-after::after { right: -10px; }
@container (max-width: 520px) { .builtin-library-card.drop-before::before, .builtin-library-card.drop-after::after { left: 0; right: 0; width: auto; height: 4px; } .builtin-library-card.drop-before::before { top: -10px; bottom: auto; } .builtin-library-card.drop-after::after { top: auto; bottom: 36px; } }
.builtin-library-art { display: block; position: relative; aspect-ratio: 16 / 9; overflow: hidden; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-soft); text-decoration: none; }
.builtin-library-art img { display: block; width: 100%; height: 100%; object-fit: cover; }
.builtin-library-placeholder { display: grid; place-items: center; width: 100%; height: 100%; color: var(--muted); background: color-mix(in srgb, var(--surface) 72%, var(--primary-soft)); }
.builtin-library-placeholder svg { width: 42px; height: 42px; opacity: .55; transform: translateY(-14px); }
.builtin-library-shade { position: absolute; inset: auto 0 0; min-height: 75px; display: flex; flex-direction: column; justify-content: end; gap: 3px; padding: 22px 14px 12px; color: white; background: linear-gradient(transparent, rgba(0,0,0,.88)); }
.builtin-library-shade strong { font-size: 17px; line-height: 1.2; overflow-wrap: anywhere; }
.builtin-library-shade span { color: rgba(255,255,255,.78); font-size: 12px; }
.builtin-library-actions { display: flex; justify-content: flex-end; align-items: center; gap: 6px; min-height: 46px; }
.builtin-library-drag { cursor: grab; touch-action: none; }
.builtin-library-drag:active { cursor: grabbing; }
.builtin-library-order-status { color: var(--success); font-size: 13px; }
.builtin-library-order-status[data-error="true"] { color: var(--danger); }
.builtin-library-actions .builtin-library-open { margin-right: auto; font-size: 12px; color: var(--muted); text-decoration: none; }
.builtin-library-actions .icon-command:disabled { opacity: .3; cursor: default; }
.builtin-title-filters { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.builtin-title-filters input { flex: 1 1 240px; min-width: 0; }
.builtin-title-filters select { flex: 0 1 160px; }
.builtin-title-filters > .ui-select { flex: 0 1 180px; width: auto; min-width: 0; }
.builtin-filter-menu { position: relative; flex: 0 0 36px; }
.builtin-filter-menu > summary { list-style: none; cursor: pointer; }
.builtin-filter-menu > summary::-webkit-details-marker { display: none; }
.builtin-filter-menu[open] > summary, .builtin-filter-menu.has-filters > summary { color: var(--primary); border-color: var(--primary); }
.builtin-library-facets { position: absolute; right: 0; top: calc(100% + 8px); z-index: 40; width: min(280px, calc(100vw - 32px)); display: grid; gap: 10px; padding: 14px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); box-shadow: 0 12px 30px rgba(0,0,0,.2); }
.builtin-library-facets > .ui-select, .builtin-library-facets > select { width: 100%; min-width: 0; }
.builtin-bulk-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; padding: 12px 0; border-block: 1px solid var(--line); }
.builtin-bulk-toolbar > .ui-select, .builtin-bulk-toolbar > select { flex: 0 1 190px; width: auto; min-width: 0; }
.builtin-bulk-toolbar > span { color: var(--muted); font-size: 13px; margin-right: auto; }
.builtin-bulk-toolbar .checkbox { margin: 0; }
.builtin-title-tile { position: relative; }
.builtin-title-tile.is-selected .builtin-title-art { outline: 2px solid var(--primary); outline-offset: 2px; }
.builtin-tile-select { position: absolute; top: 8px; left: 8px; z-index: 2; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 5px; background: var(--surface); cursor: pointer; }
.builtin-tile-select input { width: 17px; height: 17px; margin: 0; accent-color: var(--primary); }
.builtin-hidden-badge { position: absolute; top: 9px; right: 7px; z-index: 1; font-size: 12px; padding: 4px 6px; background: var(--surface); border-radius: 4px; }
.builtin-library-health { display: grid; gap: 7px; padding: 12px 14px 0; font-size: 12px; }
.builtin-library-health p { margin: 0; color: var(--muted); overflow-wrap: anywhere; }
.builtin-library-health strong { font-size: 12px; font-weight: 500; }
.builtin-library-health [data-state="running"] { color: var(--primary); }
.builtin-library-health [data-state="failed"] { color: var(--danger, #dc5454); }
.builtin-library-actions details { margin-left: auto; }
.builtin-library-actions .builtin-library-popover { width: min(250px, 80vw); padding: 12px; gap: 8px; }
.builtin-library-popover .button { width: 100%; justify-content: start; }
.builtin-library-popover form { border: 0; padding: 0; }
@media (max-width: 650px) {
  .builtin-title-filters { position: relative; }
  .builtin-filter-menu { position: static; }
  .builtin-title-filters > input[type="search"] { flex-basis: 100%; }
  .builtin-title-filters > .ui-select { flex: 1 1 130px; }
  .builtin-bulk-toolbar > .ui-select { flex: 1 1 calc(100% - 110px); }
  .builtin-bulk-toolbar > span { flex: 1 1 180px; }
}
.builtin-title-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 150px), 1fr)); gap: 20px 14px; }
.builtin-title-card { display: grid; gap: 5px; align-content: start; min-width: 0; color: inherit; text-decoration: none; }
.builtin-title-tile { min-width: 0; }
.builtin-title-foot { display: flex; align-items: center; justify-content: space-between; min-height: 34px; gap: 4px; }
.builtin-title-foot small { min-width: 0; overflow: hidden; color: var(--muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.builtin-title-foot .icon-command { display: grid; place-items: center; flex: 0 0 32px; width: 32px; height: 32px; cursor: pointer; }
.builtin-title-art, .builtin-item-poster { display: grid; place-items: center; aspect-ratio: 2 / 3; overflow: hidden; border-radius: 6px; background: var(--surface-soft); color: var(--muted); }
.builtin-title-art img, .builtin-item-poster img { width: 100%; height: 100%; display: block; object-fit: cover; }
.builtin-title-art svg, .builtin-item-poster svg { width: 42px; height: 42px; opacity: .45; }
.builtin-item-poster-playable { position: relative; width: 100%; padding: 0; border: 0; color: inherit; cursor: pointer; text-align: inherit; }
.builtin-item-poster-playable::after { position: absolute; inset: 0; content: ''; background: linear-gradient(180deg, transparent 45%, rgba(0,0,0,.72)); opacity: 0; transition: opacity .18s ease; }
.builtin-item-poster-playable:hover::after, .builtin-item-poster-playable:focus-visible::after { opacity: 1; }
.builtin-poster-image { position: absolute; inset: 0; display: grid; place-items: center; }
.builtin-poster-image > span { display: grid; place-items: center; width: 100%; height: 100%; }
.builtin-poster-play { position: absolute; z-index: 1; left: 50%; top: 50%; display: grid; place-items: center; width: 58px; height: 58px; border: 2px solid rgba(255,255,255,.8); border-radius: 50%; color: #fff; background: rgba(26,20,40,.72); box-shadow: 0 8px 26px rgba(0,0,0,.35); opacity: 0; transform: translate(-50%, -42%) scale(.86); transition: opacity .18s ease, transform .18s ease; }
.builtin-poster-play .ui-icon { width: 25px; height: 25px; margin-left: 3px; }
.builtin-item-poster-playable:hover .builtin-poster-play, .builtin-item-poster-playable:focus-visible .builtin-poster-play { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.builtin-poster-play-label { position: absolute; z-index: 1; right: 12px; bottom: 10px; color: #fff; font-size: 12px; font-weight: 650; opacity: 0; transition: opacity .18s ease; }
.builtin-item-poster-playable:hover .builtin-poster-play-label, .builtin-item-poster-playable:focus-visible .builtin-poster-play-label { opacity: 1; }
.builtin-item-poster-playable:focus-visible { outline: 2px solid var(--accent-color); outline-offset: 3px; }
.builtin-title-card strong { font-size: 13px; line-height: 1.35; overflow-wrap: anywhere; }
.builtin-title-card small, .builtin-item-facts { color: var(--muted); font-size: 12px; }
.builtin-title-card:hover strong { color: var(--primary); }
.builtin-title-context-menu { position: fixed; z-index: 10000; display: grid; gap: 3px; min-width: 150px; max-width: calc(100vw - 16px); max-height: calc(100vh - 16px); overflow: auto; padding: 6px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); box-shadow: 0 12px 34px #0007; }
.builtin-title-context-menu a, .builtin-title-context-menu button { display: block; width: 100%; padding: 9px 12px; border: 0; border-radius: 6px; color: var(--text); background: transparent; text-align: left; font: inherit; text-decoration: none; cursor: pointer; }
.builtin-title-context-menu a:hover, .builtin-title-context-menu button:hover, .builtin-title-context-menu a:focus-visible, .builtin-title-context-menu button:focus-visible { background: var(--surface-soft); color: var(--primary); outline: none; }
.builtin-back { justify-self: start; }
.builtin-item-layout { display: grid; grid-template-columns: minmax(180px, 250px) minmax(0, 1fr); align-items: start; gap: 28px; }
.builtin-item-body { min-width: 0; }
.builtin-item-body h2 { margin: 0 0 6px; font-size: 24px; }
.builtin-item-overview { white-space: pre-wrap; line-height: 1.7; overflow-wrap: anywhere; }
.builtin-item-editor { margin-top: 24px; border-top: 1px solid var(--line); padding-top: 16px; }
.builtin-item-editor summary { display: inline-flex; cursor: pointer; list-style: none; }
.builtin-item-editor summary::-webkit-details-marker { display: none; }
.builtin-item-editor form { display: grid; gap: 14px; max-width: 720px; padding: 20px 0; border-bottom: 1px solid var(--line); }
.builtin-item-editor form .button { justify-self: start; }
.builtin-item-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.builtin-item-children { display: grid; gap: 7px; margin-top: 28px; }
.builtin-item-children a { padding: 10px 0; border-bottom: 1px solid var(--line); color: inherit; text-decoration: none; }
.builtin-child-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 150px), 1fr)); gap: 18px 14px; }
.builtin-child-grid[data-child-type="Episode"] { grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); }
.builtin-child-grid .builtin-child-card { display: grid; align-content: start; gap: 8px; min-width: 0; padding: 0 0 10px; }
.builtin-child-art { display: grid; place-items: center; aspect-ratio: 2 / 3; overflow: hidden; border-radius: 6px; background: var(--surface-soft); color: var(--muted); }
.builtin-child-art img { display: block; width: 100%; height: 100%; object-fit: cover; }
.builtin-child-art svg { width: 36px; height: 36px; opacity: .45; }
.builtin-child-card strong { overflow-wrap: anywhere; font-size: 14px; }
.builtin-child-card small { color: var(--muted); font-size: 12px; }
.builtin-child-grid[data-child-type="Episode"] .builtin-child-art, .builtin-item-poster.is-episode { aspect-ratio: 16 / 9; }
.builtin-child-card:hover strong { color: var(--primary); }
@media (max-width: 650px) { .builtin-item-layout { grid-template-columns: 1fr; } .builtin-item-poster { width: min(55%, 220px); } .builtin-item-fields { grid-template-columns: 1fr; } .builtin-title-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px 9px; } }
.builtin-library-actions .icon-command { width: 34px; height: 34px; display: grid; place-items: center; cursor: pointer; }
.builtin-library-actions form { margin: 0; }
.builtin-library-menu { position: static; }
.builtin-library-menu > summary { list-style: none; }
.builtin-library-menu > summary::-webkit-details-marker { display: none; }
.builtin-library-popover { position: absolute; z-index: 30; right: 0; top: calc(100% - 2px); width: min(340px, 90vw); max-height: min(72vh, 700px); overflow: auto; display: grid; gap: 14px; padding: 16px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); box-shadow: 0 16px 40px rgba(0,0,0,.24); transform-origin: top right; }
details[open] > .builtin-library-popover { animation: ui-popover-enter .2s cubic-bezier(.16, 1, .3, 1) both; }
.builtin-library-popover form { display: grid; gap: 10px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.builtin-library-popover form:last-child { border: 0; padding: 0; }
.builtin-library-popover .field { min-width: 0; }
.builtin-library-popover input[type="file"] { width: 100%; font-size: 12px; }
.builtin-library-popover .button { justify-self: start; }
.builtin-library-footnote { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.builtin-library-cover-settings { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 12px 0; border-bottom: 1px solid var(--line); }
.builtin-library-cover-settings > label:not(.checkbox) { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.builtin-library-cover-settings .checkbox { margin: 0; }
.builtin-library-cover-settings small { color: var(--muted); font-size: 12px; }
.builtin-metadata-source { display: flex; gap: 8px; flex-wrap: wrap; }
.builtin-metadata-source label { cursor: pointer; }
.builtin-metadata-source input { position: absolute; opacity: 0; }
.builtin-metadata-source span { display: inline-block; padding: 8px 12px; border: 1px solid var(--line); border-radius: 5px; font-size: 13px; }
.builtin-metadata-source input:checked + span { border-color: var(--primary); color: var(--primary); background: var(--primary-soft); }
.builtin-metadata-source input:focus-visible + span { outline: 2px solid var(--primary); outline-offset: 2px; }
.builtin-media-page [data-builtin-metadata-custom][hidden] { display: none; }
.builtin-tmdb-dialog { width: min(720px, 94vw); }
.builtin-tmdb-dialog .builtin-metadata-source { padding: 12px 22px 0; }
.builtin-tmdb-dialog form { display: flex; gap: 10px; padding: 16px 22px; }
.builtin-tmdb-dialog form input { flex: 1; min-width: 0; }
.builtin-tmdb-results { display: grid; gap: 7px; max-height: min(65vh, 620px); overflow-y: auto; padding: 0 22px 22px; }
@media (max-width: 600px) { .builtin-tmdb-dialog form { flex-wrap: wrap; } }
@media (max-width: 680px) { .builtin-library-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } .builtin-library-card:nth-child(odd) .builtin-library-popover { left: 0; right: auto; } .builtin-library-shade { min-height: 58px; padding: 18px 9px 8px; } .builtin-library-shade strong { font-size: 14px; } }
@media (max-width: 350px) { .builtin-library-grid { grid-template-columns: 1fr; } .builtin-library-card .builtin-library-popover { left: 0; right: auto; } }
.reverse-emby-card { padding: 24px; border-radius: 8px; }
.reverse-emby-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 22px; }
.reverse-emby-head > div { display: flex; align-items: center; gap: 12px; min-width: 0; }
.reverse-emby-head .settings-section-icon { flex: 0 0 auto; }
.reverse-emby-head p { max-width: 680px; margin: 4px 0 0; overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; }
.reverse-runtime-strip { margin-bottom: 22px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--line); border-radius: 7px; background: var(--surface-soft); }
.reverse-runtime-strip > div { min-height: 72px; padding: 13px 16px; display: grid; align-content: center; gap: 5px; border-left: 1px solid var(--line); }
.reverse-runtime-strip > div:first-child { border-left: 0; }
.reverse-runtime-strip span { color: var(--muted); font-size: 13px; }
.reverse-runtime-strip strong { font-size: 17px; }
.reverse-basic-grid { display: grid; grid-template-columns: minmax(300px, 1.35fr) minmax(160px, .55fr) minmax(180px, .65fr); align-items: end; gap: 16px; }
.reverse-basic-grid .proxy-switch { min-height: 49px; }
.reverse-port-setup { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; gap: 16px; }
.reverse-port-card { min-height: 82px; padding: 13px 15px; display: flex; align-items: center; justify-content: space-between; gap: 14px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-soft); }
.reverse-port-card > span { min-width: 0; display: grid; gap: 4px; }
.reverse-port-card strong, .reverse-port-card small { display: block; }
.reverse-port-card small { color: var(--muted); font-size: 13px; line-height: 1.4; }
.reverse-port-card input { width: 96px; min-width: 0; flex: 0 1 96px; }
.reverse-web-switch { min-height: 82px; border-radius: 7px; }
.reverse-web-switch > span:last-child { min-width: 0; }
.reverse-web-switch strong, .reverse-web-switch small { overflow: hidden; text-overflow: ellipsis; }
.reverse-web-switch strong { white-space: nowrap; }
.reverse-web-switch small { line-height: 1.4; }
.reverse-auto-status { min-height: 82px; padding: 13px 15px; display: flex; align-items: center; gap: 12px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-soft); }
.reverse-auto-status > span { width: 38px; height: 38px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 7px; color: var(--warning); background: color-mix(in srgb, var(--warning) 12%, var(--surface)); }
.reverse-auto-status.ready > span { color: var(--success); background: var(--success-soft); }
.reverse-auto-status .ui-icon { width: 19px; height: 19px; }
.reverse-auto-status strong, .reverse-auto-status small { display: block; }
.reverse-auto-status small { margin-top: 4px; color: var(--muted); font-size: 13px; }
.reverse-path-converter { margin-top: 18px; border: 1px solid var(--line); border-left: 4px solid #28b88d; border-radius: 6px; background: rgba(40, 184, 141, .07); }
.reverse-legacy-head { display: flex; align-items: center; gap: 12px; min-width: 0; }
.reverse-legacy-icon { width: 40px; height: 40px; flex: 0 0 40px; display: grid; place-items: center; border-radius: 6px; color: var(--success); background: var(--success-soft); }
.reverse-legacy-head > div { min-width: 0; flex: 1; }
.reverse-legacy-head strong, .reverse-legacy-head small { display: block; }
.reverse-legacy-head strong { font-size: 18px; }
.reverse-legacy-head small { margin-top: 4px; color: var(--muted); font-size: 13px; line-height: 1.5; }
.reverse-legacy-state { flex: 0 0 auto; padding: 5px 8px; border: 1px solid rgba(40, 184, 141, .36); border-radius: 4px; color: #47d6a9; font-size: 12px; font-weight: 700; }
.reverse-legacy-action { display: grid; gap: 9px; min-width: 0; }
.reverse-legacy-action > div { display: flex; gap: 9px; min-width: 0; }
.reverse-legacy-action input { min-width: 0; flex: 1; }
.reverse-legacy-action .button { flex: 0 0 auto; }
.reverse-legacy-action output { display: block; min-height: 20px; color: var(--muted); font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.reverse-legacy-action output.error { color: var(--danger); }
.reverse-legacy-action output.success { color: var(--success); }
.reverse-diagnostic-steps { margin: 0; padding: 0; list-style: none; }
.reverse-diagnostic-steps li { display: flex; align-items: start; gap: 10px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.reverse-diagnostic-steps li > .ui-icon { flex: 0 0 18px; margin-top: 2px; color: var(--muted); }
.reverse-diagnostic-steps li[data-status="passed"] > .ui-icon { color: var(--success); }
.reverse-diagnostic-steps li[data-status="failed"] > .ui-icon { color: var(--danger); }
.reverse-diagnostic-steps li[data-status="warning"] > .ui-icon { color: var(--warning); }
.reverse-diagnostic-steps li > div { min-width: 0; flex: 1; display: grid; gap: 4px; overflow-wrap: anywhere; }
.reverse-diagnostic-steps strong { font-size: 13px; }
.reverse-diagnostic-steps span, .reverse-diagnostic-steps small { font-size: 12px; color: var(--muted); }
.reverse-diagnostic-steps small { white-space: nowrap; }
.builtin-media-technical { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr)); gap: 16px; margin: 20px 0; padding: 16px 0; border-block: 1px solid var(--line); }
.builtin-media-technical div { min-width: 0; }
.builtin-media-technical dt { font-size: 12px; color: var(--muted); margin-bottom: 6px; }
.builtin-media-technical dd { font-size: 13px; margin: 0; overflow-wrap: anywhere; }
.builtin-probe-action { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: -4px 0 22px; }
.builtin-probe-action small, .builtin-probe-note { color: var(--muted); font-size: 12px; }
.builtin-item-cast { margin: 24px 0; }
.builtin-item-cast h3 { margin: 0 0 14px; font-size: 16px; }
.builtin-cast-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); gap: 16px; }
.builtin-cast-person { min-width: 0; display: grid; align-content: start; gap: 4px; }
.builtin-cast-avatar { display: grid; place-items: center; width: 76px; height: 76px; border-radius: 50%; overflow: hidden; color: var(--muted); background: var(--surface-soft); }
.builtin-cast-avatar img { display: block; width: 100%; height: 100%; object-fit: cover; }
.builtin-cast-avatar[data-actor-avatar] { border: 0; padding: 0; cursor: pointer; }
.builtin-cast-avatar[data-actor-avatar]:focus-visible { outline: 2px solid var(--accent-color); outline-offset: 3px; }
.builtin-actor-menu { position: fixed; z-index: 10000; padding: 6px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); box-shadow: 0 8px 24px #0005; }
.builtin-actor-menu button { border: 0; border-radius: 6px; padding: 10px 18px; color: var(--text); background: var(--surface-soft); cursor: pointer; }
.builtin-actor-dialog { width: min(460px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow: auto; padding: 0; border: 1px solid var(--line); border-radius: 20px; color: var(--text); background: var(--surface); box-shadow: 0 24px 80px #0006; }
.builtin-actor-dialog::backdrop { background: #0009; backdrop-filter: blur(5px); }
.actor-dialog-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 24px 24px 0; }
.actor-dialog-head h3 { margin: 0; font-size: 19px; }
.actor-dialog-head p { margin: 8px 0 0; font-size: 13px; line-height: 1.6; color: var(--muted); }
.actor-dialog-head strong { color: var(--text); font-weight: 500; }
.actor-dialog-close { display: grid; place-items: center; flex-shrink: 0; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 8px; background: transparent; color: var(--muted); font-size: 24px; cursor: pointer; }
.actor-dialog-close:hover { background: var(--surface-soft); color: var(--text); }
.actor-dialog-body { padding: 24px; }
.actor-upload-zone { display: flex; flex-direction: column; align-items: center; width: 100%; padding: 28px 16px 24px; border: 1px dashed color-mix(in srgb, var(--accent-color) 40%, var(--line)); border-radius: 14px; background: color-mix(in srgb, var(--accent-color) 4%, var(--surface)); color: var(--text); font: inherit; cursor: pointer; transition: border-color .18s, background .18s; }
.actor-upload-zone:hover, .actor-upload-zone.is-dragging { border-color: var(--accent-color); background: color-mix(in srgb, var(--accent-color) 9%, var(--surface)); }
.actor-upload-zone:focus-visible { outline: 2px solid var(--accent-color); outline-offset: 4px; }
.actor-preview-ring { position: relative; display: grid; place-items: center; width: 96px; height: 96px; margin-bottom: 20px; border: 1px solid var(--line); border-radius: 50%; background: var(--surface-soft); color: var(--muted); }
.actor-preview-ring > svg { width: 36px; height: 36px; }
.actor-preview-ring [data-actor-preview] { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.actor-preview-ring [hidden] { display: none; }
.actor-upload-badge { position: absolute; right: -2px; bottom: 0; display: grid; place-items: center; width: 28px; height: 28px; border: 3px solid var(--surface); border-radius: 50%; background: var(--accent-color); color: #fff; font-size: 20px; line-height: 1; }
.actor-upload-zone > strong { font-size: 14px; font-weight: 600; }
.actor-upload-hint { margin-top: 7px; color: var(--muted); font-size: 12px; }
.actor-upload-formats { margin-top: 20px; color: var(--muted); font-size: 12px; letter-spacing: .2px; }
.actor-file-name { margin: 12px 0 0; color: var(--muted); text-align: center; font-size: 12px; overflow-wrap: anywhere; }
.actor-dialog-status { margin: 12px 0 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.actor-dialog-status:empty { display: none; }
.actor-dialog-actions { display: flex; justify-content: flex-end; gap: 10px; padding: 16px 24px; border-top: 1px solid var(--line); background: var(--surface-soft); }
.actor-dialog-actions .button { min-width: 88px; margin: 0; }
.builtin-cast-person strong, .builtin-cast-person small { font-size: 12px; overflow-wrap: anywhere; }
.builtin-cast-person small { color: var(--muted); }
.builtin-item-cast form { margin-top: 16px; }
@media (max-width: 980px) { .builtin-media-page { padding-bottom: 80px; } }
@media (max-width: 650px) { .builtin-media-technical { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.profile-setup { padding-block: 18px; margin-bottom: 20px; border-block: 1px solid var(--line); }
.profile-setup summary { display: flex; align-items: center; gap: 12px; cursor: pointer; list-style: none; }
.profile-setup summary::-webkit-details-marker { display: none; }
.profile-setup summary > span { display: flex; align-items: center; gap: 8px; font-weight: 600; }
.profile-setup summary > small { margin-left: auto; color: var(--muted); }
.profile-setup .ui-icon { width: 18px; height: 18px; flex-shrink: 0; }
.profile-setup-modes { display: flex; width: fit-content; max-width: 100%; flex-wrap: wrap; gap: 4px; margin-block: 16px; border-bottom: 1px solid var(--line); }
.profile-setup-modes a { padding: 10px 12px; color: var(--muted); border-bottom: 2px solid transparent; font-size: 13px; }
.profile-setup-modes a[aria-current="page"] { border-color: var(--accent); color: var(--text); }
.profile-setup ol { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr)); gap: 8px 24px; list-style: none; margin: 0; padding: 0; }
.profile-setup li a { display: flex; align-items: center; gap: 10px; padding-block: 12px; }
.profile-setup li a > div { min-width: 0; flex: 1; display: grid; gap: 4px; }
.profile-setup li strong { font-size: 13px; }
.profile-setup li small { color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }
.profile-setup .ready { color: var(--success); }
.profile-setup .pending { color: var(--warning); }
@media (max-width: 600px) {
  .profile-setup summary { flex-wrap: wrap; }
  .profile-setup summary > small { margin-left: 0; flex: 1; min-width: 130px; }
}
.reverse-path-converter > summary { min-height: 82px; display: flex; align-items: center; gap: 12px; padding: 16px 18px; cursor: pointer; list-style: none; }
.reverse-path-converter > summary::-webkit-details-marker { display: none; }
.reverse-path-converter[open] > summary { border-bottom: 1px solid var(--line); }
.reverse-path-converter > summary strong, .reverse-path-converter > summary small { display: block; }
.reverse-path-converter > summary small { margin-top: 3px; color: var(--muted); font-size: 13px; }
.reverse-path-converter > summary > .ui-icon:last-child { color: var(--muted); transition: transform .18s ease; }
.reverse-path-converter[open] > summary > .ui-icon:last-child { transform: rotate(180deg); }
.reverse-path-body { display: grid; gap: 22px; padding: 18px; }
.reverse-path-advanced { min-width: 0; border-top: 1px solid var(--line); }
.reverse-path-advanced > summary { display: flex; align-items: center; gap: 12px; padding-block: 14px; cursor: pointer; list-style: none; font-size: 13px; }
.reverse-path-advanced > summary::-webkit-details-marker { display: none; }
.reverse-path-advanced > summary > span:first-child { display: flex; align-items: center; gap: 8px; margin-right: auto; }
.reverse-path-advanced > summary .ui-icon { width: 16px; height: 16px; flex: 0 0 16px; }
.reverse-path-advanced[open] > summary > .ui-icon { transform: rotate(180deg); }
.reverse-advanced-body { display: grid; gap: 20px; padding-block: 10px; min-width: 0; }
.reverse-legacy-action > .reverse-local-request { display: grid; gap: 8px; padding-block: 12px; border-block: 1px solid var(--line); }
.reverse-local-request label { display: grid; gap: 8px; font-size: 13px; }
.reverse-local-request input { width: 100%; }
.reverse-local-request small { color: var(--muted); overflow-wrap: anywhere; }
.reverse-legacy-action [hidden], .reverse-path-generator output[hidden] { display: none !important; }
.reverse-legacy-action > .button { justify-self: start; }
.reverse-path-generator output { font-size: 13px; color: var(--muted); overflow-wrap: anywhere; }
.reverse-path-generator output.error { color: var(--danger); }
.reverse-manual-actions { display: flex; justify-content: flex-end; }
.reverse-path-generator, .reverse-path-test { display: grid; gap: 8px; min-width: 0; }
.reverse-path-generator > label, .reverse-path-test > label { font-weight: 750; }
.reverse-path-generator > div, .reverse-path-test > div { display: flex; gap: 8px; min-width: 0; }
.reverse-path-generator input, .reverse-path-generator textarea, .reverse-path-test input { min-width: 0; flex: 1; }
.reverse-path-generator textarea { min-height: 62px; resize: vertical; }
.reverse-path-generator small, .reverse-path-test output, .reverse-path-group header small { color: var(--muted); font-size: 13px; line-height: 1.5; }
.reverse-path-test output.error { color: var(--danger); }
.reverse-path-group { display: grid; gap: 10px; min-width: 0; padding-top: 18px; border-top: 1px solid var(--line); }
.reverse-path-group header { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.reverse-path-group header strong, .reverse-path-group header small { display: block; }
.reverse-path-group header small { margin-top: 3px; }
.reverse-map-list { display: grid; gap: 8px; }
.reverse-map-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 38px; align-items: center; gap: 8px; }
.reverse-map-row.reverse-content-row { grid-template-columns: minmax(0, 1.3fr) 145px minmax(0, 1fr) 38px; }
.reverse-map-row input, .reverse-map-row select { min-width: 0; width: 100%; }
.reverse-map-row .icon-command { width: 38px; height: 38px; display: grid; place-items: center; color: var(--danger); }
.reverse-path-generator.compact { padding-top: 5px; }
.reverse-path-generator.compact > div input { flex: 1 1 0; }
.reverse-trust-proxy { grid-column: 1 / -1; margin-top: -2px; }
.reverse-endpoints { margin-top: 18px; display: grid; grid-template-columns: 1fr; gap: 10px; }
.reverse-endpoints > div { min-width: 0; padding: 13px 15px; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 6px 11px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-soft); font-size: 14px; }
.reverse-endpoints span, .reverse-endpoints small { color: var(--muted); }
.reverse-endpoints code { overflow: hidden; color: var(--primary); font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.reverse-endpoints small { grid-column: 2; }
.reverse-actionbar { margin-top: 18px; padding-top: 18px; display: grid; grid-template-columns: repeat(3, minmax(150px, 176px)); justify-content: end; gap: 10px; border-top: 1px solid var(--line); }
.reverse-actionbar form { min-width: 0; margin: 0; }
.reverse-actionbar .button { width: 100%; min-height: 44px; }
.reverse-log-filter { margin-bottom: 14px; padding: 14px; display: grid; grid-template-columns: minmax(160px, .7fr) minmax(160px, .7fr) minmax(240px, 1.4fr) auto auto; align-items: end; gap: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.reverse-log-filter label { min-width: 0; display: grid; gap: 7px; color: var(--muted); font-size: 14px; font-weight: 800; }
.reverse-log-filter input, .reverse-log-filter select { min-height: 43px; font-size: 14px; }
.reverse-log-filter > a { min-height: 42px; padding: 0 10px; display: grid; place-items: center; color: var(--muted); font-size: 14px; }
.reverse-log-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.reverse-log-table { width: 100%; min-width: 1160px; border-collapse: collapse; }
.reverse-log-table th { padding: 13px 14px; color: var(--muted); background: var(--surface-soft); font-size: 14px; font-weight: 800; text-align: left; white-space: nowrap; }
.reverse-log-table td { max-width: 290px; padding: 14px; border-top: 1px solid var(--line); font-size: 14px; line-height: 1.45; vertical-align: middle; }
.reverse-log-table td code, .reverse-log-table td > span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.reverse-log-table td small { max-width: 210px; margin-top: 4px; display: block; overflow: hidden; color: var(--danger); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.reverse-log-table time { color: var(--muted); white-space: nowrap; }
.reverse-method { color: var(--text); font-weight: 850; }
.reverse-status, .reverse-mode { width: fit-content; padding: 4px 7px; border-radius: 5px; font-weight: 800; }
.reverse-status.success, .reverse-mode.health, .reverse-mode.websocket { color: var(--success); background: var(--success-soft); }
.reverse-status.redirect, .reverse-mode.redirect { color: var(--primary); background: var(--primary-soft); }
.reverse-status.error, .reverse-mode.error, .reverse-mode.web-blocked { color: var(--danger); background: color-mix(in srgb, var(--danger) 10%, var(--surface)); }
.reverse-mode.passthrough { color: var(--muted); background: var(--surface-soft); }
.reverse-log-table .designed-empty { min-height: 180px; }
.reverse-log-table .designed-empty h3 { font-size: 16px; }
.reverse-log-table .designed-empty p { font-size: 14px; }
.reverse-log-foot { padding: 11px 2px 0; color: var(--muted); font-size: 14px; text-align: right; }
.file-sourcebar { min-height: 68px; margin-bottom: 12px; display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.file-source-tabs { min-width: 0; display: inline-flex; gap: 4px; padding: 4px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-soft); }
.file-source-tabs a { min-width: 168px; min-height: 52px; padding: 7px 12px; display: flex; align-items: center; gap: 10px; border-radius: 8px; color: var(--muted); }
.file-source-tabs a:hover { color: var(--text); background: color-mix(in srgb, var(--surface) 65%, transparent); }
.file-source-tabs a.active { color: var(--text); background: var(--surface); box-shadow: 0 2px 8px color-mix(in srgb, var(--text) 8%, transparent); }
.file-source-tabs > a > i { width: 38px; height: 32px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 7px; color: var(--primary); background: var(--primary-soft); font-size: 13px; font-style: normal; font-weight: 850; }
.file-source-tabs > a > span:not([class]) { min-width: 0; display: grid; gap: 2px; }
.file-source-tabs > a > span:not([class]) > strong { font-size: 14px; }
.file-source-tabs > a > span:not([class]) > small { color: var(--muted); font-size: 13px; }
.file-provider-state { display: flex; align-items: center; justify-content: flex-end; gap: 7px; flex-wrap: wrap; }
.file-provider-state > span, .file-provider-state b { min-height: 28px; padding: 0 9px; display: inline-flex; align-items: center; border: 1px solid var(--line); border-radius: 7px; color: var(--muted); background: var(--surface); font-size: 13px; font-weight: 700; white-space: nowrap; }
.file-provider-state > span { color: var(--text); }
.file-provider-state > span i { width: 7px; height: 7px; margin-right: 7px; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 3px color-mix(in srgb, var(--success) 14%, transparent); }
.file-provider-state.warning > span i { background: var(--warning); box-shadow: 0 0 0 3px color-mix(in srgb, var(--warning) 14%, transparent); }
.file-source-statusbar { min-height: 0; margin: -8px 0 12px; justify-content: flex-end; }
.file-manager-shell { overflow: hidden; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); box-shadow: var(--shadow); }
.file-toolbar { min-height: 64px; padding: 10px 14px; display: flex; align-items: center; gap: 8px; border-bottom: 1px solid var(--line); background: var(--surface-soft); }
.file-tool-button { width: 38px; height: 38px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 9px; color: var(--primary); background: var(--surface); font-size: 18px; font-weight: 800; }
.file-tool-button:hover { border-color: var(--primary); background: var(--primary-soft); }
.file-tool-button.disabled { pointer-events: none; opacity: .42; }
.file-breadcrumb { min-width: 0; flex: 1; display: flex; align-items: center; gap: 7px; overflow-x: auto; padding: 0 8px; white-space: nowrap; scrollbar-width: thin; }
.file-breadcrumb a { color: var(--text); font-size: 14px; font-weight: 700; }
.file-breadcrumb a:hover { color: var(--primary); }
.file-breadcrumb a span { margin-right: 6px; color: var(--primary); font-size: 17px; }
.file-breadcrumb-separator { color: var(--muted); }
.file-search { position: relative; width: min(260px, 28vw); flex: 0 1 260px; }
.file-search span { position: absolute; left: 12px; top: 50%; z-index: 1; color: var(--muted); transform: translateY(-50%); }
.file-search input { min-height: 38px; padding-left: 34px; background: var(--surface); }
.file-actionbar { min-height: 58px; padding: 8px 16px; display: flex; align-items: center; gap: 6px; overflow-x: auto; border-bottom: 1px solid var(--line); background: var(--surface); scrollbar-width: none; }
.file-actionbar::-webkit-scrollbar { display: none; }
.file-action-button { position: relative; width: 40px; height: 40px; flex: 0 0 auto; display: grid; place-items: center; border: 0; border-radius: 9px; color: var(--primary); background: transparent; cursor: pointer; font-size: 20px; font-weight: 800; }
.file-action-button:hover, .file-action-button.active { background: var(--primary-soft); }
.file-action-button:disabled { color: var(--muted); cursor: default; opacity: .38; }
.file-action-button.danger { color: var(--danger); }
.file-action-button small { position: absolute; right: 1px; bottom: 1px; min-width: 15px; height: 15px; padding: 0 3px; display: grid; place-items: center; border-radius: 8px; color: white; background: var(--primary); font-size: 12px; }
.file-action-button i { position: absolute; right: 3px; bottom: 2px; width: 14px; height: 14px; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--primary); font-size: 13px; font-style: normal; line-height: 1; }
.file-action-button.danger i { background: var(--danger); }
.file-action-button svg, .file-row-action svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.file-action-divider { width: 1px; height: 26px; flex: 0 0 auto; margin: 0 5px; background: var(--line); }
.file-selection-count { margin-left: auto; padding-left: 12px; color: var(--muted); font-size: 14px; white-space: nowrap; }
.file-actionbar form { display: none; }
.file-summary { min-height: 76px; padding: 15px 20px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--line); }
.file-summary > div { display: grid; gap: 5px; }
.file-summary strong { font-size: 16px; }
.file-summary span, .file-summary code { color: var(--muted); font-size: 14px; }
.file-summary code { max-width: 55%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.file-list-head, .file-row { display: grid; grid-template-columns: 26px minmax(260px, 1.5fr) minmax(90px, .38fr) minmax(90px, .34fr) minmax(170px, .62fr) 24px 24px; align-items: center; gap: 12px; padding: 0 20px; }
.file-list-head { min-height: 40px; border-bottom: 1px solid var(--line); color: var(--muted); background: var(--surface-soft); font-size: 14px; font-weight: 700; }
.file-row { position: relative; min-height: 64px; border-bottom: 1px solid var(--line); color: var(--text); transition: background .15s ease; }
.file-row:last-child { border-bottom: 0; }
.file-row:hover { background: var(--primary-soft); }
.file-row[hidden] { display: none; }
.file-select { width: 22px; height: 22px; display: grid; place-items: center; cursor: pointer; }
.file-select input { position: absolute; width: 1px; min-height: 1px; opacity: 0; }
.file-select span { width: 17px; height: 17px; border: 1.5px solid var(--line); border-radius: 5px; background: var(--surface); }
.file-select input:checked + span { border-color: var(--primary); background: var(--primary); box-shadow: inset 0 0 0 3px var(--surface); }
.file-name { min-width: 0; display: flex; align-items: center; gap: 13px; }
.file-name > span { min-width: 0; display: grid; gap: 3px; }
.file-name strong, .file-name small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.file-name strong { font-size: 14px; }
.file-name small { color: var(--muted); font-size: 13px; }
.file-kind { width: 36px; height: 36px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 9px; color: #4382ed; background: color-mix(in srgb, #4382ed 12%, var(--surface)); font-style: normal; font-size: 17px; font-weight: 800; }
.file-kind.file { color: #647082; background: color-mix(in srgb, #647082 11%, var(--surface)); font-size: 13px; }
.file-type, .file-size, .file-row time { color: var(--muted); font-size: 14px; }
.file-row-actions { position: absolute; z-index: 4; top: 50%; right: 12px; display: none; align-items: center; gap: 3px; padding: 5px; border: 1px solid var(--line); border-radius: 10px; background: color-mix(in srgb, var(--surface) 94%, transparent); box-shadow: 0 9px 24px color-mix(in srgb, var(--text) 13%, transparent); transform: translateY(-50%); backdrop-filter: blur(12px); }
.file-list.single-selection .file-row.selected .file-row-actions { display: flex; }
.file-row-action { width: 36px; height: 36px; padding: 0; display: grid; place-items: center; border: 0; border-radius: 8px; color: var(--primary); background: transparent; cursor: pointer; }
.file-row-action:hover { background: var(--primary-soft); }
.file-row-action.danger { color: var(--danger); }
.file-row-action.danger:hover { background: color-mix(in srgb, var(--danger) 10%, var(--surface)); }
.file-row-action:disabled { opacity: .35; cursor: default; }
.file-archive-dialog-body { min-height: 150px; padding: 22px 24px; }
.file-archive-selection { margin-top: 14px; padding: 11px 13px; border: 1px solid var(--line); border-radius: 8px; color: var(--muted); background: var(--surface-soft); font-size: 14px; }
.file-archive-empty { min-height: 130px; display: grid; place-items: center; align-content: center; gap: 8px; text-align: center; }
.file-archive-empty p { margin: 0 0 8px; color: var(--muted); }
.file-favorite { color: var(--line); font-size: 16px; }
.file-favorite.active { color: #eeb51f; }
.file-open { color: var(--muted); font-size: 22px; }
.file-list-empty { grid-column: 1 / -1; min-height: 220px; display: grid; place-items: center; color: var(--muted); }
.file-list-empty[hidden] { display: none; }
.file-manager-empty { min-height: 420px; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 1px dashed var(--line); border-radius: 14px; background: var(--surface-soft); text-align: center; }
.file-manager-empty > span, .file-no-preview > span { width: 58px; height: 58px; display: grid; place-items: center; border-radius: 14px; color: var(--primary); background: var(--primary-soft); font-size: 27px; }
.file-manager-empty h2 { margin: 17px 0 0; }
.file-manager-empty p { margin: 7px 0 14px; color: var(--muted); }
.file-manager-empty code { padding: 8px 11px; border: 1px solid var(--line); border-radius: 8px; color: var(--primary); background: var(--surface); }

/* 115 rapid upload workspace */
.one15-upload-page { display: grid; gap: 14px; padding-bottom: 24px; }
.one15-upload-hero { position: relative; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(300px, .72fr); gap: 16px; padding: 24px; border: 1px solid color-mix(in srgb, var(--primary) 22%, var(--line)); border-radius: 20px; background: linear-gradient(135deg, color-mix(in srgb, var(--primary) 12%, var(--surface)) 0%, var(--surface) 54%, color-mix(in srgb, #16b9a5 8%, var(--surface)) 100%); box-shadow: var(--shadow); }
.one15-upload-hero::after { content: ''; position: absolute; width: 280px; height: 280px; right: 18%; top: -210px; border: 45px solid color-mix(in srgb, var(--primary) 12%, transparent); border-radius: 50%; pointer-events: none; }
.one15-upload-kicker { display: block; margin-bottom: 8px; color: var(--primary); font-size: 14px; font-weight: 800; letter-spacing: .16em; }
.one15-upload-hero h2 { margin: 0; color: var(--text); font-size: clamp(22px, 2vw, 31px); letter-spacing: -.035em; }
.one15-upload-hero-copy > p { max-width: 700px; margin: 9px 0 18px; color: var(--muted); line-height: 1.75; }
.one15-upload-badges { display: flex; flex-wrap: wrap; gap: 8px; }
.one15-upload-badges span { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border: 1px solid color-mix(in srgb, var(--primary) 18%, var(--line)); border-radius: 999px; color: var(--text-secondary); background: color-mix(in srgb, var(--surface) 76%, transparent); font-size: 14px; font-weight: 650; }
.one15-upload-badges .ui-icon { width: 14px; height: 14px; color: var(--primary); }
.one15-upload-hero-status { position: relative; z-index: 1; display: grid; grid-template-columns: 44px 1fr; align-items: center; gap: 12px; padding: 16px; border: 1px solid var(--line); border-radius: 16px; background: color-mix(in srgb, var(--surface) 82%, transparent); backdrop-filter: blur(14px); }
.one15-upload-hero-status > span { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 13px; color: #0ba785; background: color-mix(in srgb, #10b996 14%, transparent); }
.one15-upload-hero-status.warning > span { color: #e19a24; background: color-mix(in srgb, #e9a52e 14%, transparent); }
.one15-upload-hero-status .ui-icon { width: 23px; height: 23px; }
.one15-upload-hero-status small, .one15-upload-hero-status p { color: var(--muted); }
.one15-upload-hero-status strong { display: block; margin: 2px 0 3px; font-size: 15px; }
.one15-upload-hero-status p { margin: 0; font-size: 14px; overflow-wrap: anywhere; }
.one15-upload-hero-status .button { grid-column: 1 / -1; }
.one15-upload-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 13px; border: 1px solid var(--line); border-radius: 15px; background: var(--surface); box-shadow: var(--shadow-soft); }
.one15-upload-toolbar > div { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.one15-upload-toolbar .button { min-height: 36px; }
.one15-upload-toolbar b { color: var(--muted); font-size: 14px; font-weight: 650; }
.one15-upload-toolbar b[data-tone="success"] { color: #10a77f; }.one15-upload-toolbar b[data-tone="error"] { color: var(--danger); }
.one15-live-dot { width: 8px; height: 8px; border-radius: 50%; background: #15b98b; box-shadow: 0 0 0 5px color-mix(in srgb, #15b98b 14%, transparent); animation: one15Pulse 2s ease-in-out infinite; }
@keyframes one15Pulse { 50% { box-shadow: 0 0 0 9px transparent; } }
.one15-source-strip { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 10px; }
.one15-source-empty, .one15-source-card { min-height: 102px; display: flex; align-items: center; gap: 13px; padding: 15px; border: 1px dashed var(--line); border-radius: 15px; background: var(--surface-soft); }
.one15-source-empty > span, .one15-source-mark { width: 40px; height: 40px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 12px; color: var(--primary); background: var(--primary-soft); }
.one15-source-empty .ui-icon, .one15-source-mark .ui-icon { width: 20px; height: 20px; }
.one15-source-empty strong, .one15-source-empty small { display: block; }.one15-source-empty small { margin-top: 3px; color: var(--muted); }
.one15-source-card { position: relative; align-items: flex-start; border-style: solid; background: var(--surface); box-shadow: var(--shadow-soft); }
.one15-source-card.enabled { border-color: color-mix(in srgb, #13aa83 28%, var(--line)); }
.one15-source-copy { min-width: 0; flex: 1; }.one15-source-copy header { display: flex; align-items: center; gap: 7px; margin-bottom: 7px; }.one15-source-copy header strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.one15-source-copy header em { flex: 0 0 auto; padding: 2px 7px; border-radius: 999px; color: var(--muted); background: var(--surface-soft); font-size: 13px; font-style: normal; }.one15-source-card.enabled header em { color: #0d9d78; background: color-mix(in srgb, #10b98a 12%, transparent); }
.one15-source-copy p { display: flex; min-width: 0; gap: 6px; margin: 3px 0; color: var(--text-secondary); font-size: 14px; overflow-wrap: anywhere; }.one15-source-copy p span { color: var(--muted); }.one15-source-copy > small { display: block; margin-top: 7px; color: var(--muted); font-size: 13px; }.one15-source-copy > small.error { color: var(--danger); }
.one15-source-actions { display: flex; gap: 4px; }.one15-source-actions button { width: 30px; height: 30px; display: grid; place-items: center; border: 0; border-radius: 9px; color: var(--muted); background: transparent; cursor: pointer; }.one15-source-actions button:hover { color: var(--text); background: var(--surface-soft); }.one15-source-actions button.danger:hover { color: var(--danger); }.one15-source-actions .ui-icon { width: 15px; height: 15px; }
.one15-metric-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; }
.one15-metric { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); box-shadow: var(--shadow-soft); }
.one15-metric > span { width: 35px; height: 35px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 10px; color: var(--primary); background: var(--primary-soft); }.one15-metric .ui-icon { width: 17px; height: 17px; }.one15-metric small { display: block; color: var(--muted); font-size: 13px; }.one15-metric strong { display: block; margin-top: 1px; font-size: 20px; line-height: 1; }
.one15-progress-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }.one15-progress-card { padding: 15px; border: 1px solid var(--line); border-radius: 15px; background: var(--surface); box-shadow: var(--shadow-soft); }.one15-progress-card header { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: 9px; }.one15-progress-card header > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 11px; color: var(--primary); background: var(--primary-soft); }.one15-progress-card .ui-icon { width: 17px; height: 17px; }.one15-progress-card strong, .one15-progress-card small { display: block; }.one15-progress-card strong { font-size: 14px; }.one15-progress-card small { margin-top: 2px; color: var(--muted); font-size: 13px; }.one15-progress-card header b { color: var(--primary); font-size: 15px; }.one15-progress-track, .one15-row-progress { overflow: hidden; height: 5px; margin-top: 13px; border-radius: 999px; background: var(--surface-soft); }.one15-progress-track i, .one15-row-progress i { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--primary), color-mix(in srgb, #17c8b0 65%, var(--primary))); transition: width .35s ease; }
.one15-panel { overflow: hidden; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); box-shadow: var(--shadow-soft); }.one15-panel > header { min-height: 68px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 16px; border-bottom: 1px solid var(--line); }.one15-panel > header > div:first-child { display: flex; align-items: center; gap: 10px; }.one15-panel h3, .one15-panel p { margin: 0; }.one15-panel h3 { font-size: 14px; }.one15-panel p { margin-top: 3px; color: var(--muted); font-size: 14px; }.one15-panel-icon { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 11px; color: var(--primary); background: var(--primary-soft); }.one15-panel-icon .ui-icon { width: 18px; height: 18px; }
.one15-table-wrap { width: 100%; overflow-x: auto; }.one15-table { width: 100%; min-width: 820px; border-collapse: collapse; }.one15-table th { padding: 10px 14px; color: var(--muted); background: var(--surface-soft); font-size: 13px; font-weight: 700; text-align: left; white-space: nowrap; }.one15-table td { padding: 12px 14px; border-top: 1px solid var(--line); color: var(--text-secondary); font-size: 14px; vertical-align: middle; }.one15-file-cell { display: flex; align-items: center; gap: 9px; min-width: 220px; max-width: 420px; }.one15-file-cell > span { width: 31px; height: 31px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 9px; color: var(--primary); background: var(--primary-soft); }.one15-file-cell .ui-icon { width: 15px; height: 15px; }.one15-file-cell div { min-width: 0; }.one15-file-cell strong, .one15-file-cell small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.one15-file-cell strong { color: var(--text); font-size: 14px; }.one15-file-cell small { max-width: 360px; margin-top: 2px; color: var(--muted); font-size: 13px; }.one15-status { display: inline-flex; padding: 3px 7px; border-radius: 999px; color: var(--primary); background: var(--primary-soft); font-size: 13px; font-weight: 750; }.one15-status.completed { color: #0a9b75; background: color-mix(in srgb, #12b98a 13%, transparent); }.one15-status.failed { color: var(--danger); background: color-mix(in srgb, var(--danger) 12%, transparent); }.one15-status.uploading { color: #1d8de4; background: color-mix(in srgb, #218fe6 12%, transparent); }.one15-phase { display: block; max-width: 240px; margin-top: 4px; color: var(--muted); font-size: 13px; }.one15-phase.error { color: var(--danger); }.one15-row-progress { width: 92px; margin: 0 0 3px; }.one15-table-empty { min-height: 132px; display: flex; align-items: center; justify-content: center; gap: 7px; color: var(--muted); }.one15-table-empty .ui-icon { width: 18px; height: 18px; }.one15-sha1 { display: block; max-width: 150px; overflow: hidden; color: var(--muted); font-size: 13px; text-overflow: ellipsis; }
.one15-row-action { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 9px; color: var(--muted); background: var(--surface-soft); cursor: pointer; transition: border-color .18s ease, color .18s ease, background .18s ease; }.one15-row-action .ui-icon { width: 15px; height: 15px; }.one15-row-action.danger:hover { border-color: color-mix(in srgb, var(--danger) 35%, var(--line)); color: var(--danger); background: color-mix(in srgb, var(--danger) 8%, var(--surface)); }.one15-action-empty { display: inline-block; width: 32px; color: var(--muted); text-align: center; }
.one15-history-layout { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(270px, .45fr); gap: 10px; }.one15-chart-legend { display: flex; gap: 12px; color: var(--muted); font-size: 13px; }.one15-chart-legend span::before { content: ''; display: inline-block; width: 7px; height: 7px; margin-right: 5px; border-radius: 2px; background: var(--primary); }.one15-chart-legend .upload::before { background: #15b590; }.one15-chart-legend .failed::before { background: #e45d72; }.one15-week-chart { height: 180px; display: grid; grid-template-columns: repeat(7, 1fr); align-items: end; gap: 12px; padding: 20px 18px 14px; }.one15-day { height: 100%; display: grid; grid-template-rows: 1fr auto auto; align-items: end; gap: 4px; text-align: center; }.one15-day-bars { height: 100%; display: flex; align-items: end; justify-content: center; gap: 3px; border-bottom: 1px solid var(--line); }.one15-day-bars i { width: min(11px, 28%); min-height: 0; border-radius: 5px 5px 2px 2px; background: var(--primary); transition: height .35s ease; }.one15-day-bars i.upload { background: #15b590; }.one15-day-bars i.failed { background: #e45d72; }.one15-day strong { font-size: 13px; }.one15-day > span { color: var(--muted); font-size: 13px; }.one15-summary-panel dl { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin: 0; background: var(--line); }.one15-summary-panel dl div { min-height: 88px; display: flex; flex-direction: column; justify-content: center; padding: 15px; background: var(--surface); }.one15-summary-panel dt { color: var(--muted); font-size: 13px; }.one15-summary-panel dd { margin: 5px 0 0; color: var(--primary); font-size: 17px; font-weight: 800; }
.one15-history-actions { display: flex; align-items: center; gap: 8px; }.one15-history-actions label { min-width: 260px; display: flex; align-items: center; gap: 7px; padding: 0 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft); }.one15-history-actions label .ui-icon { width: 14px; height: 14px; color: var(--muted); }.one15-history-actions input { width: 100%; min-height: 34px; padding: 0; border: 0; background: transparent; box-shadow: none; }.one15-pagination { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 11px 14px; border-top: 1px solid var(--line); color: var(--muted); font-size: 13px; }.one15-pagination div { display: flex; align-items: center; gap: 7px; }
.one15-upload-dialog { width: min(680px, calc(100vw - 28px)); }.one15-upload-dialog form { display: grid; gap: 16px; }.one15-option-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }.one15-option-grid .checkbox { margin: 0; padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-soft); }.one15-option-grid .checkbox.danger:has(input:checked) { border-color: color-mix(in srgb, var(--danger) 35%, var(--line)); background: color-mix(in srgb, var(--danger) 7%, var(--surface)); }.one15-thread-control { padding: 15px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-soft); }.one15-thread-control label { display: flex; justify-content: space-between; font-size: 14px; font-weight: 700; }.one15-thread-control label strong { color: var(--primary); font-size: 18px; }.one15-thread-control input { width: 100%; margin: 15px 0 4px; accent-color: var(--primary); }.one15-thread-control > div { display: flex; justify-content: space-between; color: var(--muted); font-size: 13px; }
.one15-webhook-dialog { width: min(650px, calc(100vw - 28px)); }.one15-webhook-body { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; padding: 18px 20px 4px; }.one15-webhook-body > *, .one15-webhook-body .field, .one15-webhook-body .copy-field { width: 100%; min-width: 0; }.one15-webhook-source { display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: center; gap: 12px; padding: 13px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-soft); }.one15-webhook-source > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 11px; color: var(--primary); background: var(--primary-soft); }.one15-webhook-source > span .ui-icon { width: 20px; height: 20px; }.one15-webhook-source small, .one15-webhook-source strong, .one15-webhook-source p { display: block; }.one15-webhook-source small { color: var(--muted); font-size: 12px; }.one15-webhook-source strong { margin-top: 2px; font-size: 15px; }.one15-webhook-source p { overflow: hidden; margin: 3px 0 0; color: var(--text-secondary); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }.one15-webhook-body .copy-field { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }.one15-webhook-body .copy-field input { width: 100%; min-width: 0; max-width: 100%; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 12px; }.one15-webhook-example { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 11px; padding: 14px; border: 1px solid color-mix(in srgb, var(--primary) 20%, var(--line)); border-radius: 12px; background: color-mix(in srgb, var(--primary-soft) 48%, var(--surface)); }.one15-webhook-example > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 10px; color: var(--primary); background: var(--surface); }.one15-webhook-example > span .ui-icon { width: 17px; height: 17px; }.one15-webhook-example strong { display: block; font-size: 14px; }.one15-webhook-example code { overflow: auto; display: block; max-width: 100%; margin-top: 8px; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--text); font-size: 12px; white-space: nowrap; }.one15-webhook-example small { display: block; margin-top: 8px; color: var(--muted); font-size: 12px; line-height: 1.6; }.one15-webhook-example small code { display: inline; margin: 0; padding: 2px 4px; white-space: normal; }
@media (max-width: 1180px) { .one15-metric-grid { grid-template-columns: repeat(3, 1fr); }.one15-progress-grid { grid-template-columns: repeat(2, 1fr); }.one15-history-layout { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .one15-upload-hero { grid-template-columns: 1fr; padding: 18px; }.one15-upload-toolbar, .one15-panel > header, .one15-pagination { align-items: stretch; flex-direction: column; }.one15-upload-toolbar > div, .one15-history-actions { width: 100%; }.one15-upload-toolbar .button { flex: 1; }.one15-metric-grid { grid-template-columns: repeat(2, 1fr); }.one15-progress-grid { grid-template-columns: 1fr; }.one15-history-actions { align-items: stretch; flex-direction: column; }.one15-history-actions label { min-width: 0; }.one15-option-grid, .one15-upload-dialog .form-grid.two { grid-template-columns: 1fr; }.one15-source-actions { flex-direction: column; justify-content: center; }.one15-source-actions button { width: 32px; height: 32px; }.one15-webhook-body { padding: 14px 14px 2px; }.one15-webhook-body .copy-field { grid-template-columns: 1fr; }.one15-webhook-body .copy-field .button { width: 100%; }.one15-webhook-example { grid-template-columns: 1fr; }.one15-webhook-example > span { display: none; }.one15-week-chart { gap: 6px; padding-inline: 10px; }.one15-day-bars i { width: 7px; } }

.member-cloud-hero { position: relative; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(310px, .72fr); align-items: center; gap: 20px; padding: 26px; border: 1px solid color-mix(in srgb, var(--primary) 24%, var(--line)); border-radius: 21px; background: radial-gradient(circle at 82% 2%, color-mix(in srgb, var(--primary) 24%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, var(--primary) 12%, var(--surface)), var(--surface) 56%, color-mix(in srgb, #00b7a8 8%, var(--surface))); box-shadow: var(--shadow); }
.member-cloud-hero > div:first-child > span, .member-cloud-panel > header > div > span, .member-cloud-sessions > header > div > span, .member-cloud-nodes > header > div > span { color: var(--primary); font-size: 13px; font-weight: 850; letter-spacing: .16em; }
.member-cloud-hero h2 { margin: 7px 0; font-size: clamp(27px, 3vw, 38px); letter-spacing: -.04em; }.member-cloud-hero > div:first-child > p { max-width: 720px; margin: 0; color: var(--muted); line-height: 1.7; }
.member-cloud-hero-badges { margin-top: 16px; display: flex; flex-wrap: wrap; gap: 7px; }.member-cloud-hero-badges span { display: inline-flex; align-items: center; gap: 6px; padding: 6px 9px; border: 1px solid color-mix(in srgb, var(--primary) 20%, var(--line)); border-radius: 999px; color: var(--text-secondary); background: color-mix(in srgb, var(--surface) 74%, transparent); font-size: 13px; font-weight: 750; }.member-cloud-hero-badges svg { width: 13px; height: 13px; color: var(--primary); }
.member-cloud-operation { position: relative; z-index: 1; padding: 17px; display: grid; grid-template-columns: 46px minmax(0, 1fr) auto; align-items: center; gap: 12px; border: 1px solid color-mix(in srgb, var(--success) 27%, var(--line)); border-radius: 16px; background: color-mix(in srgb, var(--surface) 84%, transparent); backdrop-filter: blur(16px); }.member-cloud-operation > span { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 13px; color: var(--success); background: var(--success-soft); }.member-cloud-operation > span svg { width: 23px; height: 23px; }.member-cloud-operation small, .member-cloud-operation p { color: var(--muted); }.member-cloud-operation strong { display: block; margin: 3px 0; font-size: 14px; }.member-cloud-operation p { margin: 0; font-size: 13px; line-height: 1.5; }.member-cloud-operation em { color: var(--success); font-size: 13px; font-style: normal; font-weight: 900; letter-spacing: .13em; }.member-cloud-operation.warning { border-color: color-mix(in srgb, #e6a62c 30%, var(--line)); }.member-cloud-operation.warning > span { color: #d7951f; background: color-mix(in srgb, #e6a62c 13%, var(--surface)); }.member-cloud-operation.warning em { color: #d7951f; }
.member-cloud-overview { margin-top: 13px; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 9px; }.member-cloud-overview article { min-width: 0; padding: 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); box-shadow: var(--shadow-soft); }.member-cloud-overview span, .member-cloud-overview p { color: var(--muted); font-size: 13px; }.member-cloud-overview strong { display: block; margin: 7px 0 3px; font-size: 22px; }.member-cloud-overview strong small { color: var(--muted); font-size: 14px; }.member-cloud-overview strong.textual { overflow: hidden; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }.member-cloud-overview p { overflow: hidden; margin: 0; text-overflow: ellipsis; white-space: nowrap; }
.member-cloud-cockpit { margin-top: 13px; display: grid; grid-template-columns: minmax(0, 1.18fr) minmax(340px, .82fr); gap: 13px; }.member-cloud-panel, .member-cloud-sessions, .member-cloud-config, .member-cloud-nodes { border: 1px solid var(--line); border-radius: 17px; background: var(--surface); box-shadow: var(--shadow-soft); }.member-cloud-panel { padding: 19px; }.member-cloud-panel > header, .member-cloud-sessions > header, .member-cloud-nodes > header { margin-bottom: 15px; display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }.member-cloud-panel h2, .member-cloud-sessions h2, .member-cloud-nodes h2 { margin: 4px 0 0; font-size: 17px; }.member-cloud-panel header p, .member-cloud-sessions header p, .member-cloud-nodes header p { margin: 4px 0 0; color: var(--muted); font-size: 13px; }.member-cloud-modes > header > b { color: var(--muted); font-size: 13px; font-weight: 650; white-space: nowrap; }
.member-cloud-modes > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }.member-cloud-mode-card { min-width: 0; padding: 11px; display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 9px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-soft); }.member-cloud-mode-card > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; color: var(--primary); background: var(--primary-soft); }.member-cloud-mode-card > span svg { width: 17px; height: 17px; }.member-cloud-mode-card header { display: flex; align-items: center; justify-content: space-between; gap: 6px; }.member-cloud-mode-card header strong { font-size: 14px; }.member-cloud-mode-card header b { color: var(--primary); font-size: 13px; }.member-cloud-mode-card p { overflow: hidden; margin: 3px 0 7px; display: -webkit-box; color: var(--muted); font-size: 12px; line-height: 1.5; text-overflow: ellipsis; white-space: normal; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }.member-cloud-mode-card div > div { height: 4px; overflow: hidden; border-radius: 99px; background: var(--line); }.member-cloud-mode-card div > div i { height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg, var(--primary), color-mix(in srgb, var(--primary) 55%, #27d5c3)); }.member-cloud-mode-card small { display: block; margin-top: 5px; color: var(--muted); font-size: 12px; }
.member-cloud-protection > header > svg { width: 24px; height: 24px; color: var(--primary); }.member-cloud-protection-metrics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }.member-cloud-protection-metrics article { padding: 13px; border-radius: 12px; background: var(--surface-soft); }.member-cloud-protection-metrics strong { display: block; color: var(--primary); font-size: 23px; }.member-cloud-protection-metrics span { display: block; margin-top: 2px; font-size: 13px; font-weight: 800; }.member-cloud-protection-metrics small { color: var(--muted); font-size: 12px; }
.member-cloud-flow { margin: 13px 0; padding: 11px; display: grid; grid-template-columns: 1fr 26px 1fr 26px 1fr 26px 1fr; align-items: center; gap: 4px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); }.member-cloud-flow > div { min-height: 66px; padding: 10px; display: grid; grid-template-columns: 32px 1fr; align-content: center; column-gap: 9px; border-radius: 11px; background: var(--surface-soft); }.member-cloud-flow > div > span { grid-row: 1 / 3; width: 32px; height: 32px; display: grid; place-items: center; border-radius: 9px; color: var(--primary); background: var(--primary-soft); }.member-cloud-flow > div svg { width: 16px; height: 16px; }.member-cloud-flow strong { font-size: 14px; }.member-cloud-flow small { color: var(--muted); font-size: 12px; }.member-cloud-flow > i { display: grid; place-items: center; color: var(--muted); }.member-cloud-flow > i svg { width: 15px; height: 15px; }
.member-cloud-sessions { padding: 19px; }.member-cloud-session-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }.member-cloud-session-grid > .designed-empty { grid-column: 1 / -1; }.member-cloud-session { min-width: 0; padding: 13px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-soft); }.member-cloud-session > header { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 9px; }.member-cloud-session > header > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; color: var(--success); background: var(--success-soft); }.member-cloud-session > header svg { width: 17px; height: 17px; }.member-cloud-session > header strong, .member-cloud-session > header small { overflow: hidden; display: block; text-overflow: ellipsis; white-space: nowrap; }.member-cloud-session > header strong { font-size: 14px; }.member-cloud-session > header small { margin-top: 2px; color: var(--muted); font-size: 12px; }.member-cloud-session dl { margin: 11px 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }.member-cloud-session dl div { min-width: 0; padding: 8px; border-radius: 9px; background: var(--surface); }.member-cloud-session dt { color: var(--muted); font-size: 12px; }.member-cloud-session dd { overflow: hidden; margin: 3px 0 0; font-size: 13px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }.member-cloud-session > footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; }.member-cloud-session > footer > span { display: inline-flex; align-items: center; gap: 4px; color: var(--muted); font-size: 12px; }.member-cloud-session > footer > span svg { width: 12px; height: 12px; }.member-cloud-session > footer .button { min-height: 30px; padding-inline: 9px; font-size: 13px; }
.member-cloud-playback-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 10px; }.member-cloud-playback-card { min-width: 0; padding: 10px; display: grid; grid-template-columns: 62px minmax(0, 1fr) auto; gap: 10px; align-items: stretch; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }.member-cloud-playback-poster { position: relative; min-height: 90px; overflow: hidden; display: grid; place-items: center; border-radius: 6px; color: var(--primary); background: var(--primary-soft); }.member-cloud-playback-poster img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }.member-cloud-playback-poster span { display: grid; place-items: center; }.member-cloud-playback-poster svg { width: 20px; height: 20px; }.member-cloud-playback-body { min-width: 0; display: grid; gap: 6px; }.member-cloud-playback-body > header { min-width: 0; display: flex; align-items: start; justify-content: space-between; gap: 8px; }.member-cloud-playback-body > header > div { min-width: 0; }.member-cloud-playback-body header strong, .member-cloud-playback-body header small, .member-cloud-playback-title strong, .member-cloud-playback-title span { overflow: hidden; display: block; text-overflow: ellipsis; white-space: nowrap; }.member-cloud-playback-body header strong { font-size: 13px; }.member-cloud-playback-body header small { margin-top: 2px; color: var(--muted); font-size: 12px; }.member-cloud-playback-body header .badge { flex: 0 0 auto; padding: 3px 6px; font-size: 12px; }.member-cloud-playback-title { min-width: 0; }.member-cloud-playback-title strong { font-size: 13px; }.member-cloud-playback-title span { margin-top: 2px; color: var(--muted); font-size: 12px; }.member-cloud-playback-meta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 8px; }.member-cloud-playback-meta span { overflow: hidden; display: flex; align-items: center; gap: 4px; color: var(--muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }.member-cloud-playback-meta svg { width: 12px; height: 12px; flex: 0 0 auto; color: var(--primary); }.member-cloud-playback-progress { display: flex; align-items: center; gap: 7px; }.member-cloud-playback-progress > div { height: 4px; min-width: 0; flex: 1; overflow: hidden; border-radius: 999px; background: var(--line); }.member-cloud-playback-progress > div > span { height: 100%; display: block; border-radius: inherit; background: var(--primary); }.member-cloud-playback-progress small { flex: 0 0 auto; color: var(--muted); font-size: 12px; white-space: nowrap; }.member-cloud-playback-card form { display: flex; align-items: start; }.member-cloud-playback-circuit { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid color-mix(in srgb, var(--danger) 35%, var(--line)); border-radius: 6px; color: var(--danger); background: color-mix(in srgb, var(--danger) 8%, var(--surface)); cursor: pointer; }.member-cloud-playback-circuit:hover { background: color-mix(in srgb, var(--danger) 17%, var(--surface)); }.member-cloud-playback-circuit:disabled { opacity: .42; cursor: not-allowed; }.member-cloud-playback-circuit svg { width: 15px; height: 15px; }
.member-cloud-config { margin-top: 13px; overflow: hidden; }.member-cloud-config > summary { padding: 15px 18px; display: grid; grid-template-columns: 40px minmax(0, 1fr) auto 18px; align-items: center; gap: 11px; cursor: pointer; list-style: none; }.member-cloud-config > summary::-webkit-details-marker { display: none; }.member-cloud-config > summary > span { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 11px; color: var(--primary); background: var(--primary-soft); }.member-cloud-config > summary > span svg { width: 20px; height: 20px; }.member-cloud-config > summary small { color: var(--primary); font-size: 12px; font-weight: 850; letter-spacing: .15em; }.member-cloud-config > summary strong { display: block; margin-top: 2px; font-size: 14px; }.member-cloud-config > summary p { margin: 2px 0 0; color: var(--muted); font-size: 13px; }.member-cloud-config > summary > i { display: grid; color: var(--muted); transition: transform .2s ease; }.member-cloud-config > summary > i svg { width: 17px; height: 17px; }.member-cloud-config[open] > summary > i { transform: rotate(180deg); }.member-cloud-config-body { padding: 0 18px 18px; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(310px, .65fr); gap: 13px; border-top: 1px solid var(--line); }.member-cloud-settings, .member-cloud-sla { padding-top: 18px; }.member-cloud-settings > form { display: grid; gap: 15px; }.member-cloud-enable { position: relative; padding: 13px; display: flex; align-items: center; gap: 11px; border: 1px solid color-mix(in srgb, var(--primary) 20%, var(--line)); border-radius: 12px; background: color-mix(in srgb, var(--primary-soft) 35%, var(--surface)); }.member-cloud-enable > input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }.member-cloud-enable > span:last-child { display: grid; gap: 3px; }.member-cloud-enable small { color: var(--muted); font-size: 13px; }
.member-cloud-balance-select { position: relative; min-width: 0; }.member-cloud-balance-trigger, .member-cloud-balance-menu { display: none; }.member-cloud-balance-select.is-enhanced > select { position: absolute; width: 1px; height: 1px; min-height: 0; margin: 0; padding: 0; overflow: hidden; border: 0; opacity: 0; pointer-events: none; clip-path: inset(50%); }.member-cloud-balance-select.is-enhanced .member-cloud-balance-trigger { width: 100%; min-height: 52px; padding: 7px 11px; display: grid; grid-template-columns: 34px minmax(0, 1fr) 18px; align-items: center; gap: 10px; border: 1px solid var(--ui-input); border-radius: 11px; color: var(--text); background: var(--ui-background); box-shadow: var(--ui-shadow-xs); cursor: pointer; text-align: left; transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease; }.member-cloud-balance-select.is-enhanced .member-cloud-balance-trigger:hover { border-color: color-mix(in srgb, var(--primary) 42%, var(--ui-input)); background: color-mix(in srgb, var(--primary-soft) 18%, var(--ui-background)); }.member-cloud-balance-select.is-enhanced .member-cloud-balance-trigger:focus-visible, .member-cloud-balance-select.is-open .member-cloud-balance-trigger { outline: 0; border-color: var(--ui-ring-color); box-shadow: var(--ui-ring); }.member-cloud-balance-icon, .member-cloud-balance-option-icon { display: grid; place-items: center; color: var(--primary); background: var(--primary-soft); }.member-cloud-balance-icon { width: 34px; height: 34px; border-radius: 9px; }.member-cloud-balance-icon svg, .member-cloud-balance-option-icon svg { width: 17px; height: 17px; }.member-cloud-balance-copy { min-width: 0; display: grid; gap: 2px; }.member-cloud-balance-copy strong { overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }.member-cloud-balance-copy small { overflow: hidden; color: var(--muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }.member-cloud-balance-chevron { display: grid; place-items: center; color: var(--muted); transition: color .16s ease, transform .2s ease; }.member-cloud-balance-chevron svg { width: 16px; height: 16px; }.member-cloud-balance-select.is-open .member-cloud-balance-chevron { color: var(--primary); transform: rotate(180deg); }.member-cloud-balance-select.is-enhanced .member-cloud-balance-menu { position: absolute; z-index: 40; top: calc(100% + 7px); left: 0; width: 100%; padding: 6px; display: grid; gap: 3px; border: 1px solid color-mix(in srgb, var(--primary) 34%, var(--line)); border-radius: 12px; background: color-mix(in srgb, var(--surface) 96%, var(--bg-primary)); box-shadow: 0 18px 44px rgba(0,0,0,.34), 0 0 0 1px color-mix(in srgb, var(--primary) 8%, transparent); animation: memberCloudSelectIn .14s ease-out; }.member-cloud-balance-select.is-enhanced .member-cloud-balance-menu[hidden] { display: none; }.member-cloud-balance-select.is-open { z-index: 30; }.member-cloud-balance-menu [role="option"] { width: 100%; min-height: 52px; padding: 7px 9px; display: grid; grid-template-columns: 32px minmax(0, 1fr) 17px; align-items: center; gap: 10px; border: 1px solid transparent; border-radius: 9px; color: var(--text); background: transparent; cursor: pointer; text-align: left; transition: border-color .14s ease, background-color .14s ease, color .14s ease; }.member-cloud-balance-menu [role="option"]:hover, .member-cloud-balance-menu [role="option"]:focus-visible { outline: 0; border-color: color-mix(in srgb, var(--primary) 24%, transparent); background: color-mix(in srgb, var(--primary-soft) 54%, var(--surface)); }.member-cloud-balance-menu [role="option"][aria-selected="true"] { border-color: color-mix(in srgb, var(--primary) 30%, transparent); background: color-mix(in srgb, var(--primary-soft) 72%, var(--surface)); }.member-cloud-balance-option-icon { width: 32px; height: 32px; border-radius: 9px; }.member-cloud-balance-menu [role="option"] > span:nth-child(2) { min-width: 0; display: grid; gap: 2px; }.member-cloud-balance-menu [role="option"] strong { font-size: 14px; }.member-cloud-balance-menu [role="option"] small { color: var(--muted); font-size: 12px; }.member-cloud-balance-menu [role="option"] > i { display: grid; place-items: center; color: transparent; }.member-cloud-balance-menu [role="option"] > i svg { width: 15px; height: 15px; }.member-cloud-balance-menu [role="option"][aria-selected="true"] > i { color: var(--primary); }.member-cloud-balance-menu [role="option"][aria-selected="true"] .member-cloud-balance-option-icon { color: white; background: var(--primary); box-shadow: 0 5px 14px color-mix(in srgb, var(--primary) 28%, transparent); }@keyframes memberCloudSelectIn { from { opacity: 0; transform: translateY(-5px) scale(.99); } to { opacity: 1; transform: translateY(0) scale(1); } }
.member-cloud-sla { padding-left: 18px; border-left: 1px solid var(--line); }.member-cloud-sla > header { display: flex; align-items: center; gap: 11px; }.member-cloud-sla > header > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; color: var(--primary); background: var(--primary-soft); }.member-cloud-sla > header svg { width: 21px; height: 21px; }.member-cloud-sla header small { color: var(--primary); font-size: 12px; font-weight: 850; letter-spacing: .13em; }.member-cloud-sla header h2 { margin-top: 3px; font-size: 15px; }.member-cloud-sla ol { margin: 15px 0 0; padding: 0; display: grid; gap: 9px; list-style: none; }.member-cloud-sla li { display: grid; grid-template-columns: 25px 1fr; gap: 9px; }.member-cloud-sla li > span { width: 25px; height: 25px; display: grid; place-items: center; border-radius: 8px; color: var(--primary); background: var(--primary-soft); font-size: 13px; font-weight: 850; }.member-cloud-sla li strong { font-size: 13px; }.member-cloud-sla li p { margin: 2px 0 0; color: var(--muted); font-size: 13px; line-height: 1.5; }.member-cloud-sla-note { margin: 14px 0 0; padding: 11px; border-radius: 10px; color: #a9710f; background: color-mix(in srgb, #eaa72c 12%, var(--surface)); font-size: 13px; line-height: 1.55; }
.member-cloud-nodes { margin-top: 13px; padding: 19px; }.member-cloud-node-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }.member-cloud-node-grid > .designed-empty { grid-column: 1 / -1; }.member-cloud-node-card { min-width: 0; padding: 14px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-soft); }.member-cloud-node-card.disabled { opacity: .62; }.member-cloud-node-card > header { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: 9px; }.member-cloud-node-card > header > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; color: var(--primary); background: var(--primary-soft); }.member-cloud-node-card > header svg { width: 19px; height: 19px; }.member-cloud-node-card h3, .member-cloud-node-card header p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.member-cloud-node-card h3 { margin: 0; font-size: 14px; }.member-cloud-node-card header p { margin: 3px 0 0; color: var(--muted); font-size: 12px; }.member-cloud-node-card header em { font-style: normal; white-space: nowrap; }.member-cloud-node-load { margin-top: 12px; display: flex; align-items: center; gap: 8px; }.member-cloud-node-load > span { height: 4px; flex: 1; overflow: hidden; border-radius: 99px; background: var(--line); }.member-cloud-node-load i { height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg, var(--primary), var(--success)); }.member-cloud-node-load small { color: var(--muted); font-size: 12px; white-space: nowrap; }.member-cloud-node-metrics { margin: 9px 0 11px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; }.member-cloud-node-metrics span { min-width: 0; padding: 7px; display: grid; gap: 3px; border-radius: 8px; background: var(--surface); }.member-cloud-node-metrics small { color: var(--muted); font-size: 12px; }.member-cloud-node-metrics strong { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }.member-cloud-node-error { margin: 0 0 10px; color: var(--danger); font-size: 12px; line-height: 1.5; }.member-cloud-node-error svg { width: 12px; height: 12px; vertical-align: -2px; }.member-cloud-node-card > footer { display: flex; flex-wrap: wrap; gap: 5px; }.member-cloud-node-card > footer form, .member-cloud-node-card > footer > button { flex: 1; }.member-cloud-node-card > footer .button { width: 100%; min-height: 31px; padding-inline: 8px; font-size: 13px; }
.member-cloud-node-storage { margin: 10px 0; padding: 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }.member-cloud-node-storage > header { display: flex; align-items: end; justify-content: space-between; gap: 9px; }.member-cloud-node-storage > header span { min-width: 0; display: grid; gap: 2px; }.member-cloud-node-storage small { color: var(--muted); font-size: 12px; }.member-cloud-node-storage strong { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }.member-cloud-node-storage > header b { color: var(--primary); font-size: 14px; }.member-cloud-node-storage > div { height: 5px; margin: 8px 0 7px; overflow: hidden; border-radius: 99px; background: var(--line); }.member-cloud-node-storage > div i { height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg, var(--success), var(--primary)); }.member-cloud-node-storage > footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 8px; color: var(--muted); font-size: 12px; }.member-cloud-node-storage > footer em { padding: 3px 6px; border-radius: 99px; color: var(--primary); background: var(--primary-soft); font-style: normal; font-weight: 800; }.member-cloud-node-storage.warning > header b { color: #d89218; }.member-cloud-node-storage.warning > div i { background: linear-gradient(90deg, #efb43f, #dd7b17); }.member-cloud-node-storage.danger > header b { color: var(--danger); }.member-cloud-node-storage.danger > div i { background: linear-gradient(90deg, #ff9b5a, var(--danger)); }.member-cloud-node-storage.muted > div i { width: 0 !important; }
.member-cloud-node-dialog { width: min(860px, calc(100vw - 28px)); }.member-cloud-node-dialog > form { display: grid; }.member-cloud-node-dialog-body { padding: 20px; display: grid; grid-template-columns: 250px 1fr; gap: 18px; }.member-cloud-node-qr { padding: 16px; display: grid; justify-items: center; align-content: start; gap: 10px; border: 1px dashed color-mix(in srgb, var(--primary) 34%, var(--line)); border-radius: 14px; background: color-mix(in srgb, var(--primary-soft) 30%, var(--surface)); }.member-cloud-node-qr .one15-client-select { width: 100%; }.member-cloud-node-qr .one15-qr { width: 150px; height: 150px; }.member-cloud-node-qr > strong { text-align: center; font-size: 14px; }.member-cloud-node-qr > strong.success { color: var(--success); }.member-cloud-node-qr > strong.error { color: var(--danger); }.member-cloud-node-fields { display: grid; align-content: start; gap: 13px; }
.member-cloud-cleanup-dialog { width: min(760px, calc(100vw - 28px)); }.member-cloud-cleanup-dialog > form { display: grid; }.member-cloud-cleanup-body { padding: 20px; display: grid; gap: 15px; }.member-cloud-cleanup-body .member-cloud-enable.is-disabled { opacity: .68; }.member-cloud-cleanup-scope { min-height: 70px; padding: 11px; display: flex; align-items: center; gap: 10px; border: 1px solid color-mix(in srgb, var(--success) 28%, var(--line)); border-radius: 11px; background: color-mix(in srgb, var(--success-soft) 45%, var(--surface)); }.member-cloud-cleanup-scope > span { width: 36px; height: 36px; display: grid; flex: 0 0 auto; place-items: center; border-radius: 10px; color: var(--success); background: var(--surface); }.member-cloud-cleanup-scope svg { width: 18px; height: 18px; }.member-cloud-cleanup-scope b, .member-cloud-cleanup-scope small { display: block; }.member-cloud-cleanup-scope b { font-size: 13px; }.member-cloud-cleanup-scope small { margin-top: 3px; color: var(--muted); font-size: 12px; line-height: 1.5; }.member-cloud-cleanup-now { padding: 14px 20px; display: flex !important; align-items: center; justify-content: space-between; gap: 14px; border-top: 1px solid var(--line); background: color-mix(in srgb, var(--danger) 7%, var(--surface)); }.member-cloud-cleanup-now span { min-width: 0; display: grid; gap: 3px; }.member-cloud-cleanup-now b { font-size: 13px; }.member-cloud-cleanup-now small { color: var(--muted); font-size: 12px; }.member-cloud-cleanup-now .button { flex: 0 0 auto; }
.member-cloud-config:not([open]) > .member-cloud-config-body { display: none; }
@media (max-width: 1200px) { .member-cloud-overview { grid-template-columns: repeat(3, minmax(0, 1fr)); }.member-cloud-cockpit { grid-template-columns: 1fr; }.member-cloud-session-grid, .member-cloud-node-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 900px) { .member-cloud-config-body { grid-template-columns: 1fr; }.member-cloud-sla { padding-left: 0; border-top: 1px solid var(--line); border-left: 0; } }
@media (max-width: 760px) { .member-cloud-hero { grid-template-columns: 1fr; padding: 19px; }.member-cloud-operation { grid-template-columns: 42px 1fr; }.member-cloud-operation > em { grid-column: 2; }.member-cloud-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); }.member-cloud-flow { grid-template-columns: 1fr; }.member-cloud-flow > i { transform: rotate(90deg); }.member-cloud-panel, .member-cloud-sessions, .member-cloud-nodes { padding: 16px; }.member-cloud-panel > header, .member-cloud-sessions > header, .member-cloud-nodes > header { align-items: stretch; flex-direction: column; }.member-cloud-nodes > header .button { width: 100%; }.member-cloud-session-grid, .member-cloud-node-grid, .member-cloud-node-dialog-body { grid-template-columns: 1fr; }.member-cloud-node-qr { order: 2; }.member-cloud-node-metrics { grid-template-columns: repeat(2, 1fr); }.member-cloud-config > summary { grid-template-columns: 38px minmax(0, 1fr) 18px; }.member-cloud-config > summary > em { grid-column: 2; justify-self: start; }.member-cloud-config > summary > i { grid-column: 3; grid-row: 1 / 3; }.member-cloud-config-body { padding-inline: 15px; }.member-cloud-cleanup-now { align-items: stretch; flex-direction: column; }.member-cloud-cleanup-now .button { width: 100%; } }
@media (max-width: 480px) { .member-cloud-overview { grid-template-columns: 1fr 1fr; }.member-cloud-overview article { padding: 12px; }.member-cloud-modes > div, .member-cloud-protection-metrics, .member-cloud-playback-grid { grid-template-columns: 1fr; }.member-cloud-hero-badges span { flex: 1 1 auto; justify-content: center; }.member-cloud-session > header, .member-cloud-node-card > header { grid-template-columns: 38px 1fr; }.member-cloud-session > header em, .member-cloud-node-card > header em { grid-column: 2; justify-self: start; }.member-cloud-session > footer { align-items: stretch; flex-direction: column; }.member-cloud-session > footer form, .member-cloud-session > footer .button { width: 100%; } }
.file-download { min-height: 38px; white-space: nowrap; }
.file-preview-head { padding: 20px; display: flex; align-items: center; gap: 14px; border-bottom: 1px solid var(--line); }
.file-preview-head h2 { font-size: 17px; }
.file-preview-head p { margin: 5px 0 0; color: var(--muted); font-size: 14px; }
.file-preview { max-height: calc(100vh - 310px); min-height: 360px; margin: 0; padding: 20px; overflow: auto; color: var(--text); background: color-mix(in srgb, var(--surface-soft) 72%, var(--surface)); font: 14px/1.7 ui-monospace, SFMono-Regular, Consolas, monospace; white-space: pre-wrap; word-break: break-word; }
.file-no-preview { min-height: 360px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.file-no-preview h3 { margin-top: 15px; }
.file-no-preview p { margin: 7px 0 0; color: var(--muted); }
.main { min-width: 0; padding: var(--page-gutter); }
.content { width: 100%; max-width: var(--page-content-width); margin: 0; }

/* Navigation stays immediate. A thin progress line acknowledges genuinely slow
   requests without fading or stacking two full pages. */
.route-progress { position: fixed; inset: 0 0 auto; z-index: 500; height: 3px; overflow: hidden; opacity: 0; pointer-events: none; transition: opacity .1s linear; }
.route-progress > span { width: 100%; height: 100%; display: block; transform: scaleX(.04); transform-origin: left center; background: linear-gradient(90deg, var(--primary), var(--accent-secondary)); box-shadow: 0 0 10px color-mix(in srgb, var(--primary) 62%, transparent); }
body.is-route-pending .route-progress { opacity: 1; }
body.is-route-pending .route-progress > span { animation: route-progress-fill 1.5s cubic-bezier(.12, .72, .18, 1) forwards; }
@keyframes route-progress-fill { 0% { transform: scaleX(.04); } 30% { transform: scaleX(.48); } 62% { transform: scaleX(.72); } 100% { transform: scaleX(.9); } }
@media (prefers-reduced-motion: reduce) {
  .route-progress, .route-progress > span { animation: none !important; transition: none !important; }
  body.is-route-pending .route-progress > span { transform: scaleX(.72); }
}
.ui-motion-popover { transform-origin: top center; }
.system-dropdown.ui-motion-popover, .account-dropdown.ui-motion-popover { transform-origin: top right; }
.theme-menu.ui-motion-popover { transform-origin: bottom center; }
.ui-select-menu.opens-upward.ui-motion-popover { transform-origin: bottom center; }
.ui-motion-popover.is-opening:not(.mobile-nav-popover) { animation: ui-popover-enter .2s cubic-bezier(.16, 1, .3, 1) both; }
.ui-motion-popover.is-closing:not(.mobile-nav-popover) { pointer-events: none; animation: ui-popover-exit .15s cubic-bezier(.4, 0, 1, 1) both; }
.theme-menu.ui-motion-popover.is-opening, .ui-select-menu.opens-upward.ui-motion-popover.is-opening { animation-name: ui-popover-up-enter; }
.theme-menu.ui-motion-popover.is-closing, .ui-select-menu.opens-upward.ui-motion-popover.is-closing { animation-name: ui-popover-up-exit; }
@keyframes ui-popover-enter { from { opacity: 0; transform: translateY(-6px) scale(.94); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes ui-popover-exit { from { opacity: 1; transform: translateY(0) scale(1); } to { opacity: 0; transform: translateY(-4px) scale(.96); } }
@keyframes ui-popover-up-enter { from { opacity: 0; transform: translateY(6px) scale(.94); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes ui-popover-up-exit { from { opacity: 1; transform: translateY(0) scale(1); } to { opacity: 0; transform: translateY(4px) scale(.96); } }
.mobile-topbar { display: none; }
.mobile-brand-name { font-size: 15px; font-weight: 780; letter-spacing: -.035em; }
.page-head { width: 100%; max-width: var(--page-content-width); min-height: 64px; display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin: 0 0 22px; }
.eyebrow { color: var(--primary); font-weight: 750; font-size: 13px; margin-bottom: 7px; letter-spacing: .08em; text-transform: uppercase; }
h1 { font-size: clamp(24px, 2vw, 30px); font-weight: 720; letter-spacing: -.035em; line-height: 1.16; margin: 0 0 7px; }
h2 { font-size: 17px; margin: 0; }
h3 { font-size: 14px; margin: 0; }
p { line-height: 1.65; }
.page-description { max-width: 760px; margin: 0; color: var(--ui-muted-foreground); font-size: 14px; }
.head-actions { display: flex; align-items: center; gap: 10px; }
.top-tools { display: flex; align-items: center; gap: 10px; }
.tool-icon { --tool-icon-accent: var(--primary); position: relative; width: var(--ui-control-md); height: var(--ui-control-md); padding: 0; display: grid; place-items: center; overflow: hidden; border: 1px solid color-mix(in srgb, var(--tool-icon-accent) 24%, var(--ui-border)); border-radius: 11px; background: color-mix(in srgb, var(--tool-icon-accent) 7%, var(--ui-card)); color: color-mix(in srgb, var(--tool-icon-accent) 52%, var(--ui-foreground)); cursor: pointer; box-shadow: inset 0 1px 0 rgba(255,255,255,.07), var(--ui-shadow-xs); transition: color .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease; }
.tool-icon-search { --tool-icon-accent: var(--primary); }
.tool-icon-speed { --tool-icon-accent: var(--warning); }
.tool-icon-settings { --tool-icon-accent: var(--success); }
.tool-icon:hover { color: var(--tool-icon-accent); background: color-mix(in srgb, var(--tool-icon-accent) 14%, var(--ui-card)); border-color: color-mix(in srgb, var(--tool-icon-accent) 48%, var(--ui-border)); box-shadow: 0 7px 16px color-mix(in srgb, var(--tool-icon-accent) 15%, transparent), inset 0 1px 0 rgba(255,255,255,.1); transform: translateY(-1px); }
.tool-icon:active { transform: scale(.96); }
.tool-icon:focus-visible { outline: none; border-color: var(--primary); box-shadow: var(--ui-ring); }
.tool-icon svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.tool-dialog { width: min(520px, calc(100vw - 30px)); max-height: calc(100dvh - 32px); padding: 0; overflow: hidden; color: var(--ui-popover-foreground); background: var(--ui-popover); border: 1px solid var(--ui-border); border-radius: var(--ui-radius-xl); box-shadow: var(--ui-shadow-lg); }
.tool-dialog[open] { display: flex; flex-direction: column; }
.tool-dialog.is-opening { animation: ui-dialog-enter .2s cubic-bezier(.16, 1, .3, 1) both; }
.tool-dialog.is-closing { pointer-events: none; animation: ui-dialog-exit .15s cubic-bezier(.4, 0, 1, 1) both; }
.tool-dialog::backdrop { background: var(--ui-overlay); backdrop-filter: blur(3px); }
@keyframes ui-dialog-enter { from { opacity: 0; transform: translateY(10px) scale(.94); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes ui-dialog-exit { from { opacity: 1; transform: translateY(0) scale(1); } to { opacity: 0; transform: translateY(7px) scale(.96); } }
.tool-dialog.is-opening::backdrop { animation: ui-overlay-enter .2s ease-out both; }
.tool-dialog.is-closing::backdrop { animation: ui-overlay-exit .15s ease-in both; }
@keyframes ui-overlay-enter { from { opacity: 0; } to { opacity: 1; } }
@keyframes ui-overlay-exit { from { opacity: 1; } to { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  .ui-motion-popover, .tool-dialog, .tool-dialog::backdrop, .mobile-nav-scrim, .mobile-nav-sheet { animation: none !important; transition: none !important; }
}
.app-confirm-dialog { width: min(440px, calc(100vw - 24px)); max-height: calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); }
.app-confirm-shell { position: relative; padding: 24px; display: grid; gap: 18px; }
.app-confirm-close { position: absolute; z-index: 1; top: 12px; right: 12px; width: 34px; height: 34px; padding: 0; display: grid; place-items: center; border: 0; border-radius: 9px; color: var(--muted); background: transparent; cursor: pointer; }
.app-confirm-close:hover { color: var(--text); background: var(--surface-soft); }
.app-confirm-close:focus-visible { outline: none; box-shadow: var(--ui-ring); }
.app-confirm-close .ui-icon { width: 18px; height: 18px; }
.app-confirm-main { padding-right: 26px; display: grid; grid-template-columns: 48px minmax(0, 1fr); align-items: center; gap: 15px; }
.app-confirm-icon { width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid color-mix(in srgb, var(--danger) 28%, var(--line)); border-radius: 12px; color: var(--danger); background: color-mix(in srgb, var(--danger) 10%, var(--surface)); }
.app-confirm-icon .ui-icon { width: 24px; height: 24px; }
.app-confirm-copy { min-width: 0; }
.app-confirm-copy > span { display: block; margin-bottom: 4px; color: var(--danger); font-size: 12px; font-weight: 800; letter-spacing: 0; }
.app-confirm-copy h2 { margin: 0; font-size: 19px; line-height: 1.3; }
.app-confirm-copy p { margin: 6px 0 0; color: var(--muted); font-size: 14px; line-height: 1.6; overflow-wrap: anywhere; white-space: pre-line; }
.app-confirm-input { display: grid; gap: 7px; }
.app-confirm-input[hidden] { display: none; }
.app-confirm-input > span { color: var(--muted); font-size: 13px; font-weight: 700; }
.app-confirm-input input { width: 100%; min-height: 42px; }
.app-confirm-notice { padding: 11px 12px; display: grid; grid-template-columns: 20px minmax(0, 1fr); align-items: start; gap: 9px; border: 1px solid color-mix(in srgb, var(--danger) 18%, var(--line)); border-radius: 10px; color: var(--muted); background: color-mix(in srgb, var(--danger) 5%, var(--surface-soft)); }
.app-confirm-notice[hidden] { display: none; }
.app-confirm-notice .ui-icon { width: 18px; height: 18px; margin-top: 2px; color: var(--danger); }
.app-confirm-notice p { margin: 0; font-size: 13px; line-height: 1.55; }
.app-confirm-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.app-confirm-actions.single { grid-template-columns: 1fr; }
.app-confirm-actions .button { width: 100%; min-height: 42px; margin: 0; justify-content: center; }
.app-confirm-actions .button[hidden] { display: none; }
.app-confirm-actions .button .ui-icon { width: 17px; height: 17px; }
.app-confirm-dialog[data-tone="default"] .app-confirm-icon { color: var(--primary); border-color: color-mix(in srgb, var(--primary) 28%, var(--line)); background: var(--primary-soft); }
.app-confirm-dialog[data-tone="default"] .app-confirm-copy > span, .app-confirm-dialog[data-tone="default"] .app-confirm-notice .ui-icon { color: var(--primary); }
.app-confirm-dialog[data-tone="default"] .app-confirm-notice { border-color: color-mix(in srgb, var(--primary) 18%, var(--line)); background: color-mix(in srgb, var(--primary) 5%, var(--surface-soft)); }
.dialog-head { flex: 0 0 auto; display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 18px 18px 15px; border-bottom: 1px solid var(--line); }
.dialog-head h2 { font-size: 16px; font-weight: 650; line-height: 1.25; }
.dialog-head p { margin: 5px 0 0; color: var(--muted); font-size: 14px; line-height: 1.5; }
.dialog-close { width: var(--ui-control-sm); height: var(--ui-control-sm); flex: 0 0 auto; margin-top: -5px; margin-right: -5px; border: 0; border-radius: var(--ui-radius-md); color: var(--muted); background: transparent; cursor: pointer; font-size: 20px; line-height: 1; }
.dialog-close:hover { color: var(--text); background: var(--surface-soft); }
.dialog-close:focus-visible { outline: none; box-shadow: var(--ui-ring); }
.tool-dialog > .info-list { padding: 4px 24px 18px; }
.quick-system { position: relative; }
.tool-icon.active { color: var(--accent-contrast); border-color: var(--tool-icon-accent); background: var(--tool-icon-accent); box-shadow: 0 7px 18px color-mix(in srgb, var(--tool-icon-accent) 24%, transparent); }
.system-dropdown { position: absolute; z-index: 80; top: calc(100% + 10px); right: 0; width: 218px; padding: 7px; border: 1px solid var(--ui-border); border-radius: var(--ui-radius-lg); background: var(--ui-popover); box-shadow: var(--ui-shadow-lg); }
.system-dropdown[hidden] { display: none; }
.system-dropdown form { margin: 0; }
.system-dropdown a, .system-dropdown button { width: 100%; min-height: 42px; padding: 0 10px; display: grid; grid-template-columns: 26px minmax(0, 1fr); align-items: center; gap: 9px; border: 0; border-radius: var(--ui-radius-md); color: var(--ui-popover-foreground); background: transparent; text-align: left; cursor: pointer; }
.system-dropdown a:hover, .system-dropdown button:hover { color: var(--ui-accent-foreground); background: var(--ui-accent); }
.system-dropdown strong { font-size: 14px; font-weight: 650; }
.system-menu-icon { width: 24px; display: grid; place-items: center; color: var(--icon-blue); font-size: 20px; font-weight: 700; }
.system-menu-icon.restart { color: var(--success); font-size: 25px; }
.system-menu-separator { height: 1px; margin: 7px 6px; background: var(--line); }
.system-dropdown button.danger { color: var(--danger); }
.system-dropdown button.danger:hover { color: var(--danger); background: color-mix(in srgb, var(--danger) 9%, var(--surface)); }
.account-menu { position: relative; }
.account-trigger { position: relative; width: var(--ui-control-md); height: var(--ui-control-md); padding: 2px; display: grid; place-items: center; border: 1px solid color-mix(in srgb, var(--primary) 32%, var(--ui-border)); border-radius: 12px; color: var(--text); background: linear-gradient(145deg, color-mix(in srgb, var(--primary) 14%, var(--ui-card)), var(--ui-card)); cursor: pointer; box-shadow: var(--ui-shadow-xs); transition: .18s ease; }
.account-trigger:hover, .account-trigger.active { border-color: color-mix(in srgb, var(--primary) 72%, var(--ui-border)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 12%, transparent), var(--ui-shadow-sm); transform: translateY(-1px); }
.account-trigger img { width: 30px; height: 30px; display: block; object-fit: cover; border-radius: 9px; background: var(--primary-soft); }
.account-trigger > span { position: absolute; right: -1px; bottom: -1px; width: 10px; height: 10px; border: 2px solid var(--bg); border-radius: 50%; background: var(--success); box-shadow: 0 0 8px color-mix(in srgb, var(--success) 60%, transparent); }
.account-dropdown { position: absolute; z-index: 82; top: calc(100% + 10px); right: 0; width: 246px; padding: 7px; border: 1px solid var(--ui-border); border-radius: var(--ui-radius-lg); background: var(--ui-popover); box-shadow: var(--ui-shadow-lg); }
.account-dropdown[hidden] { display: none; }
.account-dropdown form { margin: 0; }
.account-dropdown > a, .account-dropdown > button, .account-dropdown form button { width: 100%; min-height: 42px; padding: 0 10px; display: grid; grid-template-columns: 26px minmax(0, 1fr); align-items: center; gap: 9px; border: 0; border-radius: var(--ui-radius-md); color: var(--ui-popover-foreground); background: transparent; text-align: left; cursor: pointer; }
.account-dropdown > a:hover, .account-dropdown > button:hover, .account-dropdown form button:hover { color: var(--ui-accent-foreground); background: var(--ui-accent); }
.account-dropdown strong { font-size: 14px; font-weight: 650; }
.account-dropdown form button.danger { color: var(--danger); }
.account-dropdown-head { padding: 11px 10px 9px; display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: center; gap: 11px; }
.account-dropdown-head img { width: 42px; height: 42px; object-fit: cover; border: 1px solid color-mix(in srgb, var(--primary) 36%, var(--line)); border-radius: 12px; background: var(--primary-soft); }
.account-dropdown-head > div { min-width: 0; display: grid; gap: 3px; }
.account-dropdown-head strong, .account-dropdown-head small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.account-dropdown-head small { color: var(--muted); font-size: 13px; }
.account-settings-dialog { width: min(660px, calc(100vw - 30px)); }
.account-settings-dialog > form { overflow: auto; padding: 20px; }
.account-settings-identity { position: relative; min-height: 112px; margin-bottom: 18px; padding: 18px 20px; overflow: hidden; display: flex; align-items: center; gap: 16px; border: 1px solid color-mix(in srgb, var(--primary) 24%, var(--line)); border-radius: 15px; background: radial-gradient(circle at 92% 10%, color-mix(in srgb, var(--primary) 24%, transparent), transparent 42%), linear-gradient(135deg, color-mix(in srgb, var(--primary) 10%, var(--surface)), var(--surface-soft)); }
.account-avatar-control { position: relative; flex: 0 0 auto; }
.account-avatar-control > img { width: 72px; height: 72px; display: block; object-fit: cover; border: 2px solid color-mix(in srgb, white 35%, var(--primary)); border-radius: 20px; background: var(--primary-soft); box-shadow: 0 10px 28px color-mix(in srgb, var(--primary) 18%, transparent); }
.account-avatar-control > label { position: absolute; right: -5px; bottom: -5px; width: 30px; height: 30px; display: grid; place-items: center; border: 3px solid var(--surface); border-radius: 10px; color: white; background: var(--primary); cursor: pointer; box-shadow: var(--ui-shadow-sm); }
.account-avatar-control svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.account-settings-identity > div:last-child { min-width: 0; }
.account-settings-identity span { color: var(--primary); font-size: 13px; font-weight: 850; letter-spacing: .12em; }
.account-settings-identity h3 { margin: 4px 0 3px; font-size: 18px; }
.account-settings-identity p { margin: 0 0 7px; color: var(--muted); font-size: 13px; }
.account-remove-avatar { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: 13px; cursor: pointer; }
.account-remove-avatar input { width: 14px; height: 14px; min-height: 0; flex: 0 0 auto; margin: 0; accent-color: var(--primary); }
.account-settings-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.account-settings-fields > .field { align-content: start; }
.account-settings-fields > .field > input { height: var(--ui-control-md); }
.account-confirm-field { grid-column: 1 / -1; }
.account-settings-note { margin-top: 16px; padding: 11px 13px; display: grid; grid-template-columns: 28px minmax(0, 1fr); align-items: center; gap: 10px; border: 1px solid color-mix(in srgb, var(--primary) 18%, var(--line)); border-radius: 11px; background: color-mix(in srgb, var(--primary) 6%, var(--surface)); }
.account-settings-note > span { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 8px; color: var(--primary); background: var(--primary-soft); font-size: 13px; font-weight: 800; }
.account-settings-note p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.55; }
.account-settings-actions { padding-top: 18px; display: flex; justify-content: flex-end; gap: 10px; }
.restart-page { min-height: 100vh; display: grid; place-items: center; padding: 24px; background: var(--bg); }
.restart-panel { width: min(440px, 100%); padding: 42px 32px; display: grid; justify-items: center; text-align: center; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); box-shadow: var(--shadow); }
.restart-panel h1 { margin: 22px 0 6px; font-size: 22px; letter-spacing: 0; }
.restart-panel p { margin: 0; color: var(--muted); }
.restart-panel small { margin-top: 16px; color: var(--muted); }
.restart-spinner { width: 46px; height: 46px; border: 4px solid var(--primary-soft); border-top-color: var(--primary); border-radius: 50%; animation: restart-spin .8s linear infinite; }
@keyframes restart-spin { to { transform: rotate(360deg); } }
.tool-search { width: calc(100% - 48px); margin: 20px 24px 12px; min-height: 48px; }
.search-results { display: grid; padding: 0 16px 20px; }
.search-results > :is(a, button) { width: 100%; display: flex; align-items: center; gap: 13px; padding: 13px 10px; border: 0; border-radius: 10px; color: var(--text); background: transparent; text-align: left; cursor: pointer; }
.search-results > :is(a, button):hover { background: var(--primary-soft); color: var(--primary); }
.search-results > :is(a, button) > span { width: 34px; height: 34px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 9px; background: var(--surface-soft); }
.search-results > :is(a, button) div { display: grid; gap: 4px; }
.search-results small { color: var(--muted); }
.search-no-result { padding: 30px 10px; color: var(--muted); text-align: center; }
.network-dialog { width: min(680px, calc(100vw - 30px)); height: min(880px, calc(100dvh - 32px)); }
.system-diagnostics-dialog { width: min(1120px, calc(100vw - 28px)); height: min(900px, calc(100dvh - 28px)); max-height: calc(100dvh - 28px); }
.system-diagnostics-dialog-head { padding: 20px 22px 17px; }
.system-diagnostics-dialog-head .dialog-kicker { margin-bottom: 5px; color: var(--primary); font-size: 12px; font-weight: 900; letter-spacing: .14em; }
.system-diagnostics-dialog-head h2 { font-size: 20px; }
.system-diagnostics-dialog-body { min-height: 0; padding: 18px 20px 22px; flex: 1 1 auto; align-content: start; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.network-list { flex: 1 1 auto; min-height: 0; margin: 18px 22px 0; overflow-y: auto; overscroll-behavior: contain; border: 1px solid var(--line); border-radius: 13px; }
.network-row { min-height: 72px; padding: 10px 14px; display: grid; grid-template-columns: 46px minmax(0, 1fr) 44px; align-items: center; gap: 13px; border-top: 1px solid var(--line); }
.network-row:first-child { border-top: 0; }
.network-brand { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; color: var(--icon-teal); background: color-mix(in srgb, var(--icon-teal) 12%, var(--surface)); border: 2px solid color-mix(in srgb, currentColor 24%, var(--line)); font-size: 14px; font-weight: 800; }
.network-brand.tvdb { color: var(--success); background: var(--success-soft); }
.network-brand.fanart { color: var(--icon-sky); background: color-mix(in srgb, var(--icon-sky) 12%, var(--surface)); font-size: 24px; }
.network-brand.telegram { color: white; background: linear-gradient(145deg, #43b8ea, #168ed0); font-size: 23px; }
.network-brand.github { color: white; background: #6674df; }
.network-name { min-width: 0; display: grid; gap: 5px; }
.network-name strong { overflow-wrap: anywhere; font-size: 15px; font-weight: 600; }
.network-meta { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.network-status { width: max-content; padding: 3px 9px; border-radius: 99px; color: var(--muted); background: var(--surface-soft); font-size: 14px; }
.network-status.testing { color: var(--warning); background: color-mix(in srgb, var(--warning) 12%, var(--surface)); }
.network-status.success { color: var(--success); background: var(--success-soft); }
.network-status.failed { color: var(--danger); background: color-mix(in srgb, var(--danger) 10%, var(--surface)); }
.network-latency { color: var(--muted); font-size: 14px; text-align: right; white-space: nowrap; }
.network-test-button { width: 42px; height: 42px; display: grid; place-items: center; border: 0; border-radius: 50%; color: var(--primary); background: var(--primary-soft); cursor: pointer; }
.network-test-button:hover { color: white; background: var(--primary); }
.network-test-button:disabled { cursor: wait; opacity: .7; }
.network-test-button svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.network-row.testing .network-test-button svg { animation: network-spin 1s linear infinite; }
@keyframes network-spin { to { transform: rotate(360deg); } }
.network-footer { flex: 0 0 auto; padding: 16px 22px 20px; display: flex; align-items: center; justify-content: space-between; gap: 15px; background: var(--surface); }
.display-dialog { width: min(760px, calc(100vw - 30px)); overflow-y: auto; scrollbar-gutter: stable; }
.display-dialog .dialog-head { position: sticky; top: 0; z-index: 3; padding: 22px 24px 18px; background: var(--surface); }
.display-dialog .dialog-head h2 { font-size: 18px; }
.display-section { padding: 22px 24px 4px; }
.display-section:last-child { padding-bottom: 24px; }
.display-section-title { margin-bottom: 13px; display: flex; align-items: end; justify-content: space-between; gap: 16px; }
.display-section-title h3 { margin: 0; font-size: 14px; }
.display-section-title p { margin: 4px 0 0; color: var(--muted); font-size: 12px; }
.choice-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.choice-grid.two { grid-template-columns: repeat(2, 1fr); }
.choice-grid button { min-height: 70px; display: grid; place-items: center; gap: 5px; border: 1px solid var(--line); border-radius: 11px; color: var(--text); background: var(--surface-soft); cursor: pointer; font-size: 20px; }
.choice-grid button span { font-size: 14px; }
.choice-grid button:hover, .choice-grid button.active { color: var(--primary); border-color: var(--primary); background: var(--primary-soft); }
.theme-choice-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.choice-grid .theme-choice { position: relative; min-width: 0; min-height: 112px; padding: 8px; display: grid; grid-template-columns: minmax(132px, .82fr) minmax(0, 1fr); grid-template-rows: 1fr; place-items: stretch; align-items: center; gap: 12px; overflow: hidden; border-radius: 8px; color: var(--text); background: var(--surface); text-align: left; transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease; }
.choice-grid .theme-choice:hover { color: var(--text); border-color: color-mix(in srgb, var(--primary) 44%, var(--line)); background: var(--surface); box-shadow: var(--ui-shadow-sm); transform: translateY(-1px); }
.choice-grid .theme-choice.active { color: var(--text); border-color: var(--primary); background: var(--surface); box-shadow: 0 0 0 1px var(--primary), var(--ui-shadow-sm); }
.theme-preview { min-width: 0; height: 94px; display: grid !important; grid-template-columns: 31px minmax(0, 1fr); gap: 0 !important; overflow: hidden; border: 1px solid var(--preview-line); border-radius: 6px; background: var(--preview-bg); box-shadow: inset 0 1px rgba(255, 255, 255, .035); }
.theme-preview > i { display: grid; align-content: start; }
.theme-preview-sidebar { padding: 11px 7px; gap: 7px; border-right: 1px solid var(--preview-line); background: var(--preview-side); }
.theme-preview-sidebar b { width: 100%; height: 4px; border-radius: 2px; background: var(--preview-line); }
.theme-preview-sidebar b:first-child { height: 6px; margin-bottom: 3px; background: var(--preview-accent); }
.theme-preview-canvas { padding: 12px 11px; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: 8px 1fr; gap: 8px !important; background: var(--preview-bg); }
.theme-preview-canvas b { min-width: 0; border: 1px solid var(--preview-line); border-radius: 4px; background: var(--preview-card); }
.theme-preview-canvas b:first-child { grid-column: 1 / -1; width: 54%; border: 0; border-radius: 2px; background: var(--preview-accent); }
.theme-choice-copy { min-width: 0; padding: 0 3px 4px; display: grid !important; gap: 4px !important; }
.theme-choice-copy > strong { min-width: 0; display: flex; align-items: baseline; gap: 7px; color: var(--text); font-size: 14px; }
.theme-choice-copy > strong small { color: var(--muted); font-size: 12px; font-weight: 600; }
.theme-choice-copy > small { overflow: hidden; display: -webkit-box; color: var(--muted); font-size: 12px !important; white-space: normal; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.theme-choice-check { position: absolute; top: 14px; right: 14px; width: 20px; height: 20px; display: grid !important; place-items: center; border: 1px solid var(--line); border-radius: 50%; color: transparent; background: var(--surface); box-shadow: 0 2px 8px rgba(0, 0, 0, .18); }
.theme-choice-check .ui-icon { width: 13px; height: 13px; stroke-width: 3; }
.theme-choice.active .theme-choice-check { border-color: var(--primary); color: var(--accent-contrast); background: var(--primary); }
.display-density-section { padding-top: 24px; }
.density-choice-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.choice-grid.density-choice-grid button { min-height: 66px; padding: 10px 14px; grid-template-columns: 28px minmax(0, 1fr); place-items: center start; gap: 10px; border-radius: 8px; background: var(--surface); text-align: left; }
.density-choice-grid button > .ui-icon { width: 20px; height: 20px; color: var(--muted); }
.density-choice-grid button > span { display: grid; gap: 2px; }
.density-choice-grid button strong { color: var(--text); font-size: 13px; }
.density-choice-grid button small { color: var(--muted); font-size: 12px; }
.density-choice-grid button.active > .ui-icon { color: var(--primary); }
.density-choice-grid button:hover, .density-choice-grid button.active { background: var(--surface); }
@media (max-width: 680px) {
  .display-dialog .dialog-head { padding: 18px 18px 15px; }
  .display-section { padding: 18px 18px 2px; }
  .display-section:last-child { padding-bottom: 18px; }
  .theme-choice-grid { grid-template-columns: 1fr; }
  .choice-grid .theme-choice { grid-template-columns: minmax(128px, .8fr) minmax(0, 1fr); }
  .density-choice-grid { grid-template-columns: 1fr; }
}
.grid { display: grid; gap: 16px; }
.stats-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 16px; }
.profile-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.profile-command-center,
.profile-playback-panel,
.profile-device-panel,
.profile-library-overview,
.profile-runtime-panel,
.profile-shortcuts,
.profile-activity-panel,
.profile-account-panel { border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.profile-command-center { min-height: 104px; margin-bottom: 14px; padding: 18px 22px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.profile-device-panel { margin-bottom: 14px; overflow: hidden; }
.profile-device-panel > header { padding: 17px 20px; display: flex; align-items: center; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--line); }
.profile-device-panel > header h2 { margin-top: 3px; font-size: 16px; }
.profile-device-panel > header p { margin: 5px 0 0; color: var(--muted); font-size: 14px; }
.profile-device-mode { min-height: 27px; padding: 0 10px; display: inline-flex; align-items: center; gap: 7px; border-radius: 999px; color: var(--muted); background: var(--surface-soft); font-size: 13px; font-weight: 750; white-space: nowrap; }
.profile-device-mode i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.profile-device-mode.automatic { color: var(--success); background: var(--success-soft); }
.profile-device-mode.automatic i { box-shadow: 0 0 8px color-mix(in srgb, var(--success) 75%, transparent); }
.profile-device-mode.manual { color: var(--warning); background: color-mix(in srgb, var(--warning) 11%, var(--surface)); }
.profile-device-content { display: grid; grid-template-columns: minmax(280px, .78fr) minmax(0, 1.72fr); }
.profile-device-identity { min-width: 0; padding: 22px; display: flex; align-items: center; gap: 17px; border-right: 1px solid var(--line); background: radial-gradient(circle at 12% 8%, color-mix(in srgb, var(--primary) 10%, transparent), transparent 42%), var(--surface-soft); }
.profile-device-identity > div { min-width: 0; }
.profile-device-identity small, .profile-device-facts small { color: var(--muted); font-size: 13px; }
.profile-device-identity h3 { margin: 5px 0 6px; font-size: 21px; }
.profile-device-identity p { margin: 0; overflow: hidden; color: var(--muted); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.profile-device-glyph { position: relative; width: 58px; height: 58px; flex: 0 0 auto; padding: 10px 11px; display: grid; align-content: center; gap: 5px; border: 1px solid color-mix(in srgb, var(--primary) 34%, var(--line)); border-radius: 16px; background: linear-gradient(145deg, color-mix(in srgb, var(--primary) 17%, var(--surface)), color-mix(in srgb, #50c7db 8%, var(--surface))); box-shadow: inset 0 1px 0 color-mix(in srgb, white 13%, transparent), 0 10px 24px color-mix(in srgb, var(--primary) 12%, transparent); }
.profile-device-glyph::before { content: ''; position: absolute; width: 7px; height: 7px; right: 7px; top: 7px; border-radius: 50%; background: var(--success); box-shadow: 0 0 10px var(--success); }
.profile-device-glyph i { height: 4px; border-radius: 999px; background: color-mix(in srgb, var(--primary) 76%, white); box-shadow: 0 7px 0 color-mix(in srgb, #50c7db 62%, transparent); }
.profile-device-facts { min-width: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.profile-device-facts > div { min-width: 0; min-height: 112px; padding: 19px 18px; display: grid; align-content: center; gap: 6px; border-left: 1px solid var(--line); }
.profile-device-facts > div:first-child { border-left: 0; }
.profile-device-facts strong { overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.profile-device-facts span { color: color-mix(in srgb, var(--muted) 75%, transparent); font-size: 12px; }
.profile-identity { min-width: 0; display: flex; align-items: center; gap: 15px; }
.profile-identity img { width: 58px; height: 58px; flex: 0 0 auto; object-fit: cover; border: 1px solid color-mix(in srgb, var(--primary) 48%, var(--line)); border-radius: 8px; background: var(--primary-soft); }
.profile-identity > div { min-width: 0; }
.profile-identity span, .profile-section-kicker { color: var(--primary); font-size: 13px; font-weight: 800; letter-spacing: 0; }
.profile-identity h2 { margin: 4px 0; overflow: hidden; font-size: 21px; text-overflow: ellipsis; white-space: nowrap; }
.profile-identity p { margin: 0; color: var(--muted); font-size: 14px; }
.profile-health { flex: 0 0 auto; display: grid; justify-items: end; gap: 8px; }
.profile-health > span { padding: 6px 10px; display: inline-flex; align-items: center; gap: 7px; border-radius: 7px; font-size: 14px; font-weight: 750; }
.profile-health > span i, .profile-state-dot { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: currentColor; }
.profile-health .healthy { color: var(--success); background: var(--success-soft); }
.profile-health .attention { color: var(--warning); background: color-mix(in srgb, var(--warning) 11%, var(--surface)); }
.profile-health small { color: var(--muted); }
.profile-library-overview { margin-bottom: 14px; overflow: hidden; }
.profile-library-overview > header,
.profile-runtime-panel > header,
.profile-activity-panel > header { padding: 17px 20px; display: flex; align-items: center; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--line); }
.profile-library-overview header > div, .profile-runtime-panel header > div, .profile-activity-panel header > div { min-width: 0; }
.profile-library-overview h2, .profile-runtime-panel h2, .profile-shortcuts h2, .profile-activity-panel h2 { margin-top: 3px; font-size: 16px; }
.profile-library-overview header p { margin: 5px 0 0; color: var(--muted); font-size: 14px; }
.profile-library-overview header a, .profile-runtime-panel header a, .profile-activity-panel header a { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; color: var(--primary); font-size: 14px; font-weight: 700; }
.profile-library-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.profile-library-metrics > div { min-width: 0; min-height: 112px; padding: 19px 20px; display: grid; align-content: center; gap: 6px; border-right: 1px solid var(--line); }
.profile-library-metrics > div:last-child { border-right: 0; }
.profile-library-metrics span { color: var(--muted); font-size: 14px; font-weight: 700; }
.profile-library-metrics strong { overflow: hidden; color: var(--text); font-size: 28px; line-height: 1.05; text-overflow: ellipsis; }
.profile-library-metrics strong em { color: var(--muted); font-size: 15px; font-style: normal; font-weight: 650; }
.profile-library-metrics small { color: color-mix(in srgb, var(--muted) 78%, transparent); font-size: 13px; text-transform: uppercase; }
.profile-library-metrics > div:nth-child(1) strong { color: var(--icon-cyan); }
.profile-library-metrics > div:nth-child(2) strong { color: var(--success); }
.profile-library-metrics > div:nth-child(3) strong { color: var(--warning); }
.profile-server-list { padding: 0 20px; border-top: 1px solid var(--line); background: color-mix(in srgb, var(--surface-soft) 46%, transparent); }
.profile-server-row { min-height: 54px; display: grid; grid-template-columns: 8px minmax(0, 1fr) auto; align-items: center; gap: 12px; border-top: 1px solid var(--line); }
.profile-server-row:first-child { border-top: 0; }
.profile-server-row > div { min-width: 0; display: grid; gap: 3px; }
.profile-server-row strong { overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.profile-server-row small { overflow: hidden; color: var(--muted); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.profile-server-row b { color: var(--muted); font-size: 13px; }
.profile-state-dot.online { color: var(--success); box-shadow: 0 0 0 3px var(--success-soft); }
.profile-state-dot.offline { color: var(--danger); }
.profile-inline-empty { min-height: 54px; display: flex; align-items: center; color: var(--muted); font-size: 14px; }
.profile-ops-grid, .profile-lower-grid { margin-bottom: 14px; display: grid; grid-template-columns: minmax(0, 1.42fr) minmax(310px, .78fr); gap: 14px; }
.profile-runtime-panel, .profile-activity-panel { overflow: hidden; }
.profile-runtime-row { min-height: 70px; padding: 11px 18px; display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; align-items: center; gap: 13px; color: var(--text); border-top: 1px solid var(--line); }
.profile-runtime-panel header + .profile-runtime-row { border-top: 0; }
.profile-runtime-row:hover { background: color-mix(in srgb, var(--primary) 5%, var(--surface)); }
.profile-runtime-icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 8px; color: var(--icon-violet); background: color-mix(in srgb, var(--icon-violet) 12%, var(--surface)); font-size: 14px; font-weight: 850; }
.profile-runtime-icon.archive { color: var(--warning); background: color-mix(in srgb, var(--warning) 12%, var(--surface)); }
.profile-runtime-icon.members { color: var(--success); background: var(--success-soft); }
.profile-runtime-icon.storage { color: var(--icon-cyan); background: color-mix(in srgb, var(--icon-cyan) 12%, var(--surface)); }
.profile-runtime-row > div { min-width: 0; display: grid; gap: 4px; }
.profile-runtime-row strong { font-size: 14px; }
.profile-runtime-row small { overflow: hidden; color: var(--muted); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.profile-runtime-row > b { padding: 4px 8px; border-radius: 6px; font-size: 13px; }
.profile-runtime-row > b.success { color: var(--success); background: var(--success-soft); }
.profile-runtime-row > b.warning { color: var(--warning); background: color-mix(in srgb, var(--warning) 11%, var(--surface)); }
.profile-runtime-row > b.active { color: #50c7db; background: color-mix(in srgb, #50c7db 11%, var(--surface)); }
.profile-shortcuts { padding: 17px 18px 18px; }
.profile-shortcuts header { margin-bottom: 13px; }
.profile-shortcuts nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.profile-shortcuts a { min-width: 0; min-height: 66px; padding: 10px; display: grid; grid-template-columns: 30px minmax(0, 1fr); grid-template-rows: auto auto; align-content: center; column-gap: 9px; border: 1px solid var(--line); border-radius: 7px; color: var(--text); background: var(--surface-soft); }
.profile-shortcuts a:hover { border-color: color-mix(in srgb, var(--primary) 45%, var(--line)); background: var(--primary-soft); }
.profile-shortcuts a > span { grid-row: 1 / 3; width: 30px; height: 30px; display: grid; place-items: center; color: var(--primary); font-size: 14px; font-weight: 800; }
.profile-shortcuts strong { align-self: end; overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.profile-shortcuts small { align-self: start; overflow: hidden; display: -webkit-box; color: var(--muted); font-size: 12px; line-height: 1.4; text-overflow: ellipsis; white-space: normal; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.profile-activity-row { min-height: 64px; padding: 10px 18px; display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: center; gap: 12px; border-top: 1px solid var(--line); }
.profile-activity-panel header + div .profile-activity-row:first-child { border-top: 0; }
.profile-activity-row > span { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 7px; color: var(--muted); background: var(--surface-soft); font-size: 13px; font-weight: 800; }
.profile-activity-row > span.success { color: var(--success); background: var(--success-soft); }
.profile-activity-row > span.warning { color: var(--warning); background: color-mix(in srgb, var(--warning) 11%, var(--surface)); }
.profile-activity-row > div { min-width: 0; display: grid; gap: 3px; }
.profile-activity-row strong, .profile-activity-row small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.profile-activity-row strong { font-size: 14px; }
.profile-activity-row small, .profile-activity-row time { color: var(--muted); font-size: 13px; }
.profile-account-panel { overflow: hidden; }
.profile-account-panel summary { min-height: 70px; padding: 15px 18px; display: flex; align-items: center; justify-content: space-between; gap: 16px; cursor: pointer; list-style: none; }
.profile-account-panel summary::-webkit-details-marker { display: none; }
.profile-account-panel summary > span { display: grid; gap: 4px; }
.profile-account-panel summary small { color: var(--primary); font-size: 13px; font-weight: 800; }
.profile-account-panel summary strong { font-size: 15px; }
.profile-account-panel summary > b { color: var(--muted); font-size: 13px; }
.profile-account-panel[open] summary { border-bottom: 1px solid var(--line); }
.profile-account-panel[open] summary > b { color: var(--primary); }
.profile-account-panel form { padding: 18px; }
.profile-account-panel .avatar-editor { margin-bottom: 16px; }
.profile-account-meta { margin-top: 14px; padding-top: 13px; display: flex; flex-wrap: wrap; gap: 8px 16px; border-top: 1px solid var(--line); color: var(--muted); font-size: 13px; }

@media (max-width: 980px) {
  .profile-ops-grid, .profile-lower-grid { grid-template-columns: 1fr; }
  .profile-library-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .profile-library-metrics > div:nth-child(2) { border-right: 0; }
  .profile-library-metrics > div:nth-child(-n + 2) { border-bottom: 1px solid var(--line); }
}

@media (max-width: 720px) {
  .profile-command-center { min-height: 0; padding: 17px; align-items: flex-start; flex-direction: column; gap: 15px; }
  .profile-identity { width: 100%; align-items: flex-start; }
  .profile-identity h2 { white-space: normal; overflow-wrap: anywhere; }
  .profile-health { width: 100%; justify-items: start; }
  .profile-library-overview > header { align-items: flex-start; }
  .profile-library-overview header p { max-width: 34rem; }
  .profile-library-metrics > div { min-height: 100px; padding: 16px; }
  .profile-library-metrics strong { font-size: 24px; }
  .profile-server-list { padding-inline: 16px; }
  .profile-server-row { grid-template-columns: 8px minmax(0, 1fr); }
  .profile-server-row > b { grid-column: 2; width: max-content; }
  .profile-runtime-row { grid-template-columns: 38px minmax(0, 1fr); padding-inline: 15px; }
  .profile-runtime-row > b { grid-column: 2; width: max-content; }
  .profile-runtime-row small { white-space: normal; }
  .profile-shortcuts nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .profile-activity-row { grid-template-columns: 28px minmax(0, 1fr); padding-inline: 15px; }
  .profile-activity-row time { grid-column: 2; }
  .profile-account-panel summary { align-items: flex-start; }
}

/* Personal command center refresh */
.profile-command-center,
.profile-playback-panel,
.profile-device-panel,
.profile-library-overview,
.profile-runtime-panel,
.profile-shortcuts,
.profile-activity-panel { border-radius: 14px; box-shadow: 0 10px 34px color-mix(in srgb, var(--bg) 42%, transparent); }
.profile-command-center { position: relative; min-height: 196px; margin-bottom: 16px; padding: 28px 30px; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(420px, .92fr); align-items: center; gap: 36px; border-color: color-mix(in srgb, var(--primary) 24%, var(--line)); background: radial-gradient(circle at 82% 6%, color-mix(in srgb, #58d7ff 13%, transparent), transparent 32%), radial-gradient(circle at 56% 108%, color-mix(in srgb, var(--primary) 18%, transparent), transparent 42%), linear-gradient(125deg, color-mix(in srgb, var(--primary) 8%, var(--surface)), var(--surface) 58%, color-mix(in srgb, #4dc7e8 6%, var(--surface))); }
.profile-device-panel { margin-bottom: 16px; }
.profile-hero-grid { position: absolute; inset: 0; opacity: .34; pointer-events: none; background-image: linear-gradient(color-mix(in srgb, var(--primary) 12%, transparent) 1px, transparent 1px), linear-gradient(90deg, color-mix(in srgb, var(--primary) 12%, transparent) 1px, transparent 1px); background-size: 34px 34px; mask-image: linear-gradient(90deg, transparent 24%, black 100%); }
.profile-hero-orb { position: absolute; right: 12%; top: -108px; width: 260px; height: 260px; border: 1px solid color-mix(in srgb, var(--primary) 22%, transparent); border-radius: 50%; box-shadow: 0 0 0 35px color-mix(in srgb, var(--primary) 4%, transparent), 0 0 0 70px color-mix(in srgb, #58d7ff 3%, transparent); pointer-events: none; }
.profile-welcome, .profile-system-orbit { position: relative; z-index: 1; }
.profile-welcome h2 { max-width: 680px; margin: 7px 0 9px; font-size: clamp(24px, 2.2vw, 34px); font-weight: 760; letter-spacing: -.035em; }
.profile-welcome > p { max-width: 600px; margin: 0; color: var(--muted); font-size: 14px; }
.profile-hero-tags { margin-top: 22px; display: flex; flex-wrap: wrap; gap: 9px; }
.profile-hero-tags > span { min-height: 28px; padding: 0 10px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid color-mix(in srgb, var(--text) 9%, var(--line)); border-radius: 999px; color: var(--muted); background: color-mix(in srgb, var(--surface) 68%, transparent); backdrop-filter: blur(9px); font-size: 13px; }
.profile-hero-tags i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.profile-hero-tags i.healthy { color: var(--success); box-shadow: 0 0 9px color-mix(in srgb, var(--success) 78%, transparent); }
.profile-hero-tags i.attention { color: var(--warning); box-shadow: 0 0 9px color-mix(in srgb, var(--warning) 70%, transparent); }
.profile-system-orbit { min-width: 0; padding: 13px; display: grid; grid-template-columns: 118px minmax(0, 1fr); align-items: center; gap: 16px; border: 1px solid color-mix(in srgb, var(--primary) 18%, var(--line)); border-radius: 16px; background: color-mix(in srgb, var(--surface) 68%, transparent); box-shadow: inset 0 1px 0 color-mix(in srgb, white 8%, transparent); backdrop-filter: blur(14px); }
.profile-orbit-core { position: relative; width: 104px; height: 104px; display: grid; place-content: center; justify-items: center; border: 1px solid color-mix(in srgb, var(--primary) 38%, transparent); border-radius: 50%; background: radial-gradient(circle, color-mix(in srgb, var(--primary) 12%, var(--surface)), color-mix(in srgb, var(--surface) 86%, transparent) 62%); box-shadow: inset 0 0 24px color-mix(in srgb, var(--primary) 10%, transparent), 0 0 28px color-mix(in srgb, var(--primary) 8%, transparent); }
.profile-orbit-core::before, .profile-orbit-core::after { content: ''; position: absolute; border-radius: 50%; }
.profile-orbit-core::before { inset: -7px; border: 1px dashed color-mix(in srgb, #58d7ff 36%, transparent); }
.profile-orbit-core::after { width: 8px; height: 8px; right: 5px; top: 12px; background: #58d7ff; box-shadow: 0 0 12px #58d7ff; }
.profile-orbit-core > span { width: 8px; height: 8px; margin-bottom: 7px; border-radius: 50%; background: var(--success); box-shadow: 0 0 12px var(--success); }
.profile-orbit-core strong { font-size: 19px; }
.profile-orbit-core small { margin-top: 3px; color: var(--muted); font-size: 13px; }
.profile-orbit-stats { min-width: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.profile-orbit-stats > div { min-width: 0; padding: 8px 11px; display: grid; justify-items: center; gap: 5px; border-left: 1px solid var(--line); text-align: center; }
.profile-orbit-stats > div:first-child { border-left: 0; }
.profile-orbit-stats strong { font-size: 20px; letter-spacing: -.03em; }
.profile-orbit-stats strong em { color: var(--muted); font-size: 14px; font-style: normal; }
.profile-orbit-stats small { color: var(--muted); font-size: 13px; white-space: nowrap; }
.profile-library-overview { margin-bottom: 16px; }
.profile-library-overview > header, .profile-runtime-panel > header, .profile-activity-panel > header { padding: 19px 21px; }
.profile-library-metrics { gap: 1px; background: var(--line); border-top: 0; }
.profile-library-metrics > div { position: relative; min-height: 124px; border: 0; background: linear-gradient(145deg, var(--surface), color-mix(in srgb, var(--surface-soft) 74%, var(--surface))); }
.profile-library-metrics > div::after { content: ''; position: absolute; left: 20px; right: 20px; bottom: 0; height: 2px; border-radius: 99px; opacity: .72; background: var(--primary); }
.profile-library-metrics > div[data-tone="cyan"]::after { background: #50c7db; }
.profile-library-metrics > div[data-tone="green"]::after { background: #72cf91; }
.profile-library-metrics > div[data-tone="amber"]::after { background: #e1b45a; }
.profile-library-metrics > div[data-tone="violet"]::after { background: #9b7cf6; }
.profile-library-metrics span { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.profile-library-metrics span i { color: color-mix(in srgb, var(--muted) 55%, transparent); font-size: 12px; font-style: normal; letter-spacing: .12em; }
.profile-library-metrics strong { font-size: 31px; }
.profile-ops-grid { margin-bottom: 16px; gap: 16px; }
.profile-runtime-row { min-height: 76px; }
.profile-runtime-icon { border-radius: 11px; box-shadow: inset 0 1px 0 color-mix(in srgb, white 12%, transparent); }
.profile-shortcuts { padding: 19px; }
.profile-shortcuts nav { gap: 10px; }
.profile-shortcuts a { position: relative; min-height: 76px; padding: 12px; border-radius: 11px; background: linear-gradient(145deg, var(--surface-soft), color-mix(in srgb, var(--surface) 80%, var(--surface-soft))); transition: .18s ease; }
.profile-shortcuts a:hover { transform: translateY(-2px); box-shadow: 0 9px 22px color-mix(in srgb, var(--primary) 10%, transparent); }
.profile-shortcuts a > span { width: 34px; height: 34px; border-radius: 10px; background: color-mix(in srgb, var(--primary) 9%, transparent); }
.profile-shortcuts a > i { position: absolute; right: 10px; top: 9px; color: color-mix(in srgb, var(--muted) 55%, transparent); font-size: 13px; font-style: normal; transition: .18s ease; }
.profile-shortcuts a:hover > i { color: var(--primary); transform: translate(2px, -2px); }
.profile-activity-wide { margin-bottom: 14px; overflow: hidden; }
.profile-activity-row { min-height: 68px; }
.profile-activity-row > span { border-radius: 9px; }
.profile-playback-panel { width: min(100%, 520px); margin-bottom: 16px; overflow: hidden; border: 1px solid var(--line); background: var(--surface); }
.profile-playback-panel > header { min-height: 52px; padding: 9px 13px; display: flex; align-items: center; justify-content: space-between; gap: 14px; border-bottom: 1px solid var(--line); }
.profile-playback-panel > header > div { min-width: 0; display: flex; align-items: baseline; gap: 9px; }
.profile-playback-panel > header h2 { margin: 0; font-size: 16px; }
.profile-playback-count { min-height: 26px; padding: 0 9px; flex: 0 0 auto; display: inline-flex; align-items: center; gap: 5px; border: 1px solid color-mix(in srgb, var(--success) 28%, var(--line)); border-radius: 999px; color: var(--success); background: var(--success-soft); font-size: 12px; white-space: nowrap; }
.profile-playback-count i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; box-shadow: 0 0 9px color-mix(in srgb, var(--success) 78%, transparent); animation: profile-playback-pulse 1.8s ease-in-out infinite; }
.profile-playback-count b { font-size: 13px; }
@keyframes profile-playback-pulse { 50% { opacity: .45; transform: scale(.78); } }
.profile-playback-list { display: flex; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: color-mix(in srgb, var(--primary) 28%, transparent) transparent; }
.profile-playback-card { position: relative; min-width: 0; min-height: 132px; padding: 10px 56px 10px 10px; flex: 0 0 100%; display: grid; grid-template-columns: 72px minmax(0, 1fr); align-items: center; gap: 12px; scroll-snap-align: start; background: color-mix(in srgb, var(--surface-soft) 34%, var(--surface)); }
.profile-playback-card + .profile-playback-card { border-left: 1px solid var(--line); }
.profile-playback-poster { position: relative; width: 72px; aspect-ratio: 2 / 3; align-self: center; overflow: hidden; display: grid; place-items: center; border: 1px solid color-mix(in srgb, var(--primary) 24%, var(--line)); border-radius: 7px; color: var(--primary); background: color-mix(in srgb, var(--primary) 10%, var(--surface-soft)); }
.profile-playback-poster > img { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; object-fit: cover; }
.profile-playback-poster > span { width: 42px; height: 42px; display: grid; place-items: center; color: color-mix(in srgb, var(--primary) 78%, var(--muted)); }
.profile-playback-poster > span .ui-icon { width: 34px; height: 34px; }
.profile-playback-body { min-width: 0; display: grid; align-content: center; gap: 7px; }
.profile-playback-body > header { min-width: 0; display: block; }
.profile-playback-body > header > div { min-width: 0; }
.profile-playback-body > header span { color: var(--primary); font-size: 12px; font-weight: 750; }
.profile-playback-body > header h3 { margin: 0 0 2px; overflow: hidden; font-size: 16px; text-overflow: ellipsis; white-space: nowrap; }
.profile-playback-body > header p { margin: 0; overflow: hidden; color: var(--muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.profile-playback-stream { min-width: 0; display: flex; align-items: center; gap: 8px; }
.profile-playback-stream span { flex: 0 0 auto; color: var(--primary); font-size: 12px; font-weight: 800; white-space: nowrap; }
.profile-playback-stream strong { min-width: 0; overflow: hidden; font-size: 12px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.profile-playback-progress { display: grid; gap: 5px; }
.profile-playback-progress > div { height: 5px; overflow: hidden; border-radius: 999px; background: color-mix(in srgb, var(--muted) 20%, transparent); }
.profile-playback-progress > div span { height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg, var(--primary), #45c9dd); transition: width .28s ease; }
.profile-playback-progress > small { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--muted); font-size: 12px; }
.profile-playback-progress > small span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.profile-playback-progress > small b { flex: 0 0 auto; white-space: nowrap; }
.profile-playback-progress > small b { color: var(--text); }
.profile-playback-actions { position: absolute; right: 10px; top: 10px; bottom: 10px; display: flex; flex-direction: column; justify-content: space-between; gap: 10px; }
.profile-playback-actions .button { width: 38px; min-width: 38px; height: 38px; min-height: 38px; padding: 0; display: grid; place-items: center; border-radius: 50%; }
.profile-playback-actions .button > span { display: none; }
.profile-playback-actions .ui-icon { width: 17px; height: 17px; }
.profile-playback-actions .profile-playback-stop { border-color: color-mix(in srgb, var(--danger) 35%, var(--line)); color: var(--danger); background: color-mix(in srgb, var(--danger) 10%, var(--surface)); }
.profile-playback-actions .profile-playback-stop:hover:not(:disabled) { border-color: color-mix(in srgb, var(--danger) 58%, var(--line)); background: color-mix(in srgb, var(--danger) 16%, var(--surface)); }
.profile-playback-sync { margin: 0; padding: 7px 11px; border-top: 1px solid var(--line); color: var(--muted); background: var(--surface-soft); font-size: 12px; }
.profile-playback-sync.success { color: var(--success); }
.profile-playback-sync.warning { color: var(--warning); }
.profile-playback-message-dialog form { min-height: 0; overflow: auto; }
.profile-playback-message-body { padding: 20px 24px 4px; display: grid; gap: 15px; }
.profile-playback-message-body label { display: grid; gap: 7px; color: var(--muted); font-size: 13px; font-weight: 700; }
.profile-playback-message-body textarea { min-height: 112px; }
.profile-playback-message-body > p { margin: 0; padding: 9px 11px; border-radius: 7px; font-size: 13px; }
.profile-playback-message-body > p.success { color: var(--success); background: var(--success-soft); }
.profile-playback-message-body > p.error { color: var(--danger); background: color-mix(in srgb, var(--danger) 10%, var(--surface)); }

@media (max-width: 1180px) {
  .profile-command-center { grid-template-columns: 1fr; gap: 24px; }
  .profile-system-orbit { max-width: 620px; }
  .profile-device-content { grid-template-columns: 1fr; }
  .profile-device-identity { border-right: 0; border-bottom: 1px solid var(--line); }
  .reverse-port-setup { grid-template-columns: minmax(220px, .8fr) minmax(260px, 1fr); }
  .reverse-auto-status { grid-column: 1 / -1; }
  .member-one15-target { grid-template-columns: minmax(0, 1fr) auto; }
  .member-one15-target > div:first-child { grid-column: 1 / -1; }
}

@media (max-width: 720px) {
  .account-settings-fields { grid-template-columns: 1fr; }
  .account-confirm-field { grid-column: auto; }
  .account-settings-dialog > form { padding: 15px; }
  .account-settings-identity { padding: 15px; }
  .account-settings-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .profile-command-center { padding: 22px 18px; border-radius: 13px; }
  .profile-device-panel > header { align-items: flex-start; }
  .profile-device-panel > header p { max-width: 28rem; }
  .profile-device-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .profile-device-facts > div:nth-child(3) { border-left: 0; }
  .profile-device-facts > div:nth-child(n + 3) { border-top: 1px solid var(--line); }
  .profile-welcome h2 { font-size: 25px; }
  .profile-hero-tags { margin-top: 18px; }
  .profile-system-orbit { padding: 14px; grid-template-columns: 1fr; justify-items: center; }
  .profile-orbit-stats { width: 100%; }
  .profile-playback-panel > header { min-height: 48px; padding: 8px 11px; }
  .profile-playback-panel > header > div { gap: 7px; }
  .profile-playback-panel > header .profile-section-kicker { font-size: 12px; }
  .profile-playback-panel > header h2 { font-size: 15px; }
  .profile-playback-card { min-height: 124px; padding: 9px 50px 9px 9px; grid-template-columns: 66px minmax(0, 1fr); gap: 10px; }
  .profile-playback-poster { width: 66px; }
  .profile-playback-body { gap: 7px; }
  .profile-playback-body > header h3 { font-size: 16px; }
  .profile-playback-actions { right: 8px; top: 9px; bottom: 9px; }
  .profile-playback-actions .button { width: 35px; min-width: 35px; height: 35px; min-height: 35px; }
  .profile-playback-sync { padding-inline: 15px; }
  .profile-playback-message-body { padding: 17px 18px 4px; }
  .member-one15-target { grid-template-columns: 1fr; align-items: stretch; }
  .member-one15-target > div:first-child { grid-column: auto; }
  .member-one15-target > .button { width: 100%; }
  .profile-device-panel, .profile-playback-panel, .profile-library-overview, .profile-runtime-panel, .profile-shortcuts, .profile-activity-panel { border-radius: 12px; }
}

/* Workbench sections remain unframed; only repeated metrics are cards. */
.workbench-page { display: grid; gap: 20px; }
.workbench-page > :is(.profile-command-center, .profile-library-overview, .profile-device-panel, .profile-activity-panel) { margin: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.workbench-page .profile-command-center { padding: 0 0 16px; border-bottom: 1px solid var(--line); }
.workbench-page .profile-identity img { width: 42px; height: 42px; }
.workbench-page .profile-identity h2 { font-size: 18px; }
.workbench-page .profile-identity p { font-size: 12px; }
.workbench-page .profile-summary-grid, .workbench-page .profile-focus-grid { margin: 0; }
.workbench-page .profile-focus-grid { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); align-items: stretch; }
.workbench-page .profile-focus-grid > section { min-height: 180px; border: 0; border-block: 1px solid var(--line); border-radius: 0; background: transparent; }
.workbench-page .profile-playback-list { max-height: 360px; overflow-y: auto; }
.workbench-page .profile-playback-panel { grid-row: 1; grid-column: 1; }
.workbench-page .profile-attention-panel { grid-column: 2; }
.workbench-page .profile-ops-grid { margin: 0; }
.workbench-page .profile-runtime-panel, .workbench-page .profile-shortcuts { border: 0; border-block: 1px solid var(--line); border-radius: 0; background: transparent; }
.workbench-source-tabs { display: flex; gap: 18px; padding: 0 18px; border-bottom: 1px solid var(--line); }
.workbench-source-tabs a { color: var(--muted); padding: 10px 0; border-bottom: 2px solid transparent; font-size: 13px; }
.workbench-source-tabs [aria-current] { color: var(--primary); border-color: var(--primary); }
.workbench-page .profile-library-metrics > div { background: transparent; }
.workbench-page .profile-device-panel > summary { display: flex; align-items: center; justify-content: space-between; padding: 14px 0; border-block: 1px solid var(--line); cursor: pointer; }
.workbench-page .profile-device-panel > summary h2 { font-size: 15px; margin: 4px 0; }
.workbench-page .profile-device-panel > summary p { margin: 0; color: var(--muted); font-size: 12px; }
.workbench-page .profile-device-panel > summary::after { content: '+'; padding: 0 12px; font-size: 20px; }
.workbench-page .profile-device-panel[open] > summary::after { content: '-'; }
.profile-setup-modes form { margin: 0; }
.profile-setup-modes button { color: var(--muted); padding: 10px 12px; font-size: 13px; background: none; border: 0; border-bottom: 2px solid transparent; cursor: pointer; }
.profile-setup-modes button[aria-current] { color: var(--text); border-color: var(--primary); }
.workbench-resources { border-block: 1px solid var(--line); padding: 16px 0; }
.workbench-resources > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.workbench-resources h2 { font-size: 16px; margin: 0; }
.workbench-resources > header span, .workbench-resources p { color: var(--muted); font-size: 12px; }
.workbench-resource-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-top: 18px; }
.workbench-resource-grid > div { min-width: 0; display: grid; grid-template-columns: 1fr auto; gap: 10px; }
.workbench-resource-grid > div > span { font-size: 13px; color: var(--muted); }
.workbench-resource-grid strong { font-size: 18px; }
.workbench-spark { grid-column: 1 / -1; height: 36px; display: flex; gap: 3px; align-items: end; border-bottom: 1px solid var(--line); }
.workbench-spark span { flex: 1; max-width: 12px; background: #48b9c8; border-radius: 2px 2px 0 0; }
.workbench-spark.memory span { background: #9673e6; }
@media (max-width: 760px) {
  .workbench-page .profile-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .workbench-page .profile-summary-grid > article { flex-direction: column; align-items: flex-start; gap: 8px; padding: 14px; }
  .workbench-page .profile-summary-grid article > div { width: 100%; }
  .workbench-page .profile-summary-icon { width: 28px; height: 28px; }
  .workbench-page .profile-summary-icon .ui-icon { width: 16px; height: 16px; }
  .workbench-page .profile-command-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .workbench-page .profile-command-actions .profile-overall-state { grid-column: 1 / -1; }
  .workbench-page .profile-shortcuts nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .workbench-page .profile-shortcuts a { padding: 12px; min-width: 0; }
  .workbench-page .profile-focus-grid { grid-template-columns: minmax(0, 1fr); }
  .workbench-page .profile-playback-panel, .workbench-page .profile-attention-panel { grid-column: 1; grid-row: auto; }
  .workbench-resource-grid { grid-template-columns: minmax(0, 1fr); }
  .workbench-page { padding-bottom: 60px; }
}

/* Profile workspace */
.profile-command-center,
.profile-summary-grid > article,
.profile-attention-panel,
.profile-playback-panel,
.profile-device-panel,
.profile-library-overview,
.profile-runtime-panel,
.profile-shortcuts,
.profile-activity-panel { border-radius: 8px; box-shadow: none; }
.profile-command-center { min-height: 0; margin-bottom: 14px; padding: 18px 20px; overflow: visible; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-color: var(--line); background: var(--surface); }
.profile-command-actions { min-width: 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; }
.profile-command-actions .button { min-height: 36px; padding: 0 12px; gap: 7px; white-space: nowrap; }
.profile-command-actions .ui-icon { width: 16px; height: 16px; }
.profile-overall-state { min-height: 36px; padding: 0 11px; display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: 7px; font-size: 13px; font-weight: 750; white-space: nowrap; }
.profile-overall-state i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.profile-overall-state.healthy { color: var(--success); border-color: color-mix(in srgb, var(--success) 24%, var(--line)); background: var(--success-soft); }
.profile-overall-state.attention { color: var(--warning); border-color: color-mix(in srgb, var(--warning) 28%, var(--line)); background: color-mix(in srgb, var(--warning) 10%, var(--surface)); }
.profile-summary-grid { margin-bottom: 14px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.profile-summary-grid > article { min-width: 0; min-height: 104px; padding: 17px; display: flex; align-items: center; gap: 13px; border: 1px solid var(--line); background: var(--surface); }
.profile-summary-grid article > div { min-width: 0; display: grid; gap: 3px; }
.profile-summary-grid small { color: var(--muted); font-size: 13px; font-weight: 700; }
.profile-summary-grid strong { overflow: hidden; color: var(--text); font-size: 25px; line-height: 1.1; text-overflow: ellipsis; white-space: nowrap; }
.profile-summary-grid strong em { color: var(--muted); font-size: 14px; font-style: normal; font-weight: 650; }
.profile-summary-grid p { margin: 0; overflow: hidden; color: var(--muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.profile-summary-icon { width: 40px; height: 40px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 8px; color: var(--primary); background: var(--primary-soft); }
.profile-summary-icon .ui-icon { width: 20px; height: 20px; }
.profile-summary-icon.playback { color: var(--icon-cyan); background: color-mix(in srgb, var(--icon-cyan) 12%, var(--surface)); }
.profile-summary-icon.members { color: var(--success); background: var(--success-soft); }
.profile-summary-icon.queue { color: var(--warning); background: color-mix(in srgb, var(--warning) 12%, var(--surface)); }
.profile-summary-icon.storage { color: var(--icon-violet); background: color-mix(in srgb, var(--icon-violet) 12%, var(--surface)); }
.profile-focus-grid { margin-bottom: 14px; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); align-items: start; gap: 14px; }
.profile-attention-panel { overflow: hidden; border: 1px solid var(--line); background: var(--surface); }
.profile-attention-panel > header { min-height: 57px; padding: 12px 16px; display: flex; align-items: center; justify-content: space-between; gap: 14px; border-bottom: 1px solid var(--line); }
.profile-attention-panel > header h2 { margin-top: 2px; font-size: 16px; }
.profile-attention-count { min-width: 28px; height: 28px; padding: 0 8px; display: grid; place-items: center; border-radius: 7px; color: var(--muted); background: var(--surface-soft); font-size: 13px; font-weight: 800; }
.profile-attention-panel.has-issues .profile-attention-count { color: var(--warning); background: color-mix(in srgb, var(--warning) 11%, var(--surface)); }
.profile-attention-list { min-height: 84px; }
.profile-attention-row { min-height: 66px; padding: 11px 14px; display: grid; grid-template-columns: 36px minmax(0, 1fr) 18px; align-items: center; gap: 11px; color: var(--text); border-top: 1px solid var(--line); }
.profile-attention-row:first-child { border-top: 0; }
.profile-attention-row:hover { background: var(--surface-soft); }
.profile-attention-row > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 8px; color: var(--warning); background: color-mix(in srgb, var(--warning) 10%, var(--surface)); }
.profile-attention-row.danger > span { color: var(--danger); background: color-mix(in srgb, var(--danger) 10%, var(--surface)); }
.profile-attention-row > span .ui-icon { width: 18px; height: 18px; }
.profile-attention-row > div { min-width: 0; display: grid; gap: 3px; }
.profile-attention-row strong, .profile-attention-row small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.profile-attention-row strong { font-size: 14px; }
.profile-attention-row small { color: var(--muted); font-size: 12px; }
.profile-attention-row > .ui-icon { width: 17px; height: 17px; color: var(--muted); }
.profile-attention-clear { min-height: 84px; padding: 15px; display: flex; align-items: center; gap: 12px; }
.profile-attention-clear > span { width: 40px; height: 40px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 8px; color: var(--success); background: var(--success-soft); }
.profile-attention-clear > span .ui-icon { width: 21px; height: 21px; }
.profile-attention-clear > div { min-width: 0; display: grid; gap: 4px; }
.profile-attention-clear strong { font-size: 14px; }
.profile-attention-clear small { color: var(--muted); font-size: 12px; }
.profile-playback-panel { width: 100%; max-width: none; margin-bottom: 0; }
.profile-playback-panel > header { min-height: 57px; padding: 12px 16px; }
.profile-playback-panel > header > div { display: block; }
.profile-playback-panel > header h2 { margin-top: 2px; }
.profile-playback-card { min-height: 138px; }
.profile-device-panel { margin-bottom: 14px; }
.profile-device-panel > header { padding: 15px 18px; }
.profile-device-identity { padding: 18px; background: var(--surface-soft); }
.profile-device-glyph { width: 52px; height: 52px; padding: 0; display: grid; place-items: center; border-radius: 8px; background: var(--primary-soft); box-shadow: none; }
.profile-device-glyph::before { display: none; }
.profile-device-glyph .ui-icon { width: 23px; height: 23px; color: var(--primary); }
.profile-device-facts > div { min-height: 94px; padding: 15px 16px; }
.profile-library-overview > header, .profile-runtime-panel > header, .profile-activity-panel > header { padding: 15px 18px; }
.profile-library-metrics { gap: 0; background: transparent; }
.profile-library-metrics > div { min-height: 104px; padding: 16px 18px; border-right: 1px solid var(--line); background: var(--surface); }
.profile-library-metrics > div::after { display: none; }
.profile-library-metrics strong { font-size: 26px; }
.profile-ops-grid { grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr); gap: 14px; }
.profile-runtime-row { min-height: 70px; }
.profile-runtime-icon { border-radius: 8px; box-shadow: none; }
.profile-runtime-icon .ui-icon { width: 19px; height: 19px; }
.profile-shortcuts { padding: 16px; }
.profile-shortcuts a { min-height: 70px; border-radius: 8px; background: var(--surface-soft); transform: none; box-shadow: none; }
.profile-shortcuts a:hover { transform: none; box-shadow: none; }
.profile-shortcuts a > span { border-radius: 7px; }
.profile-shortcuts a > span .ui-icon { width: 17px; height: 17px; }
.profile-shortcuts a > i { display: grid; place-items: center; }
.profile-shortcuts a > i .ui-icon { width: 14px; height: 14px; }
.profile-activity-row > span { border-radius: 7px; }

@media (max-width: 1100px) {
  .profile-command-center { align-items: flex-start; flex-direction: column; }
  .profile-command-actions { justify-content: flex-start; }
  .profile-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .profile-ops-grid { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  .profile-command-center { padding: 15px; gap: 14px; }
  .profile-command-actions { width: 100%; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .profile-command-actions .profile-overall-state { grid-column: 1 / -1; width: max-content; }
  .profile-command-actions .button { width: 100%; justify-content: center; }
  .profile-command-actions a.button { grid-column: 1 / -1; }
  .profile-summary-grid { grid-template-columns: 1fr; gap: 8px; }
  .profile-summary-grid > article { min-height: 86px; padding: 14px; }
  .profile-focus-grid { gap: 10px; }
  .profile-attention-row strong, .profile-attention-row small { white-space: normal; }
  .profile-device-content { grid-template-columns: 1fr; }
  .profile-device-identity { border-right: 0; border-bottom: 1px solid var(--line); }
  .profile-device-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .profile-device-facts > div { border-top: 1px solid var(--line); }
  .profile-device-facts > div:nth-child(odd) { border-left: 0; }
  .profile-library-metrics > div { min-height: 94px; }
}

@media (max-width: 430px) {
  .profile-command-actions { grid-template-columns: 1fr; }
  .profile-command-actions .profile-overall-state, .profile-command-actions a.button { grid-column: auto; width: 100%; justify-content: center; }
  .profile-device-panel > header { align-items: flex-start; flex-direction: column; }
  .profile-device-facts { grid-template-columns: 1fr; }
  .profile-device-facts > div { border-left: 0; }
  .profile-shortcuts nav { grid-template-columns: 1fr; }
}
.two-col { grid-template-columns: minmax(0, 1.45fr) minmax(300px, .7fr); }
.card {
  color: var(--ui-card-foreground); background: var(--ui-card); border: 1px solid var(--ui-border); border-radius: var(--ui-radius-xl); box-shadow: var(--ui-shadow-xs); transition: box-shadow .18s ease, border-color .18s ease;
}
.card-pad { padding: var(--ui-card-spacing); }
.card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 20px; }
.stat { padding: 18px 20px; min-height: 108px; }
.stat-label { color: var(--muted); font-size: 14px; font-weight: 650; }
.stat-value { font-size: 22px; font-weight: 760; margin: 12px 0 5px; overflow: hidden; text-overflow: ellipsis; }
.stat-hint { color: var(--muted); font-size: 14px; }
.status-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; background: var(--muted); }
.status-dot.ok { background: var(--success); box-shadow: 0 0 0 4px var(--success-soft); }
.status-dot.bad { background: var(--danger); }
.emby-overview { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(190px, .75fr); gap: 14px; margin-bottom: 22px; }
.emby-overview > div, .emby-add-card { min-height: 116px; padding: 19px 20px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; border: 1px solid var(--line); border-radius: 16px; color: var(--text); background: var(--surface); box-shadow: var(--shadow); }
.emby-overview > div span { color: var(--muted); font-size: 14px; font-weight: 650; }
.emby-overview > div strong { margin: 9px 0 5px; font-size: 27px; line-height: 1; }
.emby-overview > div small { color: var(--muted); }
.emby-overview .success-text { color: var(--success); }
.emby-overview .default-server-name { overflow: hidden; width: 100%; color: var(--primary); font-size: 19px; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.emby-add-card { align-items: center; border: 1px dashed color-mix(in srgb, var(--primary) 58%, var(--line)); color: var(--primary); cursor: pointer; box-shadow: none; }
.emby-add-card:hover { background: var(--primary-soft); transform: translateY(-2px); }
.emby-add-card > span { width: 34px; height: 34px; margin-bottom: 7px; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--primary); font-size: 22px; }
.emby-add-card small { margin-top: 5px; color: var(--muted); }
.emby-section-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin: 4px 0 14px; }
.emby-section-head h2 { font-size: 18px; }
.emby-section-head p { margin: 5px 0 0; color: var(--muted); font-size: 14px; }
.emby-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.emby-card { position: relative; padding: 20px; overflow: hidden; }
.emby-card::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--line); }
.emby-card.default::before { background: linear-gradient(var(--primary), #9a58da); }
.emby-card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; }
.emby-identity { min-width: 0; display: flex; align-items: center; gap: 13px; }
.emby-mark { width: 45px; height: 45px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 13px; color: white; background: linear-gradient(145deg, #6378fa, #8b54da); box-shadow: 0 7px 16px rgba(95, 111, 242, .24); }
.emby-name-line { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.emby-name-line h2 { min-width: 0; overflow: hidden; font-size: 17px; text-overflow: ellipsis; white-space: nowrap; }
.emby-identity p { max-width: 330px; margin: 5px 0 0; overflow: hidden; color: var(--muted); font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.emby-state { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 6px; padding: 5px 9px; border-radius: 99px; color: var(--warning); background: color-mix(in srgb, var(--warning) 11%, var(--surface)); font-size: 14px; font-weight: 700; }
.emby-state i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.emby-state.online { color: var(--success); background: var(--success-soft); }
.emby-state.offline { color: var(--danger); background: color-mix(in srgb, var(--danger) 10%, var(--surface)); }
.emby-details { display: grid; grid-template-columns: 1fr 1fr; gap: 0 20px; margin: 18px 0 16px; padding: 4px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.emby-details > div { min-width: 0; padding: 12px 0; display: grid; gap: 5px; }
.emby-details span { color: var(--muted); font-size: 14px; }
.emby-details strong { overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.emby-card-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.emby-card-actions form { margin: 0; }
.emby-card-actions .button { min-height: 36px; padding: 0 12px; font-size: 14px; }
.emby-delete { min-height: 36px; padding: 0 10px; border: 0; color: var(--danger); background: transparent; cursor: pointer; font-weight: 700; }
.emby-delete:hover { border-radius: 8px; background: color-mix(in srgb, var(--danger) 9%, var(--surface)); }
.emby-empty { grid-column: 1 / -1; min-height: 310px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.emby-empty .emby-mark { margin-bottom: 15px; }
.emby-empty p { margin: 8px 0 18px; color: var(--muted); }
.emby-dialog { width: min(540px, calc(100vw - 30px)); }
.emby-form { display: grid; gap: 16px; padding: 21px 24px 9px; }
.emby-dialog-actions { padding: 15px 24px 22px; display: flex; justify-content: flex-end; gap: 10px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.field { display: grid; align-content: start; grid-auto-rows: max-content; gap: 8px; }
.field.full { grid-column: 1 / -1; }
label { font-size: 14px; font-weight: 700; color: var(--text); }
input, select, textarea {
  width: 100%; min-height: var(--ui-control-md); border: 1px solid var(--ui-input); border-radius: var(--ui-radius-md);
  background: var(--ui-background); color: var(--ui-foreground); padding: 0 11px; outline: none;
  box-shadow: var(--ui-shadow-xs); transition: color .16s ease, border-color .16s ease, background-color .16s ease, box-shadow .16s ease;
}
input:is([type="checkbox"], [type="radio"]) {
  flex: 0 0 auto; width: 16px; height: 16px; min-width: 0; min-height: 0;
  margin: 0; padding: 0; box-shadow: none; accent-color: var(--primary); cursor: pointer; vertical-align: middle;
}
textarea { padding-top: 12px; resize: vertical; line-height: 1.55; }
select { cursor: pointer; }
input::placeholder, textarea::placeholder { color: color-mix(in srgb, var(--muted) 82%, transparent); }
input:hover:not(:disabled), select:hover:not(:disabled), textarea:hover:not(:disabled) { border-color: color-mix(in srgb, var(--ui-foreground) 24%, var(--ui-input)); }
input:focus, select:focus, textarea:focus { border-color: var(--ui-ring-color); background: var(--ui-card); }
input:focus-visible, select:focus-visible, textarea:focus-visible { box-shadow: var(--ui-ring); }
input:disabled, select:disabled, textarea:disabled { cursor: not-allowed; opacity: .56; background: var(--ui-muted); }
input[aria-invalid="true"], select[aria-invalid="true"], textarea[aria-invalid="true"] { border-color: var(--danger); box-shadow: 0 0 0 3px color-mix(in srgb, var(--danger) 22%, transparent); }
.ui-select { position: relative; width: 100%; min-width: 0; color: var(--text); font-size: 14px; font-weight: 650; }
.ui-select.is-enhanced > select { position: absolute; width: 1px; height: 1px; min-height: 0; margin: 0; padding: 0; overflow: hidden; border: 0; opacity: 0; pointer-events: none; clip-path: inset(50%); }
.ui-select-trigger { width: 100%; min-width: 0; min-height: var(--ui-control-md); padding: 5px 10px; display: grid; grid-template-columns: 28px minmax(0, 1fr) 18px; align-items: center; gap: 8px; border: 1px solid var(--ui-input); border-radius: var(--ui-radius-md); color: var(--ui-foreground); background: color-mix(in srgb, var(--ui-background) 96%, transparent); box-shadow: var(--ui-shadow-xs); cursor: pointer; text-align: left; transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease; }
.ui-select-trigger:hover { border-color: color-mix(in srgb, var(--primary) 44%, var(--ui-input)); background: color-mix(in srgb, var(--primary-soft) 20%, var(--ui-background)); }
.ui-select-trigger:focus-visible, .ui-select.is-open .ui-select-trigger { outline: 0; border-color: var(--ui-ring-color); box-shadow: var(--ui-ring); }
.ui-select.is-invalid .ui-select-trigger { border-color: var(--danger); box-shadow: 0 0 0 3px color-mix(in srgb, var(--danger) 18%, transparent); }
.ui-select.is-disabled { opacity: .56; }
.ui-select-trigger:disabled { cursor: not-allowed; }
.ui-select-trigger-icon { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 8px; color: var(--primary); background: var(--primary-soft); }
.ui-select-trigger-icon .ui-icon { width: 15px; height: 15px; }
.ui-select-value { min-width: 0; overflow: hidden; font-size: inherit; font-weight: 720; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.ui-select-chevron { display: grid; place-items: center; color: var(--muted); transition: color .16s ease, transform .2s ease; }
.ui-select-chevron .ui-icon { width: 16px; height: 16px; }
.ui-select.is-open .ui-select-chevron { color: var(--primary); transform: rotate(180deg); }
.ui-select.is-compact .ui-select-trigger { min-height: 34px; padding: 4px 8px 4px 10px; grid-template-columns: minmax(0, 1fr) 16px; gap: 5px; }
.ui-select.is-compact .ui-select-trigger-icon { display: none; }
.ui-select-scrim, .ui-select-menu-head { display: none; }
.ui-select-menu { position: fixed; z-index: 72; min-width: 0; max-width: calc(100vw - 24px); max-height: min(340px, 58vh); padding: 6px; overflow: auto; overscroll-behavior: contain; border: 1px solid color-mix(in srgb, var(--primary) 32%, var(--line)); border-radius: 11px; color: var(--text); background: color-mix(in srgb, var(--bg-primary) 96%, var(--text-primary) 4%); box-shadow: 0 20px 54px rgba(4, 8, 20, .4), 0 0 0 1px color-mix(in srgb, var(--primary) 8%, transparent); scrollbar-width: thin; scrollbar-color: color-mix(in srgb, var(--primary) 38%, var(--line)) transparent; }
.ui-select-menu[hidden] { display: none; }
.ui-select.opens-upward .ui-select-menu, .ui-select-menu.opens-upward { transform-origin: bottom; }
.ui-select-menu.is-portaled { margin: 0; }
.ui-select-menu.is-dialog-portaled { position: absolute; z-index: 102; }
.ui-select-scrim.is-portaled.is-dialog-portaled { z-index: 101; }
.ui-select-options { display: grid; gap: 3px; }
.ui-select-options [role="option"] { width: 100%; min-width: 0; min-height: 40px; padding: 7px 9px 7px 11px; display: grid; grid-template-columns: minmax(0, 1fr) 18px; align-items: center; gap: 10px; border: 1px solid transparent; border-radius: 8px; color: var(--text); background: transparent; cursor: pointer; text-align: left; transition: border-color .14s ease, background-color .14s ease, color .14s ease; }
.ui-select-options [role="option"] > span { min-width: 0; overflow: hidden; font-size: 14px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.ui-select-options [role="option"] > i { display: grid; place-items: center; color: transparent; }
.ui-select-options [role="option"] > i .ui-icon { width: 15px; height: 15px; }
.ui-select-options [role="option"]:hover, .ui-select-options [role="option"]:focus-visible { outline: 0; border-color: color-mix(in srgb, var(--primary) 25%, transparent); background: color-mix(in srgb, var(--primary-soft) 58%, var(--surface)); }
.ui-select-options [role="option"][aria-selected="true"] { color: var(--primary); border-color: color-mix(in srgb, var(--primary) 30%, transparent); background: color-mix(in srgb, var(--primary-soft) 78%, var(--surface)); font-weight: 800; }
.ui-select-options [role="option"][aria-selected="true"] > i { color: var(--primary); }
.ui-select-options [role="option"]:disabled { opacity: .48; cursor: not-allowed; }
.recommend-page-size .ui-select { width: 88px; min-width: 88px; }
.recommend-page-size .ui-select-trigger { min-height: 34px; height: 34px; }
.one15-client-select .ui-select { width: 100%; min-width: 0; }
.one15-client-select .ui-select-trigger { min-height: 42px; height: 42px; border-radius: 10px; }
.strm-section-head .ui-select { min-width: 190px; }
.pt-site-browser-category .ui-select { flex: 1; min-width: 0; }
.pt-site-browser-category .ui-select-trigger { min-height: 38px; padding-block: 3px; border: 0; background: transparent; box-shadow: none; }
.ui-select.pt-qb-mapping-select-shell { min-width: 110px; max-width: 160px; }
.ui-select.pt-qb-mapping-select-shell .ui-select-trigger { min-height: 34px; height: 34px; }
.log-query .ui-select-trigger { min-height: 40px; height: 40px; border-radius: 7px; font-size: 13px; }
@media (max-width: 620px) {
  body.ui-select-open { overflow: hidden; }
  .ui-select.is-open { z-index: 80; }
  .ui-select.is-open .ui-select-scrim, .ui-select-scrim.is-portaled { position: fixed; inset: 0; z-index: 79; width: 100%; height: 100%; padding: 0; display: block; border: 0; background: color-mix(in srgb, #020617 48%, transparent); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
  .ui-select-menu, .ui-select.opens-upward .ui-select-menu { position: fixed; top: auto !important; right: var(--ui-select-sheet-right, 10px) !important; bottom: var(--ui-select-sheet-bottom, max(10px, env(safe-area-inset-bottom))) !important; left: var(--ui-select-sheet-left, 10px) !important; z-index: 80; width: auto; min-width: 0; max-width: none; max-height: var(--ui-select-sheet-max-height, min(72dvh, 660px)); padding: 0 10px calc(10px + env(safe-area-inset-bottom)); border-radius: 18px; transform-origin: bottom; }
  .ui-select-menu.ui-motion-popover.is-opening { animation: uiSelectSheetIn .22s cubic-bezier(.16, 1, .3, 1) both; }
  .ui-select-menu.ui-motion-popover.is-closing { animation: uiSelectSheetOut .15s cubic-bezier(.4, 0, 1, 1) both; }
  .ui-select-scrim.is-portaled.is-dialog-portaled, .ui-select-menu.is-dialog-portaled { position: fixed; }
  .ui-select-menu-head { position: sticky; top: 0; z-index: 2; min-height: 68px; margin: 0 -10px 5px; padding: 11px 12px 10px; display: grid; grid-template-columns: 36px minmax(0, 1fr) 36px; align-items: center; gap: 9px; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--bg-primary) 96%, var(--text-primary) 4%); }
  .ui-select-menu-head > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 10px; color: var(--primary); background: var(--primary-soft); }
  .ui-select-menu-head > span .ui-icon { width: 18px; height: 18px; }
  .ui-select-menu-head > div { min-width: 0; display: grid; gap: 2px; }
  .ui-select-menu-head small { color: var(--primary); font-size: 12px; font-weight: 850; }
  .ui-select-menu-head strong { overflow: hidden; font-size: 16px; text-overflow: ellipsis; white-space: nowrap; }
  .ui-select-menu-head > button { width: 36px; height: 36px; padding: 0; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 10px; color: var(--muted); background: var(--surface-soft); cursor: pointer; }
  .ui-select-menu-head > button .ui-icon { width: 17px; height: 17px; }
  .ui-select-options { gap: 4px; }
  .ui-select-options [role="option"] { min-height: 48px; padding: 9px 11px 9px 13px; border-radius: 10px; }
  .ui-select-options [role="option"] > span { font-size: 15px; }
  .ui-select.pt-qb-mapping-select-shell, .strm-section-head .ui-select { width: 100%; max-width: none; }
  @keyframes uiSelectSheetIn { from { opacity: 0; transform: translateY(18px) scale(.94); } to { opacity: 1; transform: translateY(0) scale(1); } }
  @keyframes uiSelectSheetOut { from { opacity: 1; transform: translateY(0) scale(1); } to { opacity: 0; transform: translateY(12px) scale(.97); } }
}
.help { font-size: 14px; color: var(--muted); line-height: 1.55; }
.checkbox { display: flex; align-items: center; gap: 8px; color: var(--muted); font-weight: 500; }
.checkbox input { width: 16px; min-height: 16px; }
.button {
  border: 1px solid transparent; border-radius: var(--ui-radius-md); min-height: var(--ui-control-md); padding: 0 14px; cursor: pointer;
  display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; gap: 8px; color: var(--ui-primary-foreground); background: var(--ui-primary); box-shadow: var(--ui-shadow-xs);
  font-size: 14px; font-weight: 650; line-height: 1; white-space: nowrap; transition: color .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease, opacity .16s ease, transform .12s ease;
}
.button:hover { filter: brightness(1.06); box-shadow: var(--ui-shadow-sm); }
.button:active { opacity: .9; transform: scale(.98); }
.button:focus-visible { outline: none; border-color: var(--primary); box-shadow: var(--ui-ring); }
.button:disabled { opacity: .6; cursor: not-allowed; transform: none; }
.button.is-loading, .button.is-loading:disabled { cursor: wait; }
.button.secondary, .button[data-variant="outline"] { background: var(--ui-card); color: var(--ui-card-foreground); border-color: var(--ui-border); box-shadow: var(--ui-shadow-xs); }
.button.secondary:hover, .button[data-variant="outline"]:hover { filter: none; background: var(--ui-accent); color: var(--ui-accent-foreground); }
.button.ghost, .button[data-variant="ghost"] { color: var(--ui-foreground); background: transparent; border-color: transparent; box-shadow: none; }
.button.ghost:hover, .button[data-variant="ghost"]:hover { filter: none; background: var(--ui-accent); color: var(--ui-accent-foreground); box-shadow: none; }
.button.success { background: var(--success); }
.button.danger, .button[data-variant="destructive"] { color: var(--ui-destructive-foreground); background: var(--ui-destructive); }
.button > svg { width: 16px; height: 16px; flex: 0 0 auto; pointer-events: none; }
.form-actions { display: flex; gap: 10px; margin-top: 20px; }
.notice { padding: 12px 14px; border-radius: var(--ui-radius-md); margin-bottom: 16px; border: 1px solid var(--line); line-height: 1.5; }
.notice.success { color: var(--success); background: var(--success-soft); border-color: color-mix(in srgb, var(--success) 25%, transparent); }
.notice.warning { color: var(--warning); background: color-mix(in srgb, var(--warning) 10%, var(--surface)); border-color: color-mix(in srgb, var(--warning) 25%, transparent); }
.notice.error { color: var(--danger); background: color-mix(in srgb, var(--danger) 10%, var(--surface)); }
.info-list { display: grid; gap: 0; }
.info-row { display: flex; justify-content: space-between; gap: 20px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.info-row:last-child { border-bottom: 0; }
.info-key { color: var(--muted); }
.info-value { text-align: right; font-weight: 650; word-break: break-all; }
.avatar-editor { display: flex; align-items: center; gap: 18px; margin: -2px 0 22px; padding: 18px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-soft); }
.avatar-preview { width: 86px; height: 86px; flex: 0 0 auto; border-radius: 50%; object-fit: cover; background: var(--surface); border: 3px solid var(--surface); box-shadow: 0 5px 18px rgba(42, 52, 79, .14); }
.avatar-copy { min-width: 0; }
.avatar-copy p { margin: 7px 0 12px; color: var(--muted); font-size: 14px; }
.avatar-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }
.avatar-upload { min-height: 36px; padding: 0 13px; cursor: pointer; }
.badge { display: inline-flex; align-items: center; min-height: 22px; padding: 0 8px; border: 1px solid color-mix(in srgb, var(--primary) 18%, var(--line)); border-radius: 999px; font-size: 13px; font-weight: 650; background: var(--ui-accent); color: var(--primary); }
.badge.success { color: var(--success); background: var(--success-soft); }
.badge.warning { color: var(--warning); background: color-mix(in srgb, var(--warning) 13%, var(--surface)); }
.log-overview { width: 100%; margin-bottom: 18px; padding: 18px 20px; display: grid; grid-template-columns: minmax(230px, .72fr) minmax(0, 1.28fr); align-items: center; gap: 24px; border: 1px solid color-mix(in srgb, var(--primary) 22%, var(--line)); border-radius: 8px; background: color-mix(in srgb, var(--surface) 92%, transparent); box-shadow: 0 12px 28px rgba(18, 29, 52, .07); }
.log-overview-copy { min-width: 0; }
.log-overview-copy > span { color: var(--primary); font-size: 13px; font-weight: 900; letter-spacing: 0; }
.log-overview-copy h2 { margin: 5px 0 4px; font-size: 20px; }
.log-overview-copy p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.55; }
.log-overview-metrics { min-width: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.log-overview-metrics > div { min-width: 0; padding: 4px 14px; display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: center; gap: 10px; border-left: 1px solid var(--line); }
.log-overview-metrics > div:first-child { border-left: 0; }
.log-overview-icon { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid color-mix(in srgb, var(--primary) 22%, var(--line)); border-radius: 8px; color: var(--primary); background: var(--primary-soft); }
.log-overview-icon .ui-icon { width: 17px; height: 17px; }
.log-overview-metrics .attention .log-overview-icon { color: var(--warning); border-color: color-mix(in srgb, var(--warning) 25%, var(--line)); background: color-mix(in srgb, var(--warning) 10%, var(--surface)); }
.log-overview-metrics > div > div { min-width: 0; display: grid; gap: 1px; }
.log-overview-metrics small, .log-overview-metrics em { overflow: hidden; color: var(--muted); font-size: 12px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
.log-overview-metrics em { overflow: visible; white-space: normal; overflow-wrap: anywhere; line-height: 1.45; }
.log-overview-metrics strong { overflow: hidden; font-size: 17px; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.log-overview-metrics .attention strong { color: var(--warning); }
.log-console { overflow: hidden; }
.log-toolbar { min-height: 86px; padding: 16px 18px; display: flex; align-items: center; justify-content: space-between; gap: 18px; background: var(--surface-soft); border-bottom: 1px solid var(--line); }
.log-toolbar-title { min-width: 0; display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.log-toolbar-title > div { min-width: 0; }
.log-kicker { display: block; margin-bottom: 2px; color: var(--primary); font-size: 12px; font-weight: 850; letter-spacing: 0; }
.log-toolbar-title h2 { font-size: 20px; font-weight: 750; }
.log-count { color: var(--muted); font-size: 13px; white-space: nowrap; }
.log-connection { min-height: 29px; padding: 0 10px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--line); border-radius: 7px; color: var(--muted); background: var(--surface); white-space: nowrap; }
.log-connection i { width: 7px; height: 7px; border-radius: 50%; background: var(--muted); }
.log-connection b { font-size: 13px; font-weight: 750; }
.log-connection.connected { color: var(--success); border-color: color-mix(in srgb, var(--success) 26%, var(--line)); }
.log-connection.connected i { background: var(--success); box-shadow: 0 0 0 4px color-mix(in srgb, var(--success) 15%, transparent); }
.log-connection.connecting { color: var(--warning); }
.log-connection.connecting i { background: var(--warning); animation: log-pulse 1.15s ease-in-out infinite; }
.log-connection.paused { color: var(--warning); border-color: color-mix(in srgb, var(--warning) 25%, var(--line)); }
.log-connection.offline { color: var(--danger); }
@keyframes log-pulse { 50% { opacity: .35; } }
.log-live-controls { min-width: 0; display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.log-live-controls form { margin: 0; }
.log-action { min-height: 38px; padding: 0 11px; gap: 6px; border-radius: 7px; white-space: nowrap; box-shadow: none; }
.log-action .ui-icon { width: 16px; height: 16px; }
.log-pause-action { position: relative; }
.log-pause-action.active { color: var(--warning); border-color: color-mix(in srgb, var(--warning) 30%, var(--line)); background: color-mix(in srgb, var(--warning) 9%, var(--surface)); }
.log-pause-action em { min-width: 19px; height: 19px; padding: 0 5px; display: inline-grid; place-items: center; border-radius: 999px; color: #fff; background: var(--warning); font-size: 12px; font-style: normal; font-weight: 850; }
.log-pause-action em[hidden] { display: none; }
.log-follow-toggle { min-height: 38px; padding: 0 8px; display: inline-flex; align-items: center; gap: 7px; color: var(--muted); font-size: 13px; white-space: nowrap; cursor: pointer; }
.log-follow-toggle input { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); opacity: 0; pointer-events: none; }
.log-follow-track { width: 30px; height: 18px; padding: 2px; display: block; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); transition: .18s ease; }
.log-follow-track i { width: 12px; height: 12px; display: block; border-radius: 50%; background: var(--muted); transition: transform .18s ease, background .18s ease; }
.log-follow-toggle input:checked + .log-follow-track { border-color: color-mix(in srgb, var(--primary) 45%, var(--line)); background: var(--primary-soft); }
.log-follow-toggle input:checked + .log-follow-track i { background: var(--primary); transform: translateX(12px); }
.log-follow-toggle input:focus-visible + .log-follow-track { box-shadow: var(--ui-ring); }
.log-level-tabs { min-height: 66px; padding: 7px; display: grid; grid-template-columns: repeat(var(--log-level-count, 5), minmax(0, 1fr)); gap: 6px; border-bottom: 1px solid var(--line); background: var(--surface); }
.log-level-tab { min-width: 0; padding: 9px 10px; display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: center; gap: 8px; border: 1px solid transparent; border-radius: 7px; color: var(--muted); background: transparent; transition: .16s ease; }
.log-level-tab:hover { color: var(--text); border-color: var(--line); background: var(--surface-soft); }
.log-level-tab.active { color: var(--text); border-color: color-mix(in srgb, var(--primary) 34%, var(--line)); background: var(--primary-soft); }
.log-level-tab-icon { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 7px; color: var(--muted); background: var(--surface-soft); }
.log-level-tab-icon .ui-icon { width: 16px; height: 16px; }
.log-level-tab.active .log-level-tab-icon { color: var(--primary); background: color-mix(in srgb, var(--primary) 13%, var(--surface)); }
.log-level-tab > span:nth-child(2) { min-width: 0; display: grid; gap: 1px; }
.log-level-tab strong, .log-level-tab small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.log-level-tab strong { font-size: 13px; }
.log-level-tab small { color: var(--muted); font-size: 12px; }
.log-level-tab em { min-width: 26px; height: 24px; padding: 0 6px; display: grid; place-items: center; border-radius: 7px; color: var(--muted); background: var(--surface-soft); font-size: 12px; font-style: normal; font-weight: 800; }
.log-level-tab.active em { color: var(--primary); background: var(--surface); }
.log-filter-bar { container-type: inline-size; padding: 14px 16px 12px; display: grid; gap: 10px; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface-soft) 56%, var(--surface)); }
.log-query { min-width: 0; display: grid; grid-template-columns: minmax(130px, .75fr) minmax(130px, .75fr) minmax(220px, 1.55fr) minmax(105px, .55fr) auto auto; align-items: end; gap: 8px; }
.log-query label { min-width: 0; display: grid; gap: 4px; }
.log-query label > span:first-child { color: var(--muted); font-size: 12px; font-weight: 750; }
.log-query select, .log-query input { width: 100%; height: 40px; min-width: 0; padding: 0 10px; border: 1px solid var(--line); border-radius: 7px; color: var(--text); background: var(--surface); outline: none; font-size: 13px; }
.log-query select:focus, .log-query input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-soft); }
.log-search-control { position: relative; display: block; }
.log-search-control > .ui-icon { position: absolute; top: 12px; left: 11px; width: 16px; height: 16px; color: var(--muted); pointer-events: none; }
.log-search-control input { padding-left: 36px; padding-right: 38px; }
.log-search-control button { position: absolute; top: 4px; right: 4px; width: 32px; height: 32px; padding: 0; display: grid; place-items: center; border: 0; border-radius: 6px; color: var(--muted); background: transparent; cursor: pointer; }
.log-search-control button:hover { color: var(--text); background: var(--surface-soft); }
.log-search-control button .ui-icon { width: 15px; height: 15px; }
.log-search-control button[hidden] { display: none; }
.log-query .button { min-height: 40px; padding-inline: 11px; gap: 6px; }
.log-query .button .ui-icon { width: 15px; height: 15px; }
.log-filter-context { min-width: 0; display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 12px; }
.log-filter-context span { font-weight: 750; }
.log-filter-context strong { min-width: 0; overflow: hidden; color: var(--text); text-overflow: ellipsis; white-space: nowrap; }
.log-filter-context em { margin-left: auto; font-style: normal; white-space: nowrap; }
@container (min-width: 600px) and (max-width: 850px) {
  .log-filter-bar .log-query { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto auto; }
  .log-query .log-search { grid-column: 1 / 3; grid-row: 2; }
  .log-query .log-page-size { grid-column: 3 / 5; grid-row: 1; }
  .log-query .log-filter-submit { grid-column: 3; grid-row: 2; }
  .log-query .log-filter-reset { grid-column: 4; grid-row: 2; }
}
.log-stream-note { min-height: 42px; padding: 9px 16px; display: flex; align-items: center; gap: 8px; color: var(--warning); border-bottom: 1px solid color-mix(in srgb, var(--warning) 22%, var(--line)); background: color-mix(in srgb, var(--warning) 8%, var(--surface)); font-size: 13px; }
.log-stream-note .ui-icon { width: 17px; height: 17px; }
.log-stream-note[hidden] { display: none; }
.log-list { display: grid; }
.log-row { --log-row-tone: var(--primary); position: relative; padding: 15px 16px; display: grid; grid-template-columns: 4px minmax(0, 1fr); gap: 13px; border-top: 1px solid var(--line); align-items: stretch; transition: background .5s ease; }
.log-row.is-error { --log-row-tone: var(--danger); }
.log-row.is-warning { --log-row-tone: var(--warning); }
.log-row.is-debug { --log-row-tone: #8f75df; }
.log-row-new { background: color-mix(in srgb, var(--log-row-tone) 8%, var(--surface)); }
.log-row:first-child { border-top: 0; }
.log-row[hidden] { display: none; }
.log-row-marker { width: 4px; min-height: 100%; border-radius: 999px; background: color-mix(in srgb, var(--log-row-tone) 72%, var(--line)); }
.log-entry { min-width: 0; display: grid; gap: 8px; }
.log-entry-head { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 10px; }
.log-time { color: var(--muted); font-size: 12px; white-space: nowrap; }
.log-tags { min-width: 0; display: flex; align-items: center; gap: 7px; }
.log-level { min-width: 47px; justify-content: center; }
.log-level.error { color: var(--danger); background: color-mix(in srgb, var(--danger) 11%, var(--surface)); }
.log-level.warning { color: var(--warning); background: color-mix(in srgb, var(--warning) 12%, var(--surface)); }
.log-level.debug { color: #8f75df; background: color-mix(in srgb, #8f75df 12%, var(--surface)); }
.log-module { min-width: 0; overflow: hidden; color: var(--muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.log-entry-actions { display: flex; align-items: center; gap: 4px; }
.log-entry-actions button { width: 30px; height: 30px; padding: 0; display: grid; place-items: center; border: 1px solid transparent; border-radius: 7px; color: var(--muted); background: transparent; cursor: pointer; }
.log-entry-actions button:hover { color: var(--text); border-color: var(--line); background: var(--surface-soft); }
.log-entry-actions button.copied { color: var(--success); border-color: color-mix(in srgb, var(--success) 25%, var(--line)); background: var(--success-soft); }
.log-entry-actions .ui-icon { width: 15px; height: 15px; }
.log-message { min-width: 0; }
.log-title { display: block; font-size: 14px; line-height: 1.5; }
.log-detail { margin-top: 3px; color: var(--muted); font-size: 13px; line-height: 1.55; overflow-wrap: anywhere; }
.log-detail.is-clamped { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.log-meta-list { margin-top: 7px; display: flex; align-items: center; flex-wrap: wrap; gap: 5px; }
.log-meta-list span, .log-meta-list code { min-width: 0; max-width: 100%; padding: 3px 7px; overflow: hidden; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); background: var(--surface-soft); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.log-meta-list code { flex: 0 1 auto; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.log-list .empty { min-height: 250px; display: grid; place-items: center; align-content: center; gap: 7px; }
.log-list .empty-icon { width: 44px; height: 44px; margin: 0; display: grid; place-items: center; border-radius: 8px; color: var(--primary); background: var(--primary-soft); }
.log-list .empty-icon .ui-icon { width: 22px; height: 22px; }
.log-list .empty strong { color: var(--text); font-size: 15px; }
.log-list .empty span { font-size: 13px; }
.log-list .empty[hidden] { display: none; }
.log-pagination { min-height: 60px; padding: 0 16px; border-top: 1px solid var(--line); background: var(--surface-soft); }
.empty { padding: 54px 20px; text-align: center; color: var(--muted); }
.empty-icon { font-size: 30px; margin-bottom: 10px; }
.filter-empty { display: none; }
.filter-empty:not([hidden]) { display: block; }
.auth-page { min-height: 100vh; display: grid; place-items: center; padding: 30px; background: var(--login-bg); }
.auth-wrap { width: min(460px, 100%); }
.auth-brand { justify-content: center; padding-bottom: 20px; }
.auth-card { padding: 30px; }
.auth-title { text-align: center; margin-bottom: 24px; }
.auth-title p { color: var(--muted); margin: 8px 0 0; }
.auth-card .field { margin-top: 15px; }
.auth-card .button { width: 100%; margin-top: 22px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.login-page {
  position: relative; isolation: isolate; min-height: 100vh; min-height: 100dvh; display: grid; place-items: center; padding: clamp(20px, 4vh, 38px) 16px; overflow-x: hidden; overflow-y: auto;
  background: var(--login-bg);
}
.login-page::before, .login-page::after { content: none; }
.login-backdrop { position: fixed; inset: 0; z-index: -2; overflow: hidden; background: var(--login-bg); }
.login-backdrop-layer {
  position: absolute; inset: -3%; width: 106%; height: 106%; object-fit: cover; opacity: 0; transform: scale(1.015);
  filter: saturate(.82) contrast(.98); transition: opacity 1.5s ease-in-out, transform 8s linear; will-change: opacity, transform;
}
.login-backdrop-layer.is-active { opacity: 1; transform: scale(1.055); }
.login-backdrop-overlay {
  position: absolute; inset: 0;
  background: radial-gradient(circle at 18% 14%, color-mix(in srgb, #52c7d8 8%, transparent), transparent 34%), radial-gradient(circle at 82% 78%, color-mix(in srgb, #8174f2 9%, transparent), transparent 38%);
  transition: background .35s ease;
}
.login-backdrop[data-ready="true"] .login-backdrop-overlay { background: linear-gradient(180deg, rgba(13,15,23,.42) 0%, rgba(13,15,23,.78) 100%), radial-gradient(ellipse at center, transparent 10%, rgba(0,0,0,.28) 58%, rgba(0,0,0,.62) 100%); }
:root[data-density="compact"] .main { --page-gutter: 20px; padding: var(--page-gutter); }
:root[data-density="compact"] .card-pad { padding: 16px; }
:root[data-density="compact"] .stat { min-height: 90px; padding: 14px 16px; }
:root[data-density="compact"] .grid { gap: 11px; }
:root[data-density="compact"] .form-grid { gap: 11px; }
:root[data-density="compact"] .log-row { padding: 11px 15px; }
.login-card { position: relative; z-index: 1; width: min(368px, 100%); padding: 35px 28px 25px; overflow: hidden; border: 1px solid color-mix(in srgb, white 12%, var(--border-color)); border-radius: 20px; color: var(--text-primary); background: var(--login-card-bg); box-shadow: 0 24px 64px rgba(0, 0, 0, .32), inset 0 1px 0 rgba(255, 255, 255, .08); backdrop-filter: blur(22px) saturate(112%); -webkit-backdrop-filter: blur(22px) saturate(112%); }
.login-card::before { content: ''; position: absolute; left: 26%; right: 26%; top: 0; height: 1px; background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--accent-color) 72%, white), transparent); box-shadow: 0 0 18px color-mix(in srgb, var(--accent-color) 38%, transparent); }
.login-brand { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; margin-bottom: 27px; color: var(--text); line-height: 1; font-weight: 800; letter-spacing: -.6px; }
.login-brand > span { font-size: 27px; letter-spacing: -.045em; }
.login-brand > small { margin-top: 1px; color: color-mix(in srgb, var(--text) 55%, transparent); font-size: 13px; font-weight: 650; letter-spacing: .2em; }
.login-logo {
  width: 70px;
  height: 70px;
  display: block;
  object-fit: cover;
  border-radius: 20px;
  box-shadow: 0 12px 28px color-mix(in srgb, var(--brand-primary) 27%, transparent);
}
.login-card .notice { margin-bottom: 13px; padding: 9px 11px; border-color: color-mix(in srgb, white 10%, var(--border-color)); border-radius: 9px; font-size: 14px; }
.login-card .notice.success { color: var(--success); background: color-mix(in srgb, var(--success) 9%, transparent); border-color: color-mix(in srgb, var(--success) 24%, transparent); }
.login-card .notice.error { color: color-mix(in srgb, var(--danger) 82%, white); background: color-mix(in srgb, var(--danger) 8%, transparent); border-color: color-mix(in srgb, var(--danger) 24%, transparent); }
.login-form { display: grid; gap: 16px; }
.login-input-shell { position: relative; }
.login-field-icon { position: absolute; left: 15px; top: 50%; z-index: 2; width: 18px; height: 18px; display: grid; place-items: center; transform: translateY(-50%); color: color-mix(in srgb, var(--text) 56%, transparent); }
.login-field-icon svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
.login-form input:not([type="checkbox"]) { min-height: 51px; padding: 0 45px; border: 1px solid color-mix(in srgb, white 13%, var(--border-color)); border-radius: 11px; color: var(--text-primary); background: var(--login-input-bg); box-shadow: inset 0 1px 0 rgba(255,255,255,.03); font-size: 14px; }
.login-form input:not([type="checkbox"]):focus { border-color: color-mix(in srgb, var(--accent-color) 68%, white); box-shadow: 0 0 0 2px var(--accent-focus), inset 0 1px 0 rgba(255,255,255,.03); }
.login-form input::placeholder { color: color-mix(in srgb, var(--text) 42%, transparent); }
.login-submit { min-height: 51px; margin-top: 3px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; border: 1px solid color-mix(in srgb, var(--accent-color) 38%, var(--border-color)); border-radius: 11px; font-size: 14px; font-weight: 720; background: var(--button-gradient); box-shadow: 0 10px 23px color-mix(in srgb, var(--accent-color) 19%, transparent); }
.login-submit > span { font: inherit; }
.login-submit > .ui-icon { width: 16px; height: 16px; transition: transform .16s ease; }
.login-submit:hover > .ui-icon { transform: translateX(3px); }
.login-remember { width: max-content; display: flex; align-items: center; gap: 8px; color: color-mix(in srgb, var(--text) 66%, transparent); cursor: pointer; font-size: 14px; font-weight: 500; }
.login-remember input { width: 15px; height: 15px; accent-color: #7181ff; }
.login-footer { margin-top: 25px; display: flex; align-items: center; justify-content: center; gap: 10px; color: color-mix(in srgb, var(--text) 42%, transparent); font-size: 13px; letter-spacing: .03em; }
.login-footer i { width: 1px; height: 13px; background: rgba(255,255,255,.24); }
.member-auth-link { display: block; padding: 2px; color: color-mix(in srgb, var(--text) 62%, transparent); text-align: center; font-size: 14px; }
.member-auth-link:hover { color: #fff; }
.login-options { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.login-options > a { color: color-mix(in srgb, var(--text) 66%, transparent); font-size: 14px; }
.telegram-login { margin-top: 14px; display: grid; justify-items: center; gap: 10px; }
.telegram-login > span { width: 100%; display: flex; align-items: center; gap: 10px; color: rgba(224,232,255,.58); font-size: 14px; }
.telegram-login > span::before, .telegram-login > span::after { content: ''; height: 1px; flex: 1; background: rgba(255,255,255,.14); }
.member-login-page { background: var(--login-bg); }
.member-login-card { border-color: color-mix(in srgb, var(--accent-secondary) 30%, var(--border-color)); }
.member-register-form { gap: 13px; }
.member-register-form .field { gap: 5px; }
.member-register-form label { color: rgba(236, 241, 250, .8); }
.member-register-form input { min-height: 50px !important; padding-left: 14px !important; }
.member-register-form .password-field input { padding-right: 58px !important; }

.member-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.small-value { font-size: 14px; line-height: 1.4; }
.member-console { overflow: hidden; }
.member-tabs { display: flex; gap: 4px; padding: 11px 14px 0; overflow-x: auto; border-bottom: 1px solid var(--line); background: var(--surface-soft); }
.member-tab { min-width: max-content; padding: 13px 17px; border-radius: 10px 10px 0 0; color: var(--muted); font-weight: 700; }
.member-tab:hover { color: var(--primary); background: var(--primary-soft); }
.member-tab.active { color: var(--primary); background: var(--surface); box-shadow: 0 -2px 0 var(--primary) inset; }
.member-panel { min-height: 420px; padding: 22px; }
.panel-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 20px; }
.panel-head h2 { font-size: 20px; }
.panel-head p { margin: 5px 0 0; color: var(--muted); font-size: 14px; }
.panel-actions { display: flex; align-items: center; gap: 10px; }
.panel-actions form { margin: 0; }
.member-sync-restore { margin: -4px -4px 14px; padding: 14px 16px; display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: 12px; border: 1px solid color-mix(in srgb, var(--warning) 35%, var(--line)); border-radius: 8px; background: color-mix(in srgb, var(--warning) 7%, var(--surface)); }
.member-sync-restore > span { width: 38px; height: 38px; display: grid; place-items: center; color: var(--warning); border-radius: 8px; background: color-mix(in srgb, var(--warning) 14%, transparent); }
.member-sync-restore > span svg { width: 19px; height: 19px; }
.member-sync-restore > div { min-width: 0; display: grid; gap: 3px; }
.member-sync-restore strong { font-size: 14px; }
.member-sync-restore p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.45; }
.member-sync-restore form { margin: 0; }
.member-account-hero { min-height: 142px; margin: -4px -4px 22px; padding: 25px 27px; display: flex; align-items: center; justify-content: space-between; gap: 22px; overflow: hidden; border: 1px solid color-mix(in srgb, var(--primary) 20%, var(--line)); border-radius: 18px; background: var(--feature-hero-background); }
.member-account-hero > div:first-child > span { display: block; margin-bottom: 7px; color: var(--primary); font-size: 14px; font-weight: 800; letter-spacing: .08em; }
.member-account-hero h2 { font-size: 24px; }
.member-account-hero p { max-width: 620px; margin: 7px 0 0; color: var(--muted); }
.member-list-head { margin: 0 2px 13px; display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; }
.member-list-head > div { display: flex; align-items: center; gap: 10px; }
.member-list-head span { padding: 4px 9px; border-radius: 99px; color: var(--primary); background: var(--primary-soft); font-size: 13px; font-weight: 750; }
.member-list-head > p { margin: 0; color: var(--muted); font-size: 14px; }
.member-user-grid { display: grid; grid-template-columns: 1fr; gap: 10px; }
.member-filter { padding: 14px; display: grid; grid-template-columns: minmax(260px, 1fr) minmax(190px, .38fr) auto auto; align-items: end; gap: 10px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface-soft); }
.member-filter label { min-width: 0; display: grid; gap: 7px; }
.member-filter label > span { color: var(--muted); font-size: 14px; font-weight: 750; }
.member-filter input, .member-filter select { width: 100%; height: 42px; padding: 0 12px; border: 1px solid var(--line); border-radius: 10px; outline: none; color: var(--text); background: var(--surface); font: inherit; font-size: 14px; }
.member-filter input:focus, .member-filter select:focus { border-color: var(--primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 13%, transparent); }
.member-filter .button { min-height: 42px; padding-inline: 16px; }
.member-filter > a { min-height: 42px; padding: 0 10px; display: inline-flex; align-items: center; justify-content: center; color: var(--muted); font-size: 14px; font-weight: 700; }
.member-filter > a:hover { color: var(--primary); }
.member-user-card { min-width: 0; padding: 14px 16px; display: grid; grid-template-columns: minmax(250px, .9fr) minmax(380px, 1.45fr) auto; align-items: center; gap: 18px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); box-shadow: 0 5px 18px rgba(42, 52, 79, .035); transition: border-color .18s ease, box-shadow .18s ease; }
.member-user-card:hover { border-color: color-mix(in srgb, var(--primary) 35%, var(--line)); box-shadow: 0 10px 24px rgba(42, 52, 79, .07); }
.member-user-main { min-width: 0; display: flex; align-items: center; gap: 13px; }
.member-user-main > img { width: 48px; height: 48px; flex: 0 0 auto; object-fit: cover; border: 3px solid var(--primary-soft); border-radius: 14px; background: var(--primary-soft); }
.member-user-identity { min-width: 0; flex: 1; }
.member-user-identity > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.member-user-identity h3 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; }
.member-user-identity p { margin: 4px 0 0; color: var(--muted); font-size: 14px; }
.member-user-details { min-width: 0; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.member-user-details > div { min-width: 0; padding: 0 12px; border-left: 1px solid var(--line); }
.member-user-details > div:first-child { padding-left: 0; border-left: 0; }
.member-user-details > div:last-child { padding-right: 0; }
.member-user-details dt { margin-bottom: 5px; color: var(--muted); font-size: 13px; }
.member-user-details dd { margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; font-weight: 750; }
.member-user-details > div:first-child dd { color: var(--primary); }
.member-user-actions { display: flex; justify-content: flex-end; gap: 8px; }
.member-user-actions form { margin: 0; }
.member-user-actions .button { min-height: 36px; padding: 0 12px; font-size: 14px; white-space: nowrap; }
.member-delete-dialog { width: min(680px, calc(100vw - 30px)); max-height: calc(100dvh - 30px); overflow-y: auto; overscroll-behavior: contain; }
.member-delete-body { padding: 20px 22px 6px; display: grid; gap: 14px; }
.member-delete-member { padding: 12px 13px; display: flex; align-items: center; gap: 11px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.member-delete-member img { width: 42px; height: 42px; flex: 0 0 auto; object-fit: cover; border-radius: 8px; }
.member-delete-member > div { min-width: 0; display: grid; gap: 2px; }
.member-delete-member small, .member-delete-member span { color: var(--muted); font-size: 13px; }
.member-delete-member strong, .member-delete-member span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.member-delete-options { display: grid; gap: 9px; }
.member-delete-choice { margin: 0; padding: 14px; display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.member-delete-choice.destructive { border-color: color-mix(in srgb, var(--danger) 30%, var(--line)); background: color-mix(in srgb, var(--danger) 4%, var(--surface)); }
.member-delete-choice-icon { width: 38px; height: 38px; display: grid; place-items: center; color: var(--muted); border-radius: 8px; background: var(--surface-soft); }
.member-delete-choice.destructive .member-delete-choice-icon { color: var(--danger); background: color-mix(in srgb, var(--danger) 10%, transparent); }
.member-delete-choice-icon svg { width: 18px; height: 18px; }
.member-delete-choice-copy { min-width: 0; display: grid; gap: 4px; }
.member-delete-choice-copy strong { font-size: 14px; }
.member-delete-choice-copy p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.member-delete-choice .button { min-width: 126px; }
.member-playback-dialog { width: min(720px, calc(100vw - 30px)); max-height: calc(100dvh - 30px); overflow-y: auto; overscroll-behavior: contain; }
.member-playback-dialog-body { padding: 20px 22px 6px; display: grid; gap: 16px; }
.member-playback-dialog-member { padding: 13px 14px; display: flex; align-items: center; gap: 12px; border: 1px solid color-mix(in srgb, var(--primary) 22%, var(--line)); border-radius: 13px; background: var(--primary-soft); }
.member-playback-dialog-member img { width: 44px; height: 44px; flex: 0 0 auto; object-fit: cover; border: 2px solid color-mix(in srgb, var(--primary) 35%, transparent); border-radius: 13px; }
.member-playback-dialog-member div { min-width: 0; display: grid; gap: 2px; }
.member-playback-dialog-member small, .member-playback-dialog-member span { color: var(--muted); font-size: 13px; }
.member-playback-dialog-member strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
.member-playback-options { min-width: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.member-pool-policy { grid-column: 1 / -1; min-width: 0; padding-block: 14px; border-block: 1px solid var(--line); }
.member-pool-policy > .muted, .member-pool-policy > a { font-size: 13px; overflow-wrap: anywhere; }
.member-playback-option { position: relative; min-width: 0; cursor: pointer; }
.member-playback-option > input { position: absolute; inline-size: 1px; block-size: 1px; opacity: 0; pointer-events: none; }
.member-playback-option > span { min-height: 88px; padding: 11px 12px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 5px 8px; border: 1px solid var(--line); border-radius: 12px; background: color-mix(in srgb, var(--surface) 94%, transparent); transition: border-color .18s ease, background .18s ease, box-shadow .18s ease; }
.member-playback-option svg { width: 16px; height: 16px; color: var(--muted); }
.member-playback-option b { min-width: 0; font-size: 14px; }
.member-playback-option small { grid-column: 1 / -1; color: var(--muted); font-size: 13px; line-height: 1.45; }
.member-playback-option em { padding: 3px 6px; color: var(--muted); border-radius: 999px; background: var(--surface-strong); font-size: 12px; font-style: normal; font-weight: 750; white-space: nowrap; }
.member-playback-option.ready em { color: var(--success); background: color-mix(in srgb, var(--success) 10%, transparent); }
.member-playback-option.warning em { color: var(--warning); background: color-mix(in srgb, var(--warning) 10%, transparent); }
.member-playback-option:hover > span { border-color: color-mix(in srgb, var(--primary) 36%, var(--line)); }
.member-playback-option:has(input:checked) > span { border-color: color-mix(in srgb, var(--primary) 65%, var(--line)); background: color-mix(in srgb, var(--primary-soft) 78%, var(--surface)); box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary) 10%, transparent); }
.member-playback-option:has(input:checked) svg { color: var(--primary); }
.member-playback-circuit { padding: 13px; display: grid; gap: 11px; border: 1px solid color-mix(in srgb, var(--warning) 24%, var(--line)); border-radius: 13px; background: color-mix(in srgb, var(--warning) 5%, var(--surface)); }
.member-playback-circuit > header { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 10px; }
.member-playback-circuit > header > span { width: 34px; height: 34px; display: grid; place-items: center; color: var(--warning); border-radius: 10px; background: color-mix(in srgb, var(--warning) 12%, transparent); }
.member-playback-circuit > header svg { width: 17px; height: 17px; }
.member-playback-circuit > header div { min-width: 0; display: grid; gap: 2px; }
.member-playback-circuit > header b { font-size: 14px; }
.member-playback-circuit > header small, .member-playback-circuit > p { color: var(--muted); font-size: 13px; line-height: 1.5; }
.member-playback-circuit > header em { padding: 4px 7px; color: var(--success); border-radius: 999px; background: color-mix(in srgb, var(--success) 10%, transparent); font-size: 12px; font-style: normal; font-weight: 800; white-space: nowrap; }
.member-playback-circuit > header em.warning { color: var(--warning); background: color-mix(in srgb, var(--warning) 12%, transparent); }
.member-playback-circuit-controls { display: grid; grid-template-columns: minmax(0, 1fr) 170px; gap: 9px; }
.member-playback-circuit-switch { position: relative; min-height: 58px; padding: 10px 70px 10px 11px; display: flex; align-items: center; border: 1px solid var(--line); border-radius: 11px; background: var(--surface); cursor: pointer; transition: border-color .18s ease, background .18s ease; }
.member-playback-circuit-switch:hover { border-color: color-mix(in srgb, var(--primary) 30%, var(--line)); background: color-mix(in srgb, var(--primary) 3%, var(--surface)); }
.member-playback-circuit-switch > input[type="checkbox"] { position: absolute; top: 50%; right: 14px; width: 44px; height: 24px; min-height: 0; margin: 0; padding: 0; appearance: none; border: 1px solid color-mix(in srgb, var(--muted) 34%, var(--line)); border-radius: 999px; outline: 0; background: color-mix(in srgb, var(--muted) 16%, var(--surface-strong)); box-shadow: inset 0 1px 3px rgba(0,0,0,.22); cursor: pointer; transform: translateY(-50%); transition: border-color .2s ease, background .2s ease, box-shadow .2s ease; }
.member-playback-circuit-switch > input[type="checkbox"]::after { content: ''; position: absolute; top: 2px; left: 2px; width: 18px; height: 18px; border-radius: 50%; background: color-mix(in srgb, var(--muted) 72%, white); box-shadow: 0 2px 5px rgba(0,0,0,.3); transition: transform .2s cubic-bezier(.2,.8,.2,1), background .2s ease; }
.member-playback-circuit-switch > input[type="checkbox"]:checked { border-color: color-mix(in srgb, var(--primary) 72%, white 8%); background: linear-gradient(135deg, color-mix(in srgb, var(--primary) 84%, #4f46e5), color-mix(in srgb, var(--primary) 76%, #c026d3)); box-shadow: inset 0 1px 2px rgba(255,255,255,.24), 0 0 0 3px color-mix(in srgb, var(--primary) 10%, transparent); }
.member-playback-circuit-switch > input[type="checkbox"]:checked::after { background: #fff; transform: translateX(20px); }
.member-playback-circuit-switch > input[type="checkbox"]:focus-visible { border-color: var(--primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 20%, transparent); }
.member-playback-circuit-switch > span { display: grid; gap: 3px; }
.member-playback-circuit-switch b, .member-playback-device-limit > span { font-size: 13px; }
.member-playback-circuit-switch small, .member-playback-device-limit small { color: var(--muted); font-size: 12px; }
.member-playback-device-limit { min-height: 58px; padding: 8px 10px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 3px 8px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface); }
.member-playback-device-limit input { grid-row: 1 / 3; grid-column: 2; width: 58px; height: 36px; padding: 0 8px; text-align: center; }
.member-playback-circuit > p { margin: 0; }
.member-playback-admin-note { margin: 0; display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: 13px; line-height: 1.5; }
.member-playback-admin-note svg { width: 15px; height: 15px; flex: 0 0 auto; color: var(--primary); }
.member-empty { min-height: 240px; border: 1px dashed var(--line); border-radius: 16px; }
.member-grid-pagination { grid-column: 1 / -1; padding: 4px 2px 0; }
.table-wrap { width: 100%; overflow-x: auto; border: 1px solid var(--ui-border); border-radius: var(--ui-radius-lg); background: var(--ui-card); box-shadow: var(--ui-shadow-xs); }
.member-table { width: 100%; border-collapse: collapse; min-width: 820px; }
.member-table th, .member-table td { padding: 10px 12px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: middle; }
.member-table th { height: var(--ui-control-lg); color: var(--ui-muted-foreground); background: var(--ui-muted); font-size: 14px; font-weight: 650; letter-spacing: .02em; white-space: nowrap; }
.member-table tbody tr { transition: background-color .16s ease; }
.member-table tbody tr:hover { background: color-mix(in srgb, var(--surface-soft) 52%, transparent); }
.member-table tbody tr:last-child td { border-bottom: 0; }
.member-table td { font-size: 14px; }
.member-table td > strong, .member-table td > small { display: block; }
.member-table td > small { margin-top: 4px; color: var(--muted); }
.member-table code { padding: 5px 8px; border-radius: 6px; color: var(--primary); background: var(--primary-soft); font-weight: 750; white-space: nowrap; }
.table-actions { display: flex; align-items: center; gap: 6px; }
.table-actions form { margin: 0; }
.table-actions .button { min-height: 34px; padding: 0 10px; font-size: 14px; white-space: nowrap; }
.member-account-table { min-width: 820px; table-layout: fixed; }
.member-account-table th, .member-account-table td { padding: 16px; }
.member-account-table .actions-heading { text-align: right; padding-right: 22px; }
.member-account-table .table-actions { justify-content: flex-end; padding-right: 22px; }
.member-account-dialog { width: min(680px, calc(100vw - 24px)); border-radius: 8px; }
.member-account-dialog > .dialog-head { padding: 18px 24px; align-items: center; }
.member-create-title { display: flex; align-items: center; gap: 12px; }
.member-create-title > .ui-icon { width: 22px; height: 22px; color: var(--primary); }
.member-account-dialog > form { display: flex; flex-direction: column; min-height: 0; }
.member-create-body { overflow-y: auto; overscroll-behavior: contain; padding: 0 24px; }
.member-create-section { padding: 20px 0; }
.member-create-section + .member-create-section { border-top: 1px solid var(--line); }
.member-create-section h3 { margin: 0 0 16px; font-size: 13px; font-weight: 650; color: var(--muted); }
.member-create-section .account-create-grid { padding: 0; gap: 16px; }
.member-create-section .field { gap: 7px; }
.member-create-section .field > label, .member-create-section .member-policy-select { font-size: 13px; font-weight: 500; }
.member-create-section input { min-width: 0; height: 42px; font-size: 13px; }
.member-create-section .ui-select-trigger { min-height: 42px; font-size: 13px; }
.member-field-optional { margin-left: 4px; color: var(--muted); font-size: 12px; }
.member-field-error { font-size: 12px; color: var(--danger); line-height: 1.5; }
.member-create-error { margin: 0 0 20px; padding: 12px; border-left: 3px solid var(--danger); background: color-mix(in srgb, var(--danger) 8%, transparent); color: var(--danger); font-size: 13px; line-height: 1.6; }
.member-account-dialog .dialog-actions { flex: 0 0 auto; padding: 16px 24px; border-top: 1px solid var(--line); }
.member-account-dialog .dialog-actions .button { min-height: 40px; }
.member-account-dialog [hidden] { display: none !important; }
.dialog-kicker { display: block; margin-bottom: 5px; color: var(--primary); font-size: 13px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.account-create-grid { padding: 22px 24px 8px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.account-create-grid .field { min-width: 0; }
.account-create-grid .field.full { grid-column: 1 / -1; }
.permission-template-field { padding: 13px 14px; border: 1px solid color-mix(in srgb, var(--primary) 24%, var(--line)); border-radius: 12px; background: var(--primary-soft); }
.permission-template-field .help { line-height: 1.55; }
.dialog-actions { padding: 16px 24px 22px; display: flex; align-items: center; justify-content: flex-end; gap: 10px; }
.member-split { display: grid; grid-template-columns: minmax(280px, .65fr) minmax(0, 1.35fr); gap: 20px; }
.member-form { align-self: start; display: grid; gap: 15px; padding: 19px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-soft); }
.merchant-list, .notice-list { display: grid; align-content: start; gap: 10px; }
.merchant-card, .notice-card { display: flex; align-items: center; gap: 13px; padding: 15px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface); }
.merchant-card > div:nth-child(2), .notice-card > div { min-width: 0; flex: 1; }
.merchant-avatar { width: 43px; height: 43px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 12px; color: white; background: linear-gradient(145deg, var(--primary), #8d55dc); font-weight: 800; }
.merchant-card p, .merchant-card small, .notice-card p, .notice-card span { color: var(--muted); }
.merchant-card p { margin: 4px 0; font-size: 14px; }
.merchant-card small { font-size: 14px; }
.notice-card { align-items: flex-start; }
.notice-card span { font-size: 13px; }
.notice-card h3 { margin-top: 6px; }
.notice-card p { margin: 6px 0 0; white-space: pre-wrap; font-size: 14px; }
.member-registration-path { display: grid; grid-template-columns: 128px minmax(0, 1fr); align-items: center; gap: 7px 12px; margin-bottom: 16px; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.member-registration-path > label { font-weight: 700; }
.member-registration-path > div { min-width: 0; display: flex; gap: 8px; }
.member-registration-path input { min-width: 0; flex: 1; }
.member-registration-path small { grid-column: 2; color: var(--muted); line-height: 1.5; }
.code-create { display: grid; grid-template-columns: 1fr 1.25fr 1.25fr 90px auto; align-items: end; gap: 10px; margin-bottom: 8px; padding: 16px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-soft); }
.code-create label { display: grid; gap: 7px; color: var(--muted); }
.template-security-note { margin: 0 0 18px; padding: 10px 12px; border-radius: 10px; color: var(--muted); background: var(--primary-soft); font-size: 14px; line-height: 1.55; }
.template-security-note.success { color: var(--success); }
.template-security-note.error { color: var(--danger); background: color-mix(in srgb, var(--danger) 8%, var(--surface)); }
.panel-count { padding: 7px 11px; border-radius: 99px; color: var(--primary); background: var(--primary-soft); font-size: 14px; font-weight: 750; white-space: nowrap; }
.code-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.code-summary a { min-height: 78px; padding: 15px 17px; display: flex; align-items: center; justify-content: space-between; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-soft); transition: .16s ease; }
.code-summary a:hover, .code-summary a.active { border-color: var(--primary); background: var(--primary-soft); transform: translateY(-1px); }
.code-summary span { color: var(--muted); font-weight: 650; }
.code-summary strong { font-size: 25px; }
.code-summary .available strong { color: var(--success); }
.code-summary .consumed strong { color: var(--muted); }
.code-filter { display: grid; grid-template-columns: minmax(240px, 1.7fr) repeat(2, minmax(150px, 1fr)) auto auto; align-items: end; gap: 9px; margin-bottom: 12px; }
.code-filter label { display: grid; gap: 6px; color: var(--muted); }
.code-filter > a { min-height: 42px; display: grid; place-items: center; padding: 0 8px; color: var(--muted); }
.bulk-toolbar { min-height: 58px; padding: 9px 12px; display: flex; align-items: center; gap: 16px; border: 1px solid var(--line); border-bottom: 0; border-radius: 13px 13px 0 0; background: var(--surface-soft); }
.bulk-toolbar > span { margin-right: auto; color: var(--muted); font-size: 14px; }
.bulk-toolbar > div { display: flex; gap: 7px; }
.bulk-toolbar .button { min-height: 35px; padding: 0 11px; font-size: 14px; }
.danger-text { color: var(--danger) !important; }
.select-all, .row-select { display: flex; align-items: center; gap: 7px; color: var(--muted); font-weight: 600; white-space: nowrap; cursor: pointer; }
.select-all input, .row-select input { width: 16px; min-height: 16px; accent-color: var(--primary); }
.code-table-form .table-wrap { border-radius: 0 0 13px 13px; }
.code-table { min-width: 1120px; }
.copy-code { display: inline-flex; align-items: center; gap: 8px; padding: 0; border: 0; color: var(--primary); background: transparent; cursor: pointer; }
.copy-code code { transition: .16s ease; }
.copy-code:hover code, .copy-code.copied code { color: white; background: var(--primary); }
.copy-code > span { color: var(--muted); font-size: 13px; }
.copy-code.copied > span { color: var(--success); }
.code-status { display: inline-flex; align-items: center; gap: 5px; padding: 5px 9px; border-radius: 99px; font-size: 14px; font-weight: 750; }
.code-status::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.code-status.unused { color: var(--success); background: var(--success-soft); }
.code-status.used { color: var(--muted); background: var(--surface-soft); }
.code-status.invalid { color: var(--danger); background: color-mix(in srgb, var(--danger) 10%, var(--surface)); }
.icon-delete { width: 31px; height: 31px; display: grid; place-items: center; border: 0; border-radius: 8px; color: var(--danger); background: transparent; cursor: pointer; font-size: 20px; line-height: 1; }
.icon-delete:hover { background: color-mix(in srgb, var(--danger) 10%, var(--surface)); }
.pagination-row { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 15px; color: var(--muted); font-size: 14px; }
.pagination { display: flex; align-items: center; gap: 5px; }
.pagination a { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); color: var(--text); }
.pagination a:hover, .pagination a.active { color: white; border-color: var(--primary); background: var(--primary); }
.pagination a.disabled { opacity: .4; pointer-events: none; }
.recommend-pagination-row { align-items: center; justify-content: center; }
.recommend-pagination-row > span { display: none; }
.recommend-pagination-controls { display: flex; align-items: center; justify-content: center; gap: 10px; min-width: 0; }
.recommend-page-size { display: inline-flex; align-items: center; gap: 7px; color: var(--muted); white-space: nowrap; }
.recommend-page-size select { width: 88px; min-width: 88px; min-height: 34px; height: 34px; padding: 0 28px 0 14px; border: 1px solid var(--line); border-radius: 8px; color: var(--text); background: var(--surface); font-size: 14px; font-weight: 750; }
.recommend-page-size select:hover { border-color: var(--primary); }

.merchant-layout { display: grid; grid-template-columns: 330px minmax(0, 1fr); gap: 18px; }
.create-side-card, .composer-card { padding: 22px; border: 1px solid var(--line); border-radius: 16px; background: linear-gradient(160deg, var(--surface-soft), var(--surface)); }
.create-side-card { align-self: start; }
.create-card-icon { width: 46px; height: 46px; margin-bottom: 15px; display: grid; place-items: center; border-radius: 14px; color: white; background: linear-gradient(145deg, var(--primary), #8d55dc); font-size: 25px; box-shadow: 0 8px 20px rgba(95,111,242,.22); }
.create-side-card > p { margin: 6px 0 18px; color: var(--muted); font-size: 14px; }
.create-side-card form { display: grid; gap: 14px; }
.merchant-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-content: start; gap: 12px; }
.merchant-card { min-width: 0; padding: 17px; display: block; border-radius: 15px; box-shadow: 0 5px 18px rgba(42,52,79,.04); }
.merchant-card-top { display: flex; align-items: center; gap: 12px; }
.merchant-main { flex: 1; min-width: 0; }
.merchant-main h3, .merchant-main p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.merchant-note { min-height: 42px; margin: 14px 0; padding: 10px 12px; border-radius: 9px; color: var(--muted); background: var(--surface-soft); font-size: 14px; line-height: 1.55; }
.merchant-metrics { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); }
.merchant-metrics span { padding-top: 12px; display: grid; gap: 3px; color: var(--muted); text-align: center; font-size: 13px; }
.merchant-metrics strong { color: var(--text); font-size: 15px; }
.designed-empty { grid-column: 1 / -1; min-height: 280px; padding: 30px; display: flex; flex-direction: column; align-items: center; justify-content: center; border: 1px dashed var(--line); border-radius: 16px; color: var(--muted); text-align: center; background: var(--surface-soft); }
.designed-empty.compact { min-height: 190px; border: 0; }
.designed-empty > span { width: 52px; height: 52px; margin-bottom: 13px; display: grid; place-items: center; border-radius: 50%; color: var(--primary); background: var(--primary-soft); font-size: 24px; }
.designed-empty h3 { color: var(--text); }
.designed-empty p { margin: 7px 0 0; font-size: 14px; }

.communication-layout { display: grid; grid-template-columns: minmax(500px, .95fr) minmax(0, 1.05fr); gap: 20px; }
.composer-card { align-self: start; padding: 26px; }
.composer-head { display: flex; align-items: center; gap: 12px; margin-bottom: 19px; }
.composer-head > span { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 13px; color: white; background: linear-gradient(145deg, var(--primary), #8658d7); font-size: 20px; }
.composer-head p { margin: 4px 0 0; color: var(--muted); font-size: 14px; }
.composer-card form { display: grid; gap: 14px; }
.composer-card input, .composer-card select { min-height: 50px; }
.composer-card textarea { min-height: 240px; resize: vertical; }
.message-composer textarea { min-height: 210px; }
.composer-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.composer-actions > span { color: var(--muted); font-size: 13px; }
.broadcast-list, .message-list { display: grid; align-content: start; gap: 11px; }
.broadcast-card, .message-card { position: relative; padding: 18px; display: flex; align-items: flex-start; gap: 14px; border: 1px solid var(--line); border-radius: 15px; background: var(--surface); box-shadow: 0 5px 18px rgba(42,52,79,.04); }
.broadcast-icon, .message-avatar { width: 42px; height: 42px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 12px; color: var(--primary); background: var(--primary-soft); font-weight: 800; }
.broadcast-content, .message-content { min-width: 0; flex: 1; }
.broadcast-meta, .message-meta { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 13px; }
.broadcast-meta > span { padding: 3px 7px; border-radius: 99px; color: var(--primary); background: var(--primary-soft); font-weight: 700; }
.broadcast-meta time, .message-meta time { margin-left: auto; }
.broadcast-card h3, .message-card h3 { margin-top: 10px; font-size: 15px; }
.broadcast-card p, .message-card p { margin: 7px 0 0; color: var(--muted); white-space: pre-wrap; font-size: 14px; }
.communication-delete { margin: 0; flex: 0 0 auto; }
.communication-delete button { min-width: 54px; height: 34px; padding: 0 12px; border: 1px solid color-mix(in srgb, var(--danger) 28%, var(--line)); border-radius: 9px; color: var(--danger); background: color-mix(in srgb, var(--danger) 6%, var(--surface)); cursor: pointer; font-size: 14px; font-weight: 750; transition: .16s ease; }
.communication-delete button:hover { color: white; border-color: var(--danger); background: var(--danger); }
.read-state { padding: 3px 7px; border-radius: 99px; color: var(--warning); background: color-mix(in srgb, var(--warning) 12%, var(--surface)); }
.read-state.read { color: var(--success); background: var(--success-soft); }
.media-request-summary { margin-bottom: 16px; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.media-request-summary a { min-width: 0; padding: 13px 15px; display: flex; align-items: center; justify-content: space-between; gap: 10px; border: 1px solid var(--line); border-radius: 12px; color: var(--muted); background: var(--surface-soft); transition: .18s ease; }
.media-request-summary a:hover, .media-request-summary a.active { color: var(--primary); border-color: color-mix(in srgb, var(--primary) 34%, var(--line)); background: var(--primary-soft); }
.media-request-summary a strong { font-size: 18px; }
.media-request-admin-search { margin-bottom: 16px; display: flex; align-items: center; gap: 10px; }
.media-request-admin-search label { min-width: 0; flex: 1; }
.media-request-admin-search input { width: 100%; min-height: 44px; }
.media-request-admin-search > a { color: var(--muted); font-size: 14px; font-weight: 750; }
.media-request-admin-list { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); align-items: start; gap: 22px 14px; }
.media-request-admin-list > .designed-empty { grid-column: 1 / -1; }
.media-request-admin-card { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); box-shadow: 0 8px 24px rgba(42, 52, 79, .07); transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.media-request-admin-card:hover { border-color: color-mix(in srgb, var(--primary) 28%, var(--line)); box-shadow: 0 14px 32px rgba(42, 52, 79, .12); transform: translateY(-2px); }
.media-request-admin-poster { position: relative; width: 100%; aspect-ratio: 2 / 3; padding: 0; overflow: hidden; display: grid; place-items: center; border: 0; color: var(--primary); background: color-mix(in srgb, var(--primary) 10%, var(--surface-soft)); cursor: pointer; }
.media-request-admin-poster > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .22s ease; }
.media-request-admin-card:hover .media-request-admin-poster > img, .media-request-admin-poster:focus-visible > img { transform: scale(1.035); }
.media-request-admin-placeholder { display: grid; place-items: center; gap: 9px; color: var(--muted); }
.media-request-admin-placeholder .ui-icon { width: 40px; height: 40px; color: var(--primary); }
.media-request-admin-placeholder small { font: inherit; font-size: 12px; }
.media-request-admin-poster-shade { position: absolute; inset: 46% 0 0; background: linear-gradient(180deg, transparent, rgba(4,8,15,.72)); pointer-events: none; }
.media-request-admin-poster-badges { position: absolute; inset: 8px 8px auto; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 7px; }
.media-request-admin-poster-badges .media-request-type, .media-request-admin-poster-badges .media-score { min-height: 25px; padding-inline: 7px; color: #fff; border-color: rgba(255,255,255,.18); background: rgba(8,13,22,.76); font-size: 12px; backdrop-filter: blur(10px); }
.media-request-admin-poster > .media-request-status { position: absolute; right: 8px; bottom: 8px; z-index: 2; min-height: 27px; padding-inline: 8px; color: #fff; background: rgba(8,13,22,.78); font-size: 12px; backdrop-filter: blur(10px); }
.media-request-admin-poster > .media-request-status.status-processing { background: color-mix(in srgb, var(--primary) 84%, #081119); }
.media-request-admin-poster > .media-request-status.status-completed { background: color-mix(in srgb, var(--success) 82%, #081119); }
.media-request-admin-poster > .media-request-status.status-rejected { background: color-mix(in srgb, var(--danger) 82%, #081119); }
.media-request-admin-card-body { min-width: 0; padding: 11px 11px 9px; text-align: center; }
.media-request-admin-card-body h3 { margin: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
.media-request-admin-card-body p { margin: 4px 0 0; overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.media-request-admin-member { margin-top: 7px; display: flex; align-items: center; justify-content: center; gap: 5px; overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.media-request-admin-member .ui-icon { width: 13px; height: 13px; flex: 0 0 auto; }
.media-request-admin-card-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--line); background: var(--surface-soft); }
.media-request-admin-card-actions > a, .media-request-admin-card-actions > button, .media-request-admin-card-actions > form > button { width: 100%; min-width: 0; min-height: 40px; padding: 0 4px; display: flex; align-items: center; justify-content: center; gap: 5px; border: 0; border-right: 1px solid var(--line); color: var(--muted); background: transparent; cursor: pointer; font: inherit; font-size: 12px; font-weight: 780; text-decoration: none; }
.media-request-admin-card-actions > form { min-width: 0; }
.media-request-admin-card-actions > form > button { border-right: 0; }
.media-request-admin-card-actions > :is(a, button):hover, .media-request-admin-card-actions > form > button:hover { color: var(--primary); background: var(--primary-soft); }
.media-request-admin-card-actions .danger-text:hover { color: var(--danger); background: color-mix(in srgb, var(--danger) 8%, var(--surface)); }
.media-request-admin-card-actions .ui-icon { width: 14px; height: 14px; flex: 0 0 auto; }
.media-request-editor-dialog { width: min(880px, calc(100vw - 30px)); }
.media-request-editor-dialog > form { min-height: 0; display: flex; flex-direction: column; }
.media-request-editor-body { min-height: 0; padding: 20px; overflow: auto; display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: 22px; }
.media-request-editor-poster { position: relative; align-self: start; width: 100%; aspect-ratio: 2 / 3; overflow: hidden; display: grid; place-items: center; border-radius: 8px; color: var(--primary); background: var(--surface-soft); }
.media-request-editor-poster > img { width: 100%; height: 100%; object-fit: cover; }
.media-request-editor-poster > span { display: grid; place-items: center; gap: 9px; color: var(--muted); }
.media-request-editor-poster > span .ui-icon { width: 42px; height: 42px; color: var(--primary); }
.media-request-editor-poster > div { position: absolute; inset: auto 8px 8px; display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.media-request-editor-poster > div > span { min-height: 27px; padding-inline: 8px; color: #fff; background: rgba(8,13,22,.78); font-size: 12px; backdrop-filter: blur(10px); }
.media-request-editor-content { min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.media-request-editor-member { display: flex; align-items: center; gap: 10px; }
.media-request-editor-member > span { width: 40px; height: 40px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 8px; color: var(--primary); background: var(--primary-soft); font-weight: 850; }
.media-request-editor-member > div { min-width: 0; display: grid; gap: 2px; }
.media-request-editor-member small { overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; }
.media-request-editor-copy { padding: 12px 14px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.media-request-editor-copy span { color: var(--muted); font-size: 12px; font-weight: 780; }
.media-request-editor-copy p { max-height: 118px; margin: 6px 0 0; overflow: auto; white-space: pre-wrap; line-height: 1.65; }
.media-request-editor-copy.emphasis { border-color: color-mix(in srgb, var(--primary) 24%, var(--line)); background: var(--primary-soft); }
.media-request-editor-fields { display: grid; grid-template-columns: minmax(150px, .38fr) minmax(0, 1fr); align-items: start; gap: 12px; }
.media-request-editor-fields textarea { min-height: 124px; resize: vertical; }
.media-request-editor-update { margin-top: auto; color: var(--muted); }
.media-request-member { min-width: 0; display: flex; align-items: center; gap: 11px; }
.media-request-member > span { width: 40px; height: 40px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 11px; color: var(--primary); background: var(--primary-soft); font-weight: 850; }
.media-request-member > div { min-width: 0; display: grid; gap: 2px; }
.media-request-member small { overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; }
.media-request-card-badges { display: flex; align-items: center; justify-content: flex-end; gap: 7px; }
.media-request-type, .media-request-status { min-height: 30px; padding: 0 9px; display: inline-flex; align-items: center; gap: 5px; border-radius: 99px; font-size: 13px; font-weight: 780; white-space: nowrap; }
.media-request-type { color: var(--primary); background: var(--primary-soft); }
.media-request-type .ui-icon, .media-request-status .ui-icon { width: 14px; height: 14px; }
.media-request-status { color: var(--warning); background: color-mix(in srgb, var(--warning) 12%, var(--surface)); }
.media-request-status.status-processing { color: var(--primary); background: var(--primary-soft); }
.media-request-status.status-completed { color: var(--success); background: var(--success-soft); }
.media-request-status.status-rejected { color: var(--danger); background: color-mix(in srgb, var(--danger) 10%, var(--surface)); }
.media-request-title { padding: 17px; display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.media-request-title h3 { font-size: 18px; }
.media-request-title p { margin: 5px 0 0; color: var(--muted); font-size: 14px; }
.media-request-title time { flex: 0 0 auto; color: var(--muted); font-size: 13px; }
.media-request-note { margin: 0 17px 16px; padding: 12px 14px; border-radius: 10px; background: var(--surface-soft); }
.media-request-note span { color: var(--muted); font-size: 12px; font-weight: 780; }
.media-request-note p { margin: 5px 0 0; white-space: pre-wrap; line-height: 1.6; }

.auth-settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.settings-card { min-width: 0; padding: 22px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface-soft); }
.settings-card-head { margin-bottom: 20px; display: flex; align-items: center; gap: 12px; }
.settings-card-head > span:first-child { width: 44px; height: 44px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 13px; color: white; background: linear-gradient(145deg, var(--primary), #8658d7); font-size: 20px; }
.settings-card-head > div { min-width: 0; flex: 1; }
.settings-card-head p { margin: 4px 0 0; color: var(--muted); font-size: 14px; }
.settings-card > form { display: grid; gap: 14px; }
.settings-test { margin-top: 18px; padding-top: 18px; grid-template-columns: 1fr auto !important; border-top: 1px solid var(--line); }
.settings-guide { padding: 13px 15px; border-radius: 11px; color: var(--muted); background: var(--surface); font-size: 14px; }
.settings-guide ol { margin: 8px 0 0; padding-left: 19px; line-height: 1.8; }

.member-portal { min-height: 100vh; background: var(--bg); }
.member-portal-head { min-height: 78px; padding: 0 max(24px, calc((100vw - 1900px) / 2)); display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 94%, transparent); box-shadow: 0 6px 24px rgba(42, 52, 79, .035); }
.member-portal-brand, .member-portal-user { display: flex; align-items: center; gap: 11px; }
.member-portal-brand > span { display: grid; gap: 1px; }
.member-portal-logo { width: 38px; height: 38px; flex: 0 0 auto; object-fit: cover; border-radius: 11px; box-shadow: 0 6px 16px rgba(77, 42, 151, .18); }
.member-portal-brand-name { font-size: 14px; font-weight: 780; letter-spacing: -.035em; }
.member-portal-brand strong { font-size: 14px; }
.member-portal-brand small { color: var(--muted); font-size: 13px; }
.member-portal-head > nav { padding: 4px; display: flex; align-items: center; gap: 4px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-soft); }
.member-portal-head > nav a { min-height: 40px; padding: 0 15px; display: flex; align-items: center; gap: 7px; border-radius: 9px; color: color-mix(in srgb, var(--text) 72%, var(--muted)); font-size: 14px; font-weight: 750; transition: .18s ease; }
.member-portal-head > nav a:hover { color: var(--primary); background: var(--primary-soft); }
.member-portal-head > nav a.active { color: white; background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 72%, #8f58ed)); box-shadow: 0 6px 15px color-mix(in srgb, var(--primary) 28%, transparent); }
.member-portal-head > nav a > em { min-width: 19px; height: 19px; padding: 0 5px; display: grid; place-items: center; border-radius: 99px; color: var(--primary); background: var(--surface); font-size: 12px; font-style: normal; line-height: 1; }
.portal-nav-icon { width: 17px; height: 17px; display: grid; place-items: center; font-size: 14px; line-height: 1; }
.member-portal-head img { width: 38px; height: 38px; }
.member-portal-head .member-head-avatar { width: 34px; height: 34px; object-fit: cover; border-radius: 50%; border: 2px solid var(--primary-soft); }
.member-portal-head form { margin: 0; }
.member-portal-head .button { min-height: 35px; }
.member-portal-content { width: min(1900px, calc(100% - 48px)); margin: 0 auto; padding: 28px 0 50px; }
.member-community-link { min-height: 44px; display: inline-flex; align-items: center; gap: 8px; color: var(--muted); font-size: 13px; border-radius: 4px; }
.member-community-link > .ui-icon { width: 16px; height: 16px; flex: 0 0 16px; }
.member-community-link > .ui-icon:last-child { width: 13px; height: 13px; flex-basis: 13px; }
.member-community-link:hover { color: var(--primary); }
.member-community-link:focus-visible { outline: 2px solid var(--primary); outline-offset: 4px; }
.member-portal-discovery { position: relative; }
.member-portal-discovery .member-portal-head { position: absolute; inset: 0 0 auto; z-index: 30; color: #fff; border-bottom: 0; background: linear-gradient(180deg, rgba(5,9,16,.92) 0%, rgba(5,9,16,.68) 62%, rgba(5,9,16,0) 100%); box-shadow: none; }
.member-portal-discovery .member-portal-brand-name, .member-portal-discovery .member-portal-user > span { color: #fff; }
.member-portal-discovery .member-portal-brand small { color: rgba(255,255,255,.64); }
.member-portal-discovery .member-portal-head > nav { border-color: rgba(255,255,255,.12); background: rgba(9,14,24,.58); box-shadow: 0 8px 28px rgba(0,0,0,.16); backdrop-filter: blur(16px); }
.member-portal-discovery .member-portal-head > nav a { color: rgba(255,255,255,.78); }
.member-portal-discovery .member-portal-head > nav a:hover { color: #fff; background: rgba(255,255,255,.1); }
.member-portal-discovery .member-portal-head .button.secondary { color: #fff; border-color: rgba(255,255,255,.15); background: rgba(9,14,24,.52); backdrop-filter: blur(14px); }
.member-portal-discovery .member-head-avatar { border-color: rgba(255,255,255,.2); }
.portal-hero { min-height: 146px; padding: 28px 30px; display: flex; align-items: center; justify-content: space-between; gap: 24px; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.portal-hero-identity { min-width: 0; display: flex; align-items: center; gap: 20px; }
.portal-hero-identity > div { min-width: 0; }
.portal-hero span { color: var(--primary); }
.portal-hero h1 { margin: 5px 0 6px; font-size: 30px; }
.portal-hero p { margin: 0; color: var(--muted); }
.portal-hero .portal-user-avatar { width: 78px; height: 78px; flex: 0 0 auto; object-fit: cover; border: 1px solid color-mix(in srgb, var(--primary) 28%, var(--line)); border-radius: 20px; background: var(--surface-soft); box-shadow: 0 8px 22px rgba(0,0,0,.14); }
.portal-account-link { min-height: 42px; padding: 0 14px; display: inline-flex; flex: 0 0 auto; align-items: center; gap: 7px; border: 1px solid var(--line); border-radius: 8px; color: var(--text); background: var(--surface-soft); font-size: 14px; font-weight: 750; }
.portal-account-link:hover { color: var(--primary); border-color: color-mix(in srgb, var(--primary) 35%, var(--line)); background: var(--primary-soft); }
.portal-account-link .ui-icon { width: 16px; height: 16px; }
.portal-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin: 16px 0 24px; }
.portal-stats article { padding: 18px; display: grid; gap: 9px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); }
.portal-stats span { color: var(--muted); font-size: 14px; }
.portal-stats strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.portal-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.portal-section-title { margin-bottom: 11px; display: flex; align-items: center; justify-content: space-between; }
.portal-section-title span { min-width: 25px; height: 25px; display: grid; place-items: center; border-radius: 50%; color: var(--primary); background: var(--primary-soft); font-size: 14px; }
.portal-notice { margin-bottom: 10px; padding: 18px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); }
.portal-notice.direct { border-left: 4px solid var(--primary); }
.portal-notice span { color: var(--muted); font-size: 13px; }
.portal-notice h2 { margin-top: 7px; }
.portal-notice p { margin: 7px 0 0; color: var(--muted); white-space: pre-wrap; }
.member-auth-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.member-auth-actions .member-auth-link { min-width: 0; margin: 0; }
.member-renew-public-intro { display: grid; gap: 3px; text-align: center; }
.member-renew-public-intro strong { font-size: 16px; }
.member-renew-public-intro span { color: var(--muted); font-size: 13px; }
.member-renew-retention-note { padding: 12px 13px; display: grid; grid-template-columns: 30px minmax(0, 1fr); align-items: center; gap: 10px; border: 1px solid color-mix(in srgb, var(--success) 24%, var(--line)); border-radius: 8px; background: color-mix(in srgb, var(--success) 7%, var(--surface)); }
.member-renew-retention-note > .ui-icon { width: 22px; height: 22px; color: var(--success); }
.member-renew-retention-note span { display: grid; gap: 2px; }
.member-renew-retention-note strong { font-size: 13px; }
.member-renew-retention-note small { color: var(--muted); font-size: 12px; line-height: 1.45; }
.member-home-hero { min-height: 176px; padding: 28px 30px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 420px); align-items: center; gap: 28px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); box-shadow: 0 10px 30px rgba(0,0,0,.06); }
.member-home-identity { min-width: 0; display: flex; align-items: center; gap: 21px; }
.member-home-identity .portal-user-avatar { width: 88px; height: 88px; flex: 0 0 auto; object-fit: cover; border: 1px solid color-mix(in srgb, var(--primary) 30%, var(--line)); border-radius: 8px; background: var(--surface-soft); box-shadow: 0 10px 24px rgba(0,0,0,.16); }
.member-home-identity > div { min-width: 0; }
.member-home-identity span, .member-home-membership > small, .member-renew-card header small, .member-home-summary header small, .member-home-feed header small { color: var(--primary); font-size: 12px; font-weight: 850; letter-spacing: 0; }
.member-home-identity h1 { margin: 7px 0 7px; font-size: 32px; line-height: 1.12; }
.member-home-identity p { margin: 0; overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; }
.member-home-membership { min-width: 0; padding: 20px 22px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 5px 16px; border-left: 3px solid var(--success); background: var(--surface-soft); }
.member-home-membership > span { grid-column: 2; grid-row: 1 / span 2; align-self: start; min-height: 27px; padding: 0 9px; display: inline-flex; align-items: center; gap: 6px; border-radius: 99px; color: var(--success); background: var(--success-soft); font-size: 12px; font-weight: 800; }
.member-home-membership > span.danger { color: var(--danger); background: var(--danger-soft); }
.member-home-membership > span i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.member-home-membership > small { color: var(--muted); }
.member-home-membership > strong { min-width: 0; overflow: hidden; font-size: 20px; text-overflow: ellipsis; white-space: nowrap; }
.member-home-membership > em { grid-column: 1 / -1; color: var(--muted); font-size: 13px; font-style: normal; }
.member-home-service-grid { margin: 14px 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.member-home-service-grid > a { min-width: 0; min-height: 106px; padding: 18px; display: grid; grid-template-columns: 43px minmax(0, 1fr) 18px; align-items: center; gap: 13px; border: 1px solid var(--line); border-radius: 8px; color: var(--text); background: var(--surface); transition: border-color .18s ease, transform .18s ease, background .18s ease; }
.member-home-service-grid > a:hover { border-color: color-mix(in srgb, var(--primary) 32%, var(--line)); background: color-mix(in srgb, var(--primary) 4%, var(--surface)); transform: translateY(-2px); }
.member-home-service-grid > a > span { width: 43px; height: 43px; display: grid; place-items: center; border-radius: 8px; color: var(--primary); background: var(--primary-soft); }
.member-home-service-grid > a > span.request { color: var(--warning); background: var(--warning-soft); }
.member-home-service-grid > a > span.cloud { color: #38a6c9; background: color-mix(in srgb, #38a6c9 12%, var(--surface)); }
.member-home-service-grid > a > span.security { color: var(--success); background: var(--success-soft); }
.member-home-service-grid > a > span .ui-icon { width: 21px; height: 21px; }
.member-home-service-grid > a > .ui-icon { width: 17px; height: 17px; color: var(--muted); }
.member-home-service-grid > a div { min-width: 0; display: grid; gap: 2px; }
.member-home-service-grid small { color: var(--muted); font-size: 12px; }
.member-home-service-grid strong { font-size: 16px; }
.member-home-service-grid p { margin: 1px 0 0; overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.member-home-main { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(300px, .8fr); gap: 14px; }
.member-renew-card, .member-home-summary, .member-home-feed { min-width: 0; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.member-renew-card { padding: 22px 24px; }
.member-renew-card > header { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 14px; align-items: center; }
.member-renew-card > header > span { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 8px; color: #fff; background: var(--primary); }
.member-renew-card > header > span .ui-icon { width: 23px; height: 23px; }
.member-renew-card h2, .member-home-summary h2, .member-home-feed h2 { margin-top: 3px; font-size: 20px; }
.member-renew-card header p { margin: 4px 0 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.member-renew-card > form { margin-top: 18px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 10px; }
.member-renew-card > form .field { margin: 0; }
.member-renew-card > form .button { min-width: 116px; }
.member-renew-card > footer { margin-top: 13px; display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: 12px; }
.member-renew-card > footer .ui-icon { width: 15px; height: 15px; flex: 0 0 auto; color: var(--success); }
.member-home-summary { padding: 22px; }
.member-home-summary > header { padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.member-home-summary dl { margin: 12px 0 0; display: grid; gap: 0; }
.member-home-summary dl > div { min-width: 0; padding: 10px 0; display: flex; align-items: center; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--line); }
.member-home-summary dl > div:last-child { border-bottom: 0; }
.member-home-summary dt { color: var(--muted); font-size: 13px; }
.member-home-summary dd { min-width: 0; margin: 0; overflow: hidden; font-size: 13px; font-weight: 760; text-align: right; text-overflow: ellipsis; white-space: nowrap; }
.member-home-feed-grid { margin-top: 14px; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.member-home-feed { overflow: hidden; }
.member-home-feed > header { min-height: 72px; padding: 15px 18px; display: flex; align-items: center; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--line); background: var(--surface-soft); }
.member-home-feed > header > div { display: flex; align-items: center; gap: 11px; }
.member-home-feed > header > div > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 8px; color: var(--primary); background: var(--primary-soft); }
.member-home-feed > header > div > span .ui-icon { width: 18px; height: 18px; }
.member-home-feed > header b { min-width: 28px; height: 28px; display: grid; place-items: center; border-radius: 99px; color: var(--primary); background: var(--primary-soft); font-size: 12px; }
.member-home-feed-item { padding: 17px 18px; display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 12px; border-bottom: 1px solid var(--line); }
.member-home-feed-item:last-child { border-bottom: 0; }
.member-home-feed-icon { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 8px; color: var(--warning); background: var(--warning-soft); }
.member-home-feed-icon.message { color: var(--primary); background: var(--primary-soft); }
.member-home-feed-icon .ui-icon { width: 17px; height: 17px; }
.member-home-feed-item > div { min-width: 0; }
.member-home-feed-item > div > span { color: var(--muted); font-size: 12px; }
.member-home-feed-item h3 { margin-top: 4px; font-size: 15px; }
.member-home-feed-item p { margin: 5px 0 0; color: var(--muted); white-space: pre-wrap; font-size: 13px; line-height: 1.55; }
.member-home-empty { min-height: 150px; padding: 24px; display: grid; place-items: center; align-content: center; gap: 6px; color: var(--muted); text-align: center; }
.member-home-empty > .ui-icon { width: 26px; height: 26px; margin-bottom: 4px; }
.member-home-empty strong { color: var(--text); font-size: 14px; }
.member-home-empty p { margin: 0; font-size: 12px; }
.member-expiry-retention { display: block; margin-top: 4px; color: var(--muted); font-size: 12px; font-weight: 500; white-space: normal; }
.member-user-card.is-expired { border-color: color-mix(in srgb, var(--danger) 24%, var(--line)); }
.member-request-hero { min-height: 178px; padding: 30px 36px; display: flex; align-items: center; justify-content: space-between; gap: 24px; overflow: hidden; border: 1px solid color-mix(in srgb, var(--primary) 22%, var(--line)); border-radius: 20px; background: radial-gradient(circle at 82% 22%, color-mix(in srgb, var(--primary) 28%, transparent), transparent 34%), var(--surface); box-shadow: var(--shadow); }
.member-request-hero > div:first-child > span { color: var(--primary); font-size: 13px; font-weight: 850; letter-spacing: 0; }
.member-request-hero h1 { margin: 7px 0; font-size: 30px; }
.member-request-hero p { margin: 0; color: var(--muted); }
.member-request-hero-state { min-width: 180px; padding: 18px; display: flex; align-items: center; justify-content: center; gap: 14px; border: 1px solid color-mix(in srgb, var(--primary) 24%, var(--line)); border-radius: 15px; background: color-mix(in srgb, var(--surface) 84%, transparent); }
.member-request-hero-state > span { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 12px; color: white; background: var(--primary); }
.member-request-hero-state > span .ui-icon { width: 23px; height: 23px; }
.member-request-hero-state > div { display: grid; gap: 2px; }
.member-request-hero-state strong { font-size: 25px; }
.member-request-hero-state small { color: var(--muted); }
.member-request-layout { margin-top: 18px; display: grid; grid-template-columns: minmax(330px, .78fr) minmax(0, 1.22fr); align-items: start; gap: 18px; }
.member-request-form-card, .member-request-history { min-width: 0; padding: 22px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); box-shadow: 0 6px 22px rgba(42, 52, 79, .05); }
.member-request-section-head { margin-bottom: 18px; display: flex; align-items: center; gap: 12px; }
.member-request-section-head > span { width: 43px; height: 43px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 12px; color: white; background: var(--primary); }
.member-request-section-head > span .ui-icon { width: 21px; height: 21px; }
.member-request-section-head p { margin: 4px 0 0; color: var(--muted); font-size: 14px; line-height: 1.5; }
.member-request-form-card > form { display: grid; gap: 14px; }
.member-request-type-picker { margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; border: 0; }
.member-request-type-picker legend { margin-bottom: 7px; color: var(--text); font-size: 14px; font-weight: 700; }
.member-request-type-picker input { position: absolute; opacity: 0; pointer-events: none; }
.member-request-type-picker label > span { min-height: 46px; padding: 0 14px; display: flex; align-items: center; justify-content: center; gap: 7px; border: 1px solid var(--line); border-radius: 10px; color: var(--muted); background: var(--surface-soft); cursor: pointer; transition: .18s ease; }
.member-request-type-picker input:checked + span { color: var(--primary); border-color: color-mix(in srgb, var(--primary) 42%, var(--line)); background: var(--primary-soft); box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary) 10%, transparent); }
.member-request-type-picker .ui-icon { width: 17px; height: 17px; }
.member-request-form-card textarea { resize: vertical; }
.member-request-history-head { margin-bottom: 16px; display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; }
.member-request-history-head > div:first-child > span { color: var(--primary); font-size: 12px; font-weight: 850; letter-spacing: 0; }
.member-request-history-head h2 { margin-top: 4px; }
.member-request-history-head > div:last-child { display: flex; align-items: center; gap: 13px; }
.member-request-history-head > div:last-child > span { display: grid; justify-items: center; gap: 2px; color: var(--muted); font-size: 12px; }
.member-request-history-head > div:last-child b { color: var(--text); font-size: 17px; }
.member-request-list { display: grid; gap: 11px; }
.member-request-card { padding: 16px; border: 1px solid var(--line); border-left: 4px solid var(--warning); border-radius: 13px; background: var(--surface-soft); }
.member-request-card.status-processing { border-left-color: var(--primary); }
.member-request-card.status-completed { border-left-color: var(--success); }
.member-request-card.status-rejected { border-left-color: var(--danger); }
.member-request-card > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.member-request-title { margin-top: 13px; display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.member-request-title h3 { font-size: 17px; }
.member-request-title p { margin: 4px 0 0; color: var(--muted); font-size: 13px; }
.member-request-title time { flex: 0 0 auto; color: var(--muted); font-size: 12px; }
.member-request-copy { margin-top: 12px; padding: 11px 12px; border-radius: 9px; background: var(--surface); }
.member-request-copy > span { display: flex; align-items: center; gap: 5px; color: var(--muted); font-size: 12px; font-weight: 780; }
.member-request-copy > span .ui-icon { width: 14px; height: 14px; }
.member-request-copy p { margin: 5px 0 0; white-space: pre-wrap; line-height: 1.55; }
.member-request-copy.reply { border: 1px solid color-mix(in srgb, var(--primary) 18%, var(--line)); background: var(--primary-soft); }
.member-request-copy.reply > span { color: var(--primary); }
.member-request-waiting { margin-top: 12px; color: var(--muted); font-size: 13px; }
.account-page-head { min-height: 146px; padding: 28px 30px; display: flex; align-items: center; justify-content: space-between; gap: 24px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.account-page-identity { min-width: 0; display: flex; align-items: center; gap: 20px; }
.account-page-identity > img { width: 78px; height: 78px; flex: 0 0 auto; object-fit: cover; border: 1px solid color-mix(in srgb, var(--primary) 28%, var(--line)); border-radius: 20px; background: var(--surface-soft); box-shadow: 0 8px 22px rgba(0,0,0,.14); }
.account-page-head span { color: var(--primary); font-size: 13px; font-weight: 800; }
.account-page-head h1 { margin: 5px 0 6px; font-size: 30px; }
.account-page-head p { margin: 0; color: var(--muted); }
.account-page-state { min-width: 142px; padding: 13px 15px; display: flex; align-items: center; gap: 11px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.account-page-state > i { width: 9px; height: 9px; flex: 0 0 auto; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 4px color-mix(in srgb, var(--success) 14%, transparent); }
.account-page-state > div { display: grid; gap: 2px; }
.account-page-state small { color: var(--muted); font-size: 12px; }
.account-page-state strong { font-size: 14px; }
.account-security-grid { margin-top: 18px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.account-card { min-width: 0; padding: 24px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); box-shadow: 0 6px 22px rgba(42,52,79,.05); }
.account-card-head { margin-bottom: 18px; }
.account-card-head > span { color: var(--primary); font-size: 13px; font-weight: 800; letter-spacing: .08em; }
.account-card-head h2 { margin-top: 5px; }
.account-card-head p, .connection-help { margin: 5px 0 0; color: var(--muted); font-size: 14px; }
.account-card > form { display: grid; gap: 13px; }
.member-avatar-editor { display: flex; align-items: center; gap: 18px; padding: 16px; border-radius: 14px; background: var(--surface-soft); }
.member-avatar-editor > img { width: 88px; height: 88px; object-fit: cover; border-radius: 22px; border: 2px solid var(--line); }
.member-avatar-editor > div { display: grid; justify-items: start; gap: 9px; }
.member-avatar-editor small { color: var(--muted); font-size: 13px; }
.connection-bound { margin-bottom: 14px; padding: 14px; display: flex; align-items: center; gap: 12px; border-radius: 13px; color: var(--success); background: var(--success-soft); }
.connection-bound > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--success); }
.connection-bound > div { display: grid; gap: 3px; }
.connection-bound small { color: var(--muted); }
.connection-bound.telegram { color: #229ed9; background: color-mix(in srgb, #229ed9 10%, var(--surface)); }
.connection-bound.telegram > span { background: #229ed9; }
.account-disabled, .pending-bind { padding: 14px; border-radius: 11px; color: var(--muted); background: var(--surface-soft); font-size: 14px; line-height: 1.6; }
.pending-bind { margin-bottom: 13px; color: var(--primary); background: var(--primary-soft); }
.account-card .telegram-login > span { color: var(--muted); }
.account-card .telegram-login > span::before, .account-card .telegram-login > span::after { background: var(--line); }
.member-one15-hero { min-height: 190px; padding: 32px 38px; display: flex; align-items: center; justify-content: space-between; gap: 24px; overflow: hidden; border: 1px solid color-mix(in srgb, var(--primary) 22%, var(--line)); border-radius: 21px; background: radial-gradient(circle at 82% 20%, color-mix(in srgb, var(--primary) 32%, transparent), transparent 34%), linear-gradient(125deg, color-mix(in srgb, var(--surface) 92%, var(--primary-soft)), var(--surface)); box-shadow: var(--shadow); }
.member-one15-hero > div:first-child > span { color: var(--primary); font-size: 13px; font-weight: 850; letter-spacing: .14em; }
.member-one15-hero h1 { margin: 8px 0; font-size: clamp(27px, 4vw, 34px); }
.member-one15-hero p { max-width: 560px; margin: 0; color: var(--muted); }
.member-one15-hero-lock { min-width: 210px; padding: 18px; display: flex; align-items: center; gap: 13px; border: 1px solid color-mix(in srgb, var(--primary) 24%, var(--line)); border-radius: 16px; background: color-mix(in srgb, var(--surface) 78%, transparent); backdrop-filter: blur(14px); }
.member-one15-hero-lock > svg { width: 34px; height: 34px; color: var(--primary); }
.member-one15-hero-lock > span { display: grid; gap: 3px; }
.member-one15-hero-lock small { color: var(--muted); font-size: 13px; }
.member-one15-grid { margin-top: 18px; display: grid; grid-template-columns: minmax(0, .9fr) minmax(340px, 1.1fr); gap: 18px; align-items: stretch; }
.member-one15-status-card, .member-one15-qr-card { display: flex; flex-direction: column; }
.member-one15-connected, .member-one15-empty { min-height: 112px; padding: 17px; display: flex; align-items: center; gap: 14px; border: 1px solid color-mix(in srgb, var(--success) 28%, var(--line)); border-radius: 15px; background: color-mix(in srgb, var(--success-soft) 70%, var(--surface)); }
.member-one15-empty { border-color: var(--line); background: var(--surface-soft); }
.member-one15-connected > span, .member-one15-empty > span { width: 50px; height: 50px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 15px; color: white; background: linear-gradient(135deg, var(--success), color-mix(in srgb, var(--success) 55%, var(--primary))); box-shadow: 0 9px 22px color-mix(in srgb, var(--success) 25%, transparent); }
.member-one15-empty > span { color: var(--primary); background: var(--primary-soft); box-shadow: none; }
.member-one15-connected > span svg, .member-one15-empty > span svg { width: 25px; height: 25px; }
.member-one15-connected > div, .member-one15-empty > div { min-width: 0; display: grid; gap: 4px; }
.member-one15-connected small { color: var(--muted); }
.member-one15-connected strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.member-one15-connected p, .member-one15-empty p { margin: 0; color: var(--muted); font-size: 14px; }
.member-one15-connected em { margin-left: auto; padding: 5px 9px; border-radius: 999px; color: var(--success); background: var(--surface); font-size: 13px; font-style: normal; font-weight: 800; white-space: nowrap; }
.member-one15-target { margin: 14px 0 0; padding: 14px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, .9fr) auto; align-items: center; gap: 12px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-soft); }
.member-one15-target > div:first-child { min-width: 0; display: flex; align-items: center; gap: 10px; }
.member-one15-target > div:first-child > span { width: 34px; height: 34px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 9px; color: var(--primary); background: var(--primary-soft); }
.member-one15-target > div:first-child > span .ui-icon { width: 18px; height: 18px; }
.member-one15-target > div:first-child > div { min-width: 0; display: grid; gap: 3px; }
.member-one15-target strong, .member-one15-target small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.member-one15-target small { color: var(--muted); font-size: 12px; }
.member-one15-target .directory-picker-control { min-width: 0; }
.member-one15-target > .button { min-height: 42px; white-space: nowrap; }
.member-one15-security { margin: 14px 0; padding: 14px; display: flex; gap: 11px; border-radius: 13px; background: var(--surface-soft); }
.member-one15-security > span { width: 34px; height: 34px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 10px; color: var(--primary); background: var(--primary-soft); }
.member-one15-security > span svg { width: 18px; height: 18px; }
.member-one15-security p { margin: 4px 0 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.member-one15-status-card > form { margin-top: auto; }
.member-one15-status-card > form .button { width: 100%; }
.member-one15-qr-layout { flex: 1; display: grid; justify-items: center; align-content: start; gap: 11px; padding: 19px; border: 1px dashed color-mix(in srgb, var(--primary) 35%, var(--line)); border-radius: 15px; background: color-mix(in srgb, var(--primary-soft) 35%, var(--surface)); text-align: center; }
.member-one15-qr-layout .one15-client-select { width: min(100%, 360px); text-align: left; }
.member-one15-qr-layout .one15-qr { width: 168px; height: 168px; box-shadow: 0 12px 30px rgba(24, 35, 62, .09); }
.member-one15-qr-layout > strong { font-size: 14px; }
.member-one15-qr-layout > strong.success { color: var(--success); }
.member-one15-qr-layout > strong.error { color: var(--danger); }
.member-one15-qr-layout > small { color: var(--muted); }
.member-one15-qr-layout > .button { min-width: 168px; }
.member-one15-next-step { margin-top: 18px; padding: 17px 20px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 14px; border: 1px solid var(--line); border-radius: 15px; background: var(--surface); }
.member-one15-next-step > span { padding: 5px 9px; border-radius: 999px; color: var(--primary); background: var(--primary-soft); font-size: 13px; font-weight: 800; }
.member-one15-next-step p { margin: 4px 0 0; color: var(--muted); font-size: 14px; }
.member-one15-next-step > svg { width: 19px; height: 19px; color: var(--muted); }
.password-field { position: relative; }
.password-field input { padding-right: 58px !important; }
.password-eye { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); width: 38px; height: 38px; border: 1px solid transparent; border-radius: 10px; background: transparent; color: color-mix(in srgb, var(--text) 58%, transparent); cursor: pointer; display: grid; place-items: center; transition: color .16s ease, border-color .16s ease, background-color .16s ease, box-shadow .16s ease; }
.password-eye:hover { border-color: color-mix(in srgb, var(--primary) 18%, var(--line)); background: color-mix(in srgb, var(--primary-soft) 42%, transparent); color: var(--text); }
.password-eye:focus-visible { outline: 0; border-color: color-mix(in srgb, var(--primary) 58%, var(--line)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 18%, transparent); color: var(--primary); }
.password-eye.visible { color: var(--primary); background: color-mix(in srgb, var(--primary-soft) 54%, transparent); }
/* Visible labels and inline errors must not affect the input's eye-button alignment. */
.password-field:not(.login-input-shell) > label { grid-column: 1; grid-row: 1; }
.password-field:not(.login-input-shell) > input { grid-column: 1; grid-row: 2; }
.password-field:not(.login-input-shell) > .password-eye { position: relative; grid-column: 1; grid-row: 2; align-self: center; justify-self: end; right: auto; top: auto; bottom: auto; transform: none; margin-right: 5px; width: 32px; height: 32px; min-height: 0; border-radius: 6px; }
.password-field:not(.login-input-shell) > .member-field-error { grid-column: 1; grid-row: 3; }
.eye-icon { width: 22px; height: 22px; display: block; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cg fill='none' stroke='black' stroke-linejoin='round' stroke-width='4'%3E%3Cpath d='M24 36c11.046 0 20-12 20-12s-8.954-12-20-12S4 24 4 24s8.954 12 20 12Z'/%3E%3Cpath d='M24 29a5 5 0 1 0 0-10a5 5 0 0 0 0 10Z'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cg fill='none' stroke='black' stroke-linejoin='round' stroke-width='4'%3E%3Cpath d='M24 36c11.046 0 20-12 20-12s-8.954-12-20-12S4 24 4 24s8.954 12 20 12Z'/%3E%3Cpath d='M24 29a5 5 0 1 0 0-10a5 5 0 0 0 0 10Z'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat; }
.password-eye.visible .eye-icon { -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='4' d='M9.858 18C6.238 21 4 24 4 24s8.954 12 20 12c1.37 0 2.708-.185 4-.508M20.032 12.5c1.282-.318 2.61-.5 3.968-.5c11.046 0 20 12 20 12s-2.239 3-5.858 6m-17.828-9.379a5 5 0 0 0 7.186 6.95M42 42L6 6'/%3E%3C/svg%3E"); mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath fill='none' stroke='black' stroke-linecap='round' stroke-linejoin='round' stroke-width='4' d='M9.858 18C6.238 21 4 24 4 24s8.954 12 20 12c1.37 0 2.708-.185 4-.508M20.032 12.5c1.282-.318 2.61-.5 3.968-.5c11.046 0 20 12 20 12s-2.239 3-5.858 6m-17.828-9.379a5 5 0 0 0 7.186 6.95M42 42L6 6'/%3E%3C/svg%3E"); }
.steps { display: flex; justify-content: center; gap: 7px; margin-bottom: 18px; }
.step { width: 24px; height: 4px; border-radius: 5px; background: var(--line); }
.step.active { width: 42px; background: var(--primary); }

.settings-hero {
  min-height: 132px; margin-bottom: 20px; padding: 25px 28px; display: flex; align-items: center; justify-content: space-between; gap: 28px;
  border: 1px solid color-mix(in srgb, var(--primary) 22%, var(--line)); border-radius: 16px;
  background: var(--feature-hero-background); box-shadow: var(--shadow);
}
.settings-hero h2 { margin: 0 0 7px; font-size: 23px; }
.settings-hero p { max-width: 680px; margin: 0; color: var(--muted); }
.settings-hero-state { min-width: 200px; padding: 16px 18px; display: grid; gap: 12px; border: 1px solid var(--line); border-radius: 12px; background: color-mix(in srgb, var(--surface) 92%, transparent); }
.settings-hero-state > span { display: block; margin-bottom: 8px; color: var(--muted); font-size: 14px; }
.settings-hero-state strong { display: flex; align-items: center; gap: 8px; font-size: 17px; }
.settings-hero-state form { margin: 0; }
.settings-hero-state .button { width: 100%; min-height: 36px; padding-inline: 12px; font-size: 14px; }
.settings-hero-state strong i { width: 9px; height: 9px; border-radius: 50%; background: var(--muted); box-shadow: 0 0 0 5px color-mix(in srgb, var(--muted) 12%, transparent); }
.settings-hero-state strong.online { color: var(--success); }
.settings-hero-state strong.online i { background: var(--success); box-shadow: 0 0 0 5px color-mix(in srgb, var(--success) 13%, transparent); }
.system-settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; gap: 18px; }
.proxy-settings-card { min-width: 0; padding: 24px; }
.network-proxy-card { grid-column: 1 / -1; }
.settings-section-head { display: flex; align-items: center; gap: 13px; margin-bottom: 20px; }
.settings-section-head p { margin: 4px 0 0; color: var(--muted); font-size: 14px; }
.settings-section-icon { width: 44px; height: 44px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 12px; color: white; background: var(--primary); font-size: 20px; box-shadow: 0 7px 16px color-mix(in srgb, var(--primary) 24%, transparent); }
.proxy-settings-card form { display: grid; gap: 16px; }
.network-proxy-card form { display: block; }
.network-proxy-head { margin-bottom: 22px; }
.network-proxy-head > div { min-width: 0; flex: 1; }
.network-proxy-head .proxy-switch { width: min(330px, 34%); margin-left: auto; }
.network-proxy-fields { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 16px; }
.network-proxy-fields .settings-form-actions { padding-top: 22px; }
.network-proxy-fields .button { min-width: 142px; height: 46px; }
.proxy-switch { min-height: 68px; padding: 12px 14px; display: flex; align-items: center; gap: 13px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-soft); cursor: pointer; }
.proxy-switch > input { position: absolute; width: 1px; height: 1px; margin: 0; opacity: 0; pointer-events: none; }
.proxy-switch-track { width: 48px; height: 27px; flex: 0 0 auto; padding: 3px; border-radius: 99px; background: #c9cfda; transition: .2s ease; }
.proxy-switch-track i { display: block; width: 21px; height: 21px; border-radius: 50%; background: white; box-shadow: 0 2px 6px rgba(25,35,55,.22); transition: .2s ease; }
.proxy-switch > input:checked + .proxy-switch-track { background: var(--primary); }
.proxy-switch > input:checked + .proxy-switch-track i { transform: translateX(21px); }
.proxy-switch > input:focus-visible + .proxy-switch-track { outline: 3px solid color-mix(in srgb, var(--primary) 24%, transparent); }
.proxy-switch > span:last-child { display: grid; gap: 4px; }
.proxy-switch small { color: var(--muted); }
.settings-form-actions { display: flex; justify-content: flex-end; }
.tmdb-settings-card { grid-column: 1 / -1; display: flex; flex-direction: column; }
.tmdb-settings-card form { flex: 1; grid-template-rows: auto auto 1fr; }
.tmdb-settings-card .settings-form-actions { align-self: end; }
.settings-side { grid-column: 1 / -1; display: block; }
.proxy-status-card { min-width: 0; padding: 22px; display: grid; grid-template-columns: 54px minmax(0, 1fr); align-content: center; column-gap: 15px; text-align: left; }
.proxy-status-orb { width: 54px; height: 54px; grid-row: 1 / 4; margin: 0; display: grid; place-items: center; border-radius: 13px; color: var(--muted); background: var(--surface-soft); font-size: 22px; }
.proxy-status-orb.online { color: white; background: linear-gradient(135deg, var(--success), #32bfa0); box-shadow: 0 10px 24px color-mix(in srgb, var(--success) 25%, transparent); }
.proxy-status-card > span { grid-column: 2; color: var(--muted); font-size: 14px; }
.proxy-status-card h2 { grid-column: 2; margin: 3px 0 5px; font-size: 19px; }
.proxy-status-card p { grid-column: 2; min-height: 0; margin: 0; color: var(--muted); overflow-wrap: anywhere; font-size: 14px; }
.proxy-status-card form { grid-column: 1 / -1; margin-top: 16px; }
.proxy-status-card form, .proxy-status-card .button { width: 100%; }
.runtime-card { min-width: 0; padding: 4px 20px 16px; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); align-content: center; }
.runtime-card > div { min-width: 0; padding: 17px 14px; display: grid; gap: 6px; border-left: 1px solid var(--line); }
.runtime-card > div:first-child { border-left: 0; }
.runtime-card > div span { color: var(--muted); }
.runtime-card > div strong { overflow: hidden; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
.runtime-card p { grid-column: 1 / -1; margin: 0; padding: 13px 14px 0; border-top: 1px solid var(--line); color: var(--muted); font-size: 14px; }

.clouddrive-settings-card { margin-bottom: 18px; }
.settings-section-icon.cd2 { font-size: 14px; font-weight: 900; }
.clouddrive-settings-fields { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 16px; }
.clouddrive-webhook-panel { margin-top: 18px; padding: 18px; display: grid; gap: 14px; border: 1px solid color-mix(in srgb, var(--primary) 22%, var(--line)); border-radius: 12px; background: color-mix(in srgb, var(--primary-soft) 38%, var(--surface)); }
.clouddrive-webhook-panel > div:first-child { min-width: 0; display: flex; align-items: center; gap: 12px; }
.clouddrive-webhook-panel > div:first-child > div { min-width: 0; }
.clouddrive-webhook-panel h3 { margin: 0; font-size: 16px; }
.clouddrive-webhook-panel p { margin: 4px 0 0; color: var(--muted); font-size: 13px; line-height: 1.55; }
.clouddrive-webhook-panel .settings-section-icon { width: 38px; height: 38px; border-radius: 10px; }
.clouddrive-webhook-panel .copy-field { min-width: 0; }
.clouddrive-webhook-panel .copy-field input { min-width: 0; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.clouddrive-webhook-panel > small { color: var(--muted); line-height: 1.65; }
.clouddrive-webhook-address { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: stretch; }
.clouddrive-webhook-address form, .clouddrive-webhook-address form .button { height: 100%; }
.clouddrive-webhook-address form .button { white-space: nowrap; }
.clouddrive-webhook-state { min-width: 0; padding: 12px 14px; display: flex; align-items: center; gap: 11px; border: 1px solid var(--line); border-radius: 8px; background: color-mix(in srgb, var(--surface-soft) 76%, transparent); }
.clouddrive-webhook-state > span { width: 30px; height: 30px; flex: 0 0 30px; display: grid; place-items: center; border-radius: 7px; }
.clouddrive-webhook-state > span .ui-icon { width: 17px; height: 17px; }
.clouddrive-webhook-state > div { min-width: 0; display: grid; gap: 2px; }
.clouddrive-webhook-state strong { font-size: 13px; }
.clouddrive-webhook-state small { color: var(--muted); line-height: 1.5; }
.clouddrive-webhook-state.success { border-color: color-mix(in srgb, var(--success) 30%, var(--line)); }
.clouddrive-webhook-state.success > span { color: var(--success); background: color-mix(in srgb, var(--success) 12%, transparent); }
.clouddrive-webhook-state.waiting > span { color: var(--warning); background: color-mix(in srgb, var(--warning) 12%, transparent); }
.clouddrive-webhook-state.danger { border-color: color-mix(in srgb, var(--danger) 30%, var(--line)); }
.clouddrive-webhook-state.danger > span { color: var(--danger); background: color-mix(in srgb, var(--danger) 12%, transparent); }
.clouddrive-webhook-configuration { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: color-mix(in srgb, var(--surface-soft) 76%, transparent); }
.clouddrive-webhook-configuration summary { min-height: 50px; padding: 10px 14px; display: flex; align-items: center; justify-content: space-between; gap: 14px; cursor: pointer; list-style: none; }
.clouddrive-webhook-configuration summary::-webkit-details-marker { display: none; }
.clouddrive-webhook-configuration summary > span { min-width: 0; display: flex; align-items: center; gap: 9px; }
.clouddrive-webhook-configuration summary > span > .ui-icon { width: 18px; height: 18px; flex: 0 0 18px; color: var(--primary); }
.clouddrive-webhook-configuration summary b { min-width: 0; font-size: 13px; line-height: 1.45; }
.clouddrive-webhook-configuration summary > .ui-icon { width: 18px; height: 18px; flex: 0 0 auto; color: var(--muted); transition: transform .18s ease; }
.clouddrive-webhook-configuration[open] summary > .ui-icon { transform: rotate(180deg); }
.clouddrive-webhook-configuration > div { padding: 0 14px 14px; display: grid; gap: 10px; }
.clouddrive-webhook-configuration > div > p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.55; }
.clouddrive-webhook-configuration textarea { width: 100%; min-height: 320px; max-height: 48vh; resize: vertical; border-radius: 7px; font: 12px/1.55 ui-monospace, SFMono-Regular, Consolas, monospace; white-space: pre; tab-size: 2; }
.clouddrive-webhook-configuration .button { width: fit-content; justify-self: end; }
.qbittorrent-settings-card { display: grid; gap: 17px; }
.settings-section-icon.qbittorrent { color: var(--warning); border-color: color-mix(in srgb, var(--warning) 32%, var(--line)); background: color-mix(in srgb, var(--warning) 12%, var(--surface)); }
.qbittorrent-settings-card > form { display: grid; gap: 16px; }
.qbittorrent-auth-switch { width: fit-content; padding: 4px; display: flex; gap: 4px; border: 1px solid var(--line); border-radius: 12px; background: color-mix(in srgb, var(--surface-soft) 84%, transparent); }
.qbittorrent-auth-switch button { min-height: 36px; padding: 0 15px; display: inline-flex; align-items: center; gap: 7px; border: 0; border-radius: 9px; color: var(--muted); background: transparent; font-size: 13px; font-weight: 820; cursor: pointer; transition: color .18s ease, background .18s ease, box-shadow .18s ease; }
.qbittorrent-auth-switch button.active { color: white; background: var(--primary); box-shadow: 0 7px 18px color-mix(in srgb, var(--primary) 25%, transparent); }
.qbittorrent-auth-switch .ui-icon { width: 15px; height: 15px; }
.qbittorrent-auth-panel { padding: 16px; display: grid; gap: 12px; border: 1px solid var(--line); border-radius: 14px; background: color-mix(in srgb, var(--surface-soft) 72%, transparent); }
.qbittorrent-auth-panel[hidden] { display: none; }
.qbittorrent-credential-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.qbittorrent-settings-card .settings-inline-actions { margin-top: -2px; }
.settings-connection-error { margin: -7px 0 0; color: var(--danger); }
.qbittorrent-mapping-panel { overflow: hidden; display: grid; gap: 0; border: 1px solid var(--line); border-radius: 15px; background: color-mix(in srgb, var(--surface-soft) 58%, transparent); }
.qbittorrent-mapping-panel > header { padding: 15px 16px; display: flex; align-items: center; justify-content: space-between; gap: 14px; border-bottom: 1px solid var(--line); }
.qbittorrent-mapping-panel > header > div { min-width: 0; }
.qbittorrent-mapping-panel > header span:first-child { color: var(--primary); font-size: 12px; font-weight: 900; letter-spacing: .16em; }
.qbittorrent-mapping-panel h3 { margin: 3px 0 0; font-size: 14px; }
.qbittorrent-mapping-panel p { margin: 4px 0 0; color: var(--muted); font-size: 13px; }
.qbittorrent-mapping-list { display: grid; }
.qbittorrent-mapping-row { min-width: 0; padding: 12px 14px; display: grid; grid-template-columns: 38px minmax(0, 1fr) 32px; align-items: center; gap: 11px; border-bottom: 1px solid var(--line); }
.qbittorrent-mapping-row > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; color: #f4b740; background: color-mix(in srgb, #f4b740 12%, transparent); }
.qbittorrent-mapping-row > span .ui-icon { width: 17px; height: 17px; }
.qbittorrent-mapping-row > div { min-width: 0; }
.qbittorrent-mapping-row strong, .qbittorrent-mapping-row code { display: block; }
.qbittorrent-mapping-row strong { font-size: 14px; }
.qbittorrent-mapping-row code { overflow: hidden; margin-top: 3px; color: var(--muted); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.qbittorrent-mapping-copy > div { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.qbittorrent-mapping-copy small { display: block; margin-top: 5px; color: var(--muted); font-size: 12px; }
.qbittorrent-mapping-row em { padding: 3px 6px; border-radius: 999px; color: var(--primary); background: var(--primary-soft); font-size: 12px; font-style: normal; font-weight: 850; }
.qbittorrent-pipeline-state { padding: 3px 6px; border-radius: 999px; font-size: 12px; font-weight: 850; }
.qbittorrent-pipeline-state.ready { color: #20b981; background: color-mix(in srgb, #20b981 13%, transparent); }
.qbittorrent-pipeline-state.warning { color: #d79214; background: color-mix(in srgb, #f4b740 15%, transparent); }
.qbittorrent-pipeline-state.muted { color: var(--muted); background: color-mix(in srgb, var(--muted) 10%, transparent); }
.qbittorrent-mapping-row form { display: block; }
.qbittorrent-mapping-form { padding: 14px; display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 11px !important; background: color-mix(in srgb, var(--surface) 56%, transparent); }
.qbittorrent-mapping-path-field { grid-column: 1 / -1; }
.qbittorrent-download-options { grid-column: 1 / -1; display: flex; align-items: center; flex-wrap: wrap; gap: 8px 18px; }
.qbittorrent-pipeline-advanced { grid-column: 1 / -1; padding: 12px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; border: 1px solid color-mix(in srgb, var(--primary) 22%, var(--line)); border-radius: 12px; background: color-mix(in srgb, var(--primary-soft) 46%, var(--surface)); }
.qbittorrent-pipeline-advanced[hidden] { display: none; }
.qbittorrent-pipeline-advanced > header { grid-column: 1 / -1; display: grid; grid-template-columns: 30px minmax(0, 1fr); align-items: center; gap: 9px; }
.qbittorrent-pipeline-advanced > header > span { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 9px; color: var(--primary); background: var(--primary-soft); }
.qbittorrent-pipeline-advanced > header .ui-icon { width: 15px; height: 15px; }
.qbittorrent-pipeline-advanced > header div { display: grid; gap: 2px; }
.qbittorrent-pipeline-advanced > header strong { font-size: 13px; }
.qbittorrent-pipeline-advanced > header small { color: var(--muted); font-size: 12px; }
.qbittorrent-mapping-form .checkbox { min-height: 42px; align-items: center; white-space: nowrap; }
.qbittorrent-mapping-form > .button { min-width: 170px; min-height: 42px; grid-column: 1 / -1; justify-self: end; white-space: nowrap; }
.settings-inline-actions { display: flex; justify-content: flex-end; gap: 10px; }
.settings-inline-actions form { display: block; }

.settings-page-shell { display: block; min-width: 0; }
.settings-navigation { position: sticky; top: 12px; z-index: 25; min-width: 0; margin-bottom: 20px; padding: 10px; display: flex; align-items: center; gap: 18px; overflow: hidden; border: 1px solid var(--panel-border); border-radius: var(--panel-radius); background: var(--panel-background); box-shadow: var(--panel-shadow); backdrop-filter: blur(16px) saturate(140%); -webkit-backdrop-filter: blur(16px) saturate(140%); }
.settings-navigation-head { width: 190px; flex: 0 0 190px; padding: 8px 16px; overflow: hidden; border-right: 1px solid color-mix(in srgb, var(--primary) 14%, var(--line)); border-radius: 14px 0 0 14px; background: linear-gradient(145deg, color-mix(in srgb, var(--primary-soft) 72%, var(--surface)), var(--surface)); }
.settings-navigation-head > span { color: var(--primary); font-size: 13px; font-weight: 900; letter-spacing: .14em; }
.settings-navigation-head h2 { margin: 7px 0 5px; font-size: 20px; }
.settings-navigation-head p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.6; }
.settings-navigation nav { min-width: 0; flex: 1; padding: 0; display: grid; grid-template-columns: repeat(var(--settings-navigation-count, 5), minmax(0, 1fr)); gap: 7px; }
.settings-navigation nav a { min-width: 0; min-height: 62px; padding: 9px 11px; display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: 9px; border: 1px solid transparent; border-radius: 12px; color: var(--text); transition: color .2s ease, background-color .2s ease, border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.settings-navigation nav a:hover { border-color: color-mix(in srgb, var(--primary) 18%, var(--line)); background: var(--surface-soft); transform: translateY(-1px); }
.settings-navigation nav a.active { color: white; border-color: transparent; background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 66%, #7950dc)); box-shadow: 0 10px 22px color-mix(in srgb, var(--primary) 25%, transparent); }
.settings-navigation nav a:focus-visible { outline: 3px solid color-mix(in srgb, var(--primary) 28%, transparent); outline-offset: 2px; }
.settings-nav-mark { width: 38px; height: 38px; display: grid; place-items: center; position: relative; border-radius: 10px; color: var(--primary); background: var(--primary-soft); }
.settings-nav-mark > i { font-size: 17px; font-style: normal; font-weight: 850; }
.settings-navigation a.active .settings-nav-mark { color: white; background: rgba(255,255,255,.16); box-shadow: inset 0 0 0 1px rgba(255,255,255,.12); }
.settings-nav-copy { min-width: 0; display: grid; gap: 4px; }
.settings-nav-copy strong { overflow: hidden; display: -webkit-box; font-size: 14px; line-height: 1.4; text-overflow: ellipsis; white-space: normal; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.settings-nav-copy small { overflow: hidden; display: -webkit-box; color: var(--muted); font-size: 13px; line-height: 1.4; text-overflow: ellipsis; white-space: normal; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.settings-navigation a.active .settings-nav-copy small { color: rgba(255,255,255,.7); }
.settings-nav-state { align-self: start; min-width: 8px; padding-top: 5px; display: flex; align-items: center; gap: 5px; color: var(--muted); }
.settings-nav-state > i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 3px color-mix(in srgb, currentColor 12%, transparent); }
.settings-nav-state > em { display: none; font-size: 12px; font-style: normal; white-space: nowrap; }
.settings-nav-state.ready { color: var(--success); }
.settings-nav-state.partial { color: var(--warning); }
.settings-navigation a.active .settings-nav-state { color: rgba(255,255,255,.88); }
.settings-navigation { padding-block: 14px; }
.settings-navigation nav { gap: 10px; }
.settings-navigation nav a { min-height: 76px; padding: 12px 14px; grid-template-columns: 46px minmax(0, 1fr) auto; gap: 12px; }
.settings-navigation .settings-nav-mark { width: 46px; height: 46px; border-radius: 12px; }
.settings-navigation .settings-nav-mark > i { font-size: 20px; }
.settings-navigation .settings-nav-copy { gap: 5px; }
.settings-navigation .settings-nav-copy strong { font-size: 14px; }
.settings-navigation .settings-nav-copy small { font-size: 13px; }
.settings-navigation .settings-nav-state { padding-top: 7px; }
.settings-navigation .settings-nav-state > i { width: 8px; height: 8px; }
.settings-navigation-foot { display: none; }
.settings-navigation-foot > i { width: 9px; height: 9px; flex: 0 0 auto; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 4px var(--success-soft); }
.settings-navigation-foot > span { display: grid; gap: 2px; }
.settings-navigation-foot strong { color: var(--text); font-size: 13px; }
.settings-navigation-foot small { font-size: 12px; }
.settings-navigation.module-navigation {
  --module-nav-item-width: 220px;
  --module-nav-item-height: 80px;
  --module-nav-head-width: 176px;
  container: module-navigation / inline-size;
  height: 116px;
  margin-bottom: 20px;
  padding: 10px;
  gap: 12px;
}
.settings-navigation.module-navigation .settings-navigation-head {
  width: var(--module-nav-head-width);
  height: 100%;
  flex: 0 0 var(--module-nav-head-width);
  padding: 0 12px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.settings-navigation.module-navigation .settings-navigation-head > span { font-size: 12px; line-height: 18px; letter-spacing: 0; white-space: nowrap; }
.settings-navigation.module-navigation .settings-navigation-head h2 { margin: 4px 0; font-size: 18px; line-height: 24px; white-space: nowrap; }
.settings-navigation.module-navigation .settings-navigation-head p { display: -webkit-box; overflow: hidden; font-size: 12px; line-height: 18px; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
/* Item size is independent of the number of destinations and active state. */
.settings-navigation.module-navigation nav {
  display: grid;
  grid-template-columns: none;
  grid-template-rows: var(--module-nav-item-height);
  grid-auto-flow: column;
  grid-auto-columns: min(var(--module-nav-item-width), 100%);
  justify-content: start;
  height: calc(var(--module-nav-item-height) + 4px);
  margin: 0;
  padding: 2px;
  gap: 10px;
  border: 0;
  border-radius: 0;
  background: transparent;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x proximity;
  scroll-padding-inline: 2px;
  scrollbar-width: none;
}
.settings-navigation.module-navigation nav a {
  width: 100%;
  min-width: 0;
  max-width: none;
  height: var(--module-nav-item-height);
  min-height: var(--module-nav-item-height);
  grid-template-columns: 36px minmax(0, 1fr) 8px;
  gap: 8px;
  padding: 10px;
  border-radius: 8px;
}
.settings-navigation.module-navigation nav a:hover { transform: none; }
.settings-navigation.module-navigation .settings-nav-mark { width: 36px; height: 36px; border-radius: 8px; }
.settings-navigation.module-navigation .settings-nav-copy { gap: 4px; letter-spacing: 0; }
.settings-navigation.module-navigation .settings-nav-copy strong { display: block; font-size: 14px; line-height: 20px; white-space: nowrap; }
.settings-navigation.module-navigation .settings-nav-copy small { font-size: 12px; line-height: 18px; }
@container module-navigation (max-width: 920px) {
  .settings-navigation.module-navigation .settings-navigation-head { display: none; }
}
/* The persistent navigation shell uses the content-only transition below. */
@view-transition { navigation: none; }

.navigation-loading {
  position: fixed; inset: 0 0 0 238px; z-index: 15; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 12px; padding: 24px;
  color: var(--text); background: var(--bg); text-align: center;
}
.navigation-loading strong { font-size: 18px; line-height: 1.5; }
.navigation-loading > span:not(.navigation-loading-indicator) { color: var(--muted); font-size: 14px; }
.navigation-loading-indicator { width: 28px; height: 28px; margin-bottom: 8px; border: 3px solid var(--line); border-top-color: var(--primary); border-radius: 50%; animation: navigation-loading-spin .8s linear infinite; }
.navigation-loading > div { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.navigation-loading.is-error .navigation-loading-indicator { animation: none; border-color: var(--warning); }
.is-soft-navigating [data-navigation-content] { visibility: hidden; }
.is-recommendation-navigating [data-navigation-content] { visibility: visible; }
.is-recommendation-navigating [data-recommendation-results] { pointer-events: none; }
.recommendation-navigation-loading { justify-content: flex-start; padding-top: 24px; background: transparent; pointer-events: none; }
.recommendation-navigation-loading > strong { display: none; }
.recommendation-navigation-loading.is-error { background: var(--bg); pointer-events: auto; }
.recommendation-navigation-loading.is-error > strong { display: block; }
.is-subnav-navigating [data-module-nav],
.is-subnav-navigating [data-navigation-content] .page-head,
.is-subnav-navigating [data-navigation-content] .mobile-topbar { visibility: visible; }
:root[data-sidebar-collapsed="true"] .navigation-loading { left: 72px; }
.navigation-enter [data-navigation-content] { animation: navigation-content-ready .16s ease-out both; }
.navigation-subview-enter [data-navigation-content] { animation: none; }
.navigation-subview-enter [data-module-nav] ~ :not(script):not(dialog) { animation: navigation-content-ready .16s ease-out both; }
.turbo-progress-bar { height: 2px; background: var(--primary); }
@keyframes navigation-loading-spin { to { transform: rotate(360deg); } }
@keyframes navigation-content-ready { from { opacity: .4; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 980px) {
  .navigation-loading, :root[data-sidebar-collapsed="true"] .navigation-loading { left: 0; bottom: calc(64px + env(safe-area-inset-bottom)); }
}
@media (prefers-reduced-motion: reduce) {
  .navigation-loading-indicator, .navigation-enter [data-navigation-content],
  .navigation-subview-enter [data-module-nav] ~ :not(script):not(dialog) { animation: none; }
}
.navigation-preferences-dialog { width: min(520px, calc(100vw - 24px)); max-height: calc(100dvh - 32px); overflow-y: auto; }
.navigation-preferences-dialog form { padding: 0 20px 20px; }
.navigation-choice-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; font-size: 13px; color: var(--muted); }
.navigation-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.navigation-choices label { display: grid; grid-template-columns: 18px 20px minmax(0, 1fr); align-items: center; gap: 9px; min-height: 48px; padding: 10px; border: 1px solid var(--line); border-radius: 8px; cursor: pointer; }
.navigation-choices label:has(:checked) { border-color: var(--primary); background: var(--primary-soft); }
.navigation-choices label:has(:focus-visible) { outline: 2px solid var(--primary); outline-offset: 2px; }
.navigation-choices label:has(:disabled) { opacity: .55; cursor: default; }
.navigation-choices input { width: 16px; height: 16px; margin: 0; accent-color: var(--primary); }
.navigation-choices .ui-icon { width: 18px; height: 18px; color: var(--primary); }
.navigation-choices span { min-width: 0; font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.navigation-preferences-dialog .dialog-actions { padding: 18px 0 0; margin: 0; }
.settings-navigation.module-navigation nav::-webkit-scrollbar { display: none; }
.settings-navigation.module-navigation nav a { scroll-snap-align: start; }
[data-swipe-navigation].is-pointer-scrollable, [data-drag-scroll].is-pointer-scrollable,
[data-swipe-navigation].is-pointer-scrollable > a, [data-swipe-navigation].is-pointer-scrollable > button,
[data-drag-scroll].is-pointer-scrollable > a, [data-drag-scroll].is-pointer-scrollable > button { cursor: grab; user-select: none; }
[data-swipe-navigation].is-drag-scrolling, [data-drag-scroll].is-drag-scrolling,
[data-swipe-navigation].is-drag-scrolling *, [data-drag-scroll].is-drag-scrolling * { cursor: grabbing !important; }
[data-swipe-navigation].is-drag-scrolling, [data-drag-scroll].is-drag-scrolling { scroll-snap-type: none !important; scroll-behavior: auto !important; }
.license-settings-card { width: 100%; margin: 0; padding: 0; overflow: hidden; border-color: color-mix(in srgb, var(--primary) 16%, var(--line)); background: linear-gradient(145deg, color-mix(in srgb, var(--surface) 96%, var(--primary-soft)), var(--surface)); }
.license-settings-card.is-active { box-shadow: 0 18px 50px color-mix(in srgb, var(--success) 7%, transparent); }
.license-settings-head { min-height: 92px; padding: 20px 22px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--line); }
.license-settings-title { min-width: 0; display: flex; align-items: center; gap: 14px; }
.license-settings-seal { width: 52px; height: 52px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid color-mix(in srgb, var(--success) 26%, transparent); border-radius: 15px; color: var(--success); background: var(--success-soft); font-size: 26px; font-weight: 800; box-shadow: inset 0 1px 0 rgba(255,255,255,.06); }
.license-settings-card.is-inactive .license-settings-seal { color: var(--warning); border-color: color-mix(in srgb, var(--warning) 28%, transparent); background: color-mix(in srgb, var(--warning) 12%, transparent); }
.license-settings-title > div { min-width: 0; display: grid; gap: 3px; }
.license-settings-title > div > span { color: var(--primary); font-size: 13px; font-weight: 900; letter-spacing: .12em; }
.license-settings-title h2 { font-size: 18px; }
.license-settings-title p { margin: 0; color: var(--muted); font: 14px/1.4 ui-monospace, SFMono-Regular, Consolas, monospace; }
.license-status-pill { min-height: 32px; padding: 0 12px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid transparent; border-radius: 999px; font-size: 14px; font-weight: 800; white-space: nowrap; }
.license-status-pill i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 4px color-mix(in srgb, currentColor 12%, transparent); }
.license-status-pill.success { color: var(--success); border-color: color-mix(in srgb, var(--success) 20%, transparent); background: var(--success-soft); }
.license-status-pill.warning { color: var(--warning); border-color: color-mix(in srgb, var(--warning) 20%, transparent); background: color-mix(in srgb, var(--warning) 10%, transparent); }
.license-status-pill.danger { color: var(--danger); border-color: color-mix(in srgb, var(--danger) 20%, transparent); background: color-mix(in srgb, var(--danger) 10%, transparent); }
.license-settings-overview { padding: 18px 22px 14px; display: grid; grid-template-columns: minmax(260px, .85fr) minmax(0, 1.65fr); gap: 14px; }
.license-expiry-card { min-width: 0; padding: 20px; display: flex; flex-direction: column; justify-content: center; gap: 8px; border: 1px solid color-mix(in srgb, var(--primary) 23%, var(--line)); border-radius: 14px; background: radial-gradient(circle at 100% 0, color-mix(in srgb, var(--primary) 18%, transparent), transparent 48%), color-mix(in srgb, var(--primary-soft) 48%, var(--surface)); }
.license-expiry-card > span { color: var(--muted); font-size: 13px; }
.license-expiry-card > strong { overflow: hidden; color: var(--text); font-size: clamp(17px, 1.5vw, 23px); letter-spacing: -.02em; text-overflow: ellipsis; white-space: nowrap; }
.license-expiry-card > small { color: var(--success); font-size: 14px; font-weight: 800; }
.license-settings-card.is-inactive .license-expiry-card > small { color: var(--warning); }
.license-settings-facts { min-width: 0; margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.license-settings-facts > div { min-width: 0; padding: 14px 15px; display: grid; align-content: center; gap: 6px; border: 1px solid var(--line); border-radius: 12px; background: color-mix(in srgb, var(--surface-soft) 70%, transparent); }
.license-settings-facts dt { color: var(--muted); font-size: 13px; }
.license-settings-facts dd { margin: 0; overflow: hidden; color: var(--text); font-size: 14px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.license-entitlement-strip { margin: 0 22px 14px; padding: 14px; display: grid; grid-template-columns: 190px minmax(0, 1fr); align-items: center; gap: 15px; border: 1px solid color-mix(in srgb, var(--primary) 20%, var(--line)); border-radius: 12px; background: linear-gradient(110deg, color-mix(in srgb, var(--primary-soft) 72%, var(--surface-soft)), color-mix(in srgb, var(--surface-soft) 64%, transparent)); }
.license-entitlement-strip > div:first-child { min-width: 0; display: grid; grid-template-columns: 1fr auto; gap: 3px 8px; align-items: baseline; }
.license-entitlement-strip > div:first-child > span { grid-column: 1 / -1; color: var(--muted); font-size: 13px; }
.license-entitlement-strip > div:first-child > strong { font-size: 15px; }
.license-entitlement-strip > div:first-child > small { color: var(--muted); font-size: 13px; }
.license-feature-tags { min-width: 0; display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 6px; }
.license-feature-tags span { padding: 5px 8px; border: 1px solid color-mix(in srgb, var(--primary) 22%, var(--line)); border-radius: 999px; color: color-mix(in srgb, var(--primary) 74%, var(--text)); background: color-mix(in srgb, var(--primary-soft) 62%, transparent); font-size: 13px; font-weight: 750; }
.license-device-strip { min-height: 62px; margin: 0 22px 16px; padding: 11px 14px; display: flex; align-items: center; gap: 11px; border: 1px solid var(--line); border-radius: 12px; background: color-mix(in srgb, var(--surface-soft) 56%, transparent); }
.license-device-icon { width: 36px; height: 36px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 10px; color: var(--primary); background: var(--primary-soft); font-size: 15px; }
.license-device-strip > div { min-width: 0; flex: 1; display: grid; grid-template-columns: auto 1fr; align-items: baseline; gap: 3px 9px; }
.license-device-strip > div > span { grid-column: 1 / -1; color: var(--muted); font-size: 13px; }
.license-device-strip strong { overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.license-device-strip small { color: var(--muted); font: 13px ui-monospace, SFMono-Regular, Consolas, monospace; }
.license-device-strip em { padding: 5px 9px; border-radius: 999px; color: var(--success); background: var(--success-soft); font-size: 13px; font-style: normal; font-weight: 800; white-space: nowrap; }
.license-settings-card.is-inactive .license-device-strip em { color: var(--warning); background: color-mix(in srgb, var(--warning) 10%, transparent); }
.license-settings-form { margin: 0 22px 22px; padding: 16px; display: block; border: 1px solid var(--line); border-radius: 13px; background: color-mix(in srgb, var(--surface-soft) 68%, transparent); }
.license-settings-form > label { display: block; margin-bottom: 9px; color: var(--text); font-size: 14px; font-weight: 800; }
.license-settings-input-row { display: grid; grid-template-columns: minmax(0, 1fr) 138px; align-items: stretch; gap: 12px; }
.license-settings-form input { width: 100%; min-height: 48px; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .04em; text-transform: uppercase; }
.license-settings-input-row .button { width: 100%; min-height: 48px; }
.license-settings-error { margin: 0 22px 22px; }
.settings-panel { min-width: 0; }
.settings-panel-hero { min-height: 142px; margin-bottom: 18px; padding: 26px 28px; display: flex; align-items: center; justify-content: space-between; gap: 24px; overflow: hidden; border: 1px solid color-mix(in srgb, var(--primary) 20%, var(--line)); border-radius: 18px; background: var(--feature-hero-background); box-shadow: 0 12px 34px rgba(36, 48, 76, .07); }
.settings-panel-hero > div:first-child > span { color: var(--primary); font-size: 13px; font-weight: 900; letter-spacing: .08em; }
.settings-panel-hero h2 { margin: 8px 0 7px; font-size: 24px; }
.settings-panel-hero p { max-width: 620px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.settings-panel-hero-state { min-width: 220px; padding: 15px 17px; display: grid; gap: 6px; border: 1px solid color-mix(in srgb, var(--line) 86%, transparent); border-radius: 13px; background: color-mix(in srgb, var(--surface) 88%, transparent); }
.settings-panel-hero-state > span { color: var(--muted); font-size: 13px; }
.settings-panel-hero-state > strong { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.settings-panel-hero-state > strong i { width: 8px; height: 8px; border-radius: 50%; background: var(--muted); box-shadow: 0 0 0 4px color-mix(in srgb, var(--muted) 12%, transparent); }
.settings-panel-hero-state > strong.ready { color: var(--success); }
.settings-panel-hero-state > strong.ready i { background: var(--success); box-shadow: 0 0 0 4px var(--success-soft); }
.settings-panel-hero-state > strong.partial { color: var(--warning); }
.settings-panel-hero-state > strong.partial i { background: var(--warning); }
.settings-panel-hero-state > small { max-width: 250px; color: var(--muted); font-size: 13px; line-height: 1.5; }
.settings-panel-hero-state form { margin: 6px 0 0; }
.settings-panel-hero-state .button { width: 100%; min-height: 34px; font-size: 13px; }
.settings-panel-hero-state > strong.danger { color: var(--danger); }
.settings-panel-hero-state > strong.danger i { background: var(--danger); box-shadow: 0 0 0 4px color-mix(in srgb, var(--danger) 12%, transparent); }
.diagnostics-section { display: grid; gap: 14px; }
.diagnostics-toolbar { min-height: 66px; padding: 12px 14px 12px 16px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border: 1px solid var(--line); border-radius: 14px; background: color-mix(in srgb, var(--surface) 94%, transparent); }
.diagnostics-toolbar > div { min-width: 0; display: flex; align-items: center; gap: 11px; }
.diagnostics-toolbar > div > span { width: 38px; height: 38px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 10px; color: var(--primary); background: var(--primary-soft); }
.diagnostics-toolbar > div > span .ui-icon { width: 19px; height: 19px; }
.diagnostics-toolbar > div > div { min-width: 0; display: grid; gap: 3px; }
.diagnostics-toolbar strong { font-size: 14px; }
.diagnostics-toolbar small { color: var(--muted); font-size: 13px; line-height: 1.45; }
.diagnostics-toolbar .button { min-width: 126px; }
.diagnostics-summary { min-width: 0; padding: 22px; display: grid; grid-template-columns: 58px minmax(220px, 1fr) minmax(380px, 1.2fr); align-items: center; gap: 18px; overflow: hidden; border: 1px solid color-mix(in srgb, var(--primary) 17%, var(--line)); border-radius: 16px; background: color-mix(in srgb, var(--surface) 96%, var(--primary-soft)); }
.diagnostics-summary-mark { width: 58px; height: 58px; display: grid; place-items: center; border-radius: 14px; color: var(--muted); background: color-mix(in srgb, var(--muted) 10%, transparent); }
.diagnostics-summary-mark .ui-icon { width: 27px; height: 27px; }
.diagnostics-summary.is-success .diagnostics-summary-mark { color: var(--success); background: var(--success-soft); }
.diagnostics-summary.is-warning .diagnostics-summary-mark { color: var(--warning); background: color-mix(in srgb, var(--warning) 12%, transparent); }
.diagnostics-summary.is-danger .diagnostics-summary-mark { color: var(--danger); background: color-mix(in srgb, var(--danger) 12%, transparent); }
.diagnostics-summary-copy { min-width: 0; display: grid; gap: 4px; }
.diagnostics-summary-copy > span { color: var(--primary); font-size: 13px; font-weight: 850; }
.diagnostics-summary-copy h3 { margin: 0; font-size: 21px; }
.diagnostics-summary-copy p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.55; }
.diagnostics-summary-copy small { margin-top: 2px; color: var(--muted); font-size: 12px; }
.diagnostics-metrics { min-width: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: color-mix(in srgb, var(--surface-soft) 70%, transparent); }
.diagnostics-metrics > div { min-width: 0; min-height: 70px; padding: 12px; display: grid; align-content: center; gap: 5px; border-left: 1px solid var(--line); }
.diagnostics-metrics > div:first-child { border-left: 0; }
.diagnostics-metrics span { overflow: hidden; color: var(--muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.diagnostics-metrics strong { font-size: 22px; }
.diagnostics-metrics > div:nth-child(1) strong { color: var(--success); }
.diagnostics-metrics > div:nth-child(2) strong { color: var(--danger); }
.diagnostics-metrics > div:nth-child(3) strong { color: var(--warning); }
.diagnostics-metrics > div:nth-child(4) strong { color: var(--muted); }
.diagnostics-progress { min-height: 64px; padding: 14px 16px; display: none; grid-template-columns: 34px minmax(0, 1fr); align-items: center; gap: 4px 12px; border: 1px solid color-mix(in srgb, var(--primary) 22%, var(--line)); border-radius: 13px; background: color-mix(in srgb, var(--primary-soft) 54%, var(--surface)); }
.diagnostics-section.is-checking .diagnostics-progress { display: grid; }
.diagnostics-progress > span { width: 28px; height: 28px; grid-row: 1 / 3; border: 3px solid color-mix(in srgb, var(--primary) 18%, transparent); border-top-color: var(--primary); border-radius: 50%; animation: diagnostics-spin .8s linear infinite; }
.diagnostics-progress strong { font-size: 14px; }
.diagnostics-progress small { color: var(--muted); font-size: 13px; }
@keyframes diagnostics-spin { to { transform: rotate(360deg); } }
.diagnostics-groups { min-width: 0; display: grid; gap: 14px; }
.diagnostics-section.is-checking .diagnostics-groups { opacity: .5; pointer-events: none; }
.diagnostics-group { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 15px; background: color-mix(in srgb, var(--surface) 95%, transparent); }
.diagnostics-group > header { min-height: 70px; padding: 14px 17px; display: flex; align-items: center; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface-soft) 58%, transparent); }
.diagnostics-group > header > div { min-width: 0; display: flex; align-items: center; gap: 11px; }
.diagnostics-group > header > div > span { width: 38px; height: 38px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 10px; color: var(--primary); background: var(--primary-soft); }
.diagnostics-group > header > div > span .ui-icon { width: 18px; height: 18px; }
.diagnostics-group > header > div > div { min-width: 0; display: grid; gap: 3px; }
.diagnostics-group h3 { margin: 0; font-size: 16px; }
.diagnostics-group header p { margin: 0; color: var(--muted); font-size: 13px; }
.diagnostics-group > header > strong { color: var(--muted); font-size: 13px; white-space: nowrap; }
.diagnostics-list { display: grid; }
.diagnostics-item { --diagnostic-color: var(--muted); min-width: 0; min-height: 102px; padding: 16px 17px; display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: start; gap: 13px; border-top: 1px solid var(--line); }
.diagnostics-item:first-child { border-top: 0; }
.diagnostics-item.is-success { --diagnostic-color: var(--success); }
.diagnostics-item.is-warning { --diagnostic-color: var(--warning); }
.diagnostics-item.is-danger { --diagnostic-color: var(--danger); }
.diagnostics-item-icon { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 10px; color: var(--diagnostic-color); background: color-mix(in srgb, var(--diagnostic-color) 11%, transparent); }
.diagnostics-item-icon .ui-icon { width: 18px; height: 18px; }
.diagnostics-item-copy { min-width: 0; display: grid; gap: 4px; }
.diagnostics-item-copy > div { min-width: 0; display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.diagnostics-item-copy h4 { margin: 0; font-size: 15px; }
.diagnostics-item-copy > div > span { padding: 3px 7px; border-radius: 999px; color: var(--diagnostic-color); background: color-mix(in srgb, var(--diagnostic-color) 11%, transparent); font-size: 12px; font-weight: 800; }
.diagnostics-item-copy > strong { color: var(--text); font-size: 14px; }
.diagnostics-item-copy p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.55; }
.diagnostics-item-copy small { margin-top: 3px; padding: 8px 10px; display: flex; align-items: flex-start; gap: 7px; border-radius: 8px; color: var(--text); background: color-mix(in srgb, var(--diagnostic-color) 7%, var(--surface-soft)); font-size: 13px; line-height: 1.5; }
.diagnostics-item-copy small b { flex: 0 0 auto; color: var(--diagnostic-color); font-size: 12px; }
.diagnostics-item-side { min-width: 92px; display: grid; justify-items: end; gap: 10px; }
.diagnostics-item-side > span { color: var(--muted); font-size: 12px; }
.diagnostics-item-side > a { min-height: 32px; padding: 0 9px; display: inline-flex; align-items: center; gap: 5px; border: 1px solid color-mix(in srgb, var(--primary) 20%, var(--line)); border-radius: 8px; color: var(--primary); background: var(--primary-soft); font-size: 12px; font-weight: 800; white-space: nowrap; }
.diagnostics-item-side > a .ui-icon { width: 13px; height: 13px; }
.diagnostics-item-side > a:hover { border-color: color-mix(in srgb, var(--primary) 38%, var(--line)); }
.diagnostics-note, .diagnostics-error { min-height: 58px; padding: 13px 15px; display: flex; align-items: center; gap: 11px; border: 1px solid var(--line); border-radius: 12px; background: color-mix(in srgb, var(--surface-soft) 66%, transparent); }
.diagnostics-note > .ui-icon, .diagnostics-error > .ui-icon { width: 20px; height: 20px; flex: 0 0 auto; color: var(--primary); }
.diagnostics-note > span, .diagnostics-error > div { min-width: 0; display: grid; gap: 3px; }
.diagnostics-note strong, .diagnostics-error strong { font-size: 13px; }
.diagnostics-note small, .diagnostics-error p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.diagnostics-error { border-color: color-mix(in srgb, var(--danger) 24%, var(--line)); background: color-mix(in srgb, var(--danger) 7%, var(--surface)); }
.diagnostics-error > .ui-icon { color: var(--danger); }
.license-hero-state { position: relative; min-width: 326px; min-height: 112px; padding: 9px 15px 9px 10px; grid-template-columns: 104px minmax(145px, 1fr); align-items: center; gap: 14px; isolation: isolate; overflow: hidden; }
.license-hero-state::before { position: absolute; inset: auto -26px -70px 70px; height: 130px; content: ""; border-radius: 50%; background: color-mix(in srgb, var(--primary) 13%, transparent); filter: blur(24px); pointer-events: none; }
.license-plan-badge { position: relative; z-index: 1; width: 102px; height: 102px; display: grid; place-items: center; cursor: grab; touch-action: none; user-select: none; outline: none; }
.license-plan-badge:active, .license-plan-badge.is-dragging { cursor: grabbing; }
.license-plan-badge:focus-visible { border-radius: 28px; box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 28%, transparent); }
.license-plan-badge-halo { position: absolute; inset: 23%; border-radius: 50%; opacity: .58; filter: blur(17px); transform: translateY(8px); }
.license-plan-badge.is-ultimate .license-plan-badge-halo { background: #d88917; }
.license-plan-badge.is-professional .license-plan-badge-halo { background: #7d4cff; }
.license-plan-badge.is-basic .license-plan-badge-halo { background: #3187e8; }
.license-plan-badge.is-locked { width: 82px; height: 82px; margin-inline: 10px; border: 1px dashed var(--line); border-radius: 23px; color: var(--muted); background: var(--surface-soft); font-size: 27px; font-weight: 900; }
.license-hero-copy { position: relative; z-index: 1; min-width: 0; display: grid; justify-items: start; gap: 6px; }
.license-hero-copy > span { color: var(--muted); font-size: 13px; }
.license-hero-copy > strong { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.license-hero-copy > strong i { width: 8px; height: 8px; border-radius: 50%; background: var(--muted); box-shadow: 0 0 0 4px color-mix(in srgb, var(--muted) 12%, transparent); }
.license-hero-copy > strong.ready { color: var(--success); }
.license-hero-copy > strong.ready i { background: var(--success); box-shadow: 0 0 0 4px var(--success-soft); }
.license-hero-copy > strong.partial { color: var(--warning); }
.license-hero-copy > strong.partial i { background: var(--warning); }
.license-hero-copy > em { padding: 4px 8px; border: 1px solid color-mix(in srgb, var(--primary) 24%, var(--line)); border-radius: 999px; color: var(--primary); background: var(--primary-soft); font-size: 13px; font-style: normal; font-weight: 900; }
.license-hero-state[data-license-plan="ultimate"] .license-hero-copy > em { color: #efb650; border-color: rgba(226,157,42,.32); background: rgba(143,86,13,.18); }
.license-hero-state[data-license-plan="basic"] .license-hero-copy > em { color: #68aef8; border-color: rgba(65,139,221,.32); background: rgba(30,91,161,.18); }
.license-hero-copy > small { max-width: 225px; color: var(--muted); font-size: 13px; line-height: 1.5; }
.license-hero-copy > .license-hero-meta { max-width: none; display: inline-flex; align-items: center; gap: 6px; line-height: 1.35; white-space: nowrap; }
.license-hero-meta i { color: color-mix(in srgb, var(--muted) 64%, transparent); font-style: normal; }
.license-hero-state { min-width: 390px; min-height: 118px; grid-template-columns: 110px minmax(210px, 225px); justify-content: center; }
.license-plan-badge { --license-medal-offset: -7px; width: 108px; height: 108px; perspective: none; overflow: visible; transform: translateY(var(--license-medal-offset)); animation: license-medal-float 4s ease-in-out infinite; }
@keyframes license-medal-float { 0%, 100% { transform: translateY(var(--license-medal-offset)); } 50% { transform: translateY(calc(var(--license-medal-offset) - 6px)); } }
.license-plan-medal-canvas { position: relative; z-index: 2; display: block; width: 100%; height: 100%; border: 0; border-radius: 28px; opacity: 0; cursor: grab; touch-action: none; outline: none; filter: drop-shadow(0 13px 12px rgba(0,0,0,.28)); }
.license-plan-medal-canvas:active, .license-plan-badge.is-dragging .license-plan-medal-canvas { cursor: grabbing; }
.license-plan-medal-canvas:focus-visible { box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 30%, transparent); }
.license-medal-preview { position: absolute; inset: 0; z-index: 1; display: block; width: 100%; height: 100%; object-fit: contain; pointer-events: none; user-select: none; filter: drop-shadow(0 13px 12px rgba(0,0,0,.28)); }
.license-plan-badge.is-webgl-ready .license-plan-medal-canvas { opacity: 1; }
.license-plan-badge.is-webgl-ready .license-medal-preview { visibility: hidden; }
.license-plan-badge.is-webgl-unavailable .license-plan-medal-canvas { display: none; }
@media (prefers-reduced-motion: reduce) { .license-plan-badge { animation: none; } }
.settings-panel > .notice { margin-bottom: 18px; }
.settings-group { min-width: 0; margin-bottom: 0; outline: none; }
.settings-group > .clouddrive-settings-card, .settings-group > .notification-center-card { margin-bottom: 0; }
.settings-group[data-settings-section="storage"] { display: grid; gap: 18px; }
.settings-group[data-settings-section="storage"] > .clouddrive-settings-card,
.settings-group[data-settings-section="storage"] > .one15-settings-card,
.settings-group[data-settings-section="storage"] > .one15-automation-card { margin-bottom: 0; }
.settings-network-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.settings-network-grid .network-proxy-card, .settings-network-grid .tmdb-settings-card { grid-column: auto; }
.settings-network-grid .network-proxy-card > form { height: 100%; display: flex; flex-direction: column; }
.settings-network-grid .network-proxy-head { align-items: flex-start; flex-wrap: wrap; }
.settings-network-grid .network-proxy-head .proxy-switch { width: 100%; margin-left: 57px; }
.settings-network-grid .network-proxy-fields { flex: 1; grid-template-columns: 1fr; }
.settings-network-grid .network-proxy-fields .settings-form-actions { align-self: end; padding-top: 0; }
.settings-network-grid .network-proxy-fields .button { height: 42px; }
.settings-network-grid .tmdb-settings-card .settings-form-actions { align-self: end; }
.settings-connection-error { display: block; margin-top: 12px; color: var(--danger); }

.notification-center-card { margin-bottom: 18px; padding: 0; overflow: hidden; border-color: color-mix(in srgb, #168bb3 20%, var(--line)); background: linear-gradient(180deg, color-mix(in srgb, var(--surface) 96%, #168bb3), var(--surface)); }
.notification-center-card > form { display: grid; }
.notification-center-head { margin: 0; padding: 25px 30px 22px; border-bottom: 1px solid var(--line); }
.notification-center-head > .badge { margin-left: auto; white-space: nowrap; }
.settings-section-icon.notification { color: white; background: linear-gradient(145deg, #168bb3, #176f87); box-shadow: 0 9px 20px color-mix(in srgb, #168bb3 24%, transparent); }
.settings-section-icon.wecom { color: white; background: linear-gradient(145deg, #43b96f, #219653); box-shadow: 0 9px 20px color-mix(in srgb, #2fa760 28%, transparent); }
.notification-channel-grid { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(320px, .88fr); border-bottom: 1px solid var(--line); }
.notification-channel-grid.single { grid-template-columns: minmax(0, 1fr); }
.admin-bot-tabs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; margin: 0 20px; padding: 4px; border-radius: 8px; background: var(--surface-soft); }
.admin-bot-tabs button { min-width: 0; min-height: 40px; padding: 8px 4px; border: 0; border-radius: 6px; color: var(--muted); background: transparent; font: inherit; font-size: 13px; cursor: pointer; }
.admin-bot-tabs button[aria-selected="true"] { color: var(--primary); background: var(--surface); box-shadow: 0 1px 3px rgba(0,0,0,.12); }
.admin-bot-tabs button:focus-visible { outline: 2px solid var(--primary); outline-offset: 1px; }
.admin-bot-panel { padding: 20px; }
.admin-bot-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 20px; }
.admin-bot-heading h3 { margin: 0; font-size: 15px; }
[data-admin-bot-history] { padding: 0 20px 20px; }
[data-admin-bot-history] .remote-control-activity li > div { min-width: 0; overflow-wrap: anywhere; }
[data-admin-bot-panel][hidden] { display: none !important; }
.admin-bot-runtime { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin: 0 0 20px; }
.admin-bot-runtime dt { color: var(--muted); font-size: 13px; }
.admin-bot-runtime dd { margin: 6px 0 0; font-size: 14px; overflow-wrap: anywhere; }
.admin-bot-runtime-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.notification-channel-grid.single .notification-channel { border-right: 0; }
.notification-channel { min-width: 0; padding: 27px 30px 25px; display: flex; flex-direction: column; }
.notification-channel:first-child { border-right: 1px solid var(--line); }
.notification-channel:last-child { background: color-mix(in srgb, var(--surface-soft) 34%, transparent); }
.notification-channel-head { min-height: 46px; display: flex; align-items: center; gap: 12px; }
.notification-channel-head > div { min-width: 0; flex: 1; }
.notification-channel-head h3, .notification-subhead h3, .notification-filter h3 { margin: 0; font-size: 15px; letter-spacing: -.01em; }
.notification-channel-head p, .notification-subhead p, .notification-filter p { margin: 4px 0 0; color: var(--muted); font-size: 14px; line-height: 1.55; }
.notification-channel-mark { width: 42px; height: 42px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 12px; color: white; background: linear-gradient(145deg, #168bb3, #15799b); font-size: 14px; font-weight: 850; box-shadow: 0 8px 18px color-mix(in srgb, #168bb3 22%, transparent); }
.notification-channel.wechat .notification-channel-mark { background: linear-gradient(145deg, #38a563, #2e8b57); box-shadow: 0 8px 18px color-mix(in srgb, #2e8b57 22%, transparent); font-size: 15px; }
.channel-enable { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; cursor: pointer; }
.channel-enable > input, .notification-event-toggle > input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.channel-enable b { font-size: 14px; }
.notification-switch { width: 40px; height: 23px; flex: 0 0 auto; padding: 3px; border-radius: 99px; background: color-mix(in srgb, var(--muted) 48%, var(--surface)); transition: .2s ease; }
.notification-switch i { display: block; width: 17px; height: 17px; border-radius: 50%; background: white; box-shadow: 0 1px 5px rgba(25,35,55,.22); transition: .2s ease; }
.channel-enable > input:checked + .notification-switch, .notification-event-toggle > input:checked + .notification-switch { background: var(--primary); }
.channel-enable > input:checked + .notification-switch i, .notification-event-toggle > input:checked + .notification-switch i { transform: translateX(17px); }
.channel-enable > input:focus-visible + .notification-switch, .notification-event-toggle > input:focus-visible + .notification-switch { outline: 3px solid color-mix(in srgb, var(--primary) 24%, transparent); }
.notification-fields { margin-top: 23px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-content: start; gap: 14px 16px; }
.notification-fields > .field { align-self: start; align-content: start; }
.notification-fields .full { grid-column: 1 / -1; }
.notification-fields textarea { min-height: 82px; }
.notification-test-row { min-height: 42px; margin-top: 21px; padding-top: 17px; display: flex; align-items: center; gap: 13px; border-top: 1px solid var(--line); }
.notification-test-row > span:first-child { min-width: 0; margin-right: auto; color: var(--muted); font-size: 13px; }
.notification-test-row > span.testing { color: var(--warning); }
.notification-test-row > span.success { color: var(--success); }
.notification-test-row > span.error { color: var(--danger); }
.notification-test-row .checkbox { white-space: nowrap; }
.notification-reserved-note { min-height: 54px; margin-top: auto; padding: 14px 0 0 14px; display: grid; align-content: center; gap: 3px; border-left: 3px solid #2e8b57; }
.notification-reserved-note strong { font-size: 14px; }
.notification-reserved-note span { color: var(--muted); font-size: 13px; line-height: 1.5; }
.notification-policy { padding: 26px 30px 28px; border-bottom: 1px solid var(--line); }
.notification-subhead, .notification-filter-copy { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.notification-subhead > span { flex: 0 0 auto; padding: 6px 10px; border: 1px solid color-mix(in srgb, var(--primary) 22%, var(--line)); border-radius: 999px; color: var(--primary); background: var(--primary-soft); font-size: 13px; font-weight: 800; }
.notification-event-groups { margin-top: 17px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.notification-event-group { min-width: 0; padding: 15px; border: 1px solid var(--line); border-radius: 13px; background: color-mix(in srgb, var(--surface-soft) 66%, var(--surface)); }
.notification-event-group h4 { margin: 0 0 10px; color: var(--text); font-size: 13px; font-weight: 800; letter-spacing: .04em; }
.notification-event-group > div { display: grid; gap: 4px; }
.notification-event-toggle { min-height: 50px; padding: 7px 8px; display: flex; align-items: center; gap: 10px; border-radius: 9px; cursor: pointer; transition: background .18s ease, transform .18s ease; }
.notification-event-toggle:hover { background: color-mix(in srgb, var(--primary-soft) 58%, transparent); transform: translateX(2px); }
.notification-event-toggle > span:last-child { min-width: 0; display: grid; gap: 3px; }
.notification-event-toggle strong { font-size: 14px; }
.notification-event-toggle small { color: var(--muted); font-size: 13px; line-height: 1.4; }
.notification-filter { margin: 24px 30px 26px; padding: 21px 22px 22px; border: 1px solid var(--line); border-radius: 14px; background: color-mix(in srgb, var(--surface-soft) 58%, var(--surface)); }
.notification-filter > .field { margin-top: 16px; }
.notification-filter textarea { min-height: 118px; font-family: Consolas, "SFMono-Regular", monospace; font-size: 14px; }
.notification-save-row { min-height: 68px; margin: 0; padding: 15px 30px; display: flex; align-items: center; justify-content: flex-end; gap: 18px; border-top: 1px solid var(--line); background: color-mix(in srgb, var(--surface-soft) 48%, transparent); }
.notification-save-row > span { margin-right: auto; color: var(--muted); font-size: 13px; }
.wecom-notification-card { border-color: color-mix(in srgb, #2fa760 24%, var(--line)); background: linear-gradient(180deg, color-mix(in srgb, var(--surface) 96%, #2fa760), var(--surface)); }
.wecom-notification-head { background: radial-gradient(circle at 88% 0, color-mix(in srgb, #35b468 13%, transparent), transparent 34%); }
.wecom-enable-row { min-height: 68px; padding: 15px 30px; display: flex; align-items: center; gap: 18px; border-bottom: 1px solid var(--line); background: color-mix(in srgb, #2fa760 5%, var(--surface-soft)); }
.wecom-enable-row > span { margin-left: auto; color: var(--muted); font-size: 13px; text-align: right; }
.wecom-settings-fields { padding: 25px 30px 27px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; gap: 18px; }
.wecom-settings-fields .field { align-content: start; }
.wecom-settings-fields .field.full { grid-column: 1 / -1; }
.wecom-settings-fields textarea { min-height: 88px; }
.wecom-secret-actions { margin: 0 30px; padding: 15px 0; display: flex; flex-wrap: wrap; gap: 10px 20px; border-top: 1px solid var(--line); }
.wecom-test-row { margin: 0; padding: 15px 30px; background: color-mix(in srgb, var(--surface-soft) 48%, transparent); }
.wecom-control-settings, .wecom-legacy-settings, .wecom-secret-settings { border-top: 1px solid var(--line); }
.wecom-control-settings > summary, .wecom-legacy-settings > summary, .wecom-secret-settings > summary { padding: 16px 30px; font-size: 13px; cursor: pointer; }
.wecom-control-settings > .remote-control-enable, .wecom-control-settings > .remote-control-overview { margin: 0; padding: 18px 30px; }
.wecom-callback-status { padding: 0 30px 18px; display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 13px; }
.wecom-callback-status > .copy-field { width: 100%; }
.wecom-callback-status > small { color: var(--muted); }
.wecom-legacy-settings > .field, .wecom-legacy-settings > .checkbox { margin: 0 30px 18px; }
.remote-control-enable { min-width: 0; margin-top: 20px; padding: 15px 0; display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: center; gap: 12px; border-top: 1px solid var(--line); cursor: pointer; }
.remote-control-enable > input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.remote-control-enable > span:last-child { min-width: 0; display: grid; gap: 3px; }
.remote-control-enable b { font-size: 15px; }
.remote-control-enable small { color: var(--muted); font-size: 13px; line-height: 1.55; }
.remote-control-enable > input:checked + .notification-switch { background: var(--primary); }
.remote-control-enable.wecom > input:checked + .notification-switch { background: #2c9a59; }
.remote-control-enable > input:checked + .notification-switch i { transform: translateX(17px); }
.remote-control-enable > input:focus-visible + .notification-switch { outline: 3px solid color-mix(in srgb, var(--primary) 24%, transparent); }
.wecom-notification-card > form > .remote-control-enable { margin: 0; padding: 18px 30px; border-bottom: 1px solid var(--line); background: color-mix(in srgb, #2fa760 5%, var(--surface)); }
.remote-control-overview { min-width: 0; margin-top: 3px; padding: 18px 0 2px; border-top: 1px solid var(--line); }
.wecom-notification-card > form > .remote-control-overview { margin: 0; padding: 22px 30px 24px; border-top: 0; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface-soft) 38%, var(--surface)); }
.remote-control-overview > header { display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: center; gap: 11px; }
.remote-control-overview > header > span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 8px; color: #176f87; background: color-mix(in srgb, #168bb3 12%, var(--surface)); }
.wecom-notification-card .remote-control-overview > header > span { color: #247d4c; background: color-mix(in srgb, #2fa760 12%, var(--surface)); }
.remote-control-overview > header .ui-icon { width: 20px; height: 20px; }
.remote-control-overview h3 { margin: 0; font-size: 15px; }
.remote-control-overview header p { margin: 4px 0 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.remote-control-metrics { margin-top: 15px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border: 1px solid var(--line); border-radius: 8px; background: color-mix(in srgb, var(--surface-soft) 64%, var(--surface)); overflow: hidden; }
.remote-control-metrics > div { min-width: 0; min-height: 58px; padding: 10px 12px; display: grid; align-content: center; gap: 2px; border-right: 1px solid var(--line); }
.remote-control-metrics > div:last-child { border-right: 0; }
.remote-control-metrics strong { overflow: hidden; color: var(--text); font-size: 17px; text-overflow: ellipsis; white-space: nowrap; }
.remote-control-metrics span { color: var(--muted); font-size: 12px; }
.remote-control-native-menu { min-width: 0; min-height: 62px; margin-top: 12px; padding: 11px 12px; display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: 11px; border: 1px solid color-mix(in srgb, #168bb3 24%, var(--line)); border-radius: 8px; background: color-mix(in srgb, #168bb3 7%, var(--surface)); }
.remote-control-native-menu > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 8px; color: #167c9d; background: color-mix(in srgb, #168bb3 13%, var(--surface)); }
.remote-control-native-menu > span .ui-icon { width: 18px; height: 18px; }
.remote-control-native-menu > div { min-width: 0; display: grid; gap: 3px; }
.remote-control-native-menu strong { font-size: 14px; }
.remote-control-native-menu small { overflow: hidden; color: var(--muted); font-size: 12px; line-height: 1.45; text-overflow: ellipsis; white-space: nowrap; }
.remote-control-native-menu em { padding: 5px 8px; border-radius: 6px; color: var(--muted); background: var(--surface-soft); font-size: 12px; font-style: normal; font-weight: 800; white-space: nowrap; }
.remote-control-native-menu em.ready { color: var(--success); background: var(--success-soft); }
.remote-control-command-preview { margin-top: 7px; display: flex; flex-wrap: wrap; gap: 5px; }
.remote-control-command-preview code, .remote-control-command-preview span { min-height: 25px; padding: 4px 7px; display: inline-flex; align-items: center; border: 1px solid var(--line); border-radius: 5px; color: #167c9d; background: var(--surface); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 12px; font-weight: 750; }
.remote-control-command-preview span { color: var(--muted); }
.remote-control-command-grid { margin-top: 14px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.remote-control-command-grid span { min-width: 0; min-height: 32px; padding: 6px 8px; display: grid; place-items: center; overflow: hidden; border: 1px solid var(--line); border-radius: 6px; color: var(--text); background: var(--surface); font-size: 13px; font-weight: 700; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.remote-control-activity { margin-top: 17px; padding-top: 15px; display: grid; grid-template-columns: minmax(140px, .4fr) minmax(0, 1fr); gap: 18px; border-top: 1px dashed var(--line); }
.remote-control-activity > div strong, .remote-control-activity > div small { display: block; }
.remote-control-activity > div strong { font-size: 14px; }
.remote-control-activity > div small { margin-top: 4px; color: var(--muted); font-size: 13px; }
.remote-control-activity ul { min-width: 0; margin: 0; padding: 0; display: grid; gap: 7px; list-style: none; }
.remote-control-activity li { min-width: 0; min-height: 38px; display: grid; grid-template-columns: 58px minmax(0, 1fr); align-items: center; gap: 9px; }
.remote-control-activity li > div { min-width: 0; }
.remote-control-activity li strong, .remote-control-activity li small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.remote-control-activity li strong { font-size: 13px; }
.remote-control-activity li small { margin-top: 2px; color: var(--muted); font-size: 12px; }
.remote-control-activity li.empty { min-height: 44px; display: grid; place-items: center; color: var(--muted); font-size: 13px; }
.remote-control-result { display: inline-flex; align-items: center; gap: 5px; color: var(--muted); font-size: 12px; font-weight: 750; }
.remote-control-result i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.remote-control-result.success { color: var(--success); }
.remote-control-result.warning { color: var(--warning); }
.remote-control-result.danger { color: var(--danger); }

.archive-toolbar { min-height: 54px; margin-bottom: 22px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid var(--line); }
.archive-tabs { align-self: stretch; display: flex; align-items: stretch; gap: 28px; }
.archive-tabs a { position: relative; padding: 0 5px; display: flex; align-items: center; color: var(--muted); font-weight: 800; }
.archive-tabs a::after { content: ''; position: absolute; right: 0; bottom: -1px; left: 0; height: 3px; border-radius: 3px 3px 0 0; background: transparent; }
.archive-tabs a.active { color: var(--primary); }
.archive-tabs a.active::after { background: var(--primary); }
.archive-service-state { display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: 14px; }
.archive-service-state > span { width: 8px; height: 8px; border-radius: 50%; background: var(--warning); box-shadow: 0 0 0 4px color-mix(in srgb, var(--warning) 13%, transparent); }
.archive-service-state > span.ready { background: var(--success); box-shadow: 0 0 0 4px color-mix(in srgb, var(--success) 13%, transparent); }
.archive-service-state-band { margin: -7px 3px 18px; justify-content: flex-end; }
.archive-list-head { margin-bottom: 16px; display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; }
.archive-list-head h2 { margin: 0 0 4px; font-size: 19px; }
.archive-list-head p { margin: 0; color: var(--muted); font-size: 14px; }
.archive-list { display: grid; gap: 12px; }
.archive-list-card { min-width: 0; min-height: 116px; padding: 20px; display: grid; grid-template-columns: 50px minmax(0, 1fr) auto; align-items: center; gap: 17px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); box-shadow: 0 5px 18px rgba(30,45,75,.06); }
.archive-list-card:hover { border-color: color-mix(in srgb, var(--primary) 36%, var(--line)); }
.archive-list-icon { width: 50px; height: 50px; display: grid; place-items: center; border-radius: 10px; color: white; background: var(--primary); font-size: 16px; font-weight: 900; }
.archive-list-card.task .archive-list-icon { color: var(--primary); background: var(--primary-soft); }
.archive-list-title { display: flex; align-items: center; gap: 10px; }
.archive-list-title h2 { margin: 0; font-size: 17px; }
.archive-list-card.task .archive-list-title { flex-wrap: wrap; }
.archive-list-card.task .archive-list-title h2 { max-width: 100%; overflow-wrap: anywhere; }
.archive-list-card.task .archive-list-title .badge { flex: 0 0 auto; white-space: nowrap; }
.archive-list-main > p { margin: 6px 0 10px; color: var(--muted); font-size: 14px; }
.archive-category-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.archive-category-chips span { padding: 4px 8px; border-radius: 5px; color: var(--primary); background: var(--primary-soft); font-size: 13px; }
.archive-list-actions { display: flex; align-items: center; gap: 7px; }
.archive-list-actions form { margin: 0; }
.icon-command { width: 36px; height: 36px; padding: 0; display: inline-grid; place-items: center; border: 1px solid var(--line); border-radius: 8px; color: var(--text); background: var(--surface-soft); font: inherit; font-weight: 900; cursor: pointer; }
.icon-command:hover { color: var(--primary); border-color: color-mix(in srgb, var(--primary) 40%, var(--line)); background: var(--primary-soft); }
.icon-command.danger { color: var(--danger); }
.icon-command:disabled { opacity: .38; cursor: not-allowed; }
.archive-runtime-overview { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 18px 0 30px; }
.archive-runtime-overview > div { min-height: 112px; padding: 19px 22px; display: grid; align-content: center; gap: 4px; border: 1px solid var(--border-color); border-radius: 12px; background: var(--bg-card); box-shadow: var(--card-shadow); }
.archive-runtime-overview span, .archive-runtime-overview small { color: var(--muted); }
.archive-runtime-overview span { font-size: 14px; font-weight: 750; }
.archive-runtime-overview strong { font-size: 27px; line-height: 1.1; }
.archive-runtime-overview small { font-size: 14px; }
.archive-flow-band { margin-bottom: 30px; padding: 8px 4px 22px; display: grid; grid-template-columns: repeat(9, auto); align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); }
.archive-flow-band > div { min-width: 105px; display: grid; grid-template-columns: 30px minmax(0, 1fr); align-items: center; gap: 2px 9px; }
.archive-flow-band > div > span { width: 30px; height: 30px; grid-row: 1 / 3; display: grid; place-items: center; border-radius: 50%; color: var(--primary); background: var(--primary-soft); font-size: 14px; font-weight: 850; }
.archive-flow-band strong { font-size: 14px; }
.archive-flow-band small { color: var(--muted); font-size: 13px; white-space: nowrap; }
.archive-flow-band > i { color: var(--muted); font-size: 20px; font-style: normal; }
.archive-inbox-filters { margin: 0 0 16px; display: flex; flex-wrap: nowrap; overflow-x: auto; gap: 6px; }
.archive-inbox-filters > a { flex: 0 0 auto; white-space: nowrap; }
.archive-inbox-filters a { min-height: 34px; padding: 0 12px; display: inline-flex; align-items: center; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); background: var(--surface); font-size: 14px; font-weight: 750; }
.archive-inbox-filters a.active { color: var(--primary); border-color: color-mix(in srgb, var(--primary) 50%, var(--line)); background: var(--primary-soft); }
.archive-candidate-list, .archive-job-list { min-width: 0; max-width: 100%; display: grid; gap: 12px; }
.archive-candidate-card { min-width: 0; padding: 15px; display: grid; grid-template-columns: 62px minmax(0, 1fr) auto; align-items: start; gap: 15px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.archive-candidate-card.is-compact { align-items: center; }
.archive-candidate-poster { width: 62px; aspect-ratio: 2 / 3; overflow: hidden; display: grid; place-items: center; border-radius: 6px; color: var(--primary); background: var(--primary-soft); font-weight: 850; }
.archive-candidate-poster img { width: 100%; height: 100%; object-fit: cover; }
.archive-candidate-main { min-width: 0; }
.archive-candidate-head { display: flex; align-items: flex-start; gap: 10px; }
.archive-candidate-head > div { min-width: 0; }
.archive-candidate-head > .badge { flex: 0 0 auto; margin-top: 1px; }
.archive-candidate-head h2, .archive-job-main h2 { margin: 0; font-size: 15px; }
.archive-candidate-head p, .archive-job-main p { margin: 4px 0 0; color: var(--muted); font-size: 14px; }
.archive-candidate-meta { margin-top: 10px; display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px; }
.archive-candidate-meta code, .archive-job-main > code { min-width: 0; max-width: 100%; overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.archive-job-main > code { width: 100%; display: block; }
.archive-candidate-meta code { max-width: min(620px, 72vw); }
.archive-candidate-meta span { color: var(--muted); font-size: 14px; }
.archive-candidate-meta b { color: var(--text); }
.archive-candidate-detail { margin-top: 11px; border-top: 1px solid var(--line); }
.archive-candidate-detail summary { padding: 10px 0 0; color: var(--primary); cursor: pointer; list-style: none; font-size: 14px; font-weight: 750; }
.archive-candidate-detail summary::-webkit-details-marker { display: none; }
.archive-candidate-detail > div { padding-top: 12px; }
.archive-candidate-detail dl { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 20px; }
.archive-candidate-detail dl > div { min-width: 0; }
.archive-candidate-detail dt { color: var(--muted); font-size: 13px; }
.archive-candidate-detail dd { margin: 3px 0 0; overflow-wrap: anywhere; font-size: 14px; }
.archive-plan-warning { margin: 10px 0; padding: 9px 11px; border-left: 3px solid #e2a323; color: var(--text); background: color-mix(in srgb, #e2a323 10%, var(--surface-soft)); font-size: 14px; line-height: 1.5; }
.archive-plan-warning.compact { width: fit-content; max-width: min(620px, 100%); padding-block: 7px; overflow-wrap: anywhere; }
.archive-plan-steps, .archive-job-steps { margin: 11px 0 0; padding: 0; list-style: none; }
.archive-plan-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 7px; }
.archive-plan-steps li { min-width: 0; padding: 8px; display: grid; grid-template-columns: 19px minmax(0, 1fr); gap: 7px; background: var(--surface-soft); border-radius: 5px; }
.archive-plan-steps li > span { color: var(--primary); font-weight: 850; }
.archive-plan-steps strong, .archive-plan-steps small { display: block; }
.archive-plan-steps strong { font-size: 13px; }
.archive-plan-steps small { margin-top: 2px; overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.archive-candidate-actions { min-width: 0; max-width: 100%; align-self: center; justify-self: end; display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; gap: 8px; }
.archive-candidate-actions form { margin: 0; }
.archive-candidate-actions .button { min-height: 44px; padding-inline: 18px; border-radius: 8px; white-space: nowrap; font-size: 14px; }
.archive-candidate-delete { position: relative; }
.archive-candidate-delete > summary { cursor: pointer; list-style: none; }
.archive-candidate-delete > summary::-webkit-details-marker { display: none; }
.archive-candidate-delete[open] > summary { color: var(--primary); border-color: color-mix(in srgb, var(--primary) 45%, var(--line)); }
.archive-candidate-delete-menu { position: absolute; z-index: 20; top: calc(100% + 7px); right: 0; width: 268px; padding: 6px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); box-shadow: 0 14px 38px rgba(0, 0, 0, .24); }
.archive-candidate-delete-menu form + form { border-top: 1px solid var(--line); }
.archive-candidate-delete-menu button { width: 100%; padding: 10px; display: grid; gap: 3px; border: 0; border-radius: 5px; color: var(--text); background: transparent; text-align: left; cursor: pointer; }
.archive-candidate-delete-menu button:hover { background: var(--surface-soft); }
.archive-candidate-delete-menu button.danger strong { color: #d85d62; }
.archive-candidate-delete-menu small { color: var(--muted); font-size: 13px; line-height: 1.45; }
@media (max-width: 480px) {
  .archive-candidate-actions { width: 100%; gap: 5px; }
  .archive-candidate-actions > form, .archive-candidate-actions > details { min-width: 0; flex: 1 1 0; }
  .archive-candidate-card .archive-candidate-actions .button { width: 100%; padding-inline: 4px; gap: 4px; font-size: 12px; }
}
@media (max-width: 1100px) {
  .archive-candidate-card { grid-template-columns: 62px minmax(0, 1fr); }
  .archive-candidate-actions { grid-column: 2; justify-self: center; }
}
.archive-job-card { min-width: 0; padding: 15px; display: grid; grid-template-columns: 112px minmax(0, 1fr) auto; align-items: start; gap: 16px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.archive-job-state { display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: 14px; }
.archive-job-state > span { width: 9px; height: 9px; border-radius: 50%; background: #a7b0bd; }
.archive-job-state.processing > span { background: var(--primary); box-shadow: 0 0 0 4px var(--primary-soft); }
.archive-job-state.completed > span, .archive-job-state.completed_with_warnings > span { background: #39a76b; }
.archive-job-state.failed > span { background: #d85d62; }
.archive-job-main { min-width: 0; max-width: 100%; overflow: hidden; }
.archive-job-main > * { min-width: 0; max-width: 100%; }
.archive-job-progress { height: 5px; margin: 11px 0 8px; overflow: hidden; border-radius: 3px; background: var(--surface-soft); }
.archive-job-progress i { height: 100%; display: block; background: var(--primary); }
.archive-job-steps { display: flex; flex-wrap: wrap; gap: 6px 12px; }
.archive-job-steps li { display: flex; align-items: center; gap: 5px; color: var(--muted); font-size: 13px; }
.archive-job-steps li > span { width: 7px; height: 7px; border-radius: 50%; background: #a7b0bd; }
.archive-job-steps li.completed > span { background: #39a76b; }
.archive-job-steps li.processing > span { background: var(--primary); }
.archive-job-steps li.failed > span, .archive-job-steps li.warning > span { background: #d89b2d; }
.archive-path-mapping { margin: 0 0 16px; padding: 15px; border: 1px dashed var(--line); border-radius: 8px; background: var(--surface-soft); }
.archive-path-mapping > div:first-child { margin-bottom: 12px; }
.archive-path-mapping strong, .archive-path-mapping small { display: block; }
.archive-path-mapping small { margin-top: 3px; color: var(--muted); line-height: 1.5; }
.archive-safety-section { border-color: color-mix(in srgb, var(--primary) 32%, var(--line)); }
.archive-safety-fields { margin-top: 14px; }
.archive-instant-mode { min-height: 44px; padding: 9px 12px; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 3px 9px; border: 1px solid color-mix(in srgb, var(--success) 35%, var(--line)); border-radius: 8px; background: color-mix(in srgb, var(--success) 7%, var(--surface)); }
.archive-instant-mode::before { width: 8px; height: 8px; grid-row: 1 / 3; border-radius: 50%; background: var(--success); box-shadow: 0 0 0 4px color-mix(in srgb, var(--success) 14%, transparent); content: ''; }
.archive-instant-mode strong { font-size: 14px; }
.archive-instant-mode span { color: var(--muted); font-size: 13px; line-height: 1.45; }
.archive-task-paths { display: flex; flex-wrap: wrap; gap: 7px 16px; color: var(--muted); font-size: 13px; }
.archive-task-paths code { margin-left: 4px; color: var(--text); overflow-wrap: anywhere; }
.archive-policy-navigation { margin: 0 0 20px; padding: 6px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; border: 1px solid var(--line); border-radius: 10px; background: color-mix(in srgb, var(--surface-soft) 76%, transparent); }
.archive-policy-navigation a { min-width: 0; min-height: 62px; padding: 10px 12px; display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: 10px; border: 1px solid transparent; border-radius: 7px; color: var(--text); }
.archive-policy-navigation a:hover { border-color: color-mix(in srgb, var(--primary) 24%, var(--line)); background: var(--surface); }
.archive-policy-navigation a.active { border-color: color-mix(in srgb, var(--primary) 42%, var(--line)); background: color-mix(in srgb, var(--primary-soft) 72%, var(--surface)); }
.archive-policy-navigation a > span:first-child { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 8px; color: var(--primary); background: var(--primary-soft); }
.archive-policy-navigation a > span:nth-child(2) { min-width: 0; display: grid; gap: 3px; }
.archive-policy-navigation strong, .archive-policy-navigation small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.archive-policy-navigation strong { font-size: 14px; }
.archive-policy-navigation small { color: var(--muted); font-size: 12px; }
.archive-policy-navigation em { min-width: 26px; padding: 3px 7px; border-radius: 999px; color: var(--muted); background: var(--surface); font-size: 12px; font-style: normal; font-weight: 800; text-align: center; }
.archive-history { margin-top: 28px; }
.archive-history-entry { border-bottom: 1px solid var(--line); }
.archive-delivery-stages { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; margin-block: 12px; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; }
.archive-history-entry > .archive-delivery-stages { margin: 0 14px 14px 55px; }
.archive-delivery-stage { min-width: 0; padding: 10px 12px; border-inline-end: 1px solid var(--line); }
.archive-delivery-stage:last-child { border-inline-end: 0; }
.archive-delivery-stage > div { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px; font-size: 12px; }
.archive-delivery-stage strong { font-size: 12px; }
.archive-delivery-stage span { color: var(--muted); font-size: 12px; }
.archive-delivery-stage[data-stage-state="completed"] span { color: #24926c; }
.archive-delivery-stage[data-stage-state="failed"] span { color: #d45656; }
.archive-delivery-stage[data-stage-state="processing"] span { color: #358ac7; }
.archive-delivery-stage small { display: block; margin-top: 6px; color: var(--muted); font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
.archive-delivery-stage form { margin-top: 8px; }
.archive-delivery-stage .button { min-height: 32px; padding: 5px 8px; font-size: 12px; }
@media (max-width: 600px) {
  .archive-delivery-stages { grid-template-columns: minmax(0, 1fr); }
  .archive-history-entry > .archive-delivery-stages { margin-left: 14px; }
  .archive-delivery-stage { border-inline-end: 0; border-bottom: 1px solid var(--line); }
  .archive-delivery-stage:last-child { border-bottom: 0; }
}
.archive-history-entry > .archive-episode-details { margin: 0 14px 14px 55px; }
.archive-history-row { min-height: 64px; padding: 11px 14px; display: grid; grid-template-columns: 30px minmax(0, 1fr) auto 36px; align-items: center; gap: 11px; }
.archive-history-state { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; color: white; font-weight: 900; }
.archive-history-state.success { background: var(--success); }
.archive-history-state.error { background: var(--danger); }
.archive-history-state.pending { background: var(--primary); }
.archive-history-state.unknown { background: var(--muted); }
.archive-history-row div { min-width: 0; display: grid; gap: 3px; }
.archive-history-row strong, .archive-history-row small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.archive-history-row small, .archive-history-row time { color: var(--muted); font-size: 13px; }
.archive-history-name { max-width: 100%; overflow: hidden; padding: 0; border: 0; color: var(--text); background: transparent; font: inherit; font-weight: 800; text-align: left; text-overflow: ellipsis; white-space: nowrap; cursor: pointer; }
.archive-history-name:hover, .archive-history-name:focus-visible { color: var(--primary); outline: none; }
.archive-history-more { width: 34px; height: 34px; font-size: 14px; letter-spacing: 0; }
.archive-episode-details { margin-top: 14px; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.archive-episode-details > summary { min-height: 50px; padding: 10px 14px; display: grid; grid-template-columns: minmax(0, 1fr) auto 22px; align-items: center; gap: 10px; cursor: pointer; list-style: none; }
.archive-episode-details > summary::-webkit-details-marker { display: none; }
.archive-episode-details > summary span { font-size: 14px; font-weight: 800; }
.archive-episode-details > summary small { color: var(--muted); font-size: 13px; }
.archive-episode-details > summary i { color: var(--muted); font-style: normal; font-size: 18px; text-align: center; transform: rotate(90deg); transition: transform .18s ease; }
.archive-episode-details:not([open]) > summary i { transform: none; }
.archive-episode-details ol { max-height: 430px; margin: 0; padding: 0; overflow: auto; border-top: 1px solid var(--line); list-style: none; }
.archive-episode-item { min-height: 54px; padding: 9px 14px; display: grid; grid-template-columns: 9px minmax(0, 1fr) auto auto; align-items: center; gap: 11px; border-bottom: 1px solid var(--line); }
.archive-episode-item:last-child { border-bottom: 0; }
.archive-episode-state { width: 8px; height: 8px; border-radius: 50%; background: var(--muted); }
.archive-episode-item.completed .archive-episode-state, .archive-episode-item.recognized .archive-episode-state { background: var(--success); }
.archive-episode-item.failed .archive-episode-state { background: var(--danger); }
.archive-episode-item.needs-review .archive-episode-state { background: #d89121; }
.archive-episode-item.processing .archive-episode-state { background: var(--primary); }
.archive-episode-copy { min-width: 0; display: grid; gap: 3px; }
.archive-episode-copy strong, .archive-episode-copy small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.archive-episode-copy strong { font-size: 14px; }
.archive-episode-copy small { color: var(--muted); font-size: 13px; }
.archive-episode-item > b { color: var(--muted); font-size: 13px; font-weight: 700; }
.archive-episode-item.completed > b, .archive-episode-item.recognized > b { color: var(--success); }
.archive-episode-item.failed > b { color: var(--danger); }
.archive-episode-item.needs-review > b { color: #d89121; }
.archive-episode-correction { margin-top: 7px; display: flex; flex-wrap: wrap; align-items: end; gap: 8px; }
.archive-episode-correction label { display: flex; align-items: center; gap: 5px; color: var(--muted); font-size: 13px; }
.archive-episode-correction input { width: 68px; min-height: 34px; height: 34px; padding: 5px 8px; }
.archive-episode-correction .button { min-height: 34px; height: 34px; padding: 0 13px; }
.archive-episode-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.archive-episode-action { min-height: 30px; padding: 0 9px; border: 1px solid var(--line-strong); border-radius: 6px; background: transparent; color: var(--muted); font: inherit; font-size: 13px; cursor: pointer; }
.archive-episode-action.primary { border-color: color-mix(in srgb, var(--primary) 55%, var(--line)); color: var(--primary); }
.archive-episode-action:hover { border-color: var(--primary); color: var(--text); }
.archive-episode-identify-dialog { width: min(560px, calc(100vw - 32px)); }
.archive-episode-identify-body { display: grid; gap: 14px; padding: 18px 22px; }
.archive-history-actions-dialog { width: min(430px, calc(100vw - 28px)); }
.archive-history-action-list { padding: 18px 22px 4px; display: grid; gap: 9px; }
.archive-history-action-list form { margin: 0; }
.archive-history-action { width: 100%; min-height: 44px; display: flex; align-items: center; justify-content: flex-start; padding-inline: 16px; border-radius: 8px; font-weight: 750; }
.archive-history-action.primary { color: var(--primary); border-color: color-mix(in srgb, var(--primary) 32%, var(--line)); background: var(--primary-soft); }
.archive-history-action.secondary { color: var(--text); border-color: var(--line); background: var(--surface-soft); }
.archive-history-action.warning { color: #d89121; border-color: color-mix(in srgb, #d89121 28%, var(--line)); background: color-mix(in srgb, #d89121 10%, var(--surface)); }
.archive-history-action.danger { color: var(--danger); border-color: color-mix(in srgb, var(--danger) 32%, var(--line)); background: color-mix(in srgb, var(--danger) 9%, var(--surface)); }
.archive-history-action:hover { transform: translateY(-1px); }
.archive-manual-identify-dialog { width: min(540px, calc(100vw - 28px)); }
.archive-manual-identify-dialog form { margin: 0; }
.archive-manual-identify-body { padding: 20px 22px 6px; display: grid; gap: 20px; }
.archive-media-type-choice { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.archive-media-type-choice label { min-width: 0; cursor: pointer; }
.archive-media-type-choice input { position: absolute; opacity: 0; pointer-events: none; }
.archive-media-type-choice span { min-height: 68px; padding: 12px 14px; display: grid; align-content: center; gap: 4px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); transition: border-color .2s ease, background .2s ease, box-shadow .2s ease; }
.archive-media-type-choice b { color: var(--text); font-size: 14px; }
.archive-media-type-choice small { color: var(--muted); font-size: 13px; }
.archive-media-type-choice input:checked + span { border-color: var(--primary); background: var(--primary-soft); box-shadow: 0 0 0 1px color-mix(in srgb, var(--primary) 25%, transparent); }
.archive-media-type-choice input:checked + span b { color: var(--primary); }
.archive-candidate-identify-dialog { width: min(440px, calc(100vw - 28px)); }
.archive-candidate-identify-dialog form { margin: 0; }
.archive-candidate-identify-body { padding: 16px 20px 4px; display: grid; gap: 14px; }
.manual-tmdb-input { position: relative; min-width: 0; }
.manual-tmdb-input input { width: 100%; padding-right: 52px; }
.manual-tmdb-input .icon-command { position: absolute; top: 4px; right: 4px; width: 38px; height: calc(100% - 8px); display: grid; place-items: center; border: 0; border-radius: 6px; color: var(--muted); background: transparent; }
.manual-tmdb-input .icon-command:hover, .manual-tmdb-input .icon-command:focus-visible { color: var(--primary); background: var(--primary-soft); }
.manual-tmdb-input .ui-icon { width: 19px; height: 19px; }
.manual-episode-fields { gap: 12px; }
.manual-episode-fields[hidden] { display: none; }
.manual-episode-fields > .help { grid-column: 1 / -1; }
.manual-tmdb-search-dialog { width: min(720px, calc(100vw - 28px)); height: min(740px, calc(100dvh - 28px)); }
.manual-tmdb-search-dialog > form { flex: 0 0 auto; padding: 16px 20px 10px; }
.manual-tmdb-search-controls { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
.manual-tmdb-search-controls input { min-width: 0; }
.manual-tmdb-results { min-height: 0; padding: 8px 20px 20px; flex: 1 1 auto; overflow-y: auto; color: var(--muted); }
.manual-tmdb-result { width: 100%; min-height: 104px; padding: 12px 0; display: grid; grid-template-columns: 58px minmax(0, 1fr); align-items: start; gap: 16px; border: 0; border-bottom: 1px solid var(--line); color: var(--text); background: transparent; text-align: left; cursor: pointer; }
.manual-tmdb-result:hover, .manual-tmdb-result:focus-visible { background: var(--primary-soft); outline: 0; }
.manual-tmdb-poster { width: 58px; aspect-ratio: 2 / 3; display: grid; place-items: center; overflow: hidden; border-radius: 5px; color: var(--primary); background: var(--surface-soft); }
.manual-tmdb-poster img { width: 100%; height: 100%; object-fit: cover; }
.manual-tmdb-result-copy { min-width: 0; display: grid; gap: 5px; }
.manual-tmdb-result-copy strong { font-size: 15px; }
.manual-tmdb-result-copy small { color: var(--muted); font-size: 13px; line-height: 1.4; }
.manual-tmdb-result-copy small:last-child { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.one15-manual-identify-dialog { width: min(480px, calc(100vw - 28px)); }
.one15-manual-identify-dialog form { margin: 0; }
@media (max-width: 520px) {
  .manual-tmdb-search-dialog > form, .manual-tmdb-results { padding-inline: 14px; }
  .manual-tmdb-search-controls { grid-template-columns: minmax(0, 1fr); }
  .manual-tmdb-result { gap: 11px; }
}
.archive-media-type-choice.compact span { min-height: 44px; padding: 9px 12px; text-align: center; }
.strm-pagination { padding: 8px 4px 0; }

.archive-editor-head { margin-bottom: 20px; display: flex; align-items: center; gap: 13px; }
.archive-editor-head h2 { margin: 0 0 3px; font-size: 21px; }
.archive-editor-head p { margin: 0; color: var(--muted); font-size: 14px; }
.archive-editor { overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); box-shadow: var(--shadow); }
.archive-editor-section { padding: 24px; border-bottom: 1px solid var(--line); }
.archive-editor-section.compact { padding-bottom: 18px; }
.archive-rule-basics { align-items: start; }
.archive-rule-basics .field { min-width: 0; grid-template-rows: auto 46px minmax(17px, auto); }
.archive-rule-basics input, .archive-rule-basics select { height: 46px; min-height: 46px; padding-inline: 14px; border-radius: 9px; }
.archive-rule-basics .help { min-height: 17px; }
.archive-field-placeholder { visibility: hidden; user-select: none; }
.archive-editor-title { margin-bottom: 20px; display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 13px; }
.archive-editor-title > span { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 9px; color: white; background: var(--primary); font-weight: 900; }
.archive-editor-title h2 { margin: 0 0 4px; font-size: 18px; }
.archive-editor-title p { margin: 0; color: var(--muted); font-size: 14px; }
.archive-toggle { min-height: 58px; }
.archive-config-panel { padding-top: 18px; padding-bottom: 18px; }
.archive-config-title { margin-bottom: 0; grid-template-columns: minmax(0, 1fr) auto; }
.archive-config-heading { min-width: 0; padding: 0; display: grid; grid-template-columns: 44px minmax(0, 1fr) 28px; align-items: center; gap: 13px; border: 0; color: inherit; background: transparent; text-align: left; cursor: pointer; }
.archive-config-icon { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 9px; color: white; background: var(--primary); font-weight: 900; }
.archive-config-copy { min-width: 0; display: grid; gap: 4px; }
.archive-config-copy strong { font-size: 18px; }
.archive-config-copy small { color: var(--muted); font-size: 14px; }
.archive-config-chevron { width: 28px; height: 28px; display: grid; place-items: center; color: var(--muted); font-size: 20px; transition: transform .18s ease, color .18s ease; }
.archive-config-heading:hover .archive-config-chevron { color: var(--primary); }
.archive-config-heading:focus-visible { outline: 2px solid var(--primary); outline-offset: 5px; border-radius: 5px; }
.archive-config-panel.is-collapsed .archive-config-chevron { transform: rotate(-90deg); }
.archive-config-body { padding-top: 20px; }
.archive-config-body[hidden] { display: none !important; }
.archive-naming-block { padding: 20px 0 4px; border-top: 1px solid var(--line); }
.archive-naming-block + .archive-naming-block { margin-top: 20px; }
.archive-subsection-head { margin-bottom: 16px; display: flex; align-items: center; gap: 11px; }
.archive-subsection-head > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 7px; color: var(--primary); background: var(--primary-soft); font-size: 14px; font-weight: 900; }
.archive-subsection-head h3 { margin: 0 0 3px; font-size: 15px; }
.archive-subsection-head p { margin: 0; color: var(--muted); font-size: 13px; }
.archive-category-rules { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--line); }
.archive-category-rules .archive-subsection-head > div { min-width: 0; flex: 1; }
.archive-category-rules .archive-subsection-head > button { margin-left: auto; white-space: nowrap; }
.archive-template-preview { margin-top: 15px; padding: 13px 15px; display: grid; gap: 6px; border-left: 3px solid var(--primary); background: var(--surface-soft); }
.archive-template-preview span { color: var(--muted); font-size: 13px; }
.archive-template-preview strong { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 14px; font-weight: 600; overflow-wrap: anywhere; }
.archive-custom-template { margin-top: 3px; }
.archive-custom-template[hidden] { display: none !important; }
.archive-path-rules { display: grid; gap: 12px; }
.archive-path-rule { min-width: 0; padding: 17px; display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; align-items: end; gap: 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.archive-path-rule.has-style { grid-template-columns: 32px minmax(180px, .9fr) minmax(220px, 1.1fr) auto; }
.archive-path-rule-order { align-self: center; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--primary); font-size: 14px; font-weight: 900; }
.archive-path-rule .field { min-width: 0; }
.archive-path-rule [data-path-rule-style-field][hidden] { display: none; }
.archive-path-rule-actions { display: flex; align-items: center; gap: 6px; }
.archive-path-rule-actions .icon-command { width: 34px; height: 34px; }
.archive-path-rule > p { grid-column: 2 / -1; margin: -2px 0 0; padding-left: 10px; border-left: 2px solid color-mix(in srgb, var(--primary) 48%, var(--line)); color: var(--muted); font-size: 13px; }
.archive-path-preview { margin-top: 14px; padding: 13px 15px; display: grid; gap: 6px; border: 1px dashed color-mix(in srgb, var(--primary) 42%, var(--line)); border-radius: 8px; background: var(--primary-soft); }
.archive-path-preview span { color: var(--muted); font-size: 13px; }
.archive-path-preview strong { color: var(--text); font: 14px/1.55 ui-monospace, SFMono-Regular, Consolas, monospace; overflow-wrap: anywhere; }
.archive-yaml { width: 100%; min-height: 460px; padding: 17px; resize: vertical; border: 1px solid var(--line); border-radius: 8px; color: var(--text); background: var(--surface-soft); font: 14px/1.65 ui-monospace, SFMono-Regular, Consolas, monospace; }
.archive-rule-help { margin-top: 14px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.archive-rule-help summary { padding: 11px 13px; cursor: pointer; color: var(--text); font-size: 14px; font-weight: 800; }
.archive-rule-help > div { padding: 0 13px 13px; color: var(--muted); font-size: 14px; line-height: 1.7; }
.archive-rule-help p { margin: 0 0 8px; }
.archive-rule-help code { padding: 1px 4px; border-radius: 4px; color: var(--primary); background: var(--primary-soft); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.archive-rule-help pre { margin: 8px 0 0; padding: 10px 12px; overflow-x: auto; border: 1px solid var(--line); border-radius: 6px; color: var(--text); background: var(--surface); font: 14px/1.6 ui-monospace, SFMono-Regular, Consolas, monospace; }
.archive-rule-summary { margin-top: 14px; display: grid; gap: 10px; }
.archive-rule-summary > div { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.archive-rule-summary strong { width: 54px; color: var(--muted); font-size: 14px; }
.archive-rule-summary span { padding: 5px 8px; border-radius: 5px; color: var(--primary); background: var(--primary-soft); font-size: 13px; }
.archive-rule-warning { margin-top: 10px; padding: 9px 11px; border-radius: 7px; color: #9d6712; background: color-mix(in srgb, var(--warning) 13%, var(--surface)); font-size: 14px; }
.archive-editor-actions { padding: 18px 24px; display: flex; justify-content: flex-end; gap: 10px; background: var(--surface-soft); }
.archive-operation-grid { margin-bottom: 18px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.archive-operation-grid-six { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.archive-operation-grid label { position: relative; min-width: 0; min-height: 112px; padding: 16px 18px; display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: center; align-content: center; gap: 12px; border: 1px solid var(--line); border-radius: 9px; cursor: pointer; }
.archive-operation-grid label:has(input:checked) { color: var(--primary); border-color: var(--primary); background: var(--primary-soft); box-shadow: inset 0 0 0 1px var(--primary); }
.archive-operation-grid input { position: absolute; width: 1px; height: 1px; min-height: 1px; margin: 0; opacity: 0; pointer-events: none; }
.archive-operation-grid .archive-choice-icon { position: static; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 8px; color: var(--primary); background: var(--primary-soft); font-weight: 900; }
.archive-operation-grid label > span:last-child { min-width: 0; }
.archive-operation-grid strong { font-size: 15px; line-height: 1.35; }
.archive-operation-grid small { color: var(--muted); line-height: 1.55; overflow-wrap: anywhere; }
.archive-choice-list { display: grid; gap: 10px; }
.archive-monitor-context { margin: 12px 0 16px; }
.archive-monitor-panel { min-width: 0; padding: 14px 16px; display: grid; grid-template-columns: 38px minmax(0, 1fr); align-items: center; gap: 12px; border: 1px solid var(--line); border-radius: 10px; background: color-mix(in srgb, var(--surface-soft) 82%, transparent); }
.archive-monitor-panel[hidden] { display: none; }
.archive-monitor-panel.is-life { border-color: color-mix(in srgb, var(--primary) 25%, var(--line)); background: color-mix(in srgb, var(--primary-soft) 34%, var(--surface)); }
.archive-monitor-panel-icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; color: var(--primary); background: var(--primary-soft); font-size: 13px; font-weight: 900; }
.archive-monitor-panel > div { min-width: 0; }
.archive-monitor-panel strong, .archive-monitor-panel small { display: block; }
.archive-monitor-panel small { margin-top: 4px; color: var(--muted); font-size: 14px; line-height: 1.55; }
.archive-webhook-panel { grid-template-columns: 38px minmax(260px, .9fr) minmax(340px, 1.1fr); }
.archive-webhook-copy code { padding: 2px 5px; border-radius: 5px; color: var(--primary); background: var(--primary-soft); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.archive-webhook-value { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px; }
.archive-webhook-panel .archive-webhook-value > code { min-width: 0; padding: 9px 11px; overflow: hidden; color: var(--text); border: 1px solid var(--line); border-radius: 7px; background: var(--surface); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; line-height: 1.45; text-overflow: ellipsis; white-space: nowrap; }
.archive-webhook-value .button { min-height: 36px; white-space: nowrap; }
.archive-choice-grid-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.archive-choice-card { position: relative; min-width: 0; min-height: 74px; padding: 14px 18px; display: grid; grid-template-columns: 28px minmax(0, 1fr); align-items: center; gap: 12px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); cursor: pointer; }
.archive-choice-card:has(input:checked) { border-color: var(--primary); background: var(--primary-soft); box-shadow: inset 0 0 0 1px var(--primary); }
.archive-choice-card input { position: absolute; width: 1px; height: 1px; min-height: 1px; margin: 0; opacity: 0; pointer-events: none; }
.archive-choice-card > .archive-choice-icon { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; color: var(--primary); background: var(--primary-soft); font-weight: 900; }
.archive-choice-card > span:last-child { min-width: 0; }
.archive-choice-card strong, .archive-choice-card small { display: block; }
.archive-choice-card strong { font-size: 15px; }
.archive-choice-card small { margin-top: 3px; color: var(--muted); line-height: 1.5; }
.archive-check-row { min-height: 52px; padding: 12px 14px; display: flex; align-items: flex-start; gap: 12px; border-bottom: 1px solid var(--line); cursor: pointer; }
.archive-check-row:last-child { border-bottom: 0; }
.archive-check-row input { position: absolute; width: 1px; height: 1px; min-height: 1px; margin: 0; opacity: 0; pointer-events: none; }
.archive-check-mark { width: 22px; height: 22px; flex: 0 0 22px; display: grid; place-items: center; border: 2px solid var(--muted); border-radius: 4px; color: transparent; font-size: 14px; font-weight: 900; }
.archive-check-row input:checked + .archive-check-mark { border-color: var(--primary); color: white; background: var(--primary); }
.archive-check-row strong, .archive-check-row small { display: block; }
.archive-check-row strong { font-size: 14px; }
.archive-check-row small { margin-top: 3px; color: var(--muted); line-height: 1.5; }
.archive-setting-list { margin: 0 0 17px; border: 1px solid var(--line); border-radius: 9px; overflow: hidden; background: var(--surface-soft); }
.archive-task-panel { margin: 12px 0; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); overflow: hidden; }
.archive-task-panel > summary { min-height: 60px; padding: 12px 15px; display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: center; gap: 12px; cursor: pointer; list-style: none; }
.archive-task-panel > summary::-webkit-details-marker { display: none; }
.archive-task-panel > summary > span:nth-child(2) strong, .archive-task-panel > summary > span:nth-child(2) small { display: block; }
.archive-task-panel > summary > span:nth-child(2) small { margin-top: 3px; color: var(--muted); }
.archive-panel-icon { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 7px; color: var(--primary); background: var(--primary-soft); font-weight: 900; }
.archive-task-panel > summary > b { color: var(--muted); font-size: 18px; }
.archive-task-panel[open] > summary > b { transform: rotate(180deg); }
.archive-task-panel-body { padding: 0 15px 15px; border-top: 1px solid var(--line); }
.archive-inline-row { display: flex; align-items: flex-end; gap: 16px; padding: 15px 0 6px; }
.archive-inline-row .field { width: min(300px, 100%); }
.archive-asset-group { padding: 14px 0 4px; border-top: 1px solid var(--line); }
.archive-asset-group h4 { margin: 0 0 10px; font-size: 14px; }
.archive-asset-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px 14px; }
.archive-asset-grid .archive-check-row { min-height: 42px; padding: 8px 0; border-bottom: 0; }
.archive-asset-grid .archive-check-row strong { font-size: 14px; }
.archive-conflict-field { max-width: 360px; }

.main.recommend-main { --recommend-content-width: 1900px; position: relative; padding: var(--page-gutter); overflow: clip; }
.navigation-enter .recommend-main[data-navigation-content] { animation-name: recommendation-content-ready; }
/* Keep fixed mobile filters anchored to the viewport after route transitions. */
@keyframes recommendation-content-ready { from { opacity: .4; } to { opacity: 1; } }
.main.recommend-main .content { max-width: var(--page-content-width); min-height: 100vh; }
.main.recommend-main, .main.recommend-main .content { background: var(--bg); color: var(--text); }
.main.recommend-main .page-head { position: relative; z-index: 4; width: min(100%, var(--recommend-content-width)); margin-inline: auto; color: #fff; }
.main.recommend-main .recommend-page-head { margin-bottom: 0; justify-content: flex-end; }
.main.recommend-main .recommend-page-head > div:first-child { display: none; }
.main.recommend-main .page-description { color: rgba(237,243,255,.72); }
.main.recommend-main .page-head .tool-icon {
  border-color: rgba(255,255,255,.2); color: rgba(255,255,255,.86); background: rgba(7,11,20,.14);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
}
.main.recommend-main .page-head .tool-icon:hover { border-color: rgba(255,255,255,.42); color: #fff; background: rgba(255,255,255,.1); }
.recommend-hero {
  position: relative; width: 100%; min-height: 0; margin: -16px 0 0; isolation: isolate;
  color: #fff;
}
.recommend-hero[data-draggable="true"] > .recommend-hero-copy { cursor: grab; user-select: none; touch-action: pan-y pinch-zoom; }
.recommend-hero.is-dragging > .recommend-hero-copy { cursor: grabbing; }
.recommend-hero-layers {
  position: absolute; top: calc(-82px - var(--page-gutter)); right: calc(var(--page-gutter) * -1); bottom: 0; left: calc(var(--page-gutter) * -1);
  z-index: -1; overflow: hidden; background: var(--feature-hero-background);
}
.recommend-hero-layer {
  position: absolute; inset: -3%; width: 106%; height: 106%; display: block; object-fit: cover; opacity: 0;
  filter: saturate(.88) contrast(1.02); transform: scale(1.015); transition: opacity 1.2s ease-in-out, transform 8s linear; will-change: opacity, transform;
}
.recommend-hero-layer.is-active { opacity: 1; transform: scale(1.055); }
.recommend-hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(7,11,20,.26) 0%, rgba(7,11,20,.18) 18%, rgba(7,11,20,.28) 38%, rgba(7,11,20,.54) 58%, rgba(7,11,20,.8) 76%, rgba(7,11,20,.95) 90%, var(--bg) 100%), linear-gradient(90deg, rgba(7,11,20,.76), rgba(7,11,20,.14) 64%, rgba(7,11,20,.38));
}
.recommend-hero-copy { position: relative; z-index: 1; width: min(100%, var(--recommend-content-width)); min-height: clamp(220px, 29vh, 320px); margin-inline: auto; padding: 0 0 44px; display: flex; flex-direction: column; justify-content: flex-end; }
.recommend-hero-copy > span { color: rgba(220,230,255,.72); font-size: 14px; font-weight: 850; letter-spacing: .18em; }
.recommend-hero-copy h2 { margin: 6px 0 3px; color: #fff; font-size: clamp(24px, 3vw, 36px); line-height: 1.08; }
.recommend-hero-copy p { max-width: 560px; margin: 0; color: rgba(237,243,255,.78); font-size: 14px; line-height: 1.6; }
.recommend-console {
  position: relative; width: 100%; min-height: calc(100vh - 104px); margin: 0; padding: 22px 0 34px; display: grid; align-content: start; gap: 18px;
  background: var(--bg);
}
.recommend-source-tabs, .recommend-search, .recommend-filter-panel { width: min(100%, var(--recommend-content-width)); margin-inline: auto; }
.recommend-source-tabs { display: flex; align-items: center; gap: 22px; padding: 0 0 8px; border-bottom: 1px solid var(--line); }
.recommend-source-tabs a { min-height: 42px; padding: 0 14px; display: inline-flex; align-items: center; border-bottom: 3px solid transparent; color: var(--muted); font-weight: 800; }
.recommend-source-tabs a:hover, .recommend-source-tabs a.active { color: var(--primary); border-bottom-color: var(--primary); }
.recommend-search { display: grid; grid-template-columns: minmax(0, 1fr) auto auto auto; align-items: center; gap: 10px; }
.recommend-search > input[type="search"] { min-width: 0; width: 100%; }
.recommend-shortcuts { display: flex; align-items: center; gap: 10px; white-space: nowrap; }
.recommend-shortcuts > .button { flex-shrink: 0; }
.recommend-mobile-filter-bar, .recommend-filter-sheet-head, .recommend-filter-scrim, .recommend-filter-group-label { display: none; }
.recommendation-subscription-library { gap: 6px; white-space: nowrap; }
.recommendation-subscription-library.active { color: #fff; border-color: var(--primary); background: var(--primary); }
.recommend-filter-panel { position: relative; z-index: 1; display: grid; gap: 0; padding: 3px 0 18px; }
@media (min-width: 721px) {
  .recommend-hero > .recommend-filter-panel { height: 310px; overflow-y: auto; align-content: start; scrollbar-width: thin; }
}
.recommend-filter-panel > div { display: grid; grid-template-columns: 72px minmax(0, 1fr); align-items: start; gap: 12px; min-height: 34px; padding: 0; }
.recommend-filter-panel > div > div { display: flex; flex-wrap: wrap; align-items: center; gap: 0 18px; }
.recommend-filter-panel a {
  min-height: 28px; padding: 0; display: inline-flex; align-items: center; gap: 6px; color: rgba(229,236,250,.7); background: transparent; border: 0; border-radius: 0; font-size: 14px; font-weight: 650; white-space: nowrap;
}
.recommend-filter-panel a:hover, .recommend-filter-panel a.active { color: #fff; font-weight: 900; }
.recommend-filter-panel a span { display: none; }
.recommend-filter-panel > div > .recommend-filter-default { width: max-content; min-height: 28px; padding: 0 8px; border-left: 2px solid transparent; border-radius: 6px; color: rgba(245,248,255,.82); font-weight: 850; }
.recommend-filter-panel > div > .recommend-filter-default:hover { background: rgba(255,255,255,.07); }
.recommend-filter-panel > div > .recommend-filter-default.active { border-left-color: var(--primary); color: #fff; background: color-mix(in srgb, var(--primary) 18%, transparent); }
.recommend-channel-row { margin-top: 2px; padding: 4px 0 !important; }
.recommend-no-channels { color: rgba(229,236,250,.58); font-size: 14px; }
.recommend-status-line { width: 100%; min-height: 40px; margin-inline: 0; display: flex; align-items: center; flex-wrap: wrap; gap: 10px; color: var(--muted); font-size: 14px; }
.recommend-status-line span { padding: 7px 11px; border-radius: 99px; background: color-mix(in srgb, var(--surface) 86%, var(--primary-soft)); border: 1px solid color-mix(in srgb, var(--line) 70%, transparent); }
.recommend-results { width: min(100%, var(--recommend-content-width)); margin-inline: auto; display: grid; align-content: start; gap: 18px; overflow: visible; }
.recommend-feed-footer { min-height: 64px; display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 12px; color: var(--muted); font-size: 13px; }
.recommend-feed-footer > [role="status"] { max-width: 100%; overflow-wrap: anywhere; }
.recommend-feed-footer > button[hidden] { display: none !important; }
.recommend-feed-footer.is-loading::before { content: ""; width: 16px; height: 16px; border: 2px solid var(--line); border-top-color: var(--primary); border-radius: 50%; animation: navigation-loading-spin .8s linear infinite; }
@media (prefers-reduced-motion: reduce) { .recommend-feed-footer.is-loading::before { animation: none; } }
.recommend-grid {
  display: grid;
  width: 100%;
  min-width: 0;
  grid-template-columns: repeat(10, minmax(0, 1fr));
  justify-content: center;
  gap: clamp(20px, 1.25vw, 28px) clamp(10px, .85vw, 18px);
}
.recommend-results > .pagination-row { min-height: 42px; margin-top: 0; }
.recommend-card { width: 100%; max-width: 260px; min-width: 0; position: relative; justify-self: center; }
.recommend-provider-tabs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: stretch; gap: 12px; width: min(100%, 324px); min-width: 0; margin: 0 0 6px; padding: 0; border: 0; border-radius: 0; background: transparent; }
.recommend-provider-tabs a, .recommend-filter-panel .recommend-provider-tabs a { display: flex; align-items: center; justify-content: center; min-width: 0; min-height: 28px; padding: 4px 6px; border: 0; border-left: 2px solid transparent; border-radius: 6px; color: var(--muted); font-size: 13px; font-weight: 600; line-height: 20px; white-space: nowrap; text-decoration: none; }
.recommend-provider-tabs a:hover { color: var(--text); background: color-mix(in srgb, var(--text) 6%, transparent); }
.recommend-provider-tabs a.active, .recommend-filter-panel .recommend-provider-tabs a.active { color: var(--text); border-left-color: var(--primary); background: color-mix(in srgb, var(--primary) 18%, transparent); font-weight: 700; }
.recommend-provider-tabs a:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.provider-recommendations { max-width: 1560px; margin-inline: auto; min-width: 0; }
.provider-page-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-block: 12px; }
.provider-page-heading h1 { margin: 0; font-size: 24px; }
.provider-filters { padding: 0 0 16px; border-bottom: 1px solid var(--line); }
.provider-filter-row { display: flex; align-items: flex-start; gap: 16px; padding-block: 4px; }
.provider-filter-row > span { flex: 0 0 56px; font-size: 13px; color: var(--muted); line-height: 32px; }
.provider-filter-row > div { display: flex; flex-wrap: wrap; gap: 6px 12px; min-width: 0; }
.provider-filter-row a { display: inline-flex; align-items: center; min-height: 32px; padding: 4px 10px; font-size: 14px; text-decoration: none; color: var(--muted); border-radius: 6px; }
.provider-filter-row a.active { background: var(--primary-soft); color: var(--primary); font-weight: 700; }
.provider-detail-dialog { width: min(680px, calc(100vw - 24px)); }
.provider-detail-content { display: grid; grid-template-columns: minmax(0, 160px) minmax(0, 1fr); gap: 20px; padding: 20px; }
.provider-detail-content > img { width: 100%; aspect-ratio: 2 / 3; object-fit: cover; border-radius: 6px; }
.provider-detail-content > div { min-width: 0; overflow-wrap: anywhere; }
.provider-detail-content p { white-space: pre-line; line-height: 1.7; }
.provider-detail-content:has(> img[hidden]) { grid-template-columns: 1fr; }
.member-provider-navigation { position: relative; z-index: 4; margin-block: 12px 64px; }
@media (max-width: 600px) {
  .recommend-provider-tabs { max-width: 100%; gap: 8px; }
  .recommend-provider-tabs a { padding-inline: 4px; }
  .provider-filter-row { gap: 6px; }
  .provider-filter-row > span { flex-basis: 38px; }
  .provider-detail-content { grid-template-columns: 90px minmax(0, 1fr); gap: 12px; padding: 14px; }
  .provider-detail-dialog .dialog-actions { flex-wrap: wrap; }
}
.recommend-card-button { width: 100%; padding: 0; display: block; border: 0; color: inherit; background: transparent; font: inherit; text-align: inherit; cursor: pointer; }
.recommend-card-button:focus-visible { outline: 3px solid color-mix(in srgb, var(--primary) 70%, white); outline-offset: 5px; border-radius: 12px; }
.recommend-poster { position: relative; width: 100%; height: auto; aspect-ratio: 260 / 385; overflow: hidden; isolation: isolate; border-radius: 12px; background: #090d15; box-shadow: 0 10px 24px rgba(0,0,0,.22); }
.recommend-poster img { width: 100%; height: 100%; display: block; object-fit: cover; transform: scale(1.004); transition: transform .28s ease, filter .28s ease; }
.poster-placeholder { width: 100%; height: 100%; background: linear-gradient(90deg, #e7e9ee, #f6f7f9, #e3e5ea); }
.media-kind { position: absolute; left: 7px; top: 8px; min-height: 24px; padding: 0 9px; display: inline-flex; align-items: center; border-radius: 99px; color: white; background: linear-gradient(135deg, #2d7cf6, #5e7cf0); font-size: 14px; font-weight: 850; }
.media-score { position: absolute; right: 7px; top: 8px; min-height: 24px; padding: 0 8px; display: inline-flex; align-items: center; border-radius: 99px; color: white; background: #f3af25; font-size: 14px; font-weight: 850; }
[data-provider-card] .media-kind { top: auto; bottom: 8px; max-width: calc(100% - 14px); min-height: 22px; padding-inline: 7px; overflow: hidden; white-space: nowrap; font-size: 12px; }
.library-check { position: absolute; right: 7px; top: 8px; width: 28px; height: 28px; display: grid; place-items: center; border: 3px solid color-mix(in srgb, white 86%, transparent); border-radius: 50%; color: white; background: #4bd477; font-weight: 900; box-shadow: 0 4px 12px rgba(36,120,68,.28); }
.recommend-card.in-library .media-score { top: 41px; }
.recommend-hover {
  position: absolute; inset: 0; z-index: 4; padding: 15px 12px 13px; display: flex; flex-direction: column; justify-content: flex-end; gap: 7px;
  color: white; background: linear-gradient(180deg, rgba(5,8,14,.08) 12%, rgba(5,8,14,.88) 70%, rgba(5,8,14,.97));
  opacity: 0; transform: translateY(8px); transition: opacity .22s ease, transform .22s ease; pointer-events: none;
}
.recommend-hover strong { overflow: hidden; font-size: 14px; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
.recommend-hover > span { overflow: hidden; display: -webkit-box; color: rgba(255,255,255,.82); font-size: 13px; line-height: 1.5; -webkit-box-orient: vertical; -webkit-line-clamp: 4; }
.recommend-hover em { color: #fff; font-size: 13px; font-style: normal; font-weight: 800; }
.recommend-card-button:hover .recommend-hover, .recommend-card-button:focus-visible .recommend-hover { opacity: 1; transform: translateY(0); }
.recommend-card-button:hover .recommend-poster > img, .recommend-card-button:focus-visible .recommend-poster > img { filter: brightness(.58) saturate(.82); transform: scale(1.045); }
.recommend-card h3 { margin: 10px 0 2px; overflow: hidden; color: var(--text); text-align: center; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
.recommend-card { position: relative; }
.recommend-card:has(> .recommend-menu-button) > .recommend-card-button > p { min-height: 28px; padding: 3px 30px; }
.recommend-menu-button { position: absolute; right: 0; bottom: 0; width: 28px; height: 28px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 6px; background: transparent; color: var(--ui-muted-foreground); cursor: pointer; }
.recommend-menu-button .ui-icon { width: 18px; height: 18px; }
.recommend-menu-button:hover, .recommend-menu-button[aria-expanded="true"] { color: var(--ui-foreground); background: var(--ui-accent); }
.recommend-menu-button:active { background: var(--ui-muted); }
.recommend-menu-button:focus-visible { outline: 2px solid var(--ui-ring-color); outline-offset: 2px; }
.recommend-context-menu[popover] { position: fixed; inset: auto; margin: 0; width: min(224px, calc(100vw - 16px)); max-height: calc(100dvh - 16px); overflow-y: auto; padding: 6px; border: 1px solid var(--ui-border); border-radius: 8px; background: var(--ui-popover); color: var(--ui-popover-foreground); box-shadow: var(--ui-shadow-lg); }
.recommend-context-menu[popover]:not(:popover-open) { display: none; }
.recommend-context-title { padding: 8px 10px 10px; margin-bottom: 4px; border-bottom: 1px solid var(--ui-border); color: var(--ui-muted-foreground); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.recommend-context-menu [role="menuitem"] { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 38px; padding: 8px 10px; border: 0; border-radius: 5px; background: transparent; color: inherit; font: inherit; font-size: 13px; text-align: left; text-decoration: none; cursor: pointer; }
.recommend-context-menu [role="menuitem"] > span { min-width: 0; overflow-wrap: anywhere; }
.recommend-context-menu [role="menuitem"] .ui-icon { flex: 0 0 16px; width: 16px; height: 16px; }
.recommend-context-menu [role="menuitem"]:hover, .recommend-context-menu [role="menuitem"]:focus-visible { outline: none; background: var(--ui-accent); color: var(--ui-accent-foreground); }
.recommend-context-menu [role="menuitem"]:active { background: var(--ui-muted); }
.recommend-context-menu [role="menuitem"].is-danger { color: var(--ui-destructive); }
@media (pointer: coarse) {
  .recommend-card:has(> .recommend-menu-button) > .recommend-card-button > p { min-height: 40px; padding: 10px 40px; }
  .recommend-menu-button { width: 40px; height: 40px; }
  .recommend-context-menu [role="menuitem"] { min-height: 44px; }
}
.recommend-channel-search-button { position: absolute; left: 10px; bottom: 10px; z-index: 5; width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.62); border-radius: 50%; color: #fff; background: rgba(5,8,14,.82); cursor: pointer; opacity: 0; transform: translateY(5px); transition: opacity .18s ease, transform .18s ease, background .18s ease; }
.recommend-card:hover .recommend-channel-search-button, .recommend-card:focus-within .recommend-channel-search-button { opacity: 1; transform: translateY(0); }
.recommend-channel-search-button:hover, .recommend-channel-search-button:focus-visible { background: var(--primary); }
.recommend-channel-search-button span { font-size: 20px; line-height: 1; }
.recommend-subscribe-button { position: absolute; right: 10px; bottom: 10px; z-index: 5; width: 34px; height: 34px; padding: 0; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.62); border-radius: 50%; color: #fff; background: rgba(5,8,14,.82); cursor: pointer; opacity: 0; transform: translateY(5px); transition: opacity .18s ease, transform .18s ease, background .18s ease, box-shadow .18s ease; }
.recommend-card:hover .recommend-subscribe-button, .recommend-card:focus-within .recommend-subscribe-button, .recommend-subscribe-button.active { opacity: 1; transform: translateY(0); }
.recommend-subscribe-button:hover, .recommend-subscribe-button:focus-visible, .recommend-subscribe-button.active { border-color: color-mix(in srgb, var(--primary) 76%, white); background: var(--primary); box-shadow: 0 6px 18px color-mix(in srgb, var(--primary) 38%, transparent); }
.recommend-subscribe-button .ui-icon { width: 17px; height: 17px; }
.recommend-subscription-state { position: absolute; right: 8px; top: 8px; z-index: 3; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 6px; color: var(--ui-primary-foreground); background: var(--ui-primary); }
.recommend-subscription-state .ui-icon { width: 14px; height: 14px; }
.recommend-poster:has(.media-score) .recommend-subscription-state { top: 40px; }
.recommend-card.in-library .recommend-subscription-state { top: 44px; }
.recommend-card.in-library .recommend-poster:has(.media-score) .recommend-subscription-state { top: 73px; }
.recommendation-subscription-dialog { width: min(760px, calc(100vw - 28px)); max-height: min(880px, calc(100dvh - 28px)); overflow: hidden; }
.recommendation-subscription-dialog > form { min-height: 0; display: flex; flex-direction: column; }
.recommendation-subscription-body { padding: 20px 22px; display: grid; gap: 17px; overflow-y: auto; }
.recommendation-subscription-media { min-width: 0; padding: 13px; display: grid; grid-template-columns: 58px minmax(0, 1fr) auto; align-items: center; gap: 13px; border: 1px solid color-mix(in srgb, var(--line) 86%, var(--primary)); border-radius: 14px; background: linear-gradient(135deg, color-mix(in srgb, var(--primary-soft) 48%, var(--surface)), var(--surface)); }
.recommendation-subscription-poster { width: 58px; height: 78px; display: grid; place-items: center; overflow: hidden; border-radius: 9px; color: var(--primary); background: var(--surface-soft); }
.recommendation-subscription-poster img { width: 100%; height: 100%; object-fit: cover; }
.recommendation-subscription-poster .ui-icon { width: 24px; height: 24px; }
.recommendation-subscription-media > div { min-width: 0; }
.recommendation-subscription-media small, .recommendation-subscription-media strong, .recommendation-subscription-media p { display: block; }
.recommendation-subscription-media small { color: var(--primary); font-size: 13px; font-weight: 850; letter-spacing: .08em; }
.recommendation-subscription-media strong { margin-top: 4px; overflow: hidden; color: var(--text); font-size: 17px; text-overflow: ellipsis; white-space: nowrap; }
.recommendation-subscription-media p { margin: 5px 0 0; color: var(--muted); font-size: 14px; }
.recommendation-subscription-badge { padding: 6px 9px; border: 1px solid var(--line); border-radius: 99px; color: var(--muted); background: var(--surface); font-size: 13px; font-weight: 800; white-space: nowrap; }
.recommendation-subscription-badge[data-status="active"], .recommendation-subscription-badge[data-status="matched"] { border-color: color-mix(in srgb, var(--primary) 45%, var(--line)); color: var(--primary); background: var(--primary-soft); }
.recommendation-subscription-badge[data-status="failed"] { color: var(--danger); background: color-mix(in srgb, var(--danger) 8%, var(--surface)); }
.recommendation-subscription-mode { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.recommendation-subscription-mode label { min-width: 0; cursor: pointer; }
.recommendation-subscription-mode input { position: absolute; opacity: 0; pointer-events: none; }
.recommendation-subscription-mode label > span { min-height: 86px; padding: 14px; display: grid; grid-template-columns: 34px minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 11px; align-content: center; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-soft); transition: border-color .18s ease, background .18s ease, box-shadow .18s ease; }
.recommendation-subscription-mode label > span > .ui-icon { width: 22px; height: 22px; grid-row: 1 / 3; align-self: center; justify-self: center; color: var(--primary); }
.recommendation-subscription-mode b, .recommendation-subscription-mode small { min-width: 0; display: block; }
.recommendation-subscription-mode b { color: var(--text); font-size: 14px; }
.recommendation-subscription-mode small { margin-top: 3px; color: var(--muted); font-size: 13px; line-height: 1.45; }
.recommendation-subscription-mode label:has(input:checked) > span { border-color: var(--primary); background: var(--primary-soft); box-shadow: inset 0 0 0 1px var(--primary); }
.recommendation-subscription-tv-policy, .recommendation-subscription-guard { padding: 15px; display: grid; gap: 13px; border: 1px solid color-mix(in srgb, var(--primary) 24%, var(--line)); border-radius: 13px; background: color-mix(in srgb, var(--primary-soft) 35%, var(--surface)); }
.recommendation-subscription-tv-policy[hidden] { display: none; }
.recommendation-subscription-tv-policy > header, .recommendation-subscription-guard > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.recommendation-subscription-tv-policy > header strong, .recommendation-subscription-tv-policy > header small, .recommendation-subscription-guard > header strong, .recommendation-subscription-guard > header small { display: block; }
.recommendation-subscription-tv-policy > header strong, .recommendation-subscription-guard > header strong { color: var(--text); font-size: 14px; }
.recommendation-subscription-tv-policy > header small, .recommendation-subscription-guard > header small { margin-top: 3px; color: var(--muted); font-size: 13px; }
.recommendation-subscription-tv-policy > header > span { padding: 5px 8px; border-radius: 99px; color: var(--primary); background: var(--surface); font-size: 13px; font-weight: 800; }
.recommendation-subscription-scope { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.recommendation-subscription-scope label { min-width: 0; cursor: pointer; }
.recommendation-subscription-scope input { position: absolute; opacity: 0; pointer-events: none; }
.recommendation-subscription-scope span { min-height: 66px; padding: 11px; display: grid; align-content: center; gap: 4px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.recommendation-subscription-scope b, .recommendation-subscription-scope small { display: block; }
.recommendation-subscription-scope b { color: var(--text); font-size: 14px; }
.recommendation-subscription-scope small { color: var(--muted); font-size: 13px; line-height: 1.45; }
.recommendation-subscription-scope label:has(input:checked) span { border-color: var(--primary); background: var(--primary-soft); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary) 50%, transparent); }
.recommendation-subscription-range { display: grid; grid-template-columns: repeat(2, minmax(0, 150px)); gap: 10px; }
.recommendation-subscription-range .field { gap: 5px; }
.recommendation-subscription-scope-note { margin: 0; color: var(--muted); font-size: 13px; }
.recommendation-subscription-guard > header > .ui-icon { width: 21px; height: 21px; color: var(--primary); }
.recommendation-subscription-guard > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.recommendation-subscription-guard label { display: grid; gap: 6px; color: var(--text); font-size: 13px; font-weight: 750; }
.recommendation-subscription-guard p { margin: 0; display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 13px; line-height: 1.5; }
.recommendation-subscription-guard p .ui-icon { width: 14px; height: 14px; flex: 0 0 auto; color: var(--primary); }
.recommendation-subscription-source { padding: 15px; display: grid; gap: 13px; border: 1px solid var(--line); border-radius: 13px; background: color-mix(in srgb, var(--surface-soft) 72%, transparent); }
.recommendation-subscription-source[hidden] { display: none; }
.recommendation-subscription-source > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.recommendation-subscription-source > header strong, .recommendation-subscription-source > header small { display: block; }
.recommendation-subscription-source > header strong { color: var(--text); font-size: 14px; }
.recommendation-subscription-source > header small { margin-top: 3px; color: var(--muted); font-size: 13px; }
.recommendation-subscription-source > header > span { padding: 5px 8px; border-radius: 99px; color: var(--muted); background: var(--surface); font-size: 13px; font-weight: 800; white-space: nowrap; }
.recommendation-subscription-source > header > span.ready { color: #1b9d5b; background: color-mix(in srgb, #2ecb78 12%, var(--surface)); }
.recommendation-subscription-checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.recommendation-subscription-check { min-width: 0; cursor: pointer; }
.recommendation-subscription-check > input { position: absolute; opacity: 0; pointer-events: none; }
.recommendation-subscription-check > span { min-width: 0; min-height: 54px; padding: 9px 10px; display: grid; grid-template-columns: 30px minmax(0, 1fr); align-items: center; gap: 9px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.recommendation-subscription-check img, .recommendation-subscription-check > span > .ui-icon { width: 30px; height: 30px; padding: 5px; object-fit: contain; border-radius: 8px; color: var(--primary); background: var(--primary-soft); }
.recommendation-subscription-check b, .recommendation-subscription-check small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.recommendation-subscription-check b { color: var(--text); font-size: 14px; }
.recommendation-subscription-check small { margin-top: 2px; color: var(--muted); font-size: 13px; }
.recommendation-subscription-check:has(input:checked) > span { border-color: var(--primary); background: var(--primary-soft); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary) 50%, transparent); }
.recommendation-subscription-empty { grid-column: 1 / -1; margin: 0; padding: 12px; color: var(--muted); background: var(--surface); text-align: center; font-size: 13px; }
.recommendation-subscription-auto { min-width: 0; display: grid; grid-template-columns: auto auto minmax(0, 1fr); align-items: center; gap: 10px; cursor: pointer; }
.recommendation-subscription-auto > input { position: absolute; opacity: 0; }
.recommendation-subscription-auto b, .recommendation-subscription-auto small { display: block; }
.recommendation-subscription-auto b { color: var(--text); font-size: 14px; }
.recommendation-subscription-auto small { margin-top: 2px; color: var(--muted); font-size: 13px; }
.recommendation-subscription-runtime { padding: 12px 14px; display: flex; flex-wrap: wrap; gap: 8px 14px; border: 1px solid var(--line); border-radius: 11px; color: var(--muted); background: var(--surface-soft); font-size: 13px; }
.recommendation-subscription-runtime[hidden] { display: none; }
.recommendation-subscription-runtime strong { width: 100%; color: var(--text); }
.recommendation-subscription-runtime .recommendation-subscription-decision { width: 100%; color: var(--primary); }
.recommendation-subscription-runtime em { width: 100%; color: var(--danger); font-style: normal; }
.recommendation-subscription-actions { margin-top: 0; }
.recommendation-subscription-actions .danger { margin-right: auto; color: var(--danger); }
.recommendation-subscription-actions .subscription-delete-button { margin-right: auto; display: inline-flex; align-items: center; gap: 6px; color: #fff; border-color: color-mix(in srgb, var(--danger) 85%, #000); background: var(--danger); }
.recommendation-subscription-actions .subscription-delete-button[hidden] { display: none; }
.recommendation-subscription-actions .subscription-delete-button:hover { color: #fff; background: color-mix(in srgb, var(--danger) 82%, #000); }
.recommendation-subscription-actions .subscription-delete-button .ui-icon { width: 15px; height: 15px; }
@media (max-width: 640px) {
  .recommendation-subscription-dialog { width: calc(100vw - 16px); max-height: calc(100dvh - 16px); }
  .recommendation-subscription-body { padding: 15px; }
  .recommendation-subscription-media { grid-template-columns: 48px minmax(0, 1fr); }
  .recommendation-subscription-poster { width: 48px; height: 66px; }
  .recommendation-subscription-badge { grid-column: 1 / -1; justify-self: start; }
  .recommendation-subscription-mode, .recommendation-subscription-checks, .recommendation-subscription-scope, .recommendation-subscription-guard > div { grid-template-columns: 1fr; }
  .recommendation-subscription-source > header { align-items: flex-start; flex-direction: column; }
  .recommendation-subscription-actions { flex-wrap: wrap; }
  .recommendation-subscription-actions .danger, .recommendation-subscription-actions .subscription-delete-button { width: 100%; margin-right: 0; }
}
.recommend-card p { margin: 0; color: var(--muted); text-align: center; font-size: 14px; }
.recommendation-detail-dialog { position: fixed; inset: 0; z-index: 80; width: 100vw; height: 100dvh; max-width: none; max-height: none; margin: 0; padding: 0; overflow: hidden; border: 0; border-radius: 0; background: var(--bg); box-shadow: none; }
.recommendation-detail-dialog[open] { display: block; }
.recommendation-detail-dialog.is-opening { transform-origin: right center; animation: recommendation-detail-in .22s cubic-bezier(.16, 1, .3, 1) both; }
.recommendation-detail-dialog.is-closing { transform-origin: right center; animation: recommendation-detail-out .15s cubic-bezier(.4, 0, 1, 1) both; }
.recommendation-detail-dialog::backdrop { background: transparent; }
@keyframes recommendation-detail-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes recommendation-detail-out { from { opacity: 1; } to { opacity: 0; } }
.recommendation-detail-shell { width: 100%; height: 100%; overflow-y: auto; overscroll-behavior: contain; background: var(--bg); scrollbar-width: thin; }
.recommendation-detail-topbar { position: absolute; inset: 0 0 auto; z-index: 10; min-height: 62px; padding: 16px 26px; border: 0; background: linear-gradient(180deg, rgba(4,8,16,.52), transparent); pointer-events: none; }
.recommendation-detail-topbar-copy { position: absolute; width: 1px; height: 1px; overflow: hidden; pointer-events: none; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.recommendation-detail-topbar .dialog-kicker { color: rgba(255,255,255,.7); }
.recommendation-detail-topbar h2, .recommendation-detail-topbar p { color: white; }
.recommendation-detail-topbar h2 { font-size: 15px; }
.recommendation-detail-topbar p { color: rgba(255,255,255,.62); }
.recommendation-detail-topbar .dialog-close { pointer-events: auto; margin: -5px -4px 0 0; color: rgba(255,255,255,.78); background: rgba(5,9,17,.22); }
.recommendation-detail-topbar .dialog-close:hover { color: #fff; background: rgba(5,9,17,.58); }
.recommendation-detail-body { min-height: 100%; }
.recommendation-detail-content { min-height: 100%; padding-bottom: 72px; }
.recommendation-detail-hero { position: relative; min-height: min(650px, 78vh); overflow: hidden; color: #fff; background: var(--bg); }
.recommendation-detail-backdrop { position: absolute; inset: 0; overflow: hidden; background: var(--bg); }
.recommendation-detail-backdrop img { width: 100%; height: 100%; display: block; object-fit: cover; opacity: .58; filter: saturate(.78) brightness(.62); transform: scale(1.015); }
.recommendation-detail-backdrop-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(7,11,20,.02) 0%, rgba(7,11,20,.12) 30%, rgba(7,11,20,.48) 54%, rgba(7,11,20,.82) 72%, color-mix(in srgb, var(--bg) 96%, transparent) 88%, var(--bg) 100%), linear-gradient(90deg, rgba(4,8,15,.91) 0%, rgba(4,8,15,.68) 38%, rgba(4,8,15,.38) 70%, rgba(4,8,15,.62) 100%); }
.recommendation-detail-hero-inner { position: relative; z-index: 1; width: min(1540px, calc(100% - 72px)); min-height: min(650px, 78vh); margin-inline: auto; padding: 106px 0 72px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(360px, .82fr); align-items: end; gap: clamp(34px, 5vw, 88px); }
.recommendation-detail-hero-inner.is-video-collapsed { grid-template-columns: minmax(0, 900px); }
.recommendation-detail-hero-primary { min-width: 0; display: flex; align-items: flex-end; gap: 26px; transform: translateY(-30px); }
.recommendation-detail-poster { width: clamp(170px, 15vw, 250px); flex: 0 0 auto; aspect-ratio: 2 / 3; display: block; object-fit: cover; border-radius: 12px; box-shadow: 0 22px 50px rgba(0,0,0,.38); }
.recommendation-detail-hero-copy { min-width: 0; max-width: 660px; padding-bottom: 2px; }
.recommendation-detail-eyebrow { display: block; margin-bottom: 9px; color: rgba(236,242,255,.68); font-size: 13px; font-weight: 850; letter-spacing: .16em; }
.recommendation-detail-hero-copy h1 { margin: 0 0 12px; color: #fff; font-size: clamp(28px, 3.2vw, 52px); line-height: 1.08; letter-spacing: 0; }
.recommendation-detail-facts { display: flex; flex-wrap: wrap; gap: 7px; margin: 0 0 17px; }
.recommendation-detail-facts span { padding: 6px 9px; border: 1px solid rgba(255,255,255,.22); border-radius: 99px; color: rgba(255,255,255,.78); background: rgba(6,10,18,.3); font-size: 13px; font-weight: 750; }
.recommendation-detail-overview { max-width: 640px; max-height: 126px; margin: 0; overflow: auto; color: rgba(240,245,255,.78); font-size: 14px; line-height: 1.78; }
.recommendation-detail-actions { margin-top: 20px; display: flex; flex-wrap: wrap; gap: 8px; }
.recommendation-detail-actions .button { min-height: 37px; padding-inline: 13px; border-color: rgba(255,255,255,.2); color: #fff; background: rgba(5,9,16,.46); font-size: 14px; }
.recommendation-detail-actions .button:hover { background: rgba(255,255,255,.16); }
.recommendation-detail-hero-video { width: min(100%, 560px); min-width: 0; justify-self: end; align-self: start; margin-top: 18px; }
.recommendation-detail-video { position: relative; min-width: 0; min-height: 250px; aspect-ratio: 16 / 9; overflow: hidden; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.recommendation-detail-video iframe, .recommendation-detail-video > img { width: 100%; height: 100%; min-height: 0; display: block; border: 0; object-fit: cover; }
.recommendation-video-empty { position: absolute; inset: 0; padding: 26px; display: flex; align-items: center; justify-content: center; gap: 15px; color: white; background: rgba(6,9,15,.72); text-align: left; }
.recommendation-video-empty > span { width: 46px; height: 46px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.32); border-radius: 50%; background: rgba(255,255,255,.12); }
.recommendation-video-empty strong, .recommendation-video-empty small { display: block; }
.recommendation-video-empty small { margin-top: 5px; color: rgba(255,255,255,.65); line-height: 1.5; }
.recommendation-detail-section { width: min(1540px, calc(100% - 72px)); margin: 0 auto; padding-top: 34px; }
.recommendation-detail-section-head { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-bottom: 15px; }
.recommendation-detail-section-head h2 { margin: 0; color: var(--text); font-size: 20px; }
.recommendation-related-columns { width: min(1540px, calc(100% - 72px)); margin: 0 auto; padding-top: 34px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; }
.recommendation-related-columns .recommendation-detail-section { width: 100%; margin: 0; padding-top: 0; }
.recommendation-library-legend { margin-left: auto; display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 12px; color: var(--muted); font-size: 13px; }
.recommendation-library-legend span { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.recommendation-library-legend i { width: 8px; height: 8px; border: 1px solid var(--line); border-radius: 50%; background: var(--surface-soft); }
.recommendation-library-legend .is-emby i { border-color: color-mix(in srgb, var(--primary) 45%, var(--line)); background: color-mix(in srgb, var(--primary) 24%, var(--surface)); }
.recommendation-library-legend .is-strm i { border-color: var(--warning); background: color-mix(in srgb, var(--warning) 24%, var(--surface)); }
.recommendation-library-legend .is-missing i { border-color: var(--danger); background: color-mix(in srgb, var(--danger) 18%, var(--surface)); }
.recommendation-season-list { overflow: hidden; display: grid; gap: 0; border: 1px solid var(--line); border-radius: 11px; background: var(--surface); }
.recommendation-season { min-width: 0; overflow: hidden; border-bottom: 1px solid var(--line); background: var(--surface); }
.recommendation-season:last-child { border-bottom: 0; }
.recommendation-season-row { min-height: 49px; padding: 8px 13px; display: grid; grid-template-columns: 70px minmax(0, 1fr) auto; align-items: start; gap: 11px; }
.recommendation-season-episode-label { min-height: 31px; padding-top: 2px; display: grid; align-content: center; gap: 2px; color: var(--muted); white-space: nowrap; }
.recommendation-season-episode-label strong { color: color-mix(in srgb, var(--text) 58%, var(--muted)); font-size: 14px; }
.recommendation-season-episode-label small { color: var(--muted); font-size: 13px; }
.recommendation-season-actions { min-height: 31px; display: flex; align-items: center; gap: 3px; }
.recommendation-season-command, .recommendation-library-delete { width: 29px; height: 29px; padding: 0; display: grid; place-items: center; border: 0; border-radius: 7px; color: var(--muted); background: transparent; cursor: pointer; font: inherit; font-size: 14px; }
.recommendation-season-command svg, .recommendation-library-delete svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.recommendation-season-command:hover { color: var(--primary); background: color-mix(in srgb, var(--primary) 9%, var(--surface)); }
.recommendation-season-command.danger:hover, .recommendation-library-delete:hover { color: var(--danger); background: color-mix(in srgb, var(--danger) 10%, var(--surface)); }
.recommendation-season-command:disabled, .recommendation-library-delete:disabled { opacity: .55; cursor: wait; }
.recommendation-season > summary { min-height: 54px; padding: 0 17px; display: grid; grid-template-columns: minmax(0, 1fr) auto 22px; align-items: center; gap: 12px; cursor: pointer; list-style: none; }
.recommendation-season > summary::-webkit-details-marker { display: none; }
.recommendation-season > summary strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
.recommendation-season > summary > span { color: var(--muted); font-size: 14px; }
.recommendation-season > summary > span.is-complete { color: var(--success); }
.recommendation-season > summary > span.is-pending { color: var(--warning); }
.recommendation-season > summary > i { color: var(--muted); font-style: normal; font-size: 17px; transition: transform .18s ease; }
.recommendation-season[open] > summary > i { transform: rotate(180deg); }
.recommendation-episode-list { border-top: 1px solid var(--line); }
.recommendation-episode-row { min-height: 52px; padding: 8px 17px; display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; align-items: center; gap: 11px; border-bottom: 1px solid var(--line); }
.recommendation-episode-row:last-child { border-bottom: 0; }
.recommendation-episode-number { color: var(--muted); font-size: 14px; }
.recommendation-episode-row > div { min-width: 0; display: grid; gap: 3px; }
.recommendation-episode-row strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
.recommendation-episode-row small { color: var(--muted); font-size: 13px; }
.recommendation-episode-status { padding: 5px 8px; border-radius: 99px; color: var(--muted); background: var(--surface-soft); font-size: 13px; font-weight: 750; white-space: nowrap; }
.recommendation-episode-status.is-complete { color: var(--success); background: var(--success-soft); }
.recommendation-episode-status.is-missing { color: var(--danger); background: color-mix(in srgb, var(--danger) 10%, var(--surface)); }
.recommendation-episode-status.is-pending { color: var(--warning); background: color-mix(in srgb, var(--warning) 12%, var(--surface)); }
.recommendation-season-body { padding: 15px 17px 17px; border-top: 1px solid var(--line); background: color-mix(in srgb, var(--surface-soft) 32%, var(--surface)); }
.recommendation-season-episode-map { display: grid; grid-template-columns: 58px minmax(0, 1fr); align-items: start; gap: 12px; }
.recommendation-season-episode-chips { min-width: 0; display: flex; flex-wrap: wrap; gap: 7px; }
.recommendation-episode-chip { width: 25px; height: 25px; padding: 0; display: inline-grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; color: var(--muted); background: var(--surface); cursor: pointer; font: inherit; font-size: 13px; font-weight: 800; line-height: 1; transition: border-color .18s ease, color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease; }
.recommendation-episode-chip:hover, .recommendation-episode-chip.active { transform: translateY(-1px); box-shadow: 0 0 0 3px color-mix(in srgb, currentColor 12%, transparent); }
.recommendation-episode-chip.is-emby { color: color-mix(in srgb, var(--primary) 58%, var(--text)); border-color: color-mix(in srgb, var(--primary) 38%, var(--line)); background: color-mix(in srgb, var(--primary) 10%, var(--surface)); }
.recommendation-episode-chip.is-strm { color: var(--warning); border-color: color-mix(in srgb, var(--warning) 75%, var(--line)); background: color-mix(in srgb, var(--warning) 12%, var(--surface)); }
.recommendation-episode-chip.is-complete { color: color-mix(in srgb, var(--text) 72%, var(--muted)); border-color: color-mix(in srgb, var(--muted) 35%, var(--line)); background: color-mix(in srgb, var(--muted) 10%, var(--surface)); }
.recommendation-episode-chip.is-missing { color: var(--danger); border-color: color-mix(in srgb, var(--danger) 55%, var(--line)); background: color-mix(in srgb, var(--danger) 8%, var(--surface)); }
.recommendation-episode-chip.is-pending { color: var(--muted); opacity: .7; }
.recommendation-episode-chip.has-resource { color: var(--warning); border-color: color-mix(in srgb, var(--warning) 78%, var(--line)); background: color-mix(in srgb, var(--warning) 12%, var(--surface)); opacity: 1; transform: translateY(-1px); }
.recommendation-episode-panel { margin: 0 13px 11px 94px; padding: 10px 12px; border: 1px solid color-mix(in srgb, var(--primary) 25%, var(--line)); border-radius: 8px; background: color-mix(in srgb, var(--surface-soft) 62%, var(--surface)); }
.recommendation-episode-panel[hidden] { display: none; }
.recommendation-episode-panel > header { min-height: 28px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.recommendation-episode-panel > header > div { min-width: 0; display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.recommendation-episode-panel > header strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
.recommendation-episode-head-actions { flex: 0 0 auto; justify-content: flex-end; }
.recommendation-episode-collapse, .recommendation-season-resource-close { min-height: 28px; padding: 0 9px; display: inline-flex; align-items: center; justify-content: center; gap: 5px; border: 1px solid var(--line); border-radius: 7px; color: var(--muted); background: var(--surface); cursor: pointer; font: inherit; font-size: 13px; font-weight: 750; }
.recommendation-episode-subscribe { min-height: 28px; padding: 0 9px; display: inline-flex; align-items: center; gap: 5px; border: 1px solid color-mix(in srgb, var(--primary) 45%, var(--line)); border-radius: 7px; color: var(--primary); background: var(--primary-soft); cursor: pointer; font: inherit; font-size: 13px; font-weight: 800; }
.recommendation-episode-subscribe .ui-icon { width: 13px; height: 13px; }
.recommendation-episode-actions a { display: inline-flex; align-items: center; gap: 5px; }
.recommendation-episode-collapse:hover, .recommendation-season-resource-close:hover { color: var(--primary); border-color: color-mix(in srgb, var(--primary) 45%, var(--line)); background: color-mix(in srgb, var(--primary) 8%, var(--surface)); }
.recommendation-episode-state { padding: 4px 7px; border-radius: 99px; color: var(--muted); background: var(--surface); font-size: 13px; font-weight: 750; }
.recommendation-episode-state.is-emby { color: var(--primary); background: color-mix(in srgb, var(--primary) 11%, var(--surface)); }
.recommendation-episode-state.is-strm { color: var(--warning); background: color-mix(in srgb, var(--warning) 12%, var(--surface)); }
.recommendation-episode-state.is-missing { color: var(--danger); background: color-mix(in srgb, var(--danger) 10%, var(--surface)); }
.recommendation-episode-facts { margin-top: 7px; display: flex; flex-wrap: wrap; gap: 5px; }
.recommendation-episode-facts span { padding: 4px 8px; border: 1px solid var(--line); border-radius: 5px; color: var(--muted); background: color-mix(in srgb, var(--surface) 76%, transparent); font-size: 13px; }
.recommendation-episode-paths { margin-top: 8px; display: grid; gap: 5px; }
.recommendation-episode-paths > div { min-width: 0; display: grid; grid-template-columns: 64px minmax(0, 1fr); align-items: center; gap: 8px; }
.recommendation-episode-paths span { color: var(--muted); font-size: 13px; }
.recommendation-episode-paths code { min-width: 0; overflow: hidden; color: color-mix(in srgb, var(--text) 72%, var(--muted)); font-family: var(--font-mono); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.recommendation-episode-empty { margin: 8px 0 0; color: var(--danger); font-size: 13px; }
.recommendation-episode-actions { margin-top: 7px; display: flex; justify-content: flex-end; }
.recommendation-episode-actions a { color: var(--primary); font-size: 13px; font-weight: 750; text-decoration: none; }
.recommendation-season-no-episodes { color: var(--muted); font-size: 14px; }
.recommendation-season-resources { margin: 0 13px 12px 94px; padding: 11px 12px 0; border: 1px solid var(--line); border-radius: 8px; background: color-mix(in srgb, var(--surface-soft) 45%, var(--surface)); }
.recommendation-season-resources[hidden] { display: none; }
.recommendation-season-resource-head { min-height: 30px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.recommendation-season-resource-head-copy { min-width: 0; display: grid; gap: 2px; }
.recommendation-season-resource-head strong { font-size: 14px; }
.recommendation-season-resource-head small { color: var(--muted); font-size: 13px; }
.recommendation-season-resource-types { margin-top: 8px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
.recommendation-season-resource-types button { min-height: 34px; padding: 0 12px; border: 1px solid var(--line); border-radius: 8px; color: var(--muted); background: var(--surface); cursor: pointer; font: inherit; font-size: 13px; font-weight: 800; }
.recommendation-season-resource-types button.active { color: var(--primary); border-color: var(--primary); background: var(--primary-soft); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary) 35%, transparent); }
.recommendation-season-resource-filters { margin-top: 7px; display: flex; flex-wrap: wrap; gap: 5px; }
.recommendation-season-resource-filters[hidden] { display: none; }
.recommendation-season-resource-filter { min-height: 28px; padding: 0 9px; border: 0; border-bottom: 2px solid transparent; color: var(--muted); background: transparent; cursor: pointer; font-size: 13px; }
.recommendation-season-resource-filter:hover, .recommendation-season-resource-filter.active { color: var(--text); border-bottom-color: var(--primary); }
.recommendation-season-resource-list { margin-top: 6px; }
.telegram-channel-result.recommendation-season-resource { min-height: 86px; padding: 13px 0; align-items: center; }
.telegram-channel-result-copy { min-width: 0; flex: 1; }
.telegram-channel-result-copy strong { overflow: hidden; color: var(--text); font-size: 14px; line-height: 1.5; text-overflow: ellipsis; }
.telegram-channel-excerpt { max-width: 980px; margin: 5px 0 0; overflow: hidden; color: var(--muted); font-size: 13px; line-height: 1.55; text-overflow: ellipsis; white-space: nowrap; }
.pt-site-resource-result { position: relative; }
.pt-site-resource-result::before { content: 'PT'; flex: 0 0 auto; width: 29px; height: 29px; display: grid; place-items: center; border: 1px solid color-mix(in srgb, #22c55e 42%, var(--line)); border-radius: 8px; color: color-mix(in srgb, #22c55e 78%, var(--text)); background: color-mix(in srgb, #22c55e 9%, var(--surface)); font-size: 13px; font-weight: 900; letter-spacing: .04em; }
.resource-result-labels { margin-top: 6px; display: flex; flex-wrap: wrap; gap: 4px; }
.resource-result-labels span { padding: 2px 6px; border: 1px solid var(--line); border-radius: 99px; color: var(--muted); font-size: 12px; }
.resource-result-no-link { align-self: center; color: var(--muted); font-size: 13px; white-space: nowrap; }
.recommendation-season-resource .telegram-channel-links { flex: 0 0 auto; justify-content: flex-end; }
.recommendation-season-resource .telegram-channel-links .button { min-height: 30px; height: 30px; padding-inline: 10px; font-size: 13px; }
.recommendation-season-resource-loading { min-height: 76px; display: flex; align-items: center; justify-content: center; gap: 9px; color: var(--muted); font-size: 14px; }
.recommendation-season-resource-loading > span { width: 15px; height: 15px; border: 2px solid var(--line); border-top-color: var(--primary); border-radius: 50%; animation: recommendation-spin .75s linear infinite; }
.recommendation-season-resource-empty { min-height: 70px; margin: 0; display: grid; place-items: center; color: var(--muted); font-size: 14px; text-align: center; }
.recommendation-season-resource[hidden], .recommendation-season-resource-empty[hidden] { display: none; }
.recommendation-season-resource-empty.is-error { color: var(--danger); }
.recommendation-cast-grid, .recommendation-related-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 12px; }
.recommendation-cast-card { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); }
.recommendation-cast-card > img, .recommendation-cast-placeholder { width: 100%; aspect-ratio: 2 / 2.25; display: block; object-fit: cover; background: var(--surface-soft); }
.recommendation-cast-placeholder { display: grid; place-items: center; color: var(--muted); font-size: 22px; }
.recommendation-cast-card > div { min-width: 0; padding: 9px 10px 11px; display: grid; gap: 4px; }
.recommendation-cast-card strong, .recommendation-cast-card small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.recommendation-cast-card strong { color: var(--text); font-size: 14px; }
.recommendation-cast-card small { color: var(--muted); font-size: 13px; }
.recommendation-related-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.recommendation-related-card { min-width: 0; padding: 0; display: grid; grid-template-rows: auto auto auto; overflow: hidden; border: 1px solid var(--line); border-radius: 9px; color: var(--text); background: var(--surface); cursor: pointer; text-align: left; transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.recommendation-related-card:hover, .recommendation-related-card:focus-visible { border-color: var(--primary); box-shadow: 0 10px 24px rgba(42,52,79,.13); transform: translateY(-2px); }
.recommendation-related-poster { width: 100%; aspect-ratio: 2 / 3; display: grid; place-items: center; overflow: hidden; background: var(--surface-soft); }
.recommendation-related-poster img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .22s ease; }
.recommendation-related-card:hover .recommendation-related-poster img { transform: scale(1.035); }
.recommendation-related-card > strong, .recommendation-related-card > small { min-width: 0; margin-inline: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.recommendation-related-card > strong { margin-top: 9px; font-size: 14px; }
.recommendation-related-card > small { margin-top: 4px; margin-bottom: 11px; color: var(--muted); font-size: 13px; }
.recommendation-detail-muted { grid-column: 1 / -1; margin: 0; padding: 24px; color: var(--muted); text-align: center; }
.recommendation-detail-loading { min-height: 360px; display: grid; place-items: center; align-content: center; gap: 14px; color: var(--muted); }
.recommendation-detail-loading > span { width: 30px; height: 30px; border: 3px solid var(--line); border-top-color: var(--primary); border-radius: 50%; animation: recommendation-spin .75s linear infinite; }
.recommendation-detail-error { min-height: 360px; padding: 30px; display: flex; align-items: center; justify-content: center; gap: 16px; }
.recommendation-detail-error > span { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--danger); font-size: 22px; font-weight: 900; }

@media (max-width: 1100px) {
  .recommendation-related-columns { grid-template-columns: 1fr; }
}

.telegram-account-card { padding: 0; overflow: hidden; border-color: color-mix(in srgb, var(--primary) 22%, var(--line)); }
.telegram-account-head { min-height: 70px; margin: 0; padding: 14px 18px; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--primary-soft) 18%, var(--surface)); }
.telegram-account-head > div { min-width: 0; flex: 1; }
.telegram-account-head h2 { margin: 0; font-size: 17px; }
.telegram-account-head p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.telegram-account-head .settings-section-icon { width: 38px; height: 38px; border-radius: 10px; font-size: 14px; }
.telegram-account-head > .badge { flex: 0 0 auto; margin-left: auto; }
.telegram-account-row { min-width: 0; min-height: 92px; padding: 14px 18px; display: grid; grid-template-columns: minmax(145px, .48fr) minmax(140px, .5fr) minmax(210px, .82fr) minmax(190px, .7fr) auto; align-items: end; gap: 12px; }
.telegram-account-row + .telegram-account-row { border-top: 1px solid var(--line); background: color-mix(in srgb, var(--surface-soft) 42%, transparent); }
.telegram-row-copy { min-width: 0; align-self: center; display: grid; gap: 4px; }
.telegram-row-copy strong { font-size: 14px; }
.telegram-row-copy small { overflow: hidden; color: var(--muted); font-size: 13px; line-height: 1.5; text-overflow: ellipsis; white-space: nowrap; }
.telegram-account-row .field { min-width: 0; gap: 7px; }
.telegram-account-row .field label { font-size: 14px; font-weight: 700; }
.telegram-account-row .field input { min-height: 42px; height: 42px; border-radius: 8px; font-size: 14px; }
.telegram-row-actions { display: flex; align-items: center; gap: 7px; }
.telegram-row-actions .button { min-height: 42px; height: 42px; padding-inline: 13px; border-radius: 8px; font-size: 14px; white-space: nowrap; }
.telegram-channel-manager { padding: 12px 18px 14px; border-top: 1px solid var(--line); background: color-mix(in srgb, var(--surface-soft) 42%, transparent); }
.telegram-channel-toolbar { position: relative; display: grid; grid-template-columns: minmax(150px, .55fr) minmax(320px, 2fr); align-items: center; gap: 12px; }
.telegram-channel-picker { position: relative; min-width: 0; }
.telegram-channel-searchbox { height: 38px; display: grid; grid-template-columns: 30px minmax(0, 1fr) 38px; align-items: center; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.telegram-channel-searchbox:focus-within { border-color: color-mix(in srgb, var(--primary) 65%, var(--line)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 12%, transparent); }
.telegram-channel-searchbox > span { color: var(--muted); text-align: center; font-size: 19px; }
.telegram-channel-searchbox input { width: 100%; min-width: 0; min-height: 36px; padding: 0 4px; border: 0; border-radius: 0; outline: 0; background: transparent; box-shadow: none; font-size: 14px; }
.telegram-channel-searchbox button { width: 38px; height: 36px; display: grid; place-items: center; border: 0; border-left: 1px solid var(--line); color: var(--primary); background: var(--primary-soft); cursor: pointer; font-size: 19px; }
.telegram-channel-searchbox button:disabled { color: var(--muted); background: var(--surface-soft); cursor: not-allowed; }
.telegram-channel-discovery { position: absolute; left: 0; right: 0; top: 44px; z-index: 18; max-height: 276px; padding: 5px; overflow: auto; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); box-shadow: 0 16px 34px rgba(6,10,20,.22); }
.telegram-channel-candidate { min-height: 52px; padding: 7px 8px; display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; align-items: center; gap: 9px; border-radius: 6px; }
.telegram-channel-candidate:hover { background: var(--surface-soft); }
.telegram-channel-candidate > div, .telegram-channel-identity > div { min-width: 0; }
.telegram-channel-candidate strong, .telegram-channel-candidate small, .telegram-channel-identity strong, .telegram-channel-identity small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.telegram-channel-candidate strong { font-size: 14px; }
.telegram-channel-candidate small { margin-top: 3px; color: var(--muted); font-size: 13px; }
.telegram-channel-candidate .button { min-height: 30px; height: 30px; padding: 0 10px; font-size: 13px; }
.telegram-channel-discovery-empty { min-height: 58px; display: grid; place-items: center; padding: 12px; color: var(--muted); text-align: center; font-size: 13px; }
.telegram-channel-discovery-empty.error { color: var(--danger); }
.telegram-channel-list { max-height: 326px; margin-top: 12px; overflow: auto; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); scrollbar-width: thin; }
.telegram-channel-item { min-width: 0; min-height: 64px; padding: 8px 10px; display: grid; grid-template-columns: minmax(210px, .8fr) minmax(340px, 1.2fr) auto 32px; align-items: center; gap: 12px; border-bottom: 1px solid var(--line); }
.telegram-channel-item:last-child { border-bottom: 0; }
.telegram-channel-item[data-busy="true"] { opacity: .58; pointer-events: none; }
.telegram-channel-identity { min-width: 0; display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: center; gap: 9px; }
.telegram-channel-avatar { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #6d5bd0; font-size: 14px; font-weight: 850; }
.telegram-channel-avatar.tone-1 { background: #287ebd; }
.telegram-channel-avatar.tone-2 { background: #27866d; }
.telegram-channel-avatar.tone-3 { background: #bd5656; }
.telegram-channel-avatar.tone-4 { background: #a66a20; }
.telegram-channel-avatar.tone-5 { background: #287f8d; }
.telegram-channel-identity strong { font-size: 14px; }
.telegram-channel-identity small { margin-top: 3px; color: var(--muted); font-size: 13px; }
.telegram-channel-identity .telegram-channel-runtime { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; opacity: .78; }
.telegram-channel-modes { min-width: 0; height: 34px; padding: 3px; display: grid; grid-template-columns: repeat(5, minmax(44px, 1fr)); gap: 3px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-soft); }
.telegram-channel-modes button { min-width: 0; border: 0; border-radius: 5px; color: var(--muted); background: transparent; cursor: pointer; font-size: 13px; font-weight: 750; }
.telegram-channel-modes button:hover { color: var(--text); background: color-mix(in srgb, var(--line) 48%, transparent); }
.telegram-channel-modes button[aria-pressed="true"] { color: var(--primary); background: var(--primary-soft); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary) 16%, transparent); }
.telegram-channel-switch { display: grid; grid-template-columns: 40px; justify-items: center; gap: 2px; cursor: pointer; }
.telegram-channel-switch > input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.telegram-channel-switch b { color: var(--muted); font-size: 13px; }
.telegram-channel-switch > input:checked + .notification-switch { background: var(--primary); }
.telegram-channel-switch > input:checked + .notification-switch i { transform: translateX(17px); }
.telegram-channel-switch > input:focus-visible + .notification-switch { outline: 3px solid color-mix(in srgb, var(--primary) 24%, transparent); }
.telegram-channel-delete { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; color: var(--muted); background: transparent; cursor: pointer; font-size: 19px; }
.telegram-channel-delete:hover { border-color: color-mix(in srgb, var(--danger) 40%, var(--line)); color: var(--danger); background: color-mix(in srgb, var(--danger) 8%, transparent); }
.telegram-channel-empty { min-height: 76px; padding: 14px; display: flex; align-items: center; justify-content: center; gap: 10px; color: var(--muted); text-align: left; }
.telegram-channel-empty > span { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; background: var(--surface-soft); font-size: 18px; }
.telegram-channel-empty strong, .telegram-channel-empty small { display: block; }
.telegram-channel-empty strong { color: var(--text); font-size: 14px; }
.telegram-channel-empty small { margin-top: 4px; font-size: 13px; }
.telegram-channel-add { width: 100%; min-height: 38px; margin-top: 9px; border: 1px dashed color-mix(in srgb, var(--primary) 52%, var(--line)); border-radius: 7px; color: var(--primary); background: color-mix(in srgb, var(--primary-soft) 42%, transparent); cursor: pointer; font-size: 14px; font-weight: 750; }
.telegram-channel-add:hover { background: var(--primary-soft); }
.telegram-channel-add:disabled { border-color: var(--line); color: var(--muted); cursor: not-allowed; }
.telegram-channel-feedback { min-height: 13px; margin: 6px 0 -3px; color: var(--muted); text-align: center; font-size: 13px; }
.telegram-channel-feedback[data-error="true"] { color: var(--danger); }
.telegram-phone-dialog { width: min(570px, calc(100vw - 28px)); }
.telegram-phone-body { padding: 24px; display: grid; gap: 18px; }
.telegram-phone-status { min-height: 86px; padding: 16px; display: flex; align-items: center; gap: 14px; border: 1px solid var(--line); border-radius: 10px; background: color-mix(in srgb, var(--primary-soft) 26%, var(--surface)); }
.telegram-phone-status > span { width: 42px; height: 42px; flex: 0 0 auto; display: grid; place-items: center; border: 3px solid color-mix(in srgb, var(--primary) 20%, var(--line)); border-top-color: var(--primary); border-radius: 50%; animation: recommendation-spin .75s linear infinite; }
.telegram-phone-status > div { min-width: 0; }
.telegram-phone-status strong { display: block; font-size: 14px; }
.telegram-phone-status p { margin: 5px 0 0; color: var(--muted); font-size: 13px; line-height: 1.55; }
.telegram-phone-status[data-state="awaiting_code"] > span,
.telegram-phone-status[data-state="awaiting_password"] > span,
.telegram-phone-status[data-state="connected"] > span,
.telegram-phone-status[data-state="error"] > span { animation: none; border: 0; background: var(--primary-soft); }
.telegram-phone-status[data-state="awaiting_code"] > span::before { content: '123'; color: var(--primary); font-size: 14px; font-weight: 900; }
.telegram-phone-status[data-state="awaiting_password"] > span::before { content: '2FA'; color: var(--primary); font-size: 14px; font-weight: 900; }
.telegram-phone-status[data-state="connected"] > span::before { content: '✓'; color: var(--success); font-size: 25px; font-weight: 900; }
.telegram-phone-status[data-state="error"] > span::before { content: '!'; color: var(--danger); font-size: 25px; font-weight: 900; }
.telegram-phone-step { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 10px; }
.telegram-phone-step .field { min-width: 0; gap: 6px; }
.telegram-phone-step .button { min-height: 40px; height: 40px; white-space: nowrap; }
.telegram-phone-security { margin: 0; padding: 11px 13px; border-radius: 8px; color: var(--muted); background: var(--surface-soft); font-size: 13px; line-height: 1.6; }
.telegram-phone-dialog .dialog-actions { padding-top: 14px; border-top: 1px solid var(--line); }
@media (max-width: 1180px) {
  .telegram-account-row { grid-template-columns: minmax(130px, .5fr) repeat(3, minmax(160px, 1fr)); }
  .telegram-row-actions { grid-column: 2 / -1; justify-content: flex-end; }
  .telegram-channel-item { grid-template-columns: minmax(180px, .75fr) minmax(300px, 1.15fr) auto 32px; gap: 8px; }
}
@media (max-width: 720px) {
  .telegram-account-head { align-items: flex-start; }
  .telegram-account-head p { white-space: normal; }
  .telegram-account-row { grid-template-columns: 1fr; padding: 15px; }
  .telegram-account-row .telegram-row-copy, .telegram-account-row .field { grid-column: 1; grid-row: auto; }
  .telegram-row-actions { grid-column: 1; display: grid; grid-template-columns: repeat(2, 1fr); }
  .telegram-row-actions .button { width: 100%; }
  .telegram-channel-manager { padding: 13px 15px; }
  .telegram-channel-toolbar { grid-template-columns: 1fr; gap: 9px; }
  .telegram-channel-list { max-height: 420px; }
  .telegram-channel-item { grid-template-columns: minmax(0, 1fr) 42px 30px; gap: 8px; }
  .telegram-channel-modes { grid-column: 1 / -1; grid-row: 2; width: 100%; }
  .telegram-channel-switch { grid-column: 2; grid-row: 1; }
  .telegram-channel-delete { grid-column: 3; grid-row: 1; }
  .telegram-channel-discovery { max-height: 240px; }
  .telegram-phone-body { padding: 18px; }
  .telegram-phone-step { grid-template-columns: 1fr; }
  .telegram-phone-step .button { width: 100%; }
}
.telegram-channel-dialog { width: min(760px, calc(100vw - 28px)); }
.telegram-channel-search-form { display: flex; gap: 8px; padding: 18px 22px 0; }
.telegram-channel-search-form input { flex: 1; min-width: 0; }
.resource-search-tabs { margin: 12px 22px 0; padding: 4px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px; border: 1px solid var(--line); border-radius: 13px; background: color-mix(in srgb, var(--surface-soft) 78%, transparent); }
.resource-search-tab { min-width: 0; min-height: 48px; padding: 7px 11px; display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: center; gap: 8px; border: 0; border-radius: 9px; color: var(--muted); background: transparent; cursor: pointer; text-align: left; transition: color .18s ease, background .18s ease, box-shadow .18s ease; }
.resource-search-tab b { overflow: hidden; color: inherit; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.resource-search-tab small { overflow: hidden; max-width: 90px; color: inherit; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.resource-search-tab .resource-search-source-mark { width: 30px; height: 30px; }
.resource-search-tab.active { color: var(--primary); background: var(--surface); box-shadow: 0 5px 16px color-mix(in srgb, #020617 10%, transparent), inset 0 0 0 1px color-mix(in srgb, var(--primary) 20%, transparent); }
.resource-search-tab.active .resource-search-source-mark { color: #fff; border-color: transparent; background: linear-gradient(145deg, var(--primary), color-mix(in srgb, var(--primary) 60%, #22d3ee)); }
.telegram-channel-results { max-height: 480px; overflow: auto; padding: 12px 22px 24px; }
.resource-search-section + .resource-search-section { margin-top: 18px; }
.resource-search-section[hidden] { display: none; }
.resource-search-section-head { min-height: 42px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--line); }
.resource-search-section-head > div { min-width: 0; display: flex; align-items: center; gap: 9px; }
.resource-search-section-head strong { font-size: 14px; }
.resource-search-section-head > small { color: var(--muted); font-size: 13px; text-align: right; }
.resource-search-section-head > small.resource-search-source-error { color: var(--danger); }
.resource-search-source-mark { width: 27px; height: 27px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 8px; color: var(--primary); background: var(--primary-soft); font-size: 13px; font-weight: 900; }
.resource-search-section-list > .recommendation-season-resource-empty { min-height: 82px; border-bottom: 1px solid var(--line); }
.pt-qb-download-control { display: inline-flex; align-items: stretch; gap: 5px; }
.pt-qb-mapping-select { min-width: 110px; max-width: 160px; min-height: 34px; padding: 0 28px 0 9px; border-radius: 9px; font-size: 13px; }
.pt-qb-download-button { min-height: 34px !important; gap: 5px; white-space: nowrap; }
.pt-qb-download-button .ui-icon { width: 13px; height: 13px; }
.pt-qb-download-button:has(use[href$="#loader-circle"]) .ui-icon { animation: spin .8s linear infinite; }
.telegram-channel-result { display: flex; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.telegram-channel-result strong, .telegram-channel-result small { display: block; }
.telegram-channel-result small { margin-top: 5px; color: var(--muted); }
.channel-plugin-resource-identity { min-width: 0; flex: 1 1 auto; display: flex; align-items: center; gap: 11px; }
.channel-plugin-resource-icon { width: 36px; height: 36px; flex: 0 0 auto; border: 1px solid var(--line); border-radius: 9px; background: var(--surface-soft); object-fit: cover; }
.telegram-channel-links { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; justify-content: flex-end; }
.telegram-channel-preview[aria-disabled="true"] { opacity: .45; cursor: not-allowed; }
.recommendation-detail-error p { margin: 4px 0 0; color: var(--muted); }
.recommend-empty { min-height: 360px; }
.recommend-loading-label { min-height: 36px; display: flex; align-items: center; gap: 9px; color: var(--muted); font-size: 14px; font-weight: 750; }
.recommend-loading-label span { width: 15px; height: 15px; border: 2px solid var(--line); border-top-color: var(--primary); border-radius: 50%; animation: recommendation-spin .75s linear infinite; }
.recommend-card-loading > span, .recommend-card-loading > i { display: block; height: 11px; margin: 10px auto 0; border-radius: 8px; background: color-mix(in srgb, var(--line) 68%, transparent); }
.recommend-card-loading > span { width: 78%; }
.recommend-card-loading > i { width: 38%; margin-top: 7px; }
.recommend-grid-loading .recommend-poster { background: linear-gradient(100deg, color-mix(in srgb, var(--line) 70%, var(--surface)) 30%, var(--surface) 46%, color-mix(in srgb, var(--line) 70%, var(--surface)) 62%); background-size: 220% 100%; animation: recommendation-shimmer 1.4s ease-in-out infinite; box-shadow: none; }
@keyframes recommendation-spin { to { transform: rotate(360deg); } }
@keyframes recommendation-shimmer { to { background-position-x: -220%; } }
@media (max-width: 620px) {
  .resource-search-tabs { margin-inline: 14px; }
  .resource-search-tab { grid-template-columns: 28px minmax(0, 1fr); }
  .resource-search-tab small { grid-column: 2; }
  .telegram-channel-results { padding-inline: 14px; }
  .pt-qb-download-control { width: 100%; display: grid; grid-template-columns: minmax(0, 1fr) auto; }
  .pt-qb-mapping-select { max-width: none; width: 100%; }
}

:root[data-theme="dark"] .main.recommend-main,
:root[data-theme="dark"] .main.recommend-main .content { background: #070b14; color: #edf3ff; }
:root[data-theme="dark"] .main.recommend-main .page-head { color: #edf3ff; }
:root[data-theme="dark"] .main.recommend-main .page-description { color: rgba(222,232,255,.68); }
:root[data-theme="dark"] .recommend-console {
  background: #070b14;
}
:root[data-theme="dark"] .recommend-source-tabs { border-bottom-color: rgba(255,255,255,.1); }
:root[data-theme="dark"] .recommend-search input { border-color: rgba(255,255,255,.1); color: #edf3ff; background: rgba(255,255,255,.08); }
:root[data-theme="dark"] .recommend-search input::placeholder { color: rgba(222,232,255,.46); }
:root[data-theme="dark"] .recommend-filter-panel > div > .recommend-filter-default { color: rgba(235,241,255,.82); }
:root[data-theme="dark"] .recommend-filter-panel > div > .recommend-filter-default.active { color: #fff; }
:root[data-theme="dark"] .recommend-filter-panel a { color: rgba(235,241,255,.78); background: transparent; border-color: transparent; }
:root[data-theme="dark"] .recommend-filter-panel a:hover, :root[data-theme="dark"] .recommend-filter-panel a.active { color: white; background: transparent; }
:root[data-theme="dark"] .recommend-status-line { color: rgba(222,232,255,.68); }
:root[data-theme="dark"] .recommend-status-line span { background: rgba(255,255,255,.08); border-color: transparent; }
:root[data-theme="dark"] .recommend-poster { background: linear-gradient(90deg, #111827, #20293a, #111827); box-shadow: 0 12px 30px rgba(0,0,0,.36); }
:root[data-theme="dark"] .recommend-card h3 { color: #f4f7ff; }
:root[data-theme="dark"] .recommend-card p { color: rgba(222,232,255,.58); }
:root[data-theme="dark"] .recommendation-detail-facts span { border-color: rgba(255,255,255,.1); background: rgba(255,255,255,.07); }

@media (max-width: 1180px) {
  .log-overview { grid-template-columns: 1fr; align-items: stretch; gap: 16px; }
  .log-level-tab small { display: none; }
}
@media (max-width: 980px) {
  .app-shell { display: block; }
  .sidebar { display: none; }
  .main { min-height: 100vh; padding-bottom: 106px; }
  .mobile-topbar { display: none; }
  .mobile-bottom-nav {
    position: fixed; left: 50%; bottom: max(12px, env(safe-area-inset-bottom)); z-index: 46;
    width: min(430px, calc(100vw - 24px)); min-height: 68px; padding: 6px;
    display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); align-items: stretch; overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--line) 72%, transparent); border-radius: 20px;
    background: color-mix(in srgb, var(--surface) 74%, transparent); box-shadow: 0 14px 36px rgba(28, 38, 62, .16);
    backdrop-filter: blur(20px) saturate(145%); -webkit-backdrop-filter: blur(20px) saturate(145%);
    transform: translateX(-50%); contain: layout paint style;
  }
  .bottom-nav-item { min-width: 0; padding: 5px 2px; display: grid; place-items: center; gap: 2px; border: 0; border-radius: 14px; color: var(--muted); background: transparent; cursor: pointer; font: inherit; font-size: 13px; font-weight: 750; text-decoration: none; white-space: nowrap; transition: color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease; }
  .bottom-nav-icon { width: 27px; height: 27px; display: grid; place-items: center; font-size: 18px; line-height: 1; }
  .bottom-nav-item:hover { color: var(--text); background: color-mix(in srgb, var(--surface) 58%, transparent); }
  .bottom-nav-item:active { transform: scale(.95); }
  .bottom-nav-item.active { color: var(--primary); background: color-mix(in srgb, var(--primary-soft) 72%, transparent); box-shadow: inset 0 1px 0 color-mix(in srgb, white 55%, transparent), 0 5px 14px color-mix(in srgb, var(--primary) 15%, transparent); }
  .bottom-nav-item.active .bottom-nav-icon { color: white; border-radius: 10px; background: var(--primary); box-shadow: 0 5px 12px color-mix(in srgb, var(--primary) 32%, transparent); }
  .mobile-nav-more .bottom-nav-icon { position: relative; }
  .mobile-nav-more .bottom-nav-icon::after { content: ''; position: absolute; right: 1px; bottom: 1px; width: 5px; height: 5px; border: 2px solid color-mix(in srgb, var(--surface) 86%, transparent); border-radius: 50%; background: var(--primary); opacity: 0; }
  .mobile-nav-more.active .bottom-nav-icon::after { opacity: 1; }
  .mobile-nav-popover { position: fixed; inset: 0; z-index: 45; display: block; }
  .mobile-nav-popover[hidden] { display: none; }
  .mobile-nav-scrim { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: color-mix(in srgb, #020617 38%, transparent); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
  .mobile-nav-sheet { position: absolute; right: 12px; bottom: calc(max(12px, env(safe-area-inset-bottom)) + 78px); left: 12px; width: auto; max-width: 430px; max-height: calc(100dvh - max(12px, env(safe-area-inset-bottom)) - 102px); margin-inline: auto; padding: 10px 12px 14px; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; overflow: hidden; border: 1px solid color-mix(in srgb, var(--line) 78%, transparent); border-radius: 22px; background: color-mix(in srgb, var(--surface) 90%, transparent); box-shadow: 0 24px 70px rgba(5, 10, 24, .3); backdrop-filter: blur(24px) saturate(155%); -webkit-backdrop-filter: blur(24px) saturate(155%); transform-origin: bottom center; }
  .mobile-nav-community-row { margin-top: 10px; padding-top: 8px; border-top: 1px solid var(--line); }
  .mobile-nav-community { min-height: 44px; padding: 5px 4px; display: flex; align-items: center; gap: 10px; color: var(--text); text-decoration: none; }
  .mobile-nav-community > span { width: 32px; height: 32px; flex: 0 0 32px; display: grid; place-items: center; color: #38bdf8; border-radius: 6px; background: color-mix(in srgb, #229ed9 12%, var(--surface)); }
  .mobile-nav-community > span .ui-icon { width: 18px; height: 18px; }
  .mobile-nav-community strong { flex: 1; min-width: 0; font-size: 14px; }
  .mobile-nav-community > .ui-icon { width: 16px; height: 16px; color: var(--muted); }
  .mobile-nav-community:hover { color: var(--primary); }
  .mobile-nav-community:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; border-radius: 6px; }
  .mobile-nav-sheet:focus { outline: none; }
  .mobile-nav-sheet > header { min-height: 50px; padding: 4px 2px 10px; display: grid; grid-template-columns: 18px minmax(0, 1fr) 34px 34px; align-items: center; gap: 8px; }
  .mobile-nav-sheet-handle { width: 4px; height: 24px; justify-self: center; border-radius: 99px; background: linear-gradient(180deg, var(--primary), color-mix(in srgb, var(--primary) 45%, #22d3ee)); }
  .mobile-nav-sheet header strong, .mobile-nav-sheet header small { display: block; }
  .mobile-nav-sheet header strong { color: var(--text); font-size: 14px; }
  .mobile-nav-sheet header small { margin-top: 2px; color: var(--muted); font-size: 13px; }
  .mobile-nav-sheet header button { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 10px; color: var(--muted); background: var(--surface-soft); cursor: pointer; }
  .mobile-nav-sheet-grid { min-height: 0; padding-right: 2px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
  .mobile-nav-sheet-item { min-width: 0; min-height: 92px; padding: 10px 8px; display: grid; grid-template-rows: 34px auto auto; align-content: center; justify-items: start; gap: 3px; overflow: hidden; border: 1px solid color-mix(in srgb, var(--line) 82%, transparent); border-radius: 14px; color: var(--text); background: color-mix(in srgb, var(--surface-soft) 72%, transparent); text-decoration: none; transition: border-color .18s ease, background .18s ease, transform .18s ease; }
  .mobile-nav-sheet-item > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; color: var(--primary); background: var(--primary-soft); }
  .mobile-nav-sheet-item > span .ui-icon { width: 18px; height: 18px; }
  .mobile-nav-sheet-item strong, .mobile-nav-sheet-item small { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .mobile-nav-sheet-item strong { font-size: 13px; }
  .mobile-nav-sheet-item small { color: var(--muted); font-size: 12px; }
  .mobile-nav-sheet-item:hover, .mobile-nav-sheet-item:focus-visible { border-color: color-mix(in srgb, var(--primary) 45%, var(--line)); background: var(--primary-soft); transform: translateY(-1px); }
  .mobile-nav-sheet-item.active { border-color: var(--primary); background: var(--primary-soft); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary) 28%, transparent); }
  .mobile-nav-sheet-item.active > span { color: #fff; background: var(--primary); box-shadow: 0 6px 16px color-mix(in srgb, var(--primary) 28%, transparent); }
  body.mobile-nav-open { overflow: hidden; }
  .mobile-nav-popover.is-opening .mobile-nav-scrim { animation: ui-overlay-enter .2s ease-out both; }
  .mobile-nav-popover.is-opening .mobile-nav-sheet { animation: mobile-nav-sheet-in .22s cubic-bezier(.16, 1, .3, 1) both; }
  .mobile-nav-popover.is-closing { pointer-events: none; }
  .mobile-nav-popover.is-closing .mobile-nav-scrim { animation: ui-overlay-exit .15s ease-in both; }
  .mobile-nav-popover.is-closing .mobile-nav-sheet { animation: mobile-nav-sheet-out .15s cubic-bezier(.4, 0, 1, 1) both; }
  @keyframes mobile-nav-sheet-in { from { opacity: 0; transform: translateY(18px) scale(.94); } to { opacity: 1; transform: translateY(0) scale(1); } }
  @keyframes mobile-nav-sheet-out { from { opacity: 1; transform: translateY(0) scale(1); } to { opacity: 0; transform: translateY(12px) scale(.96); } }
  :root[data-theme="dark"] .mobile-bottom-nav { border-color: rgba(255,255,255,.12); background: rgba(23, 27, 36, .7); box-shadow: 0 16px 38px rgba(0,0,0,.35); }
  :root[data-theme="dark"] .mobile-nav-sheet { border-color: rgba(255,255,255,.12); background: rgba(15, 20, 34, .9); }
  :root[data-theme="dark"] .bottom-nav-item:hover { background: rgba(255,255,255,.08); }
  .recommend-console { width: 100%; }
  .recommend-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .recommendation-detail-dialog { inset: 0; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .two-col { grid-template-columns: 1fr; }
  .log-overview { grid-template-columns: 1fr; align-items: stretch; gap: 16px; }
  .log-toolbar { align-items: flex-start; flex-direction: column; }
  .log-live-controls { width: 100%; justify-content: flex-start; flex-wrap: wrap; }
  .log-query { grid-template-columns: repeat(2, minmax(130px, .75fr)) minmax(220px, 1.5fr) minmax(105px, .55fr) auto auto; }
  .emby-overview { grid-template-columns: repeat(2, 1fr); }
  .emby-grid { grid-template-columns: 1fr; }
  .member-stats { grid-template-columns: repeat(2, 1fr); }
  .auth-settings-grid, .account-security-grid { grid-template-columns: 1fr; }
  .member-user-grid { grid-template-columns: 1fr; }
  .member-filter { grid-template-columns: minmax(0, 1fr) minmax(180px, .45fr) auto auto; }
  .member-user-card { grid-template-columns: minmax(220px, .8fr) minmax(300px, 1.2fr); }
  .member-user-actions { grid-column: 1 / -1; padding-top: 2px; border-top: 1px solid var(--line); }
  .member-split { grid-template-columns: 1fr; }
  .code-create { grid-template-columns: repeat(2, 1fr); }
  .code-filter { grid-template-columns: repeat(2, 1fr); }
  .merchant-layout, .communication-layout { grid-template-columns: 1fr; }
  .portal-stats { grid-template-columns: repeat(2, 1fr); }
  .member-request-layout { grid-template-columns: 1fr; }
  .system-settings-grid { grid-template-columns: 1fr; }
  .one15-authorize-grid { grid-template-columns: 280px minmax(0, 1fr); }
  .one15-automation-grid { grid-template-columns: 1fr; }
  .one15-automation-port + .one15-automation-port { border-top: 1px solid var(--line); border-left: 0; }
  .reverse-overview { grid-template-columns: 1fr 1fr; }
  .reverse-basic-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .reverse-basic-grid .proxy-switch { grid-column: 1 / -1; }
  .reverse-endpoints { grid-template-columns: 1fr; }
  .reverse-summary-grid { grid-template-columns: 1fr; }
  .reverse-log-filter { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tmdb-settings-card { grid-column: auto; }
  .settings-side { grid-template-columns: 1fr 1fr; }
  .recommend-console { padding: 14px 0 34px; }
  .file-list-head, .file-row { grid-template-columns: 26px minmax(220px, 1fr) minmax(80px, .3fr) minmax(150px, .5fr) 22px 20px; }
  .file-list-head > :nth-child(4), .file-size { display: none; }
}

@media (max-width: 520px) {
  .telegram-community-link { left: max(12px, env(safe-area-inset-left)); bottom: max(12px, env(safe-area-inset-bottom)); min-height: 46px; padding: 5px 8px 5px 5px; gap: 7px; }
  .telegram-community-link > .ui-icon:first-child { width: 36px; height: 36px; padding: 8px; flex-basis: 36px; }
  .telegram-community-link small, .telegram-community-link .telegram-community-external { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .telegram-community-link { transition: none; }
}
@media (max-width: 720px) {
  .main { --page-gutter: 16px; padding: var(--page-gutter); }
  .main { padding-bottom: 106px; }
  .mobile-bottom-nav { width: calc(100vw - 20px); bottom: max(10px, env(safe-area-inset-bottom)); border-radius: 18px; }
  .bottom-nav-item { font-size: 13px; }
  .one15-authorize-grid { grid-template-columns: 1fr; }
  .one15-qr-panel { min-height: 300px; padding: 18px; }
  .one15-client-select { width: min(100%, 360px); }
  .one15-qr { width: 176px; height: 176px; }
  .one15-cookie-panel, .one15-cookie-panel .field, .one15-cookie-form { width: 100%; min-width: 0; }
  .one15-form-actions { width: 100%; padding-inline: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .one15-form-actions .button { width: 100%; min-width: 0; }
  .one15-optional-panel { align-items: stretch; grid-template-columns: minmax(0, 1fr); }
  .one15-optional-panel .button { width: 100%; }
  .one15-automation-head, .one15-automation-port, .one15-automation-control { padding-inline: 18px; }
  .one15-automation-head { align-items: flex-start; }
  .one15-control-copy { align-items: flex-start; flex-direction: column; }
  .one15-control-copy .channel-enable { align-self: flex-start; }
  .one15-automation-status { align-items: flex-start; flex-direction: column; gap: 6px; }
  .one15-automation-status > span { max-width: 100%; white-space: normal; }
  .one15-control-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .one15-control-actions .button { width: 100%; }
  .emby-feature-hero { min-height: 0; align-items: stretch; flex-direction: column; padding: 20px; }
  .emby-feature-hero-side { width: 100%; min-width: 0; }
  .reverse-summary-card dl { grid-template-columns: 1fr 1fr; }
  .reverse-summary-card dl > div:nth-child(3) { border-left: 0; }
  .reverse-summary-card dl > div:nth-child(n + 3) { border-top: 1px solid var(--line); }
  .reverse-emby-card { padding: 20px; }
  .reverse-emby-head { align-items: stretch; flex-direction: column; }
  .reverse-runtime-strip { grid-template-columns: 1fr 1fr; }
  .reverse-runtime-strip > div:nth-child(3) { border-left: 0; }
  .reverse-runtime-strip > div:nth-child(n + 3) { border-top: 1px solid var(--line); }
  .reverse-basic-grid { grid-template-columns: 1fr; }
  .reverse-basic-grid .proxy-switch, .reverse-trust-proxy { grid-column: auto; }
  .reverse-port-setup, .strm-output-playback-grid { grid-template-columns: 1fr; }
  .reverse-port-card, .reverse-auto-status, .reverse-web-switch { min-height: 0; }
  .reverse-path-generator > div, .reverse-path-test > div { flex-wrap: wrap; }
  .reverse-path-converter > summary.reverse-legacy-head { display: grid; grid-template-columns: 40px minmax(0, 1fr) 20px; }
  .reverse-legacy-icon { grid-row: 1 / span 2; }
  .reverse-legacy-head > div { grid-column: 2; grid-row: 1; }
  .reverse-legacy-state { grid-column: 2; grid-row: 2; justify-self: start; }
  .reverse-path-converter > summary > .ui-icon:last-child { grid-column: 3; grid-row: 1 / span 2; }
  .reverse-legacy-action > div { flex-wrap: wrap; }
  .reverse-legacy-action input, .reverse-legacy-action .button { flex-basis: 100%; width: 100%; }
  .reverse-path-generator > div > input, .reverse-path-generator > div > textarea, .reverse-path-test > div > input { flex-basis: 100%; }
  .reverse-path-generator > div > .button, .reverse-path-test > div > .button { width: 100%; }
  .reverse-map-row, .reverse-map-row.reverse-content-row { grid-template-columns: minmax(0, 1fr) 38px; }
  .reverse-map-row > input, .reverse-map-row > select, .reverse-map-row > .ui-select { grid-column: 1; }
  .reverse-map-row > .icon-command { grid-column: 2; grid-row: 1; }
  .reverse-subhead { align-items: stretch; flex-direction: column; }
  .reverse-subhead .button { width: 100%; }
  .reverse-endpoints > div { grid-template-columns: 1fr; }
  .reverse-endpoints small { grid-column: auto; }
  .reverse-actionbar { grid-template-columns: 1fr; }
  .reverse-log-filter { grid-template-columns: 1fr; }
  .reverse-log-filter .button, .reverse-log-filter > a { width: 100%; }
  .reverse-log-table { min-width: 0; }
  .reverse-log-table thead { display: none; }
  .reverse-log-table tbody, .reverse-log-table tr, .reverse-log-table td { display: block; }
  .reverse-log-table tr { padding: 13px 14px; border-top: 1px solid var(--line); }
  .reverse-log-table tr:first-child { border-top: 0; }
  .reverse-log-table td { max-width: none; min-width: 0; padding: 5px 0; display: grid; grid-template-columns: 82px minmax(0, 1fr); align-items: start; gap: 8px; border: 0; }
  .reverse-log-table td::before { color: var(--muted); font-size: 13px; font-weight: 750; }
  .reverse-log-table td:nth-child(1)::before { content: '时间'; }
  .reverse-log-table td:nth-child(2)::before { content: 'EMBY'; }
  .reverse-log-table td:nth-child(3)::before { content: '方法'; }
  .reverse-log-table td:nth-child(4)::before { content: '请求路径'; }
  .reverse-log-table td:nth-child(5)::before { content: '状态'; }
  .reverse-log-table td:nth-child(6)::before { content: '处理方式'; }
  .reverse-log-table td:nth-child(7)::before { content: '缓存'; }
  .reverse-log-table td:nth-child(8)::before { content: '耗时'; }
  .reverse-log-table td:nth-child(9)::before { content: '客户端 / 详情'; }
  .file-sourcebar { align-items: stretch; flex-direction: column; gap: 9px; }
  .file-source-tabs { width: 100%; display: flex; gap: 6px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .file-source-tabs::-webkit-scrollbar { display: none; }
  .file-source-tabs a { width: 100%; min-width: 100%; flex: 0 0 100%; scroll-snap-align: start; scroll-snap-stop: always; }
  .file-manager-empty { min-width: 0; padding-inline: 16px; }
  .file-manager-empty p, .file-manager-empty code { max-width: 100%; overflow-wrap: anywhere; word-break: break-word; white-space: normal; }
  .file-provider-state { justify-content: flex-start; }
  .file-toolbar { flex-wrap: wrap; }
  .file-breadcrumb { order: 3; width: 100%; flex-basis: 100%; min-height: 32px; padding-inline: 2px; }
  .file-search { flex: 1; width: auto; }
  .file-summary { align-items: flex-start; flex-direction: column; gap: 8px; }
  .file-summary code { max-width: 100%; }
  .file-list-head, .file-row { grid-template-columns: 24px minmax(0, 1fr) 20px 18px; gap: 9px; padding-inline: 12px; }
  .file-list-head > :nth-child(3), .file-list-head > :nth-child(4), .file-list-head > :nth-child(5), .file-type, .file-size, .file-row time { display: none; }
  .file-preview { max-height: none; min-height: 320px; }
  .page-head {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: auto auto;
    align-items: start;
    column-gap: 12px;
    row-gap: 8px;
  }
  .page-head > div:first-child { display: contents; }
  .page-head h1 { grid-column: 1; grid-row: 1; align-self: center; margin: 0; }
  .page-head .page-description { grid-column: 1 / -1; grid-row: 2; }
  .recommend-console { left: auto; width: 100%; transform: none; }
  .head-actions { grid-column: 2; grid-row: 1; align-self: start; margin-top: 0; }
  .top-tools { gap: 8px; flex-wrap: nowrap; }
  .page-head:not(.recommend-page-head) { display: flex; flex-wrap: wrap; }
  .page-head:not(.recommend-page-head) h1 { flex: 1 0 auto; max-width: 100%; }
  .page-head:not(.recommend-page-head) .head-actions { flex: 0 0 auto; }
  .page-head:not(.recommend-page-head) .page-description { order: 1; flex: 0 0 100%; }
  .form-grid { grid-template-columns: 1fr; }
  .field.full { grid-column: auto; }
  .log-overview { padding: 16px; }
  .log-overview-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .log-overview-metrics > div { min-height: 62px; padding: 8px 12px; }
  .log-overview-metrics > div:nth-child(3) { border-left: 0; }
  .log-overview-metrics > div:nth-child(n + 3) { border-top: 1px solid var(--line); }
  .log-level-tabs { min-height: 62px; grid-template-columns: repeat(var(--log-level-count, 5), minmax(0, 1fr)); gap: 4px; }
  .log-level-tab { padding: 7px 4px; grid-template-columns: 1fr; justify-items: center; gap: 4px; text-align: center; }
  .log-level-tab-icon, .log-level-tab small { display: none; }
  .log-level-tab > span:nth-child(2) { display: block; }
  .log-level-tab strong { font-size: 13px; }
  .log-level-tab em { min-width: 24px; height: 21px; }
  .log-row { grid-template-columns: 3px minmax(0, 1fr); gap: 10px; }
  .log-toolbar-title { width: 100%; flex-wrap: wrap; }
  .log-toolbar-title .log-connection { margin-left: auto; }
  .log-live-controls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .log-live-controls > form, .log-live-controls > form .button, .log-live-controls > button { width: 100%; }
  .log-follow-toggle { min-height: 40px; justify-content: center; border: 1px solid var(--line); border-radius: 7px; background: var(--surface); }
  .log-query { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .log-query .log-search, .log-query .log-page-size { grid-column: 1 / -1; }
  .log-query .button { width: 100%; padding: 0 12px; }
  .log-query .log-filter-submit:last-child { grid-column: 1 / -1; }
  .log-query label > span:first-child, .log-query select, .log-query input { font-size: 14px; }
  .log-filter-context { align-items: flex-start; flex-wrap: wrap; font-size: 13px; }
  .log-filter-context strong { flex: 1 1 180px; white-space: normal; }
  .log-filter-context em { margin-left: 0; }
  .log-entry-head { grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 5px 8px; }
  .log-tags { grid-column: 1; grid-row: 1; flex-wrap: wrap; }
  .log-time { grid-column: 1; grid-row: 2; padding-top: 0; font-size: 13px; }
  .log-entry-actions { grid-column: 2; grid-row: 1 / span 2; }
  .log-title { font-size: 15px; }
  .log-detail { font-size: 14px; }
  .log-meta-list span, .log-meta-list code { font-size: 13px; }
  .emby-overview { grid-template-columns: 1fr 1fr; }
  .emby-section-head { align-items: stretch; flex-direction: column; }
  .emby-section-head .button { width: 100%; }
  .member-panel { padding: 16px; }
  .panel-head { align-items: stretch; flex-direction: column; }
  .panel-head .button { width: 100%; }
  .member-registration-path { grid-template-columns: minmax(0, 1fr); }
  .member-registration-path small { grid-column: 1; }
  .panel-actions { width: 100%; }
  .panel-actions > button, .panel-actions form { flex: 1; }
  .panel-actions form .button { width: 100%; }
  .bulk-toolbar { align-items: flex-start; flex-wrap: wrap; }
  .bulk-toolbar > span { margin-right: 0; }
  .bulk-toolbar > div { width: 100%; overflow-x: auto; }
  .pagination-row { align-items: flex-start; flex-direction: column; }
  .portal-columns { grid-template-columns: 1fr; }
  .member-portal-head { padding: 0 16px; }
  .member-portal-head > nav { order: 3; width: 100%; justify-content: center; margin-bottom: 10px; padding: 4px; }
  .member-portal-head > nav a { flex: 1; justify-content: center; gap: 5px; padding-inline: 7px; font-size: 14px; white-space: nowrap; }
  .member-portal-head > nav .portal-nav-icon { width: 15px; height: 15px; }
  .member-portal-head { flex-wrap: wrap; padding-top: 10px; }
  .member-one15-hero { align-items: flex-start; flex-direction: column; padding: 25px; }
  .member-one15-hero-lock { width: 100%; min-width: 0; }
  .member-one15-grid { grid-template-columns: 1fr; }
  .settings-hero { align-items: stretch; flex-direction: column; padding: 24px; }
  .settings-hero-state { min-width: 0; }
  .network-proxy-head { align-items: flex-start; flex-wrap: wrap; }
  .network-proxy-head .proxy-switch { width: 100%; margin-left: 0; }
  .network-proxy-fields { grid-template-columns: 1fr; }
  .network-proxy-fields .settings-form-actions { padding-top: 0; }
  .settings-side { grid-template-columns: 1fr; }
  .clouddrive-settings-fields { grid-template-columns: 1fr; }
  .clouddrive-webhook-address { grid-template-columns: 1fr; }
  .clouddrive-webhook-address form .button { width: 100%; min-height: 44px; }
  .clouddrive-webhook-configuration summary { padding: 9px 11px; gap: 8px; }
  .clouddrive-webhook-configuration summary > span { gap: 8px; }
  .clouddrive-webhook-configuration summary b { font-size: 12px; }
  .clouddrive-webhook-configuration > div { padding: 0 10px 10px; }
  .clouddrive-webhook-configuration textarea { min-height: 280px; max-height: 52vh; resize: none; }
  .clouddrive-webhook-configuration .button { width: 100%; justify-self: stretch; }
  .clouddrive-webhook-panel .copy-field { grid-template-columns: minmax(0, 1fr); }
  .clouddrive-webhook-panel .copy-field .button { width: 100%; }
  .qbittorrent-credential-grid { grid-template-columns: 1fr; }
  .qbittorrent-mapping-form, .qbittorrent-pipeline-advanced { grid-template-columns: 1fr; }
  .qbittorrent-mapping-form .checkbox, .qbittorrent-mapping-form .button { width: 100%; }
  .license-settings-head { align-items: flex-start; flex-wrap: wrap; padding: 18px 16px; }
  .license-settings-head .license-status-pill { margin-left: 66px; }
  .license-settings-overview { grid-template-columns: 1fr; padding: 14px 16px; }
  .license-settings-facts { grid-template-columns: 1fr; }
  .license-entitlement-strip { margin-inline: 16px; grid-template-columns: 1fr; }
  .license-feature-tags { justify-content: flex-start; }
  .license-device-strip { margin-inline: 16px; align-items: flex-start; flex-wrap: wrap; }
  .license-device-strip > em { margin-left: 47px; }
  .license-settings-form { margin-inline: 16px; padding: 14px; }
  .license-settings-input-row { grid-template-columns: 1fr; gap: 9px; }
  .license-settings-input-row .button { width: 100%; }
  .settings-inline-actions { justify-content: stretch; }
  .settings-inline-actions form, .settings-inline-actions .button { flex: 1; width: 100%; }
  .archive-toolbar { align-items: flex-start; flex-direction: column; padding-bottom: 12px; }
  .archive-tabs { min-height: 48px; }
  .archive-runtime-overview { grid-template-columns: 1fr 1fr; }
  .archive-flow-band { grid-template-columns: 1fr; justify-content: stretch; gap: 8px; }
  .archive-flow-band > div { min-width: 0; }
  .archive-flow-band > i { display: none; }
  .archive-candidate-card { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .archive-candidate-card > .archive-candidate-poster { display: none; }
  .archive-job-card { grid-template-columns: 52px minmax(0, 1fr); gap: 12px; }
  .archive-candidate-poster { width: 52px; }
  .archive-candidate-actions { grid-column: 1 / -1; justify-self: center; }
  .archive-candidate-actions .button { padding-inline: 10px; }
  .archive-job-card > form { grid-column: 1 / -1; justify-content: flex-start; }
  .archive-candidate-delete-menu { position: fixed; top: auto; right: 12px; bottom: 12px; left: 12px; width: auto; }
  .archive-candidate-detail dl { grid-template-columns: 1fr; }
  .archive-candidate-meta code { max-width: 100%; }
  .archive-job-state { grid-column: 1 / -1; }
  .archive-job-main { grid-column: 1 / -1; }
  .archive-policy-navigation { margin-bottom: 16px; padding: 4px; gap: 4px; }
  .archive-policy-navigation a { min-height: 52px; padding: 8px; grid-template-columns: 30px minmax(0, 1fr); gap: 7px; }
  .archive-policy-navigation a > span:first-child { width: 30px; height: 30px; }
  .archive-policy-navigation a > span:first-child .ui-icon { width: 16px; height: 16px; }
  .archive-policy-navigation small, .archive-policy-navigation em { display: none; }
  .archive-policy-navigation strong { font-size: 13px; text-align: center; }
  .archive-list-head { align-items: stretch; flex-direction: column; }
  .archive-list-head .button { width: 100%; }
  .archive-queue-complete { padding: 15px; }
  .archive-queue-complete-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .archive-queue-complete-foot { align-items: stretch; flex-direction: column; }
  .archive-queue-complete-foot .button { width: 100%; justify-content: center; }
  .archive-bulk-confirm-summary { margin-inline: 15px; }
  .archive-list-card { grid-template-columns: 42px minmax(0, 1fr); padding: 15px; }
  .archive-list-icon { width: 42px; height: 42px; }
  .archive-list-actions { grid-column: 1 / -1; justify-content: flex-end; padding-top: 10px; border-top: 1px solid var(--line); }
  .archive-editor-section { padding: 18px 15px; }
  .archive-editor-title { grid-template-columns: 40px minmax(0, 1fr); }
  .archive-editor-title > span { width: 40px; height: 40px; }
  .archive-toggle { grid-column: 1 / -1; }
  .archive-config-title { grid-template-columns: 1fr; }
  .archive-config-heading { grid-template-columns: 40px minmax(0, 1fr) 28px; }
  .archive-config-icon { width: 40px; height: 40px; }
  .archive-config-title .archive-toggle { margin-top: 8px; }
  .archive-editor-title > [data-path-rule-add] { grid-column: 1 / -1; width: 100%; }
  .archive-operation-grid, .archive-operation-grid-six { grid-template-columns: 1fr; }
  .archive-choice-grid-two { grid-template-columns: 1fr; }
  .archive-webhook-panel { grid-template-columns: 38px minmax(0, 1fr); align-items: start; }
  .archive-webhook-panel .archive-webhook-value { grid-column: 1 / -1; width: 100%; min-width: 0; grid-template-columns: 1fr; align-items: stretch; }
  .archive-webhook-panel code, .archive-webhook-panel .button { width: 100%; max-width: 100%; }
  .archive-asset-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .archive-inline-row { align-items: stretch; flex-direction: column; gap: 5px; }
  .archive-inline-row .field, .archive-conflict-field { width: 100%; max-width: none; }
  .archive-category-rules .archive-subsection-head { flex-wrap: wrap; }
  .archive-category-rules .archive-subsection-head > button { width: 100%; margin-left: 0; }
  .archive-path-rule, .archive-path-rule.has-style { grid-template-columns: 28px minmax(0, 1fr); align-items: start; }
  .archive-path-rule-order { grid-row: 1 / 3; }
  .archive-path-rule .field { grid-column: 2; }
  .archive-path-rule-actions { grid-column: 2; justify-content: flex-end; }
  .archive-path-rule > p { grid-column: 2; }
  .archive-editor-actions { padding: 15px; }
  .archive-editor-actions .button { flex: 1; }
  .archive-history-row { grid-template-columns: 28px minmax(0, 1fr) 36px; }
  .archive-history-row time { grid-column: 2; }
  .archive-history-more { grid-column: 3; grid-row: 1 / 3; }
  .archive-history-entry > .archive-episode-details { margin-left: 14px; }
  .archive-episode-details > summary { grid-template-columns: minmax(0, 1fr) 20px; }
  .archive-episode-details > summary small { grid-column: 1; grid-row: 2; }
  .archive-episode-details > summary i { grid-column: 2; grid-row: 1 / 3; }
  .archive-episode-item { grid-template-columns: 9px minmax(0, 1fr) auto; }
  .archive-episode-item > b { grid-column: 3; grid-row: 1; }
  .archive-episode-actions { grid-column: 2 / -1; justify-content: flex-start; }
  .archive-media-type-choice { grid-template-columns: 1fr; }
  .main.recommend-main { overflow: visible; }
  .main.recommend-main .recommend-page-head { min-height: 40px; }
  .recommend-hero { min-height: 0; margin-top: -14px; }
  .recommend-hero-layers { top: calc(-72px - var(--page-gutter)); bottom: auto; height: 310px; }
  .recommend-hero-layer { inset: -2%; width: 104%; height: 104%; filter: saturate(.72) contrast(1.04) brightness(.75); }
  .recommend-hero-overlay { background: linear-gradient(180deg, rgba(5,9,17,.48) 0%, rgba(5,9,17,.42) 30%, rgba(5,9,17,.72) 62%, rgba(5,9,17,.94) 84%, var(--bg) 100%), linear-gradient(90deg, rgba(5,9,17,.72), rgba(5,9,17,.24) 72%, rgba(5,9,17,.52)); }
  .recommend-hero-copy { min-height: 188px; padding: 0 0 18px; }
  .recommend-hero-copy > span { font-size: 13px; letter-spacing: .16em; }
  .recommend-hero-copy h2 { margin-top: 5px; font-size: 27px; }
  .recommend-hero-copy p { max-width: 92%; font-size: 14px; line-height: 1.5; }
  .recommend-mobile-filter-bar {
    position: relative; z-index: 2; min-height: 50px; padding: 6px 0 8px; display: flex; align-items: center; gap: 9px;
    border-top: 1px solid rgba(255,255,255,.1);
  }
  .recommend-mobile-filter-bar > button {
    min-height: 38px; padding: 0 13px; flex: 0 0 auto; display: inline-flex; align-items: center; gap: 7px;
    border: 1px solid rgba(255,255,255,.2); border-radius: 12px; color: #fff; background: rgba(8,13,24,.58);
    box-shadow: 0 7px 22px rgba(0,0,0,.15); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); font: inherit; cursor: pointer;
  }
  .recommend-mobile-filter-bar > button .ui-icon { width: 16px; height: 16px; }
  .recommend-mobile-filter-bar > button b { font-size: 14px; }
  .recommend-mobile-filter-bar > button em { min-width: 18px; height: 18px; padding: 0 5px; display: grid; place-items: center; border-radius: 99px; color: #fff; background: var(--primary); font-size: 13px; font-style: normal; }
  .recommend-mobile-filter-bar > div { min-width: 0; display: flex; align-items: center; gap: 6px; overflow: hidden; }
  .recommend-mobile-filter-bar > div span, .recommend-mobile-filter-bar > div em {
    min-height: 27px; padding: 0 9px; display: inline-flex; align-items: center; flex: 0 0 auto; overflow: hidden;
    border: 1px solid rgba(255,255,255,.12); border-radius: 99px; color: rgba(255,255,255,.84); background: rgba(8,13,24,.38);
    font-size: 13px; font-style: normal; font-weight: 750; text-overflow: ellipsis; white-space: nowrap;
  }
  .recommend-mobile-filter-bar > div span.is-default { color: rgba(255,255,255,.64); }
  .recommend-filter-scrim {
    position: fixed; inset: 0; z-index: 68; width: 100%; height: 100%; padding: 0; display: block; border: 0;
    background: rgba(3,6,12,.56); opacity: 0; pointer-events: none; transition: opacity .22s ease; backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px);
  }
  .recommend-filter-panel {
    position: fixed; right: 10px; bottom: max(10px, env(safe-area-inset-bottom)); left: 10px; z-index: 69;
    width: auto; max-height: min(78dvh, 680px); margin: 0; padding: 0 16px calc(14px + env(safe-area-inset-bottom)); display: block; overflow: auto;
    border: 1px solid color-mix(in srgb, var(--line) 78%, transparent); border-radius: 24px;
    color: var(--text); background: color-mix(in srgb, var(--surface) 96%, transparent); box-shadow: 0 24px 70px rgba(0,0,0,.32);
    overscroll-behavior: contain; transform: translateY(calc(100% + 120px)); transition: transform .26s cubic-bezier(.2,.78,.2,1);
    backdrop-filter: blur(24px) saturate(135%); -webkit-backdrop-filter: blur(24px) saturate(135%);
  }
  .recommend-filter-sheet-head {
    position: sticky; top: 0; z-index: 2; min-height: 76px; margin: 0 -16px 4px; padding: 13px 14px 11px 17px;
    display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--line);
    background: color-mix(in srgb, var(--surface) 94%, transparent); backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px);
  }
  .recommend-filter-sheet-head > div:first-child { min-width: 0; display: grid; gap: 2px; }
  .recommend-filter-sheet-head small { color: var(--primary); font-size: 12px; font-weight: 900; letter-spacing: .15em; }
  .recommend-filter-sheet-head strong { font-size: 17px; line-height: 1.2; }
  .recommend-filter-sheet-head span { color: var(--muted); font-size: 13px; }
  .recommend-filter-sheet-head > div:last-child { display: flex; align-items: center; gap: 5px; }
  .recommend-filter-sheet-head a { min-height: 34px; padding: 0 9px; color: var(--muted); font-size: 13px; font-weight: 750; }
  .recommend-filter-sheet-head button { width: 36px; height: 36px; padding: 0; display: grid; place-items: center; border: 0; border-radius: 11px; color: var(--text); background: var(--surface-soft); cursor: pointer; }
  .recommend-filter-sheet-head button .ui-icon { width: 17px; height: 17px; }
  .recommend-filter-panel > .recommend-filter-group {
    min-height: 0; padding: 11px 0; display: grid; grid-template-columns: 36px max-content minmax(0, 1fr); align-items: start; gap: 7px;
    border-bottom: 1px solid color-mix(in srgb, var(--line) 72%, transparent);
  }
  .recommend-filter-panel > .recommend-filter-group:last-child { border-bottom: 0; }
  .recommend-filter-group-label { min-height: 27px; display: inline-flex; align-items: center; color: var(--muted); font-size: 13px; font-weight: 800; }
  .recommend-filter-panel > .recommend-filter-group > div { min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
  .recommend-filter-panel a, .recommend-filter-panel > div > .recommend-filter-default {
    min-height: 27px; padding: 0 9px; display: inline-flex; align-items: center; border: 1px solid transparent; border-radius: 9px;
    color: var(--muted); background: var(--surface-soft); font-size: 13px; font-weight: 720; white-space: nowrap;
  }
  .recommend-filter-panel a:hover, .recommend-filter-panel a.active,
  .recommend-filter-panel > div > .recommend-filter-default:hover,
  .recommend-filter-panel > div > .recommend-filter-default.active {
    border-color: color-mix(in srgb, var(--primary) 34%, transparent); color: var(--primary); background: var(--primary-soft); font-weight: 850;
  }
  .recommend-filter-panel > div > .recommend-filter-default, .recommend-filter-panel > div > .recommend-filter-default.active { width: auto; border-left-width: 1px; }
  .recommend-channel-row { margin-top: 0; padding-block: 11px !important; }
  .recommend-no-channels { min-height: 27px; display: inline-flex; align-items: center; color: var(--muted); font-size: 13px; }
  body.recommend-filter-open { overflow: hidden; }
  body.recommend-filter-open .recommend-hero { z-index: 60; }
  body.recommend-filter-open .recommend-filter-scrim { opacity: 1; pointer-events: auto; }
  body.recommend-filter-open .recommend-filter-panel { transform: translateY(0); }
  .recommend-console { min-height: calc(100vh - 290px); padding: 9px 0 28px; gap: 12px; }
  .recommend-search { grid-template-columns: minmax(0, 1fr) 42px; gap: 7px; }
  .recommend-shortcuts { grid-column: 1 / -1; gap: 7px; }
  .recommend-shortcuts > .button { flex: 1; min-width: 0; min-height: 42px; padding: 0 10px; border-radius: 12px; font-size: 13px; }
  .recommend-shortcuts .ui-icon { width: 14px; height: 14px; }
  .recommend-search input { min-width: 0; min-height: 42px; padding-inline: 13px; font-size: 14px; }
  .recommend-search > button { width: 42px; min-width: 42px; min-height: 42px; padding: 0; display: grid; place-items: center; border-radius: 12px; }
  .recommend-search > button .ui-icon { width: 17px; height: 17px; }
  .recommend-search > button span, .recommend-search-reset { display: none; }
  .recommendation-subscription-library { min-height: 42px; padding: 0 10px; gap: 5px; border-radius: 12px; font-size: 13px; }
  .recommendation-subscription-library .ui-icon { width: 14px; height: 14px; }
  .recommend-status-line { min-height: 32px; gap: 6px; font-size: 13px; }
  .recommend-status-line span { padding: 5px 8px; }
  .recommend-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px 10px; }
  .recommend-pagination-controls { width: 100%; justify-content: center; flex-wrap: wrap; }
  .recommend-poster { border-radius: 10px; }
  .recommend-channel-search-button, .recommend-subscribe-button {
    width: 42px; height: 42px; bottom: 8px; opacity: 1; transform: none; touch-action: manipulation;
    border-color: rgba(255,255,255,.72); background: rgba(5,8,14,.78); box-shadow: 0 7px 18px rgba(0,0,0,.28);
    backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  }
  .recommend-channel-search-button { left: 8px; }
  .recommend-subscribe-button { right: 8px; }
  .recommend-channel-search-button .ui-icon, .recommend-subscribe-button .ui-icon { width: 18px; height: 18px; }
  .recommendation-detail-body { grid-template-columns: 1fr; }
  .recommendation-detail-video, .recommendation-detail-video iframe, .recommendation-detail-video > img { min-height: 0; aspect-ratio: 16 / 9; }
  .recommendation-detail-info { padding: 20px; }
  .recommendation-detail-hero { min-height: 0; }
  .recommendation-detail-hero-inner { width: min(100% - 36px, 620px); min-height: 0; padding: 92px 0 38px; grid-template-columns: 1fr; gap: 28px; }
  .recommendation-detail-hero-primary { align-items: flex-start; gap: 15px; transform: none; }
  .recommendation-detail-poster { width: 124px; }
  .recommendation-detail-hero-copy h1 { font-size: 28px; }
  .recommendation-detail-hero-video { width: 100%; }
  .recommendation-detail-section { width: min(100% - 36px, 620px); padding-top: 27px; }
  .recommendation-related-columns { width: min(100% - 36px, 620px); grid-template-columns: 1fr; gap: 0; padding-top: 0; }
  .recommendation-detail-section-head h2 { font-size: 17px; }
  .recommendation-detail-section-head { align-items: flex-start; flex-direction: column; }
  .recommendation-library-legend { margin-left: 0; justify-content: flex-start; }
  .recommendation-season-row { grid-template-columns: 58px minmax(0, 1fr); }
  .recommendation-season-actions { grid-column: 2; justify-content: flex-end; }
  .recommendation-episode-panel, .recommendation-season-resources { margin-left: 13px; }
  .recommendation-episode-paths > div { grid-template-columns: 1fr; gap: 2px; }
  .recommendation-season-episode-map { grid-template-columns: 1fr; gap: 8px; }
  .recommendation-season-episode-label { padding-top: 0; }
  .telegram-channel-result.recommendation-season-resource { align-items: stretch; flex-direction: column; }
  .recommendation-season-resource .telegram-channel-links { justify-content: flex-start; }
  .telegram-channel-excerpt { white-space: normal; }
  .recommendation-cast-grid, .recommendation-related-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 460px) {
  .member-portal-head > nav { justify-content: flex-start; overflow-x: auto; scrollbar-width: none; }
  .member-portal-head > nav::-webkit-scrollbar { display: none; }
  .member-portal-head > nav a { min-width: max-content; flex: 0 0 auto; padding-inline: 11px; font-size: 13px; }
  .member-request-identifiers { grid-template-columns: 1fr; }
  .member-request-title, .media-request-title { flex-direction: column; gap: 7px; }
  .member-request-title time, .media-request-title time { order: -1; }
  .media-request-admin-card > header { flex-direction: column; }
  .media-request-card-badges { justify-content: flex-start; }
  .media-request-admin-search { align-items: stretch; flex-wrap: wrap; }
  .media-request-admin-search label { flex-basis: 100%; }
  .media-request-admin-search .button { flex: 1; }
  .media-request-admin-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .media-request-admin-actions > span { grid-column: 1 / -1; }
  .media-request-admin-actions .button { width: 100%; min-width: 0; padding-inline: 10px; }
  .recommend-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 10px; }
  .log-overview { padding: 15px 14px; gap: 14px; }
  .log-overview-copy p { font-size: 13px; }
  .log-overview-metrics > div { min-height: 66px; padding: 8px; grid-template-columns: 32px minmax(0, 1fr); gap: 8px; }
  .log-overview-icon { width: 32px; height: 32px; }
  .log-toolbar { padding: 15px 14px; }
  .log-toolbar-title > div { width: 100%; }
  .log-toolbar-title .log-connection { width: auto; margin-left: 0; justify-content: center; }
  .log-filter-bar { padding: 12px; }
  .log-query { grid-template-columns: 1fr; }
  .log-query label, .log-query .log-search, .log-query .log-page-size, .log-query .button { grid-column: 1; }
  .log-query .button { width: 100%; }
  .log-row { padding: 13px 14px; }
  .log-pagination { padding: 12px 14px; }
  .stats-grid { grid-template-columns: 1fr; }
  .auth-page { padding: 16px; }
  .auth-card { padding: 22px; }
  .login-page { padding: 16px 14px; }
  .login-card { width: 100%; padding: 30px 22px 23px; border-radius: 18px; }
  .login-brand { margin-bottom: 24px; }
  .login-brand > span { font-size: 25px; }
  .login-logo { width: 64px; height: 64px; border-radius: 18px; }
  .login-form { gap: 15px; }
  .login-form input:not([type="checkbox"]), .login-submit { min-height: 49px; }
  .avatar-editor { align-items: flex-start; }
  .avatar-preview { width: 70px; height: 70px; }
  .tool-icon { width: 38px; height: 38px; }
  .network-row { grid-template-columns: 42px minmax(0, 1fr) 40px; gap: 9px; }
  .network-name strong { font-size: 14px; line-height: 1.25; }
  .network-footer { align-items: stretch; flex-direction: column; }
  .emby-overview { grid-template-columns: 1fr; }
  .emby-overview > div, .emby-add-card { min-height: 96px; }
  .emby-card { padding: 16px; }
  .emby-card-top { align-items: stretch; flex-direction: column; }
  .emby-state { width: max-content; }
  .emby-details { grid-template-columns: 1fr; }
  .emby-details > div { padding: 9px 0; }
  .emby-card-actions { align-items: stretch; display: grid; grid-template-columns: 1fr 1fr; }
  .emby-card-actions form, .emby-card-actions button { width: 100%; }
  .member-stats { grid-template-columns: 1fr; }
  .account-create-grid { grid-template-columns: 1fr; padding: 18px 18px 6px; }
  .dialog-actions { padding: 14px 18px 18px; }
  .member-account-dialog { width: calc(100vw - 20px); }
  .member-account-head .panel-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .member-sync-restore { margin: 0 0 14px; grid-template-columns: 34px minmax(0, 1fr); padding: 13px; }
  .member-sync-restore > span { width: 34px; height: 34px; }
  .member-sync-restore form { grid-column: 1 / -1; }
  .member-sync-restore .button { width: 100%; }
  .member-account-hero { margin: 0 0 18px; padding: 20px; align-items: stretch; flex-direction: column; }
  .member-account-hero .panel-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .member-list-head { align-items: flex-start; flex-direction: column; }
  .member-filter { grid-template-columns: 1fr; }
  .member-filter .button, .member-filter > a { width: 100%; }
  .member-user-card { grid-template-columns: 1fr; gap: 14px; }
  .member-user-details { grid-template-columns: 1fr; padding: 2px 0; }
  .member-user-details > div, .member-user-details > div:first-child, .member-user-details > div:last-child { padding: 10px 0; border-left: 0; border-top: 1px solid var(--line); }
  .member-user-details > div:first-child { border-top: 0; }
  .member-user-actions { display: grid; grid-column: auto; grid-template-columns: repeat(2, minmax(0, 1fr)); padding-top: 0; border-top: 0; }
  .member-user-actions .button, .member-user-actions form, .member-user-actions form .button { width: 100%; }
  .member-delete-dialog { width: calc(100vw - 20px); }
  .member-delete-body { padding: 16px 16px 4px; }
  .member-delete-choice { grid-template-columns: 34px minmax(0, 1fr); padding: 12px; }
  .member-delete-choice-icon { width: 34px; height: 34px; }
  .member-delete-choice .button { grid-column: 1 / -1; width: 100%; min-width: 0; }
  .member-playback-dialog { width: calc(100vw - 20px); }
  .member-playback-dialog-body { padding: 16px 16px 4px; }
  .member-playback-options { grid-template-columns: 1fr; }
  .member-playback-option > span { min-height: 72px; }
  .member-playback-circuit-controls { grid-template-columns: 1fr; }
  .member-playback-circuit > header { grid-template-columns: 34px minmax(0, 1fr); }
  .member-playback-circuit > header em { grid-column: 1 / -1; justify-self: start; }
  .code-create { grid-template-columns: 1fr; }
  .code-summary, .code-filter, .merchant-grid { grid-template-columns: 1fr; }
  .code-summary a { min-height: 64px; }
  .merchant-layout { display: block; }
  .merchant-grid { margin-top: 14px; }
  .communication-layout { display: block; }
  .broadcast-list, .message-list { margin-top: 14px; }
  .broadcast-card, .message-card { padding: 14px; }
  .broadcast-meta, .message-meta { align-items: flex-start; flex-wrap: wrap; }
  .broadcast-meta time, .message-meta time { width: 100%; margin-left: 0; }
  .broadcast-card, .message-card { flex-wrap: wrap; }
  .communication-delete { width: 100%; display: flex; justify-content: flex-end; }
  .media-request-summary { display: flex; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none; }
  .media-request-summary::-webkit-scrollbar { display: none; }
  .media-request-summary a { min-width: 132px; flex: 0 0 132px; scroll-snap-align: start; }
  .media-request-admin-card > header { align-items: flex-start; }
  .media-request-admin-form { grid-template-columns: 1fr; }
  .media-request-admin-actions { grid-column: auto; flex-wrap: wrap; }
  .media-request-admin-actions > span { width: 100%; margin-right: 0; }
  .portal-stats { grid-template-columns: 1fr; }
  .member-portal-head > div > span { display: none; }
  .member-portal-head strong { font-size: 14px; }
  .member-portal-head .member-head-avatar { display: none; }
  .portal-hero { min-height: 0; padding: 20px; align-items: stretch; flex-direction: column; }
  .portal-hero h1 { font-size: 27px; }
  .portal-hero .portal-user-avatar { width: 64px; height: 64px; border-radius: 16px; }
  .portal-hero-identity { gap: 14px; }
  .portal-account-link { width: 100%; justify-content: center; }
  .member-request-hero { align-items: flex-start; flex-direction: column; padding: 25px; }
  .member-request-hero-state { width: 100%; min-width: 0; justify-content: flex-start; }
  .member-request-form-card, .member-request-history { padding: 18px; }
  .member-request-history-head { align-items: flex-start; flex-direction: column; }
  .account-page-head { min-height: 0; padding: 20px; align-items: stretch; flex-direction: column; }
  .account-page-head h1 { font-size: 25px; }
  .account-page-identity { gap: 14px; }
  .account-page-identity > img { width: 64px; height: 64px; border-radius: 16px; }
  .account-page-state { width: 100%; }
  .account-card { padding: 18px; }
  .member-avatar-editor { align-items: flex-start; flex-direction: column; }
  .member-one15-connected, .member-one15-empty { align-items: flex-start; flex-wrap: wrap; }
  .member-one15-connected em { margin-left: 64px; }
  .member-one15-qr-layout { padding: 16px; }
  .member-one15-next-step { align-items: flex-start; grid-template-columns: 1fr auto; }
  .member-one15-next-step > span { grid-column: 1 / -1; justify-self: start; }
  .settings-test { grid-template-columns: 1fr !important; }
  .proxy-settings-card { padding: 20px; }
  .settings-section-head { align-items: flex-start; }
  .settings-form-actions .button { width: 100%; }
  .runtime-card { grid-template-columns: 1fr 1fr; }
  .runtime-card > div:nth-child(odd) { border-left: 0; }
  .runtime-card > div:nth-child(n + 3) { border-top: 1px solid var(--line); }
}
@media (max-height: 620px) {
  .login-page { place-items: start center; padding-block: 14px; }
}

@media (min-width: 981px) {
  /* Desktop poster wall is intentionally fixed at ten cards per row. */
  .recommend-grid {
    grid-template-columns: repeat(10, minmax(0, 1fr));
    grid-auto-flow: row;
  }
}

/* STRM generation */
.strm-overview { margin-bottom: 16px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.strm-overview article { min-width: 0; min-height: 104px; padding: 18px 20px; display: grid; align-content: center; gap: 4px; border: 1px solid var(--border-color); border-radius: 12px; background: var(--bg-card); box-shadow: var(--card-shadow); }
.strm-overview span, .strm-overview small { color: var(--muted); font-size: 13px; }
.strm-overview strong { font-size: 28px; line-height: 1.1; }
.strm-service-band { min-height: 66px; margin-bottom: 18px; padding: 12px 16px; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 24px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.strm-service-band > div { display: grid; grid-template-columns: 10px auto; align-items: center; gap: 2px 9px; }
.strm-service-band > div > span { grid-row: 1 / 3; width: 10px; height: 10px; border-radius: 50%; background: var(--warning); box-shadow: 0 0 0 4px color-mix(in srgb, var(--warning) 14%, transparent); }
.strm-service-band > div > span.ready { background: var(--success); box-shadow: 0 0 0 4px color-mix(in srgb, var(--success) 14%, transparent); }
.strm-service-band strong { font-size: 14px; }
.strm-service-band small, .strm-service-band p { color: var(--muted); font-size: 13px; line-height: 1.55; }
.strm-service-band p { margin: 0; justify-self: end; text-align: right; }
.strm-console { border: 1px solid var(--line); border-radius: 8px; background: var(--surface); overflow: hidden; }
.strm-tabs { min-height: 54px; padding: 0 18px; display: flex; align-items: stretch; gap: 26px; border-bottom: 1px solid var(--line); background: var(--surface-soft); }
.strm-tabs a { position: relative; display: grid; place-items: center; color: var(--muted); font-size: 14px; font-weight: 750; }
.strm-tabs a.active { color: var(--primary); }
.strm-tabs a.active::after { position: absolute; right: 0; bottom: -1px; left: 0; height: 2px; content: ''; background: var(--primary); }
.strm-console-body { padding: 22px; }
.strm-section-head { min-height: 50px; margin-bottom: 16px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.strm-section-head h2 { margin: 0 0 4px; font-size: 18px; }
.strm-section-head p { margin: 0; color: var(--muted); font-size: 13px; }
.strm-section-head select { min-width: 190px; }
.strm-task-list { display: grid; gap: 12px; }
.strm-task-card { min-width: 0; padding: 17px; display: grid; grid-template-columns: minmax(0, 1fr) 190px; gap: 17px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); transition: border-color .18s ease, box-shadow .18s ease; }
.strm-task-card:hover { border-color: color-mix(in srgb, var(--primary) 36%, var(--line)); box-shadow: 0 8px 22px color-mix(in srgb, var(--text) 7%, transparent); }
.strm-task-state { grid-column: 1 / -1; width: max-content; display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 13px; }
.strm-task-state > span { width: 8px; height: 8px; border-radius: 50%; background: #a7b0bd; }
.strm-task-state.success > span { background: var(--success); }
.strm-task-state.warning > span { background: var(--warning); }
.strm-task-state.danger > span { background: var(--danger); }
.strm-task-state.running > span { background: var(--primary); box-shadow: 0 0 0 4px var(--primary-soft); }
.strm-task-main { min-width: 0; }
.strm-task-title { display: flex; align-items: center; gap: 12px; }
.strm-task-icon { width: 38px; height: 38px; flex: 0 0 38px; display: grid; place-items: center; border-radius: 8px; color: white; background: var(--primary); font-size: 14px; font-weight: 900; }
.strm-task-title h2 { margin: 0 0 3px; font-size: 16px; }
.strm-task-title p { margin: 0; color: var(--muted); font-size: 13px; }
.strm-path-flow { margin: 15px 0 12px 50px; display: grid; grid-template-columns: minmax(0, 1fr) 20px minmax(0, 1fr); align-items: center; gap: 8px; }
.strm-path-flow > div { min-width: 0; padding: 9px 11px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface-soft); }
.strm-path-flow small, .strm-path-flow code { display: block; }
.strm-path-flow small { margin-bottom: 3px; color: var(--muted); font-size: 13px; }
.strm-path-flow code { overflow: hidden; color: var(--text); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.strm-path-flow > i { color: var(--muted); font-style: normal; text-align: center; }
.strm-task-meta { margin-left: 50px; display: flex; flex-wrap: wrap; gap: 6px; }
.strm-task-meta span { padding: 4px 7px; border-radius: 4px; color: var(--muted); background: var(--surface-soft); font-size: 13px; }
.strm-task-result { padding-left: 17px; display: grid; align-content: space-between; border-left: 1px solid var(--line); }
.strm-task-result > div:first-child span, .strm-task-result > div:first-child strong { display: block; }
.strm-task-result > div:first-child span { color: var(--muted); font-size: 13px; }
.strm-task-result > div:first-child strong { margin-top: 4px; font-size: 14px; }
.strm-result-numbers { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.strm-result-numbers span { color: var(--muted); font-size: 13px; text-align: center; }
.strm-result-numbers b { display: block; margin-bottom: 2px; color: var(--text); font-size: 15px; }
.strm-card-actions { display: flex; justify-content: flex-end; gap: 6px; }
.strm-card-actions form { margin: 0; }
.strm-history-list, .strm-index-list { border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.strm-history-row { min-height: 68px; padding: 11px 14px; display: grid; grid-template-columns: 30px minmax(0, 1fr) auto 130px; align-items: center; gap: 12px; border-bottom: 1px solid var(--line); }
.strm-history-row:last-child, .strm-index-row:last-child { border-bottom: 0; }
.strm-history-row > div, .strm-index-row > div { min-width: 0; }
.strm-history-row strong, .strm-history-row small, .strm-index-row strong, .strm-index-row small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.strm-history-row small, .strm-history-row time, .strm-index-row small, .strm-index-row time { margin-top: 3px; color: var(--muted); font-size: 13px; }
.strm-run-mark { width: 27px; height: 27px; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--primary); font-size: 14px; font-weight: 900; }
.strm-run-mark.completed { background: var(--success); }
.strm-run-mark.failed { background: var(--danger); }
.strm-index-toolbar { display: flex; align-items: center; gap: 9px; }
.strm-index-toolbar form { margin: 0; }
.strm-index-filters { min-height: 42px; padding: 3px; display: inline-flex; align-items: center; gap: 3px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft); }
.strm-index-filters a { min-height: 34px; padding: 0 11px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; border-radius: 7px; color: var(--muted); font-size: 13px; font-weight: 750; white-space: nowrap; }
.strm-index-filters a.active { color: white; background: var(--primary); box-shadow: 0 5px 14px color-mix(in srgb, var(--primary) 22%, transparent); }
.strm-index-filters .ui-icon { width: 15px; height: 15px; }
.strm-index-filters b { min-width: 19px; height: 19px; padding-inline: 5px; display: inline-grid; place-items: center; border-radius: 999px; color: var(--text); background: var(--surface); font-size: 12px; }
.strm-index-filters a.active b { color: var(--primary); background: white; }
.strm-index-bulk { min-height: 52px; margin: 0 0 10px; padding: 7px 9px 7px 13px; display: flex; align-items: center; justify-content: flex-end; gap: 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.strm-index-select-all { margin-right: auto; display: inline-flex; align-items: center; gap: 8px; color: var(--text); font-size: 14px; font-weight: 750; cursor: pointer; }
.strm-index-select-all input, .strm-index-check input { width: 18px; height: 18px; min-height: 18px; margin: 0; flex: 0 0 auto; accent-color: var(--primary); cursor: pointer; }
.strm-index-selection { color: var(--muted); font-size: 13px; font-weight: 700; white-space: nowrap; }
.strm-index-bulk .button { min-height: 36px; }
.strm-index-row { min-height: 62px; padding: 10px 14px; display: grid; grid-template-columns: 24px 58px minmax(0, 1fr) 90px 90px 130px 40px; align-items: center; gap: 12px; border-bottom: 1px solid var(--line); transition: background-color .16s ease; }
.strm-index-row.is-selected { background: color-mix(in srgb, var(--primary) 8%, var(--surface)); }
.strm-index-check { width: 24px; min-height: 36px; display: grid; place-items: center; }
.strm-index-kind { width: max-content; max-width: 58px; padding: 5px 7px; overflow: hidden; border-radius: 4px; color: var(--primary); background: var(--primary-soft); font-size: 13px; font-weight: 850; text-overflow: ellipsis; }
.strm-index-actions { width: 40px; min-width: 40px; margin: 0; display: grid; place-items: center; }
.strm-index-delete { width: 36px; height: 36px; }
.strm-index-delete .ui-icon { width: 16px; height: 16px; }
.strm-editor { overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); box-shadow: var(--shadow); }
.strm-editor-identity { min-height: 166px; padding: 26px 28px; display: grid; grid-template-columns: 42px minmax(360px, 1fr) auto; align-items: center; gap: 18px; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface-soft) 58%, var(--surface)); }
.strm-editor-identity > .icon-command { align-self: start; }
.strm-name-field { min-width: 0; display: grid; gap: 7px; }
.strm-editor-eyebrow { color: var(--primary); font-size: 13px; font-weight: 850; }
.strm-name-field label { font-size: 14px; font-weight: 800; }
.strm-name-field input { width: min(760px, 100%); min-height: 54px; padding-inline: 15px; border-color: color-mix(in srgb, var(--primary) 35%, var(--line)); background: var(--surface); font-size: 18px; font-weight: 750; }
.strm-name-field input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 14%, transparent); }
.strm-name-field small { color: var(--muted); font-size: 13px; }
.strm-identity-status { align-self: stretch; display: grid; align-content: center; justify-items: end; gap: 14px; }
.strm-mode-badge { min-height: 34px; padding: 0 11px; display: inline-flex; align-items: center; gap: 8px; border: 1px solid color-mix(in srgb, var(--success) 25%, var(--line)); border-radius: 6px; color: var(--success); background: var(--success-soft); font-size: 13px; font-weight: 750; }
.strm-mode-badge i, .strm-connection-state i { width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.strm-enable-switch { display: flex; align-items: center; gap: 9px; cursor: pointer; }
.strm-enable-switch input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.strm-enable-switch > span { position: relative; width: 38px; height: 22px; border-radius: 11px; background: color-mix(in srgb, var(--muted) 40%, transparent); transition: background .18s ease; }
.strm-enable-switch > span::after { position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; content: ''; background: white; box-shadow: 0 1px 4px rgba(0,0,0,.24); transition: transform .18s ease; }
.strm-enable-switch input:checked + span { background: var(--success); }
.strm-enable-switch input:checked + span::after { transform: translateX(16px); }
.strm-enable-switch b { font-size: 14px; }
.strm-editor > section { padding: 27px 28px; border-bottom: 1px solid var(--line); }
.strm-editor-title { margin-bottom: 20px; display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 13px; }
.strm-editor-title > span { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 7px; color: var(--primary); background: var(--primary-soft); font-size: 14px; font-weight: 900; }
.strm-editor-title h2 { margin: 0 0 4px; font-size: 18px; }
.strm-editor-title p { margin: 0; color: var(--muted); font-size: 13px; }
.strm-connection-state { min-height: 32px; padding: 0 10px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid var(--line); border-radius: 6px; color: var(--warning); background: var(--surface-soft); font-size: 13px; font-weight: 750; text-decoration: none; }
.strm-connection-state.ready { color: var(--success); }
.strm-path-pipeline { grid-template-columns: minmax(0, 1fr) 34px minmax(0, 1fr); align-items: start; }
.strm-path-arrow { width: 30px; height: 42px; margin-top: 24px; display: grid; place-items: center; color: var(--primary); font-size: 18px; }
.strm-output-playback-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
.strm-output-auto-grid .strm-auto-output-root { height: 100%; margin: 0; align-self: stretch; }
.strm-output-playback-grid .field { min-width: 0; align-content: start; }
.strm-output-playback-grid input, .strm-output-playback-grid select { height: 46px; min-height: 46px; box-sizing: border-box; font: inherit; line-height: 1.25; }
.strm-output-playback-grid .directory-picker-control, .strm-output-playback-grid .strm-emby-select { width: 100%; }
.strm-output-playback-grid .help { min-height: 34px; }
.strm-path-picker-control, .directory-picker-control { position: relative; min-width: 0; display: block; }
.strm-path-picker-control input, .directory-picker-control input { width: 100%; min-width: 0; padding-right: 52px; border-radius: var(--ui-radius-md); cursor: pointer; text-overflow: ellipsis; }
.directory-picker-control.has-clear input { padding-right: 88px; }
.strm-path-picker-control input[readonly], .directory-picker-control input[readonly] { color: var(--text); background: var(--surface-soft); }
.strm-path-picker-control > button, .directory-picker-control > button { position: absolute; top: 4px; right: 4px; bottom: 4px; width: 38px; min-height: 0; padding: 0; display: grid; place-items: center; border: 0; border-radius: calc(var(--ui-radius-md) - 3px); color: var(--primary); background: color-mix(in srgb, var(--primary-soft) 78%, var(--surface)); cursor: pointer; transition: color .16s ease, background-color .16s ease, box-shadow .16s ease; }
.directory-picker-control > .directory-picker-clear { right: 44px; width: 34px; color: var(--muted); background: transparent; }
.directory-picker-control > .directory-picker-clear:hover { color: var(--danger); background: color-mix(in srgb, var(--danger) 10%, var(--surface)); }
.strm-path-picker-control > button:hover, .directory-picker-control > .directory-picker-open:hover { color: white; background: var(--primary); }
.strm-path-picker-control > button:focus-visible, .directory-picker-control > button:focus-visible { outline: none; box-shadow: var(--ui-ring); }
.strm-path-picker-control:focus-within input, .directory-picker-control:focus-within input { border-color: var(--ui-ring-color); box-shadow: var(--ui-ring); }
.strm-path-picker-control .ui-icon, .directory-picker-control .ui-icon { width: 18px; height: 18px; }
.directory-picker-control .directory-picker-clear .ui-icon { width: 15px; height: 15px; }
.strm-folder-dialog { width: min(700px, calc(100vw - 30px)); height: min(660px, calc(100dvh - 42px)); }
.strm-folder-dialog-head { padding: 20px 22px 17px; }
.strm-folder-dialog-head > div { min-width: 0; max-width: calc(100% - 44px); }
.strm-folder-dialog-head .dialog-kicker { display: block; margin-bottom: 5px; color: var(--primary); font-size: 12px; font-weight: 850; letter-spacing: 0; }
.strm-folder-dialog-head h2 { margin: 0; font-size: 19px; }
.strm-folder-dialog-head p { width: 100%; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.strm-folder-toolbar { min-height: 54px; padding: 8px 12px; display: grid; grid-template-columns: 38px 38px minmax(0, 1fr) 38px; align-items: center; gap: 7px; border-bottom: 1px solid var(--line); background: var(--surface-soft); }
.strm-folder-toolbar .icon-command { width: 38px; height: 38px; }
.strm-folder-breadcrumb { min-width: 0; display: flex; align-items: center; gap: 3px; overflow-x: auto; scrollbar-width: none; }
.strm-folder-breadcrumb::-webkit-scrollbar { display: none; }
.strm-folder-breadcrumb > span { flex: 0 0 auto; color: var(--muted); font-size: 13px; }
.strm-folder-breadcrumb button { min-height: 32px; padding: 0 7px; flex: 0 0 auto; border: 0; border-radius: 5px; color: var(--muted); background: transparent; cursor: pointer; font-size: 13px; }
.strm-folder-breadcrumb button:hover, .strm-folder-breadcrumb button[aria-current="page"] { color: var(--text); background: var(--surface); }
.strm-folder-list { min-height: 0; padding: 6px 12px; flex: 1 1 auto; overflow-y: auto; overscroll-behavior: contain; }
.strm-folder-row { width: 100%; min-height: 58px; padding: 8px 10px; display: grid; grid-template-columns: 38px minmax(0, 1fr) 28px; align-items: center; gap: 10px; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; color: var(--text); background: transparent; cursor: pointer; text-align: left; }
.strm-folder-row:hover { background: var(--surface-soft); }
.strm-folder-row.is-readonly { color: var(--muted); }
.strm-folder-mark { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 7px; color: var(--primary); background: var(--primary-soft); }
.strm-folder-mark .ui-icon { width: 19px; height: 19px; }
.strm-folder-row > span:nth-child(2) { min-width: 0; }
.strm-folder-row strong, .strm-folder-row small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.strm-folder-row strong { font-size: 14px; }
.strm-folder-row small { margin-top: 3px; color: var(--muted); font-size: 13px; }
.strm-folder-arrow { display: grid; place-items: center; color: var(--muted); }
.strm-folder-empty { min-height: 180px; display: grid; place-items: center; color: var(--muted); font-size: 14px; text-align: center; }
.strm-folder-empty.is-loading { background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--primary-soft) 52%, transparent), transparent); background-size: 220% 100%; animation: strm-folder-loading 1.4s ease-in-out infinite; }
.strm-folder-empty.is-error { color: var(--danger); }
.strm-folder-footer { min-height: 82px; padding: 12px 16px; display: flex; align-items: center; justify-content: space-between; gap: 14px; border-top: 1px solid var(--line); background: var(--surface-soft); }
.strm-folder-footer > div:first-child { width: 100%; min-width: 0; max-width: 390px; }
.strm-folder-footer span, .strm-folder-footer code { display: block; }
.strm-folder-footer span { margin-bottom: 4px; color: var(--muted); font-size: 13px; }
.strm-folder-footer span.is-writable { color: var(--success); }
.strm-folder-footer span.is-readonly { color: var(--danger); }
.strm-folder-footer code { width: 100%; max-width: min(390px, 48vw); overflow: hidden; color: var(--text); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.strm-folder-footer > div:last-child { display: flex; gap: 8px; }
@keyframes strm-folder-loading { 0% { background-position: 100% 0; } 100% { background-position: -100% 0; } }
.strm-mode-fields { margin-top: 14px; }
.strm-auto-output-root { min-height: 62px; padding: 10px 12px; display: grid; grid-template-columns: 36px minmax(0, 1fr); align-items: center; gap: 11px; border: 1px solid color-mix(in srgb, var(--success) 24%, var(--line)); border-radius: 8px; background: color-mix(in srgb, var(--success-soft) 42%, var(--surface)); }
.strm-auto-output-root > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 7px; color: var(--success); background: var(--success-soft); }
.strm-auto-output-root > span .ui-icon { width: 19px; height: 19px; }
.strm-auto-output-root > div { min-width: 0; display: grid; grid-template-columns: max-content minmax(0, 1fr); align-items: baseline; gap: 3px 10px; }
.strm-auto-output-root small { color: var(--muted); font-size: 12px; font-weight: 750; }
.strm-auto-output-root strong { font-size: 14px; }
.strm-auto-output-root code { min-width: 0; grid-column: 1 / -1; overflow: hidden; color: var(--success); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.strm-field-label { display: flex; align-items: center; gap: 7px; }
.strm-field-action { width: 24px; height: 24px; padding: 0; display: inline-grid; place-items: center; border: 1px solid color-mix(in srgb, #d79b18 35%, var(--line)); border-radius: 50%; color: #d79b18; background: color-mix(in srgb, #f5c451 12%, var(--surface)); cursor: pointer; font-size: 14px; line-height: 1; }
.strm-field-action:hover { border-color: #d79b18; background: color-mix(in srgb, #f5c451 20%, var(--surface)); transform: translateY(-1px); }
.strm-preview-section { background: color-mix(in srgb, var(--surface-soft) 42%, var(--surface)); }
.strm-preview-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-block: 1px solid var(--line); }
.strm-preview-grid > div { min-width: 0; padding: 14px 16px; display: grid; gap: 7px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.strm-preview-grid > div:nth-child(2n), .strm-preview-grid > div.full { border-right: 0; }
.strm-preview-grid > div.full { grid-column: 1 / -1; border-bottom: 0; }
.strm-preview-grid span { color: var(--muted); font-size: 13px; font-weight: 700; }
.strm-preview-grid code { min-width: 0; overflow-wrap: anywhere; color: var(--text); font-size: 14px; line-height: 1.6; white-space: normal; }
.strm-preview-grid > div.full code { color: var(--primary); }
.strm-preview-footer { margin-top: 14px; display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.strm-preview-checks { min-width: 0; display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.strm-preview-checks span { max-width: min(360px, 100%); padding: 5px 8px; overflow: hidden; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); background: var(--surface); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.strm-preview-checks span.ok { color: var(--success); border-color: color-mix(in srgb, var(--success) 28%, var(--line)); background: var(--success-soft); }
.strm-preview-checks span.warning { color: var(--warning, #b7791f); border-color: color-mix(in srgb, var(--warning, #b7791f) 30%, var(--line)); }
.strm-preview-checks span.error { color: var(--danger); border-color: color-mix(in srgb, var(--danger) 30%, var(--line)); }
.strm-preview-status { min-height: 18px; margin-top: 9px; color: var(--muted); font-size: 13px; }
.strm-preview-status.success { color: var(--success); }
.strm-preview-status.warning { color: var(--warning, #b7791f); }
.strm-preview-status.error { color: var(--danger); }
.strm-setting-list { margin: 0 0 18px; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.strm-setting-list label { position: relative; min-height: 60px; padding: 11px 14px 11px 48px; display: grid; align-content: center; border-bottom: 1px solid var(--line); cursor: pointer; }
.strm-setting-list label:last-child { border-bottom: 0; }
.strm-setting-list input { position: absolute; top: 20px; left: 16px; width: 20px; min-height: 20px; }
.strm-setting-list b, .strm-setting-list small { display: block; }
.strm-setting-list b { font-size: 14px; }
.strm-setting-list small { margin-top: 3px; color: var(--muted); font-size: 13px; line-height: 1.45; }
.strm-editor-actions { padding: 18px 24px; display: flex; justify-content: flex-end; gap: 10px; background: var(--surface-soft); }
.strm-task-monitor { margin: 12px 0 0 50px; min-height: 46px; padding: 8px 10px; display: grid; grid-template-columns: 10px minmax(0, 1fr) auto; align-items: center; gap: 9px; border: 1px solid var(--line); border-radius: 7px; background: color-mix(in srgb, var(--success-soft) 42%, var(--surface)); }
.strm-task-monitor strong, .strm-task-monitor small { display: block; }
.strm-task-monitor strong { font-size: 13px; }
.strm-task-monitor small { margin-top: 2px; color: var(--muted); font-size: 13px; }
.strm-monitor-dot { width: 9px; height: 9px; display: inline-block; flex: 0 0 9px; border-radius: 50%; background: var(--muted); }
.strm-monitor-dot.disabled { background: var(--muted); box-shadow: none; }
.strm-monitor-dot.completed, .strm-monitor-dot.idle { background: var(--success); box-shadow: 0 0 0 4px color-mix(in srgb, var(--success) 13%, transparent); }
.strm-monitor-dot.queued, .strm-monitor-dot.processing, .strm-monitor-dot.confirming { background: var(--warning); box-shadow: 0 0 0 4px color-mix(in srgb, var(--warning) 13%, transparent); animation: status-pulse 1.8s ease-in-out infinite; }
.strm-monitor-dot.failed { background: var(--danger); box-shadow: 0 0 0 4px color-mix(in srgb, var(--danger) 13%, transparent); }
.strm-monitor-list { display: grid; gap: 12px; }
.strm-monitor-card { padding: 17px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); transition: border-color .18s ease, box-shadow .18s ease; }
.strm-monitor-card:hover { border-color: color-mix(in srgb, var(--primary) 34%, var(--line)); box-shadow: 0 8px 22px color-mix(in srgb, var(--text) 7%, transparent); }
.strm-monitor-head, .strm-monitor-head > div { display: flex; align-items: center; gap: 11px; }
.strm-monitor-head { justify-content: space-between; }
.strm-monitor-head h3, .strm-monitor-head p { margin: 0; }
.strm-monitor-head h3 { font-size: 14px; }
.strm-monitor-head p { margin-top: 3px; color: var(--muted); font-size: 13px; }
.strm-monitor-metrics { margin: 15px 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-block: 1px solid var(--line); }
.strm-monitor-metrics > div { min-width: 0; padding: 11px 13px; border-right: 1px solid var(--line); }
.strm-monitor-metrics > div:last-child { border-right: 0; }
.strm-monitor-metrics span, .strm-monitor-metrics strong { display: block; }
.strm-monitor-metrics span { color: var(--muted); font-size: 13px; }
.strm-monitor-metrics strong { margin-top: 4px; overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.strm-webhook-endpoint { min-width: 0; padding: 10px 11px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; gap: 9px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-soft); }
.strm-webhook-endpoint > span { color: var(--muted); font-size: 13px; }
.strm-webhook-endpoint code { min-width: 0; overflow: hidden; color: var(--primary); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.strm-webhook-endpoint .button { min-height: 29px; padding: 0 9px; font-size: 13px; }

.emby-events-page { width: 100%; min-width: 0; margin: 0; }
.emby-events-hero { min-height: 134px; margin: 18px 0; padding: 24px 26px; display: flex; justify-content: space-between; gap: 28px; align-items: center; overflow: hidden; border: 1px solid color-mix(in srgb, var(--primary) 18%, var(--line)); border-radius: 12px; background: var(--feature-hero-background); }
.emby-events-hero > div:first-child { max-width: 850px; }
.emby-events-hero > div:first-child > span { color: var(--primary); font-size: 13px; font-weight: 850; letter-spacing: .08em; }
.emby-events-hero h1 { margin: 8px 0 8px; font-size: 30px; }
.emby-events-hero p { max-width: 760px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.65; }
.emby-events-summary { min-width: 250px; padding: 14px 16px; display: grid; grid-template-columns: 44px minmax(0, 1fr); align-items: center; gap: 12px; border: 1px solid color-mix(in srgb, var(--primary) 24%, var(--line)); border-radius: 11px; background: color-mix(in srgb, var(--surface) 84%, transparent); box-shadow: inset 0 1px 0 rgba(255,255,255,.04); }
.emby-events-summary-mark { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 10px; color: var(--primary); background: var(--primary-soft); font-size: 20px; font-weight: 900; }
.emby-events-summary-copy { min-width: 0; display: grid; gap: 3px; }
.emby-events-summary-copy small { color: var(--muted); font-size: 13px; }
.emby-events-summary-copy strong { color: var(--text); font-size: 15px; }
.emby-events-summary-copy span { color: var(--primary); font-size: 13px; letter-spacing: 0; }
.emby-events-guide { margin: 0 0 18px; padding: 13px 15px; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 14px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface-soft); }
.emby-events-guide > span { padding: 5px 8px; border-radius: 6px; color: var(--primary); background: var(--primary-soft); font-size: 13px; font-weight: 850; }
.emby-events-guide strong { display: block; color: var(--text); font-size: 14px; }
.emby-events-guide p { margin: 3px 0 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.emby-event-grid { width: 100%; min-width: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 620px), 1fr)); gap: 16px; }
.emby-event-card { min-width: 0; padding: 20px; }
.emby-event-card-head { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; margin-bottom: 18px; }
.emby-event-card-head > div { display: flex; gap: 10px; align-items: center; min-width: 0; }
.emby-event-card-head h2 { margin: 0; font-size: 18px; }
.emby-event-card-head p { margin: 4px 0 0; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.copy-field { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.copy-field input { min-width: 0; }
.emby-event-enable { margin: 15px 0 18px; padding: 12px 13px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-soft); }
.emby-event-enable small { display: block; margin-top: 3px; color: var(--muted); line-height: 1.45; }
.emby-event-groups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.emby-event-group { min-width: 0; margin: 0; padding: 11px 12px 8px; border: 1px solid var(--line); border-radius: 7px; }
.emby-event-group legend { padding: 0 5px; color: var(--text); font-weight: 700; font-size: 14px; }
.emby-event-group .checkbox { margin: 7px 0; font-size: 14px; }
.emby-event-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 17px; }
.emby-event-test { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 16px; align-items: center; margin-top: 17px; padding-top: 15px; border-top: 1px solid var(--line); }
.emby-event-test strong, .emby-event-test span, .emby-event-test small { display: block; }
.emby-event-test span { margin-top: 4px; color: var(--text); font-size: 14px; }
.emby-event-test small { margin-top: 3px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.emby-event-sample { margin-top: 15px; color: var(--muted); font-size: 14px; }
.emby-event-sample summary { cursor: pointer; color: var(--text); }
.emby-event-sample pre { max-height: 240px; margin: 10px 0 0; padding: 12px; overflow: auto; border-radius: 6px; background: var(--surface-soft); font-size: 14px; line-height: 1.5; }
.emby-artwork-page { width: 100%; min-width: 0; max-width: 100%; margin: 0; overflow: clip; }
.emby-artwork-hero { min-height: 134px; margin: 18px 0; padding: 24px 26px; display: flex; align-items: center; justify-content: space-between; gap: 28px; overflow: hidden; border: 1px solid color-mix(in srgb, var(--primary) 18%, var(--line)); border-radius: 12px; background: var(--feature-hero-background); }
.emby-artwork-hero > div:first-child { max-width: 900px; }
.emby-artwork-hero span { color: var(--primary); font-size: 13px; font-weight: 850; letter-spacing: .08em; }
.emby-artwork-hero h1 { margin: 7px 0 8px; font-size: 30px; }
.emby-artwork-hero p { margin: 0; color: var(--muted); line-height: 1.65; }
.emby-artwork-server-hub { min-width: 0; margin-top: 18px; padding: 17px 18px 18px; overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: color-mix(in srgb, var(--surface) 92%, var(--primary) 8%); }
.emby-artwork-hub-head { margin-bottom: 13px; display: flex; justify-content: space-between; align-items: end; gap: 18px; }
.emby-artwork-hub-head > div { min-width: 0; }
.emby-artwork-hub-head span { display: block; color: var(--primary); font-size: 13px; font-weight: 850; letter-spacing: .08em; }
.emby-artwork-hub-head h2 { margin: 4px 0 0; font-size: 17px; }
.emby-artwork-hub-head > small { color: var(--muted); font-size: 13px; }
.emby-artwork-server-strip { min-width: 0; padding-bottom: 2px; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(250px, 1fr); gap: 10px; overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: thin; }
.emby-artwork-server-card { min-width: 0; min-height: 76px; padding: 11px 12px; display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: 10px; border: 1px solid var(--line); border-radius: 9px; color: var(--text); background: var(--surface-soft); cursor: pointer; text-align: left; transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease; }
.emby-artwork-server-card:hover { border-color: color-mix(in srgb, var(--primary) 34%, var(--line)); transform: translateY(-1px); }
.emby-artwork-server-card.active { border-color: color-mix(in srgb, var(--primary) 74%, var(--line)); background: linear-gradient(125deg, color-mix(in srgb, var(--primary-soft) 72%, var(--surface)), color-mix(in srgb, var(--surface) 94%, var(--primary) 6%)); box-shadow: inset 3px 0 var(--primary), 0 8px 24px color-mix(in srgb, var(--primary) 10%, transparent); }
.emby-artwork-server-card:focus-visible { outline: 3px solid color-mix(in srgb, var(--primary) 24%, transparent); outline-offset: 2px; }
.emby-artwork-server-mark { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 8px; color: var(--muted); background: var(--surface); font-size: 14px; }
.emby-artwork-server-copy, .emby-artwork-server-meta { min-width: 0; display: grid; gap: 4px; }
.emby-artwork-server-copy strong { overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.emby-artwork-server-copy small { overflow: hidden; color: var(--muted); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.emby-artwork-server-meta { justify-items: end; }
.emby-artwork-server-meta b { color: var(--muted); font-size: 13px; font-weight: 750; }
.emby-artwork-server-meta i { color: var(--muted); font-size: 12px; font-style: normal; white-space: nowrap; }
.emby-artwork-server-card.connected .emby-artwork-server-mark { color: var(--success); background: color-mix(in srgb, var(--success) 12%, var(--surface)); }
.emby-artwork-server-card.connected .emby-artwork-server-meta b { color: var(--success); }
.emby-artwork-automation { margin-top: 14px; padding: 18px; overflow: hidden; border-radius: 12px; background: linear-gradient(125deg, color-mix(in srgb, var(--primary-soft) 42%, var(--surface)) 0%, var(--surface) 48%, color-mix(in srgb, var(--primary) 7%, var(--surface)) 100%); }
.emby-artwork-automation-head { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 12px; }
.emby-artwork-automation-mark { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 10px; color: var(--primary); background: var(--primary-soft); font-size: 22px; font-weight: 900; }
.emby-artwork-automation-head > div { min-width: 0; }
.emby-artwork-automation-head > div > span { display: block; color: var(--primary); font-size: 12px; font-weight: 850; letter-spacing: .09em; }
.emby-artwork-automation-head h2 { margin: 4px 0 0; font-size: 17px; }
.emby-artwork-automation-head p { margin: 4px 0 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.emby-artwork-automation-state { padding: 6px 9px; border-radius: 999px; color: var(--muted); background: var(--surface-soft); font-size: 13px; font-weight: 800; }
.emby-artwork-automation-state.active { color: var(--success); background: color-mix(in srgb, var(--success) 13%, var(--surface)); }
.emby-artwork-automation-grid { margin-top: 15px; padding-top: 15px; display: grid; grid-template-columns: minmax(250px, .9fr) 150px minmax(330px, 1.1fr); align-items: end; gap: 12px; border-top: 1px solid var(--line); }
.emby-artwork-auto-toggle { min-height: 54px; padding: 9px 11px; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 10px; border: 1px solid var(--line); border-radius: 8px; background: color-mix(in srgb, var(--surface-soft) 84%, transparent); cursor: pointer; }
.emby-artwork-auto-toggle input { width: 18px; height: 18px; margin: 0; accent-color: var(--primary); }
.emby-artwork-auto-toggle b, .emby-artwork-auto-toggle small { display: block; }
.emby-artwork-auto-toggle b { font-size: 14px; }
.emby-artwork-auto-toggle small { margin-top: 3px; color: var(--muted); font-size: 12px; line-height: 1.4; }
.emby-artwork-interval { gap: 6px; }
.emby-artwork-interval > span:first-child { color: var(--muted); font-size: 13px; font-weight: 700; }
.emby-artwork-number { position: relative; display: block; }
.emby-artwork-number input { width: 100%; padding-right: 38px; }
.emby-artwork-number i { position: absolute; top: 50%; right: 13px; color: var(--muted); font-size: 13px; font-style: normal; transform: translateY(-50%); pointer-events: none; }
.emby-artwork-automation-times { min-height: 54px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: color-mix(in srgb, var(--surface-soft) 84%, transparent); }
.emby-artwork-automation-times > div { min-width: 0; padding: 9px 12px; display: grid; align-content: center; gap: 4px; }
.emby-artwork-automation-times > div + div { border-left: 1px solid var(--line); }
.emby-artwork-automation-times small { color: var(--muted); font-size: 12px; }
.emby-artwork-automation-times strong { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.emby-artwork-batch-actions { margin-top: 12px; display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.emby-artwork-batch-actions .button { min-height: 38px; }
.emby-artwork-batch-progress { margin-top: 12px; display: grid; grid-template-columns: minmax(120px, 1fr) auto; align-items: center; gap: 12px; }
.emby-artwork-batch-progress[hidden] { display: none; }
.emby-artwork-batch-progress > span { height: 6px; overflow: hidden; border-radius: 999px; background: var(--surface-soft); }
.emby-artwork-batch-progress i { width: 0; height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg, var(--primary), color-mix(in srgb, var(--primary) 55%, #fff)); transition: width .25s ease; }
.emby-artwork-batch-progress strong { color: var(--muted); font-size: 13px; font-weight: 700; }
.emby-artwork-automation-status { min-height: 16px; margin-top: 7px; color: var(--muted); font-size: 13px; text-align: right; }
.emby-artwork-automation-status.success { color: var(--success); }
.emby-artwork-automation-status.error { color: var(--danger); }
.emby-artwork-workbench { width: 100%; min-width: 0; max-width: 100%; margin-top: 20px; display: grid; grid-template-columns: minmax(370px, .72fr) minmax(560px, 1.28fr); align-items: start; gap: 18px; }
.emby-artwork-controls, .emby-artwork-preview-panel { min-width: 0; padding: 22px; border-radius: 8px; }
.emby-artwork-section-head { margin-bottom: 17px; display: flex; align-items: center; gap: 11px; }
.emby-artwork-section-head.compact { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--line); }
.emby-artwork-section-head > span { width: 34px; height: 34px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 7px; color: var(--primary); background: var(--primary-soft); font-size: 13px; font-weight: 900; }
.emby-artwork-section-head h2 { margin: 0; font-size: 16px; }
.emby-artwork-section-head p { margin: 3px 0 0; color: var(--muted); font-size: 13px; }
.emby-artwork-mode-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.emby-artwork-mode { min-width: 0; position: relative; cursor: pointer; }
.emby-artwork-mode > input { width: 1px; height: 1px; margin: 0; position: absolute; top: 0; left: 0; opacity: 0; pointer-events: none; clip-path: inset(50%); }
.emby-artwork-mode > span { min-height: 66px; padding: 10px; display: grid; grid-template-columns: 36px minmax(0, 1fr); grid-template-rows: auto auto; align-content: center; gap: 3px 9px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-soft); transition: .18s ease; }
.emby-artwork-mode i { width: 36px; height: 36px; grid-row: 1 / 3; display: grid; place-items: center; border-radius: 6px; color: #b38313; background: color-mix(in srgb, #d4a72c 14%, var(--surface)); font-size: 14px; font-style: normal; font-weight: 900; }
.emby-artwork-mode strong { min-width: 0; overflow: hidden; align-self: end; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.emby-artwork-mode small { min-width: 0; overflow: hidden; color: var(--muted); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.emby-artwork-mode:hover > span { border-color: color-mix(in srgb, var(--primary) 28%, var(--line)); }
.emby-artwork-mode > input:checked + span { border-color: var(--primary); background: var(--primary-soft); box-shadow: inset 3px 0 var(--primary); }
.emby-artwork-mode > input:focus-visible + span { outline: 3px solid color-mix(in srgb, var(--primary) 25%, transparent); outline-offset: 2px; }
.emby-artwork-type-grid { align-items: end; }
.emby-artwork-preview-panel { position: sticky; top: 128px; }
.emby-artwork-preview-head { min-height: 54px; margin-bottom: 16px; display: flex; justify-content: space-between; align-items: center; gap: 18px; }
.emby-artwork-preview-head > div:first-child { min-width: 0; }
.emby-artwork-preview-head span { color: var(--primary); font-size: 13px; font-weight: 850; letter-spacing: .08em; }
.emby-artwork-preview-head h2 { margin: 5px 0 0; overflow: hidden; font-size: 18px; text-overflow: ellipsis; white-space: nowrap; }
.emby-artwork-current { width: 110px; display: grid; grid-template-columns: 58px auto; align-items: center; gap: 7px; }
.emby-artwork-current-thumb { width: 58px; aspect-ratio: 16 / 9; display: grid; place-items: center; overflow: hidden; border: 1px solid var(--line); border-radius: 6px; color: var(--primary); background: var(--primary-soft); }
.emby-artwork-current-thumb img { width: 100%; height: 100%; display: block; object-fit: cover; }
.emby-artwork-current-thumb i { font-size: 15px; font-style: normal; }
.emby-artwork-current-thumb img[hidden], .emby-artwork-current-thumb i[hidden] { display: none; }
.emby-artwork-current span { color: var(--muted); font-size: 12px; letter-spacing: 0; }
.emby-artwork-canvas-shell { position: relative; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; border: 1px solid color-mix(in srgb, var(--primary) 15%, var(--line)); border-radius: 7px; background: #111; box-shadow: 0 18px 42px rgba(0,0,0,.16); }
.emby-artwork-canvas-shell canvas { width: 100%; height: 100%; display: block; }
.emby-artwork-canvas-empty { position: absolute; inset: 0; display: grid; place-content: center; gap: 7px; color: #f4f5f7; background: #17191d; text-align: center; }
.emby-artwork-canvas-empty[hidden] { display: none; }
.emby-artwork-canvas-empty strong { font-size: 16px; }
.emby-artwork-canvas-empty span { color: #9ba0a9; font-size: 13px; }
.emby-artwork-preview-meta { min-height: 36px; padding: 10px 1px 0; display: flex; justify-content: space-between; gap: 12px; color: var(--muted); font-size: 13px; }
.emby-artwork-preview-meta span:last-child { color: #b38313; text-align: right; }
.emby-artwork-actions { margin-top: 13px; display: grid; grid-template-columns: auto auto minmax(150px, 1fr); gap: 8px; }
.emby-artwork-actions .button { width: 100%; min-height: 40px; }
.emby-artwork-status { min-height: 20px; margin-top: 11px; color: var(--muted); font-size: 13px; text-align: right; }
.emby-artwork-status.success { color: var(--success); }
.emby-artwork-status.error { color: var(--danger); }
.emby-artwork-source { margin-top: 24px; }
.emby-artwork-source > header { margin-bottom: 14px; display: flex; align-items: end; justify-content: space-between; gap: 20px; }
.emby-artwork-source > header > div { min-width: 0; }
.emby-artwork-source > header span { color: var(--primary); font-size: 13px; font-weight: 850; letter-spacing: .08em; }
.emby-artwork-source h2 { margin: 5px 0 0; font-size: 20px; }
.emby-artwork-source p { margin: 5px 0 0; color: var(--muted); font-size: 13px; }
.emby-artwork-search { width: min(300px, 100%); display: grid; gap: 6px; }
.emby-artwork-search span { color: var(--muted); letter-spacing: 0; }
.emby-artwork-search input { min-height: 40px; }
.emby-artwork-gallery { min-height: 300px; display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); align-content: start; gap: 11px; }
.emby-artwork-item { min-width: 0; padding: 0; position: relative; overflow: hidden; border: 1px solid var(--line); border-radius: 7px; color: var(--text); background: var(--surface); cursor: pointer; text-align: left; transition: .18s ease; }
.emby-artwork-item:hover { border-color: color-mix(in srgb, var(--primary) 36%, var(--line)); transform: translateY(-2px); box-shadow: 0 8px 20px rgba(25, 35, 55, .1); }
.emby-artwork-item img { width: 100%; aspect-ratio: 2 / 3; display: block; object-fit: cover; background: var(--surface-soft); }
.emby-artwork-item > span { min-width: 0; padding: 8px; display: grid; gap: 3px; }
.emby-artwork-item strong { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.emby-artwork-item small { display: inline-flex; align-items: center; gap: 3px; color: var(--muted); font-size: 12px; }
.emby-artwork-item small .ui-icon { width: 10px; height: 10px; color: var(--warning); }
.emby-artwork-item > i { width: 24px; height: 24px; position: absolute; top: 7px; right: 7px; display: none; place-items: center; border-radius: 50%; color: white; background: var(--primary); box-shadow: 0 3px 10px rgba(0,0,0,.28); font-size: 13px; font-style: normal; font-weight: 900; }
.emby-artwork-item.selected { border-color: var(--primary); box-shadow: 0 0 0 2px var(--primary); }
.emby-artwork-item.selected > i { display: grid; }
.strm-monitor-policy { margin-top: 11px; display: flex; flex-wrap: wrap; gap: 6px; }
.strm-monitor-policy span { padding: 5px 7px; border-radius: 5px; color: var(--muted); background: var(--surface-soft); font-size: 13px; }
.strm-monitor-actions { margin-top: 12px; display: flex; justify-content: flex-end; }
.strm-realtime-panel { margin-bottom: 18px; padding: 14px; border: 1px solid color-mix(in srgb, var(--primary) 24%, var(--line)); border-radius: 8px; background: color-mix(in srgb, var(--primary-soft) 24%, var(--surface)); transition: border-color .18s ease, opacity .18s ease; }
.strm-realtime-panel.is-disabled { border-color: var(--line); }
.strm-realtime-panel.is-disabled .strm-webhook-endpoint, .strm-realtime-panel.is-disabled .strm-realtime-fields { opacity: .62; }
.strm-realtime-head, .strm-realtime-head > div { display: flex; align-items: center; gap: 10px; }
.strm-realtime-head { margin-bottom: 12px; justify-content: space-between; }
.strm-realtime-head strong, .strm-realtime-head small { display: block; }
.strm-realtime-head strong { font-size: 14px; }
.strm-realtime-head small { margin-top: 3px; color: var(--muted); font-size: 13px; }
.strm-realtime-settings { margin: 12px 0; background: var(--surface); }
.strm-realtime-fields { margin-top: 0; }
.strm-metadata-panel { padding: 14px; border: 1px solid color-mix(in srgb, var(--primary) 24%, var(--line)); border-radius: 8px; background: color-mix(in srgb, var(--primary-soft) 20%, var(--surface)); transition: border-color .18s ease, opacity .18s ease; }
.strm-metadata-panel.is-disabled { border-color: var(--line); }
.strm-metadata-panel.is-disabled .strm-metadata-settings label:not(:first-child), .strm-metadata-panel.is-disabled .strm-metadata-fields, .strm-metadata-panel.is-disabled .strm-metadata-location { opacity: .52; }
.strm-metadata-settings { margin-bottom: 14px; background: var(--surface); }
.strm-metadata-location { display: grid; gap: 10px; margin: 0 0 18px; }
.strm-metadata-location > span { font-size: 14px; font-weight: 700; }
.strm-metadata-location-options { display: inline-flex; flex-wrap: wrap; width: fit-content; max-width: 100%; padding: 3px; gap: 3px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-soft); }
.strm-metadata-location-options label { position: relative; cursor: pointer; }
.strm-metadata-location-options input { position: absolute; opacity: 0; }
.strm-metadata-location-options span { display: block; padding: 8px 12px; border-radius: 5px; color: var(--muted); font-size: 13px; font-weight: 700; }
.strm-metadata-location-options input:checked + span { color: var(--text); background: var(--surface); box-shadow: 0 1px 4px color-mix(in srgb, black 12%, transparent); }
.strm-metadata-location-options input:focus-visible + span { outline: 2px solid var(--primary); outline-offset: 1px; }
.strm-metadata-location .field { max-width: 650px; }
.strm-metadata-location [hidden] { display: none; }
.strm-metadata-location > small { color: var(--muted); font-size: 12px; line-height: 1.5; }
.strm-metadata-location-preview { display: grid; gap: 4px; min-width: 0; }
.strm-metadata-location-preview small { color: var(--muted); font-size: 12px; }
.strm-metadata-location-preview code { overflow-wrap: anywhere; font-size: 12px; }
.strm-metadata-fields { margin-top: 0; }

@media (max-width: 980px) {
  .strm-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .strm-service-band { grid-template-columns: 1fr; gap: 8px; }
  .strm-service-band p { justify-self: start; text-align: left; }
  .strm-task-card { grid-template-columns: 1fr; }
  .strm-task-result { min-height: 70px; padding: 12px 0 0; grid-template-columns: 1fr auto auto; align-items: center; gap: 18px; border-top: 1px solid var(--line); border-left: 0; }
  .strm-history-row { grid-template-columns: 30px minmax(0, 1fr) auto; }
  .strm-history-row time { display: none; }
  .strm-index-toolbar { width: 100%; justify-content: flex-end; flex-wrap: wrap; }
  .strm-index-row { grid-template-columns: 24px 52px minmax(0, 1fr) auto 40px; }
  .strm-index-size, .strm-index-row time { display: none; }
  .strm-editor-identity { grid-template-columns: 42px minmax(0, 1fr); }
  .strm-identity-status { grid-column: 2; grid-row: 2; align-self: auto; justify-items: start; grid-auto-flow: column; justify-content: start; }
}

@media (max-width: 680px) {
  .strm-console-body { padding: 14px; }
  .strm-tabs { padding: 0 13px; gap: 18px; overflow-x: auto; }
  .strm-section-head { align-items: flex-start; flex-direction: column; }
  .strm-section-head .button, .strm-section-head form, .strm-section-head select { width: 100%; }
  .strm-task-card { padding: 14px; }
  .strm-task-monitor { margin-left: 0; }
  .strm-path-flow { margin-left: 0; grid-template-columns: 1fr; }
  .strm-path-flow > i { transform: rotate(90deg); }
  .strm-task-meta { margin-left: 0; }
  .strm-task-result { grid-template-columns: 1fr; }
  .strm-result-numbers { max-width: 240px; }
  .strm-card-actions { justify-content: flex-start; }
  .strm-history-row { grid-template-columns: 28px minmax(0, 1fr); }
  .strm-history-row .badge { grid-column: 2; width: max-content; }
  .strm-index-toolbar { align-items: stretch; flex-direction: column; }
  .strm-index-filters, .strm-index-toolbar form, .strm-index-toolbar select { width: 100%; }
  .strm-index-filters a { flex: 1 1 0; }
  .strm-index-bulk { padding: 9px; flex-wrap: wrap; gap: 8px; }
  .strm-index-select-all { min-height: 36px; }
  .strm-index-selection { margin-left: auto; }
  .strm-index-bulk .button { width: 100%; }
  .strm-index-row { padding-inline: 10px; grid-template-columns: 24px minmax(0, 1fr) auto 40px; gap: 9px; }
  .strm-index-kind { display: none; }
  .strm-editor-identity { min-height: 0; padding: 18px 15px; grid-template-columns: 38px minmax(0, 1fr); align-items: start; gap: 12px; }
  .strm-name-field input { min-height: 50px; font-size: 16px; }
  .strm-identity-status { grid-column: 2; justify-items: start; }
  .strm-editor > section { padding: 20px 15px; }
  .strm-editor-title { grid-template-columns: 40px minmax(0, 1fr); }
  .strm-editor-title > span { width: 40px; height: 40px; }
  .strm-connection-state { grid-column: 2; justify-self: start; }
  .strm-path-pipeline { grid-template-columns: 1fr; }
  .strm-path-arrow { width: 100%; height: 22px; margin: 0; transform: rotate(90deg); }
  .strm-output-playback-grid { grid-template-columns: minmax(0, 1fr); }
  .strm-output-auto-grid .strm-auto-output-root { height: auto; min-height: 0; }
  .strm-auto-output-root { padding: 13px; align-items: start; }
  .strm-auto-output-root > div { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .strm-auto-output-root small, .strm-auto-output-root strong { min-width: 0; overflow-wrap: break-word; word-break: normal; }
  .strm-auto-output-root code { max-width: 100%; overflow-wrap: anywhere; white-space: normal; }
  .strm-folder-dialog { width: calc(100vw - 16px); height: calc(100dvh - 20px); max-height: calc(100dvh - 20px); }
  .strm-folder-dialog-head { padding: 16px 15px 13px; }
  .strm-folder-dialog-head h2 { font-size: 17px; }
  .strm-folder-toolbar { grid-template-columns: 38px 38px minmax(0, 1fr) 38px; padding-inline: 8px; }
  .strm-folder-list { padding-inline: 8px; }
  .strm-folder-footer { min-height: 0; padding: 12px; align-items: stretch; flex-direction: column; }
  .strm-folder-footer > div:first-child { max-width: 100%; }
  .strm-folder-footer code { max-width: 100%; }
  .strm-folder-footer > div:last-child { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
  .strm-folder-footer .button { width: 100%; }
  .strm-preview-grid { grid-template-columns: 1fr; }
  .strm-preview-grid > div, .strm-preview-grid > div:nth-child(2n), .strm-preview-grid > div.full { grid-column: auto; border-right: 0; }
  .strm-preview-grid > div:last-child { border-bottom: 0; }
  .strm-preview-footer { align-items: stretch; flex-direction: column; }
  .strm-preview-footer .button { width: 100%; }
  .strm-editor-actions { padding: 14px 15px; }
  .strm-monitor-metrics { grid-template-columns: 1fr; }
  .strm-monitor-metrics > div { border-right: 0; border-bottom: 1px solid var(--line); }
  .strm-monitor-metrics > div:last-child { border-bottom: 0; }
  .strm-webhook-endpoint { grid-template-columns: minmax(0, 1fr) auto; }
  .strm-webhook-endpoint > span { grid-column: 1 / -1; }
  .strm-webhook-endpoint code { grid-column: 1 / -1; white-space: normal; overflow-wrap: anywhere; }
  .emby-events-hero { display: block; }
  .emby-events-summary { width: 100%; min-width: 0; margin-top: 15px; text-align: left; }
  .emby-events-guide { grid-template-columns: 1fr; gap: 8px; }
  .emby-event-grid { grid-template-columns: 1fr; }
  .emby-event-groups { grid-template-columns: 1fr; }
  .emby-event-test { grid-template-columns: 1fr; gap: 10px; }
}

@media (max-width: 980px) {
  .notification-channel-grid { grid-template-columns: 1fr; }
  .notification-channel:first-child { border-right: 0; border-bottom: 1px solid var(--line); }
  .notification-event-groups { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  .notification-center-head { align-items: flex-start; padding: 21px 18px 18px; }
  .notification-center-head > .badge { align-self: flex-start; }
  .notification-channel { padding: 21px 18px; }
  .notification-channel-head { align-items: flex-start; }
  .notification-channel-head .channel-enable { margin-left: auto; }
  .notification-fields { grid-template-columns: 1fr; gap: 12px; }
  .notification-fields .full { grid-column: auto; }
  .notification-policy { padding: 22px 18px; }
  .notification-subhead, .notification-filter-copy { align-items: flex-start; flex-direction: column; gap: 10px; }
  .notification-subhead > span { align-self: flex-start; }
  .notification-event-groups { grid-template-columns: 1fr; gap: 9px; }
  .notification-filter { margin: 18px; padding: 18px; }
  .notification-save-row { min-height: 0; padding: 16px 18px; align-items: stretch; flex-direction: column; gap: 11px; }
  .notification-save-row > span { margin: 0; }
  .notification-save-row .button { width: 100%; }
  .remote-control-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .remote-control-metrics > div:nth-child(2) { border-right: 0; }
  .remote-control-metrics > div:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .remote-control-native-menu { grid-template-columns: 36px minmax(0, 1fr); }
  .remote-control-native-menu em { grid-column: 2; justify-self: start; }
  .remote-control-native-menu small { white-space: normal; }
  .remote-control-command-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .remote-control-activity { grid-template-columns: 1fr; gap: 12px; }
  .remote-control-activity li { grid-template-columns: 54px minmax(0, 1fr); }
}

@media (max-width: 980px) {
  .settings-page-shell { display: block; }
  .settings-navigation { position: static; }
  .settings-navigation-head { width: 160px; flex-basis: 160px; padding: 8px 12px; }
  .settings-navigation nav { grid-template-columns: repeat(var(--settings-navigation-count, 5), minmax(0, 1fr)); }
  .settings-navigation nav a { min-height: 64px; grid-template-columns: 34px minmax(0, 1fr) auto; }
  .settings-nav-mark { width: 38px; height: 38px; }
  .settings-nav-state { position: static; }
  .diagnostics-summary { grid-template-columns: 54px minmax(0, 1fr); }
  .diagnostics-metrics { grid-column: 1 / -1; }
}

@media (max-width: 720px) {
  .system-diagnostics-dialog { width: calc(100vw - 16px); height: calc(100dvh - 16px); max-height: calc(100dvh - 16px); border-radius: 15px; }
  .system-diagnostics-dialog-head { padding: 17px 16px 14px; }
  .system-diagnostics-dialog-head > div { min-width: 0; }
  .system-diagnostics-dialog-head p { max-width: 28rem; }
  .system-diagnostics-dialog-body { padding: 14px 12px 18px; scrollbar-gutter: auto; }
  .settings-navigation { overflow: visible; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
  .settings-navigation-head { padding: 0 2px 12px; border: 0; background: transparent; }
  .settings-navigation-head > span, .settings-navigation-head p { display: none; }
  .settings-navigation-head h2 { margin: 0; font-size: 15px; }
  .settings-navigation nav { margin-inline: calc(var(--page-gutter) * -1); padding: 0 var(--page-gutter) 8px; display: flex; gap: 8px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .settings-navigation nav::-webkit-scrollbar { display: none; }
  .settings-navigation nav a { min-width: 100%; max-width: 100%; min-height: 68px; flex: 0 0 100%; scroll-snap-align: start; scroll-snap-stop: always; grid-template-columns: 38px minmax(0, 1fr) auto; border-color: var(--line); background: var(--surface); }
  .settings-navigation nav a:hover { transform: none; }
  .settings-navigation { padding-block: 0; }
  .settings-navigation nav { gap: 8px; }
  .settings-navigation nav a { min-height: 72px; padding: 10px 12px; grid-template-columns: 42px minmax(0, 1fr) auto; gap: 10px; }
  .settings-navigation.module-navigation, .settings-navigation[data-settings-nav] { height: 104px; padding: 8px; align-items: center; gap: 0; overflow: hidden; border: 1px solid var(--panel-border); border-radius: var(--panel-radius); background: var(--panel-background); box-shadow: var(--panel-shadow); }
  .settings-navigation.module-navigation .settings-navigation-head, .settings-navigation[data-settings-nav] .settings-navigation-head { display: none; }
  .settings-navigation.module-navigation nav, .settings-navigation[data-settings-nav] nav { width: 100%; min-width: 0; margin: 0; padding: 2px; flex: 1 1 auto; gap: 10px; border: 0; border-radius: 0; background: transparent; scroll-snap-type: x mandatory; scroll-padding-inline: 2px; }
  .settings-navigation.module-navigation nav a, .settings-navigation[data-settings-nav] nav a { min-width: 0; max-width: none; flex: 0 0 min(220px, calc(100% - 30px)); }
  .settings-navigation .settings-nav-mark { width: 42px; height: 42px; }
  .settings-navigation .settings-nav-copy strong { display: block; white-space: nowrap; font-size: 14px; }
  .settings-navigation .settings-nav-copy small { font-size: 13px; }
  .settings-nav-state { position: static; }
  .settings-panel-hero { min-height: 0; padding: 21px; align-items: stretch; flex-direction: column; }
  .settings-panel-hero h2 { font-size: 21px; }
  .settings-panel-hero-state { width: 100%; min-width: 0; }
  .settings-panel-hero-state > small { max-width: none; }
  .diagnostics-toolbar { align-items: stretch; flex-direction: column; }
  .diagnostics-toolbar .button { width: 100%; }
  .diagnostics-summary { padding: 17px; grid-template-columns: 48px minmax(0, 1fr); gap: 13px; }
  .diagnostics-summary-mark { width: 48px; height: 48px; border-radius: 12px; }
  .diagnostics-summary-mark .ui-icon { width: 23px; height: 23px; }
  .diagnostics-summary-copy h3 { font-size: 19px; }
  .diagnostics-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .diagnostics-metrics > div { min-height: 62px; }
  .diagnostics-metrics > div:nth-child(odd) { border-left: 0; }
  .diagnostics-metrics > div:nth-child(n + 3) { border-top: 1px solid var(--line); }
  .diagnostics-group > header { align-items: flex-start; }
  .diagnostics-item { min-height: 0; padding: 15px; grid-template-columns: 36px minmax(0, 1fr); gap: 11px; }
  .diagnostics-item-side { min-width: 0; grid-column: 2; display: flex; align-items: center; justify-content: space-between; justify-items: stretch; }
  .diagnostics-item-side > a { margin-left: auto; }
  .diagnostics-item-copy small { flex-direction: column; gap: 2px; }
  .license-hero-state { width: 100%; min-width: 0; min-height: 104px; padding: 8px 10px 8px 6px; grid-template-columns: 84px minmax(0, 205px); justify-content: center; gap: 9px; }
  .license-plan-badge { --license-medal-offset: -8px; width: 82px; height: 82px; align-self: center; }
  .license-plan-medal-canvas { filter: drop-shadow(0 8px 8px rgba(0,0,0,.24)); }
  .license-hero-copy > small { max-width: none; }
  .license-hero-copy > .license-hero-meta { font-size: 12px; }
  .license-settings-head { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .license-settings-head .license-status-pill { width: max-content; max-width: 100%; margin-left: 66px; }
  .license-settings-overview { grid-template-columns: minmax(0, 1fr); }
  .license-settings-facts { grid-template-columns: minmax(0, 1fr); }
  .license-device-strip { display: grid; grid-template-columns: 36px minmax(0, 1fr); align-items: start; flex-wrap: nowrap; }
  .license-device-strip > div { grid-column: 2; display: grid; grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .license-device-strip > div > span { grid-column: auto; }
  .license-device-strip strong { white-space: normal; overflow-wrap: break-word; word-break: normal; }
  .license-device-strip small { min-width: 0; line-height: 1.6; overflow-wrap: break-word; word-break: normal; }
  .license-device-strip > em { grid-column: 2; width: max-content; max-width: 100%; margin-left: 0; white-space: normal; }
  .license-settings-input-row { grid-template-columns: minmax(0, 1fr); }
  .settings-network-grid { grid-template-columns: 1fr; }
  .settings-network-grid .network-proxy-head .proxy-switch { margin-left: 0; }
  .runtime-card { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .runtime-card > div:nth-child(odd) { border-left: 0; }
  .runtime-card > div:nth-child(n + 3) { border-top: 1px solid var(--line); }
}

/* Keep the same card interaction language across every main feature page. */
:where(
  .card,
  .emby-overview > div,
  .emby-add-card,
  .reverse-overview > div,
  .archive-runtime-overview > div,
  .archive-list-card,
  .archive-candidate-card,
  .archive-job-card,
  .strm-overview > article,
  .strm-task-card,
  .member-user-card,
  .code-summary > a,
  .broadcast-card,
  .message-card,
  .portal-stats > article,
  .portal-notice,
  .account-card,
  .settings-card
) {
  transition: transform .22s cubic-bezier(.2, .75, .25, 1), border-color .22s ease, box-shadow .22s ease, background-color .22s ease;
}

.recommend-card,
.recommend-poster {
  transition: transform .22s cubic-bezier(.2, .75, .25, 1), box-shadow .22s ease, filter .22s ease;
}

@media (hover: hover) and (pointer: fine) {
  :where(
    .card,
    .emby-overview > div,
    .emby-add-card,
    .reverse-overview > div,
    .archive-runtime-overview > div,
    .archive-list-card,
    .archive-candidate-card,
    .archive-job-card,
    .strm-overview > article,
    .strm-task-card,
    .member-user-card,
    .code-summary > a,
    .broadcast-card,
    .message-card,
    .portal-stats > article,
    .portal-notice,
    .account-card,
    .settings-card
  ):hover {
    transform: translateY(-3px);
    border-color: color-mix(in srgb, var(--primary) 38%, var(--border-color));
    box-shadow: var(--card-hover-shadow), 0 0 0 1px color-mix(in srgb, var(--primary) 10%, transparent);
  }

  .recommend-card:hover { transform: translateY(-3px); }
  .recommend-card:hover .recommend-poster {
    filter: saturate(1.04) brightness(1.025);
    box-shadow: var(--card-hover-shadow), 0 0 0 1px color-mix(in srgb, var(--primary) 22%, transparent);
  }
}

@media (prefers-reduced-motion: reduce) {
  .recommend-card,
  .recommend-poster,
  :where(
    .card,
    .emby-overview > div,
    .emby-add-card,
    .reverse-overview > div,
    .archive-runtime-overview > div,
    .archive-list-card,
    .archive-candidate-card,
    .archive-job-card,
    .strm-overview > article,
    .strm-task-card,
    .member-user-card,
    .code-summary > a,
    .broadcast-card,
    .message-card,
    .portal-stats > article,
    .portal-notice,
    .account-card,
    .settings-card,
    .recommend-card,
    .recommend-poster
  ) { transition: none; }

  .recommend-card:hover,
  :where(.card, .emby-overview > div, .emby-add-card, .reverse-overview > div, .archive-runtime-overview > div, .archive-list-card, .archive-candidate-card, .archive-job-card, .strm-overview > article, .strm-task-card, .member-user-card, .code-summary > a, .broadcast-card, .message-card, .portal-stats > article, .portal-notice, .account-card, .settings-card, .recommend-card):hover {
    transform: none;
  }

  .license-plan-badge img { animation: none; transform: rotateY(-8deg); }
}

.media-weight-layout {
  width: 100%;
  max-width: none;
  margin-inline: 0;
  display: block;
}

/* Weight profiles use a quieter editorial hierarchy: one overview, then compact groups. */
.media-weight-page-head { padding-bottom: 8px; }
.media-weight-page-head h2 { margin: 5px 0 6px; letter-spacing: 0; }
.media-weight-page-head p { max-width: 720px; }
.media-weight-eyebrow { color: var(--primary); font-size: 14px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.media-weight-overview { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 14px; padding: 22px 24px; border: 1px solid var(--border-color); border-radius: 8px; background: linear-gradient(120deg, color-mix(in srgb, var(--card-background) 96%, var(--primary)), var(--card-background)); }
.media-weight-overview-copy { min-width: 0; }
.media-weight-overview h1 { margin: 5px 0 7px; font-size: clamp(22px, 3vw, 30px); letter-spacing: 0; overflow-wrap: anywhere; }
.media-weight-overview p { margin: 0; color: var(--muted); }
.media-weight-thresholds { display: grid; grid-template-columns: repeat(3, minmax(78px, 1fr)); gap: 8px; flex: 0 0 min(390px, 42%); }
.media-weight-thresholds div { padding: 11px 12px; border-left: 2px solid var(--primary); background: color-mix(in srgb, var(--body-background) 38%, transparent); }
.media-weight-thresholds small { display: block; color: var(--muted); font-size: 14px; }
.media-weight-thresholds strong { display: block; margin-top: 4px; font-size: 22px; color: var(--text-color); }
.media-weight-group { margin-top: 18px; }
.media-weight-group-head { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 9px; }
.media-weight-group-head > div { display: flex; align-items: center; gap: 9px; }
.media-weight-group-head h3 { margin: 0; font-size: 16px; letter-spacing: 0; }
.media-weight-group-head small { color: var(--muted); font-size: 14px; }
.media-weight-group-head .media-weight-eyebrow { display: grid; place-items: center; width: 21px; height: 21px; border-radius: 5px; background: color-mix(in srgb, var(--primary) 16%, transparent); font-size: 13px; }
.media-weight-multiplier { margin-top: 6px; padding-top: 8px; border-top: 1px solid var(--border-color); }
.media-weight-rule-note { margin: 8px 0 2px; color: var(--muted); font-size: 14px; line-height: 1.5; }
.media-weight-advanced { margin-top: 14px; padding: 13px 16px; border: 1px solid var(--border-color); border-radius: 7px; background: color-mix(in srgb, var(--card-background) 94%, var(--body-background)); }
.media-weight-advanced summary { cursor: pointer; color: var(--text-color); font-weight: 700; list-style: none; }
.media-weight-advanced summary::-webkit-details-marker { display: none; }
.media-weight-advanced summary span { float: right; color: var(--muted); font-size: 14px; font-weight: 500; }
.media-weight-advanced-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 13px; padding-top: 13px; border-top: 1px solid var(--border-color); }
.media-weight-advanced-grid p { margin: 5px 0 0; color: var(--muted); font-size: 14px; line-height: 1.55; }
.media-weight-score strong small { margin-left: 3px; color: var(--muted); font-size: 14px; font-weight: 600; }

.media-weight-page-head { width: 100%; max-width: none; margin-inline: 0; }
.media-weight-profile-nav {
  width: 100%;
  margin: 4px 0 20px;
  display: grid;
  grid-template-columns: minmax(190px, 230px) minmax(0, 1fr);
  border: 1px solid var(--border-color);
  border-radius: 8px;
  background: var(--card-background);
  overflow: hidden;
}
.media-weight-profile-nav-copy {
  display: grid;
  align-content: center;
  gap: 5px;
  min-height: 104px;
  padding: 18px 20px;
  border-right: 1px solid var(--border-color);
  background: color-mix(in srgb, var(--body-background) 32%, var(--card-background));
}
.media-weight-profile-nav-copy strong { font-size: 20px; }
.media-weight-profile-nav-copy small { color: var(--muted); line-height: 1.45; }
.media-weight-profile-links {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(240px, 360px);
  align-items: stretch;
  gap: 12px;
  min-width: 0;
  padding: 14px;
  overflow-x: auto;
  scrollbar-width: thin;
}
.media-weight-profile-links a {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  min-height: 76px;
  padding: 12px 14px;
  color: var(--text-color);
  border: 1px solid var(--border-color);
  border-radius: 7px;
  background: color-mix(in srgb, var(--body-background) 30%, var(--card-background));
  text-decoration: none;
}
.media-weight-profile-links a > span {
  display: grid;
  place-items: center;
  position: relative;
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  border-radius: 6px;
  background: color-mix(in srgb, var(--primary) 14%, transparent);
  color: var(--primary);
  font-weight: 800;
}
.media-weight-profile-links a div { display: grid; gap: 4px; min-width: 0; }
.media-weight-profile-links a strong,
.media-weight-profile-links a div small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.media-weight-profile-links a div small { color: var(--muted); font-size: 14px; }
.media-weight-profile-links a > i {
  width: 8px;
  height: 8px;
  margin-left: auto;
  flex: 0 0 8px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--muted) 45%, transparent);
}
.media-weight-profile-links a.active {
  color: #fff;
  border-color: var(--primary);
  background: var(--primary);
  box-shadow: 0 10px 24px color-mix(in srgb, var(--primary) 24%, transparent);
}
.media-weight-profile-links a.active > span { color: #fff; background: rgba(255, 255, 255, .16); }
.media-weight-profile-links a.active div small { color: rgba(255, 255, 255, .78); }
.media-weight-profile-links a.active > i { background: #fff; box-shadow: 0 0 0 4px rgba(255, 255, 255, .13); }
.media-weight-main { width: 100%; max-width: none; min-width: 0; }
.media-weight-form { width: 100%; }
.media-weight-head-actions,
.media-weight-share { display: flex; align-items: center; gap: 10px; }
.media-weight-head-actions { flex-wrap: wrap; justify-content: flex-end; }
.media-weight-head-actions form { margin: 0; }
.media-weight-share { justify-content: space-between; margin-bottom: 18px; padding-bottom: 16px; border-bottom: 1px solid var(--border-color); }
.media-weight-share > div { display: grid; gap: 3px; }
.media-weight-share small { color: var(--muted); }
.media-weight-import-dialog { width: min(620px, calc(100vw - 32px)); }
.media-weight-import-dialog textarea { min-height: 180px; overflow-wrap: anywhere; }
.media-weight-switches { display: flex; flex-wrap: wrap; gap: 10px 24px; margin-top: 16px; }
.media-weight-dimensions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.media-weight-dimension { border: 1px solid var(--border-color); border-radius: 6px; background: color-mix(in srgb, var(--card-background) 92%, var(--body-background)); overflow: hidden; }
.media-weight-dimension summary { display: grid; grid-template-columns: minmax(0, 1fr) auto 18px; align-items: center; gap: 8px; min-height: 44px; padding: 0 13px; cursor: pointer; list-style: none; }
.media-weight-dimension summary::-webkit-details-marker { display: none; }
.media-weight-dimension summary span { font-weight: 700; }
.media-weight-dimension summary small { color: var(--muted); }
.media-weight-dimension summary i { color: var(--muted); font-style: normal; transform: rotate(90deg); transition: transform .18s ease; }
.media-weight-dimension[open] summary { border-bottom: 1px solid var(--border-color); }
.media-weight-dimension[open] summary i { transform: rotate(-90deg); }
.media-weight-dimension > div { display: grid; padding: 6px 13px; }
.media-weight-dimension label { display: grid; grid-template-columns: minmax(0, 1fr) 84px; align-items: center; gap: 12px; min-height: 40px; border-bottom: 1px solid color-mix(in srgb, var(--border-color) 65%, transparent); }
.media-weight-dimension label:last-child { border-bottom: 0; }
.media-weight-dimension input { width: 84px; min-height: 32px; padding: 5px 8px; text-align: right; }
.media-weight-actionbar { margin: 14px 0 18px; padding: 14px 16px; display: flex; align-items: center; justify-content: space-between; gap: 14px; border: 1px solid var(--border-color); border-radius: 6px; background: var(--card-background); }
.media-weight-actionbar-right,
.media-weight-delete { display: flex; align-items: center; gap: 10px; }
.media-weight-delete { margin: 0; }
.media-weight-delete span { color: var(--muted); font-size: 14px; }
.media-weight-form textarea[name="versionRules"] { min-height: 116px; }
.media-weight-form textarea[name="alwaysOverwrite"] { min-height: 82px; }
.media-weight-preview { margin-top: 0; border: 1px solid var(--border-color); border-radius: 6px; background: var(--card-background); }
.media-weight-score-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 18px; }
.media-weight-score { border: 1px solid var(--border-color); border-radius: 6px; padding: 14px; background: color-mix(in srgb, var(--card-background) 90%, var(--body-background)); min-width: 0; }
.media-weight-score > div:first-child { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.media-weight-score > div:first-child span { color: var(--muted); font-size: 14px; }
.media-weight-score > div:first-child strong { color: var(--primary); font-size: 28px; }
.media-weight-score p { margin: 8px 0 12px; overflow-wrap: anywhere; }
.media-weight-score-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.media-weight-score-tags span { padding: 4px 7px; border: 1px solid var(--border-color); border-radius: 4px; font-size: 14px; overflow-wrap: anywhere; }
.media-weight-score-tags b { color: var(--primary); }
.media-weight-decision { display: flex; align-items: center; gap: 12px; margin-top: 12px; padding: 12px 14px; border: 1px solid var(--border-color); border-radius: 6px; }
.media-weight-decision.replace { border-color: color-mix(in srgb, #22c55e 55%, var(--border-color)); }
.media-weight-decision.keep { border-color: color-mix(in srgb, #f59e0b 55%, var(--border-color)); }
.media-weight-decision span { color: var(--muted); }
.archive-weight-decision { display: flex; align-items: center; gap: 10px; margin: 12px 0; padding: 11px 12px; border: 1px solid var(--border-color); border-radius: 6px; }
.archive-weight-decision > span { display: grid; place-items: center; width: 30px; height: 30px; flex: 0 0 30px; border-radius: 5px; background: color-mix(in srgb, var(--primary) 14%, transparent); color: var(--primary); font-weight: 800; }
.archive-weight-decision > div { display: grid; gap: 3px; min-width: 0; }
.archive-weight-decision small { color: var(--muted); overflow-wrap: anywhere; }
.archive-weight-decision.replace { border-color: color-mix(in srgb, #22c55e 55%, var(--border-color)); }
.archive-weight-decision.keep { border-color: color-mix(in srgb, #f59e0b 55%, var(--border-color)); }

@media (max-width: 900px) {
  .media-weight-profile-nav { grid-template-columns: 1fr; }
  .media-weight-profile-nav-copy { min-height: auto; padding: 14px 16px; border-right: 0; border-bottom: 1px solid var(--border-color); }
  .media-weight-profile-links { grid-auto-columns: minmax(220px, 78vw); }
}

@media (max-width: 640px) {
  .media-weight-profile-links { grid-auto-columns: 100%; overflow-x: auto; overscroll-behavior-x: contain; scroll-padding-inline: 14px; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .media-weight-profile-links::-webkit-scrollbar { display: none; }
  .media-weight-profile-links a { scroll-snap-align: start; scroll-snap-stop: always; }
  .media-weight-dimensions,
  .media-weight-score-grid { grid-template-columns: 1fr; }
  .media-weight-decision { align-items: flex-start; flex-direction: column; }
  .media-weight-share { align-items: flex-start; flex-direction: column; }
  .media-weight-share .button { width: 100%; }
  .media-weight-actionbar { align-items: stretch; flex-direction: column; }
  .media-weight-actionbar-right,
  .media-weight-delete { width: 100%; flex-wrap: wrap; }
  .media-weight-actionbar-right .button { flex: 1; }
  .media-weight-delete span { width: 100%; }
  .media-weight-overview { align-items: stretch; flex-direction: column; padding: 18px; }
  .media-weight-thresholds { width: 100%; flex-basis: auto; }
  .media-weight-advanced-grid { grid-template-columns: 1fr; }
}

.license-lock-page {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
  background: var(--body-background, #0d1117);
  color: var(--text-color, #e6edf3);
}

.license-lock-panel {
  width: min(560px, 100%);
  border: 1px solid var(--border-color, #2f3945);
  border-radius: 8px;
  padding: clamp(20px, 5vw, 36px);
  background: var(--card-background, #151b23);
  box-shadow: 0 24px 70px rgba(0, 0, 0, .28);
}

.license-lock-panel header,
.license-lock-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

.license-lock-panel .license-logo { width: 40px; height: 40px; flex: 0 0 auto; object-fit: cover; border-radius: 12px; box-shadow: 0 6px 16px rgba(77, 42, 151, .18); }
.license-lock-panel header div { display: grid; gap: 2px; flex: 1; }
.license-lock-panel header span { font-weight: 700; }
.license-lock-panel header small,
.license-lock-panel footer,
.license-lock-copy p,
.license-lock-panel dt { color: var(--muted, #8b949e); }
.license-state-dot { width: 10px; height: 10px; border-radius: 50%; background: #ef4444; }
.license-state-dot.success { background: #22c55e; }
.license-state-dot.warning { background: #f59e0b; }
.license-lock-copy { margin: 34px 0 24px; }
.license-lock-copy h1 { margin: 10px 0 8px; font-size: clamp(24px, 5vw, 34px); letter-spacing: 0; }
.license-lock-copy p { margin: 0; line-height: 1.65; overflow-wrap: anywhere; }
.license-state-label { display: inline-flex; font-size: 14px; font-weight: 700; color: #f87171; }
.license-state-label.success { color: #4ade80; }
.license-state-label.warning { color: #fbbf24; }
.license-lock-panel dl { margin: 0; border-top: 1px solid var(--border-color, #2f3945); }
.license-lock-panel dl div { display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 16px; padding: 13px 0; border-bottom: 1px solid var(--border-color, #2f3945); }
.license-lock-panel dt,
.license-lock-panel dd { margin: 0; font-size: 14px; overflow-wrap: anywhere; }
.license-lock-actions { margin-top: 24px; flex-wrap: wrap; }
.license-lock-actions form { margin: 0; }
.license-lock-panel footer { margin-top: 26px; font-size: 14px; }
.license-activation-form { margin-top: 24px; padding: 18px; display: grid; gap: 13px; border: 1px solid var(--line, #2f3945); border-radius: 10px; background: color-mix(in srgb, var(--surface-soft, #1c2330) 72%, transparent); }
.license-activation-form .field { display: grid; gap: 8px; }
.license-activation-form input { min-height: 48px; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; letter-spacing: .04em; text-transform: uppercase; }
.license-activation-form .button { justify-self: start; }
.license-activation-error { padding: 10px 12px; border: 1px solid color-mix(in srgb, var(--danger) 34%, var(--line)); border-radius: 8px; color: var(--danger); background: color-mix(in srgb, var(--danger) 10%, var(--surface)); font-size: 14px; }

@media (max-width: 520px) {
  .license-lock-page { padding: 12px; }
  .license-lock-panel dl div { grid-template-columns: 1fr; gap: 4px; }
  .license-lock-actions > * { flex: 1; }
  .license-lock-actions .button { width: 100%; }
}

@media (min-width: 1800px) {
  .media-weight-dimensions { gap: 14px; }
  .media-weight-dimension summary { min-height: 50px; padding-inline: 16px; }
  .media-weight-dimension > div { padding: 8px 16px; }
}

@media (max-width: 1280px) {
  .emby-artwork-automation-grid { grid-template-columns: minmax(240px, 1fr) 140px minmax(280px, 1fr); }
  .emby-artwork-workbench { grid-template-columns: minmax(330px, .8fr) minmax(480px, 1.2fr); }
  .emby-artwork-gallery { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}

@media (max-width: 980px) {
  .emby-artwork-automation-grid { grid-template-columns: minmax(230px, 1fr) 140px; }
  .emby-artwork-automation-times { grid-column: 1 / -1; }
  .emby-artwork-workbench { grid-template-columns: 1fr; }
  .emby-artwork-preview-panel { position: static; }
  .emby-artwork-gallery { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  .emby-artwork-hero { min-height: 0; align-items: flex-start; flex-direction: column; }
  .emby-artwork-hub-head { align-items: flex-start; flex-direction: column; gap: 5px; }
  .emby-artwork-server-strip { grid-auto-columns: 100%; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .emby-artwork-server-strip::-webkit-scrollbar { display: none; }
  .emby-artwork-server-card { scroll-snap-align: start; scroll-snap-stop: always; }
  .emby-artwork-automation { padding: 15px; }
  .emby-artwork-automation-head { grid-template-columns: 40px minmax(0, 1fr); }
  .emby-artwork-automation-mark { width: 40px; height: 40px; }
  .emby-artwork-automation-state { grid-column: 2; justify-self: start; }
  .emby-artwork-automation-grid { grid-template-columns: 1fr; }
  .emby-artwork-automation-times { grid-column: auto; }
  .emby-artwork-batch-actions { display: grid; grid-template-columns: 1fr; }
  .emby-artwork-batch-actions .button { width: 100%; }
  .emby-artwork-batch-progress { grid-template-columns: 1fr; }
  .emby-artwork-controls, .emby-artwork-preview-panel { padding: 16px; }
  .emby-artwork-mode-grid { grid-template-columns: 1fr; }
  .emby-artwork-current { display: none; }
  .emby-artwork-preview-meta, .emby-artwork-source > header { align-items: stretch; flex-direction: column; }
  .emby-artwork-actions { grid-template-columns: 1fr 1fr; }
  .emby-artwork-actions [data-artwork-apply] { grid-column: 1 / -1; }
  .emby-artwork-search { width: 100%; }
  .emby-artwork-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
}

@media (max-width: 420px) {
  .emby-artwork-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Library artwork studio: global scope first, template second, one-click apply last. */
.emby-artwork-hero { min-height: 150px; background: linear-gradient(118deg, color-mix(in srgb, var(--primary-soft) 34%, var(--surface)) 0%, var(--surface) 48%, color-mix(in srgb, var(--primary) 13%, var(--surface)) 100%); }
.emby-artwork-flow { display: flex; align-items: center; gap: 7px; }
.emby-artwork-flow > span { min-width: 104px; padding: 10px 12px; display: grid; grid-template-columns: 26px auto; align-items: center; gap: 8px; border: 1px solid color-mix(in srgb, var(--primary) 20%, var(--line)); border-radius: 9px; background: color-mix(in srgb, var(--surface) 78%, transparent); }
.emby-artwork-flow b { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 7px; color: #fff; background: var(--primary); font-size: 13px; }
.emby-artwork-flow i { color: var(--text); font-size: 13px; font-style: normal; font-weight: 750; white-space: nowrap; }
.emby-artwork-server-hub { padding: 15px 16px 16px; background: var(--surface); }
.emby-artwork-server-card { min-height: 68px; border-radius: 10px; }
.emby-artwork-automation { margin-top: 12px; padding: 14px 15px; display: grid; grid-template-columns: minmax(260px, .65fr) minmax(620px, 1.35fr); align-items: center; gap: 18px; border-radius: 12px; background: linear-gradient(110deg, color-mix(in srgb, var(--primary-soft) 35%, var(--surface)) 0%, var(--surface) 55%, color-mix(in srgb, var(--primary) 7%, var(--surface)) 100%); }
.emby-artwork-automation-head { grid-template-columns: 40px minmax(0, 1fr) auto; gap: 10px; }
.emby-artwork-automation-mark { width: 40px; height: 40px; border-radius: 9px; font-size: 19px; }
.emby-artwork-automation-head h2 { margin-top: 2px; font-size: 15px; }
.emby-artwork-automation-head p { margin-top: 2px; font-size: 13px; }
.emby-artwork-automation-grid { margin: 0; padding: 0; grid-template-columns: minmax(190px, .9fr) 118px minmax(250px, 1fr) auto; align-items: center; gap: 9px; border-top: 0; }
.emby-artwork-auto-toggle, .emby-artwork-automation-times { min-height: 50px; border-radius: 9px; background: color-mix(in srgb, var(--surface-soft) 84%, transparent); }
.emby-artwork-auto-toggle { padding: 8px 10px; }
.emby-artwork-interval input { min-height: 50px; }
.emby-artwork-batch-actions { margin: 0; display: grid; grid-template-columns: repeat(2, max-content); justify-content: end; gap: 7px; flex-wrap: nowrap; }
.emby-artwork-batch-actions .button { min-height: 38px; padding-inline: 12px; white-space: nowrap; }
.emby-artwork-automation-status { min-height: 0; margin: 0; grid-column: 1 / -1; }
.emby-artwork-automation-status:empty { display: none; }
.emby-artwork-workbench { margin-top: 14px; grid-template-columns: minmax(480px, .92fr) minmax(560px, 1.08fr); gap: 14px; }
.emby-artwork-controls, .emby-artwork-preview-panel { padding: 20px; border-radius: 12px; }
.emby-artwork-controls { background: linear-gradient(160deg, color-mix(in srgb, var(--surface) 94%, var(--primary) 6%), var(--surface) 38%); }
.emby-artwork-section-head { margin-bottom: 13px; }
.emby-artwork-section-head.compact { margin-top: 20px; padding-top: 18px; }
.emby-artwork-section-head > span { width: 36px; height: 36px; border-radius: 9px; }
.emby-artwork-section-head h2 { font-size: 15px; }
.emby-artwork-scope-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.emby-artwork-scope-grid label { min-width: 0; position: relative; cursor: pointer; }
.emby-artwork-scope-grid input { width: 1px; height: 1px; margin: 0; position: absolute; opacity: 0; pointer-events: none; clip-path: inset(50%); }
.emby-artwork-scope-grid label > span { min-height: 76px; padding: 11px 12px; display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; grid-template-rows: auto auto; align-items: center; gap: 2px 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft); transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease; }
.emby-artwork-scope-grid label:hover > span { border-color: color-mix(in srgb, var(--primary) 34%, var(--line)); transform: translateY(-1px); }
.emby-artwork-scope-grid i { width: 42px; height: 42px; grid-row: 1 / 3; display: grid; place-items: center; border-radius: 9px; color: var(--primary); background: var(--primary-soft); font-size: 17px; font-style: normal; font-weight: 900; }
.emby-artwork-scope-grid b { align-self: end; font-size: 14px; }
.emby-artwork-scope-grid small { align-self: start; overflow: hidden; color: var(--muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.emby-artwork-scope-grid em { grid-column: 3; grid-row: 1 / 3; padding: 5px 7px; border-radius: 999px; color: var(--muted); background: var(--surface); font-size: 12px; font-style: normal; white-space: nowrap; }
.emby-artwork-scope-grid input:checked + span { border-color: var(--primary); background: linear-gradient(120deg, var(--primary-soft), color-mix(in srgb, var(--surface) 92%, var(--primary) 8%)); box-shadow: inset 3px 0 var(--primary), 0 8px 22px color-mix(in srgb, var(--primary) 9%, transparent); }
.emby-artwork-scope-grid input:checked + span em { color: var(--primary); background: color-mix(in srgb, var(--primary) 13%, var(--surface)); }
.emby-artwork-scope-grid input:focus-visible + span { outline: 3px solid color-mix(in srgb, var(--primary) 25%, transparent); outline-offset: 2px; }
.emby-artwork-library-fields { margin-top: 11px; }
.emby-artwork-scope-note { margin-top: 10px; padding: 9px 11px; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 9px; border: 1px solid color-mix(in srgb, var(--primary) 18%, var(--line)); border-radius: 8px; background: color-mix(in srgb, var(--primary-soft) 34%, var(--surface)); }
.emby-artwork-scope-note span { padding: 4px 6px; border-radius: 5px; color: var(--primary); background: var(--primary-soft); font-size: 12px; font-weight: 850; white-space: nowrap; }
.emby-artwork-scope-note p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.45; }
.emby-artwork-mode-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.emby-artwork-mode > span { min-height: 86px; padding: 10px; grid-template-columns: 76px minmax(0, 1fr) auto; grid-template-rows: auto auto; align-items: center; gap: 3px 10px; border-radius: 10px; }
.emby-artwork-mode i { width: 76px; height: 48px; grid-row: 1 / 3; position: relative; overflow: hidden; border: 1px solid color-mix(in srgb, var(--primary) 18%, var(--line)); border-radius: 8px; color: #fff; background: linear-gradient(135deg, #15192a, color-mix(in srgb, var(--primary) 50%, #121626)); }
.emby-artwork-mode i::before, .emby-artwork-mode i::after { content: ''; position: absolute; display: block; }
.emby-artwork-mode i::before { inset: 6px; border-radius: 4px; background: linear-gradient(135deg, rgba(255,255,255,.2), rgba(255,255,255,.03)); }
.emby-artwork-mode i::after { width: 22px; height: 29px; right: 8px; bottom: 6px; border-radius: 3px; background: rgba(255,255,255,.76); box-shadow: -16px 4px 0 rgba(255,255,255,.38); transform: rotate(4deg); }
.emby-artwork-mode i b { position: absolute; top: 7px; left: 8px; z-index: 2; font-size: 12px; line-height: 1; }
.emby-artwork-mode.mode-focus i::after { width: 25px; height: 36px; right: 9px; bottom: 5px; box-shadow: none; }
.emby-artwork-mode.mode-grid i::before { inset: 5px; background: conic-gradient(from 90deg, rgba(255,255,255,.18) 0 25%, rgba(255,255,255,.38) 0 50%, rgba(255,255,255,.12) 0 75%, rgba(255,255,255,.28) 0); }
.emby-artwork-mode.mode-grid i::after { display: none; }
.emby-artwork-mode.mode-gallery i::after { width: 14px; height: 27px; right: 7px; box-shadow: -15px 2px 0 rgba(255,255,255,.58), -30px 4px 0 rgba(255,255,255,.35); }
.emby-artwork-mode.mode-minimal i::before { inset: 0; background: linear-gradient(110deg, rgba(0,0,0,.72), transparent), radial-gradient(circle at 75% 40%, rgba(255,255,255,.35), transparent 36%); }
.emby-artwork-mode.mode-minimal i::after { display: none; }
.emby-artwork-mode.mode-category i { background: #f2f0ea; }
.emby-artwork-mode.mode-category i::before { inset: 18px 5px 5px; background: linear-gradient(135deg, color-mix(in srgb, var(--primary) 58%, #26304d), #20263b); }
.emby-artwork-mode.mode-category i::after { width: 12px; height: 12px; top: 4px; right: 6px; bottom: auto; border-radius: 50%; background: var(--primary); box-shadow: none; }
.emby-artwork-mode.mode-category i b { color: #181b24; }
.emby-artwork-mode strong { font-size: 14px; }
.emby-artwork-mode small { font-size: 12px; }
.emby-artwork-mode em { grid-column: 3; grid-row: 1 / 3; color: var(--muted); font-size: 12px; font-style: normal; white-space: nowrap; }
.emby-artwork-mode > input:checked + span { box-shadow: inset 3px 0 var(--primary), 0 8px 22px color-mix(in srgb, var(--primary) 8%, transparent); }
.emby-artwork-mode > input:checked + span em { color: var(--primary); font-weight: 800; }
.emby-artwork-mode > input:checked + span em::before { content: '✓ '; }
.emby-artwork-preview-panel { top: 96px; padding: 18px; border-color: color-mix(in srgb, var(--primary) 20%, var(--line)); background: linear-gradient(155deg, color-mix(in srgb, var(--surface) 95%, var(--primary) 5%), var(--surface)); }
.emby-artwork-preview-head { min-height: 48px; margin-bottom: 12px; }
.emby-artwork-preview-scope { padding: 6px 9px; border: 1px solid color-mix(in srgb, var(--primary) 24%, var(--line)); border-radius: 999px; color: var(--primary) !important; background: var(--primary-soft); font-size: 13px !important; letter-spacing: 0 !important; white-space: nowrap; }
.emby-artwork-canvas-shell { border-radius: 11px; box-shadow: 0 22px 55px rgba(0,0,0,.22); }
.emby-artwork-preview-tools { margin-top: 8px; display: flex; justify-content: flex-end; gap: 7px; }
.emby-artwork-preview-tools .button { min-height: 34px; padding-inline: 10px; font-size: 13px; }
.emby-artwork-commit { margin-top: 11px; padding: 12px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 14px; border: 1px solid color-mix(in srgb, var(--primary) 28%, var(--line)); border-radius: 10px; background: linear-gradient(115deg, color-mix(in srgb, var(--primary-soft) 70%, var(--surface)), color-mix(in srgb, var(--surface) 92%, var(--primary) 8%)); }
.emby-artwork-commit > div { min-width: 0; display: grid; gap: 3px; }
.emby-artwork-commit span { color: var(--primary); font-size: 12px; font-weight: 850; letter-spacing: .06em; }
.emby-artwork-commit strong { overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.emby-artwork-commit small { overflow: hidden; color: var(--muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.emby-artwork-commit .button { min-width: 190px; min-height: 44px; box-shadow: 0 10px 24px color-mix(in srgb, var(--primary) 20%, transparent); }
.emby-artwork-batch-progress { margin-top: 10px; }
.emby-artwork-status { min-height: 18px; margin-top: 8px; }
.emby-artwork-source { margin-top: 14px; padding: 18px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }

@media (max-width: 1500px) {
  .emby-artwork-automation { grid-template-columns: 1fr; gap: 12px; }
  .emby-artwork-automation-grid { grid-template-columns: minmax(190px, 1fr) 118px minmax(240px, 1fr) auto; }
  .emby-artwork-workbench { grid-template-columns: minmax(420px, .9fr) minmax(500px, 1.1fr); }
  .emby-artwork-scope-grid label > span { grid-template-columns: 42px minmax(0, 1fr); grid-template-rows: auto auto auto; }
  .emby-artwork-scope-grid i { grid-row: 1 / 4; }
  .emby-artwork-scope-grid em { grid-column: 2; grid-row: 3; justify-self: start; margin-top: 3px; }
  .emby-artwork-mode > span { grid-template-columns: 64px minmax(0, 1fr); }
  .emby-artwork-mode i { width: 64px; }
  .emby-artwork-mode em { display: none; }
}

@media (max-width: 1100px) {
  .emby-artwork-flow { display: none; }
  .emby-artwork-automation-grid { grid-template-columns: minmax(190px, 1fr) 118px minmax(240px, 1fr); }
  .emby-artwork-batch-actions { grid-column: 1 / -1; justify-content: end; }
  .emby-artwork-workbench { grid-template-columns: 1fr; }
  .emby-artwork-preview-panel { position: static; }
}

@media (max-width: 720px) {
  .emby-artwork-hero { padding: 20px; }
  .emby-artwork-controls, .emby-artwork-preview-panel { padding: 15px; }
  .emby-artwork-automation-grid, .emby-artwork-scope-grid { grid-template-columns: 1fr; }
  .emby-artwork-automation-times, .emby-artwork-batch-actions { grid-column: auto; }
  .emby-artwork-batch-actions { grid-template-columns: 1fr; }
  .emby-artwork-mode > span { grid-template-columns: 70px minmax(0, 1fr); }
  .emby-artwork-mode-grid { grid-template-columns: 1fr; }
  .emby-artwork-mode i { width: 70px; }
  .emby-artwork-commit { grid-template-columns: 1fr; }
  .emby-artwork-commit .button { width: 100%; min-width: 0; }
  .emby-artwork-preview-tools { display: grid; grid-template-columns: 1fr 1fr; }
  .emby-artwork-preview-tools .button { width: 100%; }
}

/* Plugin center */
.plugin-center-hero { min-height: 184px; margin-bottom: 16px; padding: 26px 28px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 28px; overflow: hidden; position: relative; border: 1px solid color-mix(in srgb, var(--primary) 23%, var(--line)); border-radius: 18px; background: radial-gradient(circle at 86% 14%, color-mix(in srgb, var(--primary) 22%, transparent), transparent 34%), linear-gradient(135deg, color-mix(in srgb, var(--surface) 95%, var(--primary) 5%), var(--surface)); box-shadow: var(--shadow); }
.plugin-center-hero::after { width: 180px; height: 180px; position: absolute; right: -62px; bottom: -92px; border: 1px solid color-mix(in srgb, var(--primary) 28%, transparent); border-radius: 50%; content: ''; box-shadow: 0 0 0 28px color-mix(in srgb, var(--primary) 5%, transparent), 0 0 0 58px color-mix(in srgb, var(--primary) 3%, transparent); pointer-events: none; }
.plugin-center-hero > div:first-child { min-width: 0; position: relative; z-index: 1; }
.plugin-center-hero > div:first-child > span, .plugin-section > header > div > span { color: var(--primary); font-size: 13px; font-weight: 900; letter-spacing: .15em; }
.plugin-center-hero h1 { margin: 9px 0 7px; font-size: clamp(24px, 2.2vw, 34px); letter-spacing: -.03em; }
.plugin-center-hero p { max-width: 700px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.7; }
.plugin-center-stats { min-width: 470px; padding: 15px; display: grid; grid-template-columns: repeat(3, minmax(80px, 1fr)) auto; align-items: center; gap: 8px; position: relative; z-index: 1; border: 1px solid color-mix(in srgb, var(--primary) 15%, var(--line)); border-radius: 14px; background: color-mix(in srgb, var(--surface) 88%, transparent); backdrop-filter: blur(14px); }
.plugin-center-stats > div { min-width: 0; padding: 7px 12px; display: grid; gap: 3px; border-right: 1px solid var(--line); }
.plugin-center-stats > div:nth-child(3) { border-right: 0; }
.plugin-center-stats strong { font-size: 22px; line-height: 1; }
.plugin-center-stats span { color: var(--muted); font-size: 13px; white-space: nowrap; }
.plugin-center-stats .button { min-height: 40px; white-space: nowrap; }
.plugin-toolbar { min-height: 64px; margin-bottom: 22px; padding: 9px 11px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border: 1px solid var(--line); border-radius: 14px; background: color-mix(in srgb, var(--surface) 94%, transparent); }
.plugin-filter { padding: 4px; display: flex; gap: 4px; border-radius: 10px; background: var(--surface-soft); }
.plugin-filter button { min-height: 36px; padding: 0 15px; border: 0; border-radius: 8px; color: var(--muted); background: transparent; font-size: 14px; font-weight: 750; cursor: pointer; }
.plugin-filter button:hover { color: var(--text); }
.plugin-filter button.active { color: white; background: var(--primary); box-shadow: 0 7px 17px color-mix(in srgb, var(--primary) 22%, transparent); }
.plugin-safety-note { min-width: 0; display: flex; align-items: center; gap: 10px; }
.plugin-safety-note > span { width: 34px; height: 34px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 9px; color: var(--success); background: var(--success-soft); font-size: 13px; font-weight: 850; }
.plugin-safety-note p { margin: 0; display: grid; gap: 2px; text-align: right; }
.plugin-safety-note strong { font-size: 13px; }
.plugin-safety-note small { color: var(--muted); font-size: 13px; }
.plugin-section { margin-bottom: 28px; }
.plugin-section[hidden] { display: none; }
.plugin-section > header { min-height: 58px; margin-bottom: 12px; display: flex; align-items: end; justify-content: space-between; gap: 20px; }
.plugin-section > header h2 { margin: 5px 0 3px; font-size: 18px; }
.plugin-section > header p { margin: 0; color: var(--muted); font-size: 13px; }
.plugin-section > header > strong { padding: 6px 9px; border-radius: 999px; color: var(--primary); background: var(--primary-soft); font-size: 13px; white-space: nowrap; }
.plugin-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; }
.plugin-card { min-width: 0; min-height: 238px; padding: 18px; display: flex; flex-direction: column; gap: 13px; border: 1px solid var(--line); border-radius: 15px; background: linear-gradient(145deg, color-mix(in srgb, var(--surface) 97%, var(--primary) 3%), var(--surface)); box-shadow: 0 10px 28px color-mix(in srgb, #111827 7%, transparent); transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.plugin-card.builtin { cursor: pointer; }
.plugin-card[aria-busy="true"], .plugin-card[aria-busy="true"] a { cursor: progress; }
.plugin-card[aria-busy="true"] .plugin-card-icon { opacity: .55; }
.plugin-card:hover { border-color: color-mix(in srgb, var(--primary) 28%, var(--line)); box-shadow: 0 15px 34px color-mix(in srgb, var(--primary) 9%, transparent); transform: translateY(-2px); }
.plugin-card.builtin:focus-visible { outline: none; border-color: var(--primary); box-shadow: var(--ui-ring), 0 15px 34px color-mix(in srgb, var(--primary) 9%, transparent); transform: translateY(-2px); }
.plugin-card[hidden] { display: none; }
.plugin-card > header { display: grid; grid-template-columns: 46px minmax(0, 1fr) auto; align-items: center; gap: 12px; }
.plugin-card-icon { width: 46px; height: 46px; display: grid; place-items: center; border: 1px solid color-mix(in srgb, var(--primary) 24%, transparent); border-radius: 13px; color: white; background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 62%, #53389e)); font-size: 14px; font-weight: 900; box-shadow: 0 8px 18px color-mix(in srgb, var(--primary) 22%, transparent); }
.plugin-card-icon.community { color: var(--primary); background: var(--primary-soft); box-shadow: none; }
.plugin-card > header > div { min-width: 0; display: grid; gap: 3px; }
.plugin-card > header > div > span { overflow: hidden; color: var(--muted); font-size: 12px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.plugin-card h2 { margin: 0; overflow: hidden; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.plugin-card > header > em { align-self: start; padding: 4px 7px; border: 1px solid color-mix(in srgb, var(--primary) 17%, var(--line)); border-radius: 999px; color: var(--primary); background: var(--primary-soft); font-size: 12px; font-style: normal; font-weight: 850; }
.plugin-card > p { min-height: 38px; margin: 0; color: var(--muted); font-size: 13px; line-height: 1.65; }
.plugin-permissions { display: flex; flex-wrap: wrap; gap: 5px; }
.plugin-permissions span { padding: 5px 7px; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); background: var(--surface-soft); font-size: 12px; font-weight: 700; }
.plugin-author { min-height: 22px; display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: 13px; }
.plugin-author strong { color: var(--text); }
.plugin-author a { margin-left: auto; color: var(--primary); }
.plugin-card > footer { margin-top: auto; padding-top: 12px; display: flex; align-items: center; justify-content: space-between; gap: 10px; border-top: 1px solid var(--line); }
.plugin-runtime { min-width: 0; display: grid; grid-template-columns: 8px minmax(0, auto); align-items: center; gap: 2px 7px; }
.plugin-runtime > i { width: 7px; height: 7px; grid-row: 1 / 3; border-radius: 50%; background: var(--muted); box-shadow: 0 0 0 4px color-mix(in srgb, var(--muted) 10%, transparent); }
.plugin-runtime.success > i { background: var(--success); box-shadow: 0 0 0 4px var(--success-soft); }
.plugin-runtime.warning > i { background: var(--warning); box-shadow: 0 0 0 4px color-mix(in srgb, var(--warning) 12%, transparent); }
.plugin-runtime b { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.plugin-runtime small { overflow: hidden; color: var(--muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.plugin-card-open { display: inline-flex; align-items: center; gap: 6px; color: var(--primary); font-size: 13px; font-weight: 800; white-space: nowrap; }
.plugin-card-open b { font-size: 14px; transition: transform .18s ease; }
.plugin-card.builtin:hover .plugin-card-open b, .plugin-card.builtin:focus-visible .plugin-card-open b { transform: translateX(3px); }
.plugin-card-actions { display: flex; gap: 6px; }
.plugin-card-actions form { margin: 0; }
.plugin-card-actions .button { min-height: 34px; padding-inline: 10px; font-size: 13px; }
.plugin-card-actions .channel-plugin-remove { display: inline-flex; align-items: center; justify-content: center; gap: 5px; }
.plugin-card-actions .channel-plugin-remove svg { width: 15px; height: 15px; }
.plugin-empty { grid-column: 1 / -1; min-height: 220px; padding: 28px; display: grid; place-items: center; align-content: center; gap: 7px; border: 1px dashed color-mix(in srgb, var(--primary) 30%, var(--line)); border-radius: 15px; background: color-mix(in srgb, var(--primary-soft) 20%, var(--surface)); text-align: center; }
.plugin-empty > span { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 14px; color: var(--primary); background: var(--primary-soft); font-size: 24px; }
.plugin-empty h3, .plugin-empty p { margin: 0; }
.plugin-empty p { color: var(--muted); font-size: 13px; }
.plugin-empty .button { margin-top: 8px; }
.plugin-install-dialog { width: min(620px, calc(100vw - 28px)); }
.plugin-install-dialog form { display: grid; gap: 14px; }
.plugin-dropzone { min-height: 178px; padding: 24px; display: grid; place-items: center; align-content: center; gap: 7px; border: 1px dashed color-mix(in srgb, var(--primary) 38%, var(--line)); border-radius: 14px; background: color-mix(in srgb, var(--primary-soft) 30%, var(--surface)); cursor: pointer; text-align: center; transition: .18s ease; }
.plugin-dropzone:hover { border-color: var(--primary); background: color-mix(in srgb, var(--primary-soft) 52%, var(--surface)); }
.plugin-dropzone input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.plugin-dropzone > span { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 12px; color: white; background: var(--primary); font-size: 22px; }
.plugin-dropzone strong { font-size: 14px; }
.plugin-dropzone small { color: var(--muted); font-size: 13px; }
.plugin-install-preview { min-height: 58px; padding: 10px 12px; display: flex; align-items: center; gap: 11px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface-soft); color: var(--muted); font-size: 13px; }
.plugin-preview-icon { width: 36px; height: 36px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 9px; color: var(--primary); background: var(--primary-soft); font-weight: 900; }
.plugin-install-preview > div { min-width: 0; display: grid; gap: 3px; }
.plugin-install-preview strong, .plugin-install-preview small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.plugin-install-preview strong { color: var(--text); font-size: 14px; }
.plugin-install-preview small { color: var(--muted); font-size: 13px; }
.plugin-settings-dialog { width: min(1120px, calc(100vw - 32px)); }
.plugin-settings-dialog .plugin-configuration { min-height: 0; margin: 0; display: flex; flex: 1 1 auto; flex-direction: column; overflow: hidden; border: 0; border-radius: 0; box-shadow: none; }
.plugin-configuration { margin-bottom: 20px; overflow: hidden; border: 1px solid color-mix(in srgb, var(--primary) 24%, var(--line)); border-radius: 18px; background: linear-gradient(145deg, color-mix(in srgb, var(--surface) 97%, var(--primary) 3%), var(--surface)); box-shadow: var(--shadow); }
.plugin-configuration-head { min-height: 98px; flex: 0 0 auto; padding: 18px 20px; display: grid; grid-template-columns: 50px minmax(0, 1fr) auto 36px; align-items: center; gap: 13px; border-bottom: 1px solid var(--line); background: radial-gradient(circle at 92% 0, color-mix(in srgb, var(--primary) 14%, transparent), transparent 34%); }
.plugin-configuration-head > .plugin-configuration-close { width: 36px; height: 36px; margin: 0; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 10px; color: var(--muted); background: var(--surface-soft); font-size: 19px; }
.plugin-configuration-head > .plugin-configuration-close:hover { color: var(--primary); border-color: color-mix(in srgb, var(--primary) 28%, var(--line)); }
.plugin-configuration-head .plugin-card-icon { width: 50px; height: 50px; }
.plugin-configuration-head > div { min-width: 0; display: grid; gap: 3px; }
.plugin-configuration-head > div > span { color: var(--primary); font-size: 12px; font-weight: 900; letter-spacing: .12em; }
.plugin-configuration-head h2 { margin: 0; font-size: 19px; }
.plugin-configuration-head p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.plugin-configuration-permissions { min-height: 48px; flex: 0 0 auto; padding: 8px 20px; display: flex; align-items: center; flex-wrap: wrap; gap: 6px; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface-soft) 54%, transparent); }
.plugin-configuration-permissions strong { margin-right: 3px; font-size: 13px; }
.plugin-configuration-permissions span { padding: 4px 7px; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); background: var(--surface); font-size: 12px; }
.plugin-configuration-body { padding: 18px; display: grid; gap: 14px; }
.plugin-settings-dialog .plugin-configuration-body { min-height: 0; flex: 1 1 auto; align-content: start; grid-auto-rows: max-content; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.plugin-settings-dialog .plugin-configuration-body > .card { height: max-content; align-self: start; }
.plugin-settings-dialog .plugin-configuration > .notice { margin: 12px 18px 0; flex: 0 0 auto; }
.plugin-configuration-body > .card { width: 100%; margin: 0; box-shadow: none; }
.plugin-configuration-body > .tmdb-settings-card { grid-column: auto; }
.plugin-emby-summary { padding: 18px; display: grid; gap: 16px; }
.plugin-emby-server-list { display: grid; gap: 8px; }
.plugin-emby-server { min-height: 58px; padding: 10px 12px; display: grid; gap: 5px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface-soft); }
.plugin-emby-server > span { min-width: 0; display: flex; align-items: center; gap: 8px; }
.plugin-emby-server i { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: var(--warning); }
.plugin-emby-server i.ready { background: var(--success); box-shadow: 0 0 0 4px var(--success-soft); }
.plugin-emby-server strong, .plugin-emby-server small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.plugin-emby-server strong { font-size: 14px; }
.plugin-emby-server em { padding: 3px 6px; border-radius: 999px; color: var(--primary); background: var(--primary-soft); font-size: 12px; font-style: normal; font-weight: 800; }
.plugin-emby-server small, .plugin-emby-empty small { color: var(--muted); font-size: 13px; }
.plugin-emby-empty { min-height: 100px; display: grid; place-items: center; align-content: center; gap: 5px; border: 1px dashed var(--line); border-radius: 11px; text-align: center; }
.plugin-card.community[role="button"] { cursor: pointer; }
.plugin-card.community[role="button"]:focus-visible { outline: none; border-color: var(--primary); box-shadow: var(--ui-ring), 0 15px 34px color-mix(in srgb, var(--primary) 9%, transparent); transform: translateY(-2px); }
.channel-plugin-dialog .plugin-configuration-body { display: grid; gap: 14px; }
.channel-plugin-settings, .channel-plugin-network, .channel-plugin-components, .channel-plugin-search-panel { margin: 0; }
.channel-plugin-settings > form { min-width: 0; display: grid; gap: 14px; }
.channel-plugin-network > form { min-width: 0; display: block; }
.channel-plugin-network .proxy-switch { width: 100%; min-height: 64px; }
.channel-plugin-user-info { margin-bottom: 14px; padding: 11px 12px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; border: 1px solid color-mix(in srgb, var(--primary) 24%, var(--line)); border-radius: 8px; background: color-mix(in srgb, var(--primary-soft) 42%, var(--surface)); }
.channel-plugin-user-info > span { min-width: 0; display: flex; align-items: baseline; gap: 4px; }
.channel-plugin-user-info small { color: var(--muted); font-size: 12px; }
.channel-plugin-user-info strong { font-size: 13px; }
.channel-plugin-component-actions { display: flex; align-items: end; justify-content: space-between; gap: 12px; }
.channel-plugin-component-form { min-width: 0; flex: 1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)) auto; align-items: end; gap: 10px; }
.channel-plugin-component-form > .checkbox { min-height: var(--ui-control-md); align-self: end; }
.channel-plugin-component-form .settings-form-actions { align-self: end; }
.channel-plugin-component-actions > form:last-child { margin: 0; }
.channel-plugin-checkin-form { flex: 0 1 320px; display: grid; grid-template-columns: minmax(150px, 1fr) auto; align-items: end; gap: 8px; }
.channel-plugin-checkin-form > .field { min-width: 0; }
.channel-plugin-checkin-form > .button { min-height: var(--ui-control-md); white-space: nowrap; }
.channel-plugin-custom-actions { display: grid; gap: 10px; }
.channel-plugin-custom-action { padding: 12px; display: grid; grid-template-columns: minmax(150px, .7fr) minmax(0, 1.3fr); align-items: center; gap: 12px 18px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-subtle); }
.channel-plugin-custom-action-copy { min-width: 0; display: grid; gap: 3px; }
.channel-plugin-custom-action-copy strong { font-size: 13px; }
.channel-plugin-custom-action-copy small { color: var(--muted); font-size: 12px; line-height: 1.55; }
.channel-plugin-custom-action > form { min-width: 0; display: flex; align-items: end; justify-content: flex-end; gap: 10px; }
.channel-plugin-custom-action-fields { min-width: 0; flex: 1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: end; gap: 10px; }
.channel-plugin-custom-action-fields:empty { display: none; }
.channel-plugin-custom-action-fields .field { min-width: 0; }
.channel-plugin-custom-action > form > .button { min-height: var(--ui-control-md); white-space: nowrap; }
.channel-plugin-action-checkbox { min-height: var(--ui-control-md); align-self: end; }
.channel-plugin-search-form { margin-top: 14px; }
.channel-plugin-search-form .input-with-button { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: stretch; gap: 10px; }
.channel-plugin-search-form .input-with-button .button { min-width: 86px; justify-content: center; }
.channel-plugin-search-status { min-height: 36px; margin-top: 10px; padding: 8px 10px; display: flex; align-items: center; border: 1px solid var(--line); border-radius: 8px; color: var(--muted); background: var(--surface-subtle); font-size: 12px; font-weight: 750; }
.channel-plugin-search-status[data-tone="success"] { border-color: color-mix(in srgb, var(--success) 30%, var(--line)); color: var(--success); background: var(--success-soft); }
.channel-plugin-search-status[data-tone="error"] { border-color: color-mix(in srgb, var(--danger) 30%, var(--line)); color: var(--danger); background: var(--danger-soft); }
.channel-plugin-search-results { margin-top: 10px; display: grid; gap: 8px; }
.channel-plugin-result { min-width: 0; padding: 11px 12px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.channel-plugin-result .channel-plugin-resource-identity { min-width: 0; }
.channel-plugin-result-copy { min-width: 0; display: grid; gap: 3px; }
.channel-plugin-result strong, .channel-plugin-result small, .channel-plugin-result p { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.channel-plugin-result strong { font-size: 13px; }
.channel-plugin-result small { color: var(--muted); font-size: 12px; }
.channel-plugin-result p { margin: 0; color: var(--muted); font-size: 12px; }
.channel-plugin-result .button { min-height: 34px; padding-inline: 10px; white-space: nowrap; }
.channel-plugin-management { padding: 12px 0 0; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid var(--line); }
.channel-plugin-management > div { min-width: 0; display: flex; align-items: center; gap: 8px; }
.channel-plugin-management > div:first-child { display: grid; gap: 2px; }
.channel-plugin-management small { overflow: hidden; color: var(--muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.channel-plugin-management form { margin: 0; }
@media (min-width: 901px) {
  .channel-plugin-settings,
  .channel-plugin-network,
  .channel-plugin-components,
  .channel-plugin-search-panel { padding: 22px 24px; display: grid; grid-template-columns: minmax(250px, .62fr) minmax(0, 1.38fr); column-gap: 30px; row-gap: 12px; align-items: start; }
  .channel-plugin-settings > .settings-section-head,
  .channel-plugin-network > .settings-section-head,
  .channel-plugin-components > .settings-section-head,
  .channel-plugin-search-panel > .settings-section-head { min-width: 0; margin: 0; display: grid; grid-template-columns: 44px minmax(0, 1fr); align-items: start; gap: 4px 13px; grid-column: 1; grid-row: 1 / span 3; }
  .channel-plugin-settings > .settings-section-head > .settings-section-icon,
  .channel-plugin-network > .settings-section-head > .settings-section-icon,
  .channel-plugin-components > .settings-section-head > .settings-section-icon,
  .channel-plugin-search-panel > .settings-section-head > .settings-section-icon { grid-column: 1; grid-row: 1 / span 2; }
  .channel-plugin-settings > .settings-section-head > div,
  .channel-plugin-network > .settings-section-head > div,
  .channel-plugin-components > .settings-section-head > div,
  .channel-plugin-search-panel > .settings-section-head > div { min-width: 0; grid-column: 2; }
  .channel-plugin-settings > .settings-section-head > .badge,
  .channel-plugin-network > .settings-section-head > .badge { width: max-content; margin-top: 6px; grid-column: 2; justify-self: start; }
  .channel-plugin-settings > form { grid-column: 2; align-self: center; }
  .channel-plugin-network > form { grid-column: 2; align-self: center; }
  .channel-plugin-settings > form .settings-form-actions { margin-top: 0; }
  .channel-plugin-components > .channel-plugin-user-info,
  .channel-plugin-components > .channel-plugin-component-actions,
  .channel-plugin-components > .channel-plugin-custom-actions { min-width: 0; margin: 0; grid-column: 2; }
  .channel-plugin-search-panel > .channel-plugin-search-form,
  .channel-plugin-search-panel > .channel-plugin-search-status,
  .channel-plugin-search-panel > .channel-plugin-search-results { min-width: 0; margin: 0; grid-column: 2; }
  .channel-plugin-search-panel > .channel-plugin-search-status { margin-top: 2px; }
}
.site-signin-settings { padding: 18px; display: grid; gap: 16px; }
.site-signin-settings > .notice { margin: 0; }
.site-signin-settings > form { display: grid; gap: 16px; }
.site-signin-schedule { padding: 14px; display: grid; grid-template-columns: minmax(260px, 1fr) minmax(300px, 360px) 160px; align-items: end; gap: 12px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-soft); }
.site-signin-time-window { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr) 24px minmax(0, 1fr); align-items: end; gap: 8px; }
.site-signin-time-window .field, .site-signin-retry-field { min-width: 0; margin: 0; }
.site-signin-time-window select, .site-signin-time-window .ui-select-trigger, .site-signin-retry-field select, .site-signin-retry-field .ui-select-trigger { height: 43px; min-height: 43px; border-radius: 10px; }
.site-signin-time-divider { height: 43px; display: grid; place-items: center; color: var(--muted); font-size: 13px; font-weight: 800; }
.site-signin-toggle { min-height: 58px; padding: 10px 12px; display: flex; align-items: center; gap: 11px; border: 1px solid color-mix(in srgb, var(--primary) 18%, var(--line)); border-radius: 10px; background: var(--surface); cursor: pointer; }
.site-signin-toggle input { width: 16px; height: 16px; accent-color: var(--primary); }
.site-signin-toggle > span { display: grid; gap: 3px; }
.site-signin-toggle b { font-size: 14px; }
.site-signin-toggle small { color: var(--muted); font-size: 12px; }
.site-signin-master { background: linear-gradient(135deg, color-mix(in srgb, var(--primary-soft) 78%, var(--surface)), var(--surface)); }
.site-signin-scope { padding: 15px; display: grid; gap: 12px; border: 1px solid var(--line); border-radius: 13px; }
.site-signin-scope > header, .site-signin-history-list > header { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.site-signin-scope h3, .site-signin-history-list h3 { margin: 0; font-size: 14px; }
.site-signin-scope p { margin: 3px 0 0; color: var(--muted); font-size: 13px; }
.site-signin-scope > header > a { color: var(--primary); font-size: 13px; font-weight: 800; }
.site-signin-mode { padding: 4px; display: inline-flex; justify-self: start; gap: 4px; border-radius: 10px; background: var(--surface-soft); }
.site-signin-mode label { cursor: pointer; }
.site-signin-mode input { position: absolute; width: 1px; height: 1px; min-height: 0; margin: 0; overflow: hidden; opacity: 0; pointer-events: none; clip-path: inset(50%); }
.site-signin-mode span { min-height: 34px; padding: 0 13px; display: inline-flex; align-items: center; border-radius: 8px; color: var(--muted); font-size: 13px; font-weight: 800; }
.site-signin-mode input:checked + span { color: white; background: var(--primary); box-shadow: 0 6px 14px color-mix(in srgb, var(--primary) 22%, transparent); }
.site-signin-site-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; transition: opacity .18s ease; }
.site-signin-site-grid.all-sites { opacity: .58; }
.site-signin-site { min-width: 0; cursor: pointer; }
.site-signin-site > input { position: absolute; width: 1px; height: 1px; min-height: 0; margin: 0; overflow: hidden; opacity: 0; clip-path: inset(50%); }
.site-signin-site > span { min-height: 54px; padding: 8px 10px; display: grid; grid-template-columns: 34px minmax(0, 1fr); grid-template-rows: auto auto; align-items: center; gap: 1px 9px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft); transition: .16s ease; }
.site-signin-site img, .site-signin-site i { width: 34px; height: 34px; grid-row: 1 / 3; display: grid; place-items: center; object-fit: contain; border-radius: 9px; background: var(--surface); }
.site-signin-site i .ui-icon { width: 17px; height: 17px; color: var(--primary); }
.site-signin-site b, .site-signin-site small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.site-signin-site b { font-size: 13px; }
.site-signin-site small { color: var(--muted); font-size: 12px; }
.site-signin-site input:checked + span { border-color: var(--primary); background: var(--primary-soft); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary) 18%, transparent); }
.site-signin-runbar { min-height: 68px; padding: 12px 14px; display: flex; align-items: center; justify-content: space-between; gap: 14px; border: 1px solid color-mix(in srgb, var(--primary) 22%, var(--line)); border-radius: 13px; background: radial-gradient(circle at 92% 0, color-mix(in srgb, var(--primary) 13%, transparent), transparent 38%), var(--surface-soft); }
.site-signin-runbar > div { display: grid; gap: 3px; }
.site-signin-runbar strong { font-size: 14px; }
.site-signin-runbar small { color: var(--muted); font-size: 12px; }
.site-signin-runbar form { margin: 0; }
.site-signin-history-list { display: grid; gap: 8px; }
.site-signin-history-list > header > span { color: var(--muted); font-size: 12px; }
.site-signin-history { overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft); }
.site-signin-history summary { min-height: 50px; padding: 8px 11px; display: grid; grid-template-columns: minmax(140px, 1fr) auto auto 18px; align-items: center; gap: 12px; cursor: pointer; list-style: none; }
.site-signin-history summary::-webkit-details-marker { display: none; }
.site-signin-history summary > strong { font-size: 13px; }
.site-signin-history summary > time { color: var(--muted); font-size: 12px; }
.site-signin-history summary > i { color: var(--muted); transition: transform .16s ease; }
.site-signin-history[open] summary > i { transform: rotate(180deg); }
.site-signin-history ul { margin: 0; padding: 5px 11px 10px; display: grid; gap: 5px; border-top: 1px solid var(--line); list-style: none; }
.site-signin-history li { min-height: 34px; padding: 5px 7px; display: grid; grid-template-columns: 8px 110px minmax(0, 1fr) auto; align-items: center; gap: 8px; border-radius: 7px; background: var(--surface); }
.site-signin-history li b { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.site-signin-history li small { overflow: hidden; color: var(--muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.site-signin-history li em { color: var(--muted); font-size: 12px; font-style: normal; }
.site-signin-result-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--muted); }
.site-signin-result-dot.success, .site-signin-result-dot.already { background: var(--success); box-shadow: 0 0 0 3px var(--success-soft); }
.site-signin-result-dot.warning, .site-signin-result-dot.unsupported { background: var(--warning); }
.site-signin-result-dot.failed { background: var(--danger); }
.plugin-empty.compact { min-height: 130px; padding: 18px; }
@media (max-width: 900px) { .site-signin-schedule { grid-template-columns: minmax(0, 1fr) minmax(150px, .55fr); } .site-signin-toggle { grid-column: 1 / -1; } .site-signin-site-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .site-signin-schedule, .site-signin-site-grid { grid-template-columns: 1fr; } .site-signin-time-window, .site-signin-retry-field { width: 100%; } .site-signin-runbar { align-items: stretch; flex-direction: column; } .site-signin-runbar .button { width: 100%; } .site-signin-history summary { grid-template-columns: 1fr auto 18px; } .site-signin-history summary > time { display: none; } .site-signin-history li { grid-template-columns: 8px 84px minmax(0, 1fr); } .site-signin-history li em { display: none; } }
.pt-sites-section { margin-top: 4px; }
.pt-site-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; }
.pt-site-card { min-width: 0; min-height: 205px; padding: 15px; display: flex; flex-direction: column; gap: 12px; border: 1px solid var(--line); border-radius: 14px; background: linear-gradient(145deg, color-mix(in srgb, var(--surface) 97%, var(--primary) 3%), var(--surface)); cursor: pointer; box-shadow: 0 8px 22px color-mix(in srgb, #111827 6%, transparent); transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.pt-site-card:hover, .pt-site-card:focus-visible { outline: 0; border-color: color-mix(in srgb, var(--primary) 34%, var(--line)); box-shadow: 0 13px 28px color-mix(in srgb, var(--primary) 9%, transparent); transform: translateY(-2px); }
.pt-site-card > script { display: none; }
.pt-site-card > header { min-width: 0; display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; align-items: center; gap: 10px; }
.pt-site-icon { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 11px; color: white; background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 55%, #22d3ee)); box-shadow: 0 7px 16px color-mix(in srgb, var(--primary) 23%, transparent); }
.pt-site-icon .ui-icon { width: 20px; height: 20px; }
.pt-site-card > header > div { min-width: 0; display: grid; gap: 2px; }
.pt-site-card > header span:not(.pt-site-icon) { overflow: hidden; color: var(--muted); font-size: 12px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.pt-site-card h3 { margin: 0; overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.pt-site-card > header em { align-self: start; padding: 4px 6px; border-radius: 999px; color: var(--muted); background: var(--surface-soft); font-size: 12px; font-style: normal; font-weight: 850; }
.pt-site-card > header em.enabled { color: var(--success); background: var(--success-soft); }
.pt-site-card > p { margin: 0; overflow: hidden; color: var(--muted); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.pt-site-tags { display: flex; flex-wrap: wrap; gap: 5px; }
.pt-site-tags span { padding: 4px 6px; display: inline-flex; align-items: center; gap: 4px; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); background: var(--surface-soft); font-size: 12px; font-weight: 750; }
.pt-site-tags .ui-icon { width: 11px; height: 11px; }
.pt-site-card > footer { margin-top: auto; padding-top: 11px; display: flex; align-items: center; justify-content: space-between; gap: 8px; border-top: 1px solid var(--line); }
.pt-site-actions { flex: 0 0 auto; display: flex; gap: 4px; }
.pt-site-actions form { margin: 0; }
.pt-site-actions .icon-command { width: 30px; height: 30px; min-height: 30px; }
.pt-site-actions .icon-command .ui-icon { width: 14px; height: 14px; }
.pt-site-add-card { min-height: 205px; padding: 18px; display: grid; place-items: center; align-content: center; gap: 7px; border: 1px dashed color-mix(in srgb, var(--primary) 34%, var(--line)); border-radius: 14px; color: var(--primary); background: color-mix(in srgb, var(--primary-soft) 23%, var(--surface)); cursor: pointer; text-align: center; transition: .18s ease; }
.pt-site-add-card:hover { border-color: var(--primary); background: color-mix(in srgb, var(--primary-soft) 46%, var(--surface)); transform: translateY(-2px); }
.pt-site-add-card > .ui-icon { width: 30px; height: 30px; padding: 7px; border-radius: 10px; color: white; background: var(--primary); box-sizing: content-box; }
.pt-site-add-card strong { color: var(--text); font-size: 14px; }
.pt-site-add-card small { color: var(--muted); font-size: 12px; }
.pt-sites-security { min-height: 58px; margin-top: 13px; padding: 10px 12px; display: flex; align-items: center; gap: 10px; border: 1px solid color-mix(in srgb, var(--success) 18%, var(--line)); border-radius: 11px; color: var(--success); background: color-mix(in srgb, var(--success-soft) 60%, var(--surface)); }
.pt-sites-security > .ui-icon { width: 19px; height: 19px; flex: 0 0 auto; }
.pt-sites-security > span { display: grid; gap: 2px; }
.pt-sites-security strong { color: var(--text); font-size: 13px; }
.pt-sites-security small { color: var(--muted); font-size: 12px; line-height: 1.5; }
.pt-site-editor-dialog { width: min(920px, calc(100vw - 28px)); height: min(900px, calc(100dvh - 28px)); max-height: calc(100dvh - 28px); }
.pt-site-editor-dialog > form { width: 100%; height: 100%; min-height: 0; display: flex; flex: 1 1 auto; flex-direction: column; overflow: hidden; }
.pt-site-dialog-head { background: radial-gradient(circle at 88% 0, color-mix(in srgb, var(--primary) 15%, transparent), transparent 40%); }
.pt-site-editor-body { min-height: 0; padding: 18px 20px 96px; display: grid; flex: 1 1 auto; align-content: start; gap: 16px; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; scroll-padding-bottom: 96px; touch-action: pan-y; -webkit-overflow-scrolling: touch; }
.pt-site-primary-fields { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: start; gap: 13px; }
.pt-site-primary-fields .wide { grid-column: span 2; }
.pt-site-primary-fields .field, .pt-api-grid .field, .pt-site-advanced-grid .field { min-width: 0; align-content: start; }
.pt-site-primary-fields input:not([type="checkbox"], [type="radio"]), .pt-site-primary-fields select, .pt-site-primary-fields .ui-select-trigger, .pt-api-grid input:not([type="checkbox"], [type="radio"]), .pt-api-grid .ui-select-trigger, .pt-site-advanced-grid input:not([type="checkbox"], [type="radio"]), .pt-site-advanced-grid .ui-select-trigger { height: 43px; min-height: 43px; border-radius: 10px; font-size: 14px; }
.pt-field-clear { margin-top: 5px; display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: 12px; cursor: pointer; }
.pt-field-clear input, .pt-site-primary-fields .pt-field-clear input { width: 13px; height: 13px; min-height: 0; flex: 0 0 auto; accent-color: var(--primary); }
.pt-site-enabled { min-height: 66px; padding: 10px 11px; align-self: end; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft); }
.pt-site-enabled > span { display: grid; gap: 2px; }
.pt-site-enabled b { color: var(--text); font-size: 13px; }
.pt-site-enabled small { color: var(--muted); font-size: 12px; }
.pt-auth-switch { width: fit-content; padding: 3px; display: flex; gap: 3px; border-radius: 10px; background: var(--surface-soft); }
.pt-auth-switch button { min-height: 34px; padding: 0 14px; display: inline-flex; align-items: center; gap: 6px; border: 0; border-radius: 8px; color: var(--muted); background: transparent; font-size: 13px; font-weight: 850; cursor: pointer; }
.pt-auth-switch button.active { color: white; background: var(--primary); box-shadow: 0 6px 14px color-mix(in srgb, var(--primary) 23%, transparent); }
.pt-auth-switch .ui-icon { width: 14px; height: 14px; }
.pt-auth-panel { padding: 15px; display: grid; gap: 10px; border: 1px solid var(--line); border-radius: 12px; background: color-mix(in srgb, var(--surface-soft) 54%, transparent); }
.pt-auth-panel[hidden] { display: none; }
.pt-auth-panel textarea { min-height: 116px; resize: vertical; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; white-space: pre-wrap; }
.pt-api-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.pt-api-grid .wide { grid-column: 1 / -1; }
.pt-api-simple-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.pt-api-simple-grid .field { min-width: 0; align-content: start; }
.pt-api-simple-grid input { min-height: 43px; border-radius: 10px; font-size: 14px; }
.pt-site-access-panel { padding: 15px; display: grid; gap: 13px; border: 1px solid color-mix(in srgb, var(--primary) 20%, var(--line)); border-radius: 14px; background: color-mix(in srgb, var(--primary-soft) 22%, var(--surface)); }
.pt-site-access-panel > header { display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: center; gap: 10px; }
.pt-site-access-panel > header > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; color: var(--primary); background: var(--primary-soft); }
.pt-site-access-panel > header .ui-icon { width: 17px; height: 17px; }
.pt-site-access-panel > header > div { min-width: 0; display: grid; gap: 2px; }
.pt-site-access-panel > header strong { font-size: 14px; }
.pt-site-access-panel > header small { color: var(--muted); font-size: 12px; line-height: 1.45; }
.pt-site-access-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; gap: 10px; }
.pt-site-access-grid > .wide { grid-column: 1 / -1; }
.pt-site-toggle { min-width: 0; min-height: 72px; padding: 11px 12px; display: grid; grid-template-columns: 42px minmax(0, 1fr); align-items: center; gap: 10px; border: 1px solid var(--line); border-radius: 11px; background: var(--surface); cursor: pointer; }
.pt-site-toggle > input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.pt-site-toggle-track { width: 40px; height: 23px; padding: 3px; display: block; border-radius: 99px; background: color-mix(in srgb, var(--muted) 30%, var(--surface-soft)); transition: background-color .18s ease; }
.pt-site-toggle-track i { width: 17px; height: 17px; display: block; border-radius: 50%; background: white; box-shadow: 0 2px 6px rgba(15,23,42,.26); transition: transform .18s ease; }
.pt-site-toggle > input:checked + .pt-site-toggle-track { background: var(--primary); }
.pt-site-toggle > input:checked + .pt-site-toggle-track i { transform: translateX(17px); }
.pt-site-toggle > input:focus-visible + .pt-site-toggle-track { outline: 3px solid color-mix(in srgb, var(--primary) 24%, transparent); }
.pt-site-toggle > span:last-child { min-width: 0; display: grid; gap: 3px; }
.pt-site-toggle b { font-size: 13px; }
.pt-site-toggle small { color: var(--muted); font-size: 12px; line-height: 1.4; }
.pt-site-rate-control { min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 7px; }
.pt-site-rate-control.disabled { opacity: .62; }
.pt-site-interval { min-height: 34px; padding: 5px 8px; display: grid; grid-template-columns: minmax(0, 1fr) 64px auto; align-items: center; gap: 7px; border: 1px solid var(--line); border-radius: 9px; color: var(--muted); background: var(--surface); font-size: 12px; }
.pt-site-interval input { width: 64px; min-height: 28px !important; height: 28px !important; padding: 0 7px; text-align: center; }
.pt-site-interval em { font-style: normal; }
.pt-site-advanced { overflow: hidden; border: 1px solid var(--line); border-radius: 12px; background: color-mix(in srgb, var(--surface-soft) 34%, transparent); }
.pt-site-advanced summary { min-height: 46px; padding: 0 14px; display: flex; align-items: center; gap: 8px; color: var(--text); font-size: 13px; font-weight: 850; cursor: pointer; list-style: none; }
.pt-site-advanced summary::-webkit-details-marker { display: none; }
.pt-site-advanced summary::after { content: '⌄'; margin-left: auto; color: var(--muted); transition: transform .18s ease; }
.pt-site-advanced[open] summary::after { transform: rotate(180deg); }
.pt-site-advanced summary .ui-icon { width: 15px; height: 15px; color: var(--primary); }
.pt-site-advanced-grid { padding: 15px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; gap: 13px; border-top: 1px solid var(--line); }
.pt-site-advanced-grid .wide { grid-column: span 2; }
.pt-site-proxy-field { min-height: 94px; }
.pt-site-proxy-field select, .pt-site-proxy-field .ui-select-trigger { height: 43px; min-height: 43px; }
.pt-site-proxy-field a { width: max-content; color: var(--primary); font-size: 12px; font-weight: 800; }
.pt-site-option { min-height: 67px; padding: 10px 11px; display: grid; grid-template-columns: 17px minmax(0, 1fr); align-items: center; gap: 9px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); cursor: pointer; }
.pt-site-option > input { width: 15px; height: 15px; accent-color: var(--primary); }
.pt-site-option > span { min-width: 0; display: grid; grid-template-columns: 17px minmax(0, 1fr); gap: 2px 7px; }
.pt-site-option .ui-icon { width: 15px; height: 15px; grid-row: 1 / 3; color: var(--primary); }
.pt-site-option b { font-size: 13px; }
.pt-site-option small { color: var(--muted); font-size: 12px; line-height: 1.4; }
.pt-site-dialog-actions { flex: 0 0 auto; }
.pt-site-grid { gap: 16px; }
.pt-site-card { position: relative; min-height: 264px; padding: 18px; gap: 13px; overflow: hidden; border-radius: 20px; background: radial-gradient(circle at 92% 4%, color-mix(in srgb, var(--primary) 13%, transparent), transparent 34%), linear-gradient(145deg, color-mix(in srgb, var(--surface) 92%, transparent), color-mix(in srgb, var(--surface-soft) 74%, transparent)); box-shadow: inset 0 1px color-mix(in srgb, white 10%, transparent), 0 16px 40px color-mix(in srgb, #020617 12%, transparent); }
.pt-site-card::after { content: ''; position: absolute; inset: auto -18% -48% 36%; height: 160px; pointer-events: none; background: radial-gradient(circle, color-mix(in srgb, var(--primary) 12%, transparent), transparent 70%); }
.pt-site-card > header { position: relative; z-index: 1; grid-template-columns: 48px minmax(0, 1fr) auto; gap: 12px; }
.pt-site-icon { position: relative; width: 48px; height: 48px; overflow: hidden; border: 1px solid color-mix(in srgb, white 18%, var(--line)); border-radius: 14px; color: white; background: linear-gradient(145deg, color-mix(in srgb, var(--primary) 78%, #f8fafc), color-mix(in srgb, var(--primary) 58%, #22d3ee)); font-size: 14px; font-weight: 950; letter-spacing: -.05em; box-shadow: inset 0 1px color-mix(in srgb, white 34%, transparent), 0 10px 24px color-mix(in srgb, var(--primary) 24%, transparent); }
.pt-site-icon > span { position: relative; z-index: 0; }
.pt-site-icon img { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; object-fit: cover; background: var(--surface); }
.pt-site-card > header > div { gap: 4px; }
.pt-site-card > header > div > h3 { order: 0; font-size: 15px; letter-spacing: -.02em; }
.pt-site-card > header > div > span { order: 1; font-size: 12px; letter-spacing: .06em; }
.pt-site-card > header em { width: 28px; height: 28px; padding: 0; display: grid; place-items: center; border: 1px solid var(--line); background: color-mix(in srgb, var(--surface-soft) 76%, transparent); }
.pt-site-card > header em i { width: 8px; height: 8px; border-radius: 50%; background: var(--muted); }
.pt-site-card > header em.enabled i { background: var(--warning); box-shadow: 0 0 0 5px color-mix(in srgb, var(--warning) 12%, transparent); }
.pt-site-card > header em.connected i { background: var(--success); box-shadow: 0 0 0 5px color-mix(in srgb, var(--success) 13%, transparent), 0 0 16px color-mix(in srgb, var(--success) 50%, transparent); }
.pt-site-card > header > form { margin: 0; }
.pt-site-status-test { width: 34px; height: 34px; padding: 0; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; background: color-mix(in srgb, var(--surface-soft) 78%, transparent); cursor: pointer; }
.pt-site-status-test i { width: 9px; height: 9px; border-radius: 50%; background: var(--muted); transition: transform .18s ease, box-shadow .18s ease; }
.pt-site-status-test:hover i { transform: scale(1.2); }
.pt-site-status-test.enabled i { background: var(--warning); box-shadow: 0 0 0 5px color-mix(in srgb, var(--warning) 12%, transparent); }
.pt-site-status-test.connected i { background: var(--success); box-shadow: 0 0 0 5px color-mix(in srgb, var(--success) 13%, transparent), 0 0 16px color-mix(in srgb, var(--success) 50%, transparent); }
.pt-site-card > p { position: relative; z-index: 1; font-size: 13px; }
.pt-site-traffic { position: relative; z-index: 1; padding: 12px 0 2px; display: grid; gap: 9px; border-top: 1px solid var(--line); }
.pt-site-traffic > div { min-width: 0; display: grid; grid-template-columns: 102px minmax(0, 1fr); align-items: center; gap: 10px; }
.pt-site-traffic span { display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: 13px; }
.pt-site-traffic span .ui-icon { width: 14px; height: 14px; color: var(--icon-blue); }
.pt-site-traffic > div:last-child span .ui-icon { color: var(--success); }
.pt-site-traffic b { overflow: hidden; color: var(--text); font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.pt-site-traffic i { height: 5px; overflow: hidden; border-radius: 999px; background: color-mix(in srgb, var(--muted) 16%, transparent); }
.pt-site-traffic u { height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg, #7cb7ff, #a5cfff); box-shadow: 0 0 12px color-mix(in srgb, #7cb7ff 48%, transparent); text-decoration: none; }
.pt-site-traffic > div:last-child u { background: linear-gradient(90deg, #e9b95f, #ffd77f); box-shadow: 0 0 12px color-mix(in srgb, #e9b95f 48%, transparent); }
.pt-site-traffic.unknown { opacity: .68; }
.pt-site-card > footer { position: relative; z-index: 1; padding-top: 12px; }
.pt-site-card .plugin-runtime small { max-width: 145px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pt-site-actions .icon-command { border-radius: 9px; background: color-mix(in srgb, var(--surface-soft) 78%, transparent); }
.pt-site-editor-dialog { width: min(1040px, calc(100vw - 28px)); border-radius: 20px; }
.pt-site-dialog-head { flex: 0 0 auto; padding: 22px 24px 19px; background: radial-gradient(circle at 88% 0, color-mix(in srgb, var(--primary) 18%, transparent), transparent 44%), linear-gradient(90deg, color-mix(in srgb, var(--surface-soft) 55%, transparent), transparent); }
.pt-site-editor-body { padding: 20px 24px 104px; gap: 17px; scroll-padding-bottom: 104px; }
.pt-site-primary-fields { grid-template-columns: minmax(0, 2fr) minmax(110px, .55fr) minmax(170px, .75fr); gap: 14px; }
.pt-site-address-field { min-width: 0; }
.pt-site-detect-input { display: grid; grid-template-columns: minmax(0, 1fr) 44px; gap: 8px; }
.pt-site-detect-input .icon-command { width: 44px; min-height: 43px; border-radius: 10px; color: var(--primary); background: var(--primary-soft); }
.pt-site-enabled { min-height: 68px; margin-top: 22px; align-self: start; }
.pt-site-identity { min-height: 78px; padding: 9px 15px; display: grid; grid-template-columns: 52px minmax(0, 1fr) 24px; align-items: center; gap: 13px; overflow: hidden; border: 1px solid color-mix(in srgb, var(--primary) 20%, var(--line)); border-radius: 14px; background: radial-gradient(circle at 94% 8%, color-mix(in srgb, var(--primary) 14%, transparent), transparent 42%), color-mix(in srgb, var(--surface-soft) 55%, transparent); }
.pt-site-identity-logo { position: relative; width: 52px; height: 52px; display: grid; place-items: center; overflow: hidden; border: 1px solid color-mix(in srgb, white 18%, var(--line)); border-radius: 14px; color: white; background: linear-gradient(145deg, var(--primary), color-mix(in srgb, var(--primary) 50%, #22d3ee)); box-shadow: 0 8px 22px color-mix(in srgb, var(--primary) 22%, transparent); }
.pt-site-identity-logo b { font-size: 14px; }
.pt-site-identity-logo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; background: var(--surface); }
.pt-site-identity > div { min-width: 0; display: grid; align-content: center; gap: 2px; line-height: 1.25; }
.pt-site-identity > div > span { color: var(--primary); font-size: 12px; font-weight: 900; letter-spacing: .1em; }
.pt-site-identity > div > strong { overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.pt-site-identity > div > small { overflow: hidden; color: var(--muted); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.pt-site-identity > .ui-icon { color: var(--primary); opacity: .68; }
.pt-site-identity[data-state='loading'] .pt-site-identity-logo { animation: pt-site-detect-pulse 1.1s ease-in-out infinite alternate; }
.pt-site-identity[data-state='success'] { border-color: color-mix(in srgb, var(--success) 28%, var(--line)); }
.pt-site-identity[data-state='success'] > div > span { color: var(--success); }
.pt-site-identity[data-state='error'] { border-color: color-mix(in srgb, var(--warning) 30%, var(--line)); }
.pt-site-identity[data-state='error'] > div > span { color: var(--warning); }
@keyframes pt-site-detect-pulse { to { transform: translateY(-2px); box-shadow: 0 11px 28px color-mix(in srgb, var(--primary) 38%, transparent); } }
.pt-auth-switch { width: 100%; max-width: 320px; }
.pt-auth-switch button { flex: 1 1 0; justify-content: center; }
.pt-auth-panel { padding: 16px; border-radius: 14px; }
.pt-auth-panel textarea { min-height: 132px; }
.pt-site-advanced { border-radius: 14px; }
.pt-site-dialog-actions { position: relative; z-index: 3; padding: 14px 24px; border-top: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 96%, transparent); box-shadow: 0 -10px 24px color-mix(in srgb, #020617 9%, transparent); backdrop-filter: blur(18px); }
.pt-site-browser-dialog { width: min(1320px, calc(100vw - 28px)); height: min(860px, calc(100dvh - 28px)); max-height: calc(100dvh - 28px); overflow: hidden; border-radius: 20px; }
.pt-site-browser-head { flex: 0 0 auto; padding: 18px 22px; }
.pt-site-browser-toolbar { flex: 0 0 auto; padding: 14px 18px; display: grid; grid-template-columns: minmax(240px, 1fr) minmax(220px, .9fr) 190px; gap: 12px; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface-soft) 58%, transparent); }
.pt-site-browser-search, .pt-site-browser-category { min-width: 0; height: 42px; padding: 0 12px; display: flex; align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: 11px; background: color-mix(in srgb, var(--surface) 88%, transparent); }
.pt-site-browser-search .ui-icon, .pt-site-browser-category .ui-icon { width: 17px; height: 17px; flex: 0 0 auto; color: var(--primary); }
.pt-site-browser-search input, .pt-site-browser-category select { width: 100%; min-height: 38px; padding: 0; border: 0; background: transparent; box-shadow: none; font-size: 13px; }
.pt-site-browser-search input:focus, .pt-site-browser-category select:focus { box-shadow: none; }
.pt-site-browser-toolbar .button { min-height: 42px; justify-content: center; }
.pt-site-browser-summary { min-height: 44px; padding: 0 18px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--line); }
.pt-site-browser-summary span { color: var(--primary); font-size: 13px; font-weight: 850; }
.pt-site-browser-summary small { color: var(--muted); font-size: 12px; }
.pt-site-browser-table { min-height: 0; display: flex; flex: 1 1 auto; flex-direction: column; overflow: hidden; }
.pt-site-browser-table > header, .pt-site-browser-row { display: grid; grid-template-columns: minmax(360px, 1fr) 120px 90px 66px 66px 32px; align-items: center; gap: 12px; }
.pt-site-browser-table > header { min-height: 40px; padding: 0 18px; flex: 0 0 auto; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 12px; font-weight: 850; }
.pt-site-browser-results { min-height: 0; overflow: auto; scrollbar-gutter: stable; }
.pt-site-browser-row { min-height: 88px; padding: 11px 18px; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 88%, transparent); transition: background .15s ease; }
.pt-site-browser-row:hover { background: color-mix(in srgb, var(--primary-soft) 25%, var(--surface)); }
.pt-site-browser-row > div { min-width: 0; display: grid; gap: 4px; }
.pt-site-browser-row strong { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.pt-site-browser-row small { overflow: hidden; color: var(--muted); font-size: 12px; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.pt-site-browser-row > div > div { display: flex; flex-wrap: wrap; gap: 4px; }
.pt-site-browser-row > div > div span { padding: 3px 6px; border-radius: 999px; color: var(--primary); background: var(--primary-soft); font-size: 12px; font-weight: 750; }
.pt-site-browser-row time { color: var(--muted); font-size: 12px; line-height: 1.45; }
.pt-site-browser-row > b { color: var(--text); font-size: 13px; font-weight: 750; }
.pt-site-browser-row > a { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 8px; color: var(--muted); }
.pt-site-browser-row > a:hover { color: white; background: var(--primary); }
.pt-site-browser-row > a .ui-icon { width: 16px; height: 16px; }
.pt-site-browser-empty { min-height: 280px; padding: 32px; display: grid; place-items: center; align-content: center; gap: 10px; color: var(--muted); text-align: center; }
.pt-site-browser-empty .ui-icon { width: 30px; height: 30px; color: var(--primary); }
.pt-site-browser-empty.loading .ui-icon { animation: spin 1s linear infinite; }
.pt-site-browser-empty.error .ui-icon, .pt-site-browser-empty.error strong { color: var(--danger); }
.pt-site-browser-empty small { color: var(--muted); font-size: 13px; }
@media (max-width: 720px) {
  .channel-plugin-dialog .plugin-configuration-head { grid-template-rows: auto auto; align-items: start; }
  .channel-plugin-dialog .plugin-configuration-head > .plugin-card-icon { grid-column: 1; grid-row: 1; }
  .channel-plugin-dialog .plugin-configuration-head > div { grid-column: 2; grid-row: 1; }
  .channel-plugin-dialog .plugin-configuration-head > .plugin-runtime { max-width: 100%; grid-column: 2 / 4; grid-row: 2; justify-self: start; }
  .channel-plugin-dialog .plugin-configuration-permissions strong { flex: 0 0 100%; }
  .channel-plugin-dialog .plugin-configuration-permissions span { max-width: 100%; overflow-wrap: anywhere; }
  .channel-plugin-settings > .settings-section-head,
  .channel-plugin-network > .settings-section-head,
  .channel-plugin-components > .settings-section-head,
  .channel-plugin-search-panel > .settings-section-head { display: grid; grid-template-columns: 44px minmax(0, 1fr); align-items: start; gap: 4px 13px; }
  .channel-plugin-settings > .settings-section-head > .settings-section-icon,
  .channel-plugin-network > .settings-section-head > .settings-section-icon,
  .channel-plugin-components > .settings-section-head > .settings-section-icon,
  .channel-plugin-search-panel > .settings-section-head > .settings-section-icon { grid-column: 1; grid-row: 1 / span 2; }
  .channel-plugin-settings > .settings-section-head > div,
  .channel-plugin-network > .settings-section-head > div,
  .channel-plugin-components > .settings-section-head > div,
  .channel-plugin-search-panel > .settings-section-head > div { min-width: 0; grid-column: 2; }
  .channel-plugin-settings > .settings-section-head > .badge,
  .channel-plugin-network > .settings-section-head > .badge { width: max-content; grid-column: 2; justify-self: start; }
  .channel-plugin-settings .form-grid.two { grid-template-columns: 1fr; }
  .channel-plugin-network .proxy-switch { min-height: 60px; }
  .channel-plugin-settings .settings-form-actions { display: grid; grid-template-columns: 1fr; gap: 8px; }
  .channel-plugin-result { grid-template-columns: 1fr; align-items: stretch; }
  .channel-plugin-result .button { width: 100%; }
  .channel-plugin-component-actions { align-items: stretch; flex-direction: column; }
  .channel-plugin-component-form { width: 100%; grid-template-columns: 1fr; }
  .channel-plugin-checkin-form { width: 100%; flex-basis: auto; grid-template-columns: 1fr; }
  .channel-plugin-checkin-form .button { width: 100%; }
  .channel-plugin-custom-action { grid-template-columns: 1fr; align-items: stretch; }
  .channel-plugin-custom-action > form { align-items: stretch; flex-direction: column; }
  .channel-plugin-custom-action-fields { grid-template-columns: 1fr; }
  .channel-plugin-custom-action > form > .button { width: 100%; }
  .channel-plugin-search-form .input-with-button { grid-template-columns: 1fr; }
  .channel-plugin-search-form .input-with-button .button { width: 100%; }
  .channel-plugin-management { align-items: stretch; flex-direction: column; }
  .channel-plugin-management > div:last-child { display: grid; grid-template-columns: 1fr 1fr; }
  .channel-plugin-management .button { width: 100%; }
  .pt-site-browser-dialog { width: calc(100vw - 16px); height: calc(100dvh - 16px); max-height: calc(100dvh - 16px); border-radius: 15px; }
  .pt-site-browser-toolbar { grid-template-columns: minmax(0, 1fr); padding: 12px; }
  .pt-site-browser-summary { padding-inline: 12px; }
  .pt-site-browser-table { overflow-x: auto; }
  .pt-site-browser-table > header, .pt-site-browser-row { width: 760px; min-width: 760px; }
  .pt-site-browser-results { overflow: visible; }
}
.settings-basic-grid { grid-template-columns: minmax(0, 1fr); }
.one15-package-filter-card { padding: 0 !important; overflow: hidden; }
.one15-package-dependencies { padding: 14px 18px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface-soft) 55%, transparent); }
.one15-package-dependency { min-width: 0; min-height: 50px; padding: 9px 11px; display: grid; grid-template-columns: 8px minmax(0, 1fr); align-items: center; gap: 2px 8px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.one15-package-dependency i { width: 7px; height: 7px; grid-row: 1 / 3; border-radius: 50%; background: var(--danger); box-shadow: 0 0 0 4px color-mix(in srgb, var(--danger) 10%, transparent); }
.one15-package-dependency.ready i { background: var(--success); box-shadow: 0 0 0 4px var(--success-soft); }
.one15-package-dependency b { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.one15-package-dependency small { overflow: hidden; color: var(--muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.one15-package-form { padding: 18px; display: grid; gap: 14px; border-bottom: 1px solid var(--line); }
.one15-package-form-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; }
.one15-package-form-row .field { min-width: 0; align-content: start; grid-template-rows: auto 44px minmax(17px, auto); }
.one15-package-form-row input, .one15-package-form-row select { height: 44px; min-height: 44px; padding-inline: 13px; border-radius: 10px; font-size: 14px; }
.one15-package-form-row .ui-select-trigger { height: 44px; min-height: 44px; border-radius: 10px; font-size: 14px; }
.one15-package-form-row .help { min-height: 17px; font-size: 13px; line-height: 1.55; }
.one15-package-form textarea { min-height: 112px; resize: vertical; }
.one15-package-submit-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.one15-package-submit-row > span { color: var(--muted); font-size: 13px; line-height: 1.5; }
.one15-package-submit-row > span[data-tone="error"] { color: var(--danger); }
.one15-package-submit-row > span[data-tone="success"] { color: var(--success); }
.one15-package-submit-row > span[data-tone="warning"] { color: var(--warning); }
.one15-package-submit-row .button { flex: 0 0 auto; }
.one15-package-task { padding: 16px 18px; display: grid; gap: 11px; border-bottom: 1px solid var(--line); background: radial-gradient(circle at 92% 10%, color-mix(in srgb, var(--primary) 12%, transparent), transparent 36%); }
.one15-package-task[hidden], .one15-package-results[hidden] { display: none; }
.one15-package-task > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.one15-package-task > header > div { min-width: 0; display: grid; gap: 3px; }
.one15-package-task > header span { color: var(--primary); font-size: 12px; font-weight: 850; letter-spacing: .1em; }
.one15-package-task > header h3 { margin: 0; overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.one15-package-task > header > strong { color: var(--primary); font-size: 16px; }
.one15-package-progress { height: 7px; overflow: hidden; border-radius: 999px; background: color-mix(in srgb, var(--primary) 10%, var(--surface-soft)); }
.one15-package-progress i { width: 0; height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg, var(--primary), color-mix(in srgb, var(--primary) 58%, #22d3ee)); box-shadow: 0 0 14px color-mix(in srgb, var(--primary) 40%, transparent); transition: width .35s ease; }
.one15-package-progress i.is-scanning { width: 34% !important; animation: one15-package-scan 1.25s ease-in-out infinite alternate; }
@keyframes one15-package-scan { from { transform: translateX(-6%); opacity: .72; } to { transform: translateX(205%); opacity: 1; } }
.one15-package-stage-hint { color: var(--muted); font-size: 12px; line-height: 1.5; }
.one15-package-stats { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 7px; }
.one15-package-stats > div { min-width: 0; min-height: 54px; padding: 9px 10px; display: grid; gap: 2px; border: 1px solid var(--line); border-radius: 9px; background: color-mix(in srgb, var(--surface) 88%, transparent); }
.one15-package-stats span { color: var(--muted); font-size: 12px; }
.one15-package-stats strong { overflow: hidden; font-size: 15px; text-overflow: ellipsis; }
.one15-package-stats .success strong { color: var(--success); }
.one15-package-stats .danger strong { color: var(--danger); }
.one15-package-stats .warning strong { color: var(--warning); }
.one15-package-results { display: grid; }
.one15-package-toolbar { padding: 12px 18px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--line); }
.one15-package-filters { padding: 3px; display: flex; gap: 3px; border-radius: 9px; background: var(--surface-soft); }
.one15-package-filters button { min-height: 31px; padding: 0 10px; border: 0; border-radius: 7px; color: var(--muted); background: transparent; font-size: 12px; font-weight: 750; cursor: pointer; white-space: nowrap; }
.one15-package-filters button.active { color: white; background: var(--primary); }
.one15-package-search { width: min(290px, 36%); min-height: 36px; padding: 0 10px; display: flex; align-items: center; gap: 7px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); }
.one15-package-search .ui-icon { color: var(--muted); }
.one15-package-search input { width: 100%; min-height: 32px; padding: 0; border: 0; background: transparent; box-shadow: none; font-size: 13px; }
.one15-package-search input:focus { box-shadow: none; }
.one15-package-batch { min-height: 50px; padding: 8px 18px; display: flex; align-items: center; gap: 12px; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface-soft) 48%, transparent); }
.one15-package-batch > span { margin-left: auto; color: var(--muted); font-size: 13px; }
.one15-package-batch .button { min-height: 34px; font-size: 13px; }
.one15-package-transfer-actions { display: flex; align-items: center; gap: 7px; }
.one15-package-list { max-height: 430px; overflow: auto; display: grid; scrollbar-gutter: stable; }
.one15-package-item { min-width: 0; min-height: 82px; padding: 11px 18px; display: grid; grid-template-columns: 24px minmax(0, 1fr) minmax(210px, auto); align-items: center; gap: 10px; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--surface) 96%, transparent); }
.one15-package-item:last-child { border-bottom: 0; }
.one15-package-item:hover { background: color-mix(in srgb, var(--primary-soft) 28%, var(--surface)); }
.one15-package-item-check { width: 22px; display: grid; place-items: center; color: var(--muted); }
.one15-package-item-check input { width: 15px; height: 15px; accent-color: var(--primary); }
.one15-package-item.in_library .one15-package-item-check { color: var(--success); }
.one15-package-item.transferred .one15-package-item-check { color: var(--primary); }
.one15-package-item-copy { min-width: 0; display: grid; gap: 3px; }
.one15-package-item-copy > div { min-width: 0; display: flex; align-items: center; gap: 7px; }
.one15-package-item-copy strong { overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.one15-package-item-copy small { overflow: hidden; color: var(--muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.one15-package-item-copy small.path { opacity: .75; }
.one15-package-item-status { flex: 0 0 auto; padding: 3px 6px; border-radius: 999px; color: var(--muted); background: var(--surface-soft); font-size: 12px; font-weight: 850; }
.one15-package-item-status.missing { color: var(--danger); background: color-mix(in srgb, var(--danger) 12%, transparent); }
.one15-package-item-status.in_library { color: var(--success); background: var(--success-soft); }
.one15-package-item-status.transferred { color: var(--primary); background: var(--primary-soft); }
.one15-package-item-status.unrecognized, .one15-package-item-status.failed { color: var(--warning); background: color-mix(in srgb, var(--warning) 12%, transparent); }
.one15-package-item-meta { max-width: 330px; display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 5px; }
.one15-package-item-meta span { padding: 4px 6px; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); background: var(--surface-soft); font-size: 12px; white-space: nowrap; }
.one15-package-item-meta small.error { width: 100%; overflow: hidden; color: var(--danger); font-size: 12px; text-align: right; text-overflow: ellipsis; white-space: nowrap; }
.one15-package-identify { min-height: 28px; padding: 0 8px; font-size: 12px; white-space: nowrap; }
.one15-package-pagination { min-height: 54px; padding: 9px 18px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid var(--line); }
.one15-package-pagination > span { color: var(--muted); font-size: 13px; }
.one15-package-pagination > div { display: flex; gap: 6px; }
.one15-package-pagination .button { min-height: 32px; padding-inline: 10px; font-size: 12px; }

@media (max-width: 1240px) {
  .plugin-center-hero { grid-template-columns: 1fr; }
  .plugin-center-stats { min-width: 0; width: 100%; }
  .plugin-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pt-site-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wecom-settings-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .one15-package-toolbar { align-items: stretch; flex-direction: column; }
  .one15-package-search { width: 100%; }
}

@media (max-width: 720px) {
  .plugin-center-hero { padding: 20px; }
  .plugin-center-stats { grid-template-columns: repeat(3, 1fr); }
  .plugin-center-stats .button { grid-column: 1 / -1; }
  .plugin-toolbar { align-items: stretch; flex-direction: column; }
  .plugin-filter { display: grid; grid-template-columns: repeat(3, 1fr); }
  .plugin-filter button { padding-inline: 8px; }
  .plugin-safety-note p { text-align: left; }
  .plugin-grid { grid-template-columns: 1fr; }
  .pt-site-grid { grid-template-columns: 1fr; }
  .pt-site-editor-dialog { width: calc(100vw - 18px); height: calc(100dvh - 18px); max-height: calc(100dvh - 18px); }
  .pt-site-editor-body { padding: 15px 15px 96px; scroll-padding-bottom: 96px; }
  .pt-site-primary-fields, .pt-api-grid, .pt-api-simple-grid, .pt-site-access-grid, .pt-site-advanced-grid { grid-template-columns: 1fr; }
  .pt-site-primary-fields .wide, .pt-api-grid .wide, .pt-site-advanced-grid .wide { grid-column: auto; }
  .pt-site-access-grid > .wide { grid-column: auto; }
  .pt-site-dialog-actions { padding: 12px 15px max(12px, env(safe-area-inset-bottom)); }
  .plugin-section > header { align-items: flex-start; }
  .plugin-card { min-height: 225px; }
  .plugin-card > footer { align-items: stretch; flex-direction: column; }
  .plugin-card-open, .plugin-card-actions, .plugin-card-actions form, .plugin-card-actions .button { width: 100%; }
  .plugin-card-open { justify-content: flex-end; }
  .channel-plugin-card .plugin-card-actions { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .plugin-settings-dialog { width: calc(100vw - 18px); max-height: calc(100dvh - 18px); }
  .plugin-configuration-head { grid-template-columns: 44px minmax(0, 1fr) 34px; padding: 15px; }
  .plugin-configuration-head .plugin-card-icon { width: 44px; height: 44px; }
  .plugin-configuration-head > .plugin-configuration-close { width: 34px; height: 34px; grid-column: 3; grid-row: 1; }
  .plugin-configuration-head > .plugin-runtime { grid-column: 2 / -1; }
  .plugin-configuration-body { padding: 12px; }
  .plugin-configuration-body > .card { padding: 16px; }
  .telegram-notification-card,
  .wecom-notification-card { padding: 0 !important; }
  .telegram-notification-card .notification-channel-head { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; gap: 8px; align-items: center; }
  .telegram-notification-card .notification-channel-head > div { display: contents; }
  .telegram-notification-card .notification-channel-mark { width: 32px; height: 32px; grid-column: 1; grid-row: 1; }
  .telegram-notification-card .notification-channel-head h3 { grid-column: 2; grid-row: 1; font-size: 14px; letter-spacing: 0; }
  .telegram-notification-card .notification-channel-head .channel-enable { grid-column: 3; grid-row: 1; }
  .telegram-notification-card .notification-channel-head p { grid-column: 1 / -1; grid-row: 2; margin: 0; }
  .wecom-notification-head { padding: 19px 17px 17px; align-items: flex-start; }
  .wecom-notification-head > .badge { width: 100%; margin-left: 0; }
  .wecom-enable-row { padding: 14px 17px; align-items: flex-start; flex-direction: column; }
  .wecom-enable-row > span { margin-left: 0; text-align: left; }
  .wecom-settings-fields { padding: 20px 17px; grid-template-columns: 1fr; gap: 15px; }
  .wecom-control-settings > summary, .wecom-legacy-settings > summary, .wecom-secret-settings > summary { padding: 16px 17px; }
  .wecom-control-settings > .remote-control-enable, .wecom-control-settings > .remote-control-overview { padding: 17px; }
  .wecom-callback-status { padding: 0 17px 17px; }
  .wecom-legacy-settings > .field, .wecom-legacy-settings > .checkbox { margin: 0 17px 18px; }
  .wecom-notification-card > form > .remote-control-enable { padding: 17px; align-items: start; }
  .wecom-notification-card > form > .remote-control-overview { padding: 20px 17px 22px; }
  .wecom-secret-actions { margin: 0 17px; display: grid; }
  .wecom-test-row { padding: 14px 17px; align-items: stretch; flex-direction: column; }
  .wecom-test-row > span:first-child { margin: 0 0 3px; }
  .wecom-test-row .button { width: 100%; }
  .one15-package-dependencies { grid-template-columns: 1fr; padding: 12px; }
  .one15-package-form { padding: 14px; }
  .one15-package-form-row { grid-template-columns: 1fr; }
  .one15-package-submit-row { align-items: stretch; flex-direction: column; }
  .one15-package-submit-row .button { width: 100%; }
  .one15-package-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .one15-package-stats > div:first-child { grid-column: 1 / -1; }
  .one15-package-toolbar { padding: 11px 12px; }
  .one15-package-filters { overflow-x: auto; }
  .one15-package-batch { padding: 10px 12px; align-items: stretch; flex-wrap: wrap; }
  .one15-package-batch > span { margin-left: 0; }
  .one15-package-batch .button { width: 100%; }
  .one15-package-transfer-actions { width: 100%; display: grid; grid-template-columns: 1fr; }
  .one15-package-item { padding: 11px 12px; grid-template-columns: 22px minmax(0, 1fr); }
  .one15-package-item-meta { max-width: none; grid-column: 2; justify-content: flex-start; }
  .one15-package-item-meta small.error { text-align: left; }
}

.one15-source-policy { display: flex; align-items: center; flex-wrap: wrap; gap: 5px; margin-top: 7px; color: #0d9d78; font-size: 13px; font-weight: 700; }
.one15-source-policy i { color: var(--muted); font-style: normal; }
.one15-source-policy .delete { color: #e59b2b; }
.one15-delete-summary { display: flex; align-items: center; justify-content: center; gap: 7px; margin-top: -5px; padding: 9px 12px; border: 1px solid color-mix(in srgb, #e4a12f 28%, var(--line)); border-radius: 11px; color: color-mix(in srgb, #e6a42f 86%, var(--text)); background: color-mix(in srgb, #e6a42f 8%, var(--surface)); font-size: 14px; font-weight: 750; }
.one15-delete-summary .ui-icon { width: 15px; height: 15px; }

/* Refined 115 task editor */
.one15-source-dialog { width: min(720px, calc(100vw - 28px)); overflow: hidden; padding: 0; border: 1px solid color-mix(in srgb, var(--primary) 18%, var(--line)); border-radius: 20px; background: color-mix(in srgb, var(--surface) 96%, transparent); box-shadow: 0 28px 90px rgba(0, 0, 0, .42); }
.one15-source-dialog form { display: block; padding: 0; }
.one15-source-dialog-head { min-height: 0; padding: 20px 22px; border-bottom: 1px solid var(--line); background: linear-gradient(135deg, color-mix(in srgb, var(--primary) 8%, var(--surface)), var(--surface)); }
.one15-source-dialog-title { display: flex; align-items: center; gap: 13px; }
.one15-source-dialog-symbol { width: 44px; height: 44px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid color-mix(in srgb, var(--primary) 25%, var(--line)); border-radius: 13px; color: var(--primary); background: var(--primary-soft); box-shadow: inset 0 1px rgba(255,255,255,.08); }
.one15-source-dialog-symbol .ui-icon { width: 22px; height: 22px; }
.one15-source-dialog-head .dialog-kicker { margin: 0 0 4px; font-size: 13px; letter-spacing: .17em; }
.one15-source-dialog-head h2 { margin: 0; font-size: 20px; letter-spacing: -.025em; }
.one15-source-dialog-head p { margin: 4px 0 0; font-size: 14px; }
.one15-source-dialog-head .dialog-close { width: 36px; height: 36px; border: 1px solid var(--line); border-radius: 11px; color: var(--muted); background: var(--surface-soft); box-shadow: none; }
.one15-source-dialog-head .dialog-close:hover { color: var(--text); border-color: color-mix(in srgb, var(--primary) 28%, var(--line)); background: var(--primary-soft); }
.one15-source-dialog-body { display: grid; gap: 16px; padding: 19px 22px 20px; }
.one15-source-fields { align-items: start; gap: 13px 14px; }
.one15-source-fields .field { gap: 6px; }
.one15-source-fields .field > label { color: var(--text-secondary); font-size: 14px; font-weight: 720; }
.one15-source-fields input { min-height: 44px; padding: 0 13px; border-radius: 11px; font-size: 14px; background: color-mix(in srgb, var(--surface-soft) 82%, transparent); }
.one15-source-fields .help { margin-top: 0; font-size: 13px; }
.one15-upload-flow { display: grid; grid-template-columns: 1fr 22px 1fr 22px 1fr; align-items: center; gap: 5px; padding: 10px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-soft); }
.one15-upload-flow > span { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 34px; color: var(--text-secondary); font-size: 13px; }
.one15-upload-flow > span .ui-icon { width: 15px; height: 15px; color: var(--primary); }
.one15-upload-flow > i { display: grid; place-items: center; color: var(--muted); }
.one15-upload-flow > i .ui-icon { width: 13px; height: 13px; }
.one15-source-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.one15-choice { position: relative; min-width: 0; display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: center; gap: 9px; min-height: 76px; padding: 11px 12px; border: 1px solid var(--line); border-radius: 13px; color: var(--muted); background: color-mix(in srgb, var(--surface-soft) 72%, transparent); cursor: pointer; transition: border-color .18s ease, background .18s ease, transform .18s ease; }
.one15-choice:hover { transform: translateY(-1px); border-color: color-mix(in srgb, var(--primary) 24%, var(--line)); }
.one15-choice input { position: absolute; width: 1px; height: 1px; min-height: 0; margin: 0; overflow: hidden; opacity: 0; pointer-events: none; clip-path: inset(50%); }
.one15-choice-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; color: var(--muted); background: var(--surface); }
.one15-choice-icon .ui-icon { width: 16px; height: 16px; }
.one15-choice > span:last-child { min-width: 0; }
.one15-choice b, .one15-choice small { display: block; }
.one15-choice b { color: var(--text-secondary); font-size: 14px; }
.one15-choice small { margin-top: 3px; color: var(--muted); font-size: 13px; line-height: 1.45; }
.one15-choice-check { position: absolute; top: 8px; right: 8px; width: 16px; height: 16px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 5px; color: transparent; background: var(--surface); }
.one15-choice-check .ui-icon { width: 10px; height: 10px; }
.one15-choice:has(input:checked) { border-color: color-mix(in srgb, var(--primary) 34%, var(--line)); background: color-mix(in srgb, var(--primary) 8%, var(--surface)); }
.one15-choice:has(input:checked) .one15-choice-icon { color: var(--primary); background: var(--primary-soft); }
.one15-choice:has(input:checked) .one15-choice-check { color: white; border-color: var(--primary); background: var(--primary); }
.one15-choice.danger:has(input:checked) { border-color: color-mix(in srgb, #e1a238 38%, var(--line)); background: color-mix(in srgb, #e1a238 7%, var(--surface)); }
.one15-choice.danger:has(input:checked) .one15-choice-icon { color: #dfa02e; background: color-mix(in srgb, #dfa02e 12%, transparent); }
.one15-choice.danger:has(input:checked) .one15-choice-check { border-color: #dfa02e; background: #dfa02e; }
.one15-source-dialog .one15-delete-summary { justify-content: flex-start; gap: 9px; margin: 0; padding: 10px 12px; border-radius: 11px; font-weight: 600; }
.one15-source-dialog .one15-delete-summary > .ui-icon { flex: 0 0 auto; }
.one15-source-dialog .one15-delete-summary span { min-width: 0; }
.one15-source-dialog .one15-delete-summary b, .one15-source-dialog .one15-delete-summary small { display: block; }
.one15-source-dialog .one15-delete-summary b { font-size: 13px; }
.one15-source-dialog .one15-delete-summary small { margin-top: 2px; color: var(--muted); font-size: 13px; font-weight: 500; }
.one15-source-dialog-footer { margin: 0; padding: 13px 22px; border-top: 1px solid var(--line); background: color-mix(in srgb, var(--surface-soft) 58%, transparent); }
.one15-source-dialog-footer .button { min-width: 104px; min-height: 39px; border-radius: 10px; }

/* Compact 115 runtime settings */
#one15UploadSettingsDialog { width: min(560px, calc(100vw - 28px)); }
#one15UploadSettingsDialog form { display: block; overflow-y: auto; }
#one15UploadSettingsDialog .dialog-head { padding: 17px 20px 15px; background: color-mix(in srgb, var(--primary) 5%, var(--surface)); }
#one15UploadSettingsDialog .dialog-kicker { margin-bottom: 4px; letter-spacing: 0; }
#one15UploadSettingsDialog .dialog-head h2 { margin: 0; font-size: 19px; }
#one15UploadSettingsDialog .dialog-head p { margin-top: 4px; }
#one15UploadSettingsDialog .one15-thread-control { margin: 16px 20px 0; padding: 13px 15px 11px; border-radius: 11px; }
#one15UploadSettingsDialog .one15-thread-control label { align-items: center; }
#one15UploadSettingsDialog .one15-thread-control label strong { font-size: 20px; line-height: 1; }
#one15UploadSettingsDialog .one15-thread-control input { min-height: 30px; margin: 8px 0 0; }
#one15UploadSettingsDialog .one15-thread-control > div { margin-top: -1px; }
#one15UploadSettingsDialog .form-grid.two { padding: 14px 20px 10px; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 12px 14px; }
#one15UploadSettingsDialog .field { min-width: 0; gap: 6px; }
#one15UploadSettingsDialog .field label { color: var(--text-secondary); font-size: 13px; }
#one15UploadSettingsDialog .field input, #one15UploadSettingsDialog .field select { min-height: 42px; height: 42px; border-radius: 10px; }
#one15UploadSettingsDialog .checkbox { min-width: 0; height: 58px; align-self: stretch; margin: 0; padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft); box-sizing: border-box; }
#one15UploadSettingsDialog .checkbox input { width: 17px; height: 17px; min-height: 17px; flex: 0 0 auto; accent-color: var(--primary); }
#one15UploadSettingsDialog .checkbox span { min-width: 0; display: grid; gap: 1px; }
#one15UploadSettingsDialog .checkbox b { font-size: 13px; }
#one15UploadSettingsDialog .checkbox small { color: var(--muted); font-size: 12px; line-height: 1.35; }
#one15UploadSettingsDialog .notice { margin: 0 20px 10px; }
#one15UploadSettingsDialog .dialog-actions { padding: 12px 20px 16px; border-top: 1px solid var(--line); }
#one15UploadSettingsDialog .dialog-actions .button { min-height: 40px; border-radius: 10px; }

@media (max-width: 640px) {
  .one15-source-dialog-head { padding: 16px; }
  .one15-source-dialog-symbol { display: none; }
  .one15-source-dialog-body { padding: 16px; }
  .one15-source-options { grid-template-columns: 1fr; }
  .one15-upload-flow { grid-template-columns: 1fr; }
  .one15-upload-flow > i { transform: rotate(90deg); }
  .one15-source-dialog-footer { padding: 12px 16px; }
  .one15-source-dialog-footer .button { flex: 1; }
  #one15UploadSettingsDialog { width: calc(100vw - 20px); max-height: calc(100dvh - 20px); border-radius: 16px; }
  #one15UploadSettingsDialog .dialog-head { padding: 15px 16px 13px; }
  #one15UploadSettingsDialog .dialog-head p { font-size: 13px; }
  #one15UploadSettingsDialog .one15-thread-control { margin: 13px 15px 0; }
  #one15UploadSettingsDialog .form-grid.two { padding: 12px 15px 9px; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px 9px; }
  #one15UploadSettingsDialog .checkbox { height: 64px; padding-inline: 8px; }
  #one15UploadSettingsDialog .notice { margin-inline: 15px; }
  #one15UploadSettingsDialog .dialog-actions { padding: 11px 15px 14px; }
  #one15UploadSettingsDialog .dialog-actions .button { flex: 1; }
}

@media (max-width: 350px) {
  #one15UploadSettingsDialog .form-grid.two { grid-template-columns: 1fr; }
  #one15UploadSettingsDialog .checkbox { height: 58px; }
}

/* AI assistant */
.tool-icon-ai { --tool-icon-accent: var(--icon-teal); }
.ai-settings-group { container: ai-settings / inline-size; }
.ai-settings-card { padding: 0; overflow: hidden; }
.ai-settings-head { min-height: 92px; padding: 20px 22px; display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; align-items: center; gap: 15px; border-bottom: 1px solid var(--line); background: color-mix(in srgb, var(--primary) 5%, var(--surface)); }
.ai-settings-head > span { width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid color-mix(in srgb, var(--icon-teal) 30%, var(--line)); border-radius: 12px; color: var(--icon-teal); background: color-mix(in srgb, var(--icon-teal) 10%, var(--surface)); }
.ai-settings-head > span .ui-icon { width: 24px; height: 24px; }
.ai-settings-head > div { min-width: 0; }
.ai-settings-head small { color: var(--icon-teal); font-size: 12px; font-weight: 850; }
.ai-settings-head h2 { margin-top: 3px; font-size: 19px; }
.ai-settings-head p { margin: 4px 0 0; color: var(--muted); font-size: 13px; }
.ai-settings-head > em { align-self: start; }
.ai-settings-card > form { margin: 0; }
.ai-simple-settings { padding: 14px; display: grid; gap: 10px; background: color-mix(in srgb, var(--surface-soft) 65%, transparent); }
.ai-setting-row { min-height: 108px; padding: 18px 20px; display: grid; grid-template-columns: minmax(230px, .9fr) minmax(320px, 1.1fr); align-items: center; gap: 24px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.ai-setting-row > div:first-child { min-width: 0; display: grid; gap: 6px; }
.ai-setting-row label, .ai-setting-row > div:first-child > strong { color: var(--text); font-size: 16px; font-weight: 760; }
.ai-setting-row small { color: var(--muted); font-size: 13px; line-height: 1.5; }
.ai-setting-control { min-width: 0; }
.ai-setting-control > input:not([type="hidden"]) { width: 100%; }
.ai-model-control { display: grid; grid-template-columns: minmax(0, 1fr); gap: 9px; }
.ai-model-control .ui-select { width: 100%; }
.ai-model-control [data-ai-custom-model][hidden] { display: none; }
.ai-proxy-control { display: grid; grid-template-columns: minmax(0, 1fr); align-items: center; }
.ai-proxy-control .proxy-switch { min-height: 64px; }
.ai-test-row { min-height: 96px; }
.ai-test-row .button { min-width: 132px; justify-self: end; }
.ai-test-row .button .ui-icon { width: 17px; height: 17px; }

.ai-assistant-dialog { container: ai-assistant / inline-size; position: fixed; z-index: 70; top: 76px; right: 22px; bottom: auto; left: auto; width: min(620px, calc(100vw - 30px)); min-width: min(360px, calc(100vw - 16px)); max-width: calc(100vw - 16px); height: min(680px, calc(100dvh - 96px)); min-height: min(360px, calc(100dvh - 16px)); max-height: calc(100dvh - 16px); margin: 0; resize: none; box-sizing: border-box; overflow: hidden; transform-origin: top right; }
.ai-assistant-dialog::backdrop { display: none; background: transparent; backdrop-filter: none; }
.ai-assistant-head { align-items: center; padding: 17px 18px 15px; background: color-mix(in srgb, #1bb89a 5%, var(--ui-popover)); cursor: grab; touch-action: none; user-select: none; }
.ai-assistant-dialog.is-dragging, .ai-assistant-dialog.is-resizing { box-shadow: 0 28px 78px rgba(5, 10, 24, .42); }
.ai-assistant-dialog.is-dragging .ai-assistant-head { cursor: grabbing; }
.ai-resize-handle { position: absolute; z-index: 8; display: block; touch-action: none; user-select: none; }
.ai-resize-handle.north, .ai-resize-handle.south { right: 16px; left: 16px; height: 5px; cursor: ns-resize; }
.ai-resize-handle.east { display: none; }
.ai-resize-handle.west { top: 16px; bottom: 16px; width: 5px; cursor: ew-resize; }
.ai-resize-handle.north { top: 0; }
.ai-resize-handle.south { bottom: 0; }
.ai-resize-handle.east { right: 0; }
.ai-resize-handle.west { left: 0; }
.ai-resize-handle.north-east, .ai-resize-handle.south-east, .ai-resize-handle.south-west, .ai-resize-handle.north-west { width: 18px; height: 18px; z-index: 9; }
.ai-resize-handle.north-east { top: 0; right: 0; cursor: nesw-resize; }
.ai-resize-handle.south-east { right: 0; bottom: 0; cursor: nwse-resize; }
.ai-resize-handle.south-west { bottom: 0; left: 0; cursor: nesw-resize; }
.ai-resize-handle.north-west { top: 0; left: 0; cursor: nwse-resize; }
.ai-assistant-head > div:first-child { min-width: 0; flex: 1; }
.ai-assistant-head .dialog-kicker { color: #1bb89a; font-size: 12px; font-weight: 850; }
.ai-assistant-head h2 { margin-top: 3px; display: flex; align-items: center; gap: 8px; font-size: 18px; }
.ai-assistant-head h2 .ui-icon { width: 20px; height: 20px; color: var(--icon-teal); }
.ai-assistant-head p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ai-assistant-head-actions { display: flex; flex: 0 0 auto; align-items: center; gap: 4px; }
.ai-assistant-head-actions > button { width: 34px; height: 34px; margin: 0; display: grid; place-items: center; border: 0; border-radius: 9px; color: var(--muted); background: transparent; cursor: pointer; }
.ai-assistant-head-actions > button:hover { color: var(--text); background: var(--surface-soft); }
.ai-assistant-head-actions .ui-icon { width: 17px; height: 17px; }
.ai-assistant-body { min-height: 0; flex: 1 1 auto; padding: 18px; overflow-y: auto; overflow-anchor: none; overscroll-behavior: contain; display: flex; flex-direction: column; gap: 13px; scrollbar-gutter: stable; }
.ai-message { flex-shrink: 0; max-width: min(88%, 560px); display: grid; grid-template-columns: 30px minmax(0, 1fr); align-items: start; gap: 9px; }
.ai-message > span { width: 30px; height: 30px; display: grid; place-items: center; border: 1px solid color-mix(in srgb, #1bb89a 28%, var(--line)); border-radius: 9px; color: #1bb89a; background: color-mix(in srgb, #1bb89a 9%, var(--surface)); }
.ai-message > span .ui-icon { width: 16px; height: 16px; }
.ai-message > div { position: relative; min-width: 0; padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.ai-message[data-ai-record-id] > div { padding-right: 12px; }
.ai-message > div > strong { padding-right: 62px; }
.ai-message-tools { position: absolute; top: 5px; right: 5px; display: flex; gap: 2px; }
.ai-message-tools button, .ai-conversations > button, [data-ai-restore] { width: 28px; height: 28px; padding: 0; display: grid; place-items: center; border: 0; border-radius: 6px; color: var(--muted); background: transparent; cursor: pointer; }
.ai-message-tools button:hover, .ai-conversations > button:hover, [data-ai-restore]:hover { color: var(--text); background: var(--surface-soft); }
.ai-message-tools .ui-icon, .ai-conversations > button .ui-icon, [data-ai-restore] .ui-icon { width: 14px; height: 14px; }
.ai-message.user .ai-message-tools button { color: inherit; }
.ai-message-source { display: block; margin-top: 10px; color: var(--muted); overflow-wrap: anywhere; }
.ai-welcome { margin: auto 0; text-align: center; color: var(--muted); }
.ai-welcome > .ui-icon { width: 30px; height: 30px; color: var(--primary); margin: 0 auto 12px; }
.ai-welcome h3 { color: var(--text); font-size: 18px; margin: 0 0 8px; }
.ai-welcome p { margin: 0; font-size: 13px; }
.ai-conversations { display: flex; min-width: 0; flex: 0 0 auto; align-items: center; gap: 10px; padding: 10px 18px; border-bottom: 1px solid var(--line); }
.ai-conversations[hidden] { display: none; }
.ai-conversations label { flex: 0 0 auto; color: var(--muted); font-size: 12px; }
.ai-conversations .ui-select, .ai-conversations select { flex: 1; min-width: 0; }
.ai-conversations > button { flex: 0 0 28px; }
.ai-resource-task { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
.ai-resource-task header { display: flex; align-items: start; justify-content: space-between; gap: 10px; }
.ai-resource-task strong { min-width: 0; overflow-wrap: anywhere; }
.ai-task-state { font-size: 12px; white-space: nowrap; color: var(--muted); }
.ai-resource-task[data-state="submitted"] .ai-task-state { color: var(--success); }
.ai-resource-task[data-state="uncertain"] .ai-task-state { color: var(--warning); }
.ai-resource-task[data-state="invalid_link"] .ai-task-state,
.ai-resource-task[data-state="failed"] .ai-task-state { color: var(--danger); }
.ai-resource-task p { font-size: 12px; margin-top: 6px; }
.ai-resource-task small { display: block; margin-top: 6px; color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }
.ai-task-submit { display: inline-flex; align-items: center; gap: 5px; min-height: 34px; margin-top: 10px; padding: 0 10px; background: var(--primary); color: white; border: 0; border-radius: 6px; cursor: pointer; }
.ai-task-submit .ui-icon { width: 15px; height: 15px; }
.ai-message strong { display: block; margin-bottom: 4px; font-size: 12px; }
.ai-message p { margin: 0; overflow-wrap: anywhere; color: var(--text); font-size: 14px; line-height: 1.58; white-space: pre-wrap; }
.ai-message-delete { position: absolute; top: 7px; right: 7px; width: 27px; height: 27px; padding: 0; display: grid; place-items: center; border: 0; border-radius: 7px; color: var(--muted); background: transparent; cursor: pointer; opacity: .25; transition: color .18s ease, background .18s ease, opacity .18s ease; }
.ai-message:hover .ai-message-delete, .ai-message-delete:focus-visible { opacity: 1; }
.ai-message-delete:hover { color: var(--danger); background: color-mix(in srgb, var(--danger) 10%, transparent); }
.ai-message-delete .ui-icon { width: 14px; height: 14px; }
.ai-message.user { align-self: flex-end; grid-template-columns: minmax(0, 1fr) 30px; }
.ai-message.user > span { grid-column: 2; grid-row: 1; color: var(--primary); border-color: color-mix(in srgb, var(--primary) 30%, var(--line)); background: var(--primary-soft); }
.ai-message.user > div { grid-column: 1; grid-row: 1; color: var(--accent-contrast); border-color: color-mix(in srgb, var(--primary) 70%, var(--line)); background: var(--primary); }
.ai-message.user strong, .ai-message.user p { color: inherit; }
.ai-message.user .ai-message-delete { color: color-mix(in srgb, white 78%, transparent); }
.ai-message.user .ai-message-delete:hover { color: white; background: rgba(255,255,255,.15); }
.ai-message.error > span { color: var(--danger); border-color: color-mix(in srgb, var(--danger) 30%, var(--line)); background: color-mix(in srgb, var(--danger) 9%, var(--surface)); }
.ai-message.error > div { border-color: color-mix(in srgb, var(--danger) 30%, var(--line)); }
.ai-message.loading p::after { content: ''; width: 5px; height: 5px; margin-left: 7px; display: inline-block; border-radius: 50%; background: #1bb89a; box-shadow: 9px 0 0 color-mix(in srgb, #1bb89a 65%, transparent), 18px 0 0 color-mix(in srgb, #1bb89a 35%, transparent); animation: ai-waiting 1s ease-in-out infinite alternate; }
@keyframes ai-waiting { to { opacity: .35; transform: translateY(-2px); } }
.ai-message-actions { margin-top: 9px; display: flex; flex-wrap: wrap; gap: 7px; }
.ai-message-actions button { min-height: 32px; padding: 0 11px; border: 1px solid var(--line); border-radius: 8px; color: var(--text); background: var(--surface); cursor: pointer; font-size: 12px; font-weight: 700; }
.ai-message-actions button.confirm { color: white; border-color: var(--primary); background: var(--primary); }
.ai-message-actions button:disabled { opacity: .5; cursor: default; }
.ai-assistant-quick { flex: 0 0 auto; min-width: 0; padding: 10px 18px; display: flex; flex-wrap: wrap; gap: 6px; border-top: 1px solid var(--line); }
.ai-assistant-quick::-webkit-scrollbar { display: none; }
.ai-assistant-quick button { min-height: 32px; padding: 0 11px; flex: 0 0 auto; border: 1px solid var(--line); border-radius: 8px; color: var(--muted); background: var(--surface-soft); cursor: pointer; font-size: 12px; }
.ai-assistant-quick button:hover { color: #1bb89a; border-color: color-mix(in srgb, #1bb89a 38%, var(--line)); }
.ai-assistant-compose { flex: 0 0 auto; margin: 0 18px 12px; padding: 7px; display: grid; grid-template-columns: minmax(0, 1fr) 42px; align-items: end; gap: 7px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft); }
.ai-assistant-compose:focus-within { border-color: color-mix(in srgb, #1bb89a 65%, var(--line)); box-shadow: 0 0 0 3px color-mix(in srgb, #1bb89a 12%, transparent); }
.ai-assistant-compose textarea { min-height: 42px; max-height: 120px; padding: 9px 10px; resize: vertical; border: 0; background: transparent; box-shadow: none; line-height: 1.45; }
.ai-assistant-compose textarea:focus { box-shadow: none; }
.ai-assistant-compose > button { width: 42px; height: 42px; padding: 0; display: grid; place-items: center; border: 0; border-radius: 9px; color: white; background: #159e86; cursor: pointer; }
.ai-assistant-compose > button:disabled { opacity: .45; cursor: default; }
.ai-assistant-compose > button[hidden] { display: none; }
.ai-assistant-compose > button .ui-icon { width: 18px; height: 18px; }
.ai-assistant-foot { min-height: 38px; flex: 0 0 auto; min-width: 0; padding: 0 18px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.ai-assistant-foot > span { display: flex; align-items: center; gap: 6px; }
.ai-assistant-foot > span i { width: 7px; height: 7px; border-radius: 50%; background: var(--muted); }
.ai-assistant-foot > span i.ready { background: var(--success); box-shadow: 0 0 0 4px color-mix(in srgb, var(--success) 12%, transparent); }
.ai-assistant-foot a { color: #1bb89a; font-weight: 700; }
.ai-assistant-foot a .ui-icon { width: 17px; height: 17px; }
.ai-assistant-foot > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

@container ai-settings (max-width: 680px) {
  .ai-settings-head { padding: 17px 16px; grid-template-columns: 42px minmax(0, 1fr); }
  .ai-settings-head > span { width: 42px; height: 42px; }
  .ai-settings-head > em { grid-column: 2; justify-self: start; }
  .ai-simple-settings { padding: 10px; }
  .ai-setting-row { min-height: 0; padding: 15px; grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .ai-test-row .button { width: 100%; justify-self: stretch; }
}

@container ai-assistant (max-width: 480px) {
  .ai-assistant-head { padding: 14px 13px 12px; }
  .ai-assistant-head p { max-width: calc(100cqw - 125px); font-size: 12px; }
  .ai-assistant-body { padding: 14px 12px; }
  .ai-message { max-width: 94%; }
  .ai-assistant-quick { padding-inline: 12px; }
  .ai-assistant-compose { margin-inline: 12px; }
  .ai-assistant-foot { padding-inline: 12px; grid-template-columns: 1fr auto; }
  .ai-assistant-foot small { display: none; }
}

@media (max-width: 640px) {
  .app-confirm-dialog { width: calc(100vw - 20px); max-height: calc(100dvh - 20px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); border-radius: 14px; }
  .app-confirm-shell { padding: 20px 16px 16px; gap: 15px; }
  .app-confirm-close { top: 8px; right: 8px; }
  .app-confirm-main { padding-right: 22px; grid-template-columns: 42px minmax(0, 1fr); gap: 12px; }
  .app-confirm-icon { width: 42px; height: 42px; border-radius: 11px; }
  .app-confirm-icon .ui-icon { width: 21px; height: 21px; }
  .app-confirm-copy h2 { font-size: 17px; }
  .app-confirm-copy p { font-size: 13px; }
  .app-confirm-actions { gap: 8px; }
  .app-confirm-actions .button { min-height: 40px; padding-inline: 10px; }
  .ai-settings-head { padding: 17px 16px; grid-template-columns: 42px minmax(0, 1fr); }
  .ai-settings-head > span { width: 42px; height: 42px; }
  .ai-settings-head > em { grid-column: 2; justify-self: start; }
  .ai-simple-settings { padding: 10px; }
  .ai-setting-row { min-height: 0; padding: 15px; grid-template-columns: 1fr; gap: 12px; }
  .ai-test-row .button { width: 100%; justify-self: stretch; }
  .ai-assistant-dialog { top: auto; right: auto; bottom: calc(6px + env(safe-area-inset-bottom)); left: 6px; width: calc(100vw - 12px); min-width: 0; max-width: calc(100vw - 12px); height: min(72dvh, 620px); min-height: 360px; max-height: calc(100dvh - 12px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); margin: 0; border-radius: 14px; resize: none; }
  .ai-assistant-head { padding: 14px 13px 12px; }
  .ai-assistant-head p { max-width: calc(100vw - 125px); font-size: 12px; }
  .ai-assistant-body { padding: 14px 12px; }
  .ai-message { max-width: 94%; }
  .ai-message-delete { opacity: .72; }
  .ai-assistant-quick { padding-inline: 12px; }
  .ai-assistant-compose { margin-inline: 12px; }
  .ai-assistant-foot { padding-inline: 12px; grid-template-columns: 1fr auto; }
  .ai-assistant-foot small { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .ai-message.loading p::after { animation: none; }
}

/* Member discovery and poster requests */
.member-discovery-hero { position: relative; width: 100vw; min-height: min(720px, calc(100dvh - 92px)); margin: -28px 0 0 calc(50% - 50vw); overflow: hidden; display: flex; align-items: end; color: #fff; background: #111722; }
.member-discovery-hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 30%; }
.member-discovery-hero > .recommend-hero-layers { inset: 0; height: 100%; z-index: 0; }
.member-discovery-hero-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(4,8,15,.12) 0%, rgba(4,8,15,.18) 36%, rgba(4,8,15,.72) 73%, var(--bg) 100%), linear-gradient(90deg, rgba(4,8,15,.88) 0%, rgba(4,8,15,.44) 38%, rgba(4,8,15,.08) 76%); }
.member-discovery-hero-copy { position: relative; z-index: 1; width: min(1900px, calc(100% - 48px)); margin: 0 auto; padding: 0 0 88px; }
.member-discovery-hero-copy > span, .member-discovery-heading > div > span, .member-settings-hero > div > span { color: #8bd9d2; font-size: 12px; font-weight: 850; }
.member-discovery-hero-copy h1 { margin: 7px 0 9px; font-size: 38px; }
.member-discovery-hero-copy p { margin: 0; color: rgba(255,255,255,.78); line-height: 1.65; }
.member-discovery-hero-copy .button { margin-top: 22px; color: #fff; border-color: rgba(255,255,255,.3); background: rgba(9,14,24,.45); backdrop-filter: blur(12px); }
.member-recommend-mobile-filter { position: absolute; right: max(24px, calc((100vw - 1900px) / 2)); bottom: 30px; left: max(24px, calc((100vw - 1900px) / 2)); z-index: 3; width: auto; }
.member-recommend-console { margin-top: -54px; position: relative; z-index: 4; display: grid; gap: 16px; }
@media (max-width: 720px) {
  .member-recommend-console { margin-top: 0; }
}
.member-discovery-notice + .member-recommend-console { margin-top: 16px; }
.member-recommend-search { width: 100%; padding: 12px; border: 1px solid rgba(255,255,255,.1); border-radius: 8px; background: rgba(9,14,24,.88); box-shadow: 0 12px 36px rgba(0,0,0,.24); backdrop-filter: blur(18px); }
.member-recommend-filter-panel { width: 100%; padding: 14px 18px 18px; border: 1px solid rgba(255,255,255,.08); border-radius: 8px; background: #111722; }
.member-discovery-notice { min-height: 72px; margin-top: 16px; padding: 14px 16px; display: grid; grid-template-columns: 42px minmax(0, 1fr) auto; align-items: center; gap: 13px; border: 1px solid color-mix(in srgb, var(--primary) 28%, var(--line)); border-radius: 8px; background: var(--primary-soft); }
.member-discovery-notice > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 8px; color: #fff; background: var(--primary); }
.member-discovery-notice > span .ui-icon { width: 20px; height: 20px; }
.member-discovery-notice strong, .member-discovery-notice p { display: block; }
.member-discovery-notice p { margin: 3px 0 0; color: var(--muted); font-size: 13px; }
.member-discovery-notice.warning { border-color: color-mix(in srgb, var(--warning) 32%, var(--line)); background: color-mix(in srgb, var(--warning) 8%, var(--surface)); }
.member-discovery-notice.warning > span { background: var(--warning); }
.member-discovery-heading { margin: 28px 0 16px; display: flex; align-items: end; justify-content: space-between; gap: 16px; }
.member-discovery-heading h2 { margin-top: 4px; font-size: 24px; }
.member-discovery-grid { gap: clamp(20px, 1.25vw, 28px) clamp(10px, .85vw, 18px); }
.member-discovery-grid .recommend-card { max-width: none; }
.member-discovery-poster-shell { position: relative; }
.member-discovery-card .recommend-poster { border-radius: 8px; }
.member-discovery-card.requested .recommend-poster > img { filter: saturate(.68); }
.member-request-quick-form { position: absolute; right: 10px; bottom: 10px; left: 10px; z-index: 7; display: flex; justify-content: center; opacity: 0; transform: translateY(7px); transition: opacity .18s ease, transform .18s ease; }
.member-request-quick-form button { min-height: 38px; padding: 0 15px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid rgba(255,255,255,.65); border-radius: 8px; color: #fff; background: rgba(9,14,24,.82); box-shadow: 0 8px 24px rgba(0,0,0,.3); cursor: pointer; font: inherit; font-size: 13px; font-weight: 800; backdrop-filter: blur(12px); }
.member-request-quick-form button:hover, .member-request-quick-form button:focus-visible { border-color: #fff; background: var(--primary); }
.member-request-quick-form .ui-icon { width: 16px; height: 16px; }
.member-discovery-poster-shell:hover .member-request-quick-form, .member-discovery-poster-shell:focus-within .member-request-quick-form { opacity: 1; transform: translateY(0); }
.member-request-state { position: absolute; right: 9px; bottom: 9px; z-index: 5; min-height: 30px; padding: 0 10px; display: inline-flex; align-items: center; border-radius: 8px; color: #fff; background: rgba(9,14,24,.78); font-size: 12px; font-weight: 800; backdrop-filter: blur(12px); }
.member-request-state.status-completed { background: color-mix(in srgb, var(--success) 82%, #081119); }
.member-request-state.status-rejected { background: color-mix(in srgb, var(--danger) 82%, #081119); }
.member-discovery-empty { margin-top: 20px; }

.member-recommendation-detail { inset: 0; z-index: 80; }
.member-recommendation-detail .recommendation-detail-hero-inner.member-detail-hero-inner { grid-template-columns: minmax(0, 900px); }
.member-recommendation-detail .recommendation-detail-hero-primary { transform: none; }
.member-detail-request-form { margin: 0; }
.member-detail-request-form .button { min-height: 46px; padding-inline: 20px; }
.member-detail-request-state { cursor: default; }
.member-detail-request-state.status-completed { color: var(--success); border-color: color-mix(in srgb, var(--success) 35%, var(--line)); background: var(--success-soft); }
.member-manual-request-dialog { width: min(560px, calc(100vw - 24px)); max-height: min(760px, calc(100dvh - 24px)); padding: 0; overflow: auto; border-radius: 8px; }
.member-manual-request-dialog > form { padding: 22px; display: grid; gap: 15px; }
.member-manual-request-dialog .dialog-actions { margin: 3px -22px -22px; }

.member-settings-page-head { min-height: 76px; margin-bottom: 18px; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.member-settings-page-head > div > span { color: var(--primary); font-size: 12px; font-weight: 850; }
.member-settings-page-head h1 { margin: 5px 0 6px; font-size: 30px; }
.member-settings-page-head p { margin: 0; color: var(--muted); }
.member-settings-page-head .button { flex: 0 0 auto; }
.member-settings-overview { min-height: 154px; border-radius: 8px; }
.member-settings-overview > div:first-child small { color: var(--primary); font-size: 12px; font-weight: 850; }
.member-settings-overview > div:first-child h2 { margin-top: 7px; }
.member-settings-overview-state { min-width: min(430px, 42%); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.member-settings-overview-state > span { min-height: 78px; padding: 13px 14px; display: grid; grid-template-columns: 10px minmax(0, 1fr); align-content: center; gap: 3px 9px; border: 1px solid var(--line); border-radius: 8px; background: color-mix(in srgb, var(--surface) 92%, transparent); }
.member-settings-overview-state i { width: 9px; height: 9px; grid-row: 1 / 3; align-self: center; border-radius: 50%; background: var(--muted); box-shadow: 0 0 0 4px color-mix(in srgb, var(--muted) 13%, transparent); }
.member-settings-overview-state b { font-size: 13px; }
.member-settings-overview-state em { color: var(--muted); font-size: 12px; font-style: normal; }
.member-settings-overview-state .success i { background: var(--success); box-shadow: 0 0 0 4px color-mix(in srgb, var(--success) 13%, transparent); }
.member-settings-overview-state .warning i { background: var(--danger); box-shadow: 0 0 0 4px color-mix(in srgb, var(--danger) 13%, transparent); }
.member-settings-plugin-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.member-settings-plugin-card { min-height: 350px; display: flex; flex-direction: column; border-radius: 8px; }
.member-settings-plugin-card .settings-section-head > div { min-width: 0; flex: 1; }
.member-settings-plugin-card .settings-section-head small { color: var(--primary); font-size: 12px; font-weight: 850; }
.member-settings-plugin-card .settings-section-head h2 { margin-top: 3px; }
.member-settings-plugin-card .settings-section-head .badge { flex: 0 0 auto; }
.member-settings-plugin-card > form { flex: 1; display: flex; flex-direction: column; }
.member-settings-plugin-card .member-proxy-switch { min-height: 64px; margin-bottom: 18px; border-radius: 8px; }
.member-settings-plugin-card .member-settings-actions { margin-top: auto; }
.member-settings-managed-card { min-height: 260px; }
.member-settings-managed-copy { margin-top: auto; padding: 18px; display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 12px; align-items: flex-start; border: 1px solid var(--line); border-radius: 8px; background: color-mix(in srgb, var(--primary) 5%, var(--surface)); }
.member-settings-managed-copy > svg { width: 22px; height: 22px; color: var(--primary); }
.member-settings-managed-copy strong { display: block; margin-bottom: 6px; }
.member-settings-managed-copy p { margin: 0; color: var(--muted); line-height: 1.65; }
.member-settings-actions { padding-top: 5px; display: flex; align-items: center; justify-content: flex-end; gap: 9px; }
.member-settings-test-result { margin-top: 18px; padding: 13px 14px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border: 1px solid color-mix(in srgb, var(--success) 28%, var(--line)); border-radius: 8px; color: var(--success); background: var(--success-soft); }
.member-settings-test-result span { color: var(--muted); font-size: 13px; text-align: right; }
.member-settings-test-result.warning { color: var(--danger); border-color: color-mix(in srgb, var(--danger) 30%, var(--line)); background: color-mix(in srgb, var(--danger) 8%, var(--surface)); }
.member-recommend-pagination { padding-top: 8px; }

.member-request-hero-actions { display: flex; align-items: center; gap: 9px; }
.member-request-history-wide { margin-top: 18px; }
.member-request-view-tabs { display: inline-flex; align-items: center; gap: 4px; padding: 4px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.member-request-view-tabs a { min-height: 36px; padding: 0 12px; display: inline-flex; align-items: center; gap: 8px; border-radius: 6px; color: var(--muted); font-size: 13px; font-weight: 800; text-decoration: none; }
.member-request-view-tabs a:hover, .member-request-view-tabs a.active { color: var(--text); background: var(--surface); box-shadow: 0 2px 8px rgba(20,30,52,.08); }
.member-request-view-tabs b { min-width: 22px; height: 22px; padding-inline: 6px; display: grid; place-items: center; border-radius: 11px; color: var(--muted); background: color-mix(in srgb, var(--line) 70%, transparent); font-size: 12px; }
.member-request-view-tabs a.active b { color: #fff; background: var(--primary); }
.member-request-poster-grid { grid-template-columns: repeat(10, minmax(0, 1fr)); gap: clamp(20px, 1.25vw, 28px) clamp(10px, .85vw, 18px); }
.member-request-poster-grid > .designed-empty { grid-column: 1 / -1; }
.member-request-card { min-width: 0; padding: 0; overflow: visible; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.member-request-card-link { display: block; color: inherit; text-decoration: none; }
.member-request-card-visual { position: relative; width: 100%; aspect-ratio: 2 / 3; overflow: hidden; border-radius: 8px; background: color-mix(in srgb, var(--primary) 10%, var(--surface)); box-shadow: 0 12px 30px rgba(20,30,52,.14); }
.member-request-card-poster, .member-request-card-placeholder { width: 100%; height: 100%; display: grid; place-items: center; object-fit: cover; background: color-mix(in srgb, var(--primary) 10%, var(--surface)); }
.member-request-card-poster { transition: transform .2s ease, filter .2s ease; }
.member-request-card-placeholder { align-content: center; gap: 10px; color: var(--primary); }
.member-request-card-placeholder span { color: var(--muted); font-size: 12px; }
.member-request-card-placeholder .ui-icon { width: 34px; height: 34px; }
.member-request-card-visual > .media-request-type, .member-request-card-visual > .media-request-status { position: absolute; top: 8px; z-index: 2; min-height: 25px; padding-inline: 7px; color: #fff; border-color: rgba(255,255,255,.18); background: rgba(8,13,22,.76); font-size: 12px; backdrop-filter: blur(10px); }
.member-request-card-visual > .media-request-type { left: 9px; }
.member-request-card-visual > .media-request-status { right: 9px; }
.member-request-card > h3 { margin: 10px 0 2px; overflow: hidden; color: var(--text); text-align: center; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
.member-request-card > p { margin: 0; overflow: hidden; color: var(--muted); text-align: center; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.member-request-play-hint { position: absolute; inset: 0; z-index: 3; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 8px; color: #fff; background: rgba(4,8,15,.56); opacity: 0; transition: opacity .18s ease; }
.member-request-play-hint .ui-icon { width: 30px; height: 30px; padding: 8px; box-sizing: content-box; border-radius: 50%; background: rgba(255,255,255,.18); backdrop-filter: blur(10px); }
.member-request-play-hint b { font-size: 12px; }
.member-request-card.is-playable:hover .member-request-play-hint, .member-request-card-link:focus-visible .member-request-play-hint { opacity: 1; }
.member-request-card.is-playable:hover .member-request-card-poster, .member-request-card-link:focus-visible .member-request-card-poster { filter: brightness(.72); transform: scale(1.045); }

@media (max-width: 1500px) { .member-request-poster-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
@media (max-width: 1120px) { .member-request-poster-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); } }

@media (max-width: 1700px) { .media-request-admin-list { grid-template-columns: repeat(7, minmax(0, 1fr)); } }
@media (max-width: 1450px) { .media-request-admin-list { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
@media (max-width: 1200px) { .media-request-admin-list { grid-template-columns: repeat(5, minmax(0, 1fr)); } }

@media (hover: none), (pointer: coarse) {
  .member-request-quick-form { opacity: 1; transform: none; }
  .member-request-quick-form button { background: rgba(9,14,24,.82); }
}

@media (max-width: 980px) {
  .member-portal-head { padding-inline: 14px; gap: 9px; }
  .member-portal-brand > span, .member-portal-user > span { display: none; }
  .member-portal-head > nav { min-width: 0; flex: 1; justify-content: flex-start; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; }
  .member-portal-head > nav::-webkit-scrollbar { display: none; }
  .member-portal-head > nav a { min-width: max-content; flex: 0 0 auto; padding-inline: 10px; }
  .member-discovery-hero { min-height: min(600px, calc(100dvh - 84px)); }
  .member-discovery-hero-copy { width: calc(100% - 28px); padding: 34px 0 88px; }
  .media-request-admin-list { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 680px) {
  .member-discovery-hero { min-height: min(520px, calc(100dvh - 76px)); }
  .member-discovery-hero-shade { background: linear-gradient(0deg, rgba(4,8,15,.96), rgba(4,8,15,.22)); }
  .member-discovery-hero-copy { width: 100%; padding: 25px 24px 98px; }
  .member-discovery-hero-copy h1 { font-size: 30px; }
  .member-discovery-heading { align-items: flex-start; flex-direction: column; }
  .member-discovery-heading .button { width: 100%; }
  .member-portal-content { width: min(100% - 24px, 1900px); }
  .member-discovery-notice { grid-template-columns: 38px minmax(0, 1fr); }
  .member-discovery-notice > span { width: 38px; height: 38px; }
  .member-discovery-notice .button { grid-column: 1 / -1; width: 100%; }
  .member-settings-page-head { align-items: flex-start; flex-direction: column; }
  .member-settings-page-head .button { width: 100%; }
  .member-settings-overview { padding: 22px; align-items: flex-start; flex-direction: column; }
  .member-settings-overview-state { width: 100%; min-width: 0; }
  .member-settings-plugin-grid { grid-template-columns: 1fr; }
  .member-settings-plugin-card { min-height: 0; }
  .member-settings-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .member-settings-actions .button { width: 100%; }
  .member-settings-test-result { align-items: flex-start; flex-direction: column; }
  .member-settings-test-result span { text-align: left; }
  .member-request-hero-actions { width: 100%; display: grid; grid-template-columns: 1fr 1fr; }
  .member-request-hero-actions .button { width: 100%; padding-inline: 10px; }
  .member-request-poster-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px 10px; }
  .member-request-view-tabs { width: 100%; }
  .member-request-view-tabs a { flex: 1; justify-content: center; }
  .media-request-admin-list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px 10px; }
  .media-request-admin-card-actions > a, .media-request-admin-card-actions > button, .media-request-admin-card-actions > form > button { min-height: 38px; }
  .media-request-editor-body { grid-template-columns: 140px minmax(0, 1fr); gap: 15px; padding: 16px; }
  .media-request-editor-fields { grid-template-columns: 1fr; }
  .media-request-editor-dialog .dialog-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .media-request-editor-dialog .dialog-actions .button { width: 100%; }
  .media-request-editor-dialog .dialog-actions .button:first-child { grid-column: 1 / -1; }
}

@media (max-width: 430px) {
  .member-discovery-grid { gap-inline: 9px; }
  .member-request-quick-form { right: 7px; bottom: 7px; left: 7px; }
  .member-request-quick-form button { width: 100%; justify-content: center; padding-inline: 8px; }
  .member-request-poster-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .media-request-admin-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .media-request-admin-card-actions span { display: none; }
  .media-request-admin-card-actions .ui-icon { width: 16px; height: 16px; }
  .media-request-editor-body { grid-template-columns: 1fr; grid-auto-rows: max-content; align-content: start; }
  .media-request-editor-poster { width: 132px; margin-inline: auto; }
}

@media (max-width: 1180px) {
  .member-home-hero { grid-template-columns: minmax(0, 1fr) minmax(280px, 360px); }
  .member-home-service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .member-home-main { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .member-home-hero { min-height: 0; padding: 22px; grid-template-columns: 1fr; gap: 20px; }
  .member-home-identity .portal-user-avatar { width: 68px; height: 68px; }
  .member-home-identity h1 { font-size: 26px; }
  .member-home-membership { padding: 16px 17px; }
  .member-home-service-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .member-home-service-grid > a { min-height: 96px; padding: 14px; grid-template-columns: 38px minmax(0, 1fr); gap: 10px; }
  .member-home-service-grid > a > span { width: 38px; height: 38px; }
  .member-home-service-grid > a > .ui-icon, .member-home-service-grid p { display: none; }
  .member-renew-card, .member-home-summary { padding: 18px; }
  .member-renew-card > form { grid-template-columns: 1fr; }
  .member-renew-card > form .button { width: 100%; }
  .member-home-feed-grid { grid-template-columns: 1fr; }
}

@media (max-width: 460px) {
  .member-auth-actions { grid-template-columns: 1fr; }
  .member-home-hero { padding: 18px; }
  .member-home-identity { align-items: flex-start; gap: 13px; }
  .member-home-identity .portal-user-avatar { width: 58px; height: 58px; }
  .member-home-identity h1 { margin-top: 4px; font-size: 22px; }
  .member-home-membership { grid-template-columns: 1fr; }
  .member-home-membership > span { grid-column: 1; grid-row: auto; justify-self: start; }
  .member-home-membership > em { grid-column: 1; }
  .member-home-service-grid { grid-template-columns: 1fr; }
  .member-home-service-grid > a { min-height: 80px; grid-template-columns: 40px minmax(0, 1fr) 16px; }
  .member-home-service-grid > a > .ui-icon { display: block; }
  .member-renew-card > header { grid-template-columns: 40px minmax(0, 1fr); }
  .member-renew-card > header > span { width: 40px; height: 40px; }
  .member-renew-card > footer { align-items: flex-start; }
}
.member-telegram-plugin {
  min-width: 0;
  display: grid;
  gap: 14px;
}

.member-telegram-overview {
  padding: 18px;
  display: grid;
  gap: 14px;
  border: 1px solid color-mix(in srgb, var(--primary) 24%, var(--line));
  border-radius: 12px;
  background: color-mix(in srgb, var(--primary-soft) 22%, var(--surface));
}

.member-telegram-overview-copy {
  min-width: 0;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
}

.member-telegram-overview-copy > span,
.member-telegram-section > header > span {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  color: var(--primary);
  background: color-mix(in srgb, var(--primary) 12%, var(--surface));
}

.member-telegram-overview-copy > span .ui-icon,
.member-telegram-section > header > span .ui-icon {
  width: 20px;
  height: 20px;
}

.member-telegram-overview-copy > div,
.member-telegram-section > header > div {
  min-width: 0;
}

.member-telegram-overview-copy strong,
.member-telegram-overview-copy p,
.member-telegram-section h3,
.member-telegram-section p {
  margin: 0;
}

.member-telegram-overview-copy p,
.member-telegram-section p {
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.55;
}

.member-telegram-overview-copy > .badge {
  justify-self: end;
}

.member-telegram-stats,
.member-bot-admin-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.member-telegram-stats > div,
.member-bot-admin-summary > div {
  min-width: 0;
  padding: 13px 15px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: color-mix(in srgb, var(--surface) 91%, var(--background));
}

.member-telegram-stats span,
.member-bot-admin-summary span {
  display: block;
  margin-bottom: 5px;
  color: var(--muted);
  font-size: 12px;
}

.member-telegram-stats strong,
.member-bot-admin-summary strong {
  display: block;
  overflow: hidden;
  color: var(--text);
  font-size: 16px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.member-telegram-stats small {
  display: block;
  overflow: hidden;
  margin-top: 4px;
  color: var(--muted);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.member-telegram-error {
  margin: 0;
  display: grid;
  gap: 6px;
  overflow-wrap: anywhere;
}

[data-member-bot-runtime] { display: grid; gap: 12px; min-width: 0; }
.member-telegram-error details { min-width: 0; }
.member-telegram-error details p { margin: 8px 0 0; }
.member-telegram-stats strong, .member-telegram-stats small { white-space: normal; overflow-wrap: anywhere; }

.member-telegram-form {
  min-width: 0;
  display: grid;
  gap: 12px;
}

.member-telegram-section {
  min-width: 0;
  padding: 20px;
  display: grid;
  grid-template-columns: minmax(210px, .6fr) minmax(0, 1.4fr);
  align-items: start;
  gap: 24px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--surface);
}

.member-telegram-section > header {
  min-width: 0;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: start;
  gap: 12px;
}

.member-telegram-section h3 {
  font-size: 15px;
}

.member-telegram-section-body {
  min-width: 0;
  display: grid;
  gap: 13px;
}

.member-telegram-runtime-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.member-telegram-runtime-grid > div {
  min-width: 0;
  min-height: 66px;
  padding: 11px 13px;
  display: grid;
  align-content: center;
  gap: 3px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--surface-soft);
}

.member-telegram-runtime-grid span,
.member-telegram-runtime-grid small {
  color: var(--muted);
  font-size: 12px;
}

.member-telegram-runtime-grid strong {
  overflow: hidden;
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.member-telegram-clear-token {
  min-width: 0;
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
  color: var(--danger);
  cursor: pointer;
}

.member-telegram-clear-token > input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.member-telegram-clear-check {
  width: 20px;
  height: 20px;
  display: grid;
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--danger) 45%, var(--line));
  border-radius: 5px;
  background: var(--surface);
}

.member-telegram-clear-check .ui-icon {
  width: 13px;
  height: 13px;
  color: white;
  opacity: 0;
}

.member-telegram-clear-token > input:checked + .member-telegram-clear-check {
  border-color: var(--danger);
  background: var(--danger);
}

.member-telegram-clear-token > input:checked + .member-telegram-clear-check .ui-icon {
  opacity: 1;
}

.member-telegram-clear-token > input:focus-visible + .member-telegram-clear-check {
  outline: 3px solid color-mix(in srgb, var(--danger) 20%, transparent);
}

.member-telegram-clear-token > span:last-child {
  min-width: 0;
  display: grid;
  gap: 2px;
}

.member-telegram-clear-token small {
  color: var(--muted);
  font-size: 12px;
}

.member-telegram-option-grid {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.member-telegram-option {
  min-width: 0;
  min-height: 76px;
  padding: 13px 14px;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--surface-soft);
  cursor: pointer;
  transition: border-color .18s ease, background .18s ease;
}

.member-telegram-option:hover {
  border-color: color-mix(in srgb, var(--primary) 38%, var(--line));
  background: color-mix(in srgb, var(--primary-soft) 34%, var(--surface));
}

.member-telegram-option > input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.member-telegram-option > input:checked + .notification-switch {
  background: var(--primary);
}

.member-telegram-option > input:checked + .notification-switch i {
  transform: translateX(17px);
}

.member-telegram-option > input:focus-visible + .notification-switch {
  outline: 3px solid color-mix(in srgb, var(--primary) 24%, transparent);
}

.member-telegram-option > span:last-child {
  min-width: 0;
  display: grid;
  gap: 3px;
}

.member-telegram-option b {
  font-size: 14px;
}

.member-telegram-option small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}

.member-telegram-actions {
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: color-mix(in srgb, var(--surface-soft) 64%, var(--surface));
}

.member-telegram-actions > div {
  display: grid;
  width: 100%;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 8px;
}

.member-telegram-actions .button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 40px;
  margin: 0;
}

.member-telegram-actions .ui-icon {
  width: 16px;
  height: 16px;
}

.member-telegram-guide {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 11px;
  background: var(--surface);
}

.member-telegram-guide > summary {
  min-height: 48px;
  padding: 0 15px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 18px;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  list-style: none;
}

.member-telegram-guide > summary::-webkit-details-marker {
  display: none;
}

.member-telegram-guide > summary > span {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 8px;
}

.member-telegram-guide > summary .ui-icon {
  width: 17px;
  height: 17px;
  color: var(--primary);
}

.member-telegram-guide > summary > em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
}

.member-telegram-guide > summary > .ui-icon:last-child {
  color: var(--muted);
  transition: transform .18s ease;
}

.member-telegram-guide[open] > summary > .ui-icon:last-child {
  transform: rotate(180deg);
}

.member-telegram-guide ol {
  margin: 0;
  padding: 14px 18px 17px 38px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 13px;
  line-height: 1.9;
}

.member-telegram-guide code {
  color: var(--text);
}

.member-bot-account-card {
  grid-column: 1 / -1;
}

.member-bot-account-card .account-card-head > span svg {
  width: 22px;
  height: 22px;
}

.account-bot-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.member-bot-bind-code {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--primary) 42%, var(--border));
  border-radius: 8px;
  background: color-mix(in srgb, var(--primary) 8%, var(--panel));
}

.member-bot-bind-code span {
  color: var(--muted);
  font-size: 12px;
}

.member-bot-bind-code strong {
  min-width: 0;
  color: var(--text);
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: 20px;
  letter-spacing: 0;
  text-align: center;
  word-break: break-all;
}

.member-bot-default-access {
  margin-top: 16px;
  padding: 16px 18px;
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  align-items: start;
  gap: 12px;
  border: 1px solid color-mix(in srgb, var(--success) 24%, var(--line));
  border-radius: 10px;
  color: var(--success);
  background: color-mix(in srgb, var(--success-soft) 58%, var(--surface));
}

.member-bot-default-access > .ui-icon { width: 22px; height: 22px; margin: 2px auto 0; }
.member-bot-default-access > div { min-width: 0; }
.member-bot-default-access strong { color: var(--text); font-size: 14px; }
.member-bot-default-access p { margin: 5px 0 0; color: var(--muted); font-size: 13px; line-height: 1.65; }

@media (max-width: 900px) {
  .member-telegram-section {
    grid-template-columns: 1fr;
    gap: 16px;
  }

}

@media (max-width: 640px) {
  .member-telegram-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .member-telegram-stats > div { padding: 8px 4px; }
  .member-telegram-stats > div:last-child { grid-column: 1 / -1; }

  .member-bot-admin-summary {
    grid-template-columns: 1fr;
  }

  .member-telegram-overview,
  .member-telegram-section {
    padding: 14px;
  }

  .member-telegram-overview-copy {
    grid-template-columns: 38px minmax(0, 1fr);
  }

  .member-telegram-overview-copy > span,
  .member-telegram-section > header > span {
    width: 38px;
    height: 38px;
  }

  .member-telegram-overview-copy > .badge {
    width: max-content;
    grid-column: 2;
    justify-self: start;
  }

  .member-telegram-runtime-grid,
  .member-telegram-option-grid {
    grid-template-columns: 1fr;
  }

  .member-telegram-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .member-telegram-actions > div {
    display: grid;
    grid-template-columns: 1fr;
  }

  .member-telegram-actions .button {
    width: 100%;
  }

  .member-telegram-guide > summary {
    grid-template-columns: minmax(0, 1fr) 18px;
  }

  .member-telegram-guide > summary > em {
    display: none;
  }

  .member-bot-bind-code {
    grid-template-columns: 1fr;
    justify-items: stretch;
  }

  .member-bot-bind-code strong {
    text-align: left;
  }

  .account-bot-actions {
    display: grid;
    grid-template-columns: 1fr;
  }
}

.member-cloud-playback-sync { margin: 10px 0 0; padding-top: 9px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.member-cloud-playback-sync.warning { color: var(--warning); }
.member-one15-manual { display: grid; gap: 14px; min-width: 0; margin-block: 20px; padding-block: 18px; border-block: 1px solid var(--line); }
.member-one15-manual h3 { margin: 0; font-size: 16px; }
.member-one15-manual textarea { width: 100%; min-width: 0; resize: vertical; overflow-wrap: anywhere; }
.member-one15-manual > .button { justify-self: start; }
.member-region-routing { margin-block: 13px; padding: 19px; border: 1px solid var(--line); border-radius: 17px; background: var(--surface); box-shadow: var(--shadow-soft); min-width: 0; }
.region-heading, .region-heading > div { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.region-heading h2 { display: flex; align-items: center; gap: 9px; margin: 0; font-size: 19px; }
.region-heading h2 .ui-icon { color: var(--success); width: 22px; height: 22px; }
.region-status { margin-block: 12px 18px; font-size: 13px; color: var(--muted); }
.region-settings, .region-logins { border-block-start: 1px solid var(--line); }
.region-settings > summary, .region-logins > summary { padding-block: 16px; font-weight: 600; cursor: pointer; }
.region-settings > form { padding-block: 0 18px; }
.region-settings .form-grid { margin-block: 14px; }
.region-table-scroll { width: 100%; overflow-x: auto; overscroll-behavior-x: contain; }
.region-table { width: 100%; min-width: 720px; border-collapse: collapse; font-size: 13px; }
.region-table th, .region-table td { padding: 13px 12px; text-align: left; border-bottom: 1px solid var(--line); }
.region-table th { font-weight: 500; color: var(--muted); }
.region-table td { max-width: 280px; overflow-wrap: anywhere; }
.region-table td small { display: block; margin-top: 4px; color: var(--muted); }
.region-table .region-empty { padding: 30px 12px; color: var(--muted); text-align: center; }
.region-row-actions { display: flex; gap: 8px; }
.region-row-actions .button { width: 36px; height: 36px; padding: 8px; flex-shrink: 0; }
.region-row-actions form { margin: 0; }
.region-preview { display: flex; gap: 12px; align-items: center; margin-block: 20px; flex-wrap: wrap; }
.region-preview > input { width: 290px; max-width: 100%; min-width: 0; }
.region-preview-result { display: grid; gap: 6px; border-left: 3px solid var(--success); padding: 10px 16px; margin-block: 0 20px; overflow-wrap: anywhere; }
.region-preview-result span, .region-preview-result small { color: var(--muted); }
.region-rule-dialog { width: min(900px, calc(100vw - 24px)); max-height: calc(100dvh - 32px); overflow-y: auto; }
.region-rule-dialog > form { padding: 0 24px 20px; }
.region-rule-dialog [data-region-fields][hidden] { display: none !important; }
.region-area-picker { min-width: 0; }
.region-area-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.region-area-toolbar > strong { font-size: 14px; }
.region-choice-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 12px; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; }
.region-choice-pane { display: flex; flex-direction: column; gap: 8px; padding: 12px; min-width: 0; }
.region-choice-pane + .region-choice-pane { border-left: 1px solid var(--line); }
.region-choice-pane > strong { font-size: 13px; }
.region-choice-pane input[type="search"], .region-city-custom input { width: 100%; min-width: 0; padding: 8px; font-size: 13px; }
.region-choice-list { height: 230px; overflow-y: auto; overscroll-behavior: contain; }
.region-choice-row { display: flex; align-items: center; gap: 8px; padding-left: 8px; min-height: 38px; border-radius: 4px; }
.region-choice-row:hover { background: var(--surface-soft); }
.region-choice-row.active { background: var(--primary-soft); }
.region-choice-row[hidden] { display: none; }
.region-choice-row input[type="checkbox"] { width: 16px; height: 16px; flex: 0 0 16px; margin: 0; accent-color: var(--primary); cursor: pointer; }
.region-choice-row input:disabled { cursor: default; }
.region-area-picker .region-choice-name { display: flex; align-items: center; justify-content: flex-start; gap: 8px; flex: 1; min-width: 0; margin: 0; padding: 9px 6px 9px 0; border: 0; background: transparent; color: var(--text); font: inherit; font-size: 13px; font-weight: 400; line-height: 20px; text-align: left; cursor: pointer; overflow-wrap: anywhere; }
.region-choice-name .ui-icon { width: 14px; height: 14px; flex: 0 0 14px; margin-left: auto; color: var(--muted); }
.region-choice-name:focus-visible, .region-selected-item button:focus-visible { outline: 2px solid var(--primary); outline-offset: -2px; }
.region-selected { display: grid; gap: 8px; margin-top: 14px; min-width: 0; }
.region-selected > strong { font-size: 13px; }
.region-selected-list { display: flex; flex-wrap: wrap; align-content: start; gap: 6px; max-height: 115px; overflow-y: auto; }
.region-selected-item { display: inline-flex; align-items: center; gap: 4px; min-width: 0; max-width: 100%; padding: 3px 4px 3px 9px; border: 1px solid var(--line); border-radius: 4px; background: var(--surface-soft); font-size: 12px; }
.region-selected-item > span { overflow-wrap: anywhere; min-width: 0; }
.region-selected-item button { display: grid; place-items: center; width: 26px; height: 26px; flex: 0 0 26px; padding: 4px; border: 0; background: transparent; color: var(--muted); cursor: pointer; }
.region-selected-item button:hover { color: var(--danger); }
.region-selected-item .ui-icon { width: 14px; height: 14px; }
.region-city-custom { display: grid; grid-template-columns: minmax(0, 1fr) 36px; gap: 8px; }
.region-city-custom > .button { padding: 8px; }
.region-area-status { color: var(--muted); font-size: 13px; }
@media (max-width: 620px) {
  .region-choice-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .region-choice-country { grid-column: 1 / -1; border-bottom: 1px solid var(--line); }
  .region-choice-country .region-choice-list { height: 110px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-content: start; }
  .region-choice-pane { padding: 8px; }
  .region-choice-pane.region-choice-region { border-left: 0; }
  .region-choice-list { height: 180px; }
}
.region-node-list { border: 1px solid var(--line); border-radius: 6px; display: flex; flex-wrap: wrap; gap: 16px; padding: 16px; margin-block: 18px; min-width: 0; }
.region-node-choice { display: flex; align-items: center; gap: 9px; font-size: 14px; overflow-wrap: anywhere; }
.region-node-choice input[type="checkbox"] { width: 17px; height: 17px; flex: 0 0 17px; margin: 0; }
@media (max-width: 620px) {
  .member-region-routing { padding: 16px; }
  .region-preview { display: grid; grid-template-columns: minmax(0, 1fr) auto; }
  .region-preview > label { grid-column: 1 / -1; }
  .region-preview > input { width: 100%; }
  .region-rule-dialog .form-grid.two { grid-template-columns: minmax(0, 1fr); }
  .region-rule-dialog > form { padding-inline: 14px; }
}
.builtin-global-search { display: flex; gap: 8px; margin-bottom: 20px; }
.builtin-global-search input { flex: 1; min-width: 0; }
.builtin-search-source { display: block; margin-top: 5px; color: var(--muted); font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
.builtin-item-checks { margin: 20px 0; padding-block: 16px; border-block: 1px solid var(--line); }
.builtin-check-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.builtin-check-toolbar select { width: auto; max-width: 100%; }
.builtin-check-status { color: var(--muted); line-height: 1.7; margin: 12px 0; overflow-wrap: anywhere; }
.builtin-check-steps { list-style: none; padding: 0; margin: 0; }
.builtin-check-steps li { padding: 12px 0; border-bottom: 1px solid var(--line); }
.builtin-check-steps li:last-child { border-bottom: 0; }
.builtin-check-steps p { margin: 6px 0; line-height: 1.6; color: var(--muted); }
.builtin-check-steps a { color: var(--primary); font-size: 13px; }
.builtin-check-steps [data-state="passed"] strong { color: var(--success); }
.builtin-check-steps [data-state="failed"] strong { color: var(--danger, #e26473); }
.builtin-episode-coverage { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 10px; margin-bottom: 16px; }
.builtin-episode-coverage > * { min-width: 0; display: flex; flex-direction: column; gap: 5px; padding: 12px; border: 1px solid var(--line); border-radius: 6px; }
.builtin-episode-coverage small { color: var(--muted); overflow-wrap: anywhere; }
.builtin-episode-coverage [data-state="present"] > span { color: var(--success); }
.builtin-episode-coverage [data-state="missing"] { border-color: var(--warning, #d8a449); }
.builtin-episode-coverage [data-state="missing"] > span { color: var(--warning, #d8a449); }
.template-local-only { display: none !important; }
.recommend-discovery { --recommend-content-width: 100%; display: flow-root; color: var(--text); }
.recommend-discovery .recommend-hero { margin: 0; color: var(--text); }
.discovery-feature { position: relative; isolation: isolate; height: clamp(280px, 48vh, 440px); margin: calc(-1 * var(--page-gutter)) calc(-1 * var(--page-gutter)) 4px; padding: 0 var(--page-gutter) 28px; display: flex; align-items: end; touch-action: pan-y pinch-zoom; }
.discovery-feature[data-draggable="true"] { cursor: grab; user-select: none; }
.discovery-feature.is-dragging { cursor: grabbing; }
.discovery-feature:focus-visible { outline: 2px solid var(--primary); outline-offset: -3px; }
.discovery-feature-art { position: absolute; inset: 0; z-index: -1; overflow: hidden; background: var(--bg); }
.discovery-feature-layer { position: absolute; inset: 0 -24px; width: calc(100% + 48px); height: 100%; object-fit: cover; object-position: center 38%; opacity: 0; transform: translateX(var(--hero-drag-offset, 0px)); transition: opacity .8s ease, transform .2s ease; }
.discovery-feature.is-dragging .discovery-feature-layer { transition: opacity .8s ease; }
.discovery-feature-layer.is-active { opacity: 1; }
.discovery-feature-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.16) 0%, transparent 36%, rgba(0,0,0,.22) 62%, var(--bg) 100%); }
.discovery-feature .discovery-heading { width: 100%; padding: 0; align-items: end; }
.discovery-feature .discovery-heading > div { color: #fff; text-shadow: 0 2px 12px rgba(0,0,0,.6); }
.discovery-feature .discovery-heading span { display: block; margin-bottom: 12px; color: #e4e4ee; font-size: 12px; font-weight: 650; letter-spacing: 0; }
.discovery-feature .discovery-heading h2 { color: #fff; font-size: 40px; line-height: 1.15; }
.discovery-feature .discovery-heading p { color: #e4e4ee; font-size: 15px; margin-top: 12px; }
.discovery-feature .discovery-heading > a { color: #fff; background: rgba(20,20,28,.48); border-color: rgba(255,255,255,.24); backdrop-filter: blur(14px); }
.discovery-feature-copy { min-width: 0; width: min(620px, 72%); }
.discovery-feature .discovery-feature-copy h2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; font-size: 34px; }
.discovery-feature .discovery-feature-facts { font-size: 13px; color: #f4d68f; margin-top: 10px; }
.discovery-feature .discovery-feature-overview { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.6; font-size: 14px; margin-top: 8px; }
.discovery-feature-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.discovery-feature-actions[hidden] { display: none; }
.discovery-feature-actions .button.secondary { color: #fff; background: rgba(20,20,28,.5); border-color: rgba(255,255,255,.3); backdrop-filter: blur(14px); }
.discovery-shelf-section { min-width: 0; margin-bottom: 12px; }
.discovery-shelf-section > header { display: flex; gap: 12px; align-items: center; justify-content: space-between; margin: 0 0 16px; }
.discovery-shelf-section h3 { margin: 0; font-size: 19px; }
.discovery-shelf-section > header > div { display: flex; align-items: center; gap: 8px; }
.discovery-shelf-section header a { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 13px; margin-right: 8px; }
.discovery-shelf-section header button { width: 30px; height: 30px; display: grid; place-items: center; padding: 0; border: 1px solid var(--line); border-radius: 50%; color: var(--text); background: var(--surface); cursor: pointer; }
.recommend-discovery .recommend-grid.discovery-shelf { display: grid; grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(155px, 17%); justify-content: start; overflow-x: auto; overscroll-behavior-x: contain; gap: 16px; padding-bottom: 12px; scroll-snap-type: x proximity; }
.discovery-shelf .recommend-card { scroll-snap-align: start; }
.discovery-section-notice { color: var(--muted); font-size: 13px; }
.recommend-discovery .recommend-poster:has([data-discovery-poster]) { background: var(--surface-soft); }
.recommend-poster [data-discovery-poster] { opacity: 0; transition: opacity .2s; }
.recommend-poster.is-image-ready [data-discovery-poster] { opacity: 1; }
.discovery-poster-failure { display: none; position: absolute; inset: 50px 10px 55px; flex-direction: column; align-items: center; justify-content: center; gap: 10px; color: var(--muted); text-align: center; }
.discovery-poster-failure > span { font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
.discovery-poster-failure > button { width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: 50%; background: var(--surface); color: var(--text); cursor: pointer; }
.recommend-poster.is-image-error .discovery-poster-failure { display: flex; }
.recommend-poster.is-image-error .recommend-hover { display: none; }
.recommendation-library-warning { color: var(--warning, #e7b75e); font-size: 13px; }
.discovery-heading { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 12px 0 22px; }
.discovery-heading h2 { margin: 0 0 7px; font-size: 28px; line-height: 1.2; letter-spacing: 0; }
.discovery-heading p { margin: 0; color: var(--muted); font-size: 14px; }
.discovery-heading > a { flex-shrink: 0; }
.discovery-tabs { display: flex; gap: 28px; border-bottom: 1px solid var(--line); margin-bottom: 20px; }
.discovery-tabs a { display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 2px; color: var(--muted); border-bottom: 2px solid transparent; font-weight: 700; }
.discovery-tabs a[aria-current] { color: var(--text); border-bottom-color: var(--primary); }
.discovery-tabs a[aria-current] > .ui-icon { color: var(--primary); }
.discovery-tabs small { font-size: 12px; font-weight: 500; color: var(--muted); }
.recommend-discovery .discovery-search { grid-template-columns: minmax(0, 1fr) auto 42px; margin-bottom: 18px; }
.discovery-search > input { min-width: 0; min-height: 44px; }
.discovery-search > .button { min-height: 44px; border-radius: 6px; }
.discovery-search > a { padding: 0; }
.recommend-discovery .recommend-filter-panel { padding: 0; }
.recommend-discovery .recommend-filter-group { display: grid; grid-template-columns: 46px 80px minmax(0, 1fr); gap: 10px; align-items: start; min-height: 36px; padding: 2px 0; }
.recommend-discovery .recommend-filter-group-label { display: flex; align-items: center; min-height: 28px; color: var(--muted); font-size: 13px; }
.recommend-discovery .recommend-filter-group > div { display: flex; flex-wrap: wrap; gap: 4px 20px; min-width: 0; }
.recommend-discovery .recommend-filter-panel a { color: var(--muted); min-height: 28px; font-size: 13px; }
.recommend-discovery .recommend-filter-panel a.active { color: var(--primary); font-weight: 700; }
.recommend-discovery .recommend-filter-panel .recommend-filter-default { width: max-content; padding: 0 8px; border: 0; border-radius: 5px; color: var(--muted); }
.recommend-discovery .recommend-filter-panel .recommend-filter-default.active { color: var(--text); background: color-mix(in srgb, var(--primary) 15%, transparent); }
.discovery-more { border-top: 1px solid var(--line); margin-top: 8px; }
.discovery-more > summary { display: flex; align-items: center; gap: 8px; min-height: 44px; width: fit-content; color: var(--muted); font-size: 13px; cursor: pointer; list-style: none; }
.discovery-more > summary::-webkit-details-marker { display: none; }
.discovery-more > summary > small { color: var(--primary); font-size: 12px; }
.discovery-more > summary > .ui-icon:last-child { transition: transform .18s ease; }
.discovery-more[open] > summary > .ui-icon:last-child { transform: rotate(180deg); }
.discovery-more-body { padding: 0 0 12px; }
.recommend-discovery .recommend-console { min-height: 0; padding-top: 16px; gap: 12px; border-top: 1px solid var(--line); background: transparent; }
.discovery-results-heading { display: flex; align-items: baseline; flex-wrap: wrap; gap: 12px; }
.discovery-results-heading h3 { font-size: 17px; margin: 0; }
.discovery-results-heading > span { color: var(--muted); font-size: 13px; overflow-wrap: anywhere; }
.discovery-result-status { display: flex; flex-wrap: wrap; gap: 8px 20px; color: var(--muted); font-size: 12px; }
.discovery-result-status .is-warning { color: var(--warning, #d8a449); }
.recommend-discovery .recommend-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 24px 16px; }
.recommend-discovery .recommend-card { max-width: none; }
.recommend-discovery .recommend-poster { border-radius: 8px; box-shadow: none; }
.recommend-discovery .recommend-card h3 { font-size: 14px; }
.recommend-discovery .recommend-card-button > p { display: flex; flex-direction: column; gap: 5px; min-height: 40px; font-size: 12px; }
.discovery-library-state { color: var(--success); font-size: 12px; line-height: 1.5; }
.discovery-library-state.is-unknown { color: var(--muted); }
.discovery-library-link { display: flex; align-items: center; gap: 5px; color: var(--text); font-size: 12px; min-height: 32px; }
.discovery-library-link .ui-icon { width: 14px; height: 14px; }
.discovery-library-link .ui-icon:last-child { margin-left: auto; }
.discovery-subscription-info { border-top: 1px solid var(--line); padding-top: 10px; font-size: 12px; }
.discovery-subscription-info strong { color: var(--primary); }
.discovery-subscription-info p { margin: 6px 0; color: var(--muted); overflow-wrap: anywhere; line-height: 1.6; }
.discovery-subscription-info small { display: block; color: var(--muted); font-size: 12px; line-height: 1.8; }
.recommend-discovery .recommend-empty { grid-column: 1 / -1; min-height: 260px; padding: 36px 20px; border-radius: 0; border: 0; background: transparent; box-shadow: none; }
.recommend-discovery .recommend-empty > .ui-icon { width: 36px; height: 36px; color: var(--primary); margin-bottom: 12px; }
.recommend-discovery .recommend-empty h3 { font-size: 19px; }
.recommend-connect > div { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.recommendation-episode-chip.is-builtin, .recommendation-episode-state.is-builtin { color: var(--success); border-color: var(--success); }
.recommendation-library-legend .is-builtin i { background: var(--success); }
@media (max-width: 720px) {
  .discovery-feature { height: clamp(270px, 43vh, 340px); padding-bottom: 24px; }
  .discovery-feature .discovery-heading h2 { font-size: 30px; }
  .discovery-feature .discovery-heading p { font-size: 13px; }
  .discovery-feature .discovery-heading span { font-size: 12px; margin-bottom: 10px; }
  .discovery-feature-copy { width: 100%; }
  .discovery-feature .discovery-feature-copy h2 { font-size: 25px; max-width: 100%; }
  .discovery-feature .discovery-heading > a { display: none; }
  .discovery-feature-copy > span { display: none !important; }
  .discovery-feature-actions { margin-top: 12px; }
  .discovery-tabs { gap: 18px; }
  .discovery-tabs a { font-size: 13px; gap: 5px; white-space: nowrap; }
  .discovery-shelf-section h3 { font-size: 17px; }
  .recommend-discovery .recommend-grid.discovery-shelf { grid-auto-columns: minmax(140px, 43%); gap: 12px; }
  .discovery-heading { align-items: flex-start; padding-top: 4px; }
  .discovery-heading h2 { font-size: 24px; }
  .discovery-heading > a { font-size: 12px; padding-inline: 9px; min-height: 36px; }
  .discovery-tabs { gap: 24px; margin-bottom: 16px; }
  .recommend-discovery .discovery-search { grid-template-columns: minmax(0, 1fr) 42px 42px; gap: 7px; margin-bottom: 12px; }
  .recommend-discovery .recommend-mobile-filter-bar { margin: 0 0 12px; }
  .recommend-discovery .recommend-filter-panel { padding: 14px; visibility: hidden; }
  body.recommend-filter-open .recommend-discovery .recommend-filter-panel { visibility: visible; }
  .recommend-discovery .recommend-filter-group { grid-template-columns: 42px minmax(0, 1fr); gap: 6px; padding-block: 12px; }
  .recommend-discovery .recommend-filter-group > div { grid-column: 2; gap: 8px 16px; }
  .recommend-discovery .recommend-filter-panel a { white-space: normal; }
  .recommend-discovery .recommend-filter-panel .recommend-filter-default { width: fit-content; }
  .recommend-discovery .recommend-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px 12px; }
}
@media (max-width: 480px) {
  .recommend-discovery .recommend-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
  .discovery-feature-layer { transition: none; }
  .discovery-more > summary > .ui-icon:last-child { transition: none; }
}
.artwork-target-tabs { display: flex; align-items: center; gap: 22px; padding: 14px 4px; border-block: 1px solid var(--line); margin: 12px 0 20px; }
.member-admin-tools { display: flex; gap: 20px; overflow-x: auto; white-space: nowrap; border-bottom: 1px solid var(--line); margin-bottom: 20px; }
.member-admin-tools a { display: inline-flex; align-items: center; gap: 7px; padding: 12px 0; color: var(--muted); text-decoration: none; border-bottom: 2px solid transparent; }
.member-admin-tools a.active { color: var(--primary); border-color: var(--primary); }
.member-audit-page { min-width: 0; padding-top: 4px; }
.member-audit-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 20px; }
.member-audit-heading > div { display: flex; flex-wrap: wrap; align-items: baseline; gap: 12px; min-width: 0; }
.member-audit-heading h2 { margin: 0; font-size: 18px; }
.member-audit-heading > div > span { font-size: 12px; color: var(--muted); white-space: nowrap; }
.member-audit-heading .member-audit-search { display: flex; flex: 0 1 380px; gap: 8px; margin: 0; min-width: 0; }
.member-audit-search > input[name=q] { flex: 1; min-width: 0; height: 40px; font-size: 13px; }
.member-audit-search > .icon-command { flex: 0 0 40px; width: 40px; height: 40px; }
.member-audit-records { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--line); }
.member-audit-records > li { padding: 22px 0; border-bottom: 1px solid var(--line); }
.member-audit-record-head { display: flex; align-items: baseline; flex-wrap: wrap; gap: 10px; }
.member-audit-record-head > strong { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; min-width: 0; font-size: 14px; font-weight: 650; overflow-wrap: anywhere; }
.member-audit-record-head > strong > span { color: var(--muted); }
.member-audit-record-head > time { margin-left: auto; color: var(--muted); font-size: 12px; white-space: nowrap; }
.member-audit-result { display: inline-flex; align-items: center; gap: 5px; color: var(--muted); font-size: 12px; white-space: nowrap; }
.member-audit-result::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
.member-audit-result.is-success { color: var(--success); }
.member-audit-result.is-failed { color: var(--danger); }
.member-audit-result.is-partial { color: var(--warning); }
.member-audit-record-meta { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-top: 10px; font-size: 12px; color: var(--muted); overflow-wrap: anywhere; }
.member-audit-records p { margin: 12px 0 0; font-size: 13px; line-height: 1.65; overflow-wrap: anywhere; }
.member-audit-records details { margin-top: 12px; font-size: 12px; }
.member-audit-records summary { width: fit-content; padding: 4px 0; color: var(--primary); cursor: pointer; }
.member-audit-records pre { max-height: 280px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; padding: 12px; background: var(--surface-soft); border-radius: 6px; font-size: 12px; }
.member-audit-records > .member-audit-empty { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 12px; padding: 48px 0; color: var(--muted); font-size: 13px; }
.member-audit-empty > .ui-icon { width: 28px; height: 28px; }
.member-audit-footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; padding: 20px 0 0; font-size: 12px; color: var(--muted); }
.member-audit-pagination { display: flex; flex: 0 0 auto; align-items: center; gap: 12px; }
.member-audit-pagination > .icon-command { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; min-width: 40px; flex: 0 0 40px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); color: var(--text); text-decoration: none; }
.member-audit-pagination > .icon-command:disabled { opacity: .35; cursor: not-allowed; }
.member-audit-pagination > a:hover { color: var(--primary); border-color: var(--primary); }
.member-audit-pagination > span { min-width: 76px; text-align: center; white-space: nowrap; font-variant-numeric: tabular-nums; }
.member-audit-pagination b { color: var(--text); font-weight: 650; }
.member-console .member-account-hero { min-height: 0; padding: 6px 0 20px; margin: 0; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: none; }
.member-console .member-account-hero h2 { font-size: 22px; }
.member-console .member-account-hero > div:first-child > span { display: none; }
.member-console .member-filter { grid-template-columns: minmax(180px, 1.5fr) repeat(3, minmax(110px, 1fr)) auto auto; padding: 0 0 16px; border: 0; border-radius: 0; background: none; }
.member-bulk-toolbar { display: flex; align-items: center; gap: 14px; padding: 10px 0; color: var(--muted); font-size: 13px; }
.member-bulk-toolbar .button { margin-left: auto; }
.member-user-card.member-compact-row { display: grid; grid-template-columns: 20px minmax(130px, .9fr) 72px minmax(310px, 2fr) 76px; gap: 12px; padding: 14px 8px; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; box-shadow: none; background: transparent; }
.member-compact-row .member-user-main { min-width: 0; padding: 0; text-align: left; border: 0; background: none; color: var(--text); cursor: pointer; }
.member-compact-row .member-user-main img { width: 36px; height: 36px; flex: 0 0 36px; }
.member-compact-row .member-user-identity { display: grid; min-width: 0; gap: 4px; }
.member-compact-row .member-user-identity strong, .member-compact-row .member-user-identity small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.member-compact-row small { color: var(--muted); font-size: 12px; }
.member-row-status { display: grid; gap: 5px; justify-items: start; }
.member-status-link { color: inherit; text-decoration: none; }
.member-status-link:hover { text-decoration: underline; text-underline-offset: 3px; }
.member-status-link.badge { min-height: 28px; display: inline-flex; align-items: center; }
.member-status-note { font-size: 12px; }
.member-more-menu { position: fixed; z-index: 120; display: grid; width: min(208px, calc(100vw - 16px)); padding: 6px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); box-shadow: 0 12px 36px rgba(0, 0, 0, .2); overflow-y: auto; overscroll-behavior: contain; }
.member-more-menu[hidden] { display: none; }
.member-more-menu.ui-motion-popover { transform-origin: top right; }
.member-more-menu [role=menuitem] { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 42px; padding: 9px 12px; border: 0; border-radius: 5px; background: none; color: var(--text); font: inherit; font-size: 13px; text-align: left; text-decoration: none; cursor: pointer; }
.member-more-menu [role=menuitem]:hover, .member-more-menu [role=menuitem]:focus-visible { background: var(--surface-soft); }
.member-more-menu [role=menuitem].danger-text { color: var(--danger); border-top: 1px solid var(--line); border-radius: 0 0 5px 5px; }
.member-compact-row .member-user-details { display: grid; grid-template-columns: 1fr 1fr 1.25fr; min-width: 0; margin: 0; gap: 12px; }
.member-compact-row .member-user-details > div { min-width: 0; }
.member-compact-row .member-user-details dd { font-size: 13px; overflow-wrap: anywhere; }
.member-compact-row .member-user-details dt { font-size: 12px; }
.member-compact-row .member-user-details small { display: block; margin-top: 3px; }
.member-compact-row .member-user-actions { grid-column: auto; display: flex; gap: 4px; margin: 0; padding: 0; border: 0; }
.member-compact-row .icon-command { width: 36px; height: 36px; min-width: 36px; }
.member-row-check { display: flex; align-items: center; justify-content: center; min-width: 0; min-height: 36px; cursor: pointer; }
.member-detail-dialog { width: min(780px, calc(100vw - 24px)); border-radius: 8px; }
.member-detail-dialog > .dialog-head { flex: 0 0 auto; }
.member-detail-dialog > .member-detail-head { gap: 14px; padding: 20px 24px; align-items: center; }
.member-detail-identity { min-width: 0; display: flex; align-items: center; gap: 14px; flex: 1; }
.member-detail-identity > img { width: 48px; height: 48px; flex: 0 0 48px; border-radius: 8px; object-fit: cover; }
.member-detail-identity > div { min-width: 0; }
.member-detail-eyebrow { display: block; font-size: 12px; color: var(--muted); }
.member-detail-head .member-detail-identity h2 { margin: 3px 0; font-size: 20px; line-height: 1.4; overflow-wrap: anywhere; }
.member-detail-head .member-detail-identity p { margin: 0; font-size: 12px; overflow-wrap: anywhere; }
.member-detail-status { display: inline-flex; align-items: center; gap: 7px; font-size: 12px; white-space: nowrap; }
.member-detail-status i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.member-detail-status.is-active { color: var(--success); }
.member-detail-status.is-attention { color: var(--warning); }
.member-detail-body { min-height: 0; flex: 1 1 auto; padding: 0 24px; overflow-y: auto; overscroll-behavior: contain; }
.member-detail-body h3 { font-size: 14px; margin: 0; display: flex; align-items: center; gap: 8px; }
.member-detail-overview { display: grid; grid-template-columns: 1.1fr 1fr .9fr; margin: 0; padding: 22px 0; border-bottom: 1px solid var(--line); }
.member-detail-overview > div { min-width: 0; padding: 0 18px; }
.member-detail-overview > div:first-child { padding-left: 0; }
.member-detail-overview > div + div { border-left: 1px solid var(--line); }
.member-detail-overview dt { display: flex; align-items: center; gap: 7px; font-size: 12px; color: var(--muted); }
.member-detail-overview dt .ui-icon { width: 15px; height: 15px; }
.member-detail-overview dd { margin: 9px 0 0; font-size: 15px; font-weight: 650; overflow-wrap: anywhere; }
.member-detail-overview .member-detail-expiry dd { font-size: 21px; line-height: 1.25; }
.member-detail-overview small { display: block; margin-top: 6px; font-size: 12px; color: var(--muted); overflow-wrap: anywhere; }
.member-detail-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 24px; margin: 18px 0; }
.member-detail-facts > div { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; min-width: 0; }
.member-detail-facts dt { color: var(--muted); font-size: 12px; flex: 0 0 auto; }
.member-detail-facts dd { margin: 0; font-size: 12px; text-align: right; overflow-wrap: anywhere; }
.member-detail-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.member-detail-actions > .button { min-height: 34px; padding: 6px 12px; font-size: 12px; }
.member-detail-operations { padding: 20px 0; margin-top: 20px; border-top: 1px solid var(--line); }
.member-detail-operations > header { display: flex; align-items: center; gap: 8px; margin-bottom: 16px; }
.member-detail-operations > header > .ui-icon { color: var(--primary); }
.member-detail-history { border-top: 1px solid var(--line); }
.member-detail-history > summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 56px; padding: 14px 0; list-style: none; cursor: pointer; }
.member-detail-history > summary::-webkit-details-marker { display: none; }
.member-detail-history > summary > span { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.member-detail-history > summary > span:last-child { color: var(--muted); font-size: 12px; }
.member-detail-history > summary .ui-icon { width: 16px; height: 16px; }
.member-detail-history[open] > summary > span:last-child .ui-icon { transform: rotate(180deg); }
.member-detail-history-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; padding: 4px 0 20px; }
.member-detail-history-grid > section { min-width: 0; }
.member-detail-history-grid > section + section { padding-left: 24px; border-left: 1px solid var(--line); }
.member-detail-activity-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; }
.member-detail-activity-head > a { display: inline-flex; align-items: center; gap: 4px; color: var(--primary); font-size: 12px; text-decoration: none; }
.member-detail-activity-head > a .ui-icon { width: 14px; height: 14px; }
.member-detail-empty { margin: 16px 0 0; color: var(--muted); font-size: 12px; }
.member-detail-request-list { padding: 0; margin: 4px 0 0; list-style: none; }
.member-detail-request-list li { display: flex; align-items: baseline; gap: 10px; justify-content: space-between; padding: 14px 0; border-bottom: 1px solid var(--line); font-size: 12px; }
.member-detail-request-list strong { font-weight: 500; overflow-wrap: anywhere; }
.member-detail-request-list span { color: var(--muted); flex: 0 0 auto; }
.member-detail-history .member-audit-list { font-size: 12px; }
.member-detail-history .member-audit-list strong { font-weight: 500; }
.member-detail-history .member-audit-list p { font-size: 12px; }
.member-operation-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; align-items: end; }
.member-operation-submit { display: flex; justify-content: flex-end; margin-top: 14px; }
.member-operation-submit .button { min-width: 120px; min-height: 38px; }
.member-operation-fields .full { grid-column: 1 / -1; }
.member-operation-fields label, .member-policy-form label:not(.checkbox), .member-reminder-settings > label:not(.checkbox) { display: grid; gap: 8px; min-width: 0; font-size: 13px; }
.member-operation-fields :is(input,select,textarea), .member-policy-form :is(input:not([type=checkbox]),select), .member-reminder-settings input[type=number] { width: 100%; min-width: 0; padding: 10px; color: var(--text); background: var(--surface); border: 1px solid var(--line); border-radius: 6px; font: inherit; }
.member-operation-fields [hidden] { display: none; }
.member-operation-result { margin-top: 16px; padding: 14px 0; border-top: 1px solid var(--line); font-size: 13px; overflow-wrap: anywhere; }
.member-operation-result [data-result-state=failed], .member-operation-result [data-result-state=partial] { color: var(--danger); }
.member-operation-result [data-result-state=success] { color: var(--success); }
.member-operation-row { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.member-operation-row > div { flex: 1; min-width: 0; }
.member-operation-row p { margin: 0 0 5px; }
.member-operation-row small { color: var(--muted); }
.member-operation-row > :is(a,button) { flex: 0 0 auto; }
.member-operation-row > a { color: var(--danger); }
.member-operation-row .icon-command { width: 36px; height: 36px; }
.member-operation-links { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 14px; }
.member-audit-list { list-style: none; margin: 0; padding: 0; }
.member-audit-list li { padding: 14px 0; border-bottom: 1px solid var(--line); overflow-wrap: anywhere; }
.member-audit-list small { display: block; margin-top: 5px; color: var(--muted); }
.member-audit-list pre { white-space: pre-wrap; font-size: 12px; }
.member-audit-list p { margin: 8px 0; font-size: 13px; }
.member-policy-editor { border-bottom: 1px solid var(--line); padding: 16px 0; }
.member-policy-editor summary { display: flex; gap: 8px; align-items: center; cursor: pointer; font-weight: 650; }
.member-policy-form { padding: 18px 0; }
.member-policy-form > button { margin-top: 16px; }
.member-reminder-settings { display: grid; gap: 20px; max-width: 620px; margin: 24px 0; }
.member-reminder-settings fieldset { display: flex; flex-wrap: wrap; gap: 16px; padding: 16px; border: 1px solid var(--line); border-radius: 6px; }
.member-reminder-settings > button { justify-self: start; }
.member-console .code-create { display: flex; flex-wrap: wrap; }
.member-console .code-create > label { flex: 1 1 140px; }
@media (max-width: 1150px) {
  .member-console .member-filter { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .member-user-card.member-compact-row { grid-template-columns: 20px minmax(0, 1fr) 80px 76px; }
  .member-compact-row .member-user-details { grid-column: 2 / -1; grid-row: 2; }
  .member-compact-row .member-user-actions { grid-column: 4; grid-row: 1; }
}
@media (max-width: 620px) {
  .member-account-dialog > .dialog-head { padding: 16px; }
  .member-create-body { padding: 0 16px; }
  .member-create-section .account-create-grid { grid-template-columns: 1fr; }
  .member-account-dialog .dialog-actions { padding: 12px 16px; gap: 10px; }
  .member-account-dialog .dialog-actions > .button { flex: 1; min-width: 0; padding-inline: 10px; font-size: 13px; }
  .member-audit-heading { flex-direction: column; align-items: stretch; gap: 16px; }
  .member-audit-heading .member-audit-search { flex-basis: auto; width: 100%; }
  .member-audit-record-head > time { width: 100%; margin-left: 0; }
  .member-audit-records > li { padding: 20px 0; }
  .member-audit-record-meta { gap: 8px 14px; }
  .member-audit-footer { gap: 12px; }
  .member-stats.stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .member-stats .stat { padding: 14px; }
  .member-user-card.member-compact-row { grid-template-columns: 20px minmax(0, 1fr) 76px; padding: 14px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); gap: 10px; }
  .member-compact-row .member-row-status { grid-column: 2; grid-row: 2; }
  .member-compact-row .member-user-details { grid-column: 1 / -1; grid-row: 3; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .member-compact-row .member-user-details > div:last-child { grid-column: 1 / -1; }
  .member-compact-row .member-user-actions { grid-column: 3; grid-row: 1 / 3; align-self: start; }
  .member-detail-dialog > .member-detail-head { padding: 16px; gap: 10px; }
  .member-detail-identity { gap: 10px; }
  .member-detail-identity > img { width: 40px; height: 40px; flex-basis: 40px; }
  .member-detail-head .member-detail-identity h2 { font-size: 17px; }
  .member-detail-body { padding: 0 16px; }
  .member-detail-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 0; padding: 18px 0; }
  .member-detail-overview > .member-detail-expiry { grid-column: 1 / -1; padding: 0 0 16px; border-bottom: 1px solid var(--line); }
  .member-detail-overview > div:nth-child(2) { border-left: 0; padding-left: 0; }
  .member-detail-overview > div { padding-right: 0; }
  .member-detail-facts, .member-operation-fields { grid-template-columns: 1fr; }
  .member-detail-operations { margin-top: 18px; padding: 18px 0; }
  .member-operation-submit .button { width: 100%; }
  .member-detail-history-grid { grid-template-columns: 1fr; gap: 20px; }
  .member-detail-history-grid > section + section { padding-left: 0; padding-top: 18px; border-left: 0; border-top: 1px solid var(--line); }
  .member-detail-history > summary { flex-wrap: wrap; gap: 8px; }
  .member-admin-tools { gap: 16px; font-size: 13px; }
  .member-bulk-toolbar { flex-wrap: wrap; gap: 8px; }
  .member-console .member-account-hero .panel-actions { display: flex; flex-wrap: wrap; }
}
.member-console .member-account-hero .panel-actions { flex-wrap: wrap; gap: 8px; }
.member-console .member-account-hero .button { min-height: 38px; border-radius: 6px; padding-inline: 14px; }
.member-console .member-account-hero .icon-command { width: 38px; height: 38px; border-radius: 6px; }
.member-list-grid { --member-columns: 22px minmax(140px, 1fr) 100px minmax(340px, 2.2fr) 76px; gap: 0; }
.member-status-tabs { display: flex; gap: 22px; overflow-x: auto; min-width: 0; border-bottom: 1px solid var(--line); scrollbar-width: thin; }
.member-status-tabs > a { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 7px; min-height: 48px; border-bottom: 2px solid transparent; color: var(--muted); text-decoration: none; font-size: 13px; font-weight: 600; white-space: nowrap; }
.member-status-tabs > a b { min-width: 18px; font-size: 12px; font-weight: 500; text-align: center; color: var(--muted); font-variant-numeric: tabular-nums; }
.member-status-tabs > a:hover, .member-status-tabs > a.active { color: var(--primary); }
.member-status-tabs > a.active { border-color: var(--primary); }
.member-status-tabs > a.active b { color: var(--primary); }
.member-console .member-list-filter { display: block; padding: 16px 0; margin: 0; }
.member-filter-top { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.member-search-box { display: flex; align-items: center; min-width: 0; flex: 1 1 240px; max-width: 420px; height: 38px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); }
.member-search-box:focus-within { border-color: var(--primary); }
.member-console .member-search-box input { flex: 1; min-width: 0; height: 36px; padding: 0 12px; border: 0; border-radius: 6px; background: transparent; box-shadow: none; font-size: 13px; }
.member-console .member-search-box .icon-command { width: 36px; height: 36px; min-width: 36px; border: 0; background: transparent; }
.member-console .member-filter-top .button { min-height: 38px; border-radius: 6px; padding-inline: 12px; font-size: 13px; }
.member-filter-top .icon-command { width: 38px; height: 38px; min-width: 38px; border-radius: 6px; }
.member-filter-count { min-width: 18px; padding: 2px 4px; font-size: 12px; color: var(--primary); background: var(--primary-soft); border-radius: 4px; }
.member-filter-total { margin-left: auto; color: var(--muted); font-size: 12px; white-space: nowrap; }
.member-filter-options { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) auto; gap: 12px; align-items: end; padding-top: 16px; }
.member-filter-options[hidden], .member-bulk-toolbar[hidden] { display: none; }
.member-console .member-filter-options label > span { font-size: 12px; font-weight: 500; }
.member-filter-chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 0 12px; }
.member-filter-chips a { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; padding: 5px 8px; border: 1px solid var(--line); border-radius: 4px; font-size: 12px; color: var(--text); text-decoration: none; overflow-wrap: anywhere; }
.member-filter-chips svg { width: 12px; height: 12px; flex: 0 0 12px; color: var(--muted); }
.member-list-grid .member-bulk-toolbar { padding: 8px 10px; margin: 0 0 8px; gap: 8px; border-radius: 6px; background: var(--primary-soft); color: var(--text); }
.member-list-grid .member-bulk-toolbar .button { min-height: 34px; font-size: 12px; padding-inline: 10px; }
.member-list-grid .member-bulk-toolbar .icon-command { width: 34px; height: 34px; min-width: 34px; }
.member-table-head, .member-list-grid .member-user-card.member-compact-row { display: grid; grid-template-columns: var(--member-columns); gap: 14px; align-items: center; }
.member-table-head { min-height: 40px; padding: 0 8px; border-block: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.member-table-head .member-row-check > span { display: none; }
.member-table-details { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 14px; min-width: 0; }
.member-table-details > a { display: inline-flex; gap: 5px; align-items: center; color: inherit; text-decoration: none; }
.member-table-details > a:hover { color: var(--primary); }
.member-table-details > a svg { width: 13px; height: 13px; }
.member-table-actions { text-align: right; padding-right: 4px; }
.member-list-grid .member-user-card.member-compact-row { min-height: 74px; padding: 12px 8px; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: none; box-shadow: none; }
.member-list-grid .member-user-card.member-compact-row:hover { background: color-mix(in srgb, var(--primary) 3%, transparent); }
.member-list-grid .member-user-card.member-compact-row.is-selected { background: var(--primary-soft); }
.member-list-grid .member-user-main { gap: 10px; }
.member-list-grid .member-user-main img { width: 32px; height: 32px; flex-basis: 32px; border-radius: 8px; border-width: 1px; }
.member-list-grid .member-user-identity strong { font-size: 14px; font-weight: 600; }
.member-list-grid .member-user-identity small { font-size: 12px; }
.member-list-grid .member-row-status { grid-column: auto; grid-row: auto; }
.member-list-grid .member-status-link.badge { min-height: 24px; padding: 3px 8px; font-size: 12px; font-weight: 600; }
.member-list-grid .member-user-details { grid-column: auto; grid-row: auto; grid-template-columns: 1.2fr 1fr 1fr; gap: 14px; align-items: center; }
.member-list-grid .member-user-details > div { padding: 0; border: 0; }
.member-list-grid .member-user-details dt { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.member-list-grid .member-user-details dd { color: var(--text); font-size: 13px; font-weight: 500; white-space: normal; overflow-wrap: anywhere; }
.member-list-grid .member-user-details small { font-size: 12px; font-weight: 400; }
.member-list-grid .member-expiry-permanent { color: var(--muted); }
.member-list-grid .member-expiry-soon, .member-list-grid .member-playback-warning { color: var(--warning, #c58b27); }
.member-list-grid .member-user-actions { grid-column: 5; grid-row: auto; align-self: center; }
.member-row-expand { display: none; }
.member-list-grid .member-grid-pagination { flex-wrap: wrap; justify-content: space-between; gap: 12px; padding-top: 16px; margin: 0; color: var(--muted); font-size: 12px; }
.member-list-grid .member-empty > .ui-icon { width: 30px; height: 30px; color: var(--muted); }
.member-service-trigger { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; padding: 0; border: 0; background: none; color: var(--primary); font: inherit; text-align: left; cursor: pointer; }
.member-service-trigger span { min-width: 0; overflow-wrap: anywhere; }
.member-service-trigger svg { width: 13px; height: 13px; flex: 0 0 13px; opacity: .65; }
.member-service-trigger:hover { text-decoration: underline; text-underline-offset: 3px; }
.member-list-grid .member-service-cell dd { display: flex; align-items: center; overflow: visible; }
.member-list-grid .member-service-cell .member-service-trigger { min-width: 0; min-height: 28px; gap: 8px; color: var(--text); line-height: 20px; }
.member-list-grid .member-service-cell .member-service-trigger svg { width: 14px; height: 14px; flex-basis: 14px; color: var(--muted); opacity: 1; }
.member-list-grid .member-service-cell .member-service-trigger:hover { color: var(--primary); text-decoration: none; }
.member-list-grid .member-service-cell .member-service-trigger:hover svg { color: currentColor; }
.member-list-grid .member-service-cell .member-service-trigger:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; border-radius: 3px; }
.member-service-dialog { width: min(560px, calc(100vw - 24px)); border-radius: 8px; }
.member-service-dialog .dialog-head { padding: 20px 24px; }
.member-service-dialog .dialog-head h2 { font-size: 20px; }
.member-service-dialog .dialog-head p { margin-top: 5px; color: var(--muted); font-size: 13px; }
.member-service-body { padding: 0 24px 20px; }
.member-service-options { display: grid; gap: 10px; min-width: 0; margin: 0; padding: 0; border: 0; }
.member-service-option { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 14px; border: 1px solid var(--line); border-radius: 6px; cursor: pointer; }
.member-service-option:has(input:checked) { border-color: var(--primary); background: var(--primary-soft); }
.member-service-option:has(input:disabled) { opacity: .5; cursor: not-allowed; }
.member-service-option input { flex: 0 0 16px; width: 16px; height: 16px; accent-color: var(--primary); }
.member-service-option-icon { display: flex; color: var(--primary); }
.member-service-option > span:last-child { display: grid; min-width: 0; gap: 5px; }
.member-service-option strong { font-size: 14px; font-weight: 600; }
.member-service-option small { color: var(--muted); font-size: 12px; line-height: 1.6; }
.member-service-link { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-top: 16px; color: var(--muted); font-size: 12px; }
.member-service-link .button { min-height: 34px; padding: 6px 10px; font-size: 12px; }
.member-service-password { margin: 18px 0 0; }
.member-service-password small { color: var(--muted); font-size: 12px; }
.member-service-password[hidden], .member-service-error[hidden] { display: none; }
.member-service-account-state { color: var(--muted); font-size: 12px; margin-top: 14px; line-height: 1.7; }
.member-service-error { margin: 14px 0 0; color: var(--danger); font-size: 13px; line-height: 1.6; }
.member-service-dialog .dialog-actions { padding: 16px 24px; border-top: 1px solid var(--line); }
@media (max-width: 1200px) {
  .member-table-head { display: flex; min-height: 36px; border-top: 0; padding-inline: 4px; }
  .member-table-head .member-table-label, .member-table-details { display: none; }
  .member-table-head .member-row-check { flex: 0 0 auto; gap: 8px; justify-content: flex-start; padding-inline: 2px; font-size: 13px; font-weight: 500; color: var(--muted); }
  .member-table-head .member-row-check > span { display: inline; flex: 0 0 auto; white-space: nowrap; line-height: 20px; }
  .member-list-grid .member-user-card.member-compact-row { grid-template-columns: 20px minmax(0, 1fr) auto 36px; gap: 8px 10px; padding: 12px 4px; }
  .member-list-grid .member-row-check { grid-column: 1; grid-row: 1; }
  .member-list-grid .member-user-main { grid-column: 2; grid-row: 1; }
  .member-list-grid .member-row-status { grid-column: 3; grid-row: 1; }
  .member-list-grid .member-user-actions { grid-column: 4; grid-row: 1; align-self: start; }
  .member-list-grid .member-row-edit { display: none; }
  .member-list-grid .member-user-details { display: contents; }
  .member-list-grid .member-user-card .member-user-details > .member-expiry-cell { grid-column: 2 / 4; grid-row: 2; }
  .member-list-grid .member-expiry-cell dd { display: flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; }
  .member-list-grid .member-expiry-cell small { margin: 0; }
  .member-list-grid .member-service-cell, .member-list-grid .member-mode-cell { display: none; }
  .member-list-grid [data-expanded="true"] .member-service-cell, .member-list-grid [data-expanded="true"] .member-mode-cell { display: block; grid-column: 2 / -1; }
  .member-list-grid [data-expanded="true"] .member-service-cell { grid-row: 3; margin-top: 6px; }
  .member-list-grid [data-expanded="true"] .member-mode-cell { grid-row: 4; }
  .member-list-grid [data-expanded="true"] .member-service-cell dt, .member-list-grid [data-expanded="true"] .member-mode-cell dt { position: static; width: auto; height: auto; margin: 0 0 4px; clip-path: none; }
  .member-list-grid .member-row-expand { display: inline-flex; grid-column: 4; grid-row: 2; width: 36px; height: 28px; min-height: 28px; border: 0; background: none; color: var(--muted); }
  .member-row-expand[aria-expanded="true"] svg { transform: rotate(180deg); }
  .member-filter-options { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .member-filter-options > button { justify-self: start; }
}
@media (max-width: 620px) {
  .member-service-dialog .dialog-head { padding: 16px; }
  .member-service-body { padding: 0 16px 16px; }
  .member-service-option { padding: 12px; gap: 10px; }
  .member-service-option-icon { display: none; }
  .member-service-dialog .dialog-actions { padding: 12px 16px; }
  .member-console .member-account-hero { gap: 14px; padding-bottom: 16px; }
  .member-console .member-account-hero p { font-size: 12px; line-height: 1.6; }
  .member-console .member-account-hero .panel-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)) 38px; gap: 6px; }
  .member-console .member-account-hero .panel-actions .button { min-width: 0; padding-inline: 6px; font-size: 13px; }
  .member-status-tabs { gap: 18px; }
  .member-status-tabs > a { min-height: 44px; }
  .member-filter-top { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 8px; }
  .member-search-box { grid-column: 1 / -1; max-width: none; width: 100%; }
  .member-filter-total { grid-column: 3; font-size: 12px; }
  .member-filter-top > .button { justify-self: start; }
  .member-console .member-list-filter .member-filter-top > .button { width: auto; }
  .member-filter-options { grid-template-columns: 1fr; }
  .member-list-grid .member-bulk-toolbar { flex-wrap: nowrap; font-size: 12px; }
  .member-list-grid .member-bulk-toolbar .button { white-space: nowrap; }
  .member-list-grid .member-bulk-toolbar [data-member-selected-count] { min-width: 0; }
  .member-list-grid .member-user-main img { width: 28px; height: 28px; flex-basis: 28px; }
  .member-list-grid .member-user-main { gap: 7px; }
  .member-list-grid .member-user-identity strong { font-size: 13px; }
  .member-list-grid .member-row-status { max-width: 78px; }
  .member-list-grid .member-status-link.badge { font-size: 12px; padding-inline: 6px; }
  .member-list-grid .member-grid-pagination { justify-content: space-between; }
}
.artwork-target-tabs > strong { flex: 0 0 auto; color: var(--text); font-size: 15px; }
.plugin-workbench { padding: 0 0 18px; border-bottom: 1px solid var(--line); }
.plugin-workbench-head { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 18px; }
.plugin-workbench-head > div:first-child { display: grid; gap: 6px; min-width: 0; }
.plugin-workbench-head small { color: var(--muted); font-size: 12px; }
.plugin-workbench-head > div:last-child { display: flex; gap: 8px; }
.plugin-workbench-filters { display: grid; grid-template-columns: minmax(180px, 1fr) 180px 160px; gap: 12px; margin-bottom: 16px; }
.plugin-search { display: flex; align-items: center; gap: 10px; padding: 0 12px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); }
.plugin-search input { min-width: 0; width: 100%; border: 0; padding: 10px 0; color: var(--text); background: none; font: inherit; }
.plugin-workbench ~ .plugin-section { margin-top: 22px; }
.plugin-workbench ~ .plugin-section > header h2 { font-size: 16px; }
.plugin-workbench ~ .plugin-section > header { min-height: 30px; margin-bottom: 12px; }
.plugin-workbench ~ .plugin-section .plugin-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); grid-auto-rows: 1fr; gap: 12px; }
.plugin-workbench ~ .plugin-section .plugin-card { min-height: 168px; padding: 14px; border-radius: 8px; background: var(--surface); gap: 10px; box-shadow: none; }
.plugin-workbench ~ .plugin-section .plugin-card:hover { transform: none; }
.plugin-workbench ~ .plugin-section .plugin-card > header { grid-template-columns: 38px minmax(0, 1fr) auto; gap: 10px; }
.plugin-workbench ~ .plugin-section .plugin-card-icon { width: 38px; height: 38px; border-radius: 7px; box-shadow: none; background: var(--primary-soft); color: var(--primary); }
.plugin-workbench ~ .plugin-section [data-plugin-category="存储服务"] .plugin-card-icon { background: color-mix(in srgb, var(--icon-teal) 12%, var(--surface)); color: var(--icon-teal); border-color: color-mix(in srgb, var(--icon-teal) 24%, var(--line)); }
.plugin-workbench ~ .plugin-section [data-plugin-category="消息通知"] .plugin-card-icon { background: color-mix(in srgb, var(--icon-sky) 12%, var(--surface)); color: var(--icon-sky); border-color: color-mix(in srgb, var(--icon-sky) 24%, var(--line)); }
.plugin-workbench ~ .plugin-section .plugin-card h2 { overflow: visible; white-space: normal; font-size: 14px; overflow-wrap: anywhere; }
.plugin-workbench ~ .plugin-section .plugin-card h2 a { color: var(--text); text-decoration: none; }
.plugin-workbench ~ .plugin-section .plugin-card > p { min-height: 0; font-size: 12px; overflow-wrap: anywhere; }
.plugin-workbench ~ .plugin-section .plugin-card > footer { flex-direction: row; align-items: center; padding-top: 10px; }
.plugin-workbench ~ .plugin-section .plugin-card .icon-command { width: 32px; height: 32px; min-width: 32px; }
.plugin-workbench ~ .plugin-section .plugin-empty { min-height: 130px; border: 0; background: none; }
.plugin-filter-empty { padding: 30px 0; color: var(--muted); text-align: center; }
.plugin-grid[data-plugin-sort-ready] > .plugin-card { cursor: grab; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.plugin-grid > .plugin-card:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }
.plugin-card.plugin-sort-chosen { border-color: var(--primary); cursor: grabbing; }
.plugin-card.plugin-sort-ghost { opacity: .3; }
.plugin-card.plugin-sort-chosen, .plugin-card.plugin-sort-chosen * { user-select: none; }
.plugin-diagnostics { padding: 14px 0; margin-bottom: 12px; border-bottom: 1px solid var(--line); display: flex; flex-wrap: wrap; gap: 10px; }
.plugin-diagnostics > div { width: 100%; display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.plugin-diagnostics small { color: var(--muted); font-size: 12px; }
.plugin-dependency { display: inline-flex; align-items: center; gap: 8px; color: var(--text); font-size: 13px; text-decoration: none; }
.plugin-dependency.missing { color: var(--warning); }
.plugin-dependency.ready .ui-icon { color: var(--success); }
.plugin-task-heading { display: flex; align-items: center; gap: 18px; margin-bottom: 12px; }
.plugin-task-heading h2 { margin: 0; font-size: 20px; }
.plugin-lifecycle { padding: 16px 0; border-top: 1px solid var(--line); }
.plugin-lifecycle header { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.plugin-lifecycle small, .plugin-lifecycle p { color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }
.plugin-lifecycle-actions { display: flex; gap: 8px; margin: 14px 0; }
.plugin-lifecycle details { padding: 14px 0; border-top: 1px solid var(--line); }
.plugin-lifecycle details > form { display: grid; gap: 12px; padding-top: 14px; }
.plugin-lifecycle label { display: grid; gap: 8px; }
.plugin-lifecycle select { width: 100%; min-width: 0; }
.plugin-lifecycle button { justify-self: start; }
.plugin-permission-details { padding: 12px 20px; }
.plugin-settings-dialog .plugin-configuration-body > .card { border-radius: 0; border: 0; border-bottom: 1px solid var(--line); background: none; box-shadow: none; }
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .plugin-configuration-body { padding: 18px 0 0; }
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .one15-package-filter-card { border-bottom: 0; }
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .one15-package-results { min-width: 0; }
.plugin-install-preview { display: grid; min-width: 0; }
.plugin-install-preview pre { max-height: 220px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; font-size: 12px; }
.plugin-install-preview p { font-size: 12px; line-height: 1.7; color: var(--muted); }
.one15-package-form [hidden] { display: none; }
.plugin-task-heading ~ .one15-package-filter-card { background: none; border: 0; border-radius: 0; box-shadow: none; }
.plugin-task-heading ~ .one15-package-filter-card .one15-package-form { padding-inline: 0; }

.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] {
  width: min(1240px, calc(100vw - 40px));
  max-height: calc(100dvh - 64px);
}
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .plugin-configuration-head {
  min-height: 118px;
  padding: 24px 28px;
  grid-template-columns: 58px minmax(0, 1fr) auto 40px;
  gap: 16px;
}
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .plugin-configuration-head .plugin-card-icon {
  width: 58px;
  height: 58px;
  border-radius: 16px;
  font-size: 17px;
}
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .plugin-configuration-head > div { gap: 5px; }
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .plugin-configuration-head > div > span { font-size: 13px; }
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .plugin-configuration-head h2 { font-size: 24px; }
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .plugin-configuration-head p {
  max-width: 720px;
  font-size: 14px;
}
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .plugin-configuration-permissions {
  min-height: 56px;
  padding: 10px 28px;
  gap: 8px;
}
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .plugin-configuration-permissions strong { font-size: 14px; }
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .plugin-configuration-permissions span {
  padding: 6px 10px;
  border-radius: 8px;
  font-size: 13px;
}
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .plugin-configuration-body {
  padding: 22px 28px 28px;
  gap: 12px;
}
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .plugin-diagnostics {
  margin: 0;
  padding: 10px 26px 14px;
}
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .one15-package-form {
  gap: 20px;
  padding: 24px 26px 26px;
}
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .one15-package-form-row {
  grid-template-columns: minmax(220px, .78fr) minmax(0, 1fr) minmax(280px, 1.22fr);
  align-items: start;
  gap: 20px;
}
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .one15-package-form-row:has([data-package-emby-field][hidden]) {
  grid-template-columns: minmax(230px, .78fr) minmax(360px, 1.22fr);
}
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .one15-package-form-row .field {
  grid-template-rows: auto;
  gap: 9px;
}
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .one15-package-form-row .field > label,
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .one15-package-form > .field > label {
  font-size: 15px;
}
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .one15-package-form-row input,
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .one15-package-form-row select,
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .one15-package-form-row .ui-select-trigger {
  min-height: 50px;
  height: 50px;
  border-radius: 13px;
  font-size: 15px;
}
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .one15-package-form textarea {
  min-height: 144px;
  padding: 15px 16px;
  border-radius: 14px;
  font-size: 15px;
}
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .one15-package-form .help {
  font-size: 13px;
  line-height: 1.65;
}
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .one15-package-submit-row {
  align-items: flex-end;
  gap: 22px;
  padding-top: 4px;
}
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .one15-package-submit-row > span {
  max-width: 620px;
  font-size: 14px;
}
.plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .one15-package-submit-row .button {
  min-height: 48px;
  padding-inline: 19px;
  border-radius: 12px;
  font-size: 14px;
}

@media (max-width: 720px) {
  .plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] {
    width: calc(100vw - 18px);
    max-height: calc(100dvh - 18px);
  }
  .plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .plugin-configuration-head {
    min-height: 0;
    padding: 18px 15px;
    grid-template-columns: 44px minmax(0, 1fr) 34px;
    gap: 10px;
  }
  .plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .plugin-configuration-head .plugin-card-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
  }
  .plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .plugin-configuration-head h2 { font-size: 19px; }
  .plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .plugin-configuration-head p { font-size: 12px; }
  .plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .plugin-configuration-permissions { padding: 9px 15px; }
  .plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .plugin-configuration-body { padding: 15px 0 18px; }
  .plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .one15-package-form {
    gap: 16px;
    padding: 18px 15px 20px;
  }
  .plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .one15-package-form-row,
  .plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .one15-package-form-row:has([data-package-emby-field][hidden]) {
    grid-template-columns: 1fr;
    gap: 15px;
  }
  .plugin-settings-dialog[data-plugin-settings-dialog="builtin.one15-package-filter"] .one15-package-submit-row > span { max-width: none; }
}
@media (max-width: 680px) {
  .plugin-workbench-head { align-items: stretch; flex-direction: column; gap: 12px; }
  .plugin-workbench-head > div:last-child > button { flex: 1; padding-inline: 10px; font-size: 13px; }
  .plugin-workbench-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .plugin-search { grid-column: 1 / -1; }
  .plugin-workbench ~ .plugin-section .plugin-grid { grid-template-columns: 1fr; grid-auto-rows: auto; gap: 10px; }
  .plugin-workbench ~ .plugin-section .plugin-card { min-height: 0; padding: 14px; gap: 10px; }
  .plugin-workbench ~ .plugin-section .plugin-card > header > div > span { display: none; }
  .plugin-workbench ~ .plugin-section .plugin-card > p { font-size: 12px; }
  .plugin-workbench ~ .plugin-section .plugin-card .plugin-runtime { min-width: 0; }
  .plugin-workbench ~ .plugin-section .plugin-runtime small { max-width: 210px; }
  .plugin-task-heading { flex-wrap: wrap; gap: 8px; }
}
.artwork-target-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; width: min(480px, 100%); padding: 4px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.artwork-target-options a { display: flex; align-items: center; justify-content: center; gap: 9px; min-height: 48px; padding: 8px 14px; border: 1px solid transparent; border-radius: 5px; color: var(--muted); font-size: 16px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.artwork-target-options a:hover, .artwork-target-options a:focus-visible { color: var(--text); background: var(--surface-soft); }
.artwork-target-options a:focus-visible { outline: 2px solid var(--success); outline-offset: 2px; }
.artwork-target-options a[aria-current="page"] { border-color: color-mix(in srgb, var(--success) 55%, var(--line)); background: color-mix(in srgb, var(--success) 18%, var(--surface)); color: var(--text); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--success) 18%, transparent); }
.artwork-target-options .ui-icon { width: 20px; height: 20px; color: var(--success); }
@media (max-width: 620px) { .artwork-target-tabs { align-items: stretch; flex-direction: column; gap: 10px; } .artwork-target-options { width: 100%; } .artwork-target-options a { min-height: 46px; padding-inline: 8px; font-size: 14px; } }

.workbench-dashboard { gap: 28px; min-width: 0; --dashboard-cyan: #3bbdc7; }
:root[data-theme="porcelain"] .workbench-dashboard { --dashboard-cyan: #087e89; }
.workbench-dashboard [hidden] { display: none !important; }
.workbench-dashboard > section { min-width: 0; }
.workbench-dashboard .profile-command-center { padding: 20px; gap: 20px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); backdrop-filter: none; }
.workbench-dashboard .profile-identity { align-items: center; gap: 14px; }
.workbench-dashboard .profile-identity img { width: 48px; height: 48px; border-color: var(--line); background: var(--surface); }
.workbench-dashboard .profile-identity .profile-greeting { color: var(--muted); font-size: 12px; font-weight: 500; letter-spacing: 0; }
.workbench-dashboard .profile-identity h2 { margin: 3px 0 6px; color: var(--text); font-size: 20px; line-height: 1.35; letter-spacing: 0; white-space: normal; overflow-wrap: anywhere; }
.workbench-dashboard .profile-login-meta { display: flex; flex-wrap: wrap; gap: 3px 14px; line-height: 1.6; }
.workbench-dashboard .profile-login-meta > span { color: var(--muted); font-size: 12px; font-weight: 400; letter-spacing: 0; overflow-wrap: anywhere; }
.workbench-dashboard .profile-command-actions { display: flex; align-items: center; gap: 16px; }
.workbench-dashboard .profile-command-tools { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.workbench-dashboard .profile-command-tools > :is(.button, .icon-command) { height: 40px; min-height: 40px; border: 1px solid var(--line); border-radius: 8px; color: var(--text); background: var(--surface); box-shadow: none; }
.workbench-dashboard .profile-command-tools > .icon-command { width: 40px; min-width: 40px; }
.workbench-dashboard .profile-command-tools > :is(.button, .icon-command):hover { border-color: var(--primary); background: var(--primary-soft); }
.workbench-dashboard .profile-overall-state { min-height: 32px; max-width: 100%; padding: 0; border: 0; background: transparent; color: var(--muted); font-size: 12px; font-weight: 500; white-space: normal; line-height: 1.5; justify-content: flex-start; }
.workbench-dashboard .profile-overall-state i { flex: 0 0 6px; width: 6px; height: 6px; }
.workbench-dashboard .profile-overall-state.healthy i { background: var(--success); }
.workbench-dashboard .profile-overall-state.attention { color: var(--warning); }
.dashboard-section-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px 16px; margin-bottom: 14px; }
.dashboard-section-head h2 { display: flex; align-items: center; gap: 9px; margin: 0; font-size: 16px; font-weight: 650; }
.dashboard-section-head h2 > .ui-icon { width: 18px; height: 18px; color: var(--muted); }
.dashboard-section-head > div:first-child { display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px 14px; min-width: 0; }
.dashboard-section-head > span, .dashboard-section-head > div > span { color: var(--muted); font-size: 12px; }
.dashboard-library .workbench-source-tabs { gap: 16px; padding: 0; border: 0; }
.dashboard-library .workbench-source-tabs a { padding: 6px 0; font-size: 12px; text-decoration: none; white-space: nowrap; }
.dashboard-library-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.dashboard-library-grid > article { min-width: 0; min-height: 104px; padding: 16px; display: grid; align-content: space-between; gap: 14px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.dashboard-library-grid article > span { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 12px; }
.dashboard-library-grid .ui-icon { width: 16px; height: 16px; }
.dashboard-library-grid strong { display: block; overflow: hidden; font-size: 28px; line-height: 1.15; font-weight: 650; font-variant-numeric: tabular-nums; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-library-grid strong small { color: var(--muted); font-size: 13px; font-weight: 400; }
.dashboard-library-grid [data-tone="violet"] .ui-icon { color: var(--icon-violet); }
.dashboard-library-grid [data-tone="cyan"] .ui-icon { color: var(--icon-cyan); }
.dashboard-library-grid [data-tone="green"] .ui-icon { color: var(--success); }
.dashboard-library-grid [data-tone="amber"] .ui-icon { color: var(--warning); }
.dashboard-library-caption { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; margin-top: 12px; color: var(--muted); font-size: 12px; }
.dashboard-library-caption a { display: inline-flex; align-items: center; gap: 5px; color: var(--primary); text-decoration: none; }
.dashboard-library-caption .ui-icon { width: 14px; height: 14px; }
.dashboard-resource-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.dashboard-metric { display: flex; flex-direction: column; min-width: 0; min-height: 208px; padding: 16px 16px 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); overflow: hidden; }
.dashboard-metric > header { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 16px; }
.dashboard-metric > header > span { display: flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 600; white-space: nowrap; }
.dashboard-metric > header .ui-icon { width: 16px; height: 16px; color: var(--muted); }
.dashboard-metric > header small { font-size: 12px; color: var(--muted); white-space: nowrap; }
.dashboard-value { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 9px; min-height: 44px; }
.dashboard-value strong { font-size: 28px; font-weight: 650; line-height: 1.1; font-variant-numeric: tabular-nums; white-space: nowrap; }
.dashboard-value > span { color: var(--muted); font-size: 12px; }
.dashboard-network-values { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; min-height: 44px; }
.dashboard-network-values > span { min-width: 0; display: grid; gap: 5px; }
.dashboard-network-values small { color: #3bbdc7; font-size: 12px; }
.dashboard-network-values > span + span small { color: #a78bfa; }
.dashboard-network-values strong { font-size: 16px; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.dashboard-chart { position: relative; height: 64px; min-height: 64px; width: 100%; margin: 10px 0 12px; }
.dashboard-chart canvas { display: block; max-width: 100%; }
.dashboard-metric footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 7px 10px; min-height: 30px; margin-top: auto; padding-top: 10px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.dashboard-metric footer b { font-weight: 500; color: var(--text); }
.dashboard-interface { min-width: 0; max-width: 150px; flex: 1 1 90px; }
.dashboard-interface .ui-select-trigger { min-height: 28px; height: 28px; padding: 3px 7px; grid-template-columns: minmax(0, 1fr) 14px; font-size: 12px; }
.dashboard-interface .ui-select-trigger-icon { display: none; }
.dashboard-interface select { height: 28px; min-height: 28px; padding: 2px 6px; font-size: 12px; }
.dashboard-refresh { display: flex; align-items: center; gap: 10px; font-variant-numeric: tabular-nums; }
.dashboard-refresh .icon-command, .dashboard-recent-controls .icon-command { width: 30px; min-width: 30px; height: 30px; min-height: 30px; padding: 0; border-radius: 5px; }
.dashboard-runtime-status { margin: 10px 0 0; font-size: 12px; line-height: 1.6; color: var(--muted); }
.dashboard-recent-controls { display: flex; align-items: center; gap: 6px; }
.dashboard-poster-strip { display: flex; align-items: stretch; gap: 14px; min-width: 0; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; padding-bottom: 8px; scroll-snap-type: x proximity; touch-action: pan-x pan-y; user-select: none; }
.dashboard-poster { flex: 0 0 150px; display: grid; align-content: start; gap: 5px; min-width: 0; color: var(--text); text-decoration: none; scroll-snap-align: start; }
.dashboard-poster-art { position: relative; aspect-ratio: 2 / 3; overflow: hidden; border-radius: 8px; background: var(--surface-soft); margin-bottom: 5px; }
.dashboard-poster-art img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.dashboard-poster-fallback { position: absolute; inset: 0; display: grid; place-items: center; color: var(--muted); font-size: 14px; border: 1px solid var(--line); border-radius: inherit; }
.dashboard-poster > strong { overflow: hidden; font-size: 13px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-poster > small, .dashboard-poster > time { color: var(--muted); font-size: 12px; }
.dashboard-poster:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.dashboard-poster:hover > strong { color: var(--primary); }
.dashboard-recent-empty { min-height: 110px; display: flex; align-items: center; justify-content: center; gap: 12px; color: var(--muted); font-size: 13px; background: var(--surface-soft); border-radius: 6px; }
.dashboard-recent-empty > .ui-icon { width: 24px; height: 24px; }
.dashboard-recent > .button { margin-top: 10px; }
.dashboard-volume-head, .dashboard-volume-row { display: grid; grid-template-columns: minmax(140px, 1.2fr) minmax(180px, 1.2fr) minmax(90px, .8fr) minmax(160px, 1fr); align-items: center; gap: 18px; }
.dashboard-volume-head { padding: 0 0 10px; font-size: 12px; color: var(--muted); border-bottom: 1px solid var(--line); }
.dashboard-volume-row { padding: 17px 0; border-bottom: 1px solid var(--line); font-size: 13px; }
.dashboard-volume-row > div { min-width: 0; }
.dashboard-volume-name { display: grid; gap: 5px; }
.dashboard-volume-name strong, .dashboard-volume-name small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-volume-name strong { font-weight: 600; }
.dashboard-volume-name small { color: var(--muted); font-size: 12px; }
.dashboard-volume-amount strong, .dashboard-volume-free strong { font-weight: 500; font-size: 12px; font-variant-numeric: tabular-nums; }
.dashboard-volume-capacity { display: flex; align-items: center; gap: 12px; }
.dashboard-volume-capacity progress { display: block; flex: 1; min-width: 0; width: 100%; height: 6px; border: 0; border-radius: 4px; overflow: hidden; appearance: none; background: var(--surface-soft); }
.dashboard-volume-capacity progress::-webkit-progress-bar { background: var(--surface-soft); }
.dashboard-volume-capacity progress::-webkit-progress-value { background: #3bbdc7; border-radius: 4px; }
.dashboard-volume-capacity progress::-moz-progress-bar { background: #3bbdc7; }
.dashboard-volume-capacity > span { min-width: 46px; text-align: right; font-size: 12px; font-variant-numeric: tabular-nums; }
.is-nearly-full .dashboard-volume-capacity > span { color: var(--warning); }
.is-nearly-full progress::-webkit-progress-value { background: var(--warning); }
.is-nearly-full progress::-moz-progress-bar { background: var(--warning); }
.dashboard-volume-footer { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; margin-top: 12px; color: var(--muted); font-size: 12px; }
.dashboard-mobile-label { display: none; }
.dashboard-layout-dialog { width: min(660px, calc(100vw - 24px)); border-radius: 8px; }
.dashboard-layout-dialog > form { display: flex; flex-direction: column; min-height: 0; }
.dashboard-layout-body { min-height: 0; padding: 20px; overflow-y: auto; overscroll-behavior: contain; }
.dashboard-layout-options { display: flex; flex-direction: column; gap: 8px; }
.dashboard-module-choice { min-width: 0; min-height: 68px; display: grid; grid-template-columns: 28px minmax(0, 1fr) 58px; align-items: center; gap: 8px; padding: 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.dashboard-module-choice > label { display: grid; grid-template-columns: 34px minmax(0, 1fr) 18px; align-items: center; gap: 10px; min-width: 0; cursor: pointer; }
.dashboard-order-buttons { display: flex; gap: 2px; }
.dashboard-module-choice .icon-command { width: 28px; min-width: 28px; height: 28px; min-height: 28px; padding: 0; background: none; border-color: transparent; }
.dashboard-option-grip { touch-action: none; cursor: grab; color: var(--muted); }
.dashboard-module-choice:hover { background: var(--surface-soft); }
.dashboard-module-choice:has(input:checked) { border-color: color-mix(in srgb, var(--primary) 60%, var(--line)); background: color-mix(in srgb, var(--primary) 6%, var(--surface)); }
.dashboard-module-choice:has(input:focus-visible) { outline: 2px solid var(--primary); outline-offset: 2px; }
.dashboard-choice-icon { width: 34px; height: 34px; display: grid; place-items: center; background: var(--surface-soft); border-radius: 6px; }
.dashboard-choice-icon .ui-icon { width: 19px; height: 19px; }
.dashboard-choice-copy { min-width: 0; display: grid; gap: 5px; }
.dashboard-choice-copy strong { color: var(--text); font-size: 14px; font-weight: 600; }
.dashboard-choice-copy small { color: var(--muted); font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
.dashboard-module-choice input[type="checkbox"] { width: 18px; height: 18px; min-width: 18px; min-height: 18px; padding: 0; margin: 0; accent-color: var(--primary); }
.dashboard-layout-count { margin: 16px 0 0; color: var(--muted); font-size: 12px; font-variant-numeric: tabular-nums; }
.dashboard-layout-dialog [data-layout-error] { color: var(--danger); }
.dashboard-layout-dialog .dialog-actions { flex: 0 0 auto; justify-content: space-between; border-top: 1px solid var(--line); padding: 16px 20px; }
.dashboard-layout-dialog .dialog-actions .button { min-height: 40px; }
.dashboard-optional-module { display: flex; flex-direction: column; min-width: 0; }
.dashboard-optional-module .dashboard-section-head { flex-wrap: nowrap; gap: 10px; }
.dashboard-optional-module .dashboard-section-head h2 { flex-shrink: 0; }
.dashboard-optional-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; min-width: 0; }
.dashboard-optional-actions > span { color: var(--muted); font-size: 12px; line-height: 1.5; text-align: right; overflow-wrap: anywhere; }
.dashboard-optional-actions .icon-command, .dashboard-module-footer .icon-command { width: 28px; min-width: 28px; height: 28px; min-height: 28px; padding: 0; border-radius: 5px; }
.dashboard-optional-module [data-optional-content] { flex: 1; }
.dashboard-summary-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; padding: 4px 0 18px; border-bottom: 1px solid var(--line); }
.dashboard-summary-metric { min-width: 0; display: grid; align-content: start; gap: 8px; color: var(--text); text-decoration: none; }
.dashboard-summary-metric > span { color: var(--muted); font-size: 12px; line-height: 1.5; }
.dashboard-summary-metric > strong { min-width: 0; display: block; font-size: 23px; line-height: 1.2; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.dashboard-summary-metric:is(a):hover > span, .dashboard-module-row:is(a):hover strong { color: var(--primary); }
.dashboard-module-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; min-height: 64px; padding: 12px 0; color: var(--text); border-bottom: 1px solid var(--line); text-decoration: none; }
.dashboard-module-row-copy { min-width: 0; display: grid; gap: 5px; }
.dashboard-module-row-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; font-weight: 500; }
.dashboard-module-row-copy small { color: var(--muted); font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
.dashboard-module-state { flex-shrink: 0; max-width: 45%; font-size: 12px; line-height: 1.5; text-align: right; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.dashboard-module-footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 12px; min-height: 40px; color: var(--muted); font-size: 12px; line-height: 1.5; }
.dashboard-module-footer > span { min-width: 0; overflow-wrap: anywhere; }
.dashboard-optional-module.is-stale .dashboard-module-footer { color: var(--warning); }
.dashboard-module-empty { display: grid; place-items: center; margin: 0; min-height: 130px; padding: 20px 0; color: var(--muted); font-size: 13px; }
.dashboard-module-choice[data-tone="cyan"] .dashboard-choice-icon, .dashboard-summary-metric[data-tone="cyan"] strong, .dashboard-module-state[data-tone="cyan"] { color: var(--dashboard-cyan); }
.dashboard-module-choice[data-tone="green"] .dashboard-choice-icon, .dashboard-summary-metric[data-tone="green"] strong, .dashboard-module-state[data-tone="green"] { color: var(--success); }
.dashboard-module-choice[data-tone="amber"] .dashboard-choice-icon, .dashboard-summary-metric[data-tone="amber"] strong, .dashboard-module-state[data-tone="amber"] { color: var(--warning); }
.dashboard-module-choice[data-tone="violet"] .dashboard-choice-icon { color: var(--primary); }
.dashboard-summary-metric[data-tone="danger"] strong, .dashboard-module-state[data-tone="danger"] { color: var(--danger); }
@container (max-width: 380px) {
  .dashboard-summary-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
}
@media (max-width: 520px) {
  .dashboard-layout-body { padding: 12px; }
  .dashboard-module-choice { min-height: 66px; grid-template-columns: 24px minmax(0, 1fr) 58px; gap: 4px; padding: 8px 4px; }
  .dashboard-module-choice > label { grid-template-columns: minmax(0, 1fr) 18px; gap: 6px; }
  .dashboard-choice-icon { display: none; }
  .dashboard-layout-dialog .dialog-actions { padding: 12px 16px; }
}
.dashboard-playback-slot:not(:has([data-profile-playback-panel]:not([hidden]))) { display: none; }
.dashboard-playback { min-width: 0; }
.workbench-playback-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 360px), 1fr)); gap: 12px; align-items: stretch; }
.workbench-playback-grid > .workbench-playback-card { width: 100%; max-width: 460px; justify-self: start; }
.workbench-playback-card { padding: 12px; grid-template-columns: 62px minmax(0, 1fr) 30px; align-content: start; }
.workbench-playback-card .member-cloud-playback-poster { width: 62px; min-height: 93px; aspect-ratio: 2 / 3; align-self: start; }
.workbench-playback-card .member-cloud-playback-body > header { flex-wrap: wrap; gap: 5px; }
.workbench-playback-card .member-cloud-playback-body > header > div { flex: 1 1 90px; }
.workbench-playback-card .member-cloud-playback-meta > span { min-width: 0; align-items: center; }
.workbench-playback-card .member-cloud-playback-meta > span:nth-child(-n + 2) { grid-column: 1 / -1; }
.workbench-playback-card .member-cloud-playback-meta > span > span { min-width: 0; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.workbench-playback-card .member-cloud-playback-meta .ui-icon { margin-top: 0; }
.workbench-playback-card .member-cloud-playback-progress { flex-wrap: wrap; }
.workbench-playback-card .member-cloud-playback-progress > div { flex-basis: 40px; }
.workbench-playback-actions { display: flex; flex-direction: column; gap: 8px; align-self: start; }
.workbench-playback-actions .icon-command { width: 30px; min-width: 30px; height: 30px; min-height: 30px; padding: 0; border-radius: 6px; }
.workbench-playback-actions .ui-icon { width: 15px; height: 15px; }
.workbench-playback-actions .workbench-playback-stop { color: var(--danger); border-color: color-mix(in srgb, var(--danger) 30%, var(--line)); background: color-mix(in srgb, var(--danger) 8%, var(--surface)); }
.workbench-playback-card.is-stale { border-color: color-mix(in srgb, var(--warning) 50%, var(--line)); }
@media (max-width: 1280px) {
  .dashboard-library-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .dashboard-resource-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .dashboard-volume-head, .dashboard-volume-row { grid-template-columns: minmax(100px, 1fr) minmax(155px, 1fr) minmax(90px, .8fr) minmax(120px, 1fr); gap: 12px; }
}
@media (max-width: 620px) {
  .workbench-dashboard { gap: 22px; }
  .workbench-dashboard .profile-command-center { gap: 16px; padding: 16px; }
  .workbench-dashboard .profile-command-actions { justify-content: space-between; flex-wrap: nowrap; width: 100%; gap: 12px; }
  .workbench-dashboard .profile-command-actions .profile-overall-state { flex: 1; min-width: 0; width: auto; margin: 0; padding: 0; font-size: 12px; justify-content: flex-start; }
  .workbench-dashboard .profile-login-meta { flex-direction: column; gap: 1px; }
  .workbench-dashboard .profile-command-tools .profile-diagnostics-button { width: 40px; min-width: 40px; padding: 0; }
  .workbench-dashboard .profile-diagnostics-button > span { display: none; }
  .dashboard-library-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .dashboard-library-grid > article { min-height: 92px; padding: 14px; }
  .dashboard-library-grid strong { font-size: 26px; }
  .dashboard-resource-grid { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .dashboard-metric { min-height: 192px; padding: 14px; }
  .dashboard-value { min-height: 36px; }
  .dashboard-chart { height: 60px; min-height: 60px; margin: 8px 0 10px; }
  .dashboard-network-values strong { font-size: 20px; }
  .dashboard-poster-strip { gap: 12px; }
  .dashboard-poster { flex-basis: 128px; }
  .dashboard-volume-head { display: none; }
  .dashboard-volume-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding-block: 16px; }
  .dashboard-volume-name, .dashboard-volume-capacity { grid-column: 1 / -1; }
  .dashboard-volume-amount, .dashboard-volume-free { display: grid; gap: 5px; }
  .dashboard-mobile-label { display: block; color: var(--muted); font-size: 12px; }
  .dashboard-volume-amount strong { overflow-wrap: anywhere; line-height: 1.5; }
  .dashboard-section-head h2 { font-size: 15px; }
  .dashboard-volume-footer { flex-direction: column; }
  .workbench-playback-card { grid-template-columns: 54px minmax(0, 1fr) 30px; padding: 10px; gap: 8px; }
  .workbench-playback-card .member-cloud-playback-poster { width: 54px; min-height: 81px; }
  .workbench-playback-card .member-cloud-playback-meta { grid-template-columns: 1fr; }
}

.dashboard-grid { display: flex; flex-wrap: wrap; gap: 16px; min-width: 0; align-items: stretch; }
.dashboard-widget { container-type: inline-size; min-width: 0; flex: 1 1 calc(50% - 8px); display: flex; flex-direction: column; padding: 18px; background: var(--surface); border: 1px solid var(--line); border-radius: 8px; }
.dashboard-widget[data-widget-size="full"] { flex-basis: 100%; }
.dashboard-widget[data-widget-size="small"] { flex-basis: calc(25% - 12px); }
.dashboard-widget-actions { display: flex; align-items: center; flex-wrap: wrap; justify-content: flex-end; gap: 8px; min-width: 0; }
.dashboard-widget-actions > span { color: var(--muted); font-size: 12px; }
.dashboard-drag-handle { width: 26px; min-width: 26px; height: 28px; min-height: 28px; padding: 0; border-color: transparent; background: none; color: var(--muted); cursor: grab; touch-action: none; }
.dashboard-drag-handle:hover, .dashboard-drag-handle:focus-visible { color: var(--text); background: var(--surface-soft); }
.dashboard-sort-ghost { opacity: .35; }
.dashboard-sort-chosen { outline: 1px solid var(--primary); outline-offset: 1px; }
.dashboard-widget .dashboard-library-grid { gap: 0; }
.dashboard-widget .dashboard-library-grid > article { min-height: 86px; padding: 12px 16px; border: 0; border-radius: 0; background: none; box-shadow: none; }
.dashboard-widget .dashboard-library-grid > article + article { border-left: 1px solid var(--line); }
.dashboard-widget .dashboard-library-grid > article:first-child { padding-left: 0; }
.dashboard-widget .dashboard-library-caption { padding-top: 12px; border-top: 1px solid var(--line); }
.dashboard-widget .workbench-playback-card { border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); box-shadow: none; }
.dashboard-widget .dashboard-metric { border: 0; }
.dashboard-widget .dashboard-section-head { min-height: 28px; }
.dashboard-widget .dashboard-recent-empty { background: none; }
.dashboard-save-status { margin: 0; font-size: 13px; color: var(--muted); }
.dashboard-layout-empty { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 16px; padding: 60px 16px; color: var(--muted); }
.dashboard-layout-empty > .ui-icon { width: 32px; height: 32px; }
.dashboard-layout-empty strong { font-size: 15px; font-weight: 500; }
.member-modular-page { overflow: visible; display: grid; gap: 16px; min-width: 0; }
.member-modular-page [hidden] { display: none !important; }
.member-layout-toolbar { display: flex; align-items: center; gap: 16px; min-width: 0; border-bottom: 1px solid var(--line); }
.member-layout-toolbar .member-admin-tools { flex: 1; min-width: 0; margin: 0; border: 0; }
.member-layout-toolbar > .icon-command { flex: 0 0 36px; width: 36px; height: 36px; min-width: 36px; }
.member-layout-grid { display: flex; flex-wrap: wrap; gap: 16px; align-items: stretch; min-width: 0; }
.member-layout-widget.member-panel { position: relative; flex: 1 1 100%; min-width: 0; min-height: 0; padding: 20px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.member-layout-widget[data-member-size="small"] { flex-basis: calc(25% - 12px); }
.member-layout-widget[data-member-size="medium"] { flex-basis: calc(50% - 8px); }
.member-layout-grip { position: absolute; top: 17px; right: 14px; }
.member-module-body { min-width: 0; }
.member-module-body > h2, .member-module-body > .panel-head, .member-module-body > .member-account-hero, .member-module-body > .member-sync-restore,
.member-module-body > .member-audit-page > .member-audit-heading,
.member-module-body > .composer-card > .composer-head, .member-module-body > .settings-card > .settings-card-head { padding-right: 32px; }
.member-module-body h2 { font-size: 18px; line-height: 1.5; margin-top: 0; }
.member-module-body > h2 { margin-bottom: 12px; }
.member-module-body .panel-head { flex-wrap: wrap; gap: 12px; margin-bottom: 18px; }
.member-module-body .panel-head h2 { margin-bottom: 0; }
.member-module-body .stat-label { display: flex; align-items: center; gap: 7px; padding-right: 25px; font-size: 13px; line-height: 1.5; }
.member-module-body .stat-label > .ui-icon { width: 16px; height: 16px; color: var(--primary); flex-shrink: 0; }
.member-module-body .stat-value { display: block; margin-top: 12px; font-size: 28px; line-height: 1.3; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.member-module-body .stat-value.small-value { font-size: 15px; min-height: 36px; display: flex; align-items: center; }
.member-module-body .stat-hint { margin-top: 7px; font-size: 12px; }
.member-stat-link { color: var(--text); text-decoration: none; width: fit-content; }
.member-stat-link:hover { color: var(--primary); }
.member-module-body > .composer-card, .member-module-body > .settings-card { padding: 0; border: 0; background: none; border-radius: 0; box-shadow: none; }
.member-module-body .composer-head > .ui-icon, .member-module-body .settings-card-head > .ui-icon { flex: 0 0 20px; color: var(--primary); }
.member-module-body .settings-card-head { flex-wrap: wrap; gap: 12px; }
.member-module-body .settings-card-head > div { min-width: 0; }
.member-module-body .settings-card-head .badge { margin-left: auto; }
.member-module-body .broadcast-card, .member-module-body .message-card { border: 0; border-radius: 0; border-bottom: 1px solid var(--line); box-shadow: none; background: none; padding-inline: 0; }
.member-module-body .broadcast-list, .member-module-body .message-list { gap: 0; }
.member-module-body .member-registration-path { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; margin: 0; padding: 0; border: 0; border-radius: 0; background: none; }
.member-module-body .member-registration-path > div { display: flex; gap: 8px; min-width: 0; }
.member-module-body .member-registration-path input { flex: 1; min-width: 0; }
.member-module-body .member-registration-path small { grid-column: 1; }
.member-modular-page .code-create { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: end; padding: 0; border: 0; border-radius: 0; background: none; }
.member-modular-page .code-create label { min-width: 0; }
.member-module-body .code-summary { border-bottom: 1px solid var(--line); gap: 0; padding-bottom: 12px; }
.member-module-body .code-summary > a { border: 0; border-radius: 0; background: none; box-shadow: none; padding: 10px 16px; }
.member-module-body .code-summary > a + a { border-left: 1px solid var(--line); }
.member-module-body .code-summary > a.active { background: var(--primary-soft); }
.member-module-body .code-table:has(.designed-empty) { min-width: 0; width: 100%; table-layout: fixed; }
.member-module-body .code-table:has(.designed-empty) thead { display: none; }
.member-module-body .code-table:has(.designed-empty) td { padding: 16px 0; }
.member-module-body .code-table .designed-empty { min-width: 0; padding-inline: 12px; }
.member-module-body .member-sync-restore { margin: 0 0 20px; border: 0; border-radius: 0; border-bottom: 1px solid var(--line); background: none; padding-left: 0; }
@media (max-width: 1280px) {
  .member-layout-widget[data-member-size="small"] { flex-basis: calc(50% - 8px); }
}
@media (max-width: 1100px) {
  .member-layout-widget[data-member-size="medium"] { flex-basis: 100%; }
}
@media (max-width: 620px) {
  .member-modular-page, .member-layout-grid { gap: 12px; }
  .member-layout-toolbar { gap: 8px; }
  .member-layout-widget.member-panel { padding: 14px; }
  .member-layout-widget[data-member-size="small"] { flex-basis: calc(50% - 6px); }
  .member-layout-grip { top: 10px; right: 8px; }
  .member-module-body .stat-label { font-size: 12px; }
  .member-module-body .stat-label > .ui-icon { display: none; }
  .member-module-body .stat-value.small-value { font-size: 13px; }
  .member-module-body h2 { font-size: 16px; }
  .member-module-body > .member-account-hero, .member-module-body > .member-sync-restore, .member-module-body .panel-head { padding-right: 0; }
  .member-module-body > .member-account-hero h2, .member-module-body .panel-head h2 { padding-right: 30px; }
  .member-module-body .member-registration-path > div { flex-wrap: wrap; }
  .member-module-body .member-registration-path input { flex-basis: 100%; }
  .member-modular-page .code-create { grid-template-columns: minmax(0, 1fr); }
  .member-module-body .code-summary > a { padding-inline: 8px; }
  .member-module-body .code-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .member-module-body .code-summary > a { display: grid; gap: 6px; }
  .member-module-body .code-summary > a > span { font-size: 12px; }
}
.dashboard-storage .dashboard-volume-footer { margin-top: auto; padding-top: 12px; }
@container (max-width: 760px) {
  .dashboard-volume-head { display: none; }
  .dashboard-volume-row { grid-template-columns: minmax(54px, .55fr) minmax(0, 1.4fr) minmax(0, 1fr); gap: 8px 12px; padding: 12px 0; }
  .dashboard-volume-name { grid-column: 1; grid-row: 1 / 3; align-self: center; }
  .dashboard-volume-amount { grid-column: 2; grid-row: 1; }
  .dashboard-volume-free { grid-column: 3; grid-row: 1; }
  .dashboard-volume-amount, .dashboard-volume-free { display: grid; gap: 4px; }
  .dashboard-volume-capacity { grid-column: 2 / -1; grid-row: 2; }
  .dashboard-mobile-label { display: block; color: var(--muted); font-size: 12px; }
  .dashboard-volume-amount strong { white-space: normal; overflow-wrap: anywhere; line-height: 1.5; }
}
@container (max-width: 430px) {
  .dashboard-volume-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .dashboard-volume-name { grid-column: 1 / -1; grid-row: 1; display: flex; align-items: baseline; gap: 8px; }
  .dashboard-volume-amount { grid-column: 1; grid-row: 2; }
  .dashboard-volume-free { grid-column: 2; grid-row: 2; }
  .dashboard-volume-capacity { grid-column: 1 / -1; grid-row: 3; }
}
@media (max-width: 1280px) {
  .dashboard-widget[data-widget-size="small"] { flex-basis: calc(50% - 8px); }
  .dashboard-widget .dashboard-library-grid > article:nth-child(4) { border-left: 0; padding-left: 0; }
}
@media (max-width: 800px) {
  .dashboard-grid { gap: 12px; }
  .dashboard-widget, .dashboard-widget[data-widget-size="small"] { flex-basis: 100%; }
}
@media (max-width: 620px) {
  .dashboard-widget { padding: 14px; }
  .dashboard-widget .dashboard-library-grid > article { padding: 10px; min-height: 82px; }
  .dashboard-widget .dashboard-library-grid > article:nth-child(2n + 1) { border-left: 0; padding-left: 0; }
  .dashboard-widget .dashboard-library-grid > article:nth-child(4) { border-left: 1px solid var(--line); padding-left: 10px; }
  .dashboard-widget .dashboard-section-head { gap: 8px; }
  .dashboard-widget .workbench-source-tabs { gap: 10px; }
}

.archive-board-section { min-width: 0; padding: 22px 0; border-bottom: 1px solid var(--line); }
.archive-board-section > header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; margin-bottom: 16px; }
.archive-board-section h2 { margin: 0; font-size: 16px; }
.archive-board-section > header a { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--muted); }
.archive-board-section .archive-runtime-overview { margin: 0; gap: 0; }
.archive-board-section .archive-runtime-overview > div { border: 0; border-right: 1px solid var(--line); border-radius: 0; box-shadow: none; background: transparent; padding: 10px 20px; min-height: 84px; }
.archive-board-section .archive-runtime-overview > div:first-child { padding-left: 0; }
.archive-board-section .archive-runtime-overview > div:last-child { border: 0; }
.archive-board-section .archive-runtime-overview strong { font-size: 30px; margin-top: 8px; }
.archive-board-columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: 26px; }
.archive-board-row { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 12px 0; border-top: 1px solid var(--line); }
.archive-board-row > div, .archive-board-recent > div { min-width: 0; }
.archive-board-row strong, .archive-board-row small { display: block; overflow-wrap: anywhere; }
.archive-board-row strong { font-size: 14px; }
.archive-board-row small, .archive-board-recent small { margin-top: 5px; font-size: 12px; color: var(--muted); }
.archive-board-icon { color: var(--primary); }
.archive-board-empty { padding: 16px 0; color: var(--muted); font-size: 14px; }
.archive-backlog, .archive-retry-delay { padding: 12px 0; color: #b38320; font-size: 13px; line-height: 1.6; }
.archive-board-recent { display: grid; grid-template-columns: 54px minmax(0, 1fr); gap: 16px; padding: 14px 0; border-top: 1px solid var(--line); }
.archive-board-recent > img, .archive-board-poster { width: 54px; aspect-ratio: 2 / 3; object-fit: cover; border-radius: 6px; background: var(--surface-soft); display: grid; place-items: center; }
.archive-board-recent header { display: flex; align-items: center; gap: 10px; justify-content: space-between; }
.archive-board-recent header > strong { font-size: 14px; overflow-wrap: anywhere; }
.archive-board-recent .archive-delivery-stages { margin-bottom: 0; }
.archive-board-dialog { width: min(560px, calc(100vw - 28px)); }
.archive-board-dialog fieldset { border: 0; padding: 18px 22px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.archive-board-dialog legend { padding-top: 12px; font-size: 14px; font-weight: 700; }
.archive-board-dialog .form-grid { padding: 0 22px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.archive-searchbar { display: grid; grid-template-columns: minmax(140px, 1fr) minmax(120px, 220px) 130px 42px; gap: 10px; margin-bottom: 16px; align-items: center; }
.archive-searchbar > label { min-width: 0; position: relative; }
.archive-searchbar > label > .ui-icon { position: absolute; left: 12px; top: 13px; width: 17px; height: 17px; color: var(--muted); pointer-events: none; }
.archive-searchbar input { min-width: 0; width: 100%; padding-left: 38px; }
.archive-searchbar .dc-select, .archive-searchbar select { min-width: 0; width: 100%; }
.archive-bulkbar { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding: 10px 0 16px; border-bottom: 1px solid var(--line); margin-bottom: 14px; font-size: 13px; }
.archive-bulkbar .checkbox { margin: 0; }
.archive-bulkbar > span { color: var(--muted); }
.archive-bulkbar > div { display: flex; gap: 8px; margin-left: auto; }
.archive-bulkbar .button { min-height: 36px; font-size: 13px; padding: 6px 10px; }
.archive-queue-complete { margin-top: 12px; padding: 18px; border: 1px solid color-mix(in srgb, var(--success) 30%, var(--line)); border-radius: 8px; background: color-mix(in srgb, var(--success) 7%, var(--surface)); }
.archive-queue-complete-head { display: flex; align-items: flex-start; gap: 12px; }
.archive-queue-complete-icon { width: 34px; height: 34px; flex: 0 0 34px; display: grid; place-items: center; border-radius: 50%; color: var(--success); background: color-mix(in srgb, var(--success) 14%, var(--surface)); }
.archive-queue-complete-icon .ui-icon { width: 19px; height: 19px; }
.archive-queue-complete-head h3 { margin: 0; font-size: 16px; }
.archive-queue-complete-head p { margin: 4px 0 0; color: var(--muted); font-size: 13px; line-height: 1.6; }
.archive-queue-complete-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; margin: 18px 0 14px; border: 1px solid var(--line); background: var(--line); }
.archive-queue-complete-summary > div { min-width: 0; padding: 11px 12px; background: var(--surface); }
.archive-queue-complete-summary strong, .archive-queue-complete-summary span { display: block; }
.archive-queue-complete-summary strong { font-size: 21px; line-height: 1.15; }
.archive-queue-complete-summary span { margin-top: 4px; color: var(--muted); font-size: 12px; }
.archive-queue-complete-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--muted); font-size: 12px; }
.archive-queue-complete-foot .button { min-height: 34px; padding: 6px 10px; font-size: 13px; }
.archive-bulk-confirm-summary { margin: 0 22px 14px; padding: 14px 15px; border: 1px solid var(--line); border-radius: 7px; background: var(--surface-soft); }
.archive-bulk-confirm-summary.is-approve { border-color: color-mix(in srgb, var(--primary) 38%, var(--line)); background: color-mix(in srgb, var(--primary-soft) 68%, var(--surface)); }
.archive-bulk-confirm-summary strong { display: block; color: var(--primary); font-size: 16px; }
.archive-bulk-confirm-summary p { margin: 5px 0 0; color: var(--text); font-size: 14px; line-height: 1.6; }
.archive-bulk-confirm-summary small { display: block; margin-top: 6px; color: var(--muted); font-size: 12px; }
.archive-pagination { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 20px 0; color: var(--muted); font-size: 13px; }
.archive-pagination > div { display: flex; gap: 8px; flex: 0 0 auto; }
.archive-pagination .icon-command { width: 38px; height: 38px; padding: 0; }
.archive-pagination button:disabled { opacity: .35; cursor: default; }
[data-archive-inbox] .archive-candidate-card { grid-template-columns: 22px 54px minmax(0, 1fr) auto; gap: 12px; padding: 14px; }
.archive-row-select { align-self: start; display: grid; place-items: center; min-height: 32px; }
.archive-row-select input { width: 18px; height: 18px; margin: 0; accent-color: var(--primary); cursor: pointer; }
[data-archive-inbox] .archive-candidate-poster { display: grid; width: 54px; align-self: start; }
[data-archive-inbox] .archive-candidate-actions { grid-column: auto; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
[data-archive-inbox] .archive-candidate-actions .button { min-height: 36px; padding: 6px 10px; font-size: 13px; }
[data-archive-inbox] .archive-candidate-head { flex-direction: column; gap: 6px; }
[data-archive-inbox] .archive-candidate-head h2 { overflow-wrap: anywhere; line-height: 1.5; }
[data-archive-inbox] .archive-candidate-head p { font-size: 12px; }
[data-archive-inbox] .archive-candidate-meta { gap: 4px; margin-top: 6px; }
[data-archive-inbox] .archive-candidate-meta code { max-width: 100%; width: 100%; font-size: 12px; }
[data-archive-inbox] .archive-candidate-meta span { display: none; }
.archive-candidate-reason { font-size: 12px; line-height: 1.6; color: var(--muted); margin: 6px 0; overflow-wrap: anywhere; }
.archive-result-list { margin: 0; padding: 0; list-style: none; }
.archive-result-list li { padding: 13px 0; display: grid; gap: 6px; border-bottom: 1px solid var(--line); overflow-wrap: anywhere; }
.archive-result-list strong { font-size: 14px; font-weight: 600; }
.archive-result-list span { color: var(--muted); font-size: 13px; line-height: 1.6; }
.archive-result-list .is-success strong { color: #299577; }
.archive-result-list .is-warning strong { color: #ba862c; }
.archive-result-list .is-error strong, .archive-result-summary.is-error { color: var(--danger); }
.archive-result-summary.is-success { color: var(--success); }
.archive-result-summary { font-size: 14px; line-height: 1.6; color: var(--primary); }
.archive-bulk-dialog, .archive-check-dialog { width: min(600px, calc(100vw - 28px)); }
[data-archive-bulk-result], [data-archive-check-result] { padding: 0 22px 18px; overflow: auto; max-height: 62dvh; }
.archive-task-simple { border: 0; border-radius: 0; background: transparent; box-shadow: none; overflow: visible; }
.archive-task-simple .archive-editor-section { border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: transparent; box-shadow: none; padding: 22px 0; }
.archive-task-simple h3 { margin: 4px 0 14px; font-size: 16px; }
.archive-task-simple .field { min-width: 0; }
.archive-task-simple .archive-choice-grid-two { margin-block: 16px 0; }
.archive-task-simple .archive-operation-grid-six { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-bottom: 18px; }
.archive-task-simple .archive-operation-grid label { min-height: 56px; padding: 10px; grid-template-columns: 24px minmax(0, 1fr); gap: 8px; border-radius: 6px; }
.archive-task-simple .archive-operation-grid .archive-choice-icon { width: 24px; height: 24px; background: transparent; }
.archive-task-simple .archive-operation-grid strong { font-size: 13px; }
.archive-task-simple .archive-operation-grid small { display: none; }
.archive-task-advanced { margin-top: 20px; }
:is(.archive-task-advanced, .strm-advanced) > summary { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; min-height: 64px; padding: 16px 18px; font-size: 15px; font-weight: 650; cursor: pointer; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); list-style: none; }
:is(.archive-task-advanced, .strm-advanced) > summary:hover { border-color: var(--primary); }
:is(.archive-task-advanced, .strm-advanced) > summary:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }
.advanced-settings-heading, .advanced-settings-action { display: flex; align-items: center; gap: 10px; }
.advanced-settings-heading > svg { color: var(--primary); flex: 0 0 20px; }
.advanced-settings-action { color: var(--muted); font-size: 13px; font-weight: 500; flex-shrink: 0; margin-left: auto; }
:is(.archive-task-advanced, .strm-advanced):not([open]) .when-open, :is(.archive-task-advanced, .strm-advanced)[open] .when-closed { display: none; }
:is(.archive-task-advanced, .strm-advanced) > summary::-webkit-details-marker { display: none; }
:is(.archive-task-advanced, .strm-advanced)[open] .advanced-settings-action > svg { transform: rotate(180deg); }
.strm-advanced[open] > summary { margin-bottom: 16px; }
.archive-metadata-switch { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 52px; padding: 12px 0; font-weight: 600; cursor: pointer; }
.archive-metadata-switch input[role="switch"] { appearance: none; flex: 0 0 42px; width: 42px; height: 24px; min-height: 24px; padding: 0; border: 1px solid var(--line); border-radius: 12px; background: var(--muted); position: relative; cursor: pointer; }
.archive-metadata-switch input[role="switch"]::before { content: ""; position: absolute; left: 3px; top: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: transform .15s ease; }
.archive-metadata-switch input[role="switch"]:checked { background: var(--primary); border-color: var(--primary); }
.archive-metadata-switch input[role="switch"]:checked::before { transform: translateX(18px); }
.archive-metadata-switch input[role="switch"]:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }
[data-archive-metadata-options][hidden] { display: none; }
.archive-feature-controls { display: grid; gap: 12px; margin-top: 18px; }
.archive-feature-block { padding: 14px 0; border-top: 1px solid var(--line); }
.archive-feature-header { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.archive-feature-header > div { min-width: 0; }
.archive-feature-header h4 { margin: 0; font-size: 14px; }
.archive-feature-header small { display: block; margin-top: 4px; color: var(--muted); line-height: 1.5; }
.archive-feature-switch { display: flex; align-items: center; justify-content: space-between; gap: 14px; min-width: 220px; cursor: pointer; }
.archive-feature-switch > span { min-width: 0; }
.archive-feature-switch strong, .archive-feature-switch small { display: block; }
.archive-feature-switch small { margin-top: 3px; color: var(--muted); font-size: 12px; line-height: 1.45; }
.archive-feature-switch input[role="switch"] { appearance: none; flex: 0 0 42px; width: 42px; height: 24px; min-height: 24px; padding: 0; border: 1px solid var(--line); border-radius: 12px; background: var(--muted); position: relative; cursor: pointer; }
.archive-feature-switch input[role="switch"]::before { content: ""; position: absolute; left: 3px; top: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: transform .15s ease; }
.archive-feature-switch input[role="switch"]:checked { background: var(--primary); border-color: var(--primary); }
.archive-feature-switch input[role="switch"]:checked::before { transform: translateX(18px); }
.archive-feature-switch input[role="switch"]:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }
.archive-feature-body { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
.archive-feature-body[hidden] { display: none; }
.advanced-settings-heading { align-items: flex-start; }
.advanced-settings-heading > span, .advanced-settings-heading > strong, .advanced-settings-heading > small { display: block; }
.advanced-settings-heading > small { margin-top: 3px; color: var(--muted); font-size: 12px; font-weight: 400; line-height: 1.45; }
.archive-task-trial > header { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; align-items: center; margin-bottom: 14px; }
.archive-task-trial h3 { margin: 0; }
.archive-trial-input { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
.archive-trial-input input { min-width: 0; }
.archive-task-simple .archive-task-panel, .archive-task-simple .archive-path-mapping { background: transparent; border-radius: 0; border-inline: 0; }
.archive-task-simple .archive-editor-actions { margin-top: 22px; flex-wrap: wrap; }
.archive-candidate-identify-dialog { width: min(660px, calc(100vw - 28px)); }
.archive-candidate-identify-dialog > form { display: flex; flex-direction: column; min-height: 0; max-height: calc(100dvh - 34px); overflow: hidden; }
.archive-candidate-identify-dialog .archive-candidate-identify-body { min-height: 0; overflow-y: auto; flex: 1 1 auto; }
.archive-candidate-identify-dialog .dialog-head, .archive-candidate-identify-dialog .dialog-actions { flex: 0 0 auto; }
.archive-board-dialog > form { min-height: 0; overflow-y: auto; }
.archive-identify-reason { margin: 0 0 14px; border-left: 3px solid #b38b31; padding: 8px 12px; color: var(--muted); font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
.archive-identify-search { display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; gap: 12px; }
.archive-identify-search .archive-media-type-choice { margin: 0; flex: 1; min-width: 140px; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.archive-manual-id { margin-block: 16px; }
.archive-manual-id summary { color: var(--muted); font-size: 13px; cursor: pointer; }
.archive-manual-id .field { margin-top: 12px; }
.archive-selected-film { display: flex; align-items: flex-start; gap: 14px; margin-top: 18px; }
.archive-selected-film img { width: 64px; aspect-ratio: 2 / 3; border-radius: 5px; object-fit: cover; }
.archive-selected-film > div { min-width: 0; }
.archive-selected-film small { display: block; color: var(--muted); margin-top: 5px; font-size: 12px; }
.archive-selected-film p { margin-bottom: 0; color: var(--muted); font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; }
.archive-plan-preview { padding: 16px 0; border-bottom: 1px solid var(--line); }
.archive-plan-preview > strong { font-size: 14px; overflow-wrap: anywhere; }
.archive-plan-preview dl { display: grid; gap: 8px; margin: 12px 0; font-size: 13px; }
.archive-plan-preview dl > div { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 12px; }
.archive-plan-preview dt { color: var(--muted); }
.archive-plan-preview dd { margin: 0; overflow-wrap: anywhere; }
.archive-plan-preview details { font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
.archive-plan-preview summary { cursor: pointer; }
.archive-source-check-copy { display: block; margin-top: 8px; font-size: 12px; color: var(--muted); }
@media (max-width: 1280px) {
  [data-archive-inbox] .archive-candidate-card { grid-template-columns: 22px 54px minmax(0, 1fr); align-items: start; }
  [data-archive-inbox] .archive-candidate-actions { grid-column: 3; justify-self: start; justify-content: flex-start; }
}
@media (max-width: 680px) {
  .archive-searchbar { grid-template-columns: minmax(0, 1fr) minmax(100px, .7fr) 38px; gap: 8px; }
  .archive-searchbar > label { grid-column: 1 / -1; }
  .archive-bulkbar { gap: 10px; }
  .archive-bulkbar > div { width: 100%; margin-left: 0; }
  .archive-bulkbar .button { flex: 1; min-width: 0; padding-inline: 6px; font-size: 12px; gap: 4px; }
  .archive-bulkbar .ui-icon { width: 15px; }
  .archive-board-section .archive-runtime-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 0; }
  .archive-board-section .archive-runtime-overview > div { padding: 8px 14px; }
  .archive-board-section .archive-runtime-overview > div:nth-child(odd) { padding-left: 0; }
  .archive-board-section .archive-runtime-overview > div:nth-child(even) { border: 0; }
  .archive-board-columns { gap: 0; }
  .archive-board-row { grid-template-columns: 24px minmax(0, 1fr); }
  .archive-board-row > .badge { grid-column: 2; justify-self: start; }
  .archive-board-recent { gap: 10px; grid-template-columns: 42px minmax(0, 1fr); }
  .archive-board-recent > img, .archive-board-poster { width: 42px; }
  .archive-board-dialog .form-grid { grid-template-columns: minmax(0, 1fr); }
  [data-archive-inbox] .archive-candidate-card { grid-template-columns: 18px 42px minmax(0, 1fr); gap: 9px; padding: 12px; }
  [data-archive-inbox] .archive-candidate-poster { width: 42px; }
  [data-archive-inbox] .archive-candidate-actions { grid-column: 2 / -1; width: 100%; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); }
  [data-archive-inbox] .archive-candidate-actions .button { width: 100%; min-height: 36px; padding-inline: 4px; font-size: 12px; }
  [data-archive-inbox] .archive-candidate-actions > button, [data-archive-inbox] .archive-candidate-actions > form, [data-archive-inbox] .archive-candidate-actions > details { flex: 1 1 auto; }
  [data-archive-inbox] .archive-candidate-detail dl { grid-template-columns: minmax(0, 1fr); }
  [data-archive-inbox] .archive-plan-steps { grid-template-columns: minmax(0, 1fr); }
  [data-archive-inbox] .archive-candidate-delete-menu { width: min(268px, calc(100vw - 60px)); }
  .archive-task-simple .archive-operation-grid-six { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .archive-trial-input { grid-template-columns: minmax(0, 1fr); }
  .archive-candidate-identify-dialog .dialog-actions { display: flex; flex-wrap: wrap; }
  .archive-candidate-identify-dialog .dialog-actions .button { flex: 1 1 auto; min-width: 0; }
}

/* Member cloud operations share the application palette and keep account actions compact. */
.log-center { min-width: 0; }
.log-center [hidden] { display: none !important; }
.log-center .log-console { padding: 0; overflow: visible; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.log-center .log-toolbar { min-height: 64px; padding: 12px 16px; border-radius: 8px 8px 0 0; }
.log-center .log-toolbar-title { width: auto; }
.log-center .log-toolbar h2 { font-size: 17px; margin: 0; }
.log-center .log-live-controls { display: flex; gap: 8px; }
.log-center .log-live-controls > button { width: auto; }
.log-more { position: relative; }
.log-more summary { list-style: none; cursor: pointer; }
.log-more summary::-webkit-details-marker { display: none; }
.log-more > div { position: absolute; right: 0; top: calc(100% + 6px); z-index: 20; width: 170px; padding: 6px; background: var(--surface); border: 1px solid var(--line); border-radius: 8px; box-shadow: var(--shadow-soft); }
.log-more button { display: flex; align-items: center; gap: 8px; padding: 11px; width: 100%; color: var(--text); background: none; border: 0; border-radius: 4px; font: inherit; font-size: 13px; text-align: left; cursor: pointer; }
.log-more button:hover { background: var(--surface-soft); }
.log-more button.danger-text { color: var(--danger); }
.log-mode-note { padding: 9px 16px; color: var(--warning); background: var(--surface-soft); font-size: 12px; }
.log-center .log-level-tabs { grid-template-columns: repeat(var(--log-level-count), minmax(118px, 1fr)); overflow-x: auto; scrollbar-width: thin; }
.log-center .log-level-tab { display: flex; gap: 8px; justify-content: flex-start; min-height: 40px; }
.log-center .log-level-tab em { margin-left: auto; }
.log-center .log-filter-bar { padding: 12px 16px; }
.log-center-query { display: grid; gap: 10px; min-width: 0; }
.log-search-row { display: grid; grid-template-columns: minmax(0, 1fr) 40px; gap: 8px; }
.log-search-row input { min-height: 40px; width: 100%; padding: 0 36px; font-size: 13px; }
.log-search-row > .icon-command { width: 40px; height: 40px; }
.log-filters > summary { min-width: 0; display: flex; align-items: center; gap: 8px; list-style: none; cursor: pointer; font-size: 13px; font-weight: 600; }
.log-filters > summary > span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 12px; color: var(--muted); font-weight: 400; flex: 1; }
.log-filters > summary > svg:last-child { margin-left: auto; }
.log-filter-fields { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) auto auto; gap: 10px; align-items: end; padding-top: 14px; }
.log-filter-fields > label { min-width: 0; display: grid; gap: 6px; color: var(--muted); font-size: 12px; }
.log-filter-fields select { min-height: 40px; font-size: 13px; }
.log-filter-fields .button { min-height: 40px; }
.log-center .log-title { overflow-wrap: anywhere; }
.log-center .log-stream-note { flex-wrap: wrap; justify-content: space-between; }
.log-center .log-stream-note a { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; color: var(--text); }
.log-advice { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 16px; margin-top: 10px; font-size: 12px; color: var(--muted); }
.log-advice span { flex: 1 1 360px; }
.log-advice a { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; color: var(--primary); }
.log-repeat-count { font-size: 12px; color: var(--warning); white-space: nowrap; }
.log-technical, .log-repeats, .log-long-detail { margin-top: 10px; font-size: 12px; color: var(--muted); }
.log-technical summary, .log-repeats summary, .log-long-detail summary { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; cursor: pointer; list-style: none; min-height: 28px; }
.log-repeats summary > span { color: var(--muted); font-size: 12px; }
.log-repeats [data-log-repeat-list] { margin-top: 8px; border-left: 2px solid var(--line); padding-left: 12px; overflow-wrap: anywhere; }
.log-repeats p { border-bottom: 1px solid var(--line); padding: 8px 0; margin: 0; line-height: 1.6; }
.log-repeat-pagination { display: flex; align-items: center; gap: 8px; margin-top: 10px; }
.log-repeat-pagination > span { margin-right: auto; }
.log-center .log-meta-list code { white-space: normal; overflow-wrap: anywhere; }
.log-center .log-pagination { gap: 12px; margin: 0; padding: 12px 16px; border-radius: 0 0 8px 8px; }
.log-center .pagination > span[aria-current] { min-width: 34px; text-align: center; }
@media (max-width: 1000px) {
  .log-filter-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .log-center .log-toolbar { flex-wrap: wrap; gap: 10px; padding: 12px; }
  .log-center .log-toolbar-title { width: 100%; justify-content: space-between; }
  .log-center .log-live-controls { width: 100%; }
  .log-center .log-live-controls > [data-log-export] { margin-left: auto; }
  .log-center .log-level-tabs { min-height: 54px; }
  .log-center .log-level-tab { padding: 7px 8px; }
  .log-center .log-level-tab-icon { display: none; }
  .log-center .log-filter-bar { padding: 12px; }
  .log-filters > summary > span { display: none; }
  .log-filter-fields { gap: 10px 8px; }
  .log-filter-fields .ui-select { min-width: 0; }
  .log-center .log-row { padding: 12px; }
  .log-center .log-advice { margin-top: 8px; }
  .log-center .log-pagination { align-items: center; padding: 12px; }
  .log-center .log-pagination > span { font-size: 12px; line-height: 1.5; }
}

.cloud-console { min-width: 0; }
.cloud-console [hidden] { display: none !important; }
.cloud-section-head, .cloud-section-head > div, .cloud-live-status { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cloud-console svg, .cloud-account-dialog svg, .cloud-diagnostic-dialog svg { width: 17px; height: 17px; flex-shrink: 0; }
.cloud-live-status { justify-content: flex-end; flex-wrap: wrap; min-height: 42px; margin-bottom: 14px; color: var(--muted); font-size: 12px; }
.cloud-live-status > .button { margin-right: auto; flex-shrink: 0; }
.cloud-live-status .icon-command { width: 30px; height: 30px; min-height: 30px; }
.cloud-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.cloud-summary article { min-width: 0; border: 1px solid var(--line); border-radius: 8px; padding: 17px; background: var(--surface); }
.cloud-summary article > span, .cloud-summary article > small { display: block; color: var(--muted); font-size: 12px; }
.cloud-summary article > strong { display: block; margin: 9px 0; font-size: 24px; font-weight: 650; line-height: 1.3; overflow-wrap: anywhere; }
.cloud-summary article:first-child > strong { font-size: 18px; }
.cloud-summary article strong small { font-size: 15px; color: var(--muted); }
.cloud-section-head { margin: 10px 0 16px; }
.cloud-section-head h2, .cloud-attention h2 { margin: 0; font-size: 17px; }
.cloud-section-head h2 small, .cloud-attention h2 small { color: var(--muted); font-size: 12px; font-weight: 400; }
.cloud-overview-pool { margin-top: 24px; }
.cloud-attention { margin: 24px 0; }
.cloud-attention h2 { margin-bottom: 12px; }
.cloud-alert { display: grid; grid-template-columns: 20px minmax(0, 1fr) 34px; gap: 10px; align-items: center; padding: 13px 0; border-bottom: 1px solid var(--line); }
.cloud-alert > svg { color: var(--warning, #d9a441); }
.cloud-alert.error > svg { color: var(--danger); }
.cloud-alert strong { font-size: 13px; }
.cloud-alert p { margin: 4px 0 0; font-size: 12px; color: var(--muted); overflow-wrap: anywhere; }
.cloud-account-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap: 14px; align-items: stretch; }
.cloud-account { display: flex; flex-direction: column; min-width: 0; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); padding: 16px; }
.cloud-account header { display: flex; align-items: start; gap: 8px; justify-content: space-between; min-height: 49px; }
.cloud-account header > div { min-width: 0; }
.cloud-account h3 { margin: 0 0 5px; font-size: 15px; overflow-wrap: anywhere; }
.cloud-account header small, .cloud-account-meta, .cloud-check-time, .cloud-capacity small { color: var(--muted); font-size: 12px; }
.cloud-account .badge { flex-shrink: 0; font-size: 12px; }
.cloud-account-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 18px 0; }
.cloud-account-metrics dt { font-size: 12px; color: var(--muted); margin-bottom: 6px; }
.cloud-account-metrics dd { margin: 0; font-size: 15px; }
.cloud-capacity > div, .cloud-account-meta { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.cloud-capacity > div { font-size: 12px; }
.cloud-capacity progress { width: 100%; height: 5px; margin: 9px 0 4px; display: block; accent-color: var(--success, #38b995); border: 0; border-radius: 3px; overflow: hidden; background: var(--surface-soft); }
.cloud-capacity progress::-webkit-progress-bar { background: var(--surface-soft); }
.cloud-capacity progress::-webkit-progress-value { background: var(--success, #38b995); }
.cloud-account-meta { margin-top: 12px; }
.cloud-check-time { margin: 8px 0 13px; min-height: 17px; }
.cloud-account-error { font-size: 12px; color: var(--danger); overflow-wrap: anywhere; max-height: 4.5em; overflow-y: auto; }
.cloud-account footer { display: flex; align-items: center; gap: 8px; border-top: 1px solid var(--line); padding-top: 12px; margin-top: auto; }
.cloud-account footer > .button { margin-right: auto; }
.cloud-account footer .icon-command, .cloud-node-menu > summary { width: 34px; height: 34px; min-height: 34px; display: grid; place-items: center; }
.cloud-node-menu { position: relative; }
.cloud-node-menu > summary { cursor: pointer; list-style: none; border: 1px solid var(--line); border-radius: 6px; }
.cloud-node-menu > summary::-webkit-details-marker { display: none; }
.cloud-node-menu > div { position: absolute; right: 0; bottom: calc(100% + 8px); z-index: 12; width: 160px; padding: 6px; background: var(--surface); border: 1px solid var(--line); border-radius: 8px; box-shadow: var(--shadow-soft); }
.cloud-node-menu form { margin: 0; }
.cloud-node-menu button { display: flex; gap: 8px; align-items: center; width: 100%; padding: 10px; background: transparent; border: 0; text-align: left; color: var(--text); cursor: pointer; font: inherit; font-size: 12px; }
.cloud-node-menu button:hover { background: var(--surface-soft); }
.cloud-toolbar { display: flex; gap: 10px; align-items: center; margin: 16px 0; flex-wrap: wrap; }
.cloud-toolbar input[type="search"] { flex: 1 1 220px; min-width: 0; }
.cloud-toolbar > select { width: auto; min-width: 150px; }
.cloud-toolbar .ui-select { width: auto; flex: 0 1 180px; min-width: 140px; }
.cloud-toolbar input, .cloud-toolbar select { min-height: 40px; }
.cloud-muted, .cloud-empty { color: var(--muted); font-size: 12px; line-height: 1.7; }
.cloud-empty { grid-column: 1 / -1; padding: 40px 12px; text-align: center; border-block: 1px dashed var(--line); }
.cloud-policy { margin-top: 24px; border-top: 1px solid var(--line); }
.cloud-policy summary { display: flex; align-items: center; gap: 10px; cursor: pointer; padding: 17px 0; font-weight: 600; font-size: 14px; }
.cloud-policy summary .badge { margin-left: auto; }
.cloud-policy > form { max-width: 900px; padding: 8px 0 20px; }
.cloud-policy form > button { margin-top: 18px; }
.cloud-account-dialog, .cloud-diagnostic-dialog { width: min(680px, calc(100vw - 24px)); max-width: none; padding: 22px; border-radius: 8px; }
.cloud-account-dialog .form-grid, .cloud-diagnostic-dialog .form-grid { margin-top: 20px; }
.cloud-account-dialog .field, .cloud-diagnostic-dialog .field { min-width: 0; }
.cloud-account-dialog .notice, .cloud-diagnostic-dialog .notice { font-size: 12px; line-height: 1.7; margin-top: 16px; }
.cloud-auth-fields { display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: 22px; margin-top: 20px; }
.cloud-qr { display: grid; justify-items: center; gap: 10px; min-width: 0; }
.cloud-qr > label { width: 100%; font-size: 12px; }
.cloud-qr .one15-qr { width: 156px; height: 156px; min-height: 156px; }
.cloud-qr .one15-qr img { width: 100%; height: 100%; object-fit: contain; }
.cloud-qr > strong { font-size: 12px; text-align: center; }
.cloud-account-dialog textarea { min-height: 160px; }
.cloud-history-row { border-bottom: 1px solid var(--line); }
.cloud-history-row > summary { display: grid; grid-template-columns: 88px minmax(0, 1fr) 160px 84px 18px; gap: 12px; align-items: center; padding: 16px 0; cursor: pointer; list-style: none; font-size: 12px; }
.cloud-history-row summary strong, .cloud-history-row summary small { display: block; overflow-wrap: anywhere; }
.cloud-history-row summary strong { font-size: 14px; margin-bottom: 5px; }
.cloud-history-row summary small, .cloud-history-row time { color: var(--muted); font-weight: 400; }
.cloud-record-detail { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; background: var(--surface-soft); padding: 15px; font-size: 12px; }
.cloud-record-detail dt { color: var(--muted); margin-bottom: 7px; }
.cloud-record-detail dd { margin: 0; overflow-wrap: anywhere; }
.cloud-history-row > p { font-size: 12px; overflow-wrap: anywhere; }
.cloud-stages { list-style: none; padding: 0; margin: 16px 0; }
.cloud-stages li { display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; gap: 10px; align-items: start; padding: 10px 0; border-bottom: 1px solid var(--line); font-size: 12px; }
.cloud-stages small { display: block; margin-top: 5px; color: var(--muted); overflow-wrap: anywhere; }
.cloud-stages .failed { color: var(--danger); }
.cloud-pagination { display: flex; justify-content: flex-end; align-items: center; gap: 10px; margin-top: 18px; }
.cloud-pagination > span { margin-right: auto; font-size: 12px; color: var(--muted); }
.cloud-diagnostic-result { font-size: 13px; overflow-wrap: anywhere; }
.cloud-diagnostic-dialog [data-cloud-samples] { margin-top: 10px; }
@media (max-width: 1050px) {
  .cloud-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cloud-history-row > summary { grid-template-columns: 84px minmax(0, 1fr) 18px; }
  .cloud-history-row summary > time { grid-column: 2; }
  .cloud-history-row summary > b { grid-column: 1; grid-row: 2; }
  .cloud-history-row summary > svg { grid-column: 3; grid-row: 1; }
}
@media (max-width: 600px) {
  .cloud-summary { gap: 8px; }
  .cloud-summary article { padding: 12px; }
  .cloud-summary article:first-child > strong { font-size: 16px; }
  .cloud-section-head { align-items: stretch; flex-direction: column; }
  .cloud-section-head > div { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
  .cloud-section-head .button { min-width: 0; font-size: 12px; padding-inline: 8px; }
  .cloud-account-grid { grid-template-columns: minmax(0, 1fr); }
  .cloud-toolbar { gap: 8px; }
  .cloud-toolbar input[type="search"] { flex-basis: 100%; }
  .cloud-toolbar .ui-select { flex: 1; min-width: 0; }
  .cloud-toolbar > select { flex: 1; min-width: 0; width: 40%; }
  .cloud-auth-fields, .cloud-record-detail { grid-template-columns: minmax(0, 1fr); }
  .cloud-qr { order: 0; }
  .cloud-qr > label { max-width: 240px; }
  .cloud-account-dialog, .cloud-diagnostic-dialog { padding: 16px; }
  .cloud-account-dialog .form-grid, .cloud-diagnostic-dialog .form-grid { grid-template-columns: minmax(0, 1fr); }
  .cloud-account-dialog .dialog-actions, .cloud-diagnostic-dialog .dialog-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.cloud-history-row > summary { gap: 8px; }
}

/* File operations keep names visible while menus and batch commands stay separate. */
.fm-shell { overflow: visible; border-radius: 8px; box-shadow: none; }
.fm-shell [hidden], .fm-dialog [hidden] { display: none !important; }
.fm-toolbar, .fm-location, .fm-tools, .fm-heading, .fm-bulk, .fm-pagination, .fm-pagination nav { display: flex; align-items: center; gap: 8px; }
.fm-toolbar { padding: 12px 16px; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.fm-location { flex: 1 1 360px; min-width: 0; }
.fm-tools { flex-shrink: 0; margin-left: auto; }
.fm-shell .icon-command, .fm-dialog .icon-command { width: 36px; height: 36px; min-height: 36px; flex-shrink: 0; }
.fm-shell .ui-icon, .fm-dialog .ui-icon { width: 18px; height: 18px; flex-shrink: 0; }
.fm-filters { display: grid; grid-template-columns: minmax(190px, 1fr) auto 36px; gap: 8px; padding: 14px 16px; border-bottom: 1px solid var(--line); align-items: center; }
.fm-filter-options { min-width: 0; }
.fm-filter-options > summary { display: none; }
.fm-filter-fields { display: grid; grid-template-columns: 132px 126px 94px 126px; gap: 8px; }
.fm-filter-fields > * { min-width: 0; }
.fm-filters > *, .fm-filters .ui-select { min-width: 0; }
.fm-filters select, .fm-filters input { min-height: 38px; font-size: 13px; }
.fm-search { position: relative; min-width: 0; }
.fm-search > .ui-icon { position: absolute; left: 11px; top: 10px; color: var(--muted); }
.fm-search input { width: 100%; padding-left: 36px; }
.fm-heading { justify-content: space-between; flex-wrap: wrap; padding: 14px 16px; }
.fm-heading > div { display: flex; align-items: baseline; flex-wrap: wrap; gap: 10px; min-width: 0; }
.fm-heading strong { font-size: 15px; overflow-wrap: anywhere; }
.fm-heading span { font-size: 12px; color: var(--muted); }
.fm-feedback { color: var(--primary) !important; }
.fm-bulk { padding: 8px 16px; flex-wrap: wrap; border-top: 1px solid var(--line); background: var(--primary-soft); }
.fm-bulk > strong { margin-right: auto; font-size: 13px; font-weight: 600; }
.fm-row, .fm-list-head { display: grid; grid-template-columns: 24px minmax(0, 1fr) 90px 170px 36px; align-items: center; gap: 12px; padding: 0 16px; }
.fm-list-head { min-height: 42px; color: var(--muted); font-size: 12px; background: var(--surface-soft); border-block: 1px solid var(--line); }
.fm-check { display: grid; place-items: center; width: 24px; height: 32px; }
.fm-check input { width: 17px; height: 17px; min-height: 17px; padding: 0; cursor: pointer; accent-color: var(--primary); }
.fm-row { min-height: 62px; border-bottom: 1px solid var(--line); }
.fm-row:hover { background: color-mix(in srgb, var(--primary) 4%, var(--surface)); }
.fm-row.selected { background: var(--primary-soft); }
.fm-name { display: flex; align-items: center; gap: 10px; min-width: 0; padding-block: 10px; }
.fm-name > span:nth-child(2) { min-width: 0; display: grid; gap: 5px; }
.fm-name strong { font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; font-weight: 600; }
.fm-name small { display: none; color: var(--muted); font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; }
.fm-kind { width: 32px; height: 34px; flex-shrink: 0; display: grid; place-items: center; color: var(--muted); }
.fm-kind.folder { color: #519aef; }
.fm-star { color: #dba743; flex-shrink: 0; }
.fm-star .ui-icon { width: 14px; height: 14px; }
.fm-time, .fm-size { color: var(--muted); font-size: 12px; }
.fm-row-menu { position: relative; }
.fm-row-menu > summary { list-style: none; cursor: pointer; }
.fm-row-menu > summary::-webkit-details-marker { display: none; }
.fm-row-menu[open] { z-index: 25; }
.fm-row-menu > div { position: absolute; right: 0; top: calc(100% + 4px); width: 178px; max-height: min(360px, 60vh); overflow-y: auto; padding: 5px; background: var(--surface); border: 1px solid var(--line); border-radius: 8px; box-shadow: var(--shadow-soft); }
.fm-row:nth-last-child(-n + 3) .fm-row-menu > div { top: auto; bottom: calc(100% + 4px); }
.fm-row-menu button { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px; border: 0; background: none; color: var(--text); font: inherit; font-size: 13px; text-align: left; cursor: pointer; border-radius: 4px; }
.fm-row-menu button:hover { background: var(--primary-soft); }
.fm-row-menu .danger-text, .fm-dialog .danger-text { color: var(--danger); }
.fm-pagination { padding: 12px 16px; justify-content: space-between; }
.fm-pagination > span { font-size: 12px; color: var(--muted); }
.fm-empty { padding: 40px 16px; display: grid; justify-items: center; align-content: center; gap: 12px; text-align: center; color: var(--muted); }
.fm-dialog { width: min(680px, calc(100vw - 32px)); max-height: calc(100dvh - 40px); padding: 0; overflow: auto; border-radius: 8px; }
.fm-dialog .dialog-head { padding: 18px 20px; position: sticky; top: 0; background: var(--surface); z-index: 2; }
.fm-dialog .dialog-head h2 { font-size: 18px; margin: 0; }
.fm-dialog-body { padding: 16px 20px; min-width: 0; }
.fm-dialog-body > p { color: var(--muted); font-size: 13px; line-height: 1.65; }
.fm-dialog .dialog-actions { padding: 12px 20px; position: sticky; bottom: 0; background: var(--surface); border-top: 1px solid var(--line); }
.fm-target-query { display: grid; grid-template-columns: 36px minmax(0, 1fr) 36px; gap: 8px; }
.fm-target-query input { min-width: 0; min-height: 38px; font-size: 13px; }
.fm-target-list { min-height: 150px; max-height: 290px; overflow-y: auto; }
.fm-target-list > button { display: flex; width: 100%; align-items: center; gap: 10px; padding: 12px 4px; border: 0; border-bottom: 1px solid var(--line); color: var(--text); background: none; text-align: left; cursor: pointer; font: inherit; font-size: 14px; }
.fm-target-list > button:hover { color: var(--primary); background: var(--primary-soft); }
.fm-target-list > button span { flex: 1; overflow-wrap: anywhere; min-width: 0; }
.fm-target-pages { display: flex; justify-content: flex-end; align-items: center; gap: 8px; font-size: 12px; margin-block: 10px; }
.fm-conflict { display: grid; gap: 8px; font-size: 13px; }
.fm-selection-list { list-style: none; margin: 12px 0; padding: 0; max-height: 320px; overflow-y: auto; }
.fm-selection-list li, .fm-job li { display: grid; gap: 5px; padding: 10px 0; border-bottom: 1px solid var(--line); font-size: 13px; overflow-wrap: anywhere; }
.fm-selection-list code, .fm-job code, .fm-output, .fm-info code, .fm-trash-item code { white-space: normal; overflow-wrap: anywhere; font-size: 12px; color: var(--muted); }
.fm-operation-warning { padding-left: 12px; border-left: 2px solid var(--warning); }
.fm-operation-warning:empty { display: none; }
[data-file-operation-error] { color: var(--danger) !important; }
.fm-job { padding: 4px 0 20px; margin-bottom: 16px; border-bottom: 1px solid var(--line); }
.fm-job header, .fm-job-meta { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 8px; font-size: 13px; }
.fm-job header > span, .fm-job-meta { color: var(--muted); font-size: 12px; }
.fm-job progress { width: 100%; height: 5px; accent-color: var(--primary); display: block; margin: 12px 0; }
.fm-job details { margin-top: 12px; font-size: 13px; }
.fm-job details summary { cursor: pointer; }
.fm-job ul { padding: 0; max-height: 240px; overflow-y: auto; }
.fm-job-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.fm-job-actions .button { min-height: 34px; font-size: 12px; }
.fm-trash-item { display: grid; gap: 7px; padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 13px; overflow-wrap: anywhere; }
.fm-trash-item small { color: var(--muted); }
.fm-trash-item > div { display: flex; align-items: center; gap: 8px; }
.fm-info { display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 14px; font-size: 13px; }
.fm-info dt { color: var(--muted); }
.fm-info dd { margin: 0; overflow-wrap: anywhere; }
.fm-dialog h3 { font-size: 15px; margin-top: 24px; }
.fm-output { display: block; margin-top: 5px; }
.upload-console { display: grid; gap: 18px; min-width: 0; padding-bottom: 20px; }
.upload-console *, .upload-dialog * { box-sizing: border-box; letter-spacing: 0; }
.upload-account-bar, .upload-toolbar, .upload-section-head, .upload-pagination { display: flex; align-items: center; justify-content: space-between; gap: 14px; min-width: 0; }
.upload-account-bar { padding: 12px 0; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.upload-account-bar > div, .upload-toolbar > div, .upload-section-head > div, .upload-pagination > div { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; min-width: 0; }
.upload-account-bar > div:first-child { flex: 1 1 260px; }
.upload-account-bar strong { white-space: nowrap; }
.upload-account-bar span, .upload-account-bar small, .upload-toolbar > span { color: var(--muted); font-size: 13px; overflow-wrap: anywhere; }
.upload-account-bar .ui-icon { color: var(--primary); width: 19px; height: 19px; flex-shrink: 0; }
.upload-toolbar { flex-wrap: wrap; }
.upload-toolbar .button, .upload-section-head .button { min-height: 36px; border-radius: 6px; }
.upload-feedback { margin: 0; font-size: 13px; color: var(--text-secondary); overflow-wrap: anywhere; }
.upload-feedback:empty { display: none; }
.upload-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-block: 1px solid var(--line); padding: 18px 0; gap: 18px; }
.upload-stat { display: flex; align-items: center; gap: 12px; min-width: 0; }
.upload-stat > span { display: grid; place-items: center; flex: 0 0 36px; height: 36px; background: var(--surface-soft); border-radius: 8px; color: var(--icon-cyan); }
.upload-stat.active > span { color: var(--primary); }
.upload-stat.success > span { color: var(--success); }
.upload-stat.warning > span { color: var(--warning); }
.upload-stat small { display: block; color: var(--muted); font-size: 12px; }
.upload-stat strong { display: block; font-size: 24px; line-height: 1.4; font-variant-numeric: tabular-nums; }
.upload-section { min-width: 0; padding-block: 4px 12px; }
.upload-section-head { min-height: 46px; margin-bottom: 14px; flex-wrap: wrap; }
.upload-section-head h2 { font-size: 17px; margin: 0; }
.upload-section-head > span, .upload-section-head a { color: var(--muted); font-size: 13px; display: inline-flex; gap: 6px; align-items: center; }
.upload-filters { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(140px, 220px) minmax(120px, 180px); gap: 10px; margin-bottom: 12px; }
.upload-search { display: flex; align-items: center; gap: 9px; min-width: 0; border: 1px solid var(--line); background: var(--surface); padding: 0 12px; border-radius: 6px; }
.upload-search > .ui-icon { color: var(--muted); width: 16px; height: 16px; flex-shrink: 0; }
.upload-search input { min-width: 0; width: 100%; min-height: 40px; border: 0; background: transparent; box-shadow: none; padding-inline: 0; }
.upload-filters select, .upload-filters .custom-select { min-width: 0; width: 100%; }
.upload-list-head, .upload-file { display: grid; grid-template-columns: 48px minmax(0, 1fr) minmax(140px, 220px) 76px; align-items: center; gap: 12px; padding: 12px 6px; border-bottom: 1px solid var(--line); }
.upload-list-head { color: var(--muted); font-size: 12px; background: var(--surface-soft); }
.upload-list-head label { display: flex; align-items: center; justify-content: center; min-height: 24px; }
.upload-select { display: flex; align-items: center; justify-content: center; color: var(--muted); }
.upload-select input, .upload-list-head input { width: 16px; height: 16px; min-height: 16px; margin: 0; accent-color: var(--primary); }
.upload-file-name, .upload-file-state { min-width: 0; }
.upload-file-name > strong { display: block; font-size: 14px; overflow-wrap: anywhere; line-height: 1.6; }
.upload-file small { display: block; color: var(--muted); font-size: 12px; margin-top: 5px; overflow-wrap: anywhere; }
.upload-file p { margin: 6px 0 0; font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
.upload-error { color: var(--danger); overflow-wrap: anywhere; }
.upload-muted { color: var(--muted); overflow-wrap: anywhere; }
.upload-row-actions { display: flex; align-items: center; justify-content: flex-end; gap: 6px; }
.upload-console .icon-command, .upload-dialog .icon-command { width: 34px; height: 34px; min-width: 34px; min-height: 34px; border-radius: 6px; }
.upload-meter { display: flex; align-items: center; gap: 8px; margin-top: 6px; }
.upload-meter progress { width: 100%; height: 5px; accent-color: var(--primary); min-width: 0; }
.upload-meter b { font-size: 12px; color: var(--muted); font-weight: 500; min-width: 30px; }
.upload-bulk { display: flex; align-items: center; justify-content: space-between; background: var(--surface-soft); padding: 8px 12px; font-size: 13px; }
.upload-bulk[hidden] { display: none; }
.upload-pagination { padding-top: 15px; color: var(--muted); font-size: 13px; }
.upload-pagination > div > span { min-width: 50px; text-align: center; font-variant-numeric: tabular-nums; }
.upload-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 138px; gap: 10px; color: var(--muted); padding: 20px; text-align: center; }
.upload-empty > .ui-icon { width: 26px; height: 26px; opacity: .65; }
.upload-empty strong { font-size: 14px; font-weight: 500; }
.upload-empty span { font-size: 12px; }
.upload-sources { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 350px), 1fr)); gap: 16px; }
.upload-source { padding: 17px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); min-width: 0; }
.upload-source header, .upload-source header > div, .upload-source footer, .upload-source footer > div { display: flex; align-items: center; gap: 8px; min-width: 0; }
.upload-source header, .upload-source footer { justify-content: space-between; }
.upload-source header > div { flex: 1; }
.upload-source h3 { font-size: 15px; margin: 0; overflow-wrap: anywhere; }
.upload-source header .ui-icon { color: var(--primary); flex-shrink: 0; }
.upload-source dl { display: grid; gap: 10px; margin: 20px 0 14px; font-size: 13px; }
.upload-source dl > div { display: grid; grid-template-columns: 66px minmax(0, 1fr); gap: 8px; }
.upload-source dt, .upload-source footer small { color: var(--muted); font-size: 12px; }
.upload-source dd { margin: 0; overflow-wrap: anywhere; }
.upload-source-policy { display: flex; gap: 8px 14px; flex-wrap: wrap; font-size: 12px; color: var(--text-secondary); }
.upload-source > p { font-size: 12px; margin: 12px 0; min-height: 18px; }
.upload-source footer { border-top: 1px solid var(--line); padding-top: 12px; flex-wrap: wrap; }
.upload-source footer > div { margin-left: auto; }
.upload-menu { position: relative; }
.upload-menu > summary { display: grid; place-items: center; cursor: pointer; list-style: none; }
.upload-menu > summary::-webkit-details-marker { display: none; }
.upload-menu > div { position: absolute; right: 0; z-index: 20; min-width: 160px; display: grid; padding: 5px; background: var(--surface); border: 1px solid var(--line); box-shadow: var(--shadow); border-radius: 6px; }
.upload-menu button { display: flex; align-items: center; gap: 9px; background: transparent; border: 0; padding: 10px; color: var(--text); text-align: left; font-size: 13px; cursor: pointer; }
.upload-menu button:hover { background: var(--surface-soft); }
.upload-menu button.danger-text { color: var(--danger); }
.upload-results { border-top: 1px solid var(--line); padding-top: 18px; }
.upload-results dl { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; margin: 0; }
.upload-results dt { color: var(--muted); font-size: 12px; }
.upload-results dd { margin: 8px 0 0; font-size: 16px; }
.upload-settings { display: grid; gap: 22px; }
.upload-settings .upload-section { border-bottom: 1px solid var(--line); padding-bottom: 22px; }
.upload-settings-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; align-items: start; }
.upload-settings-grid .checkbox { min-height: 44px; margin: 0; }
.upload-settings-grid input, .upload-settings-grid select { max-width: 100%; }
.upload-settings-actions { display: flex; justify-content: flex-end; }
.upload-dialog { width: min(640px, calc(100vw - 28px)); max-height: calc(100dvh - 32px); padding: 0; border-radius: 8px; }
.upload-dialog[open] { display: flex; flex-direction: column; }
.upload-dialog .dialog-head { flex-shrink: 0; padding: 18px 20px; }
.upload-dialog .dialog-head h2 { font-size: 18px; margin: 0; }
.upload-dialog form { min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
.upload-dialog-body { padding: 18px 20px; overflow-y: auto; min-height: 0; }
.upload-dialog .dialog-actions { flex-shrink: 0; margin: 0; padding: 14px 20px; border-top: 1px solid var(--line); }
.upload-dialog .form-grid { gap: 14px; }
.upload-dialog .field { min-width: 0; }
.upload-dialog .field > span { font-size: 13px; }
.upload-dialog input, .upload-dialog textarea, .upload-dialog select { max-width: 100%; }
.upload-source-switches { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 20px 0; }
.upload-source-switches .checkbox { margin: 0; min-height: 40px; font-size: 13px; }
.upload-filter-details { border-top: 1px solid var(--line); }
.upload-filter-details > summary { cursor: pointer; padding: 13px 0; color: var(--text-secondary); font-size: 13px; }
.upload-filter-details p { font-size: 12px; line-height: 1.6; margin: 0; }
.upload-detail h3 { font-size: 16px; margin: 0 0 18px; overflow-wrap: anywhere; }
.upload-detail dl { display: grid; gap: 16px; margin: 0; }
.upload-detail dl > div { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 12px; font-size: 13px; line-height: 1.65; }
.upload-detail dt { color: var(--muted); }
.upload-detail dd { margin: 0; overflow-wrap: anywhere; }
.upload-trash-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.upload-trash-row > div:first-child { flex: 1; min-width: 0; }
.upload-trash-row > div:last-child { display: flex; gap: 5px; flex-shrink: 0; }
.upload-trash-row strong, .upload-trash-row small { display: block; overflow-wrap: anywhere; font-size: 13px; }
.upload-trash-row small { font-size: 12px; color: var(--muted); margin-top: 6px; }
.upload-trash-dialog > .upload-pagination { padding: 14px 20px; }
@media (max-width: 900px) {
  .upload-settings-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .upload-console { gap: 14px; }
  .upload-account-bar { gap: 8px; padding-top: 0; }
  .upload-account-bar > div:last-child { margin-left: auto; }
  .upload-toolbar > div { gap: 8px; }
  .upload-toolbar .button { padding-inline: 10px; font-size: 12px; }
  .upload-toolbar > span { font-size: 12px; }
  .upload-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; padding-block: 14px; }
  .upload-stat { gap: 8px; }
  .upload-stat > span { flex-basis: 30px; height: 30px; }
  .upload-stat strong { font-size: 22px; }
  .upload-section-head { gap: 10px; }
  .upload-section-head h2 { font-size: 16px; }
  .upload-section-head .button { font-size: 12px; padding-inline: 8px; }
  .upload-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .upload-search { grid-column: 1 / -1; }
  .upload-list-head { grid-template-columns: 22px 1fr; gap: 10px; }
  .upload-list-head > span:not(:nth-child(2)) { display: none; }
  .upload-file { grid-template-columns: 22px minmax(0, 1fr) 34px; gap: 10px; padding-block: 14px; }
  .upload-select { grid-column: 1; grid-row: 1; align-self: start; padding-top: 5px; }
  .upload-file-name { grid-column: 2; grid-row: 1; }
  .upload-file-state { grid-column: 2; grid-row: 2; }
  .upload-row-actions { grid-column: 3; grid-row: 1 / span 2; flex-direction: column; align-self: start; }
  .upload-pagination { font-size: 12px; gap: 8px; }
  .upload-pagination > div { gap: 4px; }
  .upload-results dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .upload-source { padding: 14px; }
  .upload-settings-grid { grid-template-columns: 1fr; gap: 16px; }
  .upload-dialog .form-grid.two { grid-template-columns: 1fr; }
  .upload-dialog .dialog-head, .upload-dialog-body, .upload-dialog .dialog-actions { padding: 14px; }
  .upload-source-switches { grid-template-columns: 1fr; gap: 4px; }
  .upload-detail dl > div { grid-template-columns: 1fr; gap: 4px; }
}
@media (max-width: 1200px) {
  .fm-filters { grid-template-columns: minmax(0, 1fr) 36px; }
  .fm-filter-options { grid-column: 1 / -1; grid-row: 2; }
  .fm-filter-fields { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .fm-filters > button { grid-column: 2; grid-row: 1; }
  .fm-row, .fm-list-head { grid-template-columns: 24px minmax(0, 1fr) 72px 140px 36px; gap: 8px; }
}
@media (max-width: 640px) {
  .fm-toolbar { padding: 10px 12px; }
  .fm-location { flex-basis: 100%; }
  .fm-tools { width: 100%; justify-content: flex-end; padding-top: 6px; border-top: 1px solid var(--line); }
  .fm-filters { padding: 10px 12px; }
  .fm-filter-options > summary { display: flex; align-items: center; gap: 8px; padding-block: 6px; font-size: 13px; list-style: none; cursor: pointer; color: var(--muted); }
  .fm-filter-options > summary .ui-icon:last-child { margin-left: auto; }
  .fm-filter-options > summary::-webkit-details-marker { display: none; }
  .fm-filter-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); padding-top: 8px; }
  .fm-heading, .fm-bulk, .fm-pagination { padding-inline: 12px; }
  .fm-bulk > strong { flex-basis: 100%; }
  .fm-row, .fm-list-head { grid-template-columns: 24px minmax(0, 1fr) 36px; padding-inline: 12px; gap: 7px; }
  .fm-size, .fm-time { display: none; }
  .fm-name { gap: 7px; }
  .fm-kind { width: 24px; }
  .fm-name small { display: block; }
  .fm-name strong { font-size: 13px; }
  .fm-dialog-body, .fm-dialog .dialog-head, .fm-dialog .dialog-actions { padding: 14px; }
}
.settings-navigation.system-module-nav .settings-nav-state { visibility: hidden; }
.metadata-audit { min-width: 0; }
.metadata-audit-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; padding: 8px 0 20px; }
.metadata-audit-head h2 { margin: 0 0 7px; font-size: 19px; }
.metadata-audit-head p, .metadata-audit-note { color: var(--muted); font-size: 13px; line-height: 1.7; margin: 0; }
.metadata-audit-counts { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; margin-bottom: 18px; }
.metadata-audit-counts > div { min-width: 0; padding: 16px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.metadata-audit-counts span { display: block; font-size: 12px; color: var(--muted); }
.metadata-audit-counts strong { display: block; font-size: 24px; line-height: 1.4; margin-top: 5px; }
.metadata-audit-counts strong small { font-size: 12px; color: var(--muted); font-weight: 400; margin-left: 6px; }
.metadata-audit [data-audit-coverage] { margin: -6px 0 12px; }
.metadata-audit-counts > div:nth-child(2) strong { color: var(--warning); }
.metadata-audit-counts > div:nth-child(3) strong { color: var(--danger); }
.metadata-audit-counts > div:nth-child(5) strong { color: var(--success); }
.metadata-audit-progress { display: grid; gap: 10px; font-size: 13px; line-height: 1.7; margin-bottom: 16px; overflow-wrap: anywhere; }
.metadata-audit-progress progress { width: 100%; height: 5px; accent-color: var(--primary); }
.metadata-audit-progress > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.metadata-audit-feedback { margin: 12px 0; padding: 12px; background: var(--surface-soft); font-size: 13px; line-height: 1.7; }
.metadata-audit-feedback.is-error { color: var(--danger); }
.metadata-audit-filters { display: grid; grid-template-columns: minmax(180px, 1.5fr) repeat(3, minmax(130px, 1fr)) 36px; gap: 10px; align-items: center; }
.metadata-audit-sources { grid-column: 1 / -1; display: flex; gap: 6px; overflow-x: auto; padding: 3px 0 10px; }
.metadata-audit-sources button { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; gap: 6px; min-height: 38px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); color: var(--muted); font-size: 13px; }
.metadata-audit-sources button[aria-pressed=true] { color: var(--text); background: var(--primary-soft); border-color: var(--primary); }
.metadata-audit-sources .ui-icon { width: 16px; height: 16px; }
.metadata-audit-search { min-width: 0; display: flex; align-items: center; gap: 8px; padding: 0 12px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); }
.metadata-audit-search > .ui-icon { flex: 0 0 16px; color: var(--muted); }
.metadata-audit-search input { width: 100%; min-width: 0; border: 0; padding-inline: 0; background: transparent; box-shadow: none; }
.metadata-audit-filters select { width: 100%; min-height: 40px; }
.metadata-audit-bulk { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; padding: 16px 0; font-size: 13px; color: var(--muted); }
.metadata-audit-bulk > .system-actions { margin-left: auto; }
.metadata-audit-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 14px; align-items: stretch; }
.metadata-audit-item { min-width: 0; display: grid; grid-template-columns: 64px minmax(0, 1fr) 18px; grid-template-rows: minmax(96px, auto) auto minmax(8px, 1fr) auto; gap: 10px; padding: 14px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.metadata-audit-controls { flex-wrap: wrap; min-width: 0; max-width: 100%; }
.metadata-audit-controls select { width: auto; min-width: 108px; max-width: 100%; min-height: 38px; font-size: 13px; }
.metadata-audit-item .metadata-asset { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
.metadata-audit-check { display: grid; align-content: start; padding-top: 3px; }
.metadata-audit input[type=checkbox] { width: 17px; height: 17px; min-height: 17px; padding: 0; margin: 0; accent-color: var(--primary); }
.metadata-audit-poster { width: 64px; height: 96px; position: relative; display: grid; place-items: center; background: var(--surface-soft); border-radius: 4px; overflow: hidden; color: var(--muted); }
.metadata-audit-poster > .ui-icon { width: 26px; height: 26px; }
.metadata-audit-poster img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.metadata-audit-content { min-width: 0; }
.metadata-audit-content h3 { font-size: 15px; line-height: 1.6; margin: 0 0 3px; overflow-wrap: anywhere; }
.metadata-audit-content h3 small { font-size: 12px; margin-left: 10px; font-weight: 400; color: var(--muted); }
.metadata-audit-content p, .metadata-audit-details p { margin: 4px 0; font-size: 12px; line-height: 1.7; color: var(--muted); overflow-wrap: anywhere; }
.metadata-audit-assets { display: flex; gap: 7px; flex-wrap: wrap; margin: 10px 0; }
.metadata-audit-item > .metadata-audit-assets { grid-column: 1 / -1; grid-row: 2; margin: 0; }
.metadata-audit-summary { grid-column: 1 / -1; grid-row: 3; min-width: 0; font-size: 12px; line-height: 1.7; color: var(--muted); overflow-wrap: anywhere; }
.metadata-audit-summary p { margin: 0; }
.metadata-audit-item > footer { grid-column: 1 / -1; grid-row: 4; display: flex; align-items: end; justify-content: space-between; gap: 10px; align-self: end; }
.metadata-audit-item > footer .button { font-size: 12px; min-height: 34px; padding: 6px 10px; }
.metadata-audit-content .metadata-audit-target { color: var(--text); }
.metadata-audit .is-error { color: var(--danger); }
.metadata-asset { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; padding: 4px 7px; border-radius: 4px; background: var(--surface-soft); color: var(--muted); }
.metadata-asset .ui-icon { width: 13px; height: 13px; }
.metadata-asset.is-present { color: var(--success); }
.metadata-asset.is-missing { color: var(--warning); }
.metadata-asset.is-invalid { color: var(--danger); }
.metadata-audit-details { grid-column: 3 / -1; min-width: 0; font-size: 12px; }
.metadata-audit-details summary { color: var(--muted); cursor: pointer; padding-block: 5px; }
.metadata-audit-fields { display: flex; flex-wrap: wrap; gap: 10px 22px; margin: 10px 0; }
.metadata-audit-fields dt { color: var(--muted); }
.metadata-audit-fields dd { margin: 4px 0 0; }
.metadata-audit-repair { flex: 0 0 34px; }
.metadata-audit-empty { grid-column: 1 / -1; min-height: 220px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: var(--muted); font-size: 14px; gap: 14px; }
.metadata-audit-empty > .ui-icon { width: 32px; height: 32px; }
.metadata-audit-pagination { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 16px 0; color: var(--muted); font-size: 13px; }
.metadata-audit-pagination > div { display: flex; gap: 8px; }
.metadata-audit-errors { font-size: 13px; margin: 0 0 18px; padding: 12px; border-left: 3px solid var(--danger); }
.metadata-audit-errors summary { cursor: pointer; }
.metadata-audit-errors p { line-height: 1.7; overflow-wrap: anywhere; }
.metadata-audit-dialog { width: min(860px, calc(100vw - 24px)); max-height: calc(100dvh - 32px); padding: 20px; }
.metadata-audit-dialog .dialog-head { align-items: start; gap: 12px; }
.metadata-audit-dialog .dialog-head > div { min-width: 0; }
.metadata-audit-dialog .dialog-head h2 { font-size: 18px; overflow-wrap: anywhere; }
.metadata-audit-dialog .dialog-head p { font-size: 12px; overflow-wrap: anywhere; color: var(--muted); }
.metadata-audit-detail-list { min-width: 0; }
.metadata-audit-entry { padding: 16px 0; border-bottom: 1px solid var(--line); }
.metadata-audit-entry > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.metadata-audit-entry > header h3 { min-width: 0; }
.metadata-audit-entry > header button { flex: 0 0 34px; }
.metadata-audit-entry h3 { margin: 0; font-size: 14px; overflow-wrap: anywhere; }
.metadata-audit-entry p { font-size: 12px; line-height: 1.7; overflow-wrap: anywhere; color: var(--muted); }
.metadata-audit-entry summary { font-size: 12px; color: var(--muted); cursor: pointer; }
@media (max-width: 1100px) {
  .metadata-audit-counts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .metadata-audit-filters { grid-template-columns: repeat(3, minmax(0, 1fr)) 36px; }
  .metadata-audit-search { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  .metadata-audit-controls { width: 100%; }
  .metadata-audit-controls select { flex: 1 1 108px; }
  .metadata-audit-controls [data-audit-action=scan] { margin-left: auto; }
  .metadata-audit-counts { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .metadata-audit-counts > div { padding: 10px; }
  .metadata-audit-counts span { min-height: 32px; line-height: 16px; }
  .metadata-audit-counts strong { font-size: 22px; margin: 0; }
  .metadata-audit-sources { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: visible; }
  .metadata-audit-filters { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 36px; }
  .metadata-audit-filters > select[name=asset], .metadata-audit-filters > .ui-select:has(select[name=asset]) { grid-column: 1 / 3; }
  .metadata-audit-filters > select[name=status], .metadata-audit-filters > .ui-select:has(select[name=status]) { grid-column: 2 / 4; }
  .metadata-audit-bulk > .system-actions { margin-left: 0; width: 100%; }
  .metadata-audit-bulk > .system-actions > button { flex: 1; padding-inline: 8px; }
  .metadata-audit-item { grid-template-columns: 56px minmax(0, 1fr) 18px; gap: 10px; padding: 12px; }
  .metadata-audit-poster { width: 56px; height: 84px; }
  .metadata-audit-content { grid-column: 2; }
  .system-settings-console .metadata-audit-repair { width: 32px; height: 32px; align-self: start; }
  .metadata-audit-details { grid-column: 1 / -1; padding-top: 8px; }
}
@media (max-width: 360px) {
  .metadata-audit-counts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.system-settings-console { display: grid; gap: 30px; min-width: 0; padding-bottom: 28px; }
.system-settings-console [hidden] { display: none !important; }
.system-setting-section { min-width: 0; }
.system-setting-section > header { display: flex; align-items: center; gap: 10px; padding: 0 0 16px; border-bottom: 1px solid var(--line); }
.system-setting-section h2 { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 17px; line-height: 1.5; }
.system-setting-section h2 > .ui-icon { width: 20px; height: 20px; color: var(--accent-color); }
.system-setting-row { display: grid; grid-template-columns: minmax(180px, .72fr) minmax(0, 1.8fr); gap: 30px; padding: 22px 0; border-bottom: 1px solid var(--line); }
.system-setting-label h3 { font-size: 14px; margin: 0 0 6px; font-weight: 600; }
.system-setting-label p, .system-setting-control p, .system-boundary p { font-size: 13px; line-height: 1.8; color: var(--muted); margin: 0; overflow-wrap: anywhere; }
.system-setting-control { min-width: 0; display: grid; gap: 14px; align-content: start; }
.system-setting-control > .button { justify-self: start; }
.system-settings-console .field { margin: 0; min-width: 0; display: grid; gap: 8px; }
.system-settings-console .field > span { color: var(--muted); font-size: 12px; }
.system-settings-console input, .system-settings-console select { min-width: 0; max-width: 100%; }
.system-settings-console .checkbox { display: flex; align-items: center; gap: 9px; min-height: 34px; font-size: 13px; margin: 0; }
.system-settings-console input[type=checkbox] { width: 17px; height: 17px; flex: 0 0 17px; margin: 0; accent-color: var(--accent-color); }
.system-settings-console input[type=file] { font-size: 13px; overflow: hidden; }
.system-settings-console[data-system-view=backup] .field > input,
.system-settings-console[data-system-view=backup] .field > select { width: 100%; height: 44px; min-height: 44px; border-radius: 6px; }
.system-settings-console[data-system-view=backup] input[type=file] { padding: 0 12px 0 0; line-height: 42px; font-weight: 400; cursor: pointer; }
.system-settings-console[data-system-view=backup] input[type=file]::file-selector-button {
  height: 42px; margin: 0 12px 0 0; padding: 0 14px; border: 0; border-right: 1px solid var(--line);
  background: var(--surface-soft); color: var(--text); font: inherit; cursor: pointer;
}
.system-settings-console[data-system-view=backup] input[type=file]:hover::file-selector-button { background: var(--surface); }
.system-settings-console .button { min-height: 38px; font-size: 13px; gap: 7px; border-radius: 6px; white-space: normal; }
.system-settings-console .icon-command { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; flex: 0 0 36px; border-radius: 6px; }
.system-field-pair { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.subtitle-methods { display: flex; flex-wrap: wrap; gap: 8px 22px; }
.system-settings-console[data-system-view=subtitles] .system-setting-control > .badge { justify-self: start; }
.subtitle-note { color: var(--muted); font-size: 13px; line-height: 1.7; }
.subtitle-result { margin-top: 20px; border-top: 1px solid var(--line); padding-top: 4px; overflow-wrap: anywhere; }
.subtitle-result small { color: var(--muted); }
.subtitle-library { min-width: 0; }
.subtitle-library-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.subtitle-library-head h2 { display: flex; align-items: center; gap: 9px; margin: 0 0 6px; font-size: 18px; }
.subtitle-library-head > div > span { color: var(--muted); font-size: 12px; }
.subtitle-counts { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); margin: 22px 0 0; padding: 16px 0; border-block: 1px solid var(--line); gap: 16px; }
.subtitle-counts > div { min-width: 0; }
.subtitle-counts dt { color: var(--muted); font-size: 12px; line-height: 1.6; }
.subtitle-counts dd { font-size: 26px; font-weight: 650; line-height: 1.3; margin: 7px 0 0; font-variant-numeric: tabular-nums; }
.subtitle-count-confirmed dd { color: var(--success); }
.subtitle-count-claimed dd { color: var(--warning); }
.subtitle-count-not_detected dd { color: var(--icon-sky); }
.subtitle-count-unknown dd { color: var(--muted); }
.subtitle-distribution { height: 5px; display: flex; gap: 2px; background: var(--line); margin: 0 0 20px; overflow: hidden; }
.subtitle-distribution > span { flex-basis: 0; min-width: 0; }
.subtitle-segment-confirmed { background: var(--success); }
.subtitle-segment-claimed { background: var(--warning); }
.subtitle-segment-not_detected { background: var(--icon-sky); }
.subtitle-segment-unknown { background: var(--muted); }
.subtitle-segment-untested { background: var(--line); }
.subtitle-library-filters { display: grid; grid-template-columns: minmax(130px, 1fr) minmax(130px, .8fr) minmax(140px, 1.2fr) minmax(130px, .8fr) 38px 38px; align-items: center; gap: 10px; }
.subtitle-library-filters select { width: 100%; height: 40px; padding: 0 10px; }
.subtitle-search { display: flex; align-items: center; gap: 8px; min-width: 0; height: 40px; padding: 0 10px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); }
.subtitle-search .ui-icon { flex: 0 0 17px; color: var(--muted); }
.subtitle-search input { width: 100%; border: 0; padding: 0; box-shadow: none; background: transparent; }
.subtitle-breadcrumbs { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin: 16px 0; min-height: 28px; }
.subtitle-breadcrumbs button { min-width: 0; display: inline-flex; align-items: center; gap: 6px; padding: 4px 0; color: var(--text); background: transparent; border: 0; font-size: 12px; text-align: left; overflow-wrap: anywhere; cursor: pointer; }
.subtitle-breadcrumbs > .ui-icon { width: 14px; height: 14px; color: var(--muted); }
.subtitle-selection { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; min-height: 48px; margin-bottom: 14px; }
.subtitle-selection > span { color: var(--muted); font-size: 12px; }
.subtitle-selection > .button:first-of-type { margin-left: auto; }
.subtitle-run { display: grid; grid-template-columns: minmax(0, 1fr) minmax(90px, 200px) auto; align-items: center; gap: 12px; padding: 14px 0; margin-bottom: 16px; border-block: 1px solid var(--line); }
.subtitle-run > div:first-child { min-width: 0; display: grid; gap: 5px; font-size: 13px; }
.subtitle-run span, .subtitle-run details { font-size: 12px; color: var(--muted); overflow-wrap: anywhere; }
.subtitle-run progress { width: 100%; height: 7px; accent-color: var(--success); }
.subtitle-run [data-subtitle-run-errors] { grid-column: 1 / -1; }
.subtitle-resource-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 270px), 1fr)); gap: 14px; align-items: stretch; }
.subtitle-resource-grid[aria-busy=true] { opacity: .65; pointer-events: none; }
.subtitle-resource { min-width: 0; display: grid; grid-template-columns: 86px minmax(0, 1fr); overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.subtitle-resource.is-selected { border-color: var(--primary); box-shadow: 0 0 0 1px var(--primary); }
.subtitle-poster { min-width: 0; height: 100%; min-height: 158px; position: relative; display: flex; align-items: center; justify-content: center; background: var(--surface-soft); }
.subtitle-poster > .ui-icon { width: 30px; height: 30px; color: var(--muted); }
.subtitle-poster img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: var(--surface-soft); }
.subtitle-poster > span { position: absolute; left: 6px; bottom: 6px; font-size: 12px; font-weight: 600; padding: 3px 5px; background: var(--surface); color: var(--text); border: 1px solid var(--line); border-radius: 3px; }
.subtitle-card-check { position: absolute; left: 6px; top: 6px; display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; background: var(--surface); border: 1px solid var(--line); border-radius: 4px; cursor: pointer; }
.subtitle-resource-body { display: flex; flex-direction: column; align-items: start; gap: 9px; min-width: 0; padding: 13px; }
.subtitle-resource-title { border: 0; padding: 0; background: transparent; font: inherit; font-size: 13px; font-weight: 600; line-height: 1.65; text-align: left; color: var(--text); overflow-wrap: anywhere; cursor: pointer; min-height: 42px; }
.subtitle-resource-title:hover { color: var(--primary); }
.subtitle-resource-body > small { font-size: 12px; color: var(--muted); overflow-wrap: anywhere; }
.subtitle-card-actions { margin-top: auto; display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.subtitle-card-actions .button { min-height: 30px; font-size: 12px; padding: 4px 8px; }
.subtitle-folder { display: flex; align-items: center; gap: 12px; min-width: 0; min-height: 70px; padding: 12px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); color: var(--text); text-align: left; cursor: pointer; }
.subtitle-folder > .ui-icon:first-child { width: 24px; height: 24px; color: var(--icon-sky); }
.subtitle-folder span { flex: 1; font-size: 13px; overflow-wrap: anywhere; }
.subtitle-folder:hover { border-color: var(--primary); }
.subtitle-library-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 18px; font-size: 12px; color: var(--muted); }
.subtitle-library-footer > div { display: flex; gap: 8px; }
.subtitle-empty { grid-column: 1 / -1; min-height: 240px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 12px; padding: 24px; border: 1px dashed var(--line); border-radius: 8px; }
.subtitle-empty > .ui-icon { width: 36px; height: 36px; color: var(--muted); }
.subtitle-empty h3 { font-size: 16px; margin: 0; }
.subtitle-empty p { color: var(--muted); font-size: 13px; margin: 0; overflow-wrap: anywhere; }
.subtitle-empty > div { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.subtitle-settings-dialog, .subtitle-detail-dialog { width: min(760px, calc(100vw - 28px)); max-height: calc(100dvh - 40px); padding: 22px; overflow-y: auto; color: var(--text); }
.subtitle-settings-dialog .dialog-head, .subtitle-detail-dialog .dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 16px; }
.subtitle-settings-dialog .dialog-head h2, .subtitle-detail-dialog .dialog-head h2 { margin: 0; font-size: 18px; }
.subtitle-settings-dialog .system-setting-row { grid-template-columns: 120px minmax(0, 1fr); }
.subtitle-settings-dialog .system-form-footer { flex-wrap: wrap; }
.subtitle-name-test { margin: 20px 0; }
.subtitle-name-test form { margin-top: 15px; }
.subtitle-dialog-feedback { padding: 10px 0; font-size: 13px; color: var(--success); }
.subtitle-dialog-feedback.is-error { color: var(--danger); }
.subtitle-detail-status { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; overflow-wrap: anywhere; }
.subtitle-detail-dialog small { color: var(--muted); }
.subtitle-detail-dialog [data-subtitle-sync-path] { display: flex; margin-top: 16px; }
.subtitle-delivery h3 { font-size: 14px; margin: 16px 0 8px; }
.subtitle-delivery p { margin: 4px 0; overflow-wrap: anywhere; }
.subtitle-delivery .subtitle-evidence:empty { display: none; }
.subtitle-evidence { list-style: none; display: grid; gap: 12px; padding: 18px 0; margin: 0; }
.subtitle-evidence li { display: flex; align-items: start; gap: 10px; font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; }
.subtitle-evidence .ui-icon { flex: 0 0 18px; margin-top: 2px; color: var(--icon-sky); }
.subtitle-search-dialog { width: min(820px, calc(100vw - 28px)); max-height: calc(100dvh - 40px); padding: 22px; overflow-y: auto; color: var(--text); }
.subtitle-search-dialog .dialog-head { display: flex; justify-content: space-between; align-items: center; gap: 14px; }
.subtitle-search-dialog h2 { font-size: 18px; margin: 0; }
.subtitle-search-dialog h3 { font-size: 14px; overflow-wrap: anywhere; }
.subtitle-search-dialog p, .subtitle-dialog-feedback { overflow-wrap: anywhere; }
.subtitle-candidates { display: grid; gap: 10px; margin: 18px 0; }
.subtitle-candidate { display: flex; align-items: center; gap: 16px; padding: 14px; border: 1px solid var(--line); border-radius: 6px; background: var(--surface); }
.subtitle-candidate > div { flex: 1; min-width: 0; display: grid; gap: 8px; overflow-wrap: anywhere; }
.subtitle-candidate strong { font-size: 13px; }
.subtitle-candidate span, .subtitle-candidate p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.subtitle-candidate > button { flex-shrink: 0; }
.subtitle-upload { display: grid; grid-template-columns: minmax(0, 1fr) 130px auto; align-items: end; gap: 12px; border-top: 1px solid var(--line); padding-top: 16px; margin-top: 20px; }
.subtitle-upload h3 { grid-column: 1 / -1; margin: 0; }
.subtitle-upload .field { margin: 0; min-width: 0; }
.subtitle-upload input[type=file] { width: 100%; min-width: 0; font-size: 12px; }
.subtitle-upload input[type=file]::file-selector-button { color: var(--text); background: var(--surface-soft); border: 1px solid var(--line); padding: 7px; border-radius: 4px; }
.subtitle-resource-body > .subtitle-external-missing { color: var(--warning); }
@media (min-width: 761px) and (max-width: 1100px) {
  .subtitle-library-filters { grid-template-columns: repeat(2, minmax(0, 1fr)) 38px 38px; }
  .subtitle-library-filters > select:first-child, .subtitle-library-filters > select[name=scope] { grid-column: span 2; }
}
@media (max-width: 760px) {
  .subtitle-counts { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px 10px; }
  .subtitle-library-filters { grid-template-columns: minmax(0, 1fr) 38px 38px; }
  .subtitle-library-filters > select:first-child, .subtitle-library-filters > select[name=scope], .subtitle-search { grid-column: 1 / -1; }
  .subtitle-selection { gap: 8px 10px; }
  .subtitle-selection > .button { margin-left: 0; }
  .subtitle-run { grid-template-columns: minmax(0, 1fr) auto; }
  .subtitle-run progress { grid-column: 1 / -1; grid-row: 2; }
  .subtitle-settings-dialog .system-setting-row { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .subtitle-settings-dialog, .subtitle-detail-dialog { padding: 16px; }
  .subtitle-search-dialog { padding: 16px; }
  .subtitle-candidate { flex-wrap: wrap; gap: 10px; }
  .subtitle-candidate > div { flex-basis: 100%; }
  .subtitle-upload { grid-template-columns: minmax(0, 1fr); }
  .subtitle-run { grid-template-columns: minmax(0, 1fr); }
}
.system-status-line, .system-form-footer, .system-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.system-status-line { padding-top: 18px; font-size: 12px; color: var(--muted); }
.system-form-footer { justify-content: space-between; padding-top: 18px; font-size: 12px; color: var(--muted); }
.system-form-footer > div { display: flex; gap: 10px; flex-wrap: wrap; }
.system-scope, .system-facts { display: grid; gap: 12px; margin: 0; font-size: 13px; }
.system-scope > div, .system-facts > div { display: grid; grid-template-columns: 145px minmax(0, 1fr); gap: 16px; }
.system-scope dt, .system-facts dt { color: var(--muted); }
.system-scope dd, .system-facts dd { margin: 0; overflow-wrap: anywhere; line-height: 1.6; }
.system-test-results:empty { display: none; }
.system-test-results { margin-top: 16px; border-left: 3px solid var(--accent-color); padding: 4px 16px; }
.system-test-results > div { display: grid; grid-template-columns: 85px minmax(0, 1fr) 70px; gap: 12px; padding: 9px 0; font-size: 12px; }
.system-test-results small { text-align: right; font-size: 12px; color: var(--muted); }
.system-warning, .system-feedback.is-error { color: var(--danger) !important; font-size: 13px; line-height: 1.8; overflow-wrap: anywhere; }
.system-feedback { padding: 12px 16px; background: var(--surface-soft); border-left: 3px solid var(--accent-color); font-size: 13px; line-height: 1.8; overflow-wrap: anywhere; }
.system-feedback.is-error { border-color: var(--danger); }
.system-boundary { display: flex; align-items: flex-start; gap: 12px; padding: 16px 0; border-bottom: 1px solid var(--line); }
.system-boundary > .ui-icon { color: var(--accent-color); flex: 0 0 22px; margin-top: 2px; }
.system-boundary strong { display: block; font-size: 14px; margin-bottom: 6px; }
.system-details { font-size: 13px; }
.system-details summary { cursor: pointer; color: var(--muted); padding: 8px 0; }
.system-details > :not(summary) { margin: 8px 0; }
.system-access-advanced { margin-top: 12px; }
.system-access-advanced form { padding-top: 8px; }
.system-schedule-state, .system-empty { font-size: 13px; line-height: 1.8; color: var(--muted); margin: 16px 0 0; }
.system-backup-file { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: center; padding: 16px 0; border-bottom: 1px solid var(--line); }
.system-backup-file strong { font-size: 13px; }
.system-backup-file small { display: block; margin-top: 6px; color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }
.system-backup-file > div:last-child { display: flex; gap: 8px; }
[data-backup-preview] { margin-top: 20px; border-left: 3px solid var(--accent-color); padding: 0 18px; display: grid; gap: 14px; }
[data-backup-preview] h3 { font-size: 15px; margin: 0; }
[data-backup-preview] p { font-size: 13px; margin: 0; line-height: 1.8; }
.system-backup-manifest { list-style: none; padding: 0; margin: 12px 0 0; max-height: 280px; overflow: auto; }
.system-backup-manifest li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 16px; padding: 10px 0; border-bottom: 1px solid var(--line); font-size: 12px; }
.system-backup-manifest code { overflow-wrap: anywhere; white-space: normal; }
.system-backup-manifest span { color: var(--muted); }
@media (max-width: 640px) {
  .system-backup-manifest li { grid-template-columns: minmax(0, 1fr); }
  [data-backup-preview] .system-actions { flex-wrap: wrap; }
}
[data-maintenance-state] { padding: 22px 0 0; }
[data-cache-preview] { display: grid; gap: 8px; padding-top: 12px; }
[data-cache-preview] > button { justify-self: start; }
.system-about { display: flex; align-items: center; gap: 18px; padding: 24px 0; }
.system-about img { width: 56px; height: 56px; object-fit: contain; }
.system-about strong { display: block; font-size: 20px; }
.system-about div > span { color: var(--muted); font-size: 13px; }
.system-about > .badge { margin-left: auto; }
.system-permanent-badge.license-plan-badge { --license-medal-offset: 0px; width: 72px; height: 72px; flex: 0 0 72px; }
.system-medal-open { display: grid; place-items: center; padding: 0; border: 0; border-radius: 12px; background: transparent; cursor: pointer; }
.system-medal-open:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }
.system-medal-open .license-plan-medal-canvas { pointer-events: none; }
.system-medal-dialog { position: fixed; inset: 0; width: 100%; max-width: none; height: 100%; max-height: none; margin: 0; padding: 24px; border: 0; color: #f7f4ed; background: radial-gradient(ellipse 58% 54% at 50% 43%, #302316 0%, #1b1919 52%, #101116 100%); overflow: auto; }
.system-medal-dialog::backdrop { background: #08090d; }
.system-medal-dialog[open] { display: grid; place-items: center; }
.system-medal-dialog::before {
  position: fixed; inset: 0; content: ""; pointer-events: none; opacity: .85;
  background-image:
    radial-gradient(circle at 3% 9%, #d3d5df 0 1px, transparent 2px),
    radial-gradient(circle at 12% 26%, #c0c6d2 0 .7px, transparent 1.8px),
    radial-gradient(circle at 18% 57%, #e4e7ec 0 1px, transparent 2.5px),
    radial-gradient(circle at 6% 78%, #a6aebd 0 .7px, transparent 1.8px),
    radial-gradient(circle at 26% 12%, #b7bcc9 0 .8px, transparent 1.8px),
    radial-gradient(circle at 32% 34%, #d0d2d9 0 .6px, transparent 1.8px),
    radial-gradient(circle at 28% 82%, #d2d5df 0 1px, transparent 2px),
    radial-gradient(circle at 41% 7%, #d0d4db 0 1px, transparent 2px),
    radial-gradient(circle at 44% 26%, #bfc4d2 0 .7px, transparent 1.8px),
    radial-gradient(circle at 37% 65%, #f2e4cb 0 .8px, transparent 2px),
    radial-gradient(circle at 43% 91%, #c0c8d6 0 .7px, transparent 1.8px),
    radial-gradient(circle at 53% 15%, #d8d5d0 0 .6px, transparent 1.8px),
    radial-gradient(circle at 57% 77%, #dde0e7 0 1px, transparent 2.3px),
    radial-gradient(circle at 61% 5%, #c6cad5 0 .7px, transparent 1.8px),
    radial-gradient(circle at 64% 29%, #f0e2cc 0 .7px, transparent 1.8px),
    radial-gradient(circle at 67% 61%, #e5e7eb 0 1px, transparent 2.4px),
    radial-gradient(circle at 72% 12%, #aeb6c4 0 .8px, transparent 2px),
    radial-gradient(circle at 75% 48%, #d6d8dd 0 .7px, transparent 1.8px),
    radial-gradient(circle at 74% 88%, #d0d5dd 0 1px, transparent 2px),
    radial-gradient(circle at 81% 25%, #dde0e7 0 1px, transparent 2px),
    radial-gradient(circle at 83% 72%, #e7e9ed 0 1px, transparent 2.4px),
    radial-gradient(circle at 91% 8%, #aeb6c4 0 .7px, transparent 1.8px),
    radial-gradient(circle at 94% 39%, #d8dce5 0 .8px, transparent 2px),
    radial-gradient(circle at 97% 84%, #b5bdc9 0 .7px, transparent 1.8px);
}
.system-medal-close { position: fixed; top: max(20px, env(safe-area-inset-top)); right: max(20px, env(safe-area-inset-right)); z-index: 2; color: #e8e5df; background: #292a30; }
.system-medal-close:hover { background: #37383f; }
.system-medal-display { position: relative; z-index: 1; display: grid; justify-items: center; gap: 12px; text-align: center; }
.system-medal-display .license-plan-badge { --license-medal-offset: 0px; width: clamp(220px, 36vmin, 340px); height: clamp(220px, 36vmin, 340px); }
.system-medal-eyebrow { margin: 34px 0 0; color: #e4ad57; font-size: 12px; font-weight: 800; letter-spacing: .16em; }
.system-medal-display h2 { margin: 0; color: #fff; font-size: 24px; }
.system-medal-hint { margin: 4px 0 0; color: #a8a7aa; font-size: 13px; }
.system-restart-status p { margin: 8px 0; font-size: 13px; }
@media (max-width: 1024px) {
  .system-setting-row { grid-template-columns: minmax(150px, .65fr) minmax(0, 1.8fr); gap: 20px; }
}
@media (max-width: 640px) {
  .system-settings-console { gap: 26px; }
  .system-setting-row { grid-template-columns: minmax(0, 1fr); gap: 14px; padding: 18px 0; }
  .system-field-pair { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .system-scope > div, .system-facts > div { grid-template-columns: 110px minmax(0, 1fr); gap: 10px; }
  .system-form-footer > div { width: 100%; }
  .system-form-footer > div > .button { flex: 1; padding-inline: 10px; }
  .system-test-results > div { grid-template-columns: minmax(0, 1fr) 64px; gap: 7px; }
  .system-test-results > div > span { grid-column: 1 / -1; grid-row: 2; }
  .system-about { flex-wrap: wrap; gap: 12px; }
  .system-about > .badge { margin-left: 0; }
  .system-backup-file { gap: 10px; }
  .system-backup-file > div:last-child { gap: 2px; }
}

/* Module frames follow the existing navigation surface; inner controls keep their own sizes. */
:root {
  --panel-background: color-mix(in srgb, var(--surface) 94%, transparent);
  --panel-border: var(--line);
  --panel-divider: color-mix(in srgb, var(--line) 64%, transparent);
  --panel-radius: 18px;
  --panel-shadow: 0 12px 34px rgba(36, 48, 76, .08);
  --panel-padding: 22px;
  --panel-gap: 18px;
}
.main, .member-portal {
  --panel-background: color-mix(in srgb, var(--surface) 94%, transparent);
  --panel-border: var(--line);
  --panel-divider: color-mix(in srgb, var(--line) 64%, transparent);
}
.main :is(
  .tool-surface, .system-setting-section, .sites-section, .upload-account-bar,
  .upload-section:not(:has(> .upload-sources)), .plugin-workbench,
  .cloud-attention, .cloud-policy, .strm-run-entry,
  .strm-admin[data-strm-view="index"], .strm-admin[data-strm-view="cleanup"],
  .archive-board-section, .archive-task-simple > .archive-editor-section
) {
  min-width: 0;
  padding: var(--panel-padding);
  border: 1px solid var(--panel-border);
  border-radius: var(--panel-radius);
  background: var(--panel-background);
  box-shadow: var(--panel-shadow);
}
:is(.main, .member-portal) :is(
  .card, .dashboard-widget, .member-layout-widget.member-panel,
  .site-card, .cloud-account, .cloud-summary > article,
  .strm-admin-task, .log-console, .file-manager-shell, .file-manager-empty,
  .plugin-card, .archive-config-card, .archive-candidate-card,
  .profile-command-center, .media-weight-profile-nav,
  .upload-source, .metadata-audit-counts > div, .metadata-audit-item,
  .subtitle-resource, .builtin-library-card,
  .emby-overview > div, .emby-add-card,
  .archive-editor:not(.archive-task-simple), .strm-editor,
  .member-home-hero, .member-home-summary, .member-home-feed,
  .member-home-service-grid > a, .member-renew-card,
  .member-cloud-panel, .member-cloud-sessions, .member-cloud-config, .member-cloud-nodes
) {
  border-color: var(--panel-border);
  border-radius: var(--panel-radius);
  background: var(--panel-background);
  box-shadow: var(--panel-shadow);
}
.main :is(.tool-surface, .system-setting-section, .sites-section, .upload-section) :is(h2, h3) {
  letter-spacing: 0;
  overflow-wrap: anywhere;
}
.system-settings-console { gap: var(--panel-gap); }
.system-setting-section > header {
  margin: calc(-1 * var(--panel-padding)) calc(-1 * var(--panel-padding)) 0;
  padding: 16px var(--panel-padding);
  border-color: var(--panel-divider);
  border-radius: var(--panel-radius) var(--panel-radius) 0 0;
  background: color-mix(in srgb, var(--surface-soft) 35%, transparent);
}
.system-setting-row {
  grid-template-columns: minmax(140px, .6fr) minmax(0, 1.8fr);
  gap: 24px;
  padding: 20px 0;
  border: 0;
}
.system-setting-row:last-child { padding-bottom: 0; }
.system-setting-row + .system-setting-row { padding-top: 12px; }
.system-form-footer { margin-top: 4px; padding-top: 16px; border-top: 1px solid var(--panel-divider); }
.system-about { padding-bottom: 10px; }
.system-boundary { padding: 16px 18px; border: 1px solid var(--panel-border); border-radius: var(--panel-radius); background: var(--panel-background); }
.system-empty { min-height: 80px; display: grid; place-items: center; }
.system-test-results { margin-bottom: 16px; }
.system-schedule-state { margin-top: 0; }
.system-setting-section .system-status-line { padding-top: 20px; }
.system-setting-section [data-maintenance-state] { padding-top: 18px; }

.sites-controls { display: grid; gap: 16px; }
.sites-metrics, .upload-metrics { padding: 0; border: 0; gap: 14px; }
.main :is(.sites-metrics > div, .upload-stat) {
  min-width: 0;
  min-height: 100px;
  padding: 18px 20px;
  border: 1px solid var(--panel-border);
  border-radius: var(--panel-radius);
  background: var(--panel-background);
}
.sites-metrics small, .upload-stat small { overflow-wrap: anywhere; }
.sites-signin { max-width: none; }
.sites-section .sites-empty { min-height: 160px; }
.sites-section .sites-toolbar:last-child { margin-bottom: 0; }
.main .upload-account-bar { padding-block: 14px; }
.upload-results dl { gap: 20px; }
.upload-section-head { min-height: 36px; }
.upload-settings { gap: var(--panel-gap); }
.upload-section .upload-search { background: var(--ui-background); }
.upload-section .upload-pagination { margin-top: 6px; border-top: 1px solid var(--panel-divider); }
.upload-section .upload-list-head { border-radius: 5px; border-bottom: 0; }
.upload-source:last-child, .site-card:last-child { margin-bottom: 0; }

.main .plugin-workbench { margin-bottom: 20px; }
.plugin-workbench-filters { margin-bottom: 12px; }
.plugin-diagnostics { border-color: var(--panel-divider); }
.main .cloud-policy { margin-top: var(--panel-gap); padding-block: 0; }
.cloud-policy > summary { padding-block: 18px; }
.cloud-policy > form { max-width: none; padding-bottom: var(--panel-padding); }
.cloud-records > .cloud-toolbar { margin-top: 0; }
.cloud-records .cloud-empty { border: 0; }
.main .strm-run-entry { margin-bottom: var(--panel-gap); }
.strm-admin[data-strm-view="index"] > .strm-admin-head,
.strm-admin[data-strm-view="cleanup"] > .strm-admin-head { margin-top: 0; }
[data-archive-board] { display: grid; gap: var(--panel-gap); }
.archive-board-columns { gap: var(--panel-gap); }
.archive-board-section .archive-board-row:first-of-type,
.archive-board-section .archive-board-recent:first-of-type { border-top: 0; }
.archive-task-simple > .archive-editor-section { margin-bottom: var(--panel-gap); }
.main .archive-task-simple .archive-editor-section { padding: var(--panel-padding); }

.main .builtin-library-card { border: 1px solid var(--panel-border); border-radius: var(--panel-radius); background: var(--panel-background); }
.builtin-library-card .builtin-library-art { border: 0; border-radius: calc(var(--panel-radius) - 1px) calc(var(--panel-radius) - 1px) 0 0; }
.builtin-library-card .builtin-library-actions { padding: 8px 12px; }
.main .recommend-console > .recommend-search {
  padding: 14px 16px;
  border: 1px solid var(--panel-border);
  border-radius: var(--panel-radius);
  background: var(--panel-background);
}
.main .fm-shell { border: 1px solid var(--panel-border); background: var(--panel-background); }
.main .log-center .log-console { border-color: var(--panel-border); }
.member-layout-widget .member-account-hero,
.member-layout-widget .member-audit-heading { border-bottom-color: var(--panel-divider); }
.dashboard-widget .dashboard-section-head { margin-bottom: 18px; }
.dashboard-widget[data-widget-size="small"] { min-height: 340px; }
.dashboard-server-uptime { margin: -8px 0 16px; color: var(--muted); font-size: 12px; }
.dashboard-server-row { --meter-color: var(--dashboard-cyan); min-width: 0; margin-bottom: 16px; }
.dashboard-server-row[data-server-row="memory"] { --meter-color: var(--success); }
.dashboard-server-row[data-server-row="process"] { --meter-color: var(--warning); }
.dashboard-server-row > div:first-child { display: flex; align-items: baseline; flex-wrap: wrap; gap: 5px 8px; min-width: 0; }
.dashboard-server-row strong { font-size: 13px; font-weight: 600; }
.dashboard-server-row > div > span { flex: 1; min-width: 0; color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }
.dashboard-server-row > div > span.dashboard-cpu-cores { flex: 0 0 auto; white-space: nowrap; }
.dashboard-server-row b { font-size: 12px; font-weight: 550; font-variant-numeric: tabular-nums; }
.dashboard-server-row > div > b { margin-left: auto; color: var(--meter-color); }
.dashboard-server-row small { display: block; margin-top: 5px; color: var(--muted); font-size: 12px; }
.dashboard-server-row progress { display: block; appearance: none; width: 100%; height: 6px; margin-top: 8px; border: 0; border-radius: 3px; overflow: hidden; background: var(--surface-soft); }
.dashboard-server-row progress::-webkit-progress-bar { background: var(--surface-soft); }
.dashboard-server-row progress::-webkit-progress-value { background: var(--meter-color); border-radius: 3px; }
.dashboard-server-row progress::-moz-progress-bar { background: var(--meter-color); border-radius: 3px; }
.dashboard-server-row progress.is-unavailable { opacity: .45; }
.dashboard-server-network { margin-bottom: 0; }
.dashboard-network-rates b { color: inherit; font-weight: 550; }
.dashboard-widget[data-widget-size="small"] .dashboard-optional-actions { gap: 3px; }
.dashboard-optional-actions > [data-tone="danger"] { color: var(--danger); }
.dashboard-widget[data-widget-size="small"] .dashboard-summary-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding-bottom: 12px; }
.dashboard-widget[data-widget-size="small"] .dashboard-summary-metric strong { font-size: 22px; }
[data-optional-module="tasks"] .dashboard-module-rows { display: grid; gap: 0; }
[data-optional-module="tasks"] .dashboard-module-row { min-height: 80px; gap: 9px; }
[data-optional-module="tasks"] .dashboard-module-row-copy { flex: 1; }
[data-optional-module="tasks"] .dashboard-module-row-copy strong { font-weight: 600; }
[data-optional-module="tasks"] .dashboard-module-row:last-child { border-bottom: 0; }
.dashboard-task-icon { display: grid; place-items: center; flex: 0 0 30px; height: 30px; color: var(--primary); background: var(--primary-soft); border-radius: 6px; }
.dashboard-task-icon .ui-icon { width: 17px; height: 17px; }
.dashboard-task-history { display: flex; flex: 0 0 12px; color: var(--muted); }
.dashboard-task-history .ui-icon { width: 12px; height: 16px; }
[data-optional-module="services"] .dashboard-module-rows { max-height: 180px; overflow-y: auto; scrollbar-width: thin; }
[data-optional-module="services"] .dashboard-module-row { min-height: 54px; padding-block: 8px; }
.dashboard-trend { position: relative; min-width: 0; height: 172px; margin-top: 16px; }
.dashboard-trend canvas { display: block; width: 100%; max-width: 100%; height: 100%; }
.dashboard-trend-data { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.dashboard-trend-empty { position: absolute; inset: 0 0 28px; display: grid; place-items: center; color: var(--muted); font-size: 12px; pointer-events: none; }
.dashboard-trend.is-chart-unavailable { height: auto; }
.dashboard-trend.is-chart-unavailable canvas, .dashboard-trend.is-chart-unavailable .dashboard-trend-empty { display: none; }
.dashboard-trend.is-chart-unavailable .dashboard-trend-data { position: static; width: auto; height: auto; clip-path: none; white-space: normal; font-size: 12px; color: var(--muted); line-height: 1.8; }
[data-optional-module="trend"] .dashboard-summary-metric[data-tone="cyan"] > span::before,
[data-optional-module="trend"] .dashboard-summary-metric[data-tone="green"] > span::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 5px; background: var(--dashboard-cyan); border-radius: 2px; }
[data-optional-module="trend"] .dashboard-summary-metric[data-tone="green"] > span::before { background: var(--success); }
@media (min-width: 1281px) and (max-width: 1600px) {
  .dashboard-widget[data-widget-size="small"] { flex-basis: calc(50% - 8px); }
}

@media (min-width: 1440px) {
  .system-settings-console:is([data-system-view="network"], [data-system-view="maintenance"], [data-system-view="about"]) {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
  }
  .system-settings-console > .system-feedback { grid-column: 1 / -1; }
  .sites-console[data-sites-view="signin"] { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
  .sites-console[data-sites-view="signin"] > :is(.settings-navigation, .sites-runtime, .sites-feedback) { grid-column: 1 / -1; }
  .sites-console[data-sites-view="signin"] > :is(.sites-signin, .sites-section) { height: 100%; }
  .sites-signin > .sites-section { height: 100%; }
}
@media (max-width: 760px) {
  :root { --panel-padding: 16px; --panel-gap: 14px; }
  .main :is(.sites-metrics > div, .upload-stat) { min-height: 92px; padding: 14px; gap: 10px; }
  .system-setting-row { grid-template-columns: minmax(0, 1fr); gap: 12px; padding-block: 18px; }
  .system-setting-row + .system-setting-row { padding-top: 10px; }
  .system-setting-section > header { padding-block: 14px; }
  .system-setting-section h2 { font-size: 16px; }
  .sites-metrics, .upload-metrics { gap: 10px; }
  .upload-stat > span { flex-basis: 28px; height: 28px; }
  .sites-metrics > div > .ui-icon { width: 18px; flex-shrink: 0; }
  .main .upload-account-bar { gap: 10px; }
  .upload-account-bar > div:last-child { width: 100%; justify-content: flex-end; }
  .main .recommend-console > .recommend-search { padding: 12px; }
}
.plugin-form-result {
  flex: 1 0 100%;
  min-width: 0;
  max-width: 100%;
  margin: 10px 0 0;
  overflow-wrap: anywhere;
}

/* Light media surfaces need their own scrim, not a dark-to-white fade. */
:root[data-theme="porcelain"] {
  --media-light-shade: linear-gradient(180deg, rgba(246,247,249,.1) 0%, rgba(246,247,249,.45) 35%, rgba(246,247,249,.92) 76%, var(--bg) 100%), linear-gradient(90deg, rgba(246,247,249,.94), rgba(246,247,249,.34) 72%, rgba(246,247,249,.25));
  --ui-shadow-sm: 0 6px 18px rgba(16,24,40,.08);
  --ui-shadow-lg: 0 24px 64px rgba(16,24,40,.16);
}
:root[data-theme="porcelain"] :is(.recommend-hero-overlay, .recommendation-detail-backdrop-shade, .member-discovery-hero-shade, .discovery-feature-shade) {
  background: var(--media-light-shade);
}
:root[data-theme="porcelain"] :is(.recommend-hero-layers, .recommendation-detail-backdrop, .member-discovery-hero, .discovery-feature-art) {
  background: var(--bg);
}
:root[data-theme="porcelain"] :is(.recommend-hero-layer, .recommendation-detail-backdrop img) { filter: none; }
:root[data-theme="porcelain"] .recommendation-detail-backdrop img { opacity: 1; }
:root[data-theme="porcelain"] :is(.recommend-hero, .recommendation-detail-hero, .member-discovery-hero, .main.recommend-main .page-head) { color: var(--text); }
:root[data-theme="porcelain"] :is(.recommend-hero-copy h2, .recommendation-detail-hero-copy h1, .member-discovery-hero-copy h1, .discovery-feature .discovery-heading h2) { color: var(--text); }
:root[data-theme="porcelain"] :is(.recommend-hero-copy > span, .recommend-hero-copy p, .recommend-no-channels, .recommendation-detail-eyebrow, .recommendation-detail-overview, .member-discovery-hero-copy p, .discovery-feature .discovery-heading span, .discovery-feature .discovery-heading p) { color: #465160; }
:root[data-theme="porcelain"] :is(.member-discovery-hero-copy > span, .member-discovery-heading > div > span, .member-settings-hero > div > span) { color: var(--icon-teal); }
:root[data-theme="porcelain"] .discovery-feature .discovery-heading > div { color: var(--text); text-shadow: none; }
:root[data-theme="porcelain"] .discovery-feature .discovery-feature-facts { color: var(--warning); }
:root[data-theme="porcelain"] .recommend-filter-panel a,
:root[data-theme="porcelain"] .recommend-filter-panel > div > .recommend-filter-default { color: #465160; }
:root[data-theme="porcelain"] .recommend-filter-panel a:is(:hover, .active),
:root[data-theme="porcelain"] .recommend-filter-panel > div > .recommend-filter-default:is(:hover, .active) { color: var(--primary); background: var(--primary-soft); }
:root[data-theme="porcelain"] :is(.member-recommend-search, .member-recommend-filter-panel) {
  border-color: var(--line); background: var(--surface); box-shadow: var(--shadow);
}
:root[data-theme="porcelain"] :is(.recommend-mobile-filter-bar > button, .recommend-mobile-filter-bar > div span, .recommend-mobile-filter-bar > div em, .recommendation-detail-facts span, .recommendation-detail-actions .button, .member-discovery-hero-copy .button, .discovery-feature-actions .button.secondary, .discovery-feature .discovery-heading > a) {
  color: var(--text); border-color: var(--line); background: color-mix(in srgb, var(--surface) 92%, transparent); box-shadow: none;
}
:root[data-theme="porcelain"] .recommend-mobile-filter-bar { border-color: var(--line); }
:root[data-theme="porcelain"] .recommend-mobile-filter-bar > div span.is-default { color: var(--muted); }
:root[data-theme="porcelain"] .recommendation-detail-actions .button:hover { color: var(--primary); border-color: var(--primary); background: var(--primary-soft); }
:root[data-theme="porcelain"] .recommendation-detail-topbar { background: linear-gradient(180deg, rgba(246,247,249,.75), transparent); }
:root[data-theme="porcelain"] .recommendation-detail-topbar .dialog-close { color: var(--text); background: var(--surface); box-shadow: var(--ui-shadow-xs); }
:root[data-theme="porcelain"] .recommendation-detail-topbar .dialog-close:hover { color: var(--primary); background: var(--primary-soft); }
:root[data-theme="porcelain"] .main.recommend-main .page-head .tool-icon { color: var(--text); border-color: var(--line); background: color-mix(in srgb, var(--surface) 90%, transparent); }
:root[data-theme="porcelain"] .main.recommend-main .page-head .tool-icon:hover { color: var(--primary); background: var(--primary-soft); }
:root[data-theme="porcelain"] .member-portal-discovery .member-portal-head { color: var(--text); background: linear-gradient(180deg, rgba(246,247,249,.98), rgba(246,247,249,.84) 62%, transparent); }
:root[data-theme="porcelain"] .member-portal-discovery :is(.member-portal-brand-name, .member-portal-user > span, .member-portal-head > nav a) { color: var(--text); }
:root[data-theme="porcelain"] .member-portal-discovery .member-portal-head > nav a:is(:hover, .active) { color: var(--primary); background: var(--primary-soft); }
:root[data-theme="porcelain"] .member-portal-discovery .member-portal-head .button.secondary { color: var(--text); border-color: var(--line); background: var(--surface); }
:root[data-theme="porcelain"] .member-portal-discovery .member-portal-head > nav { border-color: var(--line); background: color-mix(in srgb, var(--surface) 92%, transparent); box-shadow: var(--card-shadow); }
:root[data-theme="porcelain"] .member-portal-discovery .member-portal-brand small { color: var(--muted); }
:root[data-theme="porcelain"] .recommend-poster { background: var(--surface-soft); box-shadow: var(--card-shadow); }
:root[data-theme="porcelain"] .recommendation-detail-poster { box-shadow: var(--card-hover-shadow); }
:root[data-theme="porcelain"] :is(.one15-upload-hero-status > span, .one15-status.completed, .one15-source-card.enabled header em, .qbittorrent-pipeline-state.ready, .reverse-legacy-state, .recommendation-subscription-source > header > span.ready) { color: var(--success); background: var(--success-soft); }
:root[data-theme="porcelain"] :is(.one15-upload-hero-status.warning > span, .member-cloud-operation.warning > span, .qbittorrent-mapping-row > span, .qbittorrent-pipeline-state.warning, .one15-choice.danger:has(input:checked) .one15-choice-icon) { color: var(--warning); background: color-mix(in srgb, var(--warning) 10%, var(--surface)); }
:root[data-theme="porcelain"] :is(.member-cloud-operation.warning em, .member-cloud-node-storage.warning > header b, .file-favorite.active, .archive-history-action.warning, .archive-episode-item.needs-review > b) { color: var(--warning); }
:root[data-theme="porcelain"] :is(.member-home-service-grid > a > span.cloud, .connection-bound.telegram) { color: var(--icon-sky); background: color-mix(in srgb, var(--icon-sky) 10%, var(--surface)); }

:root .recommend-filter-panel nav.recommend-provider-tabs a { color: var(--muted); font-weight: 600; }
:root .recommend-filter-panel nav.recommend-provider-tabs a:hover { color: var(--text); background: color-mix(in srgb, var(--text) 6%, transparent); }
:root .recommend-filter-panel nav.recommend-provider-tabs a.active { color: var(--text); border-left-color: var(--primary); background: color-mix(in srgb, var(--primary) 18%, transparent); font-weight: 700; }
.archive-source-choices {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.archive-source-choices > label { min-width: 0; height: 100%; }
.strm-source-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 20px 28px; border: 0; }
.strm-source-choices legend { padding-top: 16px; font-weight: 700; }
.strm-source-choices .archive-choice-card { height: 100%; border-radius: 8px; }
.strm-editor [hidden] { display: none !important; }
.strm-editor.is-p115 .strm-path-pipeline { grid-template-columns: minmax(0, 1fr); }
@media (max-width: 560px) {
  .strm-source-choices { padding: 16px; gap: 8px; }
  .strm-source-choices .archive-choice-card { padding: 10px 6px; display: flex; flex-direction: column; gap: 6px; text-align: center; }
  .strm-source-choices .archive-choice-card strong { font-size: 13px; }
  .strm-source-choices .archive-choice-card small { display: none; }
}
.archive-source-choices strong, .archive-source-choices small { overflow-wrap: anywhere; }
.archive-task-simple.is-p115 .archive-operation-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.archive-task-simple [hidden] { display: none !important; }
@media (max-width: 560px) {
  .archive-source-choices { gap: 6px; }
  .archive-source-choices .archive-choice-card { display: flex; padding: 10px 6px; gap: 5px; flex-direction: column; justify-content: center; text-align: center; }
  .archive-source-choices .archive-choice-card strong { font-size: 14px; white-space: nowrap; }
  .archive-source-choices small { display: none; }
}
.playback-replica-settings { padding: 20px 0; }
.playback-replica-settings .settings-section-head { flex-wrap: wrap; }
.playback-replica-settings .settings-section-head h2 { font-size: 16px; }
.playback-replica-settings .field { min-width: 0; margin: 16px 0; }
.playback-replica-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 16px 0; }
.playback-replica-facts dt { font-size: 12px; opacity: .7; margin-bottom: 6px; }
.playback-replica-facts dd { margin: 0; font-size: 14px; overflow-wrap: anywhere; }
@media (max-width: 600px) { .playback-replica-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Built-in media management: clear status, compact content and scoped editing. */
.builtin-item-actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0; }
.builtin-player-dialog { width: min(1180px, calc(100vw - 32px)); max-width: none; max-height: calc(100dvh - 32px); padding: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 16px; color: var(--text); background: #090b12; box-shadow: 0 24px 90px #000b; }
.builtin-player-dialog[open] { display: flex; flex-direction: column; }
.builtin-player-dialog::backdrop { background: rgba(2,3,8,.84); backdrop-filter: blur(6px); }
.builtin-player-shell { display: flex; min-height: 0; flex-direction: column; }
.builtin-player-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 16px 20px 14px; border-bottom: 1px solid var(--line); background: var(--surface); }
.builtin-player-head h2 { margin: 2px 0 4px; font-size: 19px; }
.builtin-player-head p { margin: 0; }
.builtin-player-kicker { color: var(--accent-color); font-size: 12px; letter-spacing: .12em; text-transform: uppercase; }
.builtin-player-head-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.builtin-player-head-actions .button { margin: 0; }
.builtin-player-stage { display: grid; min-height: 0; place-items: center; padding: 18px; background: #050608; }
.builtin-player-stage video { display: block; width: 100%; max-height: min(70vh, 760px); border-radius: 8px; background: #000; }
.builtin-player-status { margin: 10px 0 0; color: var(--muted); font-size: 12px; line-height: 1.6; }
.builtin-player-dialog .builtin-player-status { margin: 0; padding: 0 20px 15px; background: var(--surface); }
@media (max-width: 600px) { .builtin-player-dialog { width: calc(100vw - 16px); max-height: calc(100dvh - 16px); border-radius: 12px; } .builtin-player-head { padding: 13px 14px; } .builtin-player-head h2 { font-size: 16px; } .builtin-player-head-actions .button { padding: 8px 10px; font-size: 12px; } .builtin-player-stage { padding: 8px; } .builtin-player-dialog .builtin-player-status { padding: 0 14px 12px; } }
.builtin-issue-tags { display: flex; flex-wrap: wrap; gap: 5px; margin: 8px 0; }
.builtin-issue-tags span { display: inline-flex; padding: 3px 7px; border-radius: 5px; font-size: 12px; line-height: 1.4; color: var(--muted); background: var(--surface-soft); border: 1px solid var(--line); }
.builtin-item-overview.is-collapsed { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.builtin-text-action { display: inline-block; border: 0; padding: 6px 0; background: none; color: var(--accent-color); font: inherit; font-size: 13px; cursor: pointer; text-align: left; }
.builtin-text-action:hover { text-decoration: underline; }
.builtin-metadata-note, .actor-scope-note { color: var(--muted); font-size: 12px; line-height: 1.7; }
.builtin-metadata-source-note { margin: 14px 0; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; font-size: 12px; color: var(--muted); }
.builtin-metadata-source-note summary { color: var(--text); cursor: pointer; }
.builtin-metadata-source-note p { line-height: 1.7; }
.builtin-metadata-source-note a { color: var(--accent-color); }
.builtin-metadata-path { overflow-wrap: anywhere; }
.builtin-item-cast h3 small { display: inline-block; margin-left: 10px; color: var(--muted); font-weight: 400; font-size: 12px; }
.builtin-cast-list.is-collapsed > :nth-child(n+7) { display: none; }
.builtin-item-editor, .builtin-item-checks { scroll-margin-top: 24px; }
.builtin-subtitle-list { margin: 16px 0; border-block: 1px solid var(--line); padding: 14px 0; }
.builtin-subtitle-list summary { cursor: pointer; font-size: 13px; }
.builtin-subtitle-list ul { padding: 0; list-style: none; }
.builtin-subtitle-list li { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 12px; }
.builtin-subtitle-list li div { min-width: 0; }
.builtin-subtitle-list li strong, .builtin-subtitle-list li small { display: block; font-size: 12px; overflow-wrap: anywhere; }
.builtin-subtitle-list li small { margin-top: 4px; color: var(--muted); }
.builtin-subtitle-list li a { flex-shrink: 0; color: var(--accent-color); font-size: 12px; }
.builtin-reset-form { padding: 16px; border: 1px solid var(--line); border-radius: 10px; }
.builtin-reset-form label { display: grid; gap: 8px; margin-bottom: 12px; }
.builtin-import-fields { display: flex; flex-wrap: wrap; gap: 10px 16px; margin: 12px 0; padding: 12px; border: 1px solid var(--line); border-radius: 8px; }
.builtin-import-fields legend { font-size: 13px; }
.builtin-import-fields label { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; }
.builtin-import-fields input { width: auto; margin: 0; }
.builtin-import-fields p { flex-basis: 100%; margin: 0; color: var(--muted); font-size: 12px; }
.actor-crop-controls { border: 0; margin: 14px 0 0; padding: 0; }
.actor-crop-controls legend { margin-bottom: 8px; color: var(--muted); font-size: 12px; }
.actor-crop-controls label { display: grid; grid-template-columns: 36px minmax(0, 1fr); align-items: center; gap: 12px; color: var(--muted); font-size: 12px; }
.actor-crop-controls input { padding: 0; width: 100%; accent-color: var(--accent-color); }
.actor-scope-note { margin: 14px 0 0; }
@media (max-width: 600px) {
  .builtin-item-actions .button { flex: 1 1 auto; font-size: 12px; }
  .builtin-cast-list.is-collapsed > :nth-child(n+4) { display: none; }
  .builtin-item-cast h3 small { display: block; margin: 6px 0 0; }
  .actor-dialog-head { padding: 18px 18px 0; }
  .actor-dialog-body { padding: 18px; }
  .actor-upload-zone { padding: 18px 12px; }
  .actor-preview-ring { width: 80px; height: 80px; margin-bottom: 12px; }
}
.builtin-actor-dialog [hidden] { display: none; }

.builtin-service-check-row { display: grid; grid-template-columns: minmax(120px, 1fr) auto; gap: 6px 16px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.builtin-service-check-row strong { font-size: 13px; }
.builtin-service-check-row > span { font-size: 12px; color: var(--muted); }
.builtin-service-check-row[data-state="passed"] > span { color: var(--success); }
.builtin-service-check-row[data-state="failed"] > span { color: var(--danger); }
.builtin-service-check-row p { grid-column: 1 / -1; margin: 0; font-size: 12px; color: var(--muted); line-height: 1.6; overflow-wrap: anywhere; }
.builtin-service-check .settings-section-head { flex-wrap: wrap; }
.builtin-migration-strategy { display: grid; gap: 12px; margin: 20px 0; padding: 16px; border: 1px solid var(--line); border-radius: 10px; }
.builtin-migration-strategy legend { padding: 0 6px; font-size: 13px; }
.builtin-migration-strategy label { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.builtin-migration-strategy input { width: auto; margin: 0; }
.builtin-migration-strategy p { margin: 0; font-size: 12px; line-height: 1.6; color: var(--muted); }
.builtin-migration-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(85px, 1fr)); gap: 12px; margin: 16px 0; padding: 16px; background: var(--surface-soft); border-radius: 10px; }
.builtin-migration-stats strong, .builtin-migration-stats small { display: block; }
.builtin-migration-stats strong { font-size: 18px; }
.builtin-migration-stats small { margin-top: 5px; font-size: 12px; color: var(--muted); }
.builtin-migration-conflict { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 12px; padding: 10px; border: 1px solid var(--line); border-radius: 8px; }
.builtin-migration-card [data-migration-status] { font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; }
.builtin-migration-card [data-migration-result] { margin-bottom: 16px; }
.builtin-migration-card [data-migration-result] > p { font-size: 12px; line-height: 1.7; }
.builtin-migration-card [hidden] { display: none; }
/* Per-library settings: fixed chrome, independently scrolling content. */
.builtin-library-settings-dialog { width: min(820px, calc(100vw - 32px)); height: min(780px, calc(100dvh - 40px)); max-height: calc(100dvh - 40px); padding: 0; overflow: hidden; }
.builtin-library-settings-dialog .dialog-head { padding: 22px 26px 18px; margin: 0; align-items: center; border: 0; }
.builtin-library-heading { display: flex; align-items: center; gap: 14px; min-width: 0; }
.builtin-library-heading > div { min-width: 0; }
.builtin-library-heading-icon { width: 44px; height: 44px; flex-shrink: 0; display: grid; place-items: center; border: 1px solid color-mix(in srgb, var(--primary) 25%, var(--line)); border-radius: 13px; color: var(--primary); background: var(--primary-soft); }
.builtin-library-heading-icon .ui-icon { width: 22px; height: 22px; }
.builtin-library-settings-dialog .dialog-head h2 { margin: 0; font-size: 19px; line-height: 1.4; }
.builtin-library-settings-dialog .dialog-head p { margin: 3px 0 0; font-size: 13px; overflow-wrap: anywhere; }
.builtin-library-tabs { flex: 0 0 auto; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 4px; margin: 0 26px 20px; padding: 5px; border: 1px solid var(--line); background: color-mix(in srgb, var(--surface-strong) 65%, var(--surface)); border-radius: 12px; }
.builtin-library-tabs button { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 40px; padding: 8px 6px; border: 1px solid transparent; background: transparent; color: var(--muted); border-radius: 8px; font: inherit; font-size: 13px; font-weight: 550; white-space: nowrap; cursor: pointer; transition: background .15s ease, color .15s ease; }
.builtin-library-tabs .ui-icon { width: 16px; height: 16px; flex-shrink: 0; }
.builtin-library-tabs button:hover { color: var(--text); background: var(--primary-soft); }
.builtin-library-tabs button[aria-selected="true"] { border-color: color-mix(in srgb, var(--primary) 32%, var(--line)); background: var(--primary-soft); color: var(--primary); box-shadow: 0 2px 5px rgba(0,0,0,.08); }
.builtin-library-tabs button:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.builtin-library-settings-dialog > form { display: flex; flex-direction: column; flex: 1; min-height: 0; margin: 0; }
.builtin-library-settings-body { flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; scrollbar-gutter: stable; padding: 22px 20px 24px 26px; border-top: 1px solid var(--line); background: color-mix(in srgb, var(--surface-strong) 30%, var(--surface)); }
.builtin-library-settings-body [hidden], .builtin-library-settings-dialog [hidden] { display: none !important; }
.builtin-library-section-head { margin-bottom: 18px; }
.builtin-library-section-head h3 { margin: 0 0 5px; font-size: 16px; line-height: 1.5; font-weight: 650; }
.builtin-library-section-head p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.7; }
.builtin-library-settings-card { min-width: 0; padding: 18px 20px; margin: 0 0 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); }
.builtin-library-settings-card h4 { font-size: 13px; font-weight: 600; margin: 0 0 12px; }
.builtin-library-settings-body .field { display: grid; gap: 9px; margin: 0; min-width: 0; }
.builtin-library-settings-body .field + .field { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--line); }
.builtin-library-settings-body .field > label { margin: 0; font-size: 14px; font-weight: 600; }
.builtin-library-settings-body .field textarea { resize: vertical; min-height: 90px; max-height: 220px; line-height: 1.6; font-size: 13px; }
.builtin-library-settings-body .ui-select-trigger { min-height: 42px; }
.builtin-library-settings-body .help { display: block; margin: 0; line-height: 1.7; color: var(--muted); font-size: 12px; font-weight: 400; }
.builtin-library-settings-card > .help { margin-top: 12px; }
.builtin-library-settings-card-options { padding: 0 20px; }
.builtin-library-settings-dialog .builtin-library-option { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 19px 0; margin: 0; border: 0; cursor: pointer; }
.builtin-library-option + .builtin-library-option { border-top: 1px solid var(--line); }
.builtin-library-option > span { display: grid; gap: 5px; min-width: 0; }
.builtin-library-option strong { font-size: 14px; font-weight: 600; line-height: 1.5; }
.builtin-library-option small { color: var(--muted); font-size: 12px; font-weight: 400; line-height: 1.7; }
.builtin-library-option input[role="switch"] { appearance: none; position: relative; flex: 0 0 40px; width: 40px; height: 23px; min-height: 23px; margin: 0; padding: 0; border: 1px solid color-mix(in srgb, var(--muted) 45%, var(--line)); border-radius: 20px; background: color-mix(in srgb, var(--muted) 24%, var(--surface)); cursor: pointer; transition: background .15s ease, border-color .15s ease; }
.builtin-library-option input[role="switch"]::after { content: ''; position: absolute; width: 15px; height: 15px; left: 3px; top: 3px; background: var(--muted); border-radius: 50%; transition: transform .15s ease, background .15s ease; }
.builtin-library-option input[role="switch"]:checked { background: var(--primary); border-color: var(--primary); }
.builtin-library-option input[role="switch"]:checked::after { transform: translateX(17px); background: #fff; }
.builtin-library-option input[role="switch"]:focus-visible { outline: 2px solid var(--primary); outline-offset: 4px; }
.builtin-library-option:has(input:disabled) { opacity: .55; cursor: wait; }
.builtin-library-settings-card-action { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 14px 0; border-top: 1px solid var(--line); }
.builtin-library-settings-card-action p { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.7; }
.builtin-library-settings-card-action .button { flex-shrink: 0; font-size: 12px; min-height: 36px; padding: 8px 12px; }
.builtin-library-note { display: flex; align-items: flex-start; gap: 9px; margin: 16px 2px 0; color: var(--muted); font-size: 12px; line-height: 1.8; }
.builtin-library-note > .ui-icon { width: 15px; height: 15px; flex-shrink: 0; margin-top: 3px; }
.builtin-library-settings-footer { flex: 0 0 auto; display: flex; align-items: center; justify-content: flex-end; gap: 16px; padding: 16px 26px; border-top: 1px solid var(--line); background: var(--surface); }
.builtin-library-settings-footer p { flex: 1; min-width: 0; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
.builtin-library-footer-actions { display: flex; gap: 10px; flex-shrink: 0; }
.builtin-library-footer-actions .button { min-height: 40px; font-size: 13px; padding: 9px 16px; }
.builtin-library-source { display: grid; gap: 7px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 8px; background: color-mix(in srgb, var(--surface-strong) 55%, var(--surface)); }
.builtin-library-source + .builtin-library-source { margin-top: 10px; }
.builtin-library-source strong { font-size: 13px; font-weight: 600; }
.builtin-library-source code { overflow-wrap: anywhere; color: var(--muted); font-size: 12px; }
.builtin-library-source small { color: var(--muted); font-size: 12px; line-height: 1.6; }
.builtin-library-refresh-fields { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; border: 0; padding: 0; margin: 20px 0 10px; min-width: 0; }
.builtin-library-refresh-fields legend { font-size: 13px; font-weight: 600; margin-bottom: 10px; padding: 0; }
.builtin-library-refresh-fields label { display: flex; gap: 8px; align-items: center; margin: 0; padding: 9px 10px; border: 1px solid var(--line); border-radius: 8px; font-size: 12px; font-weight: 400; cursor: pointer; }
.builtin-library-refresh-fields label:has(input:checked:not(:disabled)) { background: var(--primary-soft); border-color: color-mix(in srgb, var(--primary) 30%, var(--line)); }
.builtin-library-refresh-fields label:has(input:disabled) { opacity: .45; cursor: not-allowed; }
.builtin-library-refresh-fields input { width: 15px; height: 15px; min-height: 15px; padding: 0; margin: 0; accent-color: var(--primary); flex-shrink: 0; }
.builtin-library-refresh-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.builtin-library-refresh-actions .button { min-height: 38px; font-size: 12px; }
.builtin-library-result { display: grid; gap: 5px; padding: 12px 0; border-top: 1px solid var(--line); overflow-wrap: anywhere; font-size: 12px; line-height: 1.6; }
.builtin-library-result span { color: var(--muted); }
.builtin-library-result[data-state="failed"] span { color: var(--danger); }
.builtin-library-group-results:empty, [data-library-refresh-preview]:empty { display: none; }
.builtin-library-group-results { padding-bottom: 14px; font-size: 12px; line-height: 1.7; }
.builtin-library-group-results > p { margin: 0 0 10px; padding: 10px 12px; background: var(--primary-soft); border-radius: 8px; }
[data-library-refresh-preview] { margin-top: 14px; padding: 12px; border-radius: 8px; background: var(--primary-soft); font-size: 13px; line-height: 1.7; }
[data-library-job-status] { margin: 8px 0; color: var(--muted); font-size: 13px; line-height: 1.8; }
.builtin-version-list { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: 18px 0; }
.builtin-version-list a { max-width: 100%; overflow-wrap: anywhere; white-space: normal; }
.builtin-version-list a[aria-current="true"] { border-color: var(--accent-color); }
.builtin-media-info { margin: 22px 0 0; padding-top: 18px; border-top: 1px solid var(--line); }
.builtin-media-info h3 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 15px; }
.builtin-media-info h3 .ui-icon { width: 17px; height: 17px; color: var(--primary); }
.builtin-probe-note { margin: 7px 0 14px; color: var(--muted); font-size: 12px; line-height: 1.7; overflow-wrap: anywhere; }
.builtin-media-technical { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 0 0 14px; }
.builtin-media-technical > div { min-width: 0; padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-soft); }
.builtin-media-technical dt { color: var(--muted); font-size: 12px; }
.builtin-media-technical dd { margin: 4px 0 0; font-size: 13px; font-weight: 600; overflow-wrap: anywhere; }
.builtin-stream-list { display: grid; gap: 7px; }
.builtin-stream-row { display: grid; grid-template-columns: 92px minmax(0, 1fr); gap: 10px; align-items: start; padding: 9px 11px; border: 1px solid var(--line); border-radius: 8px; background: color-mix(in srgb, var(--surface-strong) 45%, var(--surface)); font-size: 12px; line-height: 1.6; }
.builtin-stream-row strong { color: var(--text); font-size: 12px; }
.builtin-stream-row span { color: var(--muted); overflow-wrap: anywhere; }
.builtin-media-info-job-card { padding-bottom: 14px; }
.builtin-media-info-job-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.builtin-media-info-job-head h4 { margin: 0; }
.builtin-media-info-job-card [data-library-media-info-summary] { margin: 4px 0 10px; overflow-wrap: anywhere; }
.builtin-media-info-job-card [data-library-media-info-jobs] { max-height: 250px; overflow: auto; padding-right: 4px; }
@media (max-width: 600px) {
  .builtin-library-settings-dialog { width: calc(100vw - 16px); height: calc(100dvh - 24px); max-height: calc(100dvh - 24px); border-radius: 16px; }
  .builtin-library-settings-dialog .dialog-head { padding: 18px 16px 16px; }
  .builtin-library-settings-dialog .dialog-head h2 { font-size: 17px; }
  .builtin-library-heading { gap: 10px; }
  .builtin-library-heading-icon { width: 38px; height: 38px; }
  .builtin-library-tabs { margin: 0 12px 14px; gap: 2px; padding: 4px; }
  .builtin-library-tabs button { flex-direction: column; gap: 5px; font-size: 12px; padding: 7px 1px; min-height: 54px; }
  .builtin-library-tabs .ui-icon { width: 17px; height: 17px; }
  .builtin-library-settings-body { padding: 18px 10px 20px 16px; }
  .builtin-library-settings-card { padding: 15px; }
  .builtin-library-settings-card-options { padding: 0 15px; }
  .builtin-library-settings-dialog .builtin-library-option { gap: 16px; padding: 16px 0; }
  .builtin-library-settings-card-action { align-items: flex-start; flex-direction: column; gap: 10px; }
  .builtin-library-settings-card-action .button { width: 100%; justify-content: center; }
  .builtin-library-settings-footer { padding: 13px 16px; flex-wrap: wrap; gap: 10px; }
  .builtin-library-settings-footer p:not(:empty) { flex-basis: 100%; }
  .builtin-library-settings-footer p:empty { display: none; }
  .builtin-library-refresh-fields { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .builtin-media-technical { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .builtin-stream-row { grid-template-columns: 1fr; gap: 3px; }
}
@media (prefers-reduced-motion: reduce) { .builtin-library-option input[role="switch"], .builtin-library-option input[role="switch"]::after, .builtin-library-tabs button { transition: none; } }

/* Shared overflow/context menu is promoted above card and grid clipping. */
.builtin-library-menu > .builtin-library-popover[popover] { position: fixed; inset: auto; margin: 0; width: min(228px, calc(100vw - 16px)); max-height: calc(100dvh - 16px); padding: 6px; gap: 2px; border: 1px solid var(--line); border-radius: 12px; color: var(--text); background: var(--surface); box-shadow: 0 12px 36px rgba(0,0,0,.28); animation: none; }
.builtin-library-menu > .builtin-library-popover[popover]:not(:popover-open) { display: none; }
.builtin-library-popover[popover] .button { display: flex; justify-content: flex-start; justify-self: stretch; width: 100%; min-height: 40px; gap: 10px; padding: 10px 12px; font-size: 13px; font-weight: 500; text-align: left; border: 0; border-radius: 7px; box-shadow: none; background: transparent; color: inherit; }
.builtin-library-popover[popover] .button:hover, .builtin-library-popover[popover] .button:focus-visible { outline: none; background: var(--primary-soft); color: var(--primary); }
.builtin-library-popover[popover] .button .ui-icon { width: 16px; height: 16px; color: var(--muted); }
.builtin-library-popover[popover] form { display: block; padding: 0; margin: 0; border: 0; }
.builtin-library-location h4 { display: flex; align-items: center; gap: 8px; }
.builtin-library-location h4 .ui-icon { width: 16px; height: 16px; color: var(--primary); }
.builtin-library-location > .field { margin-top: 16px; }
.builtin-library-location [data-library-location-current] { padding: 10px 12px; background: var(--primary-soft); border-radius: 8px; overflow-wrap: anywhere; }
.builtin-library-location-result:not(:empty) { margin-top: 14px; padding: 12px; border: 1px solid var(--line); border-radius: 8px; font-size: 12px; line-height: 1.8; overflow-wrap: anywhere; }
.builtin-library-location [data-library-location-conflicts] { font-size: 12px; line-height: 1.7; }
/* EMBY missing-episode reports share the plugin dialog surface. */
.emby-missing { min-width: 0; }
.emby-missing-fields { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.emby-missing-fields .field { min-width: 0; }
.emby-missing-fields select, .emby-missing-fields input { width: 100%; min-width: 0; }
.emby-missing-options, .emby-missing-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; margin: 16px 0; }
.emby-missing-options label { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; }
.emby-missing-options input { width: 16px; height: 16px; }
.emby-missing-actions a { font-size: 13px; }
.emby-missing-message { min-height: 20px; font-size: 13px; overflow-wrap: anywhere; }
.emby-missing-progress { padding: 16px 0; border-block: 1px solid var(--ui-border); }
.emby-missing-progress header, .emby-missing-history > header, .emby-missing-detail > header { display: flex; gap: 12px; align-items: center; justify-content: space-between; }
.emby-missing-progress strong { font-size: 14px; min-width: 0; overflow-wrap: anywhere; }
.emby-missing-progress progress { display: block; width: 100%; height: 8px; margin: 12px 0; accent-color: var(--ui-primary); }
.emby-missing-progress > span { font-size: 12px; color: var(--ui-muted-foreground); }
.emby-missing-history { margin-top: 20px; }
.emby-missing-history h3, .emby-missing-detail h3 { margin: 0; font-size: 15px; }
.emby-missing-run { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 16px 0; border-bottom: 1px solid var(--ui-border); }
.emby-missing-run header { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.emby-missing-run strong { font-size: 14px; overflow-wrap: anywhere; }
.emby-missing-run p { margin: 8px 0; font-size: 13px; overflow-wrap: anywhere; }
.emby-missing-run small { display: block; font-size: 12px; line-height: 1.7; color: var(--ui-muted-foreground); overflow-wrap: anywhere; }
.emby-missing-run .emby-missing-error { color: var(--ui-destructive); }
.emby-missing-run-actions { display: flex; flex-wrap: wrap; gap: 4px; }
.emby-missing .icon-command { flex: 0 0 32px; width: 32px; height: 32px; }
.emby-missing .icon-command[aria-expanded="true"] { color: var(--ui-primary); background: var(--primary-soft); }
.emby-missing .icon-command[data-action="delete"]:not(:disabled) { color: var(--ui-destructive); }
.emby-missing-empty { padding: 24px 0; color: var(--ui-muted-foreground); text-align: center; }
.emby-missing-detail { grid-column: 1 / -1; min-width: 0; }
.emby-missing-detail pre { max-height: 420px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; font: 12px/1.8 monospace; margin: 8px 0 0; padding: 12px 0; color: var(--ui-foreground); border-block: 1px solid var(--ui-border); }
.emby-missing-file, .ai-report-attachment { display: inline-flex; align-items: center; gap: 8px; padding: 8px 0; font-size: 13px; overflow-wrap: anywhere; }
.emby-missing-file:hover, .ai-report-attachment:hover { text-decoration: underline; }
.emby-missing-file:focus-visible, .ai-report-attachment:focus-visible { outline: 2px solid var(--ui-ring-color); outline-offset: 3px; }
.ai-report-file { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
@media (max-width: 600px) {
  .emby-missing-fields { grid-template-columns: minmax(0, 1fr); }
  .emby-missing-run { grid-template-columns: minmax(0, 1fr); gap: 8px; }
}
.member-portal-builtin-media { position: relative; }
.member-portal-builtin-media .member-portal-head { position: absolute; inset: 0 0 auto; z-index: 20; color: #fff; border-bottom: 0; background: linear-gradient(180deg, rgba(5,9,16,.92), rgba(5,9,16,.68) 62%, rgba(5,9,16,0)); box-shadow: none; }
.member-portal-builtin-media .member-portal-brand-name, .member-portal-builtin-media .member-portal-user > span { color: #fff; }
.member-portal-builtin-media .member-portal-brand small { color: rgba(255,255,255,.64); }
.member-portal-builtin-media .member-portal-head > nav { border-color: rgba(255,255,255,.12); background: rgba(9,14,24,.58); box-shadow: 0 8px 28px rgba(0,0,0,.16); backdrop-filter: blur(16px); }
.member-portal-builtin-media .member-portal-head > nav a { color: rgba(255,255,255,.78); }
.member-portal-builtin-media .member-portal-head > nav a:hover { color: #fff; background: rgba(255,255,255,.1); }
.member-portal-builtin-media .member-portal-head > nav a.active { color: #fff; background: linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 72%, #8f58ed)); }
.member-portal-builtin-media .member-portal-head .button.secondary { color: #fff; border-color: rgba(255,255,255,.15); background: rgba(9,14,24,.52); backdrop-filter: blur(14px); }
.member-portal-builtin-media .member-head-avatar { border-color: rgba(255,255,255,.2); }
.member-portal-builtin-media .member-portal-content { padding-top: 0; }
/* Subpages share the transparent hero navigation, so reserve room for the
   absolute header before rendering the back link and page heading. */
.member-portal-builtin-media .member-builtin-subpage { padding-top: 118px; }
.member-builtin-hero { position: relative; min-height: min(760px, 100dvh); margin: 0 calc((min(1900px, 100vw - 48px) - 100vw) / 2); overflow: hidden; display: flex; align-items: flex-end; color: #fff; background: #111722 var(--member-builtin-hero-image, none) center / cover no-repeat; }
.member-builtin-hero-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(5,9,16,.05) 10%, rgba(5,9,16,.25) 42%, rgba(5,9,16,.88) 82%, var(--bg) 100%), linear-gradient(90deg, rgba(5,9,16,.82), rgba(5,9,16,.08) 68%); }
.member-builtin-hero-hit { position: absolute; inset: 0; z-index: 0; }
.member-builtin-hero-copy { position: relative; z-index: 1; width: min(1900px, calc(100% - 48px)); margin: 0 auto; padding: 0 0 88px; }
.member-builtin-hero-copy > span, .member-builtin-heading > div > span { color: #8bd9d2; font-size: 12px; font-weight: 850; letter-spacing: .08em; }
.member-builtin-hero-copy h1 { margin: 8px 0 10px; font-size: clamp(34px, 5vw, 62px); line-height: 1.05; }
.member-builtin-hero-copy p { max-width: 560px; margin: 0; color: rgba(255,255,255,.78); font-size: 17px; }
.member-builtin-hero-actions { margin-top: 24px; display: flex; align-items: center; flex-wrap: wrap; gap: 14px; }
.member-builtin-hero-actions .button { color: #fff; border-color: rgba(255,255,255,.24); background: rgba(9,14,24,.55); backdrop-filter: blur(14px); }
.member-builtin-readonly, .member-builtin-readonly-badge { display: inline-flex; align-items: center; gap: 6px; color: rgba(255,255,255,.72); font-size: 13px; }
.member-builtin-readonly .ui-icon, .member-builtin-readonly-badge .ui-icon { width: 16px; height: 16px; }
.member-builtin-content, .member-builtin-subpage { width: min(1900px, calc(100% - 48px)); margin: 0 auto; }
.member-builtin-content { position: relative; z-index: 2; margin-top: -72px; padding: 18px 0 12px; }
.member-builtin-heading { margin-bottom: 18px; display: flex; align-items: end; justify-content: space-between; gap: 20px; }
.member-builtin-heading-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; flex-wrap: wrap; }
.member-builtin-heading h1, .member-builtin-heading h2 { margin: 6px 0 5px; font-size: 28px; }
.member-builtin-heading p { margin: 0; color: var(--muted); }
.member-builtin-library-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: 18px; }
.member-builtin-library-card { min-width: 0; display: block; color: var(--text); transition: transform .18s ease; }
.member-builtin-library-card:hover { transform: translateY(-2px); }
.member-builtin-library-art { border-color: var(--line); }
.member-builtin-library-art .builtin-library-shade { padding-bottom: 12px; }
.member-builtin-card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 22px 15px; }
.member-builtin-card { position: relative; min-width: 0; display: grid; color: var(--text); border-radius: 0; overflow: visible; background: transparent; }
.member-builtin-card-main { min-width: 0; display: grid; color: inherit; }
.member-builtin-card-art { position: relative; aspect-ratio: 2 / 3; overflow: hidden; display: grid; place-items: center; color: var(--muted); background: var(--surface-soft); border-radius: 10px; }
.member-builtin-card-corner-badge { position: absolute; z-index: 2; right: 8px; top: 8px; min-width: 34px; height: 34px; padding: 0 6px; display: inline-grid; place-items: center; border-radius: 999px; color: #fff; background: #46b957; font-size: 13px; font-weight: 850; line-height: 1; pointer-events: none; }
.member-builtin-card-poster-link { width: 100%; height: 100%; display: grid; place-items: center; color: inherit; text-decoration: none; }
.member-builtin-card-art img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .25s ease; }
.member-builtin-card:hover .member-builtin-card-art img { transform: scale(1.04); }
.member-builtin-card-actions { position: absolute; z-index: 3; inset: auto 7px 7px auto; display: flex; align-items: center; gap: 6px; opacity: 0; pointer-events: none; transform: translateY(5px); transition: opacity .16s ease, transform .16s ease; }
.member-builtin-card:hover .member-builtin-card-actions, .member-builtin-card:focus-within .member-builtin-card-actions { opacity: 1; pointer-events: auto; transform: translateY(0); }
.member-builtin-card-action { width: 32px; height: 32px; display: inline-grid; place-items: center; padding: 0; border: 1px solid rgba(255,255,255,.14); border-radius: 50%; color: rgba(255,255,255,.88); background: rgba(9,14,24,.72); cursor: pointer; }
.member-builtin-card-actions > .member-builtin-card-action { width: 30px; height: 30px; }
.member-builtin-card-action:hover, .member-builtin-card-action.is-active { color: var(--primary); background: var(--primary-soft); }
.member-builtin-card-action .ui-icon { width: 14px; height: 14px; }
.member-builtin-card-play { position: absolute; z-index: 3; left: 50%; top: 50%; width: 54px; height: 54px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.42); border-radius: 50%; color: #fff; background: rgba(18,22,34,.7); opacity: 0; pointer-events: none; transform: translate(-50%, -50%) scale(.86); transition: opacity .16s ease, transform .16s ease; }
.member-builtin-card:hover .member-builtin-card-play, .member-builtin-card:focus-within .member-builtin-card-play { opacity: 1; pointer-events: auto; transform: translate(-50%, -50%) scale(1); }
.member-builtin-card-play .ui-icon { width: 23px; height: 23px; margin-left: 2px; }
.member-builtin-card-copy { min-width: 0; display: grid; gap: 1px; padding: 9px 0 0; color: inherit; text-align: center; text-decoration: none; }
.member-builtin-card-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 16px; line-height: 1.25; }
.member-builtin-card-copy small { color: #aeb0b8; font-size: 14px; line-height: 1.25; }
@media (hover: none) {
  .member-builtin-card-actions { opacity: 1; pointer-events: auto; transform: none; }
  .member-builtin-card-play { opacity: 1; pointer-events: auto; transform: translate(-50%, -50%) scale(1); }
}
.member-builtin-subpage { padding: 26px 0 60px; }
.member-builtin-subpage > .button { margin-bottom: 18px; }
.member-builtin-search { margin: 0 0 24px; display: flex; max-width: 620px; gap: 8px; }
.member-builtin-search input { min-width: 0; flex: 1; }
.member-builtin-item-layout { margin-top: 8px; }
.member-builtin-item-layout { row-gap: 24px; }
.member-builtin-item-layout > .builtin-item-body { display: contents; }
.member-builtin-item-layout > .member-builtin-item-poster { grid-column: 1; grid-row: 1 / span 5; }
.member-builtin-item-layout .member-builtin-readonly-badge,
.member-builtin-item-layout > .builtin-item-body > h1,
.member-builtin-item-layout > .builtin-item-body > .builtin-item-facts,
.member-builtin-item-layout .member-builtin-item-actions,
.member-builtin-item-layout > .builtin-item-body > .builtin-item-overview { grid-column: 2; min-width: 0; }
.member-builtin-item-layout .member-builtin-cast,
.member-builtin-item-layout .member-builtin-children { grid-column: 1 / -1; min-width: 0; }
.member-builtin-item-layout h1 { margin: 3px 0 8px; font-size: 30px; }
.member-builtin-item-poster { width: 100%; }
.member-builtin-readonly-badge { margin-bottom: 8px; color: var(--primary); }
.member-builtin-cast { margin-top: 26px; }
.member-builtin-cast > header, .member-builtin-person-section > header { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.member-builtin-cast h2, .member-builtin-person-section h2 { margin: 0; font-size: 19px; }
.member-builtin-cast > header span, .member-builtin-person-section > header span { color: var(--muted); font-size: 12px; }
.member-builtin-cast-grid { display: flex; gap: 14px; overflow-x: auto; padding: 2px 0 10px; scroll-snap-type: x proximity; }
.member-builtin-cast-person { min-width: 0; display: grid; gap: 5px; color: var(--text); }
.member-builtin-cast-person { flex: 0 0 136px; scroll-snap-align: start; }
.member-builtin-cast-person:hover { color: var(--primary); }
.member-builtin-cast-avatar { width: 136px; aspect-ratio: 2 / 3; height: auto; display: grid; place-items: center; overflow: hidden; border-radius: 9px; color: var(--muted); background: var(--surface-soft); box-shadow: 0 6px 18px rgba(0,0,0,.12); }
.member-builtin-cast-avatar img { width: 100%; height: 100%; object-fit: cover; }
.member-builtin-cast-person strong, .member-builtin-cast-person small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.member-builtin-cast-person small { color: var(--muted); }
.member-builtin-person-page { display: grid; gap: 28px; }
.member-builtin-person-hero { display: grid; grid-template-columns: 190px minmax(0, 1fr); align-items: start; gap: 28px; padding: 24px; border: 1px solid var(--line); border-radius: 14px; background: linear-gradient(135deg, color-mix(in srgb, var(--surface) 92%, var(--primary)), var(--surface)); }
.member-builtin-person-avatar { width: 190px; aspect-ratio: 2 / 3; display: grid; place-items: center; overflow: hidden; border-radius: 12px; color: var(--muted); background: var(--surface-soft); box-shadow: 0 10px 30px rgba(0,0,0,.16); }
.member-builtin-person-avatar img { width: 100%; height: 100%; object-fit: cover; }
.member-builtin-person-hero h1 { margin: 6px 0 8px; font-size: clamp(28px, 4vw, 48px); }
.member-builtin-person-role { margin: 0 0 14px; color: var(--muted); }
.member-builtin-person-overview { max-width: 760px; margin: 18px 0 0; line-height: 1.8; white-space: pre-line; }
.member-builtin-person-section { min-width: 0; }
.member-builtin-person-section .member-builtin-card-grid { grid-template-columns: repeat(auto-fill, minmax(138px, 1fr)); }
.member-builtin-person-section .member-builtin-card-art { border-radius: 8px; }
.member-builtin-children { margin-top: 26px; }
.member-builtin-children h2 { margin: 0 0 14px; font-size: 19px; }
.member-builtin-children h2 small { color: var(--muted); font-size: 13px; font-weight: 600; }
.member-builtin-child-grid { margin-top: 0; display: flex; gap: 14px; overflow-x: auto; padding: 2px 0 12px; scroll-snap-type: x proximity; cursor: grab; }
.member-builtin-child-grid:active { cursor: grabbing; }
.member-builtin-child-grid .builtin-child-card { flex: 0 0 166px; scroll-snap-align: start; }
.member-builtin-child-grid[data-child-type="Episode"] .builtin-child-card { flex-basis: 240px; }
.member-builtin-item-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0 20px; }
.member-builtin-state-button.is-active { color: var(--primary); border-color: color-mix(in srgb, var(--primary) 45%, var(--line)); background: var(--primary-soft); }
.builtin-child-card { position: relative; }
.builtin-child-card > a { display: grid; gap: 8px; color: inherit; text-decoration: none; }
.builtin-child-play { position: absolute; z-index: 2; left: 50%; top: 38%; width: 46px; height: 46px; display: grid; place-items: center; border: 2px solid rgba(255,255,255,.8); border-radius: 50%; color: #fff; background: rgba(18,22,34,.76); opacity: 0; transform: translate(-50%, -50%) scale(.86); transition: opacity .18s ease, transform .18s ease; cursor: pointer; }
.builtin-child-card:hover .builtin-child-play, .builtin-child-card:focus-within .builtin-child-play { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.builtin-child-play .ui-icon { width: 19px; height: 19px; margin-left: 2px; }
.member-builtin-media-section { margin: 28px 0 0; padding-top: 24px; border-top: 1px solid var(--line); }
.member-builtin-media-section > header { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.member-builtin-media-section > header span { color: var(--primary); font-size: 12px; font-weight: 800; letter-spacing: .08em; }
.member-builtin-media-section h2 { margin: 5px 0 4px; font-size: 23px; }
.member-builtin-media-section p { margin: 0; color: var(--muted); font-size: 13px; }
.member-builtin-media-row { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }
.member-builtin-empty { min-height: 180px; padding: 30px; display: grid; place-items: center; align-content: center; gap: 7px; grid-column: 1 / -1; color: var(--muted); text-align: center; border: 1px dashed var(--line); border-radius: 14px; }
.member-builtin-empty > span { color: var(--primary); }
.member-builtin-empty .ui-icon { width: 29px; height: 29px; }
.member-builtin-empty strong { color: var(--text); }
.member-builtin-empty p { margin: 0; font-size: 13px; }
@media (max-width: 700px) {
  .member-builtin-hero { min-height: min(590px, calc(100dvh - 130px)); margin-inline: -12px; }
  .member-builtin-content { margin-top: -42px; }
  .member-builtin-hero-copy, .member-builtin-content, .member-builtin-subpage { width: calc(100% - 28px); }
  .member-builtin-hero-copy { padding-bottom: 64px; }
  .member-builtin-hero-copy h1 { font-size: 35px; }
  .member-builtin-heading { align-items: start; flex-direction: column; gap: 10px; }
  .member-builtin-heading-actions { width: 100%; justify-content: flex-start; }
  .member-builtin-library-grid { grid-template-columns: 1fr; }
  .member-builtin-card-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px 9px; }
  .member-builtin-card-copy strong { font-size: 14px; }
  .member-builtin-card-copy small { font-size: 12px; }
  .member-builtin-item-layout { grid-template-columns: 1fr; }
  .member-builtin-item-layout > .member-builtin-item-poster,
  .member-builtin-item-layout .member-builtin-readonly-badge,
  .member-builtin-item-layout > .builtin-item-body > h1,
  .member-builtin-item-layout > .builtin-item-body > .builtin-item-facts,
  .member-builtin-item-layout .member-builtin-item-actions,
  .member-builtin-item-layout > .builtin-item-body > .builtin-item-overview,
  .member-builtin-item-layout .member-builtin-cast,
  .member-builtin-item-layout .member-builtin-children { grid-column: 1; }
  .member-builtin-item-layout > .member-builtin-item-poster { grid-row: auto; }
  .member-portal-builtin-media .member-builtin-subpage { padding-top: 142px; }
  .member-builtin-item-poster { width: min(62%, 230px); }
  .member-builtin-person-hero { grid-template-columns: 104px minmax(0, 1fr); gap: 16px; padding: 16px; }
  .member-builtin-person-avatar { width: 104px; border-radius: 9px; }
  .member-builtin-person-hero h1 { font-size: 27px; }
  .member-builtin-person-overview { grid-column: 1 / -1; margin-top: 0; }
  .member-builtin-cast-grid { gap: 10px; }
  .member-builtin-cast-person { flex-basis: 112px; }
  .member-builtin-cast-avatar { width: 112px; }
  .member-builtin-media-section > header { align-items: start; flex-direction: column; }
}