/* adsb-station — app-local layout only. The design system (.tl-*, tokens, fonts) comes from https://style.trzeciak.cloud/tl.css — don't redefine it here. font-size stays off (sizing the root rescales every rem). */ html { background: var(--color-tl-bg); } body { min-height: 100dvh; } /* ── Hub ─────────────────────────────────────────────────────────────── */ .hub { max-width: 1100px; margin: 0 auto; padding: 2.5rem 2rem 1rem; } /* Readout tiles. The 1px gap over a border-colored background paints clean grid lines regardless of how many tiles wrap onto the last row. */ .readout-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); gap: 1px; background: var(--color-tl-border); border: 1px solid var(--color-tl-border); } .readout-cell { background: var(--color-tl-surface); padding: 1.25rem 1rem; } .readout-value { font-size: 2rem; line-height: 1.2; margin-top: 0.35rem; } .readout-unit { font-size: 0.7rem; color: var(--color-tl-teal-dim); margin-left: 0.25rem; } .readout-status { display: flex; flex-direction: column; gap: 0.6rem; align-items: flex-start; } /* View launcher buttons (links styled as action buttons) */ .view-cards { display: flex; gap: 1rem; flex-wrap: wrap; } .view-card { padding: 1.1rem 2rem; font-size: 0.8rem; } /* ── Wrapper (frame) pages: header + nav + full-bleed iframe ──────────── */ body.frame { display: flex; flex-direction: column; height: 100dvh; overflow: hidden; } body.frame .view-frame { flex: 1 1 auto; width: 100%; border: 0; display: block; }