/* Decorative layers only: no input interception, canvas changes or remote assets. */
body[data-view]{--atmos-a:#635190;--atmos-b:#276c68;isolation:isolate;background:#090c12;min-height:100svh}
body[data-view]::before,body[data-view]::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1}
body[data-view]::before{background:radial-gradient(ellipse at 84% 12%,color-mix(in srgb,var(--atmos-a) 42%,transparent),transparent 55%),radial-gradient(ellipse at 8% 76%,color-mix(in srgb,var(--atmos-b) 24%,transparent),transparent 52%),linear-gradient(145deg,#0c1018,#090b11 75%)}
body[data-view]::after{opacity:.32;background-repeat:no-repeat;transform-origin:80% 25%;will-change:transform}
body[data-view] header{background:linear-gradient(110deg,#0a0d14c9,#10151aa8);border-bottom-color:#bcc5e326}
body[data-view] .page-heading{position:relative;padding-bottom:38px;margin-bottom:24px;border-bottom:1px solid #cbd5ec1c}
body[data-view] .page-heading::after{content:"";position:absolute;bottom:-1px;left:0;width:110px;height:2px;background:linear-gradient(90deg,var(--cyan),transparent);box-shadow:0 0 22px #83dcd23d}
body[data-view] .account-panel,body[data-view] .stats-panel,body[data-view] .support-panel,body[data-view] .auth-panel{background:linear-gradient(135deg,#151c27ed,#0d121bed);border-color:#c0b4e130;box-shadow:0 12px 40px #00000020}
body[data-view] footer{margin-top:45px;background:linear-gradient(90deg,#090c12b8,transparent)}
/* The observatory: engraved orbits and slowly drifting starlight. */
body[data-view=home]{--atmos-a:#766095;--atmos-b:#287477}
body[data-view=home]::after{opacity:.4;background-image:radial-gradient(circle at 81% 25%,transparent 0 225px,#bfa6ef25 226px 227px,transparent 228px 280px,#a3d8d81c 281px 282px,transparent 283px),radial-gradient(circle at 18% 23%,#d6e6dc 0 1px,transparent 2px),radial-gradient(circle at 92% 68%,#cbbaf1 0 1px,transparent 2px),radial-gradient(circle at 57% 8%,#cbbaf1 0 1px,transparent 2px);animation:observatory-drift 38s ease-in-out infinite alternate}
/* The chamber: mineral seams and a low, breathing green mist. */
body[data-view=game]{--atmos-a:#284a48;--atmos-b:#284d3c}
body[data-view=game]::after{opacity:.43;background-image:linear-gradient(115deg,transparent 0 16%,#a1d5bd14 16.1% 16.25%,transparent 16.4% 77%,#82b2a81c 77.1% 77.25%,transparent 77.4%),radial-gradient(ellipse at 18% 90%,#43786755,transparent 55%),repeating-linear-gradient(0deg,transparent 0 110px,#a8c1af09 111px 112px);animation:chamber-breath 18s ease-in-out infinite alternate}
/* The herbarium: quiet shelves and etched leaf forms at the edges. */
body[data-view=index]{--atmos-a:#3c685b;--atmos-b:#55503b}
body[data-view=index]::after{opacity:.4;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='500' height='900' viewBox='0 0 500 900' fill='none' stroke='%2393b4a0' stroke-opacity='.4'%3E%3Cpath d='M435 900Q330 590 425 160M408 750q-95-110-115-50 55 95 115 50M390 610q100-120 125-50-62 105-125 50M390 460q-115-120-130-48 70 98 130 48M410 300q80-100 100-45-50 85-100 45M65 0v900M90 0v900M0 210h500M0 490h500M0 770h500'/%3E%3C/svg%3E");background-position:right top;background-size:500px 900px;animation:herbarium-light 25s ease-in-out infinite alternate}
/* The vault: a broad reflected prism, independent of card finishes. */
body[data-view=vault]{--atmos-a:#614779;--atmos-b:#294d67}
body[data-view=vault]::after{opacity:.34;background-image:linear-gradient(118deg,transparent 25%,#b7b1ef13 35%,#d4b8dc32 38%,#93d8d425 40%,transparent 48%),repeating-linear-gradient(90deg,transparent 0 139px,#c4b1d40c 140px 141px);background-size:180% 100%,100% 100%;animation:vault-reflection 30s ease-in-out infinite alternate}
/* The account sanctuary: still blue geometry with one gentle halo. */
body[data-view=account]{--atmos-a:#365b7d;--atmos-b:#34534e}
body[data-view=account]::after{opacity:.45;background-image:radial-gradient(circle at 88% 37%,transparent 0 170px,#a9cfdf28 171px 172px,transparent 173px 205px,#a9cfdf15 206px 207px,transparent 208px),linear-gradient(90deg,transparent 87.9%,#a9cfdf12 88%,transparent 88.1%);animation:sanctuary-halo 22s ease-in-out infinite alternate}
/* The ledger: orderly midnight-blue drafting lines, almost still. */
body[data-view=admin]{--atmos-a:#294a65;--atmos-b:#345b56}
body[data-view=admin]::after{opacity:.24;background-image:repeating-linear-gradient(0deg,transparent 0 79px,#95bfd21a 80px 81px),repeating-linear-gradient(90deg,transparent 0 159px,#95bfd21a 160px 161px);background-size:100% 100%;animation:ledger-light 32s ease-in-out infinite alternate}
/* The correspondence desk: warm lamplight crosses the edge of a letter. */
body[data-view=support]{--atmos-a:#795a39;--atmos-b:#4d384d}
body[data-view=support]::after{opacity:.4;background-image:conic-gradient(from 205deg at 91% 8%,transparent 0deg,#e9c18b28 12deg,transparent 28deg),repeating-linear-gradient(12deg,transparent 0 130px,#d3b58c12 131px 132px);animation:desk-lamplight 19s ease-in-out infinite alternate}
/* The authentication room: concentric seal engraving and warm gold. */
body[data-view=verify]{--atmos-a:#74603e;--atmos-b:#37595a}
body[data-view=verify]::after{opacity:.37;background-image:repeating-radial-gradient(circle at 91% 32%,transparent 0 27px,#cbb88324 28px 29px,transparent 30px 39px),conic-gradient(from 45deg at 91% 32%,transparent,#cbb88312,transparent);mask-image:linear-gradient(90deg,transparent 20%,#000 80%);animation:seal-glimmer 26s ease-in-out infinite alternate}
@keyframes observatory-drift{to{transform:translate3d(-12px,16px,0) rotate(2deg)}}
@keyframes chamber-breath{to{opacity:.25;transform:translate3d(0,-12px,0)}}
@keyframes herbarium-light{to{opacity:.23}}
@keyframes vault-reflection{to{transform:translate3d(7%,0,0)}}
@keyframes sanctuary-halo{to{opacity:.25;transform:scale(1.025)}}
@keyframes ledger-light{to{opacity:.14}}
@keyframes desk-lamplight{to{opacity:.22;transform:rotate(-1deg)}}
@keyframes seal-glimmer{to{opacity:.22}}
@media(max-width:620px){body[data-view]::after{opacity:.22!important;animation:none!important;will-change:auto}body[data-view] .page-heading{padding-bottom:26px;margin-bottom:20px}body[data-view=index]::after{background-position:130% top}body[data-view=vault]::after{background-size:130% 100%,100% 100%}}
@media(prefers-reduced-motion:reduce){body[data-view]::after{animation:none!important;will-change:auto;transform:none!important}}
body.low-motion::after{animation:none!important;will-change:auto;transform:none!important}