#cpc-root {
    --cpc-bg: var(--ac-background, #fff);
    --cpc-text: var(--ac-text, #202020);
    --cpc-muted: var(--ac-muted, #595959);
    --cpc-border: var(--ac-border, #d6d6d6);
    --cpc-button: var(--ac-button-bg, var(--canvas-color-button-back, #202020));
    --cpc-button-text: var(--ac-button-text, var(--canvas-color-button-fore, #fff));
    --cpc-button-hover: var(--ac-button-hover-bg, var(--canvas-color-button-hover, #393939));
    --cpc-button-hover-text: var(--ac-button-hover-text, var(--canvas-color-button-hover-fore, #fff));
    --cpc-gap: calc(16px + env(safe-area-inset-bottom, 0px) + var(--cpc-extra-offset, 0px));
    --cpc-side: max(16px, env(safe-area-inset-right, 0px));
    color: var(--cpc-text);
    font-family: inherit;
    font-size: 16px;
    line-height: 1.45;
}
#cpc-root[data-appearance="light"] { --cpc-bg:#fff; --cpc-text:#202020; --cpc-muted:#595959; --cpc-border:#d6d6d6; color-scheme:light; }
#cpc-root[data-appearance="dark"] { --cpc-bg:#151515; --cpc-text:#f5f5f5; --cpc-muted:#bfbfbf; --cpc-border:#555; color-scheme:dark; }
#cpc-root *, #cpc-root *::before, #cpc-root *::after { box-sizing:border-box; }
#cpc-root [hidden][hidden] { display:none; }
#cpc-root button { font:inherit; color:inherit; cursor:pointer; text-transform:none; letter-spacing:normal; }
#cpc-root button:disabled { opacity:.55; cursor:wait; }
#cpc-root a { color:inherit; }
#cpc-root :focus-visible { outline:2px solid var(--cpc-text); outline-offset:3px; }
#cpc-root ::selection { background:var(--cpc-button); color:var(--cpc-button-text); }
#cpc-root svg { width:24px; height:24px; display:block; }
#cpc-root .cpc-launcher {
    position:fixed; z-index:9990; bottom:var(--cpc-gap); right:var(--cpc-side);
    width:56px; height:56px; padding:0; margin:0; display:flex; align-items:center; justify-content:center;
    border:1px solid var(--cpc-border); border-radius:8px; background:var(--cpc-bg); color:var(--cpc-text);
    box-shadow:0 6px 24px rgb(0 0 0 / .14); line-height:1.2;
}
#cpc-root .cpc-icon { display:flex; align-items:center; justify-content:center; font-size:23px; }
#cpc-root .cpc-icon-word { font-size:13px; }
#cpc-root .cpc-badge { position:absolute; top:-8px; right:-7px; min-width:23px; height:23px; padding:3px 5px; border-radius:50%; background:var(--cpc-button); color:var(--cpc-button-text); font:600 12px/17px sans-serif; }
#cpc-root .cpc-bar-summary, #cpc-root .cpc-bar-label { display:none; }
#cpc-root #cpc-dialog {
    position:fixed; inset:auto var(--cpc-side) calc(var(--cpc-gap) + 72px) auto;
    width:min(420px, calc(100vw - 32px)); max-width:none; max-height:calc(100dvh - var(--cpc-gap) - 96px);
    margin:0; padding:0; border:1px solid var(--cpc-border); border-radius:12px;
    color:var(--cpc-text); background:var(--cpc-bg); box-shadow:0 12px 48px rgb(0 0 0 / .2);
    font:inherit; overflow:hidden;
}
#cpc-root #cpc-dialog[open] { display:flex; flex-direction:column; animation:cpc-enter .2s cubic-bezier(.16,1,.3,1); }
#cpc-root #cpc-dialog::backdrop { background:rgb(0 0 0 / .3); }
#cpc-root .cpc-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 16px 8px 24px; flex-shrink:0; }
#cpc-root .cpc-heading h2 { margin:0; font-size:26px; line-height:1.2; color:inherit; flex:1; min-width:0; }
#cpc-root .cpc-loading, .cpc-purchase .cpc-loading {
    box-sizing:border-box;
    flex:0 0 18px; width:18px; height:18px; border:1.5px solid var(--cpc-border, currentColor);
    border-top-color:var(--cpc-text, transparent); border-radius:50%; visibility:hidden;
    animation:cpc-spin .8s linear infinite; animation-play-state:paused;
}
#cpc-root[data-busy="true"] #cpc-dialog[open] .cpc-loading { visibility:visible; animation-play-state:running; }
.cpc-purchase { position:relative; }
.cpc-purchase .cpc-purchase-feedback { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; gap:8px; opacity:0; pointer-events:none; }
.cpc-purchase[aria-busy="true"] { cursor:wait; }
.cpc-purchase[aria-busy="true"] .cpc-purchase-label { opacity:0; }
.cpc-purchase[aria-busy="true"] .cpc-purchase-feedback { opacity:1; }
.cpc-purchase[aria-busy="true"] .cpc-loading { visibility:visible; animation-play-state:running; }
#cpc-root .cpc-close { width:44px; height:44px; min-width:44px; display:grid; place-items:center; padding:0; border:0; border-radius:4px; background:transparent; }
#cpc-root .cpc-close:hover, #cpc-root .cpc-continue:hover { background:color-mix(in srgb, var(--cpc-text) 7%, transparent); }
#cpc-root .cpc-items { overflow:auto; overscroll-behavior:contain; min-height:0; padding:0 24px; scrollbar-width:thin; scrollbar-color:var(--cpc-muted) var(--cpc-bg); }
#cpc-root .cpc-item { display:grid; grid-template-columns:76px minmax(0,1fr); gap:16px; padding:20px 0; border-top:1px solid var(--cpc-border); }
#cpc-root .cpc-item img { width:76px; height:90px; object-fit:contain; background:transparent; border:0; border-radius:0; }
#cpc-root .cpc-item-name { display:block; font-size:16px; line-height:1.35; text-decoration:none; overflow-wrap:anywhere; }
#cpc-root .cpc-item-name:hover { text-decoration:underline; text-underline-offset:3px; }
#cpc-root .cpc-meta { margin:4px 0; color:var(--cpc-muted); font-size:13px; overflow-wrap:anywhere; }
#cpc-root .cpc-price { margin:8px 0; font-variant-numeric:tabular-nums; }
#cpc-root .cpc-item-actions { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
#cpc-root .cpc-quantity { width:76px; height:44px; min-height:44px; padding:8px; border:1px solid var(--cpc-border); border-radius:4px; background:var(--cpc-bg); color:var(--cpc-text); font:inherit; caret-color:var(--cpc-text); }
#cpc-root .cpc-remove, #cpc-root .cpc-retry { min-height:44px; padding:8px; border:0; background:transparent; text-decoration:underline; text-underline-offset:3px; font-size:14px; }
#cpc-root .cpc-footer { flex-shrink:0; padding:20px 24px 12px; border-top:1px solid var(--cpc-border); }
#cpc-root .cpc-totals { display:flex; justify-content:space-between; gap:16px; font-variant-numeric:tabular-nums; }
#cpc-root .cpc-note { font-size:12px; color:var(--cpc-muted); margin:8px 0 16px; }
#cpc-root .cpc-checkout { display:flex; align-items:center; justify-content:center; width:100%; min-height:48px; margin:0; padding:12px 16px; background:var(--cpc-button); color:var(--cpc-button-text); border:1px solid transparent; border-radius:4px; text-decoration:none; font:inherit; }
#cpc-root .cpc-checkout::after { content:none; }
#cpc-root .cpc-checkout:hover { background:var(--cpc-button-hover); color:var(--cpc-button-hover-text); }
#cpc-root .cpc-checkout[aria-disabled="true"] { opacity:.5; cursor:wait; }
#cpc-root .cpc-continue { display:block; min-height:44px; width:100%; margin:4px 0 0; padding:8px; background:transparent; border:0; border-radius:4px; font-size:14px; }
#cpc-root .cpc-empty { padding:24px 0 32px; text-align:center; }
#cpc-root[data-busy="true"] .cpc-empty { visibility:hidden; }
#cpc-root .cpc-empty p { margin:0 0 12px; }
#cpc-root .cpc-empty a { display:inline-flex; align-items:center; min-height:44px; text-underline-offset:3px; }
#cpc-root .cpc-error { padding:8px 24px; border-block:1px solid var(--cpc-border); font-size:14px; overflow:auto; max-height:25dvh; flex-shrink:0; }
#cpc-root .cpc-error p { margin:0; }
#cpc-root .cpc-status, #cpc-root .cpc-announcement { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
@media (min-width:768px) {
    #cpc-root[data-desktop="bar"] .cpc-launcher { left:max(16px, env(safe-area-inset-left, 0px)); width:auto; padding:0 20px; gap:16px; justify-content:flex-start; }
    #cpc-root[data-desktop="bar"] .cpc-badge { display:none; }
    #cpc-root[data-desktop="bar"] .cpc-bar-summary { display:flex; align-items:center; gap:16px; }
    #cpc-root[data-desktop="bar"] .cpc-bar-label { display:block; margin-left:auto; }
}
@media (max-width:767px) {
    #cpc-root #cpc-dialog { inset:auto var(--cpc-side) var(--cpc-gap) max(16px, env(safe-area-inset-left, 0px)); width:auto; max-height:min(85dvh, calc(100dvh - var(--cpc-gap) - 16px)); }
    #cpc-root[data-mobile="bar"] .cpc-launcher { left:max(16px, env(safe-area-inset-left, 0px)); width:auto; padding:0 16px; gap:12px; justify-content:flex-start; }
    #cpc-root[data-mobile="bar"] .cpc-badge { display:none; }
    #cpc-root[data-mobile="bar"] .cpc-bar-summary { display:flex; flex-direction:column; text-align:left; font-size:13px; gap:2px; }
    #cpc-root[data-mobile="bar"] .cpc-bar-label { display:block; margin-left:auto; font-size:14px; }
    #cpc-root .cpc-heading { padding-left:16px; }
    #cpc-root .cpc-items { padding-inline:16px; }
    #cpc-root .cpc-footer { padding:16px 16px 8px; }
    #cpc-root .cpc-error { padding-inline:16px; }
    #cpc-root .cpc-item { grid-template-columns:60px minmax(0,1fr); gap:12px; padding:16px 0; }
    #cpc-root .cpc-item img { width:60px; height:76px; }
}
@media (max-height:480px) { #cpc-root #cpc-dialog { bottom:16px; max-height:calc(100dvh - 32px); } #cpc-root .cpc-note { display:none; } #cpc-root .cpc-footer { padding-top:8px; } }
@keyframes cpc-spin { to { transform:rotate(1turn); } }
@keyframes cpc-enter { from { transform:translateY(12px); opacity:.6; } to { transform:translateY(0); opacity:1; } }
@media (prefers-reduced-motion:reduce) { #cpc-root #cpc-dialog[open], #cpc-root .cpc-loading, .cpc-purchase .cpc-loading { animation:none; } }
