#bb-challenges .bb-board { position:relative; width:100%; overflow:hidden; border-radius:14px; aspect-ratio:1.85; min-height:235px; background:linear-gradient(#d5e5e2 0 75%,#a89178 75%); }
#bb-challenges .bb-room { position:absolute; inset:0; }
#bb-challenges .bb-room i { position:absolute; display:block; box-sizing:border-box; }
#bb-challenges [data-room="0"] i:nth-child(1) {left:7%;top:12%;width:48%;height:65%;border:5px solid #567a80;border-bottom:9px solid #263b42;background:repeating-linear-gradient(#c2d3d4 0 22%,#8fa9ad 23% 25%);}
#bb-challenges [data-room="0"] i:nth-child(2) {left:59%;top:49%;width:23%;height:30%;border:4px solid #9d7655;background:linear-gradient(90deg,transparent 44%,#efd2a2 45% 55%,transparent 56%),linear-gradient(#cfa778 0 47%,#9d7655 48% 53%,#d9b68b 54%);}
#bb-challenges [data-room="0"] i:nth-child(3) {left:84%;top:64%;width:11%;height:18%;border-radius:18%;border-top:5px solid #2f5547;background:linear-gradient(#8fb3a0 0 36%,#487765 37% 74%,#8fb3a0 75%);}
#bb-challenges [data-room="0"] i:nth-child(4) {left:65%;top:12%;width:24%;height:7%;border:3px solid #809194;border-radius:10px;background:#fff3bf;}
#bb-challenges [data-room="1"] .bb-room {inset:8% 8% 17%;border:7px solid #9d7655;background:linear-gradient(#e8d6bd 0 35%,#ae8663 36% 42%,#e8d6bd 43% 77%,#ae8663 78% 84%,#cfa778 85%);}
#bb-challenges [data-room="1"] i:nth-child(1) {left:12%;top:9%;width:16%;height:26%;background:linear-gradient(#af7346 0 25%,#e8c67a 26% 74%,#af7346 75%);transform:rotate(-5deg);}
#bb-challenges [data-room="1"] i:nth-child(2) {left:72%;top:33%;width:5px;height:4px;border-radius:50%;background:#805b36;box-shadow:8px 4px #805b36,17px -2px #805b36,24px 4px #805b36;}
#bb-challenges [data-room="1"] i:nth-child(3) {left:25%;top:53%;width:23%;height:24%;border:4px solid #4d746f;background:#749e97;}
#bb-challenges [data-room="1"] i:nth-child(4) {left:65%;top:58%;width:27%;height:18%;background:linear-gradient(#567a80 0 45%,#adc4c2 46% 54%,#567a80 55%);}
#bb-challenges [data-room="2"] {background:linear-gradient(#94c7de 0 20%,#d5e5e2 21% 68%,#b9aa95 69%);}
#bb-challenges [data-room="2"] i:nth-child(1) {left:8%;top:16%;width:36%;height:56%;border:6px solid #567a80;background:linear-gradient(90deg,#a7d0dc 0 48%,#567a80 49% 53%,#b7d9e0 54%);}
#bb-challenges [data-room="2"] i:nth-child(1)::after {content:"";position:absolute;left:47%;top:100%;width:68%;border-top:4px dotted #3e3830;transform:rotate(8deg);}
#bb-challenges [data-room="2"] i:nth-child(2) {left:51%;top:47%;width:16%;height:28%;border-radius:46% 46% 25% 25%;background:linear-gradient(#689778 0 43%,#bc8060 44% 88%,#649cab 89%);}
#bb-challenges [data-room="2"] i:nth-child(3) {left:73%;top:51%;width:22%;height:29%;border-top:10px solid #9d7655;border-left:5px solid #9d7655;border-right:5px solid #9d7655;}
#bb-challenges [data-room="2"] i:nth-child(3)::after {content:"";position:absolute;left:54%;bottom:-8%;width:45%;height:18%;border-radius:50%;background:#936942;}
#bb-challenges [data-room="2"] i:nth-child(4) {left:76%;top:24%;width:13%;height:22%;border:4px solid #648587;border-bottom-width:9px;background:#a3c0bf;}
[data-room="kitchen"] [data-spot="0"] { left: 34%; top: 74%; }
[data-room="kitchen"] [data-spot="1"] { left: 74%; top: 39%; }
[data-room="kitchen"] [data-spot="2"] { left: 84%; top: 85%; }
[data-room="0"] [data-spot="0"] { left: 21%; top: 75%; }
[data-room="0"] [data-spot="1"] { left: 64%; top: 52%; }
[data-room="0"] [data-spot="2"] { left: 87%; top: 70%; }
[data-room="0"] [data-spot="3"] { left: 77%; top: 16%; }
[data-room="1"] [data-spot="0"] { left: 23%; top: 22%; }
[data-room="1"] [data-spot="1"] { left: 73%; top: 32%; }
[data-room="1"] [data-spot="2"] { left: 35%; top: 57%; }
[data-room="1"] [data-spot="3"] { left: 72%; top: 62%; }
[data-room="2"] [data-spot="0"] { left: 31%; top: 72%; }
[data-room="2"] [data-spot="1"] { left: 57%; top: 55%; }
[data-room="2"] [data-spot="2"] { left: 85%; top: 77%; }
[data-room="2"] [data-spot="3"] { left: 81%; top: 29%; }
#bb-challenges [data-room="kitchen"] { position:relative; isolation:isolate; aspect-ratio: 1.85; min-height:225px; overflow:hidden; border-radius:14px; background:linear-gradient(0deg,#a89178 0 17%,transparent 17%), repeating-linear-gradient(90deg,transparent 0 11.7%,#b0c8c8 12% 12.4%),repeating-linear-gradient(0deg,#d5e5e2 0 14.5%,#b0c8c8 15% 15.5%); }
.bb-kitchen-art div, .bb-kitchen-art span {position:absolute;box-sizing:border-box;}
.bb-kitchen-art .bb-window {left:13%;top:7%;width:35%;height:30%;border:6px solid #f8f6ef;background:linear-gradient(90deg,transparent 48%,#f8f6ef 48% 52%,transparent 52%),linear-gradient(#94c7de 0 63%,#a4c6a0 64%);box-shadow:0 3px 9px #26404533;}
.bb-kitchen-art .bb-upper {right:7%;top:5%;width:37%;height:26%;border:4px solid #9d7655;background:repeating-linear-gradient(90deg,#cfaa80 0 47%,#a88260 48% 50%);box-shadow:0 4px 8px #26364344;}
.bb-kitchen-art .bb-counter {z-index:2;left:5%;right:5%;top:43%;height:10%;background:linear-gradient(#faf1e2 0 69%,#d4ba9d 70%);border-radius:5px;box-shadow:0 4px 7px #242b3740;}
.bb-kitchen-art .bb-sink {z-index:3;left:19%;top:44%;width:27%;height:5%;background:#62808d;border:2px solid #aabcc1;border-radius:45%;}
.bb-kitchen-art .bb-faucet {z-index:4;left:29%;top:33%;width:9%;height:12%;border:5px solid #66818a;border-bottom:0;border-radius:18px 18px 0 0;}
.bb-kitchen-art .bb-cabinets {left:6%;right:6%;top:51%;height:36%;background:repeating-linear-gradient(90deg,#567a80 0 23%,#3e5c65 24% 25%);border-bottom:9px solid #304b54;}
.bb-kitchen-art .bb-opening {left:19%;top:53%;width:30%;height:31%;background:linear-gradient(125deg,#233d44,#405c62);border:4px solid #709497;}
.bb-kitchen-art .bb-pipe {left:32%;top:-2%;width:34%;height:63%;border:7px solid #b5c8c9;border-top:0;border-radius:0 0 15px 15px;}
.bb-kitchen-art .bb-puddle {bottom:8%;left:24%;width:55%;height:15%;border-radius:50%;background:#71bac9;}
.bb-kitchen-art .bb-crumbs {z-index:4;left:68%;top:45%;width:6px;height:4px;background:#87633d;border-radius:50%;box-shadow:9px 2px #956d40,17px -2px #aa8053,25px 3px #87633d;}
.bb-kitchen-art .bb-gap {left:74%;top:84%;width:13%;height:2.5%;background:#25363e;border-radius:50%;}

.bb-challenges { max-width: 920px; padding-bottom: clamp(2.5rem, 7vw, 5rem); }
.bb-challenges [hidden] { display: none; }
.bb-picker, .bb-actions { display: flex; flex-wrap: wrap; gap: .65rem; }
.bb-picker { margin-bottom: 1.6rem; }
.bb-picker button, .bb-actions button { font: inherit; font-weight: 700; cursor: pointer; }
.bb-picker .button, .bb-actions .button { min-height: 44px; white-space: normal; }
.bb-picker .button-outline, .bb-actions .button-outline {
  color: #102e46; border: 1px solid #6d8897; background: #fff;
}
.bb-game h2 { margin: 0 0 .55rem; }
#bb-report { margin: 0 0 1rem; color: #314e61; font-size: 1.08rem; }
.bb-kitchen-art { display: none; position: absolute; inset: 0; }
[data-room="kitchen"] .bb-kitchen-art { display: block; }
.bb-spot {
  position: absolute; z-index: 5; transform: translate(-50%, -50%);
  display: grid; place-items: center; width: 48px; height: 48px;
  border: 2px solid #fff; border-radius: 50%; background: #102e46;
  color: #fff; font: inherit; font-weight: 800; cursor: pointer;
  box-shadow: 0 2px 7px #102e4670;
}
.bb-spot:hover { background: #25516f; }
.bb-spot[data-found="true"] { background: #135847; }
.bb-challenges button:focus-visible, .bb-challenges a:focus-visible {
  outline: 3px solid #102e46; outline-offset: 3px; box-shadow: 0 0 0 3px #fff;
}
.bb-feedback {
  margin-top: 1rem; padding: clamp(1rem, 3vw, 1.6rem);
  background: #eaf3f5; color: #102e46; border-radius: 14px;
  border: 1px solid #b5cbd4; line-height: 1.55; font-size: clamp(1.05rem, 2.5vw, 1.18rem);
}
.bb-progress { margin: 0 0 .55rem; font-size: .96rem; font-weight: 700; }
#bb-result { font-size: clamp(1.2rem, 4vw, 1.5rem); }
#bb-explain, #bb-takeaway { margin: .5rem 0 0; }
#bb-explain:empty { display: none; }
.bb-actions, .bb-reference { margin-top: 1rem; }
@media (max-width: 430px) {
  .bb-picker .button { flex: 1 1 40%; }
}
@media (max-width: 370px) {
  .header .header-inner { gap: 12px; }
  .header .brand small { letter-spacing: .08em; }
  .header .menu-toggle { flex: 0 0 44px; min-height: 44px; }
}