/* Hexa Hugs uses Neuriosity's blue exterior and a color + letter identity per piece. */
[data-game-mount="hexa-hugs"] { background: #effaff; }
.hh-game { --hh-navy:#062b63; justify-content:flex-start; gap:8px; padding:18px 18px 12px; background:radial-gradient(ellipse at 50% 36%,#f6fcff 0,#e7f5ff 65%,#d8edff 100%); color:var(--hh-navy); overflow:auto; min-height:0; }
.hh-header { display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;padding-right:38px;text-align:left;flex-shrink:0; }
.hh-eyebrow {font-size:10px;letter-spacing:.16em;font-weight:800;color:#1267b4;}
.hh-header h2 {font-size:clamp(16px,4.5vw,23px);line-height:1.1;margin:3px 0 0;font-weight:800;}
.hh-level-label {display:flex;align-items:center;gap:6px;font-size:12px;}
.hh-level-label select {min-height:36px;border:1px solid #aacbe9;border-radius:10px;background:#fff;color:#062b63;font:inherit;padding:4px;}
.hh-progress {display:flex;justify-content:space-between;gap:8px;width:100%;font-size:12px;color:#375e85;flex-shrink:0;}
.hh-progress span:first-child {font-weight:700;}
.hh-board-wrap {width:100%;flex:1 1 190px;min-height:160px;display:flex;align-items:center;justify-content:center;}
.hh-board {display:block;width:100%;height:100%;max-height:380px;overflow:visible;touch-action:none;filter:drop-shadow(0 4px 0 #b2d5ed);}
.hh-cell {cursor:pointer;outline:none;}
.hh-cell:focus-visible .hh-tile-outline {stroke:#062b63;stroke-width:4;stroke-opacity:1;stroke-dasharray:4 2;}
.hh-cell.is-selected .hh-tile-outline {stroke:#0878e8;stroke-width:3;stroke-opacity:1;}
.hh-cell text {pointer-events:none;}
.hh-tray {width:100%;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;flex-shrink:0;}
.hh-piece {position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;min-height:62px;border:1px solid #bdd6ec;border-radius:13px;background:#fff;color:#062b63;padding:3px;cursor:grab;touch-action:none;font:inherit;box-shadow:0 2px 0 #c5dced;}
.hh-piece svg {display:block;width:100%;height:45px;pointer-events:none;}
.hh-piece span {font-size:10px;line-height:1.1;font-weight:700;pointer-events:none;}
.hh-piece.is-placed {background:#dcecf8;box-shadow:none;}
.hh-piece.is-placed svg {opacity:.52;}
.hh-piece[aria-pressed="true"] {border:2px solid #0878e8;background:#edf8ff;padding:2px;}
.hh-piece:focus-visible,.hh-actions button:focus-visible,.hh-footer button:focus-visible,.hh-level-label select:focus-visible {outline:3px solid #0878e8;outline-offset:2px;}
.hh-status {margin:0;min-height:32px;font-size:12px;line-height:1.35;max-width:540px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.hh-actions {display:flex;flex-wrap:wrap;justify-content:center;gap:5px;flex-shrink:0;}
.hh-actions button,.hh-footer button {border:1px solid #abcce7;border-radius:10px;background:#fff;color:#062b63;padding:7px 10px;min-height:36px;font:inherit;font-size:12px;font-weight:700;cursor:pointer;}
.hh-actions button:disabled {opacity:.45;cursor:default;}
.hh-actions button:hover:not(:disabled) {background:#dff4ff;}
.hh-footer {display:flex;justify-content:space-between;align-items:center;width:100%;gap:10px;flex-shrink:0;}
.hh-footer .hh-finish {background:transparent;border-color:transparent;color:#315d88;}
.hh-footer .hh-next {background:#0878e8;border-color:#0878e8;color:#fff;}
.hh-help {font-size:12px;line-height:1.5;text-align:left;flex-shrink:0;padding:8px;background:#fff;border-radius:9px;}
.hh-game [hidden] {display:none!important;}
.hh-drag {position:fixed;pointer-events:none;z-index:10000;filter:drop-shadow(0 6px 4px #062b6340);opacity:.96;}
.hh-drag svg {width:100%;height:100%;}
.hh-game.is-complete .hh-board {animation:hh-hug .7s ease;}
@keyframes hh-hug {50% {filter:drop-shadow(0 0 10px #49baff);transform:scale(1.025);}}
.play-frame--hexa .play-frame__screen {aspect-ratio:auto;height:690px;max-height:none;}
@media(max-width:520px) {
  .hh-game {padding:12px 10px 8px;gap:6px;}
  .hh-header {padding-right:32px;gap:6px;}
  .hh-header h2 {font-size:18px;}
  .hh-level-label {font-size:11px;gap:4px;}
  .hh-level-label select {font-size:16px;max-width:89px;}
  .hh-progress {font-size:11px;}
  .hh-actions button {font-size:11px;padding:6px 8px;}
  .hh-tray {gap:5px;}
  .play-frame--hexa .play-frame__screen {height:650px;}
}
@media(pointer:coarse) {.hh-actions button,.hh-footer button {min-height:44px;}.hh-piece {min-height:67px;}}
@media(prefers-reduced-motion:reduce){.hh-game.is-complete .hh-board {animation:none;}}

.hh-header > div {min-width:0;}
.hh-level-label {flex-shrink:0;}
.hh-eyebrow {letter-spacing:.09em;}