.collection-icon { display: inline-block; width: 20px; height: 20px; flex: 0 0 20px; background: currentColor; mask: var(--collection-icon) center / contain no-repeat; pointer-events: none; }
#collectionViewModes { display: inline-flex; align-items: center; gap: 2px; padding: 2px; border: 1px solid var(--line); border-radius: 6px; background: #0e141b; }
#collectionViewModes button { display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 4px; color: #a5b7bf; background: transparent; box-shadow: none; transform: none; }
#collectionViewModes button[aria-pressed="true"] { background: #234336; color: #a7efb8; }
#collectionViewModes button:hover { background: #26343a; color: #eaf4ef; }
#collectionViewModes button:focus-visible, .game-quick-controls button:focus-visible, .catalog-table button:focus-visible { outline: 2px solid #9aebb1; outline-offset: -2px; }
.card-open-button { position: absolute; inset: 0; z-index: 2; width: 100%; height: 100%; padding: 0; border: 0; background: transparent; box-shadow: none; border-radius: inherit; }
.card-open-button:hover, .card-open-button:focus { background: transparent; box-shadow: none; transform: none; }
.card-open-button:focus-visible { outline: 2px solid #a5edb8; outline-offset: -3px; }
.game-quick-controls { display: flex; align-items: center; gap: 4px; }
.game-quick-controls button { display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 1px solid #627680; border-radius: 5px; background: #101b22; color: #e0e9ed; box-shadow: none; transform: none; }
.game-quick-controls button:hover { background: #294138; color: #b4f3c5; border-color: #a1dcb5; }
.game-quick-controls .is-priority { color: #a8ecb9; background: #214331; border-color: #6ac88a; }
.item-card .game-quick-controls { position: absolute; z-index: 4; left: 8px; bottom: 8px; opacity: 0; transition: opacity 120ms ease; }
.item-card:hover .game-quick-controls, .item-card:focus-within .game-quick-controls { opacity: 1; }
#quickGamePopover { position: fixed; inset: auto; margin: 0; width: min(300px,calc(100vw - 16px)); max-height: calc(100dvh - 16px); overflow: auto; padding: 16px; border: 1px solid #4c6564; border-radius: 8px; background: #14201f; color: var(--text); box-shadow: 0 14px 48px #0009; }
#quickGamePopover header, #mobileMenuDialog > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
#quickGamePopover h2, #mobileMenuDialog h2 { font-size: 1rem; line-height: 1.4; margin: 0; overflow-wrap: anywhere; }
#quickGamePopover header button, #mobileMenuDialog header button { display: grid; place-items: center; flex: 0 0 40px; width: 40px; height: 40px; padding: 0; background: transparent; color: #c8dfd7; box-shadow: none; }
#quickGameFields { margin: 10px 0 0; padding: 0; border: 0; }
#quickGameFields legend { font-size: .75rem; color: #a9beb5; margin-bottom: 8px; }
#quickGameFields label { display: flex; align-items: center; min-height: 44px; gap: 10px; padding: 8px; border-radius: 4px; cursor: pointer; user-select: none; font-size: .85rem; }
#quickGameFields label:hover, #quickGameFields label:has(input:checked) { background: #273c33; }
#quickGameFields input { width: 16px; height: 16px; margin: 0; padding: 0; flex: 0 0 16px; cursor: pointer; accent-color: #9aebb1; }
#quickGameFields .ui-icon { width: 20px; height: 20px; }
#quickGameFields .quick-game-priority { margin-top: 8px; border-top: 1px solid #40514b; border-radius: 0; }
#quickGameMessage, #quickActionStatus { font-size: .78rem; line-height: 1.5; color: #b8dec5; overflow-wrap: anywhere; }
#quickGameMessage:empty { display: none; }
#quickActionStatus { margin: 0 0 12px; }
#content.catalog-list-mode { display: block; }
.catalog-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: .8rem; }
.catalog-table th { text-align: left; color: #a3b3bd; font-size: .72rem; font-weight: 600; }
.catalog-table th:first-child { width: 29%; }
.catalog-table th:nth-child(2) { width: 10%; }
.catalog-table th:nth-child(3) { width: 12%; }
.catalog-table th:nth-child(4) { width: 16%; }
.catalog-table th:nth-child(5) { width: 9%; }
.catalog-table th:last-child { width: 84px; }
.catalog-table th, .catalog-table td { padding: 9px 8px; border-bottom: 1px solid var(--line); overflow-wrap: anywhere; vertical-align: middle; }
.catalog-table th button { display: inline-flex; align-items: center; gap: 5px; min-height: 36px; padding: 0; color: inherit; background: transparent; box-shadow: none; font: inherit; transform: none; text-align: left; }
.catalog-table th .collection-icon { width: 14px; height: 14px; flex-basis: 14px; }
.catalog-table tbody tr:hover, .catalog-table tbody tr:focus-within { background: #b5e3cf09; }
.catalog-table .list-game-open { display: flex; align-items: center; gap: 12px; width: 100%; padding: 0; text-align: left; color: #edf2f4; background: transparent; box-shadow: none; transform: none; }
.list-game-open img { width: 36px; height: 52px; flex: 0 0 36px; object-fit: contain; background: #131d22; border-radius: 2px; }
.list-game-open strong { font-size: .82rem; font-weight: 700; line-height: 1.4; overflow-wrap: anywhere; }
.list-platform { color: #afbec7; }
.list-duration { color: #a6e3ba; font-variant-numeric: tabular-nums; font-size: .75rem; }
.list-personal { font-variant-numeric: tabular-nums; }
.catalog-table .status-badge { font-size: .68rem; padding: 4px 7px; white-space: normal; }
.list-mobile-label { display: none; color: #a9b6c0; }
.mobile-navigation, .mobile-app-header { display: none; }
#mobileMenuDialog { padding: 0; border-radius: 8px 8px 0 0; width: min(520px,100%); max-width: 100%; max-height: min(85dvh,740px); margin: auto auto 0; border: 1px solid var(--line); background: #101a20; color: var(--text); }
#mobileMenuDialog::backdrop { background: #0009; }
#mobileMenuDialog > header { padding: 12px 18px; border-bottom: 1px solid var(--line); }
#mobileMenuDialog .sidebar { display: block; position: static; width: 100%; height: auto; padding: 16px 18px max(18px,env(safe-area-inset-bottom)); border: 0; background: transparent; }
#mobileMenuDialog .brand, #mobileMenuDialog [data-view="dashboard"], #mobileMenuDialog [data-view="catalog"], #mobileMenuDialog [data-view="wishlist"], #mobileMenuDialog [data-view="calendar"] { display: none; }
#mobileMenuDialog .nav { margin: 0; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
#mobileMenuDialog #savedViewsNav { grid-column: 1 / -1; }
#mobileMenuDialog .saved-views-nav > summary { height: auto; justify-content: flex-start; min-height: 48px; gap: 10px; }
#mobileMenuDialog .saved-views-nav > summary .ui-icon, #mobileMenuDialog #savedViewsCount { display: block; }
#mobileMenuDialog .saved-views-dropdown { position: static; width: 100%; max-height: 220px; overflow: auto; box-shadow: none; }
#mobileMenuDialog .sidebar-footer { margin-top: 18px; }
#mobileMenuDialog .nav-button { min-height: 48px; padding: 10px; font-size: .82rem; }
body.mobile-menu-open { overflow: hidden; }
@media (max-width: 1200px) {
  .catalog-table, .catalog-table tbody { display: block; }
  .catalog-table thead { display: none; }
  .catalog-table tr { display: grid; grid-template-columns: minmax(0,1fr) minmax(105px,.5fr) 76px; gap: 8px 12px; padding: 12px 0; border-bottom: 1px solid var(--line); }
  .catalog-table td { display: block; padding: 0; border: 0; min-width: 0; align-self: center; }
  .list-title { grid-column: 1 / 3; grid-row: 1; }
  .list-actions { grid-column: 3; grid-row: 1; justify-self: end; }
  .list-platform { grid-column: 1; grid-row: 2; }
  .list-state { grid-column: 2 / 4; grid-row: 2; justify-self: end; }
  .list-duration { grid-column: 1; grid-row: 3; }
  .list-personal { grid-column: 2; grid-row: 3; font-size: .72rem; }
  .list-igdb { grid-column: 3; grid-row: 3; }
  .list-mobile-label { display: inline; }
}
@media (max-width: 960px) {
  body.logged-in:not(.public-profile) .mobile-navigation { position: fixed; display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); inset: auto 0 0; z-index: 90; padding: 5px max(8px,env(safe-area-inset-right)) max(5px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left)); background: #0e181df5; border-top: 1px solid #354f49; }
  .mobile-navigation button { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; min-width: 0; height: 54px; padding: 4px 0; border: 0; border-radius: 5px; background: transparent; color: #9daeb8; box-shadow: none; transform: none; font-size: .63rem; }
  .mobile-navigation .ui-icon, .mobile-navigation .collection-icon { width: 22px; height: 22px; flex-basis: 22px; }
  .mobile-navigation button[aria-current="page"], .mobile-navigation button[aria-expanded="true"] { color: #b8f2c8; background: #284435; }
  body.logged-in:not(.public-profile) .mobile-app-header { display: flex; justify-content: space-between; align-items: center; padding: 6px 14px; border-bottom: 1px solid var(--line); background: #101a20; }
  .mobile-app-header > span { display: flex; align-items: center; gap: 8px; font-size: .95rem; font-weight: 800; }
  .mobile-app-header > span img { width: 28px; height: 28px; }
  .mobile-app-header button { width: 44px; height: 44px; }
  body.logged-in main { padding-bottom: calc(74px + env(safe-area-inset-bottom)); }
  html { scroll-padding-bottom: calc(80px + env(safe-area-inset-bottom)); }
  .item-card .game-quick-controls { opacity: 1; }
  .game-quick-controls button { width: 40px; height: 40px; }
  .item-card .quick-priority { display: none; }
  .catalog-table .game-quick-controls button { width: 36px; height: 40px; }
}
@media (max-width: 700px) {
  #appPanel #collectionViewModes { grid-column: 1 / -1; grid-row: 2; justify-self: start; }
  #appPanel #primaryActionButton { grid-column: 1 / 3; }
  #collectionViewModes button, #appPanel #viewModeButton { width: 44px; height: 40px; padding: 0; }
  .catalog-table tr { grid-template-columns: minmax(0,1fr) 66px 78px; gap: 8px; }
  .catalog-table .list-game-open { gap: 9px; }
  .list-game-open strong { font-size: .8rem; }
  .list-mobile-label { display: block; font-size: .66rem; }
}
@media (hover: none) {
  .item-card .game-quick-controls { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .item-card .game-quick-controls { transition: none; }
}
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip-path: inset(50%); white-space: nowrap; border: 0 !important; }
