:root{color-scheme:light;--font-sans: "Space Grotesk", "Avenir", "Segoe UI", sans-serif;--font-mono: "JetBrains Mono", "SFMono-Regular", Menlo, Consolas, "Liberation Mono", monospace;--color-bg-0: #f8fafc;--color-bg-1: #eef2f6;--surface-1: #ffffff;--surface-2: #f5f7fb;--surface-3: #f8fafc;--border-weak: rgba(15, 23, 42, .08);--border-strong: rgba(15, 23, 42, .16);--text-1: #0f172a;--text-2: #334155;--text-3: #64748b;--text-4: #94a3b8;--accent-1: #2563eb;--accent-2: #0ea5e9;--shadow-1: 0 8px 18px rgba(15, 23, 42, .08);--shadow-2: 0 16px 32px rgba(15, 23, 42, .1);--radius-sm: 10px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px;--radius-pill: 999px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--space-7: 40px;--space-8: 48px}*{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:var(--font-sans);color:var(--text-1);background:radial-gradient(80% 60% at 10% 0%,rgba(37,99,235,.08),transparent 60%),linear-gradient(180deg,var(--color-bg-0),var(--color-bg-1))}button,textarea{font-family:inherit;color:inherit}.page{min-height:100vh;padding:var(--space-7) clamp(var(--space-5),4vw,var(--space-8))}.shell{display:grid;grid-template-columns:minmax(220px,300px) minmax(0,1fr);gap:clamp(var(--space-5),3vw,var(--space-7));align-items:start}.menu{background:var(--surface-2);border:1px solid var(--border-weak);border-radius:var(--radius-xl);padding:var(--space-5);box-shadow:var(--shadow-1);display:grid;gap:var(--space-4)}.menu-header h1{margin:0 0 var(--space-4) 0;font-size:1.4rem;letter-spacing:.01em;color:var(--text-1)}.menu-item{width:100%;min-height:40px;padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);border:1px solid transparent;background:transparent;color:var(--text-2);text-align:left;font-weight:600;cursor:pointer;transition:border-color .2s ease,background .2s ease,color .2s ease}.menu-item:hover{border-color:var(--border-strong);color:var(--text-1);background:#2563eb0f}.menu-item.is-active{background:#2563eb1f;border-color:#2563eb4d;color:var(--text-1)}.panel{background:var(--surface-1);border:1px solid var(--border-weak);border-radius:var(--radius-xl);padding:var(--space-6);box-shadow:var(--shadow-2)}.panel-header{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);margin-bottom:var(--space-6)}.panel-header h2{margin:var(--space-2) 0 0 0;font-size:clamp(1.5rem,2.6vw,2.15rem);letter-spacing:.01em;color:var(--text-1)}.panel-meta{display:flex;align-items:center;gap:var(--space-3)}.lang-label{font-size:.7rem;text-transform:uppercase;letter-spacing:.14em;color:var(--text-3)}.lang-select{position:relative}.lang-trigger{min-height:40px;padding:0 var(--space-5) 0 var(--space-4);border-radius:var(--radius-md);border:1px solid var(--border-strong);background:#fff;color:var(--text-2);font-weight:600;line-height:1.2;display:inline-flex;align-items:center;gap:var(--space-3);cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,background .2s ease,border-color .2s ease}.lang-trigger:hover{transform:translateY(-1px);color:var(--text-1);border-color:#2563eb66;background:#2563eb0f}.lang-trigger:focus-visible{outline:2px solid rgba(37,99,235,.5);outline-offset:2px}.lang-chevron{font-size:.8rem;color:var(--text-3)}.lang-menu{position:absolute;top:calc(100% + 6px);left:0;min-width:100%;background:#fff;border:1px solid var(--border-strong);border-radius:var(--radius-md);box-shadow:var(--shadow-1);padding:var(--space-2);display:grid;gap:var(--space-1);z-index:10}.lang-option{min-height:40px;padding:0 var(--space-4);border-radius:var(--radius-md);border:1px solid transparent;background:#fff;color:var(--text-2);text-align:left;font-weight:600;cursor:pointer}.lang-option:hover{border-color:#2563eb66;background:#2563eb14;color:var(--text-1)}.lang-option.active{border-color:#2563eb80;background:#2563eb1f;color:var(--text-1)}.tag{padding:var(--space-2) var(--space-3);border-radius:var(--radius-pill);border:1px solid var(--border-strong);color:var(--text-3);font-size:.7rem;text-transform:uppercase;letter-spacing:.16em;background:#fff}.panel-body{display:grid;gap:var(--space-5)}.field{display:grid;gap:var(--space-2);font-size:.9rem;color:var(--text-2)}.field-inline{display:flex;align-items:center;gap:var(--space-3);font-size:.9rem;color:var(--text-2)}.unit-select{min-height:40px;border-radius:var(--radius-md);border:1px solid var(--border-strong);background:#fff;color:var(--text-1);padding:0 var(--space-3);font-size:.9rem;font-family:inherit}.unit-select:focus-visible{outline:2px solid rgba(37,99,235,.5);outline-offset:2px;border-color:#2563eb8c}.field-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);color:var(--text-2)}textarea{width:100%;background:var(--surface-3);border:1px solid var(--border-strong);border-radius:var(--radius-md);padding:var(--space-4);color:var(--text-1);resize:vertical;min-height:120px;font-family:var(--font-mono);font-size:.92rem;line-height:1.6;box-shadow:inset 0 0 0 1px #0f172a0a}textarea::placeholder{color:var(--text-4)}textarea:focus-visible{outline:2px solid rgba(37,99,235,.5);outline-offset:2px;border-color:#2563eb8c;background:#fff}.actions{display:flex;flex-wrap:wrap;gap:var(--space-3)}.primary,.ghost,.copy{min-height:40px;border-radius:var(--radius-md);padding:var(--space-3) var(--space-5);border:1px solid transparent;font-weight:600;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,background .2s ease,border-color .2s ease}.primary{background:var(--accent-1);color:#fff;box-shadow:0 10px 20px #2563eb40}.primary:hover{transform:translateY(-1px);box-shadow:0 12px 24px #2563eb4d}.ghost,.copy{background:#fff;border-color:var(--border-strong);color:var(--text-2)}.ghost:hover,.copy:hover{transform:translateY(-1px);color:var(--text-1);border-color:#2563eb66;background:#2563eb0f}.primary:focus-visible,.ghost:focus-visible,.copy:focus-visible,.menu-item:focus-visible{outline:2px solid rgba(37,99,235,.5);outline-offset:2px}.primary:disabled,.ghost:disabled,.copy:disabled,.menu-item:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:none}.feedback{padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);background:#fff5f5;border:1px solid rgba(239,68,68,.35);color:#b91c1c}.output textarea{display:block}.eyebrow{letter-spacing:.28em;font-size:.68rem;text-transform:uppercase;color:var(--text-4);margin:0}@media (max-width: 1024px){.page{padding:var(--space-6) var(--space-5)}.shell{grid-template-columns:1fr}.menu{padding:var(--space-4);gap:var(--space-3)}.menu-header h1{margin-bottom:var(--space-3)}}@media (max-width: 640px){.panel{padding:var(--space-5)}.panel-header{flex-direction:column;align-items:flex-start}.tag{align-self:flex-start}}