@import url("https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=JetBrains+Mono:wght@400;500;600;700&family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap");:root{color-scheme:light;--canvas:#fbfbfa;--surface:#fff;--border:#eaeaea;--text-main:#2f3437;--text-muted:#787774;--text-accent:#111;--accent-bg:#f7f6f3;--pastel-red-bg:#fdebec;--pastel-red-text:#9f2f2d;--pastel-green-bg:#edf3ec;--pastel-green-text:#346538;--pastel-yellow-bg:#fbf3db;--pastel-yellow-text:#956400;--pastel-blue-bg:#e1f3fe;--pastel-blue-text:#1f6c9f;--font-sans:"Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;--font-serif:"Instrument Serif",Georgia,"Times New Roman",serif;--font-mono:"JetBrains Mono","SF Mono","Geist Mono",Consolas,monospace;--border-radius:8px;--border-radius-sm:4px;--transition:0.15s cubic-bezier(0.16,1,0.3,1)}*{box-sizing:border-box}html{min-width:320px}body{margin:0;background:var(--canvas);color:var(--text-main);font-family:var(--font-sans);font-size:14px;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}button,input,textarea{border:none;background:none;color:inherit;font:inherit;outline:none}a,button{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none;transition:var(--transition)}h1,h2,p,pre{margin:0}.app-container{max-width:1200px;margin:0 auto;padding:0 24px 64px}.topbar{justify-content:space-between;gap:20px;margin-bottom:48px;border-bottom:1px solid var(--border);padding:24px 0}.brand,.topbar{display:flex;align-items:center}.brand{gap:12px;min-width:0;color:var(--text-accent);font-weight:600;letter-spacing:0}.brand-wordmark{display:block;width:76px;height:auto;flex:0 0 auto;filter:drop-shadow(0 6px 16px rgba(0,82,255,.16))}.nav-links{display:flex;align-items:center;gap:24px;flex-wrap:wrap}.nav-links a{color:var(--text-muted);font-weight:500}.nav-links a:hover{color:var(--text-accent)}.star-button{display:inline-flex;align-items:center;gap:6px;border:1px solid #0052ff;border-radius:var(--border-radius);background:#0052ff;color:#fff!important;padding:8px 14px;font-size:13px;font-weight:700;box-shadow:0 10px 24px rgba(0,82,255,.18)}.star-button:hover{background:#003ecb;border-color:#003ecb;color:#fff!important}.star-button svg{flex:0 0 auto;fill:#ffd166}.hero{gap:24px;margin-bottom:48px}.hero,.hero-meta{display:flex;flex-direction:column}.hero-meta{gap:8px}.card-kicker,.eyebrow{color:var(--text-muted);font-family:var(--font-mono);text-transform:uppercase}.eyebrow{font-size:12px;letter-spacing:.08em}.hero h1{color:var(--text-accent);font-family:var(--font-serif);font-size:56px;font-weight:400;letter-spacing:0;line-height:1.05}.hero-controls{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;border-bottom:1px solid var(--border);padding-bottom:24px}.lede{max-width:640px;color:var(--text-muted);font-size:16px;line-height:1.55}.bento-grid{display:grid;grid-template-columns:320px minmax(0,1fr) 340px;align-items:start;grid-gap:24px;gap:24px;margin-bottom:24px}.bento-card{min-width:0;gap:20px;border:1px solid var(--border);border-radius:var(--border-radius);background:var(--surface);padding:24px}.bento-card,.card-header{display:flex;flex-direction:column}.card-header{gap:4px;border-bottom:1px solid var(--border);padding-bottom:16px}.card-kicker{font-size:11px;letter-spacing:.05em}.card-header h2,.editor-header h2,.output-header h2{color:var(--text-accent);font-size:18px;font-weight:600;letter-spacing:0;line-height:1.25}.form-stack{gap:20px;margin-top:16px}.form-group,.form-stack{display:flex;flex-direction:column}.form-group{gap:8px}.form-label{font-size:12px;font-weight:600;letter-spacing:.02em;text-transform:uppercase}.form-label,.text-input{color:var(--text-accent)}.text-input{width:100%;border:1px solid var(--border);border-radius:var(--border-radius);background:var(--accent-bg);font-family:var(--font-mono);font-size:13px;padding:10px 14px;transition:var(--transition)}.text-input:focus{border-color:var(--text-muted);background:var(--surface)}.segmented-control{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--border);border-radius:var(--border-radius);background:var(--accent-bg);padding:2px}.segment-button{min-height:32px;border-radius:calc(var(--border-radius) - 3px);color:var(--text-muted);cursor:pointer;font-size:12px;font-weight:500;padding:6px;text-align:center;transition:var(--transition)}.segment-button.active{background:var(--surface);color:var(--text-accent);font-weight:600}.field-hint{color:var(--text-muted);font-size:11px}.option-list{display:flex;flex-direction:column;gap:6px}.option-item{border:1px solid var(--border);border-radius:var(--border-radius);background:var(--surface);cursor:pointer;text-align:left;transition:var(--transition);display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px}.option-item.active,.option-item:hover{background:var(--accent-bg)}.option-item.active{border-color:var(--text-accent)}.option-item-name{color:var(--text-accent);font-weight:600}.option-item-meta{overflow:hidden;color:var(--text-muted);font-family:var(--font-mono);font-size:11px;line-height:1.3;text-overflow:ellipsis;white-space:nowrap}.editor-card{gap:0;overflow:hidden;padding:0}.editor-header,.output-header{display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--border);background:var(--surface);padding:18px 24px}.editor-header-title{display:flex;min-width:0;flex-direction:column;gap:2px}.copy-btn{display:inline-flex;min-height:32px;align-items:center;justify-content:center;gap:6px;flex:0 0 auto;border:1px solid var(--border);border-radius:var(--border-radius);background:var(--surface);color:var(--text-main);cursor:pointer;font-size:12px;font-weight:600;padding:6px 12px;transition:var(--transition)}.copy-btn:hover{border-color:var(--text-muted);background:var(--accent-bg)}.copy-btn svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2}.editor-container{display:flex;min-height:380px;background:#fafafa}.line-numbers{display:flex;flex:0 0 auto;flex-direction:column;border-right:1px solid var(--border);background:#f6f5f2;color:#c1c0bc;padding:16px 12px;text-align:right;-webkit-user-select:none;-moz-user-select:none;user-select:none}.code-textarea,.line-numbers{font-family:var(--font-mono);font-size:13px;line-height:20px}.code-textarea{flex:1 1 auto;min-width:0;min-height:380px;overflow-x:auto;border:none;background:transparent;color:var(--text-main);padding:16px 20px;resize:vertical;-moz-tab-size:2;tab-size:2;white-space:pre}.status-badge{display:flex;align-items:center;gap:8px;width:-moz-fit-content;width:fit-content;border-radius:var(--border-radius);font-size:13px;font-weight:600;letter-spacing:.04em;padding:12px 16px;text-transform:uppercase}.status-badge.passing{background:var(--pastel-green-bg);color:var(--pastel-green-text)}.status-badge.failing{background:var(--pastel-red-bg);color:var(--pastel-red-text)}.status-dot{width:8px;height:8px;flex:0 0 auto;border-radius:999px;background:currentColor}.metrics-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--border);border-radius:var(--border-radius);background:var(--accent-bg);padding:12px 6px}.metric-item{min-width:0;border-right:1px solid var(--border);text-align:center}.metric-item:last-child{border-right:none}.metric-label{overflow:hidden;color:var(--text-muted);font-size:11px;letter-spacing:.03em;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap}.metric-value{margin-top:2px;color:var(--text-accent);font-family:var(--font-mono);font-size:16px;font-weight:600}.analysis-block{display:flex;flex-direction:column;gap:12px}.findings-title{color:var(--text-muted);font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}.findings-container{display:flex;flex-direction:column;gap:8px}.finding-card{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--border);border-radius:var(--border-radius);background:var(--surface);padding:12px}.finding-info{display:flex;min-width:0;flex-direction:column;gap:2px}.finding-reason{color:var(--pastel-red-text);font-family:var(--font-mono);font-size:12px;font-weight:600}.finding-meta{color:var(--text-muted);font-size:11px}.finding-family{flex:0 0 auto;border-radius:var(--border-radius-sm);background:var(--accent-bg);color:var(--text-accent);font-family:var(--font-mono);font-size:11px;font-weight:700;padding:3px 6px}.empty-state{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;border:1px dashed var(--border);border-radius:var(--border-radius);background:var(--canvas);padding:32px 16px;text-align:center}.empty-state-title{color:var(--text-accent);font-weight:600}.empty-state-desc{color:var(--text-muted);font-size:12px}.output-card{gap:0;margin-top:24px;overflow:hidden;padding:0}.output-code-container{overflow-x:auto;background:#fafafa;padding:24px}.output-code-container code{color:var(--text-main);font-family:var(--font-mono);font-size:13px;line-height:1.7}@media (max-width:1024px){.bento-grid{grid-template-columns:1fr 1fr}.bento-card.result-panel{grid-column:span 2}}@media (max-width:768px){.app-container{padding:0 16px 48px}.topbar{align-items:flex-start;flex-direction:column;gap:16px;margin-bottom:36px}.nav-links{width:100%;justify-content:space-between;gap:12px}.hero{margin-bottom:32px}.hero h1{font-size:40px}.hero-controls{align-items:flex-start;flex-direction:column}.bento-grid{grid-template-columns:1fr}.bento-card.result-panel{grid-column:span 1}.bento-card{padding:18px}.editor-card,.output-card{padding:0}.editor-header,.output-header{align-items:flex-start;padding:16px}.code-textarea,.editor-container{min-height:340px}.code-textarea{padding:14px}.line-numbers{padding:14px 10px}.metrics-row{grid-template-columns:1fr;gap:10px}.metric-item{border-right:none}.option-item{align-items:flex-start;flex-direction:column;gap:2px}}