:root{
  --viandia-bg:#0d0710;
  --viandia-panel:#211229;
  --viandia-panel-2:#2a1735;
  --viandia-gold:#e5c46e;
  --viandia-gold-soft:#f4db97;
  --viandia-cream:#fff4d7;
  --viandia-violet:#6f4bd6;
  --viandia-violet-2:#4c2f9d;
  --viandia-ink:#30204b;
  --viandia-radius-xl:34px;
  --viandia-radius-lg:24px;
  --viandia-radius-md:18px;
  --viandia-shadow:0 28px 80px rgba(0,0,0,.52);
  --viandia-line:rgba(229,196,110,.38);
}

html{background:var(--viandia-bg)}
body{background:var(--viandia-bg)}

/* Shared premium surfaces */
.panel,.finish-card,.parents-panel,.desktop-card,.dcard,.daction,.sheet .panel,.overlay .panel{
  border-color:var(--viandia-line)!important;
  box-shadow:var(--viandia-shadow)!important;
}

.desktop-card,.dcard,.daction{
  background:linear-gradient(145deg,rgba(42,23,53,.94),rgba(16,8,18,.96))!important;
  color:var(--viandia-cream)!important;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
.desktop-card small,.dcard small,.daction small{color:#d9c9df!important}

/* Buttons */
.btn.primary,.go,.action.primary,.panel-actions a,.finish-actions a:first-child{
  background:linear-gradient(135deg,var(--viandia-violet),var(--viandia-violet-2))!important;
  color:#fff!important;
  border:1px solid rgba(229,196,110,.55)!important;
}
.btn.secondary,.tool,.action:not(.primary),.finish-actions a:last-child{
  background:#fff1c9!important;
  color:#5b3b68!important;
  border:1px solid rgba(229,196,110,.55)!important;
}

/* Round nav controls */
.round,.dhome,.dparent,.dtop a,.dnav a,.mnav a{
  background:rgba(30,16,38,.9)!important;
  color:var(--viandia-cream)!important;
  border:1px solid rgba(229,196,110,.62)!important;
  box-shadow:0 10px 28px rgba(0,0,0,.32)!important;
}

/* Desktop app shell */
@media(min-width:900px){
  .desktop{
    background-color:var(--viandia-bg)!important;
  }
  .dscene,.droom,.dhall,.dlab{
    border-radius:var(--viandia-radius-xl)!important;
    box-shadow:0 30px 90px rgba(0,0,0,.72),0 0 0 1px rgba(239,211,141,.3)!important;
  }
  .dside{gap:14px!important}
  .dintro h1,.dhead h1,.dtitle{color:var(--viandia-cream)!important}
  .dkicker{color:var(--viandia-gold)!important}
}

/* Mobile overlays and sheets */
@media(max-width:899px){
  .sheet,.overlay,.finish{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
  .sheet .panel,.overlay .panel,.finish-card{
    border-radius:28px!important;
  }
}

/* Motion consistency */
@media(hover:hover){
  .desktop-card,.dcard,.daction,.btn,.go,.action,.round,.dhome,.dparent,.dtop a,.dnav a,.mnav a{
    transition:transform .18s ease,filter .18s ease,border-color .18s ease;
  }
  .desktop-card:hover,.dcard:hover,.daction:hover,.btn:hover,.go:hover,.action:hover{
    transform:translateY(-2px);
    filter:brightness(1.05);
  }
}

/* Story Room — the illustration is the interface, not a dashboard. */
@media(min-width:900px){
  body:has(.dscene .book-copy){
    overflow:hidden!important;
    background:#0b0610!important;
  }
  body:has(.dscene .book-copy) .desktop{
    display:block!important;
    position:relative!important;
    width:100vw!important;
    height:100vh!important;
    min-height:100vh!important;
    padding:0!important;
    overflow:hidden!important;
    background:#0b0610!important;
  }
  body:has(.dscene .book-copy) .desktop:before{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    background:#0b0610!important;
    filter:none!important;
    transform:none!important;
  }
  body:has(.dscene .book-copy) .desktop:after{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    z-index:3!important;
    pointer-events:none!important;
    background:radial-gradient(ellipse at 50% 51%,transparent 34%,rgba(7,3,10,.14) 64%,rgba(6,3,9,.58) 100%)!important;
  }
  body:has(.dscene .book-copy) .desktop>.side{
    display:none!important;
  }
  body:has(.dscene .book-copy) .dscene{
    position:absolute!important;
    z-index:2!important;
    left:0!important;
    top:50%!important;
    width:100vw!important;
    height:150vw!important;
    max-height:none!important;
    margin-top:-75vw!important;
    aspect-ratio:auto!important;
    border-radius:0!important;
    box-shadow:none!important;
    overflow:hidden!important;
    background:#0b0610!important;
  }
  body:has(.dscene .book-copy) .dscene>.art{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    object-fit:contain!important;
    object-position:center!important;
    filter:none!important;
  }
  body:has(.dscene .book-copy) .dscene .nav{
    position:fixed!important;
    z-index:30!important;
    top:20px!important;
    left:22px!important;
    right:22px!important;
  }
  body:has(.dscene .book-copy) .dscene .nav a{
    width:52px!important;
    height:52px!important;
    background:rgba(28,14,35,.82)!important;
    border:1px solid rgba(229,196,110,.68)!important;
    box-shadow:0 10px 30px rgba(0,0,0,.5)!important;
    backdrop-filter:blur(9px)!important;
  }
  body:has(.dscene .book-copy) .dscene .book-copy{
    left:12%!important;
    right:12%!important;
    top:34.5%!important;
    height:34%!important;
  }
  body:has(.dscene .book-copy) .dscene .title{
    font-size:clamp(1.25rem,1.65vw,1.85rem)!important;
  }
  body:has(.dscene .book-copy) .dscene .story-text{
    font-size:clamp(.98rem,1.05vw,1.16rem)!important;
    line-height:1.5!important;
  }
  body:has(.dscene .book-copy) .dscene .deck{
    position:fixed!important;
    z-index:31!important;
    left:50%!important;
    right:auto!important;
    bottom:18px!important;
    width:min(650px,calc(100vw - 44px))!important;
    transform:translateX(-50%)!important;
    padding:8px 9px!important;
    border-radius:22px!important;
    background:rgba(27,14,34,.88)!important;
    border:1px solid rgba(229,196,110,.52)!important;
    box-shadow:0 16px 45px rgba(0,0,0,.58)!important;
    backdrop-filter:blur(11px)!important;
  }
  body:has(.dscene .book-copy) .dscene .tools{
    margin-top:5px!important;
  }
}

@media(max-width:899px){
  body:has(.scene .book-copy) .scene .deck{
    left:4%!important;
    right:4%!important;
    bottom:max(10px,env(safe-area-inset-bottom))!important;
    padding:7px 8px!important;
    border-radius:21px!important;
    background:rgba(29,16,37,.88)!important;
    border-color:rgba(226,191,105,.55)!important;
    box-shadow:0 14px 40px rgba(0,0,0,.55)!important;
  }
  body:has(.scene .book-copy) .scene .tools{
    margin-top:5px!important;
    gap:4px!important;
  }
  body:has(.scene .book-copy) .scene .tool{
    padding:5px 7px!important;
    font-size:.58rem!important;
  }
}

@media(prefers-reduced-motion:reduce){
  *,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}
