/* Shared Character frame; all selectors stay within the character workspace. */
#view-characters { min-width: 0; max-width: none; background: radial-gradient(ellipse at 0 0, #ed00610b, transparent 50%), radial-gradient(ellipse at 100% 75%, #00d6e709, transparent 50%); }
#view-characters .crawler-roster { display: flex; align-items: end; flex-wrap: wrap; gap: .5rem .8rem; margin: 0 0 .6rem; max-height: none; overflow: visible; flex: 0 0 auto; }
#view-characters .crawler-roster:empty { display: none; }
#view-characters .crawler-picker { display: grid; grid-template-columns: auto minmax(6rem,1fr) minmax(8rem,1.2fr); align-items: center; gap: .4rem; flex: 1; max-width: 42rem; min-width: 0; font-size: .8rem; color: var(--cyan); }
#view-characters .crawler-roster input, #view-characters .crawler-roster select { width: 100%; min-width: 0; min-height: 2.5rem; padding: .4rem .6rem; }
#view-characters .crawler-roster select { border-color: #237780; }
#view-characters .crawler-roster > span { font-size: .75rem; padding-bottom: .5rem; }
#view-characters .crawler-create { position: relative; margin-left: auto; }
#view-characters .crawler-create > summary { cursor: pointer; padding: .6rem .8rem; min-height: 2.5rem; border: 1px solid var(--pink); border-radius: .4rem; color: var(--yellow); }
#view-characters #character-create { position: absolute; right: 0; z-index: 26; background: var(--panel-2); padding: 1rem; border: 1px solid var(--pink); border-radius: .4rem; width: min(22rem,85vw); box-shadow: var(--shadow); }
#view-characters #character-form { gap: 0; min-width: 0; }
#view-characters .crawler-file { flex: 0 0 auto; min-width: 0; border: 1px solid #3a5052; border-top: 3px solid var(--yellow); border-radius: .6rem .6rem 0 0; background: linear-gradient(110deg,#082b30, var(--panel-2) 50%,#2c1020); }
#view-characters .crawler-file > summary { display: flex; align-items: center; gap: .85rem; padding: .85rem 1rem; list-style: none; cursor: pointer; }
#view-characters .crawler-file > summary::-webkit-details-marker { display: none; }
#view-characters .crawler-avatar { display: grid; place-items: center; width: 64px; height: 64px; flex: 0 0 64px; overflow: hidden; border: 1px solid #39a3ad; border-radius: .45rem; background: #052329; color: var(--cyan); }
#view-characters .crawler-avatar .entity-image, #view-characters .crawler-avatar img { display: block; width: 100%; height: 100%; object-fit: cover; }
#view-characters .crawler-person { min-width: 0; flex: 1; display: grid; gap: .15rem; }
#view-characters .crawler-file-label { color: var(--cyan); font-size: .65rem; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; }
#view-characters .crawler-name { font-size: clamp(1.15rem,2vw,1.65rem); font-weight: 800; line-height: 1.15; overflow-wrap: anywhere; }
#view-characters .crawler-summary { font-size: .8rem; color: #c5c3bc; overflow-wrap: anywhere; }
#view-characters .crawler-marks { display: flex; flex-wrap: wrap; gap: .3rem; }
#view-characters .crawler-marks:empty { display: none; }
#view-characters .crawler-mark { display: inline-flex; gap: .3rem; color: var(--yellow); font-size: .72rem; border: 1px solid #897526; border-radius: .25rem; padding: 0 .35rem; }
#view-characters .crawler-affordance { font-size: .78rem; color: var(--cyan); white-space: nowrap; }
#view-characters .crawler-file:not([open]) .when-expanded, #view-characters .crawler-file[open] .when-collapsed { display: none; }
#view-characters .crawler-file-edit { display: grid; gap: .8rem; padding: .85rem; border-top: 1px solid #345b60; }
#view-characters .crawler-file h2 { font-size: 1rem; margin: 0 0 .7rem; color: var(--cyan); }
#view-characters .crawler-profile, #view-characters .crawler-gm { min-width: 0; padding: .85rem; background: #071c208c; border: 1px solid #24545b; border-radius: .4rem; }
#view-characters .crawler-profile-fields { display: grid; grid-template-columns: minmax(0,2fr) minmax(5rem,.5fr) repeat(2,minmax(0,1fr)); gap: .6rem; }
#view-characters .crawler-profile-fields label { font-size: .8rem; min-width: 0; }
#view-characters .crawler-profile-fields input { min-width: 0; width: 100%; }
#view-characters .crawler-profile .portrait-upload { position: relative; width: fit-content; max-width: 100%; color: var(--cyan); font-size: .8rem; }
#view-characters .crawler-profile .portrait-upload input { top: 0; left: 0; }
#view-characters .crawler-profile .portrait-upload:focus-within { outline: 2px solid var(--focus); outline-offset: 2px; }
#view-characters .crawler-gm { background: #29101e9c; border-color: #7c2851; }
#view-characters .crawler-gm h2 { color: #ff8aba; }
#view-characters .crawler-gm .honor-editor { margin-top: 0; }
#view-characters .crawler-file .crawler-admin-actions { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: .8rem; }
#view-characters .crawler-file-footer { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
#view-characters .crawler-file-footer > span { color: var(--muted); font-size: .8rem; flex: 1 1 12rem; }
#view-characters .crawler-file-footer :is(button, a:where(.route-link)) { font-size: .8rem; }
#view-characters .sheet-tabs { position: static; display: flex; flex-wrap: wrap; overflow: visible; gap: .3rem; padding: .45rem; margin: 0 0 .8rem; flex: 0 0 auto; border: 1px solid #3a5052; border-top: 0; border-radius: 0 0 .6rem .6rem; background: linear-gradient(90deg,#101e20,#1b1218); box-shadow: none; }
#view-characters .sheet-tab { padding: .5rem .7rem; min-height: 2.5rem; font-size: .8rem; white-space: normal; text-align: center; background: #16191b; }
#view-characters .sheet-tab.active { background: var(--yellow); color: #080808; }
#view-characters .sheet-page { min-width: 0; }
#view-characters summary:focus-visible { outline: 2px solid var(--focus); outline-offset: -3px; }
/* Inventory retains its full bounded ancestor chain and two independently scrolling panes.
   On unusually short viewports the form scrolls the shared frame away, leaving a usable
   minimum workspace rather than crushing the list to zero height. */
#view-characters.inventory-mode .inventory-form { overflow: visible; min-height: 0; }
#app-shell:has(#view-characters.inventory-mode:not([hidden])) .sidebar { overflow-y: auto; }
#view-characters.inventory-mode .crawler-file-edit { max-height: min(24rem,45dvh); overflow: auto; overscroll-behavior: contain; }
#view-characters.inventory-mode .sheet-page { flex: none; min-height: 0; }
#view-characters .inventory-workspace { border-color: #31545a; border-top: 3px solid var(--pink); background: linear-gradient(135deg,#0b202438,#25101b38),var(--panel); }
#view-characters .inventory-workspace-switch { position: relative; flex-wrap: wrap; justify-content: start; background: #24101c; gap: .4rem .7rem; }
#view-characters .inventory-workspace-switch > [data-inventory-save] { top: 0; left: 0; }
#view-characters .inventory-workspace-switch > [data-add-inventory] { margin-left: auto; }
#view-characters .inventory-balance-controls { margin-left: auto; }
#view-characters .inventory-balance > summary { color: var(--cyan); background: #0e181b; }
#view-characters .inventory-tools { background: #0b2025; }
#view-characters .inventory-list-heading { background: #10272b; }
#view-characters .inventory-select-row[aria-pressed=true] { background: linear-gradient(90deg,#05434caa,#30152e90); box-shadow: inset 3px 0 var(--yellow); }
#view-characters .inventory-inspector-title { background: linear-gradient(110deg,#102b30,#281321); }
@media (max-width: 1000px) {
  #view-characters .crawler-profile-fields { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 760px) {
  #view-characters.inventory-mode .sheet-page { flex-basis: 25rem; min-height: 25rem; }
  /* Existing account actions stay inside the application header on narrow Character views. */
  #app-shell:has(#view-characters:not([hidden])) .topbar { gap: .45rem; }
  #app-shell:has(#view-characters:not([hidden])) .topbar-meta { flex-wrap: nowrap; gap: .3rem; }
  #app-shell:has(#view-characters:not([hidden])) .topbar-meta :is(button, a:where(.route-link)) { font-size: .7rem; padding: .35rem .45rem; min-height: 2.5rem; }
  #view-characters .crawler-file > summary { padding: .65rem; gap: .6rem; flex-wrap: wrap; }
  #view-characters .crawler-affordance { margin-left: auto; font-size: .72rem; }
  #view-characters .crawler-avatar { width: 56px; height: 56px; flex-basis: 56px; }
  #view-characters .crawler-name { font-size: 1.1rem; }
  #view-characters .crawler-summary { font-size: .72rem; }
  #view-characters .sheet-tabs { padding: .3rem; gap: .25rem; }
  #view-characters .sheet-tab { flex: 1 1 auto; min-height: 2.3rem; font-size: .72rem; padding: .4rem .5rem; }
  #view-characters .crawler-picker { flex-basis: 100%; grid-template-columns: repeat(2,minmax(0,1fr)); }
  #view-characters .crawler-picker > span { grid-column: 1/-1; }
  #view-characters .crawler-profile-fields { grid-template-columns: minmax(0,1fr); }
  #view-characters .crawler-file-edit { padding: .5rem; }
  #view-characters .crawler-file .honor-editor-grid { grid-template-columns: minmax(0,1fr); }
  #view-characters .inventory-workspace-switch .inventory-balance-controls { order: 3; width: 100%; margin: 0; }
  #view-characters .inventory-form:has(.inventory-split.item-selected) .inventory-balance-controls { display: none; }
}

/* Local save recovery shares the compact Character surfaces. */
.character-recovery {border:1px solid var(--danger,#f68ca4);border-radius:10px;padding:12px;background:var(--panel,#171d29);margin-bottom:10px;}
.character-recovery[hidden] {display:none;}
.character-recovery p {margin:0 0 8px;}
.character-recovery pre {white-space:pre-wrap;overflow-wrap:anywhere;max-height:240px;overflow:auto;font-size:.85rem;}
.character-recovery pre:empty {display:none;}
.character-recovery .inline-actions,.character-leave-dialog .inline-actions {display:flex;flex-wrap:wrap;gap:8px;}
.character-leave-dialog {max-width:min(560px,calc(100vw - 24px));}
@media(max-width:420px){.character-recovery button,.character-leave-dialog button{white-space:normal;max-width:100%;flex:1 1 140px;}}