@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap";*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#fff;--surface:#f5f5f7;--border:#d2d2d7;--text-primary:#1d1d1f;--text-secondary:#6e6e73;--accent:#2d6a2d;--danger:#c0392b;--success:#1a7f37;--radius-card:12px;--radius-btn:8px;--radius-input:6px;--shadow:0 1px 3px #00000014}body{background-color:var(--bg);color:var(--text-primary);-webkit-font-smoothing:antialiased;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.header{border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:100;background:#ffffffd9;align-items:center;height:56px;padding:0 24px;display:flex;position:sticky;top:0}.header__inner{justify-content:space-between;align-items:center;width:100%;max-width:960px;margin:0 auto;display:flex}.header__brand{color:var(--accent);align-items:center;gap:8px;display:flex}.header__logo{color:var(--text-primary);letter-spacing:-.3px;font-size:16px;font-weight:600}.header__tagline{color:var(--text-secondary);font-size:13px;font-weight:500}.main{max-width:960px;margin:0 auto;padding:64px 24px}.hero{text-align:center;margin-bottom:56px}.hero__title{letter-spacing:-1px;color:var(--text-primary);margin-bottom:16px;font-size:48px;font-weight:600;line-height:1.1}.hero__subtitle{color:var(--text-secondary);max-width:480px;margin:0 auto;font-size:17px;line-height:1.6}.upload-zone{border:1.5px dashed var(--border);border-radius:var(--radius-card);text-align:center;cursor:pointer;background:var(--surface);padding:64px 32px;transition:border-color .2s,background .2s}.upload-zone:hover,.upload-zone--dragging{border-color:var(--accent);background:#f0f5f0}.upload-zone--disabled{opacity:.5;cursor:not-allowed}.upload-zone__icon{color:var(--accent);justify-content:center;margin-bottom:16px;display:flex}.upload-zone__title{color:var(--text-primary);margin-bottom:6px;font-size:16px;font-weight:500}.upload-zone__subtitle{color:var(--text-secondary);font-size:13px}.loader-wrapper{flex-direction:column;align-items:center;gap:16px;padding:64px;display:flex}.loader-ring{border:2.5px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:36px;height:36px;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.loader-text{color:var(--text-secondary);font-size:14px;font-weight:500}.results-layout{grid-template-columns:1fr 1fr;align-items:start;gap:24px;display:grid}@media (width<=720px){.results-layout{grid-template-columns:1fr}.hero__title{font-size:32px}}.canvas-wrapper{border-radius:var(--radius-card);border:1px solid var(--border);box-shadow:var(--shadow);overflow:hidden}.detection-canvas{width:100%;height:auto;display:block}.results-panel{background:var(--surface);border-radius:var(--radius-card);border:1px solid var(--border);flex-direction:column;gap:20px;padding:24px;display:flex}.results-panel__header{align-items:center;gap:10px;display:flex}.results-panel__title{color:var(--text-primary);font-size:16px;font-weight:600}.icon--success{color:var(--success)}.icon--danger{color:var(--danger)}.icon--muted{color:var(--text-secondary)}.detections-list{flex-direction:column;gap:10px;display:flex}.detection-item{background:var(--bg);border-radius:var(--radius-btn);border:1px solid var(--border);align-items:flex-start;gap:10px;padding:12px;display:flex}.detection-item__name{color:var(--text-primary);text-transform:capitalize;font-size:13px;font-weight:500}.detection-item__confidence{color:var(--text-secondary);margin-top:2px;font-size:12px}.recommendations__label{letter-spacing:.6px;text-transform:uppercase;color:var(--text-secondary);margin-bottom:8px;font-size:11px;font-weight:600}.recommendations__text{color:var(--text-primary);font-size:14px;line-height:1.7}.error-box{border-radius:var(--radius-card);color:var(--danger);background:#fef2f2;border:1px solid #fecaca;padding:16px 20px;font-size:14px}.btn-reset{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-btn);color:var(--text-primary);cursor:pointer;margin-top:24px;margin-left:auto;margin-right:auto;padding:10px 24px;font-size:14px;font-weight:500;transition:background .2s,border-color .2s;display:block}.btn-reset:hover{background:var(--surface);border-color:var(--text-secondary)}
