.app-shell [hidden]{display:none!important}
.app-shell{min-height:100svh;background:var(--color-paper);color:var(--color-ink);display:flex;flex-direction:column}
.app-header{height:78px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,4vw,64px);border-bottom:1px solid rgba(16,17,17,.09);position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--color-paper) 92%,transparent);backdrop-filter:blur(14px)}
.app-header .brand{width:180px}
.app-header-actions{display:flex;align-items:center;gap:18px}
.app-home-link,.app-account-link,.app-signout{font:700 .8rem var(--font-display);text-decoration:none;color:var(--color-ink);background:none;border:0;cursor:pointer;padding:8px 0}
.app-home-link,.app-account-link{border-bottom:1px solid rgba(16,17,17,.25)}
.app-signout:focus-visible,.app-home-link:focus-visible,.app-account-link:focus-visible{outline:3px solid color-mix(in srgb,var(--color-self) 30%,transparent);outline-offset:4px}
.app-progress{height:3px;background:rgba(16,17,17,.08);position:sticky;top:78px;z-index:20}
.app-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--color-self),var(--color-meet),var(--color-external));transition:width .45s var(--ease-brand)}
.app-main{flex:1;width:min(1180px,100%);margin:0 auto;padding:clamp(40px,7vw,90px) clamp(20px,4vw,64px) 80px}
.app-scene{display:none;animation:scene-in .36s var(--ease-brand) both}
.app-scene.is-active{display:block}
@keyframes scene-in{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.scene-copy{max-width:850px;margin-bottom:46px}
.scene-copy.narrow{max-width:650px}
.scene-copy.centered{text-align:center;margin-left:auto;margin-right:auto}
.scene-copy h1,.scene-copy h2,.question-scene h2,.result-scene h2{font-family:var(--font-display);font-size:clamp(2.4rem,6vw,5.6rem);line-height:.94;letter-spacing:-.055em;margin:.3em 0 .28em}
.scene-copy.narrow h1,.scene-copy.narrow h2{font-size:clamp(2.4rem,5vw,4.5rem)}
.scene-lead,.quality-head p,.compatibility-result>p{font-size:clamp(1rem,1.5vw,1.2rem);line-height:1.65;max-width:62ch}
.kicker{font:800 .78rem var(--font-display);text-transform:uppercase;letter-spacing:.12em;color:var(--color-self)}

.relationship-form{max-width:940px;display:grid;gap:18px}
.form-section{border:0;padding:0;margin:0}
.journey-step{background:rgba(255,255,255,.58);border:1px solid rgba(16,17,17,.08);border-radius:26px;padding:clamp(20px,3vw,30px);box-shadow:0 14px 48px rgba(16,17,17,.035)}
.journey-step legend{padding:0 4px 0 0;margin:0 0 20px;display:flex;align-items:center;gap:12px;font:800 1.02rem var(--font-display)}
.step-index{width:34px;height:34px;border-radius:50%;background:var(--color-ink);color:var(--color-paper);display:grid;place-items:center;font:800 .72rem var(--font-display);letter-spacing:.02em}
.step-title{font-size:1.04rem}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.company-grid{grid-template-columns:minmax(170px,.34fr) 1fr}
.form-help{max-width:62ch;margin:-4px 0 18px;line-height:1.55;color:var(--color-ink-soft)}
.privacy-note{font-size:.9rem;max-width:64ch;opacity:.7;margin:18px 0 0;padding-top:16px;border-top:1px solid rgba(16,17,17,.08)}

.company-results{display:grid;gap:7px;margin-top:10px}
.company-result{display:flex;align-items:center;justify-content:space-between;text-align:left;width:100%;border:1px solid rgba(16,17,17,.1);background:rgba(255,255,255,.76);padding:13px 16px;border-radius:14px;cursor:pointer;min-height:50px}
.company-result:hover{border-color:var(--color-self)}
.company-result:focus-visible{outline:3px solid color-mix(in srgb,var(--color-self) 28%,transparent);outline-offset:2px}
.candidate-action{border:0;background:none;padding:12px 0;font:700 .9rem var(--font-display);color:var(--color-self);cursor:pointer}
.candidate-action:focus-visible{outline:3px solid color-mix(in srgb,var(--color-self) 28%,transparent);outline-offset:3px}
.company-selection{display:flex;align-items:center;justify-content:space-between;padding:15px 18px;border-radius:16px;background:rgba(64,56,242,.07);margin-top:10px}
.company-selection div{display:grid;gap:3px}
.company-selection span{font-size:.72rem;opacity:.64}
.company-selection button{border:0;background:none;font:700 .78rem var(--font-display);cursor:pointer}

.period-panel{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:end}
.period-block{background:var(--color-paper-soft);border:1px solid rgba(16,17,17,.08);border-radius:20px;padding:18px}
.period-block#relationshipEndField{grid-column:1/-1}
.period-block-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px}
.period-required{font-size:.74rem;color:var(--color-muted)}
.ongoing-choice{border:0;padding:0;margin:0;min-width:230px}
.ongoing-choice legend{font:750 .76rem var(--font-display);text-transform:uppercase;letter-spacing:.08em;color:var(--color-ink-soft);margin:0 0 8px}
.contract-block{margin-top:22px;padding-top:22px;border-top:1px solid rgba(16,17,17,.08)}
.contract-help{margin:7px 0 14px;font-size:.92rem}
.contract-choices{max-width:760px}

.auth-form{max-width:560px;display:grid;gap:18px}
.auth-actions,.profile-actions,.result-actions,.question-actions{display:flex;gap:12px;flex-wrap:wrap}

.question-scene{max-width:920px;margin:0 auto}
.question-meta{display:flex;justify-content:space-between;align-items:center;gap:20px;font:750 .78rem var(--font-display);text-transform:uppercase;letter-spacing:.08em;margin-bottom:14px;color:var(--color-ink-soft)}
.question-scene>h2{font-size:clamp(2rem,4.4vw,3.8rem);line-height:1.04;margin:0 0 34px;max-width:21ch}
.question-actions{justify-content:space-between;margin-top:6px}
.question-actions .app-primary{margin-left:auto;min-width:132px}
.question-actions .app-secondary{min-width:118px}

.profile-result{display:grid;grid-template-columns:minmax(300px,520px) 1fr;gap:54px;align-items:center;max-width:980px;margin:30px auto}
.profile-radar{width:100%;overflow:visible;filter:drop-shadow(0 18px 40px rgba(16,17,17,.06))}
.radar-grid{fill:none;stroke:rgba(16,17,17,.15);stroke-width:1}
.radar-grid-inner{stroke:rgba(16,17,17,.11);stroke-dasharray:3 6}
.profile-components{display:grid;gap:4px}
.profile-component{position:relative;display:grid;grid-template-columns:1fr auto;gap:15px;padding:14px 0 14px 20px;border-bottom:1px solid rgba(16,17,17,.1)}
.profile-component:before{content:"";position:absolute;left:0;top:50%;translate:0 -50%;width:8px;height:8px;border-radius:50%;background:var(--profile-accent,var(--color-muted))}
.profile-component[data-archetype-code="collab_star"]{--profile-accent:var(--color-collaborator-star)}
.profile-component[data-archetype-code="collab_pilote"]{--profile-accent:var(--color-collaborator-pilot)}
.profile-component[data-archetype-code="collab_specialiste"]{--profile-accent:var(--color-collaborator-specialist)}
.profile-component[data-archetype-code="collab_creatif"]{--profile-accent:var(--color-collaborator-creative)}
.profile-component[data-archetype-code="collab_collectif"]{--profile-accent:var(--color-collaborator-collective)}
.profile-component strong{font-family:var(--font-display);color:var(--profile-accent)}
.profile-component b{font:800 1.3rem var(--font-display)}
.profile-actions{justify-content:center;margin-top:30px}

.quality-head{max-width:720px;margin-bottom:35px}
.quality-head h2{font:800 clamp(2.2rem,5vw,4.7rem)/.98 var(--font-display);letter-spacing:-.05em;margin:.3em 0}
.quality-head p{opacity:.78}
.quality-options{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:28px 0}
.quality-option{border:1px solid rgba(16,17,17,.14);background:#fff;border-radius:18px;min-height:58px;padding:16px 10px;font:750 .82rem var(--font-display);cursor:pointer;transition:border-color .18s var(--ease-brand),background .18s var(--ease-brand),color .18s var(--ease-brand),transform .18s var(--ease-brand)}
.quality-option:hover{border-color:rgba(16,17,17,.34);transform:translateY(-1px)}
.quality-option:focus-visible{outline:3px solid color-mix(in srgb,var(--color-self) 30%,transparent);outline-offset:3px}
.quality-option.is-selected{background:var(--color-ink);color:var(--color-paper);border-color:var(--color-ink)}
#qualityQuestion,#livedQuestion{font:750 clamp(1.7rem,3vw,2.8rem)/1.12 var(--font-display);letter-spacing:-.03em;max-width:850px;margin:0 0 30px}
#livedScale{max-width:920px}
#livedFinish{margin-top:2px}

.cycle-context-card{max-width:760px;background:#fff;border:1px solid rgba(16,17,17,.09);border-radius:24px;padding:28px;display:grid;gap:20px}
.context-line{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:baseline;padding:10px 0;border-bottom:1px solid rgba(16,17,17,.08)}
.context-line span{font:700 .72rem var(--font-display);text-transform:uppercase;letter-spacing:.08em;color:var(--color-muted)}
.context-line strong{font:800 .96rem var(--font-display);text-align:right}
.context-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}

.result-scene{max-width:1050px;margin:0 auto}
.result-heading{margin-bottom:22px}
.compatibility-result{text-align:center;border-top:1px solid rgba(16,17,17,.11);border-bottom:1px solid rgba(16,17,17,.11);padding:34px 0 30px;margin:18px 0 28px}
.compatibility-result>strong{display:block;font:850 clamp(4.5rem,11vw,8.5rem)/.85 var(--font-display);letter-spacing:-.07em;color:var(--color-meet)}
.compatibility-result>span{font:800 .85rem var(--font-display);text-transform:uppercase;letter-spacing:.08em}
.compatibility-result>p{margin:16px auto 0;opacity:.7}
.result-context-compact{margin:0 auto 42px;max-width:760px;padding:0 18px}
.result-context-compact h2{font:800 .72rem var(--font-display);text-transform:uppercase;letter-spacing:.1em;color:var(--color-muted);margin:0 0 8px;text-align:center}
.result-context-compact .context-grid{gap:14px}
.result-context-compact .context-line{padding:9px 0}
.result-columns{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin:30px 0}
.result-columns>section,.result-section{background:#fff;border:1px solid rgba(16,17,17,.08);border-radius:24px;padding:26px}
.result-columns h2,.result-section h2{font:800 1.2rem var(--font-display);margin:3px 0 18px}
.result-section-kicker{font:800 .68rem var(--font-display);text-transform:uppercase;letter-spacing:.11em;color:var(--color-meet)}
.result-section-note{font-size:.88rem;line-height:1.5;color:var(--color-muted);margin:-8px 0 18px;max-width:44ch}
.gap-explainer{max-width:760px;margin:-12px auto 34px;text-align:center;color:var(--color-muted);font-size:.86rem;line-height:1.55}
.gap-list,.quality-summary,.insight-list{display:grid;gap:12px}
.gap-item,.quality-item{display:flex;align-items:center;justify-content:space-between;gap:18px;border-bottom:1px solid rgba(16,17,17,.08);padding-bottom:11px}
.gap-item span:first-child{font-weight:650}
.gap-item strong{font:800 .82rem var(--font-display);color:var(--color-ink-soft);text-align:right;white-space:nowrap}
.insight-section{margin-top:34px}
.insight-card{padding:0 0 18px;border-bottom:1px solid rgba(16,17,17,.08)}
.insight-card:last-child{border-bottom:0;padding-bottom:0}
.insight-item{border-left:3px solid var(--color-meet);padding:12px 0 12px 18px;line-height:1.55;margin:0}
.insight-feedback{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 0 0 21px}
.insight-feedback-label{font:750 .72rem var(--font-display);color:var(--color-muted)}
.insight-feedback-controls{display:flex;gap:6px;flex-wrap:wrap}
.insight-feedback-button{appearance:none;border:1px solid rgba(16,17,17,.18);background:var(--color-paper-soft);color:var(--color-ink);border-radius:999px;min-height:36px;padding:7px 12px;font:800 .72rem var(--font-display);cursor:pointer;transition:background .18s var(--ease-brand),color .18s var(--ease-brand),border-color .18s var(--ease-brand),transform .18s var(--ease-brand)}
.insight-feedback-button:hover:not(:disabled){border-color:var(--color-meet);transform:translateY(-1px)}
.insight-feedback-button:focus-visible{outline:3px solid color-mix(in srgb,var(--color-meet) 28%,transparent);outline-offset:2px}
.insight-feedback-button.is-selected{background:var(--color-ink);color:var(--color-paper);border-color:var(--color-ink)}
.insight-feedback-button:disabled{opacity:.55;cursor:wait}
.insight-feedback-status{font-size:.72rem;color:var(--color-muted);min-height:1em}
.result-reality-columns{align-items:stretch}
.lived-card{display:flex;flex-direction:column}
.lived-summary{display:flex;align-items:baseline;gap:8px;margin-top:auto}
.lived-summary strong{font:850 clamp(3rem,6vw,4.3rem) var(--font-display);letter-spacing:-.05em;color:var(--color-ink)}
.lived-summary span{font:800 1rem var(--font-display);color:var(--color-muted)}
.result-actions{justify-content:center;margin-top:35px}
.app-live{position:fixed;left:-9999px}

@media(max-width:760px){
  .app-header{height:68px;padding-inline:18px}
  .app-progress{top:68px}
  .app-header .brand{width:145px}
  .app-home-link{display:none}
  .app-main{padding:28px 18px 78px}
  .scene-copy{margin-bottom:24px}
  .scene-copy h1,.scene-copy h2,.result-scene h2{font-size:clamp(2.25rem,11vw,4rem)}
  .form-grid,.company-grid,.profile-result,.result-columns{grid-template-columns:1fr;gap:18px}
  .journey-step{padding:20px 16px;border-radius:22px}
  .company-grid{gap:12px}
  .period-panel{grid-template-columns:1fr}
  .ongoing-choice{min-width:0}
  .period-block#relationshipEndField{grid-column:auto}
  .period-block-head{align-items:flex-start;flex-direction:column;gap:4px}
  .quality-options{grid-template-columns:1fr}
  .quality-option{text-align:left;padding:14px 16px}
  .profile-result{gap:18px;margin:20px auto}
  .profile-radar{max-width:430px;margin:0 auto}
  .auth-actions,.profile-actions,.result-actions{display:grid}
  .question-scene>h2{font-size:clamp(1.8rem,8.5vw,3rem);margin-bottom:26px}
  .question-meta{font-size:.7rem}
  .question-actions-sticky{position:sticky;bottom:0;z-index:8;margin:16px -18px -20px;padding:12px 18px max(12px,env(safe-area-inset-bottom));background:color-mix(in srgb,var(--color-paper) 94%,transparent);backdrop-filter:blur(14px);border-top:1px solid rgba(16,17,17,.08);display:grid;grid-template-columns:auto 1fr}
  .question-actions .app-primary,.question-actions .app-secondary{margin:0;min-width:0}
  .context-grid{grid-template-columns:1fr}
  .context-line{grid-template-columns:1fr}
  .context-line strong{text-align:left}
  .cycle-context-card{padding:20px}
  .app-header-actions{gap:10px}
}

@media(max-width:430px){
  .segmented-control{width:100%}
  .segmented-control span{min-width:0}
  .contract-choices{grid-template-columns:1fr}
}

@media(prefers-reduced-motion:reduce){
  .app-scene{animation:none}
  .app-progress span,.quality-option,.radar-shape{transition:none}
}

/* 0.9.5 · profile components are explorable */
.profile-style-link{color:inherit;text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--profile-accent,var(--color-ink)) 45%,transparent);padding-bottom:2px}.profile-style-link:hover{border-bottom-color:var(--profile-accent,var(--color-ink))}.profile-style-link:focus-visible{outline:3px solid color-mix(in srgb,var(--profile-accent,var(--color-self)) 30%,transparent);outline-offset:3px;border-radius:4px}.profile-explore-note{margin:16px 0 0;color:var(--color-muted);font-size:.82rem;line-height:1.5}.profile-explore-note a{color:var(--color-ink);font-weight:800;text-decoration:none;border-bottom:1px solid rgba(16,17,17,.28)}

/* 0.13.0 — route dédiée d’auto-perception manager */
.manager-self-shell .app-main{min-height:calc(100vh - 110px)}.manager-self-intro-card{display:grid;gap:20px;align-content:center;justify-items:start;padding:30px;border-radius:28px;border:1px solid rgba(64,56,242,.15);background:linear-gradient(145deg,rgba(64,56,242,.06),rgba(255,255,255,.86))}.manager-self-intro-card>span{font:850 clamp(3rem,8vw,7rem)/.9 var(--font-display);letter-spacing:-.07em;color:rgba(64,56,242,.2)}
.manager-self-result .scene-copy{max-width:760px;margin-bottom:30px}
.manager-self-result .scene-copy h1{max-width:14ch;font-size:clamp(2.8rem,4.7vw,4.65rem);line-height:.95}
.manager-self-result .profile-result-panel{display:grid;grid-template-columns:minmax(300px,440px) minmax(280px,1fr);gap:clamp(28px,4vw,54px);align-items:center;max-width:1040px;margin:0 auto;border:1px solid rgba(16,17,17,.09);background:rgba(255,255,255,.86);border-radius:28px;padding:clamp(22px,3vw,34px)}
.manager-self-result .profile-radar{display:block;width:min(100%,440px);margin:0 auto}
.manager-self-result .profile-components{align-content:center}
.manager-self-result-shape{fill:rgba(64,56,242,.13);stroke:#4038F2;stroke-width:5}.manager-self-result .profile-component{display:flex;justify-content:space-between;gap:18px;padding:13px 0;border-top:1px solid rgba(16,17,17,.08)}.manager-self-result .profile-component:first-child{border-top:0}.manager-self-result .profile-component b{color:#4038F2}.manager-self-shell .question-shell{max-width:1080px;margin-inline:auto}.manager-self-shell .question-head output{color:#4038F2}

/* 0.15.9 — auto-perception manager: compact question viewport without changing shared scale */
.manager-self-shell .app-main{padding-top:clamp(28px,3.6vw,54px)}
.manager-self-shell .question-scene{max-width:1120px}
.manager-self-shell .question-shell{max-width:1120px;margin-inline:auto}
.manager-self-shell .question-scene h2{
  max-width:30ch;
  font-size:clamp(2rem,3vw,3rem);
  line-height:1.01;
  letter-spacing:-.045em;
  margin:0 0 24px;
}
.manager-self-shell .question-meta{margin-bottom:12px}
.manager-self-shell .scale-anchor-card{min-height:112px;padding:16px 18px}
.manager-self-shell .scale-control-row{padding:10px 4px 6px}
.manager-self-shell .scale-status{min-height:42px}
.manager-self-shell .question-actions{margin-top:2px}
@media(max-width:760px){
  .manager-self-shell .app-main{padding-top:24px}
  .manager-self-shell .question-scene h2{max-width:none;font-size:clamp(1.75rem,7.4vw,2.6rem);line-height:1.04;margin-bottom:22px}
  .manager-self-shell .scale-anchor-card{min-height:0;padding:15px}
}

/* 0.15.10 — auto-perception manager result: compact two-column summary */
@media(max-width:820px){
  .manager-self-result .scene-copy h1{max-width:none;font-size:clamp(2.45rem,9vw,4rem)}
  .manager-self-result .profile-result-panel{grid-template-columns:1fr;gap:20px;padding:20px}
  .manager-self-result .profile-radar{width:min(100%,360px)}
  .manager-self-result .profile-component{padding:11px 0}
}
