@import"https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Spline+Sans:wght@400;500;600&display=swap";:root{color-scheme:light;font-family:Spline Sans,Segoe UI,sans-serif;line-height:1.5;font-weight:400;--bg: #f5f1ea;--bg-alt: #efe7dd;--ink: #1b1a18;--ink-muted: #5b564f;--accent: #e36a2c;--accent-soft: #ffd7c1;--error: #b3261e;--card: #fffaf4;--stroke: #e1d4c6}*{box-sizing:border-box}body{margin:0;min-height:100vh;color:var(--ink);background:radial-gradient(circle at top left,#fff3e4 0%,var(--bg) 45%),radial-gradient(circle at bottom right,#f7dac7 0%,var(--bg-alt) 55%)}#root{min-height:100vh}.page{max-width:1100px;margin:0 auto;padding:2rem;display:flex;flex-direction:column;gap:2rem}.hero{background:var(--card);border:1px solid var(--stroke);border-radius:1.8rem;padding:2rem;display:flex;flex-direction:column;gap:1rem}.eyebrow{text-transform:uppercase;letter-spacing:.2em;font-size:12px;color:var(--ink-muted);margin:0}h1,h2{font-family:Space Grotesk,Segoe UI,sans-serif;margin:0}h1{font-size:clamp(2rem,4vw,3rem);line-height:1.05}.lede{max-width:42.5rem;margin:0;color:var(--ink-muted);font-size:18px}.actions{display:flex;gap:.8rem;flex-wrap:wrap}button{border-radius:0;border:1px solid var(--stroke);padding:.8rem;font-size:15px;font-weight:600;cursor:pointer}.example-label{margin:0;color:var(--ink-muted);font-size:.95rem}.example-button{padding:.5rem .8rem;font-size:.85rem}.row-count-input{margin-left:.6rem;padding:.4rem .6rem;border:1px solid var(--stroke);border-radius:0;background:#fff;color:var(--ink);font-size:.9rem;width:6rem}.result-dialog{border:1px solid var(--stroke);padding:1rem;max-width:44rem;width:90vw}.result-dialog::backdrop{background:#00000059}.dialog-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.8rem}.dialog-header h3{margin:0}.dialog-meta{margin:0 0 .6rem;color:var(--ink-muted);font-size:.85rem}.dialog-body{margin:0;max-height:60vh;overflow:auto;background:#fff;border:1px solid var(--stroke);padding:.8rem}.button-error{border-color:var(--error);color:var(--error);background:#f6d1ce}button:hover{border-color:var(--ink-muted)}.primary{background:var(--accent);color:#fff7f1;border-color:transparent}.ghost{background:transparent;color:var(--ink)}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem;align-items:stretch}.grid article{display:flex}.grid article>*{flex:1}.card{background:var(--card);border:1px solid var(--stroke);border-radius:1.3rem;padding:1.3rem;display:flex;flex-direction:column;gap:.5rem}.subtitle{margin:0;color:var(--ink-muted);font-size:15px}ul{margin:0;padding-left:1rem;color:var(--ink);display:flex;flex-direction:column;gap:.4rem}.matrix{background:var(--card);border:1px solid var(--stroke);border-radius:1.4rem;padding:1.5rem;display:flex;flex-direction:column;gap:1rem}.table{display:grid;gap:.5rem}.table-row{display:grid;grid-template-columns:1.2fr repeat(3,1fr);gap:.5rem;padding:.8rem;border-radius:.9rem;background:#fff4ea}.table-header{background:transparent;font-weight:600;color:var(--ink-muted)}.topic{font-weight:600}.next{background:var(--card);border:1px solid var(--stroke);border-radius:1.3rem;padding:1.3rem}.next p{margin:0;color:var(--ink-muted)}.usage-monitor{background:var(--card);border:1px solid var(--stroke);border-radius:1.2rem;padding:1.2rem;display:flex;flex-direction:column;gap:.8rem}.usage-actions{display:flex;justify-content:flex-end}.usage-monitor button{width:100%}.test-actions{display:flex;gap:.6rem;flex-wrap:wrap}.test-actions button{width:100%}.usage-monitor table{width:100%;border-collapse:collapse}.usage-monitor td{border:1px solid var(--stroke);padding:.6rem;font-size:.95rem;width:50%}.usage-monitor tr td:first-child{font-weight:600}.usage-cell{position:relative;overflow:hidden}.usage-cell:before{content:"";position:absolute;inset:0;width:var(--bar-width, 0%);background:var(--accent-soft);opacity:.6;z-index:0}.usage-cell{z-index:1}.test{background:var(--card);border:1px solid var(--stroke);border-radius:1.2rem;padding:1.2rem;display:flex;flex-direction:column;gap:.8rem}.test table{width:100%;border-collapse:collapse}.test td{border:1px solid var(--stroke);padding:.6rem;font-size:.95rem;width:50%}.test tr td:first-child{font-weight:600}.sql-input{border:1px solid var(--stroke)}.sql-input .cm-editor{font-family:ui-monospace,SFMono-Regular,Cascadia Code,Menlo,Consolas,Liberation Mono,monospace;font-size:.95rem}.sql-input .cm-scroller{overscroll-behavior:contain}@media(max-width:45rem){.hero{padding:1.5rem}.table-row{grid-template-columns:1fr}}
