@import "https://fonts.googleapis.com/css2?family=Sora:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap";:root{--bg:#f4f7ff;--bg-overlay:#fef0ff;--card:#fff;--card-alt:#f6f8ff;--text:#15182d;--muted:#636e94;--stroke:#d6def7;--accent:#3f7cff;--accent-2:#00c2b8;--danger:#d84f62;--success:#12886c;--chip-bg:#edf3ff;--chip-text:#3b4a81;--input-bg:#fcfdff;--output-text:#1d316c;--radius:18px;--shadow:0 24px 68px #3a53b233}:root[data-theme=dark]{--bg:#0a1024;--bg-overlay:#251042;--card:#101933;--card-alt:#152147;--text:#eaf0ff;--muted:#9eadcf;--stroke:#2b3a69;--accent:#68a7ff;--accent-2:#16d6c8;--danger:#ff9aa7;--success:#70ddb7;--chip-bg:#152349;--chip-text:#bfd1ff;--input-bg:#0b1430;--output-text:#b7d2ff;--shadow:0 24px 72px #00000073}*{box-sizing:border-box}body{min-height:100vh;color:var(--text);background:radial-gradient(circle at 8% 10%, #3f7cff4d, transparent 42%), radial-gradient(circle at 86% 22%, #00c2b833, transparent 40%), linear-gradient(140deg, var(--bg), var(--bg-overlay));margin:0;font-family:Sora,Avenir Next,Segoe UI,sans-serif}.page{place-items:center;min-height:100vh;padding:28px;display:grid}.card{background:linear-gradient(160deg, var(--card), var(--card-alt));border:1px solid var(--stroke);border-radius:var(--radius);width:min(860px,100%);box-shadow:var(--shadow);padding:28px;animation:.36s card-enter}@keyframes card-enter{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.card-header{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px 14px;margin-bottom:18px;display:grid}.title-wrap{min-width:0}.header-actions{background:var(--chip-bg);border:1px solid var(--stroke);border-radius:999px;grid-area:1/2;justify-self:end;align-items:center;gap:8px;padding:4px;display:flex}h1{letter-spacing:-.02em;white-space:nowrap;text-wrap:nowrap;color:#121832;margin:0;font-size:clamp(22px,3.4vw,36px);font-weight:700;line-height:1.05}:root[data-theme=dark] h1{color:#f2f6ff}.lang-switch{background:0 0;border:0;border-radius:999px;padding:0;display:inline-flex}.lang-btn{color:var(--chip-text);letter-spacing:.08em;text-transform:uppercase;cursor:pointer;background:0 0;border:0;border-radius:999px;min-width:44px;padding:8px 10px;font:500 12px/1 Sora,sans-serif}.lang-btn.active{background:var(--accent);color:#fff}.theme-btn{color:var(--chip-text);cursor:pointer;background:0 0;border:0;border-radius:999px;width:42px;height:42px;padding:0;font:600 16px/1 Sora,sans-serif}.fields{gap:10px;display:grid}.label{color:var(--muted);text-transform:uppercase;letter-spacing:.14em;font-size:12px}.input-hint{color:var(--muted);letter-spacing:.01em;margin:-2px 0 2px;font-size:12px;line-height:1.35}.select,.input,.output,.primary,.ghost{border:1px solid var(--stroke);border-radius:12px;width:100%;font-family:IBM Plex Mono,Cascadia Code,monospace;font-size:14px;transition:border-color .18s,transform .18s,box-shadow .18s}.select,.input,.output{background:var(--input-bg);color:var(--text);padding:12px 14px}.select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M5 7.5L10 12.5L15 7.5' stroke='%23889bd2' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-position:right 16px center;background-repeat:no-repeat;padding-right:48px}.select:focus-visible,.input:focus-visible,.output:focus-visible,.primary:focus-visible,.ghost:focus-visible,.lang-btn:focus-visible,.theme-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.primary{color:#fff;background:linear-gradient(100deg, var(--accent), #6f6dff);cursor:pointer;border-color:#0000;margin-top:8px;padding:12px 14px;font-family:Sora,sans-serif;font-weight:600}.primary:hover{transform:translateY(-1px);box-shadow:0 10px 28px #3f7cff59}.status{min-height:1.3em;color:var(--muted);margin:4px 0 2px;font-size:13px}.status.error{color:var(--danger)}.status.success{color:var(--success)}.output-grid{gap:10px;margin-top:6px;display:grid}.output-row{grid-template-columns:1fr auto;gap:8px;display:grid}.output{color:var(--output-text)}.ghost{white-space:nowrap;background:var(--chip-bg);width:auto;color:var(--accent-2);cursor:pointer;padding:10px 14px}.ghost:hover{border-color:var(--accent-2)}.hidden{display:none}@media (width<=620px){.page{padding:12px}.card{padding:18px}.card-header{margin-bottom:16px}.header-actions{gap:6px}.output-row{grid-template-columns:1fr}}
