/* Babilo — jeu de cartes visuelles ; styles isolés */
body:has(#view-game.active #bp-root) #app>.appbar,body:has(#view-game.active #bp-root) #view-game>.page-head{display:none!important}
body:has(#view-game.active #bp-root) #view-game,body:has(#view-game.active #bp-root) #gameArea{max-width:none!important;width:100%!important;padding:0!important;margin:0!important}
#bp-root{--accent:#51eeff;--shade:#013f7d;position:relative;isolation:isolate;box-sizing:border-box;min-height:100vh;padding:18px clamp(10px,2vw,32px) 32px;color:white!important;font-family:system-ui,'Segoe UI',sans-serif;background:radial-gradient(ellipse at 54% 0%,#00a4db66,transparent 56%),radial-gradient(circle at 8% 70%,#1155bc80,transparent 44%),linear-gradient(145deg,var(--shade),#07123b 85%);overflow:hidden}
#bp-root *{box-sizing:border-box}
#bp-root:before{content:"";pointer-events:none;position:absolute;inset:0;background:radial-gradient(circle at 13% 28%,#ffffff66 0 2px,transparent 3px),radial-gradient(circle at 86% 72%,#d3ffff77 0 2px,transparent 4px),radial-gradient(circle at 70% 13%,#ffffff55 0 2px,transparent 3px);background-size:180px 140px,270px 210px,320px 250px;opacity:.6;z-index:-1}
#bp-root[data-theme="cosmos"]{--accent:#ad8fff;--shade:#0a0d41;background:radial-gradient(ellipse at 55% 0%,#5a3de266,transparent 70%),linear-gradient(135deg,#0d1655,#060a25 85%)}
#bp-root[data-theme="jardin"]{--accent:#8ef78a;--shade:#074b34;background:radial-gradient(ellipse at 60% 0%,#00ab7970,transparent 65%),linear-gradient(145deg,#054d44,#061b39 85%)}
#bp-root[data-theme="musique"]{--accent:#ef8cff;--shade:#320457;background:radial-gradient(ellipse at 45% 0%,#8839c48a,transparent 60%),linear-gradient(135deg,#330557,#090c3e 85%)}
#bp-root[data-theme="corporeo"]{--accent:#50e3ff;--shade:#043d6b;background:radial-gradient(ellipse at 45% 0%,#0099cb75,transparent 60%),linear-gradient(145deg,#043e6d,#061037 85%)}
#bp-root[data-theme="faune"]{--accent:#aaff7d;--shade:#19451d;background:radial-gradient(ellipse at 45% 0%,#72b71968,transparent 60%),linear-gradient(150deg,#143c25,#061d33 85%)}
#bp-root .bp-head{display:flex;align-items:center;gap:20px;margin-bottom:20px;position:relative;z-index:2}
#bp-root .bp-brand{display:flex;align-items:center;gap:12px;min-width:230px;flex:none}
#bp-root .bp-mascot{width:85px;height:85px;object-fit:contain;filter:drop-shadow(0 0 11px #4ec8ff)}
#bp-root .bp-brand-name{display:block;color:#ffde44;font-weight:1000;font-size:clamp(29px,3vw,50px);line-height:1;text-shadow:2px 3px #5f1e74,0 0 17px #ffc637}
#bp-root .bp-brand-caption{display:block;width:max-content;font-weight:950;background:linear-gradient(120deg,#7830a2,#301166);padding:4px 13px;border:2px solid #ffbb79;border-radius:12px;box-shadow:0 2px 10px #df54ff}
#bp-root button{cursor:pointer;color:inherit;font-family:inherit}
#bp-root .bp-top-tabs{display:flex;flex-wrap:wrap;align-items:stretch;justify-content:center;gap:8px;flex:1}
#bp-root .bp-tab{display:flex;align-items:center;flex-direction:column;justify-content:center;gap:4px;min-width:110px;flex:1;max-width:210px;padding:7px 8px;border:2px solid #2dcaff;border-radius:17px;background:linear-gradient(#0877bc,#03245c);box-shadow:inset 0 2px #9deeff99,0 4px #001d57;font-size:13px;font-weight:900;text-align:center;min-height:62px}
#bp-root .bp-tab img{width:38px;height:35px;border-radius:8px;object-fit:cover;box-shadow:0 0 7px #55dfff99}
#bp-root .bp-tab small{font-weight:800;font-size:10px;color:#dcf5ff}
#bp-root .bp-tab.is-current{border-color:#ffdb29;box-shadow:0 0 18px #ffb800,inset 0 2px #fff3aa}
#bp-root .bp-body{display:grid;grid-template-columns:minmax(175px,220px) minmax(0,1fr);gap:18px}
#bp-root .bp-aside{display:flex;flex-direction:column;gap:8px;align-items:stretch}
#bp-root .bp-aside h2{font-size:19px;font-weight:950;text-align:center;padding:10px;margin:0;background:#002558a6;border:2px solid #75dcff;border-radius:14px}
#bp-root .bp-aside #bp-list{display:flex;flex-direction:column;gap:10px}
#bp-root .bp-aside .bp-tab{flex-direction:row;max-width:none;min-height:56px;justify-content:flex-start;font-size:12px;text-align:left}
#bp-root .bp-aside .bp-tab img{width:48px;height:46px;flex:none}
#bp-root .bp-aside .bp-tab span{flex:1}
#bp-root .bp-home{margin-top:auto;min-height:62px;border-radius:20px;border:3px solid #ffcf43;background:linear-gradient(#0a96ee,#06428c);font-size:24px;font-weight:1000;box-shadow:0 0 13px #09bfff}
#bp-root .bp-center{min-width:0}
#bp-root .bp-album-head{text-align:center;margin:0 0 14px}
#bp-root .bp-album-head h1{font-size:clamp(28px,3.6vw,48px);font-weight:1000;margin:0;color:white;text-shadow:0 4px #04133a,0 0 18px var(--accent)}
#bp-root .bp-album-head p{margin:3px 0 8px;font-size:14px;color:#d7f9ff;font-weight:650}
#bp-root .bp-progress{max-width:420px;margin:auto}
#bp-root .bp-progress-text{font-size:15px;font-weight:900;display:block}
#bp-root .bp-bar{background:#00234b;border:3px solid #7df8ff;height:17px;border-radius:18px;margin:4px auto 0;box-shadow:0 0 10px #50e4ff99;overflow:hidden}
#bp-root .bp-bar span{display:block;height:100%;width:0;background:linear-gradient(90deg,#00d451,#c8ff16);transition:width .3s}
#bp-root .bp-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
#bp-root .bp-card{position:relative;isolation:isolate;min-height:clamp(172px,19vw,265px);border:3px solid #61e4ff;border-radius:16px;background:#001e53;overflow:hidden;padding:0;display:flex;flex-direction:column;justify-content:flex-end;box-shadow:0 0 8px #2fc2ff,0 3px 10px #000a26;transition:transform .16s ease,box-shadow .16s ease}
#bp-root .bp-card:hover,#bp-root .bp-card:focus-visible{z-index:10;transform:translateY(-4px);outline:2px solid #fff;box-shadow:0 0 20px #94eaff}
#bp-root .bp-card.bp-rare{border-color:#ff67ed;box-shadow:0 0 11px #e639efaa}
#bp-root .bp-card.bp-silver{border-color:#dcf1ff;box-shadow:0 0 13px #c7f4ffaa}
#bp-root .bp-card.bp-gold{border-color:#ffdb2a;border-width:4px;box-shadow:0 0 17px #ffc01fdd,inset 0 0 10px #ffbe2e}
#bp-root .bp-pic{position:absolute;inset:0;z-index:-1}
#bp-root .bp-pic img{width:100%;height:100%;object-fit:cover;object-position:center}
#bp-root .bp-card.is-locked .bp-pic img{filter:grayscale(1) brightness(.14) blur(2px)}
#bp-root .bp-card.is-locked:after{content:'';position:absolute;inset:0;z-index:-1;background:#00102bb3}
#bp-root .bp-no{position:absolute;top:5px;left:5px;color:white;background:#02266dbd;border:2px solid #e4f7ff;border-radius:10px;padding:1px 6px;font-weight:1000;font-size:13px;text-shadow:0 2px #000}
#bp-root .bp-goldmark{position:absolute;right:2px;top:5px;border-radius:10px;background:linear-gradient(120deg,#ffe77a,#e5971e);font-weight:1000;color:#30200a;padding:3px 5px;font-size:11px;box-shadow:0 0 10px #ffd426}
#bp-root .bp-qty{position:absolute;right:4px;top:28px;background:#0672d4;border:1px solid #d3f7ff;border-radius:8px;padding:1px 5px;font-size:12px;font-weight:900}
#bp-root .bp-lock{font-size:70px;text-shadow:0 0 25px #2bbaff;margin:auto}
#bp-root .bp-card-name{display:block;width:100%;font-weight:950;font-size:clamp(12px,1.12vw,17px);line-height:1.15;padding:8px 3px 2px;text-shadow:0 2px 4px #000,0 2px 4px #000;background:linear-gradient(transparent,#001328a9);text-align:center}
#bp-root .bp-grade{display:block;width:100%;font-size:12px;font-weight:850;padding:0 2px 7px;text-shadow:0 2px 3px #00103e;background:#001328a9}
#bp-root .bp-card.bp-gold .bp-grade{color:#ffe15a}
#bp-root .bp-footer{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;padding:12px 5px;font-size:13px;color:#e6faff;font-weight:800}
#bp-root .bp-modal[hidden]{display:none!important}
#bp-root .bp-modal{position:fixed;inset:0;z-index:100000;display:grid;place-items:center;background:#00132be8;padding:18px;backdrop-filter:blur(8px)}
#bp-root .bp-modal-panel{position:relative;text-align:center;max-height:96vh;overflow:auto;width:min(470px,96vw);border:4px solid #5ad9ff;border-radius:25px;background:radial-gradient(#0a86bf,#041a56 85%);padding:34px 20px 20px;box-shadow:0 0 45px #19baffaa}
#bp-root .bp-modal-panel.bp-gold{border-color:#ffd72e;box-shadow:0 0 45px #fac720aa}
#bp-root .bp-modal-panel.bp-rare{border-color:#ff6fea;box-shadow:0 0 45px #e96cffaa}
#bp-root .bp-modal-art{height:min(60vh,450px);overflow:hidden;border-radius:15px}
#bp-root .bp-modal-art img{width:100%;height:100%;object-fit:cover}
#bp-root .bp-modal-close{position:absolute;right:12px;top:9px;border-radius:50%;background:#09568f;border:2px solid white;padding:6px 12px;font-size:22px}
#bp-root .bp-modal-panel h2{font-size:30px;font-weight:950;margin:8px 0}
#bp-root #bp-modal-rarity{font-size:18px;font-weight:950;color:#ffdf55}
#bp-root .bp-trade{font-weight:900;border:2px solid #80e4ff;border-radius:14px;background:#0672ac;padding:12px 20px}
@media(max-width:1350px){#bp-root .bp-grid{grid-template-columns:repeat(4,minmax(0,1fr))}#bp-root .bp-card{min-height:230px}#bp-root .bp-top-tabs .bp-tab{min-width:100px;font-size:11px}}
@media(max-width:900px){#bp-root .bp-body{grid-template-columns:1fr}#bp-root .bp-aside #bp-list{display:none}#bp-root .bp-aside h2{display:none}#bp-root .bp-aside .bp-home{margin:0 0 8px;font-size:17px;min-height:46px;width:max-content;padding:5px 22px}#bp-root .bp-grid{grid-template-columns:repeat(3,minmax(0,1fr))}#bp-root .bp-card{min-height:205px}#bp-root .bp-brand{min-width:auto}#bp-root .bp-head{flex-wrap:wrap}}
@media(max-width:550px){#bp-root .bp-mascot{width:50px;height:50px}#bp-root .bp-top-tabs .bp-tab{min-width:100px}#bp-root .bp-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}#bp-root .bp-card{min-height:210px}#bp-root .bp-brand-name{font-size:30px}}

/* V28 : l'interface albums masque les barres générales uniquement quand elle est affichée. */
body:has(#view-game.active #bp-root) #app>header,
body:has(#view-game.active #bp-root) #siteTicker,
body:has(#view-game.active #bp-root) #view-game>.page-head,
body:has(#view-game.active #bp-root)>footer {display:none!important}
body:has(#view-game.active #bp-root) #app,
body:has(#view-game.active #bp-root) #view-game {max-width:none!important;width:100%!important}
#bp-root .bp-card-name,#bp-root .bp-grade {position:relative;z-index:1}
#bp-root .bp-aside{position:sticky;top:12px;align-self:start}
#bp-root .bp-card{aspect-ratio:0.86;min-height:0}
#bp-root .bp-card.is-owned .bp-pic img{transition:transform .25s ease}
#bp-root .bp-card.is-owned:hover .bp-pic img{transform:scale(1.055)}
@media(max-width:900px){#bp-root .bp-aside{position:static}}

/* ========== BABILO V29 : les anciens panneaux ne prennent plus le dessus ========== */
body:has(#view-game.active #bp-root) {background:#061438!important}
body:has(#view-game.active #bp-root) #app>header.appbar,
body:has(#view-game.active #bp-root) #app .site-ticker,
body:has(#view-game.active #bp-root) #babiloQuickButtons,
body:has(#view-game.active #bp-root) #view-game>.page-head,
body:has(#view-game.active #bp-root) #app>footer,
body:has(#view-game.active #bp-root)>footer{display:none!important}
body:has(#view-game.active #bp-root) main,
body:has(#view-game.active #bp-root) #app main,
body:has(#view-game.active #bp-root) #view-game,
body:has(#view-game.active #bp-root) #gameArea{max-width:100%!important;width:100%!important;margin:0!important;padding:0!important;min-height:0!important}
#bp-root{min-height:100vh!important;border:0!important;border-radius:0!important;padding:13px 15px 20px!important;isolation:isolate}
#bp-root[data-theme="ocean"]{background:radial-gradient(ellipse at 53% -22%,#42d8f280,transparent 55%),linear-gradient(170deg,#02518b 0%,#061a55 92%)}
#bp-root .bp-head{margin:0 0 12px;gap:10px}
#bp-root .bp-mascot{width:100px;height:100px}
#bp-root .bp-tab{min-height:61px}
#bp-root .bp-body{grid-template-columns:minmax(165px,208px) minmax(0,1fr);gap:13px}
#bp-root .bp-aside #bp-list{gap:9px}
#bp-root .bp-album-head{margin-bottom:13px}
#bp-root .bp-grid{gap:8px;grid-template-columns:repeat(6,minmax(0,1fr))}
#bp-root .bp-card{height:clamp(170px,13.5vw,255px);min-height:0!important;aspect-ratio:auto!important}
#bp-root .bp-pic img{object-fit:cover;object-position:center 22%}
#bp-root .bp-card-name{font-size:clamp(13px,1vw,18px);padding-top:12px}
#bp-root .bp-card.bp-gold{border-color:#ffd32d;box-shadow:0 0 14px #ffc528ad}
#bp-root .bp-aside .bp-home{font-size:21px}
#bp-root .bp-footer{padding:13px 0 5px}
@media(max-width:1380px){#bp-root .bp-grid{grid-template-columns:repeat(4,minmax(0,1fr))}#bp-root .bp-card{height:clamp(190px,20vw,260px)}}
@media(max-width:850px){#bp-root .bp-body{grid-template-columns:1fr}#bp-root .bp-grid{grid-template-columns:repeat(3,minmax(0,1fr))}#bp-root .bp-card{height:clamp(190px,26vw,275px)}#bp-root .bp-mascot{width:70px;height:70px}}
@media(max-width:520px){#bp-root .bp-grid{grid-template-columns:repeat(2,minmax(0,1fr))}#bp-root .bp-card{height:230px}#bp-root .bp-head{flex-wrap:wrap}#bp-root .bp-top-tabs{justify-content:flex-start}}

/* V29 : cartes accessibles sur clavier / pas de petits boutons flottants. */
#bp-root .bp-card:focus-visible{outline:3px solid white;outline-offset:2px}
body:has(#view-game.active #bp-root) #babiloQuickButtons{display:none!important}
#bp-root .bp-card.is-locked .bp-pic img{filter:grayscale(1) brightness(.09) blur(2px)!important}