/* Connected realm and account states, shared by every page. */
[hidden]{display:none!important}
:where(a,button,input):focus-visible{outline:2px solid #ead28a;outline-offset:4px}
button:disabled{cursor:wait;opacity:.65}
[data-realm-status][data-state=online]{color:#b9dda5}
[data-realm-status][data-state=offline]{color:#e8c78b}
.form-message{min-height:1.5em;line-height:1.5;font-size:14px;color:#efd199;overflow-wrap:anywhere}
.form-message[data-error=true]{color:#ffb6a7}
.login-box .form-message{margin:10px 24px}
.field-help{font-size:12px;color:#b6c0ab;line-height:1.65}
.login-box h1{font-size:28px;margin-inline:20px}
.login-box fieldset,.profile-panel fieldset{border:0;padding:0}
.login-box fieldset{margin:22px 24px 10px}
.login-box .gold-button{white-space:normal}
.profile-panel form{padding:0 24px 24px}
.profile-panel form h3{font:24px Georgia,serif;color:#e5d5a8}
.profile-panel form input{max-width:420px}
.live-characters{margin:0 28px 28px;display:grid;gap:10px}
.live-character{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:18px 20px;background:linear-gradient(110deg,#203024bb,#11201b);border:1px solid #899d6140;border-radius:8px}
.live-character h3{font:21px Georgia,serif;color:#efe2ba;margin:0 0 3px;overflow-wrap:anywhere}
.live-character p{font-size:13px;color:#bec8b2;margin:0}
.live-character .character-level{color:#e0c789;text-align:right;font-size:15px}
.live-character .character-level small{display:block;color:#a5b99b;font-size:11px;margin-top:4px}
.ranking-criteria{color:#c0c6b4;font-size:14px;max-width:760px;line-height:1.7;margin:-5px 0 28px}
.ranking-empty{padding:40px 24px;text-align:center;color:#b7bda9;line-height:1.7}
.rank-panel tbody td{padding:18px 22px;border-bottom:1px solid #a6af7830;color:#d5dbc8}
.rank-panel tbody td:nth-child(2){font-family:Georgia,serif;color:#eddfb4}
.rank-panel tbody tr:hover{background:#a5ad6b08}
.rank-panel tbody td:first-child{color:#d3bc7b}
.realmlist-box{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#071711;border:1px solid #b9a46c55;border-radius:6px;padding:15px;margin-top:18px}
.realmlist-box code{color:#e7d5a8;font-size:14px;overflow-wrap:anywhere;user-select:all}
.connection-actions{display:flex;flex-wrap:wrap;gap:12px;margin:18px 0}
.connection-actions .button{font-size:12px;min-height:44px;padding:12px 18px}
.steps a:not(.button){text-decoration:underline;text-underline-offset:3px}
.prepare-inner{align-items:start}
.account-heading h1{overflow-wrap:anywhere}
.footer-discord{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 18px;border:1px solid #a89b6655;border-radius:6px;color:#e7d7a8;font:14px Georgia,serif}
footer:has(.footer-discord){flex-wrap:wrap;gap:24px}
.discord-community .discord-button{display:inline-flex;align-items:center;justify-content:center;padding:13px 18px;background:#5b59bd;color:#fff;border:1px solid #aaa5f5;border-radius:6px;font-size:14px;line-height:1.4;min-height:44px}
.discord-community .discord-button:hover{background:#6c69cf}
.community-panel .discord-community{display:block}
.community-panel .discord-community p{color:#c8d0c2;line-height:1.6;margin:12px 0 18px}
.live-character{grid-template-columns:minmax(0,1fr) auto}
.character-open{grid-column:1/-1;justify-self:start;border:0;padding:6px 0;color:#e8d1a0;background:transparent;font-size:13px;text-decoration:underline;text-underline-offset:4px;min-height:34px}
.character-open:hover{color:#fff0bf}
.character-detail{padding:24px 28px 30px}
.detail-toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px}
.text-button{border:0;background:transparent;color:#e5cf9e;min-height:44px;font-size:14px;padding:6px 0}
.text-button:hover{text-decoration:underline}
.character-detail .form-message{margin:12px 0}
.character-hero{display:flex;gap:22px;align-items:center;padding:16px 0 28px;border-bottom:1px solid #a3946133}
.hero-emblem{display:grid;place-items:center;flex:0 0 84px;height:94px;background:linear-gradient(145deg,#46513a,#14271e);border:1px solid #b8a56b66;border-radius:10px 10px 36px 36px;font:52px Georgia,serif;color:#d9c38a;box-shadow:inset 0 0 30px #151b10}
.character-hero h2{margin:6px 0;font:36px Georgia,serif;color:#f1e2b9;overflow-wrap:anywhere}
.character-hero p{font-size:14px;color:#c2cbb4;margin:6px 0 16px;line-height:1.6}
.detail-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:24px 0}
.detail-summary>div{padding:15px;background:#24302488;border:1px solid #7c8e5e33;border-radius:7px;min-width:0}
.detail-summary dt{font-size:11px;color:#a9b599}
.detail-summary dd{font-size:15px;color:#e5ddc2;line-height:1.55;margin:6px 0 0;overflow-wrap:anywhere}
.detail-note{color:#adbba3;font-size:13px;line-height:1.75}
.detail-columns{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:28px;margin-top:25px}
.detail-columns h3,.session-section h3{font:23px Georgia,serif;color:#e9dab1;margin:0 0 16px}
.detail-section-heading{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px}
.detail-section-heading h3{margin:0}
.detail-section-heading>span{font-size:11px;color:#b7c0a9}
.equipment-grid{display:grid;gap:8px;margin:17px 0}
.gear-slot{border:1px solid #81936944;border-left:3px solid #a9b29e;border-radius:6px;background:#10201999;overflow:hidden;min-width:0}
.gear-slot summary{cursor:pointer;position:relative;list-style:none;padding:12px 30px 12px 13px}
.gear-slot summary::-webkit-details-marker{display:none}
.gear-slot summary:after{content:'+';position:absolute;right:12px;top:24px;color:#c1c9b7;font-size:19px}
.gear-slot[open] summary:after{content:'−'}
.gear-slot summary:hover{background:#b7a56c0b}
.gear-slot summary:focus-visible{outline:2px solid #e2cc8d;outline-offset:-3px}
.gear-label{display:block;text-transform:uppercase;font-size:10px;letter-spacing:1px;color:#adba9d}
.gear-name{display:block;font-size:14px;line-height:1.5;margin-top:3px;overflow-wrap:anywhere;font-weight:500;color:#f0eddf}
.gear-meta{display:block;font-size:10px;color:#9fae93;margin-top:4px}
.gear-empty{padding:10px 13px;opacity:.65;border-left-color:#53624d}
.gear-empty .gear-name{font-size:12px;color:#9ca58e}
.gear-slot[data-quality="0"]{border-left-color:#9b9b9b}
.gear-slot[data-quality="2"]{border-left-color:#70d083}
.gear-slot[data-quality="3"]{border-left-color:#72b9ff}
.gear-slot[data-quality="4"]{border-left-color:#cf9aff}
.gear-slot[data-quality="5"]{border-left-color:#ffb06a}
.gear-slot[data-quality="2"] .gear-name{color:#88df99}
.gear-slot[data-quality="3"] .gear-name{color:#8cc7ff}
.gear-slot[data-quality="4"] .gear-name{color:#d7b0ff}
.gear-slot[data-quality="5"] .gear-name{color:#ffc087}
.gear-properties{padding:0 13px 12px;color:#d6d9c5;font-size:12px;line-height:1.65;border-top:1px solid #a0ac7b22}
.gear-properties p{margin:8px 0 0}
.gear-properties ul{margin:8px 0;padding-left:17px;color:#b9dda1}
.gear-properties .gear-description{color:#d5c191;font-style:italic}
.attribute-list{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 12px;margin:0 0 30px;font-size:12px;line-height:1.65}
.attribute-list dt,.attribute-list dd{padding:9px 0;margin:0;border-bottom:1px solid #9caf7e25}
.attribute-list dt{color:#aebb9f}
.attribute-list dd{color:#e3ddc7;text-align:right;max-width:150px;overflow-wrap:anywhere}
.profile-panel .field-help{font-size:12px;color:#b7c1ab}
.profile-panel dd{overflow-wrap:anywhere;color:#d4d9c4}
.session-section{padding:24px;border-top:1px solid #9eaa6d33}
.session-section>p{line-height:1.6;font-size:13px}
.session-list{display:grid;gap:10px;margin:20px 0}
.session-row{padding:14px 16px;border:1px solid #7d906144;border-radius:6px;background:#102016;display:grid;gap:4px}
.session-row strong{font-size:13px;font-weight:500;color:#ddc994}
.session-row span{font-size:12px;color:#c6cbb9}
.session-row small{font-size:11px;color:#95a48b}
@media(max-width:700px){
  .page-header{height:auto;min-height:76px;flex-wrap:wrap;gap:10px;padding:12px 18px}
  .page-header nav{display:flex;order:3;flex:0 0 100%;max-width:100%;gap:22px;overflow-x:auto;padding:10px 0 8px;white-space:nowrap}
  .page-header nav{scrollbar-width:thin;scrollbar-color:#786c49 #10140f}
  .page-header nav::-webkit-scrollbar{height:4px}
  .page-header nav::-webkit-scrollbar-thumb{background:#786c49;border-radius:4px}
  .page-header nav a{font-size:13px;flex-shrink:0}
  .page-header .nav-cta{display:inline-flex;padding:9px 14px;font-size:13px}
  .page-header .nav-logo{width:110px;height:45px}
  .live-characters{margin:0 20px 20px}
  .live-character{padding:15px}
  .live-character h3{font-size:19px}
  .live-character p{font-size:12px}
  .account-heading{align-items:start;gap:15px}
  .account-heading h1{font-size:25px}
  .account-heading .small-button{white-space:nowrap;font-size:12px;padding:10px}
  .realmlist-box{flex-direction:column;align-items:start}
  .connection-actions{flex-direction:column;align-items:stretch}
  .connection-actions a{text-align:center}
  .rank-panel tbody td{padding:14px;font-size:13px}
  .ranking-criteria{margin:0 0 22px}
  .login-box h1{font-size:25px}
  .login .crest{height:120px;width:240px}
  .account-grid .tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
  .account-grid .tabs button{font-size:12px;padding:11px 5px;text-align:center}
  .character-detail{padding:18px}
  .character-hero{gap:14px;padding-bottom:22px}
  .hero-emblem{flex-basis:54px;height:70px;font-size:34px}
  .character-hero h2{font-size:28px}
  .character-hero p{font-size:12px}
  .character-hero .eyebrow{font-size:9px;letter-spacing:1px}
  .detail-summary{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .detail-summary>div{padding:12px}
  .detail-summary dd{font-size:13px}
  .detail-columns{grid-template-columns:1fr;gap:26px}
  .equipment-grid{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:7px}
  .gear-name{font-size:12px}
  .gear-label{font-size:9px;letter-spacing:.5px}
  .gear-slot summary{padding:11px 22px 11px 10px}
  .gear-slot summary:after{right:8px;font-size:15px}
  .gear-empty{padding:10px}
  .gear-properties{padding-inline:10px;font-size:11px}
  .attribute-list dd{max-width:190px}
  .session-section{padding:20px}
  footer:has(.footer-discord){gap:20px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

.optional-field{font-size:11px;color:#adb69f}
.login-box select,.profile-panel select{border:1px solid #66735a66;background:#0c140f;color:#dfdcc4;border-radius:6px;padding:12px;margin:6px 0 20px;width:100%;max-width:100%;font-size:13px}
.profile-panel #question-form{border-top:1px solid #9eaa6d33;padding-top:22px}
.login-box .field-help{margin:6px 0 20px;text-align:left}