/* 생성 파일 — 컴포넌트 프리뷰 전용 스타일(플랫폼 워커가 채움). 비어 있어도 카탈로그는 동작한다. */

/* WEB PREVIEWS BEGIN ? 31 components; source dimensions retained before preview scaling. */
.pv-web-frame { width: 260px; max-width: 100%; min-width: 0; color: var(--c-text); font: 400 15px/1.428 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, system-ui, sans-serif; text-align: left; --pv-web-shadow: 0 1px 1.75px -1px rgba(0,0,0,.1), 0 1px 2.625px 0 rgba(0,0,0,.1); }
.pv-web-frame, .pv-web-frame * { box-sizing: border-box; }
.pv-web-frame svg { display: block; flex-shrink: 0; }
.pv-web-icon { width: 20px; height: 20px; }
.pv-web-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pv-web-column { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.pv-web-between { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.pv-web-caption { font-size: 13px; font-weight: 400; line-height: 1.333; color: var(--c-text-3); }
.pv-web-link { color: var(--c-primary); font-size: 13px; font-weight: 500; white-space: nowrap; }
.pv-web-grow { flex: 1; min-width: 0; }
.pv-web-disabled { opacity: .5; }
/* Button: the source is a native control, with an 8px radius and md height 36px. */
.pv-web-button { display: flex; flex-direction: column; gap: 12px; }
.pv-web-button-control { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 36px; padding: 0 16px; border: 1px solid var(--c-border); border-radius: var(--r-md); background: var(--c-surface); color: #404751; font-size: 15px; font-weight: 500; line-height: 1; white-space: nowrap; flex-shrink: 0; }
.pv-web-button-primary { border: 0; background: linear-gradient(135deg, #42a5f5, var(--c-primary)); color: #fff; box-shadow: var(--pv-web-shadow); }
.pv-web-button-danger { border-color: transparent; background: var(--c-danger); color: #fff; box-shadow: var(--pv-web-shadow); }
.pv-web-button-text { border-color: transparent; background: transparent; color: var(--c-primary); }
.pv-web-button-sm { height: 32px; padding-inline: 12px; font-size: 14px; }
.pv-web-button-sm .pv-web-icon { width: 18px; height: 18px; }
.pv-web-button-alternates { gap: 6px; }
.pv-web-icon-toggle { display: flex; align-items: flex-start; justify-content: center; gap: 28px; }
.pv-web-icon-toggle-control { width: 32px; height: 32px; padding: 0; border: 0; border-radius: 16px; display: inline-flex; align-items: center; justify-content: center; color: var(--c-primary); background: transparent; }
.pv-web-icon-toggle-active { background: var(--c-primary-soft); }
.pv-web-checkbox { display: flex; flex-direction: column; gap: 16px; }
.pv-web-checkbox-label { display: inline-flex; align-items: center; gap: 8px; color: #404751; font-size: 14px; font-weight: 400; line-height: 1.428; }
.pv-web-checkbox-box { position: relative; width: 18px; height: 18px; flex-shrink: 0; border: 1px solid #e2e8e0; border-radius: 4px; background: var(--c-surface); }
.pv-web-checkbox-checked { border: 0; background: var(--c-primary); color: #fff; }
.pv-web-checkbox-box svg { position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; }
.pv-web-dropdown, .pv-web-text-input { display: flex; flex-direction: column; gap: 10px; }
.pv-web-dropdown-control { position: relative; display: inline-flex; align-items: center; width: 100%; height: 36px; padding: 0 36px 0 12px; border: 1px solid var(--c-border); border-radius: 8px; background: var(--c-surface); font-size: 15px; font-weight: 400; line-height: 1.428; }
.pv-web-dropdown-control > span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.pv-web-dropdown-control .pv-web-icon { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); color: var(--c-text-3); }
.pv-web-text-input-control { display: inline-flex; align-items: center; gap: 8px; width: 100%; height: 36px; padding: 8px 12px; border: 1px solid var(--c-border); border-radius: 8px; background: var(--c-surface); font-size: 15px; line-height: 1.428; white-space: nowrap; }
.pv-web-text-input-control .pv-web-icon { width: 18px; height: 18px; color: var(--c-text-3); }
.pv-web-focused { border-color: var(--c-primary); }
.pv-web-placeholder { color: #6b72808f; }
.pv-web-text-input-control.pv-web-placeholder { font-size: 13px; }
.pv-web-input-disabled { color: var(--c-text-3); background: var(--c-bg); }
.pv-web-filter-bar { display: flex; flex-direction: column; gap: 12px; padding: 12px; border: 1px solid var(--c-border); border-radius: 16px; background: var(--c-surface); box-shadow: var(--pv-web-shadow); }
.pv-web-filter-bar-fields { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 12px; }
.pv-web-filter-bar-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.pv-web-form-field { display: flex; flex-direction: column; gap: 6px; }
.pv-web-form-field-label { display: inline-flex; align-items: center; gap: 2px; font-size: 14px; font-weight: 500; line-height: 1.428; color: #404751; }
.pv-web-form-field-required { color: #c41e3a; }
.pv-web-form-field-error { color: #c41e3a; font-size: 13px; font-weight: 500; line-height: 1.333; }
.pv-web-form-field-helper { color: var(--c-text-3); font-size: 13px; font-weight: 400; line-height: 1.333; }
.pv-web-search-bar { display: flex; flex-direction: column; gap: 10px; }
.pv-web-search-bar-row { display: flex; align-items: center; gap: 12px; width: 100%; height: 40px; }
.pv-web-search-bar-input { display: flex; flex: 1; min-width: 0; align-items: center; gap: 8px; height: 40px; padding: 8px 12px; border: 1.25px solid var(--c-border); border-radius: 8px; background: var(--c-surface); }
.pv-web-search-bar-input.pv-web-focused { border-color: var(--c-primary); }
.pv-web-search-bar-input > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pv-web-search-bar-input .pv-web-icon { color: var(--c-text-3); }
.pv-web-search-bar-placeholder { color: #acb0b8; font-size: 15px; }
.pv-web-search-bar-action { display: inline-flex; align-items: center; gap: 6px; height: 40px; padding: 0 16px; border-radius: 8px; background: var(--c-primary); color: #fff; font-size: 15px; font-weight: 500; line-height: 1.428; box-shadow: var(--pv-web-shadow); white-space: nowrap; }
.pv-web-pro-badge { display: flex; flex-direction: column; align-items: center; gap: 16px; }
.pv-web-pro-badge-chip { display: inline-flex; align-items: center; padding: 1px 7px; border-radius: 6px; background: linear-gradient(90deg, #f5b301, #ff9500); color: #3a2600; font-size: 10px; font-weight: 800; line-height: 1.5; letter-spacing: .04em; white-space: nowrap; vertical-align: middle; }
.pv-web-status-badge { display: flex; flex-direction: column; gap: 14px; }
.pv-web-status-badge-chip { display: inline-flex; align-items: center; justify-content: center; width: fit-content; border-radius: var(--r-sm); padding: 4px 10px; font-size: 13px; font-weight: 600; line-height: 1; white-space: nowrap; color: #fff; }
.pv-web-status-badge-tones { display: flex; gap: 8px; flex-wrap: wrap; }
.pv-web-status-pending { background: #a8560d; }
.pv-web-status-confirmed { background: #0f766e; }
.pv-web-status-progress { background: #1565c0; }
.pv-web-status-completed { background: #15803d; }
.pv-web-status-urgent { background: #d83c3c; }
.pv-web-status-cancelled { background: #6b7684; }
.pv-web-brand-item { display: flex; flex-direction: column; gap: 16px; }
.pv-web-brand-item-control { display: inline-flex; align-items: center; height: 20px; gap: 6px; padding: 0; color: #404751; font-size: 15px; font-weight: 400; line-height: 1.428; }
.pv-web-brand-item-dot { width: 6px; height: 6px; border-radius: var(--r-pill); background: #cbd5e1; flex-shrink: 0; }
.pv-web-brand-item-blue { background: var(--c-primary); }
.pv-web-brand-item-green { background: var(--c-success); }
.pv-web-section-card-panel { width: 100%; padding: 16px; border: 1px solid var(--c-border); border-radius: 16px; background: var(--c-surface); box-shadow: var(--pv-web-shadow); }
.pv-web-section-card-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.pv-web-section-card-title { font-size: 18px; font-weight: 600; line-height: 1.5; }
.pv-web-section-card .pv-web-between { font-size: 13px; line-height: 1.428; }
/* StaffCard keeps its 310px minimum height; this specimen crops the empty middle. */
.pv-web-staff-card { height: 120px; overflow: hidden; }
.pv-web-staff-card-scale { width: 125%; transform: scale(.8); transform-origin: top left; }
.pv-web-staff-card-panel { position: relative; display: flex; flex-direction: column; gap: 16px; min-height: 310px; width: 100%; padding: 16px; border: 1.25px solid var(--c-border); border-radius: 16px; background: var(--c-surface); box-shadow: var(--pv-web-shadow); }
.pv-web-staff-card-top { display: flex; align-items: flex-start; gap: 16px; position: relative; }
.pv-web-staff-card-avatar { display: inline-flex; align-items: center; justify-content: center; width: 56px; height: 56px; flex-shrink: 0; border-radius: 50%; background: var(--c-primary); color: #fff; font-size: 22px; font-weight: 600; line-height: 1; }
.pv-web-staff-card-name-block { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.pv-web-staff-card-name { font-size: 16px; font-weight: 600; line-height: 1.5; }
.pv-web-staff-card-role { color: var(--c-text-3); font-size: 13px; font-weight: 500; line-height: 1.333; }
.pv-web-staff-card-menu { display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; flex-shrink: 0; color: var(--c-text-3); }
.pv-web-staff-card-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; min-height: 50px; padding: 8px 12px; border-radius: 8px; background: var(--c-primary-soft); }
.pv-web-staff-card-stats > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pv-web-staff-card-stat-label { color: #667385; font-size: 12px; font-weight: 500; line-height: 1.333; }
.pv-web-staff-card-work, .pv-web-staff-card-revenue { color: var(--c-primary); font-size: 15px; font-weight: 600; line-height: 1.333; }
.pv-web-staff-card-revenue { color: #055e47; }
.pv-web-staff-card-permission { display: flex; align-items: center; justify-content: center; margin-top: auto; width: 100%; height: 36px; border-radius: 8px; background: var(--c-bg); color: var(--c-text-3); font-size: 15px; font-weight: 600; }
.pv-web-stat-card { height: 120px; overflow: hidden; }
.pv-web-stat-card-scale { width: 125%; transform: scale(.8); transform-origin: top left; }
.pv-web-stat-card-panel { position: relative; display: flex; flex-direction: column; gap: 8px; min-height: 96px; width: 100%; padding: 16px; border: 1px solid var(--c-border); border-radius: var(--r-lg); background: var(--c-surface); box-shadow: var(--pv-web-shadow); }
.pv-web-stat-card-label { color: var(--c-text-2); font-size: 15px; font-weight: 500; line-height: 1.428; }
.pv-web-stat-card-icon { position: absolute; top: 16px; right: 16px; width: 22px; height: 22px; color: var(--c-primary); }
.pv-web-stat-card-value-row { display: flex; align-items: baseline; gap: 4px; color: var(--c-text-2); }
.pv-web-stat-card-value { color: var(--c-text); font-size: 28px; font-weight: 700; line-height: 1.5; font-variant-numeric: tabular-nums; }
.pv-web-stat-card-trend { display: flex; align-items: center; gap: 4px; color: #055e47; font-size: 13px; font-weight: 500; line-height: 1; }
.pv-web-stat-card-trend svg { width: 14px; height: 14px; }
.pv-web-stat-card-alternates { display: flex; gap: 16px; padding-top: 8px; font-size: 13px; line-height: 1.333; }
.pv-web-stat-card-warning { color: #b45309; }
.pv-web-stat-card-danger { color: var(--c-danger); }
.pv-web-task-card { height: 120px; overflow: hidden; }
.pv-web-task-card-scale { width: 142.857143%; transform: scale(.7); transform-origin: top left; }
.pv-web-task-card-panel { position: relative; display: flex; flex-direction: column; gap: 4px; width: 100%; min-height: 144px; padding: 12px; border: 1.25px solid var(--c-border); border-radius: 16px; background: var(--c-surface); box-shadow: 0 1px 1.75px 0 rgba(0,0,0,.05); }
.pv-web-task-card-plate { color: var(--c-primary); font-size: 16px; font-weight: 700; line-height: 1.25; }
.pv-web-task-card-urgent { padding: 2px 6px; border-radius: 8px; background: #fef2f2; color: #dc2626; font-size: 12px; font-weight: 700; line-height: 1.2; }
.pv-web-task-card-model { font-size: 16px; font-weight: 600; line-height: 1.375; }
.pv-web-task-card-service { color: var(--c-text-3); font-size: 13px; line-height: 1.333; }
.pv-web-task-card-progress { width: 100%; height: 6px; border-radius: 9999px; background: #f1f5f9; overflow: hidden; }
.pv-web-task-card-progress > span { display: block; width: 65%; height: 100%; border-radius: 9999px; background: #3b82f6; }
.pv-web-task-card-bottom { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: auto; padding-top: 8px; border-top: 1px solid #f8fafc; }
.pv-web-task-card-technician { display: inline-flex; align-items: center; gap: 6px; color: #404751; font-size: 12px; font-weight: 500; line-height: 1.2; }
.pv-web-task-card-avatar { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; border-radius: 50%; background: #dbeafe; color: var(--c-primary); font-size: 13px; font-weight: 500; line-height: 1; }
.pv-web-task-card-time { display: inline-flex; align-items: center; gap: 4px; color: var(--c-text-3); font-size: 12px; line-height: 1.2; }
.pv-web-task-card-time svg { width: 15px; height: 15px; }
.pv-web-task-card-alternates { display: flex; align-items: center; justify-content: space-between; padding-top: 6px; font-size: 13px; color: var(--c-text-3); }
.pv-web-task-card-completed { display: inline-flex; align-items: center; gap: 6px; }
.pv-web-task-card-completed > span { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; border-radius: 50%; background: #ecfdf5; color: #10b981; font-size: 14px; }
.pv-web-vehicle-header-card { height: 100px; overflow: hidden; }
.pv-web-vehicle-header-card-scale { width: 133.333333%; transform: scale(.75); transform-origin: top left; }
.pv-web-vehicle-header-card-row { display: inline-flex; align-items: center; gap: 16px; min-height: 56px; width: fit-content; max-width: 100%; }
.pv-web-vehicle-header-card-plate { display: inline-flex; align-items: center; justify-content: center; padding: 10px 16px; border-radius: 16px; background: rgba(255,255,255,.95); color: #c41e3a; box-shadow: 0 4px 5.25px -4px rgba(0,0,0,.1), 0 10px 13.125px -3px rgba(0,0,0,.1); font-size: 24px; font-weight: 700; line-height: 1.333; letter-spacing: 1.2px; white-space: nowrap; }
.pv-web-vehicle-header-card-model-group { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pv-web-vehicle-header-card-model { font-size: 22px; font-weight: 700; line-height: 1.333; white-space: nowrap; }
.pv-web-vehicle-header-card-meta { color: var(--c-text-3); font-size: 13px; line-height: 1.333; white-space: nowrap; }
.pv-web-vehicle-header-card-backdrop { margin-top: 8px; padding: 6px 8px; background: var(--c-primary-deep); border-radius: 8px; }
.pv-web-vehicle-header-card-backdrop .pv-web-vehicle-header-card-model { color: #fff; }
.pv-web-vehicle-header-card-backdrop .pv-web-vehicle-header-card-meta { color: #ffffffe6; }
.pv-web-data-table { height: 84px; overflow: hidden; }
.pv-web-data-table-scale { width: 153.846154%; transform: scale(.65); transform-origin: top left; }
.pv-web-data-table-table { width: 100%; border-collapse: separate; border-spacing: 0; table-layout: fixed; background: var(--c-surface); font-size: 15px; line-height: 1.428; }
.pv-web-data-table-vehicle-column { width: 116px; }
.pv-web-data-table-status-column { width: 96px; }
.pv-web-data-table-table th { height: 40px; padding: 8px 16px; border-bottom: 1px solid var(--c-border); background: var(--c-bg); color: #404751; font-size: 15px; font-weight: 600; line-height: 1.428; text-align: left; white-space: nowrap; }
.pv-web-data-table-table td { height: 44px; padding: 10px 16px; border-bottom: 1px solid var(--c-border); color: var(--c-text); font-size: 15px; font-weight: 400; line-height: 1.428; vertical-align: middle; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pv-web-data-table-hover { background: var(--c-primary-soft); }
/* ChartCard uses the documented minHeight prop to fit a complete chart specimen. */
.pv-web-chart-card { height: 120px; overflow: hidden; }
.pv-web-chart-card-scale { width: 142.857143%; transform: scale(.7); transform-origin: top left; }
.pv-web-chart-card-panel { display: flex; flex-direction: column; gap: 16px; width: 100%; min-height: 170px; padding: 16px; border: 1px solid var(--c-border); border-radius: 16px; background: var(--c-surface); box-shadow: var(--pv-web-shadow); }
.pv-web-chart-card-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.pv-web-chart-card-title { font-size: 18px; font-weight: 600; line-height: 1.556; }
.pv-web-chart-card-body { position: relative; flex: 1; min-height: 0; }
.pv-web-chart-card-chart { width: 100%; height: 80px; }
.pv-web-pagination-row { display: flex; align-items: center; justify-content: center; gap: 4px; height: 56px; width: 100%; border-top: 1px solid var(--c-border); }
.pv-web-pagination-page { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 36px; flex-shrink: 0; padding: 0; border-radius: 8px; color: #475569; font-size: 15px; font-weight: 400; line-height: 1; }
.pv-web-pagination-active { background: var(--c-primary); color: #fff; font-weight: 500; }
.pv-web-pagination-arrow { border: 1px solid var(--c-border); }
.pv-web-pagination-arrow svg { width: 22px; height: 22px; color: var(--c-text-2); }
.pv-web-pagination-disabled { opacity: .4; }
.pv-web-pagination-ellipsis { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 36px; flex-shrink: 0; color: var(--c-text-3); font-size: 16px; font-weight: 600; }
.pv-web-tab-bar-list { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pv-web-tab-bar-tab { display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 36px; padding: 0 14px; border: 1.25px solid var(--c-border); border-radius: 8px; background: var(--c-surface); color: var(--c-text-3); font-size: 15px; font-weight: 600; line-height: 1; white-space: nowrap; }
.pv-web-tab-bar-active { border-color: var(--c-primary); background: var(--c-primary); color: #fff; font-weight: 500; box-shadow: var(--pv-web-shadow); }
.pv-web-tab-bar { width: 100%; }
.pv-web-tab-bar .pv-web-tab-bar-list { gap: 0; flex-wrap: nowrap; overflow-x: auto; background: var(--c-surface); border-radius: 12px; }
.pv-web-tab-bar .pv-web-tab-bar-tab { flex: 1 0 0; min-width: max-content; height: 72px; padding-inline: 16px; gap: 16px; border: 0; border-radius: 8px 8px 0 0; font-size: 22px; font-weight: 700; color: var(--c-text); box-shadow: none; }
.pv-web-tab-bar .pv-web-icon { width: 32px; height: 32px; }
.pv-web-tab-bar .pv-web-tab-bar-active { background: var(--c-primary-light, #edf5ff); color: var(--c-primary); box-shadow: inset 0 -4px var(--c-primary); }
.pv-web-alert-banner { height: 118px; overflow: hidden; }
.pv-web-alert-banner-scale { width: 125%; transform: scale(.8); transform-origin: top left; }
.pv-web-alert-banner-panel { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px; width: 100%; min-height: 96px; padding: 0 16px; border-radius: 24px; background: var(--c-primary-deep); box-shadow: var(--pv-web-shadow); }
.pv-web-alert-banner-left { display: flex; align-items: center; gap: 16px; flex: 1; min-width: 0; }
.pv-web-alert-banner-icon { display: inline-flex; align-items: center; justify-content: center; width: 48px; height: 48px; flex-shrink: 0; border-radius: 9999px; background: #ffffff33; color: #fff; }
.pv-web-alert-banner-text { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.pv-web-alert-banner-title { color: #fff; font-size: 18px; font-weight: 700; line-height: 1.333; }
.pv-web-alert-banner-description { color: #fff; font-size: 15px; font-weight: 400; line-height: 1.428; }
.pv-web-alert-banner-action { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 144px; height: 40px; padding: 0 16px; border-radius: 8px; background: var(--c-surface); color: var(--c-primary); font-size: 16px; font-weight: 500; line-height: 1; white-space: nowrap; flex-shrink: 0; box-shadow: var(--pv-web-shadow); }
.pv-web-notification-item { height: 102px; overflow: hidden; }
.pv-web-notification-item-scale { width: 142.857143%; transform: scale(.7); transform-origin: top left; }
.pv-web-notification-item-row { position: relative; display: flex; align-items: center; gap: 12px; width: 100%; min-height: 60px; padding: 12px 18px; border-bottom: 1px solid var(--c-border); }
.pv-web-notification-item-unread { background: rgba(30,136,229,.04); }
.pv-web-notification-item-dot { width: 8px; height: 8px; flex-shrink: 0; border-radius: 9999px; background: var(--c-primary); }
.pv-web-notification-item-icon { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; flex-shrink: 0; border-radius: 9999px; font-size: 16px; font-weight: 600; line-height: 1; }
.pv-web-notification-item-icon svg { width: 16px; height: 16px; }
.pv-web-notification-item-info { background: #eff6ff; color: var(--c-primary); }
.pv-web-notification-item-warning { background: #fff5e3; color: #f59e0a; }
.pv-web-notification-item-danger { background: #fee2e2; color: #ba1a1a; }
.pv-web-notification-item-success { background: #ebfaf2; color: #219661; }
.pv-web-notification-item-content { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.pv-web-notification-item-title { font-size: 15px; font-weight: 600; line-height: 1.4; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pv-web-notification-item-unread .pv-web-notification-item-title { font-weight: 700; }
.pv-web-notification-item-description { color: var(--c-text-3); font-size: 15px; font-weight: 400; line-height: 1.4; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pv-web-notification-item-time { color: #acb0b8; font-size: 13px; font-weight: 400; line-height: 1.5; white-space: nowrap; flex-shrink: 0; }
.pv-web-notification-item-tones { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 18px; }
.pv-web-notification-item-sample { display: inline-flex; align-items: center; gap: 6px; color: var(--c-text-3); font-size: 13px; white-space: nowrap; }
/* Lightboxes are drawn inside a scaled local viewport, never fixed over the catalog. */
.pv-web-media-lightbox, .pv-web-photo-lightbox { height: 120px; overflow: hidden; border-radius: 4px; }
.pv-web-lightbox-scale { width: 200%; transform: scale(.5); transform-origin: top left; }
.pv-web-lightbox-stage { position: relative; display: flex; align-items: center; justify-content: center; width: 100%; height: 240px; background: #00000066; }
.pv-web-lightbox-media { position: relative; width: 260px; max-width: 85%; max-height: 85%; border-radius: 12px; overflow: hidden; box-shadow: 0 8px 32px rgba(0,0,0,.4); }
.pv-web-lightbox-media > svg { width: 100%; height: auto; }
.pv-web-lightbox-close { position: absolute; top: 24px; right: 24px; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; background: rgba(0,0,0,.5); color: #fff; font-size: 24px; line-height: 1; }
.pv-web-lightbox-prev, .pv-web-lightbox-next { position: absolute; top: 50%; transform: translateY(-50%); display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: rgba(0,0,0,.5); color: #fff; font-size: 28px; line-height: 1; }
.pv-web-lightbox-prev { left: 24px; }
.pv-web-lightbox-next { right: 24px; }
.pv-web-lightbox-video-controls { display: flex; align-items: center; gap: 10px; height: 26px; padding: 0 8px; background: var(--c-text); color: #fff; font-size: 11px; line-height: 1; }
.pv-web-lightbox-video-track { flex: 1; height: 3px; border-radius: 9999px; background: linear-gradient(to right, #fff 40%, #64748b 40%); }
.pv-web-modal { height: 120px; overflow: hidden; border-radius: 4px; }
.pv-web-modal-scale { width: 200%; transform: scale(.5); transform-origin: top left; }
.pv-web-modal-backdrop { display: flex; align-items: center; justify-content: center; width: 100%; height: 240px; padding: 16px; background: #00000066; }
.pv-web-modal-dialog { position: relative; display: flex; flex-direction: column; width: 480px; max-width: 100%; max-height: 216px; border-radius: 16px; background: var(--c-surface); box-shadow: 0 20px 60px rgba(0,0,0,.24), 0 2px 8px rgba(0,0,0,.12); }
.pv-web-modal-header { padding: 16px 56px 0 24px; font-size: 18px; font-weight: 600; line-height: 1.556; flex-shrink: 0; }
.pv-web-modal-body { flex: 1; min-height: 0; overflow-y: auto; padding: 16px 24px; font-size: 15px; line-height: 1.428; }
.pv-web-modal-footer { display: flex; align-items: center; justify-content: flex-end; gap: 10px; padding: 16px 24px; flex-shrink: 0; }
.pv-web-modal-close { position: absolute; top: 16px; right: 16px; display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; padding: 0; border-radius: 8px; color: var(--c-text-3); }
.pv-web-modal-close svg { width: 24px; height: 24px; }
.pv-web-overlay { display: flex; flex-direction: column; gap: 8px; }
.pv-web-overlay-page { position: relative; display: flex; flex-direction: column; gap: 6px; width: 100%; height: 92px; padding: 12px; border: 1px solid var(--c-border); border-radius: 8px; overflow: hidden; background: var(--c-surface); }
.pv-web-overlay-page-title { font-size: 14px; font-weight: 600; }
.pv-web-overlay-page-line { font-size: 12px; color: var(--c-text-3); }
.pv-web-overlay-scrim { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: #00000066; transition: opacity 200ms ease; }
.pv-web-overlay-content { padding: 12px 16px; border: 1px dashed var(--c-primary); border-radius: 8px; background: var(--c-surface); color: var(--c-text); font-size: 14px; }
/* Wrapper diagrams: borders belong to illustrative children, not the source wrapper. */
.pv-web-diagram-box { border: 1px dashed var(--c-border); border-radius: 8px; background: var(--c-surface); }
.pv-web-chart-container-column { display: flex; flex-direction: column; gap: 16px; width: 100%; background: transparent; }
.pv-web-chart-container-summary { display: grid; grid-template-columns: auto auto; align-items: center; gap: 4px 12px; padding: 8px 12px; font-size: 12px; }
.pv-web-chart-container-summary strong { color: var(--c-primary); font-weight: 600; text-align: right; }
.pv-web-chart-container-chart { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 12px; font-size: 12px; }
.pv-web-chart-container-chart svg { width: 100px; height: 26px; }
.pv-web-chart-container-row { display: flex; flex-direction: column; gap: 12px; }
.pv-web-chart-container-row-scale { width: 200%; height: 64px; }
.pv-web-chart-container-row-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; width: 100%; transform: scale(.5); transform-origin: top left; }
.pv-web-chart-container-row-panel { display: flex; flex-direction: column; gap: 16px; padding: 16px; font-size: 18px; font-weight: 600; }
.pv-web-chart-container-row-panel svg { width: 100%; height: 46px; }
.pv-web-page-container-column { display: flex; flex-direction: column; gap: 16px; width: 100%; }
.pv-web-page-container-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 12px; font-size: 14px; }
.pv-web-page-container-header strong { font-weight: 600; }
.pv-web-page-container-content { display: flex; flex-direction: column; gap: 6px; padding: 10px 12px; font-size: 14px; }
.pv-web-page-header-root { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; width: 100%; }
.pv-web-page-header-left { display: flex; align-items: center; gap: 10px; min-width: 0; }
.pv-web-page-header-left > .pv-web-icon { width: 22px; height: 22px; color: var(--c-primary); }
.pv-web-page-header-title { color: var(--c-text); font-size: 18px; font-weight: 600; line-height: 1.5; }
.pv-web-page-header-description { color: var(--c-text-3); font-size: 13px; font-weight: 400; line-height: 1.428; }
.pv-web-page-header-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.pv-web-avatar { display: flex; align-items: flex-start; justify-content: center; gap: 20px; }
.pv-web-avatar-circle { display: inline-flex; align-items: center; justify-content: center; width: 56px; height: 56px; flex-shrink: 0; overflow: hidden; border-radius: var(--r-pill); background: var(--c-primary); color: #fff; font-size: 21px; font-weight: 600; line-height: 1; }
.pv-web-avatar-small { width: 40px; height: 40px; font-size: 15px; }
.pv-web-avatar-fallback { background: var(--c-primary-deep); }
/* WEB PREVIEWS END */

/* Rider previews — V2 by default; V1-only widgets retain source token values. */
.pv-rider-preview{width:100%;max-width:240px;min-width:0;margin:0 auto;color:var(--c-text);font-family:"Pretendard Variable",Pretendard,sans-serif;font-size:14px;font-weight:500;line-height:1.45;text-align:left;letter-spacing:normal}
.pv-rider-preview,.pv-rider-preview *{box-sizing:border-box}
.pv-rider-preview svg{flex-shrink:0;vertical-align:middle}
.pv-rider-preview p{margin:0}
.pv-rider-preview strong{font-weight:800}
.pv-rider-preview.pv-rider-v1{--c-primary:#005792;--c-primary-deep:#002B4D;--c-bg:#F8FAFC;--c-surface:#F1F5F9;--c-border:#E2E8F0;--c-text:#191C1E;--c-text-2:#596370;--c-text-3:#6B7280;--c-success:#219661;--c-warning:#F59E0A;--c-danger:#EB5757}
.pv-rider-row{display:flex;align-items:center;gap:8px;min-width:0}
.pv-rider-between{justify-content:space-between}
.pv-rider-column{display:flex;flex-direction:column;gap:8px;min-width:0}
.pv-rider-grow{flex:1;min-width:0}
.pv-rider-muted{color:var(--c-text-2);font-size:12px;font-weight:500}
.pv-rider-caption{font-size:11px;color:var(--c-text-3)}
.pv-rider-nowrap{white-space:nowrap}
.pv-rider-link{color:var(--c-primary);font-weight:700}
.pv-rider-card{width:100%;padding:16px;border:1px solid var(--c-border);border-radius:16px;background:#FFFFFF}
.pv-rider-stage{width:100%;max-width:240px;position:relative;overflow:hidden}
.pv-rider-scaled{transform-origin:top left;min-width:0}
.pv-rider-mini{margin-top:8px;font-size:11px}
.pv-rider-chip{display:inline-flex;align-items:center;justify-content:center;gap:3px;padding:4px 8px;border-radius:10px;white-space:nowrap;font-size:11px;font-weight:700;line-height:1.3}
.pv-rider-tone-info{background:#E0F2FE;color:#005792}
.pv-rider-tone-success{background:#EBFAF2;color:#219661}
.pv-rider-tone-warning{background:#FFF5E3;color:#F59E0A}
.pv-rider-tone-error{background:#FCEDED;color:#EB5757}
.pv-rider-tone-neutral{background:var(--c-surface);color:var(--c-text-3)}
.pv-rider-wrap{display:flex;flex-wrap:wrap;gap:6px}
.pv-rider-circle{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:50%;background:var(--c-primary-soft);color:var(--c-primary)}
.pv-rider-v1 .pv-rider-circle{background:#0057921A}
.pv-rider-cta{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:52px;padding:0 12px;border-radius:14px;background:linear-gradient(90deg,#2E72D6,#1A56B0);color:#FFFFFF;font-size:16px;font-weight:800;line-height:1.45;text-align:center}
.pv-rider-v1 .pv-rider-cta{background:linear-gradient(90deg,#00C6FF,#0072FF);font-weight:700}
.pv-rider-cta.pv-rider-disabled{background:var(--c-border);color:var(--c-text-3)}
.pv-rider-cta.pv-rider-outline{height:50px;border:1.5px solid var(--c-primary);background:#FFFFFF;color:var(--c-primary);font-size:14px}
.pv-rider-cta.pv-rider-outline.pv-rider-disabled{color:#16243A61}
.pv-rider-spinner{display:inline-block;flex-shrink:0;width:22px;height:22px;border:2.5px solid currentColor;border-right-color:transparent;border-radius:50%;transform:rotate(-35deg)}
.pv-rider-gauge{display:inline-flex;position:relative;align-items:center;justify-content:center;flex-shrink:0;color:#16243A}
.pv-rider-gauge-value{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;line-height:1;font-weight:800;letter-spacing:-.5px}
.pv-rider-gauge-value>span{color:var(--c-text-2);letter-spacing:.5px}
.pv-rider-scooter{display:block;width:100%;height:100%;max-width:240px}
.pv-rider-check{display:inline-flex;justify-content:center;align-items:center;width:22px;height:22px;flex-shrink:0;border-radius:50%;background:var(--c-primary);color:#FFFFFF}
.pv-rider-track{height:7px;border-radius:var(--r-pill);background:#F1F5F9;overflow:hidden}
.pv-rider-track>span{display:block;height:100%;background:var(--c-primary);border-radius:inherit}
.pv-rider-preview .pv-rider-rule{height:1px;background:var(--c-border);margin:12px 0}
.pv-rider-field{display:flex;align-items:center;gap:12px;min-width:0;padding:14px 16px;border:1.5px solid var(--c-border);border-radius:12px;background:var(--c-bg);font-size:14px;font-weight:400}
.pv-rider-field-label{display:block;margin-bottom:6px;font-size:12px;font-weight:700}
.pv-rider-field.pv-rider-focused{border:2px solid #1F62C9}
.pv-rider-field.pv-rider-error{border:2px solid #EB5757}
.pv-rider-sample-frame{padding:12px;border:1px dashed var(--c-border);border-radius:12px;background:#FFFFFF}

.pv-rider-primary-cta-button>.pv-rider-cta{box-shadow:0 4px 12px #0057924D}.pv-rider-primary-cta-button .pv-rider-spinner{width:24px;height:24px}
.pv-rider-filter-tab .pv-rider-row{gap:8px}.pv-rider-filter-tab .pv-rider-row>span{padding:12px 18px;border:1px solid #E2E8F0;border-radius:9999px;font-size:12px;font-weight:500;background:#FFFFFF;color:#404751}.pv-rider-filter-tab .pv-rider-row>.pv-rider-filter-active{background:#005792;color:#FFFFFF;border-color:transparent;font-weight:700}
.pv-rider-bw-rating-stars .pv-rider-row{gap:0}.pv-rider-star-filled{fill:currentColor}
.pv-rider-symptom{flex:1;min-height:100px;padding:16px;border-radius:12px;border:1.25px solid #E2E8F0;background:#FFFFFF;display:flex;flex-direction:column;gap:12px;font-size:15px;font-weight:700}.pv-rider-symptom.pv-rider-selected{background:#E0F2FE;border-color:#005792}.pv-rider-v1 .pv-rider-danger-circle{background:#FCEDED;color:#EB5757}
.pv-rider-terms{padding:20px;border:1px solid #E2E8F0;border-radius:16px;background:#FFFFFF;box-shadow:0 4px 12px #0057920A}.pv-rider-term{display:flex;align-items:center;gap:8px;padding:12px 16px;border-radius:12px;font-size:13px;font-weight:700}
.pv-rider-slot{flex:1;height:44px;display:flex;align-items:center;justify-content:center;border:1px solid var(--c-border);border-radius:10px;background:#FFFFFF;color:#16243A;font-size:13px;font-weight:800}.pv-rider-slot-selected{background:var(--c-primary);border-color:var(--c-primary);color:#FFFFFF}.pv-rider-slot-closed{background:#F1F5F9;border-color:#F1F5F9;color:var(--c-text-3);text-decoration:line-through}
.pv-rider-partner{display:inline-flex;align-items:center;padding:2px 6px;border-radius:4px;background:linear-gradient(135deg,#42A5F5,#1E88E5);color:#FFFFFF;font-size:9px;font-weight:800;letter-spacing:.5px;line-height:1.2}
.pv-rider-completed{padding:10px 14px;border-radius:12px;border:1.25px solid #E2E8F0;background:#FFFFFF}.pv-rider-completed .pv-rider-row{gap:10px}
.pv-rider-bw-sos-status-card .pv-rider-chip{padding:8px 12px;border-radius:9999px;font-size:13px}
.pv-rider-home-bike{padding:24px;border-radius:16px;background:linear-gradient(135deg,#005792,#00579273);color:#FFFFFF;box-shadow:0 6px 16px #0057924D}.pv-rider-home-bike>.pv-rider-row{gap:14px}.pv-rider-home-avatar{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:12px;background:#FFFFFF2E;font-size:22px;font-weight:900}.pv-rider-home-primary{padding:2px 8px;border-radius:6px;background:#FFFFFF33;font-size:9px;font-weight:800;letter-spacing:.5px}.pv-rider-update{display:inline-flex;align-items:center;gap:4px;padding:8px 12px;border-radius:9999px;background:#FFFFFF2E;font-size:12px;font-weight:700;white-space:nowrap}
.pv-rider-maint-item{padding:16px;border:1px solid #E2E8F0;border-radius:12px;background:#FFFFFF;margin-bottom:8px}.pv-rider-maint-item .pv-rider-chip{padding:2px 8px;border-radius:9999px}.pv-rider-maint-item>.pv-rider-row{gap:12px}
.pv-rider-maint-v2{padding:14px 16px;background:#FFFFFF;border-bottom:1px solid #F1F5F9}.pv-rider-maint-v2 .pv-rider-circle{background:#F1F5F9;color:#475569}.pv-rider-maint-v2>.pv-rider-row:last-child{margin-top:6px}.pv-rider-maint-tones{display:flex;gap:12px;margin-top:8px;font-size:11px;font-weight:800}.pv-rider-maint-tones>span{flex:1}.pv-rider-maint-tones i{display:block;height:7px;margin-top:4px;border-radius:9999px}
.pv-rider-cta.pv-rider-call-v1{height:48px;border-radius:12px;background:#005792;font-size:13px}
.pv-rider-next-check{padding:15px 16px;border-bottom:1px solid #F1F5F9;background:#FFFFFF}.pv-rider-next-check>.pv-rider-row{gap:13px}.pv-rider-next-icon{width:38px;height:38px;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:var(--c-primary-soft);color:var(--c-primary);border-radius:11px}
.pv-rider-notification{padding:16px 24px;background:#FFFFFF}.pv-rider-unread-dot{width:8px;height:8px;flex-shrink:0;border-radius:50%;background:#005792}.pv-rider-notification-icon{width:40px;height:40px;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:#E0F2FE;color:#005792;border-radius:10px}
.pv-rider-push{background:#FFF3E0;border:0}.pv-rider-push .pv-rider-row{gap:10px;color:#C76A00;font-weight:800}.pv-rider-push .pv-rider-cta{height:40px}
.pv-rider-score-v1{padding:24px;border-radius:16px;background:linear-gradient(135deg,#002B4D,#005792);color:#FFFFFF}.pv-rider-grade{padding:4px 10px;border-radius:9999px;background:#00C6FF40;color:#FFFFFF;font-size:11px;font-weight:700}
.pv-rider-score-row{gap:16px}.pv-rider-delta{padding:2px 6px;border-radius:9999px;background:#E7F6EC;color:#2F9E44;font-size:10px;font-weight:800;white-space:nowrap}
.pv-rider-settings-card{border:1px solid var(--c-border);border-radius:16px;background:#FFFFFF;overflow:hidden}.pv-rider-settings-card>.pv-rider-settings-row+.pv-rider-settings-row{border-top:1px solid var(--c-border)}.pv-rider-settings-row{padding:15px 16px;display:flex;align-items:center;gap:14px;font-size:14px;font-weight:600;color:#16243A}.pv-rider-settings-row>.pv-rider-icon{color:var(--c-text-2)}.pv-rider-settings-row.pv-rider-settings-danger,.pv-rider-settings-row.pv-rider-settings-danger>.pv-rider-icon{color:#EB5757}
.pv-rider-scale-compare{display:grid;gap:10px}.pv-rider-scale-compare>div{padding:10px 12px;border:1px solid var(--c-border);border-radius:12px;background:#FFFFFF}.pv-rider-scale-compare span,.pv-rider-scale-compare b{display:block}.pv-rider-scale-compare span{font-size:11px;color:var(--c-text-3)}.pv-rider-scale-compare b{margin-top:4px;font-size:14px;color:#16243A}.pv-rider-scale-compare .pv-rider-scale-large b{font-size:16.8px}.pv-rider-text-scale-scope>p{margin-top:10px}.pv-rider-text-scale-row{display:flex;align-items:center;gap:14px;padding:12px 16px;color:#16243A}.pv-rider-text-icon{width:20px;flex:none;font-size:16px;font-weight:800;color:var(--c-text-2)}.pv-rider-text-scale-row b,.pv-rider-text-scale-row small{display:block}.pv-rider-text-scale-row b{font-size:14px}.pv-rider-text-scale-row small{margin-top:4px;font-size:12px;line-height:1.4;color:var(--c-text-3)}.pv-rider-switch{position:relative;width:42px;height:24px;flex:none;border-radius:9999px;background:#94A3B8}.pv-rider-switch i{position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#FFFFFF;box-shadow:0 1px 3px #00000033}.pv-rider-switch-on{background:var(--c-primary)}.pv-rider-switch-on i{left:21px}
.pv-rider-shop-v1{box-shadow:0 4px 16px #0000000F}.pv-rider-shop-call{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;flex-shrink:0;border-radius:12px;background:#005792;color:#FFFFFF;box-shadow:0 2px 8px #00579233}
.pv-rider-shop-tag{border-radius:7px;padding:3px 8px;font-size:10px;font-weight:800}.pv-rider-cta.pv-rider-shop-reserve{height:40px;background:var(--c-primary);font-size:12px;font-weight:700}
.pv-rider-stats{width:100%;padding:20px;border-radius:16px;background:linear-gradient(90deg,#00C6FF,#0072FF);text-align:center;color:#FFFFFF}.pv-rider-stats>span{display:block;font-size:13px;opacity:.8}.pv-rider-stats>strong{display:block;font-size:24px;font-weight:700;margin-top:4px}
.pv-rider-stat{flex:1;min-width:0;padding:16px;border:1.25px solid #E2E8F0;border-radius:12px;background:#FFFFFF}.pv-rider-stat>span{font-size:10px;letter-spacing:1.2px;color:#6B7280}.pv-rider-stat>div{margin-top:4px;white-space:nowrap}.pv-rider-stat strong{font-size:24px;font-weight:800;line-height:1}.pv-rider-stat small{font-size:12px;font-weight:400}
.pv-rider-bw-vehicle-card .pv-rider-row{gap:14px}.pv-rider-vehicle-initial{display:flex;align-items:center;justify-content:center;width:56px;height:56px;flex-shrink:0;background:#0057921A;color:#005792;border-radius:12px;font-size:26px;font-weight:800}.pv-rider-vehicle-primary{padding:2px 8px;border-radius:6px;background:#005792;color:#FFFFFF;font-size:10px;font-weight:700}
.pv-rider-vehicle-v2{display:flex;gap:16px}.pv-rider-vehicle-front,.pv-rider-vehicle-back{flex:1;min-width:0;height:460px;overflow:hidden;border:1px solid var(--c-border);border-radius:24px;background:#FFFFFF}.pv-rider-vehicle-back{padding:12px;background:linear-gradient(#EAF1FE,#D6E4FB);display:flex;flex-direction:column}.pv-rider-front-image{position:relative;height:300px;padding:28px 32px;background:linear-gradient(#EAF1FE,#D6E4FB);display:flex;align-items:center;justify-content:center}.pv-rider-front-image .pv-rider-scooter{max-width:none}.pv-rider-plate{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;height:36px;width:132px;border-radius:11px;background:#FFFFFFD9;color:#16243A;font-size:16px;font-weight:800}.pv-rider-front-body{padding:16px}.pv-rider-vehicle-sos,.pv-rider-vehicle-quote{height:40px;flex:1;display:flex;align-items:center;justify-content:center;gap:6px;margin-top:10px;border:1px solid #F6D5D5;border-radius:12px;background:#FCEDED;color:#EB5757;font-size:13.5px;font-weight:800}.pv-rider-vehicle-quote{border-color:var(--c-border);background:var(--c-surface);color:var(--c-primary)}.pv-rider-vehicle-back>.pv-rider-cta{height:50px;flex-shrink:0;margin-top:auto}
.pv-rider-mileage-plot{height:152px;padding:6px 0;margin-top:12px}
.pv-rider-back-v1{padding:12px 16px;border-bottom:1px solid #F1F5F9;background:#FFFFFF}.pv-rider-back-v1 .pv-rider-row{gap:10px}.pv-rider-back-v1 b{font-size:18px;line-height:1.56}
.pv-rider-back-v2{padding:8px 10px;background:var(--c-surface);color:#16243A}.pv-rider-back-v2 strong{font-size:18px;line-height:1.25}
.pv-rider-nav{height:80px;display:flex;align-items:center;justify-content:space-around;border:1px solid var(--c-border);border-bottom:0;border-radius:20px 20px 0 0;background:#FFFFFF}.pv-rider-nav-item{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 12px;color:var(--c-text-3);font-size:10px;font-weight:700;white-space:nowrap}.pv-rider-nav-active{color:var(--c-primary);background:var(--c-primary-soft);border-radius:16px}.pv-rider-nav-v1 .pv-rider-nav-active{background:#E0F2FE}.pv-rider-nav-v2 .pv-rider-nav-item{padding:8px 14px;letter-spacing:1px;line-height:1.2}
.pv-rider-global-v1{padding:16px 24px;background:#F8FAFC}.pv-rider-global-v1>.pv-rider-row{gap:10px}.pv-rider-global-v1 strong{font-size:20px;font-weight:900;line-height:1.4}.pv-rider-logo-mark{width:34px;height:34px;display:flex;justify-content:center;align-items:center;border-radius:8px;background:#005792;color:#FFFFFF;font-size:25px;font-weight:900;font-style:italic}.pv-rider-header-bell{display:flex;align-items:center;justify-content:center;position:relative;width:40px;height:40px;flex-shrink:0;border:1px solid #F1F5F9;border-radius:10px;background:#FFFFFF;color:#596370}.pv-rider-header-count{position:absolute;top:-4px;right:-4px;min-width:18px;min-height:18px;padding:0 5px;border:1.5px solid #F8FAFC;border-radius:9999px;background:#EB5757;color:#FFFFFF;font-size:11px;font-weight:700;line-height:15px;text-align:center}.pv-rider-header-count.pv-rider-static-count{position:static}
.pv-rider-global-v2{padding:16px 24px;background:var(--c-surface)}.pv-rider-global-v2 strong{font-size:21px;font-weight:900;letter-spacing:-1px;color:#002B4D}.pv-rider-global-v2 .pv-rider-header-bell,.pv-rider-header-sos{width:42px;height:42px;border:1px solid var(--c-border);border-radius:12px;color:#16243A}.pv-rider-header-sos{display:flex;align-items:center;justify-content:center;flex-shrink:0;border-color:#F6D5D5;background:#FCEDED;color:#EB5757}.pv-rider-global-v2 .pv-rider-header-count{top:-3px;right:-3px;min-width:16px;min-height:16px;padding:0 4px;border:2px solid var(--c-surface);background:var(--c-primary);font-size:9px;line-height:12px}
.pv-rider-state{display:flex;align-items:center;flex-direction:column;text-align:center}.pv-rider-state-v1{padding:24px}.pv-rider-state-v1>.pv-rider-circle{background:#F1F5F9;color:#6B7280}.pv-rider-state>strong{font-size:16px;margin-top:16px}.pv-rider-state>p{margin-top:8px}.pv-rider-state .pv-rider-cta{margin-top:20px}.pv-rider-state-v1 .pv-rider-muted{font-size:14px;font-weight:400}.pv-rider-state-v1 .pv-rider-cta{min-width:160px;width:auto;min-height:48px;height:48px;background:#005792;border-radius:9999px}.pv-rider-state-v2{padding:32px 16px}.pv-rider-state-v2 .pv-rider-cta{width:200px;height:46px}.pv-rider-state-v2 strong{color:#16243A}
.pv-rider-error-state{padding:24px}.pv-rider-error-state>.pv-rider-icon{color:#EB5757}.pv-rider-error-state>.pv-rider-cta{max-width:240px;box-shadow:0 4px 12px #0057924D}.pv-rider-error-state .pv-rider-muted{font-size:14px;font-weight:400}
.pv-rider-banner{display:flex;align-items:center;gap:12px;padding:12px 8px 12px 16px;border:1px solid #00579233;border-radius:12px;background:#E6F0F8}.pv-rider-banner b{font-size:14px;font-weight:700;color:#191C1E}.pv-rider-banner p{margin-top:2px;font-size:13px;font-weight:400;color:#596370}.pv-rider-banner-action{width:48px;height:48px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:13px;font-weight:700}
.pv-rider-loading-state{padding:24px;display:flex;flex-direction:column;align-items:center;color:#005792}.pv-rider-loading-state>.pv-rider-spinner{width:36px;height:36px;border-width:3px}.pv-rider-loading-state>b{margin-top:16px;font-size:13px;font-weight:700;color:#6B7280}
.pv-rider-sos-progress{display:flex;padding:12px 24px 0;background:#FFFFFF}.pv-rider-sos-progress>span{flex:1;padding:0 3px;text-align:center;font-size:10px;font-weight:700;letter-spacing:.4px;color:#6B7280}.pv-rider-sos-progress i{display:block;height:4px;margin-bottom:4px;border-radius:9999px;background:#E2E8F0}.pv-rider-sos-progress .pv-rider-reached{color:#005792}.pv-rider-sos-progress .pv-rider-reached i{background:#005792}
.pv-rider-sos-steps{display:flex;align-items:flex-start}.pv-rider-sos-step{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:11px;font-weight:800;color:var(--c-text-3)}.pv-rider-sos-step>b{width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#F1F5F9;border:1px solid var(--c-border);font-size:12px;color:var(--c-text-3)}.pv-rider-sos-steps>i{flex:1;height:2px;margin-top:13px;background:var(--c-border)}.pv-rider-sos-step.pv-rider-step-done>b,.pv-rider-sos-step.pv-rider-step-active>b{background:var(--c-primary);color:#FFFFFF;border-color:var(--c-primary)}.pv-rider-sos-step.pv-rider-step-active,.pv-rider-sos-step.pv-rider-step-done{color:var(--c-primary)}.pv-rider-sos-steps>i.pv-rider-step-done{background:var(--c-primary)}
.pv-rider-waiting{display:flex;flex-direction:column;align-items:center}.pv-rider-pulse{position:relative;width:160px;height:160px;display:flex;align-items:center;justify-content:center}.pv-rider-pulse>i{position:absolute;width:160px;height:160px;border:2px solid #0057921C;border-radius:50%;transform:scale(1)}.pv-rider-pulse>i:nth-child(2){transform:scale(.8);border-color:#00579238}.pv-rider-pulse>i:nth-child(3){transform:scale(.6);border-color:#00579259}.pv-rider-pulse>span{display:flex;align-items:center;justify-content:center;width:80px;height:80px;background:linear-gradient(90deg,#00C6FF,#0072FF);color:#FFFFFF;border-radius:50%;box-shadow:0 4px 12px #0057924D}.pv-rider-waiting>b{margin-top:32px;font-size:20px}.pv-rider-waiting>.pv-rider-muted{margin-top:4px}
.pv-rider-step-bar{height:4px;border-radius:4px;background:#E2E8F0;overflow:hidden}.pv-rider-step-bar>span{display:block;height:100%;background:#005792;border-radius:4px}
.pv-rider-toast{display:flex;align-items:center;gap:12px;padding:14px 20px;border:1px solid currentColor;border-radius:12px;font-size:14px;font-weight:600}
.pv-rider-vehicle-gate{padding:20px}.pv-rider-vehicle-gate>strong{font-size:20px;color:#16243A}.pv-rider-vehicle-gate>p{margin-top:10px;font-size:13px;line-height:1.5;color:var(--c-text-2)}.pv-rider-vehicle-gate>.pv-rider-cta{width:220px}
.pv-rider-dialog{padding:24px;border-radius:14px;background:#FFFFFF;color:#16243A;text-align:center;box-shadow:0 8px 24px #16243A14}.pv-rider-dialog>.pv-rider-circle{margin:0 auto}.pv-rider-dialog>strong{display:block;margin-top:20px;font-size:18px;font-weight:800;line-height:1.25}.pv-rider-dialog>p{margin-top:8px;font-size:14px;line-height:1.45;color:var(--c-text-2)}.pv-rider-dialog .pv-rider-cta{height:48px;font-size:14px}.pv-rider-cta.pv-rider-dialog-cancel{border:1.5px solid var(--c-border);background:#FFFFFF;color:var(--c-text-2);font-weight:700}.pv-rider-cta.pv-rider-dialog-danger{background:#EB5757}.pv-rider-confirm-icon{background:#FCEDED;color:#EB5757}
.pv-rider-overlay-demo{height:180px;display:flex;align-items:center;justify-content:center;position:relative;background:#191C1E66;border-radius:12px;overflow:hidden}.pv-rider-overlay-underlay{position:absolute;top:8px;left:12px;font-size:13px;color:#FFFFFF80}.pv-rider-loading-overlay{width:160px;height:160px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px;background:#FFFFFF;border-radius:16px;box-shadow:0 8px 24px #1E3A8A1A;color:#6B7280;font-size:13px;font-weight:500}.pv-rider-loading-overlay .pv-rider-spinner{width:36px;height:36px;border-width:3px;color:#005792}
.pv-rider-capture{display:flex;align-items:center;flex-direction:column;padding:20px;background:#191C1E}.pv-rider-capture-frame{position:relative;width:260px;height:150px;border:3px solid #219661;border-radius:12px;display:flex;align-items:center;justify-content:center}.pv-rider-capture-frame>i{position:absolute;width:20px;height:20px;border-style:solid;border-color:#219661;border-width:4px 0 0 4px;top:-3px;left:-3px;border-radius:12px 0 0 0}.pv-rider-capture-frame>i:nth-child(2){left:auto;right:-3px;transform:rotate(90deg)}.pv-rider-capture-frame>i:nth-child(3){top:auto;bottom:-3px;transform:rotate(-90deg)}.pv-rider-capture-frame>i:nth-child(4){top:auto;left:auto;right:-3px;bottom:-3px;transform:rotate(180deg)}.pv-rider-capture-document{padding:20px 12px;background:#FFFFFF;color:#191C1E;font-size:13px;font-weight:700;text-align:center}.pv-rider-capture-document>span{display:block;margin-top:12px;font-size:11px;font-weight:400}.pv-rider-capture-hint{display:flex;align-items:center;gap:8px;margin-top:16px;padding:8px 12px;border-radius:9999px;background:#219661;color:#FFFFFF;font-size:13px;font-weight:700}
.pv-rider-prompt{padding:24px;border-radius:14px;background:#FFFFFF;color:#16243A;box-shadow:0 8px 24px #16243A14}.pv-rider-prompt>.pv-rider-row{gap:8px}.pv-rider-prompt .pv-rider-icon{color:var(--c-primary)}.pv-rider-prompt strong{font-size:18px;font-weight:800}.pv-rider-prompt>p{margin-top:20px;font-size:14px;line-height:1.45;color:var(--c-text-2)}.pv-rider-prompt>.pv-rider-cta{margin-top:20px}.pv-rider-prompt-secondary{display:block;margin-top:4px;padding:12px;text-align:center;font-size:14px;font-weight:700;color:var(--c-text-3)}
.pv-rider-autofit{display:flex;flex-wrap:wrap;gap:8px}.pv-rider-autofit>div{flex:1;min-width:90px;padding:8px;border:1px dashed var(--c-border);border-radius:12px;background:#FFFFFF;text-align:center}.pv-rider-autofit strong{font-size:18px}.pv-rider-autofit b{font-size:12px}.pv-rider-autofit span{display:block;margin-top:4px;font-size:10px;color:var(--c-text-3)}.pv-rider-ellipsis{display:block;max-width:100px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;margin:auto}
.pv-rider-quick-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.pv-rider-quick-grid>div{min-height:100px;padding:16px;border:1.25px solid #E2E8F0;border-radius:12px;background:#FFFFFF;display:flex;flex-direction:column;align-items:flex-start}.pv-rider-quick-grid b{margin-top:12px;font-size:14px;font-weight:700}.pv-rider-quick-grid>div>span:last-child{font-size:12px;font-weight:400;color:#6B7280;margin-top:2px}
.pv-rider-reservation-number{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:#005792;color:#FFFFFF;font-size:12px;font-weight:700}
.pv-rider-brand-glyphs{display:flex;align-items:center;gap:12px;color:#111111}.pv-rider-brand-glyphs svg{display:block;height:20px;width:auto;max-width:160px;fill:currentColor}
.pv-rider-data-diagram{padding:10px 12px;border:1px dashed var(--c-primary);border-radius:12px;background:#FFFFFF;font-size:11px}.pv-rider-data-diagram>strong{font-size:12px;color:var(--c-primary)}.pv-rider-data-diagram dl{margin:6px 0}.pv-rider-data-diagram dl>div{display:flex;align-items:center;justify-content:space-between;gap:6px;min-height:17px}.pv-rider-data-diagram dt{color:var(--c-text-3);font-size:10px}.pv-rider-data-diagram dd{margin:0;font-weight:700}.pv-rider-data-diagram .pv-rider-chip{padding:1px 6px;font-size:10px}.pv-rider-data-target{border-top:1px solid var(--c-border);padding-top:5px;font-size:10px;color:var(--c-text-2)}
.pv-rider-map{width:100%;height:110px;position:relative;overflow:hidden;border-radius:12px;border:1px solid var(--c-border)}.pv-rider-map-pin{position:absolute;width:24px;height:32px;display:flex;align-items:center;justify-content:center;filter:drop-shadow(0 1px 2px #16243A33)}.pv-rider-map-pin .pv-rider-icon{height:32px;fill:currentColor;stroke:#FFFFFF;stroke-width:1.2}.pv-rider-map-rider{left:26%;top:47%;color:#BA1A1A}.pv-rider-map-mechanic{left:47%;top:7%;color:#005792}.pv-rider-map-shop{left:77%;top:40%;color:#FFC93C}.pv-rider-map-external{left:10%;top:0;color:#9E9E9E}.pv-rider-map-legend{position:absolute;bottom:5px;left:7px;padding:3px 7px;border-radius:9999px;background:#FFFFFFE6;color:#596370;font-size:9px}
.pv-rider-vehicle-image{height:88px;display:flex;justify-content:center;align-items:center}.pv-rider-vehicle-image>.pv-rider-scooter{max-width:160px}
/* End rider previews. */

/* Web catalog fit: fluid specimens within the catalog's minimum 280px cards. */
.pv-web-frame { width: 100%; max-width: 260px; min-width: 220px; }
/* Keep ChartCard's actual default 288px minimum, cropping the lower body at .7 scale. */
.pv-web-chart-card-panel { min-height: 288px; }
/* Primary banner plus a separate compact sample of the optional action. */
.pv-web-alert-banner-variant { display: flex; justify-content: flex-end; margin-top: 8px; }

/* mechanic previews — 57 Flutter components; source dimensions in CSS px. */
.pv-mechanic-root { width:240px;max-width:100%;color:var(--c-text);font-family:"Pretendard Variable",Pretendard,sans-serif;font-size:14px;font-weight:600;line-height:1.4;text-align:left;--pv-border:#E2E9F4;--pv-bg:#F2F6FC;--pv-gradient:linear-gradient(90deg,#2E72D6,#1A56B0);--pv-banner:linear-gradient(135deg,#2E72D6,#1A56B0) }
.pv-mechanic-root, .pv-mechanic-root * { box-sizing:border-box }
.pv-mechanic-root svg { display:block;flex:none }
.pv-mechanic-row { display:flex;align-items:center;gap:12px;min-width:0 }
.pv-mechanic-stack { display:flex;flex-direction:column;gap:8px;min-width:0 }
.pv-mechanic-grow { flex:1;min-width:0 }
.pv-mechanic-muted { color:var(--c-text-3);font-size:12px;font-weight:500 }
.pv-mechanic-label { font-size:12px;font-weight:700;letter-spacing:1.2px;color:var(--c-text-2);display:block;margin-bottom:6px }
.pv-mechanic-chips { display:flex;align-items:center;gap:6px;flex-wrap:wrap }
.pv-mechanic-variants { height:36px;overflow:hidden;margin-top:8px }
.pv-mechanic-variants-inner { width:142.857143%;transform:scale(.7);transform-origin:top left }
.pv-mechanic-scale-frame { position:relative;width:100%;max-width:240px;overflow:hidden }
.pv-mechanic-scaled { transform-origin:top left }
.pv-mechanic-button { display:flex;align-items:center;justify-content:center;gap:8px;flex:1;min-width:0;width:100%;height:50px;border-radius:18px;font-size:20px;font-weight:700;white-space:nowrap;font-variant-numeric:tabular-nums }
.pv-mechanic-primary { background:var(--pv-gradient);color:#fff }
.pv-mechanic-secondary { background:var(--pv-border);color:var(--c-text-2) }
.pv-mechanic-disabled { background:var(--pv-border);color:var(--c-text-3);box-shadow:none }
.pv-mechanic-pressed { box-shadow:inset 0 0 0 100px #0000000d;transform:scale(.98) }
.pv-mechanic-outline { background:#fff;border:1.5px solid var(--c-primary);color:var(--c-primary) }
.pv-mechanic-ghost { background:#fff;border:1.5px solid var(--pv-border);color:var(--c-text-2) }
.pv-mechanic-spinner { display:inline-block;flex:none;border:2.5px solid currentColor;border-right-color:transparent;border-bottom-color:transparent;border-radius:50%;transform:rotate(-35deg) }
.pv-mechanic-badge { display:inline-flex;align-items:center;white-space:nowrap;padding:5px 11px;border-radius:var(--r-pill);font-size:11px;font-weight:800;line-height:1.4 }
.pv-mechanic-tone-warning { background:#FFF3E0;color:var(--c-warning) }
.pv-mechanic-tone-info { background:#E0F2FE;color:var(--c-primary) }
.pv-mechanic-tone-success { background:#EBFAF2;color:var(--c-success) }
.pv-mechanic-tone-danger { background:#FCEDED;color:var(--c-danger) }
.pv-mechanic-tone-muted { background:#F1F5F9;color:var(--c-text-3) }
.pv-mechanic-field { height:46px;padding:0 14px;display:flex;align-items:center;gap:12px;background:#fff;border:1.5px solid var(--pv-border);border-radius:12px;font-size:14px;font-weight:400 }
.pv-mechanic-field-focused { border-color:var(--c-primary) }
.pv-mechanic-field-inert { background:var(--pv-bg);color:var(--c-text-3) }
.pv-mechanic-field-error { border:2px solid var(--c-danger) }
.pv-mechanic-card { background:#fff;border:1px solid var(--pv-border);border-radius:18px }
.pv-mechanic-title { font-size:18px;font-weight:800;line-height:1.56;letter-spacing:-.3px }
.pv-mechanic-icon-tile { display:flex;align-items:center;justify-content:center;flex:none;background:var(--c-surface);color:var(--c-primary);width:40px;height:40px;border-radius:12px }
.pv-mechanic-avatar { display:flex;align-items:center;justify-content:center;background:var(--c-surface);color:var(--c-text-3);border-radius:50%;flex:none }
.pv-mechanic-divider { height:1px;background:#F1F5F9;margin:14px 0 }
.pv-mechanic-dialog-primary { background:var(--c-primary);color:#fff;font-size:13px }
.pv-mechanic-dialog-secondary { background:#fff;border:1.5px solid var(--pv-border);color:var(--c-text-2);font-size:13px }
.pv-mechanic-dialog-danger { background:var(--c-danger);color:#fff;font-size:13px }
.pv-mechanic-dialog-disabled { background:var(--pv-border);color:var(--c-text-3);font-size:13px }
.pv-mechanic-accept-button .pv-mechanic-button { height:44px;border-radius:12px;font-size:14px;font-weight:800 }
.pv-mechanic-accept-button .pv-mechanic-disabled { background:var(--c-surface) }
.pv-mechanic-bw-dialog-actions .pv-mechanic-spinner { border-width:2px }
.pv-mechanic-outline-button .pv-mechanic-inactive { color:var(--c-text-3);border-color:var(--pv-border) }
.pv-mechanic-ghost-button .pv-mechanic-inactive { color:var(--c-text-3);border-color:var(--c-surface) }
.pv-mechanic-diagram { border:1px dashed var(--c-text-3);border-radius:12px;padding:8px;display:flex;flex-direction:column;gap:6px }
.pv-mechanic-pressable-button .pv-mechanic-button { font-size:15px;height:44px;border-radius:12px }
.pv-mechanic-primary-cta-button .pv-mechanic-button { height:52px;border-radius:16px;font-size:16px;font-weight:800;letter-spacing:.5px }
.pv-mechanic-primary-cta-button .pv-mechanic-primary { box-shadow:0 4px 12px #1A56B04d }
.pv-mechanic-reject { height:44px;border-radius:12px;border:1.5px solid var(--pv-border);background:#fff;color:var(--c-danger);font-size:14px }
.pv-mechanic-reject-button .pv-mechanic-inactive { background:var(--c-surface);color:var(--c-text-3) }
.pv-mechanic-scan-surface { min-height:98px;padding:21px 0;border-radius:20px;background:linear-gradient(#ffffff1a,transparent 55%),var(--pv-banner);box-shadow:0 12px 26px -6px #1A56B066;display:flex;align-items:center;justify-content:center;color:#fff }
.pv-mechanic-viewfinder { position:relative;width:210px;max-width:100%;min-height:56px;text-align:center;padding:4px 12px }
.pv-mechanic-viewfinder i { position:absolute;width:19px;height:19px;border:solid #78C8FFe6;border-width:2.5px 0 0 2.5px;border-radius:5px 0 0 0;top:0;left:0 }
.pv-mechanic-viewfinder i:nth-child(2) { left:auto;right:0;transform:rotate(90deg) }
.pv-mechanic-viewfinder i:nth-child(3) { top:auto;bottom:0;left:auto;right:0;transform:rotate(180deg) }
.pv-mechanic-viewfinder i:nth-child(4) { top:auto;bottom:0;transform:rotate(270deg) }
.pv-mechanic-scan-title { font-size:30px;font-weight:700;line-height:1;letter-spacing:3px }
.pv-mechanic-scan-caption { font-size:11px;font-weight:600;letter-spacing:.3px;line-height:1;color:#ffffffb3;margin-top:8px }
.pv-mechanic-scan-line { position:absolute;top:53%;left:9px;right:9px;height:2px;background:linear-gradient(90deg,transparent,#78C8FF99 20%,#fff 50%,#78C8FF99 80%,transparent) }
.pv-mechanic-fab { flex:none;width:64px;height:64px;border-radius:9999px;background:var(--pv-banner);color:#fff;box-shadow:0 6px 16px #1F62C94d }
.pv-mechanic-fab-disabled { background:var(--pv-border);color:var(--c-text-3);box-shadow:none }
.pv-mechanic-fab-pressed { transform:scale(.95) }
.pv-mechanic-choice { padding:10px 16px;border-radius:9999px;background:var(--pv-bg);border:1px solid var(--pv-border);font-size:13px;font-weight:500;white-space:nowrap }
.pv-mechanic-choice-selected { background:var(--c-primary);border-color:var(--c-primary);color:#fff;font-weight:700 }
.pv-mechanic-comment { display:flex;align-items:center;gap:8px;background:#fff;border-top:1px solid var(--pv-bg);padding:8px 8px 8px 16px;font-size:13px;font-weight:600 }
.pv-mechanic-comment-send { width:48px;height:48px;display:flex;align-items:center;justify-content:center;color:var(--c-primary);flex:none }
.pv-mechanic-comment .pv-mechanic-spinner { border-width:2px }
.pv-mechanic-filter { padding:9px 16px;border:1px solid var(--pv-border);border-radius:9999px;font-size:13px;font-weight:600;background:#fff;color:var(--c-text-2);white-space:nowrap }
.pv-mechanic-filter-active { background:var(--c-primary);border-color:var(--c-primary);color:#fff;font-weight:700 }
.pv-mechanic-input { padding:14px 16px;border-radius:12px;background:#fff;display:flex;align-items:center;gap:12px;font-size:14px;font-weight:400 }
.pv-mechanic-input-error { margin-top:6px;color:var(--c-danger);font-size:12px;font-weight:700;letter-spacing:1.2px }
.pv-mechanic-stepper { display:flex;flex:1;justify-content:space-between;align-items:center;padding:8px 10px;border-radius:12px;background:#fff;border:1px solid var(--pv-border);min-width:0 }
.pv-mechanic-step-control { width:40px;height:40px;border-radius:16px;display:flex;align-items:center;justify-content:center;flex:none }
.pv-mechanic-step-value { font-size:16px;font-weight:800 }
.pv-mechanic-bound { opacity:.4 }
.pv-mechanic-search { height:46px;display:flex;align-items:center;padding-left:14px;gap:9px;border:1px solid var(--pv-border);border-radius:14px;background:#fff;font-size:14px;font-weight:500;color:var(--c-text-3) }
.pv-mechanic-search .pv-mechanic-grow { color:var(--c-text) }
.pv-mechanic-search-clear { width:46px;height:46px;border-radius:16px;display:flex;align-items:center;justify-content:center }
.pv-mechanic-price-label { display:block;margin-bottom:6px;color:var(--c-text-3);font-size:12px;font-weight:500 }
.pv-mechanic-price-value { font-size:16px;font-weight:700 }
.pv-mechanic-price-toggle { display:flex;align-items:center;gap:4px;margin-top:8px;color:var(--c-primary);font-size:12px;font-weight:500 }
.pv-mechanic-collapsible-price-input .pv-mechanic-variants { height:56px;margin-top:12px }
.pv-mechanic-toolbar { display:flex;align-items:center;background:var(--pv-bg);border-top:.5px solid var(--pv-border);height:60px;padding:0 8px }
.pv-mechanic-quick-buttons { display:flex;align-items:center;gap:6px;flex:1 }
.pv-mechanic-quick { padding:11px 14px;border-radius:8px;background:#fff;border:1px solid var(--pv-border);font-size:17px;font-weight:700;white-space:nowrap }
.pv-mechanic-quick:nth-child(3) { margin-left:4px }
.pv-mechanic-toolbar-nav { width:44px;height:48px;display:flex;align-items:center;justify-content:center;flex:none }
.pv-mechanic-rarity-stage { display:flex;flex-direction:column;gap:10px;background:#1A1A2E;border-radius:12px;padding:10px 8px }
.pv-mechanic-rarity { display:inline-block;white-space:nowrap;padding:2px 8px;border-radius:4px;font-size:12px;font-weight:500;line-height:1.4 }
.pv-mechanic-rarity-common { background:var(--c-surface);color:var(--c-text-3) }
.pv-mechanic-rarity-rare { border:1px solid #60A5FA99;color:#60A5FA }
.pv-mechanic-rarity-epic { border:1px solid #8B5CF699;color:#8B5CF6 }
.pv-mechanic-rarity-legendary { border:1px solid #FFD700cc;color:#FFD700 }
.pv-mechanic-rarity-detail { padding:4px 12px;border-radius:16px;font-size:13px;font-weight:600 }
.pv-mechanic-rarity-rare.pv-mechanic-rarity-detail { box-shadow:0 0 8px #60A5FA80 }
.pv-mechanic-rarity-epic.pv-mechanic-rarity-detail { background:linear-gradient(135deg,#8B5CF6,#EC4899,#8B5CF6);border:0;color:#fff }
.pv-mechanic-rarity-legendary.pv-mechanic-rarity-detail { background:linear-gradient(90deg,#FFD700,#FF6B6B,#C084FC,#60A5FA,#34D399,#FFD700);border:0;color:#fff;font-weight:700;box-shadow:0 0 12px #FFD70099 }
.pv-mechanic-legendary-list { display:inline-flex;align-items:center;gap:2px;color:#FFD700 }
.pv-mechanic-action-card { height:107px;border-radius:18px;padding:20px 40px 20px 32px;background:var(--pv-gradient);display:flex;align-items:center;gap:15px;color:#fff }
.pv-mechanic-action-icon { width:65px;height:67px;display:flex;align-items:center;justify-content:center;flex:none }
.pv-mechanic-action-label { font-size:70px;font-weight:700;line-height:1;letter-spacing:-1.4px;font-variant-numeric:tabular-nums;white-space:nowrap }
.pv-mechanic-history { position:relative;display:flex;padding:20px;gap:20px;overflow:hidden }
.pv-mechanic-history::before { position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--c-success);content:"" }
.pv-mechanic-history-leading { width:56px;height:56px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:#EBFAF2;color:var(--c-success);flex:none }
.pv-mechanic-history-description { font-size:14px;font-weight:600 }
.pv-mechanic-history-footer { display:flex;gap:24px;margin-top:16px }
.pv-mechanic-history-footer .pv-mechanic-stack { gap:4px }
.pv-mechanic-overline { font-size:11px;font-weight:800;letter-spacing:1.2px;color:var(--c-text-2) }
.pv-mechanic-history-chevron { padding-top:12px;color:var(--c-text-3) }
.pv-mechanic-list-tile { min-height:64px;padding:16px;background:#fff;border:1.25px solid var(--pv-border);border-radius:12px;display:flex;align-items:center;gap:12px }
.pv-mechanic-list-tile > svg:last-child { margin-left:-4px;color:var(--c-text-3) }
.pv-mechanic-list-title { font-size:15px;font-weight:600 }
.pv-mechanic-list-subtitle { margin-top:2px;color:var(--c-text-2);font-size:13px;font-weight:400 }
.pv-mechanic-maintenance-card { padding:18px }
.pv-mechanic-date-divider { display:flex;align-items:center;gap:10px;padding-top:2px;margin-bottom:8px;color:var(--c-text-3);font-size:12.5px;font-weight:800 }
.pv-mechanic-date-line { height:1px;background:var(--pv-border);flex:1 }
.pv-mechanic-timeline-tile { width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex:none }
.pv-mechanic-timeline-name { font-size:15px;font-weight:800 }
.pv-mechanic-timeline-plate { font-size:12.5px;font-weight:400;color:var(--c-text-3);margin-top:2px }
.pv-mechanic-timeline-footer { display:flex;align-items:flex-end;gap:8px }
.pv-mechanic-timeline-item { font-size:14px;font-weight:700 }
.pv-mechanic-timeline-date { margin-top:3px;font-size:11.5px;font-weight:400;color:var(--c-text-3) }
.pv-mechanic-timeline-price { font-size:16px;font-weight:700;color:var(--c-primary);white-space:nowrap }
.pv-mechanic-profile-compact { padding:16px }
.pv-mechanic-profile-compact .pv-mechanic-avatar { width:56px;height:56px }
.pv-mechanic-profile-name { font-size:15px;font-weight:700;white-space:nowrap }
.pv-mechanic-profile-level { font-size:12px;font-weight:700;color:var(--c-primary);white-space:nowrap }
.pv-mechanic-profile-compact .pv-mechanic-rarity { margin-top:4px }
.pv-mechanic-profile-stats { display:flex;gap:6px;margin-top:12px;font-size:12px;font-weight:500 }
.pv-mechanic-stat-chip { padding:2px 8px;border-radius:4px;background:var(--c-surface);color:var(--c-text-3);white-space:nowrap }
.pv-mechanic-profile-mini { width:100px;padding:12px;border:1px solid var(--pv-border);border-radius:12px;background:#fff;display:flex;flex-direction:column;align-items:center }
.pv-mechanic-profile-mini .pv-mechanic-avatar { width:48px;height:48px }
.pv-mechanic-profile-mini-name { font-size:13px;font-weight:600;margin-top:8px }
.pv-mechanic-profile-mini .pv-mechanic-rarity { margin-top:4px }
.pv-mechanic-profile-full { padding:20px;border-radius:20px;background:linear-gradient(135deg,#BFDBFE,#93C5FD);box-shadow:0 4px 16px #60A5FA33 }
.pv-mechanic-profile-full .pv-mechanic-avatar { width:64px;height:64px;background:#ffffff4d }
.pv-mechanic-profile-full .pv-mechanic-profile-name { font-size:16px;font-weight:800 }
.pv-mechanic-profile-full > .pv-mechanic-row { gap:16px }
.pv-mechanic-profile-full .pv-mechanic-rarity { margin-top:4px }
.pv-mechanic-profile-story { margin-top:16px;padding:12px;border-radius:16px;background:#00000026;font-size:13px;font-style:italic }
.pv-mechanic-profile-variants { display:grid;grid-template-columns:48px 1fr;gap:8px;margin-top:4px }
.pv-mechanic-reservation { padding:16px }
.pv-mechanic-reservation-time { font-size:16px;font-weight:700;color:var(--c-primary) }
.pv-mechanic-reservation-date { font-size:11px;font-weight:400;color:var(--c-text-3);margin-top:3px }
.pv-mechanic-reservation .pv-mechanic-badge { padding:5px 10px }
.pv-mechanic-reservation-vehicle { margin-top:10px;font-size:18px;font-weight:800 }
.pv-mechanic-reservation-plate { margin-left:8px;font-size:13px;font-weight:600;color:var(--c-text-3) }
.pv-mechanic-reservation-model { margin-top:3px;font-size:12px;font-weight:400;color:var(--c-text-3) }
.pv-mechanic-reservation-item { display:flex;align-items:center;gap:10px;margin-top:10px;font-size:13px;font-weight:600 }
.pv-mechanic-reservation-customer { display:flex;align-items:center;gap:10px;margin-top:10px;font-size:12px;font-weight:500;color:var(--c-text-2) }
.pv-mechanic-reservation-actions { display:flex;gap:10px;margin-top:14px;border-top:1px solid #F1F5F9;padding-top:14px }
.pv-mechanic-reservation-actions .pv-mechanic-button { height:44px;border-radius:12px;font-size:14px }
.pv-mechanic-reservation-actions .pv-mechanic-primary { font-weight:800 }
.pv-mechanic-rail-entry { display:flex;gap:12px }
.pv-mechanic-rail { position:relative;width:20px;flex:none;padding-top:10px }
.pv-mechanic-rail::before { content:"";position:absolute;top:20px;bottom:-10px;left:9px;width:2px;background:var(--pv-border) }
.pv-mechanic-rail-last::before { bottom:calc(100% - 20px) }
.pv-mechanic-rail-dot { position:relative;display:flex;align-items:center;justify-content:center;width:20px;height:20px;border:2px solid #fff;border-radius:50%;box-shadow:0 1px 4px #21966140 }
.pv-mechanic-rail-card { flex:1;min-width:0;border:1.25px solid var(--pv-border);border-radius:12px;padding:12px 16px;margin-bottom:12px;background:#fff }
.pv-mechanic-rail-date { font-size:12px;font-weight:700;flex:1 }
.pv-mechanic-rail-card .pv-mechanic-badge { padding:4px 10px;font-size:12px;font-weight:700 }
.pv-mechanic-rail-title { font-size:14px;font-weight:700;margin-top:4px }
.pv-mechanic-rail-price { font-size:13px;font-weight:600;color:var(--c-text-3);margin-top:4px }
.pv-mechanic-vehicle-banner { padding:16px 18px;border-radius:16px;background:var(--pv-banner);box-shadow:0 8px 20px #1A56B047;color:#fff;display:flex;align-items:center;gap:14px }
.pv-mechanic-vehicle-initial { width:40px;height:40px;border-radius:12px;background:#ffffff2e;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:800;flex:none }
.pv-mechanic-vehicle-plate { font-size:15px;font-weight:700 }
.pv-mechanic-vehicle-subtitle { margin-top:2px;font-size:12px;font-weight:600;color:#F1F5F9d9 }
.pv-mechanic-maintenance-collapsed, .pv-mechanic-maintenance-expanded { display:flex;align-items:center;gap:16px;padding:16px 20px;background:linear-gradient(90deg,var(--c-primary),#1A56B0);color:#fff;border-radius:18px }
.pv-mechanic-maintenance-collapsed { margin-bottom:14px }
.pv-mechanic-maintenance-collapsed > svg:last-child { margin-left:-8px;color:#ffffffb3 }
.pv-mechanic-maintenance-expanded { border-radius:18px 18px 0 0 }
.pv-mechanic-maintenance-circle { width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#ffffff26;flex:none }
.pv-mechanic-maintenance-title { font-size:16px;font-weight:800 }
.pv-mechanic-maintenance-brand { font-size:13px;font-weight:600;color:#ffffffb3 }
.pv-mechanic-maintenance-eyebrow { font-size:12px;font-weight:500;color:#2E72D6;margin-bottom:4px }
.pv-mechanic-back-bar { display:flex;align-items:center;padding:6px 12px 10px;background:var(--pv-bg) }
.pv-mechanic-back-hit { width:40px;height:40px;display:flex;align-items:center;justify-content:center;flex:none }
.pv-mechanic-back-title { font-size:18px;font-weight:800;flex:1 }
.pv-mechanic-back-trailing { padding-right:10px }
.pv-mechanic-nav { display:flex;height:80px;border-top:1px solid #F1F5F9;border-radius:20px 20px 0 0;background:#fff }
.pv-mechanic-nav-cell { flex:1;display:flex;align-items:center;justify-content:center;min-width:0 }
.pv-mechanic-nav-tab { display:flex;flex-direction:column;align-items:center;padding:8px 12px;border-radius:16px;color:var(--c-text-3);gap:4px }
.pv-mechanic-nav-active { background:var(--c-surface);color:var(--c-primary) }
.pv-mechanic-nav-label { font-size:10px;font-weight:700;letter-spacing:.5px;line-height:1.5;white-space:nowrap }
.pv-mechanic-settings-row { display:flex;align-items:center;gap:13px;padding:15px 16px;background:#fff;border-bottom:1px solid #F1F5F9;font-size:14px;font-weight:700;line-height:1.5 }
.pv-mechanic-settings-icon { width:34px;height:34px;border-radius:10px;background:var(--c-surface);color:var(--c-primary);display:flex;align-items:center;justify-content:center;flex:none }
.pv-mechanic-settings-row > svg { color:#CBD5E1 }
.pv-mechanic-logo-bar { display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:var(--pv-bg);border-bottom:1px solid var(--c-surface) }
.pv-mechanic-logo-group { display:flex;align-items:center;gap:10px;color:var(--c-text-2) }
.pv-mechanic-logo-group:first-child > svg { color:var(--c-primary) }
.pv-mechanic-wordmark { font-size:20px;font-weight:900;letter-spacing:-1px;line-height:1.4;color:var(--c-primary-deep) }
.pv-mechanic-logo-bar .pv-mechanic-avatar { width:36px;height:36px;box-shadow:0 0 4px var(--pv-border) }
.pv-mechanic-state { padding:24px;display:flex;flex-direction:column;align-items:center;text-align:center }
.pv-mechanic-empty-icon { width:72px;height:72px;border-radius:50%;background:var(--c-surface);color:var(--c-text-3);display:flex;align-items:center;justify-content:center }
.pv-mechanic-error-icon { color:var(--c-danger) }
.pv-mechanic-state-title { font-size:16px;font-weight:800;margin-top:16px }
.pv-mechanic-state-description { font-size:14px;font-weight:400;color:var(--c-text-2);margin-top:8px }
.pv-mechanic-state-action { margin-top:20px;min-width:160px;width:100%;max-width:240px }
.pv-mechanic-error-state .pv-mechanic-button { height:52px;border-radius:16px;font-size:16px;font-weight:800;letter-spacing:.5px;box-shadow:0 4px 12px #1A56B04d }
.pv-mechanic-info-banner { display:flex;align-items:center;gap:12px;padding:12px 8px 12px 16px;border:1px solid;border-radius:12px }
.pv-mechanic-info-info { background:var(--c-surface);color:var(--c-primary);border-color:#1F62C94d }
.pv-mechanic-info-success { background:#EBFAF2;color:var(--c-success);border-color:#2196614d }
.pv-mechanic-info-warning { background:#FFF3E0;color:var(--c-warning);border-color:#C76A004d }
.pv-mechanic-info-error { background:#FCEDED;color:var(--c-danger);border-color:#EB57574d }
.pv-mechanic-info-title { font-size:14px;font-weight:600;color:var(--c-text) }
.pv-mechanic-info-description { margin-top:2px;font-size:13px;font-weight:400;color:var(--c-text-2) }
.pv-mechanic-info-dismiss { width:50px;height:50px;border-radius:16px;display:flex;align-items:center;justify-content:center;flex:none;color:var(--c-text-3) }
.pv-mechanic-info-variants { display:flex;gap:6px }
.pv-mechanic-info-variants .pv-mechanic-info-banner { flex:1;gap:6px;padding:12px 8px }
.pv-mechanic-info-variants .pv-mechanic-info-title { white-space:nowrap }
.pv-mechanic-bw-info-banner .pv-mechanic-variants { height:43px }
.pv-mechanic-loading-state { padding:24px;display:flex;flex-direction:column;align-items:center;color:var(--c-primary) }
.pv-mechanic-loading-state .pv-mechanic-spinner { border-width:3px }
.pv-mechanic-loading-message { margin-top:16px;font-size:13px;font-weight:600;color:var(--c-text-3);text-align:center }
.pv-mechanic-offline { display:flex;align-items:center;justify-content:center;gap:8px;background:var(--c-danger);color:#fff;padding:10px 12px;font-size:13px;font-weight:600 }
.pv-mechanic-scroll-window { position:relative;height:110px;border:1px dashed var(--pv-border);border-radius:12px;background:#fff;overflow:hidden }
.pv-mechanic-scroll-content { padding:0 12px }
.pv-mechanic-scroll-item { padding:12px 0;border-bottom:1px solid #F1F5F9;font-size:13px }
.pv-mechanic-scroll-hint { position:absolute;bottom:10px;left:calc(50% - 15px);width:30px;height:30px;border:1px solid var(--pv-border);border-radius:50%;background:#fff;box-shadow:0 3px 10px #08132A26;display:flex;align-items:center;justify-content:center;color:var(--c-primary) }
.pv-mechanic-toast { display:flex;align-items:center;gap:12px;border:1px solid currentColor;padding:14px 20px;border-radius:12px;font-size:14px;font-weight:600;flex:1 }
.pv-mechanic-toast-message .pv-mechanic-variants { height:39px }
.pv-mechanic-xp-stage { display:flex;flex-direction:column;align-items:center;gap:8px }
.pv-mechanic-xp-pill { display:flex;align-items:center;gap:4px;padding:8px 16px;background:#000000de;border-radius:20px;color:#FFD700;font-size:16px;font-weight:800;box-shadow:0 0 12px 1px #FFD70066 }
.pv-mechanic-xp-level { padding:12px 24px;background:var(--pv-gradient);border-radius:16px;box-shadow:0 0 20px 2px #1A56B080;text-align:center;color:#fff }
.pv-mechanic-xp-heading { font-size:20px;font-weight:900;letter-spacing:2px }
.pv-mechanic-xp-number { font-size:28px;font-weight:900;color:#FFD700;margin-top:4px }
.pv-mechanic-xp-caption { font-size:13px;font-weight:400;color:#ffffffcc;margin-top:4px }
.pv-mechanic-sheet { background:#fff;border-radius:20px 20px 0 0;padding-top:12px }
.pv-mechanic-sheet-header { padding:0 20px;display:flex;align-items:center;gap:12px;margin-bottom:20px }
.pv-mechanic-sheet-header > svg { color:var(--c-text-3) }
.pv-mechanic-menu-item { display:flex;align-items:center;gap:12px;padding:16px;border-bottom:1px solid var(--c-surface);font-size:15px;font-weight:500;color:var(--c-text) }
.pv-mechanic-menu-item > svg { color:var(--c-text-2) }
.pv-mechanic-menu-danger, .pv-mechanic-menu-danger > svg { color:var(--c-danger) }
.pv-mechanic-confirm { padding:24px;border-radius:20px;background:#fff;display:flex;flex-direction:column;align-items:center;text-align:center }
.pv-mechanic-confirm-icon { width:56px;height:56px;border-radius:50%;background:var(--pv-bg);color:var(--c-primary);display:flex;align-items:center;justify-content:center }
.pv-mechanic-confirm-title { margin-top:20px;font-size:18px;font-weight:800;line-height:1.56;letter-spacing:-.3px }
.pv-mechanic-confirm-description { margin-top:8px;font-size:14px;font-weight:400;color:var(--c-text-3) }
.pv-mechanic-confirm-actions { display:flex;gap:12px;width:100%;margin-top:20px }
.pv-mechanic-overlay-scene { position:relative;height:120px;overflow:hidden;border-radius:12px;background:#fff }
.pv-mechanic-overlay-underlay { padding:12px;display:flex;flex-direction:column;gap:12px;color:var(--c-text-2) }
.pv-mechanic-overlay-dim { position:absolute;inset:0;background:#00000054 }
.pv-mechanic-overlay-box { position:absolute;left:calc(50% - 80px);top:calc(50% - 80px);width:160px;height:160px;transform:scale(.65);border:1px solid var(--c-surface);border-radius:18px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--c-primary) }
.pv-mechanic-overlay-box .pv-mechanic-spinner { border-width:3px }
.pv-mechanic-overlay-message { margin-top:16px;font-size:13px;font-weight:500;color:var(--c-text-2) }
.pv-mechanic-reason-sheet .pv-mechanic-sheet-header { margin-bottom:16px }
.pv-mechanic-reason { padding:16px 20px;border-bottom:1px solid var(--c-surface);display:flex;align-items:center;gap:12px;color:var(--c-text-2);font-size:15px;font-weight:500 }
.pv-mechanic-radio { width:20px;height:20px;border:2px solid var(--c-text-3);border-radius:50%;flex:none }
.pv-mechanic-reason-selected { font-weight:700;color:var(--c-text) }
.pv-mechanic-reason-selected .pv-mechanic-radio { border-color:var(--c-primary);background:radial-gradient(circle,var(--c-primary) 0 5px,transparent 5.5px) }
.pv-mechanic-reason-actions { display:flex;gap:12px;padding:20px }
.pv-mechanic-profile-sheet { padding:20px 24px 24px;border-radius:20px 20px 0 0;background:var(--pv-bg) }
.pv-mechanic-profile-metric, .pv-mechanic-profile-review { margin-top:16px;padding:20px;border:1px solid var(--pv-border);border-radius:18px;background:#fff;font-size:14px;font-weight:700 }
.pv-mechanic-temperature { font-size:18px;font-weight:700;color:var(--c-primary) }
.pv-mechanic-gauge { height:8px;border-radius:9999px;background:var(--c-surface);margin-top:10px;overflow:hidden }
.pv-mechanic-gauge-fill { width:72%;height:100%;background:var(--c-primary);border-radius:9999px }
.pv-mechanic-review-stars { font-size:14px;color:#F5C842;letter-spacing:1px;white-space:nowrap }
.pv-mechanic-review-text { font-size:13px;font-weight:600;color:var(--c-text-2);margin-top:4px }
.pv-mechanic-unlock-scene { position:relative;display:flex;justify-content:center;padding:12px 0;background:#0000008a;border-radius:20px }
.pv-mechanic-unlock { position:relative;width:280px;padding:32px 24px;border:1px solid #FFD7004d;border-radius:20px;background:#1A1A2E;text-align:center }
.pv-mechanic-unlock-particles { position:absolute;top:0;left:0;right:0;text-align:center;font-size:30px;letter-spacing:20px;color:#FFD700 }
.pv-mechanic-unlock-heading { font-size:16px;font-weight:800;color:#FFD700 }
.pv-mechanic-unlock-badge { margin-top:24px }
.pv-mechanic-unlock-description { margin:16px 0 24px;font-size:13px;font-weight:600;color:#ffffffb3 }
.pv-mechanic-unlock-cta { height:50px;border-radius:12px;background:#FFD700;color:#fff;font-size:15px;font-weight:700 }
.pv-mechanic-unlock-later { margin-top:12px;font-size:14px;color:#ffffff8a }
.pv-mechanic-amount-row { display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:14px;font-weight:600 }
.pv-mechanic-bw-amount-row { display:flex;flex-direction:column;gap:8px }
.pv-mechanic-amount-label { color:var(--c-text-2) }
.pv-mechanic-amount-highlight .pv-mechanic-amount-label { font-size:16px;font-weight:700;color:var(--c-text) }
.pv-mechanic-amount-highlight .pv-mechanic-amount-value { font-size:18px;font-weight:700;line-height:1.56;letter-spacing:-.3px;color:var(--c-primary) }
.pv-mechanic-reservation-row-item { display:flex;align-items:center;gap:8px;padding:4px 0;font-size:12px;font-weight:600 }
.pv-mechanic-row-time { width:64px;flex:none;color:var(--c-primary) }
.pv-mechanic-row-vehicle { width:120px;flex:none;white-space:nowrap }
.pv-mechanic-row-service { flex:1;min-width:0;font-size:12px;font-weight:500;color:var(--c-text-3) }
.pv-mechanic-section-heading { display:flex;align-items:center;gap:12px }
.pv-mechanic-section-marker { width:6px;height:24px;border-radius:9999px;background:var(--c-primary);flex:none }
.pv-mechanic-section-heading-title { font-size:22px;font-weight:800;line-height:1.4;flex:1;white-space:nowrap }
.pv-mechanic-section-action { font-size:14px;font-weight:600;color:var(--c-primary);white-space:nowrap }
.pv-mechanic-simple-heading { font-size:16px;font-weight:700 }
.pv-mechanic-section-label-text { padding:0 8px;font-size:11px;font-weight:800;line-height:1.3;letter-spacing:1.2px;color:var(--c-text-2) }
.pv-mechanic-pressable-main { display:flex;align-items:center;gap:12px;padding:12px;background:#fff;border:1px solid var(--pv-border);border-radius:12px;box-shadow:inset 0 0 0 100px #0000000d }
.pv-mechanic-chip-pressed { transform:scale(.97);box-shadow:inset 0 0 0 100px #0000000d }
.pv-mechanic-pressable-icon { width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:50%;background:#0000000d }
.pv-mechanic-pressable-text { opacity:.55;font-size:14px;color:var(--c-primary);white-space:nowrap }
.pv-mechanic-glyphs { display:flex;align-items:center;gap:24px;color:#111 }
.pv-mechanic-glyph { display:flex;flex-direction:column;gap:8px }
.pv-mechanic-glyph > svg { height:20px;width:auto;max-width:90px }
.pv-mechanic-glyph-fallback { display:flex;align-items:center;gap:8px;margin-top:16px }
/* end mechanic previews */

/* Keep 20px card gutters and both default 220px ChartRow columns visible. */
.pv-web-frame { max-width: 240px; }
.pv-web-chart-container-row-scale { width: 208%; }
.pv-web-chart-container-row-grid { transform: scale(.48076923); }

/* Rider layout corrections after catalog render validation. */
.p-rider-v2.pv:has(> .pv-rider-preview){width:100%;max-width:240px;min-width:0}
.pv-rider-bw-primary-cta-v2 .pv-rider-spinner{color:#FFFFFF}
.pv-rider-notification>.pv-rider-row{align-items:flex-start}
.pv-rider-notification .pv-rider-unread-dot{margin-top:8px}
.pv-rider-notification .pv-rider-grow>b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pv-rider-bw-mileage-chart .pv-rider-mileage-plot{margin-top:12px}


/* mechanic preview fidelity: AppColors.bgSurface is the blue soft token. */
.pv-mechanic-icon-tile { display:flex;align-items:center;justify-content:center;flex:none;background:var(--c-primary-soft);color:var(--c-primary);width:40px;height:40px;border-radius:12px }
.pv-mechanic-avatar { display:flex;align-items:center;justify-content:center;background:var(--c-primary-soft);color:var(--c-text-3);border-radius:50%;flex:none }
.pv-mechanic-accept-button .pv-mechanic-disabled { background:var(--c-primary-soft) }
.pv-mechanic-ghost-button .pv-mechanic-inactive { color:var(--c-text-3);border-color:var(--c-primary-soft) }
.pv-mechanic-reject-button .pv-mechanic-inactive { background:var(--c-primary-soft);color:var(--c-text-3) }
.pv-mechanic-rarity-common { background:var(--c-primary-soft);color:var(--c-text-3) }
.pv-mechanic-stat-chip { padding:2px 8px;border-radius:4px;background:var(--c-primary-soft);color:var(--c-text-3);white-space:nowrap }
.pv-mechanic-nav-active { background:var(--c-primary-soft);color:var(--c-primary) }
.pv-mechanic-settings-icon { width:34px;height:34px;border-radius:10px;background:var(--c-primary-soft);color:var(--c-primary);display:flex;align-items:center;justify-content:center;flex:none }
.pv-mechanic-logo-bar { display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:var(--pv-bg);border-bottom:1px solid var(--c-primary-soft) }
.pv-mechanic-empty-icon { width:72px;height:72px;border-radius:50%;background:var(--c-primary-soft);color:var(--c-text-3);display:flex;align-items:center;justify-content:center }
.pv-mechanic-info-info { background:var(--c-primary-soft);color:var(--c-primary);border-color:#1F62C94d }
.pv-mechanic-menu-item { display:flex;align-items:center;gap:12px;padding:16px;border-bottom:1px solid var(--c-primary-soft);font-size:15px;font-weight:500;color:var(--c-text) }
.pv-mechanic-overlay-box { position:absolute;left:calc(50% - 80px);top:calc(50% - 80px);width:160px;height:160px;transform:scale(.65);border:1px solid var(--c-primary-soft);border-radius:18px;background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--c-primary) }
.pv-mechanic-reason { padding:16px 20px;border-bottom:1px solid var(--c-primary-soft);display:flex;align-items:center;gap:12px;color:var(--c-text-2);font-size:15px;font-weight:500 }
.pv-mechanic-gauge { height:8px;border-radius:9999px;background:var(--c-primary-soft);margin-top:10px;overflow:hidden }
.pv-mechanic-rail-dot.pv-mechanic-tone-success { background:var(--pv-banner);box-shadow:0 1px 4px #1F62C940; }
.pv-mechanic-rail-dot.pv-mechanic-tone-info { background:var(--c-primary);box-shadow:0 1px 4px #1F62C940; }
.pv-mechanic-rail-date { color:var(--c-text-2); }
.pv-mechanic-rail-bottom { display:flex;align-items:center;gap:8px;margin-top:8px; }
.pv-mechanic-rail-bottom .pv-mechanic-rail-price { flex:1;margin-top:0; }
.pv-mechanic-bw-info-banner .pv-mechanic-info-title { max-width:100%; }
.pv-mechanic-bw-maintenance-timeline > .pv-mechanic-variants, .pv-mechanic-reservation-card > .pv-mechanic-variants { height:24px; }
.pv-mechanic-collapsible-price-input > .pv-mechanic-variants { height:48px; }
/* Mascot previews live inside the catalog's own button. */
.pv-web-mascots { display:flex; align-items:center; justify-content:center; gap:20px; }
.pv-web-mascots img { width:96px; height:120px; object-fit:contain; }

/* web previews 보강 — 2026-09-23 추가분(부품 커머스·견적 작성·3D 견적·커뮤니티). */
.pv-web-sentence { white-space: pre-line; overflow-wrap: anywhere; font-size: 14px; line-height: 1.43; margin-bottom: 8px; }
.pv-web-part-thumb { display: inline-flex; align-items: center; justify-content: center; width: 88px; height: 88px; flex-shrink: 0; border: 1px solid var(--c-border); border-radius: 8px; background: var(--c-bg); color: var(--c-text-3); font-size: 11px; text-align: center; }
.pv-web-part-thumb-empty { border-style: dashed; }
.pv-web-comment-list { display: flex; flex-direction: column; gap: 10px; }
.pv-web-comment { display: grid; grid-template-columns: auto 1fr; align-items: baseline; gap: 2px 6px; padding-top: 8px; border-top: 1px solid var(--c-border); font-size: 13px; }
.pv-web-comment b { font-weight: 600; }
.pv-web-comment p { grid-column: 1 / -1; margin: 0; color: var(--c-text-2); }
.pv-web-estimate-status { display: flex; flex-wrap: wrap; gap: 6px; }
.pv-web-estimate-status > span { display: inline-flex; align-items: center; justify-content: center; min-width: 48px; height: 22px; padding-inline: 8px; border-radius: 10px; font-size: 12px; font-weight: 600; line-height: 1; white-space: nowrap; }
.pv-web-est-draft { background: #f1f5f9; color: #475569; }
.pv-web-est-completed { background: #e9f7ee; color: #15803d; }
.pv-web-est-sent { background: #e3f2fd; color: #1565c0; }
.pv-web-est-rejected { background: #fdecec; color: #b91c1c; }
.pv-web-est-expired { background: #fff5e3; color: #b45309; }
.pv-web-order-status { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
.pv-web-combobox, .pv-web-vehicle-editor { display: flex; flex-direction: column; gap: 6px; }
.pv-web-suggest { border: 1px solid var(--c-border); border-radius: 8px; background: var(--c-surface); box-shadow: var(--pv-web-shadow); overflow: hidden; }
.pv-web-suggest-head { display: flex; align-items: center; justify-content: space-between; padding: 6px 10px; background: var(--c-bg); color: var(--c-text-3); font-size: 11px; }
.pv-web-suggest-option { display: block; padding: 7px 10px; font-size: 13px; color: var(--c-text); }
.pv-web-suggest-option small { display: block; color: var(--c-text-3); font-size: 11px; }
.pv-web-suggest-active { background: var(--c-primary-soft); color: var(--c-primary); }
.pv-web-suggest-status { padding: 8px 10px; border-top: 1px solid var(--c-border); color: var(--c-text-3); font-size: 12px; }
.pv-web-cart-destination { display: flex; flex-direction: column; gap: 6px; padding: 12px; border: 1px solid var(--c-border); border-radius: 10px; }
.pv-web-cart-destination p { margin: 0; }
.pv-web-segment { display: inline-flex; gap: 4px; padding: 3px; border: 1px solid var(--c-border); border-radius: 10px; background: var(--c-surface); }
.pv-web-segment-item { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 8px; color: var(--c-text-2); font-size: 14px; font-weight: 600; white-space: nowrap; }
.pv-web-segment-active { background: var(--c-primary); color: #fff; }
.pv-web-pro-pill { padding: 1px 5px; border-radius: 9999px; background: var(--c-primary-soft); color: var(--c-primary); font-size: 10px; font-style: normal; font-weight: 700; }
.pv-web-segment-active .pv-web-pro-pill { background: rgba(255,255,255,.22); color: #fff; }
.pv-web-uploader { display: flex; flex-direction: column; gap: 8px; }
.pv-web-uploader-drop { padding: 16px 12px; border: 1px dashed var(--c-primary); border-radius: 8px; background: var(--c-primary-soft); color: var(--c-primary); font-size: 12px; text-align: center; }
.pv-web-toolbar { display: flex; flex-direction: column; gap: 6px; }
.pv-web-toolbar-label { color: var(--c-text-3); font-size: 12px; font-weight: 600; }
.pv-web-toolbar-danger { color: var(--c-danger); }
.pv-web-chip { padding: 4px 10px; border: 1px solid var(--c-border); border-radius: 9999px; background: var(--c-surface); color: var(--c-text-2); font-size: 12px; white-space: nowrap; }
.pv-web-chip-active { border-color: var(--c-primary); background: var(--c-primary); color: #fff; }
.pv-web-chip-off { opacity: .45; }
.pv-web-mode-toggle { display: inline-flex; gap: 2px; padding: 2px; border-radius: 8px; background: #f1f5f9; }
.pv-web-mode-item { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 32px; border-radius: 6px; color: var(--c-text-3); font-size: 14px; }
.pv-web-mode-active { background: #fff; color: var(--c-primary); box-shadow: 0 1px 2px rgba(0,0,0,.08); }
.pv-web-count-badge { padding: 1px 7px; border-radius: 9999px; background: var(--c-primary-soft); color: var(--c-primary); font-size: 11px; font-weight: 600; }
.pv-web-group-heading { display: flex; align-items: center; gap: 12px; }
.pv-web-group-image { display: inline-flex; align-items: center; justify-content: center; width: 84px; height: 56px; flex-shrink: 0; border-radius: 10px; background: #f4f7fb; color: var(--c-text-3); font-size: 11px; }
.pv-web-group-heading strong { display: block; font-size: 14px; font-weight: 600; }
.pv-web-group-heading p { margin: 2px 0; }
.pv-web-item-rows table { width: 100%; border-collapse: collapse; font-size: 12px; }
.pv-web-item-rows th { padding: 6px 4px; border-bottom: 1px solid var(--c-border); background: var(--c-bg); color: var(--c-text-2); font-weight: 600; text-align: left; }
.pv-web-item-rows td { padding: 7px 4px; border-bottom: 1px solid var(--c-border); vertical-align: top; }
.pv-web-item-rows td small { display: block; color: var(--c-danger); font-size: 10px; }
.pv-web-item-rows tbody td:last-child, .pv-web-item-rows tfoot td:last-child { text-align: right; font-variant-numeric: tabular-nums; }
.pv-web-item-rows tfoot td { border-bottom: 0; font-weight: 700; }
.pv-web-order-lines { display: flex; flex-direction: column; gap: 8px; }
.pv-web-notes { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.pv-web-note { width: 100%; margin: 0; padding: 8px 10px; border-radius: 8px; background: var(--c-primary-soft); color: var(--c-primary-deep); font-size: 13px; }
.pv-web-note-error { background: #fdecec; color: #b91c1c; }
.pv-web-error-screen { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; min-height: 124px; padding: 16px; border-radius: 12px; background: var(--c-bg); text-align: center; }
.pv-web-error-screen strong { font-size: 16px; font-weight: 600; }
.pv-web-dock { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.pv-web-dock-panel { display: flex; flex-direction: column; gap: 6px; width: 100%; padding: 10px; border: 1px solid var(--c-border); border-radius: 12px; background: var(--c-surface); box-shadow: var(--pv-web-shadow); }
.pv-web-dock-panel strong { font-size: 14px; font-weight: 600; }
.pv-web-dock-entry { display: inline-flex; align-items: center; padding: 8px 14px; border-radius: 9999px; background: var(--c-primary); color: #fff; font-size: 13px; font-weight: 600; box-shadow: var(--pv-web-shadow); }
.pv-web-shell { display: flex; flex-direction: column; gap: 10px; }
.pv-web-shell strong { font-size: 18px; font-weight: 700; }
.pv-web-eyebrow { color: var(--c-primary); font-size: 11px; font-weight: 600; letter-spacing: .5px; }
.pv-web-panel { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 12px; border: 1px solid var(--c-border); border-radius: 16px; background: var(--c-surface); }
.pv-web-panel strong { font-size: 14px; font-weight: 600; }
.pv-web-panel > .pv-web-between, .pv-web-panel > .pv-web-row { width: 100%; }
.pv-web-part-row { display: flex; flex-direction: column; gap: 2px; width: 100%; padding: 6px 0; border-top: 1px solid var(--c-border); font-size: 12px; }
.pv-web-part-row code { color: var(--c-text-3); font-size: 11px; }
.pv-web-layout { display: grid; gap: 6px; }
.pv-web-layout-stack { display: flex; flex-direction: column; gap: 8px; }
.pv-web-layout-workspace, .pv-web-layout-side { grid-template-columns: 1.4fr 1fr; }
.pv-web-layout-cell { display: flex; align-items: center; justify-content: center; min-height: 52px; padding: 8px; border: 1px dashed var(--c-border); border-radius: 8px; background: var(--c-surface); color: var(--c-text-3); font-size: 12px; text-align: center; }
.pv-web-layout-viewer { border-color: var(--c-primary); background: var(--c-primary-soft); color: var(--c-primary); }
.pv-web-layout-wide { grid-column: 1 / -1; min-height: 40px; }

/* MenuBar · ChipGroup · ChoiceTile (2026-09-28, 부품 구매 첫 화면) */
.pv-web-menu-bar-bar { display: flex; align-items: center; gap: 2px; min-height: 40px; padding: 0 4px; border-bottom: 1px solid var(--c-border); border-radius: 10px 10px 0 0; background: var(--c-surface); }
.pv-web-menu-bar-item { display: inline-flex; align-items: center; gap: 4px; height: 40px; padding: 0 8px; border-bottom: 3px solid transparent; color: var(--c-text); font-size: 13px; font-weight: 600; white-space: nowrap; }
.pv-web-menu-bar-active { border-bottom-color: var(--c-primary); color: var(--c-primary); font-weight: 700; }
.pv-web-menu-bar-search { margin-left: auto; padding: 4px 8px; border: 1px solid var(--c-border); border-radius: 8px; color: var(--c-text-3); font-size: 11px; white-space: nowrap; }
.pv-web-menu-bar-panel { padding: 12px; border: 1px solid var(--c-border); border-top: 0; border-radius: 0 0 10px 10px; background: var(--c-surface); color: var(--c-text-3); font-size: 12px; box-shadow: var(--pv-web-shadow); }
.pv-web-chip-group { display: flex; flex-wrap: wrap; gap: 8px; }
.pv-web-chip { display: inline-flex; flex-direction: column; justify-content: center; min-height: 36px; padding: 6px 14px; border: 1px solid var(--c-border); border-radius: 999px; background: var(--c-surface); color: var(--c-text); font-size: 14px; font-weight: 500; line-height: 1.3; white-space: nowrap; }
.pv-web-chip small { font-size: 11px; font-weight: 400; color: var(--c-text-3); }
.pv-web-chip-selected { border-color: var(--c-primary); background: var(--c-primary-soft); color: var(--c-primary); font-weight: 700; }
.pv-web-choice-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.pv-web-choice-tile { display: flex; align-items: center; gap: 10px; padding: 10px; border: 1px solid var(--c-border); border-radius: 14px; background: var(--c-surface); }
.pv-web-choice-tile-selected { border-color: var(--c-primary); background: var(--c-primary-soft); box-shadow: 0 0 0 1px var(--c-primary) inset; }
.pv-web-choice-tile-media { width: 40px; height: 40px; flex-shrink: 0; border-radius: 10px; background: var(--c-bg, #f1f5f9); }
.pv-web-choice-tile-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pv-web-choice-tile-text b { font-size: 14px; font-weight: 700; }
.pv-web-choice-tile-text small { font-size: 11px; color: var(--c-text-3); }
.pv-web-callout-figure { position: relative; height: 110px; border: 1px solid var(--c-border); border-radius: 12px; background: var(--c-surface); overflow: hidden; color: var(--c-text-2); }
.pv-web-callout-art { position: absolute; inset: 0; width: 100%; height: 100%; }
.pv-web-callout { position: absolute; width: 24px; height: 24px; margin: -12px 0 0 -12px; box-sizing: border-box; border: 2px solid var(--c-primary); border-radius: 9999px; background: transparent; }
.pv-web-callout-active { border-width: 3px; background: color-mix(in srgb, var(--c-primary) 35%, transparent); box-shadow: 0 0 0 2px #fff; }
.pv-web-callout-colour { border-color: #B3121F; }
.pv-web-swatches { display: flex; flex-wrap: wrap; gap: 8px; }
.pv-web-swatch { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 5px 12px 5px 6px; border: 1px solid var(--c-border); border-radius: 9999px; background: var(--c-surface); font-size: 14px; }
.pv-web-swatch i { width: 26px; height: 26px; border-radius: 9999px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.18); }
.pv-web-swatch-unknown { background: repeating-linear-gradient(45deg, #d9dee5 0 4px, #f4f6f8 4px 8px); }
.pv-web-swatch b { display: flex; flex-direction: column; font-weight: 500; }
.pv-web-swatch small { font-size: 11px; color: var(--c-text-3); }
.pv-web-swatch-selected { border-color: var(--c-primary); background: var(--c-primary-soft); }
.pv-web-swatch-selected b { font-weight: 700; }