/* Purple belongs to Déclic: controls, help and game feedback. */
.simulator-toolbar{background:#402665;color:#fff;border-bottom:3px solid #9b7bd0}
.simulator-toolbar .simulator-brand{color:#fff;font-size:15px}
.simulator-toolbar .simulator-title>small{color:#e1d2f6}
.simulator-toolbar .simulator-button{background:#f3edff;color:#41265f;border-color:#cdb8ec}
.simulator-toolbar .simulator-button:hover{background:#e3d5fa}
.simulator-toolbar button:focus-visible{outline:3px solid #fff;outline-offset:2px}
.hacker-toolbar{background:#402665;border-bottom:3px solid #9b7bd0}
.hacker-toolbar .simulator-brand{color:#fff;font-size:15px}
.hacker-toolbar .hacker-case{color:#e1d2f6}
.hacker-toolbar .simulator-button{background:#f3edff;color:#41265f;border-color:#cdb8ec}
.hacker-toolbar .simulator-button:hover{background:#e3d5fa}
.simulator-stage{flex-direction:column}
.simulation-context{flex:none;padding:5px 16px;background:#eaf1f9;color:#325477;font-size:10px;font-weight:750;letter-spacing:.045em;border-bottom:1px solid #c7d9eb}
.simulator-guide{background:#f4edff;border:2px solid #9b7bd0;color:#3d2b58}
.simulator-guide .guide-heading .kicker{color:#654096}
.simulator-guide .guide-close{color:#573c7b}
.simulator-toast{background:#402665;color:#fff;border:1px solid #b694e4}
.simulator-toast .player-tool-label{color:#e7d8fc;font-size:10px}
.simulator-toast p{margin:0;font-size:12px;line-height:1.6}
.game-info-inline{padding:14px 16px;margin:18px 0;background:#eee5fb;border:1px solid #b99ddc;border-left:4px solid #8060b0;border-radius:8px;color:#45325e}
.game-info-inline p{font-size:13px;line-height:1.6;margin:0}
.case-receipt{background:#f4edff;color:#45325e;border-top:4px solid #8060b0}

/* Sam's software keeps familiar blue and neutral accents. */
.phone-device .phone-screen-home{background:linear-gradient(150deg,#8bbfe8 0%,#5c85b2 46%,#2e506e 100%)}
.phone-device .phone-chat{background:#f3f5f8}
.phone-device .phone-app-switcher>.phone-current-app{color:#225b96!important;background:#eaf2fc}
.pc-shell .iv-documents,.phone-device .iv-documents{--iv-purple:#225b96}
.pc-shell .iv-file:hover,.phone-device .iv-file:hover{background:#f0f5fc;border-color:#9dbbdc}
.pc-shell .iv-file.is-selected,.phone-device .iv-file.is-selected{background:#eaf2fc;border-color:#457ab2}
.phone-device .phone-detail-button{color:#315c88;background:#f1f6fc;border-color:#c5d5e7}

@media(max-width:760px){
  .hacker-toolbar{flex-direction:column;align-items:stretch;gap:5px}
  .hacker-toolbar>div,.hacker-toolbar nav{justify-content:center}
  .hacker-toolbar .simulator-brand{font-size:11px;letter-spacing:.04em}
  .simulator-toolbar{flex-direction:column;align-items:stretch;gap:5px;padding:6px 8px}
  .simulator-toolbar .simulator-title{display:flex;justify-content:center}
  .simulator-toolbar .simulator-brand{font-size:11px;letter-spacing:.04em;line-height:1.4}
  .simulator-toolbar nav{width:100%;justify-content:space-between}
  .simulation-context{text-align:center;font-size:9px;padding:4px 10px}
}
@media(orientation:landscape) and (max-height:500px){
  .hacker-toolbar{flex-direction:row;align-items:center;gap:12px}
  .hacker-toolbar .simulator-brand{font-size:11px}
  .simulator-toolbar{flex-direction:row;align-items:center;gap:12px;padding:4px 10px}
  .simulator-toolbar .simulator-title{display:flex}
  .simulator-toolbar .simulator-title>span:nth-child(2),.simulator-toolbar .simulator-title>small{display:none}
  .simulator-toolbar .simulator-brand{font-size:11px}
  .simulator-toolbar nav{width:auto;margin-left:auto}
  .simulation-context{padding:3px 10px;font-size:8px}
}

/* A short brief: Lumi above the text, with the start action always visible. */
.simulator-guide.exploration-guide{display:flex;flex-direction:column;gap:10px;width:360px;max-height:calc(100dvh - 140px);top:50%;bottom:auto;transform:translateY(-50%);padding:16px;overflow:hidden}
.simulator-guide.exploration-guide[hidden]{display:none}
.exploration-guide .guide-heading,.exploration-guide .guide-actions,.exploration-guide>small{flex:none}
.exploration-guide .guide-body{min-height:0;overflow:auto;overscroll-behavior:contain}
.exploration-guide .guide-heading .kicker{font-size:10px}
.exploration-guide .guide-close{width:44px;height:44px;flex:none}
.exploration-guide .companion-card{display:grid;grid-template-columns:54px minmax(0,1fr);gap:3px 10px;padding:0;margin:0;border:0;border-radius:0;background:transparent;align-items:center}
.exploration-guide .companion-content{display:contents}
.exploration-guide .companion-avatar{grid-column:1;grid-row:1 / 3;margin:0;width:54px;height:54px}
.exploration-guide .lumi-avatar{width:54px;height:54px}
.exploration-guide .companion-label{grid-column:2;font-size:10px;line-height:1.4;margin:0}
.exploration-guide .companion-title{grid-column:2;font-size:17px!important;line-height:1.3!important;margin:0!important}
.exploration-guide .companion-text{grid-column:1 / -1;font-size:14px!important;line-height:1.55!important;margin:10px 0 0!important;color:#584568}
.exploration-guide .companion-controls{grid-column:1 / -1;display:flex;gap:8px;margin:9px 0 0}
.exploration-guide .companion-controls button{min-height:40px;font-size:12px}
.exploration-guide .guide-actions{margin:0;gap:6px;display:flex;align-items:center;flex-wrap:wrap}
.exploration-guide .guide-actions .primary-button{min-height:44px;font-size:13px;padding:10px 14px}
.exploration-guide .guide-actions .text-button{min-height:44px;font-size:12px;padding:8px 6px}
.exploration-guide>small{font-size:11px;line-height:1.4;color:#715b88}
@media(max-width:760px){.simulator-guide.exploration-guide{left:12px;right:12px;top:52%;width:auto;max-width:none;max-height:calc(100dvh - 150px);padding:14px}}
@media(max-width:360px){.exploration-guide .companion-title{font-size:16px!important}.exploration-guide .companion-text{font-size:13px!important}.exploration-guide .guide-actions .primary-button{font-size:12px}.exploration-guide .guide-actions .text-button{font-size:11px}}
@media(orientation:landscape) and (max-height:500px){.simulator-guide.exploration-guide{width:min(620px,calc(100% - 24px));left:50%;right:auto;top:52%;transform:translate(-50%,-50%);max-height:calc(100dvh - 95px);padding:10px 16px;gap:5px}.exploration-guide .guide-close{height:36px;width:36px}.exploration-guide .companion-card{grid-template-columns:40px minmax(0,1fr)}.exploration-guide .companion-avatar,.exploration-guide .lumi-avatar{height:40px;width:40px}.exploration-guide .companion-text{font-size:13px!important;line-height:1.45!important;margin-top:5px!important}.exploration-guide .companion-controls{margin-top:5px}.exploration-guide .companion-controls button{min-height:36px}.exploration-guide>small{display:none}}

/* Choices belong to Sam's applications; only help and simulator controls are purple. */
.native-follow-up{padding:16px;border-left:3px solid #91adca;background:#f5f8fc;margin:20px 0;color:#26354a}
.native-follow-up>small,.native-reply-thread small{display:block;font-size:11px;color:#68788b;margin-bottom:6px}
.native-follow-up p,.native-reply-thread p{font-size:14px;line-height:1.6;margin:0}
.native-reply-thread{display:flex;flex-direction:column;gap:12px;margin:20px 0}
.native-reply-thread>div{padding:14px 16px;border-radius:14px;max-width:85%}
.native-outgoing{align-self:flex-end;background:#e8f2ff;color:#234469}
.native-incoming{align-self:flex-start;background:#f0f2f6;color:#26354a}
.phone-device .native-reply-thread{width:100%;margin:10px 0}.phone-device .native-reply-thread>.native-outgoing{background:#d6eaff;border-radius:19px 19px 5px 19px;align-self:flex-end}.phone-device .native-reply-thread p,.phone-device .native-follow-up p{font-size:15px}.phone-device .native-follow-up{margin:8px 0}.phone-device .message-game-footer .button-row{flex-wrap:wrap;gap:6px 20px}
.exploration-trail{list-style:none;padding:0;margin:16px 0;display:grid;gap:10px}.exploration-trail li{padding:12px 14px;border:1px solid #d7dfeb;border-radius:10px;background:#f8faff}.exploration-trail strong,.exploration-trail span{display:block;font-size:14px;line-height:1.5}.exploration-trail span{font-size:12px;color:#64758a;margin-top:4px}
.pc-shell .message-game-footer>p{font-size:12px;font-weight:600;line-height:1.5;color:#3b506b}

/* Panneau de mission : commande du jeu (violet), à côté du PC ou du téléphone de Sam. */
.simulator-stage.has-mission-panel{flex-direction:row}
.simulator-main{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column}
.simulator-main>.pc-shell,.simulator-main>.phone-scene{flex:1;min-height:0}
.simulator-main>.simulation-context{flex-shrink:0}
.mission-panel{flex:none;width:310px;overflow-y:auto;overscroll-behavior:contain;padding:18px 16px 20px;background:#2c1b42;color:#f3efff;border-right:1px solid #5b417f;display:flex;flex-direction:column;gap:14px}
.mission-panel-head{display:flex;gap:10px;align-items:center}
.mission-panel-head .lumi-avatar{width:52px;height:52px;flex:none}
.mission-panel-kicker{display:block;font-size:10.5px;letter-spacing:.08em;font-weight:800;color:#d9c8ff;margin-bottom:3px}
.mission-panel-head strong{display:block;font-size:17px;line-height:1.3}
.mission-panel-alert{margin:0;padding:10px 12px;border-radius:10px;background:#5a1f2c;border:1px solid #e46b65;color:#ffdcd5;font-size:13.5px;line-height:1.45}
.mission-panel-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;position:relative}
.mission-panel-steps li{display:flex;gap:11px;align-items:flex-start;padding:9px 10px;border-radius:12px;color:#bfaee0}
.mission-panel-steps b{display:block;font-size:15px;line-height:24px}
.mission-panel-dot{width:24px;height:24px;flex:none;display:grid;place-items:center;border-radius:50%;background:#46306a;font-size:12px;font-weight:800}
.mission-panel-steps .is-done{color:#c9f2c0}
.mission-panel-steps .is-done .mission-panel-dot{background:#2f6a45;color:#e2ffdc;animation:dot-pop .4s ease-out}
.mission-panel-steps .is-current{background:#fbf6ff;color:#2a1a3e;box-shadow:0 6px 18px #0004}
.mission-panel-steps .is-current .mission-panel-dot{background:#6b3fd0;color:#fff}
.mission-panel-steps .is-current>div{min-width:0}
.mission-panel-action{margin:4px 0 6px;font-size:15.5px;line-height:1.45;font-weight:650;color:#21142f}
.mission-panel-why{display:block;font-size:13px;line-height:1.45;color:#5d4b78}
.mission-hint-button{margin-top:10px;display:inline-flex;align-items:center;gap:7px;min-height:40px;padding:8px 12px;border-radius:10px;border:1.5px dashed #8a63d8;background:#f1e9ff;color:#4b2a8f;font:inherit;font-size:13.5px;font-weight:700;cursor:pointer}
.mission-hint-button:hover{background:#e6d9ff}
.mission-hint-button svg{width:16px;height:16px}
.mission-hint{margin:10px 0 0;padding:10px 12px;border-radius:10px;background:#fff6c7;border:1px solid #e8cf5a;color:#3d3207;font-size:14px;line-height:1.5;animation:hint-in .25s ease-out}
.mission-panel-steps .is-new{animation:step-in .6s ease-out}
.mission-panel-done{padding:12px;border-radius:12px;background:#24452f;border:1px solid #79b88a}
.mission-panel-done p{margin:0 0 10px;font-size:14px;color:#dcf7d5}
.mission-finish{width:100%;min-height:46px;border:0;border-radius:10px;background:#fff1a6;color:#34214c;font:inherit;font-weight:800;font-size:15px;cursor:pointer;animation:finish-glow 1.8s ease-in-out infinite}
.mission-panel-toast{margin:auto 0 0;padding:10px 12px;border-radius:10px;background:#46306a;color:#fff1a6;font-size:13px;line-height:1.45}
.mission-panel-danger{background:#3a1622;border-right-color:#a3474d}
.mission-panel-danger .mission-panel-kicker{color:#ffb6a7}
@keyframes step-in{0%{transform:translateX(-8px);box-shadow:0 0 0 4px #fff1a6}100%{transform:none}}
@keyframes dot-pop{0%{transform:scale(.4)}70%{transform:scale(1.2)}100%{transform:scale(1)}}
@keyframes hint-in{from{opacity:0;transform:translateY(-4px)}}
@keyframes finish-glow{50%{box-shadow:0 0 0 6px #fff1a633}}
@media(prefers-reduced-motion:reduce){.mission-panel *{animation:none!important}}
/* Écran étroit : le panneau passe au-dessus et ne garde que l’étape en cours. */
@media(max-width:900px){
 .simulator-stage.has-mission-panel{flex-direction:column}
 .mission-panel{width:auto;max-height:46vh;border-right:0;border-bottom:1px solid #5b417f;padding:10px 12px;gap:8px}
 .mission-panel-head .lumi-avatar{width:34px;height:34px}
 .mission-panel-head strong{font-size:14px}
 .mission-panel-steps li:not(.is-current){display:none}
 .mission-panel-steps .is-current{padding:8px 10px}
 .mission-panel-why{display:none}
 .mission-panel-action{font-size:14.5px;margin:2px 0 4px}
 .mission-hint-button{margin-top:6px;min-height:36px}
 /* Étape en cours compacte : intitulé et bouton d’indice sur une ligne, consigne dessous. */
 .mission-panel-steps .is-current>div{display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:8px}
 .mission-panel-steps .is-current .mission-hint-button{grid-column:2;grid-row:1;margin:0;min-height:40px;padding:6px 10px;font-size:13px}
 .mission-panel-action,.mission-hint{grid-column:1 / -1}
 .mission-hint{margin-top:6px}
 /* Enquête bouclée : l’étape ratée reste visible à côté du bouton du bilan. */
 .mission-panel-steps:not(:has(.is-current)) .is-failed{display:flex;padding:4px 10px}
 .mission-panel-done{display:flex;align-items:center;gap:10px;padding:8px 10px}
 .mission-panel-done p{margin:0;flex:1;font-size:13px;line-height:1.35}
 .mission-finish{width:auto;flex:none;padding:0 16px;min-height:44px}
 .mission-panel-toast{display:none}
 .stage-toast{display:block;position:absolute;z-index:30;left:10px;right:10px;top:28px;margin:0;padding:10px 12px;border-radius:12px;background:#46306a;color:#fff1a6;font-size:13px;line-height:1.45;box-shadow:0 8px 22px #0006;pointer-events:none;animation:hint-in .25s ease-out}
 .lumi-bubble{font-size:12.5px;padding:4px 9px}
}
.mission-hint-tiny{display:none}
@media(max-width:480px){.mission-panel .mission-hint-full{display:none}.mission-panel .mission-hint-short{display:inline}}
@media(max-width:360px){.mission-panel .mission-hint-short{display:none}.mission-panel .mission-hint-tiny{display:inline}}
/* Écran court (320 × 568…) : le téléphone garde la place. La question de la mission reste
   dans « Revoir l’histoire » ; l’étape en cours dit quoi faire. */
@media(max-width:900px) and (max-height:700px){
 .mission-panel{padding:6px 10px 8px;gap:6px}
 .mission-panel-head .lumi-avatar{width:30px;height:30px}
 .mission-panel-head strong,.mission-panel-alert{display:none}
 .mission-panel-steps .is-current{padding:6px 10px}
 .mission-panel-action{font-size:13.5px;line-height:1.35;margin:0}
}
/* Indice long sur écran court : il défile au lieu de pousser le téléphone hors de l’écran. */
@media(max-width:900px) and (max-height:700px){.mission-hint{max-height:26vh;overflow-y:auto}}
/* Téléphone tenu en paysage (844 × 390…) : le panneau repasse à gauche, en colonne étroite,
   pour laisser toute la hauteur au simulateur (audit interface, 9 octobre 2026). */
@media(max-width:900px) and (orientation:landscape) and (max-height:500px){
 .simulator-stage.has-mission-panel{flex-direction:row}
 .mission-panel{width:min(250px,32vw);max-height:none;border-bottom:0;border-right:1px solid #5b417f}
 .mission-panel-steps .is-current>div{display:block}
 .mission-panel-steps .is-current .mission-hint-button{margin-top:6px;min-height:36px}
 .mission-panel .mission-hint-full{display:none}.mission-panel .mission-hint-short{display:inline}
 .mission-hint{max-height:none}
 .simulation-context{display:none}
}
/* Étape « Décider » ratée : une transmission n’est pas une réussite, même rattrapée. */
.mission-panel-steps .is-failed{color:#ffc9c2}
.mission-panel-steps .is-failed b{display:inline-block}
.mission-panel-steps .is-failed .mission-panel-dot{background:#c2414b;color:#fff;animation:dot-pop .4s ease-out}
.mission-panel-tag{display:inline-block;margin-left:8px;padding:1px 8px;border-radius:999px;background:#c2414b;color:#fff;font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;vertical-align:2px}
.mission-panel-done.is-danger{background:#4b1d28;border-color:#e46b65}
.mission-panel-done.is-danger p{color:#ffdcd5}
.mission-hint-short{display:none}
/* Les messages du jeu passent par le panneau ; sur écran étroit, ils flottent sur le
   simulateur au lieu de repousser le téléphone pendant quelques secondes. */
.stage-toast{display:none}
/* Lumi dans le panneau : au repos elle flotte et regarde autour d’elle ; une étape cochée
   la fait sauter avec une bulle, une erreur lui donne une mine inquiète. */
.mission-lumi{position:relative;flex:none;display:block}
.mission-lumi .lumi-head{transform-origin:80px 95px;animation:lumi-look 9s ease-in-out infinite}
.mission-lumi .lumi-avatar{transform-origin:50% 90%}
.lumi-react-cheer .lumi-avatar{animation:lumi-hop .55s ease-out var(--lumi-delay,0ms) 2 both}
.lumi-react-celebrate .lumi-avatar{animation:lumi-hop .55s ease-out var(--lumi-delay,0ms) 4 both}
.lumi-react-cheer .lumi-hand-right,.lumi-react-celebrate .lumi-hand-right{animation:lumi-wave .5s ease-in-out var(--lumi-delay,0ms) 4}
.lumi-react-celebrate .lumi-hand-left{transform-origin:51px 96px;animation:lumi-wave-left .5s ease-in-out var(--lumi-delay,0ms) 4}
.mission-lumi.is-worried .lumi-avatar{animation:lumi-shiver 2.8s ease-in-out infinite}
.mission-lumi.is-worried .lumi-wing{animation-duration:5s}
.lumi-bubble{position:absolute;left:calc(100% + 6px);top:-4px;z-index:3;white-space:nowrap;padding:5px 11px;border-radius:12px 12px 12px 3px;background:#fff1a6;color:#34214c;font-size:13.5px;font-weight:800;line-height:1.3;box-shadow:0 4px 14px #0005;pointer-events:none;animation:lumi-bubble 2.6s ease-out var(--lumi-delay,0ms) both}
.lumi-react-celebrate .lumi-bubble{animation-duration:3.2s}
.lumi-react-worried .lumi-bubble{background:#ffe1dc;color:#5a1f2c;animation-duration:4.2s}
@keyframes lumi-look{0%,38%,62%,100%{transform:rotate(0)}44%,56%{transform:rotate(-7deg)}78%,86%{transform:rotate(6deg)}}
@keyframes lumi-hop{0%,100%{transform:translateY(0) scale(1)}35%{transform:translateY(-9px) scale(1.06)}70%{transform:translateY(0) scale(.97,1.03)}}
@keyframes lumi-shiver{0%,100%{transform:translateX(0)}6%{transform:translateX(-1.5px)}12%{transform:translateX(1.5px)}18%{transform:translateX(0)}}
@keyframes lumi-wave-left{0%,100%{transform:rotate(0)}50%{transform:rotate(14deg)}}
@keyframes lumi-bubble{0%{opacity:0;transform:translateY(4px) scale(.6)}10%{opacity:1;transform:scale(1.06)}16%{transform:scale(1)}82%{opacity:1}100%{opacity:0;transform:translateY(-4px)}}
.lumi-motion-paused .mission-lumi .lumi-avatar,.lumi-motion-paused .lumi-bubble{animation:none!important}
@media(prefers-reduced-motion:reduce){.mission-lumi .lumi-avatar,.lumi-bubble,.stage-toast{animation:none!important}}
/* L’application de l’étape en cours pulse doucement tant qu’elle n’est pas ouverte. */
.is-guide-target{position:relative}
.desktop-shortcut.is-guide-target .shortcut-tile,.phone-app-icon.is-guide-target .phone-icon-tile,.taskbar-app.is-guide-target{box-shadow:0 0 0 3px #fff1a6,0 0 0 7px #fff1a655;animation:guide-pulse 1.6s ease-in-out infinite}
@keyframes guide-pulse{50%{box-shadow:0 0 0 3px #fff1a6,0 0 0 11px #fff1a600}}
@media(prefers-reduced-motion:reduce){.is-guide-target .shortcut-tile,.is-guide-target .phone-icon-tile,.taskbar-app.is-guide-target{animation:none!important}}