:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}#root{width:968px;margin:0 auto;padding:2rem;text-align:center}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(prefers-reduced-motion:no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}:root{--bg: #f3f4f6;--panel: #ffffff;--panel-2: #f8fafc;--text: #111827;--muted: #6b7280;--brand: #6366f1;--brand-600: #4f46e5;--success: #22c55e;--danger: #ef4444;--warning: #f59e0b;--ring: 0 0 0 4px rgba(99, 102, 241, .25);--radius: 12px}body{background:radial-gradient(60% 80% at 0% 100%,rgba(79,70,229,.1) 0%,transparent 60%),radial-gradient(50% 70% at 100% 0%,rgba(59,130,246,.08) 0%,transparent 60%),var(--bg);color:var(--text);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,"Apple Color Emoji","Segoe UI Emoji"}#root{width:968px;padding:2.5rem 1.25rem 3.5rem}#root>div{background:linear-gradient(180deg,var(--panel),var(--panel-2));border:1px solid rgba(17,24,39,.08);border-radius:var(--radius);padding:1.25rem;margin:0 0 1rem;box-shadow:0 6px 22px #11182714,inset 0 1px #fff9}#root>div p:first-child{margin:0 0 .75rem;font-weight:700;letter-spacing:.02em;color:var(--text)}#root>div:first-of-type{display:grid;grid-template-columns:1fr 100px;gap:.75rem;position:sticky;top:.75rem;z-index:10;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}input[type=text]{background:#fff;color:var(--text);border:1px solid rgba(17,24,39,.12);border-radius:10px;padding:.85rem 1rem;outline:none;transition:border-color .2s ease,box-shadow .2s ease}input[type=text]::placeholder{color:var(--muted)}input[type=text]:focus{border-color:var(--brand);box-shadow:var(--ring)}button{border:none;color:#fff;background:var(--brand);border-radius:10px;padding:.8rem 1rem;width:100px;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;font-weight:600;cursor:pointer;transition:transform .06s ease,filter .2s ease,background-color .2s ease}button:hover{filter:brightness(1.05)}button:active{transform:translateY(1px)}ul{list-style:none;padding:0;margin:.25rem 0 0}li{display:flex;align-items:center;justify-content:space-between;gap:.75rem;background:#11182705;border:1px solid rgba(17,24,39,.08);padding:.85rem 1rem;border-radius:12px;margin-bottom:.6rem}li>:first-child{flex:1 1 auto}li button{padding:.55rem .85rem;border-radius:8px;width:100px;flex:0 0 100px;display:inline-flex;align-items:center;justify-content:center}#root button{width:100px!important;flex:0 0 100px}#root>div:first-of-type button{justify-self:end}li button+button{margin-left:.5rem}#root>div:nth-of-type(2) li button:first-of-type{background:var(--success)}#root>div:nth-of-type(2) li button:last-of-type{background:var(--danger)}#root>div:nth-of-type(3) li button{background:var(--warning);color:#111827}.empty{color:var(--muted);text-align:center;padding:1rem 0}@media(max-width:560px){#root{padding:1.5rem .75rem 2.5rem}#root>div:first-of-type{grid-template-columns:1fr}li{flex-direction:column;align-items:stretch}li button{width:100px}li button+button{margin-left:0;margin-top:.5rem}}#root{display:grid;grid-template-columns:1fr;gap:1rem;text-align:initial}#root>div{margin:0}#root>div p:first-child{font-size:1.05rem}@media(min-width:768px){#root{grid-template-columns:1fr 1fr}#root>div:first-of-type{grid-column:1 / -1}}
