body{padding-bottom:320px;color:var(--page-ink)}.study-nav,.workspace-heading small,.preview-label,.study-note{color:var(--page-muted)}.study-nav a,.edit-tab,.nav-icons{color:var(--page-ink)}.edit-tab{border-color:var(--page-ink)}.storefront,.palette-dock{color:var(--ink)}.service-icon,.add-service{background:var(--service-bg);color:var(--service-ink)}.pair-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}.pair-heading strong{font-size:14px}.pair-heading a{font-size:10px;opacity:.68}.pair-choices{display:flex;align-items:center;gap:10px;margin-bottom:12px}.pair-choices button{flex:1;min-width:0;display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:24px;background:transparent;color:var(--ink);padding:10px 12px;font-size:13px;min-height:44px}.pair-choices button[aria-expanded=true]{outline:2px solid var(--ink);outline-offset:1px}.pair-choices i{width:20px;height:20px;border-radius:50%;border:1px solid #8885;flex-shrink:0}.pair-choices small{margin-left:auto;opacity:.6}.variations{display:grid;grid-template-columns:repeat(10,minmax(44px,1fr));gap:8px;overflow:auto;scrollbar-width:none;padding:4px}.variations .swatch{justify-self:center}.swatch[aria-pressed=true]{outline:2px solid var(--ink)}.swatch:disabled{opacity:.25;cursor:default}.palette-dock .selection-heading{margin-top:8px}.selection-heading small{opacity:.65}.pair-heading a:focus-visible{outline:2px solid var(--ink)}#picker-label{font-size:12px;margin:0 0 5px}.palette-dock [hidden]{display:none}.swatches{grid-auto-columns:44px}.storefront .availability,.storefront .area{opacity:1}.study-note{opacity:.75}@media(max-width:560px){.variations{grid-template-columns:repeat(5,1fr);gap:5px}.palette-dock{padding-top:12px}.selection-heading h2{font-size:15px}}@media(prefers-reduced-motion:no-preference){#variations,#color-picker{animation:reveal .18s ease-out}@keyframes reveal{from{opacity:.4;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}

/* Complete theme roles: color carries through the storefront, not only its banner. */
.storefront .service{background:var(--card-bg)}.storefront .service>span:last-child,.storefront .trust{color:var(--detail-ink)}.storefront .add-service{background:var(--action-bg);color:var(--action-ink);border-color:var(--action-bg)}.storefront .banner p,.storefront .edit-info{color:var(--header-muted);opacity:1}.storefront .banner .avatar{box-shadow:none;border:0;outline:0}.study-note,.selection-heading small,.pair-heading a{opacity:1}

/* One clean outer edge for every palette; no contrasting card outline. */
.storefront{border:0;background:var(--header)}.storefront .store-body{background:var(--surface)}
/* Sixteen prepared compositions, always two rows, with a swipeable strip. */
.variations{grid-template-columns:none;grid-template-rows:repeat(2,44px);grid-auto-flow:column;grid-auto-columns:minmax(44px,1fr);gap:7px 8px;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;position:relative;padding:5px;scroll-padding:5px}
.storefront .service{color:var(--card-ink);border-color:var(--card-line)}.storefront .service>span:last-child{color:var(--card-detail)}
#palette-status{font-size:12px;margin:8px 0;color:var(--ink)}#palette-status:empty{display:none}#retry-palettes{border:1px solid var(--line);border-radius:20px;padding:9px 18px;background:transparent;color:var(--ink);margin-bottom:8px}button:disabled{cursor:wait}
@media(max-width:560px){.variations{grid-template-columns:none;grid-auto-columns:44px;gap:7px 8px}}
