/* Panda Heart 3.2 — storybook, accessible mobile UI */
.p32-zone,.p32-zone *,.p32-home,.p32-home *{box-sizing:border-box}
.p32-zone{color:#f7fff8;overflow:hidden}
.p32-companion{display:flex;align-items:center;gap:12px;background:linear-gradient(125deg,#e7f8dc,#a6dbb9 67%,#6ba993);padding:13px;border:1px solid #e6f6d7;border-radius:21px;color:#173f34;min-width:0}
.p32-avatar{width:108px;min-width:100px;min-height:136px;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle,#f7ffe9 30%,transparent 75%);border-radius:21px}
.p32-avatar img{width:106px;height:116px;object-fit:contain;filter:drop-shadow(0 10px 10px #233f3640);animation:p32-bob 3.7s ease-in-out infinite}
@keyframes p32-bob{0%,100%{transform:translateY(1px)}50%{transform:translateY(-4px)}}
.p32-inner{min-width:0;flex:1}
.p32-inner small{font-size:10px;color:#477d61;letter-spacing:1.1px;font-weight:950}
.p32-inner h3{font-size:clamp(17px,4vw,22px)!important;color:#184f38!important;line-height:1.16;margin:6px 0!important}
.p32-inner p{font-size:12px;color:#3a6e52;line-height:1.45;margin:8px 0}
.p32-chips{display:flex;flex-wrap:wrap;gap:5px}
.p32-chips span{font-size:10px;font-weight:900;border:1px solid #6ca08383;color:#1b543a;border-radius:100px;padding:5px 8px;background:#ffffff7e}
.p32-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:14px 0 12px}
.p32-tabs button{min-height:47px;min-width:0;border:1px solid #ffffff55;border-radius:12px;background:#ffffff20;color:#edf9ee;font-size:12px;font-weight:950;letter-spacing:-.2px}
.p32-tabs button[aria-selected=true]{background:#f9e6ae;color:#204530;border-color:#edd38b;box-shadow:0 6px 15px #08211e55}
.p32-content{min-width:0;animation:p32-appear .23s ease-out}
@keyframes p32-appear{from{opacity:.6;transform:translateY(6px)}to{opacity:1;transform:none}}
.p32-content h3{font-size:17px!important;color:#fff!important;margin:17px 0 7px!important}
.p32-content .p32-muted,.p32-disclaimer{font-size:11px;color:#d6ecde;line-height:1.5;margin:8px 0 12px}
.p32-disclaimer{margin:14px 0 4px;padding-top:10px;border-top:1px solid #ffffff33}
.p32-soul-info{display:flex;flex-wrap:wrap;justify-content:space-between;gap:5px;background:#ffffff16;border:1px solid #ffffff3f;border-radius:14px;padding:11px 13px}
.p32-soul-info b{font-size:14px;color:#fff1b9}
.p32-soul-info span{font-weight:850;font-size:12px}
.p32-soul-info small{display:block;width:100%;font-size:11px;color:#d0e9d7}
.p32-talents{display:grid;gap:8px;margin:12px 0}
.p32-talent{display:flex;align-items:center;gap:9px;background:#ffffff10;border:1px solid #ffffff25;border-radius:15px;padding:8px 11px}
.p32-talent img{width:50px;height:51px;object-fit:contain}
.p32-talent>div{min-width:0;flex:1}
.p32-talent b{font-size:13px;display:flex;justify-content:space-between}
.p32-talent small{display:block;color:#d6ebdb;font-size:10px;margin:2px 0 6px}
.p32-talent i{display:block;height:7px;background:#071e1980;overflow:hidden;border-radius:20px}
.p32-talent em{display:block;height:100%;background:linear-gradient(90deg,#c4eac4,#f6dd8c);border-radius:20px;transition:width .3s}
.p32-moments{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.p32-moments button{background:linear-gradient(#fafff5,#d8ecd3);border:1px solid #bdedc0;color:#204730;border-radius:14px;padding:9px 6px 11px;text-align:center;min-width:0;min-height:139px}
.p32-moments button:disabled{opacity:.58;filter:grayscale(.3)}
.p32-moments img{width:59px;height:59px;object-fit:contain;display:block;margin:auto}
.p32-moments b{display:block;font-size:11px;line-height:1.24;margin:2px 0 5px}
.p32-moments small{display:block;font-size:9px;line-height:1.25;color:#4c725b}
.p32-moment-left{font-size:11px;color:#fff0b4;text-align:right;margin:8px 0 4px}
.p32-friends{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.p32-friends>div{background:#ffffff19;border:1px solid #ffffff36;border-radius:12px;padding:9px 7px;min-width:0}
.p32-friends b{display:block;font-size:14px;color:#fff2b8}
.p32-friends small{display:block;font-size:10px;color:#e0eee2;margin:3px 0 8px}
.p32-friends span{font-size:10px;color:#d6e6cf}
.p32-book-stats,.p32-journal-summary{padding:12px;background:#ffffff13;border:1px solid #ffffff39;border-radius:13px}
.p32-book-stats b{font-size:15px;color:#fbe6a0}
.p32-book-stats p{font-size:11px;line-height:1.4;margin:5px 0 0;color:#e0ebdb}
.p32-arc{margin:10px 0;border:1px solid #ffffff39;border-radius:15px;background:#ffffff0d;overflow:hidden}
.p32-arc summary{cursor:pointer;display:flex;justify-content:space-between;gap:6px;padding:13px 10px;font-size:12px;font-weight:950}
.p32-arc summary small{font-size:11px;font-weight:850;color:#fff1ac}
.p32-story-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;padding:0 9px 10px}
.p32-story{min-width:0;min-height:118px;padding:9px;background:#ffffff18;border:1px solid #ffffff39;border-radius:13px;color:#fff;text-align:left}
.p32-story img{display:block;width:46px;height:46px;object-fit:contain}
.p32-story b{display:block;font-size:12px;line-height:1.24;margin:5px 0;overflow-wrap:anywhere}
.p32-story small{font-size:10px;color:#dce9dd}
.p32-story.ready{background:#f3eebc;color:#204b37;border-color:#f3d98d}
.p32-story.ready small{color:#36654d}
.p32-story.done{background:#3c7a5e;border-color:#a9dda4}
.p32-story.locked{opacity:.55;filter:saturate(.6)}

.p32-places{display:grid;grid-template-columns:1fr;gap:9px}
.p32-place{display:flex;align-items:center;gap:12px;text-align:left;padding:10px;background:#ffffff15;border:1px solid #ffffff3c;color:#f8fff8;border-radius:16px}
.p32-place.unlocked{border-color:#d9d69a;background:#ffffff1c}
.p32-place.locked{opacity:.5}
.p32-place img{width:66px;height:67px;object-fit:contain;flex-shrink:0}
.p32-place>div{min-width:0}
.p32-place b{display:block;font-size:14px}
.p32-place small{display:block;font-size:11px;line-height:1.4;color:#daebdf;margin:4px 0}
.p32-place em{display:block;font-size:10px;color:#f7e09e;font-style:normal;font-weight:850}
.p32-journal-summary{font-size:12px;margin-bottom:10px}
.p32-journal{display:grid;gap:9px}
.p32-journal article{border-left:3px solid #f4daa2;padding:10px 12px;background:#ffffff13;border-radius:0 12px 12px 0}
.p32-journal article small{color:#c8dccd;font-size:10px}
.p32-journal article h4{margin:5px 0!important;font-size:15px!important;color:#fff!important}
.p32-journal article p{color:#f0f9ed;line-height:1.5;font-size:12px;margin:5px 0}
.p32-journal article span{color:#f9e8a6;font-size:11px}
.p32-empty{text-align:center;padding:22px 10px}
.p32-empty img{width:87px;height:90px;object-fit:contain}
.p32-empty h3{margin:6px 0!important}
.p32-empty p{font-size:12px;line-height:1.5;color:#e2eee3}
.p32-home{display:flex;align-items:center;gap:12px;margin:14px 0;background:linear-gradient(130deg,#fbf5dc,#e8f6de);border:1px solid #b9d5b7;border-radius:24px;padding:14px;color:#234b37;box-shadow:0 9px 19px #1b503228}
.p32-home img{width:88px;height:100px;object-fit:contain;flex:0 0 88px;filter:drop-shadow(0 7px 7px #173f322b)}
.p32-home>div{flex:1;min-width:0}
.p32-home small{display:block;font-size:9px;letter-spacing:1px;font-weight:950;color:#678c67}
.p32-home b{display:block;font-size:17px;margin:3px 0;color:#24583f}
.p32-home p{margin:3px 0 7px;font-size:12px;color:#46664f;line-height:1.35}
.p32-home span{display:inline-block;font-size:10px;margin:0 5px 6px 0;padding:4px 6px;border-radius:50px;background:#cce7cc;color:#345e42;font-weight:800}
.p32-home button{display:block;margin-top:4px;padding:9px 13px;border:0;border-radius:12px;background:#1f6246;color:#fff;font-size:12px;font-weight:900;min-height:41px}
.p32-legacy{margin:15px 0 18px;border:1px solid #b5d4b3;background:#eef8ed;border-radius:17px;overflow:hidden}
.p32-legacy>summary{padding:15px;cursor:pointer;color:#21533c;font-size:13px;font-weight:900}
.p32-legacy>.panda-life120,.p32-legacy>.p123-journey{margin:9px}
body.p32-dialog-open{overflow:hidden!important}
body>.p32-shade{position:fixed;inset:0;width:100%;height:100dvh;z-index:1000001;display:flex;justify-content:center;align-items:center;background:rgba(6,19,18,.85);backdrop-filter:blur(7px);padding:max(15px,env(safe-area-inset-top)) 13px max(15px,env(safe-area-inset-bottom));overflow-y:auto}
.p32-dialog{flex:0 1 440px;width:100%;max-height:89dvh;overflow-y:auto;background:linear-gradient(160deg,#fcf9e8,#e9f6e9);padding:20px;color:#1b4530;border:2px solid #e6d4a0;border-radius:23px;box-shadow:0 23px 80px #0009}
.p32-dialog-hero{display:flex;align-items:center;gap:11px}
.p32-dialog-hero img{width:90px;height:98px;flex-shrink:0;object-fit:contain}
.p32-dialog-hero small{color:#67886c;font-weight:900;font-size:10px}
.p32-dialog-hero h2{color:#1e4c38!important;margin:5px 0!important;font-size:23px!important;line-height:1.1}
.p32-dialog-hero span{font-size:12px;color:#5c7e65}
.p32-dialog-text{font-size:15px;line-height:1.58;color:#2d5138;background:#ffffffa6;padding:13px;border-radius:12px}
.p32-choice-title{margin:11px 0 6px;font-size:12px;font-weight:900;color:#466249}
.p32-dialog .p32-choice{display:block;width:100%;background:#27724f;color:#fff;border:1px solid #5d9b79;text-align:left;border-radius:12px;margin:8px 0;min-height:54px;padding:10px 13px}
.p32-choice b{display:block;font-size:13px}
.p32-choice small{display:block;color:#d4f4dc;font-size:10px;margin-top:3px}
.p32-dialog .p32-close{width:100%;min-height:45px;margin-top:15px;background:#e0e9de;color:#2a573a;border:0;border-radius:11px;font-weight:900;font-size:13px}
.p32-answer{background:#dfebdc;padding:12px;border-radius:13px;font-size:12px;line-height:1.5;color:#2d4c33;margin:14px 0}
.p32-answer b{font-size:12px}.p32-answer p{font-size:13px;margin:5px 0 10px}
@media(max-width:375px){.p32-avatar{width:88px;min-width:82px;min-height:115px}.p32-avatar img{width:85px;height:99px}.p32-companion{padding:8px;gap:8px}.p32-inner h3{font-size:16px!important}.p32-tabs button{font-size:11px}.p32-moments img{width:48px;height:49px}.p32-moments button{min-height:136px;padding:7px 4px}.p32-home img{width:72px;height:80px;flex-basis:72px}.p32-home{padding:10px}}
@media(prefers-reduced-motion:reduce){.p32-avatar img,.p32-content,.p32-zone *,body>.p32-shade *{animation:none!important;transition:none!important}}

.p32-identity{margin:12px 0;padding:11px;border-radius:15px;background:#ffffff10;border:1px solid #ffffff3b}
.p32-identity label{display:block;font-size:12px;font-weight:900;margin-bottom:7px;color:#f9e7b5}
.p32-identity>div{display:flex;gap:7px}
.p32-identity input{flex:1;min-width:0;font:inherit;font-size:14px;min-height:43px;border:1px solid #bfd4b8;border-radius:11px;padding:8px;color:#254a34;background:#fffef1}
.p32-identity button{min-width:94px;border:0;border-radius:11px;color:#214b34;background:#f4dda4;padding:7px 8px;font-size:11px;font-weight:900}
.p32-identity small{display:block;margin-top:5px;font-size:10px;color:#d7eadb}
.p32-badges{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.p32-badges>div{background:#ffffff16;border:1px solid #ffffff40;border-radius:12px;padding:9px;opacity:.55;min-width:0}
.p32-badges>div.earned{background:#fff3d5;color:#2c583c;border-color:#e8ce82;opacity:1}
.p32-badges b{display:block;font-size:11px;line-height:1.2}
.p32-badges small{font-size:10px}