@import"https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@500;700&family=IBM+Plex+Sans:wght@400;500;600&display=swap";:root{--bg: #0a0f1a;--surface-1: #0f1826;--surface-2: #152034;--text: #e8edf5;--text-muted: #8896ab;--accent: #38bdf8;--accent-support: #f59e0b;--success: #34d399;--danger: #ef4444;--font-display: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;--font-ui: "IBM Plex Sans", system-ui, -apple-system, sans-serif;--space-1: 4px;--space-2: 8px;--space-3: 16px;--space-4: 24px;--space-5: 32px;--space-6: 48px;--space-7: 64px;--radius: 6px;--radius-lg: 10px;--glow: 0 0 0 1px rgba(56, 189, 248, .15), 0 8px 24px rgba(0, 0, 0, .4);--motion: .15s ease-out}*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:linear-gradient(rgba(56,189,248,.05) 1px,transparent 1px) 0 0 / 48px 48px,linear-gradient(90deg,rgba(56,189,248,.05) 1px,transparent 1px) 0 0 / 48px 48px,var(--bg);color:var(--text);font-family:var(--font-ui);-webkit-font-smoothing:antialiased}#app{display:flex;flex-direction:column;min-height:100vh}.site-header{padding:var(--space-3) var(--space-4);border-bottom:1px solid rgba(56,189,248,.15)}.wordmark{display:inline-flex;align-items:center;font-family:var(--font-display);font-weight:700;font-size:1.5rem;letter-spacing:.02em}.clock-o{position:relative;display:inline-block;width:.85em;height:.85em;margin:0 .03em;border:2px solid var(--accent);border-radius:50%}.clock-hand{position:absolute;top:50%;left:50%;width:2px;height:38%;background:var(--accent);transform-origin:bottom center;transform:translate(-50%,-100%) rotate(0);animation:sweep 6s linear infinite}@keyframes sweep{to{transform:translate(-50%,-100%) rotate(360deg)}}.tagline{margin:var(--space-1) 0 0;color:var(--text-muted);font-size:.95rem}.workbench{flex:1;display:grid;grid-template-columns:45% 55%;gap:var(--space-3);padding:var(--space-4);min-height:0}.pane{background:var(--surface-1);border-radius:var(--radius-lg);box-shadow:var(--glow);padding:var(--space-4);display:flex;flex-direction:column;min-height:0}.editor-pane label{display:block;font-size:.85rem;color:var(--text-muted);margin-bottom:var(--space-2)}.language-toggle{display:inline-flex;align-self:flex-start;gap:var(--space-1);padding:3px;margin-bottom:var(--space-3);background:var(--surface-2);border:1px solid rgba(56,189,248,.15);border-radius:var(--radius)}.lang-button{background:transparent;color:var(--text-muted);padding:var(--space-2) var(--space-3);font-size:.82rem;box-shadow:none}.lang-button:hover:not(:disabled){background:#38bdf81f;color:var(--text)}.lang-button.is-active{background:var(--accent);color:var(--bg)}.lang-button.is-active:hover:not(:disabled){background:#63cffb}#source-input{flex:1;min-height:240px;resize:vertical;background:var(--surface-2);color:var(--text);font-family:var(--font-display);font-size:.9rem;line-height:1.5;border:1px solid rgba(56,189,248,.2);border-radius:var(--radius);padding:var(--space-3);margin-bottom:var(--space-3)}#source-input:focus-visible{outline:2px solid var(--accent);outline-offset:1px}button{font-family:var(--font-ui);font-weight:600;font-size:.95rem;color:var(--bg);background:var(--accent);border:none;border-radius:var(--radius);padding:var(--space-3) var(--space-4);min-height:44px;cursor:pointer;transition:transform var(--motion),box-shadow var(--motion),background var(--motion)}button:hover:not(:disabled){background:#63cffb}button:active:not(:disabled){transform:translateY(1px)}button:focus-visible{outline:2px solid var(--text);outline-offset:2px}button:disabled{background:var(--surface-2);color:var(--text-muted);cursor:progress}.run-row{display:flex;gap:var(--space-2)}#run-button{flex:1}.share-button{padding:var(--space-2) var(--space-3);font-size:.75rem;font-weight:600;background:transparent;color:var(--accent);border:1px solid rgba(56,189,248,.35);box-shadow:none}.share-button:hover:not(:disabled){background:#38bdf81f}.share-status{margin:var(--space-2) 0 0;min-height:1.2em;color:var(--text-muted);font-size:.78rem;overflow-wrap:anywhere}.share-status-error{color:var(--danger)}.results-header{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-3);flex-wrap:wrap;margin-bottom:var(--space-3)}.results-title{display:flex;align-items:center;gap:var(--space-3)}.results-pane h2{font-family:var(--font-display);font-size:1.1rem;margin:0}.export-button{padding:var(--space-2) var(--space-3);font-size:.75rem;font-weight:600;background:transparent;color:var(--accent);border:1px solid rgba(56,189,248,.35);box-shadow:none}.export-button:hover:not(:disabled){background:#38bdf81f}.export-button:disabled{background:transparent;color:var(--text-muted);border-color:#38bdf81f;cursor:not-allowed}.results-summary{margin:0;color:var(--text-muted);font-family:var(--font-display);font-size:.8rem;letter-spacing:.02em}.empty-state{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-3);padding:var(--space-5) 0}.empty-state-lead{margin:0;color:var(--text-muted);font-size:.9rem;max-width:46ch}.category-chip-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:var(--space-2)}.category-chip{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);background:var(--surface-2);border:1px solid rgba(56,189,248,.15);border-radius:var(--radius);font-family:var(--font-display);font-size:.78rem;color:var(--text-muted)}.category-chip-count{color:var(--accent);font-weight:700}.results-list{list-style:none;margin:0;padding:0;overflow-y:auto;display:flex;flex-direction:column;gap:var(--space-2)}.result-item{--verdict: var(--text-muted);position:relative;background:linear-gradient(180deg,rgba(255,255,255,.015),transparent),var(--surface-2);border:1px solid rgba(56,189,248,.08);border-left:3px solid var(--verdict);border-radius:var(--radius);padding:var(--space-3);animation:row-in .18s ease-out both}.result-item.result-pass{--verdict: var(--success)}.result-item.result-fail{--verdict: var(--danger)}.result-item.result-ambiguous{--verdict: var(--accent-support)}@keyframes row-in{0%{opacity:0;transform:translateY(4px)}}.result-head{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap}.verdict-badge{flex-shrink:0;font-family:var(--font-display);font-weight:700;font-size:.62rem;letter-spacing:.08em;color:var(--bg);background:var(--verdict);border-radius:999px;padding:2px var(--space-2)}.result-title{position:relative;font-weight:600;font-size:.95rem}.strike{position:absolute;top:50%;left:-2px;right:-2px;height:2px;background:var(--danger);transform-origin:left center;transform:scaleX(0);border-radius:2px}.result-fail .strike{animation:strike-draw .14s .12s ease-out forwards}@keyframes strike-draw{to{transform:scaleX(1)}}.result-category{margin-left:auto;font-family:var(--font-display);font-size:.68rem;color:var(--accent);border:1px solid rgba(56,189,248,.25);border-radius:var(--radius);padding:1px var(--space-2)}.verdict-headline{margin:var(--space-2) 0 0;font-size:.88rem;color:var(--text)}.result-actual{display:flex;align-items:baseline;gap:var(--space-2);margin-top:var(--space-2);flex-wrap:wrap}.io-label{flex-shrink:0;font-family:var(--font-display);font-size:.65rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted)}.result-actual code,.diff-cell code{font-family:var(--font-display);font-size:.82rem;overflow-wrap:anywhere;word-break:break-word}.result-fail .result-actual code{color:var(--danger)}.result-ambiguous .result-actual code{color:var(--accent-support)}.result-pass .result-actual code{color:var(--success)}.result-diff{margin-top:var(--space-2);border:1px solid rgba(56,189,248,.12);border-radius:var(--radius);background:#0003}.result-diff summary{cursor:pointer;padding:var(--space-2) var(--space-3);font-size:.8rem;color:var(--accent);list-style:none}.result-diff summary::-webkit-details-marker{display:none}.result-diff summary:before{content:"▸ ";display:inline-block;transition:transform var(--motion)}.result-diff[open] summary:before{transform:rotate(90deg)}.diff-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2);padding:0 var(--space-3) var(--space-3)}.diff-cell{display:flex;flex-direction:column;gap:var(--space-1);padding:var(--space-2);border-radius:var(--radius);background:var(--surface-1)}.diff-actual{border:1px solid rgba(239,68,68,.3)}.diff-actual code{color:var(--danger)}.diff-expected{border:1px solid rgba(52,211,153,.3)}.diff-expected code{color:var(--success)}.result-note{color:var(--text-muted);font-size:.82rem;line-height:1.5;max-width:70ch;margin:var(--space-2) 0 0}@media (prefers-reduced-motion: reduce){.result-item{animation:none}.strike{transform:scaleX(1);animation:none}.result-diff summary:before{transition:none}}@media (max-width: 480px){.diff-grid{grid-template-columns:1fr}.result-category{margin-left:0}}@media (prefers-reduced-motion: reduce){.clock-hand{animation:none}button{transition:none}}@media (max-width: 900px){.workbench{grid-template-columns:1fr}#source-input{min-height:30vh}}.learn{max-width:760px;margin:0 auto;padding:var(--space-6) var(--space-4) var(--space-5);border-top:1px solid rgba(56,189,248,.15)}.learn h2{font-family:var(--font-display);font-size:1.4rem;margin:0 0 var(--space-4)}.learn>p{color:var(--text-muted);line-height:1.65;max-width:68ch;margin:0 0 var(--space-5)}.faq{display:flex;flex-direction:column;gap:var(--space-4)}.faq-item{background:var(--surface-1);border:1px solid rgba(56,189,248,.1);border-radius:var(--radius-lg);padding:var(--space-4)}.faq-item h3{font-family:var(--font-display);font-size:1rem;margin:0 0 var(--space-2);color:var(--text)}.faq-item p{margin:0;color:var(--text-muted);line-height:1.6;max-width:66ch}.faq-item code{font-family:var(--font-display);font-size:.85em;color:var(--accent)}.app-footer{display:flex;justify-content:center;align-items:center;gap:var(--space-2);padding:var(--space-4);color:var(--text-muted);font-size:.85rem;border-top:1px solid rgba(56,189,248,.15)}.app-footer a{color:var(--accent)}