/* A compact shared shop: visible funds, simple products, one checkout flow. */
.shopfront{--sf-line:color-mix(in srgb,var(--ink) 17%,transparent);--sf-surface:var(--theme-reading-surface,var(--panel-strong));max-width:1360px;margin-inline:auto;color:var(--ink);display:grid;gap:1.25rem;min-width:0;}
.shopfront *{box-sizing:border-box;}
.shopfront [hidden]{display:none!important;}
.shopfront a{color:inherit;}
.shopfront :is(h1,h2,p){margin:0;}
.shopfront :is(button,input,select){font:inherit;}
.shopfront :is(button,a,input,select,summary):focus-visible{outline:3px solid var(--ink);outline-offset:3px;}
.shopfront-header{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.5rem 0;}
.shopfront-header h1{font-size:clamp(1.9rem,4vw,2.8rem);line-height:1.08;letter-spacing:-.035em;margin:.3rem 0 .5rem;text-shadow:none;}
.shopfront-header p:not(.shopfront-eyebrow){color:var(--muted);font-size:1rem;line-height:1.5;}
.shopfront-eyebrow{font-size:.72rem;letter-spacing:.15em;font-weight:800;color:var(--muted);}
.shopfront-icon{display:inline-block;flex:0 0 auto;width:1.2rem;height:1.2rem;vertical-align:middle;}
.shopfront-button{min-height:44px;border:1px solid var(--sf-line);border-radius:10px;background:var(--panel-strong);color:var(--ink);padding:.65rem .9rem;display:inline-flex;gap:.45rem;justify-content:center;align-items:center;font-size:.88rem;font-weight:750;line-height:1.25;text-decoration:none;cursor:pointer;text-align:center;box-shadow:none;transform:none;letter-spacing:normal;}
.shopfront-button:hover{border-color:var(--brand);background:color-mix(in srgb,var(--brand) 9%,var(--panel-strong));transform:none;}
.shopfront-button.shopfront-primary{background:var(--ink);color:var(--panel-strong);border-color:var(--ink);}
.shopfront-button.shopfront-primary:hover{background:color-mix(in srgb,var(--ink) 85%,var(--brand));}
.shopfront-cart{white-space:nowrap;flex:0 0 auto;}
.shopfront-cart-count{display:inline-flex;align-items:center;justify-content:center;min-width:1.4rem;min-height:1.4rem;border-radius:6px;margin-left:.25rem;padding:0 .2rem;background:color-mix(in srgb,currentColor 15%,transparent);font-variant-numeric:tabular-nums;}
.shopfront-wallet{display:flex;flex-wrap:wrap;gap:1rem 2rem;align-items:center;border:1px solid var(--sf-line);border-top:3px solid var(--brand-2,var(--brand));border-radius:14px;padding:1rem 1.25rem;background:var(--sf-surface);}
.shopfront-wallet-value{display:flex;flex-direction:column;gap:.2rem;min-width:150px;flex:1 1 150px;text-decoration:none;font-size:.8rem;line-height:1.4;color:var(--muted);}
.shopfront-wallet-value strong{font-size:1.45rem;letter-spacing:-.03em;color:var(--ink);font-variant-numeric:tabular-nums;line-height:1.3;}
.shopfront-wallet-value strong small{font-size:.65rem;font-weight:600;letter-spacing:.02em;color:var(--muted);}
.shopfront-wallet-value>span:first-child{font-size:.85rem;font-weight:600;color:var(--ink);}
.shopfront-wallet-link{text-decoration:underline;text-underline-offset:3px;}
.shopfront-wallet>div>p{margin-top:.3rem;color:var(--muted);font-size:.88rem;}
.shopfront-wallet-value>small{font-size:.72rem;color:var(--muted);}
.shopfront-rewards{font-size:.83rem;flex:1 1 180px;position:relative;}
.shopfront-rewards summary{cursor:pointer;text-decoration:underline;text-underline-offset:3px;padding:.5rem 0;}
.shopfront-rewards dl{margin:.5rem 0;display:grid;gap:.4rem;}
.shopfront-rewards dl>div{display:flex;justify-content:space-between;gap:.75rem;}
.shopfront-rewards dd{margin:0;font-weight:700;}
.shopfront-rewards p{font-size:.76rem;color:var(--muted);}
.shopfront-tabs{display:flex;gap:.35rem;border-bottom:1px solid var(--sf-line);overflow-x:auto;scrollbar-width:thin;padding-bottom:.5rem;}
.shopfront-tabs a{flex:0 0 auto;padding:.65rem 1rem;min-height:44px;border-radius:9px;font-size:.9rem;font-weight:650;display:flex;align-items:center;text-decoration:none;line-height:1.2;}
.shopfront-tabs a:hover{background:color-mix(in srgb,var(--brand) 10%,transparent);}
.shopfront-tabs a[aria-current="page"]{background:var(--sf-surface);box-shadow:inset 0 -3px 0 var(--brand);font-weight:800;}
.shopfront-catalog{display:grid;gap:.9rem;min-width:0;scroll-margin-top:6rem;}
.shopfront-search{display:grid;grid-template-columns:minmax(170px,1fr) auto auto auto;gap:.65rem;align-items:end;margin:0;}
.shopfront-search-field{position:relative;display:flex;align-items:center;gap:.5rem;min-width:0;margin:0;}
.shopfront-search-field>.shopfront-icon{position:absolute;left:.75rem;color:var(--muted);pointer-events:none;}
.shopfront .shopfront-search-field input{width:100%;height:44px;padding:.65rem .8rem .65rem 2.45rem;min-width:0;}
.shopfront-filter{display:grid;gap:.25rem;font-size:.75rem;font-weight:600;color:var(--muted);margin:0;}
.shopfront :is(.shopfront-filter select,.shopfront-search-field input,.shopfront-quantity input){border:1px solid var(--sf-line);border-radius:9px;background:var(--panel-strong);color:var(--ink);font-size:.87rem;box-shadow:none;min-height:44px;}
.shopfront-filter select{padding:.65rem 1.7rem .65rem .6rem;max-width:210px;width:100%;}
.shopfront-results-line{display:flex;align-items:center;justify-content:space-between;gap:.5rem;min-height:1.4rem;font-size:.8rem;color:var(--muted);}
.shopfront-results-line a{font-weight:600;text-underline-offset:3px;}
.shopfront-preview{display:flex;align-items:center;justify-content:space-between;gap:.75rem;font-size:.8rem;color:var(--muted);padding:.5rem .75rem;border-radius:9px;border:1px dashed var(--sf-line);background:var(--sf-surface);}
.shopfront-text-button{border:0;background:transparent;color:var(--ink);text-decoration:underline;text-underline-offset:3px;padding:.4rem 0;white-space:nowrap;cursor:pointer;font-size:.8rem;min-height:36px;}
.shopfront-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;align-items:stretch;}
.shopfront-product{min-width:0;display:flex;flex-direction:column;gap:.8rem;background:var(--sf-surface);border:1px solid var(--sf-line);border-radius:14px;padding:1.15rem;scroll-margin-top:6rem;transition:border-color .15s ease;}
.shopfront-product:hover{border-color:color-mix(in srgb,var(--brand) 55%,var(--sf-line));}
.shopfront-product:target{outline:2px solid var(--brand-2);outline-offset:3px;}
.shopfront-product.is-owned{border-color:color-mix(in srgb,var(--brand-2) 38%,var(--sf-line));}
.shopfront-product h2{font-size:1.15rem;line-height:1.3;letter-spacing:-.018em;text-shadow:none;overflow-wrap:anywhere;}
.shopfront-product-top{display:flex;align-items:center;flex-wrap:wrap;justify-content:space-between;gap:.4rem;}
.shopfront-kind{display:inline-flex;gap:.35rem;align-items:center;font-size:.7rem;color:var(--muted);line-height:1.3;}
.shopfront-kind .shopfront-icon{width:.95rem;height:.95rem;}
.shopfront-badge{font-size:.64rem;font-weight:750;border-radius:5px;padding:.25rem .4rem;background:var(--panel-strong);color:var(--ink);line-height:1.2;}
.shopfront-badge.has-access{box-shadow:inset 3px 0 var(--brand-2);padding-left:.6rem;}
.shopfront-description,.shopfront-description-details{color:var(--muted);font-size:.85rem;line-height:1.55;overflow-wrap:anywhere;}
.shopfront-description-details summary{cursor:pointer;list-style:none;}
.shopfront-description-details summary::-webkit-details-marker{display:none;}
.shopfront-description-details summary span{display:inline-block;margin-left:.2rem;color:var(--ink);text-decoration:underline;text-underline-offset:3px;font-size:.78rem;}
.shopfront-description-details[open] summary{font-size:0;}
.shopfront-description-details[open] summary span{font-size:.78rem;}
.shopfront-description-details[open] p{margin-top:.4rem;}
.shopfront-product-bottom{margin-top:auto;display:flex;flex-direction:column;gap:.6rem;padding-top:.25rem;}
.shopfront-price{display:flex;align-items:baseline;flex-wrap:wrap;gap:.3rem .5rem;}
.shopfront-price strong{font-size:1.38rem;line-height:1.25;letter-spacing:-.035em;}
.shopfront-price s,.shopfront-price>span{font-size:.78rem;color:var(--muted);}
.shopfront-points{font-size:.78rem;font-weight:650;color:var(--ink);line-height:1.5;}
.shopfront-points span{font-weight:400;color:var(--muted);}
.shopfront-note{font-size:.73rem;color:var(--muted);line-height:1.5;}
.shopfront-preview-button{display:flex;justify-content:center;align-items:center;gap:.4rem;min-height:40px;background:transparent;border:1px dashed var(--sf-line);border-radius:8px;color:var(--ink);font-size:.84rem;cursor:pointer;padding:.45rem;}
.shopfront-preview-button:hover,.shopfront-preview-button.is-active{background:color-mix(in srgb,var(--brand-2) 12%,transparent);border-color:var(--brand-2);}
.shopfront-purchase{display:grid;gap:.55rem;margin:0;}
.shopfront-purchase-buttons{display:flex;flex-wrap:wrap;gap:.45rem;}
.shopfront-purchase-buttons>.shopfront-button{flex:1 1 110px;font-size:.82rem;padding:.6rem .65rem;}
.shopfront-quantity{display:flex;align-items:center;justify-content:space-between;gap:.5rem;font-size:.8rem;margin:0;}
.shopfront .shopfront-quantity input{width:95px;padding:.5rem .6rem;min-width:0;}
.shopfront-empty{padding:2.5rem 1rem;text-align:center;border:1px dashed var(--sf-line);border-radius:14px;}
.shopfront-empty h2{font-size:1.3rem;}
.shopfront-empty p{font-size:.9rem;color:var(--muted);margin:.6rem 0 1rem;}
.shopfront-help{border-top:1px solid var(--sf-line);padding:1rem 0;display:flex;justify-content:space-between;gap:1rem;font-size:.78rem;line-height:1.5;color:var(--muted);}
.shopfront-help a{flex:0 0 auto;font-weight:600;}
.shopfront-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
@media(min-width:1450px){.shopfront-grid{grid-template-columns:repeat(4,minmax(0,1fr));}}
@media(max-width:1050px){.shopfront-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.shopfront-search{grid-template-columns:minmax(140px,1fr) auto auto;}.shopfront-search-submit{grid-column:1/-1;}.shopfront.has-live-search .shopfront-search-submit{display:none;}}
@media(max-width:620px){.shopfront{gap:.9rem;}.shopfront-header{gap:.6rem;}.shopfront-header h1{font-size:2rem;}.shopfront-header p:not(.shopfront-eyebrow){font-size:.85rem;}.shopfront-cart{padding:.65rem;}.shopfront-wallet{padding:.9rem;gap:.85rem 1rem;}.shopfront-wallet-value{min-width:0;flex-basis:calc(50% - 1rem);font-size:.7rem;}.shopfront-wallet-value strong{font-size:1.25rem;}.shopfront-wallet-value>span:first-child{font-size:.77rem;}.shopfront-tabs{gap:.2rem;}.shopfront-tabs a{padding:.6rem .8rem;font-size:.82rem;}.shopfront-search{grid-template-columns:1fr 1fr;gap:.55rem;}.shopfront-search-field{grid-column:1/-1;}.shopfront .shopfront-search-field input,.shopfront-filter select,.shopfront .shopfront-quantity input{font-size:16px;}.shopfront-filter select{max-width:none;font-size:16px;min-width:0;}.shopfront-filter{min-width:0;}.shopfront-grid{grid-template-columns:1fr;gap:.75rem;}.shopfront-product{padding:1rem;gap:.65rem;}.shopfront-product h2{font-size:1.15rem;}.shopfront-preview{align-items:flex-start;font-size:.73rem;}.shopfront-preview .shopfront-text-button{font-size:.73rem;}.shopfront-help{flex-direction:column;gap:.5rem;}}
@media(prefers-reduced-motion:reduce){.shopfront-product{transition:none;}}
html[data-theme="accessibility"] .shopfront{--sf-surface:var(--panel-strong);}
html[data-theme="accessibility"] .shopfront :is(.shopfront-kind,.shopfront-description,.shopfront-note,.shopfront-filter,.shopfront-points){font-size:1rem;}

@media(prefers-reduced-transparency:reduce){.shopfront{--sf-surface:var(--panel-strong);}}

/* Keep each text group on its own reading surface; open grid gaps still reveal
   the theme scene. Bare headings must not depend on the image behind the page. */
.shopfront-header,
.shopfront-tabs,
.shopfront-search,
.shopfront-results-line,
.shopfront-help,
.shopfront-empty {
    background: var(--sf-surface);
    border-radius: 12px;
}
.shopfront-header { padding: 1rem 1.15rem; }
.shopfront-tabs { padding: .45rem; }
.shopfront-search { padding: .8rem; }
.shopfront-results-line { padding: .6rem .8rem; }
.shopfront-help { padding: 1rem; }
.shopfront :is(h1, h2, .shopfront-price strong) { color: var(--ink); }

/* The shared legacy link/button selectors otherwise override just one half of
   the storefront's color pair. Cover both anchor and native-button controls. */
html[data-theme] body .site-main .shopfront[data-shopfront] a:not(.shopfront-button) {
    color: var(--theme-readable-link, var(--ink));
}
html[data-theme] body .site-main .shopfront[data-shopfront] :is(a, button).shopfront-button {
    background: var(--panel-strong) !important;
    color: var(--ink) !important;
    border-color: var(--sf-line) !important;
    text-shadow: none;
}
html[data-theme] body .site-main .shopfront[data-shopfront] :is(a, button).shopfront-button.shopfront-primary {
    background: var(--ink) !important;
    color: var(--panel-strong) !important;
    border-color: var(--ink) !important;
}
html[data-theme] body .site-main .shopfront[data-shopfront] :is(a, button).shopfront-button:hover {
    outline: 2px solid var(--ink);
    outline-offset: 2px;
}
html[data-theme] body .site-main .shopfront[data-shopfront] button:is(.shopfront-preview-button, .shopfront-text-button) {
    background: var(--panel-strong) !important;
    color: var(--ink) !important;
    border-color: var(--sf-line) !important;
    text-shadow: none;
}
html[data-theme] body .site-main .shopfront[data-shopfront] button.shopfront-preview-button:is(:hover, .is-active) {
    outline: 2px solid var(--ink);
    outline-offset: 2px;
}
html[data-theme] body .site-main .shopfront[data-shopfront] :is(input:not([type="hidden"]), select, option) {
    background: var(--panel-strong) !important;
    color: var(--ink) !important;
    border-color: var(--sf-line) !important;
}
html[data-theme] body .site-main .shopfront[data-shopfront] input::placeholder {
    color: var(--muted) !important;
    opacity: 1;
}
html[data-theme] body .site-main .shopfront[data-shopfront] .shopfront-button :is(span, small, strong, em) {
    color: inherit !important;
}
html[data-theme] body .site-main .shopfront[data-shopfront] :is(button, input, select):disabled {
    opacity: 1;
    border-style: dashed;
}
@media (forced-colors: active) {
    .shopfront { --sf-surface: Canvas; --sf-line: CanvasText; }
    html[data-theme] body .site-main .shopfront[data-shopfront] :is(a, button).shopfront-button,
    html[data-theme] body .site-main .shopfront[data-shopfront] button:is(.shopfront-preview-button, .shopfront-text-button),
    html[data-theme] body .site-main .shopfront[data-shopfront] :is(input:not([type="hidden"]), select, option) {
        background: Canvas !important;
        color: CanvasText !important;
        border-color: CanvasText !important;
    }
    html[data-theme] body .site-main .shopfront[data-shopfront] :is(a, button).shopfront-button.shopfront-primary {
        background: Highlight !important;
        color: HighlightText !important;
    }
}
