:root{--bg: #0c0f13;--panel: #0f141a;--panel2: #0b1117;--text: #e6f3ff;--muted: #9fb5c8;--accent: #4af0b5;--accent2: #7ee8fa;--accent3: #b388ff;--ring: rgba(122,255,214,.35)}*{box-sizing:border-box}html,body,#app{height:100%}body{margin:0;background:radial-gradient(1200px 800px at 10% -10%,#0e1622,#0c0f13 55%),var(--bg);color:var(--text);font:14px/1.5 Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,Helvetica,Arial}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}.qs-shell{display:grid;grid-template-columns:320px 1fr;gap:18px;height:100%;padding:18px}.qs-side{background:linear-gradient(180deg,var(--panel),var(--panel2));border:1px solid rgba(255,255,255,.05);border-radius:16px;padding:18px;box-shadow:0 10px 30px #00000059}.brand{display:flex;align-items:center;gap:10px;margin-bottom:10px}.brand .dot{width:10px;height:10px;border-radius:9999px;background:radial-gradient(circle at 30% 30%,var(--accent2),var(--accent));box-shadow:0 0 20px var(--ring)}.brand .title{font-weight:800;letter-spacing:.3px;font-size:20px}.brand .subtitle{margin-left:auto;color:var(--muted);font-size:12px;opacity:.8}.controls{display:flex;flex-direction:column;gap:8px;margin-top:8px;margin-bottom:18px}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid rgba(255,255,255,.07);background:#121a22;color:var(--text);padding:10px 12px;border-radius:10px;cursor:pointer;transition:all .15s ease}.btn:hover{transform:translateY(-1px);border-color:var(--ring);box-shadow:0 6px 18px #4af0b51f}.btn.primary{background:linear-gradient(180deg,#15212b,#121a22);border-color:#4af0b559}.btn.ghost{background:transparent}.status{margin-top:6px;color:var(--muted);font-size:12px}.section-title{margin-top:8px;margin-bottom:6px;color:#b7c9da;font-weight:700;letter-spacing:.2px}.setup{margin:0;padding-left:18px;color:#c7d6e3}.setup li{margin:6px 0}.built-by{margin-top:16px;color:#9db6c9;font-size:12px;opacity:.85}.qs-main{position:relative;border-radius:18px;background:#000;border:1px solid rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px #ffffff05,0 10px 26px #00000073;overflow:hidden}.qs-canvas{width:100%;height:100%;display:block;background:#000!important}.qs-shell{position:relative}.qs-side{transition:transform .25s ease,width .25s ease,padding .25s ease;will-change:transform}.qs-side-toggle{position:absolute;top:10px;right:-12px;z-index:20;width:24px;height:24px;line-height:24px;border-radius:999px;border:0;cursor:pointer;font-weight:700;background:#ffffff1a;color:#cfe9ff;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 4px 12px #00000040}.qs-side{position:relative;flex:0 0 280px;transition:transform .25s ease,width .25s ease,padding .25s ease;will-change:transform,width}.qs-shell.side-collapsed .qs-side{transform:translate(-100%);width:0!important;padding-left:0!important;padding-right:0!important;border:0!important}.qs-side{position:relative;flex:0 0 280px;transition:transform .25s ease,width .25s ease,padding .25s ease}.qs-main{flex:1 1 auto;position:relative}.qs-shell.side-collapsed .qs-side{transform:translate(-100%);width:0!important;padding:0!important;border:0!important}.qs-side-toggle{position:absolute;top:10px;right:-12px;z-index:20;width:24px;height:24px;line-height:24px;border-radius:999px;border:0;cursor:pointer;font-weight:700;background:#ffffff1f;color:#cfe9ff;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 4px 12px #00000040}.qs-shell{position:relative;display:flex;gap:0}.qs-side{width:260px;transition:width .25s ease,padding .25s ease,transform .25s ease;will-change:transform,width}.qs-main{position:relative;flex:1 1 auto}.qs-shell.side-collapsed .qs-side{width:0!important;padding-left:0!important;padding-right:0!important;overflow:hidden;transform:translate(-100%)}.qs-shell.side-collapsed .qs-main{margin-left:0!important}.qs-side-toggle{position:absolute;top:10px;right:-12px;z-index:20;width:24px;height:24px;line-height:24px;border-radius:999px;border:0;cursor:pointer;font-weight:700;background:#ffffff1f;color:#dff3ff;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 4px 12px #00000040}.qs-fullscreen{position:absolute;right:16px;bottom:16px;z-index:30;width:40px;height:40px;border-radius:10px;border:none;cursor:pointer;font-size:18px;background:#ffffff1f;color:#dff3ff;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-shadow:0 6px 18px #00000059}.qs-fullscreen:hover{background:#ffffff2e}
