/* Verminia's atelier: pigments, potion glass, herbs, dark fur and golden thread.
   Game art and palette swatches retain their original colour values. */
:root{
  color-scheme:dark;
  --ink:#201b22;--surface:#302832;--raised:#4c394a;
  --gold:#d9aa50;--bright:#f0dfb4;--text:#e9e5d6;--muted:#c6bbbf;
  --line:#b8a08066;--sage:#a4b58b;--linen:#e4d4ad;
}
body[data-view=styles]{background:var(--ink);color:var(--text);accent-color:var(--gold)}
body[data-view=styles]:before{
  background:linear-gradient(90deg,#211b21e8 0%,#38292dc7 52%,#211d27c9 100%),
    url('/assets/brand/verminia-workshop-backdrop.jpg') center 54%/cover no-repeat;
}
body[data-view=styles] .atelier-topbar{
  background:linear-gradient(110deg,#231e29f5,#48333aef);border-color:var(--line);
  box-shadow:0 1px 0 #e9c77a0c;
}
.atelier-topbar .brand b{color:var(--bright)}
.atelier-topbar .brand small{color:var(--muted)}
body[data-view=styles] .atelier-nav{background:#2d242aee;border-color:var(--line);color:#e5d6c8}
.atelier-nav span{color:#bda6a7}.atelier-nav a:hover{color:var(--bright)}
body[data-view=styles] :is(.eyebrow,.atelier-save-status){color:var(--sage)}
body[data-view=styles] .atelier-save-status[data-state=error]{color:#f0b799}
body[data-view=styles] .intro{color:#ded0c6}
body[data-view=styles] .page-head:after{background:linear-gradient(90deg,#d9aa5080,#a4b58b40,transparent)}
body[data-view=styles] .section-heading:after{background:linear-gradient(90deg,#a4b58b70,transparent)}
body[data-view=styles] :is(.button,.discord-btn){
  background:linear-gradient(180deg,#574454,#332935);color:var(--text);border-color:#a990a388;
  box-shadow:inset 0 0 0 2px #d8ce9510;
}
body[data-view=styles] :is(.button,.discord-btn):hover{background:#674d5d;color:#fff4d5;border-color:var(--gold)}
body[data-view=styles] .button.primary{
  background:linear-gradient(180deg,#ead095,#c49b50);color:#2e241d;border-color:#edd49b;
  box-shadow:inset 0 0 0 2px #fff0c33b,0 3px 12px #0002;
}
body[data-view=styles] .button.primary:hover{background:linear-gradient(180deg,#f3dfae,#d9b76a);color:#201b22}
body[data-view=styles] .button.primary:before,body[data-view=styles] .button.primary:after{opacity:.6}
body[data-view=styles] .language-switch button{color:#cdbbc2;border:1px solid transparent}
body[data-view=styles] .language-switch button[aria-pressed=true]{color:var(--bright);background:#9b6e7455;border-color:#c4b77f7a}
body[data-view=styles] :is(input,textarea,select){background:#231d29f2;color:var(--text);border-color:#a48c9c80}
body[data-view=styles] :is(input,textarea)::placeholder{color:#bcaab3}
body[data-view=styles] select option{background:#312632;color:var(--text)}
body[data-view=styles] :is(button,a,input,textarea,select,summary):focus-visible{outline:2px solid #e8c982;outline-offset:3px}
body[data-view=styles] .panel{
  background:linear-gradient(135deg,#3e3035f5,#282129fa);color:var(--text);
  box-shadow:0 8px 24px #0003;
}
body[data-view=styles] .panel :is(label,h2,h3,.muted){color:var(--muted)}
body[data-view=styles] .panel :is(h2,h3){color:var(--bright)}
body[data-view=styles] .style-empty.panel{
  background:radial-gradient(ellipse at top,#bb945d20,transparent 65%),#352731f5;
  border-color:#c4a48380;color:var(--text);
}
body[data-view=styles] .style-empty.panel :is(h2,p){color:var(--bright)}
body[data-view=styles] .style-empty.panel p{color:#ddcfc4}
body[data-view=styles] .style-empty.atelier-welcome{
  background:radial-gradient(ellipse at 82% 50%,#c7838a28,transparent 58%),
    linear-gradient(110deg,#382932f5,#2d2d35ef);
  border-color:#c2b87780;
}
body[data-view=styles] .atelier-drafts-heading :is(p,h2 span){color:var(--muted)}
body[data-view=styles] .style-card-caption h3{color:var(--bright)}
body[data-view=styles] .style-card-caption span{color:var(--muted)}
body[data-view=styles] .style-card-open:hover .style-card-caption{background:#81607544}
body[data-view=styles] :is(.style-photo,.style-photo-viewer){background:#1c1820}
body[data-view=styles] .style-photo-empty{color:var(--bright)}
body[data-view=styles] .style-photo-empty p{color:var(--muted)}
body[data-view=styles] .style-photo-expand{background:#332738ed;color:var(--bright);border-color:#c0b37699}
body[data-view=styles] .style-photo-expand:hover{background:#604454;color:#fff3cd;border-color:var(--gold)}
body[data-view=styles] .style-photo-tools small{color:var(--muted)}
body[data-view=styles] .style-story :is(input,textarea,select){background:#211b29f2;color:var(--text);border-color:#a48c9c80}
body[data-view=styles] :is(.style-photo-tools,.style-file-tools,.style-card-actions)>button{
  background:#3d2c40;color:var(--bright);border:1px solid #a990a366;padding:6px 10px;min-height:36px;
}
body[data-view=styles] :is(.style-photo-tools,.style-file-tools,.style-card-actions)>button:hover{background:#65485a;border-color:var(--gold)}
body[data-view=styles] .style-card-actions .style-like[aria-pressed=true]{color:#f0cb7c;background:#ad705d44}
body[data-view=styles] .style-settings.panel{background:linear-gradient(125deg,#493a40f7,#2d2530fa)}
body[data-view=styles] .style-tabs{border-color:#b3997877}
body[data-view=styles] .style-tabs button{background:#332836;color:#dbccd0;border-color:#a990a366}
body[data-view=styles] .style-tabs button:hover{background:#624757;color:var(--bright);border-color:var(--gold)}
body[data-view=styles] .style-tabs button[aria-selected=true]{background:#6d4d68;color:#fff0c6;border-color:#d9bc78;box-shadow:inset 0 -2px var(--gold)}
body[data-view=styles] .style-game-guide{background:#302633d9;border-color:#aa8c9a80;color:var(--text)}
body[data-view=styles] .style-game-guide summary{color:var(--bright)}
body[data-view=styles] .style-settings.panel .style-colour-widget{
  background:radial-gradient(ellipse at 15% 50%,#ac794330,transparent 70%),#292126f2;
  border-color:#c5a27477;color:var(--text);
}
body[data-view=styles] .style-settings.panel .style-colour-widget h3{color:#e8c77f}
body[data-view=styles] .style-widget-selection{border-color:#b89a8455}
body[data-view=styles] .style-widget-selection strong{color:var(--bright)}
body[data-view=styles] .style-widget-selection :is(small,span){color:var(--muted)}
body[data-view=styles] .style-colour-instruction{background:#76536a30;color:var(--text);border-color:#9e829855}
body[data-view=styles] .style-colour-instruction small{color:#cdbec6}
body[data-view=styles] button.style-colour-instruction:hover{background:#92637944;border-color:var(--gold)}
body[data-view=styles] .style-orbit-icon{background:#442e37a6;border-color:#c6a87477}
body[data-view=styles] button.style-orbit-icon:is(:hover,:focus-visible){background:#98637b44;border-color:var(--gold);box-shadow:inset 0 0 0 2px #d9aa5060}
body[data-view=styles] .style-colour-node:after{background:#211b28}
body[data-view=styles] .style-colour-node:is(:hover,:focus-visible){filter:none;outline-color:#eed594}
body[data-view=styles] .style-palette-strip .chosen{border-color:#f0d599}
body[data-view=styles] dialog{background:linear-gradient(135deg,#463243,#251e2d);color:var(--text)}
/* One charcoal backing inside the native frame, sampled from the game picker. */
body[data-view=styles] dialog:has(.style-palettes){background:#1f1f1e;background-clip:padding-box}
body[data-view=styles] dialog::backdrop{background:#140f1ae0}
body[data-view=styles] .dialog-head h2{color:var(--bright)}
body[data-view=styles] .dialog-head .icon-button:hover{border-color:var(--gold);background-color:#95658044}
body[data-view=styles] .style-picker-item{background:#392b3b;color:var(--text)}
body[data-view=styles] .style-picker-item strong{color:var(--bright)}
body[data-view=styles] .style-picker-item small{color:var(--muted)}
body[data-view=styles] .style-picker-item:hover{background:#674957}
body[data-view=styles] .style-picker-item[aria-pressed=true]{background:#765268;box-shadow:inset 0 0 0 1px #e2c78380}
body[data-view=styles] .style-picker-item[aria-pressed=true] small{color:var(--text)}
body[data-view=styles] .style-palettes{background:transparent;padding:0}
body[data-view=styles] .style-palettes section{background:transparent;border:0}
body[data-view=styles] .style-palette-heading{color:var(--bright)}
body[data-view=styles] .style-palette-options button{background:transparent;border-color:#ab8c98;color:var(--bright)}
body[data-view=styles] .style-palette-options [aria-pressed=true]{outline-color:#f0d599;border-color:#f0d599}
body[data-view=styles] .atelier-gallery-error{background:#3c2c32ee;border-color:#c5ae7080}
body[data-view=styles] .atelier-gallery-error h2{color:var(--bright)}
body[data-view=styles] .atelier-gallery-error p{color:var(--muted)}
body[data-view=styles] footer{color:var(--muted);border-color:#af978444}
body[data-view=styles] #toast{background:#554052;color:var(--bright);border-color:var(--gold)}
body[data-view=styles] .skip{background:#d6bd7d;color:#2c242b}
body[data-view=styles]{scrollbar-color:#9c7b8a #2b222d}
@media(max-width:760px){
  body[data-view=styles]:before{background-position:center,67% center}
  body[data-view=styles] .atelier-topbar{background:#251f29f5}
}
@media(prefers-reduced-motion:reduce){body[data-view=styles] :is(a,button,input,select,textarea){transition:none}}

/* Flax backing and individually coloured pigments, rather than one overall hue. */
body[data-view=styles] .eyebrow{color:#d8b477}
body[data-view=styles] .atelier-save-status{color:#c2bda3}
body[data-view=styles] .atelier-topbar{
  background:radial-gradient(ellipse at 85% 0,#3b656b30,transparent 45%),
    linear-gradient(110deg,#261e29f5,#432c36ef);
}
body[data-view=styles] .atelier-nav{position:relative}
body[data-view=styles] .atelier-nav:after{
  content:'';position:absolute;inset:auto 0 -1px;height:2px;pointer-events:none;
  background:linear-gradient(90deg,#c39558aa,#986b88aa 35%,#4f8180aa 65%,#89985e88);
}
body[data-view=styles] .page-head:after{background:linear-gradient(90deg,#dfb36199,#a36d8390,#51878370,transparent)}
body[data-view=styles] .section-heading:after{background:linear-gradient(90deg,#bb8a6970,#81668150,transparent)}
body[data-view=styles] .style-empty.atelier-welcome{
  background:radial-gradient(ellipse at 8% 5%,#ae74412c,transparent 52%),
    radial-gradient(ellipse at 85% 70%,#457a732c,transparent 52%),
    linear-gradient(110deg,#382932f5,#302833f5);
}
body[data-view=styles] .style-settings.panel{
  background:#ddceb3 url('/assets/ui/paper-texture.webp') repeat;
  background-size:384px 384px;background-blend-mode:multiply;color:#42342f;
}
body[data-view=styles] .style-settings.panel>h2{color:#44362f}
body[data-view=styles] .style-settings.panel>p.muted{color:#59483f}
body[data-view=styles] .style-tabs button[data-style-section=equipment][aria-selected=true]{background:#386267}
body[data-view=styles] .style-game-guide{background:#c7b89a80;color:#4b3b33;border-color:#8c756180}
body[data-view=styles] .style-game-guide summary{color:#49382f}
body[data-view=styles] .style-settings.panel .style-colour-widget{
  background:radial-gradient(ellipse at 10% 45%,#aa71352b,transparent 65%),#292126;
  border-color:#ba956e99;
}
body[data-view=styles] .style-settings.panel [data-style-widget=face]{
  background:radial-gradient(ellipse at 12% 50%,#a57da03b,transparent 70%),#2d2432;
  border-color:#a282a299;
}
body[data-view=styles] .style-settings.panel [data-style-widget=hair]{
  background:radial-gradient(ellipse at 12% 50%,#508e8438,transparent 70%),#202b30;
  border-color:#76a09999;
}
body[data-view=styles] .style-settings.panel [data-style-widget=arm]{
  background:radial-gradient(ellipse at 12% 50%,#8a9e6240,transparent 70%),#282c23;
  border-color:#9ba87b99;
}
body[data-view=styles] .style-settings.panel :is([data-style-widget=helm],[data-style-widget=legs]){
  background:radial-gradient(ellipse at 12% 50%,#b4715540,transparent 70%),#302429;
  border-color:#bd8d7799;
}

