:root {
  color-scheme: light;
  --bg: #f4f6f8; --surface: #fff; --surface-raised: #fff; --surface-subtle: #f7f9fa; --surface-hover: #eaf3f9;
  --text: #17212b; --text-secondary: #536471; --text-muted: #7d8b98; --border: #dfe5e9; --border-strong: #c7d0d7;
  --accent: #3390ec; --accent-hover: #2b7fc7; --accent-soft: #e5f3fc; --success: #62df92; --success-text: #247a4b; --success-soft: #eaf7ef;
  --warning: #9a6413; --warning-soft: #fff6df; --danger: #b33a3a; --danger-soft: #fff0f0; --info: #3390ec;
  --info-soft: #e8f4fc; --focus: #5aace8; --shadow-sm: 0 1px 2px rgba(18,24,35,.05); --shadow-menu: 0 12px 32px rgba(18,24,35,.14);
  --radius-sm: 7px; --radius-md: 10px; --radius-lg: 14px; --sidebar-width: 232px; --sidebar-collapsed: 68px; --content-max: 1360px;
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-synthesis: none;
}
:root[data-theme="dark"] {
  color-scheme: dark; --bg: #17212b; --surface: #202b36; --surface-raised: #253341; --surface-subtle: #1b2732; --surface-hover: #2b3b49;
  --text: #f5f7f8; --text-secondary: #bdc8d2; --text-muted: #8796a5; --border: #30414f; --border-strong: #415667;
  --accent: #5eb5f7; --accent-hover: #75c2fb; --accent-soft: #193d55; --success: #62df92; --success-text: #91dfb0; --success-soft: #193528;
  --warning: #e5b85c; --warning-soft: #3b301b; --danger: #f08a8a; --danger-soft: #412326; --info: #5eb5f7;
  --info-soft: #1b3a50; --focus: #69baf5; --shadow-sm: 0 1px 2px rgba(0,0,0,.22); --shadow-menu: 0 14px 38px rgba(0,0,0,.4);
}
@media (prefers-color-scheme: dark) {
  :root[data-theme="system"] {
    color-scheme: dark; --bg: #17212b; --surface: #202b36; --surface-raised: #253341; --surface-subtle: #1b2732; --surface-hover: #2b3b49;
    --text: #f5f7f8; --text-secondary: #bdc8d2; --text-muted: #8796a5; --border: #30414f; --border-strong: #415667;
    --accent: #5eb5f7; --accent-hover: #75c2fb; --accent-soft: #193d55; --success: #62df92; --success-text: #91dfb0; --success-soft: #193528;
    --warning: #e5b85c; --warning-soft: #3b301b; --danger: #f08a8a; --danger-soft: #412326; --info: #5eb5f7;
    --info-soft: #1b3a50; --focus: #69baf5; --shadow-sm: 0 1px 2px rgba(0,0,0,.22); --shadow-menu: 0 14px 38px rgba(0,0,0,.4);
  }
}
* { box-sizing: border-box; }
html { min-width: 320px; }
html.js:not(.i18n-ready) body { visibility: hidden; }
body { margin: 0; background: var(--bg); color: var(--text); font-size: 14px; line-height: 1.5; }
button, input, textarea, select { font: inherit; color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration-color: var(--border-strong); text-underline-offset: 3px; }
a:hover { text-decoration-color: currentColor; }
:focus-visible { outline: 3px solid color-mix(in srgb, var(--focus) 55%, transparent); outline-offset: 2px; }
svg { display: block; }
h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: 6px; font-size: clamp(25px, 2.2vw, 32px); line-height: 1.2; letter-spacing: -.025em; }
h2 { margin-bottom: 8px; font-size: 18px; line-height: 1.3; letter-spacing: -.01em; }
h3 { margin-bottom: 7px; font-size: 15px; line-height: 1.35; }
.muted, .text-muted { color: var(--text-muted); }
.secondary { color: var(--text-secondary); }
.form-result.is-error { color: var(--danger); }
.meta { color: var(--text-muted); font-size: 12px; }
.truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; }
.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; }
.app-shell { min-height: 100vh; }
.sidebar { position: fixed; z-index: 40; inset: 0 auto 0 0; display: flex; width: var(--sidebar-width); flex-direction: column; padding: 12px; overflow: visible; background: var(--surface-subtle); border-right: 1px solid var(--border); transition: width .24s cubic-bezier(.22,1,.36,1); will-change: width; }
.sidebar__head { display: flex; min-height: 44px; align-items: center; justify-content: flex-start; gap: 5px; padding: 0 4px 10px 6px; }
.brand { display: inline-flex; min-width: 0; align-items: center; gap: 10px; color: var(--text); font-size: 15px; font-weight: 700; text-decoration: none; letter-spacing: -.01em; }
.brand__mark { display: block; width: 30px; height: 30px; flex: 0 0 30px; object-fit: contain; }
.brand__name { overflow: hidden; white-space: nowrap; }
.brand__viewport { display:block;width:114px;height:44px;flex:0 0 auto;overflow:hidden;transition:width .24s cubic-bezier(.22,1,.36,1);will-change:width }
.brand__wordmark { display:block;width:114px;height:44px;max-width:none;object-fit:contain;object-position:left center }
.sidebar__nav { display: flex; flex: 1; flex-direction: column; gap: 3px; padding-top: 7px; overflow: hidden; }
.sidebar__footer { display: flex; flex-direction: column; gap: 3px; padding-top: 10px; overflow: hidden; border-top: 1px solid var(--border); }
.nav-item { position: relative; display: flex; width: 100%; min-height: 40px; align-items: center; gap: 11px; padding: 8px 12px; overflow:hidden;border: 0; border-radius: var(--radius-md); background: transparent; color: var(--text-secondary); font-size: 13px; font-weight: 520; text-align: left; text-decoration: none; cursor: pointer; }
.nav-item > span:not(.nav-badge) { width: 164px; overflow: hidden; opacity: 1; transform: translateX(0); transition: opacity .14s ease .07s, transform .2s cubic-bezier(.22,1,.36,1); white-space: nowrap; }
.nav-item svg, .icon-button svg { width: 20px; height: 20px; flex: 0 0 20px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.nav-badge { display: inline-grid; min-width: 20px; height: 20px; margin-left: auto; padding: 0 6px; place-items: center; border-radius: 999px; background: var(--danger); color: #fff; font-size: 11px; font-weight: 750; line-height: 1; }
html[data-sidebar="collapsed"] .nav-badge { position: absolute; right: 5px; top: 4px; min-width: 16px; height: 16px; padding: 0 4px; font-size: 9px; }
.app-shell.is-collapsed .nav-item .nav-badge, html[data-sidebar="collapsed"] .nav-item .nav-badge { max-width: none; overflow: visible; opacity: 1; transform: none; }
.nav-item:hover { background: var(--surface-hover); color: var(--text); }
.nav-item.is-active { background: var(--surface); color: var(--text); box-shadow: var(--shadow-sm); }
.nav-item.is-active svg { color: var(--accent); }
.icon-button { display: inline-grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; border: 0; border-radius: var(--radius-sm); background: transparent; color: var(--text-muted); cursor: pointer; }
.icon-button:hover { background: var(--surface-hover); color: var(--text); }
.workspace { min-height: 100vh; margin-left: var(--sidebar-width); transition: margin-left .24s cubic-bezier(.22,1,.36,1); will-change: margin-left; }
.content { width: min(100%, calc(var(--content-max) + 64px)); margin: 0 auto; padding: 42px 32px 72px; }
.mobile-bar, .sidebar-scrim { display: none; }
.brand-toggle { position:relative;display:grid;place-items:center;width:32px;height:38px;flex:0 0 32px;padding:0;border:0;border-radius:7px;background:transparent;color:var(--text-muted);cursor:pointer;transition:background .15s ease; }
.brand-toggle:hover { background:var(--surface-hover);color:var(--text); }
.brand-toggle:focus-visible { outline:2px solid var(--focus);outline-offset:3px; }
.brand-logo { display:block;width:114px;height:32px; }
.brand-icon { width:29px;height:31px; }
.brand-logo--dark { display:none; }
html[data-theme="dark"] .brand-logo--light { display:none; }
html[data-theme="dark"] .brand-logo--dark { display:block; }
@media (prefers-color-scheme:dark) {
  html[data-theme="system"] .brand-logo--light { display:none; }
  html[data-theme="system"] .brand-logo--dark { display:block; }
}
.brand-label { display:block;width:114px;flex:0 0 114px;overflow:hidden;opacity:1;transition:opacity .14s ease .07s; }
.brand-chevron { position:absolute;right:-7px;top:14px;width:9px;height:9px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;opacity:.55;transition:transform .24s ease,opacity .15s; }
.brand-toggle:hover .brand-chevron { opacity:1; }
.app-shell.is-collapsed .sidebar, html[data-sidebar="collapsed"] .sidebar { width: var(--sidebar-collapsed); }
.app-shell.is-collapsed .workspace, html[data-sidebar="collapsed"] .workspace { margin-left: var(--sidebar-collapsed); }
.app-shell.is-collapsed .nav-item > span:not(.nav-badge), html[data-sidebar="collapsed"] .nav-item > span:not(.nav-badge) { opacity:0;transform:translateX(-6px);transition-delay:0s;pointer-events:none; }
.app-shell.is-collapsed .brand__viewport, html[data-sidebar="collapsed"] .brand__viewport { width:32px }
.app-shell.is-collapsed .brand-chevron, html[data-sidebar="collapsed"] .brand-chevron { transform:rotate(180deg); }
.app-shell.is-collapsed .brand-label, html[data-sidebar="collapsed"] .brand-label { opacity:0;visibility:hidden;pointer-events:none;transition-delay:0s; }
.app-shell.is-collapsed .nav-item, html[data-sidebar="collapsed"] .nav-item { padding-inline: 12px; }
.page-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.page-header__copy { max-width: 720px; }
.page-header__copy > :last-child { margin-bottom: 0; }
.page-header__actions, .actions, .button-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.button > svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.page-header__actions form, .actions form, .button-row form { margin: 0; }
.section-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; margin: 30px 0 12px; }
.section-header > :last-child { margin-bottom: 0; }
.back-link { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 18px; color: var(--text-secondary); text-decoration: none; }
.back-link:hover { color: var(--text); }
.panel, .card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); }
.panel { overflow: hidden; }
.panel__body { padding: 20px; }
.panel__header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 18px 20px; border-bottom: 1px solid var(--border); }
.panel__header h2, .panel__header p { margin-bottom: 0; }
.card { padding: 18px; }
.card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(320px, 100%), 1fr)); gap: 14px; }
.stack { display: grid; gap: 14px; }
.split { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(280px, .8fr); gap: 18px; align-items: start; }
.empty-state { padding: 48px 24px; color: var(--text-muted); text-align: center; }
.empty-state strong { display: block; margin-bottom: 4px; color: var(--text); font-size: 15px; }
.button { display: inline-flex; min-height: 38px; align-items: center; justify-content: center; gap: 7px; padding: 8px 13px; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); background: var(--surface); color: var(--text); font-weight: 580; line-height: 1.2; text-decoration: none; cursor: pointer; }
.button:hover { background: var(--surface-hover); }
.button--primary { border-color: var(--accent); background: var(--accent); color: #fff; }
.button--primary:hover { background: var(--accent-hover); }
:root[data-theme="dark"] .button--primary { color: #fff; }
@media (prefers-color-scheme: dark) { :root[data-theme="system"] .button--primary { color: #fff; } }
.button--ghost { border-color: transparent; background: transparent; color: var(--text-secondary); }
.button--danger { border-color: color-mix(in srgb, var(--danger) 32%, var(--border)); background: var(--danger-soft); color: var(--danger); }
.button--small { min-height: 32px; padding: 6px 10px; font-size: 12px; }
.button:disabled, button:disabled { opacity: .48; cursor: not-allowed; }
.status { display: inline-flex; min-height: 24px; align-items: center; gap: 5px; padding: 3px 8px; border-radius: 999px; background: var(--surface-hover); color: var(--text-secondary); font-size: 12px; font-weight: 650; line-height: 1.2; white-space: nowrap; }
.status::before { width: 6px; height: 6px; border-radius: 50%; background: currentColor; content: ""; opacity: .6; }
.status--success { background: var(--surface-subtle); color: var(--success-text); box-shadow: inset 0 0 0 1px var(--border); }
.status--success::before { background: var(--success); opacity: 1; }
.status--working, .status--info { background: var(--accent-soft); color: var(--info); }
.status--warning { background: var(--warning-soft); color: var(--warning); }
.status--attention, .status--danger { background: var(--danger-soft); color: var(--danger); }
.alert { padding: 11px 13px; border: 1px solid color-mix(in srgb, var(--info) 24%, var(--border)); border-radius: var(--radius-md); background: var(--info-soft); color: var(--text); }
.alert--warning { border-color: color-mix(in srgb, var(--warning) 30%, var(--border)); background: var(--warning-soft); }
.alert--danger { border-color: color-mix(in srgb, var(--danger) 28%, var(--border)); background: var(--danger-soft); }
.flash-stack { display: grid; gap: 8px; margin-bottom: 18px; }
.field { margin-bottom: 18px; }
.field:last-child { margin-bottom: 0; }
.field > label, .field-label { display: block; margin-bottom: 6px; color: var(--text-secondary); font-size: 13px; font-weight: 650; }
.field-help { margin-top: 6px; color: var(--text-muted); font-size: 12px; }
.field-errors, .errorlist { margin: 6px 0 0; padding: 0; color: var(--danger); font-size: 12px; list-style: none; }
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), textarea, select { width: 100%; min-height: 40px; padding: 8px 10px; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); background: var(--surface); box-shadow: inset 0 1px 1px rgba(18,24,35,.025); }
textarea { min-height: 150px; resize: vertical; }
input::placeholder, textarea::placeholder { color: var(--text-muted); }
input:focus, textarea:focus, select:focus { border-color: var(--focus); outline: 3px solid color-mix(in srgb, var(--focus) 20%, transparent); }
input[type="file"] { max-width: 100%; color: var(--text-secondary); }
input[type="file"]::file-selector-button { margin-right: 10px; padding: 7px 10px; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); background: var(--surface); color: var(--text); cursor: pointer; }
fieldset { min-width: 0; margin: 0 0 18px; padding: 0; border: 0; }
legend { margin-bottom: 7px; color: var(--text-secondary); font-size: 13px; font-weight: 650; }
.check-list ul, ul.check-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 7px; margin: 0; padding: 0; list-style: none; }
.check-list label { display: flex; min-height: 38px; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface-subtle); cursor: pointer; }
.toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 16px; }
.toolbar__search { position: relative; flex: 1 1 260px; }
.toolbar__search input { padding-left: 36px !important; }
.toolbar__search svg { position: absolute; top: 10px; left: 11px; width: 18px; height: 18px; fill: none; stroke: var(--text-muted); stroke-width: 1.8; }
.toolbar > select { width: auto !important; min-width: 170px; flex: 0 0 auto; }
.tabs { display: flex; gap: 4px; padding: 3px; overflow-x: auto; border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--surface-subtle); }
.tab { padding: 6px 11px; border-radius: var(--radius-sm); color: var(--text-secondary); font-size: 12px; font-weight: 600; text-decoration: none; white-space: nowrap; }
.tab:hover { background: var(--surface-hover); color: var(--text); }
.tab.is-active { background: var(--surface); color: var(--text); box-shadow: var(--shadow-sm); }
.table-wrap { width: 100%; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 12px 14px; border-bottom: 1px solid var(--border); text-align: left; vertical-align: middle; }
th { background: var(--surface-subtle); color: var(--text-muted); font-size: 11px; font-weight: 700; letter-spacing: .045em; text-transform: uppercase; }
tbody tr:last-child td, tbody tr:last-child th { border-bottom: 0; }
tbody tr:hover > td { background: color-mix(in srgb, var(--surface-hover) 55%, transparent); }
.table-link { font-weight: 650; text-decoration: none; }
.table-link:hover { color: var(--accent); }
.definition-list { display: grid; grid-template-columns: minmax(100px,150px) 1fr; gap: 11px 18px; margin: 0; }
.definition-list dt { color: var(--text-muted); }
.definition-list dd { min-width: 0; margin: 0; }
details > summary { color: var(--text-secondary); cursor: pointer; }
details[open] > summary { margin-bottom: 14px; color: var(--text); }
.divider { height: 1px; margin: 18px 0; background: var(--border); }
@media (max-width: 1020px) { .content { padding: 32px 24px 64px; } .split { grid-template-columns: 1fr; } }
@media (max-width: 560px) {
  body { font-size: 13px; } .page-header { display: block; } .page-header__actions { margin-top: 16px; }
  .page-header__actions .button { flex: 1 1 auto; } .panel__body, .card { padding: 15px; }
  .definition-list { grid-template-columns: 1fr; gap: 2px; } .definition-list dd { margin-bottom: 10px; } th, td { padding: 10px 11px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; } }

/* Content and publishing editors share the same explicit locked state. */
.content-editor__head { display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap; }
.content-editor__head h2 { margin:0; }
.content-editor__fields { transition:opacity .15s; }
.content-editor:not(.is-editing) .content-editor__fields { opacity:.6;filter:grayscale(1); }
.content-editor:not(.is-editing) .content-editor__fields label { cursor:not-allowed; }
.content-editor__section-label { margin:0 18px 12px;font-size:15px;font-weight:650; }
.content-editor__media { margin:0 18px;border-top:1px solid var(--border); }
.content-editor__media .panel__header,.content-editor__media .panel__body { padding-left:0;padding-right:0; }
.content-editor__media h3 { margin:0;font-size:15px; }
.content-editor__result:has(.form-result:empty):has(#content-confirmation[hidden]) { display:none; }
.content-editor .content-preferences { border-top:0; }
.tag-prefix { color:var(--text-muted); }
.content-editor .tag-editor input.tag-entry { width:auto;min-height:0;padding:4px;border:0;background:transparent;box-shadow:none; }
.content-editor .tag-editor input.tag-entry:focus { outline:0; }
.tag-editor:focus-within { outline:3px solid color-mix(in srgb,var(--focus) 20%,transparent);border-color:var(--focus); }
.plan-editor .plan-editor__section { margin-top:26px;padding-top:24px; }
.plan-editor .plan-editor__section h3 { font-size:15px;margin-bottom:16px; }
.plan-keep-one { margin-top:18px;padding-bottom:0;font-size:13px; }
select { appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%238394a3' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4 6 4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:36px;box-shadow:none; }
select:disabled { cursor:not-allowed; }
select[multiple] { background-image:none;padding-right:10px; }
.lifecycle-bar .action-icon:hover:not(:disabled) { background:var(--surface-hover);border-color:var(--accent); }

.publication-plan-heading { margin-bottom:8px; }
.publication-plan-heading p { margin-bottom:0; }
.lifecycle-bar .action-icon--telegram svg { width:22px; height:22px; }

/* Owner tools share the host layout; only their document styles are isolated. */
.sidebar__tools{display:grid;gap:3px;padding:10px 0;flex-shrink:0}.sidebar__tools .nav-item{color:var(--text-secondary)}.sidebar__tools .nav-item.is-active{color:var(--text)}.sidebar__tools .tool-mark{width:20px;height:20px;flex:0 0 20px;margin:0}
.tool-preference{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0 0}.tool-preference__label{display:flex;align-items:center;gap:10px;font-weight:600}.tool-preference__label svg{width:24px;height:24px;color:var(--text-secondary)}.tool-preference.is-disabled .tool-preference__label,.tool-preference.is-disabled .tool-mark{color:var(--text-muted)}.tool-preference form{margin:0}
.tool-switch{display:flex;align-items:center;width:40px;height:24px;padding:3px;border:0;border-radius:20px;background:var(--border-strong);cursor:pointer}.tool-switch[aria-checked="true"]{background:var(--accent)}.tool-switch__thumb{width:18px;height:18px;background:var(--surface);border-radius:50%;box-shadow:var(--shadow-sm);transition:transform .15s}.tool-switch[aria-checked="true"] .tool-switch__thumb{transform:translateX(16px)}.tool-switch:disabled{opacity:.5;cursor:not-allowed}
.owner-tool-frame{display:block;width:100%;min-width:0;min-height:600px;border:0;background:var(--bg)}

/* One icon renderer in navigation and Settings, including monochrome Camex. */
.tool-mark{display:block;width:20px;height:20px;flex:0 0 20px;color:var(--text-secondary)}
.tool-preference__label .tool-mark{width:20px;height:20px;flex:0 0 20px}
.tool-mark--camex{-webkit-mask:url('../../owner_tools/camex-mark.png') center/contain no-repeat;mask:url('../../owner_tools/camex-mark.png') center/contain no-repeat}
.nav-item.is-active .tool-mark{color:var(--accent)}
.nav-item .tool-mark.tool-mark--camex{color:inherit}