/* Reference-led parchment menu. Geometry and text stay live and readable. */
.book{position:relative;width:min(1140px,96vw);max-height:94vh;border:2px solid #b4a07b!important;border-image:none!important;border-radius:3px;background:linear-gradient(110deg,#faf5e9,#f4ede0 60%,#faf7ee)!important;color:#3f3742;padding:22px 28px 15px;box-shadow:inset 0 0 0 5px #faf5e9,inset 0 0 0 6px #cdbb98,0 12px 40px #07122270;overflow:hidden}
.book header{display:flex;justify-content:center;position:relative;margin-bottom:15px;min-height:65px}.book header>div{display:block;text-align:center}.book .menuLogo{width:auto;height:auto;font:30px 'Gowun Batang',serif;color:#3a3243}.book #menuTitle{height:auto;font:16px 'Gowun Batang',serif;color:#665a62;margin:4px 0 0}.book #closeMenu{position:absolute;right:0;top:5px}
.book button{background:#faf5e7!important;background-image:none!important;border:1px solid #b7a17d!important;border-radius:5px!important;box-shadow:inset 0 0 0 2px #ece0c8!important;color:#554754!important;padding:9px 14px;min-height:36px;font:15px Jua,sans-serif;transform:none!important;filter:none!important}.book button:hover:not(:disabled){background:#f1e5cf!important}.book button.active{background:#f3e5bd!important;border-color:#a38a61!important;outline:none}.book button:disabled{opacity:.45}
.book .tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:12px;padding:0;border:0}.book .tabs button{min-height:40px;font-size:18px}
.book #menuContent{overflow:auto;padding:0 2px;min-height:0;flex:1}.book footer{padding:10px 0 0;border:0;text-align:center;font-size:12px;color:#786756}
.book .buildTabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0}.book .buildTabs button{background:linear-gradient(125deg,#fff4,var(--build-tint))!important;box-shadow:inset 0 0 0 3px #ffffff50!important;border-color:#9e8ba4!important;border-radius:10px!important;padding:14px 10px 12px;min-height:144px;color:#44394a!important}.book .buildTabs button.active{outline:2px solid #8d7da0;outline-offset:-5px}.book .buildTabs img{width:52px;height:52px;margin:0 auto 8px;border-radius:8px}.book .buildTabs strong{display:block;font:17px Jua;line-height:1.35}.book .buildTabs small{display:block;color:#66566d;font-size:14px;margin-top:8px}
.book .summaryLine{display:flex;justify-content:space-between;align-items:center;gap:10px;color:#6a5964;font-size:14px;margin:7px 0;padding:0 3px}.book .summaryLine strong{color:#895862}.book .summaryLine button{padding:5px 12px;min-height:30px;font-size:14px}
.subTabs{display:flex;gap:4px;padding-left:0}.book .subTabs button{border-radius:5px 5px 0 0!important;border-bottom:0!important;min-height:32px;padding:7px 20px;background:#e2d5c3!important;box-shadow:none!important}.book .subTabs button.active{background:#f1e9db!important}
.growthLower{border:1px solid #c0ad92;border-radius:0 6px 6px;background:#e9dfd0;padding:14px;min-height:210px}.inventoryPanel{display:grid;grid-template-columns:1fr 2fr 1fr;gap:16px;align-items:start}.inventoryPanel h3{font:17px Jua;color:#554554;margin-bottom:12px}.itemDetail{border-right:1px solid #c6b69f;min-height:192px;padding-right:14px}.itemDetail>img{width:72px;height:72px;object-fit:contain;float:left;margin:0 10px 8px 0}.itemDetail h3{padding-top:5px;margin-bottom:8px}.itemDetail small{font-size:13px;color:#786470}.itemDetail p{clear:both;font:15px Jua;line-height:1.5;min-height:42px;padding-top:6px;color:#6a5864}.itemDetail button{margin-top:10px}.book .slots{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:5px;margin:0}.book .slot,.book .bagSlot{padding:4px;min-height:0;height:auto;aspect-ratio:1/1.12;border-radius:5px!important;background:linear-gradient(135deg,#d8cbb9,#e9decf)!important;box-shadow:inset 0 1px 3px #88735230!important;border:1px solid #b6a18a!important;position:relative;isolation:auto}.book .slot::after{display:none}.book .slot:disabled{opacity:1}.book .slot img,.book .bagSlot img{width:100%;height:100%;object-fit:contain;border-radius:3px}.book .bagSlot.selected{outline:2px solid #b09256;outline-offset:-2px}.bagSlot i{position:absolute;right:3px;bottom:2px;font:12px Jua;color:#615381}.bagPanel{border-left:1px solid #c6b69f;padding-left:14px}.bagGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;max-height:174px;overflow:auto;padding-right:4px}.potionsNote{display:block;margin-top:8px;font:12px Jua;color:#7e6a72}
.book .skillGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.book .skillCard{border:1px solid #bda88c!important;border-radius:7px;background:#f7efe2!important;box-shadow:none;padding:12px;min-height:175px;color:#63525c}.book .skillCard h3{font:18px Jua;color:#574358;margin:6px 0}.book .skillCard p{font:14px Jua;line-height:1.5;color:#7a6770;min-height:42px}.book .skillCard small,.book .skillCard .rank{color:#8a756f;font-size:13px}.book .skillCard .skillArt{width:48px;height:48px;border:1px solid #bead98;border-radius:7px;margin:0 0 8px 8px}.book .skillCard button{font-size:14px;padding:6px 10px;min-height:30px}.growthDetails{font:16px Jua;line-height:1.8;color:#6b5864;min-height:190px}.growthDetails p{margin:12px 0}
.book .settings .settingRow{border-color:#c6b49a}.book .settings label,.book .wishPage h3{color:#655463}.book .settings p,.book .controls,.book .wishPage p,.book .rates{color:#7e6871}
#bossHud{top:18px!important;left:50%!important;width:min(450px,42vw)!important;height:60px!important;transform:translateX(-50%);color:#f5e8d1;background:none}.bossTitle{font:20px Jua!important;height:auto!important;width:auto!important;max-width:none!important;margin:0 0 9px!important;text-shadow:0 2px 3px #081526}.bossTitle::before,.bossTitle::after{display:none}#bossHud .bar{position:relative!important;left:auto!important;right:auto!important;top:auto!important;height:15px!important;margin:0!important;border:1px solid #d4bd88!important;border-radius:4px!important;overflow:hidden!important;background:#203144e6!important;box-shadow:0 2px 7px #07122260!important}#bossHud .bar::before{display:none!important}#bossHud .bar i{position:static!important;max-width:100%!important;height:100%!important;left:auto!important;top:auto!important;border-radius:2px!important;background:linear-gradient(#d8ad83,#a87577)!important;box-shadow:none!important}
#hud.shrineHud .location{top:130px!important}
@media(max-width:900px){.book{padding:16px;width:97vw}.book .menuLogo{display:block;font-size:25px}.book .buildTabs button{min-height:123px;padding:10px 5px}.book .buildTabs strong{font-size:14px}.book .buildTabs img{width:44px;height:44px}.book .buildTabs small{font-size:13px}.inventoryPanel{grid-template-columns:1fr 2fr;gap:10px}.bagPanel{grid-column:1/-1;border:0;padding:0}.bagGrid{grid-template-columns:repeat(9,minmax(0,1fr));max-height:150px}.itemDetail{padding-right:8px}.book .tabs button{font-size:16px}.book .skillGrid{grid-template-columns:repeat(2,minmax(0,1fr))}#bossHud{width:43vw!important;left:58%!important;top:16px!important}.bossTitle{font-size:16px!important}}
@media(max-width:600px){.book{padding:13px}.book .buildTabs{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.book .buildTabs button{min-height:112px}.book header{margin-bottom:10px}.book .menuLogo{font-size:21px}.book #closeMenu{top:42px;font-size:12px;padding:4px 8px}.book .tabs{gap:6px}.book .tabs button{font-size:14px;padding:7px}.inventoryPanel{grid-template-columns:1fr}.itemDetail{border:0;min-height:100px}.book .slots{gap:3px}.bagGrid{grid-template-columns:repeat(5,minmax(0,1fr))}.book .summaryLine{font-size:12px}.book .summaryLine button{font-size:12px}.book .skillGrid{grid-template-columns:1fr}.subTabs button{font-size:13px!important;padding:7px 12px!important}.growthLower{padding:10px}}

/* Header and tab artwork extracted from the approved parchment mockup. */
.book img.menuLogo{display:block;width:min(540px,65vw);height:auto;object-fit:contain;margin:auto}.book #menuTitle{display:none}.book .tabs button{background-color:transparent!important;background-repeat:no-repeat!important;background-position:center!important;background-size:100% 100%!important;border:0!important;box-shadow:none!important;font-size:0!important;color:transparent!important;height:42px!important}.book .tabs button[data-tab="skills"]{background-image:url('assets/motion/growth-tab.webp')!important}.book .tabs button[data-tab="wish"]{background-image:url('assets/motion/wish-tab.webp')!important}.book .tabs button[data-tab="settings"]{background-image:url('assets/motion/settings-tab.webp')!important}.book .tabs button.active{outline:1px solid #a58b57;outline-offset:2px;filter:brightness(.96)!important}.book .tabs button:focus-visible{outline:2px solid #ac8c50!important;outline-offset:2px}

/* Artwork retains its lettering proportions. Hover only changes its color. */
.book{border-radius:26px;clip-path:polygon(30px 0,calc(100% - 30px) 0,100% 30px,100% calc(100% - 30px),calc(100% - 30px) 100%,30px 100%,0 calc(100% - 30px),0 30px)}
.book .bookCorner{position:absolute;width:72px;height:72px;z-index:5;pointer-events:none;background-position:center;background-size:contain;background-repeat:no-repeat}
.cornerTL{top:0;left:0;background-image:url('assets/motion/corner-tl.webp')}.cornerTR{top:0;right:0;background-image:url('assets/motion/corner-tr.webp')}.cornerBL{bottom:0;left:0;background-image:url('assets/motion/corner-bl.webp')}.cornerBR{bottom:0;right:0;background-image:url('assets/motion/corner-br.webp')}
.book .tabs{align-items:center;flex-shrink:0}.book .tabs button{height:auto!important;min-height:0!important;aspect-ratio:6.2;padding:0!important;background-size:contain!important;transform:none!important;transition:filter .16s!important;filter:none!important}
.book .tabs button:hover:not(:disabled){transform:none!important;background-color:transparent!important;filter:sepia(.25) brightness(.92)!important;box-shadow:none!important}
.book .tabs button.active{outline:none!important;filter:sepia(.3) brightness(.9)!important}
.book .tabs button::before,.book .tabs button::after{display:none!important;transform:none!important}
.resourceGauges{display:flex;gap:8px;width:min(410px,72vw);margin:0 auto 4px;pointer-events:none}
.resourceGauge{flex:1;position:relative;height:20px;border:1px solid #b8cde19c;border-radius:10px;overflow:hidden;background:#101d32da;box-shadow:0 1px 4px #06132170}
.resourceGauge i{display:block;height:100%;width:0;transition:width .12s;background:linear-gradient(#bceaff,#599dca)}
.resourceGauge.awakening i{background:linear-gradient(#e8d6fc,#ae81d4)}
.resourceGauge span{position:absolute;inset:0;font:13px/18px Jua;text-align:center;color:#fff7eb;text-shadow:0 1px 2px #14243a}
.skills button.resourceLow img{opacity:.55}.skills button.resourceLow em{color:#d3b9c0}
@media(max-height:650px){.book header{margin-bottom:6px;min-height:45px}.book img.menuLogo{max-height:65px}.book .buildTabs button{min-height:110px}.book .tabs{margin-bottom:8px}}

/* Tab artwork has fixed geometry in every interaction state. */
.book .tabs{grid-template-columns:repeat(3,minmax(0,1fr))}
.book .tabs button[data-tab],.book .tabs button[data-tab]:hover,.book .tabs button[data-tab].active{background:none!important;transform:none!important;scale:1!important;min-width:0!important;width:100%!important;height:auto!important;aspect-ratio:6.2!important;padding:0!important;overflow:visible!important;transition:filter .16s!important}
.book .tabs button[data-tab] img{display:block!important;width:100%!important;height:100%!important;max-width:100%!important;object-fit:contain!important;transform:none!important;scale:1!important;transition:none!important}
.book .tabs button[data-tab]:hover{filter:sepia(.25) brightness(.92)!important}

/* Approved wish reference: real relic art, generous parchment space, live controls. */
.book .wishReference{padding:8px 0 10px;text-align:center}
.wishHero{display:grid;grid-template-columns:minmax(0,1fr) 155px minmax(0,1fr);gap:28px;align-items:center;min-height:155px}
.wishReference .wishPreview{width:135px;height:155px;object-fit:contain;justify-self:center;filter:drop-shadow(0 0 16px #a899dc66)}
.wishRelicBanner{position:relative;display:flex;align-items:center;justify-content:space-evenly;gap:8px;height:138px;padding:8px 14px;border:2px solid #b9a16c;border-radius:10px;background:radial-gradient(ellipse at 30% 30%,#52689980,transparent 55%),radial-gradient(ellipse at 78% 70%,#63487b90,transparent 58%),linear-gradient(120deg,#09152c,#172443 55%,#111731);box-shadow:inset 0 0 0 3px #091224,inset 0 0 0 4px #dac48e;overflow:hidden}
.wishRelicLeft{mask-image:linear-gradient(to right,#000 78%,transparent)}
.wishRelicRight{mask-image:linear-gradient(to left,#000 78%,transparent)}
.wishRelicBanner img{position:relative;z-index:1;display:block;width:43%;height:120px;min-width:0;object-fit:contain;flex:0 1 43%;filter:drop-shadow(0 0 7px #d7ccf028);transform:none}
.wishBannerStars{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#ffe7b4;font-size:28px;letter-spacing:17px;opacity:.6;pointer-events:none}
.book .wishReference h3{font:26px/1.3 Jua,sans-serif;color:#423329;margin:13px 0 12px}
.book .wishReference .wishIntro{font:16px/1.6 Jua,sans-serif;color:#4c4037;margin:0 auto 8px}
.book .wishReference #drawWish,.book .wishReference #drawWish:hover:not(:disabled){display:flex;align-items:center;justify-content:space-evenly;gap:12px;width:min(285px,90%);min-width:0;min-height:49px;margin:14px auto 9px;padding:7px 18px;background:linear-gradient(110deg,#e5e5f9,#fff7ff 48%,#dcdaf4)!important;border:2px solid #bba16c!important;border-radius:24px!important;box-shadow:inset 0 0 0 2px #fffaf0,inset 0 -5px 12px #bcb0d43d,0 2px 3px #80674322!important;color:#3f3348!important;font:18px/1.2 Jua,sans-serif;transform:none!important;transition:filter .15s}
.book .wishReference #drawWish:hover:not(:disabled){filter:brightness(1.05)!important}
.book .wishReference #drawWish>span[aria-hidden]{color:#bca065;font-size:22px}
.book .wishReference #drawWish:focus-visible{outline:2px solid #8b74ad;outline-offset:3px}
.book .wishReference .wishBalance{display:block;width:fit-content;min-width:230px;max-width:95%;padding:5px 16px;margin:0 auto 17px;border:1px solid #d3c39e;border-radius:6px;background:#e9dfcb55;font:15px/1.4 Jua,sans-serif;color:#534235}
.book .wishReference .wishBalance strong{color:#ab8137;margin-left:5px;font-weight:400}
.wishOdds{width:min(490px,96%);margin:auto;padding:0 12px 10px;border:1px solid #d7c6a3;border-radius:7px;background:#e9dfcb45}
.book .wishReference .rates{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:-1px -1px 8px;overflow:hidden;border:1px solid #bca575;border-radius:18px;box-shadow:0 0 0 3px #fff8e6;font:16px/1.3 Jua,sans-serif;color:#fff}
.wishRarity{padding:7px 2px;white-space:nowrap;text-shadow:0 1px 1px #0002}
.rarity-0{background:#a09d94}.rarity-1{background:#589bc4}.rarity-2{background:#b96889}.rarity-3{background:#c8a14e}
.book .wishReference .wishProbabilityNote{font:12px/1.55 Jua,sans-serif;color:#665344;margin:0}
@media(max-width:750px){.wishHero{grid-template-columns:minmax(0,1fr) 100px minmax(0,1fr);gap:8px;min-height:120px}.wishReference .wishPreview{width:95px;height:118px}.wishRelicBanner{height:100px;padding:4px;gap:2px}.wishRelicBanner img{height:90px;width:47%;flex-basis:47%}.book .wishReference h3{font-size:22px}.book .wishReference .wishIntro{font-size:14px}.book .wishReference .rates{font-size:13px}}
@media(max-height:760px) and (min-width:751px){.wishHero{min-height:120px}.wishReference .wishPreview{height:120px;width:100px}.wishRelicBanner{height:110px}.wishRelicBanner img{height:100px}.book .wishReference h3{font-size:23px;margin:8px 0}.book .wishReference #drawWish{margin:10px auto 8px}.book .wishReference .wishBalance{margin-bottom:12px}}

.merchantHead{text-align:center;padding:8px 12px 18px}.merchantHead h3{font:26px Jua;color:#dbeaff;margin:0 0 8px}.merchantHead p{font-size:16px;color:#cad5eb}.merchantHead>strong{color:#f6dda0;font-size:18px}.merchantGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.merchantItem{border:1px solid color-mix(in srgb,var(--rarity) 45%,transparent);border-radius:18px;padding:12px;background:linear-gradient(150deg,#233b54d9,#172135ed);text-align:center;display:flex;flex-direction:column;align-items:center;gap:5px}.merchantItem>img{width:86px;height:86px;object-fit:contain}.merchantItem small{font-size:14px;color:var(--rarity)}.merchantItem strong{font-size:17px;color:#f1eaff}.merchantItem p{font-size:14px;line-height:1.6;color:#c5d4e5;flex:1}.merchantItem button{font:15px Jua;min-height:38px;width:100%;margin-top:4px}.merchantNote{text-align:center;font-size:14px;line-height:1.6;color:#b5c6df;margin:18px 0 8px}@media(max-width:900px){.merchantGrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Quiet, illustrated refuge services use the same diary surfaces as growth. */
.shelterPanel{padding:18px 22px;color:#4f4964;font-family:Jua,sans-serif}.shelterPanel h2{font-size:28px;line-height:1.3;margin:0 0 5px}.shelterPanel p{font-size:17px;line-height:1.65}.restBalance{color:#8f6b59}.restDetail{display:flex;align-items:center;gap:25px;padding:25px;border-radius:28px;background:linear-gradient(135deg,#f5eed9b0,#e5eaf4b0)}.restDetail>img{width:170px;height:220px;object-fit:contain}.shelterPanel button{font-family:Jua,sans-serif;cursor:pointer;border:1px solid #b8a4c3;border-radius:18px;background:linear-gradient(#f5efe0,#e6dbe9);color:#514264;padding:12px 18px;font-size:17px}.shelterPanel button:hover{background:#e1e6f1}.shelterPanel button:disabled{opacity:.45;cursor:default}.exchangeBag{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;max-height:310px;overflow:auto;padding:10px}.exchangeBag button{padding:8px;display:flex;align-items:center;flex-direction:column;border-color:var(--rarity)}.exchangeBag img{width:76px;height:76px;object-fit:contain}.exchangeBag small{color:#80728c}.exchangeBag .picked{background:#d0dceb;box-shadow:inset 0 0 0 3px #839bbb}.exchangeResult{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:18px 0;padding:15px;border-radius:22px;background:#e4e7ed99}.exchangeResult img{width:80px;height:80px;object-fit:contain}.exchangeResult span{font-size:15px}.albumPages{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.albumPages article{padding:20px;border:1px solid #d0becf;border-radius:24px;background:linear-gradient(135deg,#fbf4e5b0,#e9e6f2c0)}.albumPages img{width:100%;height:150px;object-fit:contain}.albumPages .albumArt{object-fit:cover}.albumPages h3{font-size:22px}.albumPages .unwritten{opacity:.7}.albumPages small{font-size:14px}@media(max-width:800px){.exchangeBag{grid-template-columns:repeat(3,minmax(0,1fr))}.albumPages{grid-template-columns:1fr}.restDetail{flex-direction:column}.shelterPanel{padding:8px}}
