/* Four Seasons edition: atmosphere, physical scene composition and tactile controls. */
:root{--season-light:#e3b3c3;--season-sky:#efe9df;--season-duration:8s;--day-tint:.05}
body.page{background:var(--scene);isolation:isolate}body.page:not(.page-cinema):not(.page-secret){--scene:var(--season-sky)}body.page:before{z-index:-1;pointer-events:none}main{z-index:2}
.living-atmosphere{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none}.season-wash{position:absolute;inset:-15%;background:radial-gradient(ellipse at 10% 15%,var(--season-light),transparent 55%),radial-gradient(ellipse at 85% 80%,#edf4e4,transparent 55%);opacity:.25;animation:environment-breathe 17s ease-in-out infinite alternate;transition:background 2s}.living-atmosphere:after{/* [CHỮ / BIỂU TƯỢNG CSS] Chuỗi sau content là chữ vẽ thêm bằng ::before/::after của bộ chọn này; không phải nội dung album. Chuỗi rỗng tạo lớp trang trí trống. Chỉ đổi phần trong nháy nếu muốn đổi nhãn / biểu tượng. */content:'';position:absolute;inset:0;background:#332347;opacity:var(--day-tint);transition:opacity 3s}.cloud{position:absolute;background:#fff9eac9;border-radius:50%;filter:blur(38px);height:160px;width:530px;opacity:.36;animation:cloud-pass 65s ease-in-out infinite alternate;translate:var(--drift,0) 0}.cloud-one{top:12%;left:-150px}.cloud-two{right:-180px;bottom:15%;animation-delay:-20s;opacity:.24}.sun-rays{position:absolute;inset:-45%;background:conic-gradient(from 190deg at 70% 20%,transparent 0deg,#f6db8d33 8deg,transparent 17deg,#fff0bb30 26deg,transparent 40deg,#f6d99633 54deg,transparent 65deg);opacity:0;transform-origin:70% 20%;animation:sun-drift 30s ease-in-out infinite alternate;transition:opacity 2s}.winter-frost{position:absolute;inset:0;box-shadow:inset 0 0 100px #dbe9f2aa;opacity:0;transition:opacity 2s;background:linear-gradient(130deg,#dfeaf550,transparent 25%,transparent 80%,#dce5f760)}
.branch{position:absolute;width:260px;height:440px;border-left:3px solid #83958155;border-radius:50%;top:10%;transform-origin:bottom center;animation:branch-sway var(--season-duration) ease-in-out infinite alternate;opacity:.6}.branch:before,.branch:after{/* [CHỮ / BIỂU TƯỢNG CSS] Chuỗi sau content là chữ vẽ thêm bằng ::before/::after của bộ chọn này; không phải nội dung album. Chuỗi rỗng tạo lớp trang trí trống. Chỉ đổi phần trong nháy nếu muốn đổi nhãn / biểu tượng. */content:'';position:absolute;width:60px;height:110px;background:var(--season-light);border-radius:90% 0 90% 0;opacity:.45;left:-25px;top:35px;box-shadow:35px 110px 0 var(--season-light),-7px 240px 0 var(--season-light)}.branch:after{left:20px;top:100px;scale:.65;rotate:65deg}.branch-left{left:-180px}.branch-right{right:-160px;top:38%;rotate:180deg;animation-delay:-3s}
body[data-season=spring] .branch:before,body[data-season=spring] .branch:after{border-radius:50% 50% 35% 50%;width:55px;height:55px}body[data-season=summer] .sun-rays{opacity:1}body[data-season=summer] .branch{--season-light:#acba84}body[data-season=autumn] .cloud{opacity:.16}body[data-season=autumn] .branch:before{rotate:15deg}body[data-season=winter] .winter-frost{opacity:.65}body[data-season=winter] .branch{opacity:.25}body[data-season=winter] .cloud{opacity:.4}body[data-season=winter] .branch:before{background:#e6eef4}
#seasonParticles{position:fixed;inset:0;pointer-events:none;z-index:4}#dreamParticles{display:none!important}.season-badge{position:fixed;right:20px;top:94px;z-index:54;border:1px solid #9b879c66;border-radius:4px 18px 4px 18px;padding:10px 19px;background:#fff9e8e8;color:#67506b;box-shadow:0 5px 18px #48345310;font:17px var(--note);cursor:pointer}.season-badge:hover{rotate:-3deg;background:#fff9e8}.season-cue{position:fixed;top:100px;left:50%;translate:-50% -10px;z-index:180;background:#fff8e8;border:1px solid #bca5bd66;padding:13px 25px;border-radius:3px 20px 3px 20px;font:20px var(--note);color:#6a536e;opacity:0;pointer-events:none;transition:opacity .6s,translate .6s;box-shadow:0 12px 50px #38283e22}.season-cue.visible{opacity:1;translate:-50% 0}.settings-map-link{display:block;border-bottom:1px dashed #a590a6;padding:20px 0 10px;color:#715776;font:22px var(--note)}.settings-grid{gap:18px 30px}.settings-grid label{font-size:15px}.settings-grid select{min-width:0;max-width:100%;padding:10px;font:14px var(--body)}.settings-grid input[type=checkbox]{width:20px;height:20px;accent-color:#92768f}.settings-grid input[type=range]{width:100%}#settingsPanel{width:min(760px,92vw)}
.world-loading{position:fixed;inset:0;z-index:600;background:radial-gradient(ellipse at center,var(--season-sky),#f7f0e4);display:flex;flex-direction:column;align-items:center;justify-content:center;color:#57435e;transition:opacity .4s;gap:14px}.world-loading img{width:150px;animation:companion-float 3s ease-in-out infinite}.world-loading p{font:32px var(--display);margin:7px 0}.world-loading progress{width:190px;height:5px;accent-color:#a485a1;border:0}.world-loading button{border:0;background:none;font:16px var(--note);color:#7a6280;margin-top:20px;padding:12px;cursor:pointer}.world-loading.done{opacity:0;pointer-events:none}.world-loading .kicker{font-size:10px}
.room-art{transition:filter 1.2s}.dream-room:after{/* [CHỮ / BIỂU TƯỢNG CSS] Chuỗi sau content là chữ vẽ thêm bằng ::before/::after của bộ chọn này; không phải nội dung album. Chuỗi rỗng tạo lớp trang trí trống. Chỉ đổi phần trong nháy nếu muốn đổi nhãn / biểu tượng. */content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,var(--season-light),transparent 55%);mix-blend-mode:soft-light;opacity:.45}.dream-room.curtain-drawn .room-art{filter:brightness(.64) saturate(.7)}.room-curtain{left:4%;top:13%}.room-curtain>span:first-child{font-size:40px;line-height:1;color:#a47f91;text-shadow:1px 2px #fff9e6}.room-drawer{left:33%;bottom:4%}.room-drawer>span:first-child{font-size:50px;color:#b59380}.room-drawer[aria-expanded=true]{translate:0 10px}.environment-note{text-align:center;font:23px var(--note);margin:20px 0;color:var(--soft-ink)}.pet-corner-link{display:block;text-align:center;font:20px var(--note);color:var(--accent);margin-top:12px}.hide-environment-captions .environment-note,.hide-environment-captions .season-cue,.hide-environment-captions .pet-role{display:none}.idle-wave .companion-button{animation:dragon-wave 1.7s ease-in-out}.fairy-string{color:#ffedb2;text-shadow:0 0 12px #ffe9b9;animation:fairy-breathe 5s ease-in-out infinite;font:25px var(--display);letter-spacing:12px}
.diorama-section{margin-top:90px;border-top:1px solid #a894a044;padding-top:45px}.diorama-heading{max-width:600px}.diorama-heading h2{font:clamp(34px,4vw,55px)/1.2 var(--display)}.diorama-viewport{height:630px;perspective:1300px;display:grid;place-items:center;overflow:hidden}.diorama{position:relative;width:650px;height:430px;transform-style:preserve-3d;transform:rotateX(-11deg) rotateY(-18deg);transition:filter .5s}.diorama-back{position:absolute;inset:0;background:repeating-linear-gradient(90deg,#e9daca 0 36px,#e3d1c33d 36px 38px),#e6d4c5;border:12px solid #c5aa93;transform:translateZ(-100px);box-shadow:inset 0 0 90px #8d6a6644}.diorama-floor{position:absolute;width:650px;height:380px;left:0;bottom:0;transform-origin:bottom;transform:translateZ(-100px) rotateX(90deg);background:repeating-linear-gradient(0deg,#d4bca0 0 35px,#c2a287 35px 38px);border:12px solid #b8987e}.diorama-side{position:absolute;left:0;top:0;width:380px;height:430px;transform-origin:left;transform:translateZ(-100px) rotateY(-90deg);background:#d9c5b3;border:12px solid #b8987e}.diorama-window{position:absolute;left:38%;top:42px;width:210px;height:215px;background:linear-gradient(var(--season-light),var(--season-sky));border:12px solid #fff0da;border-radius:85px 85px 0 0;box-shadow:0 0 55px var(--season-light)}.diorama-window:before,.diorama-window:after{/* [CHỮ / BIỂU TƯỢNG CSS] Chuỗi sau content là chữ vẽ thêm bằng ::before/::after của bộ chọn này; không phải nội dung album. Chuỗi rỗng tạo lớp trang trí trống. Chỉ đổi phần trong nháy nếu muốn đổi nhãn / biểu tượng. */content:'';position:absolute;background:#fff0da}.diorama-window:before{width:9px;height:100%;left:50%}.diorama-window:after{height:9px;width:100%;top:55%}.diorama-window span{position:absolute;width:55px;height:55px;background:#fff2bf;border-radius:50%;right:15px;top:38px;box-shadow:0 0 25px #fff0bd}.diorama .fairy-string{position:absolute;top:6px;left:60px}.diorama-photo{position:absolute;left:50px;top:125px;width:115px;background:#fff4de;padding:8px 8px 18px;transform:translateZ(-83px) rotate(-8deg);box-shadow:4px 6px 9px #6a51582a}.diorama-photo img{width:100%;height:120px;object-fit:cover}.diorama-photo span{font:16px var(--note);color:#65566a}.diorama-light{position:absolute;right:40px;top:50px;width:65px;height:65px;background:#ebd7a6;border:7px double #f8e8c7;border-radius:50%;color:#fff9d0;font-size:30px;transform:translateZ(-55px);box-shadow:0 0 55px #fff0b2;cursor:pointer}.diorama-door{position:absolute;right:38px;bottom:12px;width:115px;height:230px;background:#997d86;border:8px double #c8aeb3;border-radius:60px 60px 0 0;text-align:center;display:grid;place-content:center;transform:translateZ(-86px);color:#fff0da;font:23px var(--note)}.diorama-rug{position:absolute;bottom:-55px;left:180px;width:270px;height:200px;border:8px double #d9c4b7;border-radius:50%;background:#a890a4;transform:translateZ(60px) rotateX(75deg)}.diorama-cat{position:absolute;left:190px;bottom:-18px;width:175px;transform:translateZ(100px);filter:drop-shadow(0 8px 4px #5d46593a)}.diorama.dark{filter:brightness(.62)}.diorama.dark .diorama-light{box-shadow:none;background:#9d8d82}.secret-charm{position:absolute;bottom:28px;right:40px;width:50px;height:50px;border:1px dashed #b2a882;background:#ffefc3;color:#8e7b55;border-radius:50%;font-size:28px;cursor:pointer;animation:fairy-breathe 5s infinite}
.world-map{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:35px;padding:50px 35px 70px;border:1px solid #a6aaa05c;border-radius:100px 100px 10px 10px;background:radial-gradient(ellipse at center,#fff7db99,transparent),#cedacf55;isolation:isolate;margin:35px 0 55px}.world-map:before{/* [CHỮ / BIỂU TƯỢNG CSS] Chuỗi sau content là chữ vẽ thêm bằng ::before/::after của bộ chọn này; không phải nội dung album. Chuỗi rỗng tạo lớp trang trí trống. Chỉ đổi phần trong nháy nếu muốn đổi nhãn / biểu tượng. */content:'';position:absolute;inset:15% 12%;border:2px dashed #9ca38a;border-radius:45%;rotate:-8deg;z-index:-1}.map-island{display:flex;align-items:center;flex-direction:column;gap:12px;rotate:-3deg;transition:translate .35s;position:relative}.map-island:nth-child(2n){rotate:4deg;margin-top:35px}.map-island img{width:100%;height:150px;object-fit:cover;border:8px solid #fffae9;border-bottom-width:22px;border-radius:70px 70px 5px 5px;box-shadow:0 10px 25px #65515b20}.map-island span{font:18px var(--note);color:#64566b;text-align:center}.map-island:hover{translate:0 -8px}.map-island.visited:after{/* [CHỮ / BIỂU TƯỢNG CSS] Chuỗi sau content là chữ vẽ thêm bằng ::before/::after của bộ chọn này; không phải nội dung album. Chuỗi rỗng tạo lớp trang trí trống. Chỉ đổi phần trong nháy nếu muốn đổi nhãn / biểu tượng. */content:'✿';position:absolute;right:-5px;top:10px;background:#7d9078;color:#fff7dd;border-radius:50%;width:26px;height:26px;display:grid;place-items:center}.collection-pocket{padding:25px 30px;background:#fff8e3;box-shadow:8px 10px #a48b9120;border:1px dashed #c3b397;rotate:-.6deg;margin-top:35px}.collection-pocket h2{font-size:32px;margin:12px 0}.pocket-items{display:flex;flex-wrap:wrap;gap:12px}.pocket-items span{padding:12px 18px;font:18px var(--note);color:#766178;background:#eae2e3;border-radius:3px 14px 3px 14px}
.pet-shell{width:min(1150px,90vw);margin:auto;padding:70px 0 140px}.pet-shell h1{font:clamp(48px,6vw,85px)/1.15 var(--display);margin:20px 0}.pet-yard{display:grid;grid-template-columns:1fr 1fr;gap:30px;background:linear-gradient(transparent 60%,#aab99533),radial-gradient(ellipse at top,var(--season-light),transparent 65%);border-bottom:2px solid #8b9a8055;border-radius:160px 160px 0 0;padding:35px 50px 50px;position:relative}.pet-yard:after{/* [CHỮ / BIỂU TƯỢNG CSS] Chuỗi sau content là chữ vẽ thêm bằng ::before/::after của bộ chọn này; không phải nội dung album. Chuỗi rỗng tạo lớp trang trí trống. Chỉ đổi phần trong nháy nếu muốn đổi nhãn / biểu tượng. */content:'';position:absolute;left:3%;right:3%;top:8%;border-top:2px dashed #beaf84;border-radius:50%;height:90px;pointer-events:none}.pet-station{text-align:center}.pet-name{font:40px var(--display);margin:15px 0 5px}.pet-station p:not(.pet-name){font:20px var(--note)}.pet-touch{display:block;width:100%;border:0;background:none;cursor:pointer;position:relative;animation:pet-breathe 6s ease-in-out infinite}.pet-touch img{width:min(310px,100%);height:300px;object-fit:contain;filter:drop-shadow(0 15px 14px #6c4c6330)}.pet-station.cat{padding-top:60px}.pet-station.fed .pet-touch{animation:pet-hop 1s ease-in-out}.pet-station .btn[aria-pressed=true]{background:#e6e9ce}.pet-status{min-height:60px;text-align:center;font:23px/1.6 var(--note);max-width:680px;margin:30px auto}.pet-toy{display:block;border:0;background:none;font-size:55px;margin:0 auto;cursor:grab;touch-action:none}.pet-notes{display:flex;justify-content:center;gap:50px;margin:45px 0}.pet-notes p{font:21px var(--note);background:#fff8e7;padding:23px 30px;rotate:-4deg;box-shadow:5px 6px #a5919922;max-width:260px}.pet-notes p:nth-child(2){rotate:4deg;background:#e6e8dc}.season-ending{position:absolute;bottom:20%;left:10%;right:10%;text-align:center;font:24px var(--note)!important;color:#6c5873!important}.ending .season-badge{display:none}.chapter-grid a[aria-current=page]{border:2px solid #9b7e99}.chapter-grid a[data-visited=true] small:after{/* [CHỮ / BIỂU TƯỢNG CSS] Chuỗi sau content là chữ vẽ thêm bằng ::before/::after của bộ chọn này; không phải nội dung album. Chuỗi rỗng tạo lớp trang trí trống. Chỉ đổi phần trong nháy nếu muốn đổi nhãn / biểu tượng. */content:' ✿';color:#789074}
.chapter-transition{transition:opacity .7s,clip-path .7s,filter .7s;overflow:hidden;background:var(--season-sky)}.chapter-transition .transition-wing,.transition-ring{position:absolute;pointer-events:none}.chapter-transition>img,.chapter-transition>span{position:relative;z-index:3}.transition-wing{inset:0;background:var(--season-light);opacity:.45}.transition-wing.right{display:none}.chapter-transition[data-style=door],.chapter-transition[data-style=curtain]{clip-path:inset(0);background:transparent}.chapter-transition[data-style=door] .transition-wing,.chapter-transition[data-style=curtain] .transition-wing{width:50%;right:auto;transform:translateX(-105%) rotateY(25deg);transform-origin:left;opacity:1;transition:transform .72s;background:repeating-linear-gradient(90deg,#827088 0 24px,#917e9833 24px 28px),#827088}.chapter-transition[data-style=door] .right,.chapter-transition[data-style=curtain] .right{display:block;left:50%;transform:translateX(105%) rotateY(-25deg);transform-origin:right}.chapter-transition.leaving[data-style=door] .transition-wing,.chapter-transition.leaving[data-style=curtain] .transition-wing{transform:none}.chapter-transition[data-style=ribbon]{clip-path:polygon(0 0,0 0,0 100%,0 100%);background:var(--season-light)}.chapter-transition.leaving[data-style=ribbon]{clip-path:polygon(0 0,130% 0,100% 100%,0 100%)}.chapter-transition[data-style=page]{clip-path:inset(0 100% 0 0);background:repeating-linear-gradient(#fff4da 0 36px,#dacbba 36px 37px)}.chapter-transition.leaving[data-style=page]{clip-path:inset(0)}.chapter-transition[data-style=photo]{clip-path:inset(40% 42% round 4px);transform:scale(.6);transition:opacity .7s,transform .7s,clip-path .7s;background:#f8eedb}.chapter-transition.leaving[data-style=photo]{clip-path:inset(0);transform:scale(1)}.chapter-transition[data-style=tunnel] .transition-ring{width:55vw;height:55vw;border:35px double #fff1cb88;border-radius:50%;box-shadow:0 0 0 80px #c1a3c333,0 0 0 180px #e1c7ca44;animation:tunnel-open 1s both}.chapter-transition[data-style=bloom],.chapter-transition[data-style=season]{clip-path:circle(0 at var(--portal-x,50%) var(--portal-y,50%));background:radial-gradient(circle,#fff5cf,var(--season-light))}.chapter-transition.leaving[data-style=bloom],.chapter-transition.leaving[data-style=season]{clip-path:circle(160% at var(--portal-x,50%) var(--portal-y,50%))}.chapter-transition[data-style=dissolve]{clip-path:inset(0);filter:blur(30px);background:var(--season-sky)}.chapter-transition.leaving[data-style=dissolve]{filter:blur(0)}
@keyframes environment-breathe{to{transform:translate(3%,-2%) scale(1.1);opacity:.4}}@keyframes cloud-pass{to{transform:translateX(180px) scale(1.2)}}@keyframes sun-drift{to{rotate:8deg;scale:1.06}}@keyframes branch-sway{to{transform:rotate(4deg)}}@keyframes fairy-breathe{50%{opacity:.45;filter:brightness(1.4)}}@keyframes dragon-wave{30%{transform:translateY(-20px) rotate(-12deg)}70%{transform:translateY(-10px) rotate(8deg)}}@keyframes pet-breathe{50%{translate:0 -8px;rotate:1deg}}@keyframes pet-hop{40%{translate:0 -32px;rotate:-5deg}75%{translate:0 -8px;rotate:4deg}}@keyframes tunnel-open{from{scale:.3;rotate:0}to{scale:2;rotate:30deg}}
@media(max-width:700px){.season-badge{top:78px;right:72px;font-size:14px;padding:7px 12px}.season-cue{top:130px;max-width:85vw;width:max-content;font-size:17px}.branch{opacity:.3}.diorama-viewport{height:420px}.diorama{scale:.52}.diorama-heading h2{font-size:34px}.world-map{grid-template-columns:1fr 1fr;gap:24px 15px;padding:30px 15px}.map-island img{height:115px}.map-island span{font-size:16px}.pet-yard{padding:50px 10px 25px;gap:5px}.pet-touch img{height:180px}.pet-name{font-size:30px}.pet-station p:not(.pet-name){font-size:16px}.pet-station .btn{padding:10px;font-size:11px}.pet-notes{gap:12px}.pet-notes p{font-size:17px;padding:15px}.collection-pocket{padding:20px}.room-curtain{top:9%}.room-drawer{left:28%;bottom:1%}.room-curtain>span:first-child,.room-drawer>span:first-child{font-size:25px}.world-loading p{font-size:25px}.settings-grid{grid-template-columns:1fr 1fr;gap:14px}.settings-grid label{font-size:13px}}
body.motion-paused *,body.motion-paused *:before,body.motion-paused *:after{animation:none!important;transition:none!important}body.motion-paused .diorama{transform:rotateX(-11deg) rotateY(-18deg)!important}
@media(prefers-reduced-motion:reduce){.living-atmosphere *,.pet-touch,.fairy-string{animation:none}}
.diorama-back,.diorama-side,.diorama-floor,.diorama-rug,.diorama-cat{pointer-events:none}.diorama-floor{transform:translateZ(-100px) rotateX(-90deg)}.map-island{min-width:0}.world-map{overflow:hidden}
.attic-bonus{padding:50px 30px;margin-top:70px;border:1px dashed #bca38977;text-align:center;border-radius:90px 90px 5px 5px;background:#211e2b55}.attic-bonus h2{font:40px var(--display)}.attic-inside{margin:35px auto 0;max-width:650px;padding:40px;background:radial-gradient(ellipse,#bba2b255,transparent);animation:scene-arrive 1s both}.attic-inside span{font-size:70px;color:#efdcaa;text-shadow:0 0 30px #fff2ba}.attic-inside p{font:24px/1.65 var(--note)}.attic-inside a{color:#f0d9af;font:22px var(--note)}.ending .living-atmosphere,.ending #seasonParticles{opacity:0;transition:opacity 2s}
.diorama{pointer-events:none}.diorama a,.diorama button{pointer-events:auto}
.diorama,.diorama.dark{filter:none;transition:none}.diorama.dark>.diorama-back,.diorama.dark>.diorama-side,.diorama.dark>.diorama-floor{filter:brightness(.62)}