/* ICESUS · Beyond the ice. Game-client adapter for brand/icesus-theme.css.
   Keep output typography, ANSI colours, viewport sizing and focus in style.css. */
body { font-family: var(--icesus-sans); }
#hud {
  background: var(--icesus-landscape-overlay), url('../brand/frozen-valley.jpg?v=4') center 42% / cover;
  border-bottom-color: var(--icesus-line);
}
#hud::after, #bottom-bar::before { background: linear-gradient(90deg, transparent, var(--icesus-muted), transparent); pointer-events: none; }
#header { padding-block: 4px; background: linear-gradient(90deg, #09152a44, #09152a88); border-bottom: 1px solid #aacaff20; }
#header h1.icesus-brand { gap: 14px; margin: 0; font-weight: 400; }
.icesus-brand img { display: block; width: 176px; height: 48px; object-fit: contain; }
.client-edition { color: var(--icesus-muted); border-left: 1px solid var(--icesus-line); padding-left: 14px; font: 11px/1.45 var(--icesus-sans); letter-spacing: .02em; max-width: 200px; white-space: normal; }
#banner { border-top: 0; }
#char-name { font-family: var(--icesus-display); color: var(--icesus-bright); letter-spacing: .015em; text-shadow: 0 2px 8px #0005; }
#char-meta, #server-info, #latency, .carry-row { font-family: var(--icesus-sans); }
.carry-money { color: var(--icesus-muted); }
#game-time { color: var(--icesus-muted); border-color: #597aa166; background: #101e34cc; }
#party-row { border-color: #a4ddeb16; }
#party-label { color: var(--icesus-muted); font-family: var(--icesus-display); letter-spacing: .025em; }
.party-cell { background: #0b172b66; border-color: #718db140; border-radius: 5px 2px; box-shadow: inset 0 1px 0 #d8e7ff0a; }
.party-cell.is-self { border-color: #8fabd375; background: #20375766; }
.party-cell.is-leader { border-color: #8fabd375; }
.party-cell.is-leader .party-cell-name { color: var(--icesus-muted); }
#hotkey-bar { background: #0b172b4d; border-top: 1px solid #aacaff16; }
.hotkey-btn {
  background: var(--icesus-panel); border-color: var(--icesus-line); border-radius: 5px 2px;
  box-shadow: var(--icesus-bevel); color: var(--icesus-text);
}
.hotkey-btn:hover { background: var(--icesus-hover); border-color: var(--icesus-muted); }
.hotkey-btn .hk-label { color: var(--icesus-muted); font-family: var(--icesus-mono); border-right: 1px solid #53728266; padding-right: 6px; }
.hotkey-btn .hk-cmd { font-family: var(--icesus-sans); }
#hotkey-edit-btn, #trigger-edit-btn { display: inline-flex; align-items: center; justify-content: center; gap: 5px; color: var(--icesus-muted); }
#hotkey-edit-btn .icon, #trigger-edit-btn .icon { width: 14px; height: 14px; }
#trigger-edit-btn .icon { color: var(--icesus-muted); }
#hotkey-edit-btn .icon { color: var(--icesus-muted); }
.toolbar-btn, #hotkey-edit-btn, #trigger-edit-btn, #guild-toggle {
  background: var(--icesus-panel); border-color: var(--icesus-line); border-radius: 4px; box-shadow: var(--icesus-bevel);
}
.toolbar-btn:hover, #hotkey-edit-btn:hover, #trigger-edit-btn:hover, #guild-toggle:hover { background: var(--icesus-hover); border-color: var(--icesus-muted); color: var(--icesus-bright); }
.toolbar-btn[aria-expanded="true"] { background: var(--icesus-active); border-color: var(--icesus-line); color: var(--icesus-muted); }
#output { font-family: var(--icesus-mono); background: var(--icesus-night); }
#bottom-bar { background: var(--icesus-frame); border-top-color: var(--icesus-line); }
#vitals .gauge { --vital-colour: var(--icesus-red); }
#vitals #gauge-mana { --vital-colour: var(--icesus-blue); }
#vitals #gauge-moves { --vital-colour: var(--icesus-gold); }
#vitals #gauge-psp { --vital-colour: var(--icesus-violet); }
.gauge-label { font-family: var(--icesus-mono); color: var(--icesus-muted); }
.vital-name { display: inline-flex; align-items: center; gap: 5px; font-family: var(--icesus-mono); color: var(--vital-colour); }
.vital-name .icon { width: 13px; height: 13px; }
.gauge-bar { border: 1px solid #748db180; border-radius: 4px 1px; background: #080f1c; box-shadow: 0 1px 0 #c9dcff1a; }
.gauge-text, .exp-values { font-family: var(--icesus-mono); }
#exp-gauge-row .exp-label { color: var(--icesus-green); }
#location-bar { background: #a4ddeb07; border-color: #a4ddeb16; }
#room-name { font-family: var(--icesus-display); color: var(--icesus-bright); text-shadow: none; }
#room-area { color: var(--icesus-muted); }
#room-safe { color: var(--icesus-green); background: #8bd5a50d; border-color: #8bd5a54d; }
#exits-label { color: var(--icesus-muted); }
.exit-btn { background: #172a47; border-color: var(--icesus-line); color: var(--icesus-ice); border-radius: 4px; box-shadow: inset 0 1px 0 #d5e4ff10; font-family: var(--icesus-sans); }
.exit-btn:hover { background: var(--icesus-active); border-color: var(--icesus-muted); color: var(--icesus-muted); }
#input-area { background: #09152a66; border-top: 1px solid #aacaff20; }
#input { font-family: var(--icesus-mono); border-radius: 4px; border-color: #58739a; background: var(--icesus-control); color: var(--icesus-bright); box-shadow: inset 0 2px 6px #0003; }
#input:focus { border-color: var(--icesus-ice); box-shadow: 0 0 0 1px #a4ddeb33; }
#send-btn, .primary-btn, #hk-save-btn, #tg-save-btn {
  background: var(--icesus-metal); border: 1px solid #b7d8e5; color: #102633; border-radius: 4px;
  box-shadow: inset 0 1px 0 #edfaff, 0 2px 8px #0004; font-weight: 600;
}
#send-btn:hover, .primary-btn:hover, #hk-save-btn:hover, #tg-save-btn:hover { background: #e0f2f8; color: #102633; }
#hotkey-modal-inner, #trigger-modal-inner, .settings-inner, #guild-detail, #mobile-dpad {
  background: var(--icesus-panel); border: 1px solid #6888b1; border-radius: 7px;
  box-shadow: 0 20px 70px #0009, inset 0 1px 0 #a4ddeb22;
}
#hotkey-modal h2, #trigger-modal h2, .settings-inner h2, #guild-detail-head h2 {
  font-family: var(--icesus-display); color: var(--icesus-bright); font-size: 23px; font-weight: 400;
}
#hotkey-modal h2, #trigger-modal h2, .settings-inner h2 { display: flex; align-items: center; gap: 10px; }
#hotkey-modal h2 .icon, #trigger-modal h2 .icon, .settings-inner h2 .icon { color: var(--icesus-muted); width: 23px; height: 23px; }
#hotkey-modal-btns, #trigger-modal-btns { background: #14243d; }
.hk-edit-input, #tg-textarea { font-family: var(--icesus-mono); }
.dpad-btn { border-color: #547099; border-radius: 4px; }
.dpad-btn.available { color: var(--icesus-muted); border-color: #6888b1; background: var(--icesus-active); }
.dpad-heading { color: var(--icesus-muted); font-family: var(--icesus-display); }
#scroll-bottom-btn { background: var(--icesus-raised); border-color: var(--icesus-line); color: var(--icesus-muted); }
:focus-visible { outline: 2px solid var(--icesus-ice); outline-offset: 2px; }
@media (max-width: 900px) { .client-edition { display: none; } }
@media (max-width: 640px) {
  #header { padding-block: 3px; }
  #header h1.icesus-brand { gap: 0; flex-shrink: 1; min-width: 0; }
  .icesus-brand img { width: 116px; height: 32px; max-width: 100%; }
  #room-name { font-size: 11px; }
  .vital-name { gap: 3px; }
  .vital-name .icon { width: 10px; height: 10px; }
}
@media (max-width: 360px) {
  .icesus-brand img { width: 92px; height: 30px; }
  #status { font-size: 8px; }
}
/* Mouse-sized controls leave 32px for both the logo and time on narrow windows. */
@media (max-width: 640px) and (pointer: fine) {
  #header:has(#game-time:not([style*="none"])) .icesus-brand img { width: 92px; height: 20px; }
}
@media (pointer: coarse) and (max-height: 500px) { .icesus-brand img { width: 116px; height: 32px; } }

/* Colour is reserved for readings that need it. Quiet supporting chrome. */
#char-meta .level, .carry-wt, .carry-vol { color: var(--icesus-muted); }
.carry-money, .carry-dfavor { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.carry-money { color: var(--icesus-gold); }
.carry-bank { color: #d8c69e; }
.carry-dfavor { color: var(--icesus-violet); }
.carry-dfavor.has-detail:hover { color: #e2ceff; }
.carry-icon { flex: none; width: 14px; height: 14px; }
@media (max-width: 640px) { .carry-icon { width: 12px; height: 12px; } }
.carry-over { color: var(--icesus-red); }
.party-cell.is-self .party-cell-name, .party-cell.is-leader .party-cell-name { color: var(--icesus-bright); }
.party-cell-role.role-fol, .party-cell-role.role-vic, .party-cell-role.role-flk { color: var(--icesus-muted); }
.party-mini-fill.hp { background: #9c555e; }
.party-mini-fill.sp { background: #587b9c; }
.party-mini-fill.ep { background: #9b8a5f; }
.gauge-fill.exp { background: linear-gradient(90deg, #325c4d, #56816b); box-shadow: none; }
.gauge-fill.hp:not(.critical) { background: var(--icesus-gauge-hp); box-shadow: none; }
.gauge-fill.mana { background: var(--icesus-gauge-sp); box-shadow: none; }
.gauge-fill.moves { background: var(--icesus-gauge-ep); box-shadow: none; }
.gauge-fill.psp { background: var(--icesus-gauge-psp); box-shadow: none; }
.exit-btn.cardinal, .exit-btn.vertical, .exit-btn.special { color: var(--icesus-text); background: #192f4e; border-color: var(--icesus-line); }
.exit-btn:hover { color: var(--icesus-bright); border-color: #95bdce; }
#status.connected::before { box-shadow: none; }


/* Detailed RPG identity at useful sizes; game text retains its own colours. */
.hk-icon { flex: none; display: block; width: 20px; height: 20px; }
.hotkey-btn { gap: 7px; }
.vital-icon { flex: none; display: block; width: 22px; height: 22px; }
.location-icon { display: block; flex: none; width: 18px; height: 18px; }
#hotkey-modal h2 .icon, #trigger-modal h2 .icon { color: var(--icesus-ice); }
#guild-detail-head h2 { font-size: 23px; }
#char-meta .char-state.meditating { color: var(--icesus-violet); }
#char-meta .char-state.resting { color: var(--icesus-green); }
.guild-chip.gr-souls { color: var(--icesus-violet); }
.guild-chip.gr-fury { color: var(--icesus-ember); }
.guild-chip.gr-vitae { color: var(--icesus-red); }
.guild-chip.gr-charm { color: var(--icesus-green); }
#cast-spell-name, #cast-cps { color: var(--icesus-blue); }
#cast-bar { border-color: #557fa9; background: #101f30; border-radius: 4px 1px; }
#cast-fill:not(.complete):not(.busy-pulse) { background: var(--icesus-gauge-sp); }
#input-area { box-shadow: inset 0 1px 0 #cce7f115; }
@media(min-width:901px) and (min-height:601px) {
  #header { padding-inline: 16px; gap: 24px; }
  #char-name { font-size: 19px; line-height: 1.15; }
  #char-row { gap: 24px; }
  #party-grid { gap: 6px; }
  .party-cell { padding: 5px 8px; border-radius: 5px 2px; background: #0b172bb3; }
  .party-cell-name { font-size: 11px; }
  .party-mini-bar { height: 5px; }
  #hotkey-bar { padding-block: 5px; }
  .hotkey-btn { padding: 5px 9px; }
  #vitals { gap: 10px; padding: 5px 16px; }
  #vitals .gauge { gap: 8px; padding: 4px 8px; border: 1px solid var(--icesus-line); border-radius: 5px 2px; background: #0b172b66; box-shadow: inset 0 1px 0 #d7e6ff0d; }
  #vitals .gauge-label { font-size: 11px; }
  #vitals .vital-name { font-size: 11px; }
  #vitals .vital-icon { width: 18px; height: 18px; }
  #location-bar { padding-block: 7px; }
  #room-name { font-size: 15px; }
}
@media(max-width:900px), (max-height:600px) {
  .hk-icon { width: 17px; height: 17px; }
  .vital-icon { width: 14px; height: 14px; }
  .location-icon { width: 13px; height: 13px; }
}
@media(max-width:640px) { .vital-icon { width: 12px; height: 12px; } }


/* Compact action tiles: an emblem beside the key and command, on one row. */
#hotkey-bar { gap: 10px; flex-wrap: nowrap; align-items: stretch; }
#hotkey-buttons { flex-basis: auto; align-items: stretch; gap: 6px; padding-block: 2px; scrollbar-width: thin; scrollbar-color: #537282 transparent; }
.hotkey-btn { display: grid; grid-template-columns: 24px minmax(0,1fr); grid-template-rows: auto auto; column-gap: 8px; row-gap: 1px; align-content: center; min-height: 40px; padding: 5px 9px; text-align: left; }
.hotkey-btn .hk-icon { grid-column: 1; grid-row: 1 / 3; align-self: center; width: 24px; height: 24px; }
.hotkey-btn .hk-label { grid-column: 2; grid-row: 1; padding: 0; margin: 0; border: 0; font-size: 8px; line-height: 1.2; letter-spacing: .06em; }
.hotkey-btn .hk-cmd { grid-column: 2; grid-row: 2; min-width: 0; overflow: hidden; text-overflow: ellipsis; font-size: 11px; line-height: 1.3; }
.hotkey-tools { align-items: stretch; margin: 0; padding-block: 2px; }
.hotkey-btn:active { transform: translateY(1px); background: #2c486e; }
.hotkey-btn:focus-visible, .exit-btn:focus-visible { outline-offset: -3px; }
#hud-panels, #live-controls { scrollbar-width: thin; scrollbar-color: #537282 transparent; }
.gauge-label, .gauge-text, .carry-row, .party-cell-name { font-variant-numeric: tabular-nums; }
.settings-inner { background: var(--icesus-panel); }
.settings-inner .modal-help { max-width: 42ch; line-height: 1.6; color: var(--icesus-muted); }
.setting-row { border-bottom: 1px solid #a4ddeb18; padding-block: 12px; gap: 18px; }
.setting-row:last-of-type { border-bottom: 0; }
.setting-row select { border-color: #58739a; background-color: #0b172b; color: var(--icesus-bright); border-radius: 4px; padding: 7px 9px; }
@media (max-width:900px), (max-height:600px) {
  #hotkey-bar { gap: 7px; }
  .hotkey-btn { grid-template-columns: 22px minmax(0,1fr); column-gap: 6px; padding: 4px 7px; min-height: 36px; }
  .hotkey-btn .hk-icon { width: 22px; height: 22px; }
  .hotkey-btn .hk-cmd { font-size: 10px; }
  #hotkey-edit-btn, #trigger-edit-btn { display: flex; flex-direction: column; gap: 2px; min-width: 44px; padding: 4px; font: 9px/1.2 var(--icesus-sans); }
  #hotkey-edit-btn .icon, #trigger-edit-btn .icon { width: 16px; height: 16px; }
  .hotkey-tools { gap: 4px; }
}
@media (pointer:coarse) { .hotkey-btn, #hotkey-edit-btn, #trigger-edit-btn { min-height: 44px; } }

/* Keep action controls visible while a tall character/party panel scrolls. */
#hud-panels { display: flex; flex-direction: column; overflow: hidden; }
#character-panels { min-height: 0; overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #537282 transparent; }
#character-panels:focus-visible { outline-offset: -3px; }
#hotkey-bar { flex-shrink: 0; }
