/*
 * Ekoloko World — in-game panels brought back to the original Flash art (main.swf).
 * Global sheet (not scoped to the sign-in); each block names the original symbol it follows.
 * Versioned in the file name: never edit in place, ship vN+1.
 * v3: higher-specificity Eko-bit rules (the lazily loaded bundle sheet comes later). v2: Eko-bit in the original buddies-menu look (buddiesmenu, char 2952).
 */
@font-face{font-family:EkoGan;src:url('gan-clm.woff2') format('woff2');font-weight:400 900;font-display:swap;unicode-range:U+0590-05FF,U+FB1D-FB4F,U+20AA}

/* ---------------------------------------------------------------------------------------------
 * "הדמויות שלי" (account panel) on the original UserSettingsPane (main.swf char 1019, body 1008):
 * lime pane with rays and stars, a left column, a large box, two strips — mapped onto the
 * panel's own parts: characters in the large box, Discord in the middle strip, pioneers in the
 * left column, the title in the top band.
 * Pane art 1176x874 shown at 712x529 from (-6,-24) of the 700x428 panel: scale 0.6054.
 * ------------------------------------------------------------------------------------------- */
.acct{--ink:#2c4516;--edge:#6f8f12}
.acct .acct__frame{visibility:hidden}
.acct::before{
  position:absolute;left:-6px;top:-24px;width:712px;height:529px;content:'';pointer-events:none;
  background:url('game/settings-pane.webp') 0 0/100% 100% no-repeat;filter:drop-shadow(0 6px 10px #1e330a55)
}
.acct > *{z-index:1}
.acct .acct__title{
  left:222px;right:15px;top:38px;width:auto;line-height:1.1;
  font:700 32px/1.1 EkoGan,'Trebuchet MS',Arial,sans-serif;color:#e0201b;
  text-shadow:0 2px 0 #fff,2px 0 0 #fff,-2px 0 0 #fff,0 -2px 0 #fff,0 4px 3px #3e5a0c55
}
/* the original popups' close: a white tile with a red cross */
.acct .acct__close{left:auto;right:4px;top:-12px;width:36px;height:36px;border:2px solid #b9c98a;border-radius:7px;background:#fffef6;box-shadow:0 2px 0 #6f8f1255}
.acct .acct__close path{stroke:#fff;stroke-width:7.5}
.acct .acct__close path+path{stroke:#e0201b;stroke-width:4.6}
.acct .acct__close:hover,.acct .acct__close:focus-visible{transform:scale(1.08)}
/* characters in the large box (x 222..685, y 113..334) */
.acct .acct__deck{left:222px;right:auto;top:113px;width:578px;height:276px;padding:0 6px;transform:scale(.8);transform-origin:0 0}
.acct .acct__slot--mine{--c:#ffffff;--fill:rgba(255,255,255,.55);--glow:rgba(255,255,255,.8);--beam:rgba(255,255,255,.55)}
.acct .acct__name{--o:#3e5a0c}
.acct .acct__level{border-color:#6f8f12;color:#3e5a0c}
.acct .acct__swap path{fill:#fffde8;stroke:#3e5a0c}
/* the original yellow buttons (Change Password / Change email) */
.acct .acct__go,.acct .acct__now{
  border:1.5px solid #a07400;border-radius:9px;color:#4a3214;
  background:linear-gradient(180deg,#fff27a,#ffd21c 55%,#f5b800);box-shadow:inset 0 2px #ffffffa6,inset 0 -3px #d99a00,0 2px #3e5a0c55
}
.acct .acct__go::before,.acct .acct__go::after{background:#fff8c8}
.acct .acct__now path{stroke:#4a3214}
.acct .acct__now path+path{stroke:#fff}
/* the footer's cards leave the footer and take the pane's own boxes */
.acct .acct__foot{display:contents}
.acct .acct__card{position:absolute;border-radius:9px}
.acct .acct__card--pio{background:none;box-shadow:none}
/* the login method line reads "מחוברים דרך  בתור …" for a password account (no provider): hidden */
.acct .acct__card--discord .acct__lines span{display:none}
/* Discord in the middle strip (y 344..433) */
.acct .acct__card--discord{left:222px;top:344px;width:463px;height:89px;padding:0 18px}
/* pioneers in the left column (x 10..209, y 113..494), as the original "Become a pioneer" column */
.acct .acct__card--pio{left:10px;top:113px;width:199px;height:381px;flex-direction:column;justify-content:center;gap:18px;padding:16px 12px;text-align:center}
.acct .acct__card--pio img{width:104px;height:auto}
.acct .acct__card--pio .acct__lines{align-items:center}
.acct .acct__card--pio strong{white-space:normal;color:#2c4516;font-size:17px}
/* the original orange "Become a pioneer" button */
.acct .acct__mini{
  height:auto;min-height:40px;padding:6px 16px 8px;border:1.5px solid #b55a00;border-radius:9px;color:#3a2000;
  background:linear-gradient(180deg,#ffbf4a,#ff9a1a 55%,#f07c00);box-shadow:inset 0 2px #ffffff8c,inset 0 -3px #c86400,0 2px #3e5a0c55;font-size:15px
}
.acct .acct__mini:hover,.acct .acct__mini:focus-visible{box-shadow:inset 0 2px #ffffff8c,inset 0 -3px #c86400,0 4px #3e5a0c55}
@media (prefers-reduced-motion:reduce){.acct .acct__close:hover{transform:none}}

/* ---------------------------------------------------------------------------------------------
 * Eko-bit (an world addition) in the language of the original buddies menu (main.swf char 2952):
 * a #71afd6 frame with a white rim, flat #e7e7e7 panes, a #d9d9d9 bottom strip, folder-tab tabs,
 * the original orange close tile.
 * ------------------------------------------------------------------------------------------- */
section.bit.bit{--blue:#71afd6;--pane:#e7e7e7;--pane-low:#e2e2e2;--line:#c7c7c7;--deep:#2f5f86;border:3px solid #fff;border-radius:12px;background:var(--blue);box-shadow:0 0 0 1px #4a7fa8,3px 4px 8px #00000059}
section.bit.bit .bit__head,section.bit.bit .bit__main,section.bit.bit .bit-note{border-radius:8px;background:#e7e7e7;box-shadow:inset 0 1px 2px #0000001f}
section.bit.bit .bit__title{color:#2f5f86;text-shadow:0 1px 0 #fff}
section.bit.bit .bit__tab{height:30px;border:2px solid #fff;border-bottom:0;border-radius:9px 9px 0 0;background:#d4e7f5;color:#2f5f86!important;font-weight:700}
section.bit.bit .bit__tab.is-on{background:#e7e7e7;border-color:#fff;color:#333!important}
section.bit.bit .bit-note{background:#d9d9d9}
section.bit.bit .bit__mine{border-color:#c7c7c7;background:#fff}
section.bit.bit .bit-locked b{color:#2f5f86}