.playground{margin:0 0 24px;padding:15px;border:1px solid #2c7540;background:linear-gradient(140deg,#0b2512,#050e08);border-radius:8px}.play-status{font:15px var(--mono);color:#b8ffca;margin:9px 0 12px}.play-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px}.play-actions button{min-height:40px;padding:9px 7px;font:11px var(--mono);text-align:left;color:#d6ffe0;background:#091a0e;border-color:#2c633a}.play-actions button:hover{background:#173b21;border-color:#7aff99}.play-actions button:disabled{opacity:.4;cursor:default}.play-help,.archive-intro,.archive-credit{color:#aecbb7;font-size:12px;line-height:1.65}.play-help{margin-bottom:0}.archive-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}.archive-plate{display:flex;flex-direction:column;overflow:hidden;padding:0;background:#030805;border:1px solid #285f37;border-radius:6px;text-align:left}.archive-plate img{display:block;width:100%;height:150px;object-fit:contain;background:#000;transition:transform .2s,filter .2s;filter:saturate(.7)}.archive-plate:hover img{transform:scale(1.035);filter:saturate(1)}.archive-plate:hover{border-color:#80ff9c;box-shadow:0 0 16px #31ff6a18}.archive-plate span{display:flex;align-items:center;gap:7px;padding:10px 8px;min-height:55px;color:#e4ffec;font:11px/1.4 var(--mono)}.archive-plate small{color:#72bc87;font-size:9px}.archive-plate b{margin-left:auto;color:#7dff9e}.archive-credit{font-size:10px;margin-top:20px}body>dialog.image-viewer{position:fixed;inset:0;z-index:50;margin:auto;width:min(1100px,95vw);height:min(940px,94dvh);max-height:94dvh;padding:16px;overflow:auto;flex-direction:column;gap:10px;color:#e8ffef;background:#030b06;border:1px solid #438f58;border-radius:10px;box-shadow:0 20px 100px #000c}.image-viewer[open]{display:flex}.image-viewer::backdrop{background:#000d;backdrop-filter:blur(5px)}.plate-header{display:flex;justify-content:space-between;align-items:center;gap:15px}.plate-header h2{font:20px/1.3 var(--mono);margin:6px 0}.plate-header button,.plate-toolbar button,.plate-zone-links button{padding:9px 12px;min-height:38px;border:1px solid #316c42;color:#c8ffd7;background:#0b1e12;font:12px var(--mono)}.plate-stage{display:flex;align-items:center;justify-content:center;flex:1;min-height:180px;overflow:hidden;background:#000;border:1px solid #193d24;border-radius:5px;touch-action:none;cursor:grab}.plate-stage:active{cursor:grabbing}.plate-stage img{max-width:100%;max-height:100%;object-fit:contain;user-select:none;flex:none;width:auto;height:auto}.plate-toolbar{display:flex;justify-content:center;gap:7px;flex-wrap:wrap}.plate-description{font:12px/1.5 var(--mono);color:#c1daca;margin:0}.plate-zone-links{display:flex;gap:6px;flex-wrap:wrap}.plate-zone-links button{padding:7px 9px;min-height:32px;font-size:11px}.plate-hint{margin:0;font:10px/1.5 var(--mono);color:#88b997}@media(max-width:720px){.archive-plate img{height:190px}body>dialog.image-viewer{padding:10px;gap:8px;width:98vw;height:96dvh;max-height:96dvh}.plate-header h2{font-size:15px}.plate-hint{display:none}.plate-toolbar button{padding:8px 10px}.play-actions button{min-height:44px}}
.plate-stage{position:relative}.plate-stage img{position:absolute;inset:0;width:100%;height:100%;max-width:none;max-height:none;object-fit:contain}
.route-hover-card{position:absolute;z-index:8;pointer-events:none;max-width:260px;padding:12px 15px;border:1px solid #66ef8b;border-radius:6px;background:rgba(2,14,6,.97);box-shadow:0 8px 28px #000a,0 0 17px #38f37120;color:#e6ffed;font:12px/1.5 var(--mono)}.route-hover-card strong{display:block;font-size:17px;color:#9dffb5;letter-spacing:.04em}.route-hover-card span{display:block;margin-top:4px;color:#c3dfcd;font-size:11px}
.topology-controls{margin-bottom:18px;padding:14px;border:1px solid #2b7140;border-radius:7px;background:#07170d}.topology-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:10px}.topology-buttons button{padding:9px 4px;min-height:38px;font:10px var(--mono);color:#b8e3c6;border-color:#2e6440;background:#0b2113}.topology-buttons button[aria-pressed=true]{color:#edfff1;background:#1b542c;border-color:#83ffab;box-shadow:0 0 15px #4cff7622}.topology-status{font:10px/1.7 var(--mono);color:#9bbfa7;margin:10px 0 0}
.region-rail-block{pointer-events:auto;cursor:pointer;transition:color .15s,text-shadow .15s}.region-rail-block:hover,.region-rail-block:focus-visible{color:#c5ffd6;text-shadow:0 0 12px #50ff88;outline:1px solid #55d981;outline-offset:-2px}.topology-buttons button:hover,.topology-buttons button:focus-visible{background:#174e2a;border-color:#85ffb0;color:#f0fff4;box-shadow:0 0 16px #56ff8540}
