*{box-sizing:border-box}body{margin:0;background:#10151d;color:#edf2f8;font:15px/1.6 system-ui,sans-serif}main{max-width:1120px;margin:auto;padding:38px 28px}header{margin-bottom:28px}.eyebrow{font-size:11px;letter-spacing:3px;color:#85e4c1}h1{font-size:46px;line-height:1.12;letter-spacing:-2px;margin:12px 0}h1 span{font-size:18px;letter-spacing:0;color:#8696ac;font-weight:400;margin-left:24px}p{color:#a5b2c4;margin:12px 0}.layout{display:grid;grid-template-columns:1.4fr 1fr;gap:24px}.stage{position:relative;border:1px solid #2b3645;border-radius:24px;background:radial-gradient(ellipse at 50% 40%,#2a3b51,#17212e 60%,#141c27);overflow:hidden;align-self:start}.stats{display:flex;justify-content:space-between;padding:20px 24px;color:#8ce9c4;font-size:13px}canvas{width:100%;height:auto;display:block;touch-action:none;cursor:grab;outline-offset:-5px}.orbit{text-align:center;margin:0 0 22px;font-size:12px}aside{border:1px solid #2b3645;background:#181f2a;border-radius:24px;padding:24px}h2{font-size:21px;margin:0}#faces{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:20px 0}.face{display:flex;gap:3px;border-top:3px solid var(--color);border-radius:9px;background:#273244}.face button{width:50%;border:0;background:transparent;padding:10px 4px;font-size:19px}button,select{font:inherit;color:inherit;background:#252f3f;border:1px solid #3b4a60;border-radius:9px;padding:10px 14px;cursor:pointer}button:hover{background:#35475c}button:disabled{opacity:.4;cursor:wait}button:focus-visible,select:focus-visible{outline:2px solid #8ce9c4;outline-offset:3px}.actions{display:flex;gap:10px}.actions button{flex:1}hr{border:0;border-top:1px solid #303b4b;margin:23px 0}label{display:block;font-size:12px;color:#a5b2c4}select,.primary,#reset{width:100%;margin-top:10px}.primary{background:#8ce9c4;color:#10271f;border:0;font-weight:700}.primary:hover{background:#b1f7db}#message{font-size:13px;min-height:43px;color:#b3ebd8}details{font-size:12px;color:#a5b2c4}summary{cursor:pointer}footer{font-size:11px;color:#718197;margin-top:24px}a{color:#aac9db}@media(max-width:720px){main{padding:22px 16px}h1{font-size:36px}h1 span{display:block;margin:12px 0 0}.layout{grid-template-columns:1fr}.stage{max-width:480px;width:100%;margin:auto}canvas{margin-top:-35px;margin-bottom:-25px}aside{padding:20px}}