*,*:before,*:after{box-sizing:border-box}:root{--color-bg: #0f1117;--color-surface: #1a1d27;--color-surface-hover: #242837;--color-border: #2e3245;--color-primary: #6c5ce7;--color-primary-hover: #7c6ff7;--color-text: #e8e8ed;--color-text-muted: #8b8fa3;--color-success: #00d2a0;--color-warning: #ffa94d;--color-code-bg: #0d0f15;--font-mono: "SF Mono", "Fira Code", "Fira Mono", Menlo, monospace;--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif}body{margin:0;font-family:var(--font-sans);background:var(--color-bg);color:var(--color-text);line-height:1.6;min-height:100vh}.container{max-width:960px;margin:0 auto;padding:0 20px}.site-header{border-bottom:1px solid var(--color-border);padding:16px 0}.site-header .container{display:flex;align-items:center;justify-content:space-between}.logo{font-size:1.25rem;font-weight:700;color:var(--color-text);text-decoration:none;display:flex;align-items:center;gap:8px}.logo-icon{width:28px;height:28px;background:var(--color-primary);border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:14px}.hero{text-align:center;padding:48px 0 32px}.hero h1{font-size:2rem;font-weight:800;margin:0 0 12px;letter-spacing:-.02em}.hero h1 span{color:var(--color-primary)}.hero p{color:var(--color-text-muted);font-size:1.1rem;max-width:560px;margin:0 auto}.tabs{display:flex;gap:4px;background:var(--color-surface);border-radius:10px;padding:4px;margin-bottom:24px}.tab{flex:1;padding:10px 16px;border:none;background:transparent;color:var(--color-text-muted);font-size:.9rem;font-weight:500;border-radius:8px;cursor:pointer;transition:all .15s}.tab:hover{color:var(--color-text)}.tab.active{background:var(--color-primary);color:#fff}.panel{display:none}.panel.active{display:block}.builder-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:12px;padding:24px}.field-group{margin-bottom:16px}.field-group label{display:block;font-size:.85rem;font-weight:600;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px}.field-group select,.field-group input{width:100%;padding:10px 12px;background:var(--color-code-bg);border:1px solid var(--color-border);border-radius:8px;color:var(--color-text);font-size:.95rem;font-family:var(--font-mono);outline:none;transition:border-color .15s}.field-group select:focus,.field-group input:focus{border-color:var(--color-primary)}.field-group select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='%238b8fa3' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:36px}.checkbox-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(72px,1fr));gap:6px}.checkbox-item{display:flex;align-items:center;gap:6px;padding:6px 8px;background:var(--color-code-bg);border:1px solid var(--color-border);border-radius:6px;cursor:pointer;font-size:.85rem;transition:all .1s;user-select:none}.checkbox-item:hover{border-color:var(--color-primary)}.checkbox-item.selected{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.checkbox-item input{display:none}.expr-display{background:var(--color-code-bg);border:2px solid var(--color-primary);border-radius:10px;padding:16px 20px;margin:20px 0;font-family:var(--font-mono);font-size:1.3rem;font-weight:600;letter-spacing:.05em;display:flex;justify-content:space-between;align-items:center;gap:12px}.expr-display .expr{word-break:break-all}.copy-btn{padding:6px 14px;background:var(--color-primary);color:#fff;border:none;border-radius:6px;font-size:.85rem;font-weight:500;cursor:pointer;white-space:nowrap;transition:background .15s}.copy-btn:hover{background:var(--color-primary-hover)}.description{color:var(--color-success);font-size:.95rem;margin-bottom:20px;padding:10px 14px;background:#00d2a00f;border-radius:8px;border-left:3px solid var(--color-success)}.presets{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px;margin-top:20px}.preset-btn{padding:10px 14px;background:var(--color-surface-hover);border:1px solid var(--color-border);border-radius:8px;color:var(--color-text);font-size:.85rem;cursor:pointer;text-align:left;transition:all .15s}.preset-btn:hover{border-color:var(--color-primary);background:var(--color-surface)}.preset-btn .preset-expr{font-family:var(--font-mono);font-size:.8rem;color:var(--color-text-muted);margin-top:2px}.next-runs{margin-top:20px}.next-runs h3{font-size:.9rem;color:var(--color-text-muted);margin:0 0 10px}.run-list{list-style:none;padding:0;margin:0}.run-list li{padding:8px 12px;background:var(--color-code-bg);border-radius:6px;font-family:var(--font-mono);font-size:.9rem;margin-bottom:4px;color:var(--color-warning)}.parser-input{display:flex;gap:8px;margin-bottom:16px}.parser-input input{flex:1;padding:12px 14px;background:var(--color-code-bg);border:1px solid var(--color-border);border-radius:8px;color:var(--color-text);font-size:1rem;font-family:var(--font-mono);outline:none}.parser-input input:focus{border-color:var(--color-primary)}.parser-input button{padding:12px 20px;background:var(--color-primary);color:#fff;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:background .15s}.parser-input button:hover{background:var(--color-primary-hover)}.field-breakdown{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:16px}.field-card{background:var(--color-code-bg);border:1px solid var(--color-border);border-radius:8px;padding:12px;text-align:center}.field-card .field-name{font-size:.7rem;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em}.field-card .field-value{font-family:var(--font-mono);font-size:1.1rem;font-weight:600;color:var(--color-primary);margin-top:4px}.site-footer{border-top:1px solid var(--color-border);padding:24px 0;margin-top:48px;text-align:center;color:var(--color-text-muted);font-size:.85rem}.site-footer a{color:var(--color-primary);text-decoration:none}.seo-content{margin:48px 0}.seo-content h2{font-size:1.4rem;margin:32px 0 16px;color:var(--color-text)}.seo-content p{color:var(--color-text-muted);max-width:640px}.faq{margin-top:24px}.faq-item{border-bottom:1px solid var(--color-border);padding:16px 0}.faq-item h3{font-size:1rem;margin:0 0 8px}.faq-item p{color:var(--color-text-muted);margin:0}@media(max-width:640px){.hero h1{font-size:1.5rem}.field-breakdown{grid-template-columns:repeat(2,1fr)}.expr-display{font-size:1rem;flex-direction:column}.presets{grid-template-columns:1fr}}