:root{ --live:#ef1130; --line:rgba(255,255,255,.10); --bg:#060607; }
  *{box-sizing:border-box; -webkit-tap-highlight-color:transparent;}
  html,body{margin:0;padding:0;height:100%;background:var(--bg);color:#fff;
    font-family:'Archivo',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    -webkit-font-smoothing:antialiased;overscroll-behavior:none;}

  /* ===== le poste ===== */
  .room{min-height:100dvh;background:var(--bg);position:relative;}
  .tv-set{position:relative;width:100%;height:100dvh;background:#0a0a0d;overflow:hidden;}

  /* ===== chrome haut ===== */
  .chrome-top{position:absolute;top:0;left:0;right:0;z-index:25;
    display:flex;flex-direction:column;gap:10px;
    padding:calc(env(safe-area-inset-top) + 14px) 15px 12px;
    background:linear-gradient(180deg,rgba(6,6,8,.92) 0%,rgba(6,6,8,.55) 55%,rgba(6,6,8,0) 100%);}
  .topbar{display:flex;align-items:center;gap:8px;}
  .brand{display:flex;align-items:center;gap:8px;}
  .brand .mark{width:30px;height:30px;border-radius:8px;background:var(--live);
    display:flex;align-items:center;justify-content:center;flex:none;
    box-shadow:0 3px 10px rgba(239,17,48,.35);}
  .brand .mark span{font-family:'Archivo Black',sans-serif;font-size:15px;color:#fff;letter-spacing:-.3px;line-height:1;}
  .brand .word{display:flex;align-items:baseline;gap:1px;}
  .brand .word .a{font-family:'Archivo Black',sans-serif;font-size:20px;color:#eceef2;letter-spacing:-.4px;}
  .brand .word .b{font-family:'Archivo Black',sans-serif;font-size:20px;color:#fff;letter-spacing:-.4px;}
  .brand .word .tv{font-family:'Archivo Black',sans-serif;font-size:11px;color:var(--live);align-self:flex-end;margin-bottom:3px;margin-left:2px;}
  .clock{margin-left:auto;font-family:'Space Mono',monospace;font-size:12px;color:#c3c7d0;letter-spacing:1px;font-variant-numeric:tabular-nums;}
  .gear{width:34px;height:34px;border-radius:10px;border:1px solid rgba(255,255,255,.14);
    background:rgba(255,255,255,.08);color:#e7e9ee;font-size:16px;cursor:pointer;display:grid;place-items:center;flex:none;}
  .gear:active{transform:scale(.94);}
  .viewbtn{display:none;width:auto;padding:0 12px;font-family:'Space Mono',monospace;font-size:10px;
    font-weight:700;letter-spacing:1.5px;}
  .statusbar{display:flex;align-items:center;gap:10px;}
  .live-badge{display:inline-flex;align-items:center;gap:6px;background:var(--live);
    color:#fff;font-family:'Archivo',sans-serif;font-weight:800;font-size:11px;letter-spacing:.09em;padding:4px 9px;border-radius:6px;}
  .live-badge .d{width:7px;height:7px;border-radius:50%;background:#fff;animation:blink 1.4s ease-in-out infinite;}
  @keyframes blink{0%,100%{opacity:1;}50%{opacity:.15;}}
  .nowchan{display:flex;align-items:center;gap:7px;min-width:0;}
  .nowchan .dot{width:9px;height:9px;border-radius:50%;flex:none;}
  .nowchan .nm{font-family:'Archivo',sans-serif;font-weight:800;font-size:13px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .nowchan .rb{font-family:'Space Mono',monospace;font-size:10px;color:#8b909b;letter-spacing:1px;text-transform:uppercase;white-space:nowrap;}

  /* ===== télécommande : tiroir vertical sur mobile, panneau fixe sur desktop ===== */
  .rail{position:absolute;left:0;top:0;bottom:0;z-index:36;width:min(78vw,300px);
    display:flex;flex-direction:column;align-items:stretch;gap:8px;overflow-y:auto;overflow-x:hidden;
    padding:calc(env(safe-area-inset-top) + 14px) 12px calc(env(safe-area-inset-bottom) + 14px);
    scrollbar-width:none;background:rgba(10,10,14,.98);border-right:1px solid #23262c;
    transform:translateX(-106%);transition:transform .26s cubic-bezier(.2,.9,.2,1);}
  .rail.open{transform:translateX(0);box-shadow:30px 0 70px rgba(0,0,0,.55);}
  .rail::-webkit-scrollbar{display:none;}
  .rail .zt{display:block;font-family:'Space Mono',monospace;font-size:10px;font-weight:700;letter-spacing:2px;color:#8b939d;padding:2px 6px 10px;}
  .railveil{position:absolute;inset:0;z-index:35;background:rgba(0,0,0,.55);display:none;}
  .railveil.show{display:block;}
  .zapbtn{position:absolute;left:14px;bottom:calc(env(safe-area-inset-bottom) + 44px);z-index:30;
    width:52px;height:52px;border-radius:50%;border:1px solid rgba(255,255,255,.25);cursor:pointer;
    background:#15161c;color:#fff;font-family:'Archivo Black',sans-serif;font-size:12px;letter-spacing:.5px;
    box-shadow:0 8px 24px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.12);}
  .zapbtn:active{transform:scale(.94);}
  .chip{flex:none;position:relative;display:flex;align-items:center;gap:11px;min-width:172px;max-width:240px;
    background:#101116;border:1px solid rgba(255,255,255,.12);border-radius:16px;
    color:#8b909b;padding:8px 16px 8px 8px;cursor:pointer;transition:all .18s;text-align:left;}
  .chip::after{content:"";position:absolute;top:8px;right:9px;width:5px;height:5px;border-radius:50%;
    background:currentColor;opacity:.45;}
  .chip .plogo{position:relative;width:44px;height:44px;border-radius:11px;object-fit:cover;overflow:hidden;
    display:flex;align-items:center;justify-content:center;background:#1a1c22;color:#fff;
    font-family:'Archivo Black',sans-serif;font-size:15px;border:1px solid rgba(255,255,255,.25);
    box-shadow:0 2px 6px rgba(0,0,0,.5);flex:none;}
  .chip .pname{font-family:'Space Mono',monospace;font-weight:700;font-size:10.5px;line-height:1.3;
    letter-spacing:.09em;text-transform:uppercase;text-align:left;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
  .chip.on{border-color:currentColor;background:#15161c;
    box-shadow:0 0 16px -3px currentColor, inset 0 0 0 1px currentColor;}
  .chip.on::after{opacity:1;}
  .chip:active{transform:scale(.96);}

  /* ===== feed vertical ===== */
  .feed{height:100%;overflow-y:scroll;scroll-snap-type:y mandatory;scroll-behavior:smooth;scrollbar-width:none;touch-action:pan-y;}
  .feed::-webkit-scrollbar{display:none;}
  .slide{position:relative;height:100%;scroll-snap-align:start;scroll-snap-stop:always;overflow:hidden;}
  .slide .cap{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;}
  .slide .cap span{font-family:'Space Mono',monospace;font-size:10px;letter-spacing:2px;color:rgba(255,255,255,.22);text-transform:uppercase;transform:translateY(-56px);}

  .lower{position:absolute;left:0;right:0;bottom:0;z-index:6;max-height:100%;overflow:hidden;
    padding:22px 18px calc(env(safe-area-inset-bottom) + 112px);
    display:flex;flex-direction:column;gap:10px;
    transform:translateY(14px);opacity:0;transition:transform .5s cubic-bezier(.2,.9,.2,1),opacity .5s;}
  .slide.live .lower{transform:translateY(0);opacity:1;}

  .srcbadge{display:inline-flex;align-items:center;gap:11px;align-self:flex-start;
    padding:7px 14px 7px 8px;border-radius:999px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);}
  .srcbadge .logo{width:36px;height:36px;border-radius:9px;flex:none;object-fit:cover;
    display:flex;align-items:center;justify-content:center;overflow:hidden;
    background:#1a1c22;border:1px solid rgba(255,255,255,.22);box-shadow:0 2px 8px rgba(0,0,0,.4);
    font-family:'Archivo Black',sans-serif;font-size:14px;color:#fff;}
  .srcbadge .meta{display:flex;flex-direction:column;gap:2px;line-height:1.1;}
  .srcbadge .meta .k{font-family:'Space Mono',monospace;font-size:8.5px;letter-spacing:1.5px;color:#8b909b;text-transform:uppercase;}
  .srcbadge .meta .v{font-family:'Archivo',sans-serif;font-weight:800;font-size:14px;color:#fff;letter-spacing:-.2px;}

  .kickrow{display:flex;align-items:center;gap:8px;}
  .kick{font-family:'Archivo',sans-serif;font-weight:900;font-size:11px;letter-spacing:.11em;
    text-transform:uppercase;color:#0a0a0d;padding:4px 9px;border-radius:4px;white-space:nowrap;}
  .rule{flex:1;max-width:70px;height:3px;border-radius:2px;}
  .bgimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
  .veil{position:absolute;inset:0;z-index:1;
    background:linear-gradient(180deg,rgba(6,6,8,.55) 0%,rgba(6,6,8,.15) 30%,rgba(6,6,8,.55) 62%,rgba(6,6,8,.94) 100%);}
  .ttl{margin:0;font-family:'Archivo Black','Archivo',sans-serif;font-weight:900;font-size:31px;line-height:1.04;
    letter-spacing:-.7px;color:#fff;text-decoration:none;text-wrap:balance;cursor:pointer;display:block;
    text-shadow:0 2px 24px rgba(0,0,0,.55);}
  .ttl:active{opacity:.85;}
  .resume{margin:0;font-size:14px;line-height:1.45;color:#c3c7d0;max-width:36ch;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
  .actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:5px;}
  .go{display:inline-flex;align-items:center;gap:6px;text-decoration:none;
    font-family:'Space Mono',monospace;font-size:11px;font-weight:700;letter-spacing:.5px;
    color:#0a0a0d;padding:10px 16px;border-radius:999px;cursor:pointer;white-space:nowrap;}
  .go:active{transform:scale(.97);}
  .act{background:rgba(255,255,255,.06);color:#e7e9ee;border:1px solid rgba(255,255,255,.16);
    padding:10px 15px;border-radius:999px;font-family:'Space Mono',monospace;font-size:11px;font-weight:700;letter-spacing:.5px;cursor:pointer;}
  .act:active{transform:scale(.97);}

  /* ===== ticker ===== */
  .ticker{position:absolute;left:0;right:0;bottom:0;z-index:25;height:30px;display:flex;align-items:stretch;
    background:rgba(6,6,8,.92);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
  .ticker .lab{flex:none;display:flex;align-items:center;background:var(--live);color:#fff;
    font-family:'Space Mono',monospace;font-weight:700;font-size:10px;letter-spacing:1px;padding:0 11px;text-transform:uppercase;}
  .ticker .track{flex:1;overflow:hidden;position:relative;display:flex;align-items:center;}
  .ticker .move{display:inline-flex;white-space:nowrap;will-change:transform;animation:marq 40s linear infinite;}
  .ticker .move span{padding:0 22px;font-family:'Space Mono',monospace;font-size:12px;color:#d7dae0;}
  .ticker .move span::before{content:"\25CF";color:var(--live);margin-right:9px;font-size:7px;vertical-align:2px;}
  @keyframes marq{from{transform:translateX(0);}to{transform:translateX(-50%);}}

  .zapflash{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(.92);z-index:40;
    pointer-events:none;opacity:0;transition:opacity .18s,transform .18s;
    background:rgba(6,6,8,.82);border:1px solid rgba(255,255,255,.18);border-radius:14px;
    padding:14px 22px;text-align:center;max-width:80%;}
  .zapflash .zlogo{width:46px;height:46px;border-radius:12px;margin:0 auto 9px;overflow:hidden;flex:none;
    display:flex;align-items:center;justify-content:center;object-fit:cover;
    font-family:'Archivo Black',sans-serif;font-size:16px;color:#fff;
    border:1px solid rgba(255,255,255,.28);box-shadow:0 4px 14px rgba(0,0,0,.5);}
  .zapflash .zn{font-family:'Archivo Black',sans-serif;font-size:19px;color:#fff;line-height:1.15;}
  .zapflash .zc{font-family:'Space Mono',monospace;font-size:10px;letter-spacing:2px;color:#8b909b;text-transform:uppercase;margin-top:3px;}
  .zapflash.show{opacity:1;transform:translate(-50%,-50%) scale(1);}

  .splash,.slide.msg{display:grid;place-items:center;text-align:center;color:#cfd5db;padding:24px;height:100%;}
  .slide.msg .rewind{margin-top:16px;padding:12px 22px;border-radius:999px;border:1px solid rgba(255,255,255,.25);
    background:#15161c;color:#fff;font-family:'Space Mono',monospace;font-size:11px;font-weight:700;
    letter-spacing:1.5px;cursor:pointer;box-shadow:0 4px 14px rgba(0,0,0,.4);}
  .slide.msg .rewind:active{transform:scale(.96);}
  .slide.msg .rewind:disabled{opacity:.55;cursor:default;}
  .slide.msg .histmsg{font-family:'Space Mono',monospace;font-size:11px;color:#8b909b;margin-top:12px;min-height:1em;}
  .slide.msg div{font-size:15px;line-height:1.6;}
  .spin{width:34px;height:34px;border:3px solid rgba(255,255,255,.2);border-top-color:#fff;
    border-radius:50%;animation:rot .8s linear infinite;margin:0 auto 14px;}
  @keyframes rot{to{transform:rotate(360deg);}}

  /* ===== version ordinateur : cadre téléviseur + zapette latérale ===== */
  @media (min-width:900px){
    .room{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:30px;
      min-height:100dvh;padding:26px 20px;
      background:radial-gradient(80% 60% at 50% 28%, rgba(239,17,48,.06), transparent 60%), radial-gradient(90% 80% at 50% 40%, #141419, #050506);}
    .tvcol{display:flex;flex-direction:column;align-items:center;}
    .tv-set{width:462px;height:min(900px,92dvh);border:15px solid #0b0b0d;border-radius:30px;
      box-shadow:0 40px 90px rgba(0,0,0,.7), inset 0 0 0 2px #1c1d21;}
    .stand{width:150px;height:16px;background:#0b0b0d;border-radius:0 0 10px 10px;margin-top:-2px;}
    .stand::after{content:"";display:block;width:210px;height:8px;background:#0b0b0d;border-radius:8px;margin:8px auto 0;}
    .power{position:absolute;bottom:-10px;right:34px;width:7px;height:7px;border-radius:50%;
      background:var(--live);box-shadow:0 0 8px var(--live);z-index:26;}
    .rail{position:static;transform:none;width:220px;height:min(900px,92dvh);z-index:auto;
      background:#101216;border:1px solid #23262c;border-radius:18px;padding:14px 12px;gap:6px;}
    .rail.open{box-shadow:none;}
    .railveil,.zapbtn{display:none !important;}
    /* le rail est à gauche : le ticker colle au bas du poste */
    .ticker{bottom:0;}
    .lower{padding-bottom:78px;}
    .rail .zt{display:block;font-family:'Space Mono',monospace;font-size:10px;font-weight:700;letter-spacing:2px;color:#8b939d;padding:2px 6px 10px;}
    .chip{width:100%;max-width:none;}
  }

  /* ===== back-office ===== */
  .sheet{position:fixed;inset:0;z-index:60;display:none;}
  .sheet.open{display:block;}
  .sheet .bg{position:absolute;inset:0;background:rgba(4,4,5,.7);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);}
  .panel{position:absolute;left:50%;transform:translateX(-50%);bottom:0;width:100%;max-width:520px;
    max-height:90dvh;overflow-y:auto;background:#111318;border:1px solid rgba(255,255,255,.08);
    border-top-left-radius:22px;border-top-right-radius:22px;
    padding:20px 18px calc(env(safe-area-inset-bottom) + 24px);}
  .panel h2{font-family:'Archivo Black',sans-serif;font-size:19px;margin:2px 0 4px;letter-spacing:.2px;}
  .panel p.sub{margin:0 0 16px;font-size:13px;line-height:1.5;color:#9aa3ad;}
  .sectlabel{font-family:'Space Mono',monospace;font-size:10px;letter-spacing:1.5px;color:#8b909b;text-transform:uppercase;margin:6px 0 8px;}
  .srow{display:flex;align-items:center;gap:12px;padding:11px 0;border-top:1px solid rgba(255,255,255,.06);}
  .srow.dragging{background:rgba(255,255,255,.08);border-radius:10px;}
  .grab{flex:none;cursor:grab;user-select:none;-webkit-user-select:none;touch-action:none;
    color:#8b939d;font-size:15px;line-height:1;padding:8px 6px;letter-spacing:0;}
  .grab:active{cursor:grabbing;color:#fff;}
  .srow .flogo{width:30px;height:30px;border-radius:8px;flex:none;object-fit:cover;background:#1a1c22;border:1px solid rgba(255,255,255,.14);}
  .srow .info{flex:1;min-width:0;}
  .srow .info b{font-family:'Archivo',sans-serif;font-size:14px;font-weight:700;display:block;}
  .srow .info small{font-size:11px;color:#8b939d;word-break:break-all;}
  .del{background:none;border:none;color:#e5726a;font-size:12px;font-family:'Space Mono',monospace;cursor:pointer;padding:6px;}
  .mv{display:flex;flex-direction:column;gap:3px;flex:none;}
  .mv button{width:26px;height:21px;border:1px solid #2c313a;background:#1e2228;color:#9aa3ad;
    border-radius:6px;font-size:10px;line-height:1;cursor:pointer;padding:0;}
  .mv button:disabled{opacity:.25;cursor:default;}
  .sw{position:relative;width:44px;height:24px;flex:none;}
  .sw input{opacity:0;width:100%;height:100%;margin:0;cursor:pointer;}
  .sw span{position:absolute;inset:0;border-radius:999px;background:rgba(255,255,255,.12);transition:.15s;}
  .sw span::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:.15s;}
  .sw input:checked + span{background:var(--live);}
  .sw input:checked + span::after{transform:translateX(20px);}
  .add{margin-top:22px;}
  .add label{display:block;font-size:12px;color:#9aa3ad;margin:10px 0 5px;}
  .add input{width:100%;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);border-radius:10px;
    color:#fff;padding:11px 12px;font-size:14px;font-family:'Archivo',sans-serif;outline:none;}
  .add input:focus{border-color:rgba(255,255,255,.28);}
  .btnrow{display:flex;gap:10px;margin-top:16px;}
  .btn{flex:1;border:none;border-radius:12px;padding:13px;font-size:14px;font-weight:800;font-family:'Archivo',sans-serif;cursor:pointer;}
  .btn.primary{background:var(--live);color:#fff;}
  .btn.ghost{background:rgba(255,255,255,.07);color:#fff;border:1px solid rgba(255,255,255,.14);}
  .reset{display:block;width:100%;margin-top:12px;background:none;border:none;color:#8b939d;
    font-family:'Space Mono',monospace;font-size:11px;cursor:pointer;text-decoration:underline;}
  .rgpd{margin:10px 0 0;font-size:11px;line-height:1.5;color:#6b7280;}
  .rgpd a{color:#8b939d;}
  .addstatus{min-height:16px;margin:10px 0 0;font-size:12px;}
  .addstatus.ok{color:#4ade80;}
  .addstatus.err{color:#f87171;}
  .rssdirs{margin-top:16px;padding-top:14px;border-top:1px solid rgba(255,255,255,.06);font-size:12px;color:#9aa3ad;}
  .rssdirs a{color:#6ea8fe;text-decoration:none;}
  .rssdirs a:hover{text-decoration:underline;}

  /* ===== mode MUR : kiosque multicolore (desktop) ===== */
  @media (min-width:900px){
    .viewbtn{display:flex;align-items:center;justify-content:center;}
    body.wall .tv-set{width:min(980px, calc(94vw - 270px));}
    .feed.wall{scroll-snap-type:none;display:grid;
      grid-template-columns:repeat(2,1fr);gap:14px;
      padding:118px 16px 52px;align-content:start;grid-auto-flow:dense;}
    .feed.wall .slide{height:330px;border-radius:16px;overflow:hidden;
      scroll-snap-align:none;scroll-snap-stop:normal;box-shadow:0 10px 26px rgba(0,0,0,.35);
      border:1px solid color-mix(in oklab, var(--ac, #666) 45%, transparent);
      border-top:4px solid var(--ac, #666);}
    /* la Une : le billet le plus récent en double format */
    .feed.wall .slide:first-child{grid-column:1/-1;height:auto;min-height:430px;}
    .feed.wall .slide:first-child .ttl{font-size:32px;line-height:1.05;}
    .feed.wall .slide:first-child .resume{display:-webkit-box;}
    .feed.wall .slide.msg{grid-column:1/-1;height:180px;border:none;box-shadow:none;}
    .feed.wall .lower{padding:14px 14px 13px;gap:8px;transform:none;opacity:1;
      background:linear-gradient(180deg, transparent, color-mix(in oklab, var(--ac, #000) 14%, rgba(6,6,8,.92)) 55%);}
    .feed.wall .ttl{font-size:19px;letter-spacing:-.3px;line-height:1.12;}
    .feed.wall .resume{display:none;}
    .feed.wall .actions .act{display:none;}
    .feed.wall .go{padding:8px 12px;font-size:10px;}
    .feed.wall .srcbadge{padding:5px 11px 5px 6px;gap:8px;}
    .feed.wall .srcbadge .logo{width:28px;height:28px;font-size:11px;}
    .feed.wall .srcbadge .meta .v{font-size:12px;}
    .feed.wall .kick{font-size:9px;padding:3px 7px;}
    .feed.wall .cap span{transform:none;}
    body.wall .ticker{bottom:0;}
  }

  /* ===== écrans courts : le minimum pour ne pas toucher le bandeau haut (logos et boutons inchangés) ===== */
  @media (max-height:700px){
    .lower{gap:8px;padding-top:12px;}
    .ttl{font-size:26px;}
    .resume{-webkit-line-clamp:2;}
  }
