*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{height:100%;}
body{width:100%;height:100%;overflow:hidden;font-family:'Cinzel',serif;background-color:#0d1e3a;background-image:url('assets/background.png');background-size:cover;background-position:center;background-repeat:no-repeat;}

/* ── ÉCRANS ── */
.screen{position:fixed;inset:0;z-index:10;display:none;align-items:center;justify-content:center;overflow-y:auto;background:transparent;}
.screen.active{display:flex;}

/* ── SÉLECTION ── */

#title-box{text-align:center;border-bottom:1px solid rgba(255,200,50,0.3);padding-bottom:10px;width:100%;}
#title-box h1{font-family:'Cinzel Decorative',serif;font-size:16px;color:#ffd700;text-shadow:0 0 16px rgba(255,200,0,0.6);}
.subtitle{font-size:8px;color:#a8c4d8;margin-top:5px;letter-spacing:1px;}
#sprite-zone{text-align:center;background:rgba(0,0,0,0.35);border:1px solid rgba(255,200,50,0.2);border-radius:8px;padding:4px 8px;width:100%;}
#sprite-zone canvas{display:block;margin:0 auto;image-rendering:pixelated;}
#sprite-name{font-size:9px;color:#ffd700;margin-top:3px;letter-spacing:2px;min-height:14px;}

#characterButtons button,#validateBtn{font-family:'Cinzel',serif;font-weight:600;border:1.5px solid #6a4010;border-radius:8px;background:linear-gradient(145deg,#1e0f02,#2a1505);color:#d4a830;cursor:pointer;transition:all .15s;text-align:center;}
#characterButtons button{font-size:10px;padding:9px 4px;width:100%;}
#characterButtons button:hover,#characterButtons button.selected{background:linear-gradient(145deg,#ffd700,#c8a200);color:#1a0800;border-color:#ffd700;}
#validateBtn{display:none;font-size:11px;padding:10px 16px;width:100%;background:linear-gradient(145deg,#0d2008,#1a3a10);color:#5ddd40;border-color:#3a8a25;}

/* ── PSEUDO ── */
#pseudo-box{display:flex;flex-direction:column;align-items:center;gap:14px;width:88vw;max-width:340px;background:rgba(5,12,28,0.92);border:2px solid rgba(255,200,50,0.45);border-radius:14px;padding:28px 20px;backdrop-filter:blur(3px);}
#pseudo-box h2{font-family:'Cinzel Decorative',serif;font-size:16px;color:#ffd700;text-align:center;}
#pseudoInput{width:100%;padding:12px 14px;font-family:'Cinzel',serif;font-size:14px;background:rgba(0,0,0,0.5);border:2px solid #5a3a10;border-radius:8px;color:#ffd700;outline:none;text-align:center;}
#pseudoInput:focus{border-color:#ffd700;}
#pseudo-error{font-size:9px;color:#ff6644;min-height:14px;text-align:center;}
#pseudo-validate-btn{font-family:'Cinzel',serif;font-weight:700;font-size:12px;padding:12px 28px;width:100%;background:linear-gradient(145deg,#f4e1b0,#d1a954);color:#3d1f00;border:2px solid #8b4513;border-radius:8px;cursor:pointer;}

/* ── JEU PRINCIPAL ── */
#screen-game{flex-direction:column;align-items:stretch;justify-content:flex-start;}
#hud-top{position:relative;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:7px 14px;background:rgba(5,10,24,0.87);border-bottom:1px solid rgba(255,200,50,0.2);backdrop-filter:blur(6px);}
.hud-left,.hud-right{display:flex;align-items:center;gap:5px;}
.hud-center{font-family:'Cinzel Decorative',serif;font-size:13px;color:#ffd700;}
#hud-fruits,#hud-diamonds{font-size:15px;font-weight:700;color:#fff;background:rgba(0,0,0,0.4);border-radius:6px;padding:2px 7px;min-width:28px;text-align:center;}
.hud-diamond-btn{font-size:18px;cursor:pointer;background:linear-gradient(135deg,rgba(96,200,255,0.2),rgba(96,200,255,0.05));border:1px solid rgba(96,200,255,0.4);border-radius:6px;padding:2px 5px;animation:dpulse 3s ease-in-out infinite;}
@keyframes dpulse{0%,100%{box-shadow:0 0 4px rgba(96,200,255,0.3);}50%{box-shadow:0 0 10px rgba(96,200,255,0.7);}}
#stats-bar{position:relative;z-index:20;display:flex;flex-direction:column;gap:2px;padding:3px 4px;background:rgba(5,10,24,0.82);border-bottom:1px solid rgba(255,200,50,0.15);backdrop-filter:blur(4px);box-sizing:border-box;width:100%;}
.hud-stats-row{display:flex;gap:2px;width:100%;}
.stat-chip{display:flex;align-items:center;gap:1px;background:rgba(255,255,255,0.05);border-radius:5px;padding:1px 3px;flex:1 1 0;min-width:0;justify-content:center;}
.sc-label{font-size:10px;flex-shrink:0;}.sc-val{font-size:clamp(8px,2.6vw,10px);font-weight:700;color:#ffd700;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;}
.sc-timer{font-size:8px;color:#8ab4d4;white-space:nowrap;}
.fruit-chip{gap:3px;}.fruit-mini,.fruit-tiny{display:inline-block;vertical-align:middle;image-rendering:pixelated;}
#next-match-card{margin:6px 12px 0;background:rgba(5,10,24,0.85);border:1px solid rgba(255,100,68,0.4);border-radius:10px;padding:10px 14px;cursor:pointer;backdrop-filter:blur(4px);}
.nm-title{font-size:8px;color:#ff8844;margin-bottom:3px;font-family:'Cinzel Decorative',serif;}
.nm-vs{font-size:12px;color:#e0c878;margin:3px 0;}.nm-opp{color:#ffd700;font-weight:700;}
#league-card{margin:6px 12px 0;background:rgba(5,10,24,0.82);border:1px solid rgba(255,200,50,0.3);border-radius:10px;padding:8px 12px;cursor:pointer;backdrop-filter:blur(4px);}
.lc-title{font-family:'Cinzel Decorative',serif;font-size:9px;color:#ffd700;margin-bottom:6px;text-align:center;}
.lc-body{display:flex;justify-content:space-around;}
.lc-item{display:flex;flex-direction:column;align-items:center;gap:2px;}
.lc-label{font-size:7px;color:#8ab4d4;}.lc-val{font-size:14px;font-weight:700;color:#ffd700;}
.lc-hint{font-size:7px;color:#5a6a8a;text-align:center;margin-top:5px;}
#game-sprite-wrap{position:fixed;bottom:110px;left:50%;transform:translateX(-50%);z-index:15;background:transparent;display:flex;flex-direction:column;align-items:center;gap:6px;}

/* ── HEADERS ÉCRANS SECONDAIRES ── */
.screen-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;padding-bottom:10px;border-bottom:1px solid rgba(255,200,50,0.2);}
.screen-header h2{font-family:'Cinzel Decorative',serif;font-size:12px;color:#ffd700;}
.back-btn{font-family:'Cinzel',serif;font-size:9px;padding:6px 10px;background:rgba(255,255,255,0.05);border:1px solid rgba(255,200,50,0.3);border-radius:6px;color:#8ab4d4;cursor:pointer;}
.back-btn:hover{color:#ffd700;}
.pts-badge{display:flex;align-items:center;gap:4px;font-size:10px;color:#5ddd40;}

/* ── ENTRAÎNEMENT ── */
#train-box{width:94vw;max-width:400px;background:rgba(5,10,24,0.92);border:2px solid rgba(255,200,50,0.4);border-radius:14px;padding:16px 14px 80px;backdrop-filter:blur(6px);}
.diamond-banner{display:flex;align-items:center;justify-content:center;gap:6px;margin-bottom:12px;padding:10px 14px;background:linear-gradient(135deg,rgba(96,200,255,0.15),rgba(96,200,255,0.05));border:1px solid rgba(96,200,255,0.5);border-radius:10px;cursor:pointer;font-size:10px;color:#60c8ff;font-weight:600;animation:dpulse 3s ease-in-out infinite;}
.train-form{background:rgba(255,255,255,0.04);border:1px solid rgba(255,200,50,0.25);border-radius:10px;padding:14px;margin-bottom:14px;}
.train-form-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;gap:8px;}
.train-form-label{font-size:11px;color:#8ab4d4;white-space:nowrap;min-width:110px;}
#train-stat-select{flex:1;font-family:'Cinzel',serif;font-size:12px;background:rgba(0,0,0,0.4);border:1px solid rgba(255,200,50,0.3);border-radius:7px;color:#ffd700;padding:8px 6px;outline:none;cursor:pointer;}
#train-stat-select option{background:#0d1e3a;color:#ffd700;}
#train-amount-input{width:80px;font-family:'Cinzel',serif;font-size:14px;font-weight:700;background:rgba(0,0,0,0.4);border:1px solid rgba(255,200,50,0.3);border-radius:7px;color:#ffd700;padding:7px 8px;outline:none;text-align:center;}
#train-amount-input:focus{border-color:#ffd700;}
#train-preview-box{font-size:11px;color:#a8c8e0;min-height:32px;margin-bottom:10px;line-height:1.7;}
.train-preview-line{margin-bottom:2px;}
#train-validate-btn{width:100%;font-family:'Cinzel',serif;font-size:14px;font-weight:700;padding:12px;border-radius:8px;cursor:pointer;background:linear-gradient(135deg,rgba(93,221,64,0.35),rgba(93,221,64,0.1));border:1.5px solid rgba(93,221,64,0.6);color:#5ddd40;transition:all .15s;}
#train-validate-btn:hover{background:rgba(93,221,64,0.4);}
.stats-table{background:rgba(255,255,255,0.03);border:1px solid rgba(255,200,50,0.15);border-radius:10px;overflow:hidden;}
.stats-table-title{font-family:'Cinzel Decorative',serif;font-size:11px;color:#ffd700;padding:8px 12px;border-bottom:1px solid rgba(255,200,50,0.15);}
.stats-row{display:flex;flex-wrap:wrap;align-items:center;padding:8px 12px;border-bottom:1px solid rgba(255,255,255,0.04);}
.stats-row:last-child{border-bottom:none;}
.stats-label{font-size:12px;color:#8ab4d4;width:80px;flex-shrink:0;}
.stats-pts{font-size:15px;font-weight:700;color:#ffd700;flex-shrink:0;white-space:nowrap;margin-right:8px;}
.stats-eff{font-size:10px;color:#a8c8e0;flex:1;min-width:0;overflow-wrap:break-word;}

/* ── LIGUE ── */
#league-box{width:94vw;max-width:400px;max-height:88vh;overflow-y:auto;background:rgba(5,10,24,0.92);border:2px solid rgba(255,200,50,0.4);border-radius:14px;padding:16px 14px 20px;backdrop-filter:blur(6px);}
.next-fight-badge{font-size:10px;color:#ff8844;}
.league-info-bar{font-size:10px;color:#8ab4d4;text-align:center;padding:4px 0 6px;border-bottom:1px solid rgba(255,200,50,0.15);margin-bottom:4px;}
#promo-info{font-size:10px;text-align:center;padding:3px 8px;color:#ff8844;}
#reward-preview{font-size:10px;text-align:center;padding:3px 8px 8px;color:#d878ff;border-bottom:1px solid rgba(255,200,50,0.15);margin-bottom:8px;}
#league-tabs{display:flex;gap:8px;margin-bottom:12px;}
.tab-btn{flex:1;font-family:'Cinzel',serif;font-size:12px;padding:8px;border-radius:6px;cursor:pointer;background:rgba(255,255,255,0.05);border:1px solid rgba(255,200,50,0.2);color:#8ab4d4;}
.tab-btn.active{background:rgba(255,200,50,0.15);border-color:#ffd700;color:#ffd700;}
.ranking-row{display:flex;align-items:center;gap:10px;padding:8px 10px;margin-bottom:5px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,200,50,0.1);border-radius:8px;cursor:pointer;}
.ranking-row:hover{border-color:rgba(255,200,50,0.4);}
.ranking-row.my-row{border-color:rgba(255,215,0,0.5);background:rgba(255,215,0,0.08);}
.rank-pos{font-size:13px;font-weight:700;color:#ffd700;min-width:28px;text-align:center;}
.rank-info{flex:1;}.rank-name{font-size:12px;color:#e0c878;}.rank-pirate{font-size:10px;color:#8ab4d4;}
.rank-bot-tag{font-size:7px;color:#555;margin-left:3px;}.rank-me-tag{font-size:7px;color:#ffd700;margin-left:3px;}
.rank-pts{font-size:13px;color:#5ddd40;font-weight:700;text-align:right;min-width:65px;}
.rank-pts small{font-size:9px;color:#8ab4d4;display:block;}.rank-reward{font-size:9px;color:#d878ff;display:block;}
.round-header{font-size:11px;color:#ff8844;font-weight:700;padding:6px 4px 3px;margin-top:8px;border-top:1px solid rgba(255,200,50,0.12);}
.cal-section-title{font-family:'Cinzel Decorative',serif;font-size:11px;color:#ffd700;padding:10px 4px 4px;border-top:1px solid rgba(255,200,50,0.2);}
.match-row{padding:7px 10px;margin-bottom:4px;background:rgba(255,255,255,0.03);border:1px solid rgba(255,200,50,0.08);border-radius:6px;}
.match-row.my-row{border-color:rgba(255,215,0,0.3);background:rgba(255,215,0,0.05);}
.match-players{font-size:12px;color:#e0c878;text-align:center;}
.match-vs{color:#ff6644;margin:0 6px;}.match-result{font-size:10px;color:#5ddd40;text-align:center;margin-top:2px;}
.loading-txt{font-size:10px;color:#8ab4d4;text-align:center;padding:20px;}

/* ── RÉCOMPENSES ── */
#rewards-box{width:94vw;max-width:400px;max-height:88vh;overflow-y:auto;background:rgba(5,10,24,0.92);border:2px solid rgba(255,200,50,0.4);border-radius:14px;padding:16px 14px 20px;backdrop-filter:blur(6px);}
.rewards-section-title{font-family:'Cinzel Decorative',serif;font-size:10px;color:#ffd700;margin-bottom:8px;padding-bottom:6px;border-bottom:1px solid rgba(255,200,50,0.2);}
.reward-pending{background:linear-gradient(135deg,rgba(93,221,64,0.1),rgba(93,221,64,0.05));border:1.5px solid rgba(93,221,64,0.4);border-radius:10px;padding:16px;text-align:center;}
.rp-title{font-family:'Cinzel Decorative',serif;font-size:13px;color:#ffd700;margin-bottom:8px;}
.rp-amounts{font-size:20px;font-weight:700;color:#d878ff;margin-bottom:6px;}
.rp-expiry{font-size:11px;color:#ff8844;margin-bottom:12px;}
.rp-claim-btn{font-family:'Cinzel',serif;font-size:11px;font-weight:700;padding:10px 28px;border-radius:8px;cursor:pointer;background:linear-gradient(135deg,rgba(93,221,64,0.35),rgba(93,221,64,0.1));border:1.5px solid rgba(93,221,64,0.6);color:#5ddd40;}
.reward-expired{color:#ff6644;font-size:10px;text-align:center;padding:16px;border:1px solid rgba(255,100,68,0.3);border-radius:8px;}
.reward-empty{color:#8ab4d4;font-size:10px;text-align:center;padding:16px;}
.history-table{width:100%;border-collapse:collapse;font-size:10px;margin-top:8px;}
.history-table th{color:#8ab4d4;padding:6px 8px;border-bottom:1px solid rgba(255,200,50,0.2);text-align:left;font-size:11px;}
.history-table td{padding:6px 8px;border-bottom:1px solid rgba(255,255,255,0.05);color:#e0c878;font-size:11px;}

/* ── BARÈME ── */
#leaguetable-box{width:94vw;max-width:400px;background:rgba(5,10,24,0.92);border:2px solid rgba(255,200,50,0.4);border-radius:14px;padding:16px 14px 20px;backdrop-filter:blur(6px);}
.lt-hint{font-size:10px;color:#8ab4d4;text-align:center;margin-bottom:8px;}
.lt-table{width:100%;border-collapse:collapse;font-size:10px;}
.lt-table th{color:#8ab4d4;padding:6px 4px;border-bottom:1px solid rgba(255,200,50,0.2);text-align:center;font-size:11px;}
.lt-table td{padding:6px 4px;border-bottom:1px solid rgba(255,255,255,0.04);text-align:center;color:#e0c878;font-size:11px;}
.lt-table tr:hover td{background:rgba(255,200,50,0.06);cursor:pointer;}
.lt-current td{background:rgba(255,215,0,0.12)!important;color:#ffd700!important;font-weight:700;}

/* ── FAQ ── */
#faq-box{width:94vw;max-width:400px;max-height:88vh;overflow-y:auto;background:rgba(5,10,24,0.92);border:2px solid rgba(255,200,50,0.4);border-radius:14px;padding:16px 14px 24px;backdrop-filter:blur(6px);}
.faq-section{margin-bottom:14px;border:1px solid rgba(255,200,50,0.15);border-radius:10px;overflow:hidden;}
.faq-q{font-family:'Cinzel',serif;font-size:12px;font-weight:700;color:#ffd700;padding:10px 12px;background:rgba(255,200,50,0.08);border-bottom:1px solid rgba(255,200,50,0.15);}
.faq-a{font-family:'Cinzel',serif;font-size:11px;color:#a8c4d8;padding:10px 12px;line-height:1.7;}
.faq-a strong{color:#ffd700;}
.faq-highlight{display:inline-block;background:linear-gradient(135deg,rgba(96,200,255,0.2),rgba(96,200,255,0.05));border:1px solid rgba(96,200,255,0.4);border-radius:6px;padding:2px 8px;color:#60c8ff;font-weight:700;}

/* ── TOAST ── */
#toast{position:fixed;bottom:90px;left:50%;transform:translateX(-50%);background:rgba(5,12,28,0.96);border:1px solid rgba(255,200,50,0.4);border-radius:10px;padding:8px 18px;font-family:'Cinzel',serif;font-size:11px;color:#ffd700;z-index:200;opacity:0;transition:opacity .3s;pointer-events:none;}

/* Mobile scroll fix pour l'entraînement */
#screen-train{overflow-y:auto;align-items:flex-start;padding-top:10px;padding-bottom:10px;}

#screen-leaguetable{overflow-y:auto;align-items:flex-start;padding:10px;}
#screen-rewards{overflow-y:auto;align-items:flex-start;padding:10px;}

/* Fruit SVG images */
.fruit-img-hud{width:22px;height:22px;vertical-align:middle;image-rendering:pixelated;}
.fruit-img-mini{width:14px;height:14px;vertical-align:middle;image-rendering:pixelated;}
/* Hint barème */
.lt-click-hint{font-size:10px;color:#8ab4d4;text-align:center;padding:6px 0 10px;font-style:italic;}

/* ── Boutons flottants latéraux ── */
.float-nav{position:fixed;top:58%;transform:translateY(-50%);z-index:20;display:flex;flex-direction:column;gap:8px;pointer-events:none;}
.float-left{left:4px;}
.float-right{right:4px;align-items:flex-end;}
.float-item{pointer-events:all;display:flex;align-items:center;gap:5px;}
.float-item-right{flex-direction:row;align-items:center;gap:5px;}
.float-btn{width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,200,50,0.35);background:rgba(5,12,28,0.85);backdrop-filter:blur(6px);font-size:19px;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 10px rgba(0,0,0,0.55);transition:transform .15s,background .15s;flex-shrink:0;}
.float-btn:active{transform:scale(.88);background:rgba(255,200,50,0.2);}
.float-label{font-family:'Cinzel',serif;font-size:8px;color:rgba(255,220,100,0.85);background:rgba(5,12,28,0.75);padding:2px 5px;border-radius:4px;white-space:nowrap;text-shadow:0 1px 3px #000;letter-spacing:.3px;}
.sc-name{font-size:7px;color:#8ab4d4;opacity:.75;margin-left:1px;flex-shrink:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
/* Timer dans le HUD */
.hud-timer{font-size:9px;color:#a8d8ff;font-family:'Cinzel',serif;opacity:.85;margin-left:2px;min-width:28px;}


/* Bouton reset personnage */
.hud-reset-btn{font-size:14px;cursor:pointer;opacity:.7;margin-left:4px;transition:opacity .2s;}
.hud-reset-btn:active{opacity:1;}

e:6px;color:#d878ff;margin-top:1px;}

/* ── Cartes pirates v2 ── */

#title-box h1{font-family:'Cinzel Decorative',serif;font-size:15px;color:#ffd700;}
#title-box{padding-bottom:8px;}


.pirate-card.selected{border-color:#ffd700;box-shadow:0 0 10px rgba(255,200,50,0.4);}




.pirate-card-fruit{font-size:5px;color:#d878ff;}
#validateBtn{font-size:12px;padding:10px;width:100%;font-family:'Cinzel',serif;font-weight:700;border-radius:8px;cursor:pointer;background:rgba(93,221,64,0.2);border:1.5px solid rgba(93,221,64,0.6);color:#5ddd40;letter-spacing:1px;}
/* Portrait page principale */
#main-pirate-portrait{width:120px;height:220px;display:block;border:none;background:transparent;filter:drop-shadow(0 8px 28px rgba(0,0,0,0.85));object-fit:contain;object-position:center bottom;image-rendering:auto;border-radius:0;}

/* ── Bonus/Malus sur cartes pirates ── */
.pirate-card-stats{display:flex;flex-wrap:wrap;gap:2px;justify-content:center;margin-top:2px;}
.pcb-bonus{font-size:6.5px;font-weight:700;color:#5ddd40;background:rgba(93,221,64,0.15);border:1px solid rgba(93,221,64,0.3);border-radius:3px;padding:1px 4px;white-space:nowrap;}
.pcb-malus{font-size:6.5px;font-weight:700;color:#ff6644;background:rgba(255,102,68,0.15);border:1px solid rgba(255,102,68,0.3);border-radius:3px;padding:1px 4px;white-space:nowrap;}

/* ── Bonus/malus autour du portrait ── */
#portrait-bonuses{display:flex;flex-direction:column;gap:4px;align-items:center;pointer-events:none;}
.pb-row{display:flex;gap:4px;justify-content:center;flex-wrap:wrap;}
.pb-bonus{font-family:'Cinzel',serif;font-size:9px;font-weight:700;color:#5ddd40;background:rgba(0,0,0,0.72);border:1px solid rgba(93,221,64,0.6);border-radius:5px;padding:2px 7px;white-space:nowrap;text-shadow:0 0 8px rgba(93,221,64,0.5);}
.pb-malus{font-family:'Cinzel',serif;font-size:9px;font-weight:700;color:#ff6644;background:rgba(0,0,0,0.72);border:1px solid rgba(255,102,68,0.6);border-radius:5px;padding:2px 7px;white-space:nowrap;text-shadow:0 0 8px rgba(255,102,68,0.5);}
.pb-tag{display:none;}

/* ── Bonus/malus dans l'écran entraînement ── */
#train-bonus-display{display:flex;flex-wrap:wrap;gap:3px;align-items:center;justify-content:center;padding:5px 8px;background:rgba(0,0,0,0.3);border-radius:8px;border:1px solid rgba(255,200,50,0.15);margin-bottom:8px;}
.tb-name{font-family:'Cinzel Decorative',serif;font-size:8px;color:#ffd700;margin-right:4px;width:100%;text-align:center;margin-bottom:2px;}
.tb-bonus{font-size:9px;font-weight:700;color:#5ddd40;background:rgba(93,221,64,0.15);border:1px solid rgba(93,221,64,0.4);border-radius:4px;padding:2px 7px;}
.tb-malus{font-size:9px;font-weight:700;color:#ff6644;background:rgba(255,102,68,0.15);border:1px solid rgba(255,102,68,0.4);border-radius:4px;padding:2px 7px;}

/* ── Écran sélection perso ── */
#menu{display:flex;flex-direction:column;align-items:center;gap:6px;width:98vw;max-width:440px;background:rgba(5,12,28,0.92);border:2px solid rgba(255,200,50,0.4);border-radius:14px;padding:10px 8px 12px;backdrop-filter:blur(4px);max-height:95vh;overflow-y:auto;}
#characterButtons{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;width:100%;}
/* Cartes harmonisées */
.pirate-card{display:flex;flex-direction:column;align-items:center;cursor:pointer;border-radius:6px;border:2px solid rgba(255,200,50,0.12);background:rgba(0,0,0,0.35);overflow:hidden;transition:transform .12s,border-color .15s;-webkit-tap-highlight-color:transparent;aspect-ratio:auto;}
.pirate-card:active{transform:scale(.93);}
.pirate-card.selected{border-color:#ffd700;box-shadow:0 0 12px rgba(255,200,50,0.45);}
.pirate-card-img{width:100%;aspect-ratio:3/4;display:block;object-fit:cover;object-position:center top;}
.pirate-card-info{padding:2px 3px 3px;text-align:center;width:100%;background:rgba(0,0,0,0.55);}
.pirate-card-name{font-family:'Cinzel',serif;font-size:7px;font-weight:700;color:#ffd700;}
.pirate-card-role{font-family:'Cinzel',serif;font-size:5.5px;color:#8ab4d4;margin-top:1px;}

#screen-referral{overflow-y:auto;align-items:flex-start;padding:10px;}
#screen-faq{overflow-y:auto;align-items:flex-start;padding:10px;}
#screen-community{overflow-y:auto;align-items:flex-start;padding:10px;}