/* Veillée world components. Load after themes.css and all workspace CSS.
   One real image atlas: four columns, two rows; each component uses its world's tile.
   Reading surfaces and inputs stay opaque; texture belongs to frames and controls. */
:root,[data-theme="medieval"]{
  --wc-atlas:url('/themes/veillee-material-atlas.webp');--wc-position:0% 0%;
  --wc-frame:#9b7643;--wc-edge:#d2ad6a;--wc-round:7px;--wc-panel-round:11px;
  --wc-header-wash:linear-gradient(#fff8e343,#fff8e34d);--wc-control-wash:linear-gradient(#fff8e36b,#fff8e34d);
  --wc-soft-wash:linear-gradient(#fffaf0df,#fffaf0e8);--wc-action-wash:linear-gradient(#684723eb,#493019f2);
  --wc-action-ink:#fff9e8;--wc-focus:#774318;--wc-glow:#ad783228;--wc-highlight:#805319;
  --wc-title-ink:#392b1a;--wc-label-font:Georgia,"Times New Roman",serif;--wc-shadow:0 3px 0 #6c4f2b25,0 7px 16px #37270e12;
}
[data-theme="horror"]{
  --wc-position:33.333333% 0%;--wc-frame:#9b8d73;--wc-edge:#c4b695;--wc-round:2px;--wc-panel-round:4px;
  --wc-header-wash:linear-gradient(#fff9e64a,#fff9e653);--wc-control-wash:linear-gradient(#fffbed8c,#fbf4df72);
  --wc-soft-wash:linear-gradient(#fffaf0e8,#fffaf0ed);--wc-action-wash:linear-gradient(#633b52ec,#45293beb);
  --wc-action-ink:#fff5ee;--wc-focus:#75304e;--wc-glow:#71375220;--wc-highlight:#75304e;
  --wc-title-ink:#423426;--wc-label-font:Georgia,"Times New Roman",serif;--wc-shadow:0 2px 0 #60504724,0 7px 18px #41263513;
}
[data-theme="modern"]{
  --wc-position:66.666667% 0%;--wc-frame:#8e9caa;--wc-edge:#dce3e9;--wc-round:9px;--wc-panel-round:14px;
  --wc-header-wash:linear-gradient(#ffffff4d,#f7fafc62);--wc-control-wash:linear-gradient(#ffffff91,#eff4f875);
  --wc-soft-wash:linear-gradient(#ffffffeb,#fffffff2);--wc-action-wash:linear-gradient(#285586ed,#1d3d65f2);
  --wc-action-ink:#ffffff;--wc-focus:#285c97;--wc-glow:#2c608422;--wc-highlight:#285c97;
  --wc-title-ink:#233342;--wc-label-font:"Avenir Next",Avenir,"Segoe UI",sans-serif;--wc-shadow:0 1px 0 #ffffff,0 4px 14px #2c41541a;
}
[data-theme="gritty"]{
  --wc-position:100% 0%;--wc-frame:#8b8b7b;--wc-edge:#b9b7a3;--wc-round:2px;--wc-panel-round:3px;
  --wc-header-wash:linear-gradient(#fffef141,#fffef161);--wc-control-wash:linear-gradient(#fffdf186,#fffdf178);
  --wc-soft-wash:linear-gradient(#fcfbf1e3,#fcfbf1ed);--wc-action-wash:linear-gradient(#4f5944ee,#353d2bf2);
  --wc-action-ink:#fffdf0;--wc-focus:#616336;--wc-glow:#6b62402b;--wc-highlight:#7c482b;
  --wc-title-ink:#30332a;--wc-label-font:"Avenir Next Condensed","Arial Narrow","Segoe UI",sans-serif;--wc-shadow:2px 3px 0 #4a4e3028,0 6px 14px #2c302018;
}
[data-theme="scifi"]{
  --wc-position:0% 100%;--wc-frame:#79a6af;--wc-edge:#63d8e5;--wc-round:3px;--wc-panel-round:8px;
  --wc-header-wash:linear-gradient(#f1fdff29,#f1fdff4f);--wc-control-wash:linear-gradient(#f1fdff91,#f1fdff65);
  --wc-soft-wash:linear-gradient(#faffffed,#fafffff5);--wc-action-wash:linear-gradient(#176877ed,#124653f2);
  --wc-action-ink:#f5ffff;--wc-focus:#126b7a;--wc-glow:#30dbea3b;--wc-highlight:#167c8f;
  --wc-title-ink:#173f48;--wc-label-font:"Avenir Next",Avenir,"Segoe UI",sans-serif;--wc-shadow:0 2px 0 #418e9c33,0 0 14px #41d9e51d;
}
[data-theme="star-trek"]{
  --wc-position:33.333333% 100%;--wc-frame:#8a989d;--wc-edge:#70d4e3;--wc-round:22px 7px 7px 22px;--wc-panel-round:24px 11px 11px 24px;
  --wc-header-wash:linear-gradient(#fcffff21,#fcffff43);--wc-control-wash:linear-gradient(#ffffff8f,#eef3f56f);
  --wc-soft-wash:linear-gradient(#fcffffed,#fcfffff5);--wc-action-wash:linear-gradient(#285564ee,#193e4ff2);
  --wc-action-ink:#f6fdff;--wc-focus:#24667c;--wc-glow:#51d8e633;--wc-highlight:#8f5b18;
  --wc-title-ink:#283b43;--wc-label-font:"Avenir Next",Avenir,"Segoe UI",sans-serif;--wc-shadow:inset 0 1px 0 #ffffff,0 3px 0 #77899138,0 0 14px #4de0ef22;
  --green:#275d70;--green-soft:#e0f1f4;--copper:#89541d;--copper-soft:#fff0d1;--blue:#346879;--line:#c3d1d6;--paper:#eff3f4;--surface:#fcfefe;--ink:#263b44;--muted:#566b74;
}
[data-theme="star-wars"]{
  --wc-position:66.666667% 100%;--wc-frame:#8c9395;--wc-edge:#d2bb75;--wc-round:3px;--wc-panel-round:5px;
  --wc-header-wash:linear-gradient(#fffef731,#fffef753);--wc-control-wash:linear-gradient(#fffef68a,#f8faf875);
  --wc-soft-wash:linear-gradient(#fffffbe9,#fffffbf1);--wc-action-wash:linear-gradient(#305475ed,#203a57f2);
  --wc-action-ink:#f9fdff;--wc-focus:#315c88;--wc-glow:#aa863024;--wc-highlight:#7d6024;
  --wc-title-ink:#283941;--wc-label-font:"Avenir Next",Avenir,"Segoe UI",sans-serif;--wc-shadow:0 3px 0 #57646b36,0 6px 14px #27333c19;
}
[data-theme="cyberpunk"]{
  --wc-position:100% 100%;--wc-frame:#b58eb8;--wc-edge:#f28cdb;--wc-round:3px 13px 3px 3px;--wc-panel-round:5px 22px 5px 5px;
  --wc-header-wash:linear-gradient(#fff5ff24,#fff5ff36);--wc-control-wash:linear-gradient(#fff7ff98,#fff7ff70);
  --wc-soft-wash:linear-gradient(#fffbffea,#fffbfff5);--wc-action-wash:linear-gradient(#893778ed,#612961f2);
  --wc-action-ink:#fff9ff;--wc-focus:#923478;--wc-glow:#eb57d437;--wc-highlight:#9b357e;
  --wc-title-ink:#4a2e56;--wc-label-font:"Avenir Next",Avenir,"Segoe UI",sans-serif;--wc-shadow:2px 2px 0 #35cae765,-2px -1px 0 #ea61d145,0 0 15px #e565da1e;
  --green:#923078;--green-soft:#fae3f6;--copper:#116577;--copper-soft:#dcf7fc;--blue:#126c88;--line:#dfc5e3;--paper:#f8f1fb;--surface:#fffcff;--ink:#452c52;--muted:#715879;
}
/* Full-width material surfaces establish the universe before any small accent. */
.topbar,.world-bar,.world-header{
  background-color:var(--surface);background-image:var(--wc-header-wash),var(--wc-atlas);
  background-size:100% 100%,400% 200%;background-position:center,var(--wc-position);background-repeat:no-repeat;
  border-top:1px solid var(--wc-edge);border-bottom:2px solid var(--wc-frame);box-shadow:var(--wc-shadow);
}
.topbar .brand-name,.world-header h1{color:var(--wc-title-ink);text-shadow:0 1px 0 #ffffffa8}
.topbar .session-label{color:var(--wc-title-ink)}
.brand-mark{border:1px solid var(--wc-frame);background:var(--surface);color:var(--wc-title-ink);box-shadow:inset 0 0 0 3px var(--wc-edge),0 2px 4px #00000018}
.world-current-title,.world-badge{
  display:inline-block;padding:4px 11px!important;margin-top:4px!important;border:1px solid var(--wc-frame);border-radius:var(--wc-round);
  color:var(--wc-title-ink)!important;background-image:var(--wc-control-wash),var(--wc-atlas);background-size:100% 100%,400% 200%;background-position:center,var(--wc-position);background-repeat:no-repeat;
  font-family:var(--wc-label-font);font-weight:650!important;letter-spacing:.025em!important;text-transform:none!important;box-shadow:inset 0 1px 0 #ffffffb8;
}
/* Carved / machined buttons: every idle and active control belongs to the same set. */
.button:not(.primary):not(.copper),.icon-button,.vl-button,.vm-button,.entry-enter,.entry-submit{
  border-color:var(--wc-frame);border-radius:var(--wc-round);
  background-color:var(--surface);background-image:var(--wc-control-wash),var(--wc-atlas);
  background-size:100% 100%,400% 200%;background-position:center,var(--wc-position);background-repeat:no-repeat;
  color:var(--wc-title-ink);box-shadow:var(--wc-shadow);text-shadow:0 1px 0 #ffffff65;
}
[data-theme] .button.primary,[data-theme] .button.copper,.vm-button.primary,.entry-enter,.entry-submit{
  background-image:var(--wc-action-wash),var(--wc-atlas);background-size:100% 100%,400% 200%;background-position:center,var(--wc-position);
  color:var(--wc-action-ink);border:1px solid var(--wc-frame);box-shadow:inset 0 1px 0 #ffffff50,0 2px 0 var(--wc-frame),0 5px 12px var(--wc-glow);text-shadow:none;
}
.button:hover:not(:disabled),.icon-button:hover:not(:disabled),.vl-button:hover:not(:disabled),.vm-button:hover:not(:disabled){border-color:var(--wc-highlight);filter:brightness(1.035);box-shadow:inset 0 0 0 1px var(--wc-edge),0 3px 10px var(--wc-glow)}
.button:active:not(:disabled),.icon-button:active:not(:disabled){transform:translateY(1px);box-shadow:inset 0 2px 3px #00000018}
.button:focus-visible,.icon-button:focus-visible,.vl-button:focus-visible,.vm-button:focus-visible,.rail button:focus-visible{outline:3px solid var(--wc-focus);outline-offset:3px}
.button:disabled,.icon-button:disabled{box-shadow:none;text-shadow:none}
.rail{background-color:var(--surface);border-right-color:var(--wc-frame);box-shadow:inset -3px 0 0 color-mix(in srgb,var(--wc-edge),transparent 55%)}
.rail button{border:1px solid transparent;border-radius:var(--wc-round)}
.rail button.active{
  color:var(--wc-title-ink);background-image:var(--wc-control-wash),var(--wc-atlas);background-size:100% 100%,400% 200%;background-position:center,var(--wc-position);
  border-color:var(--wc-frame);box-shadow:var(--wc-shadow);
}
/* Frames carry texture, while long text, tables and inputs keep a quiet surface. */
.panel,.mixer,.playlist,.vm-workspace,.vl-browser,.location-preview-panel,.journal-layout,.presentation-banner,.settings-grid>section{
  border-color:var(--wc-frame);border-radius:var(--wc-panel-round);background-color:var(--surface);box-shadow:inset 0 0 0 1px var(--wc-edge),0 5px 18px #21303b0c;
}
.panel>.section-top,.panel>h2:first-child,.location-preview-panel>.console-heading,.vm-section-heading,.vl-gallery-heading,.vl-folder-heading,.world-section-heading,.mixer>.section-top,.side-panel>.side-section:first-child>h2{
  background-color:var(--surface);background-image:var(--wc-header-wash),var(--wc-atlas);
  background-size:100% 100%,400% 200%;background-position:center,var(--wc-position);background-repeat:no-repeat;
  border:1px solid var(--wc-frame);border-radius:var(--wc-round);color:var(--wc-title-ink);padding:12px 14px;
  box-shadow:inset 0 1px 0 #ffffffb0,0 2px 0 #0000000b;
}
.panel>h2:first-child{margin-bottom:16px}.vl-gallery-heading .vl-meta,.vm-section-heading .vm-meta,.world-section-heading .subtitle{color:var(--wc-title-ink)}
.vl-gallery-heading h2,.vl-folder-heading h2,.vm-section-heading h2,.panel>.section-top h2,.world-section-heading h2{font-family:var(--wc-label-font);font-size:16px;text-shadow:0 1px 0 #ffffff88}
.vl-folders{background-image:var(--wc-soft-wash),var(--wc-atlas);background-size:100% 100%,400% 200%;background-position:center,var(--wc-position);border-right-color:var(--wc-frame)}
.vl-folders .vl-folder-heading{padding:10px 9px;margin:0 0 12px}.vl-folder-row.vl-folder-selected{box-shadow:inset 3px 0 0 var(--wc-highlight)}
.vl-folder-choose,.vl-folder-row>.vl-icon-button{background-image:none!important;box-shadow:none!important;text-shadow:none}
.vl-card-select{border:3px solid var(--wc-frame)!important;border-radius:var(--wc-panel-round)!important;box-shadow:0 0 0 1px var(--wc-edge),0 9px 18px #24343b1c!important}
.vl-cover.vl-selected .vl-card-select{border:4px solid var(--wc-highlight)!important;box-shadow:0 0 0 2px var(--wc-edge),0 12px 25px var(--wc-glow)!important}
.vl-card-caption{background:var(--surface);border-bottom:2px solid var(--wc-frame);padding:12px 8px 10px;border-radius:0 0 7px 7px;margin-top:3px}
.vl-player,.vl-pj-card,.vm-playlist-card{border-color:var(--wc-frame);border-radius:var(--wc-panel-round);box-shadow:inset 0 0 0 1px var(--wc-edge),0 3px 10px #20343b0d}
.vl-player-heading,.vm-playlist-select{
  color:var(--wc-title-ink);background-image:var(--wc-control-wash),var(--wc-atlas);background-size:100% 100%,400% 200%;background-position:center,var(--wc-position);
  padding:9px 10px;border-radius:var(--wc-round);margin-bottom:8px;
}
.vl-player-portrait,.vl-card-select{background-image:none!important;text-shadow:none}.vl-player-portrait{box-shadow:none!important}
.vl-flow-footer{border-top-color:var(--wc-frame)}.vl-drop-active{outline-color:var(--wc-highlight)!important;box-shadow:inset 0 0 0 4px var(--wc-edge)}
/* Menus and dialogs expose a material frame and an opaque readable centre. */
.vl-context,dialog,.location-docked,.context-menu{
  border:2px solid var(--wc-frame);border-radius:var(--wc-panel-round);background:var(--surface);color:var(--ink);box-shadow:0 0 0 1px var(--wc-edge),0 15px 45px #1f2c3b32;
}
.vl-context-title,#dialog-title,.context-menu-title{
  color:var(--wc-title-ink);background-image:var(--wc-header-wash),var(--wc-atlas);background-size:100% 100%,400% 200%;background-position:center,var(--wc-position);
  border:1px solid var(--wc-frame);border-radius:var(--wc-round);padding:12px;font-family:var(--wc-label-font);
}
.vl-context>.button.vl-button{background:var(--surface);color:var(--ink);box-shadow:none;text-shadow:none;border-radius:5px}
.vl-context>.button.vl-button:hover{background:var(--green-soft);box-shadow:inset 3px 0 0 var(--wc-highlight)}
input:not([type=range]):not([type=checkbox]):not([type=radio]),select,textarea,.vl-library input,.vl-library select{
  background-color:var(--surface);background-image:none;color:var(--ink);border-color:var(--line);box-shadow:inset 0 1px 2px #20303a07;text-shadow:none;
}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline-color:var(--wc-focus)}
input[type=checkbox],input[type=radio],input[type=range]{accent-color:var(--green)}
/* Eight distinct constructions, beyond palette swaps. */
[data-theme="medieval"] .topbar{border-bottom-width:4px;border-bottom-style:ridge}
[data-theme="medieval"] :is(.button,.icon-button,.vl-card-select,.world-current-title){border-style:ridge}
[data-theme="medieval"] :is(.vl-gallery-heading,.panel>h2:first-child,.vm-section-heading){border-inline:4px ridge #b68e4b;letter-spacing:.015em}
[data-theme="horror"] :is(.vl-gallery-heading,.panel>h2:first-child,.vm-section-heading,.world-current-title){border-style:double;border-width:3px}
[data-theme="horror"] .topbar{border-bottom:3px double var(--wc-frame)}
[data-theme="horror"] .vl-cover.vl-selected .vl-card-select{outline:1px solid #ab8c69;outline-offset:3px}
[data-theme="modern"] :is(.button,.icon-button,.vl-player,.vm-playlist-card){border-top-color:#f8fcff;border-bottom-color:#82929f}
[data-theme="modern"] :is(.vl-gallery-heading,.vm-section-heading){border-left:5px solid #457394}
[data-theme="gritty"] :is(.vl-gallery-heading,.vm-section-heading,.world-current-title){border-bottom:3px solid #65664e;letter-spacing:.035em}
[data-theme="gritty"] .vl-cover.vl-selected .vl-card-select{outline:2px dashed #8c7c4f;outline-offset:3px}
[data-theme="scifi"] :is(.vl-gallery-heading,.vm-section-heading,.world-current-title){border-left:4px solid #3595a9;border-bottom:2px solid #5ad5e1;box-shadow:inset 0 -1px 0 #ffffff,0 2px 8px #30cbd329}
[data-theme="scifi"] .topbar{border-bottom:3px solid #56bdcb}
[data-theme="star-trek"] :is(.vl-gallery-heading,.vm-section-heading,.panel>h2:first-child){border-left:9px solid #d6a34e;border-bottom:2px solid #60ccdc;padding-left:19px}
[data-theme="star-trek"] .topbar{border-bottom:4px solid #80979f;box-shadow:inset 0 -2px 0 #66d1df,0 4px 16px #29475818}
[data-theme="star-trek"] :is(.button.primary,.button.copper){border-left:5px solid #d8a34f;border-right:2px solid #69d4e5}
[data-theme="star-trek"] .vl-cover.vl-selected .vl-card-select{border-color:#658d99!important;box-shadow:0 0 0 2px #6bd7e3,0 0 0 4px #e4b56555,0 10px 25px #75cddd28!important}
[data-theme="star-wars"] :is(.vl-gallery-heading,.vm-section-heading,.world-current-title){border-left:6px solid #b39850;border-bottom:3px solid #7a878d}
[data-theme="star-wars"] .button{border-bottom-width:3px;letter-spacing:.02em}
[data-theme="star-wars"] .vl-cover.vl-selected .vl-card-select{outline:2px solid #b7a167;outline-offset:2px}
[data-theme="cyberpunk"] .topbar{border-bottom:3px solid #da75c8;box-shadow:inset 0 -1px 0 #a0edff,0 3px 0 #57cde05c,0 7px 20px #d676dd1a}
[data-theme="cyberpunk"] :is(.vl-gallery-heading,.vm-section-heading,.world-current-title){border-left:3px solid #39bfd9;border-bottom:2px solid #db74cb;box-shadow:2px 2px 0 #74dceb65,-1px -1px 0 #f19ee450}
[data-theme="cyberpunk"] :is(.button.primary,.button.copper){border-right:4px solid #66d1e6;border-bottom:3px solid #e282d1}
[data-theme="cyberpunk"] .vl-cover.vl-selected .vl-card-select{border-color:#b268aa!important;box-shadow:2px 2px 0 2px #59c9e0,-2px -2px 0 2px #e996df,0 8px 24px #b667bd33!important}
[data-theme="cyberpunk"] .rail button.active{border-right:3px solid #59c9e0;border-bottom:2px solid #df80cf}
[data-theme="cyberpunk"] :is(.vl-gallery-heading,.vm-section-heading,.panel>h2:first-child,.vl-context-title){padding-left:28px}
/* Existing navigation and journal text must never inherit a textured control skin. */
[data-theme] .button.console-doc-title,.journal-tree .button:not(.primary):not(.copper),.rich-editor .button:not(.primary):not(.copper),.vl-folder-choose{background-image:none;text-shadow:none}
@media(max-width:680px){
  .vl-gallery-heading,.vm-section-heading,.panel>.section-top{padding:10px;gap:8px}.world-current-title,.world-badge{max-width:180px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;vertical-align:middle}
  [data-theme="star-trek"] :is(.vl-gallery-heading,.vm-section-heading){border-left-width:5px;padding-left:12px}.vl-gallery-heading>.vl-button{max-width:150px;white-space:normal}
}
@media(prefers-reduced-motion:reduce){.button,.icon-button{transition:none!important}}

@media(max-width:600px){
  .topbar{height:auto;min-height:66px;flex-wrap:wrap;padding:10px 15px;gap:8px}
  .topbar .brand{flex:1 1 100%;min-width:0}
  .topbar .brand>div{min-width:0}
  .topbar .world-current-title{display:block;max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .rail{max-width:100%;overflow-x:auto;justify-content:flex-start}
  .rail button{flex:0 0 auto;min-width:52px}
}