:root{color-scheme:light;font-family:ui-rounded,'Trebuchet MS',system-ui,sans-serif;color:#293f31;background:#f8f5e9;--green:#264d3d;--gold:#f0c66c}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 0 0,#e8eed9,transparent 60%),#f8f5e9}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;font-weight:700;cursor:pointer;color:inherit;border:1px solid #bac9ae;background:#fffdf5;border-radius:18px;min-height:64px;min-width:64px;padding:10px 16px;touch-action:manipulation}button:hover:not(:disabled){filter:brightness(1.04)}button:active:not(:disabled){transform:scale(.97)}button:disabled{cursor:default;opacity:.52}button:focus-visible,a:focus-visible{outline:4px solid #c77827;outline-offset:3px}[hidden]{display:none!important}
.topbar{max-width:1152px;margin:auto;padding:18px 170px 18px 24px;position:relative}.back{color:#47664b;font-weight:700;font-size:14px;text-decoration:none;display:inline-flex;align-items:center;min-height:44px}h1{font-family:Georgia,serif;font-size:clamp(30px,5vw,44px);letter-spacing:-1.6px;margin:4px 0 14px;line-height:1.1}h1 span{display:block;font:14px/1.4 'Trebuchet MS',sans-serif;letter-spacing:0;margin-top:8px;color:#5b705c}.balance{font-size:14px;display:flex;align-items:center;gap:6px}.balance strong{font-size:24px;max-width:140px;overflow:hidden;text-overflow:ellipsis}.balance>span{font-size:26px}main{max-width:1152px;margin:auto;padding:0 24px 200px}.workspace{display:grid;grid-template-columns:1fr 1fr;gap:24px}.collection,.nursery,.egg-shop{background:#fffdf5;border:1px solid #d8dfca;border-radius:26px;padding:20px;box-shadow:0 8px 20px #25403206}.section-top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:16px}.eyebrow{font-size:10px;font-weight:800;letter-spacing:1.6px;color:#6d815e}h2{font-family:Georgia,serif;font-size:25px;letter-spacing:-.6px;font-weight:500;margin:4px 0}.quiet{font-size:13px;padding:8px;white-space:nowrap}.stage{position:relative;overflow:hidden;border-radius:20px;background:linear-gradient(#dcece0 0%,#e8f0c9 72%,#b9d39a 72%);min-height:278px;padding:22px 12px 14px;border:1px solid #cfddbc}.stage-title{position:relative;z-index:1;text-align:center;font-family:Georgia,serif;font-size:18px}.cloud{position:absolute;color:#ffffffa8;font-size:85px;line-height:1}.cloud-one{top:4px;left:-20px}.cloud-two{top:24px;right:-22px;font-size:65px}.showcase{position:relative;display:flex;justify-content:center;flex-wrap:wrap;gap:10px;max-width:280px;margin:24px auto 10px}.spot{width:72px;height:82px;border:2px dashed #88a271;background:#ffffff55;padding:4px;border-radius:22px;position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:0;font-size:12px}.spot.empty{font-size:28px;color:#7c9469}.spot svg{width:58px;height:58px}.spot .level{font-size:10px}.spot.filled{border-style:solid;background:#fffcf0}.flowers{text-align:center;font-size:23px;color:#f7f6ca;letter-spacing:5px}.post-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:14px 0 6px}.post-row>span{font-weight:700;font-size:14px}.post{background:var(--green);color:#fff;min-width:185px;border:none}.visitor-note,.controls-note,.egg-shop p,.save-status{font-size:12px;color:#66735e;line-height:1.6}.visitor-note{margin:10px 0 0}.pet-total{border:1px solid #d8dfca;background:#f4f5e8;border-radius:30px;padding:9px 12px;font-size:12px;white-space:nowrap}.hint{font-size:13px;line-height:1.6;min-height:54px;margin-bottom:12px;border-radius:14px;background:#f0f3e5;padding:10px 14px}.inventory{display:grid;grid-template-columns:repeat(auto-fill,minmax(78px,1fr));gap:9px;max-height:395px;overflow:auto;padding:5px 5px 12px}.pet{position:relative;min-width:0;min-height:112px;padding:7px 4px;display:flex;align-items:center;flex-direction:column;justify-content:center;gap:2px;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;background:#faf8ee;border:2px solid transparent;border-bottom-color:#dbe3cd}.pet svg{width:72px;height:72px;pointer-events:none}.pet .name{font-size:12px}.level{font-size:11px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pet.selected{border-color:#2f7455;box-shadow:0 0 0 3px #2f745533;background:#e9f4df}.pet.match{border-style:dashed;border-color:#b89543}.pet.staged:after{content:'✓';position:absolute;top:4px;right:6px;color:#2f7455;font-size:15px}.tap-dots{display:flex;gap:4px;height:9px;margin-top:3px}.tap-dots i{width:6px;height:6px;border:1px solid #bfa783;border-radius:50%}.tap-dots i.filled{background:#be7947}.empty-meadow{text-align:center;grid-column:1/-1;border:2px dashed #d1dbc4;border-radius:20px;padding:28px 16px;font-size:14px;color:#6d7d62}.empty-meadow .big{display:block;font-size:48px;margin-bottom:10px}.egg-shop{margin-top:24px;display:flex;align-items:center;justify-content:space-between;gap:20px}.egg-shop p{margin:6px 0 0}.families{display:flex;gap:9px}.family{display:flex;align-items:center;gap:8px;padding:8px 12px;text-align:left;min-width:94px}.family[aria-pressed=true]{background:#e8efdc;border:2px solid #537d49}.family small{font-size:11px;display:block}.family .emoji{font-size:24px}.action-dock{position:fixed;z-index:110;bottom:84px;left:50%;transform:translateX(-50%);display:flex;gap:14px;width:min(650px,calc(100% - 32px));padding:10px;border:1px solid #d5dcc8;border-radius:24px;background:#fffdf4ed;box-shadow:0 8px 34px #29413324;backdrop-filter:blur(10px)}.action-dock button{flex:1;font-size:15px;padding:12px 6px;min-height:64px}.buy{background:var(--gold);border-color:#d5ad57}.add{background:var(--green);color:white;border-color:var(--green)}.done{display:inline-flex;align-items:center;justify-content:center;min-height:64px;border-radius:18px;padding:12px 20px;border:1px solid #bac9ae;color:var(--green);font-weight:700;text-decoration:none;background:#fffdf5;font-size:14px}.save-status{margin:18px 0 4px;min-height:24px}.save-status.error{color:#9b3823;font-weight:700}.visitor-reaction{margin-top:12px;padding:12px;border-radius:15px;background:#f3eccd;font-size:14px}.guest{padding:20px;background:#f2e7c5;border-radius:22px;margin-bottom:20px}.guest .guest-pets{display:flex;gap:6px}.guest svg{width:60px}.guest h2{font-size:23px}.guest p{font-size:13px}dialog{width:min(620px,calc(100% - 24px));max-height:80dvh;border:1px solid #d2dbc6;border-radius:26px;background:#fffdf5;color:#293f31;padding:22px}dialog::backdrop{background:#183b31a6}dialog p{font-size:14px;line-height:1.6}.album-post{padding:14px;background:#f1f3e4;border-radius:20px;margin-top:12px}.album-pets{display:flex;gap:4px}.album-pets>div{width:20%;text-align:center;font-size:11px}.album-pets svg{width:100%}.album-post button{margin-top:10px;width:100%}.share-link{width:100%;padding:12px;border:1px solid #64845c;font:12px monospace;min-height:44px;display:block;margin-top:8px}.drag-ghost{position:fixed;pointer-events:none;z-index:100060;width:90px;height:90px;filter:drop-shadow(0 8px 6px #183b3166);transform:translate(-50%,-50%)}footer{text-align:center;font:10px monospace;color:#6e7e65;position:fixed;bottom:2px;left:0;right:0;pointer-events:none;z-index:10}.arcade-shop-link{top:16px!important;right:12px!important;max-width:145px!important;font-size:12px!important;min-height:44px!important}.arcade-reward-badge{top:70px!important;bottom:auto!important;left:auto!important;right:12px!important;max-width:130px!important;font-size:11px!important}.arcade-token-notice{top:130px!important}.burst{animation:pop .4s ease-out}@keyframes pop{50%{transform:scale(1.12) rotate(-4deg)}}
@media(max-width:900px){.egg-shop{display:block}.families{margin-top:14px;display:grid;grid-template-columns:repeat(4,1fr)}.family{min-width:0;padding:8px;justify-content:center}.family .emoji{font-size:20px}}
@media(max-width:650px){.topbar{padding:12px 140px 20px 18px}h1{font-size:33px}h1 span{font-size:12px;min-width:190px}main{padding:0 16px 200px}.workspace{grid-template-columns:1fr;gap:16px}.collection,.nursery,.egg-shop{padding:16px;border-radius:23px}.stage{min-height:268px}.section-top{margin-bottom:12px}h2{font-size:24px}.inventory{max-height:440px;grid-template-columns:repeat(3,1fr)}.pet{min-height:122px}.pet svg{width:78px;height:78px}.families{grid-template-columns:repeat(2,1fr)}.family{justify-content:flex-start}.action-dock{gap:8px;width:calc(100% - 20px);bottom:84px;padding:7px}.action-dock button{font-size:13px}.post{min-width:175px}.balance{min-width:190px}.controls-note{margin-bottom:0}}
@media(max-height:500px) and (min-width:651px){.topbar{padding-top:6px;padding-bottom:12px}h1{font-size:30px;margin-bottom:6px}h1 span{display:none}.workspace{grid-template-columns:1fr 1fr;gap:14px}.collection,.nursery{padding:14px}.stage{min-height:250px}.inventory{max-height:305px}.action-dock{left:16px;transform:none;width:calc(100% - 32px);bottom:76px;max-width:620px}.topbar .back{min-height:44px}.balance{position:absolute;top:12px;left:48%;font-size:12px}.balance strong{font-size:22px}.section-top h2{font-size:22px}.pet-total{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;scroll-behavior:auto!important}}

/* Keep the extra coat label inside the existing thumb-sized animal tile. */
.pet{min-height:132px}.pet svg{width:86px;height:86px;overflow:visible}.spot svg{width:66px;height:66px;overflow:visible}.coat-name{display:flex;align-items:center;gap:4px;font-size:10px;max-width:100%;white-space:nowrap}.coat-name i{display:inline-block;width:9px;height:9px;flex:none;border-radius:50%;border:1px solid #0003}.color-trail{display:flex;gap:5px;flex-wrap:wrap;font-size:11px;line-height:1.7;color:#6b735e;margin:12px 0 4px}.color-trail span{display:inline-flex;align-items:center;gap:3px}.color-trail span:before{content:"";width:9px;height:9px;background:var(--coat);border:1px solid #0002;border-radius:50%;flex:none}

.studio-link{display:inline-flex;align-items:center;min-height:64px;padding:8px 14px;border:1px solid #bac9ae;border-radius:16px;color:#264d3d;text-decoration:none;font-weight:700;font-size:13px;margin-top:8px}

.walk-entry{margin-top:14px;padding:12px;border:1px dashed #b9cda4;border-radius:18px;background:#f3f6e8}.walk-entry p{font-size:13px;line-height:1.5;margin:0 0 8px;color:#5c7350}.walk-entry .done{display:flex;text-align:center;width:100%;font-size:13px}