:root{color-scheme:dark;font-family:system-ui,sans-serif;color:#f7e9d5;background:#15101e}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 20% 20%,#30223e,transparent 65%),#15101e}main{max-width:1200px;margin:auto;padding:40px 30px}header{margin-bottom:28px}.eyebrow{letter-spacing:3px;font-size:11px;color:#c7a88b}h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(40px,6vw,70px);margin:8px 0}h1 span{color:#efb85c;font-size:30px;margin-left:20px}.lede{color:#c6b4cb;font-size:17px;margin:0}.layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(290px,1fr);gap:35px;align-items:start}.board{position:relative;aspect-ratio:1;border:1px solid #6b4c5b;border-radius:28px;overflow:hidden;box-shadow:0 24px 70px #0008}.board>img{width:100%;height:100%;object-fit:cover}.board svg,#nodes{position:absolute;inset:0;width:100%;height:100%}.node{position:absolute;transform:translate(-50%,-50%);width:44px;height:44px;border-radius:50%;border:2px solid #dfc8a1;background:#211829e8;color:#fff5dd;font-size:18px;font-weight:700;padding:0;box-shadow:0 0 18px #f6b75a66}.node.selected{background:#fac067;color:#241728;outline:4px solid #fff5}.node:focus-visible,button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #fff;outline-offset:4px}button,select{font:inherit;cursor:pointer}button{border:1px solid #715974;border-radius:10px;padding:11px 14px;background:#35273d;color:#f7ead8;transition:background .15s}button:hover{background:#503951}button:disabled{cursor:default;opacity:.5}.legend{display:flex;justify-content:center;flex-wrap:wrap;gap:20px;font-size:12px;margin:15px;color:#d9c7df}.legend span:first-child{color:#ffc46b}.legend span:last-child{color:#c1a1ff}aside{padding:24px;background:#211927d9;border:1px solid #49354b;border-radius:20px}.topline{display:flex;justify-content:space-between;gap:10px;font-size:11px;color:#c4aac8}.pill{letter-spacing:1px;color:#e8b365}h2{font-family:Georgia,serif;font-size:28px;font-weight:400;margin:22px 0 10px}#message{min-height:54px;line-height:1.5;color:#d7c7dc}.controls{display:grid;grid-template-columns:1fr 1fr;gap:10px}.controls label,.controls select,.primary{grid-column:1/-1}label{font-size:12px;color:#b9a4c2}select{width:100%;padding:12px;background:#17111d;color:#f6e9d7;border:1px solid #715974;border-radius:10px}.primary{background:#e9b268;color:#251626;font-weight:700}.primary:hover{background:#ffd491}details{margin-top:23px;font-size:13px;line-height:1.6;color:#c5b4cd}summary{cursor:pointer;font-weight:650;color:#f2dfc8}#edgebuttons{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:10px}.record{font-size:12px;color:#c8afce;margin:22px 0 0}footer{text-align:center;color:#9e86aa;font-size:12px;line-height:1.8;margin-top:26px}a{color:#e4bc85}@media(max-width:760px){main{padding:24px 15px}.layout{grid-template-columns:1fr;gap:15px}aside{padding:20px}.node{width:38px;height:38px}header{margin-bottom:20px}.legend{gap:12px;font-size:11px}}