:root {
  color-scheme: light;
  --brand-ink: #11100f;
  /* Workspace surfaces follow the Hotel project's semantic four-theme system. */
  --ws-surface: #fffdf8;
  --ws-soft: #f1ece2;
  --ws-selected: #e7ddc7;
  --ws-text: #423d33;
  --ws-muted: #716958;
  --ws-border: #c4b798;
  --ws-action: #74603d;
  --ws-hover: #57472b;
  --ws-dark: #423b2e;
  --paper: #f7f4ee;
  --ws-on-action: #fff9f4;
  --ws-warning: #785315;
  --ws-warning-bg: #fff4d9;
  --ws-error: #a12e3b;
  --ws-error-bg: #fff0f1;
  --ws-success: #276247;
  --ws-success-bg: #edf7ef;
  --brand-panel: color-mix(in srgb, var(--ws-surface) 58%, transparent);
  --brand-panel-strong: color-mix(in srgb, var(--ws-surface) 84%, transparent);
  --brand-line: color-mix(in srgb, var(--ws-border) 70%, transparent);
  --brand-gold: #c7a765;
  --brand-gold-light: #ead5a4;
  --brand-text: var(--ws-text);
  --brand-muted: var(--ws-muted);
  --accent-burgundy: #843a51;
  --accent-graphite: #90959c;
  --accent-tool: #3976bd;
  --accent-ivory: #e8ddc7;
  --brand-shadow: 0 14px 34px rgb(0 0 0 / 28%), inset 0 1px rgb(255 255 255 / 8%);
}
html[data-palette="burgundy"] {
  color-scheme: light;
  --ws-surface:#fffaf8; --ws-soft:#f0e5e7; --ws-selected:#ead0d8;
  --ws-text:#39232d; --ws-muted:#72626a; --ws-border:#c9adb6;
  --ws-action:#702f46; --ws-hover:#552035; --ws-dark:#38212c; --paper:#eee6e1;
  --brand-gold:#843a51; --brand-gold-light:#b87382;
  --brand-line:color-mix(in srgb,#c9adb6 72%,transparent);
}
html[data-palette="graphite"] {
  color-scheme: light;
  --ws-surface:#f8f9fa; --ws-soft:#e9ebee; --ws-selected:#d7dce2;
  --ws-text:#272d34; --ws-muted:#5c6672; --ws-border:#acb4be;
  --ws-action:#485461; --ws-hover:#303a46; --ws-dark:#29323d; --paper:#e8eaed;
  --brand-gold:#707984; --brand-gold-light:#969da6;
  --brand-line:color-mix(in srgb,#acb4be 72%,transparent);
}
html[data-palette="tool"] {
  color-scheme: light;
  --ws-surface:#ffffff; --ws-soft:#edf3f9; --ws-selected:#dceafd;
  --ws-text:#21354a; --ws-muted:#536b83; --ws-border:#a8bfd7;
  --ws-action:#2466a7; --ws-hover:#184d82; --ws-dark:#203d5c; --paper:#f0f4f8;
  --brand-gold:#3976bd; --brand-gold-light:#6899c8;
  --brand-line:color-mix(in srgb,#a8bfd7 72%,transparent);
}
html[data-palette="ivory"] {
  color-scheme: light;
  --ws-surface:#fffdf8; --ws-soft:#f1ece2; --ws-selected:#e7ddc7;
  --ws-text:#423d33; --ws-muted:#716958; --ws-border:#c4b798;
  --ws-action:#74603d; --ws-hover:#57472b; --ws-dark:#423b2e; --paper:#f7f4ee;
  --brand-gold:#c7a765; --brand-gold-light:#ead5a4;
  --brand-line:color-mix(in srgb,#c4b798 70%,transparent);
}

body:not(.visitor) {
  position: relative;
  isolation: isolate;
  min-height: 100vh;
  color: var(--ws-text);
  background: var(--paper);
}
body:not(.visitor)::before,
body:not(.visitor)::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}
body:not(.visitor)::before {
  background: url('/images/hero-workspace-architecture.png') center 42% / cover no-repeat;
  opacity: .22;
  filter: saturate(.45) contrast(1.04);
}
body:not(.visitor)::after {
  background: linear-gradient(110deg, color-mix(in srgb,var(--paper) 78%,transparent), color-mix(in srgb,var(--paper) 58%,transparent) 46%, color-mix(in srgb,var(--paper) 78%,transparent)),
    linear-gradient(0deg, var(--paper) 0%, transparent 38%, color-mix(in srgb,var(--paper) 28%,transparent) 100%);
}

body:not(.visitor) :is(aside, .panel, .stats article, .tour, .authbox, dialog,
  .uploadPanel, .empty, .assetcard, .assetgrid .job, #assetPicker,
  #assetDetails, #tourDialog, #mediaLibrary, #publicationDialog) {
  color: var(--ws-text);
  background: var(--brand-panel);
  border: 1px solid var(--brand-line);
  box-shadow: var(--brand-shadow);
  backdrop-filter: blur(18px) saturate(118%);
  -webkit-backdrop-filter: blur(18px) saturate(118%);
}
body:not(.visitor) aside {
  color: var(--ws-on-action);
  background: color-mix(in srgb,var(--ws-dark) 91%,transparent);
  border-left: 0;
  border-top: 0;
  border-bottom: 0;
}
body:not(.visitor) :is(main > header, .sectionTitle, .brand, .eyebrow) { color: var(--ws-text); }
body:not(.visitor) main > header { background:transparent; border:0; box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; }
body:not(.visitor) .headerMeta { display:flex;align-items:center;justify-content:flex-end;gap:12px; }
body:not(.visitor) :is(p, .small, .muted, .asideBottom span, .asideSub, .filename) { color: var(--brand-muted); }
body:not(.visitor) .brand span { color: var(--brand-gold); }
body:not(.visitor) .eyebrow { color: var(--ws-action); }
body:not(.visitor) .banner {
  color: var(--ws-warning);
  background: color-mix(in srgb,var(--ws-warning-bg) 82%,transparent);
  border-left-color: var(--brand-gold);
  border-radius: 0 10px 10px 0;
  backdrop-filter: blur(12px);
}
body:not(.visitor) > header,
body:not(.visitor) main > header,
body:not(.visitor) :is(.toolbar, .message, .filmstrip) {
  color: var(--ws-text);
  background: var(--brand-panel);
  border-color: var(--brand-line);
  backdrop-filter: blur(18px) saturate(118%);
  -webkit-backdrop-filter: blur(18px) saturate(118%);
}
/* These targeted overrides follow the broad surface rule so its :is() ID
   specificity cannot leave a white slab behind the sidebar or page heading. */
body:not(.visitor) #shell > aside { color:var(--ws-on-action);background:color-mix(in srgb,var(--ws-dark) 91%,transparent);border:0;border-right:1px solid var(--brand-line); }
body:not(.visitor) #shell > aside :is(.brand,.asideSub,.asideBottom,.asideBottom span) { color:color-mix(in srgb,var(--ws-on-action) 84%,transparent); }
body:not(.visitor) #shell > aside .brand span { color:var(--brand-gold-light); }
body:not(.visitor) main > header { background:transparent;border:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none; }
body:not(.visitor) .local { color:var(--ws-muted);background:color-mix(in srgb,var(--ws-soft) 72%,transparent);border-color:var(--ws-border); }
body:not(.visitor) #arrowStylePanel,
body:not(.visitor) #arrowDestinationPanel,
body:not(.visitor) #poiPanel {
  color: var(--ws-text);
  background: var(--brand-panel-strong);
  border-color: var(--brand-line);
  box-shadow: var(--brand-shadow);
  backdrop-filter: blur(18px) saturate(118%);
  -webkit-backdrop-filter: blur(18px) saturate(118%);
}
body:not(.visitor) #arrowStylePanel :is(p, .pickerLabel, .styleNote),
body:not(.visitor) #arrowDestinationPanel #destinationStatus,
body:not(.visitor) #poiPanel :is(label, .richLabel, .richCount) { color: var(--brand-muted); }
body:not(.visitor) :is(input, select, textarea) {
  color: var(--ws-text);
  background: color-mix(in srgb,var(--ws-surface) 92%,transparent);
  border: 1px solid var(--ws-border);
  border-radius: 10px;
}
body:not(.visitor) :is(input, select, textarea)::placeholder { color: #a79d8c; }
body:not(.visitor) :is(button, .button) {
  color: var(--ws-on-action);
  background: linear-gradient(180deg, color-mix(in srgb,var(--ws-action) 82%,#fff 18%), var(--ws-action));
  border: 1px solid color-mix(in srgb,var(--ws-action) 68%,#fff 32%);
  border-radius: 12px;
  box-shadow: 0 3px 0 rgb(13 12 10 / 75%), 0 7px 16px rgb(0 0 0 / 24%), inset 0 1px rgb(255 255 255 / 14%);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease;
}
body:not(.visitor) :is(button, .button):hover:not(:disabled):not(.marker) {
  border-color: var(--brand-gold-light);
  background: linear-gradient(180deg, color-mix(in srgb,var(--ws-hover) 82%,#fff 18%), var(--ws-hover));
  transform: translateY(-1px);
  box-shadow: 0 4px 0 rgb(13 12 10 / 72%), 0 11px 22px rgb(0 0 0 / 30%), inset 0 1px rgb(255 255 255 / 18%);
}
body:not(.visitor) :is(button, .button):active:not(:disabled):not(.marker) { transform: translateY(1px); box-shadow: 0 1px 0 #0d0c0a, inset 0 2px 5px rgb(0 0 0 / 28%); }
body:not(.visitor) :is(button, .button).primary,
body:not(.visitor) :is(#add, #save, #publishButton, #loginButton, #newTour, #confirmAssets) {
  color: var(--ws-on-action);
  background: linear-gradient(180deg, color-mix(in srgb,var(--ws-action) 80%,#fff 20%), var(--ws-action));
  border-color: color-mix(in srgb,var(--ws-action) 65%,#fff 35%);
  text-shadow: 0 1px rgb(255 255 255 / 30%);
}
body:not(.visitor) :is(button, .button):disabled { opacity:1;filter:none;color:color-mix(in srgb,var(--ws-text) 72%,var(--ws-surface));background:linear-gradient(180deg,var(--ws-soft),color-mix(in srgb,var(--ws-soft) 76%,var(--ws-border)));border-color:var(--ws-border);box-shadow:inset 0 1px #fff8,0 2px 0 color-mix(in srgb,var(--ws-border) 65%,var(--ws-text));cursor:not-allowed; }
body:not(.visitor) a:not(.button) { color: var(--ws-action);text-decoration:none;font-weight:600; }
body:not(.visitor) a:not(.button):hover { color: var(--brand-text);text-decoration:underline;text-decoration-color:var(--brand-gold);text-underline-offset:3px; }
body:not(.visitor) #back,
body:not(.visitor) #back:visited,
body:not(.visitor) #back:hover,
body:not(.visitor) #back:focus-visible { color:var(--ws-on-action);text-decoration:none; }
body:not(.visitor) #back { background:linear-gradient(180deg,rgb(69 60 43 / 96%),rgb(42 37 29 / 98%));border:1px solid var(--brand-line);border-radius:12px;box-shadow:0 3px 0 rgb(13 12 10 / 75%),0 7px 16px rgb(0 0 0 / 24%),inset 0 1px rgb(255 255 255 / 14%); }
body:not(.visitor) .palettePicker { display:flex;align-items:center;gap:7px;padding:5px 8px;border:1px solid var(--brand-line);border-radius:999px;background:rgb(15 14 12 / 78%);box-shadow:inset 0 1px rgb(255 255 255 / 8%); }
body:not(.visitor) .palettePicker button { width:18px;height:18px;min-width:18px;min-height:18px;padding:0;border:1px solid rgb(255 255 255 / 62%);border-radius:50%;box-shadow:0 1px 3px rgb(0 0 0 / 55%); }
body:not(.visitor) .palettePicker button[data-palette="burgundy"] { background:#843a51; }
body:not(.visitor) .palettePicker button[data-palette="graphite"] { background:#90959c; }
body:not(.visitor) .palettePicker button[data-palette="tool"] { background:#3976bd; }
body:not(.visitor) .palettePicker button[data-palette="ivory"] { background:#e8ddc7; }
body:not(.visitor) .palettePicker button[aria-pressed="true"] { outline:2px solid var(--brand-gold-light);outline-offset:3px;transform:scale(1.08); }
body:not(.visitor) .userSettings { position:relative;z-index:25; }
body:not(.visitor) .userSettings>summary { display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border:1px solid var(--brand-line);border-radius:999px;color:var(--ws-on-action);background:color-mix(in srgb,var(--ws-dark) 88%,transparent);font-size:12px;font-weight:650;line-height:1.4;cursor:pointer;list-style:none; }
body:not(.visitor) .userSettings>summary::-webkit-details-marker { display:none; }
body:not(.visitor) .userSettings>summary::after { content:"▾";font-size:10px;opacity:.78; }
body:not(.visitor) .userSettings[open]>summary { border-color:var(--brand-gold-light); }
body:not(.visitor) .userSettingsPanel { position:absolute;z-index:30;display:grid;gap:10px;min-width:190px;padding:12px;border:1px solid var(--brand-line);border-radius:13px;color:var(--ws-on-action);background:var(--ws-dark);box-shadow:var(--brand-shadow); }
body:not(.visitor) .userSettingsPanel>strong { color:inherit;font-size:12px; }
body:not(.visitor) #shell #userSettingsPanel { left:0;bottom:calc(100% + 9px); }
body:not(.visitor) .userSettingsPanel .palettePicker { width:max-content; }
body:not(.visitor) :is(button, a, input, select, textarea, summary):focus-visible {
  outline: 3px solid var(--ws-action);
  outline-offset: 3px;
}
body:not(.visitor) .close-icon-button {
  color: var(--brand-gold-light);
  background: linear-gradient(145deg, #29251e, #11100e);
  border-color: var(--brand-gold);
  box-shadow: 0 0 0 3px rgb(199 167 101 / 11%), 0 5px 14px rgb(0 0 0 / 34%), inset 0 1px rgb(255 255 255 / 12%);
}
body:not(.visitor) .close-icon-button:hover { background: linear-gradient(145deg, #443922, #1b1812); }
body:not(.visitor) .job, body:not(.visitor) .assetcard, body:not(.visitor) .tour { min-width: 0; }
body:not(.visitor) .assetgrid { grid-template-columns: repeat(auto-fill, minmax(178px, 1fr)); gap: 12px; }
body:not(.visitor) .assetgrid .job, body:not(.visitor) .assetcard { gap: 6px; }
body:not(.visitor) .assetgrid .job { padding-bottom: 9px; }
body:not(.visitor) .assetgrid .job>div:not(.thumb) { padding: 0 10px; }
body:not(.visitor) .assetgrid .job>.thumb, body:not(.visitor) .photo img { aspect-ratio: 1.8 / 1; }
body:not(.visitor) .cardbody { padding: 9px; }
body:not(.visitor) .cardbody .inline { gap: 5px; }
body:not(.visitor) .cardbody button, body:not(.visitor) .cardbody a { padding: 5px 8px; font-size: 12px; }
body:not(.visitor) .metadataPills { display: flex; flex-wrap: wrap; gap: 5px; margin: 7px 0; }
body:not(.visitor) .metaPill {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 2px 8px;
  border: 1px solid transparent;
  border-radius: 999px;
  color: #332f29;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.35;
  white-space: nowrap;
  box-shadow: inset 0 1px rgb(255 255 255 / 52%);
}
body:not(.visitor) .jobNote { display:grid;gap:0;margin-top:8px;color:var(--ws-muted);font-size:12px;line-height:1.45; }
body:not(.visitor) .jobNote.is-active { padding:9px 10px;border:1px solid color-mix(in srgb,#d7b777 48%,transparent);border-radius:9px;color:#f7efe8;background:radial-gradient(ellipse at 12% 15%,rgb(95 70 37 / 34%),transparent 64%),linear-gradient(135deg,#171015,#0b090a);box-shadow:inset 0 1px rgb(255 255 255 / 7%),0 5px 14px rgb(0 0 0 / 14%); }
body:not(.visitor) .jobNote.is-active>span { color:#f7efe8;font-weight:650; }
body:not(.visitor) .jobNote.is-error { color:var(--ws-error); }
body:not(.visitor) .cuttingTrack { height:4px;margin-top:8px;overflow:hidden;border-radius:999px;background:#0b090a;box-shadow:inset 0 1px 2px rgb(0 0 0 / 70%); }
body:not(.visitor) .cuttingTrack>span { display:block;width:45%;height:100%;border-radius:inherit;background:linear-gradient(90deg,transparent,#ad8137 28%,#ffe4a3 52%,#d7b777 72%,transparent);animation:materialGoldFlow 2.8s ease-in-out infinite; }
@keyframes materialGoldFlow { from { transform:translateX(-110%); } to { transform:translateX(330%); } }
body:not(.visitor) .tone-blue { background: #d9e6ee; border-color: #9eb7c8; }
body:not(.visitor) .tone-sand { background: #e9dfc9; border-color: #c7b58f; }
body:not(.visitor) .tone-rose { background: #ecd9d7; border-color: #caa7a3; }
body:not(.visitor) .tone-green { background: #d8e6d9; border-color: #a0bba1; }
body:not(.visitor) .tone-red { background: #efd9d5; border-color: #ceaaa1; }
body:not(.visitor) .tone-gold { background: #f0e1b9; border-color: #cbb16b; }
body:not(.visitor) .tone-neon { background:#baff70;border-color:#70d321;color:#18320b;font-weight:750;box-shadow:0 0 0 1px rgb(131 235 56 / 28%),0 0 16px rgb(114 245 55 / 22%); }
body:not(.visitor) .tone-deleted { background:#ff263e;border-color:#cf001b;color:#fff;font-weight:800;box-shadow:0 0 0 1px rgb(255 38 62 / 25%),0 2px 10px rgb(210 0 25 / 24%); }
body:not(.visitor) .jobNote.is-active { border-color:#8ddd42;background:radial-gradient(ellipse at 12% 15%,rgb(52 99 26 / 30%),transparent 64%),linear-gradient(135deg,#13190f,#0b0e09); }
body:not(.visitor) .jobNote.is-active>span { color:#c6ff8c; }
body:not(.visitor) .jobNote.is-active .cuttingTrack { background:rgb(207 255 178 / 14%); }
body:not(.visitor) .jobNote.is-active .cuttingTrack>span { background:linear-gradient(90deg,#8ce336,#c7ff75,#76da2e);box-shadow:0 0 12px rgb(165 255 78 / 78%); }
body:not(.visitor) .job-deleted { border-color:#f0a0a8; }
body:not(.visitor) .deletedThumb { display:grid;place-items:center;background:#fff0f1;color:#ef263d;font-size:34px;font-weight:400; }
body:not(.visitor) .deletedMessage { color:#bd1429;font-weight:650; }
body:not(.visitor) .tag { color: #3b352a; background: #e8ddc7; }
body:not(.visitor) .tag.good { background: #d8e6d9; color: #31523c; }
body:not(.visitor) .tag.bad { background: #efd9d5; color: #7e382d; }
body:not(.visitor) .tour { padding: 16px; border-radius: 14px; }
body:not(.visitor) .tour .cover { margin: -16px -16px 12px; padding: 16px; height: 68px; color: var(--ws-action); background: color-mix(in srgb,var(--ws-selected) 68%,transparent); border-radius: 14px 14px 0 0; }
body:not(.visitor) nav button.active { color: var(--ws-on-action); background: linear-gradient(180deg,color-mix(in srgb,var(--ws-action) 80%,#fff 20%),var(--ws-action)); }
body:not(.visitor) .close-icon-button,
body:not(.visitor) .marker,
body:not(.visitor) .markerSettings,
body:not(.visitor) .headerColors button,
body:not(.visitor) .colorChoices button,
body:not(.visitor) .iconChoices button,
body:not(.visitor) #scenes button { box-shadow: none; }
body:not(.visitor) .marker { background: transparent; border: 0; }
body:not(.visitor) dialog::backdrop { background: rgb(8 8 7 / 72%); backdrop-filter: blur(7px); }
body:not(.visitor) .applicationGrid button[aria-pressed=true],
body:not(.visitor) .applicationFallback button[aria-pressed=true],
body:not(.visitor) #sceneNamePanel button[aria-pressed=true] { color: var(--ws-on-action); background: linear-gradient(180deg,color-mix(in srgb,var(--ws-action) 80%,#fff 20%),var(--ws-action)); }

@media (max-width: 950px) and (min-width: 651px) {
  body:not(.visitor) .assetgrid { grid-template-columns: repeat(auto-fill, minmax(165px, 1fr)); gap: 9px; }
  body:not(.visitor) main { padding: 24px 22px; }
  body:not(.visitor) .cardbody .inline { gap: 4px; }
}
body:not(.visitor) :is(button.primary,#add,#save,#publishButton,#loginButton,#newTour,#confirmAssets) { background:linear-gradient(180deg,color-mix(in srgb,var(--ws-action) 80%,#fff 20%),var(--ws-action));border-color:color-mix(in srgb,var(--ws-action) 65%,#fff 35%);color:var(--ws-on-action); }
body:not(.visitor) .sceneTitleRow strong { color: var(--brand-text); }
body:not(.visitor) .sceneApplication { color: var(--ws-action);font-weight:650; }
body:not(.visitor) .photo { background:var(--ws-soft); }
body:not(.visitor) .photo img { display:block; }
body:not(.visitor) .number { color: var(--ws-text); background: var(--ws-selected); border:1px solid var(--ws-border); }
body:not(.visitor) #toast:not(:empty) { color: var(--ws-text); background: color-mix(in srgb,var(--ws-surface) 94%,transparent); border: 1px solid var(--ws-border); box-shadow: var(--brand-shadow); backdrop-filter: blur(16px); }
body:not(.visitor) .meter { background: color-mix(in srgb,var(--ws-border) 42%,transparent); }
body:not(.visitor) .meter div { background: linear-gradient(90deg,var(--ws-action),color-mix(in srgb,var(--ws-action) 66%,#fff 34%)); }
body:not(.visitor) #applicationPanel,
body:not(.visitor) #projectApplicationPanel,
body:not(.visitor) #sceneNamePanel,
body:not(.visitor) #inheritedApplication { color: var(--ws-text); background:color-mix(in srgb,var(--ws-soft) 88%,transparent); border-color:var(--ws-border); }
body:not(.visitor) :is(#applicationPanel,#projectApplicationPanel,#sceneNamePanel,#inheritedApplication) button[aria-pressed=true] { color:var(--ws-on-action);background:linear-gradient(180deg,color-mix(in srgb,var(--ws-action) 80%,#fff 20%),var(--ws-action)); }
body:not(.visitor) .tag.good { color:var(--ws-success);background:var(--ws-success-bg); }
body:not(.visitor) .tag.bad { color:var(--ws-error);background:var(--ws-error-bg); }
body:not(.visitor) :is(#tourDialog, #assetPicker, #assetDetails, #mediaLibrary, #publicationDialog) h2 { color: var(--brand-text); }
body.visitor .visitorTitle,
body.visitor #dock,
body.visitor #visitorScenes,
body.visitor #expand,
body.visitor #viewerStatus {
  color: var(--ws-text);
  background: color-mix(in srgb,var(--ws-dark) 84%,transparent);
  border: 1px solid var(--brand-line);
  box-shadow: 0 12px 28px rgb(0 0 0 / 32%), inset 0 1px rgb(255 255 255 / 9%);
  backdrop-filter: blur(18px) saturate(118%);
  -webkit-backdrop-filter: blur(18px) saturate(118%);
}
body.visitor .visitorTitle { border-radius: 14px; }
body.visitor .visitorTitle span { color: var(--brand-gold-light); }
body.visitor .visitorTitle h1 { color: var(--ws-on-action); }
body.visitor #dock { border-radius: 16px; }
body.visitor #dock button,
body.visitor #expand,
body.visitor #visitorScenes button {
  color: var(--ws-on-action);
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  box-shadow: none;
}
body.visitor #dock button:hover,
body.visitor #visitorScenes button:hover { border-color: var(--brand-line); background: rgb(255 255 255 / 9%); }
body.visitor #dock button[aria-pressed="true"],
body.visitor #visitorScenes button[aria-current="true"] {
  color: var(--ws-on-action);
  border-color: var(--brand-gold-light);
  background: linear-gradient(180deg,var(--brand-gold-light),var(--brand-gold));
}
body.visitor #visitorScenes button[aria-current="true"] { border-width: 2px; }
body.visitor :is(#passwordDialog,#poiViewer,#shareDialog) {
  color: var(--brand-text);
  background: color-mix(in srgb,var(--ws-dark) 94%,transparent);
  border: 1px solid var(--brand-line);
  border-radius: 18px;
  box-shadow: 0 20px 50px rgb(0 0 0 / 42%), inset 0 1px rgb(255 255 255 / 8%);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}
body.visitor :is(#passwordDialog,#poiViewer,#shareDialog) :is(h2,label,p,small,strong) { color: inherit; }
body.visitor :is(#passwordDialog,#poiViewer,#shareDialog) input {
  color: var(--brand-text);
  background: rgb(12 11 10 / 75%);
  border: 1px solid var(--brand-line);
  border-radius: 9px;
}
body.visitor :is(#passwordDialog,#poiViewer,#shareDialog) button:not(.close-icon-button) {
  color: #211a0d;
  border: 1px solid var(--brand-gold-light);
  border-radius: 11px;
  background: linear-gradient(180deg,var(--brand-gold-light),var(--brand-gold));
  box-shadow: 0 3px 0 rgb(0 0 0 / 55%), inset 0 1px rgb(255 255 255 / 36%);
}
body.visitor .richBody { color: var(--ws-on-action); }
body.visitor .richBody blockquote { border-color: var(--brand-gold); color: #d8cfbf; }
body.visitor #localNote { color: var(--brand-gold-light); }
body.visitor #viewerStatus { color: var(--ws-on-action); border-radius: 10px; }
@media (prefers-reduced-motion: reduce) {
  body:not(.visitor) *, body:not(.visitor) *::before, body:not(.visitor) *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
  body:not(.visitor) .cuttingTrack>span { animation:none;transform:translateX(60%); }
}

/* Compact processing queue cards. */
body:not(.visitor) #jobs .job{min-width:0;display:flex;flex-direction:column;gap:8px}
body:not(.visitor) #jobs .jobName{display:block;width:100%;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;overflow-wrap:normal;line-height:1.5;height:1.5em}
#jobs .jobName>span{display:inline-block;white-space:nowrap}
#jobs .jobName.is-overflowing:hover>span,#jobs .jobName.is-overflowing:focus>span{animation:scene-name-marquee var(--marquee-duration,6s) ease-in-out infinite alternate}
body:not(.visitor) #jobs .jobActions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:auto;padding:0 10px}
body:not(.visitor) #jobs .jobActions button{width:100%;min-width:0;margin:0;padding:8px 4px;font-size:13px;white-space:nowrap}
body:not(.visitor) #jobs .jobNote:not(.is-active)>span,body:not(.visitor) #jobs .deletedMessage{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:12px;line-height:1.45;margin:6px 0}
@media(prefers-reduced-motion:reduce){#jobs .jobName.is-overflowing>span{animation:none!important}}

/* Destination cards: explicit readable selected and disabled states across themes. */
body:not(.visitor) #destinationScenes button[aria-pressed="true"] {background:#e1eee7;color:#183e30;outline:3px solid #356b50;opacity:1;}
body:not(.visitor) #destinationScenes button[aria-pressed="true"] span {color:#183e30;}
body:not(.visitor) #destinationScenes button[aria-pressed="true"] span::before {content:"✓ 已選取 · ";font-weight:700;}
body:not(.visitor) #destinationScenes button:disabled {background:#e9e5e3;color:#514b49;opacity:1;cursor:not-allowed;}
body:not(.visitor) #destinationScenes button:disabled span {color:#514b49;}
body:not(.visitor) #destinationScenes button:disabled img {opacity:.55;}
.returnOption {display:flex;align-items:center;gap:8px;font-weight:600;}
.returnHint {font-size:13px;line-height:1.5;}

body:not(.visitor) .markerSettings.markerDelete{left:45px;top:39px;width:24px;height:24px;min-width:24px;padding:4px;border-radius:50%;background:#8d3041;color:#fff;border:1px solid #fff9;box-shadow:0 2px 5px #0005;}
.markerDelete svg{display:block;width:100%;height:100%;pointer-events:none;}
#deleteArrowDialog{width:min(380px,90vw);border-radius:16px;padding:20px;}
#deleteArrowDialog::backdrop{background:#0005;}
#deleteArrowError{color:#a52b36;}

body:not(.visitor) #arrowDestinationPanel{background:color-mix(in srgb,var(--ws-surface,#f6f2e9) 65%,transparent);backdrop-filter:blur(10px);}
#arrowDestinationPanel>.poiHeading{flex-wrap:nowrap;gap:12px;}
#arrowDestinationPanel>.poiHeading strong{font-size:13px;white-space:nowrap;}
#arrowDestinationPanel .returnOption{margin:0 auto 0 0;font-size:12px;white-space:nowrap;gap:4px;}
#arrowDestinationPanel .returnOption input{margin:0;}
body:not(.visitor) .markerSettings.markerArrival{left:-17px;top:39px;width:24px;height:24px;min-width:24px;padding:3px;border-radius:50%;background:#294d62;color:white;border:1px solid #ffffff99;box-shadow:0 2px 5px #0005;}
.markerArrival svg{display:block;width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.6;pointer-events:none;}
#arrivalOverlay .arrivalShade{inset:8px;background:transparent;border:2px solid rgba(217,109,128,.8);border-radius:12px;box-shadow:0 0 0 8px rgba(251,192,203,.32),inset 0 0 0 10px rgba(251,192,203,.22);pointer-events:none;}
#arrivalOverlay .arrivalBar{width:max-content;max-width:calc(100% - 48px);bottom:24px;box-sizing:border-box;min-height:0;padding:7px 10px;background:rgba(255,231,237,.72);backdrop-filter:blur(8px);border:1px solid rgba(217,109,128,.6);gap:10px;}
.arrivalDragHint{display:flex;align-items:center;padding:4px 8px;color:#713746;}
.arrivalDragHint svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
body:not(.visitor) #arrivalOverlay .arrivalBar button{width:38px;height:38px;min-width:38px;padding:0;border-radius:50%;font-size:23px;line-height:1;}

body:not(.visitor) #scenes .sceneActions button{padding:4px 10px;min-height:30px;font-size:12px;border-radius:10px;box-shadow:inset 0 1px 0 #ffffff30,0 2px 0 #302c24,0 3px 6px #0002;}

body:not(.visitor) .tone-failed{background:#ff263e;border-color:#cf001b;color:#fff;font-weight:800;box-shadow:0 2px 10px #d200193d;}
.statusCheck{width:15px;height:15px;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:1.8;}
body:not(.visitor) .metadataPills .retryPill{padding:3px 8px;font-size:11px;min-height:0;border-radius:20px;box-shadow:none;}

/* Workspace navigation: flat, compact controls with a scrollable project list. */
body:not(.visitor) #shell>aside{padding:24px 16px;overflow:hidden;}
#shell>aside .asideSub{margin-bottom:20px;}
#shell>aside nav{flex:none;}
#shell>aside .projectNavigation{display:flex;flex-direction:column;flex:1;min-height:80px;margin:8px 0 16px;gap:6px;}
#sidebarProjects{overflow-y:auto;overscroll-behavior:contain;min-height:0;flex:1;scrollbar-width:thin;}
body:not(.visitor) #shell>aside :is(nav button,#sidebarProjects button,#sidebarNewProject,#adminNav){background:transparent;box-shadow:none;border:1px solid transparent;border-radius:7px;color:var(--ws-on-action);transform:none;text-align:left;}
body:not(.visitor) #shell>aside nav button{padding:10px;font-size:13px;}
body:not(.visitor) #shell>aside nav button.active{background:#ffffff18;border-color:#ffffff26;}
body:not(.visitor) #sidebarProjects button{display:flex;align-items:center;gap:8px;width:100%;padding:8px 10px;margin:2px 0;font-size:12px;}
#sidebarProjects button span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
#sidebarProjects button small{opacity:.65;font-size:10px;}
body:not(.visitor) #sidebarProjects button[aria-current="page"]{background:#ffffff20;border-color:var(--brand-gold);}
body:not(.visitor) #shell>aside #sidebarNewProject{font-size:12px;padding:6px 10px;}
#shell>aside .asideBottom{flex:none;margin-top:auto;padding-top:12px;border-top:1px solid #ffffff22;gap:3px;}
body:not(.visitor) #shell>aside #adminNav{font-size:12px;padding:5px 0;margin-top:0;}
.projectEmpty{font-size:12px;padding:8px;}
.headerAssetSwitch{display:grid;grid-template-columns:repeat(2,minmax(130px,1fr));gap:12px;flex:1;max-width:620px;margin:0 20px;}
body:not(.visitor) .headerAssetSwitch button{box-shadow:none;background:var(--ws-soft);color:var(--ws-text);border:1px solid var(--brand-line);border-radius:10px;padding:14px 20px;text-align:left;transform:none;}
.headerAssetSwitch strong,.headerAssetSwitch small{display:block;}
.headerAssetSwitch strong{font-size:18px;}.headerAssetSwitch small{font-size:11px;opacity:.75;}
body:not(.visitor) .headerAssetSwitch button[aria-pressed="true"]{border-color:var(--ws-action);background:color-mix(in srgb,var(--ws-action) 12%,var(--ws-soft));box-shadow:inset 0 -3px 0 var(--ws-action);}
body:not(.visitor) main>#mediaLibrary{width:100%;max-height:none;padding:18px;margin:0;border:1px solid var(--brand-line);border-radius:12px;background:var(--ws-soft);color:var(--ws-text);}
@media(min-width:761px) and (max-width:1100px){main>header{flex-wrap:wrap;gap:12px;}.headerAssetSwitch{order:3;flex-basis:100%;max-width:none;margin:0;}#shell>aside{width:220px;}main{margin-left:220px;}}
body:not(.visitor) #shell>aside nav button#projectNav.active,body:not(.visitor) #shell>aside nav button#assetsNav.active{background:#ffffff18;border-color:#ffffff26;}
body:not(.visitor) #shell #sidebarProjects button[aria-current="page"]{background:#ffffff20;border-color:var(--brand-gold);}
#closeEditor{display:none;}