.cyberquest-intro { padding-top: 2rem; padding-bottom: 1.8rem; }
.cyberquest-intro .eyebrow { margin-bottom: .75rem; }
.cyberquest-intro h1 { font-size: clamp(2.7rem, 6vw, 4.4rem); margin-bottom: .9rem; }
.cyberquest-intro .lead { max-width: 850px; font-size: 1.08rem; }
.cyberquest-intro .pill-row { margin-top: 1.1rem; }
.cyberquest-toolbar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; padding: 1rem 1.2rem; background: var(--surface); border: 1px solid var(--line); border-bottom: 0; border-radius: 1rem 1rem 0 0; }
.cyberquest-toolbar p { margin: 0; }
.cyberquest-toolbar p span { display: block; color: var(--muted); font-size: .83rem; }
.cyberquest-actions { display: flex; flex-wrap: wrap; gap: .6rem; }
.cyberquest-actions .button { min-height: 2.7rem; padding: .55rem .85rem; font: inherit; font-size: .85rem; font-weight: 750; cursor: pointer; }
.cyberquest-actions [hidden] { display: none; }
.cyberquest-frame { display: block; width: 100%; aspect-ratio: 16 / 9; border: 1px solid var(--line); border-radius: 0 0 1rem 1rem; background: #060d22; box-shadow: var(--shadow); }
.cyberquest-frame:fullscreen { width: 100vw; height: 100dvh; border: 0; border-radius: 0; }
.cyberquest-frame:focus-visible { outline: 3px solid var(--yellow); outline-offset: 3px; }
.cyberquest-help, .cyberquest-status { color: var(--muted); font-size: .9rem; }
.cyberquest-status:empty { display: none; }
.cyberquest-controls { display: flex; flex-wrap: wrap; gap: 1rem 1.8rem; padding: 1.1rem 1.2rem; margin: 1.1rem 0 0; border: 1px solid var(--line); border-radius: 1rem; background: var(--surface); }
.cyberquest-controls dt { min-height: 2rem; }
.cyberquest-controls dd { margin: .3rem 0 0; color: var(--muted); font-size: .82rem; }
.cyberquest-controls kbd { display: inline-block; padding: .1rem .45rem; border: 1px solid rgba(161,211,235,.35); border-bottom-width: 3px; border-radius: .35rem; background: var(--surface-2); font: 600 .8rem/1.5 ui-monospace, monospace; }
.cyberquest-missions { padding-top: 3.7rem; }
.cyberquest-missions h2 { font-size: clamp(1.8rem, 3.7vw, 2.75rem); }
.cyberquest-missions .card:hover { transform: none; }
.cyberquest-debrief { margin: 2rem 0 0; color: var(--muted); padding-left: 1rem; border-left: 3px solid var(--cyan); }
.cyberquest-debrief strong { color: var(--ink); }
@media (max-width: 560px) {
  .cyberquest-intro { padding-top: 1.4rem; }
  .cyberquest-intro .eyebrow { font-size: .73rem; }
  .cyberquest-toolbar { padding: .8rem; }
  .cyberquest-actions { width: 100%; }
  .cyberquest-actions .button { flex: 1; }
  .cyberquest-controls { gap: 1rem; }
  .cyberquest-controls div { flex: 1 1 42%; }
}

@media (max-width: 480px) { .cyberquest-frame { aspect-ratio: 4 / 5; } }

/* Portail des cinq aventures pédagogiques. */
.games-hub{padding-top:2.7rem;padding-bottom:3rem}.games-hub>h1{font-size:clamp(2.6rem,5vw,4.7rem);line-height:1.07;max-width:900px;margin:.7rem 0 1.2rem}.games-hub>.lead{max-width:850px;font-size:1.1rem}.learning-games-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.2rem;margin-top:2rem}.learning-game{--game-accent:#78e2ce;border:1px solid var(--line);border-radius:1.2rem;overflow:hidden;background:linear-gradient(145deg,#122b3d,#0b1b2a);display:flex;flex-direction:column;box-shadow:0 15px 40px #0002}.learning-game.sql-adventure{--game-accent:#c4b3ff}.learning-game.cyber-adventure{--game-accent:#7fdcfe}.learning-game-body{padding:1.4rem;display:flex;align-items:flex-start;flex-direction:column;flex:1}.learning-game-body h2{font-size:1.48rem;line-height:1.2;margin:.45rem 0 .7rem}.learning-game-body p{font-size:.94rem;color:var(--muted);line-height:1.6;margin:.2rem 0 .9rem}.learning-game-body .game-kicker{font:800 .69rem/1.4 ui-monospace,monospace;letter-spacing:.08em;color:var(--game-accent);margin:0}.learning-game-body .game-concepts{color:#d1e2ef;font-size:.8rem;border-top:1px solid var(--line);padding-top:.8rem;width:100%;margin-top:auto}.learning-game-body .button{min-height:44px;font-size:.9rem;width:100%;text-align:center;display:flex;justify-content:space-between;gap:.5rem}.learning-game-body small{color:var(--muted);font-size:.72rem;line-height:1.4;margin-top:.75rem}.game-art-link{display:block;line-height:0}.game-card-art{height:186px;position:relative;overflow:hidden;background:#071b2b;border-bottom:1px solid var(--line)}.game-card-art .code-glyph{position:absolute;z-index:2;left:18px;top:18px;font:700 12px/1.7 ui-monospace,monospace;letter-spacing:-.015em;color:#b8f3e3;background:#0a1b2fdc;padding:8px 12px;border:1px solid #76cdbb44;border-radius:7px}.python-art{background:radial-gradient(ellipse at 85% 20%,#1f6b6955,transparent 70%),repeating-linear-gradient(0deg,transparent 0 23px,#7affdc08 23px 24px),#0a2131}.art-island{position:absolute;background:linear-gradient(150deg,#3e9a84,#163c4d);border:1px solid #85e9c78c;border-top:6px solid #7bdfb3;border-radius:8px 8px 40% 40%;box-shadow:0 12px 15px #0003;transform:skewY(-7deg)}.island-one{width:110px;height:39px;left:14px;bottom:18px}.island-two{width:91px;height:45px;left:42%;bottom:43px}.island-three{width:73px;height:36px;right:10px;bottom:76px}.art-route{position:absolute;width:66%;height:30px;border-top:2px dashed #85d8cc75;left:18%;bottom:54px;transform:rotate(-19deg)}.art-robot{position:absolute;left:48px;bottom:60px;color:#fff5ba;line-height:1;font-size:30px;text-shadow:0 0 20px #ffe38799}.art-star{position:absolute;right:35px;top:35px;font-size:38px;line-height:1;color:#ffe29a;text-shadow:0 0 22px #ffe29a55}.sql-art{background:radial-gradient(ellipse at 50% 100%,#6945a455,transparent 85%),#111a31}.sql-art .code-glyph{color:#dfd0ff;border-color:#a895e652;top:98px;left:20px}.data-stack{position:absolute;width:83px;right:35px;top:73px}.data-stack i{display:block;height:22px;border:2px solid #c4b3ff;background:#49377a;border-radius:50%;box-shadow:0 9px 0 #2c244d;margin-top:-8px}.data-orbit{position:absolute;width:220px;height:100px;border:1px dashed #9e88f466;border-radius:50%;transform:rotate(-18deg);left:50%;top:40px;margin-left:-110px}.data-node{position:absolute;width:13px;height:13px;border:2px solid #c4b3ff;background:#9b7ae0;border-radius:4px;box-shadow:0 0 20px #9b7ae066}.data-node.n1{left:35px;top:50px}.data-node.n2{left:57%;top:21px}.data-node.n3{right:16px;bottom:23px}.sql-art .art-star{right:35px;top:18px;font-size:25px;color:#c4b3ff}.cyber-art img{width:100%;height:100%;object-fit:cover}.art-badge{position:absolute;left:18px;bottom:15px;color:#f6faff;background:#081b2ad9;border:1px solid #6cdfff70;padding:10px 12px;border-radius:6px;font:800 10px/1 ui-monospace,monospace;letter-spacing:.13em}.games-teaching-note{max-width:900px;border-left:3px solid var(--cyan);padding-left:1rem;color:var(--muted);font-size:.9rem;line-height:1.7;margin:1.7rem 0 0}.games-teaching-note strong{color:var(--ink)}#cybreane{scroll-margin-top:100px;border-top:1px solid var(--line);padding-top:2.5rem}#cyberquest-title{font-size:clamp(2.7rem,6vw,4.4rem);margin-bottom:.9rem}
@media(max-width:920px){.learning-games-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.learning-game-body h2{font-size:1.35rem}.games-hub{padding-top:2rem}}
@media(max-width:560px){.learning-games-grid{grid-template-columns:1fr}.learning-game:last-child{grid-column:auto;display:flex}.learning-game:last-child .game-card-art{height:186px;min-height:0}.learning-game-body{padding:1.2rem}.games-hub>.lead{font-size:1rem}.games-hub{padding-bottom:2rem}.game-card-art{height:175px}}

.learning-game.linux-adventure{--game-accent:#b9f68c}.linux-art{background:radial-gradient(ellipse at 80% 70%,#43624466,transparent 75%),#0c1c24}.linux-window{position:absolute;left:30px;right:105px;top:22px;height:145px;border:1px solid #587b5a;border-radius:9px;background:#071813;box-shadow:8px 9px 0 #06130f99;padding:11px 14px;transform:rotate(-3deg)}.linux-window>i{display:inline-block;width:6px;height:6px;border-radius:50%;background:#8caf7c;margin-right:4px}.linux-window b{display:block;color:#b9f68c;font:10px/1.5 ui-monospace,monospace;margin-top:10px}.linux-window code{display:block;color:#c7dac1;font:11px/1.8 ui-monospace,monospace}.linux-window em{color:#b9f68c;font-style:normal}.linux-seal{position:absolute;right:25px;top:57px;text-align:center;font:700 35px/1 ui-monospace,monospace;color:#b9f68c}.linux-seal small{font:8px/1 ui-monospace,monospace;letter-spacing:.1em}

.learning-game.knn-adventure {
  --game-accent: #68dfe8;
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  border-color: #68dfe84d;
  background: linear-gradient(125deg, #142d40, #122337);
}
.knn-adventure .game-art-link { display: flex; align-items: stretch; min-width: 0; }
.knn-adventure .knn-art {
  display: grid;
  place-items: center;
  width: 100%;
  height: 100%;
  min-height: 300px;
  padding: 1rem;
  border-bottom: 0;
  border-right: 1px solid var(--line);
  background: radial-gradient(ellipse at 34% 28%, #15666c55, transparent 70%), radial-gradient(ellipse at 85% 90%, #5c3d873d, transparent 65%), #0a1c2a;
}
.knn-art svg { display: block; width: 100%; max-width: 480px; height: auto; }
.knn-adventure .learning-game-body { padding: 1.8rem; }
.knn-adventure .learning-game-body h2 { font-size: clamp(1.5rem, 2.4vw, 2rem); }
@media (max-width: 680px) {
  .learning-game.knn-adventure { grid-template-columns: minmax(0, 1fr); }
  .knn-adventure .knn-art { min-height: 0; height: auto; padding: .7rem 1rem; border-right: 0; border-bottom: 1px solid var(--line); }
  .knn-art svg { max-width: 360px; }
  .knn-adventure .learning-game-body { padding: 1.3rem; }
}
