[x-cloak] { display: none !important; }
.welcome-body { margin: 0; background: #faf8f5; color: #233046; font: 300 15px/1.55 'Inter', system-ui, sans-serif; }
.welcome-shell { min-height: 100dvh; padding: 30px clamp(20px, 4vw, 70px) 50px; overflow: hidden; background: radial-gradient(ellipse at 78% 13%, rgba(231, 157, 116, .20), transparent 36%), radial-gradient(ellipse at 88% 84%, rgba(250, 184, 133, .28), transparent 35%), #faf8f5; }
.welcome-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; max-width: 1500px; margin: auto; }
.welcome-brand { display: inline-flex; align-items: center; gap: 10px; color: #243044; font-size: 18px; font-weight: 400; letter-spacing: -.025em; }
.welcome-brand svg { width: 28px; height: 28px; }
.welcome-progress-label { color: #687489; font-size: 12px; }
.welcome-progress { height: 3px; max-width: 1500px; margin: 27px auto 0; background: #e6e6e7; border-radius: 10px; }
.welcome-progress span { display: block; height: 100%; border-radius: inherit; background: var(--cr-accent); transition: width .35s ease; }
.welcome-grid { display: grid; grid-template-columns: minmax(0, 660px) minmax(300px, 1fr); gap: clamp(50px, 7vw, 150px); align-items: center; max-width: 1500px; min-height: calc(100dvh - 150px); margin: auto; }
.welcome-main { padding: 56px 0 70px; animation: welcome-enter .42s ease both; transition: opacity .18s ease, transform .18s ease; }
.welcome-main.welcome-leaving { opacity: 0; transform: translateY(-9px); }
@keyframes welcome-enter { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
.welcome-step h1 { margin: 0; max-width: 620px; font-size: clamp(38px, 5.3vw, 68px); line-height: 1.07; letter-spacing: -.057em; font-weight: 300; color: #233046; }
.welcome-lead { max-width: 560px; margin: 20px 0 34px; color: #657184; font-size: 16px; line-height: 1.7; }
/* Shared cr pieces at the welcome flow's roomier size */
.welcome-step .cr-eyebrow { margin-bottom: 18px; }
.welcome-choice-list .cr-choice { grid-template-columns: 24px 40px minmax(0, 1fr) 22px; gap: 14px; padding: 21px 22px; border-radius: 14px; }
.welcome-choice-list .cr-choice-icon { width: 40px; height: 40px; font-size: 21px; }
.welcome-choice-list .cr-choice strong { font-size: 16px; }
.welcome-seg { margin-bottom: 20px; }
.welcome-seg > * { padding: 9px 16px; }
.welcome-recovery { max-width: 640px; margin: -12px 0 22px; }
/* Straight under the heading, with no lead line between to pull up into
   (the job search has none), it touched the heading's descenders. */
.welcome-step h1 + .welcome-recovery { margin-top: 22px; }
.welcome-skip { margin-top: 14px; }
.welcome-skip button { color: var(--cr-muted); font-size: 12px; text-decoration: underline; text-underline-offset: 3px; }
.welcome-skip button:hover { color: var(--cr-accent); }
.welcome-back { display: inline-flex; gap: 8px; align-items: center; margin-bottom: 38px; color: #657184; font-size: 12px; }
.welcome-back:hover { color: var(--cr-accent); }
.welcome-form { display: flex; flex-direction: column; gap: 19px; max-width: 640px; }
.welcome-actions { display: flex; justify-content: flex-start; margin-top: 15px; }
/* The shared primary button, at the welcome flow's larger size */
.welcome-next { justify-content: space-between; gap: 36px; min-width: 190px; padding: 13px 18px; font-size: 13px; }
.welcome-next.welcome-submitting::after { content: ''; width: 15px; height: 15px; border: 2px solid rgba(255,255,255,.45); border-top-color: #fff; border-radius: 50%; animation: cr-spin .75s linear infinite; }
.welcome-next:focus-visible { outline: 2px solid var(--cr-accent); outline-offset: 3px; }
.welcome-fields-two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.welcome-field { display: flex; flex-direction: column; gap: 7px; min-width: 0; }
.welcome-field > span, .welcome-targets legend { color: #3b4659; font-size: 12px; font-weight: 400; }
.welcome-field .cr-input, .welcome-field .cr-select, .welcome-field .cr-textarea { width: 100%; min-height: 45px; padding: 11px 13px; font-size: 14px; }
.welcome-field textarea { resize: vertical; }
.welcome-field input[type=file] { max-width: 100%; font-size: 12px; }
.welcome-chip-field { display: grid; gap: 8px; }
.welcome-chip-field .welcome-chip-list, .welcome-chip-field [data-chip-add] { display: none; }
.welcome-chip-ready textarea { display: none; }
.welcome-chip-ready .welcome-chip-list { display: flex; flex-wrap: wrap; gap: 7px; }
.welcome-chip-ready [data-chip-add] { display: block; }
.welcome-chip { display: inline-flex; align-items: center; gap: 7px; max-width: 100%; padding: 6px 8px 6px 11px; border: 1px solid #e8cdbb; border-radius: 999px; background: #fff5ee; color: #70432f; font-size: 12px; overflow-wrap: anywhere; }
.welcome-chip button { display: grid; place-items: center; width: 16px; height: 16px; border-radius: 50%; color: #8f5237; font-size: 15px; line-height: 1; }
.welcome-chip button:hover { background: #eed9cc; }
.welcome-experience-list { display: grid; gap: 10px; }
.welcome-experience-item { display: grid; gap: 11px; padding: 17px; border: 1px solid #e8ded7; border-radius: 11px; background: rgba(255,255,255,.78); }
.welcome-remove-experience, .welcome-add-experience { justify-self: start; color: var(--cr-accent); font-size: 12px; }
.welcome-remove-experience { color: #89695a; }
.welcome-add-experience { margin-top: 8px; }
.welcome-field small { color: #768296; font-size: 11px; }
.welcome-targets { margin: 0; padding: 0; border: 0; }
.welcome-targets p { margin: 3px 0 12px; color: #768296; font-size: 12px; }
.welcome-source-text { padding: 12px 15px; margin-bottom: 18px; border: 1px solid #e8ded7; border-radius: 9px; background: #fff; font-size: 12px; color: #596579; }
.welcome-source-text summary { cursor: pointer; }
.welcome-source-text pre { white-space: pre-wrap; overflow-wrap: anywhere; max-height: 220px; overflow: auto; font: inherit; }
.welcome-divider { position: relative; color: #8691a2; text-align: center; font-size: 11px; }
.welcome-divider::before, .welcome-divider::after { content: ''; position: absolute; top: 50%; width: 39%; height: 1px; background: #e8ded7; }
.welcome-divider::before { left: 0; }.welcome-divider::after { right: 0; }
.welcome-polish { display: flex; gap: 12px; align-items: flex-start; padding: 16px; border-radius: 10px; background: #fbece2; cursor: pointer; }
.welcome-polish input { margin-top: 3px; accent-color: var(--cr-accent); }
.welcome-polish strong, .welcome-polish small { display: block; }
.welcome-polish strong { font-size: 13px; font-weight: 400; }.welcome-polish small { margin-top: 3px; color: #657184; font-size: 11px; }
.welcome-processing { display: inline-flex; align-items: center; gap: 13px; padding: 17px 20px; border-radius: 10px; background: #fff; color: var(--cr-accent); font-size: 13px; }
.welcome-processing-alt { margin: 17px 0 0; font-size: 12px; color: #657184; }
.welcome-processing-alt a { text-decoration: underline; text-underline-offset: 3px; }
.welcome-processing .material-symbols-outlined { animation: cr-spin 1s linear infinite; }
.welcome-photo-row { display: flex; align-items: center; gap: 16px; padding: 17px 0; border-top: 1px solid #e1e5eb; }
.welcome-photo-preview { position: relative; display: grid; place-items: center; flex: 0 0 64px; height: 64px; overflow: hidden; border-radius: 15px; background: #f8e7dc; color: var(--cr-accent); }
.welcome-photo-preview img { position: absolute; width: 100%; height: 100%; object-fit: cover; }.welcome-photo-preview .material-symbols-outlined { font-size: 30px; }
.welcome-photo-preview img[hidden] { display: none; }
[data-photo-error]:empty { display: none; }
[data-photo-error] { color: #a44831 !important; }
.welcome-photo-row .welcome-field { flex: 1; }
.welcome-art { position: sticky; top: 24px; align-self: center; min-height: min(520px, calc(100dvh - 180px)); display: grid; place-items: center; }
.welcome-orbit { position: absolute; border-radius: 50%; filter: blur(1px); }
.welcome-orbit-one { width: 520px; height: 520px; background: linear-gradient(135deg, #f6ded0, #f6dcca 72%); transform: rotate(-23deg); }
.welcome-orbit-two { width: 270px; height: 270px; right: 3%; bottom: 8%; background: rgba(250,192,137,.55); filter: blur(34px); }
.welcome-art-card { position: relative; display: flex; flex-direction: column; width: min(72%, 360px); min-height: 380px; padding: 34px; transform: rotate(-7deg); border: 1px solid rgba(255,255,255,.7); border-radius: 22px; background: rgba(255,255,255,.78); box-shadow: 0 30px 90px rgba(53,72,112,.15); backdrop-filter: blur(15px); }
.welcome-art-mark { color: var(--cr-accent); font-size: 55px; font-weight: 300; letter-spacing: -.08em; }
.welcome-art-line { height: 13px; width: 80%; margin-top: 46px; border-radius: 10px; background: #f3d6c5; }.welcome-art-line-short { width: 60%; margin-top: 13px; background: #f8eee8; }
.welcome-art-pills { display: flex; gap: 8px; margin-top: auto; }.welcome-art-pills i { width: 48px; height: 20px; border-radius: 20px; background: #f3d6c5; }.welcome-art-pills i:nth-child(2) { background: #f4dac9; }.welcome-art-pills i:nth-child(3) { width: 30px; background: #d6e8df; }
@media (max-width: 1000px) { .welcome-grid { grid-template-columns: minmax(0, 720px); min-height: 0; }.welcome-art { display: none; }.welcome-main { padding-top: 70px; } }
@media (max-width: 620px) { .welcome-choice-list .cr-choice { grid-template-columns: 20px 36px minmax(0, 1fr); padding: 16px; gap: 10px; } .welcome-shell { padding: 20px 18px 34px; }.welcome-header { align-items: flex-start; }.welcome-progress-label { font-size: 10px; }.welcome-main { padding: 58px 0 35px; }.welcome-step h1 { font-size: 42px; }.welcome-lead { font-size: 14px; margin-bottom: 28px; }.welcome-fields-two { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .welcome-main { animation: none; transition: none; }.welcome-next { transition: none; } }
/* Only masked data is sent to the preview; blur is a presentation effect. */
.welcome-preview-note { margin: 0 0 12px; color: #657184; font-size: 12px; }
.welcome-results { max-height: min(380px, 42dvh); overflow-y: auto; overscroll-behavior: contain; border-top: 1px solid #e1e5eb; scrollbar-width: thin; }
.welcome-results:focus-visible { outline: 2px solid var(--cr-accent); outline-offset: 3px; }
.welcome-result { padding: 14px 2px; border-bottom: 1px solid #e1e5eb; }
.welcome-result-reveal { animation: welcome-reveal .65s ease both; animation-delay: calc(var(--i, 0) * 140ms); }
@keyframes welcome-reveal { from { filter: blur(7px); opacity: .35; transform: translateY(6px); } to { filter: none; opacity: 1; transform: translateY(0); } }
.welcome-result-blur { filter: blur(7px); opacity: .65; user-select: none; pointer-events: none; }
.welcome-secret { display: block; margin-top: 4px; color: #70432f; font-size: 12px; }
.welcome-preview-actions { position: sticky; bottom: 0; padding: 14px 0 8px; background: #faf8f5; z-index: 1; }
@media (max-width: 600px) { .welcome-preview .welcome-back { margin-bottom: 20px; } .welcome-preview-actions .welcome-next { width: 100%; } }
@media (prefers-reduced-motion: reduce) { .welcome-result-reveal { animation: none; } }

.welcome-header { gap: 16px; }
.welcome-signin { margin-left: auto; padding: 6px 14px; border: 1px solid #cfd4dc; border-radius: 999px; background: #fff; color: #233046; font-size: 13px; text-decoration: none; white-space: nowrap; }
.welcome-signin:hover { border-color: var(--cr-accent); color: var(--cr-accent); }