:root{--green:#58ff48;--green2:#9cff77;--amber:#ffbf35;--blue:#101f54;--cyan:#6ce7ff;--dark:#030604;--bezel:#1b1b16}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:radial-gradient(circle at center,#222 0,#050505 62%,#000 100%);display:flex;align-items:center;justify-content:center;padding:24px;font-family:"Courier New",monospace;color:var(--green);overflow:hidden}.terminal-shell{width:min(1120px,100%);padding:28px;border-radius:34px;background:linear-gradient(145deg,#2b2b25,#0b0b09);box-shadow:inset 0 0 18px #444,0 30px 80px #000}.minitel-screen{position:relative;min-height:720px;border-radius:24px;padding:34px 44px;background:radial-gradient(ellipse at center,#08220f 0%,#050b07 58%,#010201 100%);border:12px solid #050505;box-shadow:inset 0 0 45px rgba(88,255,72,.18),inset 0 0 120px #000;overflow:hidden;text-shadow:0 0 6px rgba(88,255,72,.75);font-weight:700;letter-spacing:2px}.minitel-screen:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 54%,rgba(0,0,0,.45));pointer-events:none}.scanlines{position:absolute;inset:0;background:repeating-linear-gradient(to bottom,rgba(255,255,255,.04) 0,rgba(255,255,255,.04) 1px,transparent 2px,transparent 5px);mix-blend-mode:screen;opacity:.45;pointer-events:none}.topbar,.footer{position:relative;z-index:2;display:flex;justify-content:space-between;gap:18px;font-size:24px;color:var(--green2)}.rule{position:relative;z-index:2;height:4px;background:var(--green);box-shadow:0 0 10px var(--green);margin:16px 0 40px}h1{position:relative;z-index:2;margin:0 0 26px;text-align:center;font-size:72px;line-height:1;color:var(--green);letter-spacing:8px}.content{position:relative;z-index:2;max-width:820px;margin:0 auto 26px;font-size:31px;line-height:1.65}.menu-line{display:grid;grid-template-columns:70px 1fr;margin:2px 0}.num{color:var(--amber);text-align:right;padding-right:24px}.label{color:var(--green)}.box{border:3px solid var(--green);padding:14px 22px;margin:18px 0 22px;box-shadow:0 0 12px rgba(88,255,72,.35);color:var(--cyan);background:rgba(12,24,84,.22)}.alert{color:var(--amber);font-size:34px;text-align:center;margin:46px 0}.small{font-size:22px;color:var(--green2);line-height:1.45}.command{position:relative;z-index:3;display:flex;align-items:center;justify-content:center;gap:16px;margin-top:28px;font-size:30px;color:var(--amber)}.choice-input{width:86px;height:52px;background:#050805;border:3px solid var(--green);border-radius:0;color:var(--amber);font:700 32px "Courier New",monospace;text-align:center;box-shadow:0 0 12px rgba(88,255,72,.45);text-shadow:0 0 5px var(--amber);outline:none}.choice-input:focus{background:#061307;border-color:var(--amber);box-shadow:0 0 20px rgba(255,191,53,.8)}button{height:52px;padding:0 24px;border:3px solid var(--amber);background:#181102;color:var(--amber);font:700 22px "Courier New",monospace;box-shadow:0 0 10px rgba(255,191,53,.35);cursor:pointer}.footer{margin-top:28px;border-top:3px solid var(--green);padding-top:18px;font-size:22px}.blink{animation:blink 1s steps(2,end) infinite}@keyframes blink{50%{opacity:0}}@media(max-width:760px){body{padding:0;align-items:stretch}.terminal-shell{width:100%;min-height:100%;border-radius:0;padding:10px;background:#080807}.minitel-screen{min-height:100vh;border-radius:16px;border-width:7px;padding:20px 18px}.topbar,.footer{font-size:13px;letter-spacing:1px;flex-wrap:wrap}.rule{margin:10px 0 24px}h1{font-size:36px;letter-spacing:3px;margin-bottom:22px}.content{font-size:20px;line-height:1.55}.menu-line{grid-template-columns:42px 1fr}.num{padding-right:12px}.box{padding:10px 12px}.command{font-size:20px;gap:8px;flex-wrap:wrap;margin-top:20px}.choice-input{width:74px;height:48px;font-size:27px}button{height:48px;padding:0 16px;font-size:18px}.footer{font-size:14px;gap:10px}.small{font-size:15px}.alert{font-size:24px}}
.sound-button{
  background: transparent;
  color: inherit;
  border: 1px solid currentColor;
  font: inherit;
  padding: 2px 8px;
  cursor: pointer;
  text-transform: uppercase;
}
.sound-button:active{ transform: translateY(1px); }


/* === PATCH RADICAL PIXEL 0,0 VISIBLE === */

html,
body {
  margin: 0 !important;
  padding: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  min-width: 100vw !important;
  min-height: 100vh !important;
  overflow: hidden !important;
}

body {
  display: block !important;
  align-items: unset !important;
  justify-content: unset !important;
  background: #000 !important;
}

/* Le site commence exactement au coin haut gauche */
.terminal-shell {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: auto !important;
  bottom: auto !important;

  width: 100vw !important;
  height: 100vh !important;

  margin: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;

  transform: none !important;
  background: #000 !important;
  box-shadow: none !important;
}

/* L'écran interne commence lui aussi au coin haut gauche */
.minitel-screen {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;

  width: 100vw !important;
  height: 100vh !important;
  min-height: 0 !important;

  margin: 0 !important;
  padding: 12px 28px 10px 28px !important;
  border: 0 !important;
  border-radius: 0 !important;

  overflow: hidden !important;
  transform: none !important;
}

/* La topbar doit être immédiatement visible */
.topbar {
  margin: 0 !important;
  padding: 0 !important;
  font-size: clamp(13px, 2.15vh, 20px) !important;
  line-height: 1 !important;
}

.rule {
  height: 3px !important;
  margin: 8px 0 14px 0 !important;
}

#screenTitle {
  font-size: clamp(34px, 7vh, 62px) !important;
  line-height: 0.9 !important;
  margin: 0 0 12px 0 !important;
  letter-spacing: clamp(2px, 0.7vw, 7px) !important;
}

.content {
  max-width: 820px !important;
  margin: 0 auto 10px auto !important;
  font-size: clamp(17px, 2.75vh, 27px) !important;
  line-height: 1.23 !important;
}

.box {
  margin: 8px 0 10px 0 !important;
  padding: 8px 16px !important;
}

.menu-line {
  margin: 0 !important;
}

.command {
  margin-top: 8px !important;
  font-size: clamp(16px, 2.5vh, 23px) !important;
}

.choice-input,
button {
  height: 38px !important;
}

.footer {
  margin-top: 8px !important;
  padding-top: 7px !important;
  font-size: clamp(12px, 1.9vh, 17px) !important;
}

/* Sur écrans bas, on réduit uniquement le contenu, jamais on ne décale le haut */
@media (max-height: 720px) {
  .minitel-screen {
    padding: 6px 22px 6px 22px !important;
  }

  .topbar {
    font-size: clamp(11px, 1.9vh, 16px) !important;
  }

  .rule {
    margin: 5px 0 8px 0 !important;
  }

  #screenTitle {
    font-size: clamp(28px, 6vh, 48px) !important;
    margin-bottom: 7px !important;
  }

  .content {
    font-size: clamp(14px, 2.25vh, 21px) !important;
    line-height: 1.12 !important;
    margin-bottom: 6px !important;
  }

  .box {
    margin: 5px 0 7px 0 !important;
    padding: 5px 10px !important;
  }

  .command {
    margin-top: 5px !important;
  }

  .choice-input,
  button {
    height: 32px !important;
  }

  .footer {
    margin-top: 5px !important;
    padding-top: 4px !important;
  }
}


/* Saccade Minitel réelle : chaque ligne est injectée avec setTimeout */
#content > * {
  animation: minitelPop 0.02s steps(1, end);
}

@keyframes minitelPop {
  from { opacity: 0; }
  to { opacity: 1; }
}

.video-frame{
width:min(760px,92%);
aspect-ratio:16/9;
margin:18px auto;
border:3px solid var(--green);
overflow:hidden;
background:#000;
}
.video-frame iframe{
width:100%;
height:100%;
border:0;
}
.numero13-line{
font-size:.82em;
line-height:1.2;
}


.press-frame{
width:min(760px,92%);
margin:18px auto;
border:3px solid var(--green);
background:#000;
padding:8px;
box-shadow:
0 0 14px rgba(88,255,72,.45),
inset 0 0 20px rgba(88,255,72,.18);
}

.press-frame img{
display:block;
width:100%;
height:auto;
filter:contrast(1.08) grayscale(.25);
}

.video-frame{
width:min(760px,92%);
aspect-ratio:16/9;
margin:18px auto;
border:3px solid var(--green);
overflow:hidden;
background:#000;
}

.video-frame iframe{
width:100%;
height:100%;
border:0;
}

.numero13-line{
font-size:.82em;
line-height:1.2;
}

.secret-zone{
margin:24px auto;
width:min(640px,92%);
padding:18px;
border:2px solid var(--green);
background:rgba(0,0,0,.45);
box-shadow:
0 0 14px rgba(88,255,72,.25),
inset 0 0 18px rgba(88,255,72,.08);
}

.secret-label{
margin-bottom:10px;
font-size:1rem;
}

.secret-input{
width:100%;
padding:12px;
background:#000;
border:2px solid var(--green);
color:var(--green);
font-family:inherit;
font-size:1rem;
outline:none;
margin-bottom:12px;
}

.secret-btn{
padding:10px 18px;
background:#000;
border:2px solid var(--green);
color:var(--green);
font-family:inherit;
cursor:pointer;
}

.secret-btn:hover{
background:rgba(88,255,72,.12);
}

.secret-message{
margin-top:18px;
opacity:0;
transition:opacity .25s;
line-height:1.5;
}

.secret-message.active{
opacity:1;
}


/* SECRET INPUT STAR FIX */
.secret-input{
  letter-spacing: 0.22em;
  caret-color: var(--green);
}

.secret-message.active{
  color: var(--amber);
  text-shadow: 0 0 8px rgba(255,191,53,.7);
}


/* SECRET FOCUS FIX */
.secret-zone{
  position: relative;
  z-index: 30;
}

.secret-input{
  pointer-events: auto;
  user-select: text;
  cursor: text;
  caret-color: var(--green);
}

.secret-input:focus{
  border-color: var(--amber);
  box-shadow: 0 0 18px rgba(255,191,53,.65);
}


/* SECRET VALIDATION BUTTON FINAL */
.secret-btn{
  width: 100%;
  white-space: normal;
  line-height: 1.25;
  min-height: 48px;
}

.secret-message.active{
  color: var(--amber);
  text-shadow: 0 0 8px rgba(255,191,53,.75);
  border-top: 2px solid var(--amber);
  padding-top: 12px;
}




/* 3615 PARADOXAL — SCROLL ET IMAGES CORRIGÉS */

/* Images moins envahissantes */
.image-frame,
.press-frame {
  width: min(520px, 82%) !important;
  margin: 16px auto !important;
  border: 3px solid var(--green) !important;
  background: #000 !important;
  padding: 8px !important;
  box-shadow:
    0 0 14px rgba(88,255,72,.35),
    inset 0 0 20px rgba(88,255,72,.14) !important;
}

.image-frame img,
.press-frame img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: 420px !important;
  object-fit: contain !important;
}

.video-frame {
  width: min(640px, 88%) !important;
  aspect-ratio: 16 / 9 !important;
  margin: 18px auto !important;
  border: 3px solid var(--green) !important;
  overflow: hidden !important;
  background: #000 !important;
}

.video-frame iframe {
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
  display: block !important;
}

.numero13-line {
  font-size: .82em !important;
  line-height: 1.2 !important;
}

.subsection-title {
  color: var(--amber) !important;
  border-top: 2px solid var(--green) !important;
  border-bottom: 2px solid var(--green) !important;
  padding: 8px 0 !important;
  margin: 22px 0 14px !important;
  text-align: center !important;
  text-shadow: 0 0 7px rgba(255,191,53,.7) !important;
}

.dossier-text {
  text-align: left !important;
}

/* Zone mot de passe */
.secret-zone {
  margin: 24px auto !important;
  width: min(560px, 86%) !important;
  padding: 16px !important;
  border: 2px solid var(--green) !important;
  background: rgba(0,0,0,.45) !important;
  box-shadow:
    0 0 14px rgba(88,255,72,.25),
    inset 0 0 18px rgba(88,255,72,.08) !important;
  position: relative !important;
  z-index: 30 !important;
}

.secret-label {
  margin-bottom: 10px !important;
  font-size: 1rem !important;
}

.secret-input {
  width: 100% !important;
  padding: 12px !important;
  background: #000 !important;
  border: 2px solid var(--green) !important;
  color: var(--green) !important;
  font-family: inherit !important;
  font-size: 1rem !important;
  outline: none !important;
  margin-bottom: 12px !important;
  letter-spacing: .22em !important;
  pointer-events: auto !important;
  user-select: text !important;
  cursor: text !important;
  caret-color: var(--green) !important;
}

.secret-input:focus {
  border-color: var(--amber) !important;
  box-shadow: 0 0 18px rgba(255,191,53,.65) !important;
}

.secret-btn {
  width: 100% !important;
  padding: 10px 18px !important;
  background: #000 !important;
  border: 2px solid var(--green) !important;
  color: var(--green) !important;
  font-family: inherit !important;
  cursor: pointer !important;
  white-space: normal !important;
  line-height: 1.25 !important;
  min-height: 48px !important;
}

.secret-message {
  margin-top: 18px !important;
  min-height: 80px !important;
  opacity: 0;
  transition: opacity .25s;
  line-height: 1.5 !important;
}

.secret-message.active {
  opacity: 1 !important;
  color: var(--amber) !important;
  text-shadow: 0 0 8px rgba(255,191,53,.75) !important;
  border-top: 2px solid var(--amber) !important;
  padding-top: 12px !important;
}

/* IMPORTANT : la page doit vraiment pouvoir scroller */
html,
body {
  height: auto !important;
  min-height: 100% !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  position: static !important;
}

/* PC : scroll naturel de toute la page */
@media (min-width: 761px) {
  body {
    align-items: flex-start !important;
    justify-content: center !important;
    padding-top: 24px !important;
    padding-bottom: 180px !important;
  }

  .terminal-shell {
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  .minitel-screen {
    height: auto !important;
    min-height: 720px !important;
    max-height: none !important;
    overflow: visible !important;
    padding-bottom: 90px !important;
  }

  #content,
  .content {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }
}

/* Mobile/tablette : scroll naturel de toute la page aussi */
@media (max-width: 760px) {
  body {
    align-items: flex-start !important;
    justify-content: flex-start !important;
    padding: 0 !important;
    margin: 0 !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .terminal-shell {
    height: auto !important;
    min-height: 100vh !important;
    max-height: none !important;
    overflow: visible !important;
  }

  .minitel-screen {
    height: auto !important;
    min-height: 100vh !important;
    max-height: none !important;
    overflow: visible !important;
    padding-bottom: 180px !important;
  }

  #content,
  .content {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  .image-frame,
  .press-frame {
    width: 84% !important;
    max-width: 420px !important;
  }

  .image-frame img,
  .press-frame img {
    max-height: 340px !important;
  }

  .video-frame {
    width: 92% !important;
  }

  .secret-zone {
    width: 88% !important;
  }

  .secret-message {
    min-height: 110px !important;
    margin-bottom: 90px !important;
  }
}


/* SCROLL V2 - écrans longs */
html,body{
  overflow-y:auto !important;
}

.terminal-shell,
.minitel-screen{
  overflow: visible !important;
}

#content,
.content{
  overflow-y:auto !important;
  max-height:none !important;
  height:auto !important;
}

@media (min-width:761px){
  .minitel-screen{
    overflow-y:auto !important;
    max-height:85vh !important;
  }
}

@media (max-width:760px){
  .minitel-screen{
    overflow-y:auto !important;
    max-height:none !important;
  }
}

/* DOSSIER HAJDUK STYLE */
.subsection-title{
  color: var(--amber);
  border-top: 2px solid var(--green);
  border-bottom: 2px solid var(--green);
  padding: 8px 0;
  margin: 22px 0 14px;
  text-align: center;
}

/* MAX VALENTIN UPDATE */
.image-frame,
.press-frame{
  width:min(520px,82%);
  margin:16px auto;
  border:3px solid var(--green);
  background:#000;
  padding:8px;
  box-shadow:0 0 14px rgba(88,255,72,.35), inset 0 0 20px rgba(88,255,72,.14);
}
.image-frame img,
.press-frame img{
  display:block;
  width:100%;
  height:auto;
  max-height:420px;
  object-fit:contain;
}
.video-frame{
  width:min(640px,88%);
  aspect-ratio:16/9;
  margin:18px auto;
  border:3px solid var(--green);
  overflow:hidden;
  background:#000;
}
.video-frame iframe{
  width:100%;
  height:100%;
  border:0;
  display:block;
}
.subsection-title{
  color:var(--amber);
  border-top:2px solid var(--green);
  border-bottom:2px solid var(--green);
  padding:8px 0;
  margin:22px 0 14px;
  text-align:center;
}
.dossier-text{text-align:left;}
.numero13-line{font-size:.82em;line-height:1.2;}
.secret-zone{
  margin:24px auto;
  width:min(560px,86%);
  padding:16px;
  border:2px solid var(--green);
  background:rgba(0,0,0,.45);
  position:relative;
  z-index:30;
}
.secret-input{
  width:100%;
  padding:12px;
  background:#000;
  border:2px solid var(--green);
  color:var(--green);
  font-family:inherit;
  font-size:1rem;
  outline:none;
  margin-bottom:12px;
  letter-spacing:.22em;
}
.secret-btn{
  width:100%;
  padding:10px 18px;
  background:#000;
  border:2px solid var(--green);
  color:var(--green);
  font-family:inherit;
  cursor:pointer;
}
.secret-message{
  margin-top:18px;
  min-height:80px;
  opacity:0;
  transition:opacity .25s;
}
.secret-message.active{
  opacity:1;
  color:var(--amber);
  border-top:2px solid var(--amber);
  padding-top:12px;
}


/* MOBILE SCROLL FINAL V08 */
@media (max-width: 760px) {
  html,
  body {
    height: auto !important;
    min-height: 100% !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    position: static !important;
    touch-action: pan-y !important;
  }

  body {
    align-items: flex-start !important;
    justify-content: flex-start !important;
    padding: 0 !important;
    margin: 0 !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .terminal-shell,
  .minitel-screen,
  #content,
  .content {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    position: static !important;
  }

  .terminal-shell {
    min-height: 100vh !important;
  }

  .minitel-screen {
    min-height: 100vh !important;
    padding-bottom: 180px !important;
  }

  .image-frame,
  .press-frame {
    width: 84% !important;
    max-width: 420px !important;
  }

  .video-frame {
    width: 92% !important;
  }
}


/* N13 NO ELLIPSIS ONLY */
.dossier-text,
.numero13-line,
.menu-line .label,
.small,
p {
  white-space: normal !important;
  text-overflow: clip !important;
  -webkit-line-clamp: unset !important;
  line-clamp: unset !important;
}


/* MAX VALENTIN CIT SAFE */
.opening-sequence {
  border: 2px solid var(--green);
  padding: 14px;
  margin: 18px auto;
  width: min(680px, 92%);
  background: rgba(0,0,0,.48);
  line-height: 1.5;
  animation: citBlink 1.4s steps(2, end) infinite;
}

@keyframes citBlink {
  0%, 60% { opacity: 1; }
  61%, 100% { opacity: .68; }
}

.cit-form {
  width: min(680px, 92%);
  margin: 18px auto;
  border: 2px solid var(--green);
  padding: 16px;
  background: rgba(0,0,0,.48);
}

.cit-form label {
  display: block;
  margin-top: 12px;
  margin-bottom: 6px;
}

.cit-form input {
  width: 100%;
  padding: 11px;
  background: #000;
  border: 2px solid var(--green);
  color: var(--green);
  font-family: inherit;
  font-size: 1rem;
  margin-bottom: 8px;
}

.cit-form input:focus {
  outline: none;
  border-color: var(--amber);
  box-shadow: 0 0 14px rgba(255,191,53,.55);
}


/* CIT INPUT FOCUS FIX */
.cit-form input,
.cit-form button,
.secret-input,
.secret-btn{
  pointer-events:auto !important;
  position:relative;
  z-index:9999;
}

.cit-form{
  position:relative;
  z-index:9999;
}


/* CIT V3 FORM INPUT FIX */
.cit-form,
.secret-zone {
  position: relative !important;
  z-index: 99999 !important;
  pointer-events: auto !important;
}

.cit-form input,
.cit-form button,
#maxPasswordInput,
#maxPasswordValidate {
  position: relative !important;
  z-index: 100000 !important;
  pointer-events: auto !important;
  user-select: text !important;
  -webkit-user-select: text !important;
}

#maxPasswordInput {
  letter-spacing: .22em;
}

/* SAINTE COLOMBE FULL DOSSIER */
.dossier-text{ text-align:left !important; line-height:1.45 !important; white-space:normal !important; overflow:visible !important; text-overflow:clip !important; -webkit-line-clamp:unset !important; line-clamp:unset !important; }
