.guide-content{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:20px;align-items:start}
#guide-board{display:grid;grid-template:repeat(8,minmax(0,1fr)) / repeat(8,minmax(0,1fr));width:100%;aspect-ratio:1;box-sizing:border-box;border:1px solid #aa849f}
#guide-board .guide-square{position:relative;display:grid;place-items:center;min-width:0;min-height:0;padding:0;border:0;border-radius:0;overflow:hidden;background:#596271!important;touch-action:manipulation}
#guide-board .dark{background:#272f3b!important}
#guide-board .selected{box-shadow:inset 0 0 0 3px #ffd599}
#guide-board .legal{box-shadow:inset 0 0 0 2px #a5dca8}
#guide-board .guide-square small{position:absolute;bottom:1px;right:2px;color:#fff;font-size:10px;text-shadow:0 1px 2px #000}
#guide-board .unit-art{width:85%;height:85%;pointer-events:none}
.guide-copy p{line-height:1.65}
#guide-feedback{min-height:2.2em;color:#ffdbac}
.guide-actions{display:flex;flex-wrap:wrap;gap:8px}
.guide-actions button{min-height:44px}
@media(max-width:650px){
 .guide-content{grid-template-columns:1fr;gap:10px}
 .guide-copy{display:contents}
 #guide-board{grid-row:3}
 .guide-intro-copy{grid-row:1}
 #guide-task{grid-row:2;margin:0}
 #guide-feedback{grid-row:4;margin:0}
 .guide-actions{grid-row:5}
 .app-nav{grid-template-columns:repeat(4,minmax(0,1fr))}
}