:root {
  --green: #08b978;
  --green-dark: #069960;
  --green-soft: #e9fbf4;
  --ink: #1f2933;
  --muted: #7c8995;
  --line: #e8edf0;
  --canvas: #f4f6f7;
  --danger: #ee6570;
  --warn: #f2a644;
  font-family: "Microsoft YaHei", "PingFang SC", Arial, sans-serif;
  color: var(--ink);
}

* { box-sizing: border-box; }
a { color: inherit; text-decoration: none; }
body { margin: 0; min-height: 100vh; background: #dce5e4; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; -webkit-tap-highlight-color: transparent; }

.phone-shell { position: relative; width: min(100%, 390px); min-height: 844px; margin: 0 auto; background: var(--canvas); box-shadow: 0 0 28px rgba(26, 58, 52, .16); overflow: hidden; }
.app-page { min-height: 100vh; padding-bottom: 72px; }
.topbar { position: sticky; top: 0; z-index: 4; height: 56px; display: flex; align-items: center; gap: 10px; padding: 0 15px; color: white; background: var(--green); box-shadow: 0 2px 8px rgba(0, 120, 77, .15); }
.topbar h1 { flex: 1; margin: 0; font-size: 17px; line-height: 1; text-align: center; font-weight: 650; }
.topbar .spacer, .back { width: 28px; }
.back { display: block; border: 0; color: white; background: transparent; font-size: 28px; line-height: 1; padding: 0; }
.search-trigger { display: grid; flex: 0 0 28px; width: 28px; height: 32px; place-items: center; padding: 0; border: 0; color: #fff; background: transparent; font-size: 25px; line-height: 1; }
.stocktake-search-trigger { margin-left: auto; }
.top-action { border: 0; padding: 7px 9px; color: var(--green-dark); border-radius: 7px; background: white; font-size: 12px; font-weight: 700; }
.more-link { width: 28px; color: white; font-size: 17px; letter-spacing: 1px; line-height: 1; text-align: right; }
.content { padding: 12px; }

.login { min-height: 100vh; background: #fff; padding: 56px 22px 20px; }
.brand { margin: 16px 0 36px; text-align: center; }
.brand-badge { display: inline-grid; place-items: center; width: 68px; height: 68px; border-radius: 22px; color: white; background: var(--green); box-shadow: 0 10px 22px rgba(8,185,120,.22); font-size: 27px; font-weight: 800; }
.brand h1 { margin: 15px 0 6px; font-size: 23px; }
.brand p { margin: 0; color: var(--muted); font-size: 13px; }
.field { margin: 14px 0; }
.field label { display: block; margin: 0 0 7px; font-size: 13px; color: #53616c; }
.input, .select, textarea { width: 100%; border: 1px solid var(--line); outline: none; border-radius: 10px; background: #fafcfc; color: var(--ink); padding: 13px 12px; }
.input:focus, .select:focus, textarea:focus { border-color: var(--green); box-shadow: 0 0 0 3px rgba(8,185,120,.12); }
.primary, .secondary, .danger, .outline { display: inline-flex; align-items: center; justify-content: center; border: 0; min-height: 43px; padding: 0 15px; border-radius: 8px; font-weight: 700; }
.primary { color: white; background: var(--green); }
.primary:active { background: var(--green-dark); }
.primary.full { width: 100%; margin-top: 10px; }
.secondary { color: var(--green-dark); background: var(--green-soft); }
.outline { color: var(--green-dark); border: 1px solid #bfead7; background: white; }
.danger { color: white; background: var(--danger); }
.hint { margin-top: 18px; color: var(--muted); font-size: 12px; text-align: center; }

.profile-card, .info-card, .stat-card, .material-card, .order-card, .trace-card { border-radius: 12px; background: white; box-shadow: 0 2px 10px rgba(38, 54, 61, .045); }
.profile-card { display: flex; align-items: center; gap: 12px; padding: 16px; }
.avatar { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; color: white; background: var(--green); font-weight: 800; font-size: 19px; }
.profile-card h2 { margin: 0 0 5px; font-size: 15px; }
.profile-card p { margin: 0; color: var(--muted); font-size: 12px; }
.home-banner { margin: 0; overflow: hidden; border-radius: 12px; background: #fff; box-shadow: 0 2px 10px rgba(38, 54, 61, .045); }
.home-banner img { display: block; width: 100%; height: auto; }
.section-title { display: flex; align-items: center; justify-content: space-between; margin: 19px 3px 10px; font-size: 15px; font-weight: 750; }
.section-title span { color: var(--muted); font-size: 12px; font-weight: 400; }
.menu-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 9px; }
.lookup-entry-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 8px; }
.lookup-entry { display: flex; min-height: 156px; flex-direction: column; align-items: center; justify-content: center; gap: 9px; padding: 16px 10px; border-radius: 14px; background: #fff; box-shadow: 0 2px 10px rgba(38,54,61,.05); text-align: center; }.lookup-entry strong { font-size: 16px; }.lookup-entry small { color: var(--muted); font-size: 11px; }
.menu-item { display: block; min-height: 91px; padding: 11px 4px 8px; border: 0; border-radius: 12px; color: #42525d; background: white; box-shadow: 0 2px 8px rgba(38,54,61,.04); font-size: 11px; text-align: center; }
.menu-icon { display: grid; place-items: center; width: 36px; height: 36px; margin: 0 auto 8px; border-radius: 11px; color: var(--green-dark); background: var(--green-soft); font-size: 18px; }
.utility-row { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.utility-btn { display: block; min-height: 58px; border: 0; border-radius: 10px; color: var(--green-dark); background: white; text-align: left; padding: 12px; box-shadow: 0 2px 8px rgba(38,54,61,.04); font-weight: 700; }
.utility-btn small { display: block; margin-top: 4px; color: var(--muted); font-weight: 400; }

.search-row { display: flex; gap: 8px; margin-bottom: 11px; }
.search-row .input { padding: 11px 12px; }
.search-row button { flex: 0 0 auto; }
.summary { display: flex; align-items: center; gap: 11px; padding: 14px; margin-bottom: 10px; border-radius: 10px; background: white; }
.summary-icon { display: grid; place-items: center; flex: 0 0 34px; height: 34px; border-radius: 50%; color: white; background: var(--green); }
.summary strong { display: block; font-size: 20px; }
.summary span { color: var(--muted); font-size: 12px; }
.summary .primary { margin-left: auto; min-height: 34px; font-size: 12px; }
.order-card, .material-card, .trace-card { position: relative; margin-bottom: 10px; padding: 14px; }
.order-card-link { display: block; }
.material-card-link { display: block; }
.order-card h3, .material-card h3, .trace-card h3 { margin: 0 0 7px; font-size: 14px; }
.order-meta, .material-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 5px 12px; color: #687680; font-size: 12px; }
.order-meta .full-row { grid-column: 1 / -1; }
.order-meta b, .material-meta b { color: var(--ink); font-weight: 600; }
.quantity { color: var(--green-dark); font-weight: 800; }
.status { display: inline-block; padding: 3px 7px; border-radius: 999px; font-size: 11px; font-weight: 700; }
.status.wait { color: #df7418; background: #fff1dc; }.status.done { color: var(--green-dark); background: var(--green-soft); }.status.danger { color: #c9424c; background: #ffe7e9; }
.status.partial { color: #a97800; background: #fff5d8; }.status.success { color: var(--green-dark); background: var(--green-soft); }
.card-actions { display: flex; justify-content: flex-end; gap: 7px; margin-top: 10px; }
.card-actions button { min-height: 32px; padding: 0 10px; border-radius: 7px; font-size: 12px; }
.empty { margin: 35px 6px; padding: 32px 15px; border-radius: 12px; color: var(--muted); background: white; text-align: center; font-size: 13px; }
.scan-panel { display: flex; align-items: center; justify-content: space-between; padding: 15px; margin-bottom: 12px; border-radius: 12px; background: white; }
.scan-panel strong { display: block; margin-bottom: 3px; font-size: 14px; }.scan-panel span { color: var(--muted); font-size: 12px; }
.scan-chip { width: 48px; height: 48px; border: 0; border-radius: 50%; color: white; background: var(--green); box-shadow: 0 7px 14px rgba(8,185,120,.25); font-size: 18px; }
.scan-footer { position: fixed; z-index: 3; bottom: 0; left: 50%; width: min(100%, 390px); padding: 10px 12px; transform: translateX(-50%); background: rgba(255,255,255,.96); border-top: 1px solid var(--line); }
.scan-footer .primary { width: 100%; }
.two-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.info-card { padding: 14px; }.info-card p { margin: 7px 0; color: #63727d; font-size: 13px; }.info-card p b { color: var(--ink); }
.location-row { display: flex; align-items: center; gap: 10px; padding: 13px; margin-bottom: 9px; border-radius: 10px; background: white; }
.location-mark { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; color: var(--green-dark); background: var(--green-soft); }.location-row main { flex: 1; }.location-row h3 { margin: 0 0 4px; font-size: 14px; }.location-row p { margin: 0; color: var(--muted); font-size: 12px; }.icon-btn { border: 0; padding: 7px; border-radius: 7px; color: var(--green-dark); background: var(--green-soft); }
.location-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px; max-width: 118px; }.location-actions .icon-btn { padding: 5px 6px; font-size: 11px; }
.location-create-page { padding-bottom: 12px; background: #fff; }.location-create-form { padding: 12px 14px 16px; background: #fff; }.location-form-section { margin: 4px 0 12px; }.location-form-section h2, .location-field { display: block; color: #8d959d; font-size: 13px; font-weight: 400; }.radio-row { display: flex; flex-wrap: wrap; gap: 8px 12px; margin-top: 8px; }.radio-row label { display: flex; align-items: center; gap: 3px; color: #17212a; font-size: 12px; font-weight: 400; }.radio-row input { width: 15px; height: 15px; margin: 0; accent-color: var(--green); }.location-field { margin: 11px 0; }.location-field input { display: block; width: 100%; min-height: 38px; margin-top: 4px; padding: 0 10px; border: 0; border-radius: 9px; outline: none; color: var(--ink); background: #f5f6f9; font-size: 13px; }.location-field input::placeholder { color: #a3abb4; }.location-create-form .primary.full { min-height: 38px; margin-top: 2px; font-size: 13px; font-weight: 400; }
.page-tip { margin: 4px 14px 0; padding: 8px 12px; border-radius: 8px; background: #f5f6f9; color: #5b6573; font-size: 12px; line-height: 1.55; }
.tabs { display: flex; gap: 6px; margin-bottom: 11px; }.tabs button { flex: 1; border: 0; border-radius: 8px; padding: 9px 4px; color: var(--muted); background: white; font-size: 12px; }.tabs button.active { color: white; background: var(--green); }
.stocktake-tabs { margin-top: 0; }
.stocktake-product-list { margin-top: 2px; }.stocktake-product-count { display: flex; justify-content: space-between; gap: 12px; margin-top: 11px; padding-top: 10px; border-top: 1px solid var(--line); color: #687680; font-size: 12px; }.stocktake-product-count b { color: var(--ink); }.tag-card { position: relative; margin-bottom: 10px; padding: 14px; border-radius: 12px; background: #fff; box-shadow: 0 2px 10px rgba(38,54,61,.045); }.tag-card h3 { margin: 8px 0 5px; font-size: 14px; }.tag-card .code { margin: 0; }
.stocktake-create-page { padding-bottom: 16px; background: #f3f3f3; }.stocktake-create-page .content { padding: 0 0 16px; }.create-group { margin: 0; }.create-group h2 { margin: 0; padding: 8px 11px; color: #646d75; font-size: 12px; font-weight: 600; }.create-group-heading { display: flex; align-items: center; justify-content: space-between; }.create-group-heading .clear-range { margin-right: 11px; border: 0; color: #ee5864; background: transparent; font-size: 12px; font-weight: 600; }.create-description { margin: 0; padding: 0 11px 7px; color: #8b949c; font-size: 10px; line-height: 1.45; }.create-card { margin: 0 10px 8px; padding: 0 10px; border-radius: 12px; background: #fff; }.create-row { display: grid; grid-template-columns: 1fr auto; align-items: center; min-height: 42px; border-bottom: 1px solid #edf0f1; color: #313a42; font-size: 12px; text-align: left; }.create-row:last-child { border-bottom: 0; }.create-row span { color: #4f5961; }.create-row b { font-size: 12px; font-weight: 600; }.create-row-button { width: 100%; padding: 0; border-inline: 0; border-top: 0; border-bottom: 1px solid #edf0f1; background: transparent; }.create-row-button:last-child { border-bottom: 0; }.create-row .placeholder-value { color: #757e85; font-weight: 500; }.quick-stocktake { color: #33413d; }.quick-stocktake::first-letter { color: var(--green); }.create-input-row input { width: 172px; padding: 0; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 12px; text-align: right; }.create-input-row input::placeholder { color: #848d94; }
.tag-card.highlight { border: 2px solid var(--green); box-shadow: 0 0 0 3px rgba(8,185,120,.13); }.tag-card { transition: .2s; }.code { word-break: break-all; color: #53616c; font-family: Consolas, monospace; font-size: 11px; }
.step { display: flex; gap: 10px; padding: 10px 0; }.step i { display: grid; place-items: center; flex: 0 0 25px; height: 25px; border-radius: 50%; color: white; background: var(--green); font-size: 12px; font-style: normal; }.step p { margin: 2px 0; color: #63727d; font-size: 12px; }.timeline { border-left: 2px solid #c8efdf; margin: 16px 0 0 12px; padding-left: 16px; }.timeline-item { position: relative; padding-bottom: 17px; }.timeline-item:before { content: ""; position: absolute; width: 9px; height: 9px; border-radius: 50%; background: var(--green); left: -22px; top: 4px; }.timeline-item strong { font-size: 13px; }.timeline-item p { margin: 5px 0 0; color: var(--muted); font-size: 12px; }
.key-value { display: grid; grid-template-columns: 76px 1fr; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--line); font-size: 13px; }.key-value span { color: var(--muted); }

.control-shell { background: #f3f3f3; }
.control-page { padding-bottom: 0; background: #f3f3f3; }
.control-profile { display: flex; gap: 12px; align-items: center; min-height: 80px; padding: 14px 16px; background: #fff; }
.control-avatar { display: grid; place-items: center; flex: 0 0 45px; width: 45px; height: 45px; color: white; background: var(--green); border-radius: 50%; font-size: 16px; font-weight: 700; }
.control-profile h2 { margin: 0 0 4px; color: #222; font-size: 13px; font-weight: 800; }.control-profile p { margin: 1px 0; color: #8a8a8a; font-size: 9px; line-height: 1.35; }
.control-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px 4px; margin: 10px 7px 0; padding: 13px 4px 16px; border-radius: 10px; background: #fff; }
.control-item { display: flex; min-height: 53px; flex-direction: column; align-items: center; justify-content: flex-start; gap: 6px; padding: 0; border: 0; color: #52606c; background: transparent; font-size: 9px; }
.control-icon { display: grid; place-items: center; width: 23px; height: 23px; font-size: 23px; line-height: 1; }.control-icon.blue { color: #4285f4; }.control-icon.green { color: #05b779; }.control-icon.orange { color: #ff712a; }.control-icon.purple { color: #6a79ff; }.logout-icon { font-size: 26px; }
.highlight-action { border: 0; padding: 7px 12px; border-radius: 7px; color: #fff; background: var(--green-dark); font-size: 12px; font-weight: 700; }
.product-summary { padding: 10px 12px; border-radius: 8px; background: #fff; }.product-summary div { padding: 7px 0; border-bottom: 1px solid var(--line); font-size: 12px; }.product-summary div:last-child { border-bottom: 0; }.product-summary span { color: #6d7780; }.product-summary b { color: #55616a; }
.tag-editor { position: relative; margin-top: 10px; padding: 13px 57px 13px 13px; border-radius: 12px; background: #fff; }.tag-preview { display: grid; height: 114px; margin-bottom: 10px; border-radius: 10px; color: #a2abb4; background: linear-gradient(135deg, #f3f5f8, #ebeef3); place-items: center; font-size: 13px; }.tag-preview::after { content: "暂无图片"; }.tag-field { margin: 9px 0; }.tag-field label { display: block; margin-bottom: 4px; color: #7b8791; font-size: 11px; }.tag-field div { min-height: 30px; padding: 7px 9px; border-radius: 8px; color: #596670; background: #f5f6f9; font-size: 12px; }.tag-field .epc-value { color: #39444d; font-family: Consolas, monospace; font-weight: 700; }
.power-control { position: fixed; z-index: 5; top: 52%; left: max(0px, calc(50% - 195px)); display: flex; width: 43px; height: 66px; flex-direction: column; align-items: center; justify-content: center; gap: 2px; padding: 0; border: 0; border-radius: 0 22px 22px 0; color: #fff; background: var(--green); box-shadow: 3px 4px 10px rgba(8,185,120,.22); }.power-control strong { font-size: 15px; }.power-control span { font-size: 10px; }
.signal-meter { position: absolute; top: 13px; right: 13px; bottom: 13px; display: flex; width: 31px; overflow: hidden; align-items: flex-end; border-radius: 2px; background: #f2f3f7; }.signal-fill { display: block; width: 100%; height: 0; background: linear-gradient(to top, #08b978, #65deb2); transition: height .45s ease; }.signal-value { position: absolute; top: 50%; left: 50%; color: #8c98a2; font-size: 9px; font-weight: 500; line-height: 1.1; text-align: center; transform: translate(-50%, -50%) rotate(-90deg); white-space: nowrap; }.signal-meter.signal-active .signal-fill { height: 72%; }.signal-meter.signal-active .signal-value { color: #fff; }
.trigger-scan { width: 100%; margin-top: 10px; }
.trace-scan-row { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }.trace-scan-row .scan-chip { flex: 0 0 48px; }
.tag-detail-page { padding-bottom: 54px; }.stop-status { position: fixed; bottom: 0; left: 50%; width: min(100%, 390px); padding: 10px; transform: translateX(-50%); color: #c8c8c8; background: #ffe9eb; text-align: center; font-size: 12px; }

.modal-mask { position: fixed; z-index: 10; inset: 0; display: flex; align-items: flex-end; justify-content: center; background: rgba(14, 30, 36, .45); }.modal { width: min(100%, 390px); max-height: 86vh; overflow: auto; padding: 20px 16px calc(16px + env(safe-area-inset-bottom)); border-radius: 18px 18px 0 0; background: white; }.modal h2 { margin: 0 0 15px; font-size: 17px; }.modal p { color: var(--muted); font-size: 13px; }.modal-actions { display: flex; justify-content: flex-end; gap: 9px; margin-top: 18px; }.modal-actions button { min-width: 76px; }.option { display: flex; align-items: center; gap: 10px; width: 100%; margin: 8px 0; padding: 13px; border: 1px solid var(--line); border-radius: 10px; background: white; text-align: left; }.option.active { border-color: var(--green); color: var(--green-dark); background: var(--green-soft); }.option i { font-style: normal; }.confirm-list { margin: 10px 0; padding: 11px; border-radius: 8px; color: #53616c; background: #f8faf9; font-size: 12px; }
.search-modal-mask { align-items: stretch; }.phone-shell > #modal-root .search-modal-mask { position: absolute; }.search-modal-mask .search-modal { position: fixed; top: 0; right: max(0px, calc(50% - 195px)); bottom: 0; width: min(86vw, 335px); max-height: none; padding-top: 22px; border-radius: 18px 0 0 18px; animation: searchDrawerIn .2s ease-out; }.phone-shell > #modal-root .search-modal-mask .search-modal { position: absolute; right: 0; width: min(86%, 335px); }.search-field { margin-bottom: 14px; }.search-field label, .search-status-field > label, .search-date-range > label { display: block; margin-bottom: 7px; color: #52606c; font-size: 12px; }.search-field .input { width: 100%; }.search-date-range { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }.search-date-range input { display: block; width: 100%; min-height: 38px; padding: 0 8px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: #f8faf9; font-size: 12px; outline: 0; }.search-status-field { margin-top: 15px; }.search-status-options { display: flex; flex-wrap: wrap; gap: 8px; }.search-status-option { min-width: 56px; min-height: 32px; padding: 0 11px; border: 1px solid #cdebdc; border-radius: 16px; color: var(--green-dark); background: #fff; font-size: 12px; }.search-status-option.active { border-color: var(--green); color: #fff; background: var(--green); }.search-modal-actions { justify-content: stretch; margin-top: 20px; }.search-modal-actions button { flex: 1; }.search-empty { margin: 24px 0; padding: 28px 12px; border-radius: 12px; color: var(--muted); background: #fff; text-align: center; font-size: 13px; }@keyframes searchDrawerIn { from { transform: translateX(100%); } to { transform: translateX(0); } }
.modal .submit-note { margin: 8px 0 12px; padding: 9px 10px; border-radius: 8px; color: #936900; background: #fff8e7; font-size: 12px; line-height: 1.55; }
.scrap-confirm-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }.scrap-confirm-grid button { min-height: 38px; border: 1px solid #dce3e5; border-radius: 6px; color: #3d474e; background: #fff; font-size: 13px; font-weight: 600; }.scrap-confirm-grid button.active { border-color: var(--green); color: #fff; background: var(--green); }.scrap-confirm-input { display: grid; grid-template-columns: 1fr 72px; gap: 8px; margin-top: 10px; }.scrap-confirm-input input { min-width: 0; height: 40px; padding: 0 10px; border: 0; border-radius: 8px; outline: 0; color: var(--ink); background: #f4f5f7; font-size: 12px; }.scrap-confirm-input button { min-height: 40px; }
.material-location { display: block; width: 100%; margin: 10px 0 0; padding: 0; border: 0; color: #687680; background: transparent; font-size: 12px; text-align: right; }
.putaway-location-row { display: flex; align-items: center; gap: 8px; margin-top: 10px; }.putaway-location-row .material-location { flex: 1; margin: 0; text-align: left; }.location-scan-btn { flex: 0 0 auto; min-height: 32px; padding: 0 9px; font-size: 11px; }
.location-choice-card { display: grid; gap: 10px; margin: 12px 0; padding: 14px; border-radius: 14px; background: #fff; box-shadow: var(--shadow); }.location-choice-card h3 { margin: 0; color: var(--ink); font-size: 15px; }.location-choice-card p { margin: 4px 0 0; color: var(--muted); font-size: 12px; }.location-choice-actions { display: flex; align-items: center; gap: 8px; }.location-choice-actions .material-location { flex: 1; margin: 0; padding: 9px 10px; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); background: #f8faf9; text-align: left; }.location-choice-actions .location-scan-btn { min-height: 36px; white-space: nowrap; }
.order-card[role="button"] { cursor: pointer; }
.detail-material { display: grid; width: 100%; gap: 8px; padding: 15px; border: 1px solid var(--line); border-radius: 12px; color: #53616c; background: #fff; text-align: left; font-size: 13px; }.detail-material strong { color: var(--ink); font-size: 15px; }.detail-material b { color: var(--green-dark); }
.tag-detail { margin: 9px 0; padding: 13px; border-radius: 10px; background: #f8faf9; }.tag-detail h3 { margin: 0 0 7px; font-size: 14px; }.tag-detail p { margin: 4px 0; color: #66747f; font-family: Consolas, monospace; font-size: 11px; }
.stocktake-operation-button { position: absolute; z-index: 1; top: 13px; right: 13px; min-height: 27px; padding: 0 9px; border: 1px solid #bfead7; border-radius: 7px; color: var(--green-dark); background: #fff; font-size: 11px; }.stocktake-operation-button + .order-card-link h3 { padding-right: 48px; }
.stocktake-operation-page { padding-bottom: 16px; background: #f3f3f3; }.selection-summary { display: flex; align-items: center; gap: 10px; margin: 0 -12px 12px; padding: 11px 16px; background: #fff; }.selection-summary .summary-icon { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; color: #fff; background: var(--green); font-size: 18px; }.selection-summary div { display: grid; gap: 2px; }.selection-summary span { color: #5d6871; font-size: 12px; }.selection-summary strong { color: var(--ink); font-size: 20px; }.selection-summary small { margin-left: auto; color: #7f8991; font-size: 11px; }.tag-selection-card { position: relative; display: grid; width: 100%; gap: 6px; margin-bottom: 10px; padding: 14px 42px 14px 14px; border: 1px solid transparent; border-radius: 13px; color: #61707c; background: #fff; box-shadow: 0 2px 8px rgba(38,54,61,.04); text-align: left; font-family: inherit; }.tag-selection-card strong { color: #45515b; font-size: 13px; }.tag-selection-card > span:not(.selection-dot) { font-size: 12px; }.selection-dot { position: absolute; top: 50%; right: 14px; width: 16px; height: 16px; border: 1px solid #d9dee1; border-radius: 50%; transform: translateY(-50%); }.tag-selection-card.selected { border-color: var(--green); }.tag-selection-card.selected .selection-dot, .select-all-bar.selected .selection-dot { border-color: var(--green); background: var(--green); }.tag-selection-card.selected .selection-dot::after, .select-all-bar.selected .selection-dot::after { content: "✓"; position: absolute; inset: 0; color: #fff; font-size: 11px; line-height: 15px; text-align: center; }.select-all-bar { position: fixed; z-index: 3; bottom: 0; left: 50%; display: flex; width: min(100%, 390px); min-height: 48px; align-items: center; gap: 8px; padding: 0 14px; border: 0; color: #4b5861; background: #fff; transform: translateX(-50%); font-size: 12px; text-align: left; }.select-all-bar .selection-dot { position: static; flex: 0 0 16px; transform: none; }.select-all-bar b { color: var(--green-dark); }.stocktake-scrap-content { padding-bottom: 58px; }.stocktake-operation-actions a { min-width: 76px; }
.rfid-swap-page { padding-bottom: 72px; background: #f3f3f3; }.rfid-swap-card { margin: 10px 0; padding: 14px; border-radius: 14px; background: #fff; }.rfid-swap-card h2 { margin: 0 0 10px; color: #26313a; font-size: 15px; }.rfid-swap-row { display: grid; grid-template-columns: 42px 1fr; gap: 8px; min-height: 48px; align-items: center; border-top: 1px solid #e7eaeb; color: #3e4952; font-size: 14px; }.rfid-swap-row span { font-weight: 700; }.rfid-swap-row b { word-break: break-all; font-size: 13px; }.rfid-swap-row .placeholder-value { color: #9ba3aa; font-weight: 500; }.material-source-card { padding-bottom: 0; }.rfid-trace { display: grid; grid-template-columns: 54px 1fr; gap: 8px; min-height: 90px; align-items: center; border-top: 1px solid #e7eaeb; color: #3e4952; font-size: 14px; }.rfid-trace span { font-weight: 700; }.rfid-trace b { color: #aeb4b9; font-size: 12px; line-height: 1.35; text-align: center; word-break: break-all; }.new-tag-card { overflow: hidden; padding: 0 14px 14px; }.new-tag-card h2 { margin: 0 -14px 10px; padding: 12px 14px; color: #fff; background: var(--green); }.swap-reason-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 12px 0; }.swap-reason-grid button { min-height: 38px; border: 1px solid #dce3e5; border-radius: 7px; color: #47535b; background: #fff; font-size: 13px; font-weight: 600; }.swap-reason-grid button.active { border-color: var(--green); color: #fff; background: var(--green); }.swap-note { display: grid; grid-template-columns: 42px 1fr; align-items: center; gap: 8px; min-height: 44px; border-top: 1px solid #e7eaeb; color: #4a555d; font-size: 13px; font-weight: 700; }.swap-note input { width: 100%; border: 0; outline: 0; color: var(--ink); background: transparent; font-size: 13px; }.swap-note input::placeholder { color: #a7afb5; }
.rfid-material-info h2, .rfid-material-attribute h2 { margin-bottom: 12px; font-size: 19px; }.rfid-material-info .key-value, .rfid-material-attribute .key-value { grid-template-columns: 76px 1fr; font-size: 13px; }.rfid-material-info .key-value b, .rfid-material-attribute .key-value b { color: var(--ink); }
.original-tag-card { overflow: hidden; padding: 0 14px 14px; }.original-tag-card h2 { margin: 0 -14px 10px; padding: 12px 14px; color: #fff; background: var(--green); font-size: 16px; }.original-tag-card h3 { margin: 16px 0 3px; color: #26313a; font-size: 18px; }.original-tag-card .key-value { grid-template-columns: 76px 1fr; font-size: 13px; }.original-tag-card .key-value b { color: var(--ink); }
.swap-management-scan { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; padding: 14px; border-radius: 14px; background: #fff; }.swap-management-scan strong { display: block; margin-bottom: 4px; color: var(--ink); font-size: 14px; }.swap-management-scan span { color: var(--muted); font-size: 12px; }.swap-management-scan .scan-chip { flex: 0 0 44px; width: 44px; height: 44px; }
.toast { position: fixed; z-index: 20; left: 50%; bottom: 82px; transform: translate(-50%, 15px); max-width: 82%; padding: 10px 14px; border-radius: 999px; color: white; background: rgba(31,41,51,.9); font-size: 13px; opacity: 0; pointer-events: none; transition: .22s; }.toast.show { transform: translate(-50%, 0); opacity: 1; }

@media (min-width: 391px) { .phone-shell { min-height: 844px; margin-top: 22px; border-radius: 28px; }.topbar { border-radius: 28px 28px 0 0; }.scan-footer { width: 390px; } }