/*
Theme Name: Adere-Rek
Theme URI: https://adere-rek.com
Author: ADERE — And Défaar Rewmi
Author URI: https://adere-rek.com
Description: Thème éditorial pour Rew Mi · Lecture — bibliothèque vivante de la pensée et de la fabrique de la cité. Écrits, podcasts, vidéos, météo de la communauté et canal en continu. Design Adere-Rek (terre, latérite, indigo).
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: adere-rek
*/

  :root{
    --sand:#F1E9DA;--sand-2:#E7DCC7;--paper:#FBF7EF;
    --laterite:#B14328;--laterite-d:#8E3320;--indigo:#222F52;--indigo-2:#37487A;
    --ochre:#C98A2E;--ink:#241D17;--ink-soft:#5B5046;--line:#D8CBB2;--good:#3E7C5A;
    --display:"Bricolage Grotesque",system-ui,sans-serif;--serif:"Spectral",Georgia,serif;--ui:"Inter",system-ui,sans-serif;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{background:var(--sand);color:var(--ink);font-family:var(--ui);line-height:1.55;-webkit-font-smoothing:antialiased}
  ::selection{background:var(--ochre);color:var(--paper)}

  .app{display:grid;grid-template-columns:250px 1fr;min-height:100vh;transition:grid-template-columns .26s ease}
  .app.collapsed{grid-template-columns:66px 1fr}

  /* ---------- bande supérieure (fixe) ---------- */
  .topband{position:sticky;top:0;z-index:60;display:flex;align-items:center;justify-content:space-between;
           height:60px;padding:0 22px;background:var(--sand);border-bottom:1px solid var(--line)}
  .tb-left{display:flex;align-items:center;gap:6px}
  .burger{display:grid;place-items:center;width:38px;height:38px;border:0;border-radius:10px;background:transparent;color:var(--ink-soft);cursor:pointer;transition:.15s}
  .burger:hover{background:var(--sand-2);color:var(--ink)}
  .topband .brand{padding:6px 0;background:transparent}
  .topband .brand:hover{background:transparent}
  .topband .brand .glyph{width:32px;height:32px}
  .topband .brand b{font-size:1.22rem}
  .tb-id{text-align:right;line-height:1.05}
  .tb-id b{display:block;font-family:var(--display);font-weight:600;font-size:1rem;letter-spacing:.04em;color:var(--indigo)}
  .tb-id small{display:block;font-family:var(--ui);font-weight:300;font-size:.66rem;letter-spacing:.03em;color:var(--ink-soft);margin-top:1px}

  /* ---------- repli barre latérale ---------- */
  .app.collapsed .side{padding:14px 8px;align-items:center}
  .app.collapsed .lbl{opacity:0;height:0;padding:0;margin:0;overflow:hidden}
  .app.collapsed .navitem{justify-content:center;padding:11px 0;width:46px}
  .app.collapsed .navitem .ntx{display:none}
  .app.collapsed .subnav{display:none}
  .app.collapsed .acct{justify-content:center;padding:10px 0}
  .app.collapsed .acct .actx{display:none}

  /* ---------- sidebar ---------- */
  .side{position:sticky;top:60px;height:calc(100vh - 60px);background:var(--paper);border-right:1px solid var(--line);
        display:flex;flex-direction:column;padding:18px 14px;gap:6px;overflow-x:hidden;overflow-y:auto}
  .side .lbl{font-size:.66rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);padding:6px 10px 2px}
  .brand{display:flex;align-items:center;gap:10px;cursor:pointer;padding:8px 10px;border-radius:12px;transition:.15s}
  .brand:hover{background:var(--sand)}
  .brand .glyph{width:30px;height:30px;flex:0 0 auto}
  .brand b{font-family:var(--display);font-weight:600;font-size:1.06rem;letter-spacing:-.02em;line-height:1}
  .brand b span{font-weight:300;color:var(--laterite)}
  .navitem{display:flex;align-items:center;gap:11px;font-size:.9rem;font-weight:500;color:var(--ink-soft);white-space:nowrap;
           padding:10px 12px;border-radius:11px;cursor:pointer;transition:.15s;border:0;background:transparent;width:100%;text-align:left;font-family:var(--ui)}
  .navitem svg{flex:0 0 auto;opacity:.8}
  .navitem:hover{background:var(--sand);color:var(--ink)}
  .navitem.on{background:var(--indigo);color:var(--paper)}
  .navitem.on svg{opacity:1}
  .subnav{display:none;flex-direction:column;margin:2px 0 6px 30px;padding-left:10px;border-left:1.5px solid var(--line);gap:1px}
  .subnav.show{display:flex}
  .subnav button{font-family:var(--ui);font-size:.8rem;color:var(--ink-soft);background:transparent;border:0;text-align:left;padding:7px 10px;border-radius:8px;cursor:pointer}
  .subnav button:hover{background:var(--sand);color:var(--laterite)}
  .side .spacer{flex:1}
  .side .acct{display:flex;align-items:center;gap:10px;padding:10px;border-top:1px solid var(--line);font-size:.8rem;color:var(--ink-soft)}
  .side .acct .dot{width:30px;height:30px;border-radius:50%;background:var(--laterite);color:var(--paper);display:grid;place-items:center;font-family:var(--display);font-weight:600;font-size:.85rem}

  /* ---------- main ---------- */
  .main{min-width:0}
  .wrap{max-width:1060px;margin:0 auto;padding:34px 30px 60px}
  .view{display:none;animation:fade .4s ease}
  .view.on{display:block}
  @keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
  .eyebrow{font-family:var(--ui);font-size:.72rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--laterite)}
  h1.disp{font-family:var(--display);font-weight:500;letter-spacing:-.025em;line-height:1.03}
  h2.sec{font-family:var(--display);font-weight:500;font-size:1.5rem;letter-spacing:-.02em;margin-bottom:4px}
  .lead{font-family:var(--serif);font-size:1.1rem;color:var(--ink-soft)}
  .btn{font-family:var(--ui);font-weight:600;font-size:.88rem;border:0;border-radius:99px;padding:12px 20px;cursor:pointer;transition:.18s;display:inline-flex;gap:8px;align-items:center}
  .btn.fill{background:var(--laterite);color:var(--paper)}.btn.fill:hover{background:var(--laterite-d)}
  .btn.ghost{background:transparent;color:var(--ink);border:1.5px solid var(--ink)}.btn.ghost:hover{background:var(--ink);color:var(--sand)}

  /* ---------- accueil ---------- */
  .hero{position:relative;overflow:hidden;border-radius:20px;background:var(--sand-2);padding:48px 38px;margin-bottom:14px}
  .contour{position:absolute;inset:0;width:100%;height:100%;opacity:.5;pointer-events:none}
  .hero-in{position:relative;max-width:620px}
  h1.big{font-size:clamp(2rem,4.4vw,3.2rem)}
  .hero .lead{margin:18px 0 26px;font-size:1.16rem;line-height:1.5}
  .cta-row{display:flex;gap:11px;flex-wrap:wrap}
  .strip{display:flex;gap:26px;flex-wrap:wrap;padding:16px 0 0;margin-top:30px;border-top:1px solid var(--line)}
  .stat b{font-family:var(--display);font-weight:600;font-size:1.4rem;display:block;line-height:1}
  .stat small{font-size:.72rem;color:var(--ink-soft);letter-spacing:.04em}

  /* ---------- cartes catalogue (3/ligne) ---------- */
  .g3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:18px}
  @media(max-width:760px){.g3{grid-template-columns:1fr}}
  .card{background:var(--paper);border:1px solid var(--line);border-radius:14px;overflow:hidden;transition:.2s;cursor:pointer;display:flex;flex-direction:column}
  .card:hover{transform:translateY(-3px);box-shadow:0 12px 26px -18px rgba(36,29,23,.45);border-color:var(--laterite)}
  .card .band{height:86px;position:relative;display:grid;place-items:center}
  .card .kind{position:absolute;top:8px;left:8px;font-size:.6rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:var(--paper);color:var(--ink);padding:3px 8px;border-radius:99px}
  .card .price{position:absolute;bottom:8px;right:8px;font-family:var(--display);font-weight:600;font-size:.8rem;background:var(--ink);color:var(--sand);padding:3px 9px;border-radius:99px}
  .card .body{padding:12px 13px 14px}
  .card h3{font-family:var(--serif);font-weight:500;font-size:1rem;line-height:1.2;margin-bottom:5px}
  .card p{font-size:.78rem;color:var(--ink-soft);line-height:1.42}
  .card .meta{display:flex;gap:10px;margin-top:9px;font-size:.68rem;color:var(--ink-soft)}
  .tex-a{background:linear-gradient(135deg,#2a3760,#4a5c93)}.tex-b{background:linear-gradient(135deg,#b14328,#d08144)}
  .tex-c{background:linear-gradient(135deg,#c98a2e,#e0b35f)}.tex-d{background:linear-gradient(135deg,#3E7C5A,#6aa886)}
  .tex-e{background:linear-gradient(135deg,#6a3b6e,#9c6aa0)}.tex-f{background:linear-gradient(135deg,#34607a,#5d97b5)}

  /* ---------- lecture ---------- */
  .read-wrap{display:grid;grid-template-columns:1fr 308px;gap:34px;align-items:start;margin-top:26px}
  @media(max-width:880px){.read-wrap{grid-template-columns:1fr}}
  .article{font-family:var(--serif);font-size:1.1rem;line-height:1.72}
  .article h1{font-family:var(--display);font-weight:500;font-size:2rem;letter-spacing:-.02em;line-height:1.05;margin-bottom:8px}
  .article .resume{font-style:italic;color:var(--laterite-d);border-left:3px solid var(--ochre);padding-left:15px;margin:16px 0 24px;font-size:1.04rem}
  .article p{margin-bottom:16px}
  .gate .fade-mask{position:relative;max-height:120px;overflow:hidden}
  .gate .fade-mask::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent,var(--sand) 92%)}
  .gate-card{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:22px;text-align:center;margin-top:-18px;position:relative;z-index:2}
  .gate-card h3{font-family:var(--display);font-weight:500;font-size:1.2rem;margin-bottom:6px}
  .gate-card p{font-size:.86rem;color:var(--ink-soft);max-width:380px;margin:0 auto 16px}

  aside.rail{position:sticky;top:76px;display:flex;flex-direction:column;gap:14px}
  .panel{background:var(--paper);border:1px solid var(--line);border-radius:15px;padding:17px;scroll-margin-top:20px;transition:box-shadow .4s,border-color .4s}
  .panel.flash{border-color:var(--laterite);box-shadow:0 0 0 3px rgba(177,67,40,.18)}
  .panel h4{font-family:var(--ui);font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:12px}

  /* paiement en petits cercles */
  .pay-circles{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin:4px 0 6px}
  .pc{display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;width:62px}
  .pc .disc{width:50px;height:50px;border-radius:50%;display:grid;place-items:center;box-shadow:0 4px 12px -5px rgba(0,0,0,.3);transition:.18s;border:2px solid var(--paper)}
  .pc:hover .disc{transform:translateY(-3px) scale(1.05)}
  .pc small{font-size:.66rem;color:var(--ink-soft);text-align:center;line-height:1.15}
  .disc.wave{background:#15C3E6}.disc.om{background:#FF7900}.disc.libre{background:radial-gradient(circle at 35% 30%,#E4B45C,#C98A2E)}
  .disc.logo{background:#fff;padding:0;overflow:hidden}
  .disc.logo img{width:100%;height:100%;object-fit:cover;display:block}
  .pay-note{font-size:.68rem;color:var(--ink-soft);text-align:center;margin-top:6px;line-height:1.4;font-style:italic}
  .qr{width:118px;height:118px;margin:8px auto 0;display:block;background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:7px}
  .pc.active .disc{box-shadow:0 0 0 3px var(--ochre),0 4px 12px -5px rgba(0,0,0,.3)}
  .pc.active small{color:var(--ink);font-weight:700}
  .qr-head{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:8px}
  .qr-head img{width:22px;height:22px;border-radius:5px;object-fit:cover}
  .qr-head span{font-family:var(--display);font-weight:600;font-size:.92rem;color:var(--ink)}
  .qr-amount{text-align:center;font-family:var(--display);font-weight:600;font-size:1.16rem;color:var(--laterite);margin-top:6px}
  .qr-cap{text-align:center;font-size:.7rem;color:var(--ink-soft);margin-top:5px;line-height:1.45}

  .ledger{font-size:.78rem;color:var(--ink-soft);line-height:1.7}
  .ledger .row{display:flex;justify-content:space-between;gap:10px;padding:5px 0;border-bottom:1px dashed var(--line)}
  .ledger .row:last-child{border:0}.ledger b{color:var(--ink);font-weight:600}
  .wmk{display:flex;align-items:center;gap:9px;font-size:.74rem;color:var(--ink-soft);background:var(--sand-2);border-radius:10px;padding:10px 12px;margin-top:12px}
  .gift{background:linear-gradient(135deg,var(--indigo),var(--indigo-2));color:var(--paper);border-radius:15px;padding:17px;scroll-margin-top:20px;transition:box-shadow .4s}
  .gift.flash{box-shadow:0 0 0 3px rgba(201,138,46,.5)}
  .gift h4{color:rgba(255,255,255,.7)}
  .gift .pr{font-family:var(--display);font-weight:600;font-size:1.9rem;line-height:1;margin:4px 0}
  .gift .pr s{font-size:1rem;font-weight:400;opacity:.55;margin-right:8px}
  .gift .save{font-size:.76rem;color:#FFD9A0}
  .gift button{margin-top:13px;width:100%;background:var(--ochre);color:#2a1400;border:0;border-radius:10px;padding:11px;font-family:var(--ui);font-weight:600;cursor:pointer}
  .gift .note{font-size:.7rem;opacity:.75;margin-top:8px;line-height:1.4}
  .footnote{background:var(--sand-2);border:1px dashed var(--line);border-radius:12px;padding:12px 15px;font-size:.76rem;color:var(--ink-soft);margin-top:18px;line-height:1.5}
  .footnote b{color:var(--laterite-d)}

  /* ---------- podcasts ---------- */
  .pod-list{display:flex;flex-direction:column;gap:11px;margin-top:22px}
  .pod{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:13px 15px;display:grid;grid-template-columns:46px 1fr auto;gap:14px;align-items:center;cursor:pointer;transition:.18s}
  .pod:hover{border-color:var(--laterite);box-shadow:0 8px 20px -16px rgba(36,29,23,.5)}
  .pod .pp{width:46px;height:46px;border-radius:50%;background:var(--indigo);color:var(--paper);display:grid;place-items:center}
  .pod.playing .pp{background:var(--laterite)}
  .pod h3{font-family:var(--serif);font-weight:500;font-size:1.02rem}
  .pod .sub{font-size:.74rem;color:var(--ink-soft);margin-top:2px;display:flex;gap:11px;flex-wrap:wrap}
  .pod .sub .live{color:var(--good);font-weight:600}.pod .sub .live::before{content:"●";margin-right:3px;animation:blink 1.6s infinite}
  @keyframes blink{50%{opacity:.3}}
  .pbar{height:4px;background:var(--sand-2);border-radius:9px;margin-top:8px;overflow:hidden}
  .pbar i{display:block;height:100%;background:var(--laterite);border-radius:9px;width:0;transition:width .25s linear}
  .pod-ctl{display:flex;gap:6px;align-items:center}
  .chip{font-family:var(--ui);font-size:.72rem;font-weight:600;border:1px solid var(--line);background:var(--paper);color:var(--ink-soft);border-radius:99px;padding:5px 10px;cursor:pointer}
  .chip:hover{border-color:var(--ink);color:var(--ink)}
  .transcript{display:none;grid-column:1/-1;margin-top:6px;font-family:var(--serif);font-size:.92rem;color:var(--ink-soft);background:var(--sand);border-radius:10px;padding:12px 14px;line-height:1.6}
  .pod.open .transcript{display:block}

  /* ---------- vidéos ---------- */
  .vid{position:relative;border-radius:14px;overflow:hidden;cursor:pointer}
  .vid .scene{height:140px;position:relative;display:grid;place-items:center;color:var(--paper)}
  .vid .play-ic{transition:.25s;opacity:.9}
  .vid:hover .play-ic{transform:scale(1.18);opacity:1}
  .vid .preview-tag{position:absolute;top:8px;left:8px;font-size:.62rem;font-weight:600;background:rgba(0,0,0,.55);color:#fff;padding:3px 8px;border-radius:99px;opacity:0;transition:.2s}
  .vid:hover .preview-tag{opacity:1}
  .vid .dur{position:absolute;bottom:8px;right:8px;font-size:.64rem;font-weight:600;background:rgba(0,0,0,.6);color:#fff;padding:2px 7px;border-radius:6px}
  .vid .seen{position:absolute;top:8px;right:8px;font-size:.62rem;font-weight:600;background:var(--good);color:#fff;padding:3px 8px;border-radius:99px;display:none;align-items:center;gap:4px}
  .vid.viewed .seen{display:flex}
  .vid .vbar{position:absolute;left:0;right:0;bottom:0;height:4px;background:rgba(0,0,0,.3)}
  .vid .vbar i{display:block;height:100%;background:var(--ochre)}
  .vid .vbody{padding:12px 13px 14px;background:var(--paper)}
  .vid h3{font-family:var(--serif);font-weight:500;font-size:1rem;line-height:1.2}
  .vid .desc{font-size:.78rem;color:var(--ink-soft);margin-top:5px;line-height:1.45}
  .vid .tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:9px}
  .tag{font-size:.66rem;font-weight:600;color:var(--laterite-d);background:rgba(177,67,40,.09);padding:3px 8px;border-radius:99px}
  .tag.music{color:var(--indigo-2);background:rgba(34,47,82,.09)}
  .vid .vmeta{font-size:.68rem;color:var(--ink-soft);margin-top:9px;display:flex;justify-content:space-between}

  /* ---------- météo de la communauté ---------- */
  .meteo-grid{display:grid;grid-template-columns:1.55fr 1fr;gap:22px;margin-top:24px}
  @media(max-width:880px){.meteo-grid{grid-template-columns:1fr}}
  .mapwrap{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:14px;position:relative;overflow:hidden}
  .land{fill:#E7DCC7;stroke:#D3C4A8;stroke-width:.5}
  .ocean{fill:#F4EEE1}
  .rhizo{stroke:var(--indigo);stroke-width:1;fill:none;opacity:.5;stroke-dasharray:3 4}
  .node{fill:var(--laterite)}
  .ring{fill:none;stroke:var(--laterite);opacity:.5;transform-box:fill-box;transform-origin:center;animation:ring 2.6s ease-out infinite}
  @keyframes ring{0%{r:3;opacity:.6}100%{r:16;opacity:0}}
  .legend{display:flex;gap:14px;flex-wrap:wrap;font-size:.74rem;color:var(--ink-soft);margin-top:12px;padding:0 4px}
  .legend span{display:flex;align-items:center;gap:6px}
  .key{width:11px;height:11px;border-radius:3px;display:inline-block}
  .rhizo-note{background:linear-gradient(135deg,var(--indigo),var(--indigo-2));color:var(--paper);border-radius:14px;padding:16px 18px;margin-top:4px}
  .rhizo-note .q{font-family:var(--serif);font-style:italic;font-size:1.02rem;line-height:1.5}
  .rhizo-note .src{font-size:.72rem;opacity:.7;margin-top:8px;letter-spacing:.04em}
  .zone-list{display:flex;flex-direction:column;gap:9px;margin-top:14px}
  .zone{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:11px 14px}
  .zone .zh{display:flex;justify-content:space-between;font-size:.88rem;font-weight:600}
  .zone .zh em{font-style:normal;color:var(--ink-soft);font-weight:500;font-size:.76rem}
  .zone .zb{height:6px;background:var(--sand-2);border-radius:9px;margin-top:7px;overflow:hidden}
  .zone .zb i{display:block;height:100%;border-radius:9px}

  /* ---------- responsive sidebar ---------- */
  @media(max-width:860px){
    .topband{padding:0 16px;height:54px}
    .topband .brand b{font-size:1.05rem}
    .tb-id b{font-size:.9rem}.tb-id small{font-size:.6rem}
    .burger{display:none}
    .app,.app.collapsed{grid-template-columns:1fr}
    .app.collapsed .side{padding:8px 12px;align-items:center}
    .app.collapsed .navitem{width:auto;padding:8px 12px}
    .app.collapsed .navitem .ntx{display:inline}
    .side{position:sticky;top:54px;height:auto;flex-direction:row;align-items:center;overflow-x:auto;padding:8px 12px;gap:4px;z-index:40;backdrop-filter:blur(8px);background:rgba(251,247,239,.92)}
    .side .lbl,.subnav,.side .spacer,.side .acct{display:none}
    .navitem{flex:0 0 auto;padding:8px 12px}
    .wrap{padding:22px 18px 50px}
    .read-wrap{grid-template-columns:1fr}
    .g3{grid-template-columns:repeat(2,1fr)}
  }
  /* ====== Canal des Initiatives Interstitielles (Live) ====== */
  .livebox{position:fixed;z-index:75;right:18px;bottom:18px;width:25vw;min-width:300px;max-width:420px;background:#15110D;color:#F1E9DA;border:1px solid rgba(255,255,255,.12);border-radius:14px;overflow:hidden;box-shadow:0 18px 50px -18px rgba(0,0,0,.7);font-family:var(--ui);transition:width .3s,right .3s,bottom .3s,transform .3s}
  .livebox.hidden{display:none}
  .livebox.mini{width:212px;min-width:0}
  .live-screen{position:relative;aspect-ratio:16/9;background:#000;overflow:hidden;cursor:pointer}
  .live-scene{position:absolute;inset:0;background:linear-gradient(120deg,#222F52,#B14328,#C98A2E,#222F52);background-size:300% 300%;animation:livePan 16s ease-in-out infinite}
  @keyframes livePan{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
  .live-scene.paused{animation-play-state:paused;filter:grayscale(.6) brightness(.55)}
  .live-grain{position:absolute;inset:0;opacity:.12;background-image:radial-gradient(rgba(255,255,255,.5) 1px,transparent 1px);background-size:4px 4px;mix-blend-mode:overlay;pointer-events:none}
  .live-badge{position:absolute;top:8px;left:8px;display:flex;align-items:center;gap:5px;background:rgba(0,0,0,.55);padding:3px 9px;border-radius:99px;font-size:.62rem;font-weight:700;letter-spacing:.08em}
  .live-badge .d{width:7px;height:7px;border-radius:50%;background:#ff3b30;animation:blink 1.4s infinite}
  .live-badge.diff{background:rgba(201,138,46,.9);color:#241D17}
  .live-badge.diff .d{background:#241D17;animation:none}
  .live-now{position:absolute;left:9px;right:9px;bottom:9px;font-size:.72rem;text-shadow:0 1px 4px rgba(0,0,0,.7);pointer-events:none}
  .live-now b{font-family:var(--serif);font-weight:500;font-size:.94rem;display:block;line-height:1.15}
  .live-now em{font-style:normal;opacity:.82;font-size:.68rem}
  .live-progbar{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,.18)}
  .live-progbar i{display:block;height:100%;background:#ff3b30;width:0%}
  .live-big{position:absolute;inset:0;display:none;place-items:center;background:rgba(0,0,0,.3)}
  .livebox.paused .live-big{display:grid}
  .live-ctl{display:flex;align-items:center;gap:7px;padding:7px 9px;background:#1d1812;border-top:1px solid rgba(255,255,255,.08)}
  .live-ctl button{background:transparent;border:0;color:#E7DCC7;cursor:pointer;display:grid;place-items:center;padding:4px;border-radius:7px;flex:0 0 auto}
  .live-ctl button:hover{background:rgba(255,255,255,.12);color:#fff}
  .live-seek{flex:1;height:6px;background:rgba(255,255,255,.14);border-radius:9px;position:relative;cursor:pointer;min-width:38px;touch-action:none}
  .live-seek .pos{position:absolute;left:0;top:0;bottom:0;background:#ff3b30;border-radius:9px;width:100%}
  .live-seek .head{position:absolute;top:50%;left:100%;transform:translate(-50%,-50%);width:11px;height:11px;border-radius:50%;background:#fff;box-shadow:0 0 0 2px rgba(0,0,0,.3)}
  .live-time{font-size:.6rem;color:#B6A98F;min-width:54px;text-align:right;white-space:nowrap}
  .live-pop-wrap{position:relative}
  .live-pop{position:absolute;bottom:32px;right:0;background:#241C18;border:1px solid rgba(255,255,255,.14);border-radius:10px;padding:5px;display:none;min-width:140px;z-index:6}
  .live-pop.open{display:block}
  .live-pop button{display:flex;justify-content:space-between;width:100%;font-size:.72rem;padding:6px 9px;color:#E7DCC7;border-radius:6px}
  .live-pop button.sel{color:#fff;background:rgba(201,138,46,.28)}
  .live-pop .h{font-size:.56rem;letter-spacing:.1em;text-transform:uppercase;color:#8C8270;padding:4px 9px 2px}
  .live-vol{display:flex;align-items:center}
  .live-vol input{width:52px;accent-color:#C98A2E;cursor:pointer}
  .live-ticker{display:flex;align-items:center;gap:8px;background:#0E0B08;border-top:1px solid rgba(255,255,255,.08);padding:5px 0;overflow:hidden}
  .live-ticker .tg{flex:0 0 auto;margin-left:9px;font-size:.56rem;font-weight:700;letter-spacing:.05em;background:#B14328;color:#fff;padding:2px 7px;border-radius:5px}
  .live-ticker .trk{flex:1;overflow:hidden;white-space:nowrap;margin-right:6px}
  .live-ticker .trk span{display:inline-block;padding-left:100%;animation:tick 28s linear infinite;font-size:.7rem;color:#D9CDB6}
  @keyframes tick{from{transform:translateX(0)}to{transform:translateX(-100%)}}
  .livebox.mini .live-now,.livebox.mini .live-ticker,.livebox.mini .live-time,.livebox.mini .live-seek{display:none}
  .livebox.mini .live-ctl{padding:5px 7px;gap:5px;justify-content:space-between}
  .live-backdrop{position:fixed;inset:0;background:rgba(8,6,4,.82);backdrop-filter:blur(3px);z-index:74;display:none}
  .live-backdrop.open{display:block}
  .livebox.cinema{right:50%;bottom:50%;transform:translate(50%,50%);width:min(88vw,1080px);max-width:none}
  .livepill{position:fixed;right:18px;bottom:18px;z-index:75;display:none;align-items:center;gap:8px;background:#15110D;color:#F1E9DA;border:0;border-radius:99px;padding:10px 16px;cursor:pointer;box-shadow:0 12px 30px -12px rgba(0,0,0,.6);font-family:var(--ui);font-weight:600;font-size:.82rem}
  .livepill.show{display:flex}
  .livepill .d{width:8px;height:8px;border-radius:50%;background:#ff3b30;animation:blink 1.4s infinite}
  .live-hero{background:linear-gradient(135deg,#15110D,#2a2236);color:#F1E9DA;border-radius:18px;padding:30px 28px;position:relative;overflow:hidden}
  .live-hero .tagline{font-family:var(--serif);font-style:italic;font-size:1.12rem;color:#E7C98F;max-width:580px;margin-top:10px;line-height:1.5}
  .grille{display:flex;flex-direction:column;gap:10px;margin-top:6px}
  .gr{display:grid;grid-template-columns:78px 1fr auto;gap:12px;align-items:center;background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:11px 14px}
  .gr.onair{border-color:var(--laterite);box-shadow:0 0 0 2px rgba(177,67,40,.12)}
  .gr .slot{font-family:var(--display);font-weight:600;font-size:.8rem;color:var(--ink-soft)}
  .gr h4{font-family:var(--serif);font-weight:500;font-size:1rem}
  .gr .src{font-size:.72rem;color:var(--ink-soft);margin-top:2px}
  .gr .tagair{font-size:.6rem;font-weight:700;color:#fff;background:var(--laterite);padding:3px 8px;border-radius:99px;white-space:nowrap}
  .origins{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
  .origins span{font-size:.74rem;color:#E7DCC7;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:99px;padding:5px 11px}
  @media(max-width:860px){.livebox{left:10px;right:10px;width:auto;max-width:none}.livebox.mini{left:auto;width:168px}.gr{grid-template-columns:60px 1fr}.gr .tagair{display:none}}