@import"https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&display=swap";:root{--primary: #4f46e5;--primary-glow: rgba(79, 70, 229, .4);--bg: #f8fafc;--card-bg: #ffffff;--text-main: #0f172a;--text-muted: #64748b;--border: #e2e8f0;--success: #10b981;--error: #ef4444}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Outfit,sans-serif;background-color:var(--bg);color:var(--text-main);line-height:1.5;overflow-x:hidden}.app-container{min-height:100vh;display:flex;flex-direction:column}.navbar{height:70px;background:#fff;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 40px;position:sticky;top:0;z-index:100;box-shadow:0 4px 6px -1px #00000005}.logo{font-size:1.5rem;font-weight:800;display:flex;align-items:center;gap:10px}.logo span{color:var(--primary)}.status-pills{display:flex;gap:20px}.status-pill{font-size:.8rem;font-weight:600;display:flex;align-items:center;gap:8px;color:var(--text-muted);background:#f1f5f9;padding:6px 12px;border-radius:20px}.dot{width:8px;height:8px;border-radius:50%;background:var(--success);box-shadow:0 0 0 4px #10b98133}.main-content{flex:1;padding:40px;max-width:1700px;margin:0 auto;width:100%}.upload-hero{max-width:700px;margin:80px auto;text-align:center}.upload-hero h1{font-size:3rem;font-weight:800;margin-bottom:16px;letter-spacing:-1px}.upload-box{background:#fff;border:2px dashed var(--border);border-radius:30px;padding:60px;margin-top:40px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1)}.upload-box:hover{border-color:var(--primary);background:#f5f7ff;transform:translateY(-5px);box-shadow:0 20px 40px #4f46e50d}.btn-extract{width:100%;padding:18px;background:var(--primary);color:#fff;border:none;border-radius:16px;font-size:1.1rem;font-weight:700;margin-top:24px;cursor:pointer;box-shadow:0 10px 25px var(--primary-glow);transition:all .3s ease}.btn-extract:hover{background:#4338ca;transform:scale(1.02)}.workspace{display:grid;grid-template-columns:1fr 1fr;gap:30px;height:calc(100vh - 180px)}.panel{display:flex;flex-direction:column;gap:15px}.panel-header{display:flex;justify-content:space-between;align-items:center}.panel-title{font-weight:700;color:var(--text-main);display:flex;align-items:center;gap:10px}.preview-container{flex:1;background:#e2e8f0;border-radius:24px;overflow:hidden;box-shadow:inset 0 2px 10px #0000000d;position:relative}.preview-iframe{width:100%;height:100%;border:none}.results-container{flex:1;background:#fff;border:1px solid var(--border);border-radius:24px;padding:30px;box-shadow:0 10px 30px #00000008;overflow-y:auto}.grid-results{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}.data-card{background:#fff;border:1.5px solid var(--border);padding:16px;border-radius:12px;transition:all .2s ease;display:flex;flex-direction:column;justify-content:flex-start;min-height:100px}.box-span-3{grid-column:span 3}.box-span-2{grid-column:span 2}.box-full{grid-column:span 6}.data-card:hover{border-color:var(--primary);box-shadow:0 8px 20px #4f46e514;transform:translateY(-2px)}.label{font-size:.65rem;font-weight:800;color:#94a3b8;text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px;display:flex;align-items:center}.value{font-size:.9rem;font-weight:600;color:#1e293b;word-break:break-word;line-height:1.4}@keyframes spin{to{transform:rotate(360deg)}}.loader{width:40px;height:40px;border:3px solid #f3f3f3;border-top:3px solid var(--primary);border-radius:50%;animation:spin 1s linear infinite}.pulse{animation:pulse 2s infinite}@keyframes pulse{0%{transform:scale(.95);opacity:1}50%{transform:scale(1.05);opacity:.8}to{transform:scale(.95);opacity:1}}@media(max-width:1024px){.workspace{grid-template-columns:1fr;height:auto}.preview-container{height:500px}}