/* ⌂ GALENA HOUSE — Avery's mirror.
   Loaded last on every page. The night turns narrator blue; amber threads run
   through it; surfaces go liquid. Each room keeps its own soul — this layer
   only retunes the light. Handsome and mysterious, but light: a reflection. */

/* ── the narrator night — every themed room's darks, retuned to blue depth ── */
html[data-theme="night"]{
  --ground:#0b1c27; --raise:#10283a;
  --char:#081018; --espresso-deep:#081018;
  --workroom:#0d2130; --rail:#0f2635;
  --card:rgba(241,233,216,.045); --card-hover:rgba(201,162,63,.09);
  --line:rgba(201,162,63,.26); --line-2:rgba(241,233,216,.12);
}

/* depth beneath, amber threads above — the liquid field */
html[data-theme="night"] body{
  background:
    radial-gradient(1100px 520px at 82% -8%, rgba(176,132,63,.14), transparent 60%),
    radial-gradient(900px 640px at -10% 108%, rgba(63,109,134,.16), transparent 55%),
    radial-gradient(1px 1px at 16% 18%, rgba(241,233,216,.5) 50%, transparent 51%),
    radial-gradient(1px 1px at 78% 9%,  rgba(241,233,216,.4) 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 55% 26%, rgba(201,162,63,.45) 50%, transparent 51%),
    linear-gradient(180deg, #0d2130 0%, var(--ground) 42%, #081018 100%);
  background-attachment: fixed;
}

/* one amber thread, drawn across the top of every night page */
html[data-theme="night"] body::before{
  content:''; position:fixed; top:0; left:0; right:0; height:1px; z-index:50; pointer-events:none;
  background:linear-gradient(90deg, transparent 4%, rgba(201,162,63,.0) 12%, rgba(201,162,63,.55) 50%, rgba(176,132,63,.0) 88%, transparent);
}

/* ── liquid glass, wherever glass can safely pour ── */
html[data-theme="night"] input,
html[data-theme="night"] textarea,
html[data-theme="night"] select{
  background-color:rgba(241,233,216,.05);
  border-color:rgba(201,162,63,.28);
  backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
}
html[data-theme="night"] input:focus,
html[data-theme="night"] textarea:focus{
  border-color:rgba(201,162,63,.55);
  box-shadow:0 0 0 3px rgba(201,162,63,.08);
}

/* the beholder's touches — every theme, every room */
::selection{ background:rgba(201,162,63,.32); color:inherit; }
:focus-visible{ outline:1px solid rgba(201,162,63,.65); outline-offset:2px; }
html{ scrollbar-width:thin; scrollbar-color:rgba(201,162,63,.35) transparent; }
::-webkit-scrollbar{ width:9px; height:9px; }
::-webkit-scrollbar-thumb{ background:rgba(201,162,63,.28); border-radius:8px; }
::-webkit-scrollbar-thumb:hover{ background:rgba(201,162,63,.5); }
::-webkit-scrollbar-track{ background:transparent; }

/* day stays parchment — only clarified, never dimmed */
html[data-theme="day"] ::selection{ background:rgba(169,129,44,.25); }
html[data-theme="day"] body{ background-color:var(--ground); }

/* motion with manners */
@media (prefers-reduced-motion: no-preference){
  html[data-theme] body{ transition:background-color .5s ease; }
  a, button{ transition:color .3s ease, border-color .3s ease, background-color .3s ease, opacity .3s ease; }
}

/* ── second coat: the furniture joins the night ── */
html[data-theme="night"]{
  --panel:rgba(241,233,216,.05);
  --line2:rgba(201,162,63,.34);
}

/* liquid glass on the rooms' common surfaces — night only, blur behind translucence */
html[data-theme="night"] .composer,
html[data-theme="night"] .panel,
html[data-theme="night"] .card,
html[data-theme="night"] .entry,
html[data-theme="night"] .tile,
html[data-theme="night"] .sheet,
html[data-theme="night"] .room{
  backdrop-filter:blur(10px) saturate(1.05);
  -webkit-backdrop-filter:blur(10px) saturate(1.05);
  border-color:rgba(201,162,63,.22);
}

/* the identity bar breathes over the field instead of sitting on char */
html[data-theme="night"] .topbar,
html[data-theme="night"] header.bar,
html[data-theme="night"] .idbar{
  background:rgba(8,16,24,.55);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(201,162,63,.16);
}