.armory { min-width: 0; color: #e7eded; }
.armory *, .armory *::before, .armory *::after { box-sizing: border-box; letter-spacing: 0; }
.armory-header { display:flex; align-items:center; gap:20px; padding:22px 0; border-bottom:1px solid #344344; }
.armory-portrait { width:88px; height:108px; flex:none; overflow:hidden; border:1px solid #687b79; border-radius:4px; background:#101c1d; }
.armory-portrait img { width:100%;height:100%;object-fit:cover; }
.armory-identity { min-width:0; flex:1; }
.armory .armory-identity h2 { font-size:26px;line-height:1.3;margin:4px 0;overflow-wrap:anywhere; }
.armory .armory-identity p { margin:0;color:#aababb;font-size:13px; }
.armory .armory-identity .armory-region { color:#81c2b5;font-size:12px; }
.armory-summary { display:flex;gap:18px;flex-wrap:wrap;margin-top:12px;font-size:12px;color:#aababb; }
.armory-summary b { margin-left:4px;color:#f3ead2;font-size:15px; }
.armory-tabs { display:flex;gap:24px;border-bottom:1px solid #344344;overflow-x:auto; }
.armory .armory-tabs button { background:none;border:0;border-bottom:2px solid transparent;border-radius:0;padding:16px 0;color:#aababb;font:inherit;font-size:14px;cursor:pointer;white-space:nowrap; }
.armory .armory-tabs button[aria-selected=true] { color:#a2e5d5;border-bottom-color:#77cdb9; }
.armory-content { padding:20px 0;min-height:300px; }
.armory-layout { display:grid;grid-template-columns:minmax(0,1fr) 240px;gap:28px; }
.armory-layout > div { min-width:0; }
.armory-section,.armory-content { min-width:0;max-width:100%; }
.armory-section { margin:0 0 20px;padding:0; }
.armory-section-heading { display:flex;align-items:center;gap:10px;margin-bottom:12px; }
.armory .armory-section-heading h3 { font-size:14px;margin:0; }
.armory-section-heading > span { font-size:12px;color:#97aaaa; }
.armory-equipment-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:10px;max-width:580px; }
.armory .armory-item { display:flex;flex-direction:column;align-items:center;gap:5px;padding:0;border:0;background:none;font:inherit;min-width:0;cursor:pointer; }
.armory-item-icon { position:relative;display:block;width:56px;height:56px;background:#101718;border:1px solid var(--item-color);border-radius:4px;overflow:hidden; }
.armory-item-icon img, .armory-skill-icon img { width:100%;height:100%;object-fit:contain; }
.armory-enhancement { position:absolute;bottom:0;right:0;background:#0a1015e8;color:#fff;font-size:11px;padding:1px 4px;line-height:16px; }
.armory-slot { display:block;width:100%;font-size:10px;line-height:14px;color:#aababb;text-align:center;overflow-wrap:anywhere; }
.armory-item:hover .armory-item-icon,.armory-item.selected .armory-item-icon { outline:2px solid #a7dfd4;outline-offset:2px; }
.armory .armory-overview,.armory .armory-detail { border:0;border-left:1px solid #344344;padding:0 0 0 24px;align-self:start;position:sticky;top:12px;min-width:0;width:auto;height:auto;min-height:0;background:transparent;display:block;box-shadow:none;border-radius:0; }
.armory .armory-overview h3,.armory .armory-detail h3 { font-size:17px;margin:8px 0 16px;overflow-wrap:anywhere; }
.armory dl { margin:0; }
.armory dl > div { display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid #2b3939;padding:10px 0;font-size:12px; }
.armory dt { color:#aababb; }
.armory dd { margin:0;text-align:right;overflow-wrap:anywhere; }
.armory-sync { color:#829899;font-size:11px;line-height:1.7;margin-top:20px; }
.armory-detail-icon { width:72px;height:72px;border:1px solid var(--item-color);border-radius:4px;background:#111c1e;overflow:hidden; }
.armory-detail-icon img { width:100%;height:100%;object-fit:contain; }
.armory-detail-kind { color:#97b7af;font-size:11px;margin:12px 0 0; }
.armory-skill-toolbar { display:flex;gap:14px;justify-content:space-between;align-items:center;margin-bottom:22px;flex-wrap:wrap; }
.armory-segment { display:flex;border:1px solid #415553;border-radius:4px;overflow:hidden; }
.armory .armory-segment button { font:inherit;font-size:12px;border:0;border-radius:0;background:transparent;color:#b8c8c8;padding:9px 12px;cursor:pointer; }
.armory .armory-segment button[aria-pressed=true] { background:#284841;color:#e6f9f4; }
.armory-skill-toolbar input { width:200px;max-width:100%;min-width:0; }
.armory-skill-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:12px; }
.armory .armory-skill { display:flex;flex-direction:column;align-items:center;padding:8px 4px;border:1px solid transparent;border-radius:4px;background:none;font:inherit;color:#d7e3e3;cursor:pointer;min-width:0; }
.armory-skill:hover,.armory-skill.selected { background:#203332;border-color:#6e9b90; }
.armory-skill-icon { position:relative;display:block;width:48px;height:48px;border-radius:4px;border:1px solid #687b89;background:#131b20;overflow:hidden; }
.armory-skill-icon b { position:absolute;bottom:0;right:0;background:#0a1015e8;color:#fff;font-size:11px;padding:1px 4px; }
.armory-skill-name { font-size:11px;text-align:center;line-height:1.5;margin-top:6px;overflow-wrap:anywhere; }
.armory-equipped { font-size:9px;color:#94cbb9;margin-top:3px; }
.armory-stat-grid { display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:0 24px; }
.armory-stat { padding:14px 0;border-bottom:1px solid #344344;display:grid;grid-template-columns:1fr auto;gap:8px; }
.armory-stat > span { font-size:12px;color:#bdcecb; }
.armory-stat > strong { font-size:16px;color:#e5d9aa; }
.armory-stat > small { grid-column:1/-1;font-size:11px;color:#91a9a6; }
.armory-stat .armory-cap { font-size:11px;color:#91a9a6;overflow-wrap:anywhere; }
.character-stat-sections { display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:24px;align-items:start; }
.character-stat-section { min-width:0; }
.character-stat-section h3 { margin:0;padding:0 0 10px;border-bottom:1px solid #526362;font-size:14px; }
.character-stat-row { padding:10px 0;border-bottom:1px solid #344344; }
.character-stat-heading { display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:12px;align-items:baseline; }
.character-stat-name { display:block!important;color:#bdcecb;font-size:12px;overflow-wrap:anywhere; }
.character-stat-value { display:block;color:#e5d9aa;font-size:14px;white-space:nowrap; }
.character-stat-cap { display:block!important;font-size:11px;color:#91a9a6;white-space:nowrap; }
.character-stat-effect { display:flex;justify-content:space-between;gap:12px;margin-top:6px;font-size:11px;color:#91a9a6; }
.character-stat-effect a { color:inherit; }
.armory-manual { white-space:pre-wrap;font-size:14px;line-height:1.8;overflow-wrap:anywhere; }
.armory-source { display:inline-block;font-size:12px;color:#8acdbc;text-decoration:none;padding:8px 0; }
.armory-icon-fallback { display:flex;width:100%;height:100%;align-items:center;justify-content:center;font-size:16px;color:#bcd0c8; }
.armory button:focus-visible,.armory a:focus-visible { outline:2px solid #a3dfd0;outline-offset:3px; }
.modal:has(.armory) { width:min(1080px,calc(100vw - 32px));max-width:1080px; }
.modal .armory-header { padding-top:8px; }
@media(max-width:700px) { .armory-layout { grid-template-columns:1fr;gap:14px; }.armory .armory-overview,.armory .armory-detail { position:static;border-left:0;border-top:1px solid #344344;padding:16px 0 0; }.armory-header { gap:12px;flex-wrap:wrap; }.armory-portrait { width:64px;height:80px; }.armory .armory-identity h2 { font-size:21px; }.armory-edit { margin-left:auto; }.armory-tabs { gap:20px; }.armory-summary { gap:12px; }.armory-equipment-grid { grid-template-columns:repeat(auto-fill,minmax(58px,1fr));gap:8px; }.armory-item-icon { width:50px;height:50px; }.armory-skill-grid { grid-template-columns:repeat(auto-fill,minmax(88px,1fr)); }.armory-overview dl { display:grid;grid-template-columns:1fr 1fr;gap:0 16px; } }
/* Character companion data and the five global Arcana slots. */
.armory-companions{display:grid;grid-template-columns:1fr 1fr;gap:30px}.armory-companion-image{width:100px;height:100px;display:grid;place-items:center;margin-bottom:16px}.armory-companion-image img{width:100%;height:100%;object-fit:contain}.armory-empty-slot{border:1px dashed var(--line);min-height:96px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:12px;font-size:12px;color:var(--muted)}@media(max-width:480px){.armory-companions{grid-template-columns:1fr}}
.character-hotbar { margin:0 0 20px;border-bottom:1px solid #344344;padding:0 0 14px; }
.armory-skill[draggable="true"] { cursor:grab; }
.armory-skill[draggable="true"]:active { cursor:grabbing; }
.character-hotbar-slot.hotbar-drop-target { outline:2px solid #80d6b9;outline-offset:-2px;background:#365449; }
.character-hotbar-slot img { pointer-events:none; }
.character-hotbar h3 { font-size:14px;margin:0 0 12px; }
.character-hotbar-scroll { overflow-x:auto; }
.character-hotbar-board { width:612px;max-width:90%;min-width:432px; }
.character-hotbar-row { display:grid;grid-template-columns:repeat(12,minmax(0,1fr)) 42px;gap:3px;margin-bottom:3px; }
.character-hotbar-row:last-child { margin-top:8px;border-top:1px solid #526362;padding-top:6px; }
.character-hotbar-slot { position:relative;aspect-ratio:1;padding:0!important;min-width:0;border:1px solid #526362;border-radius:0;background:#263133;overflow:hidden; }
.character-hotbar-slot img { display:block;width:100%;height:100%;object-fit:cover; }
.character-hotbar-empty { color:#657579;font-size:19px; }
.character-hotbar-key,.character-hotbar-level { position:absolute;color:white;text-shadow:0 1px 3px black;font-size:9px;line-height:1.2; }
.character-hotbar-key { top:2px;left:3px;max-width:calc(100% - 6px);white-space:normal;text-align:left; }
.character-hotbar-level { bottom:2px;right:2px; }
.character-hotbar-row-number { align-self:center;text-align:center;font-size:12px;color:#bdcecb; }
.character-hotbar-slot:disabled { opacity:1;cursor:default; }
.character-hotbar-dialog { width:320px;max-width:calc(100% - 32px);padding:22px;border:1px solid #526362;border-radius:8px;background:#182222;color:#e5eeec; }
.character-hotbar-dialog::backdrop { background:#0009; }
.character-hotbar-dialog label { display:grid;gap:8px;margin-bottom:18px; }
.character-hotbar-dialog select { width:100%;min-width:0; }
.character-hotbar-dialog .button { display:block;margin-left:auto; }