@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap";
:root{--bg-deep:#07080c;--bg:#0b0f17;--bg-elevated:#121620b8;--bg-card:#161b268c;--bg-input:#0c1018d9;--fg:#f4f6fb;--fg-secondary:#a8b0c0;--muted:#6b7385;--muted-soft:#4a5160;--border:#ffffff12;--border-strong:#ffffff1f;--border-glow:#2dd4bf59;--accent:#2dd4bf;--accent-dim:#2dd4bf26;--accent-glow:#2dd4bf66;--gold:#d4af37;--gold-dim:#d4af3726;--ok:#34d399;--ok-bg:#34d3991f;--warn:#fbbf24;--warn-bg:#fbbf241f;--err:#f87171;--err-bg:#f871711f;--radius:14px;--radius-sm:10px;--radius-pill:999px;--shadow-card:0 4px 24px #00000059, 0 0 0 1px var(--border);--shadow-lift:0 12px 40px #00000073, 0 0 0 1px var(--border-strong);--shadow-glow:0 0 32px var(--accent-glow);--font-sans:"Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono:"JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace}*,:before,:after{box-sizing:border-box}html{scroll-behavior:smooth}body{min-height:100vh;color:var(--fg);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:radial-gradient(ellipse 80% 50% at 50% -20%, #2dd4bf14, transparent 55%), radial-gradient(ellipse 60% 40% at 100% 0%, #d4af370d, transparent 45%), radial-gradient(ellipse 50% 30% at 0% 80%, #2dd4bf0a, transparent 50%), var(--bg-deep);background-attachment:fixed;margin:0;font-size:15px;line-height:1.55}.app-shell{max-width:1180px;margin:0 auto;padding:1.25rem 1.25rem 3rem}.nav{z-index:50;border-radius:var(--radius);background:var(--bg-elevated);border:1px solid var(--border);-webkit-backdrop-filter:blur(20px)saturate(140%);box-shadow:var(--shadow-card);justify-content:space-between;align-items:center;gap:1rem;margin-bottom:2.5rem;padding:.7rem 1.1rem;display:flex;position:sticky;top:1rem}.nav-brand{color:inherit;align-items:center;gap:.65rem;text-decoration:none;display:flex}.nav-logo{background:linear-gradient(135deg, var(--accent) 0%, #0d9488 100%);color:#042f2e;width:32px;height:32px;box-shadow:0 0 20px var(--accent-glow);border-radius:9px;place-items:center;font-size:.85rem;font-weight:700;display:grid}.nav-title{letter-spacing:-.02em;font-size:1.05rem;font-weight:650}.nav-title span{background:linear-gradient(90deg, var(--accent), var(--gold));color:#0000;-webkit-background-clip:text;background-clip:text}.nav-meta{color:var(--muted);letter-spacing:.02em;flex:1;align-items:center;gap:1rem;font-size:.75rem;display:flex}.nav-link{color:var(--fg-secondary);font-size:.9rem;font-weight:600;text-decoration:none}.nav-link:hover,.nav-link-active{color:var(--fg)}.nav-auth{align-items:center;gap:.5rem;margin-left:auto;display:flex}.auth-user{align-items:center;gap:.55rem;display:flex}.auth-avatar{object-fit:cover;border:1px solid var(--border-strong);border-radius:50%;width:28px;height:28px}.auth-name{color:var(--fg-secondary);text-overflow:ellipsis;white-space:nowrap;max-width:140px;font-size:.8rem;overflow:hidden}.auth-btn{padding:.35rem .75rem;font-size:.8rem}.auth-signin{background:var(--accent-dim);color:var(--accent);border:1px solid #2dd4bf59}.auth-signin:hover{background:#2dd4bf40}.auth-loading{color:var(--muted);font-size:.8rem}.hero{text-align:center;margin-bottom:2.75rem;padding:0 .5rem}.hero-badge{border-radius:var(--radius-pill);letter-spacing:.04em;text-transform:uppercase;color:var(--accent);background:var(--accent-dim);border:1px solid #2dd4bf40;align-items:center;gap:.4rem;margin-bottom:1.1rem;padding:.3rem .75rem;font-size:.72rem;font-weight:500;display:inline-flex}.hero h1{letter-spacing:-.035em;color:var(--fg);margin:0 0 .75rem;font-size:clamp(1.85rem,4vw,2.6rem);font-weight:700;line-height:1.15}.hero h1 em{background:linear-gradient(105deg, var(--accent) 10%, #5eead4 45%, var(--gold) 90%);color:#0000;-webkit-background-clip:text;background-clip:text;font-style:normal}.hero p{max-width:520px;color:var(--fg-secondary);margin:0 auto;font-size:1rem;line-height:1.6}.grid-2{gap:1.35rem;display:grid}@media (min-width:960px){.grid-2{grid-template-columns:1fr 1fr;align-items:start}}.card{border-radius:var(--radius);background:var(--bg-card);border:1px solid var(--border);-webkit-backdrop-filter:blur(16px)saturate(130%);box-shadow:var(--shadow-card);padding:1.35rem 1.4rem;transition:transform .25s,box-shadow .25s,border-color .25s;position:relative}.card:hover{box-shadow:var(--shadow-lift);border-color:var(--border-strong);transform:translateY(-2px)}.card-header{justify-content:space-between;align-items:center;margin-bottom:1.15rem;display:flex}.card-title{letter-spacing:-.01em;color:var(--fg);margin:0;font-size:.95rem;font-weight:600}.card-subtitle{color:var(--muted);margin:.15rem 0 0;font-size:.78rem}.field{margin-bottom:1rem}.field-row{flex-wrap:wrap;gap:.75rem;margin-bottom:1rem;display:flex}.field-row .field{flex:140px;margin-bottom:0}label{letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin-bottom:.35rem;font-size:.72rem;font-weight:500;display:block}input,select,textarea{width:100%;font:inherit;color:var(--fg);background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.65rem .85rem;transition:border-color .2s,box-shadow .2s,background .2s}input:hover,select:hover,textarea:hover{border-color:var(--border-strong)}input:focus,select:focus,textarea:focus{box-shadow:0 0 0 3px var(--accent-dim);background:#0c1018f2;border-color:#2dd4bf8c;outline:none}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='%236b7385' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10l-5 5z'/%3E%3C/svg%3E");background-position:right .85rem center;background-repeat:no-repeat;padding-right:2rem}textarea{resize:vertical;min-height:280px;font-family:var(--font-mono);font-size:.82rem;line-height:1.55}textarea::placeholder{color:var(--muted-soft)}.btn{border-radius:var(--radius-sm);width:100%;font:inherit;letter-spacing:-.01em;color:#042f2e;cursor:pointer;background:linear-gradient(135deg, #5eead4 0%, var(--accent) 50%, #14b8a6 100%);border:none;justify-content:center;align-items:center;gap:.5rem;margin-top:.35rem;padding:.85rem 1.25rem;font-size:.92rem;font-weight:600;transition:transform .18s,box-shadow .18s,filter .18s;display:inline-flex;box-shadow:inset 0 1px #fff3,0 4px 16px #2dd4bf40}.btn:hover:not(:disabled){filter:brightness(1.05);transform:translateY(-1px)scale(1.01);box-shadow:inset 0 1px #ffffff40,0 8px 28px #2dd4bf66}.btn:active:not(:disabled){transform:translateY(0)scale(.99)}.btn:disabled{opacity:.45;cursor:not-allowed;filter:grayscale(.3)}.btn-ghost{color:var(--accent);box-shadow:none;background:0 0;border:1px solid #2dd4bf4d;width:auto;padding:.35rem .75rem;font-size:.75rem;font-weight:500}.btn-ghost:hover:not(:disabled){background:var(--accent-dim);box-shadow:none;filter:none}.badges{flex-wrap:wrap;gap:.45rem;display:flex}.badge{border-radius:var(--radius-pill);letter-spacing:.02em;border:1px solid #0000;align-items:center;gap:.3rem;padding:.28rem .7rem;font-size:.72rem;font-weight:500;display:inline-flex}.badge-ok{background:var(--ok-bg);color:var(--ok);border-color:#34d39940}.badge-warn{background:var(--warn-bg);color:var(--warn);border-color:#fbbf2440}.badge-err{background:var(--err-bg);color:var(--err);border-color:#f8717140}.badge-muted{color:var(--fg-secondary);border-color:var(--border);background:#ffffff0d}.panel-error{border-radius:var(--radius-sm);background:var(--err-bg);color:#fca5a5;border:1px solid #f871714d;padding:.85rem 1rem;font-size:.85rem}.panel-warn{border-radius:var(--radius-sm);background:var(--warn-bg);border:1px solid #fbbf244d;padding:.85rem 1rem}.panel-warn-title{color:var(--warn);margin:0 0 .45rem;font-size:.82rem;font-weight:600}.panel-warn ul{color:#fde68a;margin:0;padding-left:1.15rem;font-size:.82rem}.code-header{justify-content:space-between;align-items:center;margin-bottom:.55rem;display:flex}.code-label{color:var(--fg-secondary);font-size:.78rem;font-weight:500}.code-block{border-radius:var(--radius-sm);border:1px solid var(--border);max-height:420px;font-family:var(--font-mono);white-space:pre-wrap;word-break:break-word;color:#c8d0e0;background:#06080cd9;margin:0;padding:1rem 1.1rem;font-size:.78rem;line-height:1.55;display:block;overflow:auto}.code-block::-webkit-scrollbar{width:8px;height:8px}.code-block::-webkit-scrollbar-thumb{background:#ffffff1f;border-radius:4px}.state-box{border-radius:var(--radius-sm);border:1px dashed var(--border-strong);text-align:center;min-height:220px;color:var(--muted);background:#ffffff04;flex-direction:column;justify-content:center;align-items:center;gap:.75rem;padding:2rem 1.5rem;font-size:.9rem;display:flex}.state-box strong{color:var(--fg-secondary);font-weight:500}.spinner{border:2px solid var(--border-strong);border-top-color:var(--accent);border-radius:50%;width:28px;height:28px;animation:.75s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.stack>*+*{margin-top:1rem}.footer{border-top:1px solid var(--border);text-align:center;color:var(--muted-soft);letter-spacing:.02em;margin-top:3rem;padding-top:1.5rem;font-size:.75rem}.footer span{color:var(--muted)}.sr-only{clip:rect(0, 0, 0, 0);border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.hero-dot{background:var(--accent);width:6px;height:6px;box-shadow:0 0 8px var(--accent);border-radius:50%}.platform-bar{margin-bottom:1.35rem;padding:1.15rem 1.35rem}.platform-selectors{flex-wrap:wrap;align-items:flex-end;gap:.85rem;display:flex}.platform-selectors .field{flex:160px;margin-bottom:0}.swap-btn{border:1px solid var(--border-strong);width:42px;height:42px;color:var(--accent);cursor:pointer;background:#ffffff0a;border-radius:12px;flex-shrink:0;place-items:center;margin-bottom:1px;transition:background .2s,border-color .2s,transform .2s,box-shadow .2s;display:grid}.swap-btn:hover{background:var(--accent-dim);box-shadow:0 0 20px var(--accent-dim);border-color:#2dd4bf66;transform:scale(1.05)}.platform-options{border-top:1px solid var(--border);flex-wrap:wrap;align-items:flex-end;gap:1rem 1.5rem;margin-top:1rem;padding-top:1rem;display:flex}.user-field{flex:0 200px;margin-bottom:0}.checkbox-label{color:var(--fg-secondary);cursor:pointer;text-transform:none;letter-spacing:normal;align-items:center;gap:.5rem;margin-bottom:.35rem;font-size:.85rem;display:inline-flex}.checkbox-label input[type=checkbox]{width:16px;height:16px;accent-color:var(--accent);cursor:pointer}.editors{margin-bottom:1.25rem}.editor-card .card-header{margin-bottom:.85rem}.editor-actions{flex-wrap:wrap;gap:.4rem;display:flex}.editor-wrap{position:relative}.code-editor{resize:vertical;width:100%;min-height:320px;font-family:var(--font-mono);border-radius:var(--radius-sm);border:1px solid var(--border);color:#c8d0e0;tab-size:2;background:#06080ce6;padding:1rem 1.05rem;font-size:.8rem;line-height:1.55}.code-editor.output{color:#b8f5e8}.code-editor:focus{box-shadow:0 0 0 3px var(--accent-dim);border-color:#2dd4bf73}.state-box.compact{min-height:180px;padding:1.5rem 1rem}.convert-bar{flex-direction:column;align-items:center;gap:.65rem;margin:.5rem 0 1.5rem;display:flex}.convert-btn{border-radius:12px;width:100%;max-width:360px;padding:1rem 1.5rem;font-size:1rem;position:relative;overflow:hidden}.convert-btn:after{content:"";opacity:0;z-index:-1;filter:blur(12px);background:linear-gradient(135deg,#2dd4bf80,#d4af374d);border-radius:14px;transition:opacity .3s;position:absolute;inset:-2px}.convert-btn:hover:not(:disabled):after,.convert-btn.is-loading:after{opacity:1}.btn-arrow{opacity:.85;margin-left:.35rem}.hint-error{color:var(--err);margin:0;font-size:.8rem}.result-card{margin-bottom:1rem}.plan-bar{flex-wrap:wrap;align-items:center;gap:.6rem;margin-top:1.25rem;display:flex}.plan-pill{border-radius:var(--radius-pill);background:var(--bg-card);border:1px solid var(--border);color:var(--fg-secondary);align-items:center;gap:.25rem;padding:.35rem .75rem;font-size:.85rem;display:inline-flex}.plan-pill strong{color:var(--fg);text-transform:capitalize}.plan-status{text-transform:capitalize;color:var(--muted)}.plan-upgrade-link{color:var(--accent);font-size:.85rem;font-weight:600;text-decoration:none}.plan-upgrade-link:hover{text-decoration:underline}.plan-upgrade-muted{color:var(--fg-secondary);font-weight:500}.pricing-grid{grid-template-columns:repeat(3,1fr);gap:1.25rem;margin:1.5rem 0 2rem;display:grid}@media (max-width:900px){.pricing-grid{grid-template-columns:1fr}}.pricing-card{flex-direction:column;gap:.85rem;padding:1.5rem 1.35rem;display:flex;position:relative}.pricing-card-featured{border-color:var(--border-glow);box-shadow:var(--shadow-glow), var(--shadow-card)}.pricing-badge{border-radius:var(--radius-pill);background:var(--accent);color:#04110e;letter-spacing:.02em;text-transform:uppercase;padding:.2rem .7rem;font-size:.7rem;font-weight:700;position:absolute;top:-.65rem;left:50%;transform:translate(-50%)}.pricing-name{margin:.4rem 0 0;font-size:1.25rem;font-weight:600}.pricing-price{align-items:baseline;gap:.2rem;display:flex}.pricing-amount{letter-spacing:-.02em;font-size:2rem;font-weight:700}.pricing-period{color:var(--muted);font-size:.95rem}.pricing-features{flex-direction:column;flex:1;gap:.45rem;margin:0;padding:0;list-style:none;display:flex}.pricing-features li{color:var(--fg-secondary);padding-left:1.2rem;font-size:.9rem;position:relative}.pricing-features li:before{content:"✓";color:var(--accent);font-weight:600;position:absolute;left:0}.pricing-cta{width:100%;margin-top:.5rem}.pricing-note{text-align:center;color:var(--muted);margin:0 0 2rem;font-size:.85rem}