/*
 * Heroes of Tida mobile RPG skin.
 * Compact by design: the legacy game remains readable on a phone and keeps
 * its original image assets, while spacing and controls become consistent.
 */

html {
  min-height: 100%;
  background: #07090b;
}

body {
  width: 100%;
  max-width: 480px;
  min-height: 100%;
  margin: 0 auto;
  color: #d9ddd8;
  background: #090c10 url('/img/inter/bg_body.jpg') repeat;
  font-family: Arial, Verdana, Tahoma, sans-serif;
  font-size: 14px;
  line-height: 1.35;
  -webkit-text-size-adjust: 100%;
}

* {
  box-sizing: border-box;
}

a {
  color: #d6b66b;
  text-decoration: none;
}

a:hover,
a:focus {
  color: #fff1bf;
  text-decoration: none;
}

#containerAPI {
  width: 100%;
}

.bdr.bg_main {
  margin: 5px;
  padding: 2px;
  overflow: hidden;
  border: 1px solid #806740;
  border-radius: 5px;
  background: #17130e;
  box-shadow:
    inset 0 0 0 1px #2c2419,
    0 0 0 1px #050607;
}

.bdr.bg_main,
.bdr.bg_main .light,
.bdr.bg_main .wr1,
.bdr.bg_main .wr2,
.bdr.bg_main .wr3,
.bdr.bg_main .wr4,
.bdr.bg_main .wr5,
.bdr.bg_main .wr6,
.bdr.bg_main .wr7,
.bdr.bg_main .wr8 {
  background-image: none;
}

.bdr.bg_main .wr8 {
  padding: 0;
}

div.box_inter,
div.body {
  background: #15191d;
}

div.body {
  overflow-x: hidden;
}

div.thead,
div.thead2,
div.hofa {
  width: 100%;
  min-height: 69px;
  background-color: #241713;
  background-position: center;
  background-repeat: no-repeat;
  background-size: auto 100%;
  border-bottom: 1px solid #725739;
}

div.thead,
div.hofa {
  height: 92px;
}

div.h1b {
  display: block;
  padding: 5px 7px 6px;
  color: #d9ddd8;
  background: linear-gradient(to bottom, #20272d 0, #12171b 100%);
  border-top: 0;
  border-bottom: 1px solid #564a38;
  font-size: 13px;
  line-height: 1.65;
  text-align: left;
}

div.h1b .nobr {
  display: inline-block;
  min-height: 18px;
  margin-right: 8px;
  padding: 0;
  white-space: nowrap;
  vertical-align: middle;
}

div.h1b .nobr:first-child {
  color: #fff0bd;
  font-weight: bold;
}

div.h1b img,
div.h2b img {
  margin-right: 3px;
  vertical-align: -2px;
}

div.h2b {
  padding: 5px 7px;
  color: #c9d1d5;
  background: #101418;
  border-color: #3e444a;
  font-size: 13px;
}

.battle-status-strip {
  padding-top: 3px !important;
  padding-bottom: 3px !important;
  color: #aeb7bb !important;
  background: linear-gradient(160deg, #1b2730, #0d141b) !important;
  border-color: #766344 !important;
  font-size: 11px !important;
  line-height: 1.4 !important;
}

.battle-status-strip p {
  display: inline;
}

.battle-assault-meta {
  margin: 0;
  padding: 10px 12px;
  color: #d9ddd8;
  background: #121820;
  border-bottom: 1px solid #63563e;
}

div.b1 {
  position: relative;
  color: #fff5d7;
  background: linear-gradient(to bottom, #543128 0, #331c18 52%, #291613 100%);
  border-top: 1px solid #8b6847;
  border-bottom: 1px solid #1b0e0c;
}

div.b1:before,
div.b1:after {
  content: "";
  position: absolute;
  top: 50%;
  width: 16px;
  height: 1px;
  background: #a88952;
}

div.b1:before {
  left: 5px;
}

div.b1:after {
  right: 5px;
}

div.b1 h1,
div.b1 h2 {
  padding: 5px 25px;
  color: #fff5d7;
  font-size: 14px;
  line-height: 1.25;
  font-weight: bold;
  text-align: center;
  text-shadow: 0 1px #160b09;
}

div.b2,
div.b2b {
  padding: 6px 8px;
  border-color: #3d4246;
  background: #181d21;
}

div.bn {
  padding: 0 5px;
  border-color: #3d4246;
  background: #15191d;
}

div.b3 {
  padding: 5px 8px;
  border-color: #3b4044;
  background: #0f1316;
}

div.b4 {
  margin: 4px 6px;
  padding: 6px 8px;
  color: #e5c16c;
  background: #1d2225;
  border: 1px solid #484239;
  border-radius: 3px;
}

div.brt {
  border-top-color: #554b3d;
}

div.brb {
  border-bottom-color: #554b3d;
}

div.award_in,
div.box1s {
  margin: 5px 2px;
  padding: 7px 8px;
  color: #f3e8ce;
  background: linear-gradient(to bottom, #282820 0, #1c1e19 100%);
  border: 1px solid #766634;
  border-radius: 3px;
}

div.tx1 {
  padding-top: 5px;
  color: #e6bd63;
}

ul.nav,
ul.navb {
  padding: 0;
  margin: 0;
  list-style: none;
}

ul.nav li,
ul.navb li {
  min-height: 34px;
  padding: 0;
  margin: 0;
  list-style: none;
  border: 0;
  border-bottom: 1px solid #30363a;
  background: linear-gradient(to bottom, #1d2327 0, #171b1f 100%);
}

ul.nav li:last-child,
ul.navb li:last-child {
  border-bottom: 0;
}

ul.nav li a,
ul.navb li a,
ul.navb li a.active_s,
ul.navb li a.disable_s {
  display: block;
  min-height: 34px;
  padding: 7px 8px 6px;
  color: #d4d9dc;
  line-height: 20px;
  text-decoration: none;
}

ul.nav li a:hover,
ul.nav li a:focus,
ul.navb li a:hover,
ul.navb li a:focus {
  color: #fff1bd;
  background: #272d31;
}

ul.nav li img,
ul.navb li img {
  margin-right: 7px;
  padding: 0;
  vertical-align: -5px;
}

ul.navb li a.active_s {
  color: #fff0a6;
  background: #2b271d;
}

ul.navb li a.disable_s {
  color: #747b7e;
  background: #14181b;
}

form {
  width: 100%;
}

div.pt {
  padding: 4px 0;
}

div.info {
  padding: 5px 0 2px;
  color: #d8bd77;
  font-weight: bold;
}

input,
select,
textarea {
  max-width: 100%;
  min-height: 34px;
  padding: 6px 8px;
  color: #f2f4f5;
  background: linear-gradient(to bottom, #0d1013 0, #151a1e 100%);
  border: 1px solid #5b6265;
  border-radius: 3px;
  font-family: inherit;
  font-size: 14px;
}

input.inp,
select {
  width: 100%;
  max-width: 300px;
  height: 34px;
}

textarea {
  width: 100%;
  min-height: 90px;
}

input:focus,
select:focus,
textarea:focus {
  outline: 1px solid #d1ad5d;
  border-color: #d1ad5d;
}

div.but {
  padding: 7px 0;
  text-align: center;
}

input.butt,
input.buttr,
input.but2,
input.but3,
input.but,
a.but2 {
  width: auto;
  min-width: 125px;
  min-height: 34px;
  height: auto;
  padding: 6px 13px;
  color: #fff7dc;
  background: linear-gradient(to bottom, #997538 0, #62461f 52%, #473116 100%);
  border: 1px solid #c39b52;
  border-radius: 3px;
  box-shadow: inset 0 1px rgba(255, 244, 197, .18);
  font-size: 14px;
  font-weight: bold;
  text-shadow: 0 1px #211405;
  cursor: pointer;
}

input.butt:active,
input.but2:active,
input.but:active,
a.but2:active {
  background: #4a3418;
  transform: translateY(1px);
}

input.buttr,
input.but3 {
  background: linear-gradient(to bottom, #9c4c42 0, #672b27 100%);
  border-color: #bb655b;
}

input.num {
  width: 62px;
  height: 34px;
}

table {
  max-width: 100%;
}

table.items_box,
table.box1 {
  width: 100%;
  margin: 4px 0;
  background: #181d21;
  border: 1px solid #3d4448;
  border-collapse: separate;
}

table.items_box td,
table.box1 td {
  padding: 5px;
}

div.items {
  padding: 2px 0;
}

div.item_name {
  padding: 0 0 2px 4px;
  color: #fff0bd;
  font-weight: bold;
}

div.item_info,
div.item_param,
div.item_status,
div.item_todo {
  padding: 2px 4px;
}

div.line {
  padding: 6px 0;
  border-color: #41474a;
}

div.battle {
  font-size: 13px;
}

.battle-hud {
  padding: 6px;
  background: linear-gradient(160deg, #1b2730, #0d141b);
  border-bottom: 1px solid #766344;
}

.battle-fighters {
  display: table;
  width: 100%;
  table-layout: fixed;
}

.battle-fighter,
.battle-vs {
  display: table-cell;
  vertical-align: middle;
}

.battle-fighter {
  width: 44%;
  padding: 5px 6px;
  background: #161c22;
  border: 1px solid #63563e;
  border-radius: 3px;
}

.battle-fighter-self {
  border-color: #8a7045;
}

.battle-fighter-opponent {
  background: #221a18;
  border-color: #75453f;
}

.battle-fighter-damaged {
  animation: battle-fighter-hit .32s ease-out;
}

.battle-vs {
  width: 12%;
  color: #d5b679;
  font-size: 12px;
  font-weight: bold;
  text-align: center;
  text-shadow: 0 1px #000;
}

.battle-fighter-top,
.battle-fighter-bottom {
  overflow: hidden;
  white-space: nowrap;
}

.battle-fighter-top {
  margin-bottom: 4px;
  color: #f3e5bf;
  font-weight: bold;
  text-overflow: ellipsis;
}

.battle-fighter-level {
  float: right;
  min-width: 19px;
  padding: 0 4px;
  color: #e3c26d;
  background: #29251a;
  border: 1px solid #5e5132;
  border-radius: 2px;
  font-size: 11px;
  text-align: center;
}

.battle-fighter-bottom {
  padding-top: 3px;
  color: #aeb8bd;
  font-size: 11px;
}

.battle-fighter-bottom > span + span {
  float: right;
}

.battle-fighter-bottom img {
  margin-right: 2px;
  vertical-align: -2px;
}

.battle-hp {
  height: 9px;
  overflow: hidden;
  background: #080a0c;
  border: 1px solid #343a3e;
  border-radius: 2px;
  box-shadow: inset 0 1px 2px #000;
}

.battle-hp-fill {
  display: block;
  height: 100%;
  background: linear-gradient(to bottom, #99cf62 0, #4d842f 55%, #355d24 100%);
  transition: width .35s ease;
}

.battle-fighter-opponent .battle-hp-fill {
  background: linear-gradient(to bottom, #e07168 0, #a53f38 55%, #702824 100%);
}

.battle-event {
  min-height: 27px;
  margin-top: 5px;
  padding: 4px 7px;
  color: #d9ddd8;
  background: #111820;
  border: 1px solid #63563e;
  border-radius: 2px;
  font-size: 12px;
  text-align: center;
}

.battle-event-hit {
  animation: battle-event-pulse .55s ease-out;
}

.battle-event-label {
  color: #8e989d;
  font-size: 9px;
  font-weight: bold;
}

.battle-event-out {
  color: #e7c56f;
  font-size: 16px;
  font-weight: bold;
}

.battle-event-in {
  color: #ef7770;
  font-size: 16px;
  font-weight: bold;
}

.battle-event-separator {
  padding: 0 7px;
  color: #6f787d;
}

.battle-event-muted {
  color: #8e989d;
}

.battle-action-title {
  padding: 4px 7px;
  color: #dbc47f;
  background: #121820;
  border-top: 1px solid #766344;
  border-bottom: 1px solid #766344;
  font-size: 10px;
  font-weight: bold;
  text-align: center;
  letter-spacing: .08em;
}

ul.battle-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px;
  padding: 5px;
  background: #0d1218;
}

ul.battle-actions li {
  min-height: 39px;
  border: 1px solid #79684b;
  border-radius: 3px;
  background: linear-gradient(140deg, #28323be8, #0d141cea);
}

ul.battle-actions li a,
ul.battle-actions li a.active_s,
ul.battle-actions li a.disable_s {
  min-height: 37px;
  padding: 8px 6px;
  line-height: 20px;
  text-align: center;
}

ul.battle-actions li a.active_s {
  color: #f2deb0;
}

ul.battle-actions li a.disable_s {
  color: #747b7e;
  background: #111518;
}

ul.battle-actions li a:active {
  background: linear-gradient(#a87634, #624020);
  color: #fff0ce;
  transform: translateY(1px);
}

.battle-action-pending {
  color: #fff3c8 !important;
  background: #4a3820 !important;
  animation: battle-action-charge .7s ease-in-out infinite alternate;
}

.battle-action-running .battle-actions a:not(.battle-action-pending) {
  opacity: .48;
}

ul.battle-actions li img {
  margin-right: 5px;
  vertical-align: -3px;
}

ul.battle-elixirs {
  padding: 5px 7px;
  color: #a9d28d;
  background: #121a16;
  border-top: 1px solid #344638;
  border-bottom: 1px solid #344638;
}

ul.battle-elixirs a {
  display: inline-block;
  min-height: 30px;
  margin: 2px 5px 2px 0;
  padding: 5px 8px;
  color: #bfe6a2;
  background: #1c2b20;
  border: 1px solid #49634b;
  border-radius: 3px;
}

.battle-log {
  max-height: 185px;
  overflow-y: auto;
  padding: 3px 6px;
  background: #101417;
}

.battle-log-entry {
  padding: 5px 3px;
  color: #aeb7bb;
  border-bottom: 1px solid #292e31;
}

.battle-log-entry:last-child {
  border-bottom: 0;
}

.battle-log-entry-new {
  color: #f0dfb2;
  background: #211f18;
  animation: battle-log-new 1.1s ease-out;
}

div.l1 {
  margin: 4px 0;
  padding: 6px 7px;
  color: #efd47c;
  background: #0e1215;
  border: 1px solid #555b5e;
  border-radius: 2px;
}

div.ava {
  padding: 5px;
}

div.text_in {
  margin: 5px 2px;
  padding: 7px 8px;
  color: #ef9a9a;
  background: #281817;
  border: 1px solid #693b3b;
  border-radius: 3px;
}

div.online {
  padding: 5px;
  color: #e7c56f;
}

div.page {
  padding: 5px 0;
}

div.page a,
div.page a.this {
  display: inline-block;
  min-width: 28px;
  min-height: 28px;
  margin: 2px;
  padding: 4px 7px;
  border-radius: 2px;
  text-align: center;
}

div.tfooter {
  padding: 9px 7px;
  color: #929b9f;
  background: #0e1215;
  border-top: 1px solid #3a3f42;
  font-size: 12px;
}

div.body > div img.responsive-img,
div.body img[width="230"],
div.body img[width="240"],
div.body img[width="320"] {
  max-width: 100%;
  height: auto;
}

.red { color: #ef7770 !important; }
.blue { color: #7dbce8; }
.green, .green2, .lime { color: #82d47d; }
.orange, .yellow, .sun { color: #e7c56f; }
.grey { color: #9aa3a8; }
.white { color: #f5f7f8; }
.violet { color: #b99ae0; }

/* Autumn 2026 seasonal event */
.harvest-intro {
  color: #d8cdb7;
  text-align: center;
}

.harvest-intro .small {
  display: block;
  padding-top: 4px;
}

.harvest-tree {
  position: relative;
  padding: 8px 8px 10px;
  overflow: hidden;
  background: #17130e;
  border-bottom: 1px solid #655139;
  text-align: center;
}

.harvest-tree:before,
.harvest-tree:after {
  content: "";
  position: absolute;
  z-index: 2;
  width: 8px;
  height: 8px;
  background: #c98b37;
  border-radius: 70% 15% 70% 15%;
  opacity: .8;
  animation: harvest-leaf-fall 4.8s linear infinite;
}

.harvest-tree:before { top: -10px; left: 18%; }
.harvest-tree:after { top: -18px; right: 22%; animation-delay: 1.9s; }

.harvest-tree > img {
  display: block;
  width: 100%;
  max-width: 310px;
  height: auto;
  margin: 0 auto;
  border: 1px solid #6d5234;
  filter: sepia(.35) saturate(1.2);
}

.harvest-tree > picture {
  display: block;
}

.harvest-tree > picture > img {
  display: block;
  width: 100%;
  max-width: 310px;
  height: auto;
  margin: 0 auto;
  border: 1px solid #6d5234;
  filter: sepia(.35) saturate(1.2);
}

.harvest-stage-name {
  margin-top: 6px;
  color: #efcf80;
  font-weight: bold;
}

.harvest-progress,
.harvest-server-progress,
.harvest-boss-hp {
  position: relative;
  height: 13px;
  margin: 6px 0 3px;
  overflow: hidden;
  background: #080a0b;
  border: 1px solid #4b4031;
  border-radius: 2px;
}

.harvest-progress > span,
.harvest-server-progress > span {
  display: block;
  height: 100%;
  background: linear-gradient(to bottom, #d5a43d 0, #9a5d22 100%);
  transition: width .35s ease;
}

.harvest-progress-text {
  color: #aeb5b8;
  font-size: 11px;
}

.harvest-resources {
  display: table;
  width: 100%;
  table-layout: fixed;
  background: #101417;
  border-bottom: 1px solid #4b4031;
}

.harvest-resources > div {
  display: table-cell;
  padding: 6px 3px;
  border-right: 1px solid #303538;
  text-align: center;
}

.harvest-resources > div:last-child { border-right: 0; }
.harvest-resources b,
.harvest-resources small { display: block; }
.harvest-resources b { color: #efcf80; }
.harvest-resources small { color: #8f989c; font-size: 9px; }

.harvest-resource-icon {
  display: inline-block;
  width: 18px;
  height: 18px;
  margin-bottom: 2px;
  color: #fff0b1;
  background: #744923;
  border: 1px solid #bd8a42;
  border-radius: 50%;
  font-size: 10px;
  font-weight: bold;
  line-height: 16px;
}

.harvest-actions form {
  padding: 5px 0;
  border-bottom: 1px solid #343a3d;
}

.harvest-actions form:last-child { border-bottom: 0; }
.harvest-actions label { display: block; padding-bottom: 4px; color: #d4c8ae; }
.harvest-actions .num { margin-right: 4px; }

.harvest-blessing-current {
  margin: 5px 0;
  padding: 7px 8px;
  color: #cfd9c4;
  background: #18231a;
  border: 1px solid #4c6344;
}

.harvest-blessing-current b { color: #a8d08f; }
.harvest-blessings form,
.harvest-shop form,
.harvest-milestones form {
  margin: 0;
}

.harvest-blessings button,
.harvest-shop button {
  display: block;
  width: 100%;
  min-height: 34px;
  padding: 7px 8px 6px;
  color: #d4d9dc;
  background: transparent;
  border: 0;
  border-radius: 0;
  font: inherit;
  line-height: 20px;
  text-align: left;
  cursor: pointer;
}

.harvest-blessings button:hover,
.harvest-shop button:hover {
  color: #fff1bd;
  background: #272d31;
}

.harvest-blessings small,
.harvest-shop small {
  display: block;
  padding-left: 26px;
  color: #939ca0;
  font-size: 10px;
}

.harvest-server-progress { height: 18px; }
.harvest-server-progress b {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  color: #fff1bd;
  font-size: 11px;
  line-height: 16px;
  text-align: center;
  text-shadow: 0 1px #000;
}

.harvest-milestones {
  display: table;
  width: 100%;
  margin-top: 7px;
  table-layout: fixed;
}

.harvest-milestones > div {
  display: table-cell;
  padding: 4px 2px;
  color: #6f777b;
  border-right: 1px solid #30363a;
  text-align: center;
}

.harvest-milestones > div:last-child { border-right: 0; }
.harvest-milestones .unlocked { color: #e4c36f; }
.harvest-milestones b,
.harvest-milestones span,
.harvest-milestones small,
.harvest-milestones a { display: block; }
.harvest-milestones span,
.harvest-milestones small,
.harvest-milestones a { font-size: 9px; }

.harvest-milestones button {
  padding: 2px 4px;
  color: #fff0b1;
  background: #5c3c1e;
  border: 1px solid #9f7133;
  border-radius: 2px;
  font-size: 9px;
  cursor: pointer;
}

.harvest-boss { text-align: center; }
.harvest-boss-name { color: #efb074; font-weight: bold; }
.harvest-boss-hp > span {
  display: block;
  height: 100%;
  background: linear-gradient(to bottom, #df6758 0, #842e28 100%);
  transition: width .35s ease;
}

.harvest-done {
  padding: 6px;
  color: #a8d08f;
  background: #172019;
  border: 1px solid #41553e;
  text-align: center;
}

.harvest-battle-banner {
  padding: 7px 8px;
  color: #d9cbb0;
  background: linear-gradient(to bottom, #302017 0, #181411 100%);
  border-top: 1px solid #94643b;
  border-bottom: 1px solid #94643b;
  text-align: center;
}

.harvest-battle-title {
  color: #f0bd75;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.harvest-battle-portrait {
  display: block;
  width: 96px;
  height: 64px;
  margin: 0 auto 5px;
  object-fit: cover;
  object-position: center;
  background: #0b0e0f;
  border: 1px solid #9a693e;
  border-radius: 3px;
}

.harvest-battle-hp {
  color: #d79c83;
  font-size: 11px;
}

.harvest-battle-note {
  padding-top: 4px;
  color: #a69c89;
  font-size: 10px;
}

.harvest-button {
  min-width: 150px;
  min-height: 34px;
  padding: 6px 13px;
  color: #fff7dc;
  background: linear-gradient(to bottom, #997538 0, #62461f 52%, #473116 100%);
  border: 1px solid #c39b52;
  border-radius: 3px;
  font-size: 14px;
  font-weight: bold;
  cursor: pointer;
}

.harvest-rating p {
  min-height: 27px;
  padding: 4px 3px;
  border-bottom: 1px solid #30363a;
}

.harvest-rating p:last-child { border-bottom: 0; }
.harvest-rating p > span { float: right; color: #e4c36f; }

/* Equipment, bag and armoury */
.equipment-screen,
.inventory-screen,
.armory-screen .b2 {
  background: #111519;
}

.equipment-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px;
}

.equipment-grid > table.items_box {
  min-width: 0;
  margin: 0;
  background:
    linear-gradient(to bottom, #22282c 0, #151a1d 100%);
  border-color: #555044;
}

.equipment-grid > table.items_box td:first-child {
  width: 48px;
  text-align: center;
}

.equipment-grid > table.items_box td:first-child img {
  max-width: 42px;
  max-height: 42px;
  object-fit: contain;
}

.equipment-grid > table.items_box .item_name {
  min-height: 19px;
  padding-left: 0;
  overflow: hidden;
  color: #f0d28b;
  font-size: 12px;
  line-height: 1.25;
}

.equipment-grid > table.items_box .item_todo {
  padding: 4px 0 0;
  font-size: 10px;
}

.equipment-grid > table.items_box .item_todo a {
  display: inline-block;
  margin: 1px 2px 1px 0;
  padding: 2px 5px;
  background: #20262a;
  border: 1px solid #4b5459;
  border-radius: 2px;
}

.equipment-grid > table.items_box img[src*="empty.jpg"] {
  opacity: .35;
  filter: grayscale(1);
}

.inventory-list > table.items_box,
.armory-screen table.items_box {
  position: relative;
  margin: 5px 0;
  background:
    linear-gradient(to bottom, #20262a 0, #151a1e 100%);
  border-color: #4a5053;
}

.inventory-list > table.items_box:before,
.armory-screen table.items_box:before {
  content: "";
  position: absolute;
  top: 4px;
  bottom: 4px;
  left: 47px;
  width: 1px;
  background: #353c40;
}

.inventory-list > table.items_box td:first-child,
.armory-screen table.items_box td:first-child {
  width: 48px;
  padding: 5px;
  text-align: center;
}

.inventory-list > table.items_box td:first-child img,
.armory-screen table.items_box td:first-child img {
  width: 38px !important;
  height: 38px !important;
  object-fit: contain;
  background: #0d1012;
  border: 1px solid #5e5545;
  border-radius: 2px;
}

.inventory-list .item_name,
.armory-screen .item_name {
  padding: 0 0 3px 5px;
  color: #f0d28b;
  font-size: 13px;
}

.inventory-list .item_param,
.inventory-list .item_info,
.inventory-list .item_status,
.armory-screen .item_param,
.armory-screen .item_info,
.armory-screen .item_status {
  padding: 2px 0 2px 5px;
  color: #aeb7bb;
  font-size: 11px;
  line-height: 1.35;
}

.inventory-list .item_todo,
.armory-screen .item_todo {
  padding: 4px 0 0 5px;
  font-size: 11px;
}

.inventory-list .item_todo a,
.armory-screen .item_todo a {
  display: inline-block;
  min-height: 24px;
  margin: 2px 3px 1px 0;
  padding: 3px 7px;
  color: #e6d8b5;
  background: #252b2f;
  border: 1px solid #515a5f;
  border-radius: 2px;
  line-height: 16px;
}

.inventory-list .item_todo a.green,
.armory-screen .item_todo a.green {
  color: #bde2a6;
  background: #1b2a1d;
  border-color: #47634a;
}

.inventory-list .item_todo a.red,
.armory-screen .item_todo a.red {
  color: #efaaa3 !important;
  background: #2b1918;
  border-color: #70413d;
}

.inventory-list .item_todo a.violet,
.armory-screen .item_todo a.violet {
  color: #d3b5ed;
  background: #251d2b;
  border-color: #5e496c;
}

.armory-screen .b1 h2 {
  color: #f3dda8;
}

.armory-screen form {
  padding: 4px 0;
}

.armory-screen select {
  max-width: 220px;
}

/* Auction lots and all shop showcases */
.auction-screen .items_box,
.shop-screen .items_box {
  position: relative;
  margin: 5px 0;
  background: linear-gradient(to bottom, #22272b 0, #15191d 100%);
  border-color: #554d3e;
}

.auction-screen .items_box td:first-child,
.shop-screen .items_box td:first-child {
  width: 54px;
  padding: 6px;
  text-align: center;
}

.auction-screen .items_box td:first-child > img,
.shop-screen .items_box td:first-child > img {
  width: 44px !important;
  height: 44px !important;
  object-fit: contain;
  background: #0c0f11;
  border: 1px solid #695a40;
  border-radius: 3px;
}

.auction-screen .item_name,
.shop-screen .item_name {
  padding: 0 0 3px 5px;
  color: #f1d591;
  font-size: 13px;
  line-height: 1.3;
}

.auction-screen .items_box td.top > p,
.shop-screen .items_box td.top > p {
  padding: 2px 0 2px 5px;
  color: #aeb7bb;
  font-size: 11px;
}

.auction-screen .item_todo,
.shop-screen .item_todo {
  padding: 4px 0 0 5px;
}

.auction-screen .item_todo a,
.shop-screen .item_todo a {
  display: inline-block;
  min-height: 25px;
  margin: 2px 3px 1px 0;
  padding: 4px 8px;
  color: #edd9a7;
  background: #34291a;
  border: 1px solid #79613a;
  border-radius: 2px;
  font-size: 11px;
  line-height: 15px;
}

.auction-screen hr {
  height: 1px;
  margin: 7px 0;
  background: #4a4032;
  border: 0;
}

.auction-screen form,
.shop-screen form {
  max-width: 100%;
}

.auction-screen .num {
  vertical-align: middle;
}

.auction-screen select,
.auction-screen input[type="text"],
.auction-screen input[type="number"],
.auction-screen input[type="search"],
.auction-screen input[type="email"],
.auction-screen input[type="password"] {
  min-height: 34px;
  height: 34px;
  padding: 6px 8px;
  color: #f4ead1 !important;
  background: #101519 !important;
  border: 1px solid #756544 !important;
  border-radius: 3px;
  font-size: 14px;
  vertical-align: middle;
}

.auction-screen select {
  min-width: 184px;
  padding-right: 26px;
  color-scheme: dark;
}

.auction-screen select option,
.auction-screen select optgroup {
  color: #f4ead1;
  background: #151b20;
  font-size: 14px;
}

.auction-screen select option:checked,
.auction-screen select option[selected] {
  color: #fff3c8;
  background: #5e4726;
}

.auction-screen input[type="radio"],
.auction-screen input[type="checkbox"] {
  width: 18px;
  min-width: 18px;
  height: 18px;
  min-height: 18px;
  padding: 0;
  margin: 0 4px 0 7px;
  color: #d4aa58;
  accent-color: #c99b45;
  background: transparent !important;
  border: 0 !important;
  vertical-align: -4px;
}

.auction-screen label,
.auction-screen form > p,
.auction-screen form > img {
  color: #d5c6a5;
}

.auction-screen .filter-row,
.auction-screen .filter-group {
  margin: 5px 0;
  padding: 6px 7px;
  color: #d5c6a5;
  background: #171d21;
  border: 1px solid #363f43;
  border-radius: 3px;
}

.auction-screen .filter-row select,
.auction-screen .filter-row input {
  margin: 2px 3px 2px 0;
}

.auction-screen .filter-submit {
  margin-top: 7px;
}

.auction-screen .page,
.auction-resources-screen .page,
.auction-services-screen .page {
  text-align: center;
}

/* Other player profile */
.foreign-profile-screen > .b2 {
  background: #151a1e;
}

.foreign-profile-hero table.items_box {
  background: linear-gradient(to bottom, #24292d 0, #171b1f 100%);
  border-color: #66583f;
}

.foreign-profile-hero table.items_box td:first-child {
  width: 72px;
  padding: 7px;
}

.foreign-profile-hero table.items_box td:first-child img {
  max-width: 64px;
  height: auto;
  border: 1px solid #705c3d;
  border-radius: 3px;
}

.foreign-profile-screen .pers {
  margin: 5px 0;
  padding: 6px 8px;
  background: #11161a;
  border: 1px solid #343b3f;
}

.foreign-profile-screen .pers p {
  min-height: 25px;
  padding: 3px 0;
  border-bottom: 1px solid #292f32;
}

.foreign-profile-screen .pers p:last-child {
  border-bottom: 0;
}

.foreign-profile-screen .b2 > p > a,
.foreign-profile-screen .b2 > .pers a {
  line-height: 1.45;
}

.foreign-profile-pets {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.foreign-profile-pets > a {
  display: inline-block;
  padding: 4px;
  background: #171d20;
  border: 1px solid #4c5356;
  border-radius: 3px;
}

.foreign-profile-pets > a img {
  display: block;
  width: 55px;
  height: 55px;
  object-fit: cover;
}

/* Pet list and pet character sheet */
.pet-cards > table.items_box {
  min-height: 68px;
  margin: 5px 0;
  background: linear-gradient(to bottom, #20272a 0, #14191c 100%);
  border-color: #4b5a4a;
}

.pet-cards > table.items_box td:first-child {
  width: 68px;
  padding: 5px;
}

.pet-cards > table.items_box td:first-child img {
  width: 57px !important;
  height: 55px !important;
  object-fit: cover;
  background: #0d1112;
  border: 1px solid #61705a;
  border-radius: 3px;
}

.pet-cards > table.items_box td.top {
  padding: 7px 6px;
}

.pet-cards > table.items_box td.top > p:first-child a {
  color: #d9e7be;
  font-size: 14px;
  font-weight: bold;
}

.pet-cards > table.items_box td.top p {
  padding: 2px 0;
  font-size: 11px;
}

.pet-profile-screen .b2 > .items > table.items_box:first-child {
  background: linear-gradient(to bottom, #232a2d 0, #151a1d 100%);
  border-color: #52634d;
}

.pet-profile-screen .item_param {
  padding: 4px 0;
}

.pet-profile-screen .item_param p {
  min-height: 25px;
  padding: 3px 2px;
  border-bottom: 1px solid #2d3437;
}

.pet-profile-screen .item_param p:last-child {
  border-bottom: 0;
}

.pet-equipment-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px;
}

.pet-equipment-grid > table.items_box {
  min-width: 0;
  margin: 0;
  background: linear-gradient(to bottom, #22282a 0, #151a1c 100%);
  border-color: #58604e;
}

.pet-equipment-grid > table.items_box td:first-child {
  width: 50px;
  padding: 5px;
  text-align: center;
}

.pet-equipment-grid > table.items_box td:first-child img {
  max-width: 42px;
  max-height: 42px;
  object-fit: contain;
}

.pet-equipment-grid .item_name {
  padding: 2px 0;
  color: #dce7bd;
  font-size: 12px;
}

.pet-equipment-grid .item_todo {
  padding: 4px 0 0;
  font-size: 10px;
}

.pet-equipment-grid .item_todo a {
  display: inline-block;
  margin: 1px 2px 1px 0;
  padding: 3px 5px;
  background: #22282b;
  border: 1px solid #4c5659;
  border-radius: 2px;
}

.foreign-equipment-grid > table.items_box .item_todo {
  display: none;
}

@keyframes battle-event-pulse {
  0% {
    background: #4b281f;
    border-color: #aa6754;
  }
  100% {
    background: #111518;
    border-color: #343b40;
  }
}

@keyframes battle-log-new {
  0% {
    color: #fff5cf;
    background: #4a3a20;
  }
  100% {
    color: #f0dfb2;
    background: #211f18;
  }
}

@keyframes battle-action-charge {
  from {
    background: #342b1c;
  }
  to {
    background: #5a4524;
  }
}

@keyframes battle-fighter-hit {
  0% {
    border-color: #e47b68;
    background: #4a211d;
    transform: translateX(0);
  }
  35% {
    transform: translateX(-2px);
  }
  65% {
    transform: translateX(2px);
  }
  100% {
    transform: translateX(0);
  }
}

@keyframes harvest-leaf-fall {
  0% { transform: translate(0, 0) rotate(0deg); }
  100% { transform: translate(55px, 340px) rotate(460deg); }
}

@media (prefers-reduced-motion: reduce) {
  .battle-event-hit,
  .battle-log-entry-new,
  .battle-action-pending,
  .battle-fighter-damaged,
  .harvest-tree:before,
  .harvest-tree:after {
    animation: none;
  }

  .battle-hp-fill {
    transition: none;
  }
}

@media (max-width: 480px) {
  body {
    font-size: 14px;
  }

  .bdr.bg_main {
    margin: 0;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
  }

  div.thead,
  div.hofa {
    height: 76px;
    min-height: 76px;
  }

  input.inp,
  select {
    max-width: none;
  }

  .battle-fighter {
    padding: 4px;
  }

  .battle-fighter-name {
    display: inline-block;
    max-width: 82px;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: bottom;
  }

  .equipment-grid {
    grid-template-columns: 1fr;
  }

  .pet-equipment-grid {
    grid-template-columns: 1fr;
  }
}

@media (min-width: 620px) {
  body {
    padding: 10px 0;
  }
}