:root{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#202020;background:#fff;font-synthesis:none;--teal:#363636;--nav-height:66px;--safe:env(safe-area-inset-bottom,0px);--line:#ececec}*{box-sizing:border-box}body{margin:0;background:#fff}button,input,select{font:inherit}button{cursor:pointer;touch-action:manipulation}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #7e7e7e;outline-offset:3px}button:disabled{opacity:.5;cursor:default}[hidden]{display:none!important}button,a{-webkit-tap-highlight-color:transparent}.store-shell{max-width:1040px;margin:auto;padding:0 24px calc(var(--nav-height) + var(--safe) + 28px)}.store-header{height:86px;display:flex;align-items:center;justify-content:space-between;gap:12px}.brand{text-decoration:none;color:#272727;white-space:nowrap}.brand strong{font-size:26px;letter-spacing:-1px;font-weight:650}.brand span{font-weight:350}.brand small{font-size:15px;font-weight:400;color:#7c7c7c;letter-spacing:-.4px}.currency select{min-height:38px;border:1px solid #e8e8e8;border-radius:11px;padding:7px 8px;background:#fff;color:#2c2c2c;font-size:12px;box-shadow:0 3px 8px #2e2e2e05}.catalog-tabs{display:grid;grid-template-columns:1.2fr 1.16fr .65fr;gap:7px}.catalog-tabs button{border:0;background:#f4f4f4;color:#424242;border-radius:13px;padding:12px 7px;min-height:44px;font-size:12px;font-weight:450}.catalog-tabs button[aria-pressed=true]{background:#272727;color:#fff}.store-intro{display:flex;justify-content:space-between;align-items:center;padding:25px 0 16px;gap:12px}.store-intro h1{font-size:18px;font-weight:550;letter-spacing:-.4px;margin:0}.store-intro>span{font-size:11px;color:#9f9f9f}.catalog-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.app-card{min-width:0;border:1px solid #f0f0f0;background:linear-gradient(145deg,#fff,#fafafa);border-radius:17px;padding:15px 13px 12px;box-shadow:0 3px 10px #28282803;display:flex;flex-direction:column}.app-card.is-selected{border-color:#bdbdbd;background:linear-gradient(145deg,#fcfcfc,#f2f2f2)}.app-logo{display:block;width:48px;height:48px;object-fit:contain;border-radius:12px;flex-shrink:0}.app-card h2{font-size:14px;line-height:1.25;letter-spacing:-.3px;margin:10px 0 3px;font-weight:550;min-height:34px}.app-price{font-size:13px;font-weight:550;margin:0 0 9px;font-variant-numeric:tabular-nums;line-height:1.4}.term-picker{display:flex;gap:4px;min-width:0}.term-picker button{border:1px solid transparent;border-radius:8px;background:#f0f0f0;color:#767676;flex:1;min-width:0;min-height:33px;padding:6px 2px;font-size:11px}.term-picker button[aria-pressed=true]{background:#3a3a3a;color:#fff}.add-app,.selected-controls{border:0;background:linear-gradient(110deg,#444444,#262626);color:#fff;border-radius:9px;min-height:38px;padding:8px 6px;margin-top:8px;font-size:12px;box-shadow:0 3px 6px #34343408}.selected-controls{display:flex;justify-content:space-between;align-items:center;background:linear-gradient(110deg,#7b7b7b,#404040);padding:0 3px}.selected-controls span{font-size:11px;white-space:nowrap}.selected-controls button{border:0;color:#fff;background:transparent;width:31px;min-height:38px;font-size:18px}.has-selection:not(.chat-active) .store-shell{padding-bottom:calc(var(--nav-height) + var(--safe) + 125px)}
.bottom-nav{position:fixed;bottom:0;left:0;right:0;height:calc(var(--nav-height) + var(--safe));padding:6px 20px calc(5px + var(--safe));display:flex;justify-content:center;gap:12px;background:#fffffff7;backdrop-filter:blur(16px);border-top:1px solid #ebebeb;z-index:50}.bottom-nav>button{position:relative;display:flex;flex:1;max-width:240px;flex-direction:column;align-items:center;justify-content:center;gap:4px;border:0;border-radius:10px;background:transparent;color:#818181;font-size:10px;letter-spacing:.3px;min-height:46px}.bottom-nav>button[aria-current=page]{color:#262626;font-weight:600}.bottom-nav svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.bottom-nav #homeNav[aria-current=page] svg{fill:#262626}.bottom-nav i{position:absolute;width:6px;height:6px;border-radius:50%;background:#7d7d7d;top:9px;left:calc(50% + 15px)}.purchase-bar{position:fixed;bottom:calc(var(--nav-height) + var(--safe) + 8px);left:50%;transform:translateX(-50%);width:calc(100% - 24px);max-width:620px;z-index:40;display:flex;align-items:center;gap:10px;padding:11px 12px;background:#fffffff5;border:1px solid #e7e7e7;border-radius:18px;box-shadow:0 5px 26px #28282819;backdrop-filter:blur(15px)}.selected-logos{display:flex;gap:3px;max-width:105px;overflow:hidden}.selected-logos .app-logo{width:31px;height:31px;border-radius:8px}.purchase-copy{display:flex;flex-direction:column;min-width:0;gap:2px;flex:1}.purchase-copy>span{font-size:11px;color:#686868}.purchase-copy>strong{font-size:16px;letter-spacing:-.4px;font-variant-numeric:tabular-nums;white-space:nowrap}.purchase-copy>small{font-size:10px;color:#6a6a6a}.purchase-bar>button{border:0;flex-shrink:0;background:linear-gradient(115deg,#494949,#2d2d2d);color:#fff;min-height:49px;border-radius:12px;padding:10px 17px;font-size:13px;font-weight:550;display:flex;gap:15px;align-items:center}.purchase-bar>button span{font-size:23px;font-weight:350}
.chat-view{position:fixed;inset:0 0 calc(var(--nav-height) + var(--safe));max-width:760px;margin:auto;display:flex;flex-direction:column;background:#f2f0eb;border-left:1px solid var(--line);border-right:1px solid var(--line)}.chat-header{display:flex;align-items:center;gap:10px;min-height:78px;background:#fff;padding:12px 18px;border-bottom:1px solid #e8e8e8;flex-shrink:0}.icon-button{border:0;background:transparent;color:#4d4d4d;min-width:32px;min-height:38px;font-size:27px;padding:0}.brand-avatar{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;font-size:13px;font-weight:650;color:#fff;background:linear-gradient(135deg,#6d6d6d,#313131)}.chat-header h1{font-size:17px;font-weight:600;letter-spacing:-.45px;margin:0}.chat-header>div>span{display:block;font-size:10px;color:#888888;margin-top:4px}.conversation{flex:1;overflow:auto;overscroll-behavior:contain;padding:20px 18px 15px;background-image:radial-gradient(#87878711 .7px,transparent .7px);background-size:13px 13px}.chat-bubble{display:table;max-width:90%;padding:12px 14px;background:#fff;border-radius:4px 14px 14px;box-shadow:0 1px 3px #3b3b3b07;font-size:14px;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere;margin:0 0 14px}.chat-bubble.user-message{margin-left:auto;background:#eeeeee;border-radius:14px 4px 14px 14px}.order-card{background:#fff;border:1px solid #ececec;border-radius:15px;padding:16px;margin:0 0 15px;box-shadow:0 3px 9px #35353504}.order-card>header{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:8px}.order-card h2{font-size:15px;font-weight:600;letter-spacing:-.35px;margin:0}.edit-order{border:0;border-radius:7px;background:#f3f3f3;color:#545454;min-height:33px;padding:6px 8px;font-size:10px;white-space:nowrap}.chat-order-line{display:flex;align-items:center;gap:10px;padding:13px 0;border-bottom:1px solid #f2f2f2}.chat-order-line .app-logo,.editor-line .app-logo{width:40px;height:40px;border-radius:10px}.chat-order-line>div{flex:1;min-width:0}.chat-order-line strong{font-size:13px;font-weight:500;display:block}.chat-order-line small{display:block;font-size:11px;color:#878787;margin-top:5px}.chat-order-line>span{font-size:12px;white-space:nowrap;font-variant-numeric:tabular-nums}.saving-note{background:#f4f4f4;color:#6d6d6d;font-size:11px;border-radius:7px;padding:10px;margin-top:12px;line-height:1.4}.order-totals{margin-top:12px}.order-totals>div{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:5px 0;font-size:12px;color:#797979;font-variant-numeric:tabular-nums}.order-totals strong{font-weight:500;color:#3f3f3f}.order-totals .discount,.order-totals .discount strong{color:#6a6a6a}.order-totals .grand-total{border-top:1px solid #f0f0f0;margin-top:7px;padding-top:14px;font-size:17px;font-weight:600;color:#2a2a2a}.order-totals .grand-total strong{font-weight:650;color:#2a2a2a}.payment-options{display:flex;flex-direction:column;gap:7px;margin-bottom:15px}.payment-option{border:1px solid #e8e8e8;background:#fff;display:flex;align-items:center;gap:10px;padding:11px 13px;text-align:left;border-radius:12px;min-height:57px;color:#3f3f3f;font-size:12px}.payment-option>span:nth-child(2){flex:1}.payment-option>span:last-child{font-size:23px;color:#a8a8a8}.payment-option[aria-pressed=true]{border-color:#aeaeae;background:#f8f8f8}.payment-icon{width:30px;height:30px;border-radius:8px;background:#f4f4f4;display:grid;place-items:center;color:#626262;font-size:18px}.payment-option[data-payment-method=cash] .payment-icon{background:#fff3de;color:#cb8c22}.payment-option[data-payment-method=binance_pay] .payment-icon{background:#fff8de;color:#9b771a}.connection-note{font-size:10px;color:#8b8b8b;line-height:1.6;margin:16px 4px}.composer{display:flex;align-items:center;gap:8px;padding:10px 13px;background:#fff;border-top:1px solid #eaeaea;flex-shrink:0}.composer input{flex:1;min-width:0;min-height:43px;border:1px solid #e7e7e7;border-radius:23px;font-size:13px;padding:10px 15px;color:#434343;background:#fcfcfc}.composer button{width:43px;height:43px;border:0;background:#3d3d3d;color:#fff;border-radius:50%;font-size:19px}.editor-line{border-bottom:1px solid #f0f0f0;padding:13px 0}.editor-line-heading{display:flex;align-items:center;gap:8px}.editor-line-heading strong{flex:1;font-size:12px;font-weight:500;min-width:0}.editor-line-heading>span{font-size:11px;white-space:nowrap;font-variant-numeric:tabular-nums}.delete-item{border:0;background:transparent;color:#d77d80;font-size:22px;padding:4px;min-width:28px;min-height:35px}.editor-controls{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-top:9px}.quantity-picker{display:flex;align-items:center;gap:9px}.quantity-picker button{border:1px solid #ebebeb;background:#fbfbfb;color:#535353;min-width:32px;height:34px;border-radius:7px;font-size:19px}.quantity-picker span{font-size:12px;min-width:12px;text-align:center}.editor-controls .term-picker{width:130px}.add-more{display:block;width:100%;min-height:41px;border:1px solid #e1e1e1;border-radius:22px;background:#fafafa;color:#474747;font-size:12px;margin:14px 0;padding:9px}.save-order{width:100%;min-height:47px;border:0;background:linear-gradient(110deg,#454545,#272727);border-radius:11px;color:#fff;font-size:13px;font-weight:500;margin-top:17px}.inline-app-picker{padding:10px 0;border-bottom:1px solid #ededed}.inline-app-picker .catalog-tabs{gap:4px}.inline-app-picker .catalog-tabs button{font-size:10px;min-height:35px;padding:7px 4px}.inline-app-picker input{width:100%;border:1px solid #e6e6e6;border-radius:8px;padding:10px;margin:10px 0;font-size:12px}.inline-app-picker .catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-height:365px;overflow:auto;padding:2px;gap:9px}.inline-app-picker .app-card{padding:10px}.inline-app-picker .app-logo{width:36px;height:36px}.inline-app-picker .app-card h2{font-size:12px;min-height:30px}.inline-app-picker .app-price{font-size:11px}.inline-app-picker .selected-controls span{font-size:9px}.inline-app-picker .term-picker button{font-size:10px}.empty-state,.chat-empty{font-size:12px;color:#8e8e8e;line-height:1.6}.toast{position:fixed;bottom:calc(var(--nav-height) + var(--safe) + 15px);left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100vw - 28px);padding:12px 16px;background:#373737;color:#fff;border-radius:12px;font-size:12px;box-shadow:0 5px 20px #2d2d2d20;z-index:80}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:650px){.store-shell{padding-left:16px;padding-right:16px}.store-header{height:77px}.brand strong{font-size:24px}.brand small{font-size:13px}.catalog-tabs button{font-size:10px;min-height:41px;padding:10px 4px}.store-intro{padding:19px 0 13px}.store-intro h1{font-size:16px}.store-intro>span{font-size:10px}.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.app-card{padding:13px 11px 11px;border-radius:15px}.app-card h2{font-size:13px;min-height:32px}.app-price{font-size:12px}.purchase-bar{gap:8px;padding:10px}.purchase-bar>button{padding:9px 12px;gap:10px;font-size:12px;min-height:50px}.selected-logos{max-width:71px}.selected-logos .app-logo{width:33px;height:33px}.purchase-copy>strong{font-size:14px}.purchase-copy>span{font-size:10px}.purchase-copy>small{font-size:9px}.chat-header{min-height:73px;padding:10px 12px}.conversation{padding:16px 12px 12px}.order-card{padding:14px}.chat-view{border:0}.chat-bubble{font-size:13px}.composer input{font-size:16px}.order-card h2{font-size:14px}.chat-order-line>span{font-size:11px}.edit-order{font-size:9px;padding:5px 7px}}
@media(max-width:350px){.store-shell{padding-left:12px;padding-right:12px}.brand strong{font-size:21px}.brand small{font-size:11px}.app-card{padding:10px}.app-card h2{font-size:12px}.selected-logos{max-width:31px}.purchase-copy>strong{font-size:13px}.editor-line-heading>span{font-size:10px}.editor-controls{gap:8px}.quantity-picker{gap:6px}.editor-controls .term-picker{width:115px}.catalog-tabs button{font-size:9px}.order-card{padding:11px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

.app-identity{display:flex;justify-content:space-between;align-items:center;gap:6px;min-height:48px}.complete-devices{display:flex;flex-direction:column;align-items:flex-end;gap:2px;color:#6a6a6a;text-align:right;min-width:0}.device-icons{display:flex;align-items:center;gap:3px;margin-bottom:2px}.device-icons svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.complete-devices>span{font-size:10px;line-height:1.2;font-weight:550;white-space:nowrap}.complete-devices>small{font-size:9px;line-height:1.2;color:#8e8e8e}@media(max-width:360px){.app-identity .app-logo{width:40px;height:40px}.device-icons{gap:1px}.device-icons svg{width:13px;height:13px}.complete-devices>span{font-size:9px}}

/* Let every selected application stay visible, including on narrow phones. */
.selected-logos{max-width:none;flex-shrink:0;overflow:visible}.selected-logos .app-logo{width:28px;height:28px}.purchase-bar.has-many-logos{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px 12px}.purchase-bar.has-many-logos .selected-logos{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px;min-width:0}.has-many-logos .selected-logos .app-logo{width:27px;height:27px;border-radius:7px}.purchase-bar.has-many-logos>button{grid-column:2;grid-row:2}.many-selected.has-selection:not(.chat-active) .store-shell{padding-bottom:calc(var(--nav-height) + var(--safe) + 190px)}

.app-card{cursor:pointer;touch-action:manipulation}.app-card:focus-visible{outline:2px solid #7e7e7e;outline-offset:3px}.selected-controls{min-height:44px;gap:2px;padding:0 2px}.selected-controls button{width:44px;min-width:44px;min-height:44px;font-size:24px;border-radius:8px}.selected-controls .remove-selected{background:#ffffffed;color:#a73942;box-shadow:inset 0 0 0 1px #e8e8e8;font-size:29px;line-height:1}.selected-controls span{flex:1;text-align:center;font-size:10px}.add-app{min-height:44px}

.app-card{position:relative}.app-identity{position:relative}.app-quantity-badge{position:absolute;top:-7px;left:36px;min-width:21px;height:21px;display:grid;place-items:center;padding:0 5px;border-radius:50%;background:#c83d4c;color:white;border:2px solid white;font-size:11px;font-weight:650;line-height:1;box-shadow:0 2px 5px #963b4520}.remove-app-card{position:absolute;top:-12px;right:-8px;width:40px;height:40px;display:grid;place-items:center;padding:0;border:0;border-radius:50%;background:radial-gradient(circle,#fff 53%,transparent 56%);color:#aa3b49;font-size:28px;line-height:1;z-index:2}.selected-controls span{font-size:15px;font-weight:600}.term-picker button{font-size:12px;min-height:42px;line-height:1.2;padding:6px 2px;white-space:normal}.editor-controls .term-picker{width:180px}.editor-controls .term-picker button{font-size:11px}.inline-app-picker .term-picker button{font-size:11px}
.purchase-bar,.purchase-bar.has-many-logos{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 12px}.purchase-tools{grid-column:1/-1;display:flex;gap:8px;align-items:center;min-width:0}.purchase-tools .selected-logos{display:flex;flex:1;flex-wrap:wrap;gap:6px;min-width:0}.purchase-tools .clear-order{width:38px;height:38px;flex-shrink:0;border:1px solid #eaeaea;border-radius:11px;background:#fcfcfc;color:#a14450;font-size:27px;padding:0;line-height:1}.purchase-bar>button{grid-column:2;grid-row:2}.purchase-copy>small{font-size:12px;font-weight:600;color:#5b5b5b;background:#f0f0f0;border-radius:6px;padding:4px 7px;width:fit-content}.has-selection:not(.chat-active) .store-shell{padding-bottom:calc(var(--nav-height) + var(--safe) + 180px)}.many-selected.has-selection:not(.chat-active) .store-shell{padding-bottom:calc(var(--nav-height) + var(--safe) + 210px)}.saving-note{font-size:13px;font-weight:550}.clear-order-dialog{width:min(370px,calc(100vw - 32px));padding:24px;border:1px solid #e8e8e8;border-radius:18px;color:#2e2e2e;box-shadow:0 14px 50px #32323222}.clear-order-dialog::backdrop{background:#2a2a2a55;backdrop-filter:blur(3px)}.clear-order-dialog h2{font-size:19px;margin:0 0 12px;font-weight:600}.clear-order-dialog p{font-size:13px;line-height:1.5;color:#858585;margin-bottom:22px}.clear-order-actions{display:flex;gap:10px}.clear-order-actions button{flex:1;min-height:44px;border:1px solid #e4e4e4;border-radius:10px;background:#fafafa;color:#545454;font-size:13px}.clear-order-actions #confirmClearOrder{background:#393939;color:#fff;border-color:#393939}

.editor-controls .term-picker{flex:1;max-width:180px}.quantity-picker{flex-shrink:0}.purchase-copy>small{font-size:14px}

/* The amount due is the only prominent monetary figure. */
.purchase-copy{gap:3px}.purchase-copy>#purchaseCount{font-size:10px;color:#999999;margin-bottom:2px}.purchase-before{font-size:12px;color:#949494;line-height:1.4;font-variant-numeric:tabular-nums}.purchase-before s{text-decoration-thickness:1px;text-decoration-color:#919191}.purchase-copy>.purchase-price-label{font-size:12px;font-weight:550;color:#5c5c5c;line-height:1.3}.purchase-copy>#purchaseTotal{font-size:25px;line-height:1.15;font-weight:700;color:#4a4a4a;letter-spacing:-.5px}.purchase-copy>#purchaseSaving{font-size:10px;font-weight:400;color:#888888;background:none;padding:0;margin-top:2px;border-radius:0}.order-totals .grand-total{font-size:20px}.order-totals .grand-total strong{color:#4a4a4a;font-size:23px}@media(max-width:350px){.purchase-copy>#purchaseTotal{font-size:22px}.purchase-before{font-size:11px}.purchase-copy>.purchase-price-label{font-size:11px}.order-totals .grand-total strong{font-size:21px}}

.app-benefits{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-end;gap:5px}.app-description{font-size:11px;font-weight:400;line-height:1.35;color:#818181;margin:0;text-align:right;max-width:125px;overflow-wrap:normal}.app-benefits .complete-devices{gap:1px}.app-benefits .complete-devices>span{font-size:10px}.app-identity{align-items:center}.inline-app-picker .app-description{font-size:10px}@media(max-width:350px){.app-description{font-size:10px}.app-identity>.app-logo{width:40px;height:40px}}

.app-description{min-height:30px;display:flex;align-items:center;justify-content:flex-end}.app-card>.term-picker{margin-top:auto}

.app-description{font-size:11px;line-height:1.4;color:#696969;min-height:48px}.app-benefits{align-items:stretch;gap:0}.app-card .app-identity{min-height:62px}.card-device-line{display:flex;align-items:center;justify-content:space-between;gap:5px;min-height:31px;margin:0 0 9px;color:#787878}.card-device-caption{display:flex;flex-direction:column;gap:1px;flex-shrink:0}.card-device-caption>span{font-size:10px;line-height:1.2;font-weight:550}.card-device-caption>small{font-size:9px;line-height:1.1;color:#9a9a9a}.card-device-line .device-icons{gap:2px;margin:0}.card-device-line .device-icons svg{width:14px;height:14px}.app-card h2{margin-bottom:3px}.app-card .app-price{margin-bottom:9px}@media(max-width:350px){.app-description{font-size:10px}.card-device-caption>span{font-size:9px}.card-device-line .device-icons svg{width:12px;height:12px}.card-device-line .device-icons{gap:1px}.card-device-line{gap:3px}}

.app-highlights{font-size:11px;line-height:1.4;color:#626262;margin:0 0 10px;min-height:31px}.app-highlights[aria-hidden=true]{min-height:0;margin:0}.app-description{font-size:11px;line-height:1.45;min-height:48px;color:#696969}.app-card .app-identity{min-height:62px}@media(max-width:350px){.app-highlights{font-size:10px}.app-description{font-size:10px}}

/* Consistent mobile catalog and a clear two-part navigation. */
:root{--teal:#353535;--line:#e8e8e8;--nav-height:76px;color:#2a2a2a;background:#f8f8f8}
body{color:#2a2a2a;background:#f8f8f8}
.store-shell{max-width:1040px;background:#fff;min-height:100dvh}
.store-header{height:80px}
.brand{color:#313131}.brand strong{font-weight:650;letter-spacing:-1px}.brand span{font-weight:400}.brand small{color:#7c7c7c}
.currency select{border-color:#e7e7e7;border-radius:10px;color:#555555;box-shadow:none}
.catalog-tabs{gap:6px}.catalog-tabs button{background:#f4f4f4;color:#6b6b6b;border:1px solid transparent;border-radius:10px;font-weight:500}
.catalog-tabs button[aria-pressed=true]{background:#353535;border-color:#353535;color:#fff}
.store-intro h1{font-weight:600;color:#373737}.store-intro>span{color:#8e8e8e}
.catalog-grid{gap:12px;align-items:stretch}
.app-card{border:1px solid #e9e9e9;border-radius:15px;background:#fff;box-shadow:0 2px 5px #39393903;padding:14px 12px 12px;transition:border-color .16s,background-color .16s}
.app-card.is-selected{background:#f6f6f6;border-color:#b0b0b0;box-shadow:0 0 0 1px #e6e6e6 inset}
.app-card .app-identity{min-height:60px;align-items:center;gap:9px}
.app-identity>.app-logo{width:46px;height:46px;border-radius:11px}
.app-benefits{align-items:stretch;flex:1;min-width:0}
.app-description{display:block;min-height:0;max-width:none;margin:0;text-align:left;font-size:11px;line-height:1.5;color:#787878;font-weight:400}
.app-card h2{margin:12px 0 6px;min-height:35px;line-height:1.35;font-size:14px;letter-spacing:-.25px;color:#313131;font-weight:600}
.app-highlights,.app-highlights[aria-hidden=true]{min-height:48px;margin:0 0 10px;font-size:11px;line-height:1.45;color:#787878}
.card-device-line{margin:0 0 12px;min-height:30px;color:#898989;gap:4px}
.card-device-caption>span{font-size:10px;font-weight:500;color:#7b7b7b}.card-device-caption>small{font-size:9px;color:#989898}
.card-device-line .device-icons{gap:3px}.card-device-line .device-icons svg{width:13px;height:13px;stroke-width:1.5}
.app-card .app-price{margin:0 0 10px;font-size:14px;color:#313131;font-weight:650;line-height:1.4}
.term-picker{gap:4px}.term-picker button{background:#f4f4f4;color:#7f7f7f;border:1px solid transparent;border-radius:7px;min-height:40px;font-size:11px;font-weight:500;white-space:nowrap;padding:6px 1px}
.term-picker button[aria-pressed=true]{background:#eeeeee;border-color:#c7c7c7;color:#444444}
.add-app,.selected-controls{margin-top:8px;border-radius:9px;background:#353535;color:#fff;box-shadow:none;min-height:44px;font-size:12px;font-weight:550}
.selected-controls{background:#464646}.selected-controls button{color:#fff}.selected-controls span{font-size:14px}
.app-quantity-badge{background:#bf4754;box-shadow:none;top:-4px;left:34px}
.remove-app-card{color:#b74956;top:-8px;right:-6px}
.purchase-bar{border-color:#e5e5e5;box-shadow:0 6px 24px #31313114;border-radius:16px}
.purchase-bar>button{background:#353535;border-radius:11px;font-weight:600;min-height:50px}
.purchase-copy>#purchaseTotal,.order-totals .grand-total strong{color:#353535}.purchase-copy>.purchase-price-label{color:#686868}
.purchase-copy>#purchaseSaving{color:#7f7f7f}.purchase-before{color:#959595}
.bottom-nav{height:calc(var(--nav-height) + var(--safe));padding:8px 16px calc(8px + var(--safe));gap:0;background:#fffffff7;border-top:1px solid #e5e5e5;box-shadow:0 -3px 16px #33333305;align-items:stretch}
.bottom-nav>button{max-width:260px;min-height:54px;flex-direction:row;gap:9px;font-size:13px;letter-spacing:0;font-weight:550;border-radius:11px;color:#7e7e7e}
.bottom-nav>button+button{margin-left:25px}
.bottom-nav>button+button:before{content:"";position:absolute;left:-13px;top:11px;bottom:11px;width:1px;background:#e2e2e2}
.bottom-nav>button[aria-current=page]{background:#f2f2f2;color:#353535;font-weight:650}
.bottom-nav svg{width:25px;height:25px;stroke-width:1.6}.bottom-nav #homeNav[aria-current=page] svg{fill:#353535}
.bottom-nav #chatNav{background:#f6f6f6;color:#666666}.bottom-nav #chatNav[aria-current=page]{background:#f0f0f0;color:#585858}
.bottom-nav #chatNav svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.5}
.bottom-nav i{top:9px;left:calc(50% + 25px);background:#6d6d6d;border:2px solid #fff;width:8px;height:8px}
.chat-view{background:#f5f5f5}.conversation{background-image:none}.brand-avatar{background:#353535}.chat-header{border-color:#e6e6e6}
.chat-bubble.user-message{background:#efefef}.composer button,.save-order{background:#353535}.saving-note{background:#f4f4f4;color:#666666}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,.app-card:focus-visible{outline-color:#747474}
@media(max-width:650px){
 .store-shell{padding-left:15px;padding-right:15px}.store-header{height:74px}.brand strong{font-size:23px}.brand small{font-size:12px}
 .catalog-tabs button{font-size:10px;min-height:41px}.store-intro{padding:20px 0 13px}.store-intro h1{font-size:16px}
 .catalog-grid{gap:11px}.app-card{padding:12px 10px 10px;border-radius:14px}.app-card h2{font-size:13px;min-height:35px}
 .app-card .app-identity{min-height:60px}.app-description,.app-highlights{font-size:11px}
 .purchase-bar{bottom:calc(var(--nav-height) + var(--safe) + 8px)}
 .bottom-nav{padding-left:18px;padding-right:18px}
}
@media(max-width:360px){
 .store-shell{padding-left:11px;padding-right:11px}.brand strong{font-size:21px}.brand small{font-size:11px}.currency select{font-size:11px;padding:7px 6px}
 .app-card{padding:11px 9px 10px}.app-identity>.app-logo{width:38px;height:38px}.app-card .app-identity{gap:6px}.app-description,.app-highlights{font-size:10px}.app-card h2{font-size:12px}
 .term-picker button{font-size:10px}.card-device-line .device-icons{gap:1px}.card-device-line .device-icons svg{width:12px;height:12px}
 .bottom-nav>button{font-size:12px}.bottom-nav>button+button{margin-left:21px}.bottom-nav>button+button:before{left:-11px}
}

/* Put the purchase decision first: price, description, duration, add. */
.app-card .app-identity{min-height:48px;align-items:center;justify-content:space-between;gap:6px}
.app-identity>.app-price{margin:0;font-size:21px;line-height:1.15;font-weight:650;letter-spacing:-.6px;white-space:nowrap;color:#353535;text-align:right}
.app-card h2{min-height:35px;margin:12px 0 8px;font-size:14px;line-height:1.3}
.app-card>.app-description{margin:0 0 12px;min-height:76px;font-size:12px;line-height:1.5;text-align:left;color:#7a7a7a;display:block;max-width:none}
.app-card>.card-device-line{margin:0 0 12px}
.app-card>.term-picker{margin-top:auto}
.term-picker button{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:3px;min-height:53px;white-space:normal;font-size:12px;padding:7px 2px;line-height:1.1}
.term-picker button strong{font-size:16px;font-weight:600}.term-picker button span{font-size:12px;font-weight:450}
.term-picker button[aria-pressed=true]{background:#eeeeee;border-color:#a9a9a9;color:#353535;box-shadow:inset 0 0 0 1px #a9a9a933}
.inline-app-picker .app-identity>.app-price{font-size:16px}.inline-app-picker .app-card>.app-description{min-height:76px;font-size:11px}
.inline-app-picker .term-picker button,.editor-controls .term-picker button{min-height:46px}.editor-controls .term-picker button strong{font-size:14px}.editor-controls .term-picker button span{font-size:10px}
@media(max-width:650px){.app-card h2{font-size:14px}.app-identity>.app-logo{width:43px;height:43px}.app-identity>.app-price{font-size:19px}.app-card>.app-description{font-size:12px;min-height:90px}}
@media(max-width:360px){.app-identity>.app-logo{width:36px;height:36px}.app-identity>.app-price{font-size:17px}.app-card h2{font-size:13px}.app-card>.app-description{font-size:11px;min-height:90px}}

/* A compact purchase strip joined to the persistent navigation. */
.purchase-bar,.purchase-bar.has-many-logos{grid-template-columns:40px minmax(0,1fr) auto 28px;gap:6px;align-items:center;padding:8px 10px;bottom:calc(var(--nav-height) + var(--safe));border-radius:13px 13px 0 0;box-shadow:0 -3px 14px #3131310b;min-height:72px}
.purchase-tools{display:contents}
.purchase-tools .selected-logos,.purchase-bar.has-many-logos .selected-logos{grid-column:1;grid-row:1;display:flex;flex-wrap:nowrap;max-width:40px;overflow-x:auto;gap:4px;scrollbar-width:none}
.selected-logos::-webkit-scrollbar{display:none}
.purchase-tools .selected-logos .app-logo{width:28px;height:28px;flex-shrink:0}
.purchase-tools .clear-order{grid-column:4;grid-row:1;width:28px;height:36px;font-size:24px;border:0;background:transparent}
.purchase-copy{grid-column:2;grid-row:1;gap:1px}
.purchase-copy>#purchaseCount{font-size:9px;margin:0}
.purchase-copy>.purchase-price-label{font-size:10px;line-height:1.15}
.purchase-copy>#purchaseTotal{font-size:14px;line-height:1.2;letter-spacing:-.2px}
.purchase-copy .purchase-before,.purchase-copy>#purchaseSaving{font-size:9px;line-height:1.2;margin:0}
.purchase-bar>button,.purchase-bar.has-many-logos>button{grid-column:3;grid-row:1;min-height:42px;padding:8px 10px;font-size:11px;gap:6px;border-radius:9px}
.purchase-bar>button span{font-size:20px}
.has-selection:not(.chat-active) .store-shell,.many-selected.has-selection:not(.chat-active) .store-shell{padding-bottom:calc(var(--nav-height) + var(--safe) + 110px)}

/* Real term savings, visible before adding an application. */
.app-identity>.price-tag{display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:3px;padding:8px 7px;background:#f4f4f4;border:1px solid #eaeaea;border-radius:10px;font-size:inherit;letter-spacing:0;min-width:0}
.card-price-label{font-size:9px;font-weight:500;color:#747474;line-height:1.1}
.card-price-amount{font-size:19px;font-weight:700;letter-spacing:-.5px;line-height:1.15;white-space:nowrap}
.card-before{font-size:9px;font-weight:400;color:#8f8f8f;line-height:1.2;white-space:nowrap}
.card-before s{text-decoration-thickness:1px}
.card-price-saving{font-size:10px;font-weight:600;color:#616161;line-height:1.2;white-space:nowrap}
.app-card .app-identity{align-items:flex-start;min-height:93px}
.price-updated{animation:price-refresh .36s ease-out}
@keyframes price-refresh{from{opacity:.35;transform:translateY(5px);background:#e8e8e8}to{opacity:1;transform:translateY(0)}}
@media(max-width:360px){.card-price-amount{font-size:16px}.app-identity>.price-tag{padding:7px 5px}.card-price-saving{font-size:9px}.card-before{font-size:8px}}
@media(prefers-reduced-motion:reduce){.price-updated{animation:none}}

/* Choose a duration in one tap; the next tap opens the order in chat. */
.choose-term-hint{display:block;text-align:center;color:#898989;font-size:10px;line-height:1.4;margin-top:9px;min-height:20px}
.app-card .app-identity{min-height:82px}
.app-card h2{min-height:24px;margin-top:8px}
.app-card>.app-description{min-height:78px}
.chat-view{background:#f2eee7}
.chat-header{min-height:68px;padding:10px 14px;background:#fff;gap:10px}
.chat-header h1{font-size:16px;color:#333333}.chat-header>div>span{font-size:11px;color:#878787}
.chat-header .icon-button{font-size:29px;color:#5d5d5d}
.brand-avatar{width:42px;height:42px;background:#ececec;color:#606060;font-size:14px;border:1px solid #e0e0e0}
.conversation{padding:18px 13px 14px;background-color:#f2eee7;background-image:radial-gradient(#b6b1a21c 1px,transparent 1px);background-size:19px 19px}
.chat-bubble{font-size:14px;line-height:1.5;border-radius:3px 13px 13px;padding:11px 13px;margin-bottom:11px;box-shadow:0 1px 1px #3333330c;max-width:88%;color:#393939}
.chat-bubble.user-message{background:#ececec;border-radius:13px 3px 13px 13px}
.order-card{border:0;border-radius:12px;box-shadow:0 1px 2px #3737370c;padding:13px;margin-bottom:12px}
.order-card h2{font-size:14px}.chat-order-line{padding:10px 0}.order-totals>div{font-size:11px}.order-totals .grand-total,.order-totals .grand-total strong{font-size:18px}
.payment-options{gap:6px}.payment-option{min-height:48px;padding:8px 11px;border:0;border-radius:10px;font-size:12px}.payment-icon{width:28px;height:28px}
.chat-empty{padding:0;margin:0 0 15px;max-width:88%;background:#fff;border:0;border-radius:3px 13px 13px;box-shadow:0 1px 1px #3333330c;text-align:left;color:#6b6b6b;font-size:13px}
.chat-empty p{padding:12px 13px 0;margin:0;line-height:1.5}.chat-empty .add-more{margin:10px 12px 12px;min-height:38px;width:calc(100% - 24px);border-color:#dfdfdf;background:#f9f9f9;color:#646464}
.connection-note{font-size:10px;line-height:1.4;max-width:290px;margin:12px auto;text-align:center;color:#7f7f7f}
.composer{background:#f2eee7;border-top:0;gap:8px;padding:9px 12px;align-items:center}.composer input{background:#fff;border:1px solid #e5e5e5;border-radius:24px;min-height:46px;padding:11px 16px;box-shadow:0 1px 2px #33333308}.composer button{width:46px;height:46px;border-radius:50%;background:#626262;flex-shrink:0;font-size:19px}

/* Clear before/now pricing with a separate removal target. */
.app-identity>.price-tag{background:none;border:0;border-radius:0;box-shadow:none;padding:0;gap:5px}
.app-card .app-identity{min-height:72px;padding-top:15px}
.app-card .remove-app-card{top:3px;right:4px;width:25px;height:25px;min-height:25px;font-size:23px;border:0;background:none;box-shadow:none;z-index:2}
.card-price-label{font-size:10px;color:#747474}
.card-before{font-size:11px;color:#838383;line-height:1.3}
.card-before s{position:relative;text-decoration:none;display:inline-block}
.card-before s:before,.card-before s:after{content:'';position:absolute;left:-2px;right:-2px;top:47%;height:1px;background:#c8545b;pointer-events:none;transform:rotate(-7deg)}
.card-before s:after{top:57%;transform:rotate(-7deg)}
.card-price-amount{font-size:20px;color:#353535}
@keyframes price-refresh{from{opacity:.35;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:360px){.card-price-amount{font-size:16px}.card-before{font-size:9px}.app-identity>.price-tag{padding:0}}

/* Keep the original price readable through a single light strike. */
.card-before{font-size:12px;color:#6e6e6e;font-weight:500}
.card-before s:before{height:1px;background:#c16c70;transform:none;top:52%;opacity:.65;left:0;right:0}
.card-before s:after{display:none}
@media(max-width:360px){.card-before{font-size:10px}}

/* Keep every selected app visible and make the previous amount readable. */
.purchase-bar,.purchase-bar.has-many-logos{grid-template-columns:68px minmax(0,1fr) auto 26px;gap:6px}
.purchase-tools .selected-logos,.purchase-bar.has-many-logos .selected-logos{max-width:68px;overflow:visible;flex-wrap:wrap;gap:3px;align-items:center}
.purchase-tools .selected-logos .app-logo{width:28px;height:28px}
.purchase-bar.has-many-logos .selected-logos .app-logo{width:20px;height:20px;border-radius:5px}
.purchase-copy .purchase-before{font-size:11px;line-height:1.4;white-space:nowrap;color:#777777}
.purchase-before s{text-decoration-color:#adadad;text-decoration-thickness:1px}
.purchase-copy>#purchaseTotal{font-size:16px}
.purchase-copy>#purchaseCount{font-size:10px}
.purchase-copy>.purchase-price-label{font-size:10px}
@media(max-width:360px){.purchase-bar,.purchase-bar.has-many-logos{grid-template-columns:53px minmax(0,1fr) auto 24px;gap:4px;padding:8px}.purchase-tools .selected-logos .app-logo{width:24px;height:24px}.purchase-copy .purchase-before{font-size:10px}.purchase-bar>button{padding:8px;font-size:10px}.purchase-copy>#purchaseTotal{font-size:14px}}

/* Keep greeting, order and payment options together in the opening view. */
.chat-header{min-height:62px;padding:8px 13px}
.conversation{padding:12px 12px 10px}
.chat-bubble{padding:9px 11px;font-size:13px;margin-bottom:9px}
.order-card{padding:10px 12px;margin-bottom:9px}
.order-card>header{margin-bottom:5px;min-height:28px}.order-card h2{font-size:13px}.edit-order{min-height:28px;font-size:10px;padding:5px 7px}
.chat-order-items{max-height:144px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.chat-order-line{gap:8px;padding:7px 0;min-height:44px}
.chat-order-line .app-logo{width:29px;height:29px;border-radius:7px}
.chat-order-line strong{font-size:12px}.chat-order-line small{font-size:10px;margin-top:3px}.chat-order-line>span{font-size:11px}
.order-totals{margin-top:7px}.order-totals>div{padding:3px 0;font-size:11px}.order-totals .grand-total{margin-top:4px;padding-top:8px}.order-totals .grand-total,.order-totals .grand-total strong{font-size:17px}
.payment-options{gap:5px;margin-bottom:9px}.payment-option{min-height:41px;padding:6px 10px;border-radius:9px}.payment-icon{width:25px;height:25px;font-size:15px}
.composer{padding:7px 12px}.composer input{min-height:43px}.composer button{width:43px;height:43px}

.composer input:not([type=file]){min-width:0;flex:1;width:0;padding-left:12px;padding-right:12px}
.composer .attach-file,.composer .record-audio{background:transparent;color:#787878;width:31px;height:43px;min-width:31px;border:0;border-radius:50%;padding:0;font-size:27px;box-shadow:none}
.record-audio svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
.composer .record-audio.is-recording{color:#c24f59;background:#f9e1e2;animation:recording-pulse 1s ease-in-out infinite}
@keyframes recording-pulse{50%{opacity:.5}}
.attachment-message{min-width:150px;max-width:88%;display:flex;flex-direction:column;gap:7px}.attachment-message img{max-width:100%;max-height:260px;object-fit:contain;border-radius:8px}.attachment-message audio{max-width:100%;width:245px;height:40px}.attachment-link{color:#5f5f5f;font-size:12px;overflow-wrap:anywhere;text-decoration:underline}.attachment-message small{font-size:9px;color:#848484}
@media(prefers-reduced-motion:reduce){.composer .record-audio.is-recording{animation:none}}

/* Two compact, clearly differentiated navigation actions. */
:root{--nav-height:64px}
.bottom-nav{padding-top:7px;padding-bottom:calc(7px + var(--safe))}
.bottom-nav>button{min-height:46px;font-size:12px;border-radius:9px;gap:8px}
.bottom-nav #homeNav,.bottom-nav #homeNav[aria-current=page]{background:#353535;color:#fff}
.bottom-nav #homeNav svg,.bottom-nav #homeNav[aria-current=page] svg{fill:currentColor}
.bottom-nav #chatNav,.bottom-nav #chatNav[aria-current=page]{background:#626262;color:#fff}
.bottom-nav>button[aria-current=page]{box-shadow:inset 0 0 0 1px #ffffff40}
.bottom-nav svg{width:22px;height:22px}.bottom-nav #chatNav svg{width:24px;height:24px}
.catalog-promo{margin:12px 0 0;text-align:center;font-size:11px;line-height:1.4;font-weight:500;color:#777777}
.store-intro{padding-top:14px}

/* White, black and cloud gray. Green belongs to the Chat action. */
:root{--teal:#202020;--line:#e9e9e9;color:#242424;background:#fafafa}
body{background:#fafafa;color:#242424}.store-shell{background:#fff}
.brand,.brand small{color:#242424}.currency select{background:#fff;color:#3f3f3f;border-color:#e8e8e8}
.catalog-tabs button{background:#f4f4f4;color:#626262}.catalog-tabs button[aria-pressed=true]{background:#202020;border-color:#202020;color:#fff}
.app-card{background:#fff;border-color:#e8e8e8;box-shadow:none}.app-card.is-selected{background:#f5f5f5;border-color:#9c9c9c;box-shadow:0 0 0 1px #e5e5e5 inset}
.app-card h2,.app-identity>.price-tag,.card-price-amount{color:#242424}.app-description,.catalog-promo{color:#777}
.term-picker button{background:#f3f3f3;color:#6a6a6a}.term-picker button[aria-pressed=true]{background:#e7e7e7;border-color:#919191;color:#232323;box-shadow:none}
.add-app,.selected-controls,.save-order{background:#262626;color:#fff}
.purchase-bar{background:#fafafa;border-color:#e3e3e3}.purchase-bar>button{background:#202020;color:#fff}.purchase-copy>#purchaseTotal,.purchase-copy>.purchase-price-label{color:#242424}
.bottom-nav{background:#fff;border-color:#e5e5e5}.bottom-nav #homeNav,.bottom-nav #homeNav[aria-current=page]{background:#242424;color:#fff}
.bottom-nav #chatNav,.bottom-nav #chatNav[aria-current=page]{background:#19795b;color:#fff}
.chat-view,.conversation,.composer{background-color:#f4f4f4}.chat-header h1{color:#292929}.brand-avatar{background:#ededed;color:#363636;border-color:#e0e0e0}.chat-header .icon-button{color:#4b4b4b}
.chat-bubble{background:#fff;color:#292929}.chat-bubble.user-message{background:#e7e7e7}.composer button{background:#282828;color:#fff}.composer .attach-file,.composer .record-audio{background:transparent;color:#666}
.order-totals .grand-total,.order-totals .grand-total strong{color:#242424}.order-totals .discount,.order-totals .discount strong{color:#666}

/* Less copy and deliberate controls: card surfaces never toggle selection. */
.app-card{cursor:default}.app-card .app-identity{min-height:69px}.app-card h2{margin-top:5px;min-height:27px}
.app-card>.app-description{font-size:12px;min-height:34px;margin:0;color:#777;line-height:1.4}
.app-includes{margin:3px 0 12px;color:#656565;font-size:11px;line-height:1.4}.app-includes summary{cursor:pointer;min-height:30px;display:flex;align-items:center;gap:5px;list-style:none;width:fit-content}.app-includes summary::-webkit-details-marker{display:none}.app-includes summary:after{content:'+';color:#888}.app-includes[open] summary:after{content:'−'}.app-includes p{margin:3px 0 7px;color:#666;font-size:11px;line-height:1.5}
.app-card>.card-device-line{padding:8px 5px;background:#f1f1f1;border-radius:9px;display:flex;flex-direction:column;align-items:center;gap:5px;min-height:57px;margin:0 0 12px}
.card-device-caption{display:flex;flex-direction:row;align-items:baseline;gap:4px;justify-content:center;width:100%;white-space:nowrap}
.card-device-caption>span{font-size:13px;font-weight:650;color:#282828}.card-device-caption>small{font-size:10px;color:#666}
.card-device-line .device-icons{display:flex;justify-content:center;gap:8px}.card-device-line .device-icons svg{width:15px;height:15px;color:#777}
.app-card>.term-picker{gap:5px;padding:0;border-radius:0}
.app-card>.term-picker button{min-height:60px;border-radius:10px;background:#f2f2f2;border:1px solid #e6e6e6;padding:8px 2px;gap:4px}
.app-card>.term-picker button strong{font-size:18px}.app-card>.term-picker button span{font-size:12px}
.app-card>.term-picker button[aria-pressed=true]{background:#282828;color:#fff;border-color:#282828}
.selected-controls{margin-top:9px;min-height:43px;background:#ededed;color:#262626;border:1px solid #e0e0e0}.selected-controls button{color:#262626;min-height:43px;width:39px}.selected-controls span{font-size:13px}
.purchase-copy>#purchaseCount{font-size:10px}.purchase-copy>#purchaseTotal{font-size:18px}.purchase-bar{min-height:64px}
@media(max-width:360px){.card-device-caption{gap:3px}.card-device-caption>span{font-size:11px}.card-device-caption>small{font-size:9px}.app-card>.term-picker button strong{font-size:17px}.app-card>.term-picker button span{font-size:11px}.purchase-copy>#purchaseTotal{font-size:15px}}

.app-card .app-identity{height:78px;min-height:78px;flex-shrink:0}

/* Distinct app benefits, with clean device information and no gray band. */
.app-card>.app-description{min-height:100px;font-size:12px;line-height:1.5;color:#707070;margin:0 0 11px}
.app-card>.card-device-line{background:none;border-radius:0;padding:4px 0;min-height:47px;margin-bottom:13px;gap:5px}
.card-device-caption>span{font-size:12px;font-weight:600}.card-device-caption>small{font-size:10px;color:#777}
.card-device-line .device-icons svg{width:14px;height:14px}.card-device-line .device-icons{gap:8px}
.chat-empty{max-width:none;background:transparent;box-shadow:none;border-radius:0;padding:0}
.chat-intent{display:block;width:100%;min-height:49px;border:1px solid #dedede;border-radius:11px;background:#fff;color:#282828;font-size:13px;font-weight:550;padding:12px 15px;text-align:left;margin:0 0 9px;box-shadow:0 1px 2px #00000004}
.chat-intent:first-child{background:#262626;color:#fff;border-color:#262626}
@media(max-width:360px){.app-card>.app-description{font-size:11px;min-height:110px}.card-device-caption>span{font-size:11px}.card-device-caption>small{font-size:9px}}

/* Compact, consistently aligned product cards. */
.store-intro{padding:15px 0 11px}.store-intro>span{display:none}
.catalog-grid{gap:10px}.app-card{padding:10px 10px 9px;border-radius:12px}
.app-card .app-identity{height:65px;min-height:65px;padding-top:12px;align-items:flex-start}
.app-identity>.app-logo{width:39px;height:39px;border-radius:9px}
.app-card h2{height:34px;min-height:34px;display:flex;align-items:flex-start;justify-content:flex-start;margin:3px 0 5px;font-size:13px;line-height:1.3;text-align:left;letter-spacing:-.2px;font-weight:600}
.app-card>.app-description{min-height:84px;font-size:11px;line-height:1.45;margin:0 0 7px;text-align:left}
.app-card>.card-device-line{min-height:40px;margin:0 0 9px;padding:2px 0;gap:4px}
.card-device-caption>span{font-size:11px}.card-device-caption>small{font-size:9px}.card-device-line .device-icons svg{width:13px;height:13px}
.app-card>.term-picker button{min-height:54px;padding:6px 2px;border-radius:9px;gap:3px}.app-card>.term-picker button strong{font-size:17px}.app-card>.term-picker button span{font-size:11px}
.selected-controls{min-height:39px;margin-top:7px}.selected-controls button{min-height:39px}
@media(max-width:360px){.app-card{padding:10px 8px 9px}.app-card h2{font-size:12px}.app-card>.app-description{min-height:94px;font-size:11px}.app-identity>.app-logo{width:33px;height:33px}.card-price-amount{font-size:16px}.app-card>.term-picker button{min-height:54px}}

/* Lift the selected duration without shifting the surrounding layout. */
.app-card>.term-picker{padding-top:7px;overflow:visible}
.app-card>.term-picker button{position:relative;transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease,border-color .2s ease}
.app-card>.term-picker button[aria-pressed=true]{transform:translateY(-6px);box-shadow:0 5px 9px #00000020;border-color:#262626;z-index:1}
.app-card>.term-picker button[aria-pressed=true]:after{content:'✓';position:absolute;top:-6px;right:-3px;display:grid;place-items:center;width:16px;height:16px;border-radius:50%;background:#fff;color:#222;border:1px solid #d4d4d4;font-size:10px;line-height:1}
.app-card .app-identity{height:73px;min-height:73px}
.card-price-label{font-size:10px;white-space:nowrap}
@media(prefers-reduced-motion:reduce){.app-card>.term-picker button{transition:none}}

/* Keep clearing the order far away from the primary purchase action. */
.purchase-bar,.purchase-bar.has-many-logos{grid-template-columns:26px 62px minmax(0,1fr) auto;background:#ededed;border-color:#d7d7d7;gap:7px;padding:9px 10px;min-height:75px;box-shadow:0 -3px 13px #00000008}
.purchase-tools .clear-order{grid-column:1;grid-row:1;position:relative;width:26px;height:38px;font-size:23px;color:#777;border-radius:7px}
.purchase-tools .clear-order:after{content:'';position:absolute;inset:-3px -5px}
.purchase-tools .selected-logos,.purchase-bar.has-many-logos .selected-logos{grid-column:2;grid-row:1;max-width:62px;gap:4px}
.purchase-tools .selected-logos .app-logo{width:29px;height:29px;border-radius:7px;box-shadow:0 1px 2px #00000012}
.purchase-bar.has-many-logos .selected-logos .app-logo{width:18px;height:18px;border-radius:4px}
.purchase-copy{grid-column:3;grid-row:1;gap:2px}
.purchase-copy>#purchaseCount{font-size:12px;line-height:1.2;color:#444;font-weight:550;white-space:normal}
.purchase-copy>.purchase-price-label{font-size:10px;font-weight:400;color:#666}
.purchase-copy>#purchaseTotal{font-size:18px;line-height:1.15;color:#222}
.purchase-bar>button,.purchase-bar.has-many-logos>button{grid-column:4;grid-row:1;min-height:50px;min-width:106px;font-size:12px;padding:10px 12px;border-radius:10px;gap:8px;background:#202020;color:#fff}
.purchase-bar>button span{font-size:23px}
@media(max-width:360px){.purchase-bar,.purchase-bar.has-many-logos{grid-template-columns:22px 43px minmax(0,1fr) auto;gap:5px;padding:8px;min-height:72px}.purchase-tools .clear-order{width:22px}.purchase-tools .selected-logos,.purchase-bar.has-many-logos .selected-logos{max-width:43px;gap:3px}.purchase-tools .selected-logos .app-logo{width:20px;height:20px}.purchase-bar.has-many-logos .selected-logos .app-logo{width:18px;height:18px}.purchase-bar>button,.purchase-bar.has-many-logos>button{min-width:91px;font-size:11px;padding:9px;gap:5px}.purchase-copy>#purchaseCount{font-size:11px}.purchase-copy>#purchaseTotal{font-size:16px}}

/* A thin solid purchase tray; preserve the approved purchase button size. */
.purchase-bar,.purchase-bar.has-many-logos{background:#fff;border:1px solid #cecece;min-height:60px;padding:4px 8px;gap:7px;box-shadow:0 -3px 14px #00000012;border-radius:11px 11px 0 0}
.purchase-copy{gap:1px}.purchase-copy>#purchaseCount{font-size:11px;line-height:1.15}.purchase-copy>.purchase-price-label{font-size:9px;line-height:1.15}.purchase-copy>#purchaseTotal{font-size:17px;line-height:1.1}
.purchase-bar>button,.purchase-bar.has-many-logos>button{min-height:50px;min-width:106px;font-size:12px;padding:10px 12px}
@media(max-width:360px){.purchase-bar,.purchase-bar.has-many-logos{padding:4px 6px;gap:5px;min-height:60px}.purchase-copy>#purchaseCount{font-size:10px}.purchase-copy>#purchaseTotal{font-size:15px}.purchase-bar>button,.purchase-bar.has-many-logos>button{min-width:91px;font-size:11px;padding:9px}}

/* A visible removal control above the price, with a generous touch target. */
.app-card .remove-app-card{top:-12px;right:-5px;width:31px;height:31px;min-height:31px;display:grid;place-items:center;padding:0;line-height:1;font-size:25px;font-weight:450;border:1px solid #e2cccc;border-radius:50%;background:#fff;color:#b44c52;box-shadow:0 2px 5px #0000000b;z-index:3}
.app-card .remove-app-card:after{content:'';position:absolute;inset:-6px;border-radius:50%}
.app-identity>.price-tag{margin-right:1px}

.purchase-copy .purchase-before{font-size:10px;line-height:1.15;color:#777;white-space:nowrap}
.purchase-before s{text-decoration-color:#c16c70;text-decoration-thickness:1px}
.purchase-copy>#purchaseSaving{font-size:9px;line-height:1.1;color:#666;margin:0;padding:0;background:none}
.purchase-copy>.purchase-price-label{font-size:9px}.purchase-copy>#purchaseTotal{font-size:18px}

/* A full-width image replaces the former name-and-currency header row. */
.store-header{height:auto;display:block;margin:0 -24px 13px;padding:0}
.store-header .brand{display:block;width:100%;line-height:0;white-space:normal}
.brand-banner{display:block;width:100%;height:auto;aspect-ratio:3.2;object-fit:cover;object-position:center}
.store-intro{gap:8px;padding-top:11px}.store-intro .currency{display:block;flex-shrink:0}.store-intro .currency select{min-height:32px;font-size:10px;border-radius:8px;padding:5px 6px}
@media(max-width:650px){.store-header{height:auto;margin:0 -15px 12px}}
@media(max-width:360px){.store-header{margin-left:-11px;margin-right:-11px}.store-intro h1{font-size:15px}}

/* Oferta real de duración, separada del precio mensual. */
.term-offer{display:flex;flex-wrap:wrap;gap:2px 4px;font-size:10px;line-height:1.4;margin:0 0 9px;color:#555}
.term-offer strong{flex-basis:100%;font-size:10px;color:#171717}
.term-offer s{text-decoration-color:#ba6262;text-decoration-thickness:1px}
.term-offer span:last-child{font-weight:700;color:#171717}

/* Negro profundo y blanco limpio en las acciones de compra. */
#buyNow,#homeNav,.save-order,.app-card .term-picker button[aria-pressed="true"]{background:#080808;color:#fff;border-color:#080808;box-shadow:0 1px 2px #00000014,inset 0 1px 0 #ffffff14}
#buyNow:hover,#homeNav:hover,.save-order:hover{background:#181818}
#buyNow:focus-visible,#homeNav:focus-visible,.save-order:focus-visible{outline:2px solid #555;outline-offset:3px}

.brand-banner{aspect-ratio:2/1;height:auto;object-fit:contain;background:#fafafa}

/* Acciones negras sin degradado; logos nítidos sin recorte. */
#buyNow,#homeNav,#homeNav[aria-current="page"],.app-card>.term-picker button[aria-pressed="true"],.catalog-tabs button[aria-pressed="true"],.save-order{background:#000;background-image:none;color:#fff;border-color:#000;opacity:1;text-shadow:none}
#buyNow:hover,#homeNav:hover{background:#111;background-image:none}
.app-logo{object-fit:contain;image-rendering:auto;filter:none;opacity:1}
.app-logo[src*="-hd.png"]{padding:3px;background:#080808}
.app-logo[src*="crunchyroll-hd"],.app-logo[src*="youtube-hd"]{background:#fff}

.espn-badge{display:inline-block;width:17px;height:17px;object-fit:contain;vertical-align:middle;margin-left:5px;border-radius:4px}
.app-logo[src*="-official.jpg"],.app-logo[src*="-retina.jpg"]{object-fit:contain;padding:0;background:transparent;opacity:1;filter:none}

/* Títulos centrados y del mismo alto; navegación con contraste pleno. */
.app-card h2{display:block;height:42px;min-height:42px;margin:5px 0 7px;padding:3px 0 0;text-align:center;align-content:center;font-size:15px;font-weight:700;line-height:1.2;letter-spacing:-.25px;text-wrap:balance;color:#111;overflow-wrap:normal}
.app-card h2 .espn-badge{width:16px;height:16px;margin-left:4px}
.bottom-nav #homeNav,.bottom-nav #homeNav[aria-current="page"],.bottom-nav #homeNav:hover{background:#000;background-image:none;color:#fff;opacity:1;border:1px solid #000;box-shadow:none;font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;font-size:15px;font-weight:650;letter-spacing:-.25px;text-shadow:none}
.bottom-nav #homeNav svg{color:#fff;fill:#fff;opacity:1;width:24px;height:24px}
.bottom-nav #homeNav span{color:#fff;opacity:1}
@media(max-width:360px){.app-card h2{font-size:14px;height:42px;min-height:42px}.bottom-nav #homeNav{font-size:14px}}

/* Mismo acabado negro y blanco en compra y categorías. */
.purchase-bar #buyNow,.purchase-bar #buyNow:hover,.catalog-tabs button,.catalog-tabs button:hover{background:#000;background-image:none;color:#fff;border:1px solid #000;opacity:1;box-shadow:none;font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;font-weight:650;letter-spacing:-.2px}
.catalog-tabs button{font-size:12px;min-height:42px}
.catalog-tabs button[aria-pressed="true"]{background:#000;color:#fff;outline:2px solid #999;outline-offset:2px}
.purchase-bar #buyNow{font-size:13px}
.catalog-tabs button,.catalog-tabs button[aria-pressed="true"]{position:relative;outline:none;box-shadow:none;filter:none}
.catalog-tabs button[aria-pressed="true"]:after{content:"";position:absolute;bottom:4px;left:calc(50% - 12px);width:24px;height:2px;border-radius:2px;background:#fff}
.catalog-tabs button:focus-visible{outline:2px solid #111;outline-offset:3px}

.brand-banner{width:100%;aspect-ratio:4/1;height:auto;object-fit:cover;object-position:center}

/* Cantidad y duración comparten una línea completa, sin partir números. */
.purchase-bar,.purchase-bar.has-many-logos{row-gap:3px}
.purchase-bar>#purchaseCount{grid-column:2/-1;grid-row:1;min-width:0;white-space:nowrap;font-size:11px;line-height:1.2;font-weight:600;color:#333}
.purchase-tools .clear-order,.purchase-tools .selected-logos,.purchase-bar.has-many-logos .selected-logos,.purchase-copy,.purchase-bar>button,.purchase-bar.has-many-logos>button{grid-row:2}
@media(max-width:360px){.purchase-bar>#purchaseCount{font-size:10px}}

/* Tarjetas compactas incluso con controles de cantidad. */
.app-card{padding:9px 9px 8px}
.app-card .app-identity{height:56px;min-height:56px;padding-top:4px}
.app-card h2{height:38px;min-height:38px;margin:2px 0 4px;padding-top:0}
.app-card>.app-description{min-height:64px;margin:0 0 5px;font-size:11px;line-height:1.4}
.app-card>.card-device-line{min-height:30px;padding:0;margin:0 0 5px;gap:2px}
.app-card>.term-picker{padding-top:5px;margin-top:auto}
.app-card>.term-picker button{min-height:46px;padding:4px 2px;gap:1px}
.app-card>.term-picker button strong{font-size:16px}
.app-card>.term-picker button span{font-size:10px}
.app-card>.selected-controls{min-height:34px;margin-top:5px;border-radius:8px}
.app-card>.selected-controls button{min-height:34px;height:34px;font-size:22px}
.app-card>.selected-controls span{font-size:13px}
@media(max-width:360px){.app-card>.app-description{min-height:76px}.app-card h2{height:38px;min-height:38px}.app-card>.term-picker button{min-height:46px}}

/* Equilibrio entre una tarjeta compacta y una lectura descansada. */
.app-card{padding:14px 11px 12px;border-radius:15px;border-color:#e5e5e5}
.app-card .app-identity{height:59px;min-height:59px;padding-top:3px;gap:8px}
.app-card h2{height:38px;min-height:38px;padding:0;margin:8px 0 10px;font-size:15px;line-height:1.25;font-weight:650}
.app-card>.app-description{min-height:78px;font-size:11.5px;line-height:1.55;margin:0 0 12px;color:#626262;text-wrap:pretty}
.app-card>.card-device-line{min-height:34px;padding:0;margin:0 0 12px;gap:5px}
.card-device-caption>span{font-weight:600}.card-device-caption>small{color:#777}
.app-card>.term-picker{padding-top:5px;gap:6px}
.app-card>.term-picker button{min-height:48px;padding:5px 2px;gap:2px;border-color:#e8e8e8}
.app-card>.selected-controls{margin-top:10px;min-height:36px;background:#f4f4f4;border-color:#e8e8e8}
.app-card>.selected-controls button{height:36px;min-height:36px}
@media(max-width:360px){.app-card{padding:13px 9px 11px}.app-card h2{font-size:14px;margin:8px 0 10px}.app-card>.app-description{font-size:11px;line-height:1.55;min-height:86px}}

/* Descripciones alineadas a ambos lados y a todo el ancho de la tarjeta. */
.app-card>.app-description{width:100%;max-width:none;text-align:justify;text-align-last:left;text-justify:inter-word;text-wrap:wrap;hyphens:auto;overflow-wrap:normal}

/* En móvil, evitar huecos artificiales del texto justificado. */
.app-card>.app-description{width:100%;max-width:none;text-align:left;text-align-last:auto;text-justify:auto;word-spacing:normal;letter-spacing:normal;hyphens:none;text-wrap:pretty;overflow-wrap:normal;font-kerning:normal}

.store-intro>.currency{display:none}

/* La invitación a elegir vive en el banner. */
.store-intro{display:none}
.catalog-tabs{margin-bottom:17px}

.brand-banner{background:#000}

/* Texto ligero, corto y fluido en las columnas móviles. */
.app-card>.app-description{display:block;box-sizing:border-box;width:100%;max-width:none;font-weight:350;font-size:11.5px;line-height:1.55;color:#6b6b6b;word-spacing:normal;letter-spacing:0;text-wrap:wrap;text-align:left;min-height:64px;margin-bottom:12px}
.app-card h2{font-weight:600}
@media(max-width:360px){.app-card>.app-description{font-size:11px;min-height:70px}}

/* Una única jerarquía de precios para las tres categorías. */
.app-card .app-identity{height:66px;min-height:66px;align-items:flex-start;padding-top:3px}
.app-identity>.price-tag{display:flex;flex-direction:column;align-items:flex-end;gap:5px;padding:0;margin:0;min-width:0}
.price-tag .card-before{display:block;min-height:13px;font-size:10px;line-height:1.3;font-weight:400;color:#7b7b7b;white-space:nowrap;letter-spacing:0}
.price-tag .no-reference{visibility:hidden}
.card-current-price{display:flex;align-items:baseline;justify-content:flex-end;gap:5px;white-space:nowrap}
.card-current-price .card-price-label{font-size:9px;line-height:1.2;font-weight:400;color:#777;letter-spacing:0}
.card-current-price .card-price-amount{font-size:18px;line-height:1.15;font-weight:700;letter-spacing:-.4px;color:#171717;white-space:nowrap}
.card-price-term{font-size:10px;line-height:1.3;font-weight:400;color:#707070;letter-spacing:0;white-space:nowrap}
@media(max-width:360px){.card-current-price{gap:3px}.card-current-price .card-price-amount{font-size:16px}.price-tag .card-before{font-size:9px}.card-price-term{font-size:9px}}

/* Etiquetas ancladas: cambiar duración no desplaza Ahora ni el importe. */
.app-identity>.price-tag{flex:1;width:0;min-width:0}
.price-tag .card-before{display:grid;grid-template-columns:31px minmax(0,1fr);gap:3px;width:100%;align-items:baseline}
.price-tag .card-before>span{text-align:left}
.price-tag .card-before>s{text-align:right}
.card-current-price{display:grid;grid-template-columns:25px minmax(0,1fr);gap:3px;width:100%;align-items:baseline}
.card-current-price .card-price-label{text-align:left}
.card-current-price .card-price-amount{text-align:right;font-variant-numeric:tabular-nums}
.card-price-term{align-self:flex-end;min-height:13px}
@media(max-width:360px){.card-current-price{grid-template-columns:23px minmax(0,1fr);gap:2px}.price-tag .card-before{grid-template-columns:28px minmax(0,1fr);gap:2px}}

/* Logos y distintivos compartidos por todas las categorías. */
.app-logo-frame{position:relative;flex:0 0 39px;width:39px;height:39px}
.app-logo-frame>.app-logo{display:block;width:100%;height:100%;border-radius:9px;object-fit:contain;padding:0}
.app-logo-frame>.espn-badge{position:absolute;right:-4px;bottom:-4px;width:18px;height:18px;margin:0;border-radius:5px;border:2px solid #fff;background:#fff;object-fit:contain;box-shadow:0 1px 3px #0000001a}
.youtube-logo-frame{overflow:hidden;border-radius:9px;background:#fff}
.youtube-logo-frame>.app-logo{transform:scale(1.28);border-radius:0}
@media(max-width:360px){.app-logo-frame{flex-basis:33px;width:33px;height:33px}.app-logo-frame>.espn-badge{width:16px;height:16px}}

.brand-banner{aspect-ratio:8/3;height:auto;object-fit:contain;object-position:center;background:#000}
.app-logo-frame>.espn-badge{width:28px;height:14px;padding:2px;right:-5px;bottom:-3px;border-width:1px;border-radius:4px;background:#fff}

.attachment-choices{width:min(340px,calc(100vw - 32px));border:1px solid #e4e4e4;border-radius:18px;padding:18px;background:#fff;color:#171717;box-shadow:0 18px 60px #0003}
.attachment-choices::backdrop{background:#0006}
.attachment-choices header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.attachment-choices h2{font-size:16px;margin:0}
.attachment-choices header button{border:0;background:none;color:#666;width:36px;height:36px;font-size:26px}
.attachment-choices>button{display:block;width:100%;min-height:48px;text-align:left;padding:12px;border:1px solid #e5e5e5;border-radius:10px;background:#f5f5f5;color:#171717;margin-top:8px;font:inherit;font-size:14px}
.recording-controls{position:fixed;z-index:60;bottom:calc(var(--nav-height) + var(--safe) + 74px);left:12px;right:12px;max-width:560px;margin:auto;display:flex;align-items:center;gap:8px;padding:10px;border:1px solid #ddd;border-radius:12px;background:#fff;box-shadow:0 4px 20px #0002;font-size:12px}
.recording-controls[hidden]{display:none}.recording-controls span{flex:1;color:#b43b3b}.recording-controls button{min-height:40px;border:0;border-radius:8px;padding:8px;background:#eee;color:#222;font:inherit}.recording-controls #sendRecording{background:#000;color:#fff}
.attachment-message video{display:block;max-width:100%;max-height:260px;border-radius:10px}

/* Tachado limitado al importe; Antes permanece junto al número. */
.price-tag .card-before{display:flex;justify-content:flex-end;align-items:baseline;gap:4px;min-height:13px;width:100%;position:static}
.price-tag .card-before>span{flex:0 0 auto;text-align:left}
.price-tag .card-before>s{display:inline;flex:0 0 auto;width:auto;position:static;text-align:right;text-decoration-line:line-through;text-decoration-color:#b96969;text-decoration-thickness:1px;text-decoration-skip-ink:none}
.price-tag .card-before>s:before,.price-tag .card-before>s:after{display:none;content:none}

/* El importe anterior se lee antes que el tachado. */
.price-tag .card-before{gap:4px;min-height:15px;font-size:10px;color:#727272}
.price-tag .card-before>s{font-size:11px;font-weight:450;font-variant-numeric:tabular-nums;color:#626262;text-decoration-thickness:.6px;text-decoration-color:rgba(170,73,73,.45);line-height:1.35}
.purchase-before s{text-decoration-thickness:.6px;text-decoration-color:rgba(170,73,73,.45);color:#626262;font-variant-numeric:tabular-nums}
@media(max-width:360px){.price-tag .card-before>s{font-size:10px}}

.brand-banner{aspect-ratio:10/3;height:auto;object-fit:cover;object-position:center}

/* Cuentas completas se distingue por capacidad y acento carmín. */
.complete-notice{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:-4px 0 14px;padding:10px 12px;border:1px solid #edd7da;border-radius:11px;background:#fff6f7;color:#8c2435;font-size:11px;line-height:1.3}
.complete-notice[hidden]{display:none}.complete-notice strong{font-size:12px;font-weight:650}.complete-notice span{font-weight:500}
.catalog-tabs button[data-category="complete"][aria-pressed="true"]{background:#93283b;border-color:#93283b;color:#fff}
.app-card.complete-account{border-color:#e9d7db}
.app-card.complete-account>.card-device-line{gap:6px}
.complete-account .card-device-caption>span{display:inline-block;padding:3px 7px;border-radius:6px;background:#fff0f2;color:#a02a3f;font-size:12px;font-weight:700;line-height:1.2;white-space:nowrap}
.complete-account .card-device-caption>small{color:#8b4f59;font-size:9px}
.complete-account .card-device-line .device-icons svg{color:#a65060}
@media(max-width:360px){.complete-notice{padding:9px;font-size:10px}.complete-notice strong{font-size:11px}.complete-account .card-device-caption>span{padding:3px 5px;font-size:11px}}

/* Distintivo de capacidad más fino y ligero. */
.complete-account .card-device-caption>span{padding:1px 4px;border-radius:4px;background:#fff6f7;color:#a02a3f;font-size:11.5px;font-weight:600;line-height:1.25;box-shadow:none}
@media(max-width:360px){.complete-account .card-device-caption>span{padding:1px 3px;font-size:10.5px;font-weight:600}}

/* Canva y Microsoft: pie de tarjeta centrado y alineado entre columnas. */
.app-card>.card-device-line{width:100%;align-items:center;text-align:center;box-sizing:border-box}
.card-device-caption{width:100%;display:flex;flex-direction:row;align-items:baseline;justify-content:center;gap:4px;flex-shrink:1;text-align:center}
.card-device-caption>span,.card-device-caption>small{margin:0;text-align:center}
.card-device-line .device-icons{width:100%;justify-content:center}
.catalog-grid[data-mode="other"] .app-card>.card-device-line{margin-top:auto}
.catalog-grid[data-mode="other"] .app-card>.term-picker{margin-top:0}

/* Navegación móvil más contenida, sin relleno inferior excesivo. */
:root{--nav-height:52px;--safe:min(env(safe-area-inset-bottom,0px),16px)}
html{min-height:100%;overscroll-behavior-y:none}
body{min-height:100svh;overscroll-behavior-y:none}
@supports(height:100dvh){body{min-height:100dvh}}
.bottom-nav{height:calc(var(--nav-height) + var(--safe));padding:4px 16px calc(4px + var(--safe));gap:0;align-items:center;backdrop-filter:none;background:#fff;box-shadow:none}
.bottom-nav>button,.bottom-nav #homeNav,.bottom-nav #homeNav[aria-current="page"],.bottom-nav #chatNav,.bottom-nav #chatNav[aria-current="page"]{min-height:44px;height:44px;max-height:44px;max-width:160px;border-radius:10px;gap:7px;font-size:13px;font-weight:600;letter-spacing:0}
.bottom-nav>button+button{margin-left:16px}
.bottom-nav>button+button:before{left:-9px;top:12px;bottom:12px;background:#e5e5e5}
.bottom-nav #homeNav svg{width:20px;height:20px}
.bottom-nav #chatNav svg{width:24px;height:24px;color:#fff;stroke-width:2.1}
.bottom-nav #chatNav svg path:last-child{fill:currentColor;stroke:none}
.pro-crown{position:absolute;right:-5px;bottom:-4px;width:18px;height:18px;padding:2px;border:1px solid #eee2c3;border-radius:50%;background:#fffaf0;color:#a97813;fill:currentColor;box-shadow:0 1px 2px #00000010}
.app-card>.app-description{word-spacing:0;letter-spacing:0;text-align:left;text-align-last:left;text-wrap:wrap;hyphens:none;overflow-wrap:normal}

/* Base gris humo para distinguir la navegación de las tarjetas. */
.bottom-nav{background:#e9eaed;border-top:1px solid #d8dade;box-shadow:0 -2px 9px #14182008;backdrop-filter:none}
.bottom-nav>button+button:before{background:#cdd0d5}

/* Dos acciones flotantes sin franja de color. */
.bottom-nav{background:transparent;border:0;box-shadow:none;backdrop-filter:none}
.bottom-nav>button+button:before{display:none}
.bottom-nav #homeNav,.bottom-nav #chatNav{box-shadow:0 2px 6px #00000012}
/* Cantidad y plazo integrados al bloque de precio; Comprar centrado en toda la barra. */
.purchase-bar,.purchase-bar.has-many-logos{row-gap:1px;padding-top:5px;padding-bottom:5px;min-height:60px;align-items:center}
.purchase-bar>#purchaseCount{grid-column:2/4;grid-row:1;align-self:end;font-size:10.5px;line-height:1.2;font-weight:550}
.purchase-copy{grid-column:3;grid-row:2;align-self:center;gap:1px}
.purchase-tools .clear-order{grid-column:1;grid-row:1/3;align-self:center}
.purchase-tools .selected-logos,.purchase-bar.has-many-logos .selected-logos{grid-column:2;grid-row:2;align-self:center}
.purchase-bar #buyNow,.purchase-bar.has-many-logos #buyNow{grid-column:4;grid-row:1/3;align-self:center;justify-content:center;gap:7px;padding:8px 10px;min-height:48px;height:48px;line-height:1.1}
.purchase-bar #buyNow svg{display:block;width:20px;height:20px;flex:0 0 20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.purchase-copy>.purchase-price-label{line-height:1.1}
@media(max-width:360px){.purchase-bar>#purchaseCount{font-size:9.5px}.purchase-bar #buyNow{padding:8px;gap:5px}.purchase-bar #buyNow svg{width:18px;height:18px;flex-basis:18px}}

.purchase-copy{display:grid;grid-template-columns:max-content minmax(0,1fr);column-gap:4px;row-gap:2px;align-items:baseline}
.purchase-copy>.purchase-before{grid-column:1/-1;grid-row:1}
.purchase-copy>.purchase-price-label{grid-column:1;grid-row:2;font-size:10px;line-height:1.2}
.purchase-copy>#purchaseTotal{grid-column:2;grid-row:2;line-height:1.1;text-align:left}

/* Base carbón continua con acciones de alto contraste. */
.bottom-nav{background:#121315;border-top:1px solid #26282d;box-shadow:0 -2px 10px #0000000c;backdrop-filter:none}
.bottom-nav #homeNav,.bottom-nav #homeNav[aria-current="page"]{background:#000;border:1px solid #e6e6e6;color:#fff;box-shadow:none}
.bottom-nav #chatNav,.bottom-nav #chatNav[aria-current="page"]{background:#19795b;border:1px solid transparent;box-shadow:none}
/* Evitar ampliación por gestos y al enfocar el campo del chat. */
#chatView{touch-action:pan-y;overscroll-behavior:contain}
#chatView .conversation{touch-action:pan-y}
#chatView input:not([type="file"]),#chatView textarea{font-size:16px;touch-action:pan-y}
#chatView button{touch-action:manipulation}

/* Tienda negro sólido, sin borde blanco que diluya el relleno. */
.bottom-nav{background:#242528;border-top-color:#303135}
nav.bottom-nav>button#homeNav,nav.bottom-nav>button#homeNav[aria-current="page"],nav.bottom-nav>button#homeNav:hover,nav.bottom-nav>button#homeNav:active{background:#000;background-image:none;border:1px solid #000;color:#fff;opacity:1;filter:none;box-shadow:none}
nav.bottom-nav>button#homeNav span,nav.bottom-nav>button#homeNav svg{color:#fff;opacity:1}

/* Base blanca aprobada; conservar las acciones negra y verde. */
.bottom-nav{background:#fff;border-top:1px solid #e8e8e8;box-shadow:none}

/* Barra negra unificada: Tienda integrada y Chat como única acción de color. */
.bottom-nav{background:#000;border-top:1px solid #000;box-shadow:none}
nav.bottom-nav>button#homeNav,nav.bottom-nav>button#homeNav[aria-current="page"],nav.bottom-nav>button#homeNav:hover,nav.bottom-nav>button#homeNav:active{background:transparent;background-image:none;border:0;border-radius:0;box-shadow:none;color:#fff}
.bottom-nav #chatNav,.bottom-nav #chatNav[aria-current="page"]{background:#19795b;border:0;border-radius:10px;color:#fff;box-shadow:none}
.bottom-nav>button+button:before{display:none}

/* Tienda vuelve a tener contorno reconocible sobre la barra negra. */
nav.bottom-nav>button#homeNav,nav.bottom-nav>button#homeNav[aria-current="page"],nav.bottom-nav>button#homeNav:hover,nav.bottom-nav>button#homeNav:active{background:#000;border:1px solid #777a80;border-radius:10px;color:#fff;box-shadow:none}

/* Contraste entre superficies, sin contornos ni relieve. */
.bottom-nav{background:#242528;border-top:0;box-shadow:none}
nav.bottom-nav>button#homeNav,nav.bottom-nav>button#homeNav[aria-current="page"],nav.bottom-nav>button#homeNav:hover,nav.bottom-nav>button#homeNav:active{background:#000;border:0;border-radius:10px;box-shadow:none;color:#fff}

/* WebChat conversacional: burbujas, resumen compacto y acciones discretas. */
.chat-header{min-height:58px;padding:7px 12px;background:#fff;gap:9px}
.chat-header h1{font-size:15px;font-weight:650;margin:0 0 3px}.chat-header>div>span{font-size:10px;line-height:1.2;color:#777}
.brand-avatar{width:36px;height:36px;font-size:12px;border-radius:50%;flex-shrink:0}
.conversation{padding:12px 11px 10px;background-color:#efece6;background-image:radial-gradient(#8d8b850d .7px,transparent .7px);background-size:19px 19px}
.chat-bubble{width:fit-content;max-width:88%;padding:8px 10px;margin:0 0 8px;border-radius:4px 11px 11px;background:#fff;line-height:1.4;font-size:13px;color:#242424;box-shadow:0 1px 1px #00000009}
.chat-bubble.user-message{background:#d9fdd3;border-radius:11px 4px 11px 11px;margin-left:auto}
.order-card:not(.order-editor){width:92%;max-width:420px;padding:9px 10px;margin:0 0 8px;border-radius:4px 11px 11px;background:#fff;border:0;box-shadow:0 1px 1px #0000000b}
.order-card:not(.order-editor)>header{min-height:23px;margin-bottom:3px;gap:6px}
.order-card:not(.order-editor) h2{font-size:12px;font-weight:650;line-height:1.3}
.order-card .edit-order{min-height:26px;padding:3px 0 3px 6px;background:transparent;color:#28745f;border:0;border-radius:0;font-size:10px;font-weight:500;white-space:nowrap}
.chat-order-items{max-height:108px;overflow-y:auto}
.chat-order-line{display:flex;align-items:center;gap:7px;padding:5px 0;min-height:35px;border-bottom:1px solid #f1f1f1}
.chat-order-line:last-child{border-bottom:0}.chat-order-line .app-logo{width:23px;height:23px;border-radius:5px}
.chat-order-line>div{flex:1;min-width:0}.chat-order-line strong{font-size:11px;font-weight:550;line-height:1.25}.chat-order-line small{font-size:10px;color:#7a7a7a;line-height:1.2;margin-top:2px}
.chat-order-summary{margin-top:5px;padding-top:6px;border-top:1px solid #ededed}.chat-order-reference{display:flex;justify-content:space-between;gap:8px;font-size:9px;color:#858585;line-height:1.3;margin-bottom:5px}
.chat-order-reference s{text-decoration-color:#bc838366;text-decoration-thickness:.6px}
.chat-order-total{display:flex;align-items:baseline;justify-content:space-between;gap:8px;font-size:11px;color:#333}.chat-order-total strong{font-size:16px;line-height:1.2;color:#171717;font-weight:700}
.payment-message>.chat-bubble{margin-bottom:6px}.payment-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;width:92%;max-width:420px;margin:0 0 8px}
.payment-option{display:flex;align-items:center;justify-content:flex-start;gap:6px;min-height:42px;margin:0;padding:7px 8px;border:1px solid #dce4de;border-radius:9px;background:#fff;color:#326653;font-size:11px;line-height:1.2;text-align:left;box-shadow:none}
.payment-option .payment-icon{width:19px;height:19px;min-width:19px;font-size:15px;background:none;border-radius:0}.payment-option>span:last-child{display:none}.payment-option[aria-pressed="true"]{border-color:#6ba68d;background:#edf7ef}
.chat-empty{display:flex;flex-wrap:wrap;gap:7px;max-width:100%;margin:0 0 9px;padding:0;background:none;border:0;box-shadow:none}
.chat-empty>.chat-intent,.chat-empty>.chat-intent:first-child{display:inline-flex;width:auto;max-width:100%;min-height:36px;align-items:center;margin:0;padding:8px 11px;border:1px solid #d2dfd6;border-radius:18px;background:#fff;color:#326653;font-size:12px;font-weight:500;line-height:1.2;text-align:left;box-shadow:none}
.composer{padding:6px 10px;background:#efece6;gap:7px}.composer input:not([type="file"]){background:#fff;min-height:42px;padding:9px 12px;border:0;box-shadow:none;font-size:16px}
.composer>button[type="submit"]{width:42px;height:42px;background:#19795b;color:#fff;font-size:18px}

/* Identidad de atención y opciones iniciales para quien aún no eligió apps. */
.chat-header>.brand-avatar{width:40px;height:40px;padding:0;overflow:hidden;border-radius:50%;background:#e7e3df;border:1px solid #e6e2dd}
.brand-avatar>img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.chat-header>div{min-width:0;flex:1}.chat-header #chatTitle{font-size:13px;line-height:1.25;font-weight:650;white-space:normal;letter-spacing:-.15px}
.chat-empty>.chat-intent,.chat-empty>.chat-intent:first-child{max-width:100%;font-size:12px;min-height:36px;line-height:1.25;padding:8px 11px}

/* Ajustar la conversación al área realmente visible encima del teclado. */
.chat-active #chatView{bottom:auto;min-height:0;max-height:none;overflow:hidden}
.chat-active.keyboard-open .bottom-nav{display:none}
.chat-active.keyboard-open .chat-header{min-height:54px;padding-top:5px;padding-bottom:5px}
.chat-active.keyboard-open .composer{padding:5px 9px;flex-shrink:0}
#conversation{min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch}

/* El pedido pertenece al cliente; los datos de pago son respuestas de atención. */
.order-card.customer-order:not(.order-editor){margin-left:auto;background:#d9fdd3;border-radius:11px 4px 11px 11px}
.customer-order .chat-order-summary,.customer-order .chat-order-line{border-color:#b9dfb5}
.payment-options{grid-template-columns:1fr;max-width:340px}
.payment-option{min-height:42px;font-size:12px;padding:10px 12px}
.payment-details{width:94%;max-width:390px;background:#fff;border-radius:4px 12px 12px;padding:12px;margin:0 0 10px;color:#262c29;box-sizing:border-box}
.payment-details h2{font-size:14px;margin:0 0 7px;font-weight:650}
.payment-intro,.payment-small{font-size:11px;line-height:1.45;margin:5px 0;color:#69746e}
.payment-account{border:1px solid #e0e7e2;border-radius:9px;padding:10px;margin-top:9px}
.payment-account h3{font-size:13px;margin:0 0 8px;color:#225d48}
.payment-account dl{display:grid;grid-template-columns:62px 1fr;gap:4px 7px;font-size:11px;margin:0 0 9px;line-height:1.4}
.payment-account dt{color:#727b75}.payment-account dd{margin:0;font-weight:500}
.payment-number{display:grid;grid-template-columns:1fr auto;gap:4px 8px;align-items:center}
.payment-number small{font-size:10px;color:#727b75;grid-column:1/-1}
.payment-number strong{font-size:13px;letter-spacing:0;font-variant-numeric:tabular-nums;overflow-wrap:anywhere;user-select:all}
.copy-payment{font-size:11px;background:#eef5f0;color:#225d48;border:0;border-radius:6px;min-height:34px;padding:6px 9px}
.deposit-stores{display:flex;flex-wrap:wrap;gap:5px;margin:9px 0}
.deposit-stores span{font-size:10px;background:#f2f5f3;color:#425549;padding:5px 7px;border-radius:5px}
.payment-receipt{font-size:12px;line-height:1.45;margin:12px 0 0}

/* Datos de pago: tipografía ligera y separación discreta. */
.payment-details{padding:13px 12px;border-radius:5px 13px 13px;box-shadow:0 1px 2px #14261a08}
.payment-details h2{font-size:13px;font-weight:600;letter-spacing:-.1px}
.payment-account{border:1px solid #e9eeeb;border-radius:11px;padding:11px;margin-top:10px;background:#fcfdfc}
.payment-account h3{font-size:12px;font-weight:600;color:#263e32;margin-bottom:9px}
.payment-account dl{gap:5px 8px;line-height:1.5}.payment-account dd{font-weight:400}
.payment-number{padding-top:8px;border-top:1px solid #edf0ed}
.payment-number strong{font-size:13px;font-weight:550;color:#28352e}
.copy-payment{background:#edf3ef;font-weight:500;border-radius:8px;font-size:10px;padding:6px 10px}
.payment-receipt{font-size:11px;line-height:1.6;color:#4a5950;padding-top:2px}

/* Transferencias compactas: datos esenciales en dos filas y sin cajas anidadas. */
.payment-details{padding:11px 12px;border-radius:5px 12px 12px}
.payment-details h2{font-size:12px;font-weight:550;margin-bottom:4px}
.payment-intro{font-size:10px;margin:2px 0 7px}
.payment-account{position:relative;border:0;border-top:1px solid #e8ede9;border-radius:0;background:transparent;padding:9px 0 7px;margin:0}
.payment-account h3{font-size:12px;font-weight:550;margin:0 0 5px;color:#253b2f}
.payment-account dl{grid-template-columns:48px 1fr;font-size:10px;gap:2px 7px;line-height:1.35;margin:0 0 6px}
.payment-account dt{color:#89918b}.payment-account dd{font-weight:400;color:#4d5850}
.payment-number{grid-template-columns:1fr auto;border:0;padding:0;gap:3px 8px}
.payment-number small{grid-column:1;font-size:9px;line-height:1.1}
.payment-number strong{grid-column:1;font-size:12px;font-weight:500;line-height:1.3;letter-spacing:.1px}
.payment-number .copy-payment{grid-column:2;grid-row:1 / 3;min-height:30px;font-size:10px;font-weight:450;border-radius:15px;background:#eff4f0;padding:5px 10px}
.payment-receipt{font-size:10px;line-height:1.45;margin:7px 0 0;padding:7px 0 0;border-top:1px solid #edf0ed;color:#68756b}
.payment-number small{display:none}.payment-number strong{grid-row:1}.payment-number .copy-payment{grid-row:1}
.payment-number{align-items:center}

/* Peso visual ligero, manteniendo el tamaño legible de los datos. */
.payment-details h2,.payment-account h3{font-weight:500}
.payment-account dd,.payment-number strong{font-weight:400}
.payment-holder{display:flex;align-items:center;justify-content:space-between;gap:8px;user-select:text}
.copy-holder{border:0;background:transparent;color:#527160;font-size:10px;font-weight:400;padding:1px 0 1px 6px;min-height:24px;flex-shrink:0}

/* Una misma rejilla para titular y CLABE, con títulos de color discreto. */
.payment-details>h2{color:#17634d;font-size:14px;font-weight:550;margin-bottom:4px}
.payment-details>.payment-intro{color:#78847d;font-size:11px;margin-bottom:10px}
.bank-heading{display:flex;align-items:center;gap:9px;margin-bottom:7px}
.bank-heading h3{font-size:11px;font-weight:500;margin:0;color:#3e4b43}
.bank-logo{width:70px;height:23px;object-fit:contain;object-position:left center;flex-shrink:0}
.bank-detail-row{display:grid;grid-template-columns:minmax(0,1fr) 55px;gap:10px;align-items:center;margin:5px 0}
.bank-detail-row>div{min-width:0}.bank-detail-row small{display:block;color:#859088;font-size:9px;line-height:1.4;margin-bottom:1px}
.bank-detail-value{display:block;color:#35433a;font-size:12px;line-height:1.4;font-weight:400;user-select:all;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.payment-copy{width:55px;min-height:31px;border:1px solid #e0e9e3;border-radius:8px;background:#f4f8f5;color:#3f6a51;font-size:10px;font-weight:450;padding:5px 7px}

/* Jerarquía de pago: concepto primero y datos copiables consecutivos. */
.payment-details>h2{display:block;background:#edf5f0;color:#20573f;border-left:3px solid #4e8d6a;padding:9px 10px;border-radius:3px 8px 8px 3px;margin:0 0 7px;font-size:14px;font-weight:550}
.payment-details>.payment-intro{margin:0 1px 10px}
.bank-logo{width:108px;height:30px}
.bank-heading{justify-content:space-between;margin:2px 0 9px;gap:12px}
.bank-heading h3{font-size:10px;color:#7b877e;font-weight:400}
.bank-detail-row{margin:6px 0;grid-template-columns:minmax(0,1fr) 55px}
.payment-receipt{font-size:11px;line-height:1.5;text-wrap:pretty;max-width:100%;margin-top:9px}
.chat-header #connectionStatus{display:inline-flex;align-items:center;gap:4px;color:#2873c7;font-size:10px;font-weight:500}
.chat-header #connectionStatus:before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:#3287ed}

/* Cabecera sin flecha: identidad de atención y código local del visitante. */
.chat-header{padding-left:10px;gap:8px}
.chat-header>.brand-avatar{width:37px;height:37px}
.chat-header>div{flex:1;min-width:0}
.chat-header #chatTitle{font-size:12px;line-height:1.3;letter-spacing:0}
.chat-header>.customer-identity{display:flex;flex-direction:column;align-items:flex-end;gap:3px;flex-shrink:0;padding-left:8px;border-left:1px solid #edf0ee;color:#7c8780}
.customer-identity>span{font-size:9px;line-height:1.2;white-space:nowrap}
.customer-identity>strong{font-size:12px;font-weight:500;color:#34483b;font-variant-numeric:tabular-nums;line-height:1.25;letter-spacing:.3px}

/* Acciones distinguibles y separadas para evitar copiar el dato equivocado. */
.bank-detail-row{grid-template-columns:minmax(0,1fr) 94px;column-gap:10px;margin:8px 0}
.bank-detail-row:has(.payment-copy)+.bank-detail-row:has(.payment-copy){margin-top:14px;padding-top:10px;border-top:1px solid #edf1ee}
.payment-copy{width:94px;min-height:40px;padding:9px 8px;font-size:10px;border-radius:9px;line-height:1.25;white-space:normal}
.bank-detail-row:last-child .payment-copy{background:#e8f2ec;border-color:#d7e7dd;color:#245a3b}

/* Indicador de la maqueta con el estilo verde de mensajería. */
.chat-header #connectionStatus{color:#21965a;font-weight:400}
.chat-header #connectionStatus:before{background:#25a765}

/* Nombre e indicador de presencia como un solo bloque compacto. */
.chat-header>div{display:flex;flex-direction:column;justify-content:center;gap:1px;align-self:center}
.chat-header #chatTitle{margin:0;line-height:1.2;font-size:12px;font-weight:600}
.chat-header #connectionStatus{margin:0;line-height:1.15;font-size:10px;align-self:flex-start}

/* Avatar de atención con más presencia en móvil, como en mensajería. */
.chat-header{min-height:64px;padding:7px 10px;gap:9px}
.chat-header>.brand-avatar{width:48px;height:48px;min-width:48px;border:0}
.chat-header .brand-avatar>img{width:100%;height:100%;object-fit:cover;object-position:center 38%}
.chat-active.keyboard-open .chat-header{min-height:60px;padding-top:5px;padding-bottom:5px}
@media(max-width:360px){.chat-header>.brand-avatar{width:44px;height:44px;min-width:44px}.chat-header{gap:7px}.chat-header #chatTitle{font-size:11px}}

/* Datos bancarios compactos, sin perder separación entre las acciones. */
.payment-details{padding:10px 11px;max-width:355px}
.payment-details>h2{font-size:13px;padding:7px 9px;margin-bottom:5px}
.payment-details>.payment-intro{font-size:10px;margin-bottom:6px}
.payment-account{padding:7px 0 6px}
.bank-heading{margin:0 0 5px;gap:9px}
.bank-logo{width:92px;height:24px}
.bank-heading h3{font-size:9px}
.bank-detail-row{grid-template-columns:minmax(0,1fr) 82px;gap:9px;margin:4px 0;min-height:26px}
.bank-detail-row small{display:inline;font-size:10px;line-height:1.4;color:#819087;margin-right:7px}
.bank-detail-value{display:inline;font-size:11px;line-height:1.4;letter-spacing:0}
.bank-detail-row:last-child small{display:block;margin:0 0 1px;font-size:9px}
.bank-detail-row:last-child .bank-detail-value{display:block;font-size:12px;font-weight:450;font-variant-numeric:tabular-nums}
.bank-detail-row:has(.payment-copy)+.bank-detail-row:has(.payment-copy){margin-top:8px;padding-top:7px}
.payment-copy{width:82px;min-height:34px;padding:6px;font-size:9px;border-radius:7px}
.payment-receipt{font-size:10px;line-height:1.45;margin-top:6px;padding-top:7px}

/* Cabecera compacta sin líneas que enmarquen el nombre. */
.chat-header{min-height:54px;padding:3px 9px;border:0;box-shadow:none;outline:0}
.chat-view{border-left:0;border-right:0;border-top:0}
.chat-header>.customer-identity{border-left:0;padding-left:5px}
.chat-active.keyboard-open .chat-header{min-height:54px;padding-top:3px;padding-bottom:3px}

/* Dos mensajes bancarios independientes, compactos y sin datos mezclados. */
.payment-details.transfer-details{padding:0;background:transparent;box-shadow:none;border-radius:0;max-width:355px;width:94%;margin-bottom:9px}
.transfer-details>h2{display:inline-block;background:#fff;border:0;border-radius:4px 10px 10px;padding:8px 10px;margin:0 0 5px;font-size:12px}
.transfer-details>.payment-intro{margin:0 2px 6px;font-size:10px}
.transfer-details>.payment-account{background:#fff;border:0;border-radius:4px 11px 11px;padding:9px 11px;margin:0 0 7px;box-shadow:0 1px 1px #00000008}
.transfer-details .bank-heading{margin:0 0 5px;padding-bottom:5px;border-bottom:1px solid #edf1ee}
.transfer-details .bank-logo{width:99px;height:24px}
.transfer-details .bank-detail-row{margin:3px 0;min-height:24px;grid-template-columns:minmax(0,1fr) 82px}
.transfer-details .bank-detail-row:has(.payment-copy)+.bank-detail-row:has(.payment-copy){margin-top:5px;padding-top:0;border:0}
.transfer-details .bank-detail-row small{display:inline;font-size:9px;margin-right:6px}
.transfer-details .bank-detail-row:last-child .bank-detail-value{display:inline;font-size:12px}
.transfer-details .payment-copy{min-height:32px}
.transfer-details>.payment-receipt{border:0;background:#fff;border-radius:4px 10px 10px;padding:8px 10px;margin:0;font-size:10px}

/* Separación únicamente bajo la cabecera, sin borde superior. */
.chat-active #chatView{border-top:0;box-shadow:none;padding-top:0}
.chat-header{min-height:52px;padding:1px 9px 2px;margin-top:0;border-top:0;border-left:0;border-right:0;border-bottom:1px solid #e3e8e4;box-shadow:none}
.chat-header:before,.chat-header:after{display:none}
.chat-active.keyboard-open .chat-header{min-height:52px;padding-top:1px;padding-bottom:2px;border-top:0;border-bottom:1px solid #e3e8e4}

/* Papel de conversación con ilustraciones discretas y originales. */
#conversation.conversation{background-color:#efece4;background-image:url('images/chat-doodles.svg');background-repeat:repeat;background-size:320px 360px;background-attachment:local}

/* Un mismo estilo para copiar nombre y CLABE; concepto entre ambas acciones. */
.payment-copy,.bank-detail-row:last-child .payment-copy{background:#e8f2ec;border:1px solid #d7e7dd;color:#245a3b;border-radius:7px;font-size:9px;font-weight:450;min-height:34px;padding:6px;width:82px}
.customer-identity>span{font-size:9px}

/* Valores centrados en la misma columna y acciones idénticas. */
.payment-details .payment-account .bank-detail-row>div{display:grid;grid-template-columns:43px minmax(0,1fr);align-items:center;gap:5px}
.payment-details .payment-account .bank-detail-row small{display:block;margin:0;font-size:9px;text-align:left;line-height:1.4}
.payment-details .payment-account .bank-detail-row .bank-detail-value{display:block;text-align:center;font-size:11px;line-height:1.4;letter-spacing:0;font-weight:400;overflow-wrap:anywhere}
.payment-details .payment-account .bank-detail-row .payment-copy,.payment-details .payment-account .bank-detail-row .payment-copy:hover,.payment-details .payment-account .bank-detail-row .payment-copy:active{background:#e8f2ec;border:1px solid #d7e7dd;color:#245a3b;box-shadow:none;font-weight:450;min-height:34px;border-radius:7px}

.chat-header>.customer-identity{border-left:1px solid #dce3dd;padding-left:10px;margin-left:3px;align-self:center;gap:3px}
.customer-identity>span{font-size:9px;line-height:1.2;color:#7c8780}
.customer-identity>strong{font-size:12px;line-height:1.2;font-weight:500}

/* El desplazamiento queda dentro de la conversación, sin exponer el banner negro. */
html:has(body.chat-active){background:#efece4;overscroll-behavior:none;overflow:hidden}
body.chat-active{background:#efece4;overflow:hidden;height:100dvh;overscroll-behavior:none}
body.chat-active .store-shell{visibility:hidden}
.chat-active #chatView{background:#efece4;overscroll-behavior:none;isolation:isolate}
.chat-active #conversation{overscroll-behavior: none;background-attachment:scroll}

.chat-header>button.customer-identity{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;flex-shrink:0;align-self:center;margin:0 0 0 3px;padding:3px 0 3px 10px;border:0;border-left:1px solid #dce3dd;border-radius:0;background:transparent;box-shadow:none;min-height:34px;color:#7c8780}
.customer-profile-dialog{width:min(340px,calc(100vw - 32px));padding:20px;border:0;border-radius:16px;color:#293a30;background:#fff;box-shadow:0 15px 65px #0002}
.customer-profile-dialog::backdrop{background:#14251b66}
.customer-profile-dialog header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.customer-profile-dialog h2{font-size:17px;margin:0;font-weight:600}
.customer-profile-dialog header button{border:0;background:transparent;font-size:25px;color:#697b6d;padding:0 5px}
.customer-profile-dialog label{display:block;font-size:12px;color:#536659;margin:12px 0 0}
.customer-profile-dialog input{display:block;width:100%;min-height:43px;margin-top:5px;padding:9px 10px;border:1px solid #dfe7e1;border-radius:8px;background:#fff;font-size:16px;box-sizing:border-box;color:#293a30}
.customer-profile-dialog input[readonly]{background:#f3f6f4;color:#7e8b82}
.customer-profile-dialog p,.customer-profile-dialog small{display:block;font-size:10px;line-height:1.5;color:#859087;margin:6px 0}
.customer-profile-dialog .save-customer-profile{width:100%;min-height:43px;margin-top:14px;background:#171b18;color:#fff;border:0;border-radius:9px;font-size:13px}

/* Pagos legibles: datos y acciones más grandes, con el mismo diseño compacto. */
.payment-details,.payment-details.transfer-details{max-width:390px;width:96%}
.payment-options{max-width:390px;width:96%}
.payment-option{font-size:14px;min-height:46px;padding:11px 12px}
.payment-details>h2{font-size:15px}
.payment-details>.payment-intro{font-size:12px;line-height:1.4;margin-bottom:7px}
.payment-details .bank-heading h3{font-size:11px}
.payment-details .bank-logo{width:108px;height:28px}
.payment-details .bank-detail-row{grid-template-columns:minmax(0,1fr) 94px;gap:8px;margin:6px 0;min-height:32px}
.payment-details .payment-account .bank-detail-row>div{grid-template-columns:50px minmax(0,1fr);gap:5px}
.payment-details .payment-account .bank-detail-row small{font-size:11px;line-height:1.4}
.payment-details .payment-account .bank-detail-row .bank-detail-value{font-size:13px;line-height:1.45;font-weight:450}
.payment-details .payment-account .bank-detail-row:last-child>div{display:block}
.payment-details .payment-account .bank-detail-row:last-child small{display:block;text-align:left;font-size:10px;margin:0 0 2px}
.payment-details .payment-account .bank-detail-row:last-child .bank-detail-value{font-size:14px;text-align:left;white-space:nowrap}
.payment-details .payment-account .bank-detail-row .payment-copy,.payment-details .payment-account .bank-detail-row .payment-copy:hover,.payment-details .payment-account .bank-detail-row .payment-copy:active{width:94px;min-height:42px;font-size:11px;padding:8px 6px}
.payment-details>.payment-receipt,.transfer-details>.payment-receipt{font-size:13px;line-height:1.4;padding:9px 10px;margin-top:7px;text-wrap:pretty}
.deposit-stores span{font-size:12px;padding:6px 8px}
@media(max-width:360px){.payment-details .bank-detail-row{grid-template-columns:minmax(0,1fr) 88px;gap:6px}.payment-details .payment-account .bank-detail-row .payment-copy{width:88px;font-size:10px}.payment-details .payment-account .bank-detail-row>div{grid-template-columns:43px minmax(0,1fr);gap:4px}.payment-details .payment-account .bank-detail-row .bank-detail-value{font-size:12px}.payment-details .payment-account .bank-detail-row:last-child .bank-detail-value{font-size:13px}}
.payment-details .payment-account .bank-detail-row:last-child .bank-detail-value{text-align:center}

/* Avisos breves junto al menú, sin cubrir el centro de la pantalla. */
#status.toast{top:auto;bottom:calc(var(--nav-height) + var(--safe) + 8px);left:50%;transform:translateX(-50%);max-width:calc(100vw - 32px);padding:8px 13px;font-size:12px;line-height:1.3;border-radius:9px;box-shadow:0 2px 8px #00000012}

/* El pedido muestra todas las aplicaciones, incluida la cuarta, sin scroll interno. */
.order-card .chat-order-items{max-height:none;overflow:visible}
.purchase-bar.has-many-logos .selected-logos{display:grid;grid-template-columns:repeat(2,18px);gap:3px;max-width:42px;overflow:visible;max-height:none;align-content:center}
.purchase-bar.has-many-logos .selected-logos .app-logo{width:18px;height:18px;min-width:18px;flex-shrink:0}

/* Fechas del historial y hora discreta por mensaje. */
.chat-date-separator{width:fit-content;max-width:95%;margin:7px auto 12px;padding:5px 9px;border-radius:7px;background:#f9fbf8e8;color:#748077;font-size:10px;line-height:1.4;text-align:center;box-shadow:0 1px 1px #00000007}
.message-meta{display:block;margin:5px 0 0;text-align:right;color:#859087;font-size:9px;font-weight:400;line-height:1.2}
.transfer-details>.message-meta{margin:4px 3px 0}
html,body{border-top:0;outline:0}
body.chat-active #chatView,body.chat-active .chat-header,body.chat-active .brand-avatar{border-top:0;box-shadow:none}

/* Los tres valores empiezan exactamente en la misma columna. */
.payment-details .payment-account .bank-detail-row>div,.payment-details .payment-account .bank-detail-row:last-child>div{display:grid;grid-template-columns:48px minmax(0,1fr);gap:5px;align-items:center}
.payment-details .payment-account .bank-detail-row small,.payment-details .payment-account .bank-detail-row:last-child small{display:block;margin:0;text-align:left;font-size:10px}
.payment-details .payment-account .bank-detail-row .bank-detail-value,.payment-details .payment-account .bank-detail-row:last-child .bank-detail-value{display:block;text-align:left;font-size:13px;line-height:1.45;white-space:normal;overflow-wrap:anywhere;font-weight:450}
@media(max-width:360px){.payment-details .payment-account .bank-detail-row>div,.payment-details .payment-account .bank-detail-row:last-child>div{grid-template-columns:40px minmax(0,1fr);gap:4px}.payment-details .payment-account .bank-detail-row .bank-detail-value,.payment-details .payment-account .bank-detail-row:last-child .bank-detail-value{font-size:12px}}

/* Confirmación breve al centro que permite seguir tocando la pantalla. */
#status.toast{top:50%;bottom:auto;left:50%;transform:translate(-50%,-50%);width:max-content;max-width:calc(100vw - 48px);padding:10px 16px;border-radius:11px;font-size:13px;line-height:1.35;text-align:center;background:#202923ed;color:#fff;box-shadow:0 3px 14px #00000018;pointer-events:none;z-index:100}

/* Integrar la cabecera con el fondo claro del navegador, sin un segundo borde. */
html:has(body.chat-active){background:#fafafa}
body.chat-active .chat-header{background:#fafafa;border-top:0;outline:0;box-shadow:none}
body.chat-active #chatView{border-top:0;outline:0}

/* Separar el avatar del borde del navegador conservando una cabecera compacta. */
body.chat-active .chat-header{min-height:54px;padding:6px 9px;border-bottom:1px solid #e3e8e4}
.chat-header>.brand-avatar{width:42px;height:42px;min-width:42px;flex-shrink:0}
.chat-active.keyboard-open .chat-header{min-height:54px;padding-top:6px;padding-bottom:6px}
@media(max-width:360px){.chat-header>.brand-avatar{width:40px;height:40px;min-width:40px}}

/* Mismo papel y personajes originales del panel VaeChat. */
#conversation.conversation{background-color:#f5f2ed;background-image:linear-gradient(#f5f2edad,#f5f2edad),url('images/vae-doodle-host.svg'),url('images/vae-doodle-sales.svg'),url('images/vae-doodle-agenda.svg'),url('images/vae-doodle-operations.svg'),url('images/vae-doodle-finance.svg'),url('images/vae-doodle-support.svg'),url('images/vae-doodle-supervisor.svg'),url('images/vae-chat-doodle-paper-v2.png');background-size:auto,76px 82px,76px 82px,76px 82px,76px 82px,76px 82px,76px 82px,76px 82px,420px 420px;background-position:0 0,9% 7%,67% 4%,38% 28%,78% 43%,8% 52%,47% 69%,76% 82%,0 0;background-repeat:no-repeat,no-repeat,no-repeat,no-repeat,no-repeat,no-repeat,no-repeat,no-repeat,repeat;background-attachment:scroll}
.chat-active #chatView,.chat-active .composer,body.chat-active{background-color:#f5f2ed}

/* Hora uniforme en la esquina inferior derecha de cada mensaje. */
#conversation .message-meta{display:block;width:100%;box-sizing:border-box;clear:both;margin:5px 0 0;padding:0;text-align:right;font-size:9px;line-height:1.2;color:#849087;font-weight:400;letter-spacing:0;white-space:nowrap}
#conversation .payment-message>.message-meta{width:96%;max-width:390px}
#conversation .transfer-details>.message-meta{margin:5px 0 0;padding-right:3px}
