.tool,.icon-button{display:inline-flex;align-items:center;justify-content:center}
.text-button{display:inline-flex;align-items:center;gap:12px}
.headline{margin-bottom:22px}
.board-shell,#board{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.destination-dot{opacity:0;fill:#a8d7ff}
.placing .empty .destination-dot{opacity:.85}
.navigation{display:flex;align-items:center;gap:10px}
.tool,.icon-button{min-width:48px;min-height:48px}
.puzzle,.primary,#hint{min-height:48px}
.board-shell{aspect-ratio:895/290}
.board-top{padding-bottom:12px;font-size:13px}
.board-bottom{font-size:16px}
@media(max-width:600px){
  .headline{margin-bottom:16px}.headline h1{font-size:26px}
  main{padding-top:18px}
  .board-shell{aspect-ratio:895/360}
  .board-top{font-size:12px}
  .board-bottom{font-size:15px;min-height:64px}
  .controls{display:grid;grid-template-columns:1fr;gap:12px}
  .tools{justify-content:center;gap:16px}
  .navigation{justify-content:space-between}
  #previous{width:64px}.primary{font-size:16px}
  #hint{font-size:16px}.puzzle{font-size:16px}
}
@media(orientation:landscape) and (max-height:550px){
  header,.headline,footer{display:none}
  main{padding:8px 18px;max-width:1000px}
  #packs{margin-bottom:6px}#packs button{padding:5px;min-height:36px}
  .play-area{margin:0}
  .board-top{padding:8px 14px 0}
  .board-shell{aspect-ratio:auto;height:clamp(145px,49dvh,260px)}
  .board-bottom{min-height:28px;padding:0 14px 6px;font-size:14px;align-items:center}
  .controls{display:flex;padding:8px 0;gap:12px}
  .tools{gap:8px}.navigation{gap:10px}
  .puzzles{grid-template-columns:repeat(10,minmax(0,1fr));gap:6px}
}
#packs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:16px}
#packs button{justify-content:center;padding:10px 4px;font-size:14px;border-bottom:3px solid transparent}
#packs button.active{border-bottom-color:#b88013;background:#f4e6b9;color:#252927}
@media(min-width:601px) and (max-height:850px){main{padding-top:22px}.headline h1{font-size:32px}.eyebrow{margin-bottom:8px}.headline{margin-bottom:18px}.controls{padding:14px 0 18px}footer{margin-top:22px}}
