:root{--background:#f8f6f1;--foreground:#1f2b38;--muted:#627183;--card:#ffffffe0;--card-strong:#fff;--border:#dce4ec;--accent:#0f6ddf;--accent-hover:#0b5bc0;--error:#be2d2d;--success:#0d8a5f}*{box-sizing:border-box}body{min-height:100vh;color:var(--foreground);background-color:#0000;background-image:radial-gradient(circle at 88% 12%,#54b0ee33 0%,#54b0ee00 46%),radial-gradient(circle at 8% 18%,#ffcb8240 0%,#ffcb8200 34%),linear-gradient(165deg,#fffefb 0%,#f5f9ff 42%,#f1f8f6 100%);background-position:0 0,0 0,0 0;background-repeat:repeat,repeat,repeat;background-size:auto,auto,auto;background-attachment:fixed;background-origin:padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box;margin:0;font-family:Inter,Segoe UI,Arial,Helvetica,sans-serif}body:before{content:"";pointer-events:none;z-index:-1;background:linear-gradient(#ffffff7a 0%,#ffffffb8 100%),radial-gradient(1200px 420px at 50% 95%,#488ec22e,#488ec200);position:fixed;inset:0}button,input,select,textarea{font:inherit}.page{gap:24px;width:min(1120px,100%);margin:0 auto;padding:clamp(24px,4vw,56px) 20px 60px;display:grid}.hero{background:linear-gradient(125deg,#ffffffe0,#ffffffb8),linear-gradient(160deg,#cde6ff 0%,#d8f2ed 45%,#f7e7cf 100%);position:relative;overflow:hidden}.hero:after{content:"";aspect-ratio:1.3;background:linear-gradient(160deg,#88cbff6b,#85e7c357);border-radius:58% 42% 30% 70%/48% 31% 69% 52%;width:min(460px,62vw);position:absolute;inset:auto -8% -32% auto}.eyebrow,h1,.lead{z-index:1;position:relative}.eyebrow{color:#3f5c78;text-transform:uppercase;letter-spacing:.08em;margin:0 0 10px;font-size:12px;font-weight:700}h1{letter-spacing:-.03em;max-width:760px;margin:0;font-size:clamp(30px,5.5vw,56px);line-height:1.04}.lead{max-width:720px;color:var(--muted);margin-top:18px;font-size:clamp(16px,2vw,20px);line-height:1.55}.workspace{grid-template-columns:minmax(0,1fr) minmax(320px,.9fr);gap:22px;display:grid}.card{background:var(--card);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--border);border-radius:24px;padding:clamp(20px,3vw,30px);box-shadow:0 16px 44px #1f3a5414}.form{gap:16px;display:grid}label{gap:8px;font-size:15px;font-weight:600;display:grid}input,select,textarea{background:var(--card-strong);width:100%;color:var(--foreground);border:1px solid #cfdae6;border-radius:14px;outline:none;padding:13px 14px;transition:border-color .2s,box-shadow .2s}textarea{resize:vertical}input:focus,select:focus,textarea:focus{border-color:#7ab3f0;box-shadow:0 0 0 4px #3d92ec24}button{background:linear-gradient(140deg, var(--accent), #35a2ff);color:#fff;letter-spacing:.01em;cursor:pointer;border:0;border-radius:16px;padding:15px 20px;font-weight:700;transition:transform .15s,box-shadow .2s,background .2s;box-shadow:0 10px 22px #0f6ddf52}button:hover:enabled{background:linear-gradient(140deg, var(--accent-hover), #1f89e5);transform:translateY(-1px)}button:disabled{opacity:.78;cursor:not-allowed;box-shadow:none}.result{align-self:start}.result h2{margin:0 0 14px;font-size:24px}.state{border:1px solid #0000;border-radius:14px;margin:0;padding:14px 16px}.muted{color:var(--muted);background:#f4f8fc;border-color:#dce8f3}.loading{color:#2e557d;background:#edf5ff;border-color:#cfe0f4}.error{color:var(--error);background:#ffefef;border-color:#f6cdcd;font-weight:600}.success{color:#213244;background:#f6fbf8;border-color:#d4e9df}pre{white-space:pre-wrap;word-break:break-word;font-family:inherit;line-height:1.6}@media (max-width:860px){.workspace{grid-template-columns:1fr}.result{order:2}}
