#board { position:relative; isolation:isolate; }
.cell { position:relative; touch-action:none; user-select:none; -webkit-user-select:none; }
.cell > * { pointer-events:none; }
.cell-face {
  position:absolute; inset:0; display:grid; place-items:center;
  border-radius:inherit; background:var(--tile); transform-origin:center;
}
.cell.cell-marked .cell-face { background:var(--tile-shade,var(--tile)); }
.cell:active .cell-face { transform:scale(.94); }
.cell .cross {
  position:relative; width:74%; height:74%; fill:none; stroke:#fff; stroke-width:7;
  stroke-linecap:round;
}

.cell .tile-bee {
  position:absolute; inset:auto; left:13.1%; top:10.4%; width:79.2%; height:79.2%; display:block;
  pointer-events:none;
}
.cell-face { pointer-events:none; }
.cell:focus-visible { z-index:5; }
.tool-circle { position:relative; }
.tool .tool-count { display:grid; font-size:10px; color:white; }


.mistake-x { display:grid; place-items:center; width:100%; height:100%; }
.cell .mistake-x .cross { stroke:#fb5d28; }
.mistake-in-flight .mistake-x { visibility:hidden; }
.mistake-rule { background:#f9d5db; outline:2px solid #cf6578; }
.mistake-area .cell-face { box-shadow:inset 0 0 0 2px #e35169, inset 0 0 0 4px #fff6; }
.mistake-anchor .cell-face { outline:2px solid #ec6870; outline-offset:-3px; }
.mistake-anchor:has(> .mistake-paired) .tile-bee { visibility:hidden; }
.mistake-paired { position:absolute; inset:6%; width:88%; height:88%; object-fit:contain; z-index:2; }
.mistake-sequence {
  position:absolute; inset:0; z-index:3; overflow:hidden; contain:paint; isolation:isolate;
  border-radius:inherit; pointer-events:none;
}
.mistake-scared,.mistake-orange,.mistake-symbol { position:absolute; inset:0; width:100%; height:100%; }
.mistake-scared { inset:6%; width:88%; height:88%; object-fit:contain; animation:wrong-face 108ms steps(1,end) both; }
.mistake-orange { background:#fd4700; opacity:0; animation:wrong-orange 1090ms 164ms forwards; }
.mistake-symbol { overflow:hidden; stroke:none; }
.mistake-strike { fill:none; stroke:#fff; stroke-width:15; stroke-linecap:round; animation:wrong-x-fade 235ms 376ms both; transform-origin:50% 50%; }
.mistake-strike path { stroke-dasharray:1; animation:wrong-x-draw 118ms 177ms ease-out both; }
.mistake-strike path+path { animation-delay:245ms; }
.mistake-heart { transform-origin:50% 51%; opacity:0; animation:wrong-heart 661ms 522ms forwards; }
.mistake-crack { fill:none; stroke:#fd4700; stroke-width:5.5; stroke-linecap:round; stroke-linejoin:round; stroke-dasharray:1; animation:wrong-crack 120ms 865ms both; }
@keyframes wrong-face { from { opacity:1; } to { opacity:0; } }
@keyframes wrong-orange { 0%,94% { opacity:1; } 100% { opacity:0; } }
@keyframes wrong-x-draw {
  0% { opacity:0; stroke-dashoffset:1; }
  1% { opacity:1; stroke-dashoffset:1; }
  100% { opacity:1; stroke-dashoffset:0; }
}
@keyframes wrong-x-fade {
  0%,28% { opacity:1; transform:scale(1); }
  76% { opacity:.09; transform:scale(.68); }
  100% { opacity:0; transform:scale(.3); }
}
@keyframes wrong-heart {
  0% { opacity:.15; transform:scale(.26); }
  12% { opacity:.53; transform:scale(.69); }
  37%,88% { opacity:1; transform:scale(1); }
  100% { opacity:0; transform:scale(.92); }
}
@keyframes wrong-crack { from { stroke-dashoffset:1; } to { stroke-dashoffset:0; } }

.tool-count {
  position:absolute; top:-3px; right:-3px; display:grid; place-items:center;
  min-width:18px; height:18px; padding:0 3px; border-radius:12px;
  border:1px solid #fff; background:#9d425c; color:white; font-size:10px;
}
.clue-card {
  display:flex; align-items:center; gap:7px; margin:7px 0 0;
  padding:6px 7px 6px 10px; border:1px solid #ebd097;
  border-radius:11px; background:#fff8e7; font-size:12px;
}
.clue-card[hidden] { display:none; }
.clue-card p { margin-right:auto; }
.clue-card .secondary,.clue-card .text-button { min-height:32px; padding:4px 8px; }
.clue-anchor .cell-face { outline:2px solid #71451d; outline-offset:-2px; }
.clue-safe .cell-face { outline:2px dashed #71451d; outline-offset:-4px; }
.sweep-flower {
  position:absolute; top:0; left:0; width:var(--sweep-size, 48px); aspect-ratio:1; z-index:6;
  pointer-events:none; filter:drop-shadow(0 1px 2px #fff) drop-shadow(0 3px 3px #7b514880);
}
.sweep-flower svg { display:block; width:100%; height:100%; }

.cell.cell-revealing { z-index:6; overflow:visible; }
.cell-revealing .tile-bee { z-index:4; animation:bee-emerges 300ms cubic-bezier(.18,.8,.32,1) both; }
@keyframes bee-emerges {
  0% { transform:translateY(19%) scale(.30); opacity:0; }
  36% { transform:translateY(-10%) scale(1.17); opacity:1; }
  79% { transform:translateY(2%) scale(.95); }
  100% { transform:translateY(0) scale(1); }
}
.reveal-ring {
  position:absolute; inset:9%; border:2px solid #fff2af; border-radius:50%;
  animation:bloom-ring 435ms ease-out both;
}
@keyframes bloom-ring { from { scale:.34; opacity:.95; } to { scale:1.6; opacity:0; } }
.reveal-spark {
  position:absolute; left:50%; top:50%; width:6px; height:8px;
  border-radius:2px 5px 2px 5px; background:#f4bf51;
  animation:bloom-spark 620ms cubic-bezier(.18,.65,.28,1) both;
}
.reveal-spark:nth-of-type(4n+2) { background:#f7e0a2; border-radius:50%; width:5px; height:5px; }
.reveal-spark:nth-of-type(4n+3) { background:#dd799b; }
.reveal-spark:nth-of-type(4n+4) { background:#7eae7f; }
@keyframes bloom-spark {
  0% { transform:translate(-50%,-50%) scale(.35); opacity:0; }
  12% { opacity:1; }
  72% { opacity:.9; }
  100% { transform:translate(var(--dx),var(--dy)) rotate(var(--spin)) scale(.35); opacity:0; }
}
.reveal-reward {
  position:absolute; top:11%; left:50%; width:max-content; padding:2px 6px 3px;
  border:1px solid #f0c475; border-radius:14px; background:#fff8e8; color:#624019;
  box-shadow:0 2px 6px #623b2d2e; font-size:12px; font-weight:850;
  animation:bloom-reward 760ms cubic-bezier(.2,.65,.38,1) both;
}
@keyframes bloom-reward {
  0% { transform:translate(-50%,2px) scale(.58); opacity:0; }
  23% { opacity:1; }
  73% { opacity:1; }
  100% { transform:translate(-50%,-37px) scale(1); opacity:0; }
}
@media (prefers-reduced-motion: reduce) {
  .cell:active .cell-face { transform:none; }
  .cross-drawing path { animation:none; }
}

#board .cell .cross { animation:none; }
#board .mistake-x .cross { color:#fb5d28; }
#board .sweep-flower { position:absolute; }
#board .cell .credit.player-photo {
  width:clamp(12px,35%,23px); height:auto; aspect-ratio:1;
  font-size:clamp(7px,1.6vw,12px); z-index:1;
}
#board .clue-anchor .cell-face { outline:2px solid #71451d; outline-offset:-2px; }
#board .clue-safe .cell-face { outline:2px dashed #71451d; outline-offset:-4px; }
#board-clue { margin:0 18px 16px; }
#board-clue button { width:auto; margin:0; font-size:11px; }
@media (prefers-reduced-motion:reduce) {
 #board .cross.drawing path { animation:none; stroke-dashoffset:0; }
}

.tool-circle > svg, .tool-circle .finder-bee-icon { width:31px; height:31px; }
.tool-circle > svg, .sweep-flower > svg { stroke:none; }
#sweep .tool-circle > svg { width:36px; height:36px; }
.tool-circle .finder-bee-icon { object-fit:contain; }
#board-clue:not([hidden]) { display:flex; align-items:center; gap:8px; }
#board-clue p { margin:0; flex:1; }

/* G01–G07: governing Level 14 screenshot, with the approved Meowdoku guide copy. */
#game{container-type:inline-size;width:min(calc(100% - 26px),485px);padding:16px 0 24px;background:var(--blush)}
#game .level-head{padding:0 2%;align-items:flex-start;color:#473e50}
#game #chapter{color:#957d9c;letter-spacing:.15em}
#game #leveltitle{font-size:clamp(22px,7cqw,31px);margin-top:5px;line-height:1.15}
#game .hearts{color:#ce718a;background:transparent;word-spacing:clamp(5px,2.8cqw,15px);font-size:clamp(19px,6cqw,28px);padding:8px 8px 0}
#game #battle-panel{margin:18px 1.5% 17px}
#game .mode-switch{border:0;background:#f1eff6;border-radius:17px;padding:4px}
#game .mode-switch button{border:0;min-height:38px;color:#665e70}
#game .mode-switch button[aria-pressed="true"]{background:#fbfbfd;color:#8c77a0}
#game .progressline{margin:0 2% 15px;color:#473e50}
#game .track{background:#efeaf3}
#game .track i{background:#9ebea7}
#game .rulechips{gap:5px;background:transparent;padding:0;margin:0 0 9px}
#game .rule-example{background:transparent;border:0;color:#685467;min-width:0;padding:0;gap:clamp(3px,1cqw,6px);font-size:clamp(10px,3.28cqw,14px);line-height:1.14}
#game .rule-example>span:last-child{white-space:nowrap}
#game .rule-grid{width:clamp(27px,10.4cqw,47px)}
#game .board-tray{max-width:none;margin:0;padding:0;border:0;border-radius:0;background:transparent}
#game .bee-reference{height:clamp(43px,15cqw,60px);padding:0 0 clamp(11px,4cqw,18px);gap:clamp(3px,2.4cqw,11px)}
#game .bee-target{width:clamp(23px,9cqw,38px);height:clamp(28px,10cqw,43px)}
#game #board{gap:clamp(3px,1.37cqw,6px);padding:0;width:100%;border:0;margin:0}
#game #board .cell{border-radius:clamp(4px,1.65cqw,8px);border:0}
#game #board .cell svg.cross{width:74%;height:74%;stroke:#fff}
#game #board .cell .mistake-x svg.cross{stroke:#fb5d28}

/* T01–T05: tool and instruction row from the Level 14 preview. */
#game .tools{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(8px,4cqw,24px);width:min(100%,268px);margin:13px auto 3px}
#game .tool{font-weight:800;font-size:11px;color:#282620;padding:4px 0;min-width:0}
#game .tool-circle{width:48px;height:48px;background:#fff;border:1px solid #ecdfd8;box-shadow:0 2px 0 #eadfcf}
#game .board-instructions{display:flex;align-items:center;justify-content:space-between;gap:6px;min-height:35px;margin:6px 0 13px}
#game .instruction{text-align:left;margin:0;font-size:11px;min-height:0}
#game .board-instructions .icon{background:#fff;width:36px;height:36px;padding:0}
#game .teamhead{margin:0 0 9px}
#game .team{background:#fff;border-color:#e9e7e1}
.art-placeholder{display:block;background:#f7f6f3;color:#67585f;border:1px dashed #ad9ca7;border-radius:12px;padding:8px 12px;text-align:center;font-size:12px}
#failure-reward{width:100%}

/* A new garden arrives in one top-left to bottom-right wave. */
@media (prefers-reduced-motion:no-preference) {
  #board .tile-enter {animation:tile-arrive 270ms cubic-bezier(.2,.7,.3,1) var(--entry-delay) both;}
  #board .auto-drawing path {
    stroke-dasharray:1;stroke-dashoffset:0;
    animation:draw-board-x 125ms ease-out var(--auto-delay) both;
  }
  #board .auto-drawing path+path {animation-delay:calc(var(--auto-delay) + 55ms);}
  #board-clear-layer:not([hidden]) .board-clear {animation:clear-pop 480ms ease both;}
}
@keyframes tile-arrive {
  from {transform:scale(.97);}
  70% {transform:scale(1.025);}
  to {transform:scale(1);}
}
.auto-x {position:absolute;inset:0;display:grid;place-items:center;opacity:.7;}
#game .rule-example.mistake-rule {
  background:#f9d5db;color:#862642;outline:2px solid #cf6578;border-radius:6px;
}
#hearts {display:flex;gap:clamp(5px,2.8cqw,15px);}
#hearts span {position:relative;}
.board-stage {position:relative;}
#board-clear-layer {position:absolute;inset:0;z-index:9;pointer-events:none;}
#board-clear-layer svg {position:absolute;inset:0;width:100%;height:100%;overflow:visible;}
#board-clear-layer path {fill:none;stroke:#ffe084;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;opacity:.62;}
#board-clear-status {position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);}
.board-clear {
  position:absolute;left:var(--clear-x,50%);top:calc(100% + 2px);
  translate:-50% 0;pointer-events:none;white-space:nowrap;
  color:#ffe269;-webkit-text-stroke:2px #624204;paint-order:stroke fill;
  font-weight:900;font-size:16px;line-height:20px;
}
@keyframes clear-pop {
  0% {opacity:0;transform:translateY(3px) scale(.83);}
  23% {opacity:1;transform:translateY(0) scale(1.04);}
  75% {opacity:1;transform:translateY(0);}
  100% {opacity:0;transform:translateY(1px);}
}

/* Round score, find feedback and level transitions share the approved board. */
#game .level-head{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:clamp(6px,2cqw,13px);}
#game .board-score{display:grid;text-align:center;gap:3px;min-width:43px;line-height:1.12;color:#51465a;}
#game .board-score>span{font-size:12px;font-weight:750;}
#board-score{font-variant-numeric:tabular-nums;font-size:clamp(18px,6cqw,26px);}
.level-context{display:flex;align-items:center;gap:6px;height:1.1em;font-size:11px;line-height:1.1}
#hard-tag{flex:none;border-radius:6px;padding:2px 6px;background:#f6dfc4;color:#623616;font-size:11px;line-height:1;font-weight:800}
#level-stat-toast{margin:9px 1.5%;padding:8px 11px;border-radius:10px;background:#fff3d7;color:#563917;font-size:13px;font-weight:750;text-align:center;}
#hard-card{text-align:center;background:#fff9ee;color:#47354b;}
#hard-card h2{margin:0 0 8px;}
#hard-card p{margin:8px 0;line-height:1.35;}
#hard-start{margin-top:8px;min-width:125px;}
#game .tools:has(#sweep[hidden]){grid-template-columns:repeat(2,minmax(0,1fr));width:min(100%,190px);}
#find-praise{
 position:absolute;z-index:4;pointer-events:none;inset:auto 0 calc(100% + 3px);margin:auto;width:max-content;max-width:95%;
 padding:3px 12px;text-align:center;border-radius:10px;background:#fff5d8;color:#65420b;
 box-shadow:0 1px 7px #79581a34;font-size:clamp(14px,4.5cqw,20px);font-weight:900;line-height:1.15;
}
#find-praise small{display:block;color:#70418c;font-size:11px;margin-top:3px;}
#board .reveal-reward{z-index:3;font-size:11px;top:54%;padding:2px 5px;line-height:1.1;}
@keyframes bloom-reward {
 0%{transform:translate(-50%,2px) scale(.65);opacity:0}
 24%{opacity:1}
 68%{opacity:1}
 100%{transform:translate(-50%,-17px) scale(1);opacity:0}
}
.score-pollen{position:fixed;z-index:5;width:6px;height:6px;margin:-3px 0 0 -3px;background:#f5b84b;border-radius:50%;box-shadow:0 0 4px #f7d478;pointer-events:none;}
.score-pollen:nth-of-type(2n){width:4px;height:4px;background:#ffd988;}
@media(prefers-reduced-motion:reduce){#board .reveal-reward{animation:none;transform:translateX(-50%);}}
#find-praise[data-tier="0"]{color:#32684d;background:#e8f6df;}
#find-praise[data-tier="1"]{color:#315a82;background:#e6f5ff;}
#find-praise[data-tier="2"]{color:#993b5f;background:#ffedf1;}
#find-praise[data-tier="3"]{color:#6c3c89;background:#f3e7ff;}
#find-praise[data-tier="4"]{color:#80510e;background:#fff0b5;}
#level-stat-toast{position:absolute;z-index:4;inset:34% 2% auto;margin:0;background:#291e35ef;color:#fff1cc;pointer-events:none;}
#hard-card[open]{
 inset:0;margin:auto;width:min(84%,340px);height:max-content;
 color:#fff5e7;background:#30233a;border:0;border-radius:18px;
 box-shadow:0 10px 44px #1b13224d;
}
#hard-card::backdrop{background:#211a2c40;}
#hard-card h2{color:#ffad95;}
#hard-card #hard-start{background:#f6c371;border:0;box-shadow:none;color:#3b2614;}

#game .tools:has(#finder[hidden]):has(#sweep[hidden]){grid-template-columns:1fr;width:min(100%,94px);margin-inline:auto}
#game #board-sound{box-sizing:border-box;flex:0 0 40px;width:40px;height:40px;min-width:40px;min-height:40px;border-radius:50%}
#game .board-instructions .instruction{font-size:clamp(13px,3.65vw,16px);line-height:1.3}