.robot-card,.robot-adventure{--robot-accent:#73dfcd;--robot-ink:#eef5ff;color:var(--robot-ink);background:#152439;border:1px solid #496079;border-radius:22px;overflow:hidden}.robot-card{display:grid;grid-template-columns:150px 1fr;gap:22px;padding:24px;margin:0 0 24px;background:radial-gradient(ellipse at 0 100%,#245c65,transparent 65%),#152439}.robot-card h3{color:inherit;font-size:clamp(1.2rem,3vw,1.65rem);margin:8px 0}.robot-card p{color:#cfdfef;margin:8px 0 18px;max-width:52ch}.robot-card>div:first-child{align-self:center}.robot-card--locked{opacity:.85;grid-template-columns:80px 1fr;padding:16px 24px}.robot-card--locked p{margin-bottom:0}.robot-kicker{display:block;color:#a0f1de;font-size:.78rem;font-weight:800;letter-spacing:.07em;text-transform:uppercase}.robot-art{width:100%;max-width:260px;display:block;color:#63cfca;overflow:visible}.robot-shell{fill:#73dfcd;stroke:#18334a;stroke-width:5}.robot-art--helper{color:#e5ab58}.robot-art--helper .robot-shell{fill:#ffcd7c}.robot-art--step-0 .robot-eyes,.robot-art--step-0 .robot-power,.robot-art--step-1 .robot-power,.robot-art--step-2 .robot-power{opacity:.2}.robot-art--step-0 .robot-arm,.robot-art--step-1 .robot-arm{transform:rotate(30deg);transform-origin:170px 140px;opacity:.6}.robot-adventure{max-width:760px;margin:auto}.robot-workshop{position:relative;min-height:240px;display:flex;justify-content:center;align-items:center;padding:16px 16px 36px;background:linear-gradient(0deg,#31435c 0 17%,transparent 17%),radial-gradient(ellipse at 50% 50%,#316376,transparent 65%),#111f32}.robot-workshop .robot-art{width:200px;z-index:1}.robot-workshop-light{position:absolute;left:12%;top:22%;width:18%;height:36%;border:5px solid #39566f;background:linear-gradient(135deg,#48749b,#a6dddf);border-radius:36px 36px 4px 4px;opacity:.5}.robot-place--window .robot-workshop-light{left:42%;opacity:1}.robot-workshop-caption{position:absolute;bottom:10px;color:#d6e9f7;font-size:.8rem}.robot-task{padding:24px}.robot-task h3{color:inherit;font-size:clamp(1.15rem,3vw,1.5rem);line-height:1.45;margin:8px 0 20px}.robot-task p{line-height:1.6}.robot-steps{display:flex;justify-content:center;gap:12px;list-style:none;margin:0;padding:14px;background:#0f1c2e;color:#a4b3c7}.robot-steps li{padding:5px 10px;border-radius:20px}.robot-steps .is-done{color:#9fedd6}.robot-steps .is-current{background:#325360;color:#fff}.robot-answers,.robot-actions{display:flex;gap:12px;flex-wrap:wrap}.robot-adventure button:not(.btn){font:inherit;border:1px solid #5e7894;background:#22374e;color:#f0f6ff;border-radius:12px;padding:12px 18px;cursor:pointer;min-height:46px}.robot-answers button{flex:1;font-size:1.25rem!important;font-weight:800}.robot-adventure button:hover:not(:disabled){background:#35576b}.robot-adventure button:focus-visible,.robot-card button:focus-visible,.robot-adventure summary:focus-visible{outline:3px solid #ffda73;outline-offset:4px}.robot-adventure button:disabled{opacity:.55;cursor:wait}.robot-adventure button[aria-pressed=true]{border:2px solid #8ce9d5;background:#284e59}.robot-variants,.robot-placement{border:0;padding:0;margin:20px 0;display:flex;gap:12px;flex-wrap:wrap}.robot-variants legend,.robot-placement legend{margin-bottom:12px;font-weight:700}.robot-variants button{flex:1;min-width:120px;display:flex;flex-direction:column;align-items:center;gap:6px}.robot-variants svg{width:100px}.robot-variants small,.robot-note{color:#c4d3e3;font-size:.85rem}.robot-feedback{min-height:48px;color:#bdf3df}.robot-adventure details{border-top:1px solid #40556d;padding-top:14px}.robot-adventure summary{cursor:pointer}.robot-next{border-left:3px solid #bba4f1;padding-left:16px;color:#ddd2f7;font-size:.9rem}.robot-art.is-waving .robot-arm{animation:robot-wave .4s ease-in-out 5 alternate;transform-origin:170px 140px}.robot-art.is-dancing .robot-body{animation:robot-dance .45s ease-in-out 6 alternate;transform-origin:120px 210px}.room-robot-reward{position:absolute;left:72%;top:64%;width:11%;border:0;background:transparent;z-index:8;padding:0;cursor:pointer}.room-robot-reward .robot-art{width:100%}.room-robot-reward span{position:absolute;left:50%;top:100%;transform:translateX(-50%);white-space:nowrap;background:#152439;color:#fff;border-radius:8px;padding:3px 7px;font-size:11px}.room-robot-reward[data-placement=window]{left:40%;top:49%}@keyframes robot-wave{to{transform:rotate(-35deg)}}@keyframes robot-dance{to{transform:translateY(-9px) rotate(8deg)}}@media(max-width:520px){.robot-card{grid-template-columns:80px 1fr;gap:12px;padding:18px}.robot-card .btn{width:100%;white-space:normal}.robot-task{padding:18px}.robot-steps{gap:4px;font-size:.8rem}.robot-actions button{flex:1}.robot-workshop{min-height:210px}.robot-workshop .robot-art{width:170px}}@media(prefers-reduced-motion:reduce){.robot-art *{animation:none!important;transition:none!important}}
/* The shared dialog also styles paragraphs through theme variables. Keep this illustrated scene readable in both site themes. */
.adventure-dialog .robot-adventure{--muted:#cfdfef;--ink:#eef5ff;--accent:#a0f1de}.adventure-dialog .robot-feedback{color:#bdf3df}.adventure-dialog .robot-next{color:#ddd2f7}.adventure-dialog .robot-adventure h3:focus{outline:none}.room-robot-reward:focus-visible{outline:3px solid #ffda73;outline-offset:4px;border-radius:12px}
.adventure-dialog:has(.robot-adventure){--ink:#eef5ff;--muted:#cfdfef;--line:#496079;--accent:#a0f1de}.adventure-dialog:has(.robot-adventure)>h2{color:#eef5ff}.adventure-dialog:has(.robot-adventure)>.adventure-dialog-close{color:#eef5ff}.legendary-room .room-robot-reward{border:0;background:transparent;padding:0;min-width:36px}

/* The room stays still while its resident moves between two visibly different places. */
.robot-workshop.is-home{height:280px;min-height:280px;overflow:hidden;background:linear-gradient(0deg,#31435c 0 20%,transparent 20%),radial-gradient(ellipse at 75% 25%,#355d79,transparent 65%),#111f32}
.robot-workshop.is-home .robot-workshop-light{left:65%;top:12%;width:25%;height:48%;opacity:1;border-radius:26px 26px 4px 4px;background:linear-gradient(145deg,#4277af,#c0edf0)}
.robot-workshop.is-home .robot-workshop-light::before{content:"";position:absolute;left:48%;height:100%;width:4px;background:#39566f}
.robot-workshop.is-home .robot-workshop-light::after{content:"";position:absolute;top:48%;height:4px;width:100%;background:#39566f}
.robot-workshop-desk{position:absolute;left:7%;bottom:48px;width:30%;height:76px;border-top:12px solid #d4a372;border-radius:5px;box-shadow:0 -3px 0 #f3c99c}
.robot-workshop-desk::before,.robot-workshop-desk::after{content:"";position:absolute;top:0;bottom:0;width:9px;background:#9f7657}.robot-workshop-desk::before{left:5%}.robot-workshop-desk::after{right:5%}
.robot-workshop-desk>span{position:absolute;left:18%;bottom:88px;width:55%;height:40px;border:5px solid #51637a;background:#87dfd4;border-radius:5px;box-shadow:0 8px 0 -3px #51637a}
.robot-resident{position:absolute;bottom:38px;left:39%;width:clamp(130px,30%,200px);transform:translateX(-50%);transition:left .5s ease-in-out;z-index:2;pointer-events:none}
.robot-place--window .robot-resident{left:76%}.robot-workshop .robot-resident .robot-art{width:100%;max-width:none}
.robot-workshop.is-home .robot-workshop-caption{left:8px;right:8px;text-align:center;bottom:10px;z-index:3;font-size:clamp(.7rem,2vw,.85rem)}
.robot-placement-status{min-height:1.6em;color:#bdf3df;font-size:.9rem;margin-top:0}
@media(max-width:520px){.robot-workshop.is-home{height:235px;min-height:235px}.robot-workshop-desk{height:60px}.robot-workshop-desk>span{bottom:72px;height:30px}.robot-resident{width:clamp(112px,40%,160px)}}
@media(prefers-reduced-motion:reduce){.robot-resident{transition:none}}
.robot-playground{margin:24px 0;padding:18px;border:1px solid #7299b9;border-radius:16px;background:#14263b}
.robot-playground h4{font-size:1.15rem;margin:0 0 12px}
.robot-playground h4:not(:first-child){margin-top:24px}
.robot-playground button{min-height:48px;padding:10px 14px;border:1px solid #7299b9;border-radius:12px;background:#29465d;color:#fff;font:inherit;cursor:pointer}
.robot-playground button:focus-visible{outline:3px solid #ffda73;outline-offset:3px}
.robot-playground button[aria-pressed=true]{border:2px solid #93fbd2;background:#355f68}
.robot-playground fieldset{display:flex;flex-wrap:wrap;gap:8px;border:0;padding:0;margin:18px 0}
.robot-playground legend{margin-bottom:10px}
.robot-rhythm-pads{display:flex;gap:12px;margin-top:14px}
.robot-rhythm-pads button{flex:1;font-size:1.7rem;touch-action:manipulation}
.robot-playground button:disabled{opacity:.4;cursor:default}
.robot-playground [role=status]{min-height:3em;color:#b4f6e4}