*,:before,:after{box-sizing:border-box}:root{--bg-deep:#0a0e17;--bg-card:#101828a6;--bg-card-hover:#162239cc;--border-glow:#00a8cc40;--border-glow-active:#00a8cc99;--text-primary:#f3f4f6;--text-secondary:#9ca3af;--text-muted:#6b7280;--accent-cyan:#00e5ff;--accent-orange:#ff6b35;--accent-green:#00e676;--success:#059669;--warning:#d97706;--danger:#dc2626;--font-display:"Plus Jakarta Sans", system-ui, sans-serif;--font-body:"Outfit", system-ui, sans-serif;--font-mono:"Consolas", "Courier New", monospace;--shadow-neon:0 0 20px #00e5ff26;--shadow-neon-orange:0 0 20px #ff6b3533;--shadow-card:0 8px 32px 0 #0000005e;font-family:var(--font-body);color:var(--text-primary);background:var(--bg-deep);box-sizing:border-box}body{background-color:var(--bg-deep);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-image:radial-gradient(at 0 0,#00a8cc1a 0,#0000 50%),radial-gradient(at 100% 100%,#ff6b3514 0,#0000 50%),linear-gradient(#ffffff02 1px,#0000 1px),linear-gradient(90deg,#ffffff02 1px,#0000 1px);background-size:100% 100%,100% 100%,40px 40px,40px 40px;max-width:100vw;min-height:100vh;margin:0;padding:0;overflow-x:hidden}#root{box-sizing:border-box;flex-direction:column;width:100%;max-width:100%;min-height:100vh;margin:0;padding:24px 40px;display:flex}@media (width<=768px){#root{padding:16px 20px}}.app-header{border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;margin-bottom:24px;padding-bottom:16px;display:flex}.app-header-left{align-items:center;gap:24px;display:flex}.app-title-group{flex-direction:column;display:flex}.app-title{font-family:var(--font-display);letter-spacing:-.5px;color:#fff;align-items:center;gap:8px;margin:0;font-size:20px;font-weight:700;display:flex}.app-subtitle{color:var(--text-secondary);text-transform:uppercase;letter-spacing:1px;margin-top:2px;font-size:11px;font-weight:500}.app-nav{align-items:center;gap:8px;display:flex}.nav-btn{color:var(--text-secondary);cursor:pointer;background:0 0;border:1px solid #0000;border-radius:6px;align-items:center;gap:6px;padding:6px 14px;font-size:13px;font-weight:500;transition:all .2s;display:flex}.nav-btn:hover{color:var(--text-primary);background:#ffffff0a}.nav-btn.active{color:var(--accent-cyan);background:#00e5ff14;border-color:#00e5ff33}.api-badge{color:var(--text-secondary);font-family:var(--font-mono);letter-spacing:.2px;background:#ffffff08;border:1px solid #ffffff1a;border-radius:6px;padding:4px 10px;font-size:11px}.glass-panel{background:var(--bg-card);-webkit-backdrop-filter:blur(12px);box-shadow:var(--shadow-card);border:1px solid #ffffff0d;border-radius:16px;padding:24px;transition:all .3s cubic-bezier(.16,1,.3,1)}.glass-panel:hover{background:var(--bg-card-hover);border-color:#00a8cc4d}.upload-grid{grid-template-columns:1fr;gap:24px;max-width:100%;display:grid}@media (width>=768px){.upload-grid{grid-template-columns:1.2fr .8fr}}.drop-zone{text-align:center;cursor:pointer;background:#ffffff05;border:2px dashed #ffffff26;border-radius:14px;flex-direction:column;align-items:center;gap:16px;padding:40px 20px;transition:all .25s;display:flex}.drop-zone.active,.drop-zone:hover{border-color:var(--accent-cyan);box-shadow:var(--shadow-neon);background:#00e5ff08}.drop-icon-wrapper{color:var(--text-secondary);background:#ffffff0a;border-radius:50%;padding:16px;transition:all .3s}.drop-zone:hover .drop-icon-wrapper{color:var(--accent-cyan);background:#00e5ff1a;transform:translateY(-2px)}.upload-headline{font-family:var(--font-display);margin:0;font-size:18px;font-weight:700}.upload-subtitle{color:var(--text-secondary);font-size:13px}.file-pill{color:var(--accent-orange);text-overflow:ellipsis;white-space:nowrap;background:#ff6b351a;border:1px solid #ff6b354d;border-radius:8px;align-items:center;gap:10px;max-width:100%;padding:8px 16px;font-size:14px;display:flex;overflow:hidden}.form-group{flex-direction:column;gap:8px;margin-bottom:18px;display:flex}.form-label{text-transform:uppercase;letter-spacing:1px;color:var(--text-secondary);font-size:13px;font-weight:600}.form-input,.form-textarea{color:var(--text-primary);font-family:var(--font-body);background:#0000004d;border:1px solid #ffffff1a;border-radius:8px;padding:12px;font-size:14px;transition:all .25s}.form-input:focus,.form-textarea:focus{border-color:var(--accent-cyan);box-shadow:var(--shadow-neon);outline:none}.btn-primary{font-family:var(--font-display);background:linear-gradient(135deg, var(--accent-cyan) 0%, #00acc1 100%);color:#050b14;cursor:pointer;box-shadow:var(--shadow-neon);border:none;border-radius:8px;justify-content:center;align-items:center;gap:8px;width:100%;padding:14px 28px;font-size:15px;font-weight:700;transition:all .25s;display:flex}.btn-primary:hover:not(:disabled){filter:brightness(1.1);transform:translateY(-1px);box-shadow:0 0 25px #00e5ff59}.btn-primary:disabled{background:var(--text-muted);box-shadow:none;cursor:not-allowed;color:var(--bg-deep)}.loading-container{text-align:center;flex-direction:column;justify-content:center;align-items:center;max-width:500px;margin:80px auto;display:flex}.radar-spinner{width:80px;height:80px;margin-bottom:30px;position:relative}.radar-circle{border:2px solid var(--accent-cyan);opacity:.8;border-radius:50%;width:100%;height:100%;animation:2.5s linear infinite pulse-radar;position:absolute}.radar-circle:nth-child(2){animation-delay:.8s}.radar-circle:nth-child(3){animation-delay:1.6s}.radar-sweep{background:linear-gradient(90deg, var(--accent-cyan), transparent);transform-origin:100%;width:50%;height:2px;animation:2s linear infinite radar-sweep;position:absolute;top:50%;left:0}@keyframes pulse-radar{0%{opacity:0;transform:scale(.2)}50%{opacity:.6}to{opacity:0;transform:scale(1.5)}}@keyframes radar-sweep{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.step-list{flex-direction:column;gap:16px;width:100%;margin-top:30px;display:flex}.step-item{text-align:left;background:#ffffff05;border:1px solid #ffffff0d;border-radius:10px;align-items:center;gap:12px;padding:12px 18px;font-size:14px;transition:all .3s;display:flex}.step-item.pending{color:var(--text-muted)}.step-item.active{color:var(--accent-cyan);background:#00e5ff05;border-color:#00e5ff33}.step-item.completed{color:var(--accent-green);border-color:#00e67626}.step-indicator{border-radius:50%;justify-content:center;align-items:center;width:18px;height:18px;display:flex}.step-indicator.active{border:2px solid var(--accent-cyan);border-top-color:#0000;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.dashboard-grid{grid-template-columns:1fr;gap:24px;display:grid}@media (width>=1024px){.dashboard-grid{grid-template-columns:350px 1fr}}.summary-panel{flex-direction:column;gap:20px;height:fit-content;display:flex}.doc-info-list{flex-direction:column;gap:12px;display:flex}.doc-info-item{border-bottom:1px solid #ffffff0a;justify-content:space-between;padding-bottom:8px;font-size:14px;display:flex}.doc-info-label{color:var(--text-secondary)}.doc-info-value{text-align:right;font-weight:600}.metric-circle-container{justify-content:center;align-items:center;margin:15px 0;display:flex}.metric-circle{border:4px solid var(--success);background:radial-gradient(circle,#101828e6 0%,#0a0e17f2 100%);border-radius:50%;flex-direction:column;justify-content:center;align-items:center;width:110px;height:110px;display:flex;box-shadow:0 0 15px #05966933}.metric-circle.warning{border-color:var(--warning);box-shadow:0 0 15px #d9770633}.metric-circle.danger{border-color:var(--danger);box-shadow:0 0 15px #dc262633}.metric-value{font-family:var(--font-display);font-size:26px;font-weight:800}.metric-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;font-size:10px}.page-tabs{border-bottom:1px solid #ffffff14;gap:8px;margin-bottom:20px;padding-bottom:10px;display:flex;overflow-x:auto}.page-tab{color:var(--text-secondary);cursor:pointer;white-space:nowrap;background:#ffffff05;border:1px solid #ffffff0d;border-radius:8px;padding:8px 16px;font-size:14px;font-weight:600;transition:all .2s}.page-tab.active{border-color:var(--accent-cyan);color:var(--accent-cyan);background:#00e5ff14}.view-tabs{background:#0003;border-radius:10px;gap:8px;margin-bottom:24px;padding:4px;display:flex}.view-tab{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:7px;flex:1;justify-content:center;align-items:center;gap:6px;padding:10px 16px;font-size:14px;font-weight:600;transition:all .2s;display:flex}.view-tab.active{background:var(--bg-card);color:var(--text-primary);box-shadow:0 4px 12px #00000026}.section-headline{font-family:var(--font-display);color:var(--accent-cyan);align-items:center;gap:8px;margin-bottom:16px;font-size:18px;font-weight:700;display:flex}.raw-text-container{white-space:pre-wrap;text-align:left;background:#0003;border:1px solid #ffffff0a;border-radius:8px;max-height:600px;padding:20px;font-size:15px;line-height:160%;overflow-y:auto}.table-wrapper{border:1px solid #ffffff0f;border-radius:8px;margin-bottom:24px;overflow-x:auto}.ocr-table{border-collapse:collapse;text-align:left;width:100%;font-size:14px}.ocr-table th{color:var(--text-secondary);background:#ffffff05;border-bottom:1px solid #ffffff0f;padding:12px 16px;font-weight:600}.ocr-table td{border-bottom:1px solid #ffffff0a;padding:12px 16px}.ocr-table tr:hover td{background:#ffffff03}.badge-grid{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px;margin-bottom:28px;display:grid}.element-card{text-align:left;background:#00000026;border:1px solid #ffffff0a;border-radius:10px;flex-direction:column;gap:8px;padding:16px;display:flex}.element-card.detected{background:#00e5ff05;border-color:#00e5ff40}.element-header{justify-content:space-between;align-items:center;display:flex}.element-title{text-transform:uppercase;letter-spacing:.5px;color:var(--text-secondary);font-size:13px;font-weight:700}.element-badge{border-radius:12px;padding:2px 8px;font-size:11px;font-weight:700}.element-badge.yes{color:var(--accent-green);background:#00e6761a;border:1px solid #00e67640}.element-badge.no{color:var(--text-muted);background:#ffffff0a}.element-desc{color:var(--text-primary);font-size:13px}.element-confidence{color:var(--text-muted);font-size:11px}.vis-item-list{flex-direction:column;gap:12px;margin-bottom:24px;display:flex}.vis-item-row{text-align:left;background:#ffffff05;border:1px solid #ffffff0a;border-radius:8px;justify-content:space-between;align-items:center;padding:14px 18px;font-size:14px;display:flex}.vis-item-row:hover{background:#ffffff08;border-color:#00a8cc26}.quality-item{border-bottom:1px solid #ffffff08;justify-content:space-between;align-items:center;padding:10px 0;font-size:14px;display:flex}.quality-dot{background:var(--text-muted);border-radius:50%;width:8px;height:8px}.quality-dot.active{background:var(--accent-orange);box-shadow:0 0 8px var(--accent-orange)}.json-editor{text-align:left;background:#050b14;border:1px solid #ffffff14;border-radius:10px;max-height:600px;padding:18px;overflow:auto}.json-editor pre{font-family:var(--font-mono);color:var(--accent-cyan);white-space:pre-wrap;word-break:break-all;margin:0;font-size:13px;line-height:150%}.alert-box{color:#fca5a5;text-align:left;background:#dc26260f;border:1px solid #dc262640;border-radius:8px;align-items:flex-start;gap:12px;margin-bottom:16px;padding:12px 16px;font-size:13px;display:flex}.alert-box svg{color:#ef4444;flex-shrink:0}.back-btn{color:var(--text-primary);cursor:pointer;background:#ffffff08;border:1px solid #ffffff14;border-radius:8px;align-items:center;gap:6px;width:fit-content;padding:8px 16px;font-size:14px;font-weight:600;transition:all .2s;display:flex}.back-btn:hover{background:#ffffff14}.stats-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;width:100%;margin-bottom:24px;display:grid}.stat-card{background:var(--bg-card);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);text-align:left;border:1px solid #ffffff0d;border-radius:12px;flex-direction:column;gap:6px;padding:18px;transition:all .2s;display:flex}.stat-card:hover{border-color:#00a8cc33}.stat-label{text-transform:uppercase;color:var(--text-secondary);letter-spacing:.5px;font-size:11px;font-weight:600}.stat-value{color:#fff;font-size:26px;font-weight:700}.history-controls{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin-bottom:16px;display:flex}.search-input-group{background:#00000040;border:1px solid #ffffff14;border-radius:8px;flex:1;align-items:center;gap:8px;max-width:400px;padding:8px 12px;display:flex}.search-input-group input{color:#fff;background:0 0;border:none;outline:none;width:100%;font-size:14px}.history-table-container{background:#10182866;border:1px solid #ffffff0f;border-radius:12px;overflow-x:auto}.history-table{border-collapse:collapse;text-align:left;width:100%;font-size:14px}.history-table th{color:var(--text-secondary);background:#ffffff08;border-bottom:1px solid #ffffff0f;padding:14px 16px;font-weight:600}.history-table td{color:var(--text-primary);vertical-align:middle;border-bottom:1px solid #ffffff0a;padding:14px 16px}.history-table tr:hover td{background:#ffffff05}.badge{text-transform:uppercase;border-radius:4px;align-items:center;gap:4px;padding:3px 8px;font-size:11px;font-weight:600;display:inline-flex}.badge.completed{color:var(--accent-green);background:#00e6761a;border:1px solid #00e67633}.badge.processing{color:var(--accent-cyan);background:#00e5ff1a;border:1px solid #00e5ff33}.badge.failed{color:#fca5a5;background:#ef44441a;border:1px solid #ef444440}.badge.uploaded{color:var(--text-secondary);background:#9ca3af1a;border:1px solid #9ca3af33}.btn-action-view{color:var(--accent-cyan);cursor:pointer;background:#00e5ff14;border:1px solid #00e5ff33;border-radius:6px;margin-right:8px;padding:6px 12px;font-size:12px;font-weight:600;transition:all .2s}.btn-action-view:hover{background:#00e5ff26}.btn-action-delete{color:#fca5a5;cursor:pointer;background:#ef444414;border:1px solid #ef444433;border-radius:6px;padding:6px 12px;font-size:12px;font-weight:600;transition:all .2s}.btn-action-delete:hover{background:#ef444426}.pagination-controls{background:#0000001a;border-top:1px solid #ffffff0f;justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.pagination-btn{color:var(--text-primary);cursor:pointer;background:#ffffff08;border:1px solid #ffffff0f;border-radius:6px;align-items:center;gap:4px;padding:6px 12px;font-size:12px;font-weight:500;transition:all .2s;display:flex}.pagination-btn:hover:not(:disabled){background:#ffffff14;border-color:#ffffff26}.pagination-btn:disabled{opacity:.4;cursor:not-allowed}.pagination-info{color:var(--text-secondary);font-size:12px}
