body.phone .room-scroll { cursor: auto; -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; }
body.phone .room-ui { padding: 8px 10px 0; }
body.phone .room-ui .view-head { gap: 8px; margin: 0; min-height: 0; }
body.phone .room-ui .view-head > .grow { flex: 0 0 100%; height: 0; }
body.phone .room-ui .view-head > .btn { flex: 1 1 auto; padding-left: 6px; padding-right: 6px; font-size: 13px; }
body.phone .room-ui .view-head > .btn .t { white-space: nowrap; }
@media (max-width: 380px) {
  body.phone .room-ui .view-head > .btn { flex: 1 1 0; min-width: 0; padding-left: 2px; padding-right: 2px; font-size: 12px; justify-content: center; }
}
body.phone .room-ui h1 { font-size: 20px; }
body.phone .room-score { flex: 1 1 auto; min-width: 0; min-height: 44px; align-items: center; gap: 8px; padding: 4px 10px; cursor: pointer; flex-wrap: wrap; row-gap: 2px; }
body.phone .room-score-n { font-size: 20px; }
body.phone .room-rank { font-size: 14px; }
body.phone .room-sets { font-size: 12px; cursor: pointer; }
body.phone .room-slot:not(.full) { box-shadow: inset 0 0 0 calc(var(--S) / 2) color-mix(in srgb, var(--accent) 40%, transparent); }
body.phone .room-slot:not(.full)::after { opacity: .7; }
body.phone .room-slot:not(.full):active { box-shadow: inset 0 0 0 calc(var(--S) / 2) var(--accent); }
body.phone .room-slot.full::before { content: ''; position: absolute; inset: -6px; }
body.phone .room-slot.full:active { filter: none; }
body.phone .room-items:has(.room-slot.full:active) { z-index: 1; }
body.phone .room-jar::before { content: ''; position: absolute; inset: -12px; }

body.phone .room-pick { grid-template-columns: repeat(auto-fill, minmax(min(150px, 50% - 6px), 1fr)); max-height: 64dvh; }
body.phone .room-menu .room-btns { width: 100%; }
body.phone .room-menu .room-btns > .btn { flex: 1 1 0; }
body.phone .room-shop-row { grid-template-columns: 56px minmax(0, 1fr) auto; gap: 10px; padding: 10px 8px; }
body.phone .room-shop-row > span:last-child { padding: 0; font-size: 13px; text-align: right; max-width: 76px; }
body.phone .room-shop-row > .btn { padding-left: 8px; padding-right: 8px; }
body.phone .room-shop-sub { font-size: 13px; }
body.phone .room-shop-art { overflow: hidden; max-width: 64px; }
body.phone .room-shop-art canvas { max-width: 64px; height: auto; }
body.phone .room-review-list { max-height: 64dvh; }
body.phone .room-review-head { flex-wrap: wrap; gap: 4px 12px; }

body.phone.photo-mode .tabbar { visibility: hidden; }
body.phone.photo-mode .screens { grid-row: 2; }
body.phone.photo-mode .room-slot:not(.full) { box-shadow: none; }
body.phone.photo-mode .room-slot:not(.full)::after { opacity: 0; }
.photo-back { position: absolute; right: 20px; top: calc(20px + env(safe-area-inset-top)); pointer-events: auto; min-width: 88px; }
body.pc .photo-back { display: none; }
body.phone .photo-corner { width: 32px; height: 32px; }
body.phone .photo-corner.tl, body.phone .photo-corner.bl { left: 14px; }
body.phone .photo-corner.tr, body.phone .photo-corner.br { right: 14px; }
body.phone .photo-corner.tl, body.phone .photo-corner.tr { top: calc(14px + env(safe-area-inset-top)); }
body.phone .photo-corner.bl, body.phone .photo-corner.br { bottom: calc(14px + env(safe-area-inset-bottom)); }
body.phone .photo-back { right: 56px; top: calc(28px + env(safe-area-inset-top)); }
body.phone .photo-hint { bottom: calc(40px + env(safe-area-inset-bottom)); font-size: 14px; }
body.phone .photo-polaroid { right: 12px; bottom: calc(80px + env(safe-area-inset-bottom)); width: 184px; }
body.phone .photo-polaroid canvas { width: 160px; }

.backroom.br-pan { overflow-x: auto; overflow-y: hidden; scrollbar-width: none; touch-action: pan-x; overscroll-behavior-x: contain; }
.backroom.br-pan::-webkit-scrollbar { display: none; }
.backroom.br-pan .layer { right: auto; overflow: hidden; }
.backroom.br-pan .wallbg, .backroom.br-pan .floorbg { image-rendering: pixelated; }
.k-wall .backroom.br-pan .wallbg { background-size: calc(var(--tile-wall-w) * var(--tk)) calc(var(--tile-wall-h) * var(--tk)); background-position: 0 0; }
.k-floor .backroom.br-pan .floorbg { background-size: calc(var(--tile-floor-w) * var(--tk)) calc(var(--tile-floor-h) * var(--tk)); background-position: 0 0; }
body.phone .br-bal { left: 10px; top: 10px; padding: 6px 12px 8px; }
body.phone .br-st:active > div:not(.tag) canvas, body.phone .br-st:active > div:not(.tag) > .fb, body.phone .br-st:active .br-disc {
  filter: drop-shadow(var(--S) 0 0 var(--accent)) drop-shadow(calc(var(--S) * -1) 0 0 var(--accent)) drop-shadow(0 var(--S) 0 var(--accent)) drop-shadow(0 calc(var(--S) * -1) 0 var(--accent));
}

body.phone .auc { gap: 14px; }
body.phone .auc-head { flex-wrap: wrap; gap: 6px 12px; align-items: baseline; }
body.phone .auc-title { white-space: nowrap; font-size: 22px; }
body.phone .auc-head > .grow { display: none; }
body.phone .auc-head > .btn { flex: 1 1 100%; order: 3; }
body.phone .auc-tabs { margin-top: 0; }
body.phone .auc-tabs > .btn { flex: 1 1 0; }
body.phone .auc-stage { gap: 12px; }
body.phone .auc-feed { width: 100%; height: auto; min-height: 120px; }
body.phone .auc-lots { gap: 10px; }
body.phone .auc-lot { width: 100%; min-height: 64px; }
body.phone .auc-bidbar { flex-wrap: wrap; gap: 10px; }
body.phone .auc-mine { min-width: 0; flex: 1 1 100%; text-align: center; }
body.phone .auc-sale { grid-template-columns: minmax(0, 1fr) minmax(0, 88px) auto; gap: 8px; }
body.phone .auc-grid { grid-template-columns: repeat(auto-fill, minmax(min(150px, 50% - 6px), 1fr)); max-height: 60dvh; }
body.phone .auc-confirm { gap: 14px; }
body.phone .auc-terms { width: 100%; padding: 14px; }
body.phone .auc-actions > .btn { flex: 1 1 0; }

body.phone .modal:has(> .trader) { width: 100vw; }
body.phone .trader { width: 100%; gap: 12px; }
body.phone .trader-head { gap: 14px; }
body.phone .trader-portrait { width: 72px; }
body.phone .trader-bubble p { font-size: 14px; }
body.phone .trader-side { min-width: 0; }
body.phone .trader-actions { width: 100%; justify-content: center; gap: 8px; }
body.phone .trader-actions > .btn { flex: 1 1 40%; }
body.phone .trader-rows { gap: 8px 16px; }

body.phone .bm { gap: 14px; }
body.phone .bm-head { gap: 10px; align-items: flex-end; }
body.phone .bm-figure { gap: 2px; }
body.phone .bm-talk h2 { font-size: 22px; }
body.phone .bm-stock { grid-template-columns: repeat(2, minmax(0, 150px)); gap: 14px 12px; }
body.phone .bm-slot { padding: 0; }
body.phone .bm-want { padding: 12px; }
body.phone .bm-want-items { gap: 10px; }
body.phone .bm-closed { min-width: 0; }

body.phone .forge-head { flex-wrap: wrap; gap: 10px; }
body.phone .forge-tabs { flex-wrap: wrap; }
body.phone .forge-tabs > .btn { flex: 1 1 auto; }
body.phone .forge-body { min-height: 0; }
body.phone .forge-grid { grid-template-columns: repeat(auto-fill, minmax(min(150px, 50% - 6px), 1fr)); max-height: 50dvh; }
body.phone .forge-recipes, body.phone .forge-stickers { grid-template-columns: minmax(0, 1fr); max-height: 54dvh; }
body.phone .recipe { grid-template-columns: 72px minmax(0, 1fr) auto; }
body.phone .forge-bar { flex-wrap: wrap; }
body.phone .keys-row { flex-direction: column; gap: 14px; text-align: center; }
body.phone .keys-odds, body.phone .keys-btns { justify-content: center; }
body.phone .polish { grid-template-columns: minmax(0, 1fr); }
body.phone .polish-grid { grid-template-columns: repeat(auto-fill, minmax(min(150px, 50% - 6px), 1fr)); max-height: 40dvh; }
body.phone .wheel-box { width: 100%; }