Something went wrong. Try again.
A downstream fork of Tranquil PDS for use in margin.cafe
Something went wrong. Try again.
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669.migration-wizard { max-width: var(--width-md); margin: 0 auto;}
.field-label { display: block; font-size: var(--text-sm); font-weight: var(--font-medium); color: var(--text-primary); margin-bottom: var(--space-2);}
.step-indicator { display: flex; align-items: flex-start; justify-content: center; margin-bottom: var(--space-6); padding: 0; list-style: none;}
.step { position: relative; display: flex; flex: 1; min-width: 0; flex-direction: column; align-items: center; justify-content: center;}
.step-dot { position: relative; z-index: 1; width: 24px; height: 24px; background: var(--bg-secondary); display: flex; align-items: center; justify-content: center; font-size: var(--text-xs); font-weight: var(--font-medium); color: var(--text-secondary); flex-shrink: 0;}
.step.active .step-dot { background: var(--accent); border-color: var(--accent); color: var(--text-inverse); width: 28px; height: 28px;}
.step.completed .step-dot { background: var(--success-bg); border-color: var(--success-text); color: var(--success-text);}
.step-label { display: none; margin-top: var(--space-2); padding: 0 var(--space-1); color: var(--text-secondary); font-size: var(--text-xs); line-height: 1.2; text-align: center; overflow-wrap: anywhere;}
.step.active .step-label { color: var(--text-primary); font-weight: var(--font-medium);}
.step-line { position: absolute; top: 12px; left: calc(50% + 16px); width: calc(100% - 32px); height: 2px; background: var(--border-color);}
.step-line.completed { background: var(--success-text);}
.current-step-label { text-align: center; font-size: var(--text-sm); color: var(--text-secondary); margin-bottom: var(--space-5);}
.current-step-label strong { color: var(--text-primary);}
.step-content { background: var(--bg-secondary); padding: var(--space-6);}
.step-content h2 { margin: 0 0 var(--space-3) 0;}
.step-content > p { color: var(--text-secondary); margin: 0 0 var(--space-5) 0;}
.info-box h3 { margin: 0 0 var(--space-3) 0; font-size: var(--text-base);}
.info-box ol,.info-box ul { margin: 0; padding-left: var(--space-5);}
.info-box li { margin-bottom: var(--space-2); color: var(--text-secondary);}
.info-box p { margin: 0; color: var(--text-secondary);}
.warning-box strong { color: var(--warning-text);}
.warning-box p { margin: var(--space-3) 0 0 0; color: var(--text-secondary);}
.warning-box ul { margin: var(--space-3) 0 0 0; padding-left: var(--space-5);}
.checkbox-label { display: inline-flex; align-items: flex-start; gap: var(--space-3); cursor: pointer; margin-bottom: var(--space-5); text-align: left;}
.checkbox-label input[type="checkbox"] { width: 18px; height: 18px; margin: 0; flex-shrink: 0;}
.button-row { display: flex; flex-direction: row; gap: var(--space-3); justify-content: flex-end; margin-top: var(--space-5);}
@media (min-width: 700px) { .step-label { display: block; }}
@media (max-width: 600px) { .button-row { flex-direction: column; }
.button-row > button { width: 100%; }}
.current-info { background: var(--bg-primary); padding: var(--space-4); margin-bottom: var(--space-5); display: flex; justify-content: space-between;}
.current-info .label { color: var(--text-secondary);}
.current-info .value { font-weight: var(--font-medium); word-break: break-all;}
.current-info .value.mono { font-family: var(--font-mono); font-size: var(--text-sm);}
.review-card { background: var(--bg-primary); padding: var(--space-4); margin-bottom: var(--space-5);}
.review-row { display: flex; justify-content: space-between; padding: var(--space-3) 0; border-bottom: 1px solid var(--border-color);}
.review-row:last-child { border-bottom: none;}
.review-row .label { color: var(--text-secondary);}
.review-row .value { font-weight: var(--font-medium); text-align: right; word-break: break-all;}
.review-row .value.mono { font-family: var(--font-mono); font-size: var(--text-sm);}
.progress-section { margin-bottom: var(--space-5);}
.progress-item { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-3) 0; color: var(--text-secondary);}
.progress-item.completed { color: var(--success-text);}
.progress-item.active { color: var(--secondary);}
.progress-item .icon { width: 24px; text-align: center;}
.progress-bar { height: 8px; background: var(--bg-primary); overflow: hidden; margin-bottom: var(--space-4);}
.progress-fill { height: 100%; background: var(--accent);}
.status-text { text-align: center; color: var(--text-secondary); font-size: var(--text-sm);}
.success-content { text-align: center;}
.success-icon { width: 64px; height: 64px; background: var(--success-bg); color: var(--success-text); display: flex; align-items: center; justify-content: center; font-size: var(--text-2xl); margin: 0 auto var(--space-5) auto;}
.success-details { background: var(--bg-primary); padding: var(--space-4); margin: var(--space-5) 0; text-align: left;}
.success-details .detail-row { display: flex; justify-content: space-between; padding: var(--space-2) 0;}
.success-details .label { color: var(--text-secondary);}
.success-details .value { font-weight: var(--font-medium);}
.success-details .value.mono { font-family: var(--font-mono); font-size: var(--text-sm);}
.redirect-text { color: var(--text-secondary); font-style: italic;}
.code-block { background: var(--bg-primary); padding: var(--space-4); margin-bottom: var(--space-5); overflow-x: auto;}
.code-block pre { margin: 0; font-family: var(--font-mono); font-size: var(--text-sm); white-space: pre-wrap; word-break: break-all;}
.auth-method-options { display: flex; flex-direction: column; gap: var(--space-3);}
label.auth-option { display: flex; flex-direction: row; align-items: center; gap: var(--space-3); padding: var(--space-4); cursor: pointer; margin-bottom: 0;}
.auth-option:hover { border-color: var(--secondary); background: var(--bg-hover);}
.auth-option.selected { border-color: var(--secondary); background: var(--accent-muted);}
.auth-option input[type="radio"] { flex-shrink: 0; width: 18px; height: 18px; margin: 0;}
.auth-option-content { display: flex; flex-direction: column; gap: var(--space-1);}
.auth-option-content strong { color: var(--text-primary);}
.auth-option-content span { font-size: var(--text-sm); color: var(--text-secondary);}
.loading-indicator { display: flex; flex-direction: column; align-items: center; gap: var(--space-4); padding: var(--space-8);}
.passkey-section { margin-top: var(--space-5); text-align: center;}
.passkey-section p { margin-bottom: var(--space-4); color: var(--text-secondary);}
.current-account .label { color: var(--text-secondary);}
.current-account .value { font-weight: var(--font-medium); font-size: var(--text-lg);}
.server-info h3 { margin: 0 0 var(--space-3) 0; font-size: var(--text-base); color: var(--success-text);}
.server-info .info-row { display: flex; justify-content: space-between; padding: var(--space-2) 0; font-size: var(--text-sm);}
.server-info .label { color: var(--text-secondary);}
.server-info a { display: inline-block; margin-top: var(--space-2); margin-right: var(--space-3); color: var(--secondary); font-size: var(--text-sm);}
.final-warning strong { color: var(--error-text);}
.next-steps { background: var(--accent-muted); padding: var(--space-5); margin: var(--space-5) 0; text-align: left;}
.next-steps h3 { margin: 0 0 var(--space-3) 0;}
.next-steps ol { margin: 0; padding-left: var(--space-5);}
.next-steps li { margin-bottom: var(--space-2);}
.next-steps a { color: var(--secondary);}
.resume-info { margin-bottom: var(--space-5);}
.resume-details { display: flex; flex-direction: column; gap: var(--space-2); margin-top: var(--space-3);}
.resume-row { display: flex; gap: var(--space-3);}
.resume-row .label { color: var(--text-secondary); min-width: 80px;}
.resume-row .value { font-weight: var(--font-medium);}
.resume-note { margin-top: var(--space-4); font-size: var(--text-sm); font-style: italic;}
.file-input-container { display: flex; flex-direction: column; gap: var(--space-3);}
.file-info { display: flex; gap: var(--space-2); align-items: center; padding: var(--space-3); background: var(--bg-primary);}
.file-name { font-weight: var(--font-medium);}
.file-size { color: var(--text-secondary); font-size: var(--text-sm);}
.step-content textarea { width: 100%; font-family: var(--font-mono); font-size: var(--text-sm); padding: var(--space-3); border: 1px solid var(--border-color); background: var(--bg-input); color: var(--text-primary); resize: vertical;}
.step-content textarea:focus { outline: none; border-color: var(--secondary);}
.message { padding: var(--space-4); margin-bottom: var(--space-4);}
.handle-choice-options { display: flex; flex-direction: column; gap: var(--space-3);}
.handle-choice-option { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-4); cursor: pointer;}
.handle-choice-option:hover { border-color: var(--secondary);}
.handle-choice-option.selected { border-color: var(--secondary); background: var(--accent-muted);}
.handle-choice-option input[type="radio"] { flex-shrink: 0; width: 18px; height: 18px; margin: 0;}
.handle-choice-content { display: flex; flex-direction: column; gap: var(--space-1);}
.handle-preview { font-family: var(--font-mono); font-size: var(--text-sm); color: var(--text-secondary);}
.existing-handle-display { display: flex; align-items: center; gap: var(--space-4); padding: var(--space-4); background: var(--bg-secondary); margin-bottom: var(--space-4);}
.handle-value { font-family: var(--font-mono); font-size: var(--text-base);}
.verified-badge { font-size: var(--text-xs); padding: var(--space-1) var(--space-3); background: var(--success-bg); color: var(--success-text);}
.verification-instructions { background: var(--bg-secondary); padding: var(--space-5); margin-bottom: var(--space-4);}
.instruction-header { margin: 0 0 var(--space-4) 0; font-size: var(--text-sm); color: var(--text-secondary);}
.instruction-or { margin: var(--space-3) 0; font-size: var(--text-xs); color: var(--text-muted); text-align: center;}
.verification-record { display: flex; flex-direction: column; gap: var(--space-2);}
.verification-record code { font-size: var(--text-sm); padding: var(--space-3); background: var(--bg-tertiary); overflow-x: auto; word-break: break-all;}
.record-content { font-size: var(--text-xs); color: var(--text-secondary); padding-left: var(--space-3);}
.record-content code { padding: var(--space-1) var(--space-2); font-size: var(--text-xs);}
.verify-btn { width: 100%;}
.passkey-section button { width: 100%; margin-top: 12px;}