.character-detail-main { padding:22px; min-height:0; container-name:character-detail; container-type:inline-size; --detail-panel:#120d0e; --detail-line:rgba(250,247,234,0.15); --detail-ink:#fffef4; --detail-muted:#c0969e; background:radial-gradient(ellipse at 50% 15%,#1a1215 0,transparent 58%),#0b0709; }
.character-back { width:fit-content; display:flex; align-items:center; gap:8px; margin-bottom:24px; color:var(--detail-muted); font-size:12px; }
.character-back span { color:var(--accent); font-size:25px; line-height:1; }
.character-back:hover { color:var(--detail-ink); }
.character-back:focus-visible,.inventory-arrow:focus-visible,[data-inventory-tab]:focus-visible,.inventory-item:focus-visible,[data-inventory-panel]:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
.character-detail-notice { padding:30px 10px; color:var(--detail-muted); line-height:1.7; }
.character-overview { display:grid; grid-template-columns:minmax(145px,.72fr) minmax(0,415px) minmax(180px,.8fr); grid-template-rows:auto 1fr; column-gap:16px; align-items:start; }
.character-overview > .character-identity { grid-column:1; grid-row:1; }
.character-overview > .character-stats { grid-column:3; grid-row:1; }
.character-overview > .character-identity,.character-overview > .character-stats { height:446px; box-sizing:border-box; margin-top:53px; overflow:auto; align-self:start; }
.character-overview > .character-inventory { grid-column:2; grid-row:1/3; }
.character-identity,.character-stats { padding:22px 16px; border:1px solid var(--detail-line); border-radius:12px; background:var(--detail-panel); color:var(--detail-ink); }
.character-identity { text-align:center; }
.character-portrait-group { display:grid; grid-template-columns:20px minmax(0,1fr); gap:8px; width:min(174px,100%); margin:0 auto 20px; }
.character-portrait-group .character-portrait-card { width:100%; margin:0; }
.character-portrait-hwan { align-self:stretch; display:flex; flex-direction:column-reverse; justify-content:flex-start; align-items:center; gap:4px; padding:5px 0; }
.character-portrait-orb { display:block; flex:none; width:16px; height:16px; }
.character-portrait-card { position:relative; width:min(142px,82%); aspect-ratio:4/5; margin:0 auto 20px; padding:5px; border:1px solid #b58a71; background:linear-gradient(140deg,#f5b1a4,#45322b 36%,#ad8c79 60%,#f5b0a5); box-shadow:inset 0 0 0 3px #26231c,0 5px 20px #0005; }
.character-portrait-card > img { display:block; width:100%; height:100%; object-fit:cover; object-position:center top; background:radial-gradient(ellipse at 50% 22%,#b49887,#342f25); }
.character-portrait-card > .inventory-icon { width:100%; height:100%; padding:25px; color:#ccac99; }
.character-portrait-badge { position:absolute; right:-12px; bottom:-8px; display:grid; place-items:center; width:32px; height:32px; border-radius:0; border:0; background:transparent; box-shadow:none; color:var(--accent); }
.character-portrait-badge .inventory-icon { width:21px; height:21px; }
.character-identity h2 { margin:0; font:700 clamp(19px,2vw,27px)/1.2 var(--font-display); overflow-wrap:anywhere; }
.character-presence { display:none; }
.character-rank { margin:10px 0 18px; color:var(--accent); font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.character-identity-badges { display:flex; justify-content:center; flex-wrap:wrap; gap:8px; }
.character-identity-badges > span { min-height:36px; min-width:64px; padding:6px 10px; display:flex; align-items:center; justify-content:center; gap:7px; border:1px solid #4a2932; border-radius:5px; background:#2f171e; font-size:12px; font-weight:800; }
.character-identity-job { max-width:100%; }
.character-identity-job > .account-icon { width:16px; height:16px; flex-basis:16px; color:#ffc59b; }
.character-identity-job > span { min-width:0; line-height:1.4; overflow-wrap:anywhere; }
.character-identity-facts { display:grid; gap:13px; margin:20px 0 0; padding-top:17px; border-top:1px solid var(--detail-line); }
.character-identity-facts dt { margin-bottom:5px; color:var(--detail-muted); font-size:9px; font-weight:750; letter-spacing:.08em; text-transform:uppercase; }
.character-identity-facts dd { margin:0; font-size:11px; line-height:1.5; overflow-wrap:anywhere; }
.character-stats h3 { margin:0 0 14px; padding-bottom:9px; border-bottom:1px solid var(--detail-line); color:var(--detail-muted); font:700 13px/1.2 var(--font-display); letter-spacing:.09em; text-transform:uppercase; }
.character-stats h3:not(:first-child) { margin-top:25px; }
.character-vitals { display:grid; gap:8px; margin:0; }
.character-vitals > div { min-height:25px; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:5px 8px; border:1px solid #ffffff21; border-radius:3px; box-shadow:inset 0 1px 0 #ffffff22; }
.character-vital-hp { background:linear-gradient(90deg,#782029,#c5353b); }
.character-vital-mp { background:linear-gradient(90deg,#203e82,#337deb); }
.character-vitals dt,.character-vitals dd { margin:0; color:white; font:900 11px/1 Arial,sans-serif; letter-spacing:.075em; font-variant-numeric:tabular-nums; }
.character-vitals dd { direction:ltr; text-align:end; }
.character-attributes { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin:0; }
.character-attributes > div { display:flex; flex-direction:column; gap:7px; padding:13px 5px; text-align:center; border:1px solid var(--detail-line); border-radius:5px; background:#ffffff03; }
.character-attributes dd { order:-1; margin:0; font:700 24px/1 var(--font-display); }
.character-attributes dt { color:var(--detail-muted); font-size:9px; letter-spacing:.1em; }
.character-mastery-placeholders { display:flex; gap:9px; }
.character-mastery-placeholders > span { display:grid; place-items:center; width:36px; height:36px; border:1px solid #d7c273; background:linear-gradient(135deg,#371821,#120b0d); color:#e5d8a8; }
.character-stats-note { margin:13px 0 0; color:var(--detail-muted); font-size:10px; line-height:1.6; }
.character-inventory { min-width:0; width:100%; max-width:415px; justify-self:center; }
.character-inventory-tabs { display:grid; grid-template-columns:.9fr .7fr 1.4fr; align-items:stretch; gap:5px; margin:0 0 15px; }
.character-inventory-tabs { height:38px; }
.character-inventory-tabs button { min-width:0; min-height:38px; padding:6px 4px; border:1px solid var(--detail-line); border-radius:4px; background:#ffffff03; color:var(--detail-muted); font:700 10px/1.3 var(--font-display); letter-spacing:.025em; text-transform:uppercase; cursor:pointer; }
.character-inventory-tabs button[aria-selected="true"] { color:var(--accent); border-color:#ac7c60; background:rgba(242,92,69,0.078); }
.character-vault-placeholder { min-height:446px; padding:20px 10px; border:1px solid var(--detail-line); border-radius:5px; background:var(--detail-panel); }
.character-vault-placeholder h3 { margin:0 0 22px; color:var(--detail-ink); font:700 18px/1.2 var(--font-display); text-align:center; }
.character-events { margin-top:28px; padding:22px; border:1px solid var(--detail-line); border-radius:10px; background:var(--detail-panel); --widget-bg:#120d0e; --widget-border:rgba(250,247,234,0.15); --widget-title-bg:#221015; --widget-title-text:#fefdeb; --text-strong:#fffef4; --muted:#c0969e; --log-subtext:#caa5ac; --line:rgba(250,247,234,0.15); --line-bright:rgba(206,172,178,0.3); --row-hover:#2b151b; --avatar-bg:#31151d; --unique-icon-bg:#271319; --tooltip-bg:#170f11; }
.character-events-header { margin-bottom:18px; }
.character-events-header h2 { margin:0; color:var(--detail-ink); font:700 22px/1.2 var(--font-display); letter-spacing:.07em; }
.character-event-tabs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:7px; margin-bottom:18px; }
.character-event-tabs button { min-width:0; min-height:42px; display:flex; align-items:center; justify-content:center; gap:7px; padding:8px 6px; border:1px solid var(--detail-line); border-radius:4px; background:#ffffff03; color:var(--detail-muted); font-size:10px; font-weight:800; line-height:1.3; cursor:pointer; }
.character-event-tabs button .inventory-icon { width:17px; height:17px; }
.character-event-tabs button[aria-selected="true"] { color:#ffc2ba; border-color:#ac7c60; background:rgba(242,92,69,0.078); }
.character-events .side-widget { margin:0; border-radius:5px; box-shadow:none; }
.character-events .widget-title { min-height:48px; border-radius:5px 5px 0 0; }
.character-events .widget-title h2 { font-size:13px; }
.character-events .widget-scroll { max-height:350px; min-height:155px; }
.character-events .widget-wide-tabs { background:#150e10; }
.character-events .widget-wide-tabs button { background:#1b1215; }
.character-events .widget-wide-tabs button.active { color:#ffc2ba; background:rgba(242,92,69,0.078); box-shadow:none; }
.character-events .widget-wide-tabs button:hover { background:#31171f; }
.character-events .log-row { min-height:67px; }
.character-events .battle-list-widget { max-width:650px; margin-inline:auto; }
@container character-detail (max-width:800px) {
  .character-overview > .character-identity,.character-overview > .character-stats { margin-top:0; }
  .character-overview { grid-template-columns:minmax(0,1fr) minmax(0,1fr); grid-template-rows:auto auto; row-gap:16px; }
  .character-overview > .character-stats { grid-column:2; }
  .character-overview > .character-inventory { grid-column:1/-1; grid-row:2; max-width:415px; width:100%; justify-self:center; }
  .character-event-tabs { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@container character-detail (max-width:410px) {
  .character-overview { grid-template-columns:minmax(0,1fr); }
  .character-overview > .character-identity,.character-overview > .character-stats,.character-overview > .character-inventory { grid-column:1; grid-row:auto; }
  .character-events { padding:15px 10px; }
  .inventory-layout-grid .inventory-slots { gap:4px; }
}
@media (max-width:680px) { .character-detail-main { padding:18px 12px; } }
@media (prefers-reduced-motion:reduce) { .character-detail-link { transition:none; } }

.character-stats .character-masteries { justify-content:flex-start; margin:0; }

.character-portrait-badge > .account-icon { width:24px; height:24px; }

.character-online-messages { margin-top:14px; display:grid; gap:6px; }
.character-online-messages p { margin:0; color:var(--detail-muted); font-size:12px; line-height:1.5; overflow-wrap:anywhere; }
.character-online-messages [data-character-message="1"] { font-weight:750; }
[data-character-status="online"] [data-character-message="1"] { color:#73d799; }
[data-character-status="offline"] [data-character-message="1"] { color:#f76b7f; }
[data-character-status="online"] .character-presence { border-color:#73d799; background:#55c580; }
[data-character-status="offline"] .character-presence { border-color:#f76b7f; background:#ea4860; }
.character-identity-facts { margin-top:24px; padding-top:18px; }
.character-identity-facts dt { font-size:11px; }
.character-identity-facts dd { font-size:13px; }
.character-overview > .character-identity { height:auto; min-height:446px; overflow:visible; }
.character-identity-name { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:8px; }
.character-identity-name > span:not([class]) { min-width:0; overflow-wrap:anywhere; }
.character-name-race { display:inline-flex; align-items:center; flex:none; width:22px; height:22px; background:none; border:0; box-shadow:none; }
.character-name-race img,.character-name-race .account-icon { width:22px; height:22px; }
.character-level-race { display:inline-flex; align-items:center; flex:none; width:22px; height:22px; border:0; background:transparent; box-shadow:none; }
.character-level-race img,.character-level-race .account-icon { width:22px; height:22px; }
.character-identity-hwan { display:flex; justify-content:center; gap:5px; margin:14px 0 0; }
.character-identity-hwan:empty { display:none; }
/* V74: compact portrait within the existing identity card height. */
.character-overview > .character-identity{height:446px;min-height:446px;display:flex;flex-direction:column;align-items:stretch;padding:14px 12px;overflow:visible}
.character-identity .character-identity-name{font-size:clamp(18px,1.7vw,22px);line-height:1.15;flex-shrink:0}
.character-identity-portrait{position:relative;flex:0 1 64px;width:64px;height:64px;min-height:58px;margin:10px auto 7px;border:1px solid rgba(178,143,123,0.439);border-radius:9px;background:radial-gradient(ellipse at top,#98745d,#2d191f);box-shadow:0 5px 16px #0004}
.character-detail-portrait-image{display:block;width:100%;height:100%;object-fit:cover;object-position:center 13%;border-radius:8px}
.character-detail-portrait-fallback{display:grid;place-items:center;width:100%;height:100%;color:#cdad9c}.character-detail-portrait-fallback svg{width:38px;height:38px}
.character-identity-portrait>.playtime-badge-portrait{position:absolute;right:-8px;bottom:-5px;margin:0;width:30px;height:30px;z-index:2;filter:drop-shadow(0 2px 3px #000a)}
.character-identity-portrait>.playtime-badge-portrait img{width:30px;height:30px}
.character-identity-portrait>.character-identity-hwan{position:absolute;right:calc(100% + 8px);bottom:1px;display:flex;flex-direction:column-reverse;gap:2px;margin:0}
.character-identity-portrait .character-portrait-orb{width:10px;height:10px}
.character-identity .character-rank{margin:4px 0 7px;flex-shrink:0;font-size:12px}
.character-identity .character-identity-badges{gap:5px;flex-shrink:0}.character-identity .character-identity-badges>span{padding:4px 6px;min-height:28px;min-width:0}
.character-identity .character-online-messages{margin-top:8px;gap:3px;flex-shrink:0}.character-identity .character-online-messages p{font-size:12px;line-height:1.35}
.character-identity .character-identity-facts{margin-top:10px;padding-top:8px;flex-shrink:0}.character-identity .character-identity-facts dt{margin-bottom:4px}
.inventory-guild-denied{display:grid;align-content:center;min-height:360px;max-width:415px;margin:0 auto;color:#ffc09d;text-align:center;padding:25px;font-size:14px;line-height:1.7}