:root {
    --bg-dark: #050505;
    --glass-bg: rgba(255,255,255,0.05);
    --glass-border: rgba(255,255,255,0.1);
    --neon-cyan: #00f3ff;
    --neon-magenta: #ff00ff;
    --neon-green: #0fff50;
}

* { margin:0; padding:0; box-sizing:border-box; cursor:none; }
@media (hover:none) and (pointer:coarse) {
    * { cursor:auto; }
    #cursor-dot, #cursor-outline { display:none; }
}

body {
    background-color: var(--bg-dark);
    color: #fff;
    font-family: 'Outfit', sans-serif;
    overflow: hidden;
    height: 100vh;
    -webkit-tap-highlight-color: transparent;
    -webkit-font-smoothing: antialiased;
}

body.shaking { animation: body-shake 0.08s infinite; }
@keyframes body-shake {
    0%   { transform: translate(8px,8px) rotate(1.5deg); }
    50%  { transform: translate(-8px,-8px) rotate(-1.5deg); }
    100% { transform: translate(8px,-8px) rotate(0deg); }
}

/* ── CURSOR ── */
#cursor-dot, #cursor-outline {
    position: fixed; top:0; left:0;
    transform: translate(-50%,-50%);
    border-radius: 50%; pointer-events: none; z-index: 99999;
    transition: transform 0.1s ease;
}
#cursor-dot   { width:8px; height:8px; background:var(--neon-cyan); box-shadow:0 0 6px var(--neon-cyan); }
#cursor-outline {
    width:40px; height:40px; border:2px solid var(--neon-magenta);
    transition: width .2s, height .2s, border-color .2s;
}
body.cursor-hover #cursor-outline { width:60px; height:60px; border-color:var(--neon-cyan); background:rgba(0,243,255,.08); }

/* ── MATRIX CANVAS ── */
#matrix-canvas {
    position: fixed; top:0; left:0; width:100%; height:100%;
    z-index: 5; opacity:0; pointer-events:none;
    transition: opacity .4s;
}

/* ── SCREENS ── */
.screen {
    position: absolute; top:0; left:0; width:100%; height:100%;
    display:flex; flex-direction:column;
    opacity:0; pointer-events:none;
    transition: opacity .6s ease;
    z-index: 10;
}
.screen.active { opacity:1; pointer-events:auto; }

/* ─────────── STAGE 0 : START ─────────── */
#start-screen {
    background: #000;
    justify-content: center; align-items: center;
    z-index: 100;
}
.scanlines {
    position: absolute; top:0; left:0; width:100%; height:100%;
    background: repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(0,0,0,.3) 2px, rgba(0,0,0,.3) 4px);
    pointer-events: none; z-index:1;
}
.start-container { position:relative; z-index:2; text-align:center; padding:2rem; }
.start-logo { font-size:4rem; margin-bottom:1rem; animation: float 3s ease-in-out infinite; }
@keyframes float { 0%,100%{transform:translateY(0);} 50%{transform:translateY(-15px);} }
.sys-warning {
    color:#ff4757; font-family:'Fira Code',monospace;
    font-size: clamp(1.5rem,4vw,2.5rem); margin-bottom:.8rem;
    animation: blink 1s infinite;
}
.sys-sub { color:#666; font-family:'Fira Code',monospace; font-size:.9rem; margin-bottom:2.5rem; }
.sys-disclaimer { color:#333; font-size:.8rem; margin-top:1.2rem; font-family:'Fira Code',monospace; }
.pulse-btn { animation: pulse-glow 2s infinite; }
@keyframes pulse-glow {
    0%,100% { box-shadow:0 0 15px rgba(0,243,255,.2),inset 0 0 15px rgba(0,243,255,.2); }
    50%      { box-shadow:0 0 40px rgba(0,243,255,.6),inset 0 0 25px rgba(0,243,255,.4); }
}

/* ─────────── STAGE 1 : BSOD ─────────── */
.bsod-bg {
    background:#0078D7;
    font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;
    padding:5vw 10vw; justify-content:center; z-index:50;
}
.bsod-title { font-size:clamp(5rem,15vw,10rem); margin-bottom:2rem; font-weight:400; }
.bsod-content p { font-size:clamp(1rem,2.5vw,1.5rem); margin-bottom:1rem; line-height:1.5; }
.bsod-bar-container {
    width:100%; max-width:500px; height:8px;
    background:rgba(255,255,255,.2); border-radius:4px; margin:2rem 0 1rem; overflow:hidden;
}
.bsod-bar { height:100%; width:0%; background:#fff; border-radius:4px; transition:width .3s ease; }
.bsod-percent { font-size:clamp(1.5rem,4vw,2.5rem) !important; margin-bottom:0 !important; }
.bsod-details { margin-top:3rem; font-size:clamp(.85rem,1.8vw,1.1rem); opacity:.8; }
.blinking-text { animation:blink 1s infinite; }
@keyframes blink { 0%,100%{opacity:1;} 50%{opacity:0;} }
.screen-glitch {
    animation:screen-tear .08s linear infinite;
    filter:contrast(400%) saturate(400%) hue-rotate(120deg) invert(1);
}
@keyframes screen-tear {
    0%   { transform:skewX(0); }
    20%  { transform:skewX(-35deg) translateX(25px); }
    40%  { transform:skewX(45deg) translateX(-25px); }
    60%  { transform:skewX(-12deg) translateY(12px); }
    80%  { transform:skewX(25deg) translateY(-12px); }
    100% { transform:skewX(0); }
}

/* ─────────── STAGE 2 : REVEAL ─────────── */
#reveal {
    background: radial-gradient(ellipse at center, #1a0b2e 0%, #050505 100%);
    justify-content:center; align-items:center; overflow:hidden;
}
#stars-canvas { position:absolute; top:0; left:0; width:100%; height:100%; z-index:0; }
.glitch-container { position:relative; z-index:2; text-align:center; padding:2rem; }
.reveal-badge {
    display:inline-block; border:1px solid var(--neon-green); color:var(--neon-green);
    font-family:'Fira Code',monospace; font-size:.85rem; padding:.4rem 1rem;
    border-radius:50px; margin-bottom:1.5rem; letter-spacing:2px;
    box-shadow:0 0 10px rgba(15,255,80,.3); animation:pulse-glow-green 2s infinite;
}
@keyframes pulse-glow-green {
    0%,100% { box-shadow:0 0 10px rgba(15,255,80,.3); }
    50%      { box-shadow:0 0 25px rgba(15,255,80,.7); }
}
.glitch-text {
    font-size:clamp(2.5rem,9vw,8rem); font-weight:900; text-transform:uppercase; text-align:center;
    background:linear-gradient(135deg,var(--neon-magenta) 0%,var(--neon-cyan) 100%);
    -webkit-background-clip:text; -webkit-text-fill-color:transparent;
    filter:drop-shadow(0 0 15px rgba(0,243,255,.5)); margin-bottom:1rem;
    animation: glitch-flicker 5s infinite;
}
@keyframes glitch-flicker {
    0%,95%,100% { filter:drop-shadow(0 0 15px rgba(0,243,255,.5)); transform:none; }
    96% { filter:drop-shadow(4px 0 red) drop-shadow(-4px 0 cyan); transform:skewX(-3deg); }
    97% { filter:drop-shadow(-4px 0 red) drop-shadow(4px 0 cyan); transform:skewX(3deg); }
    98% { filter:drop-shadow(0 0 15px rgba(0,243,255,.5)); transform:none; }
}
.reveal-sub { color:#a0aec0; font-size:clamp(1rem,2.5vw,1.4rem); margin-bottom:2rem; }
.reveal-stats { display:flex; gap:2rem; justify-content:center; margin-bottom:2.5rem; flex-wrap:wrap; }
.r-stat { text-align:center; }
.r-val {
    display:block; font-size:2.5rem; font-weight:900;
    background:linear-gradient(135deg,var(--neon-cyan),var(--neon-magenta));
    -webkit-background-clip:text; -webkit-text-fill-color:transparent;
}
.r-lbl { font-family:'Fira Code',monospace; font-size:.8rem; color:#666; }

/* ─────────── SHARED BUTTONS ─────────── */
.neon-button {
    display:block; margin:0 auto; padding:1rem 2.5rem;
    font-size:1.1rem; font-family:'Outfit',sans-serif; font-weight:700;
    color:#fff; background:transparent; border:2px solid var(--neon-cyan);
    border-radius:50px; cursor:none; text-transform:uppercase; letter-spacing:1px;
    box-shadow:0 0 15px rgba(0,243,255,.2),inset 0 0 15px rgba(0,243,255,.1);
    transition:all .3s ease;
}
.neon-button:hover {
    background:var(--neon-cyan); color:#000;
    box-shadow:0 0 40px var(--neon-cyan),inset 0 0 15px rgba(0,243,255,.5);
}

/* ─────────── STAGE 3 : DASHBOARD ─────────── */
#dashboard { padding:1.5rem 2rem; overflow-y:auto; overflow-x:hidden; -webkit-overflow-scrolling:touch; }
#dashboard::before {
    content:''; position:fixed; top:0; left:0; width:100%; height:100%;
    background:radial-gradient(ellipse at top-left,rgba(0,243,255,.04) 0%,transparent 60%),
               radial-gradient(ellipse at bottom-right,rgba(255,0,255,.04) 0%,transparent 60%);
    pointer-events:none; z-index:0;
}
#dashboard > * { position:relative; z-index:1; }

.dash-header {
    display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem;
    margin-bottom:2rem; border-bottom:1px solid var(--glass-border); padding-bottom:1rem;
}
.dash-logo { display:flex; align-items:baseline; gap:.5rem; }
.dash-tag { font-family:'Fira Code',monospace; color:#444; font-size:.9rem; }
.dash-logo h2 { font-family:'Fira Code',monospace; color:var(--neon-cyan); letter-spacing:2px; font-size:clamp(1.2rem,3.5vw,2rem); }
.dash-header-right { display:flex; align-items:center; gap:1.5rem; flex-wrap:wrap; }
.live-clock { font-family:'Fira Code',monospace; color:#666; font-size:1rem; }
.status-indicator { display:flex; align-items:center; gap:10px; font-family:'Fira Code',monospace; font-size:.95rem; }
.dot { width:12px; height:12px; background:#2ed573; border-radius:50%; box-shadow:0 0 10px #2ed573; animation:pulse-dot 2s infinite; }
@keyframes pulse-dot {
    0%   { transform:scale(.95); box-shadow:0 0 0 0 rgba(46,213,115,.7); }
    70%  { transform:scale(1);   box-shadow:0 0 0 10px rgba(46,213,115,0); }
    100% { transform:scale(.95); box-shadow:0 0 0 0 rgba(46,213,115,0); }
}

/* ── GRID ── */
.grid-container {
    display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
    gap:1.5rem; max-width:1400px; margin:0 auto; padding-bottom:3rem;
}
.glass-card {
    background:var(--glass-bg); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
    border:1px solid var(--glass-border); border-radius:20px; padding:1.8rem;
    transition:transform .3s ease, box-shadow .3s ease;
}
.hover-glow:hover { transform:translateY(-6px); box-shadow:0 15px 40px rgba(0,243,255,.12); border-color:rgba(0,243,255,.3); }
.glass-card h3 { margin-bottom:1.4rem; font-size:1.2rem; border-bottom:1px solid rgba(255,255,255,.08); padding-bottom:.6rem; }

/* Card entrance animation */
.card-anim { opacity:0; transform:translateY(30px); }
.card-anim.show { animation:card-slide-in .6s ease forwards; animation-delay:var(--delay,0s); }
@keyframes card-slide-in { to { opacity:1; transform:translateY(0); } }

/* ── STATS CARD ── */
.stat { margin-bottom:1.2rem; }
.stat span { display:block; margin-bottom:.4rem; font-family:'Fira Code',monospace; font-size:.8rem; color:#888; }
.progress-bar { width:100%; height:22px; background:rgba(0,0,0,.5); border-radius:11px; overflow:hidden; }
.progress {
    height:100%; display:flex; align-items:center; padding-left:10px;
    font-weight:700; color:#000; font-size:.8rem;
    transition:width 1.5s cubic-bezier(.4,0,.2,1);
}
.progress-animated { animation:slide-load 2s ease-in-out infinite alternate; }
@keyframes slide-load { 0%{width:95%!important;} 100%{width:100%!important;} }
.stat-footer { font-family:'Fira Code',monospace; font-size:.75rem; color:#333; margin-top:.5rem; }

/* ── RED BUTTON ── */
.danger-card { text-align:center; border-color:rgba(255,71,87,.3); display:flex; flex-direction:column; align-items:center; }
.danger-card h3 { color:#ff4757; width:100%; text-align:left; }
.danger-card > p { margin-bottom:1.5rem; color:#a0aec0; }
.red-btn-wrapper { position:relative; display:flex; justify-content:center; align-items:center; margin-bottom:1rem; }
.red-btn-ring {
    position:absolute; width:180px; height:180px; border-radius:50%;
    border:2px solid rgba(255,71,87,.5); animation:ring-pulse 2s infinite;
}
@keyframes ring-pulse {
    0%   { transform:scale(1);   opacity:1; }
    100% { transform:scale(1.4); opacity:0; }
}
.red-btn {
    position:relative; background:radial-gradient(circle at 40% 35%,#ff6b7a,#c0392b);
    color:#fff; border:none; font-size:1.1rem; font-weight:900;
    border-radius:50%; width:140px; height:140px; cursor:none; font-family:inherit;
    box-shadow:0 8px 25px rgba(255,71,87,.5),inset 0 -6px 12px rgba(0,0,0,.3),inset 0 4px 8px rgba(255,255,255,.2);
    transition:transform .1s, box-shadow .1s;
}
.red-btn:hover { transform:scale(1.07); box-shadow:0 12px 40px rgba(255,71,87,.8),inset 0 -6px 12px rgba(0,0,0,.3); }
.red-btn:active { transform:scale(.93); box-shadow:0 4px 10px rgba(255,71,87,.4); }
.red-counter { font-family:'Fira Code',monospace; font-size:.85rem; color:#555; }
.red-counter strong { color:#ff4757; }

/* ── MISSION ── */
.mission-card { border-color:rgba(46,213,115,.3); }
.mission-card h3 { color:#2ed573; }
.mission-countdown {
    background:rgba(46,213,115,.1); border:1px solid rgba(46,213,115,.3);
    border-radius:8px; padding:.6rem 1rem; font-family:'Fira Code',monospace;
    font-size:.85rem; color:#2ed573; margin-bottom:1rem;
}
.mission-text { font-size:1.05rem; line-height:1.7; margin-bottom:1.5rem; color:#ccc; }
.mission-actions { display:flex; gap:1rem; position:relative; min-height:55px; }
.action-btn {
    padding:14px 20px; border:none; border-radius:10px; font-weight:700;
    cursor:none; font-family:inherit; font-size:.95rem; z-index:5;
    transition:all .3s ease;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
    min-height: 48px;
}
.accept { background:#2ed573; color:#000; flex:1; box-shadow:0 0 15px rgba(46,213,115,.3); }
.accept:hover { background:#26b360; box-shadow:0 0 30px rgba(46,213,115,.6); transform:scale(1.03); }
.refuse {
    background:linear-gradient(135deg,#ff4757,#c0392b); color:#fff;
    position:absolute; right:0; width:130px;
    transition:transform .15s ease !important;
}

/* ── TERMINAL ── */
.terminal-card { background:rgba(0,15,0,.7); border-color:rgba(15,255,80,.4); padding:0; overflow:hidden; }
.terminal-header {
    background:rgba(0,0,0,.6); padding:.7rem 1rem; display:flex; align-items:center; gap:.5rem;
    border-bottom:1px solid rgba(15,255,80,.2);
}
.t-dot { width:12px; height:12px; border-radius:50%; display:inline-block; }
.t-title { font-family:'Fira Code',monospace; font-size:.8rem; color:#555; margin-left:.5rem; }
.fake-terminal {
    padding:1rem; height:220px; overflow:hidden;
    font-family:'Fira Code',monospace; color:var(--neon-green); font-size:.82rem; line-height:1.5;
    position:relative; background:transparent;
}
.term-content { position:absolute; bottom:2rem; left:1rem; right:1rem; }
.term-cursor { position:absolute; bottom:.8rem; left:1rem; animation:blink .8s step-end infinite; color:var(--neon-green); }

/* ── SCANNER ── */
.scanner-card { display:flex; flex-direction:column; align-items:center; border-color:rgba(255,0,255,.4); }
.scanner-card h3 { color:var(--neon-magenta); width:100%; text-align:left; }
.scanner-box {
    width:130px; height:130px; border:2px solid var(--neon-magenta); border-radius:16px;
    margin:1rem auto; position:relative; display:flex; justify-content:center; align-items:center;
    background:rgba(255,0,255,.05); overflow:hidden;
    box-shadow:0 0 20px rgba(255,0,255,.2), inset 0 0 20px rgba(255,0,255,.1);
}
.scan-corners::before,.scan-corners::after {
    content:''; position:absolute; width:20px; height:20px; border-color:var(--neon-cyan); border-style:solid; border-width:0;
}
.fingerprint { font-size:4rem; transition:filter .5s; }
.scan-line {
    position:absolute; top:0; left:0; width:100%; height:4px;
    background:linear-gradient(90deg,transparent,var(--neon-magenta),transparent);
    box-shadow:0 0 12px var(--neon-magenta);
    display:none; animation:scan-anim 1.5s linear infinite alternate;
}
@keyframes scan-anim { 0%{top:0;} 100%{top:calc(100% - 4px);} }
.scan-result-text { text-align:center; margin-bottom:1.2rem; font-family:'Fira Code',monospace; font-size:.85rem; min-height:2rem; color:#666; }

/* ── TROLLBOT ── */
.troll-card { border-color:rgba(255,165,0,.3); }
.troll-card h3 { color:#ffa502; }
.troll-quote {
    background:rgba(255,165,0,.05); border:1px solid rgba(255,165,0,.2);
    border-left:3px solid #ffa502; border-radius:8px; padding:1rem 1.2rem;
    font-size:1.05rem; line-height:1.6; color:#ddd; min-height:80px;
    font-style:italic; transition:opacity .3s;
}
.troll-counter { font-family:'Fira Code',monospace; font-size:.75rem; color:#333; margin-top:.8rem; text-align:right; }

/* ── LIVE BADGE ── */
.live-badge {
    display:inline-block; background:#ff4757; color:#fff;
    font-size:.6rem; font-family:'Fira Code',monospace; font-weight:700;
    padding:.1rem .4rem; border-radius:4px; letter-spacing:1px;
    vertical-align:middle; margin-left:.4rem;
    animation:blink 1.5s infinite;
}

/* ── TROLL ACTIONS ── */
.troll-actions { display:flex; gap:.8rem; margin-top:1.2rem; }
.troll-actions .action-btn { flex:1; }
.troll-share {
    background:rgba(255,165,0,.2); color:#ffa502;
    border:1px solid rgba(255,165,0,.4);
    transition:background .3s;
}
.troll-share:hover { background:rgba(255,165,0,.35); }

/* ── REFLEX GAME ── */
.reflex-card { border-color:rgba(0,243,255,.3); }
.reflex-card h3 { color:var(--neon-cyan); }
.reflex-sub { font-size:.9rem; color:#888; margin-bottom:1.2rem; line-height:1.5; }
.reflex-area {
    display:flex; justify-content:center; align-items:center;
    height:100px; margin:.5rem 0;
}
.reflex-btn {
    width:100%; max-width:280px; height:80px;
    border:none; border-radius:14px; font-family:'Outfit',sans-serif;
    font-size:1.1rem; font-weight:900; cursor:none; letter-spacing:1px;
    transition:background .1s, transform .1s, box-shadow .2s;
    touch-action: manipulation;
}
.reflex-wait {
    background:rgba(255,255,255,.08); color:#555; border:2px solid #333;
}
.reflex-ready {
    background:radial-gradient(circle at 40% 40%, #3dff6e, #1a9e3c);
    color:#000; border:none;
    box-shadow:0 0 30px rgba(46,213,115,.8), 0 0 60px rgba(46,213,115,.4);
    animation:ready-pulse .3s ease-in-out infinite alternate;
    font-size:1.3rem;
}
@keyframes ready-pulse {
    0%   { transform:scale(1);    box-shadow:0 0 25px rgba(46,213,115,.7); }
    100% { transform:scale(1.04); box-shadow:0 0 50px rgba(46,213,115,1); }
}
.reflex-result {
    color:#fff; border:none;
    font-size:1rem;
}
.reflex-result.good  { background:linear-gradient(135deg,#2ed573,#1a9e3c); box-shadow:0 0 20px rgba(46,213,115,.5); }
.reflex-result.ok    { background:linear-gradient(135deg,#ffa502,#e67e22); box-shadow:0 0 20px rgba(255,165,0,.5); }
.reflex-result.bad   { background:linear-gradient(135deg,#ff4757,#c0392b); box-shadow:0 0 20px rgba(255,71,87,.5); }
.reflex-result.cheat { background:linear-gradient(135deg,#a855f7,#7c3aed); box-shadow:0 0 20px rgba(168,85,247,.5); }
.reflex-scores {
    display:flex; justify-content:space-between; gap:.5rem;
    background:rgba(0,0,0,.3); border-radius:10px; padding:.8rem 1rem;
    margin:.5rem 0;
}
.reflex-score-item { text-align:center; flex:1; }
.rs-label { display:block; font-family:'Fira Code',monospace; font-size:.7rem; color:#555; margin-bottom:.3rem; }
.rs-val { font-family:'Fira Code',monospace; font-size:1rem; font-weight:700; color:var(--neon-cyan); }

/* ── CRAZY MODE ── */
#crazy-mode { position:fixed; top:0; left:0; width:100%; height:100%; pointer-events:none; z-index:9999; }
.crazy-active { animation:disco-bg .08s infinite; }
@keyframes disco-bg {
    0%   { background:rgba(255,0,0,.4); }
    33%  { background:rgba(0,255,0,.4); }
    66%  { background:rgba(0,0,255,.4); }
    100% { background:rgba(255,0,255,.4); }
}

/* ══════════════════════════════════════════
   RESPONSIVE — Mobile First
   xs  < 480px   (petits téléphones)
   sm  < 640px   (téléphones)
   md  < 900px   (tablettes / laptop 13")
   lg  < 1200px  (laptop 15")
══════════════════════════════════════════ */

/* ── xs : très petits écrans ── */
@media (max-width: 479px) {
    /* Start screen */
    .start-logo { font-size:3rem; }
    .sys-warning { font-size:1.3rem; }
    .sys-sub { font-size:.75rem; word-break:break-word; }
    .neon-button { font-size:.95rem; padding:.85rem 1.5rem; width:100%; max-width:320px; }

    /* BSOD */
    .bsod-bg { padding:6vw 6vw; }
    .bsod-title { font-size:5rem; margin-bottom:1rem; }
    .bsod-content p { font-size:.95rem; }
    .bsod-details { margin-top:1.5rem; font-size:.78rem; }
    .bsod-percent { font-size:1.3rem !important; }

    /* Reveal */
    .glitch-container { padding:1rem; }
    .glitch-text { font-size:clamp(2rem,11vw,3.5rem); margin-bottom:.8rem; }
    .reveal-sub { font-size:.9rem; margin-bottom:1.2rem; }
    .reveal-stats { gap:1rem; margin-bottom:1.5rem; }
    .r-val { font-size:1.8rem; }
    .r-lbl { font-size:.7rem; }
    .reveal-badge { font-size:.7rem; padding:.3rem .8rem; }

    /* Dashboard */
    #dashboard { padding:.75rem; }
    .dash-header { flex-direction:column; align-items:flex-start; gap:.5rem; margin-bottom:1rem; padding-bottom:.8rem; }
    .dash-tag { display:none; }
    .dash-logo h2 { font-size:1.2rem; }
    .dash-header-right { flex-direction:row; justify-content:space-between; width:100%; }
    .live-clock { font-size:.8rem; }
    .status-indicator { font-size:.75rem; }
    .dot { width:9px; height:9px; }

    /* Grid */
    .grid-container { grid-template-columns:1fr; gap:1rem; }
    .glass-card { padding:1rem; border-radius:14px; }
    .glass-card h3 { font-size:1rem; margin-bottom:1rem; }

    /* Stats */
    .stat span { font-size:.72rem; }
    .progress-bar { height:18px; }

    /* Red button */
    .red-btn { width:110px; height:110px; font-size:.95rem; }
    .red-btn-ring { width:150px; height:150px; }

    /* Mission */
    .mission-countdown { font-size:.75rem; padding:.5rem .8rem; }
    .mission-text { font-size:.9rem; line-height:1.6; }
    .mission-actions { flex-direction:column; gap:.7rem; min-height:auto; }
    .refuse { position:static; width:100%; }

    /* Terminal */
    .fake-terminal { height:160px; font-size:.75rem; }
    .t-title { font-size:.7rem; }

    /* Scanner */
    .scanner-box { width:110px; height:110px; }
    .fingerprint { font-size:3.2rem; }

    /* Trollbot */
    .troll-quote { font-size:.9rem; padding:.8rem 1rem; }
}

/* ── sm : téléphones standard ── */
@media (min-width: 480px) and (max-width: 639px) {
    .bsod-bg { padding:6vw 8vw; }
    .bsod-title { font-size:6rem; }
    .glitch-text { font-size:clamp(2.5rem,10vw,4.5rem); }
    #dashboard { padding:1rem 1.2rem; }
    .grid-container { grid-template-columns:1fr; gap:1.2rem; }
    .glass-card { padding:1.3rem; border-radius:16px; }
    .dash-header { flex-direction:column; align-items:flex-start; gap:.6rem; margin-bottom:1.2rem; }
    .dash-header-right { flex-direction:row; justify-content:space-between; width:100%; }
    .mission-actions { flex-direction:column; gap:.8rem; min-height:auto; }
    .refuse { position:static; width:100%; }
    .red-btn { width:120px; height:120px; }
    .red-btn-ring { width:160px; height:160px; }
}

/* ── md : tablettes & laptops 13" ── */
@media (min-width: 640px) and (max-width: 899px) {
    .grid-container { grid-template-columns: repeat(2, 1fr); gap:1.2rem; }
    #dashboard { padding:1.2rem 1.5rem; }
    .glass-card { padding:1.4rem; }
    .dash-header { flex-direction:row; flex-wrap:wrap; gap:.8rem; margin-bottom:1.4rem; }
    .mission-actions { flex-direction:column; gap:.8rem; min-height:auto; }
    .refuse { position:static; width:100%; }
    .bsod-bg { padding:5vw 8vw; }
    .glitch-text { font-size:clamp(2.8rem,8vw,5.5rem); }
    .reveal-stats { gap:1.5rem; }
    .r-val { font-size:2rem; }
    .fake-terminal { height:180px; }
}

/* ── lg : laptop 15" / petits desktops ── */
@media (min-width: 900px) and (max-width: 1199px) {
    .grid-container { grid-template-columns: repeat(2, 1fr); gap:1.4rem; }
    #dashboard { padding:1.5rem; }
    .mission-actions { min-height:55px; }
}

/* ── xl : grands écrans ── */
@media (min-width: 1200px) {
    .grid-container { grid-template-columns: repeat(3, 1fr); }
    .terminal-card { grid-column: span 2; }
}

/* ── touch : désactivation hover non pertinents sur mobile ── */
@media (hover: none) {
    .hover-glow:hover { transform:none; box-shadow:none; border-color:var(--glass-border); }
    .neon-button:hover { background:transparent; color:#fff; box-shadow:0 0 15px rgba(0,243,255,.2); }
    .accept:hover { background:#2ed573; box-shadow:0 0 15px rgba(46,213,115,.3); transform:none; }
    .red-btn:hover { transform:none; }
}

/* ── hauteur réduite (landscape mobile) ── */
@media (max-height: 500px) and (orientation: landscape) {
    .start-logo { font-size:2rem; margin-bottom:.5rem; }
    .sys-warning { font-size:1.2rem; margin-bottom:.4rem; }
    .sys-sub { display:none; }
    .start-container { padding:1rem; }
    .bsod-title { font-size:4rem; margin-bottom:.5rem; }
    .bsod-details { margin-top:1rem; }
    .glitch-container { padding:.5rem 1rem; }
    .glitch-text { font-size:clamp(1.8rem,8vw,3.5rem); }
    .reveal-stats { margin-bottom:1rem; }
    #dashboard { padding:.8rem 1rem; }
    .grid-container { gap:.8rem; }
    .glass-card { padding:.9rem 1.2rem; }
    .fake-terminal { height:130px; }
    .red-btn { width:100px; height:100px; }
    .red-btn-ring { width:140px; height:140px; }
}