:root {
  color-scheme: dark;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --background: #080d18;
  --panel: #0f1727;
  --panel-soft: #141e31;
  --panel-raised: #18243a;
  --border: #253451;
  --border-soft: #1d2a42;
  --text: #f4f7fb;
  --muted: #91a0b8;
  --accent: #7c6cf2;
  --accent-strong: #6654e8;
  --accent-soft: rgba(124, 108, 242, .14);
  --danger: #ef5d72;
  --success: #49c78f;
  --topbar-height: 4.5rem;
  --selection-height: 4.5rem;
}

* { box-sizing: border-box; }

html, body { margin: 0; min-height: 100%; }

body {
  min-height: 100vh;
  background: radial-gradient(circle at 70% -20%, #202b51 0, transparent 36rem), var(--background);
  color: var(--text);
}

body:not(.app-body) { display: grid; place-items: center; padding: 2rem 0; }

body:not(.app-body) > main {
  width: min(92vw, 30rem);
  padding: 2.5rem;
  border: 1px solid var(--border);
  border-radius: 1rem;
  background: rgba(15, 23, 39, .96);
  box-shadow: 0 1.5rem 4rem #0008;
}

body:not(.app-body) > main.wide { width: min(96vw, 70rem); }

h1, h2, h3, p { overflow-wrap: anywhere; }
h1 { margin-top: 0; font-size: clamp(1.8rem, 3vw, 2.3rem); letter-spacing: -.035em; }
h2 { letter-spacing: -.02em; }
p { color: #cbd5e1; line-height: 1.55; }
a { color: #b4abff; }

label { display: grid; gap: .4rem; margin: 1rem 0; color: #cbd5e1; }
input, select, textarea {
  width: 100%; padding: .8rem; border: 1px solid #475569; border-radius: .55rem;
  background: #111827; color: var(--text); font: inherit;
}
textarea { min-height: 6rem; resize: vertical; }
button {
  width: 100%; padding: .85rem; border: 0; border-radius: .55rem;
  background: var(--accent-strong); color: white; font: inherit; font-weight: 700; cursor: pointer;
}
button:disabled { cursor: not-allowed; opacity: .45; }
nav { display: flex; flex-wrap: wrap; gap: 1rem; margin: 1.5rem 0; align-items: center; }
nav form { margin-left: auto; }
nav button { padding: .4rem .8rem; }
table { width: 100%; border-collapse: collapse; margin: 1rem 0 2rem; }
th, td { padding: .65rem; border-bottom: 1px solid #334155; text-align: left; }
.actions { display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: 1rem; }
.secondary { background: #475569; }
.error { padding: .75rem; border-radius: .55rem; background: #7f1d1d; color: #fee2e2; }
.meta { font-size: .9rem; color: var(--muted); }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

.entity-picker { position: relative; }
.entity-picker > input[type="search"] { margin: 0; }
.entity-picker-results {
  position: fixed; z-index: 1000; inset: auto; margin: 0; max-height: 18rem; overflow-y: auto;
  padding: .35rem; border: 1px solid #475569; border-radius: .65rem; background: #111a2a;
  box-shadow: 0 1rem 2.5rem #000a;
}
.entity-picker-results[hidden] { display: none; }
.entity-picker-heading { margin: .2rem .45rem .35rem; color: #7788a2; font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.entity-picker-option { display: grid; gap: .18rem; width: 100%; padding: .65rem .7rem; background: transparent; color: #dce4ef; text-align: left; }
.entity-picker-option:hover, .entity-picker-option.is-active { background: var(--accent-soft); }
.entity-picker-option strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .84rem; }
.entity-picker-option span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); font-size: .7rem; font-weight: 500; }
.entity-picker-empty { margin: 0; padding: .75rem; color: var(--muted); font-size: .8rem; }

dialog {
  width: min(92vw, 32rem); border: 1px solid #475569; border-radius: 1rem;
  background: #0f172a; color: var(--text); box-shadow: 0 2rem 7rem #000c;
}
dialog::backdrop { background: #020617dd; backdrop-filter: blur(8px); }
.conflict { margin: 2rem 0; padding: 1.2rem; border: 1px solid #475569; border-radius: 1rem; }
.comparison { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.comparison img { width: 100%; height: 12rem; object-fit: contain; background: #020617; border-radius: .6rem; }
details { margin: .8rem 0; padding: .7rem; border: 1px solid #334155; border-radius: .6rem; }
summary { cursor: pointer; font-weight: 700; }
.metadata td:first-child { width: 34%; overflow-wrap: anywhere; }
.metadata-diff { margin-top: 1rem; max-height: 24rem; overflow: auto; background: #020617; border-radius: .6rem; }
.diff-line { display: grid; grid-template-columns: 2rem minmax(10rem, 1fr) 2fr; gap: .5rem; padding: .35rem .6rem; font-family: ui-monospace, monospace; overflow-wrap: anywhere; }
.diff-plus { background: #052e16; color: #bbf7d0; }
.diff-minus { background: #450a0a; color: #fecaca; }
#comparisonViewer { width: 96vw; max-width: none; }
#comparisonViewer .comparison img { height: 78vh; }
.decision { display: grid; grid-template-columns: repeat(4, 1fr); gap: .7rem; margin-top: 1rem; }

/* Authenticated application frame */
.app-body { overflow: hidden; }
.app-topbar {
  position: fixed; z-index: 30; inset: 0 0 auto; height: var(--topbar-height);
  display: grid; grid-template-columns: 15.5rem minmax(14rem, 38rem) 1fr; align-items: center; gap: 1.5rem;
  padding: 0 1.25rem; background: rgba(11, 17, 29, .88); border-bottom: 1px solid var(--border-soft);
  backdrop-filter: blur(18px);
}
.brand { display: flex; align-items: center; gap: .75rem; color: var(--text); text-decoration: none; font-size: 1.1rem; font-weight: 800; letter-spacing: -.02em; }
.brand-mark { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: .72rem; background: linear-gradient(145deg, #9c8cff, #5d4bdc); box-shadow: 0 .5rem 1.5rem #5e4add55; }
.brand-mark svg { width: 1.25rem; }
.global-search { position: relative; }
.global-search svg { position: absolute; top: 50%; left: .9rem; width: 1rem; transform: translateY(-50%); color: var(--muted); }
.global-search input { margin: 0; padding: .72rem 1rem .72rem 2.65rem; border-color: var(--border-soft); border-radius: .75rem; background: #111a2a; }
.top-actions { display: flex; justify-content: flex-end; align-items: center; gap: .6rem; }
.top-action { width: auto; min-width: 2.5rem; padding: .65rem .9rem; border: 1px solid transparent; background: transparent; color: #c6d0df; text-decoration: none; border-radius: .7rem; font-size: .9rem; }
.top-action:hover { border-color: var(--border); background: var(--panel-soft); color: white; }
.top-action.import-action { background: var(--accent); color: white; }
.task-center-trigger { display: flex; align-items: center; gap: .48rem; font-weight: 650; }
.task-center-trigger.has-active-task .task-center-trigger-icon { animation: task-center-spin 1.8s linear infinite; color: #b9afff; }
.task-center-trigger.has-attention { border-color: #efb64f66; color: #ffd98f; background: #3a2a112e; }
.task-center-badge { min-width: 1.35rem; padding: .08rem .35rem; border-radius: 1rem; background: var(--accent); color: white; font-size: .69rem; text-align: center; }
.task-center-trigger.has-attention .task-center-badge { background: #d58a22; }
.task-center {
  position: fixed; inset: calc(var(--topbar-height) + .7rem) 1rem auto auto; width: min(27rem, calc(100vw - 2rem));
  max-height: calc(100vh - var(--topbar-height) - 1.7rem); margin: 0; padding: 0; overflow: hidden;
  border: 1px solid var(--border); border-radius: 1rem; background: #0d1626; color: var(--text);
  box-shadow: 0 1.5rem 5rem #000c;
}
.task-center::backdrop { background: transparent; }
.task-center > header { display: flex; align-items: center; justify-content: space-between; padding: 1rem 1.05rem; border-bottom: 1px solid var(--border-soft); }
.task-center > header h2, .task-center > header p { margin: 0; }
.task-center > header h2 { font-size: 1.05rem; }
.task-center > header .dialog-close { width: 2.15rem; height: 2.15rem; padding: 0; background: #223049; }
.task-center-list { display: grid; gap: .65rem; max-height: calc(100vh - var(--topbar-height) - 6rem); padding: .8rem; overflow-y: auto; overscroll-behavior: contain; }
.task-center-empty { margin: 1rem; color: var(--muted); text-align: center; }
.task-card { display: grid; gap: .55rem; padding: .8rem; border: 1px solid var(--border-soft); border-radius: .75rem; background: var(--panel-soft); }
.task-card.is-blocked, .task-card.is-failed { border-color: #c9823766; background: #3a281733; }
.task-card-heading, .task-card-details { display: flex; justify-content: space-between; gap: .75rem; align-items: baseline; }
.task-card-heading strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .86rem; }
.task-card-status { flex: none; color: var(--muted); font-size: .7rem; font-weight: 800; text-transform: uppercase; }
.task-card.is-blocked .task-card-status, .task-card.is-failed .task-card-status { color: #ffc46f; }
.task-card-details, .task-card small { color: var(--muted); font-size: .73rem; }
.task-card progress { width: 100%; height: .38rem; border: 0; border-radius: 1rem; overflow: hidden; accent-color: var(--accent); }
.task-card progress::-webkit-progress-bar { background: #26334a; }
.task-card progress::-webkit-progress-value { background: var(--accent); }
.task-card p { margin: 0; color: #efc57f; font-size: .78rem; line-height: 1.35; }
.task-card a { justify-self: start; font-size: .78rem; font-weight: 750; }
.task-resume { justify-self: start; width: auto; padding: .48rem .7rem; border: 1px solid #8e7eff55; background: var(--accent-soft); color: #d8d2ff; font-size: .74rem; }
.task-system-alert { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .75rem .8rem; border: 1px solid #c9823777; border-radius: .75rem; background: #3a281744; color: #ffd18d; }
.task-system-alert strong { font-size: .78rem; line-height: 1.35; }
.task-system-alert .task-resume { flex: none; border-color: #d89a4966; color: #ffe0aa; background: #8a541d33; }
.task-card.is-completed { opacity: .68; }
.task-card.is-completed progress { accent-color: var(--success); }
@keyframes task-center-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .task-center-trigger.has-active-task .task-center-trigger-icon { animation: none; } }
.avatar { display: grid; place-items: center; width: 2.45rem; height: 2.45rem; padding: 0; border-radius: 50%; background: linear-gradient(145deg, #2d4264, #1d2940); color: #dfe8f6; }

.app-layout {
  display: grid; grid-template-columns: 15.5rem minmax(0, 1fr) 19.5rem;
  height: 100vh; padding-top: var(--topbar-height);
}
.app-sidebar, .inspector { min-height: 0; overflow-y: auto; background: rgba(12, 19, 32, .92); }
.app-sidebar { padding: 1.15rem .85rem 6rem; border-right: 1px solid var(--border-soft); }
.side-section { margin-bottom: 1.6rem; }
.side-title { margin: 0 .75rem .5rem; color: #65758e; font-size: .69rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.side-link { display: flex; align-items: center; gap: .75rem; padding: .68rem .75rem; border-radius: .65rem; color: #9eabc0; text-decoration: none; font-size: .91rem; }
.side-link:hover { background: var(--panel-soft); color: white; }
.side-link.active { background: var(--accent-soft); color: #d8d2ff; font-weight: 700; }
.app-sidebar button.side-link { width: 100%; border: 0; background: transparent; font-weight: 500; }
.app-sidebar button.side-link:hover { background: var(--panel-soft); }
.side-icon { width: 1.25rem; text-align: center; color: inherit; }
.side-count { margin-left: auto; padding: .1rem .42rem; border-radius: 1rem; background: #202d45; color: #8c9ab0; font-size: .72rem; }
.container-dot { width: .55rem; height: .55rem; flex: 0 0 auto; border-radius: 50%; background: #51c69a; box-shadow: 0 0 0 .25rem #51c69a16; }
.folder-tree, .folder-tree-children { margin: 0; padding: 0; list-style: none; }
.folder-tree { margin: .25rem 0 .65rem .45rem; }
.folder-tree-children { margin-left: 1rem; border-left: 1px solid #24314a; }
.tree-row { display: grid; grid-template-columns: 1.25rem minmax(0, 1fr); align-items: center; }
.tree-toggle, .tree-toggle-spacer { display: grid; place-items: center; width: 1.25rem; height: 1.65rem; padding: 0; background: transparent; color: #697a94; font-size: .9rem; }
.tree-toggle:hover { background: #1b263b; color: white; }
.folder-tree-link { display: flex; min-width: 0; align-items: center; gap: .5rem; padding: .45rem .5rem; border-radius: .5rem; color: #8796ad; text-decoration: none; font-size: .8rem; }
.folder-tree-link span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.folder-tree-link:hover { background: var(--panel-soft); color: white; }
.folder-tree-link.active { background: var(--accent-soft); color: #d8d2ff; font-weight: 700; }
.folder-tree [draggable="true"] { cursor: grab; }
.folder-tree [draggable="true"].is-dragging { opacity: .45; }
.folder-tree-link.is-folder-drop-target, .side-link.is-folder-drop-target { outline: 2px solid var(--accent); outline-offset: -2px; background: var(--accent-soft); color: white; }
.tree-move-status { margin: .5rem .7rem; color: #f5b9b9; font-size: .75rem; line-height: 1.35; }
.tree-empty { margin: .35rem .75rem .8rem 2rem; color: #64738a; font-size: .75rem; }
.management-dialog { width: min(92vw, 38rem); }
.management-dialog header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.management-dialog h2 { max-width: 30rem; margin: 0; overflow-wrap: anywhere; }
.management-dialog h3 { margin: 0 0 .8rem; font-size: 1rem; }
.management-dialog section { padding: 1rem 0 1.25rem; }
.management-dialog section + section, .management-dialog .error + section { border-top: 1px solid var(--border); }
.dialog-close { width: 2rem; height: 2rem; padding: 0; background: transparent; color: var(--muted); font-size: 1.5rem; }
.management-danger-section { margin-top: 1rem; }
.management-danger-section > p { color: var(--muted); font-size: .84rem; line-height: 1.5; }
.automatic-properties { display: grid; gap: .35rem; margin-top: 1rem; padding: .75rem; border: 1px solid var(--border-soft); border-radius: .6rem; background: #0b1322; color: var(--muted); font-size: .76rem; }
.automatic-properties strong { color: #d5ddea; font-weight: 650; }
.management-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 .75rem; }
.location-picker { margin-top: .8rem; }
.location-picker-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }
.location-picker-actions button { padding: .65rem; font-size: .8rem; }
.location-picker-panel { margin-top: .8rem; }
.location-picker-panel[hidden] { display: none; }
.location-picker-map { width: 100%; height: 18rem; overflow: hidden; border: 1px solid var(--border); border-radius: .65rem; background: #0b1322; }
.location-picker-panel .meta { margin: .55rem 0 0; }
.location-picker-panel .meta.error { color: #ffd5dc; }
.collection-summary { color: #8292aa !important; font-size: .78rem; }
.folder-delete-actions { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }
.folder-delete-actions[hidden] { display: none; }
.move-conflict-panel[hidden], #mediaMoveSetup[hidden] { display: none; }
.move-conflict-panel { margin-top: .75rem; }
.move-conflict-list { display: grid; gap: .55rem; max-height: min(42vh, 24rem); overflow-y: auto; padding-right: .25rem; scrollbar-gutter: stable; }
.move-conflict-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(12rem, .8fr); gap: .75rem; align-items: center; padding: .7rem; border: 1px solid var(--border-soft); border-radius: .6rem; background: #0b1322; }
.move-conflict-row > div { display: grid; min-width: 0; gap: .2rem; }
.move-conflict-row strong { overflow-wrap: anywhere; }
.move-conflict-row span { color: var(--muted); font-size: .74rem; }
.move-conflict-row select { margin: 0; padding: .6rem; font-size: .78rem; }
.danger-button { background: #a52f43; }
.danger-confirmation { margin-top: 1rem; padding: .9rem; border: 1px solid #7f3342; border-radius: .65rem; background: #3b1820; }
.danger-confirmation[hidden] { display: none; }
.danger-confirmation > p { margin: 0; color: #ffd5dc; font-size: .84rem; }

.workspace { min-width: 0; min-height: 0; overflow-y: auto; scrollbar-gutter: stable; padding-bottom: 6rem; background: linear-gradient(160deg, rgba(19, 29, 49, .45), transparent 35rem); }
.workspace-content { width: min(100%, 92rem); margin: 0 auto; padding: 2rem 2.25rem; }
.workspace-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 1.5rem; margin-bottom: 1.75rem; }
.eyebrow { margin: 0 0 .45rem; color: var(--accent); font-size: .75rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.workspace-heading h1 { margin: 0; font-size: clamp(1.8rem, 3vw, 2.6rem); }
.workspace-heading p { margin: .4rem 0 0; color: var(--muted); }
.album-heading-cover { width: 6.5rem; height: 4.5rem; object-fit: cover; border: 1px solid var(--border); border-radius: .7rem; box-shadow: 0 .7rem 1.8rem #0005; }
.view-tools { display: flex; gap: .55rem; }
.view-tool { width: auto; padding: .55rem .75rem; border: 1px solid var(--border); background: var(--panel); color: #b6c2d4; }
.view-tool.active { border-color: #7060da; color: white; background: var(--accent-soft); }
.folder-create-button { border-color: #51459b; color: #d8d2ff; }
.folder-error { margin: 0 0 1rem; }
.folder-dialog form { margin: 0; }
.folder-dialog h2 { margin-top: 0; }
.dialog-actions { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; margin-top: 1.25rem; }
.import-dropzone { padding: 3rem; border: 2px dashed #64748b; border-radius: 1rem; background: rgba(17, 26, 42, .55); text-align: center; cursor: pointer; transition: border-color .16s, background .16s; }
.import-dropzone:hover { border-color: var(--accent); background: var(--accent-soft); }
.local-import-panel { margin: 1.5rem 0; padding: 1.25rem; border: 1px solid var(--border); border-radius: 1rem; background: var(--panel-soft); }
.local-import-panel h2 { margin-top: 0; }
.local-import-panel code { overflow-wrap: anywhere; }
.local-import-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.folder-proposal-actions { display: grid; grid-template-columns: repeat(3, 1fr); gap: .65rem; margin-top: 1.2rem; }
.section-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; color: var(--muted); font-size: .85rem; }
.section-toolbar nav { margin: 0; }

.virtual-media-grid { --virtual-card-min: 168px; --virtual-card-height: 224px; --virtual-grid-gap: 16px; min-height: 1px; contain: layout style; overflow-anchor: none; }
.virtual-media-grid[hidden], .virtual-media-grid.view-hidden, .library-map[hidden] { display: none; }
.library-map { position: relative; width: 100%; height: clamp(28rem, calc(100vh - 15rem), 58rem); overflow: hidden; border: 1px solid var(--border); border-radius: .8rem; background: #0b1322; }
.map-loading { position: absolute; z-index: 1000; top: .75rem; left: 50%; translate: -50% 0; max-width: calc(100% - 1.5rem); padding: .5rem .75rem; border: 1px solid #364662; border-radius: 999px; background: rgba(11, 19, 34, .92); color: #d5ddea; font-size: .76rem; box-shadow: 0 .4rem 1.2rem #0008; pointer-events: none; }
.map-loading.error { border-color: #7f3342; color: #ffd5dc; }
.library-map .leaflet-container { font-family: inherit; }
.library-map .leaflet-control-attribution { color: #334155; }
.map-popup { display: grid; gap: .55rem; min-width: 10rem; }
.map-popup img { width: 100%; max-height: 9rem; object-fit: cover; border-radius: .45rem; }
.map-popup button { padding: .55rem; font-size: .8rem; overflow-wrap: anywhere; }
.virtual-grid-spacer { width: 100%; pointer-events: none; }
.media-grid-window { display: grid; grid-template-columns: repeat(var(--virtual-columns, 1), minmax(0, 1fr)); gap: var(--virtual-grid-gap); }
.media-card { position: relative; min-width: 0; height: var(--virtual-card-height, auto); padding: 0; overflow: hidden; border: 1px solid var(--border-soft); border-radius: .85rem; background: var(--panel); color: inherit; text-align: left; transition: border-color .16s, transform .16s, box-shadow .16s; }
.media-card:hover { transform: translateY(-2px); border-color: #50617c; box-shadow: 0 .8rem 2.2rem #0005; }
.media-card.is-selected { border-color: var(--accent); box-shadow: 0 0 0 2px #7564eb66, 0 1rem 2rem #0005; }
.card-check { position: absolute; z-index: 2; top: .6rem; right: .6rem; display: grid; place-items: center; width: 1.45rem; height: 1.45rem; border: 1px solid #ffffff55; border-radius: 50%; background: #07101dbb; color: transparent; font-size: .75rem; }
.media-card.is-selected .card-check { border-color: var(--accent); background: var(--accent); color: white; }
.media-card img, .media-placeholder { display: block; width: 100%; height: 160px; object-fit: cover; background: #070c15; }
.media-placeholder { display: grid; place-items: center; color: #617089; }
.card-copy { display: block; padding: .72rem .78rem .78rem; }
.card-name { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .86rem; font-weight: 700; }
.card-meta { display: block; margin-top: .28rem; color: var(--muted); font-size: .74rem; font-weight: 500; }
.media-card-skeleton { border-color: transparent; pointer-events: none; }
.skeleton-image, .skeleton-copy { display: block; background: linear-gradient(90deg, #111a2a 20%, #1a263b 50%, #111a2a 80%); background-size: 200% 100%; animation: skeleton-pulse 1.4s infinite linear; }
.skeleton-image { height: 160px; }
.skeleton-copy { width: 76%; height: .85rem; margin: 1rem .8rem; border-radius: .3rem; }
@keyframes skeleton-pulse { to { background-position: -200% 0; } }
.empty-state { display: grid; place-items: center; min-height: 20rem; padding: 3rem; border: 1px dashed var(--border); border-radius: 1rem; background: rgba(15, 23, 39, .5); text-align: center; }
.empty-state[hidden] { display: none; }

.inspector { padding: 1.35rem 1.2rem 6rem; border-left: 1px solid var(--border-soft); }
.inspector-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.2rem; }
.inspector-header h2 { margin: 0; font-size: .92rem; letter-spacing: .01em; }
.inspector-preview { display: grid; place-items: center; width: 100%; aspect-ratio: 4 / 3; margin-bottom: 1.2rem; overflow: hidden; border: 1px solid var(--border-soft); border-radius: .8rem; background: #070c15; color: #53617a; }
.inspector-preview img { width: 100%; height: 100%; object-fit: contain; }
.inspector-name { margin: 0 0 .25rem; color: white; font-size: .94rem; font-weight: 750; }
.inspector-type { margin: 0 0 1.3rem; color: var(--muted); font-size: .76rem; text-transform: capitalize; }
.property-list { margin: 0; }
.property-row { display: grid; grid-template-columns: 5.4rem minmax(0, 1fr); gap: .6rem; padding: .65rem 0; border-top: 1px solid var(--border-soft); font-size: .78rem; }
.property-row dt { color: #75859d; }
.property-row dd { margin: 0; color: #cbd5e1; overflow-wrap: anywhere; text-align: right; }
.metadata-load { margin-top: 1rem; padding: .68rem .8rem; border: 1px solid #4b438f; background: var(--accent-soft); color: #d8d2ff; font-size: .78rem; }
.metadata-load:hover:not(:disabled) { background: rgba(124, 108, 242, .24); }
.inspector-section-title { margin: 1.4rem 0 .7rem; color: #dfe6f1; font-size: .79rem; letter-spacing: .04em; text-transform: uppercase; }
.inspector-error { padding: .65rem; border-radius: .5rem; background: #451923; color: #ffb3bf; font-size: .74rem; }
.metadata-block { margin-top: 1rem; padding: 0; border-color: var(--border-soft); }
.metadata-block summary { padding: .7rem; color: #b9c5d7; font-size: .78rem; }
.metadata-block > .meta { padding: 0 .7rem .7rem; }
.metadata-block dl { margin: 0; }
.metadata-row { padding: .65rem .7rem; border-top: 1px solid var(--border-soft); }
.metadata-row dt { margin-bottom: .3rem; color: #8291a8; font-size: .68rem; overflow-wrap: anywhere; }
.metadata-row dd { margin: 0; color: #d1d9e5; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .69rem; line-height: 1.4; overflow-wrap: anywhere; }
.inspector-empty { padding-top: 4rem; color: var(--muted); text-align: center; }
.inspector-empty strong { display: block; margin: .8rem 0 .35rem; color: #c3cede; }

.selection-bar { position: fixed; z-index: 40; left: calc(15.5rem + 1.5rem); right: calc(19.5rem + 1.5rem); bottom: 1rem; display: flex; align-items: center; gap: .75rem; min-height: var(--selection-height); padding: .75rem 1rem; border: 1px solid #3b4a66; border-radius: .9rem; background: rgba(20, 29, 47, .95); box-shadow: 0 1rem 3rem #0009; backdrop-filter: blur(16px); transform: translateY(7rem); opacity: 0; pointer-events: none; transition: .2s ease; }
.selection-bar.visible { transform: translateY(0); opacity: 1; pointer-events: auto; }
.selection-count { margin-right: auto; font-size: .9rem; font-weight: 750; }
.selection-action { width: auto; padding: .62rem .85rem; border: 1px solid var(--border); background: transparent; color: #c4cede; font-size: .8rem; }
.selection-action:hover { background: var(--panel-raised); color: white; }
.selection-action.danger { color: #ff9bab; }

.dashboard-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 1rem; }
.dashboard-card { min-height: 10rem; padding: 1.25rem; border: 1px solid var(--border-soft); border-radius: .9rem; background: linear-gradient(145deg, var(--panel-soft), var(--panel)); color: inherit; text-decoration: none; }
.dashboard-card:hover { border-color: #4c5b75; }
.dashboard-card strong { display: block; margin: .7rem 0 .35rem; color: white; }
.dashboard-card span { color: var(--muted); font-size: .84rem; line-height: 1.45; }

#mediaViewer { width: min(96vw, 95rem); max-width: none; padding: 1rem; }
#mediaViewer header { display: flex; align-items: center; gap: 1rem; }
#mediaViewer h2 { margin: 0; font-size: 1rem; }
#mediaViewer header button { width: auto; margin-left: auto; padding: .5rem .75rem; background: #26334a; }
#mediaViewer img { width: 100%; height: calc(92vh - 5rem); margin-top: 1rem; object-fit: contain; background: #050811; border-radius: .7rem; }

@media (max-width: 1100px) {
  .app-layout { grid-template-columns: 14rem minmax(0, 1fr); }
  .app-topbar { grid-template-columns: 14rem minmax(12rem, 32rem) 1fr; }
  .inspector { display: none; }
  .selection-bar { right: 1.5rem; left: 15.5rem; }
}

@media (max-width: 760px) {
  :root { --topbar-height: 4rem; }
  .app-topbar { grid-template-columns: auto minmax(0, 1fr) auto; gap: .65rem; padding: 0 .75rem; }
  .brand span:last-child, .top-action span, .app-sidebar { display: none; }
  .task-center-trigger .task-center-trigger-icon, .task-center-trigger .task-center-badge { display: inline; }
  .app-layout { grid-template-columns: minmax(0, 1fr); }
  .workspace-content { padding: 1.4rem 1rem 6rem; }
  .workspace-heading { align-items: flex-start; }
  .view-tools { flex-wrap: wrap; }
  .view-tools .view-tool:disabled { display: none; }
  .virtual-media-grid { --virtual-card-min: 128px; --virtual-grid-gap: 11px; }
  .library-map { height: calc(100vh - 14rem); min-height: 24rem; }
  .folder-proposal-actions { grid-template-columns: 1fr; }
  .management-field-grid { grid-template-columns: 1fr; }
  .location-picker-actions { grid-template-columns: 1fr; }
  .move-conflict-row { grid-template-columns: 1fr; }
  .selection-bar { left: .75rem; right: .75rem; bottom: .65rem; overflow-x: auto; }
  .selection-count { min-width: 7rem; }
  .decision, .comparison { grid-template-columns: 1fr; }
}