/* Demo framing is deliberately separate from the copied product theme. */
#demo-toolbar{background:#15151e;color:#fff;border-bottom:1px solid #35353f;font-size:12px;position:relative;z-index:50}
.demo-toolbar-inner{min-height:46px;padding:8px 28px;display:flex;align-items:center;gap:18px;max-width:1800px;margin:auto}
.demo-wordmark{font-size:19px;font-weight:800;letter-spacing:-.7px;color:#fff;text-decoration:none;display:flex;align-items:center;gap:9px}
.demo-wordmark span{font-size:9px;letter-spacing:1.5px;background:#dd9e33;color:#15151e;padding:3px 6px;border-radius:4px}
.demo-role{font-weight:650;padding-left:18px;border-left:1px solid #50505b}.demo-context{color:#c4c4ce}
.demo-tools{display:flex;align-items:center;gap:16px;margin-left:auto;white-space:nowrap}
.demo-tools a{color:#eee;text-decoration:none}.demo-tools button{background:transparent;border:0;color:#fff;font:inherit;cursor:pointer;padding:5px 3px}
.demo-tools button[data-demo="guide"]{color:#f0bd64;font-weight:700}.demo-tools a:hover,.demo-tools button:hover{text-decoration:underline}
#demo-guide{position:fixed;right:20px;top:60px;bottom:20px;width:410px;max-width:calc(100vw - 32px);overflow:auto;background:#fff;z-index:90;border:1px solid #dcdce1;border-radius:20px;box-shadow:0 20px 70px #15151e33;padding:24px;font-family:inherit;color:#15151e}
#demo-guide[hidden]{display:none}.demo-guide-heading{display:flex;align-items:start;gap:15px}.demo-guide-heading h2{font-size:24px;line-height:1.2;letter-spacing:-.6px;margin:8px 0 14px}.demo-kicker{font-size:10px;letter-spacing:1.5px;color:#8b601b;font-weight:750}
.demo-guide-heading button{border:1px solid #dedee5;background:#f5f5f7;border-radius:50%;width:30px;height:30px;font-size:20px;flex-shrink:0;cursor:pointer;margin-left:auto}
#demo-guide>p{font-size:13px;color:#666672;line-height:1.65;margin:0 0 20px}.demo-steps{padding:0;list-style:none;margin:0;display:grid;gap:8px}.demo-steps li>button{display:flex;gap:12px;align-items:start;width:100%;text-align:left;border:1px solid #e4e4e9;border-radius:12px;background:#fff;color:#15151e;padding:14px 12px;cursor:pointer;font:inherit}.demo-steps li>button:hover{border-color:#dd9e33;background:#fffaf1}.demo-steps strong{display:block;font-size:13px;line-height:1.4}.demo-steps small{display:block;font-size:11px;line-height:1.6;color:#6d6d77;margin-top:5px}.demo-step-number{font-size:11px;color:#9a6a22;font-weight:750;padding-top:3px}.demo-steps .is-done>button{border-color:#d7e4dc;background:#f7faf7}.demo-steps .is-done .demo-step-number{color:#357453}
.demo-simulation{display:flex;align-items:center;justify-content:space-between;padding:18px 0;margin-top:12px;border-top:1px solid #e4e4e9;border-bottom:1px solid #e4e4e9}.demo-simulation strong{font-size:12px}.demo-simulation small{display:block;font-size:11px;color:#73737f;margin-top:4px}.demo-simulation button{font:inherit;font-size:12px;border:1px solid #dcdce3;background:#f8f8fa;border-radius:7px;padding:6px 12px;cursor:pointer}.demo-updates h3{font-size:12px;margin:20px 0 10px}.demo-updates p{font-size:12px;line-height:1.5;color:#656572;padding-bottom:10px;border-bottom:1px solid #eee}.demo-updates p span{color:#ad741d}#demo-guide .demo-disclaimer{font-size:11px;line-height:1.6;margin:18px 0 0;color:#85858f}
@media(max-width:900px){.demo-context{display:none}.demo-toolbar-inner{padding:8px 16px;gap:12px}.demo-tools{gap:12px}}
@media(max-width:560px){.demo-toolbar-inner{flex-wrap:wrap;gap:6px 12px}.demo-role{font-size:11px}.demo-tools{width:100%;justify-content:space-between;margin:0}.demo-tools a{font-size:11px}#demo-guide{top:95px;right:16px}}