*{box-sizing:border-box}body{margin:0;color:#17253e;font-family:Arial,sans-serif;background:#f4f5fa}.stage{height:570px;position:relative;isolation:isolate;touch-action:pan-y;overflow:hidden}.ambient{position:absolute;inset:0;background:radial-gradient(ellipse at 36% 48%,#cad5fb8c,transparent 50%),radial-gradient(ellipse at 72% 45%,#c4eee76e,transparent 45%)}canvas,#nodes{position:absolute;inset:0;width:100%;height:100%}#nodes{pointer-events:none}.node{position:absolute;left:0;top:0;border:0;background:none;cursor:pointer;pointer-events:auto;padding:0;width:84px;text-align:center;color:#1d304c;will-change:transform}.disc{display:flex;align-items:center;justify-content:center;width:61px;height:61px;margin:0 auto 9px;border-radius:19px;background:linear-gradient(145deg,#fffffff5,#edf0facf);border:1px solid #fff;box-shadow:0 12px 28px #334d7e22,inset 0 -3px 6px #889cbd14}.disc img{width:33px;height:33px;object-fit:contain}.node b{display:inline-block;font-size:12px;font-weight:700;background:#f4f5facc;padding:3px 6px;border-radius:5px;white-space:nowrap}.node:hover .disc,.node[aria-pressed=true] .disc{box-shadow:0 0 0 2px #7386d5,0 12px 32px #718be64d}.node:focus-visible{outline:2px solid #4256a5;border-radius:15px}.core{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);text-align:center;pointer-events:none;width:220px;text-shadow:0 2px 18px #fff}.core>span{font-size:9px;font-weight:800;letter-spacing:.13em;color:#637493}.core strong{display:block;font-family:Georgia,serif;font-weight:400;font-size:29px;line-height:1.17;margin:12px 0;color:#1b2b4a}.core small{font-size:10px;color:#52647e}.stage-caption{position:absolute;bottom:17px;left:22px;display:flex;gap:19px;font-size:11px;color:#50617c}#motion{position:absolute;bottom:8px;right:20px;border:1px solid #c6cede;border-radius:30px;padding:10px 15px;background:#ffffffb0;color:#314568;font-size:11px;cursor:pointer}.readout{border-top:1px solid #d4daea;padding:25px 22px;display:grid;grid-template-columns:1fr 310px;gap:30px}.readout span{font-size:9px;font-weight:800;letter-spacing:.16em;color:#596b97}.readout h2{font-family:Georgia,serif;font-weight:400;font-size:26px;margin:10px 0}.readout p{font-size:14px;line-height:1.6;color:#53617a;margin:0;max-width:600px}#roster{display:flex;flex-wrap:wrap;gap:6px;align-content:center}#roster button{width:43px;height:43px;border:1px solid #d8dfea;background:#ffffffa0;border-radius:12px;cursor:pointer}#roster img{width:23px;height:23px;object-fit:contain}#roster button[aria-pressed=true]{border-color:#526ac7;background:#e4eafa}@media(max-width:600px){.stage{height:520px}.core{width:155px;top:46%}.core strong{font-size:23px}.core>span{font-size:7px}.core small{font-size:8px;display:block;max-width:125px;margin:auto}.disc{width:45px;height:45px;border-radius:14px}.disc img{width:26px;height:26px}.node{width:72px}.node b{font-size:10px}.stage-caption{left:12px;bottom:45px;font-size:10px}#motion{bottom:4px;right:12px}.readout{display:block;padding:20px 15px}.readout h2{font-size:23px}.readout p{font-size:13px;min-height:62px}#roster{margin-top:18px;gap:6px}#roster button{width:39px;height:39px}}
@media(max-width:600px){.core{width:120px;top:49%}.core strong{font-size:18px;margin:9px 0}.core>span{font-size:6px}.core small{font-size:7px;max-width:95px}.disc{width:37px;height:37px;margin-bottom:5px}.disc img{width:23px;height:23px}.node b{font-size:9px;padding:2px 3px}.node{width:64px}}
@media(min-width:601px){.core{width:170px;top:49%}.core strong{font-size:23px}.core>span{font-size:7px}.core small{font-size:9px}.disc{width:52px;height:52px}.disc img{width:29px;height:29px}}