:root{color-scheme:dark;--accent:#33ec86}body{margin:0;background:#070c11;color:#edf5f5;font:15px/1.55 system-ui}*{box-sizing:border-box}.global-demo{max-width:1440px;margin:0 auto;padding:75px 32px 40px}a{color:var(--accent)}button,.button{font:600 13px system-ui;padding:11px 16px;border:1px solid #294037;border-radius:6px;background:#12231d;color:#e5fff1;cursor:pointer;text-decoration:none;display:inline-block}button:hover,.button:hover{border-color:var(--accent)}button:disabled{opacity:.45;cursor:default}.eyebrow{font:11px ui-monospace,monospace;letter-spacing:.17em;color:var(--accent)}.heading{display:flex;justify-content:space-between;align-items:center}h1{font-size:48px;letter-spacing:-.04em;margin:8px 0}#lede{color:#99adb4;margin:0 0 28px}#steps{display:flex;gap:8px;margin-bottom:18px;flex-wrap:wrap}#steps button[aria-current=step]{background:var(--accent);color:#062112;border-color:var(--accent)}.workbench{display:grid;grid-template-columns:380px minmax(0,1fr);border:1px solid #22323a;border-radius:8px;overflow:hidden;min-height:510px}.narrative{padding:28px;background:#101a22}#number{color:var(--accent);font:12px ui-monospace,monospace}h2{font-size:30px;line-height:1.15;margin:15px 0}#description{color:#a6b8bf}#instructions{padding-left:20px;font-size:14px}#instructions li{margin:12px 0}#live{font-size:12px;color:#a7d7be;border-top:1px solid #25383e;padding-top:15px;overflow-wrap:anywhere}#actions{display:flex;gap:8px;flex-wrap:wrap}.controls{display:flex;gap:7px;margin-top:24px}#preview{background:#080e13;display:grid;place-items:center;min-width:0;position:relative;padding:25px}#preview iframe{width:100%;height:600px;border:0}#preview video{width:100%;max-height:430px;background:#000}#preview .card{width:100%;border:1px solid #294039;background:#0e1a20;padding:26px;border-radius:8px}#preview code{color:#65e6a0;overflow-wrap:anywhere;font-size:12px}.tracks{list-style:none;padding:0;display:grid;gap:10px}.tracks button{width:100%;text-align:left}.tracks button[aria-current=true]{border-color:var(--accent)}footer{color:#7e98a2;font-size:12px;margin-top:18px}.error{color:#ffad9c!important}input{display:block;background:#080e13;border:1px solid #294039;color:white;padding:12px;width:100%;margin:12px 0} @media(max-width:900px){.workbench{grid-template-columns:1fr}.global-demo{padding:70px 15px 20px}h1{font-size:36px}#preview iframe{height:420px}}