*{margin:0;padding:0;box-sizing:border-box}
:root{
  --bg:#07090e; --s1:#0d1018; --s2:#141820; --s3:#1a2030;
  --b1:#1e2636; --b2:#28334a;
  --blue:#38bdf8; --bluebg:rgba(56,189,248,.1);
  --red:#f87171;  --redbg:rgba(248,113,113,.1);
  --green:#4ade80;--greenbg:rgba(74,222,128,.1);
  --yellow:#fbbf24;--yellowbg:rgba(251,191,36,.1);
  --teal:#2dd4bf; --purple:#c084fc; --orange:#fb923c;
  --white:#eef2ff; --mid:#7a8fa6; --dim:#2e3a4a;
  --font:'Outfit',sans-serif; --mono:'JetBrains Mono',monospace; --title:'Bebas Neue',sans-serif;
  --radius:8px;
}
html,body{height:100%;background:var(--bg);color:var(--white);font-family:var(--font);overscroll-behavior:none;}
body { overflow: hidden; }
.scr{display:none;width:100vw;height:100vh;flex-direction:column; position:fixed; inset:0; z-index:1;}
.scr.on{display:flex}
#s-intro{
  align-items:center;justify-content:flex-start;overflow-y:auto;padding:40px 24px 60px;gap:0;
  background:radial-gradient(ellipse 100% 50% at 50% 0%,rgba(56,189,248,.08) 0%,transparent 60%),var(--bg); z-index:9000;
}
.intro-top{display:flex;flex-direction:column;align-items:center;gap:12px;margin-bottom:32px;width:100%;max-width:860px}
.intro-logo{
  font-family:var(--title);font-size:100px;line-height:.9;letter-spacing:12px;
  background:linear-gradient(175deg,#fff 0%,var(--blue) 50%,rgba(56,189,248,.3) 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-align:center;
}
.intro-sub{font-family:var(--title);font-size:16px;letter-spacing:16px;color:var(--red)}
.intro-lore{
  max-width:560px;text-align:center;font-size:14px;line-height:1.7;color:var(--mid);
  padding:20px 28px;border-top:2px solid var(--b1);border-bottom:2px solid var(--b1);margin-top:8px;
}
.intro-lore strong{color:var(--white);font-weight:700}
.intro-nav{
  display:flex;gap:0;border:2px solid var(--b2);width:100%;max-width:860px;margin-top:28px;
  flex-shrink:0; border-radius: var(--radius); overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none;
}
.intro-nav::-webkit-scrollbar { display: none; }
.inav-tab{
  flex:1;padding:12px 10px;font-family:var(--mono);font-size:11px;letter-spacing:2px;text-transform:uppercase;
  cursor:pointer;color:var(--mid);background:var(--s1);border:none;border-bottom:3px solid transparent;
  transition:.15s;text-align:center; display:flex; align-items:center; justify-content:center; gap:8px; white-space:nowrap;
}
.inav-tab:hover{color:var(--white);background:var(--s2)}
.inav-tab.on{color:var(--blue);background:var(--bluebg);border-bottom-color:var(--blue)}
.intro-panel{display:none;width:100%;max-width:860px;margin-top:16px}
.intro-panel.on{display:block}
.setup-card{background:var(--s1);border:2px solid var(--b2);padding:28px;display:flex;flex-direction:column;gap:24px; border-radius: var(--radius);}
.field-label{font-family:var(--mono);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--mid);margin-bottom:10px}
.pnum-row{display:flex;gap:10px;flex-wrap:wrap}
.pnum{
  width:46px;height:46px;font-family:var(--title);font-size:22px;
  border:2px solid var(--b2);background:var(--s2);color:var(--mid);
  cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.2s;border-radius:4px;
}
.pnum:hover{border-color:var(--blue);color:var(--blue)}
.pnum.on{border-color:var(--blue);background:var(--bluebg);color:var(--blue)}
.rules-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(340px, 1fr));gap:16px;}
.rule-card{padding:20px;border:2px solid var(--b1);background:var(--s1);border-radius:var(--radius)}
.rule-icon{font-size:28px;margin-bottom:8px;color:var(--blue)}
.rule-title{font-family:var(--title);font-size:18px;letter-spacing:1px;margin-bottom:8px; color:var(--white);}
.rule-body{font-size:13px;color:var(--mid);line-height:1.6}
.rule-body strong{color:var(--white)}
.gloss-cards{display:flex;flex-direction:column;gap:12px;}
.gloss-card{display:flex;gap:16px;padding:18px;border:2px solid var(--b1);background:var(--s1);border-radius:var(--radius);align-items:flex-start}
.gloss-icon-wrap{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:24px;flex-shrink:0}
.gloss-title{font-family:var(--title);font-size:18px;letter-spacing:1px;margin-bottom:6px}
.gloss-body{font-size:13px;color:var(--mid);line-height:1.6}
#s-opex { justify-content: space-between; background: var(--bg); }
.opex-cards{flex:1; overflow-y:auto; -webkit-overflow-scrolling:touch; display:flex; flex-wrap:wrap; gap:16px; justify-content:center; padding:40px 20px; max-width:1000px; margin:0 auto; width:100%; align-content:flex-start;}
.crew-box{background:var(--s2);border-top:2px solid var(--b2);padding:20px; display:flex; flex-direction:column; z-index:100; flex-shrink:0; max-height:55vh; min-height:0;}
.crew-box-hdr{font-family:var(--mono);font-size:12px;letter-spacing:2px;color:var(--mid);margin-bottom:12px;text-transform:uppercase;text-align:center;}
#crewPicksMulti{flex:1; overflow-y:auto; -webkit-overflow-scrolling:touch; min-height:0; margin-bottom:20px; padding-bottom:10px;}
.crew-picks{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:16px;}
.crew-picks .lt-card{width:150px; padding:10px; flex-shrink:0;}
.crew-footer{display:flex;justify-content:space-between;align-items:center;gap:16px; flex-wrap:wrap; margin-top:auto; flex-shrink:0;}
.crew-footer-right{display:flex; gap:12px; flex-wrap:wrap; align-items:center;}
#s-game { overflow: hidden; position: fixed; }
.topbar{
  position: absolute; top: 0; left: 0; right: 0; z-index: 100;
  display:flex;align-items:stretch;background:rgba(7,9,14,0.55); backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(30,38,54,0.6);height:54px; flex-wrap:nowrap;
}
.tb-logo{
  font-family:var(--title);font-size:22px;letter-spacing:4px;color:var(--blue);
  padding:0 16px;border-right:2px solid var(--b1);display:flex;align-items:center;flex-shrink:0; cursor:pointer; transition:0.2s;
}
.tb-logo:hover{ background:var(--redbg); color:var(--red); }
.tb-meters{display:flex;align-items:stretch;border-right:2px solid var(--b1);flex-shrink:0}
.gauge{
  display:flex;flex-direction:column;justify-content:center;gap:4px;
  padding:0 16px;border-right:1px solid var(--b1);min-width:140px;position:relative;
}
.gauge:last-child{border-right:none}
.gauge-label{display:flex;align-items:center;gap:8px;justify-content:space-between}
.gauge-name{font-family:var(--mono);font-size:10px;letter-spacing:2px;text-transform:uppercase}
.gauge-num{font-family:var(--title);font-size:18px;letter-spacing:1px}
.gauge-track{height:5px;background:var(--s3);border-radius:3px;overflow:hidden}
.gauge-fill{height:100%;border-radius:3px;transition:width .6s ease}
.tb-spacer { flex: 1; }
.tb-actions { display:flex; align-items:center; gap:12px; padding:0 24px; border-left:2px solid var(--b1); background:rgba(56,189,248,.15); flex-shrink:0;}
.tb-actions .act-val { font-family:var(--title); font-size:38px; color:var(--blue); line-height:1; text-shadow: 0 0 10px rgba(56,189,248,0.5); }
.tb-actions .act-lbl { font-family:var(--mono); font-size:9px; letter-spacing:1px; color:var(--white); text-transform:uppercase; line-height:1.2; text-align:center;}
.tb-phase{display:flex;align-items:center;gap:12px;padding:0 16px;border-left:2px solid var(--b1);flex-shrink:0}
.phase-badge{font-family:var(--title);font-size:16px;letter-spacing:1px;padding:4px 12px;border:2px solid; border-radius: 4px;}
.phase-badge.base{border-color:var(--green);color:var(--green)}
.phase-badge.opex{border-color:var(--red);color:var(--red);animation:pulseBorder 1.5s infinite}
@keyframes pulseBorder{0%,100%{opacity:1}50%{opacity:.5}}
.tb-round{font-family:var(--mono);font-size:12px;color:var(--mid); display:flex; align-items:center;}
.tb-round strong{color:var(--white);font-size:14px; margin-left:6px;}
.tb-btns{display:flex;align-items:center;gap:8px;padding:0 16px; flex-shrink:0;}
.timer-wrap{
  position:absolute; top:54px; left:0; right:0; height:6px; background:var(--s3); z-index:90; display:none;
}
.timer-fill{
  height:100%; width:100%; background:var(--green); transition: width 0.1s linear, background 0.5s ease;
}
.map-body{
  position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1;
  background:var(--bg); overflow:hidden;
}
.base-view{
  position:absolute;inset:0;padding:80px 20px 100px;display:flex;flex-direction:column;gap:30px;overflow-y:auto; z-index:50;
  background:var(--bg); -webkit-overflow-scrolling:touch;
}
.bv-section-title{
  font-family:var(--mono);font-size:10px;letter-spacing:3px;text-transform:uppercase;color:var(--mid);
  margin-bottom:12px;display:flex;align-items:center;gap:12px;
}
.bv-section-title::after{content:'';flex:1;height:1px;background:var(--b1)}
.bld-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(200px, 1fr));gap:12px}
.bld{
  padding:16px 14px;border:1px solid var(--b2);background:var(--s2);
  cursor:pointer;transition:.2s;text-align:center;position:relative;border-radius:var(--radius);
}
.bld.active:hover{border-color:var(--blue);transform:translateY(-3px);background:var(--bluebg)}
.bld.locked{opacity:.35;cursor:not-allowed}
.bld.locked:hover{transform:none;border-color:var(--b1);background:var(--s2)}
.bld-em{font-size:32px;margin-bottom:10px;line-height:1; color:var(--mid)}
.bld-name{font-family:var(--title);font-size:16px;letter-spacing:1px;margin-bottom:4px}
.bld-desc{font-size:12px;color:var(--mid);line-height:1.4}
.bld-active-badge{position:absolute;top:8px;right:8px;font-family:var(--mono);font-size:9px;padding:2px 6px;background:var(--bluebg);color:var(--blue);border:1px solid rgba(56,189,248,.4); border-radius:3px}
.rec-hdr{padding:10px;background:var(--s2);border:1px solid var(--b1);font-size:12px;line-height:1.6;color:var(--mid);border-radius:var(--radius)}
.rec-hdr strong{color:var(--white)}
.rec-crd{display:flex;align-items:center;gap:10px;padding:10px;border:1px solid var(--b2);background:var(--s2);cursor:pointer;transition:.2s;border-radius:var(--radius)}
.training-crd{}
.training-crd:hover{border-color:var(--agent-color, var(--green));background:var(--agent-color-bg, rgba(34,197,94,.08));}
.training-crd.sel{border-color:var(--agent-color, var(--green)) !important;background:var(--agent-color-bg, rgba(34,197,94,.15)) !important;box-shadow:0 0 0 2px var(--agent-color-shadow, rgba(34,197,94,.4));}
#trainingLaunchBtn{display:none;margin-top:12px;width:100%;}
#trainingLaunchBtn.visible{display:block;}
.rec-crd:hover:not(.owned):not(.transit){border-color:var(--green);background:var(--greenbg); transform:translateY(-2px);}
.rec-crd.owned{opacity:.45;cursor:not-allowed}
.rec-crd.transit{opacity:.7; border-color:var(--orange); background:rgba(251,146,60,0.1); cursor:not-allowed;}
.rec-em{font-size:24px;flex-shrink:0;line-height:1; color:var(--mid)}
.rec-name{font-family:var(--title);font-size:16px;letter-spacing:1px}
.rec-sub{font-size:11px;color:var(--mid);font-family:var(--mono)}
.rec-cost{margin-left:auto;font-family:var(--mono);font-size:11px;color:var(--yellow);white-space:nowrap;font-weight:700}
.rec-own{margin-left:auto;font-family:var(--mono);font-size:10px;color:var(--green)}
.rec-transit-lbl{margin-left:auto;font-family:var(--mono);font-size:10px;color:var(--orange)}
.side-left{
  position:absolute; top:70px; left:10px; bottom:90px; width:280px; z-index:80;
  background:rgba(7,9,14,0.55); backdrop-filter:blur(14px); border:1px solid rgba(40,51,74,0.5); border-radius:var(--radius);
  display:flex;flex-direction:column;overflow:hidden;transition:transform .3s cubic-bezier(0.2, 0.8, 0.2, 1), opacity .3s ease;
  box-shadow: 0 4px 20px rgba(0,0,0,0.3); pointer-events:auto;
}
.side-left.coll{transform:translateX(-120%); opacity:0; pointer-events:none;}
.side-right{
  position:absolute; top:70px; right:10px; bottom:80px; width:320px; z-index:80;
  background:rgba(7,9,14,0.55); backdrop-filter:blur(14px); border:1px solid rgba(40,51,74,0.5); border-radius:var(--radius);
  display:flex;flex-direction:column;overflow:hidden;transition:transform .3s cubic-bezier(0.2, 0.8, 0.2, 1), opacity .3s ease;
  box-shadow: 0 4px 20px rgba(0,0,0,0.3); pointer-events:auto;
}
.side-right.coll{transform:translateX(120%); opacity:0; pointer-events:none;}
#s-game.max-map .side-left { transform: translateX(-120%); opacity: 0; pointer-events: none; }
#s-game.max-map .side-right { transform: translateX(120%); opacity: 0; pointer-events: none; }
.hud-toggles { 
  position:fixed; bottom:16px; left:50%; transform:translateX(-50%); z-index:100; 
  display:flex; gap:16px; background:rgba(13,16,24,0.85); padding:10px 20px; 
  border-radius:40px; border:1px solid var(--b2); backdrop-filter:blur(10px);
  box-shadow: 0 10px 30px rgba(0,0,0,0.8);
}
.htog { 
  width:48px; height:48px; border-radius:50%; background:var(--s2); border:2px solid var(--b2); color:var(--mid);
  display:flex; align-items:center; justify-content:center; font-size:22px; cursor:pointer; transition:0.2s;
}
.htog:hover, .htog.on { color:var(--blue); border-color:var(--blue); background:var(--s3); }
.side-hdr{
  padding:6px 10px;background:rgba(10,13,20,0.5);flex-shrink:0; border-bottom:1px solid rgba(255,255,255,0.05);
}
.side-hdr-label{font-family:var(--mono);font-size:10px;letter-spacing:2px;color:var(--mid);text-transform:uppercase;}
.side-hdr-team{font-family:var(--title);font-size:15px;letter-spacing:1px;color:var(--blue);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px;}
.side-res-wrap { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:4px 12px; padding:2px 0; background:none; width:100%; }
.side-res-item { display:flex; align-items:center; gap:4px; font-family:var(--title); font-size:15px; line-height:1; }
.side-res-item svg { font-size:16px; }
.rtabs{display:flex; height:38px; border-bottom:1px solid rgba(30,38,54,0.5); flex-shrink:0; background:rgba(10,13,20,0.4);}
.rtab{
  flex:1;font-family:var(--mono);font-size:11px;letter-spacing:1px;
  display:flex; align-items:center; justify-content:center; gap:6px;
  cursor:pointer;color:var(--mid);background:none;border:none;
  border-bottom:3px solid transparent;text-transform:uppercase;transition:.15s;
}
.rtab:hover{color:var(--white); background:rgba(255,255,255,.05)}
.rtab.on{color:var(--blue);border-bottom-color:var(--blue); background:var(--bluebg)}
.rtab-pane{flex:1;overflow-y:auto;display:none;flex-direction:column;-webkit-overflow-scrolling:touch;}
.rtab-pane.on{display:flex;}
.ltab-pane { flex: 1; display: flex; flex-direction: column; min-height: 0; overflow: hidden; }
.ltab-pane > .lt-scroll { flex: 1; overflow-y: auto; -webkit-overflow-scrolling: touch; }
.lt-scroll, .rt-scroll{overflow-y:auto; -webkit-overflow-scrolling:touch; flex:1; pointer-events: auto;}
.lt-card{
  padding:14px;border-bottom:1px solid rgba(255,255,255,.05);cursor:pointer;transition:.15s;
  position:relative; border-left:4px solid transparent;
}
.lt-card:hover{background:rgba(255,255,255,.05)}
.lt-header-row { display:flex; align-items:center; gap:12px; margin-bottom:8px; }
.lt-info-col { display:flex; flex-direction:column; justify-content:center; gap:3px; min-width:0; }
.lt-level-line { font-size:10px; color:var(--mid); font-family:var(--mono); }
.lt-effectif-line { font-size:10px; color:var(--mid); font-family:var(--mono); }
.lt-rep-badge {
  background: var(--s3); border: 2px solid var(--yellow); border-radius: 6px;
  padding: 6px 10px; text-align: center; display: flex; flex-direction: column;
  color: var(--yellow); min-width: 54px;
}
.lt-rep-badge .rep-main  { font-family:var(--title); font-size:22px; line-height:1; display:flex; align-items:baseline; justify-content:center; gap:4px; white-space:nowrap; }
.rep-unit  { font-family:var(--title); font-size:22px; }
.lt-rep-badge .rep-label { font-family:var(--mono); font-size:9px; letter-spacing:1px; margin-top:4px; opacity:.65; }
.lt-name{font-family:var(--title);font-size:16px;letter-spacing:1px; line-height:1.2;}
.lt-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:8px}
.lt-stat{font-size:11px;color:var(--mid);display:flex;align-items:center;gap:4px}
.lt-stat b{color:var(--white);font-weight:700;font-family:var(--mono)}
.log-scroll{flex:1; overflow-y:auto; padding:8px 14px; -webkit-overflow-scrolling:touch;}
.log-row{font-family:var(--mono);font-size:11px;padding:4px 0;line-height:1.5;border-bottom:1px solid rgba(255,255,255,.02)}
.log-row strong { color: var(--yellow); font-weight: 800; }
.log-row .ts{color:var(--dim);margin-right:6px}
.log-row.good{color:var(--green)}.log-row.bad{color:var(--red)}.log-row.warn{color:var(--yellow)}.log-row.sys{color:var(--blue)}.log-row.def{color:var(--mid)}
.mcard{border:1px solid var(--b2);background:rgba(20,24,32,0.7);margin-bottom:12px;border-radius:var(--radius);overflow:hidden; cursor:pointer; transition:0.2s;}
.mcard:hover{border-color:var(--blue);}
.mcard.sel { border-color:var(--blue); box-shadow:0 0 15px rgba(56,189,248,.2); }
.mcard.crew{border-left:4px solid var(--yellow)}
.mcard.disabled{opacity: 0.5; filter: grayscale(80%); cursor:not-allowed;}
.mcard-name{font-family:var(--title);font-size:16px;letter-spacing:1px}
.mcard-sub{font-size:11px;font-family:var(--mono); color:var(--mid);}
.mcard-hpnum{font-family:var(--title);font-size:18px;line-height:1}
.mcard-hptrack{height:4px;background:var(--s3);border-radius:2px;overflow:hidden;margin-top:4px}
.mcard-hpfill{height:100%;border-radius:2px;transition:width .3s}
.mcard-skills{padding:10px;display:flex;flex-direction:column;gap:6px; display:none;}
.mcard.sel .mcard-skills { display:flex; }
.mskill{display:flex;gap:8px;align-items:flex-start;padding:8px;background:rgba(0,0,0,0.3);border:1px solid var(--b1);border-radius:6px; transition:0.15s;}
.mskill.clickable { cursor:pointer; }
.mskill.clickable:hover { background:rgba(255,255,255,.05); border-color:var(--blue); transform:translateX(3px); }
.msk-badge{font-family:var(--mono);font-size:9px;letter-spacing:1px;padding:2px 4px;flex-shrink:0;text-transform:uppercase;margin-top:1px; border-radius:3px}
.msk-badge.pas{background:rgba(122,143,166,.15);color:var(--mid);border:1px solid var(--b1)}
.msk-badge.act{background:rgba(56,189,248,.15);color:var(--blue);border:1px solid rgba(56,189,248,.4)}
.msk-badge.spe{background:rgba(251,191,36,.15);color:var(--yellow);border:1px solid rgba(251,191,36,.4)}
.msk-badge.bre{background:rgba(239,68,68,.15);color:var(--red);border:1px solid rgba(239,68,68,.4)}
.msk-badge.sac{background:rgba(255,255,255,.1);color:var(--white);border:1px solid var(--b2)}
.msk-body{flex:1;font-size:11px;line-height:1.4}
.msk-name{font-weight:700;font-size:12px;margin-bottom:2px;color:var(--white)}
.msk-desc{color:var(--mid)}
.msk-cost{color:var(--orange);font-family:var(--mono);font-size:10px;margin-top:4px;font-weight:600}
.dh-act-header {
  display:flex; align-items:center; justify-content:center; gap:12px;
  background:var(--s2); border:1px solid var(--red); border-radius:var(--radius);
  padding:10px; margin:14px;
}
.dh-act-header .act-val { font-family:var(--title); font-size:32px; color:var(--red); line-height:1; }
.dh-act-header .act-lbl { font-family:var(--mono); font-size:11px; letter-spacing:2px; color:var(--white); text-transform:uppercase; }
.dh-intro{padding:10px;background:var(--redbg);border:1px solid rgba(248,113,113,.3);margin:14px;border-radius:var(--radius);font-size:12px;line-height:1.6;color:var(--mid)}
.dh-crd{
  display:flex;gap:10px;padding:12px;border:1px solid rgba(248,113,113,.2);background:rgba(248,113,113,.04);
  margin:0 14px 8px;border-radius:var(--radius); transition:0.2s;
}
.dh-crd.gm-playable:hover { background: rgba(248,113,113, .15); transform:translateX(-3px); }
.dh-em{font-size:24px;flex-shrink:0;line-height:1; color:var(--red)}
.dh-cname{font-family:var(--title);font-size:16px;letter-spacing:1px;color:var(--red);margin-bottom:2px}
.dh-cdesc{font-size:11px;color:var(--mid);line-height:1.4}
.journal-obj{
  display:flex; background:rgba(10,13,20,0.5); border-bottom:1px solid var(--b2);
  flex-direction:column; padding:12px; flex-shrink:0;
}
.journal-obj.on{display:flex;}
.obj-main-row{display:flex;align-items:center;gap:12px;padding-bottom:10px; border-bottom:1px solid rgba(255,255,255,.05);}
.obj-main-em{font-size:28px;line-height:1;flex-shrink:0; color:var(--yellow);}
.obj-main-info{flex:1}
.obj-label{font-family:var(--mono);font-size:9px;letter-spacing:2px;color:var(--yellow);text-transform:uppercase;}
.obj-name{font-family:var(--title);font-size:16px;letter-spacing:1px;color:var(--white)}
.obj-status{font-size:11px;color:var(--mid);margin-top:2px;line-height:1.4}
.obj-secondary-row{display:flex;gap:6px;padding-top:10px;flex-wrap:wrap;align-items:center;}
.sec-obj{display:flex;align-items:center;gap:4px;padding:6px 10px;background:rgba(255,255,255,.05);border:1px solid var(--b1);border-radius:4px;font-size:11px;}
.sec-obj.done{opacity:.5;border-color:var(--green);}
.sec-obj.done svg { color:var(--green); }
.sec-obj.failed{opacity:.5; border-color:var(--red); text-decoration:line-through;}
.sec-obj.failed svg { color:var(--red); }
.sec-reward{font-family:var(--mono);font-size:10px;color:var(--green);margin-left:6px;font-weight:700}
#hexwrap{position:absolute;inset:0;overflow:hidden;display:none; cursor:grab; z-index:1;}
#hexwrap:active{cursor:grabbing;}
svg#hexsvg{display:block;width:100%;height:100%; user-select:none; touch-action:none;}
.h-fl{fill:#0f1e32;stroke:#1e3654;stroke-width:2}
.h-wa{fill:#07101e;stroke:#0e1a2e;stroke-width:1.5}
.h-dr{fill:#0c2610;stroke:#207a28;stroke-width:2.5}
.h-dr-red{fill:#260c0c;stroke:#ef4444;stroke-width:2.5}
.h-cv{fill:#261a08;stroke:#6a3c10;stroke-width:2}
.h-en{fill:#0a2418;stroke:#22c55e;stroke-width:3}
.h-ex{fill:#260c0c;stroke:#ef4444;stroke-width:3}
.h-tm{fill:#0a1c30;stroke:#3b82f6;stroke-width:2.5}
.h-cm{fill:#1e0a10;stroke:#e11d48;stroke-width:2}
.h-rc{fill:#0d2c1c;stroke:#22c55e;stroke-width:3;stroke-dasharray:5 2}
.h-sl{fill:#0a2238;stroke:#38bdf8;stroke-width:4;filter:drop-shadow(0 0 16px rgba(56,189,248,.8))}
.h-ob{fill:#2a1e04;stroke:#fbbf24;stroke-width:5;stroke-dasharray:6 3;animation:obAnim 1.2s ease-in-out infinite}
.h-of{fill:#201a00;stroke:#fbbf24;stroke-width:4;filter:drop-shadow(0 0 16px rgba(251,191,36,.8))}
.h-vis-cam { fill: rgba(251,191,36,0.25); stroke: rgba(251,191,36,0.5); stroke-width: 2; pointer-events:none; }
.h-vis-gd  { fill: rgba(248,113,113,0.25); stroke: rgba(248,113,113,0.5); stroke-width: 2; pointer-events:none; }
.h-fow     { fill: rgba(0,0,0,0.72); stroke: rgba(0,0,0,0.0); stroke-width: 0; pointer-events:none; }
@keyframes obAnim{0%,100%{stroke-opacity:.4;fill:#1a1200; stroke-width:3;}50%{stroke-opacity:1;fill:#3a2800; stroke-width:6;}}
.glow-cam { animation: pulseRed 2s infinite; }
@keyframes pulseRed { 0%, 100% { stroke: rgba(239, 68, 68, 1); } 50% { stroke: rgba(239, 68, 68, 0.4); } }
.glow-term { animation: pulseBlue 2s infinite; }
@keyframes pulseBlue { 0%, 100% { fill: rgba(59, 130, 246, 0.2); } 50% { fill: rgba(59, 130, 246, 0.5); } }
[data-zone=z-bank]  .h-fl{fill:#221a06;stroke:#3a2a0a}  [data-zone=z-bank]  .h-wa{fill:#100c04;stroke:#201404}
[data-zone=z-data]  .h-fl{fill:#081828;stroke:#102840}  [data-zone=z-data]  .h-wa{fill:#040e18;stroke:#081828}
[data-zone=z-uni]   .h-fl{fill:#0a1c0a;stroke:#123a12}  [data-zone=z-uni]   .h-wa{fill:#060e06;stroke:#0a1c0a}
[data-zone=z-prison].h-fl{fill:#1c0c0c;stroke:#2e1414}  [data-zone=z-prison].h-wa{fill:#0e0606;stroke:#1c0c0c}
.hc{cursor:pointer}.hc:hover polygon{filter:brightness(1.6)}
@media (max-width: 1024px) {
  .topbar { flex-wrap:wrap; height:auto; min-height:54px; padding:4px 0; }
  .tb-meters { border-right:none; }
  .tb-spacer { display:none; }
  .tb-actions { padding:4px 12px; }
  .tb-btns { width:100%; justify-content:center; padding:8px 12px; border-top:1px solid var(--b1); }
  .timer-wrap { top:0; height:4px; z-index:1000; }
  .base-view { padding-top:170px; padding-left:12px; padding-right:12px; padding-bottom:calc(50vh + 40px); }

  /* ── PANELS: bottom:0, height:50vh, HUD (z-index:100) passe par-dessus ── */
  .side-left, .side-right {
    position:fixed; bottom:0; left:0; right:0; width:100%;
    height:50vh; max-height:50vh; top:auto;
    border-radius:20px 20px 0 0; border:none; border-top:2px solid var(--b2);
    transform:translateY(100%); box-shadow:0 -10px 40px rgba(0,0,0,.9);
    z-index:85; display:flex; flex-direction:column; overflow:hidden;
  }
  .side-left:not(.coll), .side-right:not(.coll) { transform:translateY(0); }

  /* ── HUD au-dessus de tout ── */
  .hud-toggles { bottom:16px; background:rgba(0,0,0,.9); z-index:100; }

  /* ── CREW + JOURNAL/DH: scroll avec padding-bottom pour voir le dernier élément ── */
  .lt-scroll  { flex:1; overflow-y:auto; -webkit-overflow-scrolling:touch; padding-bottom:90px !important; }
  .log-scroll { overflow-y:auto; -webkit-overflow-scrolling:touch; padding-bottom:90px !important; }
  .dh-scroll  { overflow-y:auto; -webkit-overflow-scrolling:touch; padding-bottom:90px !important; }
  .rp-scroll  { overflow-y:auto; -webkit-overflow-scrolling:touch; padding-bottom:90px !important; }

  /* ── IO ÉTAT LOADER (Lancer la reconstruction) ── */
  /* sm-st-loader scrolle → bouton toujours visible */
  .sm-st-loader {
    flex:1 !important; min-height:0 !important;
    display:flex !important; flex-direction:column !important;
    align-items:center; justify-content:flex-start;
    overflow-y:auto !important; -webkit-overflow-scrolling:touch;
    padding-bottom:90px !important;
  }

  /* ── IO ÉTAT LOCKED (galerie fragments + ressusciter) ── */
  .sm-st-locked {
    flex:1 !important; min-height:0 !important;
    overflow-y:auto !important; -webkit-overflow-scrolling:touch;
    padding-bottom:90px !important;
  }

  /* ── IO ÉTAT CHAT ── */
  /* sm-st-chat: flex column, overflow:hidden pour que flex:1 fonctionne */
  .sm-st-chat {
    flex:1 !important; min-height:0 !important;
    display:flex !important; flex-direction:column !important;
    overflow:hidden !important;
  }
  /* Le log prend l'espace libre et scrolle */
  .sm-chat-log {
    flex:1 !important; min-height:0 !important;
    overflow-y:auto !important; -webkit-overflow-scrolling:touch;
    padding-bottom:8px !important;
  }
  /* Bouton resurrect: flex-shrink:0, reste au-dessus de l'input */
  .sm-btn-resurrect { flex-shrink:0 !important; width:100%; margin-bottom:0 !important; }
  /* Input chat: flex-shrink:0, margin-bottom pour passer au-dessus du HUD */
  .sm-inp-area { flex-shrink:0 !important; margin-bottom:90px; }

  /* ── FULLSCREEN ── */
  .sm-fullscreen { bottom:0 !important; top:0 !important; height:100% !important; max-height:100% !important; z-index:95 !important; }
  .sm-fullscreen .sm-inp-area { margin-bottom:90px; }
  .sm-fullscreen .sm-chat-log { padding-bottom:8px !important; }

  /* ── OPEX page mobile : scroll naturel, boutons pas cachés par le HUD ── */
  #s-opex { flex-direction:column; overflow-y:auto; }
  .opex-cards { flex-shrink:0; padding:12px 12px 0; }
  .crew-box { flex-shrink:0; padding:12px 16px; padding-bottom:90px; max-height:none; }
  .crew-footer { flex-direction:column; align-items:stretch; gap:8px; }
  .crew-footer-right { flex-direction:column; gap:8px; }
  .crew-footer-right .btn { width:100%; justify-content:center; }
  #btnBackOpex { width:100%; justify-content:center; }
}
.btn{
  font-family:var(--mono);font-size:11px;letter-spacing:2px;text-transform:uppercase;
  padding:8px 16px;border:1px solid var(--b2);background:var(--s2);color:var(--mid);
  cursor:pointer;transition:.15s;border-radius:var(--radius); display:inline-flex; align-items:center; gap:6px;
}
.btn:hover{border-color:var(--blue);color:var(--blue);background:var(--bluebg)}
.btn.blue{border-color:rgba(56,189,248,.6);color:var(--blue)}
.btn.blue:hover{background:var(--bluebg)}
.btn.red{border-color:rgba(248,113,113,.6);color:var(--red)}
.btn.red:hover{background:var(--redbg)}
.btn.yellow{border-color:rgba(251,191,36,.6);color:var(--yellow)}
.btn.yellow:hover{background:var(--yellowbg)}
.btn.green{border-color:rgba(74,222,128,.6);color:var(--green)}
.btn.green:hover{background:var(--greenbg)}
.btn.lg{font-size:13px;padding:12px 24px; border-width: 2px;}
.btn:disabled{opacity:.3;cursor:not-allowed;pointer-events:none}
#s-win,#s-lose{align-items:center;justify-content:center;gap:24px;text-align:center; z-index:9000; overflow-y:auto; padding:20px 16px;}
#s-win > *, #s-lose > *{ flex-shrink:0; }
#winBilan{ max-height:none !important; overflow:visible !important; }
#s-win{background:radial-gradient(ellipse 70% 60% at 50% 50%,rgba(74,222,128,.1),var(--bg))}
#s-lose{background:radial-gradient(ellipse 70% 60% at 50% 50%,rgba(248,113,113,.1),var(--bg))}
.end-em{font-size:90px;animation:float 3s ease-in-out infinite;}
.end-title{font-family:var(--title);font-size:60px;letter-spacing:8px}
.end-sub{max-width:500px;font-size:15px;color:var(--mid);line-height:1.6}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-16px)}}
.modal-bg{
  position:fixed;inset:0;background:rgba(0,0,0,.85);
  display:none;align-items:center;justify-content:center;z-index:9500;backdrop-filter:blur(6px);
}
.modal-bg.on{display:flex}
.modal{
  background:var(--s1);border:1px solid var(--b2);max-width:480px;width:92%;
  clip-path:polygon(16px 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%,0 16px);
  box-shadow: 0 10px 40px rgba(0,0,0,0.8);
}
.modal-hdr{padding:16px 20px 12px;border-bottom:1px solid var(--b1)}
.modal-title{font-family:var(--title);font-size:24px;letter-spacing:2px;display:flex;align-items:center;gap:12px;}
.modal-body{padding:16px 20px;color:var(--mid);font-size:13px;line-height:1.7}
.modal-body strong{color:var(--white)}
.modal-body .big-em{font-size:42px;display:block;text-align:center;margin-bottom:12px; color:var(--mid)}
.modal-footer{padding:14px 20px;border-top:1px solid var(--b1);display:flex;gap:10px;justify-content:flex-end; background:var(--s2);}
.snd-toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:9999;font-family:var(--mono);font-size:11px;padding:8px 16px;background:rgba(14,18,28,.95);border:1px solid var(--b2);color:var(--mid);border-radius:4px;pointer-events:none;max-width:calc(100vw - 32px);width:max-content;text-align:center;word-break:break-word;white-space:normal;opacity:0;transition:opacity .25s;box-shadow:0 4px 12px rgba(0,0,0,0.5);}
.snd-toast.show{opacity:1}
::-webkit-scrollbar{width:6px;height:6px}
::-webkit-scrollbar-track{background:rgba(0,0,0,0.2)}
::-webkit-scrollbar-thumb{background:var(--b2);border-radius:3px}
.mcard-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px;
    border-bottom: 1px solid rgba(255,255,255,.05);
}
.mcard-em {
    font-size: 32px;
    line-height: 1;
    flex-shrink: 0;
    display: flex;
    align-items: center;
}
.mcard-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: left;
}
.mcard-hp {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-end;
    min-width: 48px;
    flex-shrink: 0;
}

.lt-scroll {
    display: flex;
    flex-direction: column;
    position: relative;
    padding-bottom: 20px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    flex: 1;
    min-height: 0;
}
.lt-sticky-wrapper {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 1000;
    background-color: #07090e;
    padding: 10px 14px;
    border-bottom: 2px solid var(--b1);
    box-shadow: 0 8px 15px rgba(0,0,0,1);
    margin: -14px -14px 10px -14px;
}
.lt-card.sel .lt-sticky-wrapper {
    border-bottom-color: var(--blue);
}

/* ══════════════════════════════════════════════════════════════
   SAD_MONKEY — ONGLET CREW + CHAT INTÉGRÉ
═══════════════════════════════════════════════════════════════ */
.sm-ltabs{display:flex;height:34px;border-bottom:1px solid rgba(30,38,54,.5);flex-shrink:0;background:rgba(10,13,20,.4)}
#smPaneSad{flex:1;display:none;flex-direction:column;min-height:0;overflow:hidden}
#smPaneSad.on{display:flex}
.sm-ltab{flex:1;font-family:var(--mono);font-size:10px;letter-spacing:1.5px;display:flex;align-items:center;justify-content:center;gap:5px;cursor:pointer;color:var(--mid);background:none;border:none;border-bottom:2px solid transparent;transition:.15s}
.sm-ltab:hover{color:var(--white)}
.sm-ltab.on{color:var(--blue);border-bottom-color:var(--blue)}
.sm-ltab.sad-on{color:#fbbf24;border-bottom-color:#fbbf24}
.sm-ltab.sad-locked{opacity:.35;cursor:not-allowed}
.sm-fbadge{font-family:var(--mono);font-size:9px;font-weight:bold;padding:1px 5px;border-radius:2px;line-height:1.4}
.sm-fbadge.dim{background:var(--b1);color:var(--mid)}
.sm-fbadge.lit{background:#fbbf24;color:#1a1200}

/* SAD_MONKEY states */
.sm-pane{flex:1;display:none;flex-direction:column;min-height:0;overflow:hidden}
.sm-pane.on{display:flex;flex:1;min-height:0;flex-direction:column}

/* LOCKED state */
.sm-st-locked{flex:1;display:flex;flex-direction:column;align-items:center;gap:14px;padding:24px 24px 20px;text-align:center;overflow-y:auto;-webkit-overflow-scrolling:touch}
.sm-lock-ico{font-size:32px;opacity:.2;font-family:var(--mono);font-weight:bold}
.sm-lock-title{font-family:var(--mono);font-size:11px;color:#fbbf24;letter-spacing:2px;opacity:.5}
.sm-lock-sub{font-size:10px;color:var(--mid);line-height:1.7;max-width:200px}
.sm-lock-count{font-family:var(--mono);font-size:10px;color:var(--mid);letter-spacing:1px}
.sm-lock-count b{color:#fbbf24}
.sm-hex-strip{display:flex;flex-wrap:wrap;gap:3px;justify-content:center;padding:8px 0 0;max-width:240px;margin:0 auto}
.sm-hx{font-family:var(--mono);font-size:7px;color:var(--b1);letter-spacing:.5px;transition:color .4s}
.sm-hx.lit{color:rgba(251,191,36,.3)}

/* LOADER state */
.sm-st-loader{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:14px;padding:20px;text-align:center;overflow-y:auto;-webkit-overflow-scrolling:touch;padding-bottom:20px}
.sm-l-ava{font-size:28px;font-weight:bold;font-family:var(--mono);color:#fbbf24;animation:smGlitch 3s infinite}
.sm-l-title{font-family:var(--mono);font-size:12px;color:#fbbf24;letter-spacing:2px}
.sm-l-lore{font-family:var(--mono);font-size:10px;color:var(--mid);line-height:1.8;max-width:220px;min-height:36px}
.sm-l-bar-area{width:100%;display:flex;flex-direction:column;align-items:center;gap:4px;}
.sm-l-bar-wrap{width:100%;background:var(--s1);border:1px solid var(--b1);border-radius:2px;height:4px;overflow:hidden;position:relative}
.sm-l-pct{font-family:var(--mono);font-size:11px;color:#fbbf24;letter-spacing:1px;}
.sm-l-bar{height:100%;background:#fbbf24;width:0%;transition:width .4s;border-radius:2px}
.sm-l-bar-wrap::after{content:'';position:absolute;top:0;left:-30px;width:30px;height:100%;background:linear-gradient(90deg,transparent,rgba(251,191,36,.35),transparent);animation:smScan 2s linear infinite}
@keyframes smScan{from{left:-30px}to{left:100%}}
.sm-btn-go{background:none;border:1px solid #fbbf24;color:#fbbf24;font-family:var(--mono);font-size:10px;letter-spacing:1.5px;padding:7px 18px;border-radius:3px;cursor:pointer;transition:background .15s,color .15s}
.sm-btn-go:hover{background:#fbbf24;color:#1a1200}
.sm-btn-go:disabled{opacity:.35;cursor:not-allowed}

/* CHAT state */
.sm-st-chat{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative}
.sm-chat-hdr{border-bottom:1px solid var(--b1);padding:8px 10px 6px;background:rgba(10,13,20,.5);flex-shrink:0}
.sm-chat-hdr-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px;flex-wrap:wrap;row-gap:4px}
.sm-chat-id{display:flex;align-items:center;gap:8px}
.sm-chat-ava{width:32px;height:32px;border:1.5px solid #fbbf24;border-radius:3px;display:flex;align-items:center;justify-content:center;background:#1a1200;font-size:13px;font-weight:bold;font-family:var(--mono);color:#fbbf24;flex-shrink:0;position:relative;overflow:hidden;animation:smGlitch 7s infinite}
.sm-chat-ava::after{content:'';position:absolute;top:50%;left:-2px;right:-2px;height:2px;background:#f87171;opacity:.75;transform:rotate(-8deg)}
.sm-chat-ava.dead{border-color:var(--mid);color:var(--mid);animation:none}
.sm-chat-ava.dead::after{opacity:.2}
.sm-chat-name{font-family:var(--mono);font-size:11px;color:#fbbf24;letter-spacing:2px}
.sm-chat-st{font-size:9px;letter-spacing:1px;margin-top:1px;color:var(--mid)}
.sm-chat-st.on{color:var(--green)}
.sm-chat-st.think{color:#fbbf24}
.sm-chat-st.err{color:#f87171}
.sm-energy-row{display:flex;align-items:center;gap:6px;margin-bottom:4px}
.sm-energy-label{font-family:var(--mono);font-size:8px;color:var(--mid);letter-spacing:1px;flex-shrink:0}
.sm-pip{width:12px;height:5px;border-radius:1px;border:1px solid var(--b1);background:var(--s1);transition:background .3s,border-color .3s}
.sm-pip.on{background:var(--blue);border-color:var(--blue)}
.sm-btn-resurrect{background:rgba(56,189,248,.07);border:1px solid var(--blue);color:var(--blue);font-family:var(--mono);font-size:9px;letter-spacing:1px;padding:6px 10px;border-radius:2px;cursor:pointer;width:100%;text-align:center;flex-shrink:0;display:block}
.sm-btn-resurrect:hover{background:var(--blue);color:#000}
.sm-btn-resurrect:disabled{opacity:.25;cursor:not-allowed}
.sm-btn-resurrect.hidden{display:none}
.sm-chat-frags{display:flex;gap:2px;flex-wrap:wrap;margin-bottom:3px}
.sm-sf{font-family:var(--mono);font-size:8px;padding:1px 4px;border-radius:2px;letter-spacing:.5px;border:1px solid;cursor:default;transition:color .3s,border-color .3s,background .3s}
.sm-sf.on{color:#fbbf24;border-color:#fbbf24;background:rgba(251,191,36,.06)}
.sm-sf.off{color:var(--b1);border-color:var(--b1)}
.sm-mood{height:2px;background:var(--b1);border-radius:1px}
.sm-mood-bar{height:100%;border-radius:1px;transition:width .6s,background .6s}

/* Chat messages */
.sm-chat-log{flex:1;overflow-y:auto;padding:8px 10px 16px;display:flex;flex-direction:column;gap:8px;min-height:0;scrollbar-width:thin;scrollbar-color:var(--b1) transparent}
.sm-msg{display:flex;flex-direction:column;gap:2px;max-width:95%}
.sm-msg.u{align-self:flex-end;align-items:flex-end}
.sm-msg.s{align-self:flex-start;align-items:flex-start}
.sm-ml{font-size:9px;font-family:var(--mono);letter-spacing:1px;color:var(--mid)}
.sm-msg.s .sm-ml{color:#fbbf24}
.sm-msg.s.lt .sm-ml{color:#a78bfa}
.sm-mb{padding:6px 9px;border-radius:3px;font-size:11px;line-height:1.6;font-family:var(--mono)}
.sm-msg.u .sm-mb{background:rgba(74,222,128,.08);border:1px solid rgba(74,222,128,.18);color:var(--white)}
.sm-msg.s .sm-mb{background:var(--s1);border:1px solid var(--b1);border-left:2px solid #fbbf24;color:var(--white);font-family:var(--mono);font-size:10px;line-height:1.7}
.sm-msg.s .sm-mb.typing{border-left-color:var(--green)}
.sm-msg.s .sm-mb.hallucination{border-left-color:#f87171;border-color:rgba(248,113,113,.15);background:#120810}
.sm-msg.s .sm-mb.lieutenant{border-left-color:#a78bfa;border-color:rgba(167,139,250,.15);background:#0d0b18;font-style:italic}
.sm-msg.s .sm-mb.dh-intercept{background:#0a0008;border:1px solid rgba(248,113,113,.3);border-left:2px solid #f87171;color:#f87171;font-family:var(--mono);font-size:10px;letter-spacing:.5px;animation:smGlitch 1.5s ease-out 1}

/* Typing indicator */
.sm-tw{padding:0 10px 6px;display:none;flex-direction:column;gap:2px;flex-shrink:0}
.sm-tw.on{display:flex}
.sm-dots{background:var(--s1);border:1px solid var(--b1);border-left:2px solid #fbbf24;padding:6px 10px;border-radius:3px;display:flex;gap:4px;align-items:center}
.sm-dot{width:4px;height:4px;background:#fbbf24;border-radius:50%;opacity:.3;animation:smPulse 1.2s infinite}
.sm-dot:nth-child(2){animation-delay:.2s}
.sm-dot:nth-child(3){animation-delay:.4s}

/* Dead overlay */
.sm-dead-overlay{display:none;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:20px;text-align:center;background:rgba(7,9,14,.92);position:absolute;inset:0;z-index:10}
.sm-dead-overlay.on{display:flex}
.sm-dead-title{font-family:var(--mono);font-size:12px;color:#f87171;letter-spacing:2px;opacity:.7}
.sm-dead-last{font-family:var(--mono);font-size:10px;color:var(--mid);line-height:1.7;max-width:220px;margin-bottom:6px}
.sm-btn-res-big{background:none;border:1px solid var(--blue);color:var(--blue);font-family:var(--mono);font-size:10px;letter-spacing:1.5px;padding:8px 20px;border-radius:3px;cursor:pointer;transition:background .15s,color .15s}
.sm-btn-res-big:hover{background:var(--blue);color:#000}
.sm-btn-res-big:disabled{opacity:.3;cursor:not-allowed}
.sm-cost-label{font-family:var(--mono);font-size:9px;color:var(--mid)}
.sm-cost-label b{color:var(--blue)}

/* Input */
.sm-inp-area{border-top:1px solid var(--b1);padding:6px 8px;background:rgba(10,13,20,.5);display:flex;gap:6px;align-items:flex-end;flex-shrink:0}
textarea.sm-inp{flex:1;background:var(--s1);border:1px solid var(--b1);border-radius:3px;color:var(--white);font-family:var(--mono);font-size:10px;padding:5px 8px;resize:none;min-height:28px;max-height:60px;outline:none;transition:border-color .15s;letter-spacing:.5px}
textarea.sm-inp:focus{border-color:#fbbf24}
textarea.sm-inp::placeholder{color:var(--mid)}
button.sm-send{background:none;border:1px solid #fbbf24;color:#fbbf24;cursor:pointer;padding:4px 10px;border-radius:3px;font-family:var(--mono);font-size:10px;letter-spacing:1px;transition:background .15s,color .15s;flex-shrink:0;height:28px}
button.sm-send:hover{background:#fbbf24;color:#1a1200}
button.sm-send:disabled{opacity:.35;cursor:not-allowed}

/* Fragment toast */
.sm-frag-toast{position:fixed;top:80px;left:50%;transform:translateX(-50%);background:#1a1200;border:1px solid #fbbf24;color:#fbbf24;font-family:var(--mono);font-size:12px;letter-spacing:1px;padding:12px 24px;border-radius:4px;z-index:9999;opacity:0;transition:opacity .4s;pointer-events:none;text-align:center;box-shadow:0 4px 20px rgba(251,191,36,.3)}
.sm-frag-toast.show{opacity:1}

/* Fragment gallery */
.sm-frag-gallery{display:flex;flex-direction:column;gap:6px;padding:10px 0;width:100%;max-width:260px;margin:0 auto}
.sm-frag-row{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:9px;padding:4px 8px;border-radius:3px;border:1px solid var(--b1);background:var(--s1);transition:all .4s}
.sm-frag-row.unlocked{border-color:rgba(251,191,36,.4);background:rgba(251,191,36,.04)}
.sm-frag-num{width:20px;text-align:center;color:var(--mid);font-weight:bold;flex-shrink:0}
.sm-frag-row.unlocked .sm-frag-num{color:#fbbf24}
.sm-frag-hex{flex:1;color:var(--b1);letter-spacing:.5px;word-break:break-all;transition:color .4s}
.sm-frag-row.unlocked .sm-frag-hex{color:#fbbf24}
.sm-frag-status{font-size:8px;letter-spacing:1px;color:var(--mid);flex-shrink:0}
.sm-frag-row.unlocked .sm-frag-status{color:#fbbf24}
.sm-frag-mission{font-size:8px;color:var(--mid);opacity:.5;flex-shrink:0;max-width:50px;overflow:hidden;text-overflow:ellipsis}
.sm-frag-row.unlocked .sm-frag-mission{opacity:.8}

/* Resurrection launch button */
.sm-btn-resurrect-launch{display:flex;align-items:center;justify-content:center;gap:8px;background:none;border:2px solid #fbbf24;color:#fbbf24;font-family:var(--mono);font-size:12px;letter-spacing:2px;padding:12px 24px;border-radius:4px;cursor:pointer;transition:all .3s;margin-top:14px;animation:smPulseGlow 2s ease-in-out infinite}
.sm-btn-resurrect-launch:hover{background:#fbbf24;color:#1a1200;box-shadow:0 0 20px rgba(251,191,36,.4)}
.sm-btn-resurrect-launch.hidden{display:none}
@keyframes smPulseGlow{0%,100%{box-shadow:0 0 5px rgba(251,191,36,.2)}50%{box-shadow:0 0 15px rgba(251,191,36,.5)}}

@keyframes smGlitch{0%,85%,100%{transform:translate(0);filter:none}86%{transform:translate(-2px,1px);filter:hue-rotate(80deg)}88%{transform:translate(2px,-1px)}90%{transform:translate(-1px,0)}}
@keyframes smPulse{0%,100%{opacity:.3;transform:scale(1)}50%{opacity:1;transform:scale(1.2)}}

/* SAD_MONKEY fullscreen */
.side-left.sm-fullscreen{position:fixed!important;top:0!important;left:0!important;right:0!important;bottom:90px!important;width:100%!important;height:auto!important;z-index:9999!important;border-radius:0!important;max-width:100%!important;background:rgba(7,9,14,0.98)!important;backdrop-filter:none!important}
.side-left.sm-fullscreen .sm-chat-log{font-size:13px}
.side-left.sm-fullscreen .sm-msg.s .sm-mb{font-size:12px;line-height:1.8}
.side-left.sm-fullscreen .sm-inp-area{padding:10px 16px}
.side-left.sm-fullscreen textarea.sm-inp{font-size:13px;min-height:36px;max-height:100px}
.sm-btn-fs{background:none;border:1px solid var(--b1);color:var(--mid);cursor:pointer;padding:4px 7px;border-radius:3px;font-family:var(--mono);font-size:9px;letter-spacing:1px;display:flex;align-items:center;gap:3px;transition:color .15s}
.sm-btn-fs:hover{color:var(--white);border-color:var(--mid)}

/* ══ ONLINE SECTION ══════════════════════════════════════════ */
.btn-online-trigger{display:flex;align-items:center;gap:10px;width:100%;font-family:var(--mono);font-size:11px;letter-spacing:3px;text-transform:uppercase;padding:14px 20px;border:2px solid var(--b2);background:var(--s1);color:var(--mid);cursor:pointer;transition:.2s;border-radius:var(--radius);position:relative;overflow:hidden;margin-top:8px;box-sizing:border-box;}
.btn-online-trigger::before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(56,189,248,.06) 0%,transparent 60%);pointer-events:none;}
.btn-online-trigger:hover,.btn-online-trigger.active{border-color:var(--blue);color:var(--blue);background:var(--bluebg);}
.btn-online-label{flex:1;text-align:left;}
.btn-online-chev{color:var(--mid);transition:transform .25s;flex-shrink:0;}
.btn-online-trigger.active .btn-online-chev{transform:rotate(180deg);}
.online-panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s cubic-bezier(.4,0,.2,1);width:100%;}
.online-panel.open{grid-template-rows:1fr;}
.online-panel-inner{overflow:hidden;}
.online-panel-body{border:2px solid var(--b2);border-top:none;background:var(--s1);border-radius:0 0 var(--radius) var(--radius);overflow:hidden;}
.online-cols{display:grid;grid-template-columns:1fr 1px 1fr;}
.online-col{padding:20px;display:flex;flex-direction:column;gap:10px;}
.online-col-sep{background:var(--b2);margin:16px 0;}
.online-col-hdr{font-family:var(--mono);font-size:9px;letter-spacing:3px;text-transform:uppercase;color:var(--mid);display:flex;align-items:center;gap:8px;padding-bottom:10px;border-bottom:1px solid var(--b1);margin-bottom:4px;}
.online-code{font-family:var(--mono);font-size:22px;letter-spacing:8px;color:var(--blue);text-align:center;padding:14px 10px;background:var(--s2);border:1px solid rgba(56,189,248,.2);border-radius:var(--radius);cursor:pointer;transition:.15s;user-select:all;position:relative;}
.online-code:hover{background:var(--bluebg);border-color:rgba(56,189,248,.6);}
.online-code-hint{font-family:var(--mono);font-size:8px;letter-spacing:1px;color:rgba(56,189,248,.4);text-align:right;margin-top:-6px;}
.online-st{font-family:var(--mono);font-size:10px;letter-spacing:1px;color:var(--mid);min-height:14px;display:flex;align-items:center;gap:6px;}
.online-st::before{content:'';width:5px;height:5px;border-radius:50%;background:var(--mid);flex-shrink:0;transition:background .3s;}
.online-st.ok{color:var(--green);}.online-st.ok::before{background:var(--green);}
.online-st.wait{color:var(--blue);}.online-st.wait::before{background:var(--blue);animation:netPulse 1s infinite;}
.online-st.err{color:var(--red);}.online-st.err::before{background:var(--red);}
.online-plist{display:flex;flex-direction:column;gap:5px;min-height:0;}
.online-prow{display:flex;align-items:center;gap:8px;padding:6px 10px;background:var(--s2);border:1px solid var(--b1);border-radius:4px;font-family:var(--mono);font-size:10px;letter-spacing:.5px;animation:netFadeIn .2s ease;}
.online-pdot{width:5px;height:5px;border-radius:50%;background:var(--green);flex-shrink:0;}
.online-pdot.wait{background:var(--mid);animation:netPulse 1s infinite;}
.online-pname{flex:1;color:var(--white);}
.online-pbadge{font-size:8px;letter-spacing:1px;}
.online-input{background:var(--s2);border:2px solid var(--b2);color:var(--white);font-family:var(--mono);font-size:18px;letter-spacing:5px;padding:11px 14px;border-radius:var(--radius);outline:none;text-align:center;text-transform:uppercase;width:100%;transition:.15s;box-sizing:border-box;}
.online-input:focus{border-color:var(--blue);background:rgba(56,189,248,.04);}
.online-input::placeholder{color:var(--dim);font-size:10px;letter-spacing:2px;text-transform:none;}
#onlineIndicator{display:none;align-items:center;gap:5px;padding:0 12px;font-family:var(--mono);font-size:9px;letter-spacing:2px;color:var(--red);border-left:1px solid var(--b1);}
#onlineIndicator.on{display:flex;}
#onlineIndicator-dot{width:5px;height:5px;border-radius:50%;background:var(--red);animation:netPulse 2s infinite;flex-shrink:0;}
@keyframes netPulse{0%,100%{opacity:1;}50%{opacity:.2;}}
.vote-count{display:inline-block;margin-left:6px;font-size:10px;opacity:0.75;font-family:var(--mono);color:var(--blue);letter-spacing:1px;}
@keyframes netFadeIn{from{opacity:0;transform:translateY(-4px);}to{opacity:1;transform:none;}}
.online-gm-toggle-row{display:flex;align-items:center;gap:8px;cursor:pointer;font-family:var(--mono);font-size:10px;letter-spacing:1px;color:var(--mid);padding:8px 0;border-top:1px solid var(--b1);margin-top:6px;user-select:none;}
.online-gm-toggle-row:hover{color:var(--red);}
.online-gm-toggle-row span{flex:1;}
.online-gm-track{position:relative;width:28px;height:16px;background:var(--b2);border-radius:8px;transition:background .2s;flex-shrink:0;}
.online-gm-track:has(input:checked){background:rgba(248,113,113,.35);}
.online-gm-track input{position:absolute;opacity:0;width:100%;height:100%;cursor:pointer;margin:0;}
.online-gm-thumb{position:absolute;top:2px;left:2px;width:12px;height:12px;background:var(--mid);border-radius:50%;transition:transform .2s,background .2s;pointer-events:none;}
.online-gm-track:has(input:checked) .online-gm-thumb{transform:translateX(12px);background:var(--red);}

@media(max-width:700px){.online-cols{grid-template-columns:1fr;}.online-col-sep{height:1px;width:calc(100% - 40px);margin:0 20px;}}

/* anti-select-zoom : désactive sélection texte + double-tap zoom mobile */
html, body { -webkit-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; touch-action: manipulation; }
input, textarea, [contenteditable] { -webkit-user-select: text; user-select: text; }
