:root{--bg: #f7f5ef;--ink: #141a22;--soft-ink: #4f5c70;--card: rgba(255, 255, 255, .8);--line: rgba(20, 26, 34, .14);--primary: #0f766e;--primary-ink: #effff9;--danger: #a61b1b}*{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:Space Grotesk,sans-serif;color:var(--ink);background:radial-gradient(circle at 12% 18%,rgba(15,118,110,.2),transparent 48%),radial-gradient(circle at 85% 82%,rgba(247,114,8,.18),transparent 40%),linear-gradient(165deg,#f4f2ea,#fefdf9 44%,#f2ede1)}code,textarea{font-family:IBM Plex Mono,monospace}.app-shell{position:relative;min-height:100vh;display:grid;place-items:center;padding:24px;overflow:hidden}.backdrop-orb{position:absolute;border-radius:999px;filter:blur(40px);pointer-events:none}.orb-a{width:320px;height:320px;top:-80px;right:-70px;background:#10b98159;animation:driftA 7s ease-in-out infinite alternate}.orb-b{width:260px;height:260px;bottom:-90px;left:-60px;background:#f9731652;animation:driftB 8s ease-in-out infinite alternate}.card{width:min(880px,100%);border:1px solid var(--line);background:var(--card);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:22px;padding:24px;box-shadow:0 20px 55px #141a221a;animation:riseIn .42s ease-out}.eyebrow{margin:0 0 8px;letter-spacing:.12em;font-size:12px;text-transform:uppercase;color:var(--soft-ink)}h1{margin:0 0 10px;font-size:clamp(1.4rem,2vw,2rem)}.hint{margin:0 0 18px;color:var(--soft-ink)}.hint code{background:#141a220d;border:1px solid rgba(20,26,34,.1);border-radius:8px;padding:3px 6px}.form-grid{display:grid;gap:12px}.file-label{display:grid;gap:8px;padding:12px;border:1px dashed var(--line);border-radius:12px;background:#ffffffad}.file-label span{color:var(--soft-ink);font-size:14px}.file-meta{margin:0;color:var(--ink);font-size:14px}.file-meta span{color:var(--soft-ink)}.progress-wrap{border:1px solid var(--line);border-radius:12px;background:#ffffffad;padding:10px}.progress-meta{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--soft-ink);margin-bottom:8px}.progress-meta strong{color:var(--ink);font-size:14px}.progress-track{height:10px;border-radius:999px;background:#141a2214;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#0f766e,#14b8a6);width:0%;transition:width .35s ease}button{border:0;border-radius:12px;background:var(--primary);color:var(--primary-ink);font-weight:700;font-size:15px;padding:12px 14px;cursor:pointer;transition:transform .16s ease,opacity .16s ease}button:hover{transform:translateY(-1px)}button:disabled{opacity:.6;cursor:not-allowed;transform:none}.error{margin:14px 0 0;color:var(--danger);font-weight:500}.output{margin-top:18px}.output-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}h2{margin:0;font-size:1rem}.ghost{background:transparent;color:var(--ink);border:1px solid var(--line);padding:8px 10px;font-size:13px}textarea{width:100%;min-height:340px;border:1px solid var(--line);border-radius:12px;padding:12px;background:#ffffffa3;resize:vertical;font-size:13px;line-height:1.45}@media (max-width: 640px){.card{padding:16px;border-radius:16px}textarea{min-height:260px}}@keyframes riseIn{0%{transform:translateY(12px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes driftA{0%{transform:translateY(-12px)}to{transform:translateY(10px)}}@keyframes driftB{0%{transform:translateY(8px)}to{transform:translateY(-10px)}}
