/* cosmic art layer (cosmos/cosmos.py). Palette accents on top of Night/Ember: sky gold #F5C542, lilac #B9A6FF. */
:root{--cz-gold:#F5C542;--cz-sky:#1B2A6B}
/* ---------- home hero ---------- */
.cz-hero{position:relative;isolation:isolate;overflow:hidden}
.cz-hero>.hx{position:relative;z-index:2}
.cz-sky{position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(120% 90% at 78% 30%,#1a2466 0%,#120f33 45%,var(--ink) 75%)}
.cz-paint{position:absolute;right:0;top:0;width:78%;height:100%;object-fit:cover;object-position:55% 60%;opacity:.9;
 -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 38%);mask-image:linear-gradient(90deg,transparent 0%,#000 38%)}
.cz-stars{position:absolute;inset:0;width:100%;height:100%}
.cz-veil{position:absolute;inset:0;background:linear-gradient(90deg,rgba(14,11,36,.95) 0%,rgba(14,11,36,.82) 34%,rgba(14,11,36,.25) 62%,rgba(14,11,36,0) 100%),linear-gradient(180deg,rgba(14,11,36,0) 70%,var(--ink) 100%)}
.cz-orbits{position:absolute;right:-60px;top:-40px;width:min(720px,56vw);height:auto;opacity:.85}
.cz-hero .hx-viz .euviz img{position:relative;box-shadow:14px 14px 0 rgba(0,0,0,.35),0 0 80px rgba(245,197,66,.10)}
.cz-credit{font:600 11px/1.4 var(--mono);letter-spacing:.02em;color:var(--mute);opacity:.85;margin:0}
.cz-credit a{color:inherit}
.cz-hero>.cz-credit{position:relative;z-index:2;max-width:1240px;margin:0 auto;padding:0 24px 14px;text-align:right}
@media(max-width:980px){
 .cz-paint{width:100%;height:58%;top:auto;bottom:0;opacity:.42;-webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 45%);mask-image:linear-gradient(180deg,transparent 0%,#000 45%)}
 .cz-veil{background:linear-gradient(180deg,rgba(14,11,36,.55) 0%,rgba(14,11,36,.86) 45%,rgba(14,11,36,.9) 100%)}
 .cz-orbits{right:-120px;top:-60px;width:330px;opacity:.55}
 .cz-hero>.cz-credit{padding:0 16px 12px;text-align:left}
}
/* ---------- lane band (topic hub) ---------- */
.cz-band{position:relative;max-width:1100px;margin:96px auto -70px;padding:0 20px}
.cz-band-art{position:relative;height:clamp(150px,22vw,240px);overflow:hidden;border:1px solid var(--line);background:#101540}
.cz-band-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%;opacity:.8;filter:saturate(1.15) hue-rotate(-8deg)}
.cz-band-art::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(27,42,107,.35),rgba(14,11,36,.0) 45%,rgba(14,11,36,.55)),linear-gradient(90deg,rgba(14,11,36,.55),transparent 55%)}
.cz-band-sky{position:absolute;inset:0;width:100%;height:100%;z-index:1}
.cz-band figcaption{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;margin-top:8px}
.cz-band-k{font:700 12px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--cz-gold)}
/* ---------- lane mark on articles ---------- */
.cz-lane{display:inline-flex;align-items:center;gap:10px;margin:0 0 16px;font:700 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--cz-gold);text-decoration:none}
.cz-lane svg{width:84px;height:20px;color:var(--lilac)}
.cz-lane:hover span{text-decoration:underline}
@media (prefers-color-scheme: light){html:not([data-read=dark]) .cz-lane{color:#8A5A00}html:not([data-read=dark]) .cz-lane svg{color:#3D2BB8}}
html[data-read=light] .cz-lane{color:#8A5A00}html[data-read=light] .cz-lane svg{color:#3D2BB8}
/* ---------- machinery art (/developers/, /about/) ---------- */
.cz-machwrap{position:relative}
.cz-mach{position:absolute;right:-60px;top:40px;width:min(460px,46vw);height:auto;opacity:.5;z-index:-1;pointer-events:none}
.about.cz-machwrap{isolation:isolate}.dvw.cz-machwrap{isolation:isolate}
@media(max-width:800px){.cz-mach{width:260px;right:-90px;top:60px;opacity:.3}}
/* ---------- site-wide: footer sky + orbit divider ---------- */
footer{position:relative;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='360' height='180'%3E%3Cg fill='%23F4F0FF'%3E%3Ccircle cx='20' cy='30' r='.8' opacity='.5'/%3E%3Ccircle cx='96' cy='12' r='.6' opacity='.4'/%3E%3Ccircle cx='150' cy='70' r='1' opacity='.55'/%3E%3Ccircle cx='230' cy='22' r='.7' opacity='.45'/%3E%3Ccircle cx='300' cy='96' r='.9' opacity='.5'/%3E%3Ccircle cx='60' cy='130' r='.6' opacity='.35'/%3E%3Ccircle cx='190' cy='150' r='.8' opacity='.4'/%3E%3Ccircle cx='340' cy='40' r='.5' opacity='.4'/%3E%3C/g%3E%3Ccircle cx='268' cy='58' r='1.4' fill='%23F5C542' opacity='.7'/%3E%3C/svg%3E")}
footer::before{content:"";display:block;height:34px;margin:0 auto 6px;max-width:1240px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 34' preserveAspectRatio='none'%3E%3Cpath d='M0 33 Q600 -6 1200 33' fill='none' stroke='%23B9A6FF' stroke-opacity='.35'/%3E%3C/svg%3E") center/100% 100% no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 34'%3E%3Cellipse cx='40' cy='17' rx='30' ry='6' fill='none' stroke='%23F5C542' stroke-opacity='.6' transform='rotate(-10 40 17)'/%3E%3Ccircle cx='40' cy='17' r='5' fill='%23F5C542'/%3E%3Ccircle cx='68' cy='12' r='2' fill='%23FF6A3D'/%3E%3C/svg%3E") center 0/80px 34px no-repeat}
/* ---------- motion ---------- */
@media (prefers-reduced-motion: no-preference){
 .cz-spin1{transform-origin:50% 50%;transform-box:view-box;animation:czspin 140s linear infinite}
 .cz-spin2{transform-origin:50% 50%;transform-box:view-box;animation:czspin 220s linear infinite reverse}
 .cz-twinkle{animation:cztw 5s ease-in-out infinite alternate}
}
@keyframes czspin{to{transform:rotate(360deg)}}
@keyframes cztw{from{opacity:.35}to{opacity:1}}
/* ---------- site-wide sky header: painting per section (one cached file each) + stars + orbit ---------- */
main.cz-sky-on{position:relative;isolation:isolate}
.cz-top{position:absolute;left:0;right:0;top:0;height:clamp(300px,42vw,520px);z-index:-1;pointer-events:none;overflow:hidden;
 background:linear-gradient(180deg,rgba(14,11,36,.62) 0%,rgba(14,11,36,.78) 45%,var(--ink) 100%),var(--cz-img) center 35%/cover no-repeat,#141a4a;
 -webkit-mask-image:linear-gradient(180deg,#000 55%,transparent);mask-image:linear-gradient(180deg,#000 55%,transparent)}
.cz-top::before{content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='520' height='300'%3E%3Cg fill='%23F4F0FF'%3E%3Ccircle cx='30' cy='40' r='.9' opacity='.7'/%3E%3Ccircle cx='120' cy='18' r='.6' opacity='.5'/%3E%3Ccircle cx='210' cy='90' r='1.1' opacity='.7'/%3E%3Ccircle cx='330' cy='30' r='.7' opacity='.6'/%3E%3Ccircle cx='440' cy='120' r='1' opacity='.6'/%3E%3Ccircle cx='80' cy='170' r='.6' opacity='.4'/%3E%3Ccircle cx='260' cy='200' r='.8' opacity='.4'/%3E%3Ccircle cx='500' cy='60' r='.6' opacity='.5'/%3E%3Ccircle cx='380' cy='240' r='.7' opacity='.35'/%3E%3C/g%3E%3Ccircle cx='170' cy='60' r='1.6' fill='%23FFE9A8' opacity='.85'/%3E%3C/svg%3E") 0 0/520px 300px repeat}
.cz-top::after{content:"";position:absolute;right:-70px;top:-50px;width:min(420px,40vw);aspect-ratio:1;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 400'%3E%3Cdefs%3E%3CradialGradient id='g'%3E%3Cstop offset='0' stop-color='%23FFE9A8'/%3E%3Cstop offset='.4' stop-color='%23F5C542' stop-opacity='.8'/%3E%3Cstop offset='1' stop-color='%23F5C542' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3Ccircle cx='200' cy='200' r='60' fill='url(%23g)'/%3E%3Cg fill='none' stroke-width='1.2'%3E%3Cellipse cx='200' cy='200' rx='185' ry='60' stroke='%23B9A6FF' stroke-opacity='.5' transform='rotate(-18 200 200)'/%3E%3Ccircle cx='200' cy='200' r='120' stroke='%23B9A6FF' stroke-opacity='.25' stroke-dasharray='2 7'/%3E%3Cellipse cx='200' cy='200' rx='195' ry='30' stroke='%23F5C542' stroke-opacity='.35' transform='rotate(24 200 200)'/%3E%3C/g%3E%3Ccircle cx='372' cy='140' r='5' fill='%23C8FF3D'/%3E%3Ccircle cx='200' cy='80' r='3.5' fill='%23FF6A3D'/%3E%3C/svg%3E") center/contain no-repeat;opacity:.75}
.cz-a-sikkim{--cz-img:url(/img/v2/cz-sikkim-1600.webp)}.cz-a-shentsa{--cz-img:url(/img/v2/cz-shentsa-1600.webp)}.cz-a-naglake{--cz-img:url(/img/v2/cz-naglake-1600.webp)}
.cz-a-depsang{--cz-img:url(/img/v2/cz-depsang-1600.webp)}.cz-a-sanct{--cz-img:url(/img/v2/cz-sanct-1600.webp)}
@media(max-width:800px){.cz-a-sikkim{--cz-img:url(/img/v2/cz-sikkim-800.webp)}.cz-a-shentsa{--cz-img:url(/img/v2/cz-shentsa-800.webp)}.cz-a-naglake{--cz-img:url(/img/v2/cz-naglake-800.webp)}
 .cz-a-depsang{--cz-img:url(/img/v2/cz-depsang-800.webp)}.cz-a-sanct{--cz-img:url(/img/v2/cz-sanct-800.webp)}
 .cz-top{height:340px}.cz-top::after{width:220px;right:-80px;top:-40px;opacity:.55}}
.cz-pagecredit{max-width:1240px;margin:28px auto 0!important;padding:0 24px 18px;text-align:right}
@media(max-width:800px){.cz-pagecredit{padding:0 16px 16px;text-align:left}}
/* light reading mode on articles: keep the page paper-clean, the lane mark carries the motif */
@media (prefers-color-scheme: light){html:not([data-read=dark]) main:has(.art) .cz-top{display:none}}
html[data-read=light] main .cz-top{display:none}
/* section dividers */
main hr{border:0;height:28px;margin:36px auto;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 28' preserveAspectRatio='none'%3E%3Cpath d='M0 27 Q600 -4 1200 27' fill='none' stroke='%23B9A6FF' stroke-opacity='.35'/%3E%3C/svg%3E") center/100% 100% no-repeat,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 28'%3E%3Cellipse cx='30' cy='14' rx='24' ry='5' fill='none' stroke='%23F5C542' stroke-opacity='.6' transform='rotate(-10 30 14)'/%3E%3Ccircle cx='30' cy='14' r='4' fill='%23F5C542'/%3E%3C/svg%3E") center 0/60px 28px no-repeat}
/* data templates (.dz) paint an opaque ink panel; let the sky through in dark mode, hide the sky in their light mode */
@media (prefers-color-scheme: dark){html:not([data-read=light]) main.cz-sky-on .dz{background:transparent;box-shadow:none}}
html[data-read=dark] main.cz-sky-on .dz{background:transparent;box-shadow:none}
@media (prefers-color-scheme: light){html:not([data-read=dark]) main:has(.dz) .cz-top{display:none}}