/* Scoped to the Potter editor; the normal storefront stays unchanged. */
.create-view .config-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0}
.create-view .config-tabs button{padding:15px 4px;font-size:13px;white-space:nowrap}
.create-view .config-controls{min-width:0;align-self:start}
.create-view [role=tabpanel]{max-height:520px;overflow-y:auto;scrollbar-width:thin;padding:3px}
.create-view .shape-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:12px 0 22px}
.create-view .shape-choices button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:100px;border:1px solid var(--line);border-radius:14px;background:#ffffff05;padding:9px 7px;font:10px/1.35 AnyaInter,sans-serif}
.create-view .shape-choices button[aria-pressed=true]{background:#ffffff0d;border:2px solid var(--faculty-edge,#b68190);padding:8px 6px}
.create-view .shape-choices svg,.create-view .shape-choices img{display:block;width:48px;height:48px;object-fit:contain;fill:var(--faculty-edge,#bc91a0)}
.create-view .cap-choices{grid-template-columns:repeat(4,minmax(0,1fr))}
.create-view .cap-choices img{filter:brightness(0) invert(.85)}
.create-view .cap-choices img.character-cap-preview{filter:none;width:55px;height:55px;object-fit:contain}
.create-view .plain-lever{display:block;width:18px;height:35px;margin-block:7px 6px;background:#d8d1c5;border-radius:5px;box-shadow:4px 3px 0 #84786a}
.create-view .section-choices button{min-height:42px}
.create-view .section-choices button:disabled{opacity:.25;cursor:default}
.create-view .editor-note{font-size:11px;line-height:1.65;color:var(--muted);margin:-9px 0 22px}
.create-view #shape-note{margin-top:0}
.create-view .control-label{font-size:12px}
.create-view #caps-panel .swatch{min-height:32px}
.create-view #viewer canvas{touch-action:none}
.create-view .section-heading h1{margin-top:0}
.create-view .selected-cap-label{font-size:12px;line-height:1.5;color:var(--text);background:#302a27;border:1px solid var(--line);border-radius:10px;padding:11px 13px;margin:0 0 20px}
.create-view .design-summary{flex-wrap:wrap;gap:16px}
.create-view .design-info{flex:1;min-width:0}
.create-view .design-actions{display:flex;gap:10px;align-items:center}
.create-view .design-actions .button{white-space:nowrap}
.create-view .save-status{flex-basis:100%;margin:0;min-height:0;overflow-wrap:anywhere}
.create-view .save-status:empty{display:none}
.create-view #design-link-fallback{flex-basis:100%;width:100%;font-size:10px}
.create-view #design-link-fallback label{display:block;margin-bottom:6px}
.create-view #design-link{width:100%;padding:9px 10px;min-height:38px;border:1px solid var(--line);border-radius:8px;color:var(--text);background:#302a27;font-size:16px}
@media(max-width:760px){
 .create-view{--editor-preview-height:clamp(176px,28svh,230px);padding-bottom:calc(144px + env(safe-area-inset-bottom,0px))}
 .create-view .section-heading{margin:16px 0 20px}
 .create-view .section-heading h1{font-size:34px;line-height:1.08}
 .create-view .configurator{gap:10px;isolation:isolate}
 .create-view .config-preview{min-height:var(--editor-preview-height);height:var(--editor-preview-height);position:sticky;top:0;z-index:5;flex:none;border-radius:16px;box-shadow:0 8px 0 var(--bg)}
 .create-view #viewer{height:var(--editor-preview-height)}
 .create-view .preview-header{top:10px;left:13px;right:13px;font-size:9px}
 .create-view .preview-tools{bottom:9px;left:13px;right:13px;gap:8px}
 .create-view .preview-tools button{padding:7px 10px;font-size:9px}
 .create-view #preview-hint{max-width:52%;line-height:1.4}
 .create-view #preview-mode{padding:4px 7px}
 .create-view .config-controls{width:100%;padding:0 13px 18px;overflow:visible}
 .create-view .config-tabs{position:sticky;top:calc(var(--editor-preview-height) + 8px);z-index:4;background:#242120;margin-bottom:18px}
 .create-view .config-tabs button{font-size:12px;min-height:47px}
 .create-view .selected-cap-label{position:sticky;top:calc(var(--editor-preview-height) + 56px);z-index:3;margin-top:-8px;margin-bottom:18px;box-shadow:0 6px 0 #242120}
 .create-view .shape-choices{grid-template-columns:repeat(3,minmax(0,1fr))}
 .create-view .cap-choices{grid-template-columns:repeat(4,minmax(0,1fr))}
 .create-view .shape-choices button{font-size:9px;min-height:90px}
 .create-view [role=tabpanel],.create-view #colors-panel,.create-view #design-choices{max-height:none;overflow:visible}
 .create-view [role=tabpanel] button{scroll-margin-top:calc(var(--editor-preview-height) + 66px);scroll-margin-bottom:140px}
 .create-view #caps-panel button{scroll-margin-top:calc(var(--editor-preview-height) + 110px)}
 .create-view .section-choices{gap:6px}
 .create-view .section-choices button{padding:10px 11px;font-size:11px}
 .create-view .design-summary{position:fixed;inset:auto 0 0;z-index:10;margin:0;padding:11px 20px calc(11px + env(safe-area-inset-bottom,0px));display:grid;grid-template-columns:minmax(0,1fr);gap:9px;background:#211e1dfa;border-top:1px solid #ffffff30;box-shadow:0 -6px 20px #0003}
 .create-view .design-info{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px}
 .create-view .design-info h2{font:12px/1.5 AnyaInter,sans-serif;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .create-view #design-details{display:none}
 .create-view #design-price{margin:0!important;font-size:18px!important;line-height:1.3}
 .create-view .design-actions{display:grid;grid-template-columns:1.4fr 1fr;gap:8px}
 .create-view .design-actions:has(#share-design[hidden]){grid-template-columns:1fr}
 .create-view .design-actions .button{padding:10px 8px;font-size:11px;min-height:42px;width:100%}
 .create-view .save-status{text-align:left;font-size:10px;line-height:1.4}
 .create-view .prototype-note{margin:16px 0 0;line-height:1.6}
 .create-view:has(#design-link-fallback:not([hidden])){padding-bottom:calc(220px + env(safe-area-inset-bottom,0px))}
}
@media(max-width:360px){.create-view .section-heading h1{font-size:30px}.create-view .config-tabs button{font-size:11px}.create-view .design-summary{padding-inline:14px}}
@media(max-width:760px) and (max-height:560px){
 .create-view{--editor-preview-height:176px}
 .create-view .config-preview{position:relative;top:auto;z-index:auto;box-shadow:none}
 .create-view .config-tabs{top:0}
 .create-view .selected-cap-label{top:48px}
 .create-view [role=tabpanel] button{scroll-margin-top:58px}
 .create-view #caps-panel button{scroll-margin-top:104px}
}