/* Mobile presentation only. No routes, controls or business rules are changed. */
:root {
  --brand:#0756ce;
  --brand-deep:#102c50;
  --brand-bg:#edf4ff;
  --page:#f3f6fb;
  --line:#e3eaf3;
  --t1:#203047;
  --t2:#52627a;
  --t3:#617189;
  --r:16px;
  --r-control:10px;
  --shadow:0 4px 18px rgba(24,55,96,.045);
}
html {scroll-padding-top:100px;-webkit-text-size-adjust:100%}
body {line-height:1.65}
button,a,input,select,textarea {-webkit-tap-highlight-color:transparent}
.m-app {padding-bottom:calc(82px + var(--safe-bottom))}
.m-header {
  height:auto;min-height:68px;
  padding:calc(10px + env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-right)) 10px max(16px,env(safe-area-inset-left));
  gap:8px;background:rgba(255,255,255,.97);
  box-shadow:0 2px 14px rgba(24,55,96,.035);
}
.m-brand {gap:11px}
.m-brand img {width:42px;height:42px;border-radius:11px;flex:none}
.m-brand b {font-size:16px;line-height:1.5}
.m-brand small {font-size:11px;color:var(--t2)}
.icon-btn {border-radius:12px;flex-shrink:0}
#headerAction {background:var(--brand-bg)}
.m-main {padding:18px max(16px,env(safe-area-inset-right)) 28px max(16px,env(safe-area-inset-left))}
.page-head {margin:2px 0 20px;align-items:center}
.page-head>div {min-width:0}
.page-head h1 {font-size:24px;line-height:1.4;letter-spacing:-.4px}
.page-head p {font-size:13px;margin-top:5px}
.section-title {font-size:17px;margin:24px 0 12px;gap:12px}
.section-title a {flex-shrink:0;font-size:13px}
.bottom-nav {
  height:calc(68px + var(--safe-bottom));
  padding:6px max(8px,env(safe-area-inset-right)) var(--safe-bottom) max(8px,env(safe-area-inset-left));
  box-shadow:0 -5px 24px rgba(24,55,96,.06);
}
.nav-item {position:relative;border-radius:12px;font-size:11px;gap:4px;color:var(--t2)}
.nav-item.active {background:var(--brand-bg);color:var(--brand)}
.nav-item.active:before {content:'';position:absolute;top:0;width:18px;height:3px;border-radius:0 0 3px 3px;background:var(--brand)}
.mobile-carousel {margin:0;border-radius:20px;box-shadow:0 8px 22px rgba(16,44,80,.12)}
.carousel-slide {height:238px}
.carousel-slide>div {padding:64px 20px 24px;background:linear-gradient(transparent,rgba(9,29,57,.94))}
.carousel-slide h1 {font-size:25px;line-height:1.4;max-width:17em}
.carousel-slide p {font-size:13px;line-height:1.7;color:#edf4ff}
.carousel-controls {height:46px}
.carousel-controls button {height:44px;border-radius:10px}
.hero-mobile {border-radius:20px;padding:24px 20px}
.mobile-shortcuts {gap:10px;padding:0}
.mobile-shortcuts button {
  min-height:100px;padding:14px 6px;border:1px solid var(--line);border-radius:16px;
  gap:9px;box-shadow:var(--shadow);
}
.mobile-shortcuts .mobile-icon {width:40px;height:40px;padding:8px;border-radius:12px;background:var(--brand-bg)}
.mobile-shortcuts span {font-size:13px;font-weight:600}
.mobile-shortcuts button:nth-child(3n+2) .mobile-icon {filter:none}
.list-stack {gap:14px}
.card,.list-card,.filter-block,.profile-block,.plan,.quick-item,.stat,.faq-item,.menu-list {border-radius:16px;box-shadow:var(--shadow)}
.list-card,.cargo-compact {padding:17px}
.card-top {gap:10px}
.card-top>div {flex:1}
.card-top>.badge {white-space:normal;max-width:42%;text-align:center;line-height:1.5}
.card-top .route-link,.list-card .route {font-size:17px;line-height:1.55}
.card-sub {line-height:1.65}
.card-kv {gap:12px;margin:16px 0;padding:12px;background:#f6f8fc;border-radius:10px}
.card-kv small,.card-kv b {font-size:12px}
.card-kv b {font-size:14px}
.card-actions {gap:10px;margin-top:16px}
.card-actions .btn {min-width:0;flex:1 1 105px}
.cargo-summary {margin-top:10px;line-height:1.7}
.cargo-labels,.tag-row {gap:6px}
.cargo-bottom {flex-wrap:wrap;gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid var(--line);font-size:12px}
.cargo-bottom .btn {padding:8px 14px;flex-shrink:0}
.tag,.badge {border-radius:6px;padding:4px 8px;line-height:1.55}
.cargo-compact .badge {font-size:11px;padding:4px 7px}
.provider-rail {padding:2px 2px 12px;gap:12px;scroll-padding-inline:2px}
.provider-rail>.list-card {flex-basis:90%}
.provider-metrics {padding:12px 0;border-block:1px solid var(--line);margin:14px 0 10px}
.provider-metrics b {font-size:24px;line-height:1.4}
.provider-metrics small,.provider-metrics span {font-size:12px}
.btn {border-radius:10px;line-height:1.5;min-height:46px;padding:11px 15px}
.btn-sm {min-height:44px}
.btn-primary {box-shadow:0 3px 8px rgba(7,86,206,.14)}
.btn-outline {border-color:#ccd8e8;color:var(--brand-deep)}
.btn:active:not(:disabled),.quick-item:active,.mobile-shortcuts button:active {filter:brightness(.96)}
.btn:disabled {box-shadow:none}
.filter-block {padding:14px}
.mobile-filters .search-row {border-radius:12px;box-shadow:var(--shadow);align-items:center;overflow:hidden}
.mobile-filters .search-row input {min-height:48px}
.segmented,.faq-tabs {gap:8px;padding:4px 2px 12px}
.segmented button,.faq-tabs button {border-radius:10px;border-color:var(--line);min-height:44px}
.segmented button.on {background:var(--brand);border-color:var(--brand);color:white}
.filter-summary details[open] {border-radius:12px}
.mobile-filter-tags button {min-height:44px;border-radius:8px;padding:8px 10px}
.field-control,.field input:not([type=checkbox]):not([type=radio]),.field select,.field textarea,
.m-app .v10 input:not([type=checkbox]):not([type=radio]),.m-app .v10 select,.m-app .v10 textarea,
.sheet-body .v10 input:not([type=checkbox]):not([type=radio]),.sheet-body .v10 select,.sheet-body .v10 textarea,
.business-field input,.business-field select {
  font-size:16px;min-height:48px;border-radius:10px;border-color:#c8d4e4;line-height:1.5;
}
.field input[type=checkbox],.field input[type=radio] {width:20px;min-height:20px;height:20px;padding:0;flex:none;accent-color:var(--brand)}
.field label,.field>span,.mp-field-label {font-size:13px}
.form-stack {gap:18px}
.form-grid,.filter-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.form-note,.form-error,.notice,.mobile-remark,.billing-total-mobile {border-radius:10px;padding:13px;line-height:1.75}
.stat {padding:17px;min-height:112px}
.stat small {font-size:13px}.stat b {font-size:30px;line-height:1.35;font-variant-numeric:tabular-nums}
.stat-grid {gap:12px}
.mobile-todos {border:1px solid var(--line);border-radius:16px;overflow:hidden}
.mobile-todos>button {padding:16px;min-height:64px}
.mobile-todos>button>div {min-width:0;overflow-wrap:anywhere}
.plan {padding:20px}
.mobile-plan-rail {grid-auto-columns:85%;gap:12px;padding:4px 2px 16px;scroll-padding-inline:2px}
.mobile-plan-rail .plan {padding:20px;box-shadow:var(--shadow)}
.mobile-plan-rail .featured {border-color:var(--brand);background:linear-gradient(145deg,#eef5ff,#fff)}
.mobile-plan-rail h2 {font-size:19px}
.mobile-plan-rail .plan-price {font-size:28px;line-height:1.5;margin:10px 0}
.mobile-plan-rail .benefits,.mobile-plan-rail .btn {font-size:14px}
.membership-account,.trial-plan {background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px}
.comparison-scroll {border-radius:12px}
.comparison-scroll th:first-child {z-index:1}
.empty,.error-state {border-radius:16px;padding:36px 18px;line-height:1.8}
.empty {background:#fff;border:1px dashed #cdd9e8}
.empty b {font-size:16px}
.bottom-sheet {border-radius:22px 22px 0 0;max-height:calc(100dvh - env(safe-area-inset-top,0px) - 24px)}
.sheet-mask {background:rgba(11,29,54,.48)}
.sheet-grip {margin-top:10px;width:36px;background:#cbd6e4}
.sheet-head {padding:8px 12px 10px 20px;gap:8px;min-height:62px}
.sheet-head h2 {font-size:18px;line-height:1.5}
.sheet-head .icon-btn {background:#f3f6fb}
.sheet-body {padding:20px 20px calc(24px + var(--safe-bottom));scroll-padding-block:16px}
.detail-item {border-radius:10px;padding:13px}
.mobile-form-actions {bottom:calc(68px + var(--safe-bottom));padding-block:12px;box-shadow:0 -4px 16px rgba(24,55,96,.05)}
.keyboard-open .mobile-form-actions {bottom:var(--keyboard-offset)}
.m-main[data-view=publish] {padding-bottom:120px}
#toast.toast-stack {top:calc(80px + env(safe-area-inset-top,0px));left:50%;right:auto;transform:translateX(-50%);width:calc(100% - 32px);max-width:440px}
.toast-item {border-radius:12px;line-height:1.7}
.mp-identity,.mp-guest {padding:20px;background:linear-gradient(135deg,#eaf2ff,#fff);border:1px solid #dce7f7;border-radius:18px;gap:12px}
.mp-identity h1,.mp-guest h1 {font-size:21px;line-height:1.5}
.mp-avatar {width:60px;height:60px;border:3px solid #fff;box-shadow:0 3px 12px rgba(24,55,96,.07)}
.mp-group,.mp-details {border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);margin-top:16px}
.mp-group {padding:0 16px}
.mp-row {min-height:60px;padding:15px 0;line-height:1.5}
.mp-group>h2 {padding-top:16px;font-size:14px;color:var(--t2)}
.mp-stats {padding:14px 4px;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow)}
.mp-stats b {font-size:26px}
.mp-level,.mp-shipper-badge,.mp-tags span {border-radius:9px}
.mp-quota {gap:8px;padding:12px 0;line-height:1.6}
.mp-details summary {padding:16px;min-height:60px}
.mp-details-body {padding:18px 16px}
.mp-company>.mp-details {box-shadow:none;border:0;border-radius:0}
.mp-company>.mp-details summary {padding-left:0;padding-right:0}
.mp-features {gap:18px 12px;padding:24px 4px}
.mp-features small {font-size:12px}
.mp-demo-account {min-height:70px}
.mp-security-item {flex-wrap:wrap;padding:16px 0}
.mp-security-item>div {flex-basis:150px}
@media(min-width:480px) {
  .mobile-shortcuts {grid-template-columns:repeat(3,minmax(0,1fr))}
  .provider-rail>.list-card {flex-basis:65%}
  .mobile-plan-rail {grid-auto-columns:65%}
  .carousel-slide {height:280px}
}
@media(min-width:768px) {
  .m-main {padding:24px 28px 36px}
  .mobile-carousel {margin:0}
  .carousel-slide {height:320px}
  .provider-rail>.list-card {flex-basis:44%}
  .mobile-plan-rail {grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:row}
  .mobile-shortcuts {grid-template-columns:repeat(6,minmax(0,1fr))}
}
@media(max-width:360px) {
  .m-header {padding-inline:12px;gap:4px}
  .m-brand {gap:8px}.m-brand b {font-size:14px}.m-brand small {max-width:160px}
  .m-main {padding-inline:12px}.mobile-carousel {margin:0}
  .carousel-slide {height:218px}.carousel-slide h1 {font-size:22px}
  .mobile-shortcuts {gap:8px}.mobile-shortcuts span {font-size:12px}
  .form-grid {grid-template-columns:minmax(0,1fr)}
  .list-card {padding:14px}.card-top .route-link,.list-card .route {font-size:15px}
  .sheet-body {padding-inline:14px}.mp-identity,.mp-guest {padding:16px 12px}
  .mp-identity h1,.mp-guest h1 {font-size:19px}
}
@media(prefers-reduced-motion:reduce) {
  *,*:before,*:after {scroll-behavior:auto!important;animation:none!important;transition:none!important}
}
/* Keep peer cards and their action rows aligned without clipping long content. */
article.list-card {display:flex;flex-direction:column}
article.list-card>.card-actions {margin-top:auto;padding-top:16px}
article.list-card>.cargo-bottom {margin-top:auto;padding-top:12px}
.provider-rail {align-items:stretch}
.quick-grid,.stat-grid,.hero-actions,.mp-login-actions {grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch}
.quick-grid>*,.stat-grid>*,.hero-actions>*,.mp-login-actions>* {min-width:0}
.stat>small {display:block;min-height:2em}
.mp-guest>div {min-width:0}
.mp-stats {align-items:stretch}
.mp-stats button {display:flex;flex-direction:column;align-items:center;justify-content:flex-start}
.mp-stats span {margin-top:auto;padding-top:4px}
@media(min-width:768px) {
  .list-stack {align-items:stretch}
  .stat-grid {grid-template-columns:repeat(4,minmax(0,1fr))}
}
.membership-dot{position:absolute;top:5px;left:calc(50% + 12px);width:8px;height:8px;background:#cf353d;border-radius:50%;box-shadow:0 0 0 2px #fff}
#headerProfile{background:#f3f6fb;width:40px;min-width:40px;padding:8px}
.m-main .v10-steps li.complete button{color:var(--accent-deep);font-weight:600}
.v10-steps button:disabled{cursor:default}.v10-steps li:not(.active):not(.complete) button{color:var(--t3)}
@media(max-width:400px){.m-header{gap:3px;padding-inline:10px}.m-brand img{width:34px;height:34px}.m-brand{gap:6px}.m-brand b{font-size:14px}.m-brand small{max-width:135px}.m-header .icon-btn{min-width:38px;width:38px;padding:6px}}