
:root{--ink:#303b2f;--paper:#f6f3e9;--green:#dce5ca;--line:#d8d9ca;--muted:#79816f;--orange:#d77a51}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit}button:disabled{cursor:wait;opacity:.5}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #d77a51;outline-offset:4px}header{max-width:1360px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:30px 5%;border-bottom:1px solid var(--line)}.brand{text-decoration:none;color:var(--ink);font-size:34px;font-weight:900;letter-spacing:-2px}.brand span{color:#73875c}.brand i{font-style:normal;color:var(--orange);font-size:26px;margin-left:4px}nav{display:flex;gap:28px}.nav{border:0;background:none;font-size:13px;padding:10px 0;color:var(--muted)}.nav.active{color:var(--ink);border-bottom:2px solid var(--ink)}.account{background:transparent;border:1px solid #aab09c;border-radius:30px;padding:10px 18px;font-size:12px}main{max-width:1200px;padding:46px 30px 20px;margin:auto}.intro{display:flex;justify-content:space-between;align-items:center;margin-bottom:34px}.eyebrow{font:10px monospace;letter-spacing:2px;color:#79866a}h1{font-size:38px;letter-spacing:-1.5px;margin:12px 0}h1 span{font-size:25px;color:var(--orange);display:inline-block;transform:rotate(-15deg);margin-left:18px}p{color:var(--muted);font-size:14px;line-height:1.7;margin:6px 0}.date{font:11px monospace;color:var(--muted)}.grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:24px}.room-card{background:#e8ecdc;border:1px solid #c9d1bb;border-radius:18px;overflow:hidden}.room-top{display:flex;justify-content:space-between;align-items:center;padding:22px 26px}.label{font:10px monospace;letter-spacing:1.5px;color:#758269}.saved{font-size:11px;color:#69785b}.room{height:340px;position:relative;overflow:hidden;background:linear-gradient(#e0e7cf 0 73%,#c8d2b4 73% 74%,#d5dec5 74%);image-rendering:pixelated}.room.night{filter:brightness(.65)}.window{position:absolute;left:15%;top:40px;width:94px;height:105px;border:7px solid #b1bfa0;background:linear-gradient(#c2d6ce 65%,#a7c49c 65%);box-shadow:0 7px 0 #c1ccb1}.window:before{content:'';position:absolute;left:50%;height:100%;width:5px;background:#b1bfa0}.window:after{content:'';position:absolute;top:48%;width:100%;height:5px;background:#b1bfa0}.sun{width:22px;height:22px;background:#f5e4a6;position:absolute;top:12px;left:12px}.shelf{position:absolute;right:13%;top:70px;width:80px;border-bottom:8px solid #adba99;height:45px}.plant{position:absolute;left:16px;bottom:0;width:24px;height:25px;background:#bf9671}.plant:before{content:'✦';font-size:55px;position:absolute;bottom:14px;left:-8px;color:#819868}.frame{position:absolute;right:8px;top:-7px;border:4px solid #a4b390;padding:3px;font-size:16px}.rug{width:230px;height:35px;background:#afbf99;border-radius:50%;position:absolute;bottom:32px;left:50%;transform:translateX(-50%)}canvas{image-rendering:pixelated;width:190px;height:190px;position:absolute;left:50%;bottom:44px;transform:translateX(-50%);animation:bob 2.8s ease-in-out infinite}.bubble{position:absolute;left:50%;top:27px;transform:translateX(-15%);background:#fffdf1;border:1px solid #bdc7ac;border-radius:12px 12px 12px 0;padding:12px 17px;font-size:12px;white-space:nowrap;z-index:1}.room-sign{position:absolute;bottom:12px;left:20px;font:9px monospace;letter-spacing:2px;color:#849273}.poop{position:absolute;bottom:45px;right:22%;font-size:25px}.pet-info{padding:22px 26px;display:flex;justify-content:space-between;align-items:center;background:#f0f1e6}.pet-info h2{font-size:24px;letter-spacing:-.6px;margin:0 0 6px}.pill{display:inline-block;background:#dde5cd;border-radius:20px;padding:6px 10px;font:10px monospace}.pet-info p{font-size:12px}.heart{font-size:27px;color:#d28a70}.actions{margin-top:20px}.section-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:13px}.section-head h3{font-size:14px;margin:0}.section-head small{font-size:10px;color:var(--muted)}.action-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:9px}.action{border:1px solid var(--line);border-radius:12px;background:#fbf9f0;min-height:84px;font-size:11px;transition:transform .15s,background .15s}.action:hover{background:#e4eacf;transform:translateY(-3px)}.action b{display:block;font-size:24px;margin-bottom:8px;font-weight:400}.panel{border:1px solid var(--line);border-radius:15px;background:#fbf9f1;padding:23px;margin-bottom:18px}.panel h3{font-size:16px;margin:0 0 20px;letter-spacing:-.3px}.status-line{display:flex;justify-content:space-between;margin-bottom:9px;font-size:12px}.status-line span:last-child{font:11px monospace;color:var(--muted)}.bar{height:7px;background:#e9e8db;border-radius:8px;overflow:hidden;margin-bottom:20px}.bar i{display:block;height:100%;background:#93a777;border-radius:8px}.bar.mood i{background:#d7ae69}.bar.energy i{background:#a5b8bd}.bar.hygiene i{background:#acaaa5}.health-tag{border-top:1px dashed var(--line);padding-top:14px;display:flex;justify-content:space-between;font-size:11px}.health-tag b{font-weight:400;color:#73865d}.tip{background:#ece9da;border-color:#e1ddc9}.tip h3{font-size:13px;margin-bottom:10px}.tip p{font-size:12px;line-height:1.8}.timeline{display:flex;justify-content:space-between;margin:22px 0 8px}.timeline span{font-size:10px;color:#939b88;text-align:center}.timeline span b{display:block;font-size:20px;margin-bottom:10px}.timeline .current{color:#556a40}.next{font:10px monospace;color:#879378;margin-top:16px}.bottom-note{border-top:1px solid var(--line);margin-top:40px;padding-top:22px;display:flex;justify-content:space-between;color:#949887;font-size:11px}.bottom-note span:last-child{font:9px monospace;letter-spacing:1px}.welcome{display:grid;grid-template-columns:1.2fr 1fr;min-height:410px;border:1px solid var(--line);border-radius:18px;overflow:hidden}.welcome-art{position:relative;background:#dce5ca;min-height:330px}.welcome-art canvas{width:240px;height:240px;bottom:55px}.welcome-copy{padding:48px 38px;background:#fbf9f1}.welcome-copy h2{font-size:32px;letter-spacing:-1px;margin:12px 0 18px}.primary{background:#3c5037;border:0;color:#fffdf2;border-radius:9px;padding:14px 20px;font-size:13px;margin-top:18px}.secondary{border:1px solid #b9c3aa;background:transparent;border-radius:9px;padding:12px 17px;font-size:12px;margin:12px 0}input{width:100%;border:1px solid #bcc5af;border-radius:8px;background:#fffef8;padding:14px;color:var(--ink);margin:8px 0}label{display:block;font-size:12px;margin-top:20px}.fine{font-size:11px}.journal{max-width:800px;background:#fbf9f1;border:1px solid var(--line);padding:30px;border-radius:15px}.entry{padding:18px 0;border-bottom:1px solid var(--line);font-size:14px}.entry time{font:10px monospace;color:#879078;display:block;margin-bottom:7px}dialog{border:1px solid #c5cdb8;background:var(--paper);border-radius:16px;padding:36px;max-width:440px;width:calc(100% - 32px);color:var(--ink)}dialog::backdrop{background:#27332280;backdrop-filter:blur(4px)}.close{position:absolute;right:13px;top:10px;background:none;border:0;font-size:25px}.game{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:22px}.game button{height:70px;border:1px solid #c3ceb0;background:#dde5cb;border-radius:8px;font-size:24px}.game button.target{background:#f1d69a}#toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);padding:15px 22px;border-radius:12px;background:#34482f;color:white;max-width:90%;font-size:13px;box-shadow:0 5px 25px #25322222;display:none;z-index:5}.error{color:#ae553e}.demo-tag{font:10px monospace;color:#a66a49;margin-bottom:14px}@keyframes bob{50%{margin-bottom:7px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}@media(max-width:850px){.grid{grid-template-columns:1fr 270px;gap:16px}nav{gap:15px}.action-grid{grid-template-columns:repeat(3,1fr)}main{padding:30px 20px}.date{display:none}h1{font-size:32px}}@media(max-width:650px){header{padding:20px;flex-wrap:wrap;gap:18px}.brand{font-size:30px}nav{order:3;width:100%;justify-content:space-between}.grid{grid-template-columns:1fr}.intro{margin-bottom:25px}h1{font-size:30px}h1 span{margin-left:8px}.room{height:320px}.panel{margin-top:0}.action-grid{grid-template-columns:repeat(3,1fr)}.bottom-note span:last-child{display:none}.welcome{grid-template-columns:1fr}.welcome-art{min-height:260px}.welcome-art canvas{bottom:18px;width:210px;height:210px}.welcome-copy{padding:28px}.bubble{font-size:11px}.grid aside{display:grid;grid-template-columns:1fr;gap:0}.date{display:none}}

