/* RAGANA v56: dark mode ("night"), switched by the sun/moon button in the header (theme.js). Warm charcoal and soft gold, no pure black or white, easy on the eyes at night. */
.rg-theme{order:5;flex:none;display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;margin:0 0 0 4px;padding:0;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--dim);cursor:pointer;transition:color .3s,border-color .3s,background .3s}
.rg-theme:hover{color:var(--gold);border-color:var(--gold)}
.rg-theme:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.rg-theme svg{width:17px;height:17px;display:block}
.rg-theme .i-sun{display:none}
html[data-theme="dark"] .rg-theme .i-sun{display:block}
html[data-theme="dark"] .rg-theme .i-moon{display:none}
@media(max-width:1240px){.rg-theme{order:0;margin-left:auto}.nav-in .burger{margin-left:6px}}

html[data-theme="dark"]{color-scheme:dark;
  --bg:#15130f;--bg2:#1f1c17;--ink:#e6e0d3;--dim:#b4ac9b;--faint:#938b7b;
  --gold:#d4b56c;--gold-lt:#e3c787;--line:#353026}
html[data-theme="dark"] body{background:var(--bg);color:var(--ink)}
html[data-theme="dark"] nav{background:rgba(21,19,15,.9)}
html[data-theme="dark"] .wall .lead,html[data-theme="dark"] .story p,html[data-theme="dark"] .rev-name{color:var(--ink)}
html[data-theme="dark"] input,html[data-theme="dark"] select,html[data-theme="dark"] textarea{background-color:var(--bg2);color:var(--ink);border-color:var(--line)}
html[data-theme="dark"] .fld input:focus,html[data-theme="dark"] .fld select:focus,html[data-theme="dark"] .fld textarea:focus{background-color:#25211b}
html[data-theme="dark"] .free-badge{background:rgba(21,19,15,.92)}
html[data-theme="dark"] .float,html[data-theme="dark"] .rel img{box-shadow:0 2px 6px rgba(0,0,0,.35),0 18px 40px rgba(0,0,0,.45)}
html[data-theme="dark"] .float:hover{box-shadow:0 4px 10px rgba(0,0,0,.4),0 30px 60px rgba(0,0,0,.55)}
html[data-theme="dark"] .nl-m,html[data-theme="dark"] .nd-m{box-shadow:0 14px 34px rgba(0,0,0,.5)}
html[data-theme="dark"] img{filter:brightness(.94)}
html[data-theme="dark"] .mark,html[data-theme="dark"] .logo{color:var(--ink)}
/* buttons drawn as ink-on-paper keep readable text */
html[data-theme="dark"] .tr-btn:not(.light):not(.line):not(.ghost){color:var(--bg)}
html[data-theme="dark"] .tr-btn:not(.light):not(.line):not(.ghost):hover{background:var(--gold-lt);border-color:var(--gold-lt);color:var(--bg)}
html[data-theme="dark"] .tr .gform input[type=email]{background:var(--bg2)}
html[data-theme="dark"] .tr .breath{background:var(--bg2)}
/* Prints & Gifts product previews and the order page */
html[data-theme="dark"] .cgrid a.art .pgm,html[data-theme="dark"] .pv{background:linear-gradient(180deg,#24211b,#1a1813)}
/* light boxes on art pages, home and forms */
html[data-theme="dark"] .g-arrow{background:rgba(21,19,15,.85);color:var(--ink)}
html[data-theme="dark"] .pp-phys,html[data-theme="dark"] .grc-tz-in{background:var(--bg2)}
html[data-theme="dark"] #mlEmail{background:var(--bg2);color:var(--ink);border-color:var(--line)}
html[data-theme="dark"] .pl-frame{background:#2b2721}
/* the dark Trace banner on /play/ gets an edge so it stands out from the dark page */
html[data-theme="dark"] .pl-trace{background:#211e18;box-shadow:0 0 0 1px var(--line),0 22px 44px rgba(0,0,0,.45)}
@media print{html[data-theme="dark"]{--bg:#fff;--bg2:#f4f2ec;--ink:#17171a;--dim:#585650;--faint:#6d6960;--gold:#816625;--line:#ddd8cd}}
