/* Candidate R2: load after u3-detail.css. Keep gameplay and panel heights. */
:is(#sheet,.login-card,.death-card),#sheet[data-view=settings]{background:rgba(3,18,38,.92)}
#confirm-dialog{background:rgba(3,18,38,.98)}
:is(#sheet,#confirm-dialog,.login-card) button:not(.item-cell):not(.shop-product):not(.trade-slot):not(.panel-tabs button):not(.service-tabs button):not(.subtabs button):not(.chat-tabs button){border-image-slice:12 fill;border-image-width:5px}
.login-card a.primary{border-image-slice:12 fill;border-image-width:5px}
.item-cell{border-image-slice:20 fill;border-image-width:3px}
.item-cell:is(.selected,[aria-pressed=true]){border-image-width:4px}
.shop-product{border:1px solid transparent;border-image:url('/assets/mobile-ui-v3/ui/frames/item-normal.png') 20 fill / 3px stretch}
.shop-product.selected{border-image-source:url('/assets/mobile-ui-v3/ui/frames/item-selected.png');border-image-width:4px}
.shop-quantity{display:grid;grid-template-columns:44px minmax(32px,1fr) 44px;gap:2px;width:100%;max-width:150px}
.shop-quantity button{width:44px;min-width:44px;height:44px;min-height:44px}
.shop-quantity input,.shop-quantity label input{width:100%;min-width:0;height:44px;min-height:44px}
.shop-quantity .icon{width:18px;height:18px}
.shop-line{display:grid;grid-template-columns:minmax(0,1fr) 44px;gap:5px}
.shop-line>.item-icon{grid-column:1;grid-row:1;justify-self:start}
.shop-line-main{grid-column:1 / -1;grid-row:2}
.shop-remove{grid-column:2;grid-row:1;width:44px;min-width:44px;height:44px;min-height:44px}
.shop-remove .icon{width:18px;height:18px}
.npc-empty-state{padding:18px 0;color:#c9daee;font-size:14px}
.skill-level-list .skill-icon{width:36px;height:36px;flex:none;margin-right:6px}
.skill-bar button:disabled .skill-icon{opacity:.7}
/* Preserve min 44px hit areas; the supply switch remains inside its full label. */

/* Keep the NPC name visible while its service content scrolls. */
#npc-identity.npc-identity{margin:0 8px 4px;padding:2px 0;color:#d7eaff;font-size:12px;font-weight:700;line-height:1.3}
#sheet[data-view=town] #town-chrome{background:rgba(8,26,48,.48)}

/* Fit both offers above the eight-slot grids without changing trade capacity. */
.trade-compare{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin:5px 0 7px}
.trade-compare>div{display:grid;gap:2px;min-width:0;padding:7px 8px;border:1px solid #547595;background:rgba(8,31,53,.8)}
.trade-compare small{font-size:11px;color:#bfd4e9}.trade-compare strong{font-size:15px;color:#f6d47c;font-variant-numeric:tabular-nums}.trade-compare span{font-size:11px;line-height:1.3;color:#d7e6f4}
#sheet[data-view=social] .sheet-scroll{padding-bottom:92px}
#trade-body .offer-grid{gap:6px}
#trade-body .offer-grid>section{padding:7px}
#trade-body .offer-grid h3{font-size:14px;margin-bottom:4px}
#trade-body .trade-grid{grid-template-columns:repeat(8,minmax(0,1fr));gap:2px}
#trade-body .trade-slot{aspect-ratio:auto;min-height:46px}
#trade-body .trade-slot small{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#trade-body .trade-slot.empty-slot{font-size:16px;color:#7790ac}
#trade-body .offer-gold{margin-top:4px;padding:5px 7px}
#trade-body .offer-state{margin-top:4px;padding:5px}
#sheet[data-view=social] #trade-body #trade-actions{position:absolute;left:12px;right:12px;bottom:8px;z-index:4;background:rgba(3,18,38,.98)}

/* Leave breathing room between item facts and its sticky action. */
#sheet[data-view=detail] .sheet-scroll{padding-bottom:76px}
#sheet[data-view=detail] .detail-stats{row-gap:16px}
#sheet[data-view=detail] .detail-actions{bottom:0;margin-top:18px;padding:10px 0 6px;z-index:2;background:rgba(3,18,38,.98)}
.bag-summary>span,.bag-summary .gold{font-size:12px}
.item-cell small{font-size:11px}
.shop-product strong,.shop-product small,.shop-line-main small{font-size:12px}
.shop-money{font-size:12px}

/* Text remains the primary signal; edge hue reinforces the message type. */
.notice[data-kind=success]{border-left-color:#72d2ac}
.notice[data-kind=attention]{border-left-color:#ff9d80}
.notice[data-kind=info]{border-left-color:#f6d47c}

#playtest{display:grid;gap:12px}
#playtest[hidden]{display:none}
#playtest label{font-size:13px;color:var(--muted)}
#playtest input{width:100%;min-height:44px;padding:8px 10px}
#playtest .actions{gap:8px}
