.trail-grid { width: min(100%, 29rem); aspect-ratio: 1; display: grid; grid-template-columns: repeat(5, 1fr); gap: .48rem; margin: .2rem auto 0; padding: .65rem; border: 2px solid var(--navy); border-radius: 18px; background: var(--paper-deep); }
.trail-tile { position: relative; border: 0; border-radius: 14px; background: var(--white); color: var(--navy); font-size: clamp(1.25rem, 6vw, 2rem); font-weight: 900; box-shadow: 1px 3px 0 rgba(23,50,77,.15); cursor: pointer; }
.trail-tile.selected { background: var(--mustard); transform: scale(.93); }
.trail-tile.selected::after { content: attr(data-step); position: absolute; top: .2rem; right: .35rem; color: rgba(23,50,77,.6); font-size: .62rem; }
.trail-tile.used { background: #c7e0d1; color: #245a48; }
.found-list { display: flex; flex-wrap: wrap; justify-content: center; gap: .45rem; margin: 1.25rem auto 0; }
.found-word { padding: .45rem .7rem; border-radius: 999px; background: #c7e0d1; color: #245a48; font-size: .76rem; font-weight: 900; letter-spacing: .06em; }
.message.bump { animation: bump .28s ease; } @keyframes bump { 50% { transform: scale(1.05); } }
@media(max-width:420px){.trail-grid{gap:.32rem;padding:.45rem;border-radius:14px}.trail-tile{border-radius:10px}}
@media(max-height:620px) and (orientation:landscape){.word-game{display:grid;grid-template-columns:minmax(14rem,.8fr) minmax(0,1.2fr);grid-template-rows:auto auto auto auto 1fr;gap:0 .75rem}.word-header,.intro,.status-row,.message,.actions,.found-list{grid-column:1}.word-header{grid-row:1}.intro{grid-row:2}.status-row{grid-row:3}.message{grid-row:4}.actions{grid-row:5;align-self:start}.trail-grid{grid-column:2;grid-row:1/-1;width:min(100%,calc(100dvh - .7rem));height:min(100%,calc(100dvh - .7rem));margin:0 auto;gap:.22rem;padding:.35rem;border-radius:11px}.trail-tile{border-radius:8px;font-size:clamp(.8rem,4vh,1.2rem)}.found-list{display:none}}