.metro-page{max-width:1100px}.metro-shell{background:#fff;color:#17101f;color-scheme:light;border:3px solid #17101f;border-radius:18px;padding:clamp(1rem,3vw,1.6rem);box-shadow:8px 8px 0 #b79ce7}.metro-top,.metro-stats,.metro-actions{display:flex;gap:.7rem;align-items:center;justify-content:space-between;flex-wrap:wrap}.metro-top h2{margin:0}.metro-top label{font-weight:800}.metro-top select{margin-left:.45rem}.metro-stats{margin:1rem 0}.metro-stats div{min-width:96px;border:2px solid #17101f;border-radius:10px;padding:.45rem .65rem;background:#f6f0ff}.metro-stats small,.metro-stats strong{display:block}.metro-stage{display:grid;place-items:center;padding:.8rem;background:#17101f;border-radius:14px}.metro-board{--m:6;width:min(78vw,560px);aspect-ratio:1;display:grid;grid-template-columns:repeat(var(--m),1fr);gap:3px}.metro-cell{position:relative;min-width:0;border:0;border-radius:4px;background:#f4effc;color:#17101f;padding:0;touch-action:manipulation}.metro-cell.path{background:var(--line,#7340a8)}.metro-cell.station{border-radius:50%;box-shadow:inset 0 0 0 3px #17101f;background:var(--line,#7340a8);z-index:2}.metro-cell span{font-weight:900;font-size:clamp(.7rem,2.5vw,1.15rem);color:#17101f;text-shadow:0 1px #fff}.metro-cell[data-color=violet]{--line:#b98cff}.metro-cell[data-color=cyan]{--line:#5dd9e8}.metro-cell[data-color=gold]{--line:#ffd65c}.metro-cell[data-color=rose]{--line:#ff7fa4}.metro-cell[data-color=lime]{--line:#a9e46e}.metro-cell[data-color=blue]{--line:#78a8ff}.metro-cell[data-color=orange]{--line:#ffad68}.metro-cell[data-color=white]{--line:#f8f8f8}.metro-cell.cursor,.metro-cell:focus-visible{outline:3px solid #fff;outline-offset:-5px;box-shadow:inset 0 0 0 3px #17101f}.metro-actions{margin-top:1rem}.metro-actions button{min-height:46px}.metro-note,.metro-status{font-weight:700}.metro-status{min-height:1.5em}@media(max-width:600px){.metro-shell{padding:.75rem}.metro-board{width:min(88vw,520px);gap:2px}.metro-stats div{min-width:74px}.metro-actions button{flex:1 1 45%}}