:root{--primary: #D4A574;--primary-dark: #bf9568;--primary-darker: #b48c62;--primary-darkest: #957451;--primary-light: #d9ae82;--primary-lightest: #e5c3a0;--bg: #FAFAF8;--navbar-bg: #FAFAF8;--text: #1A1A1A;--heading: #1A1A1A;--border: #E8E6E1;--border-soft: #F0EEE9;--card-bg: #FFFFFF;--shadow: 0 4px 12px rgba(140, 130, 115, .05);--accent-1: #8B9E7E;--accent-2: #C4866C;--accent-3: #9B8EC4;--radius: 8px;--font: "Inter", system-ui, -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;--line-height: 1.75}[data-theme=dark]{--bg: #1A1A1A;--navbar-bg: #1A1A1A;--text: #E8E8E8;--heading: #F5F5F5;--border: #333333;--border-soft: #333333;--card-bg: #242422}*{box-sizing:border-box}html,body,#root{margin:0;padding:0;height:100%}body{background:var(--bg);color:var(--text);font-family:var(--font);line-height:var(--line-height);-webkit-font-smoothing:antialiased}h1,h2,h3{letter-spacing:-.02em;font-weight:700;color:var(--heading)}a{color:var(--primary-dark);text-decoration:none}a:hover{color:var(--primary)}button{font-family:inherit;cursor:pointer;border:1px solid var(--border);background:var(--card-bg);color:var(--text);border-radius:var(--radius);padding:8px 16px;font-size:.9rem;transition:all .2s ease}button:hover{border-color:var(--primary);color:var(--primary)}button.primary{background:var(--primary);border-color:var(--primary);color:#fff;font-weight:600}button.primary:hover{background:var(--primary-dark);border-color:var(--primary-dark);color:#fff}button:disabled{opacity:.5;cursor:not-allowed}input,select,textarea{font-family:inherit;font-size:.9rem;border:1px solid var(--border);border-radius:var(--radius);padding:8px 12px;background:var(--card-bg);color:var(--text)}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--primary)}.card{background:var(--card-bg);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px}.layout{max-width:1100px;margin:0 auto;padding:16px 20px 60px}.navbar{background:var(--navbar-bg);border-bottom:1px solid var(--border);padding:12px 20px;display:flex;align-items:center;gap:20px;position:sticky;top:0;z-index:10}.navbar .brand{font-weight:700;font-size:1.05rem;color:var(--heading)}.navbar .spacer{flex:1}.navbar a{font-size:.9rem}.navbar a.active{color:var(--primary);border-bottom:2px solid var(--primary);padding-bottom:2px}.data-table{width:100%;border-collapse:collapse;font-size:.85rem}.data-table th,.data-table td{border:1px solid var(--border);padding:6px 10px;text-align:left;white-space:nowrap;max-width:320px;overflow:hidden;text-overflow:ellipsis}.data-table th{background:#d4a57414;font-weight:600}.sql-editor .cm-editor{border:1px solid var(--border);border-radius:var(--radius);font-size:.9rem;min-height:140px}.sql-editor .cm-editor.cm-focused{outline:none;border-color:var(--primary)}.sql-editor .cm-scroller{font-family:SF Mono,Menlo,Consolas,monospace}.error-box{background:#c4866c1a;border:1px solid #C4866C;border-radius:var(--radius);color:#8a4a3a;padding:12px;font-family:monospace;font-size:.85rem;white-space:pre-wrap}.tag{display:inline-block;font-size:.75rem;padding:2px 8px;border-radius:20px;border:1px solid var(--border)}.tag.easy{color:#6d8a5a;border-color:#8b9e7e}.tag.medium{color:#9a6a3a;border-color:#d4a574}.tag.hard{color:#a04a3a;border-color:#c4866c}