/*! Corsaires ! — © 2026, Chrysopam — tous droits réservés */
html.bois #modal:not(.accueil) > #modal-box,
html.bois #panneau,
html.bois #journal {
  border: 16px solid transparent !important;
  border-image: url(interface/ui_cadre.png) 76 stretch !important;
  border-radius: 0 !important;
  background: url(interface/ui_bois_fond.png) center / 320px 320px repeat !important;
  background-clip: padding-box !important;
  box-shadow: 0 10px 34px rgba(0, 0, 0, .55) !important;
}
html.bois #journal {
  border: 10px solid transparent !important;
  border-image: url(interface/ui_feuille.png) 26 stretch !important;
  background: url(interface/ui_papier.png) center / 256px 256px repeat, #efe2be !important;
  background-clip: padding-box !important;
  color: #4a3419 !important;
  padding: 4px 8px !important;
}
html.bois #journal .mois { color: #8a6a32 !important; }
html.bois #journal .bien { color: #2e6b2c !important; }
html.bois #journal .mal { color: #9b2226 !important; }
html.bois #modal-box > div > h2, html.bois .combat h2 { color: #7a2014; text-shadow: none; }
html.bois #panneau { border-width: 15px !important; }
html.bois #journal { border-width: 14px !important; }
html.bois .onglet-corps,
html.bois .pan-corps,
html.bois .aide-texte,
html.bois .port-tete {
  border: 11px solid transparent !important;
  border-image: url(interface/ui_feuille.png) 26 stretch !important;
  border-radius: 0 !important;
  background: url(interface/ui_papier.png) center / 256px 256px repeat, #efe2be !important;
  background-clip: padding-box !important;
  color: #3b2612 !important;
  padding: 7px 11px !important;
  position: relative;
  z-index: 2;
}
html.bois .onglet-corps small,
html.bois .pan-corps small { color: #6a4a24; }
html.bois .port-tete { border-width: 9px !important; padding: 2px 10px !important; margin-bottom: 0 !important; }
html.bois .port-tete h2 { color: #6b1f14; }
html.bois .onglets,
html.bois .pan-onglets {
  align-items: flex-start !important;
  border-bottom: 0 !important;
  margin-bottom: -10px !important;
  position: relative;
  z-index: 1;
  gap: 2px;
}
html.bois .onglet {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
  background: url(interface/ui_onglet.png) center / 100% 100% no-repeat !important;
  color: #f0dcae !important;
  text-shadow: 1px 1px 0 rgba(20, 12, 4, .8);
  padding: 5px 10px 16px !important;
  font-size: 12.5px;
  align-self: flex-start;
  filter: brightness(.94);
}
html.bois .onglet:hover:not(.actif) { filter: brightness(1.04); }
html.bois .onglet.actif {
  background-image: url(interface/ui_onglet_actif.png) !important;
  color: #fff0c4 !important;
  padding-bottom: 20px !important;
  position: relative;
  z-index: 3;
  filter: none;
}
html.bois .port .onglets::after { content: ''; flex: 1 1 auto; min-width: 0; }
html.bois .btn {
  border: 13px solid transparent !important;
  border-image: url(interface/ui_bouton.png) 15 fill stretch !important;
  border-radius: 0 !important;
  background: none !important;
  background-clip: padding-box;
  box-shadow: none !important;
  outline: none !important;
  min-width: 0 !important;
  color: #f7e6bb;
  text-shadow: 1px 1px 0 rgba(20, 12, 4, .9);
  display: inline-flex;
  align-items: center;
  gap: 7px;
  line-height: 1.15;
}
html.bois .btn:hover:not([disabled]),
html.bois .btn.primaire {
  border-image: url(interface/ui_bouton_presse.png) 13 fill stretch !important;
  color: #fff6d4;
}
html.bois .btn[disabled] {
  border-image: url(interface/ui_bouton_eteint.png) 13 fill stretch !important;
  filter: none;
  opacity: 1;
  color: #b09a78;
  text-shadow: 1px 1px 0 rgba(10, 6, 2, .8);
}
html.bois .btn.danger, html.bois .btn.danger:hover {
  border: 13px solid transparent !important;
  border-image: url(interface/ui_bouton_rouge.png) 30 fill stretch !important;
  border-radius: 0 !important;
  background: none !important;
  box-shadow: none !important;
  filter: none;
  color: #ffe4cf;
}
html.bois .btn.petit { border-width: 10px !important; font-size: 12px; }
html.bois .btn.mini { border-width: 8px !important; font-size: 11.5px; }
html.bois .btn img.emo {
  width: 26px;
  height: 26px;
  object-fit: contain;
  flex: 0 0 auto;
  filter:
    drop-shadow(1px 0 0 #2f1d0b) drop-shadow(-1px 0 0 #2f1d0b)
    drop-shadow(0 1px 0 #2f1d0b) drop-shadow(0 -1px 0 #2f1d0b)
    drop-shadow(0 2px 2px rgba(25, 13, 3, .5));
}
html.bois .btn.petit img.emo, html.bois .btn.mini img.emo { width: 19px; height: 19px; }
html.bois .onglet img.emo {
  width: 20px; height: 20px; object-fit: contain; vertical-align: -5px; margin-right: 3px;
  filter:
    drop-shadow(1px 0 0 #2f1d0b) drop-shadow(-1px 0 0 #2f1d0b)
    drop-shadow(0 1px 0 #2f1d0b) drop-shadow(0 -1px 0 #2f1d0b)
    drop-shadow(0 0 3px rgba(255, 238, 196, .6));
}
html.bois img.emo { object-fit: contain; }
html.bois .ligne-action {
  border: 2px solid #6d4a22 !important;
  border-image: none !important;
  border-radius: 3px !important;
  background: linear-gradient(#fdf5e0, #efe0b8) !important;
  box-shadow: 0 0 0 1px #c9a45a inset, 0 1px 0 rgba(255, 255, 255, .7) inset,
              0 2px 5px rgba(40, 24, 8, .28) !important;
  color: #3b2612;
}
html.bois .port .ligne-action { padding: 5px 8px !important; }
html.bois .port .ligne-action > div { min-width: 0; overflow-wrap: anywhere; }
html.bois .port .ligne-action .btn { max-width: 100%; margin-left: 10px; }
html.bois .port .ligne-action.quete {
  border-color: #8a6412 !important;
  background: linear-gradient(#fdf3c9, #f4e2a2) !important;
  box-shadow: 0 0 0 1px #e6c352 inset, 0 2px 5px rgba(40, 24, 8, .28) !important;
}
html.bois .boutons-ligne, html.bois .boutons, html.bois .m-bien-boutons { gap: 9px; }
html.bois .port .tab .btn { border-width: 8px !important; padding: 0 4px; font-size: 11.5px; }
html.bois .port .tab td, html.bois .port .tab th { padding-top: 2px; padding-bottom: 2px; }
html.bois .port .liste-actions .ligne-action { padding-top: 4px !important; padding-bottom: 5px !important; }
html.bois .tag {
  border: 9px solid transparent !important;
  border-image: url(interface/ui_parchemin.png) 12 36 fill stretch !important;
  border-radius: 0 !important;
  background: none !important;
  box-shadow: none !important;
  color: #4a3419;
}
html.bois .pan-dock {
  border: 14px solid transparent !important;
  border-image: url(interface/ui_feuille.png) 26 stretch !important;
  border-radius: 0 !important;
  background: url(interface/ui_papier.png) center / 256px 256px repeat, #efe2be !important;
  background-clip: padding-box !important;
  box-shadow: none !important;
  color: #3b2612;
  padding: 6px 10px !important;
}
html.bois .pan-dock .fin-tour .btn { white-space: nowrap; }
html.bois #barre .btn, html.bois #barre button {
  border: 11px solid transparent !important;
  border-image: url(interface/ui_bouton.png) 15 fill stretch !important;
  border-radius: 0 !important;
  background: none !important;
  background-clip: padding-box;
  box-shadow: none !important;
  outline: none !important;
  color: #f7e6bb;
}
html.bois #barre .btn:hover, html.bois #barre button:hover {
  border-image: url(interface/ui_bouton_presse.png) 13 fill stretch !important;
}
html.bois #barre img.emo { width: 22px; height: 22px; object-fit: contain; }
html.bois .visage-port {
  border: 0;
  width: 54px; height: 54px;
  padding: 6px;
  box-sizing: border-box;
  background: url(interface/ui_medaillon.png) center / 100% 100% no-repeat;
  box-shadow: 0 2px 5px rgba(0, 0, 0, .45);
}
html.bois .visage-port img { border-radius: 50%; }
html.bois .port-hero {
  border: 5px solid transparent;
  border-image: url(interface/ui_cadre.png) 76 stretch;
  margin-bottom: 6px;
}
html.bois .port-hero .illu,
html.bois .port.dense .port-hero .illu,
html.bois .port.serre .port-hero .illu {
  height: clamp(130px, 40vh, 460px);
  max-height: 44vh;
}
html.bois.mobile #modal-box, html.bois.mobile #panneau { border-width: 10px !important; }
html.bois.mobile .onglet-corps, html.bois.mobile .pan-corps { border-width: 8px !important; padding: 4px 7px !important; }
html.bois.mobile .m-etat {
  position: relative; z-index: 2; margin-top: 5px !important;   
  border: 8px solid transparent !important; border-top: 0 !important;
  border-image: url(interface/ui_feuille.png) 26 stretch !important; border-radius: 0 !important;
  background: url(interface/ui_papier.png) center / 256px 256px repeat, #efe2be !important;
  padding: 5px 4px 2px !important;
}
html.bois.mobile .pan-dock { border-width: 10px !important; }
html.bois.mobile .btn { border-width: 10px !important; }
html.bois.mobile .btn.petit, html.bois.mobile .btn.mini { border-width: 8px !important; }
html.bois.mobile .btn img.emo { width: 21px; height: 21px; }
html.bois.mobile .onglet { padding: 5px 9px 17px !important; font-size: 12px; }
html.bois.mobile .onglet.actif { padding-bottom: 21px !important; }
html.bois.mobile .onglet img.emo { width: 20px; height: 20px; vertical-align: -5px; }
html.bois.mobile .visage-port { width: 44px; height: 44px; padding: 5px; }
html.bois.mobile #modal:not(.accueil) > #modal-box > div.m-bandeau:not(.port):not(.titre):not(.bulle-tactile) {
  padding-top: calc(var(--bandeau, 150px) + 6px) !important;
}
html.bois.mobile #modal-box > .port.m-bandeau > .onglets {
  top: var(--bandeau, 150px);
  transform: translateY(-100%);
}
html.bois .pan-onglets .onglet { padding: 5px 2px 13px !important; font-size: 10.5px; letter-spacing: 0; }
html.bois .pan-onglets .onglet.actif { padding-bottom: 17px !important; }
html.bois .pan-onglets .onglet img.emo { width: 15px; height: 15px; vertical-align: -3px; margin-right: 1px; }
html.bois .pan-onglets { margin-bottom: -11px !important; }
html.bois.mobile #modal-box > .port.m-bandeau > .port-tete,
html.bois.mobile #modal-box > .port.m-scene > .port-tete {
  border: 0 !important;
  border-image: none !important;
  background: linear-gradient(rgba(20, 12, 4, 0), rgba(20, 12, 4, .88) 42%) !important;
  color: #f3e6c4 !important;
  padding: 22px 10px 5px !important;
}
html.bois.mobile .port-tete h2 { color: #ffe3a0 !important; text-shadow: 2px 2px 0 #000; }
html.bois.mobile .port .onglets .onglet {
  flex-direction: row !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 4px 8px 13px !important;
  font-size: 11.5px;
  min-width: 0;
}
html.bois.mobile .port .onglets .onglet.actif { padding-bottom: 16px !important; }
html.bois.mobile .port .onglets .onglet img.emo { width: 17px; height: 17px; vertical-align: -4px; margin: 0; }
html.bois.mobile .port .onglets { margin-bottom: -8px !important; gap: 2px; }
html.bois #modal.accueil .onglet-corps,
html.bois #modal.accueil .aide-texte,
html.bois #modal.accueil .ligne-action,
html.bois #modal.accueil .tag {
  border: 0 !important;
  border-image: none !important;
  background: none !important;
  padding: 0 !important;
}
html.bois #modal:not(.accueil) > #modal-box > div:not(.port):not(.titre):not(.bulle-tactile) {
  border: 12px solid transparent;
  border-image: url(interface/ui_feuille.png) 26 stretch;
  border-radius: 0;
  background: url(interface/ui_papier.png) center / 256px 256px repeat, #efe2be;
  background-clip: padding-box;
  padding: 10px 14px;
}
html.bois #modal:not(.accueil) > #modal-box > div.port:not(:has(> .onglets)) {
  border: 12px solid transparent;
  border-image: url(interface/ui_feuille.png) 26 stretch;
  border-radius: 0;
  background: url(interface/ui_papier.png) center / 256px 256px repeat, #efe2be;
  background-clip: padding-box;
}
html.bois #modal-box > div > .illu, html.bois .chronique-illu .illu {
  border: 5px solid transparent;
  border-image: url(interface/ui_cadre.png) 76 stretch;
}
html.bois .journal-long {
  border: 2px solid #6d4a22 !important;
  box-shadow: 0 0 0 1px #c9a45a inset !important;
  background: #fdf6e2 !important;
}
html.bois .cb-side, html.bois .cb-log, html.bois .cb-duel {
  border: 2px solid #6d4a22 !important;
  border-radius: 3px !important;
  background: linear-gradient(#fdf5e0, #efe0b8) !important;
  box-shadow: 0 0 0 1px #c9a45a inset, 0 2px 5px rgba(40, 24, 8, .28) !important;
  color: #3b2612;
}
html.bois .cb-scene { border: 6px solid transparent; border-image: url(interface/ui_cadre.png) 76 stretch; }
html.bois .pan-onglets .onglet { font-size: 0 !important; padding: 7px 4px 15px !important; }
html.bois .pan-onglets .onglet.actif { padding-bottom: 19px !important; }
html.bois .pan-onglets .onglet img.emo,
html.bois .pan-onglets .onglet img.ecusson-onglet {
  width: 30px !important; height: 30px !important; margin: 0 !important; vertical-align: middle !important;
}
html.bois .btn.danger {
  color: #fff !important;
  text-shadow: 0 1px 0 rgba(60, 0, 0, .95), 0 0 6px rgba(0, 0, 0, .6) !important;
  animation: bois-brasier 2.4s ease-in-out infinite;
}
html.bois .btn.danger img.emo {
  filter: drop-shadow(1px 0 0 #2a0505) drop-shadow(-1px 0 0 #2a0505)
          drop-shadow(0 1px 0 #2a0505) drop-shadow(0 -1px 0 #2a0505)
          drop-shadow(0 0 4px rgba(255, 226, 170, .95)) !important;
}
@keyframes bois-brasier {
  0%, 100% { filter: brightness(1); }
  50%      { filter: brightness(1.13) drop-shadow(0 0 7px rgba(255, 108, 54, .55)); }
}
@media (prefers-reduced-motion: reduce) {
  html.bois .btn.danger { animation: none; }
}
html.bois .port .onglet-corps,
html.bois .pan-corps {
  border-top: 0 !important;
  padding-top: 4px !important;
}
html.bois .onglets, html.bois .pan-onglets { margin-bottom: -6px !important; }
html.bois .onglet { padding-bottom: 14px !important; }
html.bois .onglet.actif { padding-bottom: 18px !important; }
html.bois.mobile .onglet { padding-bottom: 12px !important; }
html.bois.mobile .onglet.actif { padding-bottom: 15px !important; }
html.bois .pan-onglets .onglet { padding-bottom: 12px !important; }
html.bois .pan-onglets .onglet.actif { padding-bottom: 15px !important; }
html.bois .deux-cols, html.bois .actions-grille, html.bois .liste-actions, html.bois .port .onglet-corps {
  min-width: 0;
}
html.bois .deux-cols > *, html.bois .actions-grille > *, html.bois .liste-actions > * { min-width: 0; }
html.bois .port .deux-cols { gap: 14px; }
html.bois .ligne-action { max-width: 100%; }
html.bois .port .tab { width: 100%; table-layout: auto; }
html.bois .onglet.actif {
  color: #4a3419 !important;
  text-shadow: 0 1px 0 rgba(255, 250, 235, .6) !important;
}
html.bois .onglet.actif img.emo {
  filter: drop-shadow(1px 0 0 #6a4a22) drop-shadow(-1px 0 0 #6a4a22)
          drop-shadow(0 1px 0 #6a4a22) drop-shadow(0 -1px 0 #6a4a22) !important;
}
html.bois .port .tab td:last-child {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  justify-content: flex-start;
  min-width: 272px;
}
html.bois .port .tab th:last-child { min-width: 272px; }
html.bois .port .tab .btn { border-width: 7px !important; font-size: 11px; white-space: nowrap; }
html.bois .port .tab { table-layout: auto; width: 100%; max-width: 100%; }
html.bois .port .deux-cols > * { overflow-x: clip; }
html.bois .btn.danger,
html.bois .pan-dock .btn.primaire,
html.bois .boutons .btn { justify-content: center; }
html.bois .cap-fiche {
  background: url(interface/ui_papier.png) center / 190px 190px repeat, #f7edd3 !important;
  border: 2px solid #6d4a22 !important;
  border-left: 7px solid var(--c) !important;
  border-radius: 2px !important;
  box-shadow: 0 0 0 1px #c9a45a inset, 0 2px 5px rgba(40, 24, 8, .3) !important;
  padding: 7px 9px 6px !important;
  position: relative;
  color: #3b2612;
}
html.bois .cap-fiche::before, html.bois .cap-fiche::after {
  content: '';
  position: absolute;
  top: 4px;
  width: 7px; height: 7px;
  border-radius: 50%;
  background: radial-gradient(circle at 34% 30%, #e6cd8c, #6b4a1c 72%);
  box-shadow: 0 1px 1px rgba(0, 0, 0, .55);
  pointer-events: none;
}
html.bois .cap-fiche::before { left: 7px; }
html.bois .cap-fiche::after { right: 7px; }
html.bois .cap-tete b { font-family: 'Pirata One', var(--txt); font-size: 17px; letter-spacing: .3px; color: #5c2116; }
html.bois .cap-tete small { color: #8a6412; }
html.bois .cap-ligne { color: #4a3419; }
html.bois .cap-ligne.muet { color: #7a5f3a; font-style: italic; }
html.bois .cap-fiche.mort {
  opacity: 1;
  filter: none;
  background: url(interface/ui_papier.png) center / 190px 190px repeat, #e6d6ae !important;
  border-color: #5a3d1c !important;
  box-shadow: 0 0 0 1px #a98a45 inset, 0 1px 3px rgba(40, 24, 8, .25) !important;
  color: #6d5a3c;
}
html.bois .cap-fiche.mort .cap-tete b { color: #7c5a46; text-decoration: line-through; text-decoration-thickness: 1px; }
html.bois .cap-fiche.captif {
  background: linear-gradient(#efe7d6, #e2d8c2) !important;
  border-color: #56504a !important;
  box-shadow: 0 0 0 1px #9a9184 inset, 0 2px 4px rgba(20, 18, 14, .3) !important;
}
html.bois .cap-grille { gap: 8px 10px; }
html.bois .port .ligne-action .btn { border-width: 9px !important; font-size: 12px; padding: 0 2px; }
html.bois .port .ligne-action .btn img.emo { width: 20px; height: 20px; }
html.bois .port .ligne-action { padding: 3px 7px !important; }
html.bois .port .liste-actions .ligne-action { padding-top: 3px !important; padding-bottom: 3px !important; }
html.bois .port .liste-actions { gap: 5px; }
html.bois .onglets, html.bois .pan-onglets { padding-left: 11px !important; padding-right: 11px !important; }
html.bois .onglets, html.bois .pan-onglets { margin-bottom: -11px !important; }
html.bois .onglet { padding-bottom: 19px !important; }
html.bois .onglet.actif { padding-bottom: 23px !important; }
html.bois.mobile .onglets, html.bois.mobile .pan-onglets { padding-left: 8px !important; padding-right: 8px !important; }
html.bois .port .tab.navires td.nav-profil { padding: 1px 4px; }
html.bois .port .tab.navires td.nav-profil img { height: 26px; width: auto; max-width: 84px; object-fit: contain;
  filter: drop-shadow(0 1px 1px rgba(30, 16, 4, .5)); vertical-align: middle; }
html.bois .port .tab.navires td, html.bois .port .tab.navires th { padding-top: 1px; padding-bottom: 1px; }
html.bois .port .tab.navires .tag { padding: 0 6px; font-size: 10.5px; }
html.bois .btn {
  color: #3d2410;
  text-shadow: 0 1px 0 rgba(255, 246, 222, .55);
}
html.bois .btn:hover:not([disabled]), html.bois .btn.primaire { color: #2f1b09; }
html.bois #barre .btn, html.bois #barre button { color: #3d2410; text-shadow: 0 1px 0 rgba(255, 246, 222, .5); }
html.bois .btn[disabled] { color: #cbb694; text-shadow: 0 1px 0 rgba(20, 12, 4, .7); }
html.bois .btn.danger { color: #fff !important; }
html.bois .btn img.emo {
  filter: drop-shadow(1px 0 0 rgba(58, 34, 12, .85)) drop-shadow(-1px 0 0 rgba(58, 34, 12, .85))
          drop-shadow(0 1px 0 rgba(58, 34, 12, .85)) drop-shadow(0 -1px 0 rgba(58, 34, 12, .85))
          drop-shadow(0 1px 2px rgba(25, 13, 3, .35));
}
html.bois .onglet { color: #3d2410 !important; text-shadow: 0 1px 0 rgba(255, 246, 222, .5); }
html.bois .port-tete { margin-bottom: 7px !important; }
html.bois .onglets { margin-top: 2px !important; }
html.bois .port .tab.navires td:last-child {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  min-width: 0;
  justify-content: flex-end;
}
html.bois .port .tab.navires th:last-child { min-width: 0; }
html.bois .port .tab.navires .btn { max-width: 100%; }
html.bois .port .tab.navires td:first-child, html.bois .port .tab.navires th:first-child { width: 92px; }
html.bois .port .onglet-corps > .btn.danger,
html.bois .port .boutons .btn.danger {
  width: auto;
  min-width: 300px;              
  max-width: 460px;
  margin: 5px auto;
  display: flex;
  justify-content: center;
  gap: 12px;
  padding: 2px 18px;
}
html.bois .port .btn.danger img.emo { width: 30px; height: 30px; }
html.bois .btn,
html.bois #barre .btn, html.bois #barre button,
html.bois .onglet {
  color: #fff3d8;
  text-shadow: 1px 1px 0 #2a1608, -1px 1px 0 #2a1608, 1px -1px 0 #2a1608, -1px -1px 0 #2a1608,
               0 2px 3px rgba(20, 10, 2, .45);
  font-weight: 700;
}
html.bois .btn:hover:not([disabled]), html.bois .btn.primaire { color: #fffaea; }
html.bois .btn[disabled] { color: #d6c4a4; text-shadow: 1px 1px 0 rgba(30, 18, 6, .9), -1px -1px 0 rgba(30, 18, 6, .9); }
html.bois .btn.danger { color: #fff !important; }
html.bois .onglet.actif {
  color: #4a2a12 !important;
  text-shadow: 0 1px 0 rgba(255, 250, 235, .7) !important;
}
html.bois .onglets .onglet { flex: 1 1 0; }
html.bois .port .onglets::after { flex: 0 0 0 !important; }
html.bois .onglet {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  text-align: center;
  font-size: 12px;
  letter-spacing: .01em;
}
html.bois .onglet img.emo { margin: 0 !important; flex: 0 0 auto; }
html.bois.mobile .onglet { min-width: 0; font-size: 11px; }
html.bois .pan-onglets .onglet { min-width: 0; }
html.bois .btn img.emo {
  width: 35px; height: 35px;
  margin: -9px 0 !important;
}
html.bois .btn.petit img.emo, html.bois .btn.mini img.emo { width: 25px; height: 25px; margin: -6px 0 !important; }
html.bois .port .tab .btn img.emo { width: 22px; height: 22px; margin: -5px 0 !important; }
html.bois .onglet img.emo {
  width: 32px !important; height: 32px !important;
  margin: -9px 0 -7px !important;
}
html.bois .pan-onglets .onglet img.emo { width: 36px !important; height: 36px !important; margin: -8px 0 !important; }
html.bois #barre img.emo { width: 27px; height: 27px; margin: -5px 0 !important; }
html.bois .ligne-action img.emo { height: 1.7em; width: auto; vertical-align: -.45em; }
html.bois .btn, html.bois .onglet, html.bois .onglets, html.bois .pan-onglets { overflow: visible; }
html.bois.mobile .btn img.emo { width: 27px; height: 27px; margin: -6px 0 !important; }
html.bois.mobile .onglet img.emo { width: 24px !important; height: 24px !important; margin: -6px 0 -5px !important; }
@media (max-width: 1040px) {
  html.bois .port .onglets .onglet {
    font-size: 0 !important;
    gap: 0 !important;
    padding: 7px 4px 18px !important;
    min-height: 48px;
  }
  html.bois .port .onglets .onglet.actif { padding-bottom: 22px !important; min-height: 52px; }
  html.bois .port .onglets .onglet img.emo { width: 30px !important; height: 30px !important; margin: -6px 0 -4px !important; }
}
html.bois .btn,
html.bois #barre .btn, html.bois #barre button,
html.bois .onglet {
  color: #3a2109;
  text-shadow: 0 1px 0 rgba(255, 248, 228, .75);
  font-weight: 700;
}
html.bois .btn:hover:not([disabled]), html.bois .btn.primaire { color: #2c1806; }
html.bois .btn[disabled] { color: #8f7c5e; text-shadow: 0 1px 0 rgba(255, 250, 235, .45); }
html.bois .btn.danger { color: #fff !important; text-shadow: 1px 1px 0 rgba(70, 0, 0, .95), 0 0 5px rgba(0, 0, 0, .5) !important; }
html.bois .onglet.actif { color: #4a2a12 !important; }
html.bois .btn img.emo {
  width: 26px; height: 26px;
  margin: 0 !important;
  padding: 2px;
  box-sizing: border-box;
  border-radius: 50%;
  background: radial-gradient(circle at 36% 30%, rgba(255, 244, 214, .5), rgba(120, 82, 34, .18) 72%);
  box-shadow: 0 0 0 1.5px #c9a45a, 0 0 0 2.5px rgba(74, 48, 16, .55);
  filter: drop-shadow(0 1px 1px rgba(30, 16, 4, .45));
}
html.bois .btn.petit img.emo, html.bois .btn.mini img.emo { width: 20px; height: 20px; padding: 1px; }
html.bois .port .tab .btn img.emo { width: 18px; height: 18px; padding: 1px; }
html.bois .onglet img.emo {
  width: 24px !important; height: 24px !important;
  margin: 0 !important;
  padding: 2px;
  box-sizing: border-box;
  border-radius: 50%;
  background: radial-gradient(circle at 36% 30%, rgba(255, 244, 214, .55), rgba(120, 82, 34, .15) 72%);
  filter: drop-shadow(0 1px 1px rgba(30, 16, 4, .4));
}
html.bois .pan-onglets .onglet img.emo { width: 28px !important; height: 28px !important; margin: 0 !important; }
html.bois #barre img.emo { width: 22px; height: 22px; margin: 0 !important; }
html.bois .ligne-action img.emo { height: 1.45em; width: auto; vertical-align: -.32em; }
html.bois.mobile .btn img.emo { width: 21px; height: 21px; margin: 0 !important; }
html.bois.mobile .onglet img.emo { width: 20px !important; height: 20px !important; margin: 0 !important; }
html.bois .btn { border-width: 10px !important; font-size: 12px; }
html.bois .btn.petit { border-width: 8px !important; font-size: 11.5px; }
html.bois .btn.mini { border-width: 7px !important; font-size: 11px; }
html.bois .port .ligne-action .btn { border-width: 8px !important; }
html.bois .recrues-ligne .btn { border-width: 8px !important; font-size: 11.5px; }
html.bois .btn img.emo, html.bois .onglet img.emo, html.bois #barre img.emo,
html.bois .pan-onglets .onglet img.emo {
  background: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  filter: drop-shadow(0 1px 2px rgba(30, 16, 4, .5)) !important;
}
html.bois .onglet { font-size: 13.5px; letter-spacing: .015em; gap: 7px; }
html.bois .onglet img.emo { width: 29px !important; height: 29px !important; }
html.bois .pan-onglets .onglet img.emo { width: 30px !important; height: 30px !important; }
html.bois .btn { border-width: 9px !important; font-size: 11.5px; }
html.bois .btn img.emo { width: 22px; height: 22px; }
html.bois .btn.petit { border-width: 7px !important; font-size: 11px; }
html.bois .btn.mini { border-width: 6px !important; font-size: 10.5px; }
html.bois .btn.petit img.emo, html.bois .btn.mini img.emo { width: 17px; height: 17px; }
html.bois .recrues-ligne .btn { border-width: 7px !important; font-size: 11px; }
html.bois .recrues-ligne .btn img.emo { width: 19px; height: 19px; }
html.bois .port .tab:not(.navires) td:last-child {
  flex-wrap: nowrap !important;
  min-width: 168px;
  justify-content: flex-start;
}
html.bois .port .tab:not(.navires) th:last-child { min-width: 168px; }
html.bois .port .tab:not(.navires) td:last-child .btn { min-width: 0; flex: 0 1 auto; }
html.bois .port .tab .btn { border-width: 6px !important; font-size: 11.5px; padding: 0 3px; min-width: 42px; }
html.bois .port .tab .btn img.emo { width: 15px; height: 15px; }
html.bois .onglet { padding-top: 13px !important; }
html.bois .onglet.actif { padding-top: 15px !important; }
html.bois.mobile .onglet { padding-top: 10px !important; }
html.bois.mobile .onglet.actif { padding-top: 12px !important; }
html.bois .pan-onglets .onglet { padding-top: 11px !important; }
html.bois .pan-onglets .onglet.actif { padding-top: 13px !important; }
@media (max-width: 1040px) {
  html.bois .port .onglets .onglet { padding-top: 14px !important; }
  html.bois .port .onglets .onglet.actif { padding-top: 16px !important; }
}
html.bois .port .actions-grille { gap: 8px 12px; }
html.bois {
  --pix: 'Alegreya', 'Palatino Linotype', Georgia, serif;
  --txt: 'Alegreya', 'Palatino Linotype', Georgia, serif;
  font-variant-numeric: lining-nums tabular-nums;
}
html.bois #modal.accueil {
  --pix: 'Alegreya Sans SC', 'Palatino Linotype', Georgia, serif;
  --txt: 'Alegreya Sans', 'Segoe UI', Verdana, sans-serif;
  font-variant-numeric: normal;
}
html.bois #barre, html.bois .btn, html.bois .onglet, html.bois .tab th,
html.bois .titre-bloc, html.bois .cb-nom, html.bois .fin-tour, html.bois .voile-titre { font-weight: 800; }
html.bois #barre, html.bois .btn { font-size: 15px; }
html.bois .onglet { font-size: 15px; letter-spacing: 0; }
html.bois.mobile .onglet { font-size: 13.5px; }
html.bois .pan-onglets .onglet { font-size: 12.5px; }
html.bois .btn.petit, html.bois .btn.mini { font-size: 13.5px; }
html.bois .port .tab .btn { font-size: 12.5px; }
html.bois #modal:not(.accueil) > #modal-box, html.bois #panneau, html.bois #journal { font-weight: 500; }
html.bois .onglet-corps, html.bois .pan-corps, html.bois .aide-texte,
html.bois #modal:not(.accueil) > #modal-box {
  font-size: 15px;
  line-height: 1.6;
}
html.bois .tab { font-size: 13.5px; line-height: 1.35; }
html.bois .chiffres, html.bois .rel-val { line-height: 1.3; }
html.bois.mobile .onglet-corps, html.bois.mobile .pan-corps, html.bois.mobile .aide-texte,
html.bois.mobile #modal:not(.accueil) > #modal-box { font-size: 14.5px; line-height: 1.55; }
html.bois.mobile #barre, html.bois.mobile .btn { font-size: 14px; }
@media (max-width: 1040px) {
  html.bois .port .tab:not(.navires) th:last-child { min-width: 150px; }
  html.bois .port .tab:not(.navires) td:last-child { min-width: 150px; }
  html.bois .port .tab th, html.bois .port .tab td { padding-left: 2px; padding-right: 2px; }
  html.bois .port .tab .btn { margin-left: 1px; margin-right: 0; }
}
html.bois .marchand-cols .tab td:last-child .btn.petit, html.bois .port .tab .btn { font-size: 12.5px; }
html.bois .pan-dock .fin-tour .btn { flex-shrink: 0; }
html.bois .onglet { font-size: 13px; padding-top: 8px !important; padding-bottom: 14px !important; }
html.bois .onglet.actif { padding-top: 10px !important; padding-bottom: 18px !important; }
html.bois .onglet img.emo { width: 22px !important; height: 22px !important; margin: -4px 0 -3px !important; }
html.bois.mobile .onglet { font-size: 12px; padding-top: 7px !important; padding-bottom: 12px !important; }
html.bois.mobile .onglet.actif { padding-top: 9px !important; padding-bottom: 16px !important; }
html.bois.mobile .onglet img.emo { width: 19px !important; height: 19px !important; }
@media (max-width: 1040px) {
  html.bois .port .onglets .onglet { padding-top: 9px !important; }
  html.bois .port .onglets .onglet.actif { padding-top: 11px !important; }
}
html.bois .onglet {
  color: #f4e4bf !important;
  text-shadow: 1px 1px 0 rgba(24, 14, 5, .9), 0 0 3px rgba(24, 14, 5, .45) !important;
}
html.bois .onglet.actif {
  color: #43290f !important;
  text-shadow: 0 1px 0 rgba(255, 249, 229, .65) !important;
}
html.bois #panneau .titre-bloc { color: #5c2116 !important; }
html.bois #panneau .titre-bloc small { color: #4a3419; }
html.bois .btn,
html.bois #barre .btn, html.bois #barre button,
html.bois .port .tab .btn, html.bois .btn.petit, html.bois .btn.mini {
  color: #fff4dd !important;
  text-shadow: 1px 1px 0 #2a1608, -1px 1px 0 #2a1608, 1px -1px 0 #2a1608, -1px -1px 0 #2a1608,
               0 2px 3px rgba(20, 10, 2, .5) !important;
}
html.bois .btn.primaire, html.bois .btn:hover:not([disabled]) { color: #fffdf4 !important; }
html.bois .btn[disabled] {
  color: #cdb994 !important;
  text-shadow: 1px 1px 0 rgba(38, 20, 6, .8), -1px 1px 0 rgba(38, 20, 6, .8),
               1px -1px 0 rgba(38, 20, 6, .8), -1px -1px 0 rgba(38, 20, 6, .8) !important;
}
html.bois #menu-deroulant .menu-version, html.bois #menu-deroulant .lien-version {
  border: 0 !important;
  border-image: none !important;
  background: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  min-width: 0 !important;
  color: #7a5c33 !important;
  text-shadow: 0 1px 0 rgba(255, 248, 228, .6) !important;
  font-size: 11px !important;
}
html.bois #menu-deroulant .menu-version b { color: #4a3419 !important; }
html.bois #menu-deroulant .lien-version { text-decoration: underline; }
html.bois #menu-deroulant .lien-version:hover { color: #5c2116 !important; }
html.bois .btn *:not(img), html.bois .onglet *:not(img), html.bois .lien-menu *:not(img) {
  color: inherit !important;
}
html.bois #garde {
  background: url(interface/ui_bois_fond.png) center / 320px 320px repeat, #0a0d18;
}
html.bois #garde::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(ellipse at 50% 46%, rgba(0, 0, 0, .10), rgba(6, 4, 1, .78) 76%);
}
html.bois #garde img, html.bois .garde-appel { position: relative; z-index: 1; }
html.bois #garde img { box-shadow: 0 22px 70px rgba(0, 0, 0, .8), 0 0 0 3px rgba(32, 18, 6, .65); }
@media (min-aspect-ratio: 5/4) {
  html.bois #garde {
    background: #0a0d18 url(../illustrations/affiche_large.webp) center 88% / cover no-repeat !important;
  }
  html.bois #garde::after { background: none !important; }
  html.bois .garde-appel { position: absolute; left: 0; right: 0; bottom: 2.6vh; text-align: center; }
}
html.bois .dialogue .replique {
  background: linear-gradient(#f3e5c6, #ecdcb6);
  border-color: #a98741;
  box-shadow: inset 0 1px 0 rgba(255, 252, 240, .6);
}
html.bois .choix-dialogue .btn { flex-wrap: wrap; align-items: center; text-align: left; }
html.bois .choix-dialogue .btn small {
  flex: 1 0 100%;
  margin: 3px 0 0;
  color: #2c1a09 !important;
  opacity: 1;
  text-shadow: 0 1px 0 rgba(255, 229, 178, .3) !important;
}
html.bois .choix-dialogue .btn[disabled] small { color: #c3ac88 !important; text-shadow: 1px 1px 0 rgba(10, 6, 2, .8) !important; }
html.bois .choix-dialogue .btn small, html.bois.mobile .choix-dialogue .btn small {
  background: rgba(255, 244, 214, .9); border: 1px solid rgba(90, 58, 26, .4); border-radius: 5px; padding: 2px 8px;
  font-weight: 700; color: #2a1606 !important; text-shadow: none !important; }
html.bois .choix-dialogue .btn[disabled] small, html.bois.mobile .choix-dialogue .btn[disabled] small { background: rgba(255, 244, 214, .55); }
html.bois .pan-onglets .onglet img.ecusson-onglet { width: 30px !important; height: 30px !important; margin: 0 !important; }
html.bois.mobile .pan-onglets .onglet img.ecusson-onglet { width: 20px !important; height: 20px !important; margin: 0 !important; }
html.bois.mobile .pan-onglets .onglet { padding-top: 3px !important; padding-bottom: 8px !important; min-height: 0 !important; }
html.bois.mobile .pan-onglets .onglet.actif { padding-bottom: 10px !important; }
html.bois.mobile .pan-onglets .onglet img.emo, html.bois.mobile .pan-onglets .onglet img.ecusson-onglet { width: 18px !important; height: 18px !important; margin: 0 !important; }
html.bois .pan-onglets { justify-content: center; }
html.bois .pan-onglets .onglet { max-width: 110px; }
