/* Approved three-screen customer UX. Scoped to signed-in customer pages only. */
body.mobile-ux{--primary:#e32320;--accent:#e32320;--ux-red:#e32320;background:#fafafa;color:#202124;font-family:Arial,Helvetica,sans-serif;font-size:14px;line-height:1.5}
.mobile-ux *{box-sizing:border-box}
.mobile-ux main{width:100%;max-width:760px;margin:0 auto;padding:24px 20px 105px;min-height:calc(100vh - 64px)}
.mobile-ux .app-header{height:64px;min-height:64px;max-width:none;padding:0 max(20px,calc((100% - 720px)/2));border-bottom:1px solid #eee;background:#fff;box-shadow:none;display:flex;gap:14px;position:relative}
.mobile-ux .store-head{margin:0;margin-right:auto;min-width:0}.mobile-ux .reference-header-logo{width:124px;height:auto;max-height:40px;object-fit:contain}.mobile-ux .header-search-form{display:none}.mobile-ux .head-actions{gap:5px}.mobile-ux .head-btn{width:34px;height:38px;background:transparent;border:0;color:#353535}.mobile-ux .head-btn svg{width:21px;height:21px}.mobile-ux .profile-link{display:flex}
.mobile-ux h1{font-size:28px;line-height:1.17;letter-spacing:-.7px;margin:0 0 12px;font-weight:750;color:#202124}.mobile-ux h2{font-size:18px;line-height:1.3;margin:0 0 12px;letter-spacing:-.25px}.mobile-ux h3{font-size:14px;margin:8px 0 5px}.mobile-ux p{color:#65686d;font-size:13px;line-height:1.55}.mobile-ux .ux-intro{margin:0 0 22px}.mobile-ux .ux-intro p{margin:0;max-width:440px}.mobile-ux .ux-shop .ux-intro h1{max-width:300px}
.mobile-ux .ux-search{display:flex;gap:10px;align-items:center;border:1px solid #e8e8e8;border-radius:12px;background:#f1f2f3;padding:0 12px;height:46px;margin:0 0 20px}.mobile-ux .ux-search>svg{width:18px;flex-shrink:0;color:#777}.mobile-ux .ux-search input{border:0!important;background:transparent!important;box-shadow:none!important;padding:0!important;margin:0!important;min-height:0!important;width:100%;min-width:0;font-size:16px}.mobile-ux .ux-search button{padding:0;width:26px;min-height:30px;background:transparent;box-shadow:none;color:#666}.mobile-ux .ux-search button svg{width:18px}
.mobile-ux .ux-products,.mobile-ux .ux-subscriptions{display:grid;gap:16px}.mobile-ux .ux-card,.mobile-ux .card{background:#fff;border:1px solid #e5e6e8;border-radius:15px;padding:18px;margin:0 0 16px;box-shadow:0 2px 5px #00000003}.mobile-ux .ux-products .ux-card,.mobile-ux .ux-subscriptions .ux-card{margin:0}.mobile-ux .ux-product-heading{display:flex;align-items:center;gap:10px;min-width:0}.mobile-ux .ux-product-heading h2{font-size:16px;flex:1;margin:0;min-width:0;overflow-wrap:anywhere}.mobile-ux .product-icon,.mobile-ux .ux-product-heading>.product,.mobile-ux .ux-product-heading>.product-logo{width:40px;height:40px;flex-shrink:0}.mobile-ux .ux-price{margin-left:auto;text-align:right;white-space:nowrap;line-height:1.25}.mobile-ux .ux-price small{display:block;font-size:9px;color:#777}.mobile-ux .ux-price b{font-size:16px;color:#252525}.mobile-ux .ux-product p{margin:0 0 14px;font-size:12px}.mobile-ux .ux-primary{display:flex;width:100%;min-height:44px;align-items:center;justify-content:center;gap:10px;padding:11px 14px;background:var(--ux-red);color:white;border:1px solid var(--ux-red);border-radius:9px;font-size:13px;font-weight:700;text-decoration:none;box-shadow:none;line-height:1.4}.mobile-ux .ux-primary svg{width:16px;height:16px}.mobile-ux .ux-outline{background:#fff;color:var(--ux-red)}.mobile-ux .ux-primary:disabled{background:#e5e5e5;border-color:#ddd;color:#666;cursor:not-allowed}.mobile-ux .ux-how{margin:26px 0 20px}.mobile-ux .ux-how h2{text-align:center;font-size:18px}.mobile-ux .ux-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;text-align:center}.mobile-ux .ux-steps b{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#fff0ef;color:#d72320;margin:0 auto 7px;font-size:15px}.mobile-ux .ux-steps strong{display:block;font-size:12px}.mobile-ux .ux-steps p{font-size:10px;margin:4px 0;color:#72757a}
.mobile-ux .ux-state{margin:12px 0 4px}.mobile-ux .ux-pending{display:inline-block;background:#fff5e9;color:#985416;border-radius:6px;padding:5px 8px;font-size:11px;margin-top:12px}.mobile-ux .ux-validity{display:flex;align-items:center;gap:7px;margin:12px 0 16px}.mobile-ux .ux-validity svg{width:16px;height:16px}.mobile-ux .ux-help{display:flex;align-items:center;gap:12px;padding:15px;margin:20px 0 0;border:1px solid #e6e6e8;border-radius:12px;background:white;color:#333;text-decoration:none}.mobile-ux .ux-help>svg{width:21px;height:21px;flex-shrink:0;color:#74777c}.mobile-ux .ux-help>svg:last-child{margin-left:auto;width:15px}.mobile-ux .ux-help strong{font-size:13px;display:block}.mobile-ux .ux-help small{display:block;color:#777;font-size:11px;margin-top:3px}
.mobile-ux .customer-bottom-nav{position:fixed;bottom:0;left:0;right:0;transform:none;width:100%;max-width:none;height:calc(68px + env(safe-area-inset-bottom));padding:8px max(10px,calc((100% - 720px)/2)) calc(6px + env(safe-area-inset-bottom));display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:#fff;border-top:1px solid #ececee;border-radius:0;box-shadow:0 -2px 8px #00000003;z-index:50}.mobile-ux .customer-bottom-nav a{display:flex;flex-direction:column;gap:4px;padding:3px 0;background:none;border:0;border-radius:0;color:#797b80;font-size:10px;font-weight:500;min-width:0}.mobile-ux .customer-bottom-nav a svg{height:22px;width:22px}.mobile-ux .customer-bottom-nav a.selected{color:var(--ux-red);background:none}.mobile-ux .customer-bottom-nav a.selected:before,.mobile-ux .customer-bottom-nav a.selected:after{display:none}.mobile-ux footer{margin:0 auto 90px;max-width:720px;font-size:11px;padding:0 20px}.mobile-ux footer form{display:block}
.mobile-ux .page-title{margin:0 0 20px}.mobile-ux .page-title h1{font-size:24px;margin:0}.mobile-ux .product-header{border:0;padding:0;margin:0 0 22px;gap:12px;background:transparent}.mobile-ux .product-header h1,.mobile-ux .product-header h3{font-size:20px;margin:0 0 4px}.mobile-ux .product-header>div{min-width:0}.mobile-ux .product-header small{font-size:11px}.mobile-ux .ux-back{display:flex;gap:8px;align-items:center;color:#444;font-size:13px;margin:0 0 22px}.mobile-ux .ux-back svg{height:18px;width:18px}.mobile-ux .delivery-timeline{margin:0;padding:0;border:0}.mobile-ux .delivery-item{display:block;padding:18px;margin:0 0 14px;border:1px solid #e6e6e8;border-radius:14px;background:white}.mobile-ux .timeline-dot{display:none}.mobile-ux .delivery-item small{font-size:11px;color:#777}.mobile-ux .delivery-actions{display:block;width:100%;margin-top:14px}.mobile-ux .delivery-actions form{width:100%}.mobile-ux .delivery-item:before,.mobile-ux .delivery-item:after{display:none}.mobile-ux .ux-details{margin-top:24px}.mobile-ux summary{cursor:pointer;font-size:13px;font-weight:700;min-height:30px}.mobile-ux .subscription-meta{margin-top:15px}.mobile-ux .ux-guide{margin:22px 0}.mobile-ux .ux-guide h2{font-size:16px}.mobile-ux .ux-guide ol{padding-left:22px;color:#61656a;font-size:12px}.mobile-ux .ux-guide li{padding:0 0 9px 3px}.mobile-ux .ux-guide li::marker{color:#d82421;font-weight:700}.mobile-ux .ux-caution{display:flex;gap:8px;color:#935b24;background:#fff8ee;border:1px solid #f3e4ce;padding:12px;border-radius:9px;font-size:11px}.mobile-ux .ux-caution svg{width:18px;height:18px;flex-shrink:0}.mobile-ux .ux-guide-details{display:block}.mobile-ux .ux-guide-details p{font-size:12px}.mobile-ux .ux-credentials .warning{background:transparent;border:0;margin:0 0 12px;padding:0;font-size:11px}.mobile-ux .ux-credentials .warning b{display:none}.mobile-ux .ux-credentials .warning p{font-size:11px;margin:0}.mobile-ux .credential-field{margin:0 0 14px;padding:0;border:0}.mobile-ux .credential-field label{font-size:11px;color:#6d7178;margin:0}.mobile-ux .input-copy{display:flex;align-items:center;border:1px solid #e6e6e8;background:#f8f8f9;border-radius:8px;margin-top:6px;overflow:hidden}.mobile-ux .input-copy input{min-width:0;width:100%;margin:0!important;border:0!important;background:transparent!important;border-radius:0;box-shadow:none!important;font-size:13px!important;min-height:42px!important;padding:8px!important}.mobile-ux .input-copy button{flex-shrink:0;background:transparent;color:#54575c;border:0;box-shadow:none;min-width:44px;min-height:44px;padding:7px;font-size:10px;width:auto}.mobile-ux .input-copy button svg{width:17px;height:17px}.mobile-ux .totp-panel h2,.mobile-ux .totp-gate h2{font-size:16px}.mobile-ux .otp{gap:7px;justify-content:center;margin:18px 0}.mobile-ux .otp span{width:36px;height:44px;font-size:24px;background:#f3f4f5;border:1px solid #e5e6e8;border-radius:7px}.mobile-ux .countdown-row{margin:12px 0;font-size:12px}.mobile-ux .info-box{font-size:12px}.mobile-ux .support-section{scroll-margin-top:20px}.mobile-ux .prod-grid{gap:15px}.mobile-ux input,.mobile-ux select,.mobile-ux textarea{max-width:100%}.mobile-ux .profile-card{overflow-wrap:anywhere}.mobile-ux a:focus-visible,.mobile-ux button:focus-visible,.mobile-ux summary:focus-visible{outline:3px solid #333;outline-offset:3px}
.mobile-ux .ux-brand{display:flex;align-items:center;justify-content:center;width:40px;height:40px;flex:0 0 40px;border-radius:10px;background:#f1f3f4;padding:8px;overflow:hidden}.mobile-ux .ux-brand img,.mobile-ux .ux-brand svg{width:100%;height:100%;object-fit:contain}.mobile-ux .ux-brand.ux-openai{background:#159579}.mobile-ux .ux-brand.ux-openai img{filter:brightness(0) invert(1)}
.mobile-ux .head-actions a[href="/cart"]{display:flex!important}.mobile-ux .nav-badge{top:0;right:0}.mobile-ux .ux-intro h1{font-size:26px;line-height:1.15;margin-bottom:8px}.mobile-ux .ux-intro{margin-bottom:16px}.mobile-ux .ux-intro p{font-size:12px;line-height:1.5}.mobile-ux .ux-search{margin-bottom:16px}.mobile-ux .ux-product{padding:16px}.mobile-ux .ux-product h3{margin:6px 0 4px}.mobile-ux .ux-product p{font-size:11px;line-height:1.45;margin-bottom:12px}.mobile-ux .ux-how{margin-top:22px}.mobile-ux footer{display:none}.mobile-ux:has(.profile-card) footer{display:block}.mobile-ux .ux-price small{font-size:10px}
@media(min-width:700px){.mobile-ux main{padding-top:36px}.mobile-ux .ux-products{grid-template-columns:repeat(2,minmax(0,1fr))}.mobile-ux .ux-intro h1{max-width:none!important}.mobile-ux .ux-steps p{font-size:12px}}
