/* The complete grove, with every destination on the same painting coordinates. */
.immersive-grove{position:relative;background:#0c120f;overflow:hidden}
.grove-stage{position:relative;isolation:isolate;min-height:calc(100svh - 72px);display:flex;align-items:center;justify-content:center}
.grove-stage:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#0b120fbb,#0c120f88 35%,#0c120fa8 65%,#0b120fc9),url('/art/quiet-grove.webp') center 30%/cover;filter:blur(28px) brightness(.42);scale:1.04;pointer-events:none}
.immersive-grove .grove-art{background:transparent;overflow:visible;width:min(64vw,calc((100svh - 72px)*.75));margin:0 auto;position:relative}
.immersive-grove .grove-desktop{display:block;overflow:visible}
.immersive-grove .grove-painting{filter:brightness(.82) saturate(.84);transition:filter .55s ease}
.grove-desktop>.grove-painting{mask-image:linear-gradient(90deg,transparent,#000 5%,#000 94%,transparent)}
.immersive-grove .grove-shade{background:linear-gradient(90deg,#0c120f22,transparent 20%,transparent 82%,#0c120f22)}
.grove-introduction{position:absolute;left:clamp(28px,5vw,110px);top:clamp(54px,13vh,170px);width:calc((100vw - min(64vw,(100svh - 72px)*.75))/2 - 7vw);max-width:315px;z-index:5}
.grove-introduction h1{font:500 clamp(2.5rem,3.7vw,4.4rem)/.96 var(--realm-font);letter-spacing:-.02em;margin:0;color:#eddfc6}
.grove-author{font:500 1.0625rem var(--realm-font);letter-spacing:.16em;color:#c8b797;margin:18px 0 0}
.grove-instruction{font:400 1.125rem/1.5 var(--grove-type);color:#c5bca9;margin:48px 0 0}
.grove-progress{font:.8125rem/1.7 'DM Sans',sans-serif;color:#969f93;margin-top:38px;max-width:210px}
.grove-progress button{display:block;padding:7px 0;min-height:40px;border:0;background:none;text-decoration:underline;text-underline-offset:4px;color:#c6b28e;font-size:.875rem}
.immersive-grove .grove-mobile{display:none}
.immersive-grove .grove-inscription{font-size:clamp(1.0625rem,2.1vh,1.375rem);line-height:1.06;max-width:140%;padding:3px 2px 5px;transition:color .2s ease;text-decoration:none}
.immersive-grove .grove-primary .grove-inscription{font-size:clamp(1.125rem,2.2vh,1.45rem)}
.immersive-grove .grove-fruit[data-fruit=levi] .grove-inscription{font-size:clamp(1.25rem,2.5vh,1.65rem)}
.immersive-grove .grove-inscription:before{inset:-7px -14px;background:radial-gradient(ellipse,#0e140ffa, #0e140fa8 45%,transparent 73%)}
.immersive-grove .grove-inscription:after{content:'';display:block;width:0;height:1px;background:currentColor;margin:5px auto -5px;opacity:.65;transition:width .3s ease}
.immersive-grove .grove-fruit:hover .grove-inscription,.immersive-grove .grove-fruit:focus-visible .grove-inscription,.immersive-grove .grove-fruit.is-selected .grove-inscription{color:#f7e9ca;text-decoration:none}
.immersive-grove .grove-fruit:hover .grove-inscription:after,.immersive-grove .grove-fruit:focus-visible .grove-inscription:after,.immersive-grove .grove-fruit.is-selected .grove-inscription:after{width:42%}
.immersive-grove .grove-fruit:focus-visible{outline:none;background:transparent}
.immersive-grove .grove-fruit:focus-visible .grove-inscription{outline:2px solid #dbc38e;outline-offset:4px;border-radius:2px}
.grove-awakening{position:absolute;left:0;width:100%;overflow:hidden;pointer-events:none;opacity:0;mask-image:radial-gradient(ellipse at center,#000 38%,#000c 61%,transparent 76%);transition:opacity .4s ease;z-index:0}
.grove-awakening img{position:absolute;max-width:none;height:auto;filter:brightness(1.13) saturate(1.05)}
.grove-fruit:hover .grove-awakening,.grove-fruit:focus-visible .grove-awakening{opacity:.86}
.grove-fruit.is-selected .grove-awakening{opacity:1}
.immersive-grove .grove-foliage{translate:-13.5% -9.5%;transform-origin:13.5% 9.5%;transform:rotate(var(--leaf-angle));opacity:.92;transition:transform .62s cubic-bezier(.2,.7,.15,1),opacity .5s ease}
.immersive-grove .grove-foliage img{filter:brightness(.67) saturate(.65)}
.immersive-grove [data-tree=sun] .grove-foliage img{filter:sepia(.35) brightness(.85) saturate(.8)}
.immersive-grove [data-tree=void] .grove-foliage img{filter:brightness(.43) saturate(.2)}
.immersive-grove .grove-fruit:hover .grove-foliage,.immersive-grove .grove-fruit:focus-visible .grove-foliage{transform:rotate(calc(var(--leaf-angle) - 12deg))}
.immersive-grove .grove-fruit.is-uncovered .grove-foliage{transform:rotate(calc(var(--leaf-angle) - 49deg));opacity:.2}
.grove-preview{position:absolute;right:clamp(26px,4vw,90px);top:27%;width:calc((100vw - min(64vw,(100svh - 72px)*.75))/2 - 6vw);max-width:310px;min-width:210px;z-index:8;color:#e2d9c4;padding:25px 0 10px}
.grove-preview[hidden]{display:none}
.grove-preview>.grove-preview-content{max-height:calc(73svh - 120px);overflow:auto;scrollbar-width:thin;overscroll-behavior:contain;padding-right:8px}
.grove-preview-close{position:absolute;right:-5px;top:-15px;width:44px;height:44px;display:grid;place-items:center;border:0;background:transparent;color:#bbbbaa;font:400 1.75rem/1 Georgia;cursor:pointer}
.grove-preview-close:hover{color:#fff3cf}
.grove-preview-aspect{font:400 .8125rem/1.3 'DM Sans',sans-serif;text-transform:uppercase;letter-spacing:.11em;color:#b8a78c;margin:0 0 14px}
[data-tree=sun] .grove-preview-aspect{color:#d8b675}[data-tree=void] .grove-preview-aspect{color:#bcb1c7}[data-tree=crimson] .grove-preview-aspect{color:#c8a49a}
.grove-preview-content h2{font:400 2rem/1.08 var(--grove-type);margin:0 0 18px;color:#ecdabe}
.grove-preview-description{font:400 1rem/1.75 'DM Sans',sans-serif;color:#bcc5b8;margin:0 0 16px}
.grove-preview-count{font:400 .8125rem/1.5 'DM Sans',sans-serif;color:#9da994;margin:0 0 20px}
.grove-preview-links{display:flex;flex-direction:column;margin:10px 0 25px;border-block:1px solid #b19b6a36;padding:8px 0}
.grove-preview-links a{padding:10px 0;font:400 1.125rem/1.2 var(--grove-type);min-height:44px;color:#d2c7b3}
.grove-preview-links a:hover{text-decoration:underline;text-underline-offset:4px;color:#f1dec0}
.grove-enter{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid #c7ad7b;font:400 1.1875rem/1.2 var(--grove-type);color:#e6cfa3;min-height:50px}
.grove-enter:hover{color:#fff0ce;border-color:#fff0ce}.grove-enter span{font-family:Arial,sans-serif;font-size:1.2rem}
.grove-dialog{border:1px solid #b8a07842;max-width:520px;width:calc(100% - 24px);max-height:82dvh;margin:auto auto 12px;padding:34px 25px 25px;border-radius:12px 12px 5px 5px;background:#121c16;color:#e2d9c4;box-shadow:0 20px 100px #0008;overflow:auto}
.grove-dialog::backdrop{background:#030a06a8;backdrop-filter:blur(4px)}
.grove-dialog .grove-preview-close{top:6px;right:7px}.grove-dialog[open]{animation:grove-sheet-in .28s cubic-bezier(.2,.8,.2,1)}
@keyframes grove-sheet-in{from{transform:translateY(30px);opacity:.5}to{transform:translateY(0);opacity:1}}
.grove-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(max-width:1100px),(max-height:759px){
 .grove-stage{display:block;min-height:0}.grove-stage:before{display:none}.grove-introduction{position:relative;inset:auto;width:auto;max-width:600px;margin:auto;padding:22px 22px 18px;background:linear-gradient(#0c120f65,#0c120f),url('/art/quiet-grove.webp') 40% top/320% auto}
 .grove-introduction h1{font-size:clamp(2.5rem,10.5vw,3.6rem);line-height:.94}.grove-author{font-size:1rem;margin-top:12px}.grove-instruction{font-size:1rem;margin:16px 0 0}.grove-instruction br{display:none}.grove-progress{display:none}
 .immersive-grove .grove-art{width:100%;max-width:600px}.immersive-grove .grove-desktop{display:none}.immersive-grove .grove-mobile{display:block;max-width:none}
 .immersive-grove .grove-inscription{font-size:1.25rem}.immersive-grove .grove-primary .grove-inscription{font-size:1.4rem}.immersive-grove .grove-fruit[data-fruit=levi] .grove-inscription{font-size:1.45rem}
 .immersive-grove .branch-sun-void .grove-inscription{font-size:1.125rem}.immersive-grove .branch-sun-void .grove-fruit[data-fruit=levi] .grove-inscription{font-size:1.3rem}
 .immersive-grove .grove-mobile-branch{mask-image:linear-gradient(transparent,#000 5%,#000 95%,transparent)}.grove-mobile-branch+.grove-mobile-branch{margin-top:-18px}
 .grove-preview{display:none!important}.grove-end{padding:22px;gap:14px 25px}
}
.enlarged-type .grove-stage{display:block}.enlarged-type .grove-introduction{position:relative;inset:auto;width:auto;max-width:700px;margin:auto;padding:25px 22px}.enlarged-type .grove-introduction h1{font-size:2.2rem}.enlarged-type .grove-instruction{font-size:1rem;margin-top:22px}.enlarged-type .grove-progress{display:none}.enlarged-type .grove-preview{display:none}
.enlarged-type .immersive-grove .grove-art{width:100%;max-width:800px}.enlarged-type .immersive-grove .grove-desktop{display:none}.enlarged-type .immersive-grove .grove-mobile{display:block}.enlarged-type .grove-awakening,.enlarged-type .grove-stage:before{display:none}.enlarged-type .immersive-grove .grove-inscription{font-size:1rem!important}.enlarged-type .grove-dialog{max-height:90dvh}.enlarged-type .grove-preview-content h2{font-size:1.5rem}
@media(prefers-reduced-motion:reduce){.immersive-grove *{animation:none!important;transition:none!important}.grove-dialog::backdrop{backdrop-filter:none}}
html[data-motion=reduce] .immersive-grove *{animation:none!important;transition:none!important}

@media(min-width:1101px) and (max-width:1250px) and (min-height:760px){.grove-fruit[data-fruit=crs] .grove-inscription{margin-left:-8px}}
