@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600&family=Inter:wght@400;500;600&display=swap');
:root{--bg:#0c1719;--panel:#122124;--ink:#ece9dc;--muted:#a2ada7;--gold:#c6aa72;--line:#ffffff19}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.7 Inter,Arial,sans-serif}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:5px}header{height:100px;padding:0 4.5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);position:relative;z-index:3;background:#0b1619}.brand{display:flex;gap:13px;align-items:center;font:14px/1.15 Georgia,serif;letter-spacing:2px}.brand b{font-weight:normal;letter-spacing:5px}.seal{font-size:42px;color:var(--gold)}nav{display:flex;gap:30px;font-size:12px}nav a{padding:10px 0;color:#b7c1bc}nav a.active,nav a:hover{color:var(--gold)}nav span{margin-left:8px}.safe{font-size:9px;letter-spacing:2px;color:var(--gold)}.hero{min-height:720px;height:calc(100vh - 100px);max-height:950px;position:relative;background:linear-gradient(90deg,#091619e8 0%,#091619a8 37%,#09161908 75%),linear-gradient(0deg,var(--bg),transparent 40%),url(assets/annona-hero.webp) center/cover;display:flex;align-items:center;padding:60px 8%}.hero-copy{max-width:680px;position:relative}.eyebrow{font-size:10px;letter-spacing:3px;color:var(--gold);text-transform:uppercase;display:block;margin-bottom:24px}h1,h2,h3{font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;line-height:1.08}h1{font-size:clamp(52px,6.3vw,100px);letter-spacing:-2px;margin:20px 0 28px}h1 i{font-weight:400;color:#d4bb87}h2{font-size:clamp(37px,4vw,62px);margin:0 0 22px}h3{font-size:30px;margin:15px 0}p{color:var(--muted)}.hero p{font-size:16px;max-width:380px;line-height:1.9}.actions{display:flex;gap:25px;align-items:center;margin-top:36px}.btn{display:inline-block;background:var(--gold);border:1px solid var(--gold);color:#172020;padding:14px 24px;font-size:10px;letter-spacing:1.8px;text-transform:uppercase}.btn.outline{background:transparent;color:var(--ink);border-color:#ffffff35}.text-link{font-size:11px;letter-spacing:1px;border-bottom:1px solid #a38e664d;padding-bottom:6px}.hero-note{position:absolute;bottom:35px;left:8%;right:8%;display:flex;justify-content:space-between;font-size:9px;letter-spacing:2px;color:#97a59f}.hero-note span:first-child{color:var(--gold)}.ribbon{display:flex;justify-content:center;gap:55px;padding:25px;border-bottom:1px solid var(--line);font-size:10px;letter-spacing:2px;color:#9ca8a2}.section{padding:95px 8%}.section-head{display:flex;justify-content:space-between;gap:35px;align-items:end;margin-bottom:42px}.section-head p{max-width:380px;margin-bottom:5px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.card{border:1px solid var(--line);padding:32px;background:linear-gradient(140deg,#1c2b2a66,#0c1719);text-align:left;color:var(--ink)}button.card:hover{border-color:var(--gold);transform:translateY(-3px)}.card small{font-size:9px;letter-spacing:2px;color:var(--gold)}.card .icon{font-size:40px;color:var(--gold);display:block;padding:15px 0}.card p{font-size:13px}.card .arrow{display:block;margin-top:25px;color:var(--gold)}.feature{margin:0 8% 90px;display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);background:#142123}.feature>div{padding:55px}.feature-art{background:linear-gradient(0deg,#14212310,#14212390),url(assets/annona-hero.webp) 70% 45%/cover;min-height:330px;display:grid;align-content:end}.feature-art span{font:italic 30px Georgia;color:#d6c49c}.page-top{padding:75px 8% 45px;background:radial-gradient(ellipse at 80% 0,#263a3360,transparent 70%)}.page-top h1{font-size:65px;margin:10px 0 20px}.page-top p{max-width:620px}.filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:30px}input,select{background:#142325;border:1px solid #3c4a46;padding:12px 16px;color:var(--ink);border-radius:0}input{min-width:250px}.chip,.control{border:1px solid var(--line);background:transparent;color:var(--muted);padding:10px 16px}.chip.active,.chip:hover,.control:hover{border-color:var(--gold);color:var(--gold)}.empty{grid-column:1/-1;padding:40px;color:var(--muted)}.portrait{height:180px;background:radial-gradient(ellipse at 50% 110%,#8a815b60,transparent 70%);display:grid;place-items:center;font:80px Georgia;color:var(--gold);border-bottom:1px solid var(--line)}.character{padding:0}.character>div:last-child{padding:25px}.book-layout{display:grid;grid-template-columns:330px 1fr;gap:80px;align-items:center}.book-cover{aspect-ratio:2/3;box-shadow:20px 25px 50px #0007;border:1px solid #b59b6255;background:linear-gradient(#0b1a1c44,#081317),url(assets/annona-hero.webp) 64% center/cover;padding:35px;text-align:center;display:flex;flex-direction:column;justify-content:space-between;outline:1px solid #b59b6255;outline-offset:-13px}.book-cover h2{font-size:42px}.book-cover small{letter-spacing:3px;color:#d8c49c;font-size:9px}.notice{border-left:2px solid var(--gold);padding:14px 20px;background:#c6aa7209;font-size:12px;color:var(--muted);margin:25px 0}.atlas{padding:0 4% 60px}.atlas-tools{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:15px}.atlas-tools input{flex:1}.atlas-layout{display:grid;grid-template-columns:1fr 290px;border:1px solid var(--line)}.viewport{height:640px;overflow:hidden;position:relative;background-color:#0a1417;background-image:radial-gradient(#50605b55 1px,transparent 1px);background-size:22px 22px;touch-action:none;cursor:grab}.viewport:active{cursor:grabbing}.scene{position:absolute;transform-origin:0 0;width:5000px;height:12000px}.scene svg{position:absolute;inset:0;pointer-events:none;overflow:visible}.node{position:absolute;width:210px;height:62px;display:flex;align-items:center;text-align:left;padding:9px 14px;background:#18292b;color:#dce4d9;border:1px solid #53604c;font-size:11px;line-height:1.4;box-shadow:0 5px 20px #0003}.node.root{border-color:var(--gold);color:var(--gold);font-family:Georgia;font-size:15px}.node.match,.node.selected{outline:2px solid var(--gold);background:#34433a}.node small{display:block;font-size:8px;color:#a6ad99;letter-spacing:1px}.atlas-detail{padding:24px;background:#142123;border-left:1px solid var(--line)}.atlas-detail h3{font-size:27px}.atlas-detail p{font-size:12px}.path{font-size:11px;color:var(--gold);line-height:2.1}.zoom-label{min-width:45px;font-size:11px;text-align:center}.atlas-legend{font-size:10px;color:var(--muted);margin-top:13px;display:flex;justify-content:space-between;gap:20px}dialog{background:#142325;color:var(--ink);border:1px solid #64715b;width:min(580px,90%);padding:45px;max-height:85vh}dialog::backdrop{background:#02090cbb;backdrop-filter:blur(6px)}dialog h2{font-size:43px}#closeModal{position:absolute;right:15px;top:10px;background:none;color:var(--gold);border:0;font-size:30px}footer{padding:40px 8%;border-top:1px solid var(--line);display:flex;align-items:center;gap:35px;font-size:10px}footer span{margin-left:auto;color:#7e9088}footer .brand{font-size:10px} @media(max-width:850px){header{height:auto;min-height:90px;flex-wrap:wrap;padding:20px 5%;gap:15px}nav{order:3;width:100%;gap:20px;overflow:auto;white-space:nowrap;font-size:11px}.safe{font-size:8px}.hero{min-height:650px;height:78vh;padding:50px 7%;background-position:65% center}.hero h1{font-size:64px}.ribbon{gap:20px;font-size:8px}.section{padding:65px 6%}.cards{grid-template-columns:1fr 1fr}.section-head{display:block}.feature{grid-template-columns:1fr;margin:0 6% 60px}.feature>div{padding:32px}.feature-art{min-height:240px}.book-layout{grid-template-columns:240px 1fr;gap:35px}.atlas-layout{grid-template-columns:1fr}.atlas-detail{border-left:0;border-top:1px solid var(--line)}.viewport{height:510px}.page-top h1{font-size:50px}footer{flex-wrap:wrap;gap:15px}footer span{margin-left:0}}@media(max-width:550px){.cards{grid-template-columns:1fr}.hero h1{font-size:56px}.hero-note{font-size:7px}.actions{gap:15px}.btn{padding:13px 16px}.book-layout{grid-template-columns:1fr}.book-cover{max-width:280px;margin:auto}.ribbon span:last-child{display:none}.page-top{padding:55px 6% 30px}.atlas{padding:0 3% 40px}.atlas-tools input{width:100%;min-width:0}.atlas-tools select{width:100%}.atlas-legend{display:block}}
@media(prefers-reduced-motion:no-preference){.card{transition:transform .2s,border-color .2s}html{scroll-behavior:smooth}}
/* Immersive entrance */
body>header,body>footer{display:none}.immersive{overflow:hidden;background:#071115}.immersive #app{height:100svh}.portal-world{width:100%;height:100svh;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;background:#071115}.portal-world::-webkit-scrollbar{display:none}.portal-stage{position:relative;width:100%;height:100%;min-width:calc(100svh * 1.777);overflow:hidden}.portal-painting{position:absolute;width:100%;height:100%;object-fit:fill;user-select:none;pointer-events:none}.world-door,.moon-door{position:absolute;display:block;background:transparent;border:0;padding:0;-webkit-tap-highlight-color:transparent}.world-door{border-radius:45%;cursor:pointer}.world-door:after{content:'';position:absolute;inset:12%;border-radius:50%;background:radial-gradient(ellipse,#e6c87820,transparent 68%);opacity:0;transition:opacity .5s;filter:blur(8px)}.world-door:hover:after,.world-door:focus-visible:after{opacity:1}.door-name{position:absolute;left:50%;top:-10px;transform:translate(-50%,-6px);color:#f3e7cb;white-space:nowrap;font:18px/1.3 'Cormorant Garamond',Georgia,serif;letter-spacing:1px;text-shadow:0 2px 12px #000,0 0 25px #000;background:#071315a0;box-shadow:0 0 28px 16px #07131570;padding:5px 12px;opacity:0;transition:opacity .25s,transform .25s;pointer-events:none}.world-door:hover .door-name,.world-door:focus-visible .door-name,.world-door.revealed .door-name{opacity:1;transform:translate(-50%,-14px)}.world-door:focus-visible{outline:1px solid #ead4998a;outline-offset:4px}.door-book{left:9%;top:64%;width:18%;height:28%}.door-mirror{left:38%;top:61%;width:16%;height:33%}.door-tree{left:67%;top:60%;width:19%;height:34%}.door-gate{left:77%;top:35%;width:12%;height:24%}.moon-door{left:69.8%;top:3.7%;width:4.2%;height:7.5%;border-radius:50%;cursor:default}.moon-door:focus-visible{outline:1px solid #ebdeac44}.return-home{position:fixed;z-index:20;top:24px;left:26px;width:42px;height:42px;display:grid;place-items:center;background:#0a191ab0;border:1px solid #b6a16e44;border-radius:50%;backdrop-filter:blur(10px)}.return-home svg{width:23px;fill:none;stroke:#c6aa72;stroke-width:1.2}.return-home span{position:absolute;left:55px;opacity:0;white-space:nowrap;font:15px Georgia;color:#d9c699;pointer-events:none}.return-home:hover span,.return-home:focus-visible span{opacity:1}.page-top{padding-top:105px}.moon-room{position:relative;width:100vw;height:100svh;overflow:hidden;background:radial-gradient(ellipse at 50% 100%,#204345 0%,#0a1724 50%,#030711 100%)}.moon-room:before{content:'';position:absolute;inset:0;background-image:radial-gradient(circle at 13% 17%,#f4e6be 0 1px,transparent 2px),radial-gradient(circle at 73% 24%,#e9efec 0 1px,transparent 2px),radial-gradient(circle at 42% 9%,#e9efec 0 1px,transparent 2px);background-size:217px 191px,337px 257px,473px 317px;opacity:.45}.sanctuary-moon{position:absolute;width:110px;height:110px;top:22%;left:calc(50% - 55px);border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff2ce,#c9c5af 60%,#858d84);box-shadow:0 0 65px 12px #e3dfbb30,inset -15px -10px 20px #72817d66;cursor:pointer}.moon-halo{position:absolute;left:20%;top:4%;width:60%;height:65%;background:radial-gradient(ellipse,#e5e5bf0f,transparent 65%)}.secret-water{position:absolute;bottom:0;width:100%;height:36%;background:repeating-linear-gradient(0deg,#112d37 0 2px,#193b4322 3px 5px);border-top:1px solid #9fb7ad22;mask-image:linear-gradient(transparent,#000 30%)}.secret-water:after{content:'';position:absolute;left:45%;top:0;width:10%;height:100%;background:linear-gradient(#e4dfb955,transparent);filter:blur(25px);clip-path:polygon(45% 0,55% 0,100% 100%,0 100%)}.constellation{position:absolute;inset:20% 20% 30%;opacity:.65}.constellation i{position:absolute;width:3px;height:3px;background:#f0e8cd;border-radius:100%;box-shadow:0 0 16px 3px #dddbb944}.constellation i:nth-child(1){top:18%;left:10%}.constellation i:nth-child(2){top:34%;left:21%}.constellation i:nth-child(3){top:45%;left:28%}.constellation i:nth-child(4){top:38%;left:70%}.constellation i:nth-child(5){top:22%;left:81%}.constellation i:nth-child(6){top:64%;left:63%}.constellation i:nth-child(7){top:75%;left:40%}@media(min-aspect-ratio:16/9){.portal-stage{min-width:0;min-height:calc(100vw / 1.777);position:absolute;top:50%;transform:translateY(-50%)}.portal-world{position:relative}}@media(prefers-reduced-motion:no-preference){.portal-painting{animation:arrive 1.8s ease-out both}@keyframes arrive{from{filter:brightness(.45)}to{filter:brightness(1)}}.sanctuary-moon{animation:moonbreath 7s infinite alternate ease-in-out}@keyframes moonbreath{to{box-shadow:0 0 100px 20px #e3dfbb35,inset -15px -10px 20px #72817d66}}}
.door-book{left:6%;top:55%;width:23%;height:33%}.door-mirror{left:38%;top:45%;width:16%;height:43%}.door-tree{left:67%;top:55%;width:18%;height:36%}.door-gate{left:79%;top:37%;width:6%;height:13%}
@media(min-width:851px){.portal-stage{width:100%;height:100svh;min-width:0;min-height:0;position:relative;top:0;transform:none}}@media(max-width:850px){.portal-stage{width:calc(100svh * 1.777);min-width:100%;height:100svh;min-height:0;position:relative;top:0;transform:none}}
/* The city is the navigation. */
.place-door{border-radius:18%;appearance:none;color:inherit}.place-door .door-name{top:72%;font-size:19px;letter-spacing:1px}.place-door:after{inset:30% 12% 5%;background:radial-gradient(ellipse,#f0c77125,transparent 70%)}.road-door{clip-path:var(--road-shape);border-radius:0}.road-door .door-name{top:73%;left:57%;background:#06111399}.road-door:after{inset:20% 0 0;background:radial-gradient(ellipse,#f6d38b25,transparent 70%)}.scene-return{position:fixed;left:22px;bottom:24px;width:46px;height:46px;display:grid;place-items:center;color:#dfcfaa;border:1px solid #d6c49d33;border-radius:50%;background:#09171966;backdrop-filter:blur(5px);z-index:5}.scene-return svg{width:24px;fill:none;stroke:currentColor;stroke-width:1.1}.scene-return .door-name{top:9px;left:105px;font-size:15px}.scene-return:hover .door-name,.scene-return:focus-visible .door-name{opacity:1;transform:translate(-50%,0)}body[data-place="hierarchy"]{background:linear-gradient(#071316ce,#071316eb),url(assets/council.webp) center/cover fixed}body[data-place="books"],body[data-place="encyclopedia"]{background:linear-gradient(#071316bd,#071316ed),url(assets/archives.webp) center/cover fixed}body[data-place="hierarchy"] .page-top{padding-top:75px;padding-bottom:10px;background:none}body[data-place="hierarchy"] .page-top h1{font-size:42px}body[data-place="hierarchy"] .page-top>p{display:none}body[data-place="hierarchy"] .page-top .eyebrow{display:none}.city-world{background:#061013}.city-world .portal-painting{animation:sceneArrival .9s ease-out both}@keyframes sceneArrival{from{filter:brightness(.4);opacity:.6}to{filter:brightness(1);opacity:1}}@media(prefers-reduced-motion:reduce){.city-world .portal-painting{animation:none}}@media(max-width:850px){.scene-return{width:40px;height:40px;bottom:16px;left:16px}.place-door .door-name{font-size:17px}}
.constellation,.secret-water,.moon-halo{pointer-events:none}.sanctuary-moon{z-index:2}
/* Preserve the artwork’s proportions; allow the journey to breathe. */
@media(min-width:851px){.portal-world{display:flex;align-items:center;justify-content:center;background:#050c10}.portal-stage{flex:none;width:min(100vw,177.68svh);height:auto;aspect-ratio:1672 / 941;min-width:0;min-height:0;position:relative;top:0;transform:none}.portal-painting{object-fit:contain}}
@media(max-width:850px){.portal-world{display:block}.portal-stage{width:177.68svh;min-width:100vw;height:100svh;aspect-ratio:1672 / 941}.portal-painting{object-fit:contain}}
body[data-place="home"] .road-door .door-name{top:48%;left:64%;font-size:23px}.moon-door{z-index:10}.place-door.quiet-door .door-name{display:none}.city-world .portal-painting{animation-duration:1.2s}.place-door:after{filter:blur(16px);opacity:0}.place-door:hover:after,.place-door:focus-visible:after{opacity:.55}.scene-return{opacity:.7}.scene-return:hover,.scene-return:focus-visible{opacity:1}
@media(max-width:850px){.portal-stage{width:max(100vw,177.68svh);height:auto;min-height:100svh;aspect-ratio:1672 / 941}.portal-painting{object-fit:contain}}
/* Navigation belongs to the scenery, never to a visible control. */
.scene-back-area{position:fixed;left:0;bottom:0;width:18vw;height:20svh;z-index:20;display:block;cursor:pointer;border:0;background:transparent;-webkit-tap-highlight-color:transparent;outline:none}
.scene-back-area.view-back-area{width:50vw;height:50svh}
.scene-back-area:before{content:'';position:absolute;inset:0;pointer-events:none;opacity:0;backdrop-filter:sepia(.85) saturate(1.5) brightness(1.16);-webkit-backdrop-filter:sepia(.85) saturate(1.5) brightness(1.16);mask-image:linear-gradient(to right,#000 0%,#000 75%,transparent 100%),linear-gradient(to top,#000 0%,#000 75%,transparent 100%);mask-composite:intersect;transition:opacity .4s ease}
.back-name{position:absolute;left:40%;top:48%;transform:translate(-50%,-50%);font:24px/1.2 'Cormorant Garamond',Georgia,serif;letter-spacing:1.5px;color:#f3d68e;text-shadow:0 2px 16px #000,0 0 18px #ad822d;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .3s ease}
.scene-back-area:hover:before,.scene-back-area:focus-visible:before,.scene-back-area.revealed:before,.scene-back-area:hover .back-name,.scene-back-area:focus-visible .back-name,.scene-back-area.revealed .back-name{opacity:1}
.return-home{width:150px;height:80px;border:0;border-radius:0;background:transparent;box-shadow:none;backdrop-filter:none;top:0;left:0}
.return-home span{left:35px;font:20px Georgia;color:#f3d68e}.return-home:hover span,.return-home:focus-visible span{opacity:1}
@media(prefers-reduced-motion:reduce){.scene-back-area:before,.back-name{transition:none}}
.scene-back-area:focus-visible,.return-home:focus-visible{outline:none}
.scene-back-area:hover:before,.scene-back-area:focus-visible:before,.scene-back-area.revealed:before{opacity:.45}
