.trainyard{display:grid;align-content:start;gap:var(--space-3);padding:var(--space-3);height:100%;background:var(--orange-2)}.trainyard header{display:flex;justify-content:space-between;align-items:baseline;p{margin:0}}.trainyard ol{list-style:none;padding:0;margin:0}.trainyard .levels button{width:100%;display:grid;grid-template-columns:2ch minmax(10ch,1fr) 1fr auto auto;align-items:center;gap:var(--space-2);text-align:left;&:hover{background:var(--bone-3);border-color:var(--bone-4)}&.complete{background:var(--bone-2);border-color:var(--bone-3);&:hover{background:var(--bone-3);border-color:var(--bone-4)}}span:first-child{color:var(--color-dim)}.level-colors{display:flex;gap:4px;justify-content:flex-end;i{width:3rem;height:2px}i[data-color=red]{background:var(--train-red)}i[data-color=green]{background:var(--train-green)}i[data-color=blue]{background:var(--train-blue)}i[data-color=yellow]{background:var(--train-yellow)}i[data-color=orange]{background:var(--train-orange)}i[data-color=purple]{background:var(--train-purple)}}span:last-child{text-transform:uppercase;color:var(--red-4);&.solved{color:var(--green-4)}}}.trainyard main{display:grid;gap:var(--space-3);grid-template-rows:1fr min-content}.trainyard .board{position:relative;display:flex;place-content:center;align-items:center;justify-content:center}.trainyard .board>div{width:var(--board-width);height:var(--board-height);background:var(--bone-2);border:1px solid var(--bone-3);background-image:linear-gradient(to right,var(--bone-3) 1px,transparent 1px),linear-gradient(to bottom,var(--bone-3) 1px,transparent 1px);background-size:var(--cell-size) var(--cell-size);background-position:-.5px -.5px;background-origin:content-box;background-clip:content-box}.trainyard .board aside{position:absolute;inset:0;background:#000000bf;display:flex;align-items:center;justify-content:center;z-index:10;backdrop-filter:blur(2px)}.trainyard .board aside>div{text-align:center;display:grid;gap:var(--space-3)}.trainyard .board aside[data-status=won] h1{color:var(--green-4)}.trainyard .board aside[data-status=lost] h1{color:var(--red-4)}.trainyard .board aside menu{display:flex;gap:var(--space-2);justify-content:center;margin:0;padding:0}.trainyard .controls{display:flex;gap:var(--space-1);place-content:center;>section{display:grid;gap:var(--space-1);border:1px solid var(--bone-3);padding:var(--space-1);background:var(--bone-1)}h3{text-transform:uppercase;color:var(--color-dim);font-weight:400;font-size:var(--font-0);margin:0}menu{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-1);margin:0;padding:0;&.tools-5col{grid-template-columns:repeat(5,1fr)}button{display:grid;grid-template-columns:1fr auto;align-items:center;gap:var(--space-1);text-transform:uppercase;background:var(--bone-2);border:1px solid var(--bone-3);&:hover{background:var(--bone-3);border-color:var(--bone-4)}&.active{background:var(--red-3);border-color:var(--red-4);color:var(--bone-5);kbd{color:var(--bone-5)}}span{text-align:left}}}kbd{background:var(--bone-3);border-radius:2px;min-width:2ch}section>div:has(button[data-color]){display:flex;gap:var(--space-1)}button[data-color]{flex:1;min-height:1.75rem;padding:0;border:1px solid var(--bone-3);&.active{border-color:var(--bone-5)}}[data-color=red]{background:var(--train-red)}[data-color=green]{background:var(--train-green)}[data-color=blue]{background:var(--train-blue)}[data-color=yellow]{background:var(--train-yellow)}[data-color=orange]{background:var(--train-orange)}[data-color=purple]{background:var(--train-purple)}form{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-1);label{display:grid;gap:2px;text-transform:uppercase;font-size:var(--font-0)}input,select{width:100%;background:var(--bone-2);border:1px solid var(--bone-3)}}section>menu:has(>:only-child){grid-template-columns:1fr}pre{max-height:10rem;overflow:auto;margin:0}}.trainyard button{text-transform:uppercase;background:var(--bone-2);border:1px solid var(--bone-3);&:hover{background:var(--bone-3);border-color:var(--bone-4)}}main[data-astro-cid-azpb4poq]{width:100%;height:100%;display:grid;grid-template-rows:auto 1fr}