/* Design Studio — "Your guitar" panel, phone strip, and 3D jacket view. */

.cfpe-parts-layer{position:absolute;left:0;top:0;width:100%;height:100%;overflow:visible;pointer-events:none;}

/* Desktop: "Guitar look" dropdown anchored under its button in the composer bar. */
.cfpe-ed-composer-bar>details#cfpe-guitar-fold{position:relative !important;}
#cfpe-guitar-fold>.cfpe-fold__panel{left:0;right:auto;width:356px;max-height:min(72vh,540px);padding:.65rem .75rem .75rem;}
.cfpe-guitar-fold__icon{font-size:.95em;line-height:1;}

.cfpe-guitar-look{font-family:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;color:#ece7df;}
.cfpe-guitar-look__head{display:flex;align-items:baseline;justify-content:space-between;gap:.6rem;margin:0 0 .5rem;}
.cfpe-guitar-look__title{margin:0;font-size:.66rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:rgba(236,231,223,0.62);}
.cfpe-guitar-look__note{margin:0;font-size:.66rem;color:rgba(236,231,223,0.45);text-align:right;}
.cfpe-guitar-look__row{margin:0 0 .5rem;transition:opacity .15s ease;}
.cfpe-guitar-look__label{margin:0 0 .2rem;font-size:.74rem;font-weight:600;color:rgba(236,231,223,0.82);}
.cfpe-guitar-look__swatches{display:flex;flex-wrap:wrap;gap:.3rem;}
.cfpe-guitar-swatch{-webkit-appearance:none;appearance:none;display:flex;flex-direction:column;align-items:center;gap:.22rem;box-sizing:border-box;width:46px;min-height:46px;margin:0;padding:4px 0 0;border:0;border-radius:8px;background:transparent;color:inherit;cursor:pointer;}
.cfpe-guitar-swatch__chip{display:block;width:30px;height:30px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(255,255,255,0.2),0 1px 3px rgba(0,0,0,0.6);transition:transform .12s ease,box-shadow .12s ease;}
.cfpe-guitar-swatch:hover .cfpe-guitar-swatch__chip{transform:scale(1.07);}
.cfpe-guitar-swatch.is-selected .cfpe-guitar-swatch__chip{box-shadow:0 0 0 2px #141416,0 0 0 4px #e7c88c;}
.cfpe-guitar-swatch:focus{outline:none;}
.cfpe-guitar-swatch:focus-visible .cfpe-guitar-swatch__chip{box-shadow:0 0 0 2px #141416,0 0 0 4px #f7e088;}
.cfpe-guitar-swatch__name{max-width:64px;font-size:.62rem;font-weight:600;line-height:1.1;color:#f7e088;white-space:nowrap;visibility:hidden;}
.cfpe-guitar-swatch.is-selected .cfpe-guitar-swatch__name{visibility:visible;}
.cfpe-guitar-look__show{display:flex;align-items:center;gap:.55rem;margin:.15rem 0 0;padding-top:.55rem;border-top:1px solid rgba(231,200,140,0.14);font-size:.78rem;font-weight:600;cursor:pointer;min-height:36px;}
.cfpe-guitar-look__show input{width:18px;height:18px;margin:0;accent-color:#e7c88c;}
.cfpe-guitar-look.is-parts-hidden .cfpe-guitar-look__row{opacity:.45;}

/* Featured 3D control, sitting to the right of Print quality. */
.cfpe-3d-toggle[hidden]{display:none !important;}
#cfpe-stage-3d.cfpe-view3d{-webkit-appearance:none;appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:.45rem;box-sizing:border-box;min-height:36px;min-width:9.5rem;margin:0;padding:0 1.05rem 0 .8rem;border:1px solid rgba(231,200,140,0.78);border-radius:999px;background:linear-gradient(180deg,rgba(243,221,176,0.28),rgba(231,200,140,0.08) 46%,rgba(18,16,12,0.15)),#1c1914;color:#f7e088;font:700 13px/1 "Inter",system-ui,-apple-system,"Segoe UI",sans-serif;letter-spacing:.01em;white-space:nowrap;cursor:pointer;box-shadow:0 0 0 1px rgba(0,0,0,0.55),0 0 18px rgba(231,200,140,0.22);transition:background .12s ease,color .12s ease,border-color .12s ease,box-shadow .12s ease;}
#cfpe-stage-3d.cfpe-view3d:hover{border-color:#f6e3b4;color:#fff6d8;box-shadow:0 0 0 1px rgba(0,0,0,0.55),0 0 24px rgba(231,200,140,0.38);}
#cfpe-stage-3d.cfpe-view3d:focus{outline:none;}
#cfpe-stage-3d.cfpe-view3d:focus-visible{box-shadow:0 0 0 2px #141416,0 0 0 4px #f7e088;}
#cfpe-stage-3d.cfpe-view3d.is-active{background:linear-gradient(180deg,#f6e3b4,#e7c88c);border-color:#f6e3b4;color:#17130a;box-shadow:0 0 0 1px rgba(0,0,0,0.4),0 0 16px rgba(231,200,140,0.28);}
.cfpe-view3d__mark{width:15px;height:15px;flex:0 0 auto;}

/* Phone top strip — desktop never shows it. */
.cfpe-guitar-strip{display:none;}

/* 3D viewport: replaces the board in the same space. */
.cfpe-3d-view{position:absolute;inset:0;z-index:25;overflow:hidden;background:radial-gradient(ellipse at 50% 42%,#2b2b30 0%,#131315 58%,#000 100%);touch-action:none;cursor:grab;}
.cfpe-3d-view.is-dragging{cursor:grabbing;}
.cfpe-3d-view canvas{display:block;width:100%;height:100%;outline:none;}
.cfpe-3d-view__status{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:.55rem;padding:.55rem .95rem;border-radius:999px;background:rgba(14,14,16,0.92);border:1px solid rgba(231,200,140,0.3);color:#ece7df;font:600 .8rem/1.2 "Inter",system-ui,sans-serif;white-space:nowrap;pointer-events:none;transition:opacity .45s ease;}
.cfpe-3d-view__status.is-hint{top:auto;bottom:14px;transform:translateX(-50%);}
.cfpe-3d-view__status.is-hidden{opacity:0;}
.cfpe-3d-view__spinner{width:14px;height:14px;border-radius:50%;border:2px solid rgba(231,200,140,0.3);border-top-color:#e7c88c;animation:cfpe-3d-spin .8s linear infinite;}
@keyframes cfpe-3d-spin{to{transform:rotate(360deg);}}

/* Editing is locked while the 3D view is up; only the 2D/3D toggle stays live. */
html.cfpe-3d-active #cfpe-editor [data-cfpe-3d-off],
html.cfpe-3d-active .cfpe-ed-composer-btn--upload,
html.cfpe-3d-active .cfpe-bg-select-wrap{opacity:.35 !important;pointer-events:none !important;cursor:default !important;}
html.cfpe-3d-active .cfpe-ctx-style{display:none !important;}

@media (prefers-reduced-motion: reduce){
	.cfpe-3d-view__spinner{animation:none;}
	.cfpe-guitar-swatch__chip{transition:none;}
}

@media (max-width:700px){
	#cfpe-stage-3d.cfpe-view3d{min-height:44px;min-width:10.5rem;padding:0 1.15rem 0 .9rem;}
	.cfpe-guitar-strip:not([hidden]){display:flex;flex:0 0 auto;align-items:stretch;gap:6px;padding:4px 6px 5px;background:#000;}
	.cfpe-guitar-strip__btn{-webkit-appearance:none;appearance:none;flex:1 1 auto;min-width:0;display:flex;align-items:center;gap:.4rem;min-height:38px;margin:0;padding:0 .75rem;border:1px solid rgba(231,200,140,0.3);border-radius:999px;background:#141416;color:#ece7df;font:600 .76rem/1.2 "Inter",system-ui,sans-serif;text-align:left;cursor:pointer;touch-action:manipulation;}
	.cfpe-guitar-strip__btn[hidden]{display:none;}
	.cfpe-guitar-strip__btn[aria-expanded="true"]{border-color:rgba(231,200,140,0.6);background:rgba(231,200,140,0.12);}
	.cfpe-guitar-strip__icon{flex:0 0 auto;font-size:.95rem;line-height:1;}
	.cfpe-guitar-strip__title{flex:0 0 auto;font-weight:700;color:#f7e088;white-space:nowrap;}
	.cfpe-guitar-strip__summary{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:rgba(236,231,223,0.72);}
	.cfpe-guitar-strip__summary:not(:empty)::before{content:"\00b7";margin-right:.35rem;color:rgba(236,231,223,0.45);}
	.cfpe-guitar-strip__chev{flex:0 0 auto;font-size:1.15rem;line-height:1;color:#e7c88c;}
	.cfpe-guitar-strip__3d{-webkit-appearance:none;appearance:none;flex:0 0 auto;min-width:54px;min-height:38px;margin:0;padding:0 .85rem;border:1px solid rgba(231,200,140,0.5);border-radius:999px;background:rgba(231,200,140,0.12);color:#f7e088;font:800 .8rem/1 "Inter",system-ui,sans-serif;letter-spacing:.04em;cursor:pointer;touch-action:manipulation;}
	.cfpe-guitar-strip__3d.is-active{background:#e7c88c;border-color:#e7c88c;color:#17130a;}
	html.cfpe-typing .cfpe-guitar-strip{display:none !important;}
	html.cfpe-3d-active .cfpe-guitar-strip__btn{opacity:.35;pointer-events:none;}

	/* "Your guitar" bottom sheet: the dropdown panel, opened from the strip. */
	#cfpe-guitar-fold>.cfpe-fold__panel{max-height:min(54vh,420px) !important;padding:.35rem .8rem .9rem;}
	html:has(#cfpe-guitar-fold[open]) .cfpe-sheet-scrim.is-on{background:rgba(0,0,0,0.14);}
	.cfpe-guitar-look__head{justify-content:center;flex-direction:column;align-items:center;gap:.1rem;}
	.cfpe-guitar-look__note{text-align:center;}
	.cfpe-guitar-look__swatches{flex-wrap:nowrap;gap:.45rem;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:0 2px 2px;}
	.cfpe-guitar-look__swatches::-webkit-scrollbar{display:none;}
	.cfpe-guitar-swatch{flex:0 0 54px;width:54px;min-height:54px;}
	.cfpe-guitar-swatch__chip{width:38px;height:38px;}
	.cfpe-guitar-look__show{min-height:44px;}
	.cfpe-guitar-look__show input{width:22px;height:22px;}
}