/* Mobile overrides are isolated from the shared desktop styles. */
.mobile-only { display: none; }
@media (max-width: 900px) {
  html { scroll-padding-bottom: 96px; }
  #marketPulsePanel { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
  #mobileAssetPanel .table-tools { overflow: visible !important; }
  #assetRows > tr.asset-row > td, #assetRows > tr.asset-row > td:first-child { background: transparent !important; box-shadow: none !important; border: 0 !important; }
  #orderbookSidePanel .price-col { width: 29% !important; }
  #orderbookSidePanel .rate-col { width: 25% !important; }
  #orderbookSidePanel .value-col { width: 46% !important; }
  #orderbookSidePanel .trade-time-col, #orderbookSidePanel .trade-price-col { width: 30% !important; }
  #orderbookSidePanel .trade-value-col { width: 40% !important; }
  #orderbookSidePanel .side-panel-topbar, #marketPulsePanel .realtime-log-head { min-height: 54px !important; height: auto !important; padding: 10px 12px !important; }
  #orderbookSidePanel .side-panel-topbar strong, #marketPulsePanel .realtime-log-head strong { font-size: 15px !important; }
  #orderbookSidePanel .orderbook-head, #orderbookSidePanel .trades-head { height: 38px !important; min-height: 38px !important; padding-inline: 12px !important; }
  #orderbookSidePanel .orderbook-head strong, #orderbookSidePanel .trades-head strong { font-size: 12px !important; }
  #orderbookSidePanel .orderbook-table th, #orderbookSidePanel .trades-table th { height: 32px !important; }
  #orderbookSidePanel .orderbook-placeholder { min-height: 160px; font-size: 14px; }
  #marketPulsePanel #alertSettingsTrigger { min-width: 44px !important; }

  body { background: #080d16; }
  .mobile-only { display: block; }
  .app-shell.ht-app, .app-shell.ht-app.is-sidebar-collapsed { display: block !important; min-width: 0 !important; }
  .ht-main, .ht-main main { width: 100% !important; min-width: 0 !important; max-width: 720px !important; margin: 0 auto !important; }
  .ht-main main { padding: 0 16px calc(100px + env(safe-area-inset-bottom)) !important; }
  .sidebar.ht-sidebar, .app-shell.ht-app.is-sidebar-collapsed .sidebar.ht-sidebar {
    position: relative !important; display: flex !important; flex-direction: row !important; align-items: center !important;
    gap: 12px !important; width: 100% !important; height: 56px !important; min-height: 56px !important; max-height: none !important;
    padding: 8px 16px !important; border: 0 !important; border-bottom: 1px solid #1c293c !important; overflow: visible !important; box-shadow: none !important;
  }
  .ht-brand-row, .app-shell.ht-app.is-sidebar-collapsed .ht-brand-row { display: block; padding: 0; border: 0; flex: 0 0 auto; }
  .ht-brand { padding: 0; border: 0; }
  .ht-brand-copy, .ht-toggle.sidebar-toggle, .ht-status { display: none !important; }
  .ht-nav, .app-shell.ht-app.is-sidebar-collapsed .ht-nav { display: flex; flex-direction: row; flex: 1; min-width: 0; margin: 0; gap: 8px; overflow-x: auto; scrollbar-width: none; }
  .ht-nav-link, .app-shell.ht-app.is-sidebar-collapsed .ht-nav-link { min-height: 40px; flex: 0 0 auto; padding: 8px !important; font-size: 11px; gap: 5px; justify-content: flex-start; }
  .ht-nav-link svg { display: none; }
  .ht-nav-link span, .app-shell.ht-app.is-sidebar-collapsed .ht-nav-link span { display: inline; }
  .ht-nav-link.is-active { box-shadow: none; background: #172438; }
  .mobile-header { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 10px; padding: 24px 0 18px; }
  .mobile-eyebrow { margin: 0 0 6px; color: #8da6c8; font-size: 10px; font-weight: 750; letter-spacing: .14em; }
  .mobile-header h1 { margin: 0; color: #f4f7fc; font-size: 24px; letter-spacing: -.055em; line-height: 1.25; }
  .mobile-refresh { display: flex; align-items: center; gap: 6px; color: #91a3ba; font-size: 11px; }
  .mobile-refresh .title-refresh { width: 24px !important; height: 24px !important; }
  #mobileDataStatus { grid-column: 1 / -1; margin: 0; color: #8e9fb7; font-size: 11px; }
  #mobileDataStatus.is-warning { color: #f3c969; }
  #summary { display: none !important; }
  .market-layout { display: block !important; width: 100% !important; min-width: 0 !important; margin: 0 !important; }
  .asset-list-column, .table-wrap.panel-box, #orderbookSidePanel, #marketPulsePanel { width: 100% !important; min-width: 0 !important; max-width: none !important; margin: 0 !important; }
  .table-wrap.panel-box { border: 0 !important; border-radius: 0 !important; overflow: visible !important; background: transparent !important; box-shadow: none !important; }
  .table-tools.panel-box-title { display: block !important; height: auto !important; min-height: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; overflow: visible !important; }
  .table-tools > .table-title { display: none !important; }
  .table-toolbar-controls { display: grid !important; grid-template-columns: minmax(0, 1fr) auto !important; gap: 10px !important; width: 100% !important; min-width: 0 !important; }
  .table-toolbar-controls .tool-control { min-height: 46px !important; height: 46px !important; border: 1px solid #29394f !important; border-radius: 10px !important; background: #101a29 !important; padding: 0 12px !important; font-size: 12px !important; }
  .point-tool { display: flex !important; width: 100% !important; min-width: 0 !important; gap: 8px !important; }
  .point-tool > span { flex: 0 0 auto; color: #9badc6; font-size: 11px !important; }
  .point-tool #pointInput { width: 0 !important; flex: 1 1 0 !important; min-width: 0 !important; max-width: none !important; height: 42px !important; padding: 0 !important; font-size: 16px !important; color: #f3f7ff; }
  .point-tool b { color: #91b8ed; }
  #assetTabs { display: block !important; min-width: 0 !important; }
  .asset-menu-trigger { min-width: 110px !important; justify-content: center; }
  .asset-menu-pop { z-index: 45 !important; top: calc(100% + 6px) !important; right: 0 !important; left: auto !important; min-width: 190px !important; max-width: calc(100vw - 32px) !important; }
  .asset-menu-item { min-height: 46px !important; font-size: 13px !important; }
  .search-tool, .search-tool:hover, .search-tool:focus-within { grid-column: 1 / -1; display: flex !important; width: 100% !important; min-width: 0 !important; max-width: none !important; opacity: 1 !important; overflow: visible !important; transform: none !important; gap: 10px !important; }
  .search-tool #search, .search-tool:hover #search, .search-tool:focus-within #search { display: block !important; flex: 1 !important; width: 100% !important; min-width: 0 !important; max-width: none !important; height: 42px !important; opacity: 1 !important; pointer-events: auto !important; padding: 0 !important; font-size: 16px !important; transform: none !important; }
  .mobile-list-tools { display: flex; align-items: center; gap: 6px; margin: 14px 0 8px; color: #8e9fb7; }
  #mobileResultCount { flex: 1; font-size: 10px; }
  #mobileSort, #mobileSortDirection { min-height: 44px; padding: 0 6px; border: 0; border-radius: 7px; background: #111c2c; color: #bdcce0; font-size: 12px; }
  #mobileSort { max-width: 115px; }
  #mobileSortDirection { min-width: 68px; }
  .table-wrap .asset-table-body { display: block !important; width: 100% !important; max-height: none !important; overflow: visible !important; border: 0 !important; padding: 0 !important; }
  .table-wrap .asset-table-body > table, #assetRows { display: block !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; border: 0 !important; }
  .table-wrap .asset-table-body > table > thead { display: none !important; }
  .table-wrap .asset-table-body > table > tbody > tr.asset-row {
    position: relative; display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 0 16px !important; padding: 16px !important; margin: 0 0 10px !important; width: 100% !important;
    height: auto !important; min-height: 0 !important; border: 1px solid #25344b !important; border-radius: 14px !important;
    background: #101a29 !important; box-shadow: none !important; cursor: pointer;
  }
  .table-wrap .asset-table-body > table > tbody > tr.asset-row.is-expanded { border-color: #476792 !important; }
  .table-wrap .asset-table-body > table > tbody > tr.asset-row > td,
  .table-wrap .asset-table-body > table > tbody > tr.asset-row > td:first-child {
    display: flex !important; flex-direction: column; justify-content: flex-end; align-items: flex-end;
    min-width: 0 !important; width: auto !important; max-width: none !important; height: auto !important; min-height: 0 !important;
    padding: 8px 0 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important;
    font-size: 13px !important; line-height: 1.45 !important; white-space: normal !important; overflow-wrap: anywhere;
  }
  .table-wrap .asset-table-body > table > tbody > tr.asset-row > td::before { display: block; margin-bottom: 3px; color: #8f9fb7; font: 11px var(--font-sans); }
  #assetRows .coin-cell { grid-column: 1; grid-row: 1 / 3; align-items: flex-start !important; justify-content: flex-start !important; padding-top: 0 !important; }
  #assetRows .coin-wrap { align-items: center !important; gap: 9px !important; width: 100%; }
  #assetRows .coin-icon-img, #assetRows .coin-icon { width: 30px !important; height: 30px !important; flex: 0 0 30px !important; }
  #assetRows .asset-symbol { font-size: 15px !important; line-height: 1.3 !important; white-space: normal !important; word-break: keep-all; }
  #assetRows .sub { margin-top: 4px !important; font-size: 11px !important; color: #8497b4; }
  #assetRows .rate-cell { grid-column: 2; grid-row: 1; padding-top: 0 !important; }
  #assetRows .rate-cell .badge { font-size: 19px !important; line-height: 1.25 !important; padding: 0 !important; min-height: 0 !important; height: auto !important; border: 0 !important; background: transparent !important; }
  #assetRows .profit-cell { grid-column: 2; grid-row: 2; padding: 4px 0 12px !important; }
  #assetRows .profit-cell .result-head { font-size: 12px !important; }
  #assetRows .shop-cell { grid-column: 1; grid-row: 3; }
  #assetRows .bid-cell { grid-column: 2; grid-row: 3; }
  #assetRows .volume-cell { grid-column: 1; grid-row: 4; }
  #assetRows .bid-value-cell { grid-column: 2; grid-row: 4; }
  #assetRows .shop-cell::before { content: '교환가'; }
  #assetRows .bid-cell::before { content: '매수호가'; }
  #assetRows .volume-cell::before { content: '24h 거래대금'; }
  #assetRows .bid-value-cell::before { content: '매수호가 총액'; }
  #assetRows .shop-cell, #assetRows .volume-cell { align-items: flex-start !important; text-align: left !important; }
  #assetRows .value-strong { font-size: 13px !important; line-height: 1.45 !important; }
  #assetRows .empty-cell { display: block; padding: 38px 12px !important; white-space: normal; line-height: 1.8; }
  #assetTabDetail { margin: 12px 0 !important; font-size: 11px !important; white-space: normal !important; }
  #orderbookSidePanel, #marketPulsePanel { position: static !important; height: auto !important; max-height: none !important; border-radius: 12px !important; overflow: visible !important; }
  .side-panel-stack, .side-market-panels, .realtime-log-stack, .history-panel-body, .history-list-panel { width: 100% !important; min-width: 0 !important; max-width: none !important; height: auto !important; max-height: none !important; }
  .side-market-panels { display: grid !important; grid-template-columns: minmax(0, 1fr) !important; gap: 16px !important; }
  .orderbook-side-topbar, .realtime-log-head { min-height: 54px !important; height: auto !important; padding: 12px !important; }
  .orderbook-side-topbar strong, .realtime-log-head strong { font-size: 15px !important; }
  .orderbook-panel, .trades-panel { width: 100% !important; min-width: 0 !important; max-width: none !important; }
  .orderbook-head, .trades-head { height: 38px !important; font-size: 12px !important; padding-inline: 12px !important; }
  .orderbook-body, .trades-scroll { max-height: none !important; height: auto !important; overflow: visible !important; }
  .orderbook-table, .trades-table { width: 100% !important; min-width: 0 !important; table-layout: fixed !important; }
  .orderbook-table th, .trades-table th { height: 32px !important; font-size: 11px !important; }
  .orderbook-table tbody tr, .trades-table tbody tr { height: 32px !important; }
  .orderbook-table td, .trades-table td { height: 32px !important; padding: 5px 10px !important; font-size: 13px !important; }
  .orderbook-table .book-price, .orderbook-table .book-rate { font-size: 13px !important; }
  .realtime-log-list { height: auto !important; max-height: none !important; overflow: visible !important; }
  .history-sort-title-row { min-height: 44px !important; }
  .history-sort-heading { min-height: 44px !important; font-size: 12px !important; }
  #marketPulsePanel .history-item { min-height: 54px !important; height: auto !important; padding: 10px !important; }
  #marketPulsePanel .history-item, .history-sort-title-row { grid-template-columns: 10px 78px minmax(0, 1fr) !important; }
  #marketPulsePanel .history-item b, #marketPulsePanel .history-item time { font-size: 12px !important; }
  #marketPulsePanel .history-detail { font-size: 12px !important; white-space: normal !important; line-height: 1.65 !important; }
  .history-menu-trigger, #alertSettingsTrigger { min-height: 44px !important; height: auto !important; font-size: 12px !important; }
  .history-menu-pop { z-index: 45 !important; right: 0 !important; left: auto !important; max-width: calc(100vw - 48px) !important; }
  .history-menu-pop button { min-height: 44px !important; font-size: 13px !important; }
  #alertSettingsPop { position: fixed !important; inset: auto 12px calc(86px + env(safe-area-inset-bottom)) !important; width: auto !important; min-width: 0 !important; max-width: 520px !important; margin: 0 auto !important; max-height: calc(100dvh - 160px) !important; overflow-y: auto !important; z-index: 60 !important; }
  #alertSettingsPop input:not([type='checkbox']), #alertSettingsPop button { min-height: 44px !important; font-size: 16px !important; }
  .mobile-disclaimer { margin: 18px 0 0; color: #7f91ab; font-size: 10px; line-height: 1.7; text-align: center; }
  .mobile-bottom-nav { position: fixed; bottom: 0; left: 0; right: 0; z-index: 50; display: grid; grid-template-columns: repeat(3, 1fr); padding: 8px max(12px, env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left)); gap: 6px; border-top: 1px solid #2a3a52; background: #0b1422; box-shadow: 0 -8px 24px #0003; }
  .mobile-bottom-nav button { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; min-height: 54px; padding: 6px 8px; border: 0; border-radius: 10px; background: transparent; color: #8da0ba; font-size: 11px; font-weight: 650; }
  .mobile-bottom-nav button[aria-current='page'] { background: #1b2d48; color: #a8ccff; }
  .mobile-bottom-nav svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
  [data-mobile-view='list'] #orderbookSidePanel, [data-mobile-view='list'] #marketPulsePanel,
  [data-mobile-view='book'] .asset-list-column, [data-mobile-view='book'] #marketPulsePanel,
  [data-mobile-view='history'] .asset-list-column, [data-mobile-view='history'] #orderbookSidePanel { display: none !important; }
  [data-mobile-view='book'] #orderbookSidePanel, [data-mobile-view='history'] #marketPulsePanel { display: block !important; }
  button, .asset-row { touch-action: manipulation; }
  button:focus-visible, select:focus-visible, .asset-row:focus-visible { outline: 2px solid #91bdff !important; outline-offset: 3px; }
}
@media (max-width: 359px) {
  .ht-main main { padding-inline: 10px !important; }
  .mobile-header h1 { font-size: 22px; }
  .table-wrap .asset-table-body > table > tbody > tr.asset-row { padding: 12px !important; gap: 0 12px !important; }
  #assetRows .asset-symbol { font-size: 14px !important; }
  .table-toolbar-controls { gap: 8px !important; }
  .table-toolbar-controls .tool-control { padding-inline: 8px !important; }
  .asset-menu-trigger { min-width: 98px !important; }
}