:root{color:#3c2118;background:#fff1df;font-family:"Baloo 2",Nunito,Trebuchet MS,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;--ink: #3c2118;--brown: #5a2f21;--red: #ef786a;--blue: #78c7dc;--yellow: #ffd765;--mint: #8bd7b6;--cream: #fff7ea;--line: 5px solid var(--brown);--shadow: 0 10px 0 rgba(90, 47, 33, .2)}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at 22px 22px,rgba(255,255,255,.8) 0 8px,transparent 9px),linear-gradient(90deg,rgba(120,199,220,.28) 0 8%,transparent 8% 16%),#fff1df;background-size:72px 72px,150px 100%,auto}button{font:inherit}img{display:block;max-width:100%}.room-shell{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,350px);gap:clamp(16px,3vw,34px);min-height:calc(100svh - 78px);padding:clamp(16px,3vw,34px)}.room-stage{display:grid;gap:12px;min-width:0}.room-toolbar{display:flex;justify-content:flex-end;gap:10px}.room-toolbar button,.panel-section button{cursor:pointer}.room-toolbar button{min-height:44px;padding:9px 16px;border:4px solid var(--brown);border-radius:999px;background:#fffaf2;color:var(--ink);box-shadow:0 6px #5a2f212e;font-weight:900}.room-toolbar button:active,.panel-section button:active{transform:translateY(3px)}.room{position:relative;min-height:min(68svh,720px);overflow:hidden;border:var(--line);border-radius:28px;background-image:url(/assets/room/keyko-room.png);background-position:center;background-size:cover;box-shadow:var(--shadow);isolation:isolate}.room:after{position:absolute;inset:0;z-index:8;pointer-events:none;opacity:0;background:#ffffffc7;content:""}.room.snapshot:after{animation:camera-flash .44s ease}@keyframes camera-flash{0%,to{opacity:0}22%{opacity:1}}.decor-layer{position:absolute;inset:0;z-index:2}.keyko-button{position:absolute;left:50%;bottom:8%;z-index:4;width:clamp(170px,25vw,300px);aspect-ratio:1;padding:0;border:0;background:transparent;cursor:pointer;filter:drop-shadow(0 16px 0 rgba(90,47,33,.18));transform:translate(-50%);transform-origin:50% 90%}.keyko-button:hover{animation:keyko-wiggle .62s ease}.keyko-button img{width:100%;height:100%;object-fit:contain;object-position:center bottom}@keyframes keyko-wiggle{30%{transform:translate(-50%) rotate(-3deg) scale(1.015)}65%{transform:translate(-50%) rotate(2deg) scale(1.01)}}.reaction-bubble{position:absolute;left:50%;bottom:min(48%,370px);z-index:6;max-width:min(260px,70%);padding:10px 16px;border:4px solid var(--brown);border-radius:22px;background:#fffaf2;box-shadow:0 8px #5a2f212e;color:var(--ink);font-size:clamp(1rem,2vw,1.35rem);font-weight:900;text-align:center;transform:translate(-50%)}.reaction-bubble.pop{animation:bubble-pop .36s ease}@keyframes bubble-pop{0%{opacity:0;transform:translate(-50%) translateY(12px) scale(.86)}}.decor-item{position:absolute;z-index:3;width:var(--decor-width);aspect-ratio:var(--decor-ratio);padding:0;border:0;background-color:transparent;background-image:var(--decor-image);background-position:center;background-repeat:no-repeat;background-size:contain;cursor:grab;filter:drop-shadow(0 10px 0 rgba(90,47,33,.16));transform:translate(-50%,-50%);transform-origin:center;touch-action:none}.decor-item[data-dragging=true]{z-index:5;cursor:grabbing;filter:drop-shadow(0 17px 0 rgba(90,47,33,.18));transform:translate(-50%,-50%) scale(1.04)}.decor-rug{--decor-image: url(/assets/decor/rug.png);--decor-width: clamp(140px, 26vw, 320px);--decor-ratio: 588 / 335;z-index:1}.decor-lamp{--decor-image: url(/assets/decor/lamp.png);--decor-width: clamp(78px, 9vw, 132px);--decor-ratio: 460 / 475}.decor-plant{--decor-image: url(/assets/decor/plant.png);--decor-width: clamp(76px, 9vw, 138px);--decor-ratio: 346 / 463}.decor-shelf{--decor-image: url(/assets/decor/shelf.png);--decor-width: clamp(130px, 17vw, 230px);--decor-ratio: 471 / 335}.decor-fishbowl{--decor-image: url(/assets/decor/fishbowl.png);--decor-width: clamp(86px, 11vw, 152px);--decor-ratio: 467 / 394}.decor-snack-box{--decor-image: url(/assets/decor/snack-box.png);--decor-width: clamp(86px, 10vw, 148px);--decor-ratio: 379 / 400}.play-panel{display:grid;align-content:start;gap:14px;min-width:0}.panel-section{display:grid;gap:12px;padding:14px;border:var(--line);border-radius:22px;background:#fffaf2f5;box-shadow:0 8px #5a2f2129}.panel-heading{display:flex;align-items:baseline;justify-content:space-between;gap:10px}.panel-heading p{margin:0;color:var(--ink);font-size:1.25rem;font-weight:900;line-height:1}.panel-heading span{color:#865843;font-size:.82rem;font-weight:900}.outfit-tray{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.outfit-option{display:grid;min-width:0;gap:6px;padding:8px;border:4px solid var(--brown);border-radius:18px;background:#fff7ea;box-shadow:0 5px #5a2f2126;color:var(--ink);font-weight:900}.outfit-option[data-active=true]{background:var(--yellow)}.outfit-option img{width:72px;height:72px;justify-self:center;object-fit:contain}.outfit-option span,.item-option span:last-child{overflow-wrap:anywhere}.wall-tray{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.wall-option{min-height:54px;border:4px solid var(--brown);border-radius:16px;box-shadow:0 5px #5a2f2124}.wall-option[data-wall=sunny]{background:radial-gradient(circle at 28% 32%,#fff 0 9px,transparent 10px),linear-gradient(135deg,#ffd765,#ef786a)}.wall-option[data-wall=mint]{background:radial-gradient(circle at 72% 34%,#fff 0 8px,transparent 9px),linear-gradient(135deg,#8bd7b6,#78c7dc)}.wall-option[data-wall=night]{background:radial-gradient(circle at 65% 24%,#ffd765 0 9px,transparent 10px),linear-gradient(135deg,#5669b2,#ef786a)}.wall-option[data-active=true],.item-option[data-active=true]{outline:5px solid var(--yellow)}.room[data-wall=mint]{background-image:url(/assets/room/keyko-room-mint.png)}.room[data-wall=night]{background-image:url(/assets/room/keyko-room-night.png)}.item-tray{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.item-option{display:grid;grid-template-columns:54px minmax(0,1fr);align-items:center;gap:8px;min-height:66px;padding:7px;border:4px solid var(--brown);border-radius:18px;background:#fff7ea;box-shadow:0 5px #5a2f2124;color:var(--ink);font-size:.92rem;font-weight:900;text-align:left}.item-preview{display:block;width:54px;height:48px;background-image:var(--decor-image);background-position:center;background-repeat:no-repeat;background-size:contain}@media(max-width:900px){.room-shell{grid-template-columns:1fr}.room{min-height:64svh}.play-panel{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:720px){.room-shell{padding:12px}.room{min-height:58svh;border-radius:20px}.room-toolbar{justify-content:stretch}.room-toolbar button{flex:1}.play-panel{grid-template-columns:1fr}.outfit-tray,.item-tray{grid-template-columns:repeat(2,minmax(0,1fr))}}.site-header{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:20px;padding:14px clamp(18px,4vw,54px);background:repeating-linear-gradient(90deg,#ef786a 0 68px,#f78d7f 68px 104px,#ffd765 104px 172px,#78c7dc 172px 240px);border-bottom:5px solid #5a2f21;font-family:"Baloo 2",Nunito,Trebuchet MS,sans-serif}.brand-mark,.site-nav{display:flex;align-items:center}.brand-mark{color:#fff;font-size:1.45rem;font-weight:900;text-decoration:none;text-shadow:-2px -2px 0 #5a2f21,2px -2px 0 #5a2f21,-2px 2px 0 #5a2f21,2px 2px 0 #5a2f21,0 4px 0 rgba(52,32,23,.24)}.site-header-title{margin:0;color:#342017;font-size:clamp(1.35rem,3vw,2.4rem);font-weight:900;line-height:.95;letter-spacing:0;text-shadow:0 4px 0 rgba(255,255,255,.82)}.site-nav{justify-self:end;gap:8px;padding:6px;border:4px solid #5a2f21;border-radius:999px;background:#fffaf2eb;box-shadow:0 7px #34201729}.site-nav a{color:inherit;padding:8px 13px;border-radius:999px;font-size:.92rem;font-weight:900;text-decoration:none;white-space:nowrap}.site-nav a:hover{background:#ffd765}@media(max-width:420px){.site-header{display:flex;align-items:stretch;flex-direction:column;padding-inline:12px}.site-nav{justify-content:space-between}}