:root{color-scheme:light;--purple:#7c3aed;--purple-dark:#6023c7;--yellow:#ffe600;--ink:#15082e;--muted:#716681;--line:#e8e1f3;--paper:#fff;--background:#f8f6fd;--soft:#f0e9ff;font-family:"Space Grotesk",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--background);color:var(--ink);font-family:inherit;font-size:15px;line-height:1.6}a{color:var(--purple);text-underline-offset:3px}a:hover{color:var(--purple-dark)}button,input,select{font:inherit}button,.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:11px 19px;border:1px solid var(--purple);border-radius:11px;background:var(--purple);color:#fff;font-weight:650;cursor:pointer;text-decoration:none;transition:background .15s ease,box-shadow .15s ease}button:hover,.button:hover{background:var(--purple-dark);color:#fff}button:disabled{opacity:.55;cursor:default}button.secondary{background:#fff;color:var(--purple);border-color:#d9c6fb}button.secondary:hover{background:var(--soft)}:focus-visible{outline:3px solid var(--purple);outline-offset:3px}input,select{width:100%;min-height:44px;padding:10px 12px;background:#fff;color:var(--ink);border:1px solid #d5cbe3;border-radius:9px}input:focus,select:focus{border-color:var(--purple);box-shadow:0 0 0 3px #7c3aed18}label{display:block;font-weight:600;margin-bottom:6px}h1,h2,p{margin-top:0}h1{font-size:clamp(27px,4vw,40px);line-height:1.2;letter-spacing:-1.1px;margin-bottom:12px}h2{font-size:21px;line-height:1.3;letter-spacing:-.4px;margin-bottom:9px}.muted,.fine-print{color:var(--muted)}.fine-print{font-size:13px;margin:16px 0 0}.eyebrow{color:var(--purple);font-size:11px;font-weight:750;letter-spacing:1.8px;margin-bottom:13px}.app-shell{max-width:1120px;margin:auto;padding:0 28px}.app-header,body>header{display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line);padding:24px 0;margin-bottom:30px}.app-header img,body>header img{max-width:154px;height:auto}.app-header a{font-size:13px;font-weight:600}main{padding:8px 0 30px}.page-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:23px}.page-heading p:last-child{margin-bottom:0;overflow-wrap:anywhere}.status-chip{flex-shrink:0;border:1px solid #dfd0fb;border-radius:999px;background:var(--soft);color:var(--purple);padding:6px 12px;font-size:12px;font-weight:700}.card{background:#fff;border:1px solid var(--line);border-radius:17px;box-shadow:0 3px 12px #25104305;padding:26px;margin-bottom:22px}.section-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.section-heading button{white-space:nowrap}.section-heading p{color:var(--muted);margin-bottom:20px}.notice{border:1px solid #e9d8ff;border-radius:11px;background:var(--soft);color:var(--ink);padding:14px 17px;margin:0 0 22px}.notice.error{background:#fff0f2;border-color:#f1c6cf;color:#8f1633}.notice.success{background:#f2edff;border-color:#dfd0fb;color:#5423a0}.country-note{background:#fffbea;border-left:3px solid var(--yellow);padding:12px 15px;border-radius:0 8px 8px 0;font-size:13px;margin-bottom:20px}.table-scroll{overflow-x:auto}.mapping-table{width:100%;border-collapse:collapse;text-align:left}.mapping-table th{font-size:11px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted);padding:0 12px 12px;border-bottom:1px solid var(--line)}.mapping-table td{padding:12px;border-bottom:1px solid #f1edf6;vertical-align:middle}.mapping-table th:first-child,.mapping-table td:first-child{padding-left:0;width:22%}.mapping-table th:nth-child(2){width:44%}.mapping-table td:first-child{font-weight:600}.mapping-table input{min-width:160px}.mapping-table select{min-width:220px}.custom-placeholder{font-size:12px;color:#998ea7}.form-actions{display:flex;align-items:center;gap:18px;margin-top:22px}.form-actions p{margin:0;font-size:12px;max-width:390px}.preview-controls{display:flex;align-items:flex-end;gap:14px}.preview-controls>div{flex:1;max-width:480px}.preview-result{margin-top:22px;padding:18px;background:var(--background);border:1px solid var(--line);border-radius:10px}.preview-result dl{display:grid;grid-template-columns:minmax(100px,1fr) 2fr;gap:9px 18px;margin:0}.preview-result dt{font-size:12px;color:var(--muted)}.preview-result dd{margin:0;overflow-wrap:anywhere}.preview-result dd dl{padding:0 0 10px}.preview-result ul{margin:0;padding-left:20px}.connect-card{max-width:640px;margin-top:28px}.connect-card button{margin-top:8px}footer{display:flex;justify-content:space-between;gap:12px;border-top:1px solid var(--line);padding:22px 0;color:var(--muted);font-size:12px}footer span{font-size:11px}[hidden]{display:none!important}
body:not(.shopify-app)>header,body:not(.shopify-app)>main,body:not(.shopify-app)>footer{max-width:1000px;margin-left:auto;margin-right:auto}body:not(.shopify-app)>main{padding-left:28px;padding-right:28px}body:not(.shopify-app)>header,body:not(.shopify-app)>footer{padding-left:28px;padding-right:28px}.badge{color:var(--purple);background:var(--soft);border-color:var(--line)}
@media(max-width:680px){.app-shell{padding:0 16px}.app-header{padding:18px 0;margin-bottom:23px}.card{padding:18px;border-radius:13px}.page-heading,.section-heading{flex-direction:column;gap:12px}.page-heading{margin-bottom:18px}.section-heading button{margin-bottom:8px}.table-scroll{overflow:visible}.mapping-table,.mapping-table tbody{display:block;min-width:0;width:100%}.mapping-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.mapping-table tr{display:block;padding:15px 0;border-bottom:1px solid var(--line)}.mapping-table td,.mapping-table td:first-child{display:block;width:100%;padding:6px 0;border:0}.mapping-table td:first-child label{margin-bottom:0}.mapping-table select,.mapping-table input{width:100%;min-width:0}.mapping-table .custom-empty{display:none}.form-actions,.preview-controls{align-items:stretch;flex-direction:column}.form-actions button,.preview-controls button{width:100%}.preview-controls>div{max-width:none}.preview-result dl{grid-template-columns:1fr}.preview-result dd{margin-bottom:10px}footer{flex-direction:column;gap:4px}}

/* ===== Fufills Store Connect: embedded app (inside the Shopify admin) ===== */
@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:400 700;font-display:swap;src:url(/assets/space-grotesk.woff2) format("woff2")}
.shopify-app{--green:#0b8a5f;--green-soft:#e6f6ef;--amber:#9a5800;--amber-soft:#fff5e1;--red:#b42335;--grey:#6b6480;--grey-soft:#f1eff5;--night:#15082e;background:#f6f5f9;font-size:14px;line-height:1.5}
.shopify-app .app-shell{max-width:760px;padding:0 16px}
.shopify-app .app-header{border:0;padding:14px 0;margin:0}
.shopify-app .app-header img{width:96px;height:auto}
.shopify-app .app-header-side{display:flex;align-items:center;gap:10px;min-width:0}
.shopify-app .shop-chip{max-width:240px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;color:var(--muted)}
.shopify-app .shop-chip:empty{display:none}
.shopify-app #open-fufills{display:inline-flex;align-items:center;gap:4px;font-size:12.5px;font-weight:600;text-decoration:none;white-space:nowrap}
.shopify-app .icon{width:16px;height:16px;flex-shrink:0}
.shopify-app #open-fufills .icon{width:13px;height:13px}
[dir=rtl] .shopify-app .icon.chevron,[dir=rtl] .shopify-app .btn .icon:last-child,[dir=rtl] .shopify-app .link .icon,[dir=rtl] .shopify-app #open-fufills .icon{transform:scaleX(-1)}
.shopify-app main{display:grid;gap:12px;padding:0 0 20px}
.shopify-app .app-loading{display:flex;align-items:center;gap:10px;justify-content:center;padding:60px 0;color:var(--muted)}
.shopify-app .spinner{width:16px;height:16px;border-radius:50%;border:2px solid var(--line);border-top-color:var(--purple);animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.shopify-app h1,.shopify-app h2{margin:0;color:var(--ink);letter-spacing:-.3px}
.shopify-app h1{font-size:21px;line-height:1.25}
.shopify-app h2{font-size:15px}
.shopify-app p{margin:0}
.shopify-app .muted{color:var(--muted)}
.shopify-app .small{font-size:12px}

/* buttons */
.shopify-app .btn{white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;padding:7px 14px;border-radius:9px;border:1px solid var(--purple);background:var(--purple);color:#fff;font:inherit;font-weight:600;line-height:1.2;text-decoration:none;cursor:pointer;transition:background .15s ease;box-shadow:none}
.shopify-app .btn:hover{background:var(--purple-dark);color:#fff}
.shopify-app .btn:disabled{opacity:.45;cursor:default}
.shopify-app .btn-small{min-height:30px;padding:5px 11px;font-size:12.5px;border-radius:8px}
.shopify-app .btn-light{background:#fff;color:var(--ink);border-color:#dcd6e6}
.shopify-app .btn-light:hover{background:var(--grey-soft);color:var(--ink)}
.shopify-app .btn-ghost{background:transparent;color:var(--muted);border-color:transparent}
.shopify-app .btn-ghost:hover{background:var(--grey-soft);color:var(--ink)}
.shopify-app .btn-spark{background:var(--soft);color:var(--purple-dark);border-color:#e2d6fc}
.shopify-app .btn-spark:hover{background:#e7dbff;color:var(--purple-dark)}
.shopify-app .btn-icon{min-height:30px;width:30px;padding:0;background:#fff;color:var(--muted);border-color:#e3dfea}
.shopify-app .btn-icon:hover{background:var(--grey-soft);color:var(--ink)}
.shopify-app .btn-cta{min-height:42px;padding:10px 18px;font-size:14.5px;background:var(--yellow);border-color:var(--yellow);color:var(--night)}
.shopify-app .btn-cta:hover{background:#fff176;color:var(--night)}
.shopify-app .link{display:inline-flex;align-items:center;gap:4px;padding:0;border:0;background:none;color:var(--purple-dark);font:inherit;font-weight:600;text-decoration:none;cursor:pointer}
.shopify-app .link .icon{width:14px;height:14px}

/* cards */
.shopify-app .card{background:#fff;border:1px solid #ebe7f1;border-radius:12px;padding:16px 18px;margin:0;box-shadow:none}
.shopify-app .card-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.shopify-app .head-title,.shopify-app .head-tools{display:flex;align-items:center;gap:10px;min-width:0}

/* connect */
.shopify-app .intro{display:grid;gap:10px;padding:22px;border-top:3px solid var(--yellow)}
.shopify-app .intro.is-error{border-top-color:var(--red)}
.shopify-app .lead{color:var(--muted);font-size:14px;max-width:520px}
.shopify-app .intro-action{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin:4px 0 2px}
.shopify-app .steps{display:flex;flex-wrap:wrap;gap:6px 18px;list-style:none;margin:6px 0 0;padding:12px 0 0;border-top:1px solid #f0edf4;color:var(--muted);font-size:12.5px}
.shopify-app .steps li{display:flex;align-items:center;gap:7px}
.shopify-app .step-dot{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--grey-soft);font-size:11px;font-weight:700}
.shopify-app .step-dot .icon{width:12px;height:12px;stroke-width:3}
.shopify-app .steps .is-current{color:var(--ink);font-weight:600}
.shopify-app .steps .is-current .step-dot{background:var(--purple);color:#fff}
.shopify-app .steps .is-done .step-dot{background:var(--green-soft);color:var(--green)}
.shopify-app .fold>summary{display:flex;align-items:center;justify-content:space-between;gap:10px;cursor:pointer;list-style:none;font-weight:600}
.shopify-app details>summary::-webkit-details-marker{display:none}
.shopify-app .chevron{width:15px;height:15px;color:var(--muted);transform:rotate(90deg);transition:transform .15s ease}
.shopify-app details[open]>summary .chevron{transform:rotate(-90deg)}
.shopify-app .fold[open]>summary{margin-bottom:10px}
.shopify-app .checklist{display:grid;gap:7px;list-style:none;margin:0;padding:0}
.shopify-app .checklist li{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.shopify-app .checklist .icon{width:14px;height:14px;color:var(--green);stroke-width:2.6}
.shopify-app .checklist a{font-weight:600}
.shopify-app .faq{display:grid;gap:2px;margin:0}
.shopify-app .faq dt{font-weight:600;margin-top:8px}
.shopify-app .faq dt:first-child{margin-top:0}
.shopify-app .faq dd{margin:0;color:var(--muted)}

/* status line */
.shopify-app .status{display:flex;align-items:center;gap:10px;padding:11px 14px;border-radius:12px;background:#fff;border:1px solid #ebe7f1}
.shopify-app .status p{flex:1;min-width:0}
.shopify-app .status p span{color:var(--muted)}
.shopify-app .status-dot{width:9px;height:9px;flex-shrink:0;border-radius:50%;background:var(--green);box-shadow:0 0 0 3px var(--green-soft)}
.shopify-app .status.tone-wait .status-dot{background:var(--purple);box-shadow:0 0 0 3px var(--soft)}
.shopify-app .status.tone-warn{background:var(--amber-soft);border-color:#f2dcae}
.shopify-app .status.tone-warn .status-dot{background:#e08a00;box-shadow:0 0 0 3px #ffe7b8}
.shopify-app .status.tone-warn strong{color:var(--amber)}
.shopify-app .status.tone-paused .status-dot{background:var(--grey);box-shadow:0 0 0 3px var(--grey-soft)}

/* orders */
.shopify-app .orders{display:grid;margin-top:8px}
.shopify-app .order{border-top:1px solid #f0edf4}
.shopify-app .order:first-child{border-top:0}
.shopify-app .order>summary{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto auto;align-items:center;gap:10px;padding:9px 2px;cursor:pointer;list-style:none}
.shopify-app .order>summary:hover strong{color:var(--purple-dark)}
.shopify-app .order-icon{display:grid;place-items:center;width:26px;height:26px;border-radius:8px;background:var(--grey-soft);color:var(--grey)}
.shopify-app .order-icon .icon{width:14px;height:14px}
.shopify-app .order.is-imported .order-icon,.shopify-app .order.is-duplicate .order-icon{background:var(--green-soft);color:var(--green)}
.shopify-app .order.is-failed .order-icon{background:var(--amber-soft);color:var(--amber)}
.shopify-app .order.is-pending .order-icon{background:var(--soft);color:var(--purple)}
.shopify-app .order-time{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.shopify-app .order-meta{display:flex;align-items:baseline;gap:8px;min-width:0}
.shopify-app .order-meta .order-time{flex:0 1 auto;min-width:0}
.shopify-app .order-price{flex:none;font-size:12.5px;font-weight:600;color:var(--ink);white-space:nowrap;unicode-bidi:plaintext}
.shopify-app .tag{display:inline-flex;align-items:center;padding:2px 9px;border-radius:999px;font-size:11.5px;font-weight:600;white-space:nowrap;background:var(--grey-soft);color:var(--grey)}
.shopify-app .tag-imported,.shopify-app .tag-duplicate{background:var(--green-soft);color:var(--green)}
.shopify-app .tag-failed{background:var(--amber-soft);color:var(--amber)}
.shopify-app .tag-pending{background:var(--soft);color:var(--purple-dark)}
.shopify-app .order-body{display:grid;gap:8px;padding:0 2px 12px 38px}
[dir=rtl] .shopify-app .order-body{padding:0 38px 12px 2px}
.shopify-app .issues{display:grid;gap:6px;list-style:none;margin:0;padding:0}
.shopify-app .issues li{display:grid;gap:1px;padding:8px 11px;border-radius:8px;background:var(--amber-soft);font-size:13px}
.shopify-app .issues strong{color:var(--amber)}
.shopify-app .issue-values{font-weight:600}
.shopify-app .row-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.shopify-app .more{justify-self:start;margin-top:8px;font-size:12.5px}
.shopify-app .empty{padding:14px 0 4px;color:var(--muted)}
.shopify-app .field-rows>.empty{grid-column:1/-1}

/* fields */
.shopify-app #fields{display:grid;gap:0}
.shopify-app #fields>.live,.shopify-app #fields>.field-tools{margin-bottom:10px}
.shopify-app #fields .save-bar{margin-top:8px}
.shopify-app #fields>p.muted:last-child{margin-top:10px}
.shopify-app .live{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;padding:8px 11px;border-radius:9px;background:var(--grey-soft);color:var(--muted);font-size:13px}
.shopify-app .live strong{color:var(--ink);font-weight:600}
.shopify-app .live select{min-height:0;width:auto;padding:2px 6px;border:1px solid #dcd6e6;border-radius:6px;background:#fff;font:inherit;font-weight:600;color:var(--ink)}
.shopify-app .live-pulse{width:8px;height:8px;border-radius:50%;background:var(--grey)}
.shopify-app .live.is-checking .live-pulse{background:var(--purple);animation:pulse 1s ease-in-out infinite}
.shopify-app .live.is-good{background:var(--green-soft)}
.shopify-app .live.is-good .live-pulse{background:var(--green)}
.shopify-app .live.is-good strong{color:var(--green)}
.shopify-app .live.is-missing{background:var(--amber-soft)}
.shopify-app .live.is-missing .live-pulse{background:#e08a00}
.shopify-app .live.is-missing strong{color:var(--amber)}
@keyframes pulse{50%{opacity:.3}}
.shopify-app .field-tools{display:flex;align-items:center;gap:8px}
.shopify-app .search{flex:1;display:flex;align-items:center;gap:7px;margin:0;padding:0 10px;border:1px solid #dcd6e6;border-radius:9px;background:#fff;color:var(--muted);font-weight:400}
.shopify-app .search:focus-within{border-color:var(--purple);box-shadow:0 0 0 3px #7c3aed18}
.shopify-app .search input{flex:1;min-width:0;min-height:34px;padding:0;border:0;box-shadow:none;background:transparent;font-size:13.5px}
.shopify-app .search input:focus{box-shadow:none;outline:0}
.shopify-app #fields{container-type:inline-size;min-width:0}
.shopify-app .field-rows{display:grid;grid-template-columns:minmax(140px,1fr) minmax(150px,220px) minmax(0,1fr) auto;column-gap:10px;min-width:0}
.shopify-app .field-row{display:grid;grid-column:1/-1;grid-template-columns:subgrid;align-items:center;gap:6px 10px;padding:7px 0;border-top:1px solid #f0edf4}
.shopify-app .field-row:first-child{border-top:0}
.shopify-app .field-name{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 6px;min-width:0}
.shopify-app .field-name strong{font-size:13px}
.shopify-app .field-name small{flex-basis:100%;font-size:11.5px;color:var(--muted);line-height:1.35}
.shopify-app .req{font-size:10px;font-weight:700;letter-spacing:.3px;text-transform:uppercase;color:var(--purple-dark)}
.shopify-app .field-value{min-width:0;overflow:hidden}
.shopify-app .value.is-empty{color:#a8a1b8}
.shopify-app .example-picker{display:flex;align-items:center;gap:8px}
.shopify-app .example-picker select{min-height:0;width:auto;padding:4px 8px;border:1px solid #dcd6e6;border-radius:8px;background:#fff;font:inherit;font-size:13px;font-weight:600;color:var(--ink)}
.shopify-app .example-hint{margin:6px 0 10px}
.shopify-app .picker-option{display:flex;justify-content:space-between;gap:10px}
.shopify-app .picker-preview{color:var(--green);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:50%}
.shopify-app .field-row>.btn{justify-self:end}
.shopify-app .field-row.is-missing .field-name strong{color:var(--amber)}
.shopify-app .field-custom{grid-column:2/4}
.shopify-app .field-custom input{min-height:32px;padding:5px 9px;font-size:13px;border-radius:8px}
.shopify-app .value{display:flex;align-items:center;gap:4px;min-width:0;max-width:100%;overflow:hidden;font-size:12.5px;color:var(--muted)}
.shopify-app .value span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.shopify-app .value .icon{width:13px;height:13px;stroke-width:2.6}
.shopify-app .value.is-found{color:var(--green)}
.shopify-app .value.is-missing{color:var(--amber);font-weight:600}
.shopify-app .save-bar{position:sticky;bottom:10px;z-index:3;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 8px 7px 12px;border-radius:10px;background:var(--night);color:var(--yellow);box-shadow:0 10px 26px #15082e33}
.shopify-app .save-bar .btn-ghost{color:#d8cff0}
.shopify-app .save-bar .btn-ghost:hover{background:#ffffff14;color:#fff}
.shopify-app .save-bar .btn:not(.btn-ghost){background:var(--yellow);border-color:var(--yellow);color:var(--night)}
.shopify-app .save-buttons{display:flex;gap:4px}

/* picker */
.shopify-app .picker{position:relative;min-width:0}
.shopify-app .picker-control{position:relative}
.shopify-app .picker-control input{width:100%;min-height:32px;padding-block:5px;padding-inline:9px 28px;border:1px solid #dcd6e6;border-radius:8px;background:#fff;font-size:13px;cursor:pointer}
.shopify-app .picker-control input:focus{cursor:text}
.shopify-app .picker-arrow{position:absolute;inset-inline-end:8px;top:50%;width:13px;height:13px;transform:translateY(-50%) rotate(90deg);color:var(--muted);pointer-events:none}
.shopify-app .picker-panel{position:absolute;z-index:20;top:calc(100% + 4px);inset-inline-start:0;width:max(100%,320px);max-height:min(280px,var(--room,280px));overflow:auto;padding:4px;background:#fff;border:1px solid #ebe7f1;border-radius:10px;box-shadow:0 12px 30px #15082e1f}
.shopify-app .picker-panel.opens-up{top:auto;bottom:calc(100% + 4px)}
.shopify-app .picker-group{font-size:10.5px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--muted);padding:8px 8px 2px}
.shopify-app .picker-option{padding:6px 8px;border-radius:6px;cursor:pointer;font-size:13px}
.shopify-app .picker-option.is-active{background:var(--soft)}
.shopify-app .picker-option[aria-selected=true]{color:var(--purple-dark);font-weight:600}
.shopify-app .picker-empty{padding:8px;font-size:12.5px;color:var(--muted)}


/* two columns: example order on the left, orders and fields on the right */
.shopify-app.is-wide .app-shell{max-width:1220px}
.shopify-app .layout{display:grid;gap:12px;align-items:start}
.shopify-app .main-col{display:grid;gap:12px;min-width:0}
.shopify-app .order-card{display:grid;gap:12px;align-content:start;border-top:3px solid var(--yellow)}
.shopify-app .order-card .card-head{flex-wrap:wrap}
.shopify-app .order-card .example-picker{flex:1;justify-content:flex-end;min-width:0}
.shopify-app .order-card .example-picker select{max-width:100%}
.shopify-app .oc-summary{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;padding:10px 12px;border-radius:10px;background:#f8f6fc}
.shopify-app .oc-summary>div{display:flex;align-items:center;gap:8px}
.shopify-app .oc-summary strong{font-size:16px}
.shopify-app .oc-section{display:grid;gap:2px}
.shopify-app .oc-section h3{margin:0 0 4px;font-size:10.5px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--muted)}
.shopify-app .oc-line{display:grid;grid-template-columns:minmax(0,38%) minmax(0,1fr);gap:0 10px;padding:4px 6px;border-radius:7px;font-size:12.5px}
.shopify-app .oc-label{color:var(--muted);overflow-wrap:anywhere;min-width:0}
.shopify-app .oc-value{color:var(--ink);overflow-wrap:anywhere}
.shopify-app .oc-line.is-used{background:#f6f1ff}
.shopify-app .oc-line.is-used .oc-value{font-weight:600}
.shopify-app .oc-used{grid-column:2;justify-self:start;max-width:100%;overflow-wrap:anywhere;margin-top:2px;padding:1px 7px;border-radius:999px;background:var(--soft);color:var(--purple-dark);font-size:10.5px;font-weight:700}
.shopify-app .oc-product{display:grid;gap:2px;padding:6px;border-radius:7px;font-size:12.5px}
.shopify-app .oc-sku{display:flex;flex-wrap:wrap;align-items:center;gap:6px;color:var(--muted)}
.shopify-app .oc-sku b{color:var(--ink)}
.shopify-app .oc-sku.is-used{color:var(--purple-dark)}
@media(min-width:980px){
  .shopify-app .layout{grid-template-columns:minmax(0,1fr) 340px}
  .shopify-app .layout>.side-col{grid-column:2;grid-row:1}
  .shopify-app .layout>.main-col{grid-column:1;grid-row:1}

}



.shopify-app .side-col{display:grid;gap:12px;align-content:start;min-width:0}
.shopify-app .conn-card{display:grid;gap:10px;border-top:3px solid var(--line)}
.shopify-app .conn-card.is-ok{border-top-color:var(--green)}
.shopify-app .conn-card.is-issue{border-top-color:#e08a00}
.shopify-app .conn-list{display:grid;gap:4px;list-style:none;margin:0;padding:0}
.shopify-app .conn-row{display:flex;gap:10px;padding:8px;border-radius:9px}
.shopify-app .conn-row strong{font-size:13px}
.shopify-app .conn-row p{color:var(--muted);margin-top:1px}
.shopify-app .conn-row .btn{margin-top:6px}
.shopify-app .conn-state{display:grid;place-items:center;width:26px;height:26px;flex-shrink:0;border-radius:50%;background:var(--grey-soft);color:var(--grey)}
.shopify-app .conn-state .icon{width:14px;height:14px;stroke-width:2.6}
.shopify-app .conn-row.is-ok .conn-state{background:var(--green-soft);color:var(--green)}
.shopify-app .conn-row.is-fail{background:var(--amber-soft)}
.shopify-app .conn-row.is-fail .conn-state{background:#ffe7b8;color:var(--amber)}
.shopify-app .conn-row.is-checking .conn-state{background:var(--soft);color:var(--purple);animation:pulse 1s ease-in-out infinite}
.shopify-app .conn-test{display:grid;gap:4px;padding-top:10px;border-top:1px solid #f0edf4}
.shopify-app .btn-block{width:100%;font-size:13.5px}

/* brand visuals */
.shopify-app .intro{position:relative;overflow:hidden}
.shopify-app .intro-mark{position:absolute;inset-inline-end:-28px;top:-18px;width:190px;height:auto;opacity:.16;pointer-events:none}
[dir=rtl] .shopify-app .intro-mark{transform:scaleX(-1)}
.shopify-app .intro>*:not(.intro-mark){position:relative}
.shopify-app .countries{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding-top:12px;border-top:1px solid #f0edf4}
.shopify-app .flag-row{display:flex;flex-wrap:wrap;gap:6px}
.shopify-app .flag{width:20px;height:20px;border-radius:5px;flex-shrink:0;object-fit:cover;display:inline-block}
.shopify-app .flag-lg{width:34px;height:34px;border-radius:8px;box-shadow:0 2px 6px #15082e1f;transition:transform .15s ease}
.shopify-app .flag-lg:hover{transform:translateY(-2px)}
.shopify-app .flag-xl{width:46px;height:46px;border-radius:11px;box-shadow:0 3px 10px #15082e26}
.shopify-app .status-mark{width:26px;height:auto;flex-shrink:0}
.shopify-app .card-mark{width:24px;height:auto}
.shopify-app .field-name{position:relative;padding-inline-start:36px}
.shopify-app .field-icon{position:absolute;inset-inline-start:0;top:1px;display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:var(--soft);color:var(--purple)}
.shopify-app .field-icon .icon{width:15px;height:15px}
.shopify-app .field-row.is-missing .field-icon{background:var(--amber-soft);color:var(--amber)}
.shopify-app .value .flag{width:16px;height:16px;border-radius:4px}
.shopify-app .oc-summary{flex-wrap:nowrap;justify-content:flex-start;gap:12px;background:linear-gradient(135deg,#f6f1ff,#fffbe0)}
.shopify-app .oc-summary-text{display:grid;gap:2px;min-width:0}
.shopify-app .oc-total{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.shopify-app .oc-section h3{display:flex;align-items:center;gap:6px}
.shopify-app .oc-icon{display:grid;place-items:center;width:20px;height:20px;border-radius:6px;background:var(--soft);color:var(--purple)}
.shopify-app .oc-icon .icon{width:12px;height:12px}


/* pager + brand label */
.shopify-app .pager{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px;padding-top:10px;border-top:1px solid #f0edf4}
.shopify-app .pager-buttons{display:flex;gap:4px}
.shopify-app .btn-page{min-height:30px;min-width:30px;padding:0 9px;background:#fff;color:var(--ink);border-color:#e3dfea;font-size:12.5px}
.shopify-app .btn-page:hover{background:var(--grey-soft);color:var(--ink)}
.shopify-app .btn-page.is-current{background:var(--purple);border-color:var(--purple);color:#fff}
.shopify-app .icon.flip{transform:rotate(180deg)}
[dir=rtl] .shopify-app .icon.flip{transform:none}
[dir=rtl] .shopify-app .pager .icon:not(.flip){transform:rotate(180deg)}
.shopify-app .app-header{justify-content:space-between}
.shopify-app .app-header>img{margin-inline-end:10px}
.shopify-app .brand-for{display:inline-flex;align-items:center;gap:6px;margin-inline-end:auto;padding:3px 10px;border-radius:999px;background:#e6f4ee;color:#00694f;font-size:11.5px;font-weight:700;white-space:nowrap}
.shopify-app .brand-dot{width:7px;height:7px;border-radius:50%;background:#008060}
.shopify-app .row-actions .btn-ghost{color:var(--purple-dark)}
@media(max-width:620px){.shopify-app .brand-for{display:none}}


/* result of "Send again", right under the button */
.shopify-app .order-result{margin:0;padding:8px 11px;border-radius:8px;font-size:13px;font-weight:600;overflow-wrap:anywhere}
.shopify-app .order-result.is-success{background:var(--green-soft);color:var(--green)}
.shopify-app .order-result.is-error{background:var(--red-soft,#fdecef);color:#9b1c31}
.shopify-app .order-result.is-info{background:var(--soft);color:var(--purple-dark)}
.shopify-app .btn.is-loading{opacity:.7;cursor:progress}
.shopify-app .btn.is-loading .icon{animation:spin .8s linear infinite}

/* toast + footer */
.shopify-app .toast{position:fixed;z-index:50;bottom:16px;inset-inline-start:50%;transform:translateX(-50%);max-width:min(520px,calc(100vw - 32px));padding:10px 14px;border-radius:10px;background:var(--night);color:#fff;font-size:13px;box-shadow:0 10px 30px #15082e33}
[dir=rtl] .shopify-app .toast{transform:translateX(50%)}
.shopify-app .toast.is-success{background:#0b5f43}
.shopify-app .toast.is-error{background:#8f1633}
.shopify-app .app-footer{display:none}
.shopify-app.is-busy{cursor:progress}

@media(max-width:620px){
  .shopify-app .card-head{flex-wrap:wrap}
  .shopify-app .field-tools{flex-wrap:wrap}
  .shopify-app .field-tools .search{flex-basis:100%}
  .shopify-app .example-picker{flex-basis:100%;min-width:0}
  .shopify-app .example-picker select{flex:1;min-width:0;max-width:100%}
  .shopify-app .picker-panel{width:100%}
  .shopify-app .shop-chip{display:none}
  .shopify-app .card{padding:14px}
  .shopify-app .intro{padding:18px}
  .shopify-app .btn-cta{width:100%}
  .shopify-app .order>summary{grid-template-columns:auto auto minmax(0,1fr) auto}
  .shopify-app .order>summary .chevron{display:none}
  .shopify-app .order-body,[dir=rtl] .shopify-app .order-body{padding:0 2px 12px}
  .shopify-app .field-custom{grid-column:1/-1}
  .shopify-app .status{flex-wrap:wrap}
}

/* field rows follow the width of their own card (container query), not the window */
@container (max-width:620px){
  .shopify-app .field-rows{grid-template-columns:minmax(0,1fr) auto}
  .shopify-app .field-row{gap:6px 8px}
  .shopify-app .field-row .field-name{grid-column:1;grid-row:1}
  .shopify-app .field-row>.btn,.shopify-app .field-row>span:empty{grid-column:2;grid-row:1;justify-self:end}
  .shopify-app .field-row .picker{grid-column:1/-1;grid-row:2}
  .shopify-app .field-row .field-value{grid-column:1/-1;grid-row:3}
  .shopify-app .field-row .field-custom{grid-column:1/-1;grid-row:4}
}
.shopify-app .layout>*{min-width:0}
.shopify-app .main-col,.shopify-app .side-col{grid-template-columns:minmax(0,1fr)}
@media(max-width:979px){
  .shopify-app .layout>.side-col,.shopify-app .layout>.main-col{display:contents}
  .shopify-app .layout>.side-col>.conn-card{order:1}
  .shopify-app .layout>.main-col>.card:first-child{order:2}
  .shopify-app .layout>.main-col>#fields{order:3}
  .shopify-app .layout>.side-col>.order-card{order:4}
  .shopify-app .layout>.main-col>.help{order:5}
}
.shopify-app .btn-cta,.shopify-app .btn-block,.shopify-app .field-tools .btn,.shopify-app .row-actions .btn,.shopify-app .conn-row .btn{white-space:normal;text-align:center}
.shopify-app .order>summary{grid-template-columns:auto auto minmax(0,1fr) auto auto}
.shopify-app .tag{max-width:100%;overflow:hidden;text-overflow:ellipsis}
.shopify-app .card-head{min-width:0;flex-wrap:wrap}
.shopify-app .oc-value{min-width:0;overflow-wrap:anywhere}
.shopify-app .oc-product .oc-value{overflow-wrap:anywhere}
.shopify-app .status p{overflow-wrap:anywhere}
.shopify-app .order-body p,.shopify-app .issues li{overflow-wrap:anywhere}
.shopify-app .order>summary{min-width:0}
.shopify-app .order>summary strong{white-space:nowrap}
.shopify-app .head-title{min-width:0;flex-wrap:wrap}
.shopify-app .example-picker select{max-width:160px}
/* price and payment: locked rows under the fields, always from Shopify */
.shopify-app .field-group{grid-column:1/-1;display:flex;align-items:center;gap:6px;margin-top:6px;padding:12px 0 2px;border-top:1px solid #ebe7f1;font-size:10.5px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--muted);min-width:0}
.shopify-app .field-group .icon{flex:none;width:12px;height:12px}
.shopify-app .field-group span{min-width:0;overflow-wrap:anywhere}
.shopify-app .field-group+.field-row{border-top:0}
.shopify-app .field-row.is-locked .value{align-items:flex-start}
.shopify-app .field-row.is-locked .value .icon{margin-top:2px}
.shopify-app .field-row.is-locked .value span{white-space:normal;overflow-wrap:anywhere}
.shopify-app .locked-source{display:flex;align-items:center;gap:6px;min-width:0;min-height:32px;padding:5px 9px;border:1px dashed #dcd6e6;border-radius:8px;background:#faf9fc;color:var(--muted);font-size:12.5px}
.shopify-app .locked-source .icon{flex:none;width:13px;height:13px}
.shopify-app .locked-source span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.shopify-app .oc-product-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;min-width:0}
.shopify-app .oc-price{flex:none;font-weight:600;color:var(--ink);white-space:nowrap;unicode-bidi:plaintext}
.shopify-app .oc-note{font-size:11.5px;color:var(--amber);overflow-wrap:anywhere}
.shopify-app .oc-line.oc-money{grid-template-columns:minmax(0,1fr) auto}
.shopify-app .oc-money .oc-value{text-align:end;white-space:nowrap;unicode-bidi:plaintext}
.shopify-app .oc-grand .oc-label{color:var(--ink);font-weight:700}
.shopify-app .oc-grand .oc-value{font-size:14px;font-weight:700}
.shopify-app .oc-grand .oc-used{grid-column:1/-1}
.shopify-app .oc-warn{margin:4px 0 0;padding:7px 9px;border-radius:8px;background:var(--amber-soft);color:var(--amber);font-size:12px;line-height:1.45;overflow-wrap:anywhere}
@container (max-width:620px){
  .shopify-app .field-row .locked-source{grid-column:1/-1;grid-row:2}
}
@media(prefers-reduced-motion:reduce){.shopify-app *{transition:none!important;animation:none!important}}
.shopify-app .oc-value,.shopify-app .value span,.shopify-app .picker-preview,.shopify-app .oc-sku b{unicode-bidi:plaintext}
.shopify-app .oc-summary>.oc-summary-text{display:grid;gap:3px}
/* public site pages: connect a store, home, privacy (Fufills brand, works in RTL) */
.site{background:#f8f6fd;font-size:15px}
.site .site-shell{max-width:1080px;margin:0 auto;padding:0 28px}
.site .site-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 0;margin:0;border-bottom:1px solid var(--line)}
.site .site-header img{display:block;width:140px;height:auto}
.site .site-back{font-size:13px;font-weight:650;white-space:nowrap}
.site main{padding:0 0 40px}
.site h1{font-size:clamp(30px,4.6vw,48px);line-height:1.08;letter-spacing:-1.5px;margin:0 0 14px;overflow-wrap:anywhere}
.site .site-h2,.site .policy h2{font-size:20px;letter-spacing:-.3px;margin:34px 0 14px}
.site .eyebrow-row{display:inline-flex;align-items:center;gap:8px;max-width:100%;padding:6px 12px;border-radius:999px;background:#fff;border:1px solid var(--line);font-size:12px;font-weight:700;color:var(--purple-dark);margin-bottom:18px}
.site .eyebrow-row img{flex:none;height:auto}
.site .hero{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:44px;align-items:center;padding:52px 0 18px}
.site .lead{font-size:17px;color:var(--muted);max-width:560px;margin:0 0 24px}
.site .cta{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:14px 24px;border-radius:13px;background:var(--yellow);color:var(--ink);font-weight:750;font-size:16px;text-decoration:none;box-shadow:0 12px 26px -12px #e6c800}
.site .cta:hover{background:#ffef4d;color:var(--ink)}
.site .cta-note{display:block;margin-top:10px;font-size:13px;color:var(--muted)}
.site .pending{display:grid;gap:6px;max-width:560px;padding:16px 18px;border-radius:14px;background:#fff;border:1px solid #e3d4fb;box-shadow:0 8px 24px -18px #7c3aed}
.site .pending strong{font-size:15.5px}
.site .pending span{color:var(--muted);font-size:14px}
.site .pending a{justify-self:start;font-weight:650;font-size:14px}
.site .hero-card{display:grid;gap:10px;justify-items:stretch;padding:24px;border-radius:22px;background:linear-gradient(140deg,#2c1065,#15082e 70%);box-shadow:0 30px 60px -32px #15082e}
.site .flow-row{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:14px;background:#ffffff12;color:#fff}
.site .flow-row b{display:block;font-size:14.5px}
.site .flow-row small{display:block;font-size:12.5px;color:#cfc3ec;unicode-bidi:plaintext}
.site .flow-row.is-fufills{background:#ffffff1f;box-shadow:inset 0 0 0 1px #ffe60055}
.site .flow-icon{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:11px;background:#ffffff1a;color:#fff}
.site .flow-icon svg{width:20px;height:20px}
.site .flow-ok{display:grid;place-items:center;flex:none;width:26px;height:26px;margin-inline-start:auto;border-radius:50%;background:#22c58b;color:#fff}
.site .flow-ok svg{width:14px;height:14px}
.site .flow-arrow{display:grid;place-items:center;color:var(--yellow)}
.site .flow-arrow svg{width:22px;height:22px}
.site .steps4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:0;padding:0;list-style:none}
.site .steps4 li{padding:18px;border-radius:16px;background:#fff;border:1px solid var(--line)}
.site .steps4 b{display:block;font-size:15px;margin:12px 0 4px}
.site .steps4 p{margin:0;font-size:13.5px;line-height:1.5;color:var(--muted)}
.site .step-n{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--soft);color:var(--purple-dark);font-weight:800;font-size:14px}
.site .two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:16px}
.site .panel{min-width:0;padding:22px;border-radius:18px;background:#fff;border:1px solid var(--line)}
.site .panel h2{font-size:17px;margin:0 0 12px}
.site .panel-note{margin:-4px 0 12px;font-size:13.5px;color:var(--muted)}
.site .checks{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.site .checks li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;font-size:14px;line-height:1.5}
.site .tick{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#e6f6ef;color:#0b8a5f}
.site .tick svg{width:12px;height:12px}
.site .currencies{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px;margin:0;padding:0;list-style:none}
.site .currencies li{display:flex;align-items:center;gap:9px;min-width:0;padding:8px 10px;border-radius:10px;background:#faf8fe;border:1px solid #f0ebf7;font-size:13.5px}
.site .currencies img{flex:none;width:20px;height:20px;border-radius:50%}
.site .currencies span{min-width:0;overflow-wrap:anywhere}
.site .currencies b{margin-inline-start:auto;padding-inline-start:6px}
.site .good{margin-top:16px}
.site .site-footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 18px;padding:22px 0 30px;margin:0;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted)}
.site .site-footer nav{display:flex;gap:16px}
.site .card{max-width:680px;margin:24px 0}
.site .shop{font-size:21px;font-weight:650;overflow-wrap:anywhere}
.site .steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:30px}
.site .steps>div{padding:16px;border-radius:14px;background:#fff;border:1px solid var(--line)}
.site .steps b{display:block;margin:6px 0 2px}
.site .steps p{margin:0;font-size:13.5px;color:var(--muted)}
.site main>h1:first-child,.site main>.badge:first-child{margin-top:44px}
.site .badge{display:inline-block;margin-top:44px;margin-bottom:14px;padding:6px 12px;border-radius:999px;font-size:12.5px;font-weight:700}
.site .policy{max-width:760px;padding:44px 0 10px}
.site .policy-updated{color:var(--muted);font-size:13px;margin:0 0 6px}
.site .policy-section p{color:#3d3352;margin:0}
@media(max-width:860px){.site .hero{grid-template-columns:1fr;gap:24px;padding:32px 0 8px}.site .steps4{grid-template-columns:repeat(2,minmax(0,1fr))}.site .two{grid-template-columns:1fr}}
@media(max-width:560px){.site .site-shell{padding:0 16px}.site .steps4,.site .steps{grid-template-columns:1fr}.site .cta{width:100%}.site .hero-card{padding:16px}.site .site-header img{width:118px}.site .lead{font-size:16px}}