/* RoomTagger: bold marketing framing, faithful light product preview. */
.main-nav > a { font-size: 15px; }
.eyebrow { font-size: 14px; }
.button { font-size: 18px; min-height: 56px; padding: 16px 22px; gap: 18px; }
.hero-bottom .hero-description { font-size: 20px; line-height: 1.6; }
.hero-bottom .hero-actions .text-link { font-size: 18px; min-height: 56px; }
.hero-bottom .hero-note { font-size: 14px; }
.mini-tag { font-size: 11px; }
.hero-scene-caption p, .hero-image-link { font-size: 14px; }
.illustration-badge { font-size: 11px; }
.feature-gateway { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; margin-top: 16px; padding-bottom: 34px; }
.gateway-card { background: #0c203e; color: white; border: 2px solid transparent; border-radius: 14px; padding: 24px; text-decoration: none; display: flex; flex-direction: column; min-height: 270px; transition: border-color .16s, transform .16s; }
.gateway-card:nth-child(2) { background: #123d4b; }
.gateway-card:nth-child(3) { background: #075d66; }
.gateway-card:nth-child(4) { background: #18334d; }
.gateway-card:hover { border-color: #90e4dd; transform: translateY(-3px); }
.gateway-card > .icon { width: 34px; height: 34px; color: #a2eee4; margin-bottom: 22px; }
.gateway-card > strong { font-size: 24px; line-height: 1.2; letter-spacing: -.025em; }
.gateway-card p { font-size: 20px; color: #e2edf0; margin-top: 12px; line-height: 1.45; }
.gateway-action { margin-top: auto; padding-top: 25px; font-size: 16px; font-weight: 650; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.gateway-action .icon { width: 20px; height: 20px; }
#workflow { padding-block: 64px 80px; border: 0; }
.feature-section-heading { max-width: 850px; margin-bottom: 34px; }
.feature-section-heading h2 { font-size: clamp(44px,4.6vw,64px); line-height: 1.06; }
.feature-section-heading > p:not(.eyebrow) { font-size: 20px; color: #40586b; line-height: 1.6; max-width: 770px; margin-top: 24px; }
.feature-bento { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; }
.benefit-card { border-radius: 20px; padding: 32px; min-width: 0; overflow: hidden; display: flex; flex-direction: column; }
.benefit-organize { background: #e1eee8; border: 1px solid #ccded3; }
.benefit-record { background: #f4e8d9; border: 1px solid #e7d5bd; }
.feature-category { display: block; color: #255d57; font-size: 13px; font-weight: 750; letter-spacing: .1em; margin-bottom: 18px; }
.benefit-copy h3 { font-size: clamp(28px,2.7vw,38px); line-height: 1.12; letter-spacing: -.035em; font-weight: 700; }
.benefit-copy > p { font-size: 20px; line-height: 1.6; color: #354e60; margin-top: 20px; max-width: 500px; }
.benefit-copy > .button, .benefit-actions { margin-top: 26px; }
.benefit-copy > .button { width: fit-content; }
.organize-visual { padding: 22px; background: #f8fbf8; border: 1px solid #bfcec6; border-radius: 12px; margin-top: 32px; box-shadow: 0 12px 24px #193c3010; }
.route-job { display: flex; align-items: center; gap: 10px; padding-bottom: 18px; border-bottom: 1px solid #d2dfd8; }
.route-job strong { font-size: 20px; }
.route-job > span { margin-left: auto; font-size: 11px; letter-spacing: .06em; border: 1px solid #a8c2b6; padding: 4px 6px; border-radius: 3px; }
.route-job .icon { color: #087b80; }
.route-rooms { display: flex; gap: 7px; flex-wrap: wrap; margin-top: 17px; }
.route-rooms span { padding: 8px 10px; border-radius: 5px; color: #415e59; background: #eaf0ec; font-size: 14px; }
.route-rooms .route-active { background: #087b80; color: white; }
.route-box { display: flex; align-items: center; gap: 12px; padding: 19px 0 14px; }
.route-box strong { font-size: 20px; }
.route-box p { font-size: 14px; color: #536c63; margin-top: 4px; }
.route-packed { margin-left: auto; background: #d8eee2; color: #26583d; border-radius: 20px; padding: 6px 10px; font-size: 13px; }
.route-contents { display: flex; gap: 7px; flex-wrap: wrap; }
.route-contents span { border: 1px solid #cedbd2; padding: 7px 9px; border-radius: 5px; color: #456457; font-size: 13px; background: white; }
.visual-caption { font-size: 13px; color: #536b62; line-height: 1.5; margin-top: 18px; }
.record-visual { background: white; border: 1px solid #dac7af; border-radius: 12px; margin-top: 32px; padding: 22px; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; box-shadow: 0 12px 24px #49351f0c; }
.record-art { background: #f5ede1; border-radius: 8px; display: flex; align-items: center; flex-direction: column; justify-content: center; padding: 8px; }
.record-art svg { width: 100%; max-width: 185px; height: auto; }
.record-art span { font-size: 12px; color: #6e5742; }
.record-facts { align-self: center; }
.record-kicker { display: block; font-size: 11px; color: #725d49; letter-spacing: .08em; margin-bottom: 9px; }
.record-facts strong { display: block; font-size: 24px; line-height: 1.2; }
.record-condition { display: inline-block; font-size: 14px; font-weight: 650; background: #f8e6c5; color: #70481d; border-radius: 20px; padding: 6px 10px; margin-top: 12px; }
.record-facts p { font-size: 16px; line-height: 1.5; color: #64574b; margin-top: 12px; }
.record-visual .visual-caption { grid-column: 1/-1; margin-top: 0; }
.benefit-handoff { grid-column: 1/-1; background: #075d66; display: grid; grid-template-columns: .9fr 1.1fr; gap: 35px; padding: 40px; align-items: center; color: white; }
.benefit-handoff .feature-category { color: #a6eee3; }
.benefit-handoff h3 { color: white; font-size: clamp(32px,3.1vw,44px); }
.benefit-handoff .benefit-copy > p { color: #e0f0f0; }
.benefit-actions { display: flex; flex-direction: column; gap: 12px; align-items: start; }
.button-light { background: white; color: #0c203e; border: 1px solid white; }
.button-light:hover { background: #e0f3ed; }
.button-outline-light { border: 1px solid #87c9c5; color: white; }
.button-outline-light:hover { background: #104c56; }
.handoff-visual { position: relative; min-height: 355px; min-width: 0; }
.handoff-report { position: absolute; top: 0; right: 0; width: 65%; max-width: 290px; background: #fff; color: #16354b; padding: 22px 20px; border-radius: 7px; transform: rotate(6deg); box-shadow: 0 12px 30px #00232935; }
.handoff-report > div { padding-bottom: 15px; border-bottom: 2px solid #d3e6df; }
.handoff-report strong { display: block; font-size: 23px; }
.handoff-report > div > span { display: block; font-size: 9px; letter-spacing: .08em; margin-top: 5px; color: #4f6b69; }
.handoff-report > p { font-size: 14px; font-weight: 600; margin: 15px 0 5px; }
.report-preview-line { display: flex; justify-content: space-between; gap: 8px; font-size: 13px; border-bottom: 1px solid #e2ebe6; padding-block: 9px; }
.report-preview-line b { font-weight: 500; }
.handoff-report > small { display: block; font-size: 11px; color: #5c7166; margin-top: 18px; }
.handoff-label { position: absolute; top: 110px; left: 0; width: 64%; max-width: 320px; aspect-ratio: 3/2; padding: 14px 16px; display: flex; flex-direction: column; background: white; color: #18231e; border: 2px solid #18362c; border-radius: 6px; transform: rotate(-5deg); box-shadow: 0 12px 28px #00232940; }
.handoff-brand { font-size: 22px; font-weight: 750; letter-spacing: -1px; border-bottom: 1px solid #b7c8bc; padding-bottom: 6px; }
.handoff-brand > span { color: #087b80; }
.handoff-label > div { display: flex; justify-content: space-between; gap: 10px; align-items: center; flex: 1; padding-block: 8px; }
.handoff-label strong { font-size: 19px; line-height: 1.1; }
.handoff-label p { font-size: 15px; line-height: 1.3; margin-top: 4px; }
.handoff-label div > span { font-size: 10px; display: block; margin-top: 7px; }
.handoff-label .sample-code { width: 64px; height: 64px; }
.handoff-label > small { font-size: 7px; text-align: center; border-top: 1px solid #bfd0c2; padding-top: 5px; }
.handoff-visual > .visual-caption { color: #e0f0f0; position: absolute; left: 0; bottom: 0; font-size: 14px; }

/* Strong marketing showcase, with the supplied light app layout preserved. */
#inside { background: #0b233e; padding-block: 72px 76px; }
#inside > .container { width: min(1440px,calc(100% - 48px)); }
#inside .section-intro { display: block; max-width: 1000px; margin-bottom: 30px; }
#inside .section-intro .eyebrow { color: #9ce6df; font-size: 14px; }
#inside .section-intro h2 { color: white; font-size: clamp(44px,4.6vw,64px); line-height: 1.07; }
#inside .section-intro > div > p:not(.eyebrow) { color: #e2edf2; max-width: 860px; font-size: 20px; line-height: 1.6; margin-top: 23px; }
#inside .section-intro > div > .demo-disclosure { color: #d5e9ed !important; font-size: 14px !important; margin-top: 18px; }
.showcase-view-tabs { display: flex; gap: 12px; margin-bottom: 24px; flex-wrap: wrap; }
.showcase-view-tabs button { min-height: 56px; padding: 15px 22px; border: 2px solid #668aa1; border-radius: 8px; font-size: 18px; font-weight: 650; color: #e4edf1; background: transparent; }
.showcase-view-tabs button[aria-selected="true"] { background: #a2eee4; border-color: #a2eee4; color: #102b43; }
.showcase-view-tabs button:hover { border-color: #a2eee4; }
.supplied-mockup { margin: 0; background: #fff; border-radius: 14px; padding: 14px; }
.supplied-mockup img { display: block; width: 100%; border-radius: 7px; }
.supplied-mockup figcaption { font-size: 16px; line-height: 1.6; color: #40576d; padding: 18px 10px 8px; }
.app-reference-frame { display: grid; grid-template-columns: 190px minmax(0,1fr); background: #eff5fb; border: 2px solid #6e9aa8; border-radius: 14px; overflow: hidden; box-shadow: 0 20px 50px #020f2638; }
.app-preview-banner { grid-column: 1/-1; display: flex; align-items: center; gap: 12px 20px; flex-wrap: wrap; background: #e0f1f1; padding: 13px 20px; color: #254a5b; border-bottom: 1px solid #b8d3dc; }
.app-preview-banner strong { font-size: 14px; }
.app-preview-banner > span { font-size: 14px; flex: 1; }
.app-preview-banner button { border: 1px solid #9dbec7; background: white; border-radius: 5px; padding: 8px 12px; font-size: 14px; font-weight: 600; min-height: 36px; }
.app-sidebar { background: white; border-right: 1px solid #d1dfe9; padding: 24px 12px; display: flex; flex-direction: column; }
.app-brand { display: flex; align-items: center; font-size: 24px; font-weight: 750; color: #0c203e; letter-spacing: -1.3px; }
.app-brand > span:first-child { color: #099ba4; }
.app-brand .brand-tag { width: 24px; flex-basis: 24px; }
.app-sidebar-caption { font-size: 11px; line-height: 1.5; color: #60758c; margin-top: 9px; }
.app-sidebar nav { display: grid; gap: 8px; margin-top: 28px; }
.app-sidebar nav > button, .app-sidebar nav > a { display: flex; align-items: center; gap: 10px; text-align: left; text-decoration: none; border: 0; border-radius: 6px; padding: 12px 8px; min-height: 49px; font-size: 14px; font-weight: 500; color: #16354f; background: transparent; line-height: 1.4; }
.app-sidebar nav > button:hover, .app-sidebar nav > a:hover { background: #eaf5f7; }
.app-sidebar nav .app-nav-active { background: #e3f4f5; border-left: 3px solid #087b80; padding-left: 5px; font-weight: 650; }
.app-sidebar nav .icon { width: 22px; height: 22px; }
.app-sidebar nav small { display: block; color: #5f7589; font-size: 11px; margin-top: 2px; }
.app-sidebar-status { margin-top: auto; padding-top: 35px; font-size: 13px; font-weight: 650; line-height: 1.6; color: #42617c; }
.app-sidebar-status > span { font-weight: 400; font-size: 12px; color: #5b7086; }
.app-main { padding: 22px; min-width: 0; }
.app-breadcrumb { font-size: 13px; color: #527089; line-height: 1.5; }
.app-breadcrumb span { color: #7c91a2; padding-inline: 8px; }
.app-breadcrumb strong { color: #1d3955; font-weight: 650; }
.app-local-status { background: #e3f4e9; color: #225d44; border-left: 3px solid #367e60; padding: 10px 12px; font-size: 14px; line-height: 1.5; margin-top: 13px; }
.app-room-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 20px; margin-bottom: 17px; }
.app-room-heading h3 { font-size: 34px; line-height: 1.15; font-weight: 700; letter-spacing: -.035em; }
.app-room-heading p { color: #56718a; font-size: 15px; margin-top: 6px; }
.app-project-actions { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; justify-content: end; }
.app-primary, .app-secondary, .app-add-room { display: inline-flex; justify-content: center; align-items: center; gap: 8px; padding: 11px 13px; border-radius: 6px; min-height: 42px; font-size: 14px; font-weight: 600; line-height: 1.35; }
.app-primary { border: 1px solid #087b80; background: #087b80; color: white; }
.app-primary:hover { background: #065f68; }
.app-secondary { border: 1px solid #c7d7e3; background: #f8fbfe; color: #213f5d; }
.app-secondary:hover { background: #e9f3fa; }
.app-primary small, .app-secondary small, .app-add-room small { font-size: 10px; font-weight: 500; }
.app-primary small { opacity: .95; }
.app-primary .icon, .app-secondary .icon { width: 17px; height: 17px; }
.app-room-line { display: flex; align-items: end; gap: 12px; border-bottom: 1px solid #cddde8; margin-bottom: 18px; flex-wrap: wrap; }
.app-room-line .tour-room-tabs { display: flex; gap: 6px; padding: 0; border: 0; flex: 1; flex-wrap: wrap; }
.app-room-line .tour-room-tabs button { min-height: 46px; padding: 11px 12px; border-bottom: 3px solid transparent; color: #4a6781; font-size: 16px; border-radius: 4px 4px 0 0; }
.app-room-line .tour-room-tabs button[aria-selected="true"] { border-color: #087b80; color: #086e78; font-weight: 700; background: #e3f3f6; }
.app-add-room { border: 1px dashed #92b9c5; color: #0a6877; background: #f4fcfd; margin-bottom: 6px; }
.app-reference-frame .tour-content { display: grid; grid-template-columns: 220px minmax(0,1fr) 300px; gap: 14px; min-height: 0; }
.app-reference-frame .tour-box-column, .app-reference-frame .tour-items-column, .app-reference-frame .tour-label-column { background: white; border: 1px solid #d6e2ed; border-radius: 8px; box-shadow: 0 3px 9px #1c3e6210; padding: 16px; min-width: 0; }
.app-reference-frame .tour-column-head { margin-bottom: 14px; }
.app-reference-frame .tour-column-head h4 { font-size: 16px; line-height: 1.4; }
.app-reference-frame .tour-column-head > span { font-size: 13px; color: #57728a; }
.app-reference-frame .demo-boxes { display: grid; gap: 10px; }
.app-reference-frame .demo-box-button { min-height: 80px; padding: 13px 9px; gap: 8px; border: 1px solid #d8e3ec; border-radius: 6px; }
.app-reference-frame .demo-box-button[aria-pressed="true"] { background: #eaf7fa; border-color: #59a8b5; box-shadow: inset 3px 0 #087b80; }
.app-reference-frame .demo-box-button strong { font-size: 14px; line-height: 1.4; }
.app-reference-frame .demo-box-button small { font-size: 12px; line-height: 1.4; color: #4e6a83; margin-top: 6px; }
.app-reference-frame .demo-box-button .box-art { width: 24px; flex-basis: 24px; }
.app-reference-frame .box-chevron { display: none; }
.box-row-status { display: inline-block; margin-left: auto; flex-shrink: 0; font-size: 11px; color: #79504e; background: #f9e6e2; padding: 4px 7px; border-radius: 20px; }
.box-row-status.is-open { color: #226452; background: #dbf1e6; }
.app-reference-frame .tour-column-note { display: block; font-size: 13px; margin-top: 16px; color: #59738a; }
.app-reference-frame .tour-items-heading { margin-bottom: 12px; align-items: start; }
.app-reference-frame .tour-items-heading h4 { font-size: 24px; margin: 0; line-height: 1.25; }
.app-reference-frame .tour-items-heading .tiny-label { font-size: 13px; color: #57728a; letter-spacing: 0; margin-top: 5px; }
.app-reference-frame .badge { font-size: 12px; padding: 5px 8px; }
.app-reference-frame .badge { background: #fae3df; color: #8a4c46; }
.app-reference-frame .badge-open { background: #dff2e7; color: #285f49; }
.demo-item-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.app-table-caption { font-size: 12px; color: #57728a; margin-top: 14px; margin-bottom: 8px; line-height: 1.5; }
.demo-table-wrap { border: 1px solid #d2dfeb; border-radius: 6px; overflow: hidden; }
.demo-inventory-table { width: 100%; border-collapse: collapse; font-size: 15px; color: #1c3652; table-layout: fixed; }
.demo-inventory-table th { background: #eaf0f7; font-size: 13px; font-weight: 650; text-align: left; padding: 10px 8px; }
.demo-inventory-table th:nth-child(2) { width: 38px; text-align: center; }
.demo-inventory-table th:nth-child(3) { width: 85px; }
.demo-inventory-table td { padding: 9px 7px; border-top: 1px solid #e0e8f0; vertical-align: middle; overflow-wrap: anywhere; }
#demo-item-list .demo-item { display: table-row; padding: 0; border: 0; font-size: 15px; }
#demo-item-list .demo-item.selected { background: #edf8fb; }
.item-open { display: flex; gap: 9px; align-items: center; background: none; border: 0; padding: 2px 0; width: 100%; text-align: left; font-size: 15px; line-height: 1.45; min-height: 52px; border-radius: 4px; }
.item-title { min-width: 0; overflow-wrap: anywhere; }
.demo-thumb { display: inline-block; width: 48px; height: 48px; border-radius: 5px; flex: 0 0 48px; overflow: hidden; background-color: #edf3f6; }
.demo-thumb svg { display: block; width: 100%; height: 100%; }
.demo-thumb-empty { display: flex; align-items: center; justify-content: center; flex-direction: column; color: #607a90; background: #f0f5f8; border: 1px dashed #b7cbd9; gap: 3px; }
.demo-thumb-empty svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.demo-thumb-empty small { font-size: 8px; }
.demo-thumb[class*="thumb-ref-"] { background-image: url('assets/item-reference-sheet.jpeg'); background-size: 1316.571px 658.286px; background-repeat: no-repeat; }
.thumb-ref-lamp { background-position: -538.286px -284.571px; }
.thumb-ref-frame { background-position: -538.286px -341.143px; }
.thumb-ref-vase { background-position: -538.286px -397.714px; }
.thumb-ref-books { background-position: -538.286px -454.286px; }
.demo-inventory-table .item-quantity { text-align: center; font-size: 15px; color: #284d68; }
.demo-inventory-table .item-condition { display: inline-block; font-size: 11px; padding: 5px 7px; background: #e0f2e9; color: #245e46; border-radius: 20px; line-height: 1.5; }
.demo-inventory-table .item-condition.noted { color: #814941; background: #fae2dc; }
.demo-inventory-table th:nth-child(3) { width: 112px; }
.row-condition { display: flex; align-items: center; justify-content: space-between; gap: 5px; width: 100%; min-width: 0; border: 1px solid #bbd6cf; border-radius: 16px; padding: 7px 9px; font: inherit; font-size: 12px; font-weight: 600; color: #245e46; background: #e0f2e9; min-height: 34px; }
.row-condition.condition-scratched { color: #814941; background: #fae2dc; border-color: #e9c5bd; }
.row-condition.condition-dented { color: #765a1f; background: #fff0cf; border-color: #e4d3a6; }
.row-condition.condition-other { color: #3e5076; background: #e4eaf8; border-color: #c6d2e9; }
.row-condition > span:first-child { min-width: 0; overflow-wrap: anywhere; text-align: left; }
.item-condition-cell input { display: block; width: 100%; min-width: 0; padding: 7px; border: 1px solid #b9cddd; border-radius: 4px; font: inherit; font-size: 12px; color: #264b67; margin-top: 6px; }
.row-condition-save { display: block; width: 100%; border: 1px solid #aac7d1; border-radius: 4px; background: #f2f8fb; color: #1f5568; padding: 7px 5px; margin-top: 6px; font-size: 11px; font-weight: 600; }
.row-custom-label { display: block; font-size: 11px; color: #4a607a; margin-top: 6px; overflow-wrap: anywhere; }
.demo-thumb { object-fit: cover; }
.demo-empty { font-size: 16px; line-height: 1.6; color: #56718a; padding: 22px 12px; text-align: center; }
.app-reference-frame .demo-packing-note { display: block; margin-top: 20px; padding: 0; background: none; }
.demo-packing-note label { display: block; font-size: 14px; color: #234360; font-weight: 600; margin-bottom: 7px; }
.demo-packing-note textarea { width: 100%; border: 1px solid #c7d7e5; border-radius: 5px; padding: 10px; background: #f8faff; color: #375770; font: inherit; font-size: 14px; line-height: 1.5; resize: vertical; }
.demo-packing-note button { margin-top: 9px; }
.app-reference-frame .demo-attribution { color: #526e86; font-size: 12px; margin-top: 13px; }
.demo-item-details { border-top: 1px solid #d7e3ee; margin-top: 19px; padding-top: 18px; }
.demo-item-details-disclosure { border-top: 1px solid #d7e3ee; margin-top: 16px; }
.demo-item-details-disclosure > summary { color: #146977; cursor: pointer; font-size: 14px; font-weight: 650; padding-block: 15px; line-height: 1.4; }
.demo-item-details-disclosure .demo-item-details { margin-top: 0; padding-top: 4px; border: 0; }
.demo-item-details h5 { margin: 0 0 13px; color: #234360; font-size: 16px; line-height: 1.4; }
.demo-detail-fields { display: grid; grid-template-columns: 1fr 1.3fr; gap: 12px; }
.demo-item-details label, #demo-editor-fields label { display: block; color: #234360; font-size: 14px; font-weight: 600; line-height: 1.5; margin-bottom: 12px; }
.demo-item-details input, .demo-item-details select, .demo-item-details textarea, #demo-editor-fields input, #demo-editor-fields select { display: block; font: inherit; font-size: 16px; font-weight: 400; width: 100%; min-width: 0; padding: 10px; border: 1px solid #b9ccdb; border-radius: 5px; color: #173650; background: white; margin-top: 6px; }
.demo-item-details textarea { resize: vertical; }
.demo-edit-caption { font-size: 12px; color: #5d7588; margin-top: 10px; }
.app-reference-frame .tour-label-column { display: block; }
.tour-label-column > h4 { font-size: 19px; line-height: 1.3; color: #0c203e; margin-bottom: 6px; }
.app-label-stock { color: #526e86; font-size: 12px; line-height: 1.5; }
.app-reference-frame .demo-small-label { aspect-ratio: 3/2; border: 2px solid #0c203e; padding: 8px; display: flex; flex-direction: column; text-align: center; border-radius: 5px; margin-top: 13px; color: #151d24; background: white; }
.app-label-brand { display: flex; align-items: center; justify-content: center; font-size: 20px; font-weight: 750; letter-spacing: -1.1px; line-height: 1.05; }
.app-label-brand > span:first-child { color: #087b80; }
.app-label-brand .brand-tag { width: 23px; height: 23px; }
.app-label-brand .brand-tag img { width: 39px; height: 39px; left: -7px; top: -8px; }
.app-label-job { font-size: 7px; letter-spacing: .14em; line-height: 1.3; margin-top: 2px; padding-bottom: 5px; border-bottom: 1px solid #8da69d; }
.app-reference-frame .demo-small-label .app-label-job { font-size: 7px; margin-top: 1px; padding-bottom: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.demo-small-label h5 { font-size: 20px; font-weight: 800; line-height: 1.1; letter-spacing: -.03em; margin: 5px 0 0; color: #141c23; }
.demo-small-label #label-box { font-size: 14px; line-height: 1.15; font-weight: 700; margin: 3px 0 0; }
.app-label-bottom { display: flex; align-items: center; justify-content: center; gap: 15px; flex: 1; padding-block: 5px; }
.app-reference-frame .demo-small-label .sample-code { width: 48px; height: 48px; }
.app-label-bottom > div { min-width: 0; border-left: 1px solid #9fb5ac; padding-left: 12px; }
.app-label-bottom strong { font-size: 10px; font-weight: 750; display: block; line-height: 1.1; padding-bottom: 6px; border-bottom: 1px solid #9fb5ac; }
.app-label-bottom b { display: block; font-size: 11px; font-weight: 700; line-height: 1.15; margin-top: 6px; }
.app-reference-frame .demo-small-label > small { border: 0; padding: 0; margin: 0; font-size: 5px; line-height: 1.2; color: #394e46; }
.app-label-action { width: 100%; margin-top: 10px; }
.app-label-limit { font-size: 12px; line-height: 1.6; color: #536f85; margin-top: 13px; }
.app-more-link { display: flex; align-items: center; gap: 8px; color: #086d79; font-size: 13px; font-weight: 650; line-height: 1.5; margin-top: 16px; text-decoration: none; }
.app-more-link:hover { text-decoration: underline; }
.app-more-link .icon { width: 17px; height: 17px; }
.app-reference-frame .tour-footer { grid-column: 1/-1; padding: 14px 20px; color: #4e6e82; font-size: 13px; line-height: 1.5; gap: 12px; }
.detail-features { gap: 18px; margin-top: 28px; }
.detail-features article { background: #173951; border: 1px solid #40657a; border-radius: 12px; padding: 25px; }
.detail-features .feature-icon { color: #a2eee4; }
.detail-features .feature-icon .icon { width: 32px; height: 32px; }
.detail-features h3 { font-size: 24px; color: white; }
.detail-features p { font-size: 20px; color: #deebf0; line-height: 1.55; }
.noscript-note { font-size: 18px; }

/* Readable supporting sections and substantial controls. */
.outputs-section { padding-block: 80px; gap: 56px; }
.output-copy h2, .team-copy h2, .faq-section h2, .preview-status-card h2 { font-size: clamp(38px,4vw,56px); line-height: 1.1; }
.output-copy > p:not(.eyebrow):not(.output-caveat), .team-copy > p:not(.eyebrow), .faq-section > div:first-child > p:not(.eyebrow), .preview-status-card p:not(.eyebrow) { font-size: 20px; line-height: 1.6; max-width: 540px; }
.output-options { gap: 12px; }
.output-option { border: 2px solid #d1dfd6; padding: 22px 18px; gap: 16px; background: white; min-height: 90px; }
.output-option[aria-selected="true"] { border-color: #087b80; background: #e0f1ec; box-shadow: inset 4px 0 #087b80; }
.output-option strong { font-size: 20px; }
.output-option small { font-size: 15px; line-height: 1.5; }
.output-copy > .output-caveat { font-size: 14px !important; max-width: 500px !important; }
.output-stage { background: #dcebe4; padding: 30px; border: 1px solid #bdd3c7; }
.output-stage-top { font-size: 13px; gap: 12px; flex-wrap: wrap; }
.output-stage-note { font-size: 16px; }
.output-stage-note span { font-size: 14px; }
.thermal-brand { font-size: 32px; }
.thermal-job { font-size: 10px; }
.thermal-main h3 { font-size: 30px; }
.thermal-main p { font-size: 23px; }
.thermal-main div > span { font-size: 14px; }
.thermal-main small { font-size: 11px; }
.thermal-main .sample-code { width: 100px; height: 100px; }
.thermal-bottom { font-size: 7px; }
.dimension-line { font-size: 13px; }
.report-paper { padding: 28px 24px 20px; }
.report-brand { font-size: 24px; }
.report-heading > span:last-child { font-size: 11px; }
.report-paper .tiny-label { font-size: 11px; }
.report-paper h3 { font-size: 26px; }
.report-meta { font-size: 13px; gap: 12px; }
.report-row { font-size: 14px; padding: 12px 4px; grid-template-columns: 1fr 30px 72px; }
.report-row-head { font-size: 12px; }
.report-notes { font-size: 13px; }
.report-bottom { font-size: 9px; }
.team-section { padding-block: 72px; }
.team-grid { gap: 60px; }
.team-copy > p:not(.eyebrow) { color: #dfebf0; }
.light-link { font-size: 18px; min-height: 50px; border: 1px solid #5b8297; border-radius: 6px; padding: 13px 17px; margin-top: 24px; }
.team-workspace { padding: 23px; flex-wrap: wrap; }
.team-workspace small { font-size: 12px; }
.team-workspace strong { font-size: 20px; }
.planned-badge { font-size: 11px; }
.team-people strong { font-size: 16px; }
.team-people small { font-size: 13px; }
.avatar { width: 44px; height: 44px; font-size: 16px; }
.team-diagram > p { font-size: 14px; color: #c9dce4; }
.faq-section { padding-block: 80px; gap: 55px; }
.faq-list summary { font-size: 20px; padding-block: 23px; }
.faq-list details > div { font-size: 20px; line-height: 1.6; }
.preview-status-card { padding: 42px; }
.preview-next > p { font-size: 14px !important; }
.coming-soon { font-size: 18px; padding: 18px 24px; }
.preview-next .text-link { font-size: 16px; min-height: 44px; }
.footer-right > a { font-size: 15px; min-height: 30px; }
.site-footer p, .footer-right > span { font-size: 13px; }
.footer-right small { font-size: 12px; }

dialog { border: 1px solid #7b9aac; border-radius: 14px; width: min(560px,calc(100% - 32px)); max-height: calc(100vh - 48px); overflow-y: auto; padding: 28px; color: #173650; background: white; box-shadow: 0 25px 100px #00172e50; }
dialog::backdrop { background: #00162eb0; }
.demo-dialog-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 18px; }
.demo-dialog-badge { color: #08717a; font-size: 12px; font-weight: 700; letter-spacing: .08em; }
.demo-dialog-heading button { background: #eef4f8; color: #20465f; border: 1px solid #d1dfe8; border-radius: 5px; width: 42px; height: 42px; font-size: 25px; }
dialog h2 { font-size: 32px; line-height: 1.15; }
#demo-action-description { font-size: 18px; line-height: 1.6; color: #435e74; margin-top: 22px; margin-bottom: 26px; }
.demo-editor-caption { font-size: 15px; line-height: 1.6; color: #557185; margin-top: 14px; margin-bottom: 22px; }
#demo-editor-fields { display: grid; gap: 8px; }
#demo-editor-error { color: #a03d35; font-size: 15px; }
#demo-condition-dialog { width: min(340px,calc(100% - 32px)); margin: 0; padding: 22px; position: fixed; }
#demo-condition-dialog::backdrop { background: #00162e1a; }
#demo-condition-dialog h2 { font-size: 22px; }
.demo-condition-options { border: 0; margin: 18px 0 0; padding: 0; display: grid; gap: 9px; }
.demo-condition-options label { display: flex; align-items: center; gap: 10px; border: 1px solid #d0e0ea; border-radius: 6px; padding: 9px 12px; min-height: 44px; font-size: 15px; color: #274b66; }
.demo-condition-options input { width: 17px; height: 17px; accent-color: #087b80; }
.demo-condition-options span { padding: 4px 10px; border-radius: 20px; }
.condition-option-good { background: #e0f2e9; color: #245e46; }
.condition-option-scratched { background: #fae2dc; color: #814941; }
.condition-option-dented { background: #fff0cf; color: #765a1f; }
.condition-option-other { background: #e4eaf8; color: #3e5076; }
.demo-condition-custom-label { display: block; font-size: 14px; font-weight: 600; line-height: 1.5; color: #24475f; margin-top: 18px; }
.demo-condition-custom-label textarea { display: block; width: 100%; font: inherit; font-size: 16px; font-weight: 400; padding: 10px; border: 1px solid #a8c2d3; border-radius: 5px; margin-top: 7px; resize: vertical; }
.demo-editor-actions { display: flex; justify-content: end; gap: 10px; margin-top: 22px; }
.demo-editor-actions button { min-height: 48px; font-size: 16px; }
.app-primary, .app-secondary, .app-add-room { font-size: 16px; min-height: 44px; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible { outline: 3px solid #087b80; outline-offset: 4px; }
#inside > .container > .showcase-view-tabs button:focus-visible, .gateway-card:focus-visible { outline-color: #a2eee4; }

@media (max-width: 1200px) {
  .feature-gateway { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .gateway-card { min-height: 245px; }
  .gateway-card p { max-width: 380px; }
  .gateway-card > strong { font-size: 28px; }
  .app-reference-frame { grid-template-columns: 152px minmax(0,1fr); }
  .app-brand { font-size: 21px; }
  .app-brand .brand-tag { display: none; }
  .app-sidebar nav > button, .app-sidebar nav > a { font-size: 13px; padding-inline: 7px; gap: 8px; }
  .app-main { padding: 18px; }
  .app-reference-frame .tour-content { grid-template-columns: 185px minmax(0,1fr); }
  .app-reference-frame .tour-label-column { grid-column: 1/-1; display: grid; grid-template-columns: minmax(220px,300px) minmax(0,1fr); gap: 0 25px; align-items: start; }
  .tour-label-column > h4, .app-label-stock { grid-column: 1; }
  .app-reference-frame .demo-small-label { grid-column: 1; grid-row: 3/9; }
  .app-label-action, .app-label-limit, .app-more-link { grid-column: 2; }
  .app-label-action:first-of-type { grid-row: 1/3; align-self: end; }
  .app-label-action:nth-of-type(2) { grid-row: 3; }
  .app-label-limit { grid-row: 4; }
  .app-more-link { grid-row: 5; }
  .handoff-label { width: 70%; }
}
@media (max-width: 950px) {
  .feature-bento { grid-template-columns: 1fr; }
  .benefit-card:not(.benefit-handoff) { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; align-items: center; }
  .benefit-card:not(.benefit-handoff) .organize-visual, .benefit-card:not(.benefit-handoff) .record-visual { margin-top: 0; }
  .benefit-copy h3 { font-size: 32px; }
  .benefit-copy > p { font-size: 20px; }
  .benefit-copy .button { font-size: 16px; gap: 12px; }
  .organize-visual { padding: 17px; }
  .record-visual { grid-template-columns: 1fr; padding: 17px; }
  .record-art { min-height: 130px; }
  .record-art svg { max-width: 130px; }
  .record-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 5px 12px; }
  .record-facts strong { font-size: 22px; grid-column: 1/-1; }
  .record-kicker { grid-column: 1/-1; }
  .record-condition { align-self: start; margin-top: 3px; width: fit-content; }
  .record-facts p { margin-top: 2px; font-size: 14px; }
  .benefit-handoff { padding: 32px; }
  .handoff-visual { min-height: 345px; }
  .handoff-label { width: 88%; }
  .handoff-report { width: 85%; }
  .detail-features { grid-template-columns: 1fr; }
  .detail-features article { display: grid; grid-template-columns: 40px 1fr; gap: 4px 18px; }
  .detail-features .feature-icon { grid-row: 1/3; margin-top: 3px; }
  .detail-features h3 { margin-bottom: 5px; }
  .detail-features p { max-width: 760px; }
  .outputs-section { grid-template-columns: 1fr; gap: 32px; }
  .output-copy > p:not(.eyebrow):not(.output-caveat) { max-width: 760px; }
  .output-stage { width: min(620px,100%); justify-self: center; }
  .team-grid { grid-template-columns: 1fr; gap: 32px; }
  .team-copy > p:not(.eyebrow) { max-width: 740px; }
  .team-diagram { max-width: 600px; }
  .faq-section { grid-template-columns: 1fr; gap: 30px; }
  .preview-status-card { grid-template-columns: 1fr; }
  .preview-next { justify-self: start; text-align: left; }
}
@media (max-width: 760px) {
  .app-reference-frame { grid-template-columns: minmax(0,1fr); }
  .app-sidebar { border-right: 0; border-bottom: 1px solid #d2e0ec; padding: 18px; }
  .app-brand { font-size: 24px; }
  .app-brand .brand-tag { display: block; }
  .app-sidebar-caption { display: none; }
  .app-sidebar nav { margin-top: 14px; display: flex; flex-wrap: wrap; gap: 7px; }
  .app-sidebar nav > button, .app-sidebar nav > a { border: 1px solid #d2e0e9; font-size: 14px; min-height: 45px; padding: 9px 10px; }
  .app-sidebar nav small { font-size: 10px; }
  .app-sidebar-status { display: none; }
  .app-main { padding: 17px; }
  .app-room-heading { align-items: start; flex-direction: column; gap: 15px; }
  .app-project-actions { justify-content: start; }
  .app-reference-frame .tour-content { grid-template-columns: minmax(0,1fr); }
  .app-reference-frame .tour-box-column { border-bottom: 1px solid #d6e2ed; }
  .app-reference-frame .demo-boxes { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-reference-frame .tour-column-note { margin-top: 12px; }
  .app-reference-frame .tour-label-column { display: block; grid-column: auto; }
  .app-reference-frame .demo-small-label { max-width: 340px; margin-inline: auto; }
  .app-reference-frame .demo-small-label .sample-code { width: 65px; height: 65px; }
  .demo-small-label h5 { font-size: 25px; margin-top: 8px; }
  .app-label-brand { font-size: 25px; }
  .app-label-job { font-size: 9px; }
  .app-label-bottom strong { font-size: 14px; }
  .app-label-bottom b { font-size: 15px; }
  .app-reference-frame .demo-small-label > small { font-size: 7px; }
  .app-label-limit { font-size: 14px; }
  .app-more-link { font-size: 15px; min-height: 44px; }
  .app-reference-frame .tour-footer { flex-direction: column; align-items: start; }
}
@media (max-width: 680px) {
  .main-nav > a { font-size: 18px; }
  .hero-bottom .hero-description { font-size: 18px; }
  .hero-bottom .hero-actions { gap: 12px; }
  .hero-bottom .hero-actions .text-link { font-size: 16px; }
  .hero-bottom .hero-note { font-size: 13px; }
  .hero-scene-caption p, .hero-image-link { font-size: 13px; }
  .hero-scene-caption p { flex-basis: 100%; }
  .feature-gateway { gap: 12px; padding-bottom: 16px; }
  .gateway-card { padding: 20px; min-height: 250px; }
  .gateway-card > .icon { width: 30px; height: 30px; margin-bottom: 18px; }
  .gateway-card > strong { font-size: 24px; }
  .gateway-card p { font-size: 18px; }
  .gateway-action { font-size: 16px; padding-top: 22px; }
  #workflow { padding-block: 48px 56px; }
  .feature-section-heading { margin-bottom: 27px; }
  .feature-section-heading h2 { font-size: 42px; }
  .feature-section-heading > p:not(.eyebrow) { font-size: 18px; margin-top: 20px; }
  .benefit-card { padding: 24px; border-radius: 14px; }
  .benefit-card:not(.benefit-handoff) { display: flex; gap: 0; }
  .feature-category { font-size: 12px; margin-bottom: 16px; }
  .benefit-copy h3, .benefit-handoff h3 { font-size: 32px; }
  .benefit-copy > p { font-size: 18px; margin-top: 18px; }
  .benefit-copy .button { font-size: 16px; min-height: 54px; padding: 15px 17px; }
  .benefit-card:not(.benefit-handoff) .organize-visual, .benefit-card:not(.benefit-handoff) .record-visual { margin-top: 27px; }
  .record-visual { grid-template-columns: 1fr 1fr; gap: 14px; }
  .record-facts { display: block; }
  .record-facts strong { font-size: 21px; }
  .record-facts p { font-size: 15px; margin-top: 10px; }
  .record-art svg { max-width: 150px; }
  .record-kicker { font-size: 10px; }
  .record-condition { font-size: 13px; margin-top: 11px; }
  .route-job strong, .route-box strong { font-size: 18px; }
  .route-job > span { font-size: 10px; }
  .route-packed { font-size: 11px; padding: 5px 7px; }
  .route-box { flex-wrap: wrap; }
  .benefit-handoff { grid-template-columns: 1fr; gap: 30px; }
  .handoff-visual { min-height: 350px; }
  .handoff-report { width: 74%; max-width: 270px; }
  .handoff-label { width: 83%; max-width: 320px; }
  .handoff-visual > .visual-caption { font-size: 13px; }
  #inside { padding-block: 52px 54px; }
  #inside > .container { width: calc(100% - 24px); }
  #inside .section-intro { padding-inline: 8px; margin-bottom: 24px; }
  #inside .section-intro h2 { font-size: 40px; }
  #inside .section-intro > div > p:not(.eyebrow) { font-size: 18px; margin-top: 20px; }
  #inside .section-intro > div > .demo-disclosure { font-size: 14px !important; }
  .showcase-view-tabs { gap: 10px; }
  .showcase-view-tabs button { font-size: 16px; min-height: 52px; padding: 14px 16px; flex: 1 1 100%; }
  .supplied-mockup { padding: 8px; }
  .supplied-mockup figcaption { font-size: 14px; padding-inline: 6px; }
  .app-preview-banner { padding: 13px; gap: 9px; }
  .app-preview-banner strong { font-size: 14px; }
  .app-preview-banner > span { font-size: 13px; flex-basis: 100%; }
  .app-sidebar { padding: 15px; }
  .app-main { padding: 14px; }
  .app-breadcrumb { font-size: 12px; }
  .app-breadcrumb span { padding-inline: 4px; }
  .app-room-heading h3 { font-size: 30px; }
  .app-room-heading p { font-size: 14px; }
  .app-reference-frame .tour-box-column, .app-reference-frame .tour-items-column, .app-reference-frame .tour-label-column { padding: 15px; }
  .app-room-line .tour-room-tabs button { font-size: 14px; padding-inline: 8px; }
  .app-primary, .app-secondary, .app-add-room { font-size: 16px; min-height: 44px; }
  .app-reference-frame .tour-items-heading h4 { font-size: 24px; }
  .app-reference-frame .tour-items-heading .tiny-label { font-size: 12px; }
  .app-reference-frame .demo-attribution { font-size: 12px; }
  .detail-features article { padding: 23px 20px; grid-template-columns: 30px 1fr; gap: 4px 14px; }
  .detail-features h3 { font-size: 23px; }
  .detail-features p { font-size: 18px; }
  .detail-features .feature-icon .icon { width: 28px; height: 28px; }
  .outputs-section { padding-block: 56px; gap: 28px; }
  .output-copy h2, .team-copy h2, .faq-section h2, .preview-status-card h2 { font-size: 38px; }
  .output-copy > p:not(.eyebrow):not(.output-caveat), .team-copy > p:not(.eyebrow), .faq-section > div:first-child > p:not(.eyebrow), .preview-status-card p:not(.eyebrow) { font-size: 18px; }
  .output-option { padding: 19px 14px; min-height: 88px; }
  .output-option strong { font-size: 18px; }
  .output-option small { font-size: 14px; }
  .output-option-icon { width: 25px; }
  .output-copy > .output-caveat { font-size: 14px !important; }
  .output-stage { padding: 23px; }
  .output-stage-top { font-size: 12px; }
  .thermal-label { padding: 11px 13px 8px; }
  .thermal-brand { font-size: 22px; }
  .thermal-job { font-size: 8px; }
  .thermal-main h3 { font-size: 19px; }
  .thermal-main p { font-size: 15px; }
  .thermal-main div > span { font-size: 9px; }
  .thermal-main small { font-size: 7px; }
  .thermal-main .sample-code { width: 58px; height: 58px; }
  .thermal-bottom { font-size: 5px; }
  .output-stage-note { font-size: 14px; }
  .output-stage-note span { font-size: 13px; }
  .report-paper { padding: 23px 17px 17px; }
  .report-paper h3 { font-size: 23px; }
  .report-brand { font-size: 21px; }
  .report-heading > span:last-child { font-size: 9px; }
  .report-meta { font-size: 12px; }
  .report-row { font-size: 12px; grid-template-columns: 1fr 22px 60px; gap: 6px; }
  .report-row-head { font-size: 11px; }
  .report-notes { font-size: 12px; }
  .report-bottom { font-size: 8px; }
  .team-section { padding-block: 55px; }
  .team-workspace { padding: 20px; }
  .team-workspace strong { font-size: 19px; }
  .team-workspace small { font-size: 11px; }
  .team-diagram > p { font-size: 14px; }
  .light-link { font-size: 16px; }
  .faq-section { padding-block: 55px; }
  .faq-list summary, .faq-list details > div { font-size: 18px; }
  .preview-status-card { padding: 28px 23px; }
  .preview-next { justify-self: stretch; }
  .coming-soon { font-size: 18px; }
  .preview-next .text-link { font-size: 16px; }
  .footer-right > a { font-size: 15px; }
}
@media (max-width: 500px) {
  .feature-gateway { grid-template-columns: 1fr; }
  .gateway-card { display: grid; grid-template-columns: 34px minmax(0,1fr); gap: 8px 16px; min-height: 0; padding: 23px; }
  .gateway-card > .icon { grid-column: 1; grid-row: 1/3; margin: 3px 0 0; }
  .gateway-card > strong, .gateway-card p, .gateway-action { grid-column: 2; }
  .gateway-card p { margin: 0; }
  .gateway-action { padding-top: 12px; margin: 0; }
  .benefit-card { padding: 23px; }
  .benefit-copy .button { width: 100%; justify-content: space-between; }
  .benefit-actions { align-items: stretch; }
  .benefit-actions .button-outline-light { justify-content: center; }
  .organize-visual { padding: 17px; }
  .route-box { gap: 8px; }
  .route-box .box-art { flex-basis: 24px; width: 24px; }
  .route-box strong { font-size: 17px; }
  .route-box p { font-size: 12px; }
  .route-packed { margin-left: 0; }
  .route-rooms span, .route-contents span { font-size: 12px; padding: 7px; }
  .record-visual { grid-template-columns: 1fr; }
  .record-art { min-height: 145px; }
  .record-art svg { max-width: 170px; }
  .record-facts p br { display: none; }
  .record-facts strong { font-size: 24px; }
  .record-facts p { font-size: 16px; }
  .handoff-visual { min-height: 330px; }
  .handoff-report { padding: 18px 15px; width: 82%; }
  .handoff-report strong { font-size: 21px; }
  .handoff-label { width: 91%; padding: 10px 11px; top: 120px; }
  .handoff-brand { font-size: 20px; padding-bottom: 4px; }
  .handoff-label strong { font-size: 16px; }
  .handoff-label p { font-size: 13px; }
  .handoff-label .sample-code { width: 47px; height: 47px; }
  .handoff-label div > span { font-size: 8px; margin-top: 5px; }
  .handoff-label > small { font-size: 5px; padding-top: 4px; }
  .app-sidebar nav { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-sidebar nav > :last-child { grid-column: 1/-1; }
  .app-sidebar nav > button, .app-sidebar nav > a { font-size: 12px; gap: 7px; }
  .app-sidebar nav .icon { width: 18px; height: 18px; }
  .app-reference-frame .demo-boxes { grid-template-columns: 1fr; }
  .app-reference-frame .demo-box-button { min-height: 77px; gap: 12px; }
  .app-reference-frame .demo-box-button strong { font-size: 16px; }
  .app-reference-frame .demo-box-button small { font-size: 13px; }
  .box-row-status { font-size: 12px; }
  .demo-inventory-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
  .demo-inventory-table tbody { display: block; }
  #demo-item-list .demo-item { display: grid; grid-template-columns: 70px 1fr; gap: 8px; padding: 12px 9px; border-top: 1px solid #dce7ef; }
  .demo-inventory-table td { border: 0; padding: 0; }
  .demo-inventory-table td:first-child { grid-column: 1/-1; }
  .item-open { font-size: 16px; gap: 11px; }
  .demo-inventory-table .item-quantity { text-align: left; font-size: 14px; }
  .demo-inventory-table .item-quantity::before { content: "Qty: "; color: #56738a; }
  .demo-inventory-table .item-condition { font-size: 12px; }
  .row-condition { min-height: 44px; font-size: 13px; }
  .demo-inventory-table td:last-child { justify-self: end; }
  .app-reference-frame .demo-small-label .sample-code { width: 50px; height: 50px; }
  .app-label-brand { font-size: 21px; }
  .app-label-job { font-size: 7px; }
  .demo-small-label h5 { font-size: 21px; margin-top: 4px; }
  .app-reference-frame .demo-small-label #label-box { font-size: 14px; }
  .app-label-bottom { gap: 11px; padding-block: 4px; }
  .app-label-bottom strong { font-size: 10px; }
  .app-label-bottom b { font-size: 11px; }
  .app-reference-frame .demo-small-label > small { font-size: 5px; }
  .demo-detail-fields { grid-template-columns: 1fr; gap: 0; }
  .app-reference-frame .tour-footer { font-size: 12px; padding: 13px; }
  .team-connectors { display: none; }
  .team-people { grid-template-columns: 1fr; gap: 12px; margin-top: 18px; padding: 0; }
  .team-people > div { display: grid; grid-template-columns: 44px 1fr; gap: 4px 15px; text-align: left; padding: 17px; }
  .team-people .avatar { grid-row: 1/3; margin: 0; }
  .team-people strong { align-self: end; }
  .team-people small { margin: 0; }
  .planned-badge { font-size: 11px; display: block; }
}
@media (max-width: 360px) {
  .hero-bottom .hero-actions .button { font-size: 16px; }
  .hero-bottom .hero-actions .text-link { font-size: 15px; }
  .benefit-card { padding: 21px; }
  .benefit-copy h3, .benefit-handoff h3 { font-size: 29px; }
  .feature-section-heading h2, #inside .section-intro h2 { font-size: 37px; }
  .feature-category { font-size: 11px; }
  .gateway-card > strong { font-size: 22px; }
  .gateway-card { padding: 20px; gap: 8px 12px; }
  .gateway-action { font-size: 16px; }
  .record-facts p { font-size: 15px; }
  .handoff-visual { min-height: 325px; }
  .handoff-label { width: 100%; }
  .app-main { padding: 11px; }
  .app-reference-frame .tour-box-column, .app-reference-frame .tour-items-column, .app-reference-frame .tour-label-column { padding: 12px; }
  .app-label-brand { font-size: 19px; }
  .demo-small-label h5 { font-size: 19px; }
  .app-label-bottom .sample-code { width: 38px !important; height: 38px !important; }
  .app-label-bottom { padding-block: 3px; }
  .app-label-bottom strong { font-size: 9px; }
  .app-label-bottom b { font-size: 10px; }
  .demo-dialog-heading { gap: 10px; }
  dialog { padding: 22px; }
}
@media (prefers-reduced-motion: reduce) { .gateway-card { transition: none; } }