.hidden{display:none!important}.msg{position:fixed;z-index:99999;top:0;left:0;width:100%;background:#000b;color:#fffc3d;text-align:center}.msg:not(:empty){padding:6px 10px}.form input,.form textarea,.form select{display:block;width:100%;margin:0 0 10px;padding:9px;border:0;border-radius:4px}.form-row{margin-bottom:10px}.theme-guest #chrome{display:none}.theme-mb #site-footer{display:none}.theme-sa #app{max-width:1140px;margin:0 auto}.theme-sa #app>#content{margin-top:15px}#app{min-height:70vh}#app.route-changing{opacity:0}#site-footer{max-height:640px;overflow:hidden;opacity:1;transform:translateY(0);transition:max-height .32s ease,opacity .2s ease,transform .32s ease}body.footer-loading #site-footer{max-height:0;opacity:0;transform:translateY(-8px);pointer-events:none}.theme-sa .form input,.theme-sa .form textarea,.theme-sa .form select{background:#1c1e26;color:#eee;border:1px solid #555}.theme-mb dialog,.theme-sa dialog{width:min(560px,96vw);border:0;padding:0;background:#222;color:#fff}dialog::backdrop{background:#000a}.mh,.mf{padding:12px;background:#222}.md{padding:14px;background:#2c2e3c}.x{float:right;border:0;background:0;color:#fff;font-size:22px;cursor:pointer}.login-error{color:#fffc3d}.stories-list{list-style:none;padding-left:0}.transparent{color:#fff;margin:0;background:transparent!important;border:0!important;border-radius:0!important;outline:0!important;box-shadow:none!important}.theme-mb .stats,.theme-sa .stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}.theme-mb .stats .room{margin:0}.theme-mb .character .avatar{float:left;margin-right:12px;width:64px;height:64px;border-radius:4px;background:#0b3151;display:grid;place-items:center;font-size:36px;color:#88DAFF}.theme-mb .character{position:relative;min-height:88px}.route-loading{padding:20px;text-align:center}.sa-guest{background:#080b14!important}.sa-guest #app{max-width:100%!important;margin:0!important;padding:0!important}.sa-guest .regerror{position:static;z-index:9999;width:100%;background:#0009;color:#fffc3d;text-align:center}.mb-guest main{width:100%}
.skel,.skel-img{display:block;border-radius:6px;background:linear-gradient(90deg,rgba(255,255,255,.04) 0%,rgba(255,255,255,.13) 50%,rgba(255,255,255,.04) 100%);background-size:200% 100%;animation:hubbaLoading 1.5s cubic-bezier(.4,0,.2,1) infinite;color:transparent!important;overflow:hidden;box-sizing:border-box}.theme-guest .skel,.theme-guest .skel-img{background:linear-gradient(90deg,rgba(0,0,0,.04) 0%,rgba(0,0,0,.11) 50%,rgba(0,0,0,.04) 100%);background-size:200% 100%}.skel{height:14px;min-width:24px;margin:4px 0}.skel.short{width:35%}.skel.mid{width:60%}.skel.long{width:85%}.skel.full{width:100%}.skel.title{height:22px;width:65%;margin:6px 0;border-radius:6px}.skel-img{display:inline-block;width:56px;height:56px;vertical-align:middle;border-radius:6px}.hubba-pending img.skel-real,.hubba-loading-wrap img.skel-real{visibility:hidden}.hubba-pending .newsbox,.hubba-loading-wrap .newsbox{background-image:none!important}.hubba-pending .newsbox .info,.hubba-loading-wrap .newsbox .info{min-height:120px}.hubba-pending .item img:not(.rarity),.hubba-loading-wrap .item img:not(.rarity){visibility:hidden}.hubba-pending .stories-list,.hubba-loading-wrap .stories-list{list-style:none;padding-left:0}.hubba-pending .table,.hubba-loading-wrap .table{--bs-table-bg:transparent}@keyframes hubbaLoading{0%{background-position:200% 0}100%{background-position:-200% 0}}
.hubba-spinner-box{display:flex;align-items:center;justify-content:center;min-height:48px}.hubba-spinner{width:20px;height:20px;border:2.5px solid rgba(255,255,255,.18);border-top-color:rgba(255,255,255,.85);border-radius:50%;animation:hubbaSpin .75s linear infinite}@keyframes hubbaSpin{to{transform:rotate(360deg)}}
.hubba-register{width:min(360px,calc(100vw - 24px));border:1px solid rgba(255,255,255,.14);border-radius:8px;padding:0;background:#202331;color:#fff;box-shadow:0 18px 60px rgba(0,0,0,.55);overflow:hidden}.hubba-register::backdrop{background:rgba(0,0,0,.62);backdrop-filter:blur(2px)}.hubba-register form{margin:0}.hubba-register-head,.hubba-register-foot{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;background:#181b26}.hubba-register-head strong{font-size:15px;line-height:1}.hubba-register .x{float:none;width:28px;height:28px;line-height:24px;border-radius:6px;font-size:20px;background:rgba(255,255,255,.08)}.hubba-register-body{padding:12px}.hubba-register-body input:not([type=checkbox]){height:36px;margin:0 0 8px;padding:8px 10px;border:1px solid rgba(255,255,255,.12);border-radius:6px;background:#11141d;color:#fff;box-shadow:none;font-size:14px;line-height:18px}.hubba-register-body input:not([type=checkbox])::placeholder{font-size:14px;color:#aeb6c7}.hubba-register-body input:not([type=checkbox]):focus{outline:0;border-color:#48a9ff;box-shadow:0 0 0 2px rgba(72,169,255,.2)}.hubba-register-check{display:flex;gap:8px;align-items:flex-start;margin:2px 0 0;font-size:12px;line-height:1.3;color:#d7dceb}.hubba-register-check input[type=checkbox]{display:inline-block;width:16px!important;height:16px!important;min-width:16px;margin:0;flex:0 0 16px}.hubba-register-check span{display:block;min-width:0}.hubba-register-foot{justify-content:flex-end;padding-top:9px;padding-bottom:9px}.hubba-register-foot .btn{min-height:32px;padding:5px 14px;border-radius:6px;font-size:14px;line-height:20px}
html:has(> body.funhotel),body.funhotel{overflow-x:hidden}body.funhotel{box-sizing:border-box}body.funhotel header,body.funhotel #app,body.funhotel #content{box-sizing:border-box;max-width:100%}body.lotto-page{margin:0;overflow:hidden}body.lotto-page #app{margin:0;padding:0;max-width:none;min-height:0;width:auto}
iframe{color-scheme:light dark;background-color:transparent!important}

.prem-maint-btn{display:inline-block;padding:6px 16px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;text-decoration:none!important;border-radius:4px;cursor:pointer;transition:transform .08s ease,filter .1s ease;user-select:none;line-height:18px;margin:4px 5px}.prem-maint-btn:active{transform:translateY(2px);box-shadow:none!important}.prem-maint-btn-primary{background:#1e9af2;color:#fff!important;border:1px solid #1480cc;border-bottom:3px solid #0d5c94;box-shadow:0 2px 4px rgba(0,0,0,.3)}.prem-maint-btn-primary:hover{background:#2cb0ff;color:#fff!important}.prem-maint-btn-secondary{background:#2b3345;color:#fff!important;border:1px solid #3c465c;border-bottom:3px solid #191f2c;box-shadow:0 2px 4px rgba(0,0,0,.3)}.prem-maint-btn-secondary:hover{background:#353f56;color:#fff!important}

/* --- Header nav: underline only as wide as icon + text --- */
header .nav {
  gap: 24px;
}
header .nav a.nav-link:not(.av) {
  padding-left: 0;
  padding-right: 0;
}

/* --- Account switcher (own-name nav item) ---
   [avatar name] links to /me, the small arrow opens the menu. One white underline spans
   avatar -> arrow (same as every other nav item); the arrow has its own small hover chip.
   State classes are set from site.js: .is-active (on /me), .is-open (menu open). */
header .nav a.av {
  padding: 9px 0 2px;
}
.hubba-acc-widget {
  position: relative;
  display: inline-flex;
  align-items: center;
  border-bottom: 2px solid transparent;
  transition: border-color .3s, box-shadow .3s;
}
header .nav .hubba-acc-widget > a.av,
header .nav .hubba-acc-widget > a.av:hover,
header .nav .hubba-acc-widget > a.av.active {
  align-self: stretch;
  border-bottom: 0;
  box-shadow: none;
}
.hubba-acc-widget:hover,
.hubba-acc-widget.is-active,
.hubba-acc-widget.is-open {
  border-bottom-color: #fff;
  box-shadow: 0 2px 2px 0 rgba(0,0,0,.04), 0 3px 1px -2px rgba(0,0,0,.02), 0 1px 5px 0 rgba(0,0,0,.1);
}

.hubba-acc-caret {
  display: inline-grid;
  place-items: center;
  width: 20px;
  height: 20px;
  margin: 7px 0 0 6px; /* 7px top = same optical centre as the name (link has 9px/2px padding) */
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: #fff;
  opacity: .8;
  cursor: pointer;
  transition: opacity .15s ease, background-color .15s ease;
}
.hubba-acc-caret:hover,
.hubba-acc-caret:focus-visible {
  opacity: 1;
  background: rgba(255, 255, 255, .12);
  outline: 0;
}
.hubba-acc-widget.is-open .hubba-acc-caret {
  opacity: 1;
}
.hubba-acc-arrow {
  display: block;
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 5px solid currentColor;
  transition: transform .2s ease;
}
.hubba-acc-widget.is-open .hubba-acc-arrow {
  transform: rotate(180deg);
}

/* Menu hangs straight off the underline: square top, same left edge, at least as wide as the item. */
.hubba-acc-menu {
  position: absolute;
  top: calc(100% + 2px); /* below the 2px underline (border sits outside the padding box) */
  left: 0;
  z-index: 1000;
  box-sizing: border-box;
  width: max-content;
  min-width: 100%;
  max-width: min(240px, calc(100vw - 24px));
  padding: 4px 4px 5px;
  /* solid sheet hanging off the underline: no outline box, so a menu wider than the name still reads clean */
  background: #121624;
  border: 0;
  border-radius: 0 0 8px 8px;
  box-shadow: 0 18px 32px rgba(0, 0, 0, .5);
  color: #fff;
  text-align: left;
  text-shadow: none;
  line-height: normal;
  animation: hubbaAccFade .12s ease-out;
}
@keyframes hubbaAccFade {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* Rows: account entries and actions share one look */
.hubba-acc-list {
  max-height: 216px;
  overflow-y: auto;
}
.hubba-acc-item,
.hubba-acc-action-btn {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  min-height: 30px;
  padding: 4px 12px 4px 6px;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: #d5dbe7;
  font-size: 14px;
  font-weight: 500;
  text-align: left;
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
  transition: background-color .12s ease, color .12s ease;
}
.hubba-acc-item:hover,
.hubba-acc-item:focus-visible,
.hubba-acc-action-btn:hover,
.hubba-acc-action-btn:focus-visible {
  background: rgba(255, 255, 255, .09);
  color: #fff;
  outline: 0;
}
.hubba-acc-item.is-active {
  color: #fff;
  cursor: default;
}
.hubba-acc-item.is-active:hover {
  background: transparent;
}
.hubba-acc-item-head {
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .08);
  object-fit: none;
  object-position: 50% 30%;
}
.hubba-acc-item-name {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.hubba-acc-item-check {
  color: #34d399;
  font-size: 13px;
}
.hubba-acc-item-remove {
  width: 20px;
  height: 20px;
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: #94a3b8;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  opacity: 0;
  transition: opacity .12s ease, color .12s ease, background-color .12s ease;
}
.hubba-acc-item:hover .hubba-acc-item-remove,
.hubba-acc-item:focus-within .hubba-acc-item-remove {
  opacity: 1;
}
.hubba-acc-item-remove:hover {
  color: #fca5a5;
  background: rgba(239, 68, 68, .15);
}
.hubba-acc-action-icon {
  flex: 0 0 24px; /* same column as the account heads */
  text-align: center;
  font-size: 15px;
  opacity: .75;
}
.hubba-acc-divider {
  height: 1px;
  margin: 4px 2px;
  background: rgba(255, 255, 255, .1);
}
.hubba-acc-logout-btn {
  color: #f87171;
}
.hubba-acc-logout-btn:hover,
.hubba-acc-logout-btn:focus-visible {
  background: rgba(239, 68, 68, .14);
  color: #fca5a5;
}
.hubba-acc-logout-all-btn {
  color: #94a3b8;
  font-size: 13px;
}
@media (hover: none) {
  .hubba-acc-item-remove { opacity: 1; }
}

/* Modal Overlay for Adding Account */
.hubba-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(4, 7, 15, 0.76);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  z-index: 100000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  animation: hubbaModalIn 0.18s cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes hubbaModalIn {
  from { opacity: 0; transform: scale(0.96) translateY(6px); }
  to { opacity: 1; transform: scale(1) translateY(0); }
}
.hubba-modal-card {
  position: relative;
  width: min(420px, 100%);
  max-height: 90vh;
  overflow-y: auto;
  background: linear-gradient(180deg, #181d2e 0%, #111523 100%);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 16px;
  box-shadow: 0 24px 60px -10px rgba(0, 0, 0, 0.75), 0 0 0 1px rgba(255, 255, 255, 0.05);
  padding: 22px 20px 20px;
}
.hubba-modal-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.08);
  color: #94a3b8;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.15s ease;
  padding: 0;
}
.hubba-modal-close:hover {
  background: rgba(255, 255, 255, 0.14);
  color: #fff;
  border-color: rgba(255, 255, 255, 0.16);
}
.hubba-modal-title {
  font-size: 17px;
  font-weight: 700;
  color: #fff;
  margin: 0 0 14px;
  text-align: center;
  letter-spacing: -0.2px;
}
.hubba-modal-sub {
  font-size: 12px;
  color: #94a3b8;
  margin: 0 0 14px;
  text-align: center;
  line-height: 1.4;
}
.hubba-modal-current-acc {
  display: flex;
  align-items: center;
  gap: 10px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  padding: 7px 12px;
  margin-bottom: 14px;
}
.hubba-modal-current-avatar {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.3);
  border: 1px solid rgba(255, 255, 255, 0.1);
  object-fit: cover;
  object-position: center top;
  flex-shrink: 0;
}
.hubba-modal-current-meta {
  display: flex;
  flex-direction: column;
  min-width: 0;
  text-align: left;
}
.hubba-modal-current-label {
  font-size: 10px;
  color: #94a3b8;
  font-weight: 500;
  line-height: 1.2;
}
.hubba-modal-current-name {
  font-size: 13px;
  font-weight: 700;
  color: #f1f5f9;
  line-height: 1.3;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.hubba-modal-current-badge {
  margin-left: auto;
  font-size: 10.5px;
  font-weight: 600;
  color: #38bdf8;
  background: rgba(56, 189, 248, 0.12);
  border: 1px solid rgba(56, 189, 248, 0.24);
  padding: 2px 8px;
  border-radius: 999px;
  white-space: nowrap;
}

/* Modal Tabs */
.hubba-modal-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  background: rgba(6, 10, 20, 0.55);
  padding: 3px;
  border-radius: 9px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  margin-bottom: 16px;
}
.hubba-modal-tab {
  background: transparent;
  border: 0;
  border-radius: 7px;
  color: #94a3b8;
  font-size: 12.5px;
  font-weight: 600;
  padding: 6px 12px;
  cursor: pointer;
  transition: all 0.15s ease;
  text-align: center;
}
.hubba-modal-tab:hover {
  color: #f1f5f9;
}
.hubba-modal-tab.is-active {
  background: rgba(255, 255, 255, 0.12);
  color: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

/* Card adjustments inside modal */
.hubba-modal-card .login-copy {
  display: none !important;
}
.hubba-modal-card .auth-card-wrap {
  display: block;
}
.hubba-modal-card .input-wrap {
  margin-bottom: 8px;
}
.hubba-modal-card .register-form .reg-field {
  margin-bottom: 8px;
}
.hubba-modal-card .reg-consent {
  margin: 6px 2px 14px;
}

.auth-card-wrap {
  display: contents;
}
/* the account menu drops below the header */
.theme-sa header {
  overflow: visible;
}
/* while the menu is open the header must stack above page content (header is z-index 2) */
header.acc-open {
  position: relative;
  z-index: 1050;
}