*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;overflow:hidden;background:#111;color:#ccc;font-family:system-ui,-apple-system,sans-serif;font-size:13px}#layout{display:flex;height:100vh}#sidebar{flex:0 0 176px;background:#161616;border-right:1px solid #252525;overflow-y:auto;overflow-x:hidden}#sidebar::-webkit-scrollbar{width:4px}#sidebar::-webkit-scrollbar-track{background:transparent}#sidebar::-webkit-scrollbar-thumb{background:#333;border-radius:2px}.example-btn{display:block;width:100%;padding:7px 10px 7px 12px;background:none;border:none;border-left:2px solid transparent;color:#666;text-align:left;cursor:pointer;font-size:12px;font-family:inherit;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.example-btn:hover{background:#1e1e1e;color:#aaa}.example-btn.selected{background:#1a2740;border-left-color:#3d7fff;color:#7ab8ff}#preview-wrap{flex:1;background:#111;position:relative;overflow:hidden}.preview-frame{position:absolute;inset:0;width:100%;height:100%;border:none;display:block;transition:opacity .25s ease}#renderer-bar{position:absolute;bottom:16px;left:50%;transform:translate(-50%);display:flex;gap:2px;padding:5px 6px;background:#080808d1;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:8px;border:1px solid rgba(255,255,255,.07);pointer-events:none;z-index:10}.renderer-btn{padding:4px 14px;background:none;border:1px solid transparent;border-radius:4px;color:#777;font-size:11px;font-family:ui-monospace,monospace;letter-spacing:.03em;cursor:pointer;pointer-events:auto;transition:background .1s,color .1s}.renderer-btn:hover:not(.unavailable){background:#ffffff12;color:#bbb}.renderer-btn.selected{background:#3d7fff2e;border-color:#3d7fff59;color:#7ab8ff}.renderer-btn.unavailable{color:#2a2a2a;cursor:default}