*{box-sizing:border-box}body{margin:0;background:#f6f5f0;color:#263a32;font:14px system-ui,sans-serif}button,a,input{font:inherit}button{cursor:pointer;border:1px solid #d5dbd1;background:transparent;color:inherit;border-radius:9px;padding:10px 15px}button:hover{background:#e8eddf}button:focus-visible{outline:3px solid #9cb469}header{min-height:92px;padding:20px 4%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dddfd4;gap:15px}header a{color:inherit;text-decoration:none;font-size:23px;font-weight:600;letter-spacing:-1px}small{font:10px monospace;margin-left:15px;color:#879183}nav{display:flex;gap:10px}.primary{background:#2c4739;color:#fff}.primary:hover{background:#45624e}main{max-width:1500px;margin:auto;padding:43px 4% 20px}.heading{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:32px}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:700;color:#7b897c}h1{font-size:clamp(28px,3vw,44px);font-weight:500;letter-spacing:-1.8px;margin:12px 0}p{color:#7c877e;line-height:1.6;margin:0}.pill{display:inline-block;font-size:10px;border:1px solid #d8ddcf;border-radius:30px;padding:7px 10px;white-space:nowrap}.layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px}.world{position:relative;min-height:555px;overflow:hidden;border-radius:18px;background:linear-gradient(#e6e9d8 54%,#d5ddc4 54%,#e2e8d4);border:1px solid #d0d9c3}.worldtop,.worldbottom{position:absolute;left:25px;right:25px;display:flex;align-items:center;justify-content:space-between;z-index:2;font-size:10px;letter-spacing:1px}.worldtop{top:20px}.worldtop button{border:0;font-size:11px}.worldbottom{bottom:22px;color:#64775c}.window{position:absolute;top:19%;left:15%;width:130px;height:160px;background:#edf1de;border-radius:80px 80px 0 0;border:9px solid #d7dec7;box-shadow:12px 12px 0 #c5d1b330;overflow:hidden}.window:before,.window:after{content:'';position:absolute;background:#d7dec7}.window:before{height:100%;width:6px;left:50%}.window:after{width:100%;height:6px;top:52%}.sun{width:240px;height:280px;position:absolute;left:30%;top:33%;transform:skew(-30deg);background:linear-gradient(#f8f6db66,transparent)}.rug{position:absolute;width:55%;height:30%;border-radius:50%;background:#bdcba7;left:24%;top:58%;border:12px solid #cbd6b8;box-shadow:0 0 0 2px #b9c8a47a}.plant{position:absolute;right:9%;top:29%;font-size:140px;color:#738d64;line-height:1}.plinth{position:absolute;right:12%;top:49%;width:60px;height:64px;background:#b1b99b;clip-path:polygon(0 0,100% 0,85% 100%,15% 100%)}canvas{position:absolute;inset:0;width:100%;height:100%;z-index:1}aside{background:#fffefa;border:1px solid #e0e3d8;border-radius:18px;padding:25px}h2{font-size:29px;font-weight:500;margin:12px 0}.pettitle{display:flex;align-items:center;justify-content:space-between}aside p{font-size:12px}hr{border:0;border-top:1px solid #e7e9df;margin:22px 0}.label{display:flex;justify-content:space-between;font-size:9px;letter-spacing:1px;font-weight:700}.label span{font-size:10px;font-weight:400;letter-spacing:0;color:#939b8c}.movement{margin:16px auto 24px;text-align:center}.movement button{width:39px;height:34px;padding:0;margin:2px;background:#f3f4ed;box-shadow:0 2px 0 #d6ddcc;touch-action:none}.actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0 21px}.actions button{padding:10px;text-align:left;font-size:11px}.actions kbd{margin-right:7px;color:#8a977f}.active{background:#dbe7c8!important;border-color:#9aaf7b!important}.settings{border-top:1px solid #e7e9df;padding-top:15px}.settings label{display:flex;align-items:center;justify-content:space-between;font-size:11px;margin:12px 0;color:#6c7d69}.settings input[type=range]{width:110px;accent-color:#638054}.settings label:last-of-type{justify-content:start;gap:5px}footer{display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#8b9588;margin-top:20px;gap:20px}footer>span:first-child{letter-spacing:2px}footer button{border:0;font-size:11px}dialog{border:1px solid #d5dbcd;border-radius:20px;background:#fafbf5;color:#263a32;padding:30px;max-width:850px;width:90%;max-height:85vh}dialog::backdrop{background:#1c322a80;backdrop-filter:blur(5px)}#close{float:right}dialog p{margin:14px 0}pre{white-space:pre-wrap;background:#e9eddf;border-radius:10px;padding:20px;font-size:12px}table{width:100%;border-collapse:collapse;font-size:12px}td,th{text-align:left;padding:9px;border-bottom:1px solid #dde2d3}dialog img{width:100%;background:repeating-conic-gradient(#e0e4d9 0 25%,#f7f9f0 0 50%) 0/20px 20px}@media(max-width:850px){.layout{grid-template-columns:1fr}.heading{display:block}.heading .pill{margin-top:15px}header{flex-wrap:wrap}small{display:none}nav button{font-size:11px;padding:8px}main{padding-top:25px}.world{min-height:450px}.actions{grid-template-columns:repeat(3,1fr)}footer>span:first-child{display:none}}
/* Toy box: molded plastic, soft candy colors, tactile controls. */
:root{--ink:#403353;--purple:#8c6cdb;--cream:#fff9ed}body{background-color:var(--cream);background-image:radial-gradient(#e7dac8 1px,transparent 1px);background-size:20px 20px;color:var(--ink);font-family:ui-rounded,'Arial Rounded MT Bold','Trebuchet MS',system-ui,sans-serif}header{margin:20px 3% 0;padding:17px 25px;border:3px solid #fff;border-radius:28px;background:#fffdf7;box-shadow:0 5px 0 #e7ddcd,0 10px 25px #806d4810;min-height:76px}header a{font-size:26px;font-weight:900;letter-spacing:-1.5px;color:#6951a2}header a:before{content:'●';display:inline-grid;place-items:center;width:40px;height:40px;margin-right:10px;border-radius:13px;background:#ffc868;color:#fff8da;text-shadow:0 2px #df9c3f;box-shadow:inset 0 3px #ffe4a5,0 4px #e8aa50;transform:rotate(-10deg)}small{display:none}button{font-weight:700;border:2px solid #e2d9ed;background:#fffdf8;border-radius:14px;box-shadow:0 4px 0 #ddd2e7;transition:transform .16s,box-shadow .16s,background .16s;touch-action:manipulation}button:hover{transform:translateY(-2px);background:#f2ebff;box-shadow:0 6px 0 #d5c8e3}button:active,button.active{transform:translateY(3px);box-shadow:0 1px 0 #baa7cc}.primary{background:#9b7cdb;border-color:#ad8eea;color:white;box-shadow:0 4px #7756b7,inset 0 2px #c5acf1}.primary:hover{background:#a88ae4;box-shadow:0 6px #7756b7}#import{background:#ffe8a7;border-color:#f0d48a;box-shadow:0 4px #ddbd70}main{padding-top:35px}.heading{margin-bottom:28px;align-items:center}.eyebrow{color:#9b7d60;letter-spacing:1.5px;font-weight:900}h1{font-size:clamp(32px,3.5vw,51px);font-weight:900;letter-spacing:-2.2px;color:#51416d;line-height:1.1;margin:11px 0 14px}h1 span{display:inline-block;color:#a17ed4;transform:rotate(-3deg);text-decoration:underline;text-decoration-color:#f6c96b;text-decoration-thickness:6px;text-underline-offset:6px}p{color:#8a7c95}.heading .pill{background:#e5f0d7;border:2px solid white;box-shadow:0 3px #c9d9b7;color:#60744d;font-weight:700;transform:rotate(3deg)}.layout{gap:26px;align-items:stretch}.world{border:8px solid #fffaf0;border-radius:38px;box-shadow:0 8px 0 #d5c5a7,0 15px 25px #6d4f2220;min-height:550px;background:linear-gradient(#c9e6eb 0%,#def0ee 53%,#f4d8aa 53%,#f8e7c7 100%)}.world:before{content:'';position:absolute;top:53%;bottom:0;left:0;right:0;background:repeating-linear-gradient(90deg,transparent 0 89px,#dcb78330 90px 92px),repeating-linear-gradient(0deg,transparent 0 69px,#dcb78330 70px 72px);transform-origin:top;pointer-events:none}.worldtop{top:18px;left:20px;right:20px;color:#547b80;font-weight:900}.worldtop>span{background:#ffffffa8;padding:10px 15px;border-radius:12px;box-shadow:0 3px #a5cbd170;transform:rotate(-2deg)}.worldtop button{border:2px solid #ffffffb0;background:#f6fcf9;box-shadow:0 3px #a5cbd170}.worldbottom{bottom:17px;color:#9d805c;font-weight:700;letter-spacing:.4px}.worldbottom #state{background:#fffaf0;padding:9px 14px;border-radius:20px;box-shadow:0 3px #d9bd9270;color:#8561b3}.window{width:143px;height:166px;top:20%;left:12%;border:11px solid #fff9e4;background:linear-gradient(#92cfe5,#c9e9ec);border-radius:75px 75px 16px 16px;box-shadow:0 6px 0 #9abcc280,inset 0 4px 0 #74b2ca60,12px 15px 0 #92bfc220}.window:before,.window:after{background:#fff9e4;z-index:1}.sun{width:52px;height:52px;border-radius:50%;background:#ffdc83;top:25%;left:16%;transform:none;box-shadow:0 0 0 8px #ffedb84d,inset 0 4px #ffedb5;z-index:0}.rug{width:57%;height:29%;left:22%;top:61%;background:#cbb6e9;border:11px solid #dfcff2;box-shadow:0 5px 0 #bca2d1,0 10px 12px #9b78a320,inset 0 0 0 3px #bca2d1;transform:rotate(-5deg)}.plant{right:9%;top:28%;color:#f18da1;font-size:115px;text-shadow:0 5px #cc6c90;transform:rotate(10deg)}.plinth{right:11%;top:45%;width:67px;height:74px;background:linear-gradient(90deg,#e4ac62,#f6c97f 35%,#f6c97f 70%,#dfac67);clip-path:none;border-radius:8px 8px 22px 22px;border-top:7px solid #ffdaa0;box-shadow:0 5px #c6945a50}.toy-block{position:absolute;z-index:0;display:grid;place-items:center;font-weight:900;font-size:25px;border-radius:13px;width:56px;height:56px;box-shadow:inset 0 4px #ffffff70,4px 6px 0 #00000015;pointer-events:none}.block-a{left:8%;bottom:17%;background:#f2a8a0;color:#b96970;transform:rotate(-12deg);border:3px solid #ffc7bb}.block-b{left:13%;bottom:11%;background:#a8d5bb;color:#5e9878;transform:rotate(9deg);border:3px solid #c7ead2}.toy-ball{position:absolute;right:8%;bottom:15%;width:58px;height:58px;border-radius:50%;background:conic-gradient(from 30deg,#ffd675 0 33%,#a2c7e4 33% 66%,#f4a4ad 66%);box-shadow:inset -6px -7px 0 #0000000c,inset 4px 5px 0 #ffffff50,3px 8px 0 #b9905a30}.wall-star{position:absolute;left:49%;top:17%;font-size:54px;color:#ffdc7e;text-shadow:0 4px #e3b763;transform:rotate(12deg)}aside{border:4px solid #fff;border-radius:30px;background:#fffdf8;box-shadow:0 7px #e2d6c5,0 12px 25px #6d4f2210;padding:23px}.pettitle h2{font-weight:900;color:#68518b;font-size:32px}.pettitle .pill{background:#eee5fa;border:0;color:#9271b2;font-weight:700}hr{border-top:2px dashed #eee3d7}.label{font-weight:900;color:#9075a7}.label span{color:#a69bb0}.movement button{background:#fff3cf;border:2px solid #eed69d;box-shadow:0 4px #d9bb7d,inset 0 2px #fffaf0;border-radius:11px;color:#9c7c47;width:42px;height:35px;font-weight:900}.actions{gap:10px}.actions button{min-height:43px;border-radius:12px;border-width:2px;font-size:11px}.actions button:nth-child(1),.actions button:nth-child(4){background:#ffe3db;border-color:#f3c8bd;box-shadow:0 4px #dda99e;color:#a56665}.actions button:nth-child(2),.actions button:nth-child(5){background:#e8dffa;border-color:#d8c8ef;box-shadow:0 4px #bca6d6;color:#8362a5}.actions button:nth-child(3),.actions button:nth-child(6){background:#def0e4;border-color:#c5e2d0;box-shadow:0 4px #a4c7b3;color:#5b8c73}.actions kbd{background:#ffffff90;color:inherit;padding:3px 5px;border-radius:5px}.active{filter:saturate(1.4);background:#ffe79b!important;border-color:#d7b66d!important}.settings{border-top:2px dashed #eee3d7}.settings label{color:#9b89a5}.settings input[type=range]{accent-color:#aa87d7}.settings input[type=checkbox]{accent-color:#aa87d7}footer{margin-top:24px;color:#a593a6}footer button{box-shadow:none;color:#9b7bb5}dialog{background:var(--cream);border:5px solid white;border-radius:28px;box-shadow:0 12px 0 #cab6a540}dialog::backdrop{background:#4e3a6666}pre{background:#eee5f7}td,th{border-color:#e8dcea}button:focus-visible{outline:3px solid #9772d4;outline-offset:5px}@media(max-width:850px){header{margin:12px 3% 0;padding:15px}header a{font-size:22px}nav{flex-wrap:wrap}main{padding-top:28px}.heading .pill{transform:none}.world{min-height:480px;border-width:6px}.window{left:10%;width:110px;height:135px}.plant{right:7%;font-size:100px}.plinth{right:10%;top:47%;width:56px;height:57px}.sun{left:15%;width:35px;height:35px}.toy-block{width:42px;height:42px;font-size:20px}.toy-ball{width:43px;height:43px}.wall-star{font-size:40px}.worldtop{left:12px;right:12px;font-size:9px}.worldtop>span{padding:9px}.worldbottom{left:12px;right:12px;font-size:9px}aside{padding:22px}.actions{gap:13px}}@media(prefers-reduced-motion:reduce){button{transition:none}}
.pet-picker{display:block;margin-top:18px;font-size:9px;font-weight:900;letter-spacing:1px;color:#9075a7}.pet-picker select{display:block;width:100%;margin-top:9px;padding:12px 34px 12px 12px;border:2px solid #d8c8ef;border-radius:13px;box-shadow:0 4px #c4afd9;background:#f0e7fc;color:#68518b;font:700 14px ui-rounded,'Trebuchet MS',sans-serif;cursor:pointer}.pet-picker select:focus-visible{outline:3px solid #9772d4;outline-offset:4px}.pet-picker select:disabled{opacity:.6;cursor:wait}#saved-note{font-size:10px;line-height:1.4;margin:12px 0 3px;color:#8f809d}
