:root{--color-bg: #f6f7f9;--color-surface: #ffffff;--color-surface-muted: #f1f3f6;--color-border: #e2e5ea;--color-text: #1a1d23;--color-text-muted: #5b6270;--color-accent: #2f6feb;--color-accent-contrast: #ffffff;--color-success: #1a8a5f;--color-success-bg: #e7f6ef;--color-warning: #a35b00;--color-warning-bg: #fdf1e0;--color-danger: #c23b3b;--color-danger-bg: #fbebeb;--shadow-card: 0 1px 2px rgba(16, 20, 30, .04), 0 8px 24px rgba(16, 20, 30, .06);--radius-lg: 16px;--radius-md: 10px;--radius-sm: 6px;color-scheme:light dark}@media (prefers-color-scheme: dark){:root{--color-bg: #14161a;--color-surface: #1c1f26;--color-surface-muted: #22262e;--color-border: #2c313b;--color-text: #f0f1f3;--color-text-muted: #9aa1ad;--color-accent: #6c9bff;--color-accent-contrast: #0c1220;--color-success: #4ecb96;--color-success-bg: #123326;--color-warning: #e2a94f;--color-warning-bg: #3a2a0f;--color-danger: #f08080;--color-danger-bg: #3a1717;--shadow-card: 0 1px 2px rgba(0, 0, 0, .3), 0 12px 28px rgba(0, 0, 0, .35)}}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--color-bg);color:var(--color-text);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}.page{max-width:720px;margin:0 auto;padding:48px 24px 96px;display:flex;flex-direction:column;gap:32px}.app-header{text-align:center;display:flex;flex-direction:column;gap:8px}.app-header h1{font-size:1.75rem;font-weight:700;margin:0;letter-spacing:-.02em}.app-header .tagline{color:var(--color-text-muted);margin:0;font-size:.95rem}.compatibility-line{font-size:.85rem;color:var(--color-text-muted);text-align:center}.compatibility-line.unsupported{color:var(--color-warning)}.step-indicator{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}.step-indicator .step{display:flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:var(--color-surface-muted);color:var(--color-text-muted);font-size:.8rem;font-weight:600}.step-indicator .step.active{background:var(--color-accent);color:var(--color-accent-contrast)}.step-indicator .step.done{background:var(--color-success-bg);color:var(--color-success)}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);padding:28px;display:flex;flex-direction:column;gap:18px}.card h2{margin:0;font-size:1.15rem;font-weight:650}.card p.help{margin:0;color:var(--color-text-muted);font-size:.92rem;line-height:1.5}.mode-options{display:grid;grid-template-columns:1fr 1fr;gap:16px}@media (max-width: 560px){.mode-options{grid-template-columns:1fr}}.mode-option{border:1.5px solid var(--color-border);border-radius:var(--radius-md);padding:18px;text-align:left;background:var(--color-surface);cursor:pointer;display:flex;flex-direction:column;gap:6px;transition:border-color .15s ease}.mode-option:hover:not(:disabled){border-color:var(--color-accent)}.mode-option:disabled{opacity:.55;cursor:not-allowed}.mode-option .badge{align-self:flex-start;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:2px 8px;border-radius:999px;background:var(--color-success-bg);color:var(--color-success)}.mode-option .badge.muted{background:var(--color-surface-muted);color:var(--color-text-muted)}.mode-option strong{font-size:1rem}.mode-option span.detail{color:var(--color-text-muted);font-size:.88rem}.status-pill{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;font-size:.85rem;font-weight:600;width:fit-content}.status-pill.connected{background:var(--color-success-bg);color:var(--color-success)}.status-pill.pending{background:var(--color-surface-muted);color:var(--color-text-muted)}.dot{width:8px;height:8px;border-radius:50%;background:currentColor}.file-drop{border:1.5px dashed var(--color-border);border-radius:var(--radius-md);padding:24px;text-align:center;display:flex;flex-direction:column;gap:10px;align-items:center}.file-picked{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--color-surface-muted);border-radius:var(--radius-md);padding:14px 18px}.file-picked .name{font-weight:600;word-break:break-all}.file-picked .size{color:var(--color-text-muted);font-size:.85rem}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;border-radius:var(--radius-md);padding:12px 20px;font-size:.95rem;font-weight:650;cursor:pointer;transition:transform .05s ease,opacity .15s ease}.btn:disabled{opacity:.5;cursor:not-allowed}.btn:active:not(:disabled){transform:scale(.98)}.btn-primary{background:var(--color-accent);color:var(--color-accent-contrast)}.btn-secondary{background:var(--color-surface-muted);color:var(--color-text);border:1px solid var(--color-border)}.btn-danger{background:transparent;color:var(--color-danger);border:1px solid var(--color-danger)}.btn-link{background:none;border:none;color:var(--color-accent);cursor:pointer;font-size:.88rem;font-weight:600;padding:0}.btn-row{display:flex;gap:12px;flex-wrap:wrap}.checklist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}.checklist li{display:flex;align-items:flex-start;gap:10px;font-size:.92rem}.checklist .icon{flex:0 0 auto;width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75rem;margin-top:1px}.checklist .icon.check{background:var(--color-success-bg);color:var(--color-success)}.checklist .icon.pending,.checklist .icon.info{background:var(--color-surface-muted);color:var(--color-text-muted)}.progress-status{font-size:1.25rem;font-weight:650;text-align:center}.progress-bar-track{height:10px;border-radius:999px;background:var(--color-surface-muted);overflow:hidden}.progress-bar-fill{height:100%;background:var(--color-accent);border-radius:999px;transition:width .3s ease}.progress-percent{text-align:center;font-size:.9rem;color:var(--color-text-muted)}.warning-banner{background:var(--color-warning-bg);color:var(--color-warning);border-radius:var(--radius-md);padding:12px 16px;font-size:.88rem;font-weight:600;text-align:center}.demo-banner{background:var(--color-surface-muted);color:var(--color-text-muted);border-radius:var(--radius-md);padding:10px 16px;font-size:.8rem;font-weight:700;text-align:center;letter-spacing:.01em;text-transform:uppercase}.result-icon{width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.6rem;margin:0 auto}.result-icon.success{background:var(--color-success-bg);color:var(--color-success)}.result-icon.error{background:var(--color-danger-bg);color:var(--color-danger)}.result-icon.neutral{background:var(--color-surface-muted);color:var(--color-text-muted)}.result-title{text-align:center;font-size:1.3rem;font-weight:700;margin:0}.result-message{text-align:center;color:var(--color-text-muted);margin:0;line-height:1.5}.next-action{text-align:center;font-size:.9rem;font-weight:600}.advanced-details{border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden;background:var(--color-surface)}.advanced-details summary{cursor:pointer;padding:16px 20px;font-weight:650;font-size:.9rem;list-style:none;display:flex;align-items:center;justify-content:space-between}.advanced-details summary::-webkit-details-marker{display:none}.advanced-details .content{padding:0 20px 20px;display:flex;flex-direction:column;gap:14px}.diagnostic-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;font-size:.82rem}.diagnostic-facts div{background:var(--color-surface-muted);border-radius:var(--radius-sm);padding:8px 10px}.diagnostic-facts .label{color:var(--color-text-muted);display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.03em}.event-log{max-height:260px;overflow-y:auto;border:1px solid var(--color-border);border-radius:var(--radius-sm);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.76rem}.event-log .row{padding:6px 10px;border-bottom:1px solid var(--color-border);display:flex;gap:10px}.event-log .row:last-child{border-bottom:none}.event-log .row.error{color:var(--color-danger)}.event-log .row.warn{color:var(--color-warning)}.event-log .time{color:var(--color-text-muted);flex:0 0 auto}.event-log .empty{padding:14px;color:var(--color-text-muted);text-align:center}.technical-code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.8rem;background:var(--color-surface-muted);padding:2px 8px;border-radius:var(--radius-sm)}footer.app-footer{text-align:center;font-size:.78rem;color:var(--color-text-muted);display:flex;flex-direction:column;gap:4px}
