#app .store-settings-home{width:100%;max-width:1120px;margin:0 auto}
#app .store-settings-home .page-title{margin-bottom:8px}
#app .store-settings-intro{margin:0 0 24px;color:#8a8073;font-size:13px;line-height:1.6}
#app .store-settings-list{display:flex;flex-direction:column;gap:12px}
#app .store-settings-row{display:flex;align-items:center;gap:20px;width:100%;min-height:96px;padding:20px 24px;text-align:left;background:#fff;border:1px solid #e5e0d8;border-radius:14px;color:#37322b;cursor:pointer;box-shadow:0 2px 4px #483b2b03;transition:background .2s,border-color .2s,box-shadow .2s}
#app .store-settings-row:hover{background:#fffdfa;border-color:#c8beb0;box-shadow:0 4px 12px #483b2b08}
#app .store-settings-row:focus-visible{outline:2px solid #8d7b64;outline-offset:3px}
#app .store-settings-icon{display:grid;place-items:center;flex:0 0 44px;height:44px;border-radius:10px;background:#f2efea;color:#6a5e4f}
#app .store-settings-icon svg{width:24px;height:24px}
#app .store-settings-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:7px}
#app .store-settings-text strong{font-size:15px;font-weight:600;line-height:1.4}
#app .store-settings-text>span{font-size:13px;color:#898075;line-height:1.6}
#app .store-settings-arrow{width:17px;height:17px;flex-shrink:0;color:#9c9285;transition:transform .2s}
#app .store-settings-row:hover .store-settings-arrow{transform:translateX(3px)}
@media(max-width:600px){#app .store-settings-row{padding:18px 16px;gap:14px;min-height:96px}#app .store-settings-text>span{font-size:12px}#app .store-settings-icon{flex-basis:38px;height:38px}#app .store-settings-list{gap:10px}}
/* General settings: one full-width card per row. */
#app .sg-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px;gap:20px}
#app .sg-back{border:0;background:transparent;padding:0;margin-bottom:10px;color:#60594f;cursor:pointer}
#app .sg-card{background:#fff;border:1px solid #e3dfd9;border-radius:16px;padding:24px;margin-bottom:20px}
#app .sg-card h3{margin:0 0 24px;font-size:16px;color:#302d29}
#app .sg-field{display:flex;flex-direction:column;gap:8px;margin-bottom:20px;min-width:0}
#app .sg-field[hidden]{display:none}
#app .sg-field>label,#app .sg-field>span{font-size:14px;color:#39352f}
#app .sg-field input:not([type=hidden]){box-sizing:border-box;width:100%;height:42px;border:1px solid #d8d3cc;border-radius:8px;padding:0 12px;background:#fff;color:#302d29;font:inherit}
#app .sg-field input:focus{outline:2px solid #b8c9f8;outline-offset:1px}
#app .sg-contacts{display:grid;grid-template-columns:1fr 1fr;gap:20px}
#app .sg-help{font-size:12px;line-height:1.6;color:#777168;margin:0 0 16px}
#app .sg-select{position:relative;max-width:600px}
#app .sg-trigger{width:100%;display:flex;justify-content:space-between;align-items:center;gap:12px;border:1px solid #d8d3cc;border-radius:8px;background:white;padding:11px 12px;font:inherit;color:#302d29;cursor:pointer}
#app .sg-trigger svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.5;transition:transform .24s ease}
#app .sg-select.open .sg-trigger svg{transform:rotate(180deg)}
#app .sg-options{position:absolute;top:calc(100% + 5px);left:0;right:0;z-index:50;background:#fff;border:1px solid #ded9d2;border-radius:10px;padding:5px;box-shadow:0 8px 24px #302d291a;opacity:0;visibility:hidden;transform:translateY(-7px);transition:opacity .2s ease,transform .2s ease,visibility .2s;pointer-events:none}
#app .sg-select.open .sg-options{opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto}
#app .sg-options button{display:block;width:100%;text-align:left;border:0;background:transparent;border-radius:6px;padding:10px;font:inherit;color:#302d29;cursor:pointer}
#app .sg-options button:hover,#app .sg-options button:focus-visible,#app .sg-options button[aria-pressed=true]{background:#eeeae4}
#app #sgError{color:#a33232;font-size:14px}
@media(max-width:650px){#app .sg-contacts{grid-template-columns:1fr;gap:0}#app .sg-card{padding:18px}}
#shopNameGate{box-sizing:border-box;width:min(460px,calc(100vw - 32px));max-height:calc(100dvh - 40px);overflow:auto;padding:34px 36px 24px;border:1px solid #e5e0d9;border-radius:22px;background:#fffefa;color:#302d29;box-shadow:0 24px 80px #302d2930;animation:shopNameEnter .28s ease both}
#shopNameGate::backdrop{background:rgba(48,45,41,.26);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
#shopNameGate .shop-name-symbol{width:54px;height:54px;background:#eee9e1;border-radius:16px;display:grid;place-items:center;margin-bottom:24px;color:#665747}
#shopNameGate .shop-name-symbol svg{width:30px;height:30px}
#shopNameGate .shop-name-eyebrow{font-size:12px;color:#81766a;letter-spacing:.6px}
#shopNameGate h2{font-size:23px;line-height:1.4;margin:8px 0 12px;font-weight:650}
#shopNameGate #shopNameGateDescription{font-size:14px;line-height:1.85;color:#756e64;margin:0 0 28px}
#shopNameGate label{display:block;font-size:14px;font-weight:600;margin-bottom:10px}
#shopNameGate input{box-sizing:border-box;width:100%;height:46px;border:1px solid #cec7bd;border-radius:10px;padding:0 13px;font:inherit;background:white;color:#302d29;outline:none}
#shopNameGate input:focus{border-color:#84725e;box-shadow:0 0 0 3px #84725e18}
#shopNameGate .shop-name-meta{display:flex;justify-content:space-between;gap:10px;font-size:11px;color:#91877b;margin-top:9px}
#shopNameGateError{color:#a33232;font-size:13px;min-height:18px;margin:12px 0}
#shopNameGateSave{width:100%;height:46px;background:#625547;color:#fff;border:1px solid #514639;border-radius:10px;font-size:14px;font-weight:600;cursor:pointer;box-shadow:0 2px 4px #302d2912}
#shopNameGateSave:hover{background:#514639}#shopNameGateSave:disabled{opacity:.65;cursor:wait}
#shopNameGate .shop-name-logout{display:block;margin:18px auto 0;border:0;background:transparent;color:#847b70;font-size:12px;cursor:pointer;padding:5px}
@keyframes shopNameEnter{from{opacity:0;transform:translateY(-14px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:500px){#shopNameGate{padding:28px 24px 20px}}
/* Override the legacy global margin reset: center native dialogs in the viewport. */
#shopNameGate{position:fixed;inset:0;margin:auto}
#app .sg-contact-row{display:flex;gap:10px;align-items:center}
#app .sg-contact-row input[readonly],#modalRoot .sg-contact-modal input[readonly]{background:#f1efeb;color:#625c54;cursor:default}
#app .sg-contact-row .btn{white-space:nowrap;flex-shrink:0}
#modalRoot .sg-contact-modal{width:min(460px,calc(100vw - 32px));box-sizing:border-box;border-radius:18px;padding:26px}
#modalRoot .sg-contact-modal h3{margin:0 0 22px}
#modalRoot .sg-contact-modal .sg-field{display:flex;flex-direction:column;gap:8px;margin-bottom:18px}
#modalRoot .sg-contact-modal input{height:42px;box-sizing:border-box;width:100%;padding:0 12px;border:1px solid #d8d3cc;border-radius:8px;background:white;color:#302d29;font:inherit}
#contactChangeError{color:#a33232;font-size:13px;margin:12px 0}
#app .sg-back{display:inline-flex;align-items:center;gap:7px;padding:9px 15px;margin-bottom:18px;border-radius:999px;background:#35312e;color:#fffaf3;border:1px solid #35312e;font-size:13px;line-height:20px;transition:background .2s}
#app .sg-back svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}
#app .sg-back:hover{background:#48423c}#app .sg-back:hover svg{transform:translateX(-2px)}
/* Compact settings proportions without shrinking type. */
#app .sg-header{margin-bottom:16px}
#app .sg-back{margin-bottom:12px}
#app .sg-card{padding:20px;margin-bottom:16px}
#app .sg-card h3{margin-bottom:18px}
#app .sg-field{gap:7px;margin-bottom:14px}
#app .sg-help{margin-bottom:0}
#app .sg-options{box-sizing:border-box;overflow-y:auto;overscroll-behavior:contain}
#app .sg-select .sg-options{top:calc(100% + 5px);bottom:auto;transform-origin:top center}
/* A compact navigation/action row with a separate page title. */
#app .sg-header{display:grid;grid-template-columns:1fr auto;align-items:center;gap:14px 16px;margin-bottom:18px}
#app .sg-header>div{display:contents}
#app .sg-header .sg-back{grid-column:1;grid-row:1;justify-self:start;box-sizing:border-box;height:36px;padding:7px 14px;margin:0;gap:6px;line-height:20px}
#app .sg-header>.btn{grid-column:2;grid-row:1;align-self:center}
#app .sg-header .page-title{grid-column:1/-1;grid-row:2;margin:0!important}
#app .sg-page [data-sg-save]{height:36px;min-width:78px;padding:7px 18px;border-radius:999px!important;line-height:20px}
#app .sg-footer{display:flex;justify-content:flex-end;padding-top:16px}
#app .sg-header{row-gap:10px;margin-bottom:14px}
#app .sg-card h3{margin-bottom:14px}
#app .sg-footer{padding-top:12px}

#app #mainContent:has(.sg-page){padding-top:16px}
#app .sg-header{row-gap:8px;margin-bottom:12px}
#app .sg-header .sg-back,#app .sg-header [data-sg-save]{height:28px;min-height:28px;min-width:0;padding:3px 12px;font-size:12px;line-height:20px;box-sizing:border-box}
#app .sg-header .sg-back{gap:4px}
#app .sg-header .sg-back svg{width:16px;height:16px}
/* Keep basic-settings actions anchored while only the form scrolls. */
#app #mainContent:has(.sg-page){display:flex;flex-direction:column;overflow:hidden;padding-bottom:12px}
#app .sg-page{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden}
#app .sg-page .sg-header{flex-shrink:0}
#app #storeGeneralForm{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:2px 4px 4px}
#app .sg-page .sg-footer{flex-shrink:0;position:relative;z-index:51;padding-top:10px;background:#f4f1ec}
#app .sg-page .sg-card{padding:16px 20px;margin-bottom:12px}
#app .sg-page .sg-card h3{margin-bottom:10px}
#app .sg-page .sg-field{gap:5px;margin-bottom:10px}
#app .sg-page .sg-field input:not([type=hidden]),#app .sg-page .sg-trigger{height:34px;min-height:34px;padding:4px 12px;box-sizing:border-box}
#app .sg-page .sg-contact-row .btn{height:34px;min-height:34px;padding:4px 12px}
#app .sg-page .sg-options button{min-height:32px;padding:5px 10px;line-height:22px;box-sizing:border-box}
#app .sg-page .sg-footer [data-sg-save]{height:32px;padding:5px 16px;box-sizing:border-box}
#app .payment-heading{display:flex;justify-content:space-between;align-items:center;margin:4px 0 22px;gap:16px}
#app .payment-heading h2{font-size:22px;margin:0}
#app .payment-method{display:flex;align-items:center;justify-content:space-between;gap:24px;background:#fff;border:1px solid #e3dfd9;border-radius:16px;padding:24px;margin-bottom:16px}
#app .payment-method h3{font-size:20px;margin:0 0 12px;color:#35312e}
#app .payment-method h3 small{font-size:14px;font-weight:400;margin-left:10px}
#app .payment-method p{font-size:14px;color:#777168;margin:0;line-height:1.7}
#app .payment-state{white-space:nowrap;font-size:13px;color:#777168;background:#f1efeb;padding:6px 12px;border-radius:999px}
#app .payment-state.enabled{background:#edf3ff;color:#2862c7}
@media(max-width:600px){#app .payment-method{align-items:flex-start;flex-direction:column}}
#app .currency-toggle-row{display:flex;align-items:center;justify-content:space-between;gap:20px}
#app .currency-toggle-row h3{margin-bottom:8px}
#app .currency-switch{position:relative;flex-shrink:0;width:40px;height:22px;cursor:pointer}
#app .currency-switch input{position:absolute;opacity:0;width:100%;height:100%}
#app .currency-switch span{display:block;width:40px;height:22px;background:#ddd;border-radius:99px;transition:background .2s}
#app .currency-switch span:after{content:'';position:absolute;left:3px;top:3px;width:16px;height:16px;background:white;border-radius:50%;transition:transform .2s}
#app .currency-switch input:checked+span{background:#386cf4}#app .currency-switch input:checked+span:after{transform:translateX(18px)}
#app .currency-switch input:focus-visible+span{outline:2px solid #386cf4;outline-offset:3px}
#app .currency-add-row{display:flex;gap:12px;margin:16px 0}#app .currency-add-row select{flex:1;min-width:0;padding:8px;border:1px solid #d8d3cc;border-radius:8px;background:white}
#app .currency-preview-options{padding:16px 0;border-top:1px solid #eee;border-bottom:1px solid #eee}#app .currency-preview-options label{display:block;margin:10px 0}#app .currency-preview-options h4{margin-top:20px}
#app .currency-preview-table{width:100%;border-collapse:collapse;margin-top:20px}#app .currency-preview-table th,#app .currency-preview-table td{padding:14px 8px;text-align:left;border-bottom:1px solid #eee}#app .currency-preview-table input{width:140px;max-width:100%;padding:8px;border:1px solid #ddd;border-radius:6px}
#app .pixel-page textarea{width:100%;box-sizing:border-box;resize:vertical;min-height:80px;padding:12px;border:1px solid #d8d3cc;border-radius:9px;font:inherit;line-height:1.5;color:#35312e;background:#fff}
#app .pixel-page .currency-toggle-row{margin-bottom:18px}
#app .pixel-note{padding:10px 14px;border-radius:8px;background:#f2efea;color:#62584b;font-size:13px}
#app .pixel-event{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid #eee9e3}
#app .pixel-event p{margin:5px 0 0;color:#746c61;font-size:13px;line-height:1.6}
#app .pixel-event>span{white-space:nowrap;border-radius:20px;padding:4px 10px;background:#f1efeb;font-size:12px;color:#5e574d}
#app #pixelSettingsError{color:#ab3131}
#app #pixelSettingsForm{flex:1;min-height:0;overflow:auto;padding-bottom:8px}
#app .pixel-page .sg-footer button{min-height:32px;padding:5px 16px}

.asset-heading,.asset-toolbar,.asset-pagination{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.asset-heading{justify-content:space-between}.asset-toolbar{margin:20px 0}.asset-toolbar input,.asset-toolbar select{padding:9px 12px;border:1px solid #ded8cf;border-radius:8px;background:#fff;color:#49443c}.asset-toolbar input{flex:1;min-width:150px}.asset-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:16px}.asset-card{border:1px solid #e5dfd6;border-radius:12px;overflow:hidden;background:white}.asset-card img,.asset-card video{display:block;width:100%;height:155px;object-fit:contain;background:#f5f3ef}.asset-details{padding:12px;display:grid;gap:8px}.asset-details strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}.asset-details span,.asset-toolbar span{font-size:12px;color:#75695d}.asset-pagination{justify-content:flex-end;margin:20px 0}.asset-gate{max-width:480px;margin:24px auto}.asset-error{color:#9b493b;min-height:20px}.asset-page .page-title{margin-top:14px}

.asset-tabs{display:flex;gap:28px;border-bottom:1px solid #ded8cf;margin-top:20px}.asset-tabs button{background:none;border:0;border-bottom:2px solid transparent;padding:12px 2px;color:#75695d;cursor:pointer;font:inherit}.asset-tabs button.active{border-bottom-color:#62594f;color:#35312e}.asset-date-heading{grid-column:1/-1;margin:12px 0 0;font-size:15px;color:#62594f}.asset-download{text-align:center;text-decoration:none;justify-content:center}

.asset-folder{padding:0 0 16px;text-align:left;display:flex;flex-direction:column;gap:8px;background:#fff;border:1px solid #e5dfd6;border-radius:12px;overflow:hidden;cursor:pointer;color:#49443c}.asset-folder:hover{border-color:#a69a8b;background:#faf9f6}.asset-folder img,.asset-folder-icon{width:100%;height:140px;object-fit:contain;background:#f5f3ef}.asset-folder-icon{display:grid;place-items:center;font-size:60px;color:#a99b86}.asset-folder strong,.asset-folder>span:last-child{padding:0 14px;overflow-wrap:anywhere}.asset-folder>span:last-child{font-size:12px;color:#75695d}
#app .shop-cart-setting{display:flex;align-items:center;justify-content:space-between;max-width:600px;margin-bottom:28px;gap:20px}
#app .shop-cart-switch{display:flex;align-items:center;gap:10px;cursor:pointer;font-size:14px;color:#706b65}
#app .shop-cart-switch input{position:absolute;opacity:0;width:1px;height:1px}
#app .shop-cart-switch i{width:44px;height:26px;border-radius:99px;background:#bababa;position:relative;transition:background .25s}
#app .shop-cart-switch i:after{content:'';position:absolute;width:20px;height:20px;left:3px;top:3px;border-radius:50%;background:white;transition:transform .25s;box-shadow:0 1px 3px #0002}
#app .shop-cart-switch input:checked+i{background:#2874df}#app .shop-cart-switch input:checked+i:after{transform:translateX(18px)}
#app .shop-cart-switch input:focus-visible+i{outline:2px solid #2874df;outline-offset:3px}
#app #shopExperienceError{color:#b23030}#app #storeExperienceForm .sg-options{transform-origin:top;transform:translateY(-6px) scaleY(.96);transition:transform .28s ease,opacity .28s ease,visibility .28s}
#app #storeExperienceForm .sg-select.open .sg-options{transform:translateY(0) scaleY(1)}
/* Explicit control feedback requested for the shop-settings selectors. */
#app #storeExperienceForm .sg-trigger svg{transition:transform .28s ease!important}
#app #storeExperienceForm .sg-options{transition:transform .28s ease,opacity .28s ease,visibility .28s!important}
#app .shop-cart-switch i{transition:background .25s!important}#app .shop-cart-switch i:after{transition:transform .25s!important}

#app .store-settings-home.sg-page>.sg-back{width:max-content;justify-self:start;align-self:start}
#app .shop-theme-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px}#app .shop-theme-choice input{position:absolute;opacity:0}#app .shop-theme-choice span{display:flex;align-items:center;gap:10px;padding:15px;border:2px solid #e5dfd6;border-radius:12px;cursor:pointer;background:var(--theme-bg);color:var(--theme-accent)}#app .shop-theme-choice i{width:26px;height:26px;border-radius:50%;background:var(--theme-accent)}#app .shop-theme-choice input:checked+span{outline:2px solid #6f6254;outline-offset:2px}#app .shop-theme-choice input:focus-visible+span{outline:3px solid #2874df}
#app .shop-theme-preview{margin-top:20px;border:1px solid #dfd7ce;border-radius:14px;overflow:hidden;background:#faf9f6;color:#35312d}#app .shop-theme-preview-head{padding:10px 16px;border-bottom:1px solid #ddd4ca;font:bold italic 17px Georgia}#app .shop-theme-preview-head small{float:right;font:12px system-ui;opacity:.7}#app .shop-theme-preview-body{padding:16px;display:flex;gap:15px;align-items:center}#app .shop-theme-preview-image{width:72px;height:72px;display:grid;place-items:center;border-radius:10px;background:#e8e2d9;color:#75695e;font-size:12px}#app .shop-theme-preview-body p{margin:5px 0;color:inherit}#app .shop-theme-preview-body span{display:inline-block;padding:5px 13px;background:#655747;color:white;border-radius:6px;font-size:12px}#app .shop-theme-preview[data-theme=light]{background:#fff;color:#263c52}#app .shop-theme-preview[data-theme=light] .shop-theme-preview-body span{background:#263c52}#app .shop-theme-preview[data-theme=dark]{background:#202225;color:#f6f3ee}#app .shop-theme-preview[data-theme=dark] .shop-theme-preview-body span{background:#a48968}#app .shop-theme-preview[data-theme=sage]{background:#f4f8f2;color:#334d39}#app .shop-theme-preview[data-theme=sage] .shop-theme-preview-body span{background:#506d59}
#app .shop-theme-preview[data-theme=white]{background:#f2f5f9;color:#26384c}#app .shop-theme-preview[data-theme=white] .shop-theme-preview-head{background:white;color:#3276dc}#app .shop-theme-preview[data-theme=white] .shop-theme-preview-body span{background:#397ef0}
#app .shop-settings-pair{display:grid;grid-template-columns:1fr 1fr;gap:16px}#app .shop-settings-pair .sg-card{min-width:0}#app .shop-settings-pair .sg-card h3{margin-bottom:16px}#app .shop-wa-row{display:flex;gap:8px;align-items:center}#app .shop-wa-row select{height:42px;max-width:160px;min-width:110px;border:1px solid #d8d3cc;border-radius:8px;background:#fff;padding:0 8px;font:inherit;color:#302d29}#app .shop-wa-row input{min-width:0;flex:1}#app .shop-theme-preview{--preview-header:#35312e;--preview-side:#eae7e1;--preview-bg:#f4f1eb;--preview-card:#fff;--preview-text:#35312d;--preview-active:#655747;background:var(--preview-bg);color:var(--preview-text);margin-top:20px}#app .shop-theme-preview[data-theme=light]{--preview-header:#263c52;--preview-side:#e8edf2;--preview-bg:#f2f5f8;--preview-card:#fff;--preview-text:#24394e;--preview-active:#263c52}#app .shop-theme-preview[data-theme=white]{--preview-header:#fff;--preview-side:#f8f9fb;--preview-bg:#f2f5f9;--preview-card:#fff;--preview-text:#26384c;--preview-active:#397ef0}#app .shop-theme-preview[data-theme=sage]{--preview-header:#435d4a;--preview-side:#e4ece2;--preview-bg:#f1f5ef;--preview-card:#fff;--preview-text:#344c39;--preview-active:#506d59}#app .shop-theme-preview[data-theme=dark]{--preview-header:#191b1f;--preview-side:#26292e;--preview-bg:#1e2024;--preview-card:#30343a;--preview-text:#f0f0ed;--preview-active:#8c785e}#app .shop-theme-preview .shop-theme-preview-head{background:var(--preview-header);color:#fff;padding:12px 16px}#app .shop-theme-preview[data-theme=white] .shop-theme-preview-head{color:#3276dc}#app .shop-theme-dashboard{display:grid;grid-template-columns:150px minmax(0,1fr);min-height:410px;color:var(--preview-text)}#app .shop-theme-dashboard aside{background:var(--preview-side);padding:12px 10px;font-size:12px}#app .shop-theme-dashboard aside div,#app .shop-theme-dashboard aside b{display:block;padding:10px;border-radius:7px}#app .shop-theme-dashboard aside b{background:var(--preview-active);color:#fff}#app .shop-theme-dashboard aside em{float:right;font-style:normal;font-size:11px}#app .shop-theme-dashboard main{padding:16px;min-width:0}#app .shop-theme-time{font-size:11px;opacity:.7;margin-bottom:12px}#app .shop-theme-panel{background:var(--preview-card);border-radius:9px;margin-bottom:12px;padding:16px;font-size:13px}#app .shop-theme-metrics,#app .shop-theme-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;text-align:center;padding:24px 0 6px}#app .shop-theme-actions span{font-size:19px;color:var(--preview-active)}#app .shop-theme-metrics small,#app .shop-theme-actions small{display:block;font-size:10px;color:var(--preview-text);margin-top:7px}#app .shop-theme-minirow span{float:right}@media(max-width:720px){#app .shop-settings-pair{grid-template-columns:1fr}#app .shop-theme-dashboard{grid-template-columns:95px minmax(0,1fr)}#app .shop-theme-dashboard aside{padding:8px 4px;font-size:10px}#app .shop-theme-dashboard main{padding:10px}#app .shop-theme-panel{padding:10px}}
/* Settings align with the workspace edge while retaining their readable maximum width. */
#app #mainContent .store-settings-home{margin-left:0;margin-right:auto;align-self:flex-start;box-sizing:border-box}
#app #mainContent .store-settings-home.sg-page>.sg-back{align-self:flex-start;width:max-content}
/* The form owns its scroll area; its footer stays reachable at every viewport height. */
#app #mainContent:has(#storeExperienceForm){overflow:hidden;min-height:0}
#app .sg-page:has(#storeExperienceForm){min-height:0;overflow:hidden}
#app #storeExperienceForm{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:2px 4px 12px 0;scrollbar-gutter:stable}
#app .experience-save-bar{flex:none;display:flex;justify-content:flex-end;align-items:center;padding:12px 0 2px;border-top:1px solid var(--theme-border,#e5dfd6);background:var(--adm-work,#f4f1eb)}
#app .experience-save-bar button{min-width:100px}
#app .shop-wa-row select{flex:0 0 125px;min-width:0}#app .shop-wa-row input{width:0!important;flex:1 1 auto}
#app .shop-wa-row select{flex:0 0 82px;width:82px;max-width:82px;padding:0 5px}
#app .shop-wa-row input{flex:1 1 0;min-width:0}
/* Two equal cards share an edge and leave the same gap above the theme panel. */
#app #storeExperienceForm .shop-settings-pair{align-items:stretch;gap:16px;margin-bottom:12px}
#app #storeExperienceForm .shop-settings-pair>.sg-card{margin:0;min-width:0;height:100%;box-sizing:border-box}
#app #storeExperienceForm .shop-settings-pair+.sg-card{margin-top:0}
#app #storeExperienceForm .shop-wa-row{display:flex;align-items:stretch;gap:8px}
#app #storeExperienceForm .shop-wa-row>.sg-field{flex:0 0 82px;width:82px;margin:0;display:block}
#app #storeExperienceForm .shop-wa-row>.sg-field>span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
#app #storeExperienceForm .shop-wa-row .sg-select{width:82px;max-width:none}
#app #storeExperienceForm .shop-wa-row .sg-trigger{width:82px;padding:4px 7px;gap:3px}
#app #storeExperienceForm .shop-wa-row .sg-trigger svg{width:15px;height:15px;flex:none}
#app #storeExperienceForm .shop-wa-row .sg-options{min-width:100px;max-height:240px;overflow:auto}
#app #storeExperienceForm .shop-wa-row>input{height:34px;min-height:34px;align-self:stretch}
#app #storeExperienceForm .shop-settings-pair .sg-help{margin:6px 0 0}
@media(max-width:720px){#app #storeExperienceForm .shop-settings-pair{grid-template-columns:1fr}}
#app .shop-tracking-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}#app .shop-tracking-option{display:flex;flex-direction:column;gap:6px;align-items:flex-start;text-align:left;padding:14px;border:1px solid var(--theme-border,#ddd6cc);border-radius:10px;background:var(--theme-surface,#fff);color:var(--theme-text,#302d29);font:inherit;cursor:pointer}#app .shop-tracking-option span{font-size:12px;color:var(--theme-muted,#777)}#app .shop-tracking-option:hover{background:var(--theme-hover,#eeeae4)}
#app .pixel-list-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:10px 0 14px}#app .pixel-entry{display:flex;align-items:center;gap:8px;padding:12px;border:1px solid var(--theme-border,#e5dfd6);border-radius:10px;margin:8px 0}#app .pixel-entry>div{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}#app .pixel-entry span{font-size:12px;color:var(--theme-muted,#777);overflow-wrap:anywhere}#app .pixel-empty{padding:12px 0}#modalRoot #pixelEditorError{color:#b32929}
#app .shop-tracking-grid{grid-template-columns:1fr;gap:10px}#app .shop-tracking-option{width:100%;flex-direction:row;align-items:center;justify-content:space-between;min-height:52px}#app .pixel-entry-toggle{flex:none;margin-right:4px}
#app #storeExperienceForm .shop-tracking-grid{display:grid;grid-template-columns:1fr;gap:12px;margin:0 0 12px}
#app #storeExperienceForm .shop-tracking-option{box-sizing:border-box;min-height:78px;padding:20px;border:1px solid var(--theme-border,#e3dfd9);border-radius:16px;background:var(--theme-surface,#fff);box-shadow:0 1px 2px #00000008}
#app #storeExperienceForm .shop-tracking-option:hover{background:var(--theme-hover,#eeeae4)}
#app #storeExperienceForm .shop-tracking-option{min-height:96px;align-items:center}
#app #storeExperienceForm .tracking-platform-content{display:flex;flex:1;min-width:0;flex-direction:column;align-items:flex-start;gap:9px}
#app #storeExperienceForm .tracking-platform-content strong{font-size:15px}
#app #storeExperienceForm .tracking-platform-status{font-size:12px;line-height:1.5;text-align:left;overflow-wrap:anywhere;color:var(--theme-muted,#777)}
#app #storeExperienceForm .tracking-platform-arrow{flex:none;font-size:20px;color:var(--theme-muted,#777)}
#app #otherTrackingForm{flex:1;min-height:0;overflow:auto;padding-bottom:8px}
#app .pixel-page .pixel-title-row{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:16px}
#app .pixel-page .pixel-title-row h3{margin:0}
#app .pixel-page .pixel-title-row .btn{flex:none}
#app .pixel-page .pixel-entries-box{border:1px solid var(--theme-border,#e5dfd6);border-radius:12px;overflow:hidden;margin-bottom:14px;background:var(--theme-surface,#fff)}
#app .pixel-page .pixel-entry{border:0;border-radius:0;margin:0;padding:16px;min-height:70px;box-sizing:border-box}
#app .pixel-page .pixel-entry+.pixel-entry{border-top:1px solid var(--theme-border,#e5dfd6)}
#app .pixel-page .pixel-empty{min-height:112px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;color:var(--theme-muted,#777);font-size:13px;padding:16px}
#app .pixel-page .pixel-empty strong{color:var(--theme-text,#39342e);font-size:14px}
@media(max-width:520px){#app .pixel-page .pixel-entry{flex-wrap:wrap}#app .pixel-page .pixel-entry>div{flex-basis:55%}}
#app .pixel-page .pixel-check-entry{gap:12px}
#app .pixel-page .pixel-check-label{display:flex;align-items:center;flex:none;cursor:pointer}
#app .pixel-page .pixel-check-label input{width:17px;height:17px;margin:0;accent-color:var(--theme-focus,#655747);cursor:pointer}
#app .pixel-page .pixel-check-visually-hidden{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
#app .pixel-page .pixel-name-button{flex:1;min-width:0;text-align:left;overflow-wrap:anywhere;border:0;background:transparent;color:var(--theme-text,#39342e);padding:7px 0;font:inherit;font-weight:600;cursor:pointer}
#app .pixel-page .pixel-name-button:hover{text-decoration:underline}
#app .pixel-page .pixel-name-button:focus-visible{outline:2px solid var(--theme-focus,#655747);outline-offset:3px;border-radius:3px}
#app #storeExperienceForm .tracking-platform-status{display:flex;align-items:center;flex-wrap:wrap;gap:7px}
#app #storeExperienceForm .tracking-chip{display:inline-flex;align-items:center;gap:6px;max-width:100%;padding:4px 7px 4px 10px;border-radius:999px;line-height:1.35;overflow-wrap:anywhere}
#app #storeExperienceForm .tracking-chip.is-enabled{background:#dff2e4;border:1px solid #add9b9;color:#256239}
#app #storeExperienceForm .tracking-chip.is-disabled{background:#eff0f1;border:1px solid #d8dadc;color:#858a8e}
#app #storeExperienceForm .tracking-chip-check{display:inline-grid;place-items:center;flex:none;width:15px;height:15px;border-radius:50%;background:#fff;color:#318249;font-size:11px;font-weight:700;line-height:1}
#app #storeExperienceForm .tracking-chip-empty{color:var(--theme-muted,#777)}
#app .pixel-page .pixel-entries-box{display:flex;align-content:flex-start;align-items:flex-start;flex-wrap:wrap;gap:10px;min-height:180px;box-sizing:border-box;padding:16px;background:#fff!important}
#app .pixel-page .pixel-empty{flex-basis:100%;align-items:flex-start;justify-content:flex-start;text-align:left;min-height:0;padding:3px 0}
#app .pixel-page .pixel-capsule{display:inline-flex;align-items:center;max-width:100%;gap:6px;min-height:38px;padding:3px 7px 3px 12px;border-radius:999px;border:1px solid #d9dcdf;background:#f0f1f2;color:#646a6e;box-sizing:border-box}
#app .pixel-page .pixel-capsule.is-enabled{background:#dff2e4;border-color:#add9b9;color:#256239}
#app .pixel-page .pixel-capsule-name{max-width:210px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border:0;background:transparent;color:inherit;font:inherit;font-size:13px;font-weight:600;padding:4px 0;cursor:pointer}
#app .pixel-page .pixel-capsule-name:hover{text-decoration:underline}
#app .pixel-page .pixel-capsule-toggle{position:relative;display:inline-grid;place-items:center;width:21px;height:21px;flex:none;cursor:pointer}
#app .pixel-page .pixel-capsule-toggle input{position:absolute;inset:0;opacity:0;cursor:pointer;margin:0;width:100%;height:100%}
#app .pixel-page .pixel-capsule-toggle span{display:grid;place-items:center;width:19px;height:19px;border-radius:50%;border:1px solid #b6bdc0;background:#fff;color:transparent;font-size:12px;font-weight:700;line-height:1}
#app .pixel-page .pixel-capsule.is-enabled .pixel-capsule-toggle span{color:#318249;border-color:#fff}
#app .pixel-page .pixel-capsule-toggle input:focus-visible+span{outline:2px solid #397ef0;outline-offset:2px}
#app .pixel-page .pixel-capsule-remove{border:0;background:transparent;color:inherit;font-size:19px;line-height:1;padding:0 3px;cursor:pointer}
#app .pixel-page .pixel-capsule-toggle{order:0}
#app .pixel-page .pixel-capsule-name{order:1}
#app .pixel-page .pixel-capsule-remove{order:2}
#app .pixel-page .pixel-capsule{padding-left:7px}
#app .pixel-page .pixel-capsule-name{display:inline-flex;align-items:center;gap:5px;text-decoration:underline;text-decoration-color:currentColor;text-decoration-thickness:1px;text-underline-offset:3px}
#app .pixel-page .pixel-capsule-name::after{content:'✎';flex:none;font-size:14px;line-height:1;text-decoration:none}
#app .pixel-page .pixel-capsule-name:hover{opacity:.72}
#app .pixel-page .pixel-capsule-name{text-decoration:none;border-bottom:1px solid currentColor;border-radius:0;padding:4px 0 1px;line-height:1.25}
#app .pixel-page .pixel-capsule-name::after{display:inline-block;transform:scaleX(-1)}
#app .pixel-page .pixel-capsule-name:hover{text-decoration:none}
#app #storeExperienceForm .shop-wa-entry{display:flex;align-items:center;justify-content:space-between;text-align:left;gap:12px;cursor:pointer;color:var(--theme-text,#302d29);font:inherit}
#app #storeExperienceForm .shop-wa-entry:hover{background:var(--theme-hover,#eeeae4)!important}
#app #storeExperienceForm .shop-wa-entry .tracking-chip small{font-size:10px;opacity:.8}
#app #whatsappSettingsForm{flex:1;min-height:0;overflow:auto;padding-bottom:8px}
#modalRoot .shop-wa-modal-row{display:flex;gap:8px}#modalRoot .shop-wa-modal-row select{flex:none;width:86px;border:1px solid #d8d3cc;border-radius:8px;padding:0 5px;background:#fff;color:#302d29}#modalRoot .shop-wa-modal-row input{min-width:0;flex:1}#modalRoot #waEditError{color:#b32929}
#app #mainContent .store-settings-home{margin-left:auto;margin-right:auto;align-self:center;box-sizing:border-box}
#app #storeExperienceForm .checkout-option{margin-bottom:22px}
#app #storeExperienceForm .checkout-option h3{margin:0 0 10px;font-size:16px}
#app #storeExperienceForm .checkout-option .shop-cart-switch{display:inline-flex;width:max-content}
#app #storeExperienceForm .checkout-design-card{max-width:740px;padding:24px!important}
#app #storeExperienceForm .checkout-display-setting{border-top:1px solid var(--theme-border,#e6e1da);padding-top:20px;margin-top:4px}
#app #storeExperienceForm .checkout-display-setting .sg-select{width:min(100%,280px);max-width:280px}
#app #storeExperienceForm .checkout-display-setting .sg-trigger{height:42px;min-height:42px;padding:8px 12px;border-radius:10px}
#app #storeExperienceForm .checkout-display-setting .sg-help{margin:8px 0 18px}
#app #storeExperienceForm .checkout-preview-button{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:42px;padding:9px 16px;border-radius:11px;font-weight:600;transition:transform .2s,filter .2s}
#app #storeExperienceForm .checkout-preview-button:hover{filter:brightness(.92);transform:translateY(-1px)}
#app #storeExperienceForm .checkout-preview-button:active{transform:translateY(0)}
@media(max-width:600px){#app #storeExperienceForm .checkout-design-card{padding:18px!important}#app #storeExperienceForm .checkout-display-setting .sg-select{max-width:100%}}
#app .checkout-title-setting{margin:20px 0}.checkout-title-setting label{display:block;font-weight:600;margin-bottom:8px}.checkout-title-setting input{width:min(100%,360px);padding:10px 12px;border:1px solid var(--border,#ded5cc);border-radius:9px;background:var(--surface,#fff);color:inherit}
#app #storeExperienceForm .shop-wa-settings{display:flex;flex-direction:column;gap:18px}
#app #storeExperienceForm .shop-wa-entry{padding:0;width:100%;border:0;background:transparent!important;align-items:flex-start}
#app #storeExperienceForm .shop-wa-entry .tracking-platform-content{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
#app #storeExperienceForm .shop-wa-entry .tracking-platform-content strong{font-size:16px}
#app #storeExperienceForm .shop-wa-routing .sg-field{margin-bottom:0}
/* Checkout only: editing stays prominent; inline preview is optional on narrow screens. */
#app #mainContent .store-settings-home.checkout-editor-page{max-width:1500px;margin-left:0;margin-right:auto;align-self:flex-start}
#app .checkout-editor-page #storeExperienceForm{container:checkout-editor / inline-size}
#app .checkout-editor-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:20px;align-items:start}
#app #storeExperienceForm .checkout-editor-grid .checkout-design-card{width:100%;max-width:none;margin:0}
#app .checkout-live-panel{display:none;min-width:0;background:var(--theme-card,#fff);border:1px solid var(--theme-border,#e6ddd3);border-radius:16px;overflow:hidden}
#app .checkout-live-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 18px;border-bottom:1px solid var(--theme-border,#e6ddd3)}
#app .checkout-live-heading strong,#app .checkout-live-heading small{display:block}
#app .checkout-live-heading small{font-size:12px;color:var(--theme-muted,#80756a);margin-top:3px}
#app .checkout-preview-modes{display:flex;gap:4px;background:var(--theme-hover,#f1eee9);padding:3px;border-radius:10px;flex:none}
#app .checkout-preview-modes button{border:0;border-radius:7px;background:transparent;color:var(--theme-text,#51483f);padding:6px 10px;cursor:pointer}
#app .checkout-preview-modes button[aria-pressed=true]{background:var(--theme-card,#fff);box-shadow:0 1px 4px #0002;font-weight:600}
#app .checkout-preview-modes button:disabled{opacity:.4;cursor:not-allowed}
#app .checkout-live-frame{background:#eae7e1;overflow:auto;height:min(720px,calc(100vh - 260px));min-height:460px}
#app .checkout-live-frame iframe{display:block;border:0;width:100%;height:100%;background:#faf9f6}
#app .checkout-live-frame[data-device=desktop] iframe{min-width:850px}
@container checkout-editor (min-width:900px){#app .checkout-editor-grid{grid-template-columns:minmax(350px,.9fr) minmax(0,1.1fr)}#app .checkout-live-panel{display:block}}
/* Aligned checkout editor cards and a scaled desktop preview. */
#app .checkout-editor-grid{align-items:stretch}
#app #storeExperienceForm .checkout-editor-grid .checkout-design-card{height:100%;box-sizing:border-box}
#app #storeExperienceForm .checkout-option{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:24px}
#app #storeExperienceForm .checkout-option h3{margin:0}
#app .checkout-layout-label{display:block;margin-bottom:8px;font-weight:600}
#app .checkout-layout-switch{display:inline-flex;max-width:100%;padding:4px;gap:3px;border:1px solid var(--theme-border,#e0d8cf);border-radius:11px;background:var(--theme-hover,#f1eee9)}
#app .checkout-layout-switch label{position:relative;cursor:pointer;margin:0}
#app .checkout-layout-switch input{position:absolute;width:1px;height:1px;opacity:0}
#app .checkout-layout-switch span{display:block;padding:8px 12px;border-radius:8px;color:var(--theme-text,#504840);white-space:nowrap}
#app .checkout-layout-switch input:checked+span{background:var(--theme-card,#fff);box-shadow:0 1px 4px #0002;font-weight:600}
#app .checkout-layout-switch input:focus-visible+span{outline:2px solid #2874df;outline-offset:1px}
#app .checkout-live-heading{padding:9px 14px}
#app .checkout-live-heading small{margin-top:0}
#app .checkout-live-frame{height:min(790px,calc(100vh - 190px));min-height:460px;overflow:hidden}
#app .checkout-live-frame[data-device=desktop] iframe{min-width:0}
@media(max-width:480px){#app .checkout-layout-switch span{padding:7px 8px;font-size:12px}}

#app .checkout-device-options .checkout-option{margin-top:14px}

/* Checkout settings scrolls at the content edge; device previews scroll inside their screens. */
#app #mainContent:has(.checkout-editor-page){overflow-y:auto;overflow-x:hidden}
#app .sg-page.checkout-editor-page{flex:none;min-height:auto;overflow:visible}
#app .checkout-editor-page #storeExperienceForm{flex:none;overflow:visible;min-height:auto;padding-right:0}
#app .checkout-editor-page .experience-save-bar{position:sticky;bottom:0;z-index:3}
#app .checkout-live-frame{display:flex;align-items:center;justify-content:center;padding:18px;box-sizing:border-box}
#app .checkout-device-shell{display:flex;flex-direction:column;overflow:hidden;box-sizing:border-box;background:#171717;border:7px solid #171717;box-shadow:0 8px 25px #0003}
#app .checkout-live-frame[data-device=mobile] .checkout-device-shell{width:min(100%,390px);height:100%;border-radius:30px}
#app .checkout-device-chrome{flex:none;color:#fff;background:#252525}
#app .checkout-device-status{display:flex;justify-content:space-between;padding:5px 14px;font:600 10px system-ui}
#app .checkout-device-browser{display:flex;align-items:center;justify-content:space-between;padding:7px 12px;font:600 12px system-ui}
#app .checkout-desktop-bar{display:none}
#app .checkout-device-viewport{position:relative;flex:1;min-height:0;overflow:hidden;background:#faf9f6}
#app .checkout-device-viewport iframe{display:block;border:0;width:100%;height:100%;background:#faf9f6}
#app .checkout-device-home{flex:none;height:14px;background:#fff;display:grid;place-items:center}
#app .checkout-device-home:after{content:'';display:block;width:88px;height:4px;border-radius:4px;background:#171717}
#app .checkout-live-frame[data-device=desktop] .checkout-device-shell{width:100%;height:100%;border-width:5px;border-radius:12px}
#app .checkout-live-frame[data-device=desktop] .checkout-device-status,#app .checkout-live-frame[data-device=desktop] .checkout-device-browser,#app .checkout-live-frame[data-device=desktop] .checkout-device-home{display:none}
#app .checkout-live-frame[data-device=desktop] .checkout-desktop-bar{display:flex;align-items:center;gap:5px;height:30px;padding:0 10px;font:11px system-ui}
#app .checkout-desktop-bar i{width:7px;height:7px;border-radius:50%;background:#8a8a8a}
#app .checkout-desktop-bar span{margin-left:10px;flex:1;border-radius:5px;padding:3px 8px;background:#444;color:#eee}

#app #mainContent:has(.checkout-editor-page #storeExperienceForm){overflow-y:auto;overflow-x:hidden}
#app .checkout-editor-page.sg-page:has(#storeExperienceForm){overflow:visible;min-height:auto}
#app .checkout-editor-page #storeExperienceForm{overflow:visible;flex:none;min-height:auto}