:root{color-scheme:dark;--bg: #0f0f0f;--bg-elevated: #181818;--panel: #181818;--panel-2: #202020;--panel-3: #272727;--text: #f1f1f1;--muted: #aaaaaa;--subtle: #717171;--border: rgba(255, 255, 255, .08);--border-strong: rgba(255, 255, 255, .14);--accent: #ff3b30;--accent-hover: #ff5a52;--focus: #3ea6ff;--radius-sm: 12px;--radius-md: 16px;--radius-lg: 20px;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .22);--shadow-md: 0 12px 30px rgba(0, 0, 0, .28);--max-width: 1380px;--sidebar-width: 360px}*{box-sizing:border-box}html,body{min-height:100%;margin:0;background:radial-gradient(circle at top left,rgba(255,255,255,.05),transparent 24%),linear-gradient(180deg,#121212,#0f0f0f 220px);color:var(--text);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Arial,sans-serif;line-height:1.45}body{padding:24px}a{color:var(--focus);text-decoration:none}a:hover{text-decoration:underline}main{width:min(100%,var(--max-width));margin:0 auto}h1,h2,h3{margin:0 0 14px;color:var(--text);letter-spacing:-.02em;font-weight:700}h1{font-size:clamp(1.6rem,1.7vw,2rem)}app-oauth-component,app-input-form-component,app-list-renders-component,app-render-component{display:block}.container{background:transparent;color:var(--text)}.container.unauthenticated{max-width:460px;margin:72px auto 0;padding:28px;background:linear-gradient(180deg,#ffffff08,#ffffff04);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);text-align:center;font-size:1rem}.container.authenticated{display:grid;grid-template-columns:minmax(300px,var(--sidebar-width)) minmax(0,1fr);gap:15px;align-items:start}.container.authenticated>app-input-form-component{grid-column:1;position:sticky;top:24px}.container.authenticated>app-list-renders-component{grid-column:2;min-width:0}.container.authenticated>#user,.container.authenticated>button{grid-column:1}.container.authenticated>#user{display:inline-flex;margin-top:4px;color:var(--muted);font-size:.95rem}@media(max-width:980px){.container.authenticated{grid-template-columns:1fr}.container.authenticated>app-input-form-component,.container.authenticated>app-list-renders-component,.container.authenticated>#user,.container.authenticated>button{grid-column:1}.container.authenticated>app-input-form-component{position:static}}.form_container,.container.authenticated>app-list-renders-component,.container.authenticated>app-input-form-component{min-width:0}.form_container{background:linear-gradient(180deg,#ffffff08,#ffffff04);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md)}.form_container{padding:14px 16px}.form-group{margin:0 0 16px}label{display:block;margin-bottom:8px;color:var(--muted);font-size:.93rem;font-weight:500}.form-control,input,select,textarea{width:100%;min-height:48px;padding:12px 14px;border:1px solid var(--border);border-radius:14px;background:var(--panel-2);color:var(--text);font:inherit;transition:border-color .18s ease,background .18s ease,box-shadow .18s ease}.form-control:hover,input:hover,select:hover,textarea:hover{background:var(--panel-3);border-color:var(--border-strong)}.form-control:focus,input:focus,select:focus,textarea:focus{outline:none;border-color:#3ea6ff80;box-shadow:0 0 0 3px #3ea6ff29;background:var(--panel-3)}button{appearance:none;border:1px solid transparent;border-radius:999px;min-height:40px;padding:0 16px;background:var(--panel-3);color:var(--text);font:inherit;font-weight:600;cursor:pointer;transition:transform .15s ease,background-color .18s ease,border-color .18s ease,opacity .18s ease}button:hover{background:#333}button:active{transform:translateY(1px)}button:focus-visible{outline:none;box-shadow:0 0 0 3px #3ea6ff2e}.form_container button[type=submit]{margin-top:8px;width:100%;min-height:46px;background:var(--text);color:#0f0f0f}.form_container button[type=submit]:hover{background:#fff}.container.authenticated>button{justify-self:start;margin-top:10px;background:transparent;border:1px solid var(--border);color:var(--muted)}.container.authenticated>button:hover{background:#ffffff0f;color:var(--text);border-color:var(--border-strong)}#loading,#renders p{color:var(--muted);margin:0}*{scrollbar-width:thin;scrollbar-color:#5a5a5a transparent}*::-webkit-scrollbar{width:10px;height:10px}*::-webkit-scrollbar-track{background:transparent}*::-webkit-scrollbar-thumb{background:#4d4d4d;border-radius:999px}*::-webkit-scrollbar-thumb:hover{background:#666}
