@import"https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800;900&family=Inter:wght@300;400;500;600;700&family=Fira+Code:wght@400;700&family=Playfair+Display:ital,wght@0,400;0,700;1,400&display=swap";:root{font-family:Inter,sans-serif;color:#f8fafc;background-color:#090d16;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--bg-main: #090d16;--bg-card: #111827;--bg-dropzone: #131b2e;--border-color: rgba(255, 255, 255, .08);--border-hover: rgba(59, 130, 246, .4);--text-primary: #f8fafc;--text-secondary: #94a3b8;--text-muted: #64748b;--accent-color: #3b82f6;--accent-gradient: linear-gradient(135deg, #3b82f6 0%, #6366f1 100%);--success-color: #10b981;--success-bg: rgba(16, 185, 129, .1);--warning-color: #f59e0b;--warning-bg: rgba(245, 158, 11, .1);--danger-color: #ef4444;--danger-bg: rgba(239, 68, 68, .1)}*{box-sizing:border-box;margin:0;padding:0}body{margin:0;min-width:320px;overflow-x:hidden;background-color:var(--bg-main);color:var(--text-primary)}.appContainer{display:flex;flex-direction:column;min-height:100vh;background-color:var(--bg-main)}.promoBanner{width:100%;background:var(--accent-gradient);color:#fff;text-align:center;padding:12px 20px;font-family:Outfit,sans-serif;font-size:14px;font-weight:600;box-shadow:0 4px 12px #3b82f633;letter-spacing:.5px;position:relative;z-index:10}main{width:min(1200px,calc(100% - 32px));margin:0 auto;padding:24px 0 64px}.topbar{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-bottom:20px;border-bottom:1px solid var(--border-color);margin-bottom:24px}.brandLockup{display:flex;align-items:center;gap:12px}.brandMark{width:40px;height:40px;display:grid;place-items:center;border-radius:8px;background:var(--accent-gradient);color:#fff;font-family:Outfit,sans-serif;font-size:22px;font-weight:800;box-shadow:0 0 15px #3b82f666}.brandLockup strong{display:block;font-family:Outfit,sans-serif;font-size:18px;font-weight:700;letter-spacing:-.3px}.brandLockup span{display:block;color:var(--text-secondary);font-size:12px;font-weight:500;margin-top:1px}.topControls{display:flex;align-items:center;gap:12px}.statusPill,.authButton{display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:0 14px;border:1px solid var(--border-color);border-radius:8px;font-size:13px;font-weight:600;background:var(--bg-card);color:var(--text-primary);transition:all .2s ease;white-space:nowrap}.statusPill{color:var(--success-color);background:var(--success-bg);border-color:#10b98133}.authButton{cursor:pointer}.authButton:hover{border-color:var(--border-hover);background:#ffffff08;transform:translateY(-1px)}.authWrapper{display:flex;flex-direction:column;align-items:flex-end;gap:4px}.authButtonSubtext{font-size:10px;color:var(--text-muted);font-weight:500}.topMessage{padding:10px 14px;border-radius:6px;background:var(--danger-bg);border:1px solid rgba(239,68,68,.2);color:var(--danger-color);font-size:13px;font-weight:500;margin-bottom:16px}.heroCalloutSection{margin-bottom:32px}.heroCalloutContainer{background:var(--bg-card);border:1px solid var(--border-color);border-radius:12px;padding:28px;box-shadow:0 10px 30px -10px #00000080;display:flex;flex-direction:column;gap:24px}.heroHeadline{font-family:Outfit,sans-serif;font-size:26px;font-weight:700;color:var(--text-primary);margin-bottom:6px;letter-spacing:-.5px}.heroDescription{font-size:14px;line-height:1.6;color:var(--text-secondary)}.heroSpecsGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;border-top:1px solid var(--border-color);padding-top:24px}.specCard{display:flex;flex-direction:column;gap:8px}.specIcon{color:var(--accent-color);background:#3b82f61a;width:36px;height:36px;border-radius:8px;display:grid;place-items:center}.specCard h4{font-family:Outfit,sans-serif;font-size:14px;font-weight:600;color:var(--text-primary)}.specCard p{font-size:12px;line-height:1.5;color:var(--text-secondary)}.comparisonSection{margin-bottom:32px}.comparisonContainer{background:var(--bg-card);border:1px solid var(--border-color);border-radius:12px;padding:24px;box-shadow:0 10px 30px -10px #00000080}.comparisonHeader h3{font-family:Outfit,sans-serif;font-size:18px;font-weight:700;color:var(--text-primary);margin-bottom:6px}.comparisonHeader p{font-size:13px;line-height:1.5;color:var(--text-secondary);margin-bottom:20px}.comparisonGrid{display:grid;grid-template-columns:1fr 1.2fr;gap:24px}.comparisonColumn h4{font-family:Outfit,sans-serif;font-size:12px;font-weight:600;color:var(--text-muted);margin-bottom:12px;text-transform:uppercase;letter-spacing:.8px}.fontCardList{display:flex;flex-direction:column;gap:8px}.fontCard{border:1px solid var(--border-color);border-radius:8px;padding:12px 16px;background:#ffffff05;display:flex;align-items:center;gap:12px;min-height:48px}.beforeCard{background:#ffffff03}.beforeCard.error{border-color:#ef44444d;background:var(--danger-bg)}.fileBadge{font-size:10px;font-weight:700;padding:2px 6px;border-radius:4px;color:#fff}.fileBadge.ttf{background:#3b82f6}.fileBadge.otf{background:#8b5cf6}.fileBadge.woff{background:#10b981}.fileName{font-family:Fira Code,monospace;font-size:12px;color:var(--text-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.beforeCard.error .fileName{color:var(--danger-color)}.afterCard{background:#ffffff08;border-color:#ffffff1f;flex-direction:column;align-items:stretch;gap:4px}.afterCard.warningCard{border-color:#ef44444d;background:var(--danger-bg)}.familyHeader{display:flex;justify-content:space-between;align-items:center}.familyName{font-family:Outfit,sans-serif;font-size:13px;font-weight:600;color:var(--text-primary)}.moodBadge,.warnBadge{font-size:10px;font-weight:700;padding:1px 6px;border-radius:9999px}.moodBadge{background:#3b82f626;color:#60a5fa}.warnBadge{background:var(--danger-bg);color:var(--danger-color)}.fontPreview{font-size:13px;color:var(--text-secondary);margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:24px;margin-bottom:32px}.dropzone{min-height:220px;border:2px dashed rgba(255,255,255,.15);border-radius:12px;padding:32px;display:flex;flex-direction:column;justify-content:center;align-items:center;background:var(--bg-dropzone);text-align:center;transition:all .2s ease;cursor:pointer}.dropzone:hover,.dropzone.isDragging{border-color:var(--accent-color);background:#3b82f60d;box-shadow:0 0 20px #3b82f61a}.dropzoneTop{display:flex;align-items:center;gap:16px;margin-bottom:12px}.dropIcon{width:52px;height:52px;border-radius:10px;background:#ffffff08;border:1px solid var(--border-color);color:var(--accent-color);display:grid;place-items:center}.dropzone h1{font-family:Outfit,sans-serif;font-size:20px;font-weight:600;color:var(--text-primary);text-align:left}.eyebrow{font-size:11px;font-weight:700;text-transform:uppercase;color:var(--accent-color);letter-spacing:1px}.dropCopy{font-size:13px;color:var(--text-secondary);margin-bottom:20px}.actions{display:flex;gap:12px;margin-bottom:14px}button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:38px;padding:0 16px;border-radius:8px;border:1px solid var(--border-color);font-size:13px;font-weight:600;cursor:pointer;transition:all .2s ease;background:var(--bg-card);color:var(--text-primary)}button:hover{border-color:var(--border-hover);background:#ffffff05;transform:translateY(-1px)}button:active{transform:translateY(0)}button:disabled{opacity:.5;cursor:not-allowed;transform:none}button.primary{background:var(--accent-gradient);border:none;color:#fff;box-shadow:0 4px 12px #3b82f633}button.primary:hover{box-shadow:0 6px 16px #3b82f659;transform:translateY(-1px)}.acceptLine{font-size:11px;color:var(--text-muted)}.hiddenInput{display:none}.instructions{background:var(--bg-card);border:1px solid var(--border-color);border-radius:12px;padding:20px;display:flex;flex-direction:column;gap:16px}.instructions h2{font-family:Outfit,sans-serif;font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:.8px;color:var(--text-muted)}.steps-container{display:flex;flex-direction:column;gap:16px}.step-row{display:flex;gap:12px;align-items:flex-start}.step-badge{width:24px;height:24px;border-radius:50%;background:#ffffff0a;border:1px solid var(--border-color);color:var(--accent-color);font-size:11px;font-weight:700;display:grid;place-items:center;flex:0 0 auto}.step-row strong{display:block;font-size:12px;font-weight:600;color:var(--text-primary)}.step-row p{font-size:11px;color:var(--text-secondary);line-height:1.4;margin-top:2px}.volumePanel{background:var(--bg-card);border:1px solid var(--border-color);border-radius:12px;padding:24px;margin-bottom:32px;box-shadow:0 10px 30px -10px #00000080}.volumeHeader{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;border-bottom:1px solid var(--border-color);padding-bottom:16px}.volumeHeader h2{font-family:Outfit,sans-serif;font-size:18px;font-weight:700}.volumeHeader span{font-size:12px;color:var(--text-secondary)}.alert-warning{display:flex;align-items:center;gap:10px;padding:12px 16px;background:var(--warning-bg);border:1px solid rgba(245,158,11,.2);border-radius:8px;color:var(--warning-color);font-size:13px;font-weight:500;margin-bottom:16px}.filesGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;max-height:250px;overflow-y:auto;padding-right:4px}.fileTile{display:flex;align-items:center;gap:10px;padding:10px 14px;border:1px solid var(--border-color);border-radius:8px;background:#ffffff03;min-width:0}.fileTile svg{color:var(--text-muted);flex:0 0 auto}.fileTile strong{font-size:12px;font-weight:500;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.fileTile span{font-size:10px;color:var(--text-muted)}.progressPanel{background:var(--bg-card);border:1px solid var(--border-color);border-radius:12px;padding:24px;margin-bottom:32px}.progressHeader{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.progressHeader h2{font-family:Outfit,sans-serif;font-size:16px;font-weight:700}.progressHeader span{font-size:12px;font-weight:600;text-transform:uppercase;color:var(--accent-color)}.progressTrack{height:8px;background:#ffffff0d;border-radius:4px;overflow:hidden;margin-bottom:20px}.progressTrack .bar{height:100%;background:var(--accent-gradient);border-radius:inherit;transition:width .3s ease;box-shadow:0 0 10px #3b82f680}.progressStats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.progressStats div{text-align:center}.progressStats strong{display:block;font-size:24px;font-family:Outfit,sans-serif;font-weight:700;color:var(--text-primary)}.progressStats span{font-size:11px;color:var(--text-secondary)}.resultsPanel{background:var(--bg-card);border:1px solid var(--border-color);border-radius:12px;padding:24px;margin-bottom:32px;box-shadow:0 10px 30px -10px #00000080}.resultsHeader{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;gap:16px}.resultsHeader h2{font-family:Outfit,sans-serif;font-size:18px;font-weight:700}.resultsHeader span{font-size:12px;color:var(--text-secondary)}.searchBar{display:flex;align-items:center;gap:10px;background:#ffffff05;border:1px solid var(--border-color);border-radius:8px;padding:0 12px;min-height:38px;width:min(300px,100%)}.searchBar input{background:transparent;border:none;outline:none;color:var(--text-primary);font-size:13px;width:100%}.summaryCallout{display:flex;gap:14px;padding:16px;background:#3b82f60d;border:1px solid rgba(59,130,246,.15);border-radius:8px;margin-bottom:20px;align-items:flex-start}.summaryCallout svg{color:var(--accent-color);flex:0 0 auto;margin-top:2px}.summaryCallout strong{display:block;font-family:Outfit,sans-serif;font-size:14px;font-weight:600;color:var(--text-primary)}.summaryCallout p{font-size:13px;line-height:1.5;color:var(--text-secondary);margin-top:4px}.tableWrapper{width:100%;overflow-x:auto;margin-bottom:16px}table{width:100%;min-width:800px;border-collapse:collapse}th{text-align:left;font-family:Outfit,sans-serif;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);padding:12px 10px;border-bottom:1px solid var(--border-color)}td{padding:14px 10px;border-bottom:1px solid var(--border-color);font-size:13px;vertical-align:middle}.pill{font-size:10px;font-weight:700;padding:2px 8px;border-radius:9999px;text-transform:uppercase}.pill.passed{background:var(--success-bg);color:var(--success-color)}.pill.failed{background:var(--danger-bg);color:var(--danger-color)}.tagsCell{display:flex;flex-wrap:wrap;gap:4px}.tag{font-size:10px;font-weight:600;padding:2px 6px;border-radius:4px;border:1px solid var(--border-color)}.tag-mood{background:#ffffff05;color:var(--text-secondary)}.tag-use{background:#6366f11a;color:#818cf8}.issuesCell{display:flex;flex-wrap:wrap;gap:4px}.issuePill{font-size:10px;font-weight:600;padding:1px 6px;border-radius:4px;background:var(--danger-bg);color:var(--danger-color)}.noIssues{color:var(--success-color);font-weight:600}.pagination{display:flex;justify-content:space-between;align-items:center;padding-top:14px}.pagination span{font-size:13px;color:var(--text-secondary)}.showcase{margin-top:32px;border-top:1px solid var(--border-color);padding-top:48px}.showcase h2{font-family:Outfit,sans-serif;font-size:24px;font-weight:700;letter-spacing:-.5px;margin-bottom:6px}.showcaseSub{font-size:14px;color:var(--text-secondary);margin-bottom:24px}.showcaseGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.showcaseCard{background:var(--bg-card);border:1px solid var(--border-color);border-radius:12px;padding:20px;display:flex;flex-direction:column;gap:16px}.familyStack{display:flex;flex-direction:column;gap:10px;margin-top:8px}.familyStack div{padding:10px 14px;background:#ffffff03;border:1px solid var(--border-color);border-radius:8px;display:flex;justify-content:space-between;align-items:center}.familyStack strong{font-family:Outfit,sans-serif;font-size:13px;font-weight:600}.familyStack span{font-size:11px;color:var(--text-muted)}.insightTiles{display:flex;flex-direction:column;gap:8px;margin-top:8px}.insightTiles div,.artifactStack div{display:flex;gap:12px;padding:10px 14px;background:#ffffff03;border:1px solid var(--border-color);border-radius:8px;align-items:center}.insightTiles strong,.artifactStack strong{font-family:Outfit,sans-serif;font-size:12px;font-weight:600;display:block}.insightTiles span,.artifactStack span{font-size:11px;color:var(--text-secondary);display:block;margin-top:1px}.artifactStack{display:flex;flex-direction:column;gap:8px;margin-top:8px}.artifactStack svg{color:var(--accent-color)}.authModalOverlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#090d16cc;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:100;display:flex;justify-content:center;align-items:center}.authModalCard{width:min(400px,calc(100% - 32px));background:var(--bg-card);border:1px solid var(--border-color);border-radius:16px;box-shadow:0 25px 50px -12px #00000080;padding:28px;display:flex;flex-direction:column;gap:20px}.authModalHeader{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border-color);padding-bottom:14px}.authModalHeader h3{font-family:Outfit,sans-serif;font-size:18px;font-weight:700;color:var(--text-primary)}.closeAuthBtn{background:none;border:none;font-size:28px;color:var(--text-muted);cursor:pointer;padding:0;min-height:auto;line-height:1}.closeAuthBtn:hover{color:var(--text-primary)}.authModalForm{display:flex;flex-direction:column;gap:16px}.authModalError{background:var(--danger-bg);border:1px solid rgba(239,68,68,.2);border-radius:8px;padding:10px 14px;color:var(--danger-color);font-size:12px;text-align:center;font-weight:500}.authModalGroup{display:flex;flex-direction:column;gap:6px}.authModalGroup label{font-size:11px;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px}.authModalGroup input{background:#ffffff05;border:1px solid var(--border-color);border-radius:8px;padding:10px 14px;font-size:14px;color:var(--text-primary);outline:none;transition:all .2s ease}.authModalGroup input:focus{border-color:var(--accent-color);box-shadow:0 0 0 2px #3b82f633}.authModalActions{display:flex;flex-direction:column;gap:10px;margin-top:8px}.authSubmitBtn{background:var(--accent-gradient);border:none;color:#fff;font-size:14px;font-weight:600;width:100%;min-height:40px;box-shadow:0 4px 12px #3b82f633}.authSubmitBtn:hover{box-shadow:0 6px 16px #3b82f64d}.authGoogleBtn{background:#ffffff05;border-color:var(--border-color);color:var(--text-primary);font-size:14px;width:100%;min-height:40px}.authGoogleBtn:hover{background:#ffffff0a;border-color:#fff3}.authModalToggle{text-align:center}.authModalToggle button{background:none;border:none;font-size:12px;color:var(--accent-color);cursor:pointer;text-decoration:underline;padding:0;min-height:auto}.authModalToggle button:hover{color:#60a5fa}.spin{animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:980px){.workspace,.showcaseGrid{grid-template-columns:1fr}.topbar{flex-direction:column;align-items:stretch;gap:14px}.topControls{justify-content:space-between}}@media(max-width:768px){.heroSpecsGrid,.comparisonGrid{grid-template-columns:1fr;gap:16px}.progressStats{grid-template-columns:1fr;gap:12px}.resultsHeader{flex-direction:column;align-items:stretch;gap:12px}.searchBar{width:100%}}
