:root{--tr-c0: #d8334a;--tr-c1: #2a4fa8;--tr-c2: #dc9a00;--tr-card: #ffffff;--tr-card-edge: #e3e5df;--tr-sel: var(--text)}html.dark{--tr-c0: #ff7a86;--tr-c1: #4a74e0;--tr-c2: #f4c94e;--tr-card: #1d2433;--tr-card-edge: #2c3546;--tr-sel: #eef0f4}main.tr-main{padding-top:12px;gap:10px}.tr-defs{position:absolute;width:0;height:0;overflow:hidden}.tr-bar{display:flex;justify-content:space-between;align-items:center;padding:0 2px}.tr-progress,.tr-clock{display:flex;align-items:baseline;gap:8px}.tr-lbl{color:var(--muted);font-size:.82rem;font-weight:700;letter-spacing:.02em}.tr-bar b{font-weight:900;font-size:1.15rem;font-variant-numeric:tabular-nums;letter-spacing:-.01em}.tr-board{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.tr-card{position:relative;aspect-ratio:5 / 3;border-radius:12px;background:var(--tr-card);box-shadow:0 0 0 1px var(--tr-card-edge),0 1px 2px #141a2a0f;display:grid;place-items:center;padding:0 4px;transition:transform .14s var(--ease),box-shadow .14s var(--ease)}.tr-card svg{width:100%;height:100%;display:block}.tr-card:active{transform:scale(.96)}.tr-card[aria-pressed=true]{box-shadow:0 0 0 3px var(--tr-sel),0 6px 16px #141a2a29;transform:translateY(-2px)}.tr-card.hinted:after{content:"";position:absolute;inset:-5px;border-radius:15px;border:2.5px dashed var(--warn);pointer-events:none;animation:tr-breathe 1.6s ease-in-out infinite}.tr-card:disabled{cursor:default}.tr-card.pop{animation:tr-pop .22s var(--ease-bounce)}.tr-card.shake{animation:sh-shake .45s;box-shadow:0 0 0 3px var(--bad)}.tr-card.good{animation:tr-good .5s var(--ease)}@keyframes tr-pop{0%{transform:scale(.94)}60%{transform:scale(1.04) translateY(-2px)}to{transform:translateY(-2px)}}@keyframes tr-good{0%{box-shadow:0 0 0 3px var(--good)}to{box-shadow:0 0 0 1px var(--tr-card-edge)}}@keyframes tr-breathe{50%{opacity:.45}}.tr-status{min-height:1.45em;text-align:center;font-weight:700;font-size:.92rem;color:var(--muted)}.tr-status[data-tone=good]{color:var(--good)}.tr-status[data-tone=bad]{color:var(--bad)}.tr-status.in{animation:tr-in .25s var(--ease)}@keyframes tr-in{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}.tr-found{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.tr-slot{height:42px;border-radius:10px;border:1.5px dashed var(--border);display:flex;align-items:center;justify-content:center;gap:4px;padding:4px}.tr-slot.done{border:0;background:var(--surface-2)}.tr-slot.land{animation:tr-land .6s var(--ease) .4s both}@keyframes tr-land{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:none}}.tr-slot-n{color:var(--muted);font-weight:800;font-size:.8rem;opacity:.6}.tr-mini{height:100%;aspect-ratio:5 / 3;border-radius:5px;background:var(--tr-card);box-shadow:0 0 0 1px var(--tr-card-edge);display:grid;place-items:center;transition:opacity .1s}.tr-mini svg{width:100%;height:100%;display:block}.tr-ghost{position:fixed;z-index:50;border-radius:12px;background:var(--tr-card);box-shadow:0 0 0 2px var(--good),0 10px 24px #141a2a33;transform-origin:0 0;pointer-events:none;padding:0 4px}.tr-ghost svg{width:100%;height:100%;display:block}.tr-actions{display:flex;justify-content:center;gap:10px;margin-top:4px}.tr-actions .sh-btn{min-width:140px}.tr-actions small{font-weight:800;font-size:.78rem;color:var(--muted)}.tr-end{text-align:center;display:grid;gap:10px;justify-items:center;margin-top:4px}.tr-result{display:grid;gap:12px;justify-items:center;margin:4px 0 8px}.tr-stars{font-size:2rem;letter-spacing:4px;color:var(--warn);line-height:1}.tr-stars span{color:var(--surface-3)}.tr-share-grid{font-size:1.3rem;letter-spacing:2px;line-height:1}.tr-breakdown{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;width:100%}.tr-breakdown div{display:grid;gap:2px;text-align:center;background:var(--surface-2);border-radius:10px;padding:8px 4px}.tr-breakdown span{font-size:.72rem;color:var(--muted);font-weight:700}.tr-breakdown b{font-size:.95rem;font-weight:900;font-variant-numeric:tabular-nums}.tr-example{display:flex;justify-content:center;gap:8px;margin:2px 0 12px}.tr-example .tr-mini{height:54px;border-radius:8px;box-shadow:0 0 0 1px var(--tr-card-edge),0 1px 2px #141a2a0f}.tr-trains{color:var(--muted);font-weight:700}@media(max-height:700px){.tr-slot{height:36px}.tr-board{gap:6px}}
