@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--ink:#263e31;--muted:#758074;--paper:#f8f9f3;--line:#dfe4d8;--lime:#c6f27b;--green:#38593f}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif;font-size:16px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}button:focus-visible,a:focus-visible{outline:3px solid #5e9031;outline-offset:4px}button:hover{filter:brightness(.97)}button:disabled{cursor:default;opacity:.65}header{height:88px;padding:0 5%;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;font-size:25px;font-weight:700;letter-spacing:-1px}.brand-icon{background:var(--lime);border:1.5px solid var(--ink);width:39px;height:39px;border-radius:13px 13px 16px 7px;text-align:center;font-size:30px;line-height:33px}.badge{font-size:11px;letter-spacing:1px;border:1px solid #b9c5ae;padding:4px 6px;border-radius:5px;margin-left:3px}.head-right{display:flex;gap:15px;align-items:center}.domain{font-size:13px;color:var(--muted);margin-right:12px}.round{border:1px solid var(--line);border-radius:50%;background:transparent;width:33px;height:33px;font-weight:600}main{max-width:1500px;margin:auto;padding:39px 5% 0}.page-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:34px}.eyebrow{font-size:11px;letter-spacing:2px;font-weight:700;color:#708165}h1,h2,h3,p{margin:0}h1{font-family:'Space Grotesk',sans-serif;font-size:43px;letter-spacing:-2px;font-weight:600;line-height:1.25;margin:9px 0}p{color:var(--muted);font-size:14px;line-height:1.6}.day{display:flex;gap:13px;align-items:center}.sun{font-size:32px;color:#8a9a48}.day strong{font-size:14px;display:block}.day div>span{display:block;font-size:12px;color:var(--muted);margin-top:5px}.dashboard{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px}.habitat-section{min-width:0}.section-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.habitat-title{display:flex;gap:9px;align-items:center}h2{font-family:'Space Grotesk',sans-serif;font-size:19px;letter-spacing:-.5px}.live-dot{width:7px;height:7px;background:#80a745;border-radius:100%}.small-tag{font-size:9px;letter-spacing:1.3px;color:#7e8d72;margin-left:8px}.text-button{background:none;border:0;font-size:12px}.habitat{position:relative;height:430px;background-color:#edf2e4;background-image:radial-gradient(#cbd5bf .8px,transparent .8px);background-size:16px 16px;border:1px solid #ced8c1;border-radius:18px;overflow:hidden}.zone{position:absolute;font-size:9px;letter-spacing:1.4px;color:#889677;background:#edf2e4;padding:6px 9px;border:1px solid #dce4d2;border-radius:5px}.zone-a{left:6%;top:18px}.zone-b{right:7%;top:18px}.zone-c{left:5%;bottom:61px}.zone-d{right:7%;bottom:61px}.habitat-center{position:absolute;left:50%;top:49%;transform:translate(-50%,-50%) rotate(-6deg);text-align:center;color:#a9b598;width:180px;pointer-events:none}.habitat-center>span{font-size:29px}.habitat-center strong{display:block;font-family:'Space Grotesk';font-size:18px;letter-spacing:-1px}.habitat-center small{display:block;font-size:8px;margin-top:4px}.habitat-footer{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-between;padding:14px 18px;background:#e5ecd9;border-top:1px solid #d3dec7;font-size:11px;color:#758469}.slime{position:absolute;left:var(--x);top:var(--y);width:110px;height:120px;transform:translate(-50%,-50%);border:0;background:transparent;padding:0;transition:left 2s ease,top 2s ease;z-index:2}.sprite{display:block;width:100%;height:100%;background-image:url('slimes.png');background-size:400% 200%;background-position:var(--sx) var(--sy);background-repeat:no-repeat}.slime .sprite{height:96px;animation:bob 3s ease-in-out infinite;animation-delay:var(--delay);filter:drop-shadow(0 9px 4px #52683716)}.slime:hover .sprite{animation:squish .5s infinite alternate}.name-tag{display:inline-block;font-size:10px;line-height:1.1;background:#ffffffbd;border:1px solid #ffffffd0;padding:4px 8px;border-radius:20px;white-space:nowrap}.slime.selected .name-tag{background:var(--ink);color:white;border-color:var(--ink)}.bubble{position:absolute;bottom:110px;left:50%;transform:translateX(-50%);font-size:11px;background:white;border:1px solid var(--line);padding:8px 11px;border-radius:12px;white-space:nowrap;box-shadow:0 4px 12px #0001;z-index:5}.team-action{display:flex;align-items:center;gap:13px;padding:18px 1px}.action-icon{background:#eaf0de;border-radius:12px;padding:8px 12px;font-size:24px}.team-action strong{font-size:13px}.team-action p{font-size:12px}.team-action button{margin-left:auto;font-size:12px;border:1px solid #cdd6bf;border-radius:9px;padding:11px 15px;background:transparent}.team-action button span{margin-left:15px}.mission{border:1px solid #ced9bb;border-radius:12px;background:#eef3e3;padding:18px 20px;display:flex;align-items:center;justify-content:space-between;gap:14px;position:relative;overflow:hidden}.mission .eyebrow{font-size:9px;letter-spacing:1.5px}.mission h3{font-size:17px;margin:5px 0}.mission p{font-size:12px}.mission button{background:var(--ink);border:0;color:white;padding:12px 16px;border-radius:9px;font-size:12px;white-space:nowrap}.quest-track{position:absolute;bottom:0;left:0;right:0;height:4px}.quest-track div{height:100%;background:#90be4b;width:0;transition:width .5s}.profile{background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px;align-self:stretch}.profile-top{display:flex;justify-content:space-between;font-size:10px;letter-spacing:1.3px;color:#86917b}.profile-level{background:#f0f4e9;padding:4px 7px;border-radius:4px;color:#667b4c;letter-spacing:0}.portrait{height:154px;width:170px;margin:5px auto 0}.profile-name{text-align:center}.profile-name h2{font-size:25px;letter-spacing:-1px}.profile-name p{font-size:12px;margin:5px 0 10px}.trait{display:inline-block;font-size:10px;background:#e9f3da;color:#627b41;padding:5px 9px;border-radius:5px}.bio{font-size:12px;text-align:center;margin:14px 0 17px;line-height:1.6;min-height:57px}.stat{margin-top:13px}.stat-line{display:flex;justify-content:space-between;font-size:11px;margin-bottom:6px}.bar{height:6px;background:#eef1e9;border-radius:10px;overflow:hidden}.bar span{display:block;height:100%;border-radius:10px;transition:width .4s}.care{display:flex;gap:7px;margin-top:20px}.care button{flex:1;background:#f7f9f2;border:1px solid #e1e7d8;border-radius:9px;font-size:11px;padding:9px 2px}.care button span{display:block;font-size:19px;margin-bottom:5px}.profile-quote{margin-top:18px;border-top:1px dashed var(--line);padding-top:14px;color:#88927e;text-align:center;font-size:11px;font-style:italic}.crew-section{margin:34px 0}.crew-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:19px}.crew-heading h2{font-size:22px;margin-top:7px}.crew-heading>span{font-size:10px;letter-spacing:1px;color:#7b8774}.crew{display:grid;grid-template-columns:repeat(8,1fr);gap:10px}.crew-card{min-width:0;border:1px solid var(--line);border-radius:11px;padding:12px 5px;background:#fff;text-align:center;transition:transform .2s}.crew-card:hover{transform:translateY(-4px)}.crew-card.selected{border:1.5px solid #809a59;background:#f0f6e6}.crew-card .sprite{width:84px;height:80px;margin:auto}.crew-card strong{display:block;font-size:11px;margin:5px 0}.crew-card small{display:block;font-size:10px;color:#839076}.crew-card .mood{font-size:9px;margin-top:10px;display:block;color:#738661}footer{border-top:1px solid var(--line);padding:22px 0 28px;display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#8a9483}.footer-brand{font-size:17px;font-weight:700;letter-spacing:-.7px;color:#6c7e5f}.footer-brand span{font-size:8px;margin-left:4px}#toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,20px);background:var(--ink);color:white;border-radius:12px;padding:13px 22px;font-size:14px;opacity:0;pointer-events:none;transition:.2s;z-index:30;max-width:90vw;text-align:center}#toast.show{opacity:1;transform:translate(-50%,0)}dialog{border:1px solid var(--line);border-radius:20px;padding:32px;max-width:440px;color:var(--ink);background:var(--paper)}dialog::backdrop{background:#22352755;backdrop-filter:blur(4px)}dialog h2{font-size:25px;margin:15px 0}dialog p{margin-bottom:15px}.close{position:absolute;right:12px;top:10px;background:none;border:0;font-size:25px}.primary{border:0;background:var(--ink);color:white;padding:12px 20px;border-radius:8px}.paused .sprite{animation-play-state:paused!important}@keyframes bob{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-7px) rotate(2deg)}}@keyframes squish{from{transform:scale(1.05,.94)}to{transform:scale(.95,1.06) translateY(-7px)}}
@media(min-width:1500px){.habitat{height:470px}}@media(max-width:1100px){main{padding:30px 3% 0}.dashboard{grid-template-columns:minmax(0,1fr) 265px;gap:16px}.crew{grid-template-columns:repeat(4,1fr)}.slime{width:95px}.day{display:none}.small-tag{display:none}.profile{padding:16px}.habitat-center{width:120px}.habitat-center strong{font-size:14px}.habitat-center small{display:none}}@media(max-width:750px){header{height:70px;padding:0 5%}.domain{display:none}main{padding:26px 5% 0}h1{font-size:35px}.page-title{margin-bottom:25px}.dashboard{display:flex;flex-direction:column}.habitat{height:460px}.profile{display:grid;grid-template-columns:120px 1fr;gap:0 18px;padding:20px}.profile-top{grid-column:1/-1}.portrait{width:120px;height:115px;margin:0;grid-row:2/4}.profile-name{text-align:left;padding-top:15px}.profile-name h2{font-size:21px}.bio{text-align:left;grid-column:1/-1;min-height:0;margin:12px 0}.stats{grid-column:1/-1}.care,.profile-quote{grid-column:1/-1}.crew-heading{align-items:start}.crew-heading h2{font-size:19px;max-width:240px}.crew-heading>span{display:none}.crew{gap:8px}.crew-card .sprite{width:70px;height:70px}.crew-card strong{font-size:10px}.crew-card small{font-size:9px}.mission{flex-wrap:wrap}.mission button{margin-left:auto}.zone{font-size:8px}.slime{width:90px}.slime .sprite{height:91px}.name-tag{font-size:9px}.team-action{gap:8px}.team-action strong{font-size:12px}.team-action p{font-size:11px}.team-action button{padding:10px;font-size:11px}.team-action button span{display:none}.habitat-footer{font-size:9px;padding:13px 10px}footer{gap:15px;flex-wrap:wrap}footer>span:last-child{display:none}.eyebrow{font-size:10px}.head-right{gap:8px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}
/* Readable controls at every viewport size. */
p{font-size:16px}.eyebrow,.small-tag,.profile-top,.profile-level,.trait,.crew-heading>span,.zone,.habitat-footer,.profile-quote,.crew-card .mood,.crew-card small,.mission .eyebrow,footer{font-size:12px}.text-button,.name-tag,.team-action strong,.team-action p,.team-action button,.mission p,.mission button,.profile-name p,.bio,.stat-line,.care button,.crew-card strong{font-size:14px}.bio{line-height:1.6}.crew-card{padding:12px 5px}.profile-name h2{font-size:25px}.portrait{height:150px}.habitat-center small{font-size:10px}.zone{font-size:10px}.habitat-footer{font-size:12px}.team-action button span{display:none}.mission{min-height:120px}.crew-card strong{min-height:34px}.crew-card small{margin-top:2px}.name-tag{font-size:12px}.slime{width:115px}.slime .sprite{width:96px;margin:auto}.profile{padding:20px}.care button{padding:10px 2px}.profile-quote{line-height:1.5}@media(max-width:1100px){.crew{grid-template-columns:repeat(4,1fr)}}@media(max-width:750px){.slime{width:100px}.slime .sprite{width:84px}.name-tag{font-size:11px}.crew{grid-template-columns:repeat(2,1fr)}.crew-card strong{min-height:0}.profile{grid-template-columns:110px 1fr}.portrait{width:110px;height:110px}.team-action .action-icon{display:none}.team-action strong,.team-action p,.team-action button{font-size:13px}.habitat-footer{font-size:10px}.mission button{margin-left:0}.crew-heading h2{max-width:none}}
