:root{--scb-orange:#ff5a00;--scb-orange-soft:#fff2e9;--scb-ink:#111;--scb-muted:#737983;--scb-line:#e5e8ec}
.scb-body{margin:0!important;background:#fff!important;color:var(--scb-ink)!important;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important}
.scb-body *{box-sizing:border-box}.scb-body a{text-decoration:none}
.scb-site{min-height:100vh;background:#fff}.scb-header{height:84px;border-bottom:1px solid #eee;background:#fff}
.scb-header-inner{height:100%;max-width:1500px;margin:0 auto;padding:0 34px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.scb-brand{display:flex;align-items:center;gap:12px;color:#111!important}.scb-header-icon{width:48px;height:38px;display:grid;place-items:center;flex:0 0 auto}.scb-header-icon.scb-icon-image{object-fit:contain}.scb-header-icon svg{width:48px;height:38px;display:block}.scb-brand span{display:flex;flex-direction:column;line-height:.95}.scb-brand strong{font-size:22px}.scb-brand small{font-size:13px;font-weight:800;margin-top:5px}
.scb-nav{display:flex;align-items:center;gap:34px}.scb-nav a{color:#111!important;font-size:15px;font-weight:700}.scb-nav a:hover{color:var(--scb-orange)!important}
.scb-main{max-width:1500px;margin:0 auto;padding:22px 34px 36px}.scb-footer{border-top:1px solid #eee}.scb-footer-inner{max-width:1500px;margin:0 auto;padding:26px 34px;display:flex;justify-content:space-between;gap:20px;color:#6f7680;font-size:13px}.scb-footer-inner div{display:flex;gap:18px}.scb-footer a{color:#505761!important}
.scb-title-block{text-align:center;padding:38px 0 26px}.scb-title-block h1{font-size:clamp(40px,5vw,64px);line-height:1;letter-spacing:-.045em;margin:0 0 12px!important}.scb-title-block p{font-size:17px;color:#747b86;margin:0!important}.scb-title-left{text-align:left;padding:10px 0 24px}.scb-title-left h1{font-size:52px}
.scb-breadcrumb{display:flex;gap:10px;align-items:center;color:#717884;font-size:15px;margin-top:14px}.scb-breadcrumb a{color:#717884!important}.scb-breadcrumb strong{color:#111}
.scb-ad{margin:16px 0 22px}.scb-ad-live{display:block;text-align:center;overflow:hidden}.scb-ad-live>*{max-width:100%}
.scb-category-grid,.scb-sneaker-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:18px 0 30px}
.scb-category-card,.scb-sneaker-card{border:1px solid var(--scb-line);border-radius:14px;background:#fff;padding:18px;text-align:center;color:#111!important;transition:.16s transform,.16s box-shadow}.scb-category-card:hover,.scb-sneaker-card:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(20,22,28,.08)}
.scb-category-art,.scb-sneaker-art{height:240px;display:flex;align-items:center;justify-content:center;overflow:hidden}.scb-category-art img,.scb-sneaker-art img{width:100%;height:100%;object-fit:contain}.scb-category-card h3{font-size:20px;margin:10px 0 14px!important}.scb-button-icon{width:20px;height:20px;display:inline-grid;place-items:center;vertical-align:middle;margin-right:7px}.scb-button-icon.scb-icon-image{object-fit:contain}.scb-zoom-icon{width:20px;height:20px;display:grid;place-items:center}.scb-zoom-icon.scb-icon-image{object-fit:contain}.scb-tool-icon{width:26px;height:26px;display:grid;place-items:center;font-size:23px}.scb-tool-icon.scb-icon-image{object-fit:contain}.scb-add-color-icon{width:20px;height:20px;display:grid;place-items:center}.scb-add-color-icon.scb-icon-image{object-fit:contain}
.scb-empty-art{width:100%;height:100%;display:grid;place-items:center;background:#fafafa;border:1px dashed #d9dde2;border-radius:10px;color:#a0a6af;font-weight:800}
.scb-empty-state{border:1px dashed #d4d9df;border-radius:12px;padding:34px;text-align:center;color:#6f7680;margin:20px 0}.scb-empty-state strong{display:block;color:#111;font-size:18px;margin-bottom:10px}.scb-empty-state a{display:inline-block;margin-top:10px;color:var(--scb-orange)!important;font-weight:800}
.scb-editor-toolbar{height:56px;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center}.scb-text-button,.scb-download,.scb-zoom-button,.scb-tool,.scb-brush-sizes button,.scb-color-swatch,.scb-add-color{font:inherit;cursor:pointer}.scb-text-button{border:0;background:transparent;color:#111;font-weight:700;font-size:15px}#scbBack{justify-self:start}.scb-history-actions{justify-self:center;display:flex;gap:24px}.scb-history-actions button:disabled{color:#c7ccd4}.scb-download{justify-self:end;border:0;background:var(--scb-orange);color:#fff;font-weight:800;padding:12px 22px;border-radius:8px;font-size:15px}
.scb-editor-grid{display:grid;grid-template-columns:minmax(0,1fr) 410px;gap:16px;align-items:stretch}.scb-editor-left{display:grid;grid-template-columns:75px minmax(0,1fr);gap:16px;min-width:0;align-items:stretch}
.scb-zoom-control{border:0;border-radius:0;min-height:565px;height:100%;align-self:stretch;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:14px 8px;background:#fff}.scb-zoom-button{width:38px;height:38px;border:1px solid var(--scb-line);border-radius:50%;background:#fff;font-size:24px;flex:0 0 auto}.scb-zoom-control strong{font-size:14px;margin:11px 0;flex:0 0 auto}.scb-zoom-rail{height:260px;width:42px;position:relative;flex:0 0 260px}.scb-zoom-rail input{position:absolute;left:50%;top:50%;width:245px;margin:0;transform:translate(-50%,-50%) rotate(-90deg);transform-origin:center;accent-color:var(--scb-orange)}
.scb-canvas-shell{border:1px solid var(--scb-line);border-radius:8px;min-height:565px;display:grid;place-items:center;overflow:hidden;background:#fff}.scb-stage{width:94%;height:92%;min-height:500px;position:relative;display:grid;place-items:center;overflow:hidden}.scb-stage-inner{position:absolute;left:50%;top:50%;transform-origin:center center;transition:transform .1s ease}.scb-stage canvas{position:absolute;inset:0;width:100%;height:100%}.scb-stage #scbPaintCanvas{z-index:2;touch-action:none}.scb-stage #scbLineCanvas{z-index:3;pointer-events:none}.scb-loading{color:#8b929c;font-weight:700}
.scb-editor-sidebar{border:1px solid var(--scb-line);border-radius:10px;overflow:hidden;background:#fff}.scb-control-section{padding:18px;border-bottom:1px solid var(--scb-line)}.scb-control-section:last-child{border-bottom:0}.scb-control-section h3{font-size:16px;margin:0 0 14px!important}
.scb-recent-colors{display:flex;gap:13px;align-items:center;flex-wrap:wrap;justify-content:flex-start}.scb-color-swatch.is-entering{animation:scbRecentColorIn .26s cubic-bezier(.2,.8,.2,1)}@keyframes scbRecentColorIn{from{opacity:0;transform:translateX(-10px) scale(.78)}to{opacity:1;transform:translateX(0) scale(1)}}.scb-color-swatch{width:36px;height:36px;border-radius:50%;border:0;position:relative}.scb-color-swatch.is-selected:after{content:"";position:absolute;inset:-4px;border:2px solid var(--scb-orange);border-radius:50%}.scb-add-color{width:36px;height:36px;border:1px solid var(--scb-line);border-radius:50%;background:#fff;font-size:22px}
.scb-color-picker{display:grid;grid-template-columns:minmax(0,1fr) 28px;gap:16px;margin-top:18px}.scb-color-field{height:145px;border-radius:8px;display:block;background:linear-gradient(to top,rgba(0,0,0,.85),transparent),linear-gradient(to right,#fff,#ff5a00);position:relative;overflow:hidden}.scb-hue-range{appearance:none;-webkit-appearance:none;width:145px;height:20px;transform:rotate(90deg);transform-origin:center;margin:62px 0 0 -58px;background:linear-gradient(90deg,#f00,#ff0,#0f0,#0ff,#00f,#f0f,#f00);border-radius:99px}.scb-hex-input{margin-top:10px;width:190px;border:1px solid var(--scb-line);border-radius:7px;padding:9px 12px;font-weight:700}
.scb-tools{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.scb-tool{border:1px solid var(--scb-line);background:#fff;border-radius:8px;padding:12px 6px;display:flex;flex-direction:column;align-items:center;gap:5px;font-size:12px;font-weight:700}.scb-tool span{font-size:23px}.scb-tool.is-active{color:var(--scb-orange);border-color:#ffb68f;background:#fff9f5}
.scb-brush-sizes{display:grid;grid-template-columns:repeat(5,1fr);align-items:center}.scb-brush-sizes button{border:0;background:none;height:38px;display:grid;place-items:center}.scb-brush-sizes i{display:block;background:#111;border-radius:50%}.scb-brush-sizes button.is-active i{outline:3px solid var(--scb-orange);outline-offset:4px}.scb-opacity-title{margin-top:12px!important}.scb-opacity-row{display:grid;grid-template-columns:1fr 58px;gap:14px;align-items:center}.scb-opacity-row input{width:100%;accent-color:var(--scb-orange)}
.scb-editor-strip{display:grid;grid-template-columns:repeat(8,1fr);gap:14px;margin-top:14px}.scb-strip-item{height:122px;border:1px solid var(--scb-line);border-radius:8px;background:#fff;padding:8px;display:grid;place-items:center}.scb-strip-item.is-active{border:1.5px solid var(--scb-orange)}.scb-strip-item img{width:100%;height:100%;object-fit:contain}
.scb-info-page{padding:50px 0 70px}.scb-info-card{max-width:850px;margin:0 auto;border:1px solid var(--scb-line);border-radius:20px;padding:38px}.scb-info-card h1{font-size:50px;letter-spacing:-.04em;margin:0 0 18px!important}.scb-info-card h2{font-size:23px;margin:30px 0 8px!important}.scb-info-card p{font-size:16px;line-height:1.75;color:#555d67}.scb-policy-note,.scb-form-message{padding:14px 16px;border-radius:10px;background:#fff4ec;border:1px solid #ffd6bf;color:#78411d;margin-top:20px}.scb-form-message.is-success{background:#effbf4;border-color:#bde8cc;color:#25653c}
.scb-contact-form{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:24px}.scb-contact-form label{display:flex;flex-direction:column;gap:7px;font-weight:700;font-size:13px}.scb-contact-form .scb-full{grid-column:1/-1}.scb-contact-form input,.scb-contact-form textarea{width:100%;border:1px solid var(--scb-line);border-radius:10px;padding:12px 13px;font:inherit}.scb-contact-form textarea{min-height:150px}.scb-submit{border:0;background:var(--scb-orange);color:#fff!important;padding:13px 19px;border-radius:9px;font-weight:800;cursor:pointer}
@media(max-width:1100px){.scb-nav{gap:18px}.scb-editor-grid{grid-template-columns:1fr}.scb-category-grid,.scb-sneaker-grid{grid-template-columns:repeat(2,1fr)}.scb-editor-strip{grid-template-columns:repeat(4,1fr)}}
@media(max-width:760px){.scb-header{height:auto}.scb-header-inner{padding:15px 18px}.scb-nav{display:none}.scb-main{padding:14px}.scb-footer-inner{padding:22px 18px;flex-direction:column}.scb-title-left h1{font-size:40px}.scb-category-grid,.scb-sneaker-grid{grid-template-columns:1fr}.scb-editor-toolbar{height:auto;grid-template-columns:1fr auto;gap:8px;margin-bottom:10px}.scb-history-actions{grid-column:1/3;grid-row:2}.scb-download{grid-column:2;grid-row:1}.scb-editor-left{grid-template-columns:1fr}.scb-zoom-control{min-height:auto;flex-direction:row;gap:12px;padding:10px}.scb-zoom-rail{height:auto;width:180px}.scb-zoom-rail input{position:static;left:auto;top:auto;width:180px;transform:none;margin:0}.scb-canvas-shell{min-height:440px}.scb-stage{min-height:400px}.scb-color-picker{grid-template-columns:1fr}.scb-hue-range{width:100%;transform:none;margin:0}.scb-editor-strip{grid-template-columns:repeat(2,1fr)}.scb-info-card{padding:25px 20px}.scb-contact-form{grid-template-columns:1fr}}

.scb-ad:empty{display:none!important}

/* Responsive refinements – v2.3.0 */
.scb-body{overflow-x:hidden!important}
.scb-body img{max-width:100%;height:auto}
.scb-ad-live iframe,.scb-ad-live ins,.scb-ad-live img{max-width:100%!important}

@media(max-width:1200px){
	.scb-header-inner,.scb-main,.scb-footer-inner{max-width:100%}
	.scb-editor-grid{grid-template-columns:minmax(0,1fr) 360px}
	.scb-tools{gap:8px}
	.scb-editor-strip{grid-template-columns:repeat(6,1fr)}
}

@media(max-width:980px){
	.scb-header-inner{padding:0 22px}
	.scb-nav{gap:22px}
	.scb-main{padding:20px 22px 32px}
	.scb-editor-grid{grid-template-columns:1fr}
	.scb-editor-sidebar{width:100%}
	.scb-editor-left{grid-template-columns:66px minmax(0,1fr)}
	.scb-category-grid,.scb-sneaker-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
	.scb-editor-strip{grid-template-columns:repeat(4,minmax(0,1fr))}
}

@media(max-width:760px){
	.scb-header{height:auto}
	.scb-header-inner{padding:14px 16px 10px;display:flex;flex-direction:column;align-items:stretch;gap:12px}
	.scb-brand{align-self:flex-start}
	.scb-brand svg,.scb-header-icon{width:40px;height:32px}
	.scb-brand strong{font-size:19px}
	.scb-brand small{font-size:11px;margin-top:4px}
	.scb-nav{display:flex!important;width:100%;gap:22px;overflow-x:auto;white-space:nowrap;padding:0 0 5px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
	.scb-nav::-webkit-scrollbar{display:none}
	.scb-nav a{font-size:13px;flex:0 0 auto;padding:2px 0 6px}

	.scb-main{padding:12px 14px 24px}
	.scb-footer-inner{padding:20px 16px;flex-direction:column;align-items:flex-start}
	.scb-footer-inner div{flex-wrap:wrap}

	.scb-title-block{padding:26px 0 20px}
	.scb-title-block h1{font-size:clamp(34px,10vw,46px)}
	.scb-title-block p{font-size:15px}
	.scb-title-left{padding:8px 0 18px}
	.scb-title-left h1{font-size:38px}
	.scb-breadcrumb{font-size:13px;overflow-x:auto;white-space:nowrap;padding-bottom:3px}

	.scb-ad{margin:12px 0 16px;width:100%;overflow:hidden}
	.scb-ad-live{width:100%;overflow:hidden}
	.scb-ad-live>*{max-width:100%!important}

	.scb-category-grid,.scb-sneaker-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:14px 0 22px}
	.scb-category-card,.scb-sneaker-card{padding:12px;border-radius:11px}
	.scb-category-art,.scb-sneaker-art{height:155px}
	.scb-category-card h3{font-size:16px;margin:8px 0 10px!important}
	

	.scb-editor-toolbar{height:auto;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;margin-bottom:12px}
	#scbBack{grid-column:1;grid-row:1;justify-self:start;min-height:42px}
	.scb-download{grid-column:2;grid-row:1;justify-self:end;padding:10px 13px;font-size:13px;min-height:42px}
	.scb-history-actions{grid-column:1/3;grid-row:2;justify-self:center;gap:30px;min-height:36px;align-items:center}
	.scb-text-button{font-size:13px}
	.scb-button-icon{width:18px;height:18px;margin-right:5px}

	.scb-editor-left{display:flex;flex-direction:column;gap:10px}
	.scb-canvas-shell{order:1;min-height:0;height:clamp(330px,78vw,500px);border-radius:10px}
	.scb-stage{min-height:0;width:98%;height:96%}
	.scb-zoom-control{order:2;min-height:0;height:auto;width:100%;display:grid;grid-template-columns:40px 50px minmax(0,1fr) 40px;align-items:center;gap:8px;padding:8px 4px;border:0}
	.scb-zoom-control strong{margin:0;text-align:center}
	.scb-zoom-rail{height:36px;width:100%;position:relative;display:flex;align-items:center}
	.scb-zoom-rail input{position:static!important;width:100%!important;transform:none!important;margin:0!important}
	.scb-zoom-button{width:36px;height:36px}

	.scb-editor-sidebar{margin-top:4px;border-radius:10px}
	.scb-control-section{padding:15px}
	.scb-control-section h3{font-size:15px;margin-bottom:12px!important}
	.scb-recent-colors{flex-wrap:nowrap;overflow-x:auto;padding:4px 4px 6px;gap:12px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
	.scb-recent-colors::-webkit-scrollbar{display:none}
	.scb-color-swatch,.scb-add-color{flex:0 0 34px;width:34px;height:34px}
	.scb-color-picker{grid-template-columns:1fr;gap:10px}
	.scb-color-field{height:120px}
	.scb-hue-range{width:100%;height:18px;transform:none;margin:0}
	.scb-hex-input{width:100%;max-width:220px}
	.scb-tools{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
	.scb-tool{min-width:0;padding:10px 3px;font-size:11px}
	.scb-tool-icon{width:23px;height:23px}
	.scb-brush-sizes{gap:5px}
	.scb-opacity-row{grid-template-columns:minmax(0,1fr) 52px}

	.scb-editor-strip{display:flex;grid-template-columns:none;gap:10px;overflow-x:auto;padding:2px 0 8px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
	.scb-editor-strip::-webkit-scrollbar{display:none}
	.scb-strip-item{flex:0 0 118px;height:94px}

	.scb-info-page{padding:28px 0 42px}
	.scb-info-card{padding:24px 18px;border-radius:14px}
	.scb-info-card h1{font-size:38px}
	.scb-info-card h2{font-size:21px}
	.scb-info-card p{font-size:15px}
	.scb-contact-form{grid-template-columns:1fr}
}

@media(max-width:480px){
	.scb-main{padding-left:10px;padding-right:10px}
	.scb-header-inner{padding-left:12px;padding-right:12px}
	.scb-category-grid,.scb-sneaker-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
	.scb-category-card,.scb-sneaker-card{padding:9px}
	.scb-category-art,.scb-sneaker-art{height:125px}
	.scb-category-card h3{font-size:14px}
	
	
	.scb-download span{display:none}
	.scb-download .scb-button-icon{margin:0;width:22px;height:22px}
	.scb-canvas-shell{height:clamp(310px,82vw,390px)}
	.scb-tools{grid-template-columns:repeat(2,minmax(0,1fr))}
	.scb-tool{min-height:72px}
	.scb-strip-item{flex-basis:104px;height:86px}
}

@media(max-width:360px){
	.scb-category-grid,.scb-sneaker-grid{grid-template-columns:1fr}
	.scb-category-art,.scb-sneaker-art{height:180px}
	.scb-editor-toolbar{grid-template-columns:1fr auto}
	.scb-history-actions{gap:16px}
	.scb-zoom-control{grid-template-columns:36px 46px minmax(0,1fr) 36px}
}


/* Interaction + alignment refinements – v2.4.0 */
.scb-site{touch-action:manipulation}
.scb-header-icon,
.scb-button-icon,
.scb-zoom-icon,
.scb-tool-icon,
.scb-add-color-icon{
	display:inline-flex!important;
	align-items:center!important;
	justify-content:center!important;
	line-height:0!important;
	flex:0 0 auto;
}
.scb-icon-image{
	display:block!important;
	width:100%!important;
	height:100%!important;
	object-fit:contain!important;
	object-position:center center!important;
	margin:0!important;
	padding:0!important;
}
.scb-icon-fallback{display:inline-flex;align-items:center;justify-content:center;line-height:1!important}
.scb-text-button,.scb-download{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:7px}
.scb-text-button .scb-button-icon,.scb-download .scb-button-icon{margin:0!important}
#scbBack{justify-content:flex-start!important}
.scb-zoom-button{
	display:inline-flex!important;
	align-items:center!important;
	justify-content:center!important;
	padding:0!important;
	line-height:1!important;
}
.scb-tool{
	justify-content:center!important;
	text-align:center;
}
.scb-tool .scb-tool-icon{margin:0 auto}

/* Painting shortcut icons were removed: cards no longer reserve space for them. */
.scb-category-card h3{margin:10px 0 2px!important}
.scb-sneaker-card{padding:12px}
.scb-sneaker-art{height:252px;width:100%;display:flex;align-items:center;justify-content:center}
.scb-sneaker-art img{display:block}

/* In-page color picker. No native browser/OS color dialog. */
.scb-color-field{
	cursor:crosshair;
	touch-action:none;
	user-select:none;
	-webkit-user-select:none;
	overflow:visible!important;
	background:
		linear-gradient(to top,#000,rgba(0,0,0,0)),
		linear-gradient(to right,#fff,hsl(21 100% 50%));
}
.scb-color-field:focus-visible{outline:2px solid var(--scb-orange);outline-offset:3px}
.scb-color-cursor{
	position:absolute;
	left:100%;
	top:0%;
	width:18px;
	height:18px;
	border:3px solid #fff;
	border-radius:50%;
	box-shadow:0 0 0 1.5px rgba(0,0,0,.65),0 2px 8px rgba(0,0,0,.2);
	transform:translate(-50%,-50%);
	pointer-events:none;
	transition:none!important;
}
.scb-color-field.is-active .scb-color-cursor{box-shadow:0 0 0 2px var(--scb-orange),0 3px 10px rgba(0,0,0,.24)}
.scb-color-field.is-focus-pulse{animation:scbPickerPulse .34s ease}
@keyframes scbPickerPulse{0%{box-shadow:0 0 0 0 rgba(255,90,0,.28)}100%{box-shadow:0 0 0 9px rgba(255,90,0,0)}}

/* The selected suggested sneaker gets a complete inside orange frame. */
.scb-editor-strip{padding:4px 2px 10px}
.scb-strip-item{
	box-sizing:border-box!important;
	overflow:hidden;
	border:1px solid var(--scb-line)!important;
}
.scb-strip-item.is-active{
	border:2px solid var(--scb-orange)!important;
	box-shadow:inset 0 0 0 1px var(--scb-orange);
}
.scb-strip-item.is-active img{transform:scale(.985)}

/* Custom canvas gestures: one finger paints, two fingers pan/pinch. */
.scb-stage,
.scb-stage-inner,
.scb-stage canvas{
	touch-action:none!important;
	-webkit-user-select:none!important;
	user-select:none!important;
	-webkit-touch-callout:none!important;
}
.scb-stage{overscroll-behavior:contain}
.scb-stage-inner{will-change:transform;transition:transform .08s ease-out}
.scb-stage.is-gesturing .scb-stage-inner{transition:none}

@media(max-width:760px){
	.scb-sneaker-card{padding:8px}
	.scb-sneaker-art{height:165px}
	.scb-category-card h3{margin-bottom:2px!important}
	.scb-strip-item{margin-bottom:1px}
}
@media(max-width:480px){
	.scb-sneaker-art{height:132px}
}


/* v2.5 — mobile performance UX + polished editor */
.scb-editor-grid{
	gap:20px;
}
.scb-canvas-shell{
	background:
		radial-gradient(circle at 50% 40%, #fff 0, #fff 58%, #fafbfc 100%);
	box-shadow:0 10px 34px rgba(17,24,39,.045);
}
.scb-editor-sidebar{
	box-shadow:0 10px 34px rgba(17,24,39,.045);
}
.scb-control-section{
	padding:20px;
}
.scb-control-section h3{
	letter-spacing:-.01em;
}
.scb-tools{
	gap:11px;
}
.scb-tool{
	min-height:72px;
	transition:transform .14s ease, box-shadow .14s ease, border-color .14s ease, background .14s ease;
}
.scb-tool:hover{
	transform:translateY(-1px);
	box-shadow:0 6px 14px rgba(17,24,39,.06);
}
.scb-tool.is-active{
	box-shadow:inset 0 0 0 1px rgba(255,90,0,.15);
}
.scb-color-picker{
	padding:12px;
	border:1px solid #eceff2;
	border-radius:12px;
	background:#fafbfc;
}
.scb-color-field{
	height:168px;
	border:1px solid rgba(17,24,39,.08);
	box-shadow:inset 0 0 0 1px rgba(255,255,255,.2),0 4px 18px rgba(17,24,39,.05);
}
.scb-color-cursor{
	width:28px!important;
	height:28px!important;
	border-width:4px!important;
	box-shadow:0 0 0 2px rgba(0,0,0,.72),0 4px 13px rgba(0,0,0,.25)!important;
}
.scb-color-field.is-active .scb-color-cursor{
	width:31px!important;
	height:31px!important;
	box-shadow:0 0 0 3px var(--scb-orange),0 5px 14px rgba(0,0,0,.28)!important;
}
.scb-hue-range{
	height:24px;
	cursor:ns-resize;
}
.scb-recent-colors{
	min-height:46px;
	gap:10px;
	padding:2px;
}
.scb-live-color,
.scb-color-swatch,
.scb-add-color{
	width:38px;
	height:38px;
	flex:0 0 38px;
}
.scb-live-color{
	border-radius:50%;
	border:3px solid #fff;
	background:#ff5a00;
	box-shadow:0 0 0 2px #20242a,0 4px 10px rgba(17,24,39,.14);
	cursor:pointer;
	transition:background-color .08s linear, transform .12s ease;
}
.scb-live-color:hover{
	transform:scale(1.07);
}
.scb-live-color::after{
	content:"";
	position:absolute;
}
.scb-color-swatch{
	transition:transform .18s cubic-bezier(.2,.8,.2,1), opacity .18s ease, box-shadow .18s ease;
}
.scb-color-swatch.is-entering{
	animation:scbRecentIn .2s cubic-bezier(.2,.8,.2,1);
}
@keyframes scbRecentIn{
	from{transform:translateX(-8px) scale(.8);opacity:.2}
	to{transform:translateX(0) scale(1);opacity:1}
}
.scb-zoom-control{
	box-shadow:0 10px 28px rgba(17,24,39,.04);
}
.scb-download{
	box-shadow:0 6px 16px rgba(255,90,0,.22);
	transition:transform .14s ease, box-shadow .14s ease;
}
.scb-download:hover{
	transform:translateY(-1px);
	box-shadow:0 9px 20px rgba(255,90,0,.25);
}

/* Mobile: prioritize canvas, reduce expensive visual clutter */
@media(max-width:760px){
	.scb-editor-grid{gap:12px}
	.scb-editor-left{gap:10px}
	.scb-canvas-shell{
		min-height:390px;
		box-shadow:none;
	}
	.scb-stage{min-height:360px}
	.scb-editor-sidebar{box-shadow:none}
	.scb-control-section{padding:16px}
	.scb-color-field{height:156px}
	.scb-color-picker{padding:10px}
	.scb-tool{min-height:66px}
}


/* v2.6 — square artwork + desktop scroll + picker/opacity fixes */

/* Square images are the primary artwork format throughout the app. */
.scb-category-art,
.scb-sneaker-art{
	width:100%!important;
	height:auto!important;
	aspect-ratio:1 / 1;
}
.scb-category-art img,
.scb-sneaker-art img{
	width:100%!important;
	height:100%!important;
	object-fit:contain!important;
	object-position:center!important;
}
.scb-sneaker-card,
.scb-category-card{
	padding:12px!important;
}
.scb-category-card h3{
	margin:9px 0 4px!important;
}

/* Square canvas gives square uploaded PNGs the largest predictable workspace. */
.scb-canvas-shell{
	aspect-ratio:1 / 1;
	min-height:0!important;
	width:100%;
}
.scb-stage{
	width:96%;
	height:96%;
	min-height:0!important;
}

/* The picker hue is now driven by JS; don't freeze it with !important. */
.scb-color-field{
	background:
		linear-gradient(to top,#000,rgba(0,0,0,0)),
		linear-gradient(to right,#fff,hsl(21 100% 50%));
}

/*
 * Desktop trackpads/mice should scroll the page normally when the pointer is
 * over the canvas. Custom touch blocking is only enabled on coarse touch input.
 */
@media (pointer:fine){
	.scb-stage,
	.scb-stage-inner,
	.scb-stage canvas{
		touch-action:auto!important;
		overscroll-behavior:auto!important;
	}
	.scb-stage{
		overscroll-behavior:auto!important;
	}
}

/* Mobile/tablet keeps dedicated one-finger paint + two-finger pan/pinch. */
@media (pointer:coarse){
	.scb-stage,
	.scb-stage-inner,
	.scb-stage canvas{
		touch-action:none!important;
	}
	.scb-stage{
		overscroll-behavior:contain;
	}
}

@media(max-width:760px){
	.scb-canvas-shell{
		aspect-ratio:1 / 1;
		min-height:0!important;
	}
	.scb-stage{
		min-height:0!important;
	}
	.scb-sneaker-art{
		aspect-ratio:1 / 1;
		height:auto!important;
	}
}


/* v2.7 — exact color matching + click-only picker + square cards */

/* Hue slider uses the same increasing HSL hue order as the JS picker:
   red → yellow → green → cyan → blue → magenta → red. */
.scb-hue-range{
	background:linear-gradient(90deg,#f00,#ff0,#0f0,#0ff,#00f,#f0f,#f00)!important;
}

/* The picker circle moves only after an actual click/tap/keyboard choice. */
.scb-color-field{cursor:crosshair}
.scb-color-cursor{
	transition:left .12s ease,top .12s ease,background-color .08s linear,transform .12s ease!important;
}

/* Every visible catalog card is a true square. */
.scb-category-card,
.scb-sneaker-card,
.scb-strip-item{
	aspect-ratio:1 / 1!important;
	height:auto!important;
	min-height:0!important;
}

/* Home/category cards: keep their content inside the square without
   reserving any brush-icon area. */
.scb-category-card{
	display:flex!important;
	flex-direction:column;
	overflow:hidden;
}
.scb-category-art{
	flex:1 1 auto;
	min-height:0;
	width:100%!important;
	height:auto!important;
	aspect-ratio:auto!important;
}
.scb-category-card h3{
	flex:0 0 auto;
	margin:8px 0 2px!important;
}

/* Sneaker cards have only the square image — no painting shortcut icon. */
.scb-sneaker-card{
	display:block!important;
	padding:10px!important;
	overflow:hidden;
}
.scb-sneaker-art{
	display:flex!important;
	width:100%!important;
	height:100%!important;
	aspect-ratio:auto!important;
	align-items:center!important;
	justify-content:center!important;
}
.scb-sneaker-art img,
.scb-category-art img{
	display:block!important;
	max-width:100%!important;
	max-height:100%!important;
	object-fit:contain!important;
}

/* Suggested sneakers are square on desktop and mobile. */
.scb-editor-strip{
	align-items:start;
}
.scb-strip-item{
	width:100%!important;
	padding:7px!important;
	overflow:hidden!important;
}
.scb-strip-item img{
	display:block!important;
	width:100%!important;
	height:100%!important;
	object-fit:contain!important;
}

/* Override earlier mobile fixed-height/flex-basis thumbnail rules. */
@media(max-width:760px){
	.scb-editor-strip{
		display:flex!important;
		overflow-x:auto;
		gap:10px;
		padding-bottom:10px;
		scroll-snap-type:x proximity;
	}
	.scb-strip-item{
		flex:0 0 104px!important;
		width:104px!important;
		height:auto!important;
		aspect-ratio:1 / 1!important;
		scroll-snap-align:start;
	}
	.scb-category-card,
	.scb-sneaker-card{
		aspect-ratio:1 / 1!important;
	}
}

@media(min-width:761px){
	.scb-strip-item{
		aspect-ratio:1 / 1!important;
		height:auto!important;
	}
}


/* v3.0.0 — clean canvas-based color picker */
.scb-color-picker{
	padding:12px;
	border:1px solid #eceff2;
	border-radius:12px;
	background:#fafbfc;
}
.scb-color-field{
	position:relative!important;
	overflow:hidden!important;
	background:none!important;
	border:1px solid rgba(17,24,39,.08)!important;
	border-radius:10px!important;
}
.scb-color-grid-canvas{
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	display:block;
	border-radius:inherit;
}
.scb-color-cursor{
	z-index:2;
}
.scb-hue-range{
	background:linear-gradient(90deg,#f00,#ff0,#0f0,#0ff,#00f,#f0f,#f00)!important;
}
.scb-category-card,
.scb-sneaker-card,
.scb-strip-item{
	aspect-ratio:1 / 1!important;
}
.scb-sneaker-card,
.scb-category-card,
.scb-strip-item{
	overflow:hidden!important;
}
.scb-strip-item img,
.scb-category-art img,
.scb-sneaker-art img{
	object-fit:contain!important;
}


/* v3.1.0 — picker UI cleanup and recent colors fix */
.scb-current-color-row{
	display:flex;
	align-items:center;
	gap:12px;
	margin-bottom:14px;
}
.scb-current-color-text{
	font-weight:800;
	font-size:14px;
	letter-spacing:.02em;
	color:#20242a;
}
.scb-recent-title{
	margin-top:2px!important;
	margin-bottom:10px!important;
}
.scb-recent-colors{
	align-items:center;
	justify-content:flex-start;
}
.scb-live-color{
	width:42px;
	height:42px;
	flex:0 0 42px;
	border-radius:50%;
	border:3px solid #fff;
	box-shadow:0 0 0 2px #20242a,0 4px 10px rgba(17,24,39,.12);
	background:#ff5a00;
	cursor:pointer;
}
.scb-color-field.is-active .scb-color-cursor{
	width:28px!important;
	height:28px!important;
	box-shadow:0 0 0 2px rgba(0,0,0,.72),0 4px 13px rgba(0,0,0,.25)!important;
}
.scb-hue-range{
	appearance:none;
	-webkit-appearance:none;
	border:0;
	outline:none;
	background:linear-gradient(90deg,#f00,#ff0,#0f0,#0ff,#00f,#f0f,#f00)!important;
	border-radius:999px;
	overflow:hidden;
}
.scb-hue-range::-webkit-slider-runnable-track{
	height:18px;
	background:transparent;
	border:none;
	border-radius:999px;
}
.scb-hue-range::-webkit-slider-thumb{
	-webkit-appearance:none;
	width:24px;
	height:24px;
	margin-top:-3px;
	border-radius:50%;
	background:#fff;
	border:3px solid #20242a;
	box-shadow:0 2px 8px rgba(0,0,0,.18);
	cursor:pointer;
}
.scb-hue-range::-moz-range-track{
	height:18px;
	background:transparent;
	border:none;
	border-radius:999px;
}
.scb-hue-range::-moz-range-thumb{
	width:24px;
	height:24px;
	border-radius:50%;
	background:#fff;
	border:3px solid #20242a;
	box-shadow:0 2px 8px rgba(0,0,0,.18);
	cursor:pointer;
}
.scb-hue-range::-moz-focus-outer{border:0}
@media(max-width:760px){
	.scb-current-color-row{margin-bottom:12px}
	.scb-live-color{width:38px;height:38px;flex-basis:38px}
}


/* v3.2.0 — draggable picker cursor */
.scb-color-cursor{
	pointer-events:auto!important;
	cursor:grab!important;
	touch-action:none!important;
	user-select:none!important;
	-webkit-user-select:none!important;
}
.scb-color-cursor.is-dragging{
	cursor:grabbing!important;
	transform:translate(-50%,-50%) scale(1.08)!important;
}


/* v3.2.1 — instant picker cursor */
.scb-color-cursor{
	transition:none!important;
	will-change:left, top, background-color;
}
.scb-color-cursor.is-dragging{
	transition:none!important;
	transform:translate(-50%,-50%)!important;
}


/* v3.2.2 — hue wheel length matches grid */
.scb-color-picker{
	grid-template-columns:minmax(0,1fr) 34px!important;
	align-items:stretch!important;
}
.scb-color-field{
	height:168px!important;
}
.scb-hue-range{
	width:168px!important;
	height:24px!important;
	transform:rotate(90deg)!important;
	transform-origin:center center!important;
	margin:72px 0 0 -72px!important;
	align-self:start!important;
}
.scb-hue-range::-webkit-slider-runnable-track{
	height:18px!important;
}
.scb-hue-range::-moz-range-track{
	height:18px!important;
}

@media(max-width:760px){
	.scb-color-picker{
		grid-template-columns:1fr!important;
	}
	.scb-hue-range{
		width:100%!important;
		height:24px!important;
		transform:none!important;
		margin:0!important;
	}
}


/* v3.4.0 — branded 404 page */
.scb-404-main{
	min-height:calc(100vh - 165px);
	display:flex;
	flex-direction:column;
}
.scb-404-section{
	flex:1;
	min-height:560px;
	display:grid;
	grid-template-columns:minmax(0,1.05fr) minmax(380px,.95fr);
	align-items:center;
	gap:clamp(32px,6vw,90px);
	max-width:1180px;
	width:100%;
	margin:0 auto;
	padding:50px 0 70px;
}
.scb-404-art{
	position:relative;
	aspect-ratio:1 / 1;
	min-width:0;
	display:flex;
	align-items:center;
	justify-content:center;
}
.scb-404-number{
	position:absolute;
	top:4%;
	left:50%;
	transform:translateX(-50%);
	font-size:clamp(150px,18vw,280px);
	line-height:.8;
	font-weight:950;
	letter-spacing:-.085em;
	color:#f5f5f5;
	user-select:none;
}
.scb-404-sneaker{
	position:relative;
	z-index:1;
	width:92%;
	height:auto;
	color:#111;
	transform:rotate(-4deg);
}
.scb-404-copy{
	max-width:520px;
	position:relative;
	z-index:2;
}
.scb-404-kicker{
	display:inline-flex;
	align-items:center;
	min-height:30px;
	padding:6px 11px;
	border-radius:999px;
	background:#fff2e9;
	color:var(--scb-orange);
	font-size:12px;
	font-weight:900;
	letter-spacing:.08em;
	margin-bottom:18px;
}
.scb-404-copy h1{
	margin:0 0 16px!important;
	font-size:clamp(46px,5vw,72px);
	line-height:.94;
	letter-spacing:-.055em;
	max-width:520px;
}
.scb-404-copy p{
	margin:0!important;
	max-width:500px;
	font-size:17px;
	line-height:1.7;
	color:#707782;
}
.scb-404-actions{
	display:flex;
	flex-wrap:wrap;
	gap:12px;
	margin-top:28px;
}
.scb-404-primary,
.scb-404-secondary{
	min-height:48px;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	padding:12px 20px;
	border-radius:9px;
	font-size:14px;
	font-weight:850;
	transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease;
}
.scb-404-primary{
	background:var(--scb-orange);
	color:#fff!important;
	box-shadow:0 7px 18px rgba(255,90,0,.2);
}
.scb-404-secondary{
	background:#fff;
	color:#111!important;
	border:1px solid var(--scb-line);
}
.scb-404-primary:hover,
.scb-404-secondary:hover{
	transform:translateY(-1px);
}
.scb-404-primary:hover{
	box-shadow:0 10px 22px rgba(255,90,0,.25);
}
.scb-404-secondary:hover{
	border-color:#c9ced5;
}

@media(max-width:900px){
	.scb-404-section{
		grid-template-columns:1fr;
		gap:18px;
		padding:30px 0 54px;
		text-align:center;
	}
	.scb-404-art{
		max-width:540px;
		width:100%;
		margin:0 auto;
		aspect-ratio:1.25 / 1;
	}
	.scb-404-number{
		font-size:clamp(150px,33vw,240px);
	}
	.scb-404-copy{
		max-width:620px;
		margin:0 auto;
	}
	.scb-404-copy p{
		margin:0 auto!important;
	}
	.scb-404-actions{
		justify-content:center;
	}
}

@media(max-width:560px){
	.scb-404-main{
		padding-left:14px!important;
		padding-right:14px!important;
	}
	.scb-404-section{
		min-height:500px;
		padding-top:20px;
	}
	.scb-404-art{
		aspect-ratio:1.3 / 1;
	}
	.scb-404-number{
		top:2%;
		font-size:38vw;
	}
	.scb-404-sneaker{
		width:100%;
	}
	.scb-404-copy h1{
		font-size:44px;
	}
	.scb-404-copy p{
		font-size:15px;
	}
	.scb-404-actions{
		display:grid;
		grid-template-columns:1fr;
		width:100%;
	}
	.scb-404-primary,
	.scb-404-secondary{
		width:100%;
	}
}


/* v3.4.1 — edge-visible picker cursor and clean refill */
.scb-color-picker{
	overflow:visible!important;
}
.scb-color-field{
	overflow:visible!important;
}
.scb-color-grid-canvas{
	border-radius:inherit;
}
.scb-color-cursor{
	z-index:3!important;
}


/* v3.4.2 — remove recent color add button and center picker cursor */
.scb-recent-colors{
	justify-content:flex-start!important;
	align-items:center!important;
}
.scb-color-cursor{
	box-sizing:border-box!important;
	width:34px!important;
	height:34px!important;
	margin:0!important;
	transform:translate(-50%,-50%)!important;
	transition:none!important;
}


/* v3.5.0 — optional shading layer */
.scb-stage-inner{
	position:absolute!important;
	left:50%!important;
	top:50%!important;
}
.scb-stage-inner canvas{
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
}
#scbPaintCanvas{
	z-index:1;
}
#scbShadingCanvas{
	z-index:2;
	pointer-events:none!important;
	mix-blend-mode:multiply;
}
#scbLineCanvas{
	z-index:3;
	pointer-events:none!important;
}


/* v3.5.2 — restore coloring-page image centering */
.scb-stage{
	position:relative!important;
	display:block!important;
}
.scb-stage-inner{
	position:absolute!important;
	left:50%!important;
	top:50%!important;
	margin:0!important;
	transform-origin:center center!important;
}


/* v3.5.3 — visual artwork auto-centering */
.scb-stage-inner{
	position:absolute!important;
	margin:0;
	will-change:transform;
}


/* v3.5.4 — fix visible-art anchor conflict */
.scb-stage-inner{
	position:absolute!important;
	margin:0!important;
	will-change:transform,left,top;
}


/* v3.5.5 — suggested sneaker shading thumbnails */
.scb-strip-thumb{
	position:relative;
	display:block;
	width:100%;
	height:100%;
}
.scb-strip-thumb img{
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	object-fit:contain;
}
.scb-strip-base{
	z-index:1;
}
.scb-strip-shading{
	z-index:2;
	pointer-events:none;
	mix-blend-mode:multiply;
}


/* v3.5.6 — shading overlays on home and category cards */
.scb-layered-thumb{
	position:relative;
	display:block;
	width:100%;
	height:100%;
}
.scb-layered-thumb img{
	position:absolute;
	inset:0;
	width:100%;
	height:100%;
	object-fit:contain!important;
}
.scb-layered-base{
	z-index:1;
}
.scb-layered-shading{
	z-index:2;
	pointer-events:none;
	mix-blend-mode:multiply;
}
.scb-category-art,
.scb-sneaker-art,
.scb-strip-item{
	position:relative;
}
.scb-category-art .scb-layered-thumb,
.scb-sneaker-art .scb-layered-thumb{
	width:100%;
	height:100%;
}


/* v3.5.7 — default bucket, animated fill and tool cursors */
.scb-stage{
	isolation:isolate;
}
55%{opacity:.18}
	100%{opacity:0;transform:scale(8)}
}
#scbPaintCanvas{
	cursor:cell;
}


/* v3.5.8 — fluid water fill animation */
#scbPaintCanvas{
	will-change:contents;
}


/* v3.5.9 — radial water fill and looser picker cursor */
.scb-color-picker,
.scb-color-field{
	overflow:visible!important;
}
.scb-color-cursor{
	z-index:3!important;
}


/* v3.6.0 — mobile editor layout redesign */
@media (max-width: 760px){

	.scb-editor-page{
		padding-bottom:16px;
	}

	.scb-editor-toolbar{
		position:sticky!important;
		top:0;
		z-index:25;
		display:grid!important;
		grid-template-columns:1fr auto 1fr!important;
		align-items:center!important;
		gap:10px!important;
		padding:6px 0 12px!important;
		margin:0 0 10px!important;
		background:rgba(248,248,248,.92);
		backdrop-filter:blur(10px);
	}

	.scb-editor-toolbar .scb-text-button span,
	.scb-editor-toolbar .scb-download span{
		display:none!important;
	}

	#scbBack,
	.scb-history-actions .scb-text-button,
	.scb-download{
		width:52px!important;
		height:52px!important;
		min-height:52px!important;
		padding:0!important;
		border-radius:50%!important;
		display:inline-flex!important;
		align-items:center!important;
		justify-content:center!important;
	}

	#scbBack{
		justify-self:start!important;
		background:transparent!important;
	}

	.scb-history-actions{
		grid-column:auto!important;
		grid-row:auto!important;
		justify-self:center!important;
		gap:16px!important;
	}

	.scb-history-actions .scb-text-button{
		background:transparent!important;
	}

	.scb-download{
		grid-column:auto!important;
		grid-row:auto!important;
		justify-self:end!important;
		background:#fff!important;
		color:#111!important;
		border:1px solid var(--scb-line)!important;
		box-shadow:0 8px 26px rgba(0,0,0,.08)!important;
	}

	.scb-download .scb-button-icon{
		width:24px!important;
		height:24px!important;
	}

	.scb-editor-grid{
		display:flex!important;
		flex-direction:column!important;
		gap:14px!important;
	}

	.scb-editor-left{
		display:flex!important;
		flex-direction:column!important;
		gap:10px!important;
		position:relative;
	}

	.scb-canvas-shell{
		order:1;
		border:0!important;
		background:transparent!important;
		box-shadow:none!important;
		min-height:56vh!important;
		padding:0!important;
	}

	.scb-stage{
		width:100%!important;
		height:58vh!important;
		min-height:430px!important;
		background:transparent!important;
		overflow:hidden!important;
	}

	.scb-stage-inner,
	.scb-stage canvas{
		max-width:100%;
		max-height:100%;
	}

	.scb-loading{
		font-size:14px;
	}

	/* Compact floating zoom control, similar to a mobile floating action area */
	.scb-zoom-control{
		order:2;
		align-self:flex-end!important;
		margin-top:-92px!important;
		margin-right:8px!important;
		position:relative!important;
		z-index:6!important;
		width:56px!important;
		min-height:auto!important;
		padding:8px 6px!important;
		border:0!important;
		border-radius:28px!important;
		background:rgba(255,255,255,.92)!important;
		box-shadow:0 10px 28px rgba(0,0,0,.10)!important;
		display:flex!important;
		flex-direction:column!important;
		align-items:center!important;
		gap:10px!important;
		backdrop-filter:blur(8px);
	}

	.scb-zoom-rail{
		width:26px!important;
		height:116px!important;
		display:flex!important;
		align-items:center!important;
		justify-content:center!important;
	}

	.scb-zoom-rail input{
		position:absolute!important;
		top:50%!important;
		left:50%!important;
		width:116px!important;
		transform:translate(-50%,-50%) rotate(-90deg)!important;
		margin:0!important;
	}

	.scb-zoom-button{
		width:38px!important;
		height:38px!important;
		border-radius:50%!important;
		background:#fff!important;
		border:1px solid var(--scb-line)!important;
		box-shadow:none!important;
	}

	.scb-editor-sidebar{
		border:0!important;
		border-radius:28px 28px 0 0!important;
		background:#f3f3f3!important;
		box-shadow:none!important;
		padding:14px 14px 18px!important;
		overflow:visible!important;
	}

	.scb-control-section{
		padding:8px 0!important;
		border:0!important;
	}

	.scb-control-section h3{
		display:none!important;
	}

	.scb-color-section{
		display:grid!important;
		grid-template-columns:1fr!important;
		gap:12px!important;
	}

	.scb-current-color-row{
		display:flex!important;
		align-items:center!important;
		justify-content:center!important;
		gap:14px!important;
		margin:0!important;
	}

	.scb-live-color{
		width:68px!important;
		height:68px!important;
		border-radius:50%!important;
		border:8px solid #fff!important;
		box-shadow:0 8px 24px rgba(0,0,0,.10)!important;
	}

	.scb-current-color-text{
		font-size:18px!important;
		font-weight:800!important;
		letter-spacing:.02em;
	}

	.scb-recent-title,
	.scb-hex-input{
		display:none!important;
	}

	.scb-recent-colors{
		display:flex!important;
		justify-content:center!important;
		flex-wrap:nowrap!important;
		overflow-x:auto!important;
		gap:10px!important;
		padding:2px 2px 6px!important;
		scrollbar-width:none;
	}

	.scb-recent-colors::-webkit-scrollbar{
		display:none;
	}

	.scb-color-picker{
		grid-template-columns:minmax(0,1fr) 34px!important;
		align-items:center!important;
		gap:12px!important;
	}

	.scb-color-field{
		height:136px!important;
		border-radius:22px!important;
	}

	.scb-hue-range{
		height:136px!important;
		margin:0!important;
	}

	/* Tool area in a mobile-app style */
	.scb-tools-section{
		padding-top:2px!important;
	}

	.scb-tools{
		grid-template-columns:repeat(4,minmax(0,1fr))!important;
		gap:10px!important;
	}

	.scb-tool{
		padding:0!important;
		border:0!important;
		background:transparent!important;
		display:flex!important;
		flex-direction:column!important;
		align-items:center!important;
		justify-content:flex-start!important;
		gap:10px!important;
		font-size:13px!important;
		font-weight:800!important;
		color:#6d6d6d!important;
		box-shadow:none!important;
	}

	.scb-tool .scb-tool-icon,
	.scb-tool svg{
		width:62px!important;
		height:62px!important;
		padding:16px!important;
		border-radius:50%!important;
		background:#fff!important;
		border:1px solid #e5e5e5!important;
		box-shadow:0 10px 28px rgba(0,0,0,.08)!important;
		display:block!important;
		color:inherit!important;
	}

	.scb-tool.is-active{
		color:#111!important;
	}

	.scb-tool.is-active .scb-tool-icon,
	.scb-tool.is-active svg{
		border:2px solid #111!important;
	}

	/* Brush/opacity as a secondary utility row */
	.scb-settings-section{
		display:grid!important;
		grid-template-columns:1fr!important;
		gap:14px!important;
		padding-top:6px!important;
	}

	.scb-brush-sizes{
		display:grid!important;
		grid-template-columns:repeat(5,minmax(0,1fr))!important;
		gap:10px!important;
	}

	.scb-brush-sizes button{
		height:54px!important;
		border-radius:18px!important;
		background:#fff!important;
		border:1px solid #e6e6e6!important;
		box-shadow:0 8px 22px rgba(0,0,0,.06)!important;
	}

	.scb-brush-sizes button.is-active{
		border:2px solid #111!important;
	}

	.scb-opacity-title{
		display:none!important;
	}

	.scb-opacity-row{
		display:grid!important;
		grid-template-columns:minmax(0,1fr) auto!important;
		align-items:center!important;
		gap:14px!important;
		background:#fff!important;
		border:1px solid #e6e6e6!important;
		border-radius:18px!important;
		padding:12px 14px!important;
		box-shadow:0 8px 22px rgba(0,0,0,.06)!important;
	}

	#scbOpacityValue{
		font-size:14px!important;
		font-weight:800!important;
	}

	/* Suggested sneakers stay as a clean horizontal tray */
	.scb-editor-strip{
		display:flex!important;
		gap:12px!important;
		overflow-x:auto!important;
		padding:4px 0 4px!important;
		margin-top:14px!important;
		scrollbar-width:none;
	}

	.scb-editor-strip::-webkit-scrollbar{
		display:none;
	}

	.scb-strip-item{
		flex:0 0 104px!important;
		height:104px!important;
		border-radius:18px!important;
		padding:8px!important;
		box-shadow:none!important;
	}

	.scb-strip-item.is-active{
		border:2px solid var(--scb-orange)!important;
	}

}


/* v3.6.1 — mobile bug fixes */
@media (max-width: 760px){

	/* Make the canvas area more dominant and avoid oversized empty space */
	.scb-editor-page{
		padding-bottom:12px!important;
	}
	.scb-editor-grid{
		gap:10px!important;
	}
	.scb-editor-left{
		position:relative!important;
		padding-right:66px!important;
	}
	.scb-canvas-shell{
		min-height:310px!important;
	}
	.scb-stage{
		height:42vh!important;
		min-height:290px!important;
		max-height:390px!important;
	}
	.scb-stage-inner{
		top:46%!important;
	}

	/* Keep the top toolbar visible and compact */
	.scb-editor-toolbar{
		padding:4px 0 8px!important;
		margin-bottom:6px!important;
	}
	#scbBack,
	.scb-history-actions .scb-text-button,
	.scb-download{
		width:46px!important;
		height:46px!important;
		min-height:46px!important;
	}
	.scb-history-actions{
		gap:10px!important;
	}

	/* Floating zoom should stay coherent, not split into loose pieces */
	.scb-zoom-control{
		order:0!important;
		position:absolute!important;
		top:8px!important;
		right:0!important;
		margin:0!important;
		width:50px!important;
		padding:6px 4px!important;
		border-radius:26px!important;
		background:rgba(255,255,255,.96)!important;
		box-shadow:0 10px 20px rgba(0,0,0,.10)!important;
	}
	.scb-zoom-control strong{
		display:none!important;
	}
	.scb-zoom-button{
		width:34px!important;
		height:34px!important;
	}
	.scb-zoom-rail{
		width:22px!important;
		height:88px!important;
	}
	.scb-zoom-rail input{
		width:88px!important;
	}
	.scb-zoom-icon{
		width:16px!important;
		height:16px!important;
	}

	/* Bottom panel should feel tighter and less tall */
	.scb-editor-sidebar{
		padding:10px 12px 12px!important;
		border-radius:22px 22px 0 0!important;
	}
	.scb-control-section{
		padding:6px 0!important;
	}
	.scb-color-section{
		gap:8px!important;
	}
	.scb-recent-colors:empty{
		display:none!important;
	}
	.scb-current-color-row{
		justify-content:flex-start!important;
		align-items:center!important;
		gap:12px!important;
		margin:0 0 2px!important;
	}
	.scb-live-color{
		display:block!important;
		position:relative!important;
		width:52px!important;
		height:52px!important;
		min-width:52px!important;
		min-height:52px!important;
		max-width:52px!important;
		max-height:52px!important;
		flex:0 0 52px!important;
		aspect-ratio:1 / 1!important;
		border-radius:50%!important;
		border:6px solid #fff!important;
		box-shadow:0 8px 20px rgba(0,0,0,.10)!important;
	}
	.scb-current-color-text{
		font-size:15px!important;
		line-height:1!important;
	}
	.scb-color-picker{
		margin-top:0!important;
		gap:10px!important;
	}
	.scb-color-field{
		height:124px!important;
		border-radius:20px!important;
	}
	.scb-color-cursor{
		width:28px!important;
		height:28px!important;
	}
	.scb-hue-range{
		height:124px!important;
	}

	/* Tool buttons smaller and more consistent */
	.scb-tools{
		gap:8px!important;
	}
	.scb-tool{
		gap:6px!important;
		font-size:11px!important;
		line-height:1.1!important;
	}
	.scb-tool .scb-tool-icon,
	.scb-tool svg{
		width:50px!important;
		height:50px!important;
		padding:12px!important;
		display:grid!important;
		place-items:center!important;
	}
	.scb-tool .scb-tool-icon svg,
	.scb-tool svg path{
		vector-effect:non-scaling-stroke;
	}

	/* Brush size and opacity more compact */
	.scb-settings-section{
		gap:10px!important;
	}
	.scb-brush-sizes{
		gap:8px!important;
	}
	.scb-brush-sizes button{
		height:46px!important;
		border-radius:16px!important;
		padding:0!important;
	}
	.scb-brush-sizes i{
		margin:auto!important;
	}
	.scb-opacity-row{
		padding:10px 12px!important;
		gap:10px!important;
		border-radius:16px!important;
	}
	#scbOpacityValue{
		font-size:13px!important;
	}

	/* Suggested tray more compact */
	.scb-editor-strip{
		gap:10px!important;
		margin-top:10px!important;
	}
	.scb-strip-item{
		flex:0 0 92px!important;
		height:92px!important;
		border-radius:16px!important;
		padding:6px!important;
	}
}


/* v3.6.2 — mobile editor repairs */
@media (max-width: 760px){
	.scb-editor-mode .scb-header,
	.scb-editor-mode .scb-footer{
		display:none!important;
	}

	.scb-editor-mode .scb-main{
		max-width:none!important;
		padding:8px 10px 14px!important;
	}

	.scb-editor-mode .scb-ad{
		margin:8px 0 10px!important;
	}

	.scb-editor-mode .scb-editor-toolbar{
		position:sticky!important;
		top:0!important;
		z-index:30!important;
		display:grid!important;
		grid-template-columns:1fr auto 1fr!important;
		align-items:center!important;
		gap:8px!important;
		padding:2px 0 8px!important;
		margin:0 0 8px!important;
		background:rgba(248,248,248,.94)!important;
		backdrop-filter:blur(8px);
	}
	.scb-editor-mode .scb-editor-toolbar .scb-text-button span,
	.scb-editor-mode .scb-download span{
		display:none!important;
	}
	.scb-editor-mode #scbBack,
	.scb-editor-mode .scb-history-actions .scb-text-button,
	.scb-editor-mode .scb-download{
		width:44px!important;
		height:44px!important;
		min-height:44px!important;
		padding:0!important;
		border-radius:50%!important;
		display:inline-flex!important;
		align-items:center!important;
		justify-content:center!important;
	}
	.scb-editor-mode #scbBack{
		justify-self:start!important;
		background:transparent!important;
	}
	.scb-editor-mode .scb-history-actions{
		grid-column:auto!important;
		grid-row:auto!important;
		justify-self:center!important;
		gap:12px!important;
	}
	.scb-editor-mode .scb-history-actions .scb-text-button{
		background:transparent!important;
	}
	.scb-editor-mode .scb-download{
		grid-column:auto!important;
		grid-row:auto!important;
		justify-self:end!important;
		background:#fff!important;
		color:#111!important;
		border:1px solid var(--scb-line)!important;
		box-shadow:0 8px 18px rgba(0,0,0,.07)!important;
	}
	.scb-editor-mode .scb-button-icon,
	.scb-editor-mode .scb-button-icon svg{
		width:22px!important;
		height:22px!important;
		margin:0!important;
		display:block!important;
	}

	.scb-editor-mode .scb-editor-grid{
		display:flex!important;
		flex-direction:column!important;
		gap:10px!important;
	}
	.scb-editor-mode .scb-editor-left{
		display:block!important;
		min-width:0!important;
		padding-right:54px!important;
		position:relative!important;
	}

	.scb-editor-mode .scb-canvas-shell{
		order:1!important;
		border:0!important;
		border-radius:0!important;
		background:transparent!important;
		box-shadow:none!important;
		min-height:280px!important;
		padding:0!important;
	}
	.scb-editor-mode .scb-stage{
		width:100%!important;
		height:36vh!important;
		min-height:240px!important;
		max-height:320px!important;
		background:transparent!important;
		overflow:hidden!important;
	}
	.scb-editor-mode .scb-stage-inner{
		left:50%!important;
		top:50%!important;
	}
	.scb-editor-mode .scb-stage canvas{
		display:block!important;
	}

	.scb-editor-mode .scb-zoom-control{
		order:0!important;
		position:absolute!important;
		top:6px!important;
		right:0!important;
		z-index:12!important;
		margin:0!important;
		width:46px!important;
		min-height:auto!important;
		height:auto!important;
		padding:6px 4px!important;
		border:0!important;
		border-radius:23px!important;
		background:rgba(255,255,255,.96)!important;
		box-shadow:0 10px 22px rgba(0,0,0,.10)!important;
		display:flex!important;
		flex-direction:column!important;
		align-items:center!important;
		justify-content:center!important;
		gap:8px!important;
	}
	.scb-editor-mode .scb-zoom-control strong{
		display:none!important;
	}
	.scb-editor-mode .scb-zoom-button{
		width:32px!important;
		height:32px!important;
		font-size:22px!important;
	}
	.scb-editor-mode .scb-zoom-rail{
		width:18px!important;
		height:84px!important;
		flex:0 0 auto!important;
		position:relative!important;
	}
	.scb-editor-mode .scb-zoom-rail input{
		position:absolute!important;
		top:50%!important;
		left:50%!important;
		width:84px!important;
		transform:translate(-50%,-50%) rotate(-90deg)!important;
		margin:0!important;
	}

	.scb-editor-mode .scb-editor-sidebar{
		width:100%!important;
		border:0!important;
		border-radius:18px!important;
		background:#f4f4f4!important;
		box-shadow:none!important;
		padding:10px 10px 12px!important;
		overflow:visible!important;
	}
	.scb-editor-mode .scb-control-section{
		padding:6px 0!important;
		border:0!important;
	}
	.scb-editor-mode .scb-control-section h3{
		display:none!important;
	}

	.scb-editor-mode .scb-current-color-row{
		display:flex!important;
		align-items:center!important;
		justify-content:flex-start!important;
		gap:12px!important;
		margin:0 0 4px!important;
	}
	.scb-editor-mode .scb-live-color{
		width:48px!important;
		height:48px!important;
		min-width:48px!important;
		min-height:48px!important;
		max-width:48px!important;
		max-height:48px!important;
		flex:0 0 48px!important;
		aspect-ratio:1 / 1!important;
		border-radius:50%!important;
		border:5px solid #fff!important;
		box-shadow:0 8px 16px rgba(0,0,0,.08)!important;
	}
	.scb-editor-mode .scb-current-color-text{
		font-size:14px!important;
		font-weight:800!important;
		line-height:1!important;
	}
	.scb-editor-mode .scb-recent-title,
	.scb-editor-mode .scb-hex-input,
	.scb-editor-mode .scb-recent-colors{
		display:none!important;
	}

	.scb-editor-mode .scb-color-picker{
		grid-template-columns:minmax(0,1fr) 24px!important;
		gap:10px!important;
		margin-top:4px!important;
	}
	.scb-editor-mode .scb-color-field{
		height:110px!important;
		border-radius:18px!important;
	}
	.scb-editor-mode .scb-color-cursor{
		width:24px!important;
		height:24px!important;
	}
	.scb-editor-mode .scb-hue-range{
		width:110px!important;
		height:18px!important;
		margin:46px 0 0 -46px!important;
	}

	.scb-editor-mode .scb-tools{
		grid-template-columns:repeat(4,minmax(0,1fr))!important;
		gap:8px!important;
		margin-top:4px!important;
	}
	.scb-editor-mode .scb-tool{
		padding:0!important;
		border:0!important;
		background:transparent!important;
		display:flex!important;
		flex-direction:column!important;
		align-items:center!important;
		justify-content:flex-start!important;
		gap:6px!important;
		font-size:11px!important;
		line-height:1.1!important;
		font-weight:800!important;
		color:#666!important;
		box-shadow:none!important;
	}
	.scb-editor-mode .scb-tool.is-active{
		color:#111!important;
		background:transparent!important;
		border:0!important;
	}
	.scb-editor-mode .scb-tool .scb-tool-icon{
		width:46px!important;
		height:46px!important;
		padding:10px!important;
		border-radius:50%!important;
		background:#fff!important;
		border:1px solid #e2e2e2!important;
		box-shadow:0 6px 16px rgba(0,0,0,.06)!important;
		display:grid!important;
		place-items:center!important;
		font-size:0!important;
	}
	.scb-editor-mode .scb-tool .scb-tool-icon svg,
	.scb-editor-mode .scb-tool .scb-tool-icon img{
		width:24px!important;
		height:24px!important;
		display:block!important;
	}
	.scb-editor-mode .scb-tool.is-active .scb-tool-icon{
		border:2px solid #111!important;
	}

	.scb-editor-mode .scb-settings-section{
		gap:8px!important;
	}
	.scb-editor-mode .scb-brush-sizes{
		grid-template-columns:repeat(5,minmax(0,1fr))!important;
		gap:8px!important;
	}
	.scb-editor-mode .scb-brush-sizes button{
		height:40px!important;
		border-radius:14px!important;
		background:#fff!important;
		border:1px solid #e5e5e5!important;
		box-shadow:none!important;
		padding:0!important;
	}
	.scb-editor-mode .scb-brush-sizes button.is-active{
		border:2px solid #111!important;
	}
	.scb-editor-mode .scb-brush-sizes button.is-active i{
		outline:2px solid var(--scb-orange)!important;
		outline-offset:3px!important;
	}
	.scb-editor-mode .scb-opacity-title{
		display:none!important;
	}
	.scb-editor-mode .scb-opacity-row{
		display:grid!important;
		grid-template-columns:minmax(0,1fr) auto!important;
		align-items:center!important;
		gap:10px!important;
		padding:8px 10px!important;
		background:#fff!important;
		border:1px solid #e5e5e5!important;
		border-radius:14px!important;
	}
	.scb-editor-mode #scbOpacityValue{
		font-size:13px!important;
		font-weight:800!important;
	}

	.scb-editor-mode .scb-editor-strip{
		display:flex!important;
		gap:8px!important;
		overflow-x:auto!important;
		padding:2px 0 4px!important;
		margin-top:10px!important;
		scrollbar-width:none!important;
	}
	.scb-editor-mode .scb-editor-strip::-webkit-scrollbar{
		display:none!important;
	}
	.scb-editor-mode .scb-strip-item{
		flex:0 0 82px!important;
		height:82px!important;
		border-radius:14px!important;
		padding:6px!important;
	}
}


/* v3.6.3 — restore mobile canvas coordinate space */
@media (max-width:760px){
	.scb-editor-mode .scb-stage-inner{
		max-width:none!important;
		max-height:none!important;
	}
	.scb-editor-mode .scb-stage-inner canvas,
	.scb-editor-mode #scbPaintCanvas,
	.scb-editor-mode #scbShadingCanvas,
	.scb-editor-mode #scbLineCanvas{
		max-width:none!important;
		max-height:none!important;
		width:100%!important;
		height:100%!important;
	}
}


/* v3.6.4 — mobile icons, hue and performance polish */

/* Reliable hue rail wrapper on desktop and mobile */
.scb-hue-wrap{
	width:34px;
	height:168px;
	position:relative;
	display:block;
	align-self:stretch;
}
.scb-hue-wrap .scb-hue-range{
	position:absolute!important;
	left:50%!important;
	top:50%!important;
	width:168px!important;
	height:24px!important;
	margin:0!important;
	transform:translate(-50%,-50%) rotate(90deg)!important;
	transform-origin:center!important;
}

@media (max-width:760px){

	/* Toolbar icons: explicitly visible */
	.scb-editor-mode .scb-text-button,
	.scb-editor-mode .scb-download{
		opacity:1!important;
		visibility:visible!important;
		color:#111!important;
	}
	.scb-editor-mode .scb-history-actions button:disabled{
		color:#aeb3ba!important;
		opacity:.55!important;
	}
	.scb-editor-mode .scb-button-icon.scb-icon-fallback,
	.scb-editor-mode .scb-button-icon.scb-icon-fallback svg{
		color:#111!important;
		stroke:currentColor!important;
		opacity:1!important;
		visibility:visible!important;
	}

	/* Fix the nested SVG inheriting the old circular tool-button styles.
	   Only the outer icon wrapper gets the white circle. */
	.scb-editor-mode .scb-tool .scb-tool-icon{
		color:#222!important;
		opacity:1!important;
		visibility:visible!important;
	}
	.scb-editor-mode .scb-tool .scb-tool-icon svg{
		width:24px!important;
		height:24px!important;
		padding:0!important;
		margin:0!important;
		background:transparent!important;
		border:0!important;
		border-radius:0!important;
		box-shadow:none!important;
		color:#222!important;
		stroke:currentColor!important;
		opacity:1!important;
		visibility:visible!important;
		overflow:visible!important;
	}
	.scb-editor-mode .scb-tool img.scb-tool-icon.scb-icon-image{
		object-fit:contain!important;
		opacity:1!important;
		visibility:visible!important;
		filter:none!important;
	}

	/* Prevent the active Fill button from gaining multiple nested rings */
	.scb-editor-mode .scb-tool.is-active svg{
		border:0!important;
		box-shadow:none!important;
		background:transparent!important;
	}

	/* Correct vertical hue slider – no horizontal overflow */
	.scb-editor-mode .scb-color-picker{
		grid-template-columns:minmax(0,1fr) 28px!important;
		align-items:stretch!important;
		overflow:visible!important;
	}
	.scb-editor-mode .scb-hue-wrap{
		width:28px!important;
		height:110px!important;
		position:relative!important;
		overflow:visible!important;
	}
	.scb-editor-mode .scb-hue-wrap .scb-hue-range{
		position:absolute!important;
		left:50%!important;
		top:50%!important;
		width:110px!important;
		height:18px!important;
		margin:0!important;
		transform:translate(-50%,-50%) rotate(90deg)!important;
		transform-origin:center!important;
	}

	/* Keep tool labels clear of the icon circle */
	.scb-editor-mode .scb-tool{
		min-width:0!important;
	}
}


/* v3.6.5 — fast fill, hamburger, all-phone responsive */
.scb-menu-toggle{
	display:none;
	width:44px;
	height:44px;
	padding:8px;
	border:0;
	border-radius:12px;
	background:transparent;
	cursor:pointer;
	flex:0 0 auto;
}
.scb-menu-toggle span{
	display:block;
	width:24px;
	height:2px;
	margin:5px auto;
	background:#111;
	border-radius:10px;
	transition:transform .18s ease,opacity .18s ease;
}
.scb-menu-toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.scb-menu-toggle.is-open span:nth-child(2){opacity:0}
.scb-menu-toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media(max-width:760px){
	body:not(.scb-editor-mode) .scb-header{height:auto!important;position:relative!important;z-index:40!important}
	body:not(.scb-editor-mode) .scb-header-inner{
		min-height:64px!important;
		padding:9px 14px!important;
		flex-direction:row!important;
		align-items:center!important;
		justify-content:space-between!important;
		gap:10px!important;
		position:relative!important;
	}
	body:not(.scb-editor-mode) .scb-brand{align-self:auto!important;min-width:0!important}
	body:not(.scb-editor-mode) .scb-brand strong{font-size:17px!important}
	body:not(.scb-editor-mode) .scb-brand small{font-size:10px!important}
	body:not(.scb-editor-mode) .scb-menu-toggle{display:block!important}
	body:not(.scb-editor-mode) .scb-nav{
		display:flex!important;
		position:absolute!important;
		left:10px!important;
		right:10px!important;
		top:calc(100% - 1px)!important;
		width:auto!important;
		max-height:0!important;
		opacity:0!important;
		pointer-events:none!important;
		overflow:hidden!important;
		flex-direction:column!important;
		align-items:stretch!important;
		gap:0!important;
		padding:0 12px!important;
		background:#fff!important;
		border:1px solid #e9ecef!important;
		border-radius:0 0 16px 16px!important;
		box-shadow:0 16px 34px rgba(0,0,0,.1)!important;
		transition:max-height .2s ease,opacity .16s ease,padding .2s ease!important;
		white-space:normal!important;
	}
	body:not(.scb-editor-mode) .scb-nav.is-open{
		max-height:360px!important;
		opacity:1!important;
		pointer-events:auto!important;
		padding:7px 12px 11px!important;
	}
	body:not(.scb-editor-mode) .scb-nav a{
		width:100%!important;
		padding:12px 7px!important;
		font-size:14px!important;
		border-bottom:1px solid #f0f1f3!important;
	}
	body:not(.scb-editor-mode) .scb-nav a:last-child{border-bottom:0!important}

	.scb-editor-mode .scb-main{
		padding-left:clamp(6px,2.5vw,12px)!important;
		padding-right:clamp(6px,2.5vw,12px)!important;
	}
	.scb-editor-mode .scb-stage{
		height:clamp(245px,40svh,340px)!important;
		min-height:0!important;
		max-height:none!important;
	}
	.scb-editor-mode .scb-editor-left{padding-right:clamp(44px,13vw,52px)!important}
	.scb-editor-mode .scb-color-field{height:clamp(98px,28vw,120px)!important}
	.scb-editor-mode .scb-hue-wrap{height:clamp(98px,28vw,120px)!important}
	.scb-editor-mode .scb-hue-wrap .scb-hue-range{width:clamp(98px,28vw,120px)!important}
	.scb-editor-mode .scb-tool .scb-tool-icon{
		width:clamp(40px,12vw,48px)!important;
		height:clamp(40px,12vw,48px)!important;
	}
	.scb-editor-mode .scb-tool .scb-tool-icon svg,
	.scb-editor-mode .scb-tool .scb-tool-icon img{
		width:clamp(20px,6vw,24px)!important;
		height:clamp(20px,6vw,24px)!important;
	}
	.scb-editor-mode .scb-tool{font-size:clamp(9px,2.8vw,11px)!important}
	.scb-editor-mode .scb-strip-item{
		flex-basis:clamp(70px,22vw,88px)!important;
		height:clamp(70px,22vw,88px)!important;
	}
}

@media(max-width:390px){
	body:not(.scb-editor-mode) .scb-header-inner{padding:8px 10px!important}
	.scb-editor-mode #scbBack,
	.scb-editor-mode .scb-history-actions .scb-text-button,
	.scb-editor-mode .scb-download{
		width:40px!important;height:40px!important;min-height:40px!important
	}
	.scb-editor-mode .scb-history-actions{gap:5px!important}
	.scb-editor-mode .scb-zoom-control{width:40px!important;padding:5px 3px!important}
	.scb-editor-mode .scb-zoom-button{width:28px!important;height:28px!important}
	.scb-editor-mode .scb-zoom-rail{height:70px!important}
	.scb-editor-mode .scb-zoom-rail input{width:70px!important}
	.scb-editor-mode .scb-tools,.scb-editor-mode .scb-brush-sizes{gap:4px!important}
	.scb-editor-mode .scb-brush-sizes button{height:36px!important}
}

@media(max-width:340px){
	.scb-editor-mode .scb-live-color{
		width:42px!important;height:42px!important;min-width:42px!important;
		min-height:42px!important;flex-basis:42px!important
	}
	.scb-editor-mode .scb-current-color-text{font-size:12px!important}
	.scb-editor-mode .scb-tool{font-size:8.5px!important}
	.scb-editor-mode .scb-color-picker{gap:6px!important}
}


/* v3.6.6 — right mobile header and faster fill */
@media(max-width:760px){

	/* Show a compact mobile header even on the coloring page. */
	.scb-editor-mode .scb-header{
		display:block!important;
		height:auto!important;
		position:relative!important;
		z-index:45!important;
		background:#fff!important;
		border-bottom:1px solid #eee!important;
	}
	.scb-editor-mode .scb-footer{
		display:none!important;
	}

	/* Logo + hamburger live together on the right side. */
	.scb-header-inner{
		min-height:60px!important;
		padding:8px 12px!important;
		flex-direction:row!important;
		align-items:center!important;
		justify-content:flex-end!important;
		gap:8px!important;
		position:relative!important;
	}
	.scb-brand{
		order:1!important;
		margin-left:auto!important;
		align-self:auto!important;
	}
	.scb-menu-toggle{
		order:2!important;
		display:block!important;
		margin-left:2px!important;
		flex:0 0 auto!important;
		position:relative!important;
		z-index:3!important;
	}
	.scb-brand .scb-header-icon{
		width:38px!important;
		height:30px!important;
	}
	.scb-brand strong{
		font-size:16px!important;
	}
	.scb-brand small{
		font-size:9px!important;
		margin-top:3px!important;
	}

	/* Hamburger dropdown aligned to the right. */
	.scb-nav{
		position:absolute!important;
		top:100%!important;
		right:8px!important;
		left:auto!important;
		width:min(260px,calc(100vw - 16px))!important;
		max-height:0!important;
		opacity:0!important;
		overflow:hidden!important;
		pointer-events:none!important;
		display:flex!important;
		flex-direction:column!important;
		align-items:stretch!important;
		gap:0!important;
		padding:0 10px!important;
		background:#fff!important;
		border:1px solid #e8eaed!important;
		border-radius:0 0 14px 14px!important;
		box-shadow:0 15px 30px rgba(0,0,0,.11)!important;
		white-space:normal!important;
		transition:max-height .18s ease,opacity .14s ease,padding .18s ease!important;
		z-index:50!important;
	}
	.scb-nav.is-open{
		max-height:360px!important;
		opacity:1!important;
		pointer-events:auto!important;
		padding:7px 10px 10px!important;
	}
	.scb-nav a{
		display:block!important;
		width:100%!important;
		padding:11px 8px!important;
		font-size:14px!important;
		text-align:left!important;
		border-bottom:1px solid #f0f1f3!important;
	}
	.scb-nav a:last-child{
		border-bottom:0!important;
	}
}

/* Tighten brand/menu pairing on tiny phones. */
@media(max-width:360px){
	.scb-header-inner{
		padding-left:7px!important;
		padding-right:7px!important;
		gap:5px!important;
	}
	.scb-brand strong{
		font-size:14px!important;
	}
	.scb-brand small{
		font-size:8px!important;
	}
	.scb-brand .scb-header-icon{
		width:32px!important;
		height:26px!important;
	}
	.scb-menu-toggle{
		width:40px!important;
		height:40px!important;
		padding:7px!important;
	}
}


/* v3.6.7 — mobile header left, pinch-only zoom, tighter canvas */
@media(max-width:760px){

	/* Mobile header: logo + menu on the left side */
	.scb-header-inner{
		justify-content:flex-start!important;
		gap:8px!important;
	}
	.scb-brand{
		order:1!important;
		margin-left:0!important;
		margin-right:0!important;
	}
	.scb-menu-toggle{
		order:2!important;
		margin-left:2px!important;
		margin-right:0!important;
	}
	.scb-nav{
		left:8px!important;
		right:auto!important;
	}

	/* Remove zoom UI on phones; keep only pinch/double-touch gestures */
	.scb-editor-mode .scb-zoom-control{
		display:none!important;
	}
	.scb-editor-mode .scb-editor-left{
		padding-right:0!important;
	}

	/* Make the artwork area tighter */
	.scb-editor-mode .scb-main{
		padding-top:6px!important;
		padding-left:8px!important;
		padding-right:8px!important;
		padding-bottom:10px!important;
	}
	.scb-editor-mode .scb-editor-grid{
		gap:8px!important;
	}
	.scb-editor-mode .scb-canvas-shell{
		min-height:0!important;
	}
	.scb-editor-mode .scb-stage{
		height:clamp(260px,46svh,360px)!important;
		padding:0!important;
		margin:0!important;
	}
	.scb-editor-mode .scb-stage::before,
	.scb-editor-mode .scb-stage::after{
		display:none!important;
	}
	.scb-editor-mode .scb-stage-inner{
		left:50%!important;
		top:50%!important;
	}

	/* Reduce extra space before and after the canvas */
	.scb-editor-mode .scb-editor-toolbar{
		margin:0 0 4px!important;
		padding:0 0 4px!important;
	}
	.scb-editor-mode .scb-editor-sidebar{
		margin-top:4px!important;
		border-radius:16px!important;
	}
}

@media(max-width:390px){
	.scb-editor-mode .scb-stage{
		height:clamp(240px,44svh,320px)!important;
	}
}

@media(max-width:340px){
	.scb-editor-mode .scb-stage{
		height:clamp(220px,42svh,300px)!important;
	}
}


/* v3.6.8 — centered mobile header, toolbar layout, pinch-safe fill */
@media(max-width:760px){

	/* Header: hamburger left, centered brand */
	.scb-header-inner{
		display:grid!important;
		grid-template-columns:44px minmax(0,1fr) 44px!important;
		align-items:center!important;
		justify-content:initial!important;
		gap:8px!important;
	}
	.scb-menu-toggle{
		grid-column:1!important;
		order:0!important;
		justify-self:start!important;
		margin:0!important;
	}
	.scb-brand{
		grid-column:2!important;
		order:0!important;
		justify-self:center!important;
		margin:0!important;
	}
	.scb-nav{
		left:8px!important;
		right:auto!important;
	}

	/* Mobile editor top toolbar */
	.scb-editor-mode .scb-editor-toolbar{
		grid-template-columns:1fr auto 1fr!important;
		align-items:center!important;
		gap:8px!important;
		padding:4px 0 8px!important;
		background:rgba(248,248,248,.94)!important;
		backdrop-filter:blur(8px)!important;
	}
	.scb-editor-mode #scbBack{
		display:none!important;
	}
	.scb-editor-mode .scb-history-actions{
		grid-column:2!important;
		justify-self:center!important;
		gap:12px!important;
	}
	.scb-editor-mode .scb-history-actions .scb-text-button{
		width:40px!important;
		height:40px!important;
		min-height:40px!important;
		padding:0!important;
		border-radius:50%!important;
		display:inline-flex!important;
		align-items:center!important;
		justify-content:center!important;
		background:transparent!important;
	}
	.scb-editor-mode .scb-download{
		grid-column:3!important;
		justify-self:end!important;
		width:auto!important;
		height:40px!important;
		min-height:40px!important;
		padding:0 12px!important;
		border-radius:999px!important;
		display:inline-flex!important;
		align-items:center!important;
		justify-content:center!important;
		gap:7px!important;
		background:var(--scb-orange)!important;
		color:#fff!important;
		border:0!important;
		box-shadow:none!important;
	}
	.scb-editor-mode .scb-download span{
		display:inline!important;
		font-size:12px!important;
		font-weight:800!important;
	}
	.scb-editor-mode .scb-download .scb-button-icon{
		width:16px!important;
		height:16px!important;
		margin:0!important;
		display:block!important;
	}
}


/* v3.6.9 — mobile download, visible history, 100-350 zoom */
@media(max-width:760px){

	/* Undo / Redo stay clearly visible even before they become available. */
	.scb-editor-mode .scb-history-actions .scb-text-button{
		color:#111!important;
		opacity:1!important;
		visibility:visible!important;
		background:#fff!important;
		border:1px solid #e4e6e9!important;
		box-shadow:0 3px 10px rgba(0,0,0,.04)!important;
	}
	.scb-editor-mode .scb-history-actions .scb-text-button:disabled{
		color:#9da3ab!important;
		opacity:1!important;
	}
	.scb-editor-mode .scb-history-actions .scb-button-icon,
	.scb-editor-mode .scb-history-actions .scb-button-icon svg{
		display:block!important;
		width:22px!important;
		height:22px!important;
		opacity:1!important;
		visibility:visible!important;
		color:currentColor!important;
		stroke:currentColor!important;
	}
	.scb-editor-mode .scb-history-actions img.scb-button-icon{
		display:block!important;
		width:22px!important;
		height:22px!important;
		object-fit:contain!important;
		opacity:.8!important;
		filter:grayscale(1) brightness(.3)!important;
	}
	.scb-editor-mode .scb-history-actions button:disabled img.scb-button-icon{
		opacity:.42!important;
	}

	/* Download icon/arrow must be white on the orange button. */
	.scb-editor-mode .scb-download,
	.scb-editor-mode .scb-download .scb-button-icon,
	.scb-editor-mode .scb-download .scb-button-icon svg{
		color:#fff!important;
		stroke:#fff!important;
	}
	.scb-editor-mode .scb-download img.scb-button-icon{
		filter:brightness(0) invert(1)!important;
		opacity:1!important;
	}
	.scb-editor-mode .scb-download:disabled{
		opacity:.6!important;
	}
}


/* v3.6.10 — compact mobile chrome and animated loader */
.scb-loading{
	position:absolute;
	inset:0;
	z-index:10;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:10px;
	color:#737983;
	font-size:13px;
	font-weight:800;
	pointer-events:none;
	background:rgba(255,255,255,.86);
}
.scb-loading-mark{
	position:relative;
	width:74px;
	height:58px;
	display:grid;
	place-items:center;
	animation:scbLoadingFloat 1.25s ease-in-out infinite;
}
.scb-loading-mark::after{
	content:"";
	position:absolute;
	left:50%;
	bottom:-5px;
	width:36px;
	height:5px;
	border-radius:50%;
	background:rgba(0,0,0,.10);
	transform:translateX(-50%);
	filter:blur(2px);
	animation:scbLoadingShadow 1.25s ease-in-out infinite;
}
.scb-loading-logo,
.scb-loading-logo svg,
.scb-loading-logo img{
	display:block!important;
	width:68px!important;
	height:52px!important;
	object-fit:contain!important;
}
.scb-loading-logo{
	color:#111;
	transform-origin:center;
	animation:scbLoadingPulse 1.25s ease-in-out infinite;
}
.scb-loading.is-error{
	background:rgba(255,255,255,.96);
	color:#555;
	animation:none;
}
@keyframes scbLoadingFloat{
	0%,100%{transform:translateY(0)}
	50%{transform:translateY(-7px)}
}
@keyframes scbLoadingPulse{
	0%,100%{transform:scale(.96);opacity:.72}
	50%{transform:scale(1.04);opacity:1}
}
@keyframes scbLoadingShadow{
	0%,100%{transform:translateX(-50%) scaleX(.82);opacity:.55}
	50%{transform:translateX(-50%) scaleX(1.12);opacity:.28}
}
@media (prefers-reduced-motion:reduce){
	.scb-loading-mark,
	.scb-loading-logo,
	.scb-loading-mark::after{
		animation:none!important;
	}
}

@media(max-width:760px){

	/* One compact header row: hamburger at left, brand mathematically centered. */
	.scb-header{
		min-height:58px!important;
		height:58px!important;
	}
	.scb-header-inner{
		position:relative!important;
		display:flex!important;
		align-items:center!important;
		justify-content:center!important;
		min-height:58px!important;
		height:58px!important;
		padding:6px 54px!important;
	}
	.scb-menu-toggle{
		position:absolute!important;
		left:10px!important;
		top:50%!important;
		transform:translateY(-50%)!important;
		display:block!important;
		width:40px!important;
		height:40px!important;
		padding:7px!important;
		margin:0!important;
	}
	.scb-brand{
		position:static!important;
		display:flex!important;
		justify-content:center!important;
		align-items:center!important;
		margin:0!important;
		max-width:calc(100vw - 112px)!important;
	}
	.scb-brand .scb-header-icon{
		width:34px!important;
		height:28px!important;
	}
	.scb-brand .scb-header-icon svg,
	.scb-brand .scb-header-icon img{
		width:34px!important;
		height:28px!important;
	}
	.scb-brand strong{
		font-size:14px!important;
	}
	.scb-brand small{
		font-size:8px!important;
		margin-top:3px!important;
	}
	.scb-nav{
		left:8px!important;
		right:auto!important;
		top:58px!important;
	}

	/* Compact editor action row immediately under ads/header. */
	.scb-editor-mode .scb-editor-toolbar{
		position:relative!important;
		top:auto!important;
		z-index:20!important;
		height:44px!important;
		min-height:44px!important;
		display:grid!important;
		grid-template-columns:44px 1fr 44px!important;
		align-items:center!important;
		padding:0!important;
		margin:2px 0 4px!important;
		background:transparent!important;
		backdrop-filter:none!important;
	}
	.scb-editor-mode #scbBack{
		display:none!important;
	}
	.scb-editor-mode .scb-history-actions{
		grid-column:2!important;
		justify-self:center!important;
		display:flex!important;
		align-items:center!important;
		gap:14px!important;
	}
	.scb-editor-mode .scb-history-actions .scb-text-button{
		position:relative!important;
		width:36px!important;
		height:36px!important;
		min-height:36px!important;
		padding:0!important;
		border:0!important;
		border-radius:50%!important;
		background:transparent!important;
		box-shadow:none!important;
		font-size:0!important;
		color:#222!important;
		opacity:1!important;
		visibility:visible!important;
	}
	.scb-editor-mode .scb-history-actions .scb-text-button .scb-button-icon,
	.scb-editor-mode .scb-history-actions .scb-text-button span{
		display:none!important;
	}
	.scb-editor-mode #scbUndo::before,
	.scb-editor-mode #scbRedo::before{
		position:absolute;
		inset:0;
		display:grid;
		place-items:center;
		font-family:Arial,sans-serif;
		font-size:27px;
		line-height:1;
		font-weight:400;
		color:currentColor;
	}
	.scb-editor-mode #scbUndo::before{content:"↶"}
	.scb-editor-mode #scbRedo::before{content:"↷"}
	.scb-editor-mode .scb-history-actions .scb-text-button:disabled{
		color:#aeb3ba!important;
		opacity:1!important;
	}

	/* Small icon-only Download button on the right. */
	.scb-editor-mode .scb-download{
		grid-column:3!important;
		justify-self:end!important;
		position:relative!important;
		width:38px!important;
		height:38px!important;
		min-height:38px!important;
		padding:0!important;
		border:0!important;
		border-radius:50%!important;
		background:var(--scb-orange)!important;
		color:#fff!important;
		box-shadow:none!important;
		font-size:0!important;
	}
	.scb-editor-mode .scb-download .scb-button-icon,
	.scb-editor-mode .scb-download span{
		display:none!important;
	}
	.scb-editor-mode .scb-download::before{
		content:"↓";
		position:absolute;
		inset:0;
		display:grid;
		place-items:center;
		color:#fff;
		font-family:Arial,sans-serif;
		font-size:25px;
		line-height:1;
		font-weight:700;
		transform:translateY(-1px);
	}

	/* Canvas begins right after the toolbar and has only a small breathing margin. */
	.scb-editor-mode .scb-main{
		padding-top:4px!important;
	}
	.scb-editor-mode .scb-editor-grid{
		gap:6px!important;
	}
	.scb-editor-mode .scb-editor-left{
		margin:0!important;
	}
	.scb-editor-mode .scb-canvas-shell{
		margin:0!important;
		padding:0!important;
		min-height:0!important;
		border:0!important;
	}
	.scb-editor-mode .scb-stage{
		width:100%!important;
		height:clamp(255px,43svh,345px)!important;
		margin:0!important;
		padding:0!important;
		min-height:0!important;
		background:#fff!important;
	}
	.scb-editor-mode .scb-editor-sidebar{
		margin-top:2px!important;
	}

	/* Loader stays modest on phone screens. */
	.scb-editor-mode .scb-loading-mark{
		width:64px;
		height:50px;
	}
	.scb-editor-mode .scb-loading-logo,
	.scb-editor-mode .scb-loading-logo svg,
	.scb-editor-mode .scb-loading-logo img{
		width:58px!important;
		height:44px!important;
	}
}

@media(max-width:360px){
	.scb-header-inner{
		padding-left:48px!important;
		padding-right:48px!important;
	}
	.scb-brand{
		gap:7px!important;
		max-width:calc(100vw - 100px)!important;
	}
	.scb-brand strong{
		font-size:12px!important;
	}
	.scb-brand small{
		font-size:7px!important;
	}
	.scb-editor-mode .scb-history-actions{
		gap:8px!important;
	}
}


/* v3.6.11 — globally centered brand, layer-safe loader, detached toolbar */

/* Center the brand on every page, not only the editor/mobile screen. */
.scb-header-inner{
	position:relative!important;
}
.scb-brand{
	position:absolute!important;
	left:50%!important;
	top:50%!important;
	transform:translate(-50%,-50%)!important;
	margin:0!important;
	z-index:2!important;
}
.scb-nav{
	margin-left:auto!important;
}
.scb-menu-toggle{
	z-index:3!important;
}

/* Loader fully hides the underlying line art until every required layer is ready. */
.scb-loading{
	background:#fff!important;
}

/* Action controls are their own visual toolbar, detached from the canvas. */
.scb-editor-toolbar{
	position:relative;
	z-index:12;
	margin:0 0 16px!important;
	padding:8px 10px!important;
	min-height:56px!important;
	background:#fff!important;
	border:1px solid #e9ecef!important;
	border-radius:12px!important;
	box-shadow:0 4px 14px rgba(0,0,0,.035)!important;
}
.scb-canvas-shell{
	margin-top:0!important;
}

/* Desktop/tablet: preserve centered brand while keeping navigation usable. */
@media(min-width:761px){
	.scb-header-inner{
		justify-content:flex-end!important;
		padding-left:34px!important;
		padding-right:34px!important;
	}
	.scb-brand{
		max-width:46%!important;
	}
}

/* Mobile: hamburger remains left while the brand stays precisely centered. */
@media(max-width:760px){
	.scb-header-inner{
		position:relative!important;
		display:flex!important;
		align-items:center!important;
		justify-content:flex-start!important;
		padding-left:56px!important;
		padding-right:56px!important;
	}
	.scb-brand{
		position:absolute!important;
		left:50%!important;
		top:50%!important;
		transform:translate(-50%,-50%)!important;
		max-width:calc(100vw - 116px)!important;
	}
	.scb-menu-toggle{
		position:absolute!important;
		left:10px!important;
		top:50%!important;
		transform:translateY(-50%)!important;
		margin:0!important;
	}
	.scb-nav{
		margin-left:0!important;
	}

	/* Clear visual gap between toolbar and drawing surface. */
	.scb-editor-mode .scb-editor-toolbar{
		height:44px!important;
		min-height:44px!important;
		margin:4px 0 12px!important;
		padding:3px 6px!important;
		border:1px solid #e9ecef!important;
		border-radius:12px!important;
		background:#fff!important;
		box-shadow:0 4px 12px rgba(0,0,0,.035)!important;
	}
	.scb-editor-mode .scb-canvas-shell{
		border:1px solid #f0f1f3!important;
		border-radius:10px!important;
		background:#fff!important;
		overflow:hidden!important;
	}
	.scb-editor-mode .scb-stage{
		border-radius:9px!important;
	}
}

@media(max-width:360px){
	.scb-brand{
		max-width:calc(100vw - 104px)!important;
	}
}


/* v3.6.12 — faster parallel load and refined mobile action bar */
@media(max-width:760px){

	/* A lightweight action strip, visually separate from the canvas. */
	.scb-editor-mode .scb-editor-toolbar{
		height:48px!important;
		min-height:48px!important;
		display:grid!important;
		grid-template-columns:1fr auto 1fr!important;
		align-items:center!important;
		padding:4px 6px!important;
		margin:6px 0 10px!important;
		background:#f7f7f7!important;
		border:0!important;
		border-radius:14px!important;
		box-shadow:none!important;
	}

	/* Undo / Redo: show the exact same icon assets/markup used on desktop. */
	.scb-editor-mode .scb-history-actions{
		grid-column:2!important;
		justify-self:center!important;
		display:flex!important;
		align-items:center!important;
		gap:8px!important;
		padding:3px!important;
		background:#fff!important;
		border:1px solid #e8eaed!important;
		border-radius:999px!important;
	}
	.scb-editor-mode .scb-history-actions .scb-text-button{
		position:static!important;
		width:36px!important;
		height:34px!important;
		min-height:34px!important;
		padding:0!important;
		display:inline-flex!important;
		align-items:center!important;
		justify-content:center!important;
		background:transparent!important;
		border:0!important;
		border-radius:999px!important;
		box-shadow:none!important;
		color:#222!important;
		font-size:0!important;
		opacity:1!important;
		visibility:visible!important;
	}
	.scb-editor-mode .scb-history-actions .scb-text-button:disabled{
		color:#b4b8be!important;
		opacity:1!important;
	}
	.scb-editor-mode #scbUndo::before,
	.scb-editor-mode #scbRedo::before{
		display:none!important;
		content:none!important;
	}
	.scb-editor-mode .scb-history-actions .scb-button-icon{
		display:grid!important;
		place-items:center!important;
		width:21px!important;
		height:21px!important;
		margin:0!important;
		color:currentColor!important;
		opacity:1!important;
		visibility:visible!important;
	}
	.scb-editor-mode .scb-history-actions .scb-button-icon svg{
		display:block!important;
		width:21px!important;
		height:21px!important;
		padding:0!important;
		margin:0!important;
		color:currentColor!important;
		stroke:currentColor!important;
		background:transparent!important;
		border:0!important;
		box-shadow:none!important;
	}
	.scb-editor-mode .scb-history-actions img.scb-button-icon{
		display:block!important;
		width:21px!important;
		height:21px!important;
		object-fit:contain!important;
		filter:none!important;
		opacity:1!important;
	}
	.scb-editor-mode .scb-history-actions button:disabled img.scb-button-icon{
		opacity:.38!important;
	}

	/* Download: compact orange pill with icon + visible text. */
	.scb-editor-mode .scb-download{
		grid-column:3!important;
		justify-self:end!important;
		position:static!important;
		width:auto!important;
		height:38px!important;
		min-height:38px!important;
		padding:0 13px!important;
		display:inline-flex!important;
		align-items:center!important;
		justify-content:center!important;
		gap:7px!important;
		background:var(--scb-orange)!important;
		border:0!important;
		border-radius:999px!important;
		color:#fff!important;
		box-shadow:none!important;
		font-size:12px!important;
		font-weight:800!important;
	}
	.scb-editor-mode .scb-download::before{
		display:none!important;
		content:none!important;
	}
	.scb-editor-mode .scb-download span{
		display:inline!important;
		font-size:12px!important;
		font-weight:800!important;
		line-height:1!important;
	}
	.scb-editor-mode .scb-download .scb-button-icon{
		display:grid!important;
		place-items:center!important;
		width:17px!important;
		height:17px!important;
		margin:0!important;
		color:#fff!important;
	}
	.scb-editor-mode .scb-download .scb-button-icon svg{
		display:block!important;
		width:17px!important;
		height:17px!important;
		padding:0!important;
		margin:0!important;
		color:#fff!important;
		stroke:#fff!important;
		background:transparent!important;
		border:0!important;
		box-shadow:none!important;
	}
	.scb-editor-mode .scb-download img.scb-button-icon{
		display:block!important;
		width:17px!important;
		height:17px!important;
		object-fit:contain!important;
		filter:brightness(0) invert(1)!important;
	}

	/* Keep an empty left balancing column so history remains truly centered. */
	.scb-editor-mode #scbBack{
		display:none!important;
	}
}

/* Narrow phones: keep the action bar from overflowing. */
@media(max-width:370px){
	.scb-editor-mode .scb-editor-toolbar{
		padding-left:4px!important;
		padding-right:4px!important;
	}
	.scb-editor-mode .scb-history-actions{
		gap:3px!important;
	}
	.scb-editor-mode .scb-history-actions .scb-text-button{
		width:32px!important;
	}
	.scb-editor-mode .scb-download{
		height:36px!important;
		min-height:36px!important;
		padding:0 10px!important;
		gap:5px!important;
	}
	.scb-editor-mode .scb-download span{
		font-size:11px!important;
	}
}


/* v3.6.13 — visible history icons and compact action bar */
@media(max-width:760px){

	/* Compact action bar; history is centered independently from Download. */
	.scb-editor-mode .scb-editor-toolbar{
		position:relative!important;
		display:block!important;
		height:44px!important;
		min-height:44px!important;
		padding:4px 6px!important;
		margin:5px 0 8px!important;
		background:#f8f8f8!important;
		border:0!important;
		border-radius:11px!important;
		box-shadow:none!important;
	}

	.scb-editor-mode #scbBack{
		display:none!important;
	}

	.scb-editor-mode .scb-history-actions{
		position:absolute!important;
		left:50%!important;
		top:50%!important;
		transform:translate(-50%,-50%)!important;
		display:flex!important;
		align-items:center!important;
		justify-content:center!important;
		gap:4px!important;
		margin:0!important;
		padding:2px!important;
		background:#fff!important;
		border:1px solid #eceef1!important;
		border-radius:999px!important;
		box-shadow:none!important;
	}

	.scb-editor-mode .scb-history-actions .scb-text-button{
		position:relative!important;
		width:34px!important;
		height:32px!important;
		min-height:32px!important;
		padding:0!important;
		display:inline-flex!important;
		align-items:center!important;
		justify-content:center!important;
		border:0!important;
		border-radius:999px!important;
		background:transparent!important;
		box-shadow:none!important;
		color:#222!important;
		font-size:0!important;
		opacity:1!important;
		visibility:visible!important;
	}

	.scb-editor-mode .scb-history-actions .scb-text-button:disabled{
		color:#aeb3ba!important;
		opacity:1!important;
	}

	/* Override the old rule that hid every span inside toolbar buttons.
	   This makes the actual desktop Undo/Redo icon markup visible. */
	.scb-editor-mode .scb-editor-toolbar .scb-history-actions .scb-text-button > .scb-button-icon,
	.scb-editor-mode .scb-editor-toolbar .scb-history-actions .scb-text-button > span.scb-button-icon{
		display:grid!important;
		place-items:center!important;
		width:20px!important;
		height:20px!important;
		margin:0!important;
		padding:0!important;
		opacity:1!important;
		visibility:visible!important;
		color:currentColor!important;
		background:transparent!important;
		border:0!important;
		box-shadow:none!important;
	}

	.scb-editor-mode .scb-editor-toolbar .scb-history-actions .scb-button-icon svg{
		display:block!important;
		width:20px!important;
		height:20px!important;
		margin:0!important;
		padding:0!important;
		color:currentColor!important;
		stroke:currentColor!important;
		background:transparent!important;
		border:0!important;
		box-shadow:none!important;
		opacity:1!important;
		visibility:visible!important;
	}

	.scb-editor-mode .scb-editor-toolbar .scb-history-actions img.scb-button-icon{
		display:block!important;
		width:20px!important;
		height:20px!important;
		object-fit:contain!important;
		opacity:1!important;
		visibility:visible!important;
		filter:none!important;
	}

	.scb-editor-mode .scb-editor-toolbar .scb-history-actions button:disabled img.scb-button-icon{
		opacity:.38!important;
	}

	/* No pseudo-arrow fallback; use the same icon content as desktop. */
	.scb-editor-mode #scbUndo::before,
	.scb-editor-mode #scbRedo::before{
		display:none!important;
		content:none!important;
	}

	/* Compact one-line Download button on the right. */
	.scb-editor-mode .scb-download{
		position:absolute!important;
		right:6px!important;
		top:50%!important;
		transform:translateY(-50%)!important;
		width:auto!important;
		max-width:none!important;
		height:34px!important;
		min-height:34px!important;
		padding:0 11px!important;
		display:inline-flex!important;
		align-items:center!important;
		justify-content:center!important;
		gap:6px!important;
		border:0!important;
		border-radius:999px!important;
		background:var(--scb-orange)!important;
		color:#fff!important;
		box-shadow:none!important;
		font-size:11px!important;
		font-weight:800!important;
		line-height:1!important;
		white-space:nowrap!important;
	}

	/* Override the old span-hiding rule specifically for Download text/icon. */
	.scb-editor-mode .scb-editor-toolbar .scb-download > span:not(.scb-button-icon){
		display:inline!important;
		white-space:nowrap!important;
		font-size:11px!important;
		line-height:1!important;
		font-weight:800!important;
	}

	.scb-editor-mode .scb-editor-toolbar .scb-download > .scb-button-icon,
	.scb-editor-mode .scb-editor-toolbar .scb-download > span.scb-button-icon{
		display:grid!important;
		place-items:center!important;
		width:15px!important;
		height:15px!important;
		margin:0!important;
		padding:0!important;
		color:#fff!important;
		opacity:1!important;
		visibility:visible!important;
	}

	.scb-editor-mode .scb-editor-toolbar .scb-download .scb-button-icon svg{
		display:block!important;
		width:15px!important;
		height:15px!important;
		margin:0!important;
		padding:0!important;
		color:#fff!important;
		stroke:#fff!important;
		background:transparent!important;
		border:0!important;
		box-shadow:none!important;
	}

	.scb-editor-mode .scb-editor-toolbar .scb-download img.scb-button-icon{
		display:block!important;
		width:15px!important;
		height:15px!important;
		object-fit:contain!important;
		filter:brightness(0) invert(1)!important;
		opacity:1!important;
	}

	.scb-editor-mode .scb-download::before{
		display:none!important;
		content:none!important;
	}

	/* Lighter, thinner canvas frame. */
	.scb-editor-mode .scb-canvas-shell{
		border:1px solid #f3f4f5!important;
		border-radius:8px!important;
		background:#fff!important;
		box-shadow:none!important;
	}

	.scb-editor-mode .scb-stage{
		border-radius:7px!important;
	}

	/* Slightly lift the artwork and keep a little more breathing room. */
	.scb-editor-mode .scb-stage-inner{
		top:48%!important;
	}

	/* Bottom control card should not feel oversized. */
	.scb-editor-mode .scb-editor-sidebar{
		border-radius:14px!important;
		padding:8px 9px 10px!important;
		background:#f7f7f7!important;
	}
}

@media(max-width:370px){
	.scb-editor-mode .scb-history-actions{
		gap:2px!important;
	}
	.scb-editor-mode .scb-history-actions .scb-text-button{
		width:30px!important;
	}
	.scb-editor-mode .scb-download{
		right:4px!important;
		height:32px!important;
		min-height:32px!important;
		padding:0 9px!important;
		gap:4px!important;
	}
	.scb-editor-mode .scb-editor-toolbar .scb-download > span:not(.scb-button-icon){
		font-size:10px!important;
	}
}


/* v3.6.14 — tighter mobile canvas fit and sharper high-density rendering */
@media(max-width:760px){

	/* Remove extra internal canvas inset that was creating visible white padding. */
	.scb-editor-mode .scb-canvas-shell{
		padding:0!important;
		margin-top:0!important;
		line-height:0!important;
	}
	.scb-editor-mode .scb-stage{
		width:100%!important;
		height:100%!important;
		min-height:0!important;
		line-height:0!important;
	}
	.scb-editor-mode .scb-stage-inner{
		top:50%!important;
	}
	.scb-editor-mode canvas{
		display:block!important;
	}

	/* Keep the frame light but tighter to the art. */
	.scb-editor-mode .scb-canvas-shell{
		border:1px solid #f0f1f3!important;
		border-radius:8px!important;
	}
}


/* v3.6.15 — mobile download fix + color picker redesign */
@media(max-width:760px){

	/* Bring the Back button back and create a clearer three-part top bar. */
	.scb-editor-toolbar{
		display:grid!important;
		grid-template-columns:auto 1fr auto!important;
		align-items:center!important;
		gap:10px!important;
		padding:0!important;
		margin:0 0 14px!important;
		background:transparent!important;
		border:0!important;
	}
	#scbBack{
		display:inline-flex!important;
		align-items:center!important;
		justify-content:flex-start!important;
		padding:8px 0!important;
		min-width:auto!important;
		background:transparent!important;
		border:0!important;
		font-weight:800!important;
	}
	.scb-history-actions{
		display:flex!important;
		align-items:center!important;
		justify-content:center!important;
		gap:12px!important;
	}
	.scb-history-actions .scb-text-button{
		width:42px!important;
		height:42px!important;
		padding:0!important;
		border-radius:50%!important;
		border:1px solid #e7e8ec!important;
		background:#fff!important;
	}
	.scb-history-actions .scb-text-button span{
		display:none!important;
	}
	.scb-download{
		min-height:42px!important;
		padding:0 14px!important;
		border-radius:999px!important;
		font-size:14px!important;
	}
	.scb-download span{
		white-space:nowrap!important;
	}

	/* Mobile color section closer to the provided reference: swatches row + long rounded picker bars. */
	.scb-color-section h3:first-child,
	.scb-recent-title{
		display:none!important;
	}
	.scb-current-color-row{
		justify-content:center!important;
		gap:12px!important;
		margin:0 0 14px!important;
	}
	.scb-live-color{
		width:54px!important;
		height:54px!important;
		border-radius:50%!important;
		border:6px solid #fff!important;
		box-shadow:0 10px 24px rgba(17,24,39,.12)!important;
	}
	.scb-current-color-text{
		font-size:17px!important;
		font-weight:800!important;
		letter-spacing:.02em!important;
	}
	.scb-recent-colors{
		justify-content:center!important;
		align-items:center!important;
		gap:12px!important;
		padding:0 0 12px!important;
		overflow-x:auto!important;
		flex-wrap:nowrap!important;
	}
	.scb-color-swatch,
	.scb-add-color{
		width:42px!important;
		height:42px!important;
		flex:0 0 42px!important;
		border-radius:50%!important;
	}
	.scb-color-swatch.is-selected{
		box-shadow:0 0 0 4px #fff, 0 0 0 7px #111!important;
	}

	.scb-color-picker{
		display:grid!important;
		grid-template-columns:1fr!important;
		gap:12px!important;
		padding:0!important;
		background:transparent!important;
		border:0!important;
	}
	.scb-color-field{
		min-height:86px!important;
		height:86px!important;
		border-radius:999px!important;
		border:2px solid #111!important;
		overflow:hidden!important;
		background:#fff!important;
	}
	.scb-color-grid-canvas{
		border-radius:999px!important;
	}
	.scb-color-cursor{
		width:52px!important;
		height:52px!important;
		border-width:4px!important;
		box-shadow:0 8px 18px rgba(17,24,39,.20)!important;
	}
	.scb-hue-wrap{
		width:100%!important;
		height:46px!important;
		padding:0!important;
		display:flex!important;
		align-items:center!important;
	}
	.scb-hue-range{
		-webkit-appearance:none!important;
		appearance:none!important;
		width:100%!important;
		height:36px!important;
		border-radius:999px!important;
		border:3px solid #111!important;
		background:linear-gradient(90deg,#ff6f7b 0%,#f59d57 10%,#e6ea49 20%,#aee66f 30%,#69d4d8 45%,#58a8ef 58%,#6660ec 68%,#b060e8 78%,#e35bc9 88%,#ff7781 100%)!important;
		box-shadow:0 10px 24px rgba(146,108,191,.18)!important;
	}
	.scb-hue-range::-webkit-slider-thumb{
		-webkit-appearance:none!important;
		appearance:none!important;
		width:42px!important;
		height:62px!important;
		border-radius:999px!important;
		background:transparent!important;
		border:0!important;
		box-shadow:none!important;
	}
	.scb-hue-range::-moz-range-thumb{
		width:42px!important;
		height:62px!important;
		border-radius:999px!important;
		background:transparent!important;
		border:0!important;
		box-shadow:none!important;
	}
	.scb-hue-wrap::after{
		content:"";
		position:absolute;
		right:auto;
		left:var(--scb-mobile-hue-thumb-left,50%);
		top:50%;
		transform:translate(-50%,-50%);
		width:42px;
		height:62px;
		border-radius:999px;
		background:var(--scb-current-color,#ff5a00);
		border:3px solid #111;
		box-shadow:0 10px 24px rgba(146,108,191,.24);
		pointer-events:none;
	}

	.scb-editor-sidebar{
		margin-top:10px!important;
		border-radius:22px!important;
		padding-top:4px!important;
	}
	.scb-control-section{
		padding:16px 18px!important;
	}
}


/* v3.6.16 — mobile picker and controls cleanup */
@media (max-width:760px){
	/* Make the mobile picker compact and closer to the reference. */
	.scb-editor-mode .scb-control-section h3{display:none!important}
	.scb-editor-mode .scb-editor-sidebar{padding-top:0!important;border-radius:20px!important}
	.scb-editor-mode .scb-control-section{padding:14px 16px!important}
	.scb-editor-mode .scb-current-color-row{justify-content:flex-start!important;gap:12px!important;margin:0 0 10px!important}
	.scb-editor-mode .scb-live-color{width:40px!important;height:40px!important;border:5px solid #fff!important;box-shadow:0 6px 14px rgba(17,24,39,.10)!important}
	.scb-editor-mode .scb-current-color-text{font-size:15px!important;font-weight:800!important;line-height:1.1!important}
	.scb-editor-mode .scb-recent-colors{gap:10px!important;padding:0 0 10px!important;justify-content:flex-start!important}
	.scb-editor-mode .scb-color-swatch,
	.scb-editor-mode .scb-add-color{width:38px!important;height:38px!important;flex:0 0 38px!important}
	.scb-editor-mode .scb-color-swatch.is-selected{box-shadow:0 0 0 3px #fff,0 0 0 5px #111!important}
	.scb-editor-mode .scb-color-picker{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}
	.scb-editor-mode .scb-color-field{height:100px!important;min-height:100px!important;border-radius:30px!important;border:2px solid #111!important;overflow:visible!important;box-sizing:border-box!important;padding:5px!important;background:#fff!important}
	.scb-editor-mode .scb-color-grid-canvas{display:block!important;width:100%!important;height:100%!important;border-radius:26px!important}
	.scb-editor-mode .scb-color-cursor{width:28px!important;height:28px!important;border-width:3px!important;box-shadow:0 4px 10px rgba(17,24,39,.20)!important}
	.scb-editor-mode .scb-color-field.is-active .scb-color-cursor{box-shadow:0 0 0 1px #111,0 4px 10px rgba(17,24,39,.20)!important}

	/* Force the hue slider to be horizontal below the grid. */
	.scb-editor-mode .scb-hue-wrap{position:relative!important;width:100%!important;height:30px!important;display:block!important;align-self:auto!important;padding:0!important;overflow:visible!important}
	.scb-editor-mode .scb-hue-wrap::after{display:none!important;content:none!important}
	.scb-editor-mode .scb-hue-wrap .scb-hue-range,
	.scb-editor-mode .scb-hue-range{position:relative!important;left:auto!important;top:auto!important;width:100%!important;height:30px!important;margin:0!important;transform:none!important;transform-origin:center!important;border:2px solid #111!important;border-radius:999px!important;background:linear-gradient(90deg,#ff6f7b 0%,#f59d57 10%,#e6ea49 20%,#aee66f 30%,#69d4d8 45%,#58a8ef 58%,#6660ec 68%,#b060e8 78%,#e35bc9 88%,#ff7781 100%)!important;box-shadow:0 8px 18px rgba(146,108,191,.14)!important}
	.scb-editor-mode .scb-hue-range::-webkit-slider-thumb{-webkit-appearance:none!important;appearance:none!important;width:18px!important;height:40px!important;border-radius:999px!important;background:#fff!important;border:2px solid #111!important;box-shadow:0 4px 10px rgba(17,24,39,.18)!important}
	.scb-editor-mode .scb-hue-range::-moz-range-thumb{width:18px!important;height:40px!important;border-radius:999px!important;background:#fff!important;border:2px solid #111!important;box-shadow:0 4px 10px rgba(17,24,39,.18)!important}

	/* Tool row: lighter and less bulky. */
	.scb-editor-mode .scb-tools{gap:8px!important;grid-template-columns:repeat(4,minmax(0,1fr))!important}
	.scb-editor-mode .scb-tool{min-height:auto!important;padding:2px 2px 6px!important;border:0!important;background:transparent!important;gap:8px!important;font-size:11px!important;font-weight:700!important;color:#6b7280!important}
	.scb-editor-mode .scb-tool .scb-tool-icon{width:28px!important;height:28px!important;display:grid!important;place-items:center!important;color:#2c2f36!important}
	.scb-editor-mode .scb-tool::before{content:"";display:block;width:64px;max-width:100%;aspect-ratio:1/1;background:#fff;border:1px solid #dedfe3;border-radius:999px;margin:0 auto -36px auto;box-shadow:0 1px 2px rgba(0,0,0,.03)}
	.scb-editor-mode .scb-tool.is-active{color:#111!important}
	.scb-editor-mode .scb-tool.is-active::before{border:2px solid #111!important}
	.scb-editor-mode .scb-tool.is-active .scb-tool-icon{color:#111!important}

	/* Brush sizes cleaner. */
	.scb-editor-mode .scb-brush-sizes{gap:8px!important}
	.scb-editor-mode .scb-brush-sizes button{height:52px!important;border-radius:18px!important;border:1px solid #dedfe3!important;background:#fff!important}
	.scb-editor-mode .scb-brush-sizes i{background:#111!important}
	.scb-editor-mode .scb-brush-sizes button.is-active{border:2px solid #111!important;box-shadow:none!important}
	.scb-editor-mode .scb-brush-sizes button.is-active i{outline:none!important;box-shadow:0 0 0 5px #ff5a00!important;border-radius:50%!important}

	/* Opacity slider cleaner and tighter. */
	.scb-editor-mode .scb-opacity-row{grid-template-columns:minmax(0,1fr) auto!important;gap:10px!important;align-items:center!important}
	.scb-editor-mode .scb-opacity-row input{accent-color:var(--scb-orange)!important}
	.scb-editor-mode #scbOpacityValue{font-size:13px!important;font-weight:800!important;white-space:nowrap!important}
}

/* v3.6.21 mobile polish */
@media (max-width: 760px){
  .scb-editor-mode .scb-editor-sidebar{
    padding: 14px !important;
  }
  .scb-editor-mode .scb-current-color-row{
    margin: 0 0 8px !important;
    gap: 10px !important;
  }
  .scb-editor-mode .scb-current-color-text{
    font-size: 14px !important;
  }
  .scb-editor-mode .scb-color-picker{
    gap: 8px !important;
  }
  .scb-editor-mode .scb-color-field{
    height: 124px !important;
    min-height: 124px !important;
  }
  .scb-editor-mode .scb-tools{
    margin-top: 2px !important;
  }
}


/* v3.6.22 mobile controls fix */
@media (max-width:760px){
  .scb-editor-mode .scb-editor-sidebar{
    padding:14px !important;
    border-radius:24px !important;
  }
  .scb-editor-mode .scb-control-section{
    padding:12px 14px !important;
  }
  .scb-editor-mode .scb-current-color-row{
    gap:12px !important;
    margin:0 0 12px !important;
    align-items:center !important;
  }
  .scb-editor-mode .scb-live-color{
    width:44px !important;
    height:44px !important;
    border:4px solid #fff !important;
    box-shadow:0 6px 16px rgba(17,24,39,.10) !important;
  }
  .scb-editor-mode .scb-current-color-text{
    font-size:14px !important;
    line-height:1 !important;
    font-weight:800 !important;
  }
  .scb-editor-mode .scb-color-picker{
    gap:10px !important;
  }
  .scb-editor-mode .scb-color-field{
    height:110px !important;
    min-height:110px !important;
    border-radius:28px !important;
    border:2px solid #111 !important;
    background:#fff !important;
    padding:4px !important;
    overflow:visible !important;
  }
  .scb-editor-mode .scb-color-grid-canvas{
    border-radius:24px !important;
  }
  .scb-editor-mode .scb-color-cursor{
    width:24px !important;
    height:24px !important;
    border-width:4px !important;
    box-shadow:0 4px 10px rgba(17,24,39,.18) !important;
  }
  .scb-editor-mode .scb-hue-wrap,
  .scb-editor-mode .scb-hue-wrap .scb-hue-range,
  .scb-editor-mode .scb-hue-range{
    height:28px !important;
  }
  .scb-editor-mode .scb-hue-range::-webkit-slider-thumb{
    width:16px !important;
    height:38px !important;
  }
  .scb-editor-mode .scb-hue-range::-moz-range-thumb{
    width:16px !important;
    height:38px !important;
  }
  .scb-editor-mode .scb-tools-section{
    margin-top:6px !important;
  }
  .scb-editor-mode .scb-tools{
    gap:10px !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    align-items:start !important;
  }
  .scb-editor-mode .scb-tool{
    min-height:auto !important;
    padding:0 !important;
    border:0 !important;
    background:transparent !important;
    gap:8px !important;
    font-size:10px !important;
    line-height:1.15 !important;
    font-weight:700 !important;
    color:#6b7280 !important;
    justify-content:flex-start !important;
  }
  .scb-editor-mode .scb-tool::before,
  .scb-editor-mode .scb-tool::after{
    content:none !important;
    display:none !important;
  }
  .scb-editor-mode .scb-tool .scb-tool-icon{
    width:54px !important;
    height:54px !important;
    margin:0 auto !important;
    display:grid !important;
    place-items:center !important;
    border:1px solid #dedfe3 !important;
    border-radius:999px !important;
    background:#fff !important;
    color:#222 !important;
    box-shadow:0 1px 2px rgba(0,0,0,.03) !important;
    line-height:1 !important;
    padding:0 !important;
    transform:none !important;
    position:relative !important;
  }
  .scb-editor-mode .scb-tool .scb-tool-icon.scb-icon-image{
    object-fit:contain !important;
    padding:14px !important;
    box-sizing:border-box !important;
  }
  .scb-editor-mode .scb-tool .scb-tool-icon.scb-icon-fallback{
    font-size:23px !important;
  }
  .scb-editor-mode .scb-tool.is-active{
    color:#111 !important;
  }
  .scb-editor-mode .scb-tool.is-active .scb-tool-icon{
    border:2px solid #111 !important;
    color:#111 !important;
  }
  .scb-editor-mode .scb-brush-sizes{
    gap:8px !important;
    margin-top:4px !important;
  }
  .scb-editor-mode .scb-brush-sizes button{
    height:52px !important;
    border-radius:18px !important;
    border:1px solid #dedfe3 !important;
    background:#fff !important;
  }
  .scb-editor-mode .scb-brush-sizes button.is-active{
    border:2px solid #111 !important;
    box-shadow:none !important;
  }
  .scb-editor-mode .scb-brush-sizes button.is-active i{
    outline:none !important;
    box-shadow:0 0 0 5px var(--scb-orange) !important;
    border-radius:50% !important;
  }
  .scb-editor-mode .scb-opacity-row{
    gap:10px !important;
    margin-top:8px !important;
  }
  .scb-editor-mode #scbOpacityValue{
    font-size:13px !important;
    font-weight:800 !important;
  }
}


/* v3.6.23 mobile tool icon centering fix */
@media (max-width:760px){
  .scb-editor-mode .scb-tools{
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:12px !important;
    align-items:start !important;
  }
  .scb-editor-mode .scb-tool{
    -webkit-appearance:none !important;
    appearance:none !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:8px !important;
    min-width:0 !important;
    min-height:auto !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    outline:none !important;
    text-align:center !important;
    font-size:12px !important;
    line-height:1.15 !important;
    font-weight:800 !important;
    color:#6b7280 !important;
  }
  .scb-editor-mode .scb-tool::before,
  .scb-editor-mode .scb-tool::after,
  .scb-editor-mode .scb-tool .scb-tool-icon::before,
  .scb-editor-mode .scb-tool .scb-tool-icon::after{
    content:none !important;
    display:none !important;
  }
  .scb-editor-mode .scb-tool .scb-tool-icon{
    width:58px !important;
    height:58px !important;
    min-width:58px !important;
    min-height:58px !important;
    flex:0 0 58px !important;
    margin:0 auto !important;
    padding:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    border-radius:999px !important;
    border:1.5px solid #d9dce2 !important;
    background:#fff !important;
    box-shadow:0 2px 8px rgba(17,24,39,.06) !important;
    color:#222 !important;
    line-height:0 !important;
    font-size:0 !important;
    overflow:hidden !important;
    position:relative !important;
    transform:none !important;
  }
  .scb-editor-mode .scb-tool .scb-tool-icon svg,
  .scb-editor-mode .scb-tool .scb-tool-icon img{
    width:28px !important;
    height:28px !important;
    display:block !important;
    margin:0 !important;
    padding:0 !important;
    flex:0 0 28px !important;
  }
  .scb-editor-mode .scb-tool .scb-tool-icon img.scb-icon-image{
    object-fit:contain !important;
  }
  .scb-editor-mode .scb-tool .scb-tool-icon.scb-icon-fallback{
    font-size:0 !important;
  }
  .scb-editor-mode .scb-tool .scb-tool-icon.scb-icon-fallback svg{
    overflow:visible !important;
  }
  .scb-editor-mode .scb-tool.is-active{
    color:#111 !important;
  }
  .scb-editor-mode .scb-tool.is-active .scb-tool-icon{
    border:2.5px solid #111 !important;
    box-shadow:0 0 0 3px rgba(255,106,0,.22) !important;
  }
  .scb-editor-mode .scb-tool > :last-child{
    display:block !important;
    width:100% !important;
  }
}


/* v3.6.24 tool icon polish */
@media (max-width:760px){
  .scb-editor-mode .scb-tool.is-active .scb-tool-icon{
    box-shadow:none !important;
  }
}
@media (min-width:761px){
  .scb-tool .scb-tool-icon,
  .scb-tool-icon{
    width:20px !important;
    height:20px !important;
    min-width:20px !important;
    min-height:20px !important;
  }
  .scb-tool .scb-tool-icon svg,
  .scb-tool .scb-tool-icon img,
  .scb-tool-icon svg,
  .scb-tool-icon img{
    width:20px !important;
    height:20px !important;
  }
  .scb-tool{
    gap:4px !important;
  }
}


/* v3.6.26 — lock custom icon sizes/positions */
img.scb-icon-image{
  display:block!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
}
img.scb-button-icon.scb-icon-image{
  width:20px!important;
  height:20px!important;
}
img.scb-zoom-icon.scb-icon-image{
  width:20px!important;
  height:20px!important;
}
img.scb-add-color-icon.scb-icon-image{
  width:20px!important;
  height:20px!important;
}
img.scb-tool-icon.scb-icon-image{
  width:26px!important;
  height:26px!important;
}
img.scb-header-icon.scb-icon-image{
  width:48px!important;
  height:38px!important;
}
.scb-button-icon,
.scb-tool-icon,
.scb-zoom-icon,
.scb-add-color-icon,
.scb-header-icon{
  overflow:hidden!important;
  flex:0 0 auto!important;
  align-items:center!important;
  justify-content:center!important;
  box-sizing:border-box!important;
}
.scb-history-actions .scb-text-button > .scb-button-icon,
.scb-download > .scb-button-icon,
.scb-tool .scb-tool-icon{
  flex-shrink:0!important;
}
@media (max-width:760px){
  .scb-editor-mode .scb-editor-toolbar .scb-history-actions .scb-text-button > .scb-button-icon,
  .scb-editor-mode .scb-editor-toolbar .scb-history-actions > .scb-text-button > img.scb-button-icon.scb-icon-image,
  .scb-editor-mode .scb-editor-toolbar .scb-history-actions > .scb-text-button > span.scb-button-icon{
    width:20px!important;
    height:20px!important;
    min-width:20px!important;
    min-height:20px!important;
    max-width:20px!important;
    max-height:20px!important;
  }
  .scb-editor-mode .scb-editor-toolbar .scb-history-actions img.scb-button-icon.scb-icon-image{
    width:20px!important;
    height:20px!important;
    min-width:20px!important;
    min-height:20px!important;
    max-width:20px!important;
    max-height:20px!important;
    object-fit:contain!important;
    object-position:center center!important;
  }
  .scb-editor-mode .scb-editor-toolbar .scb-download img.scb-button-icon.scb-icon-image{
    width:15px!important;
    height:15px!important;
    min-width:15px!important;
    min-height:15px!important;
    max-width:15px!important;
    max-height:15px!important;
  }
  .scb-editor-mode .scb-tool .scb-tool-icon,
  .scb-editor-mode .scb-tool img.scb-tool-icon.scb-icon-image{
    box-sizing:border-box!important;
  }
  .scb-editor-mode .scb-tool img.scb-tool-icon.scb-icon-image{
    width:28px!important;
    height:28px!important;
    min-width:28px!important;
    min-height:28px!important;
    max-width:28px!important;
    max-height:28px!important;
    padding:0!important;
    margin:0!important;
  }
}


/* v3.6.27 — disabled undo/redo custom icons show greyed-out */
.scb-history-actions .scb-text-button:disabled > .scb-button-icon,
.scb-history-actions .scb-text-button:disabled > span.scb-button-icon,
.scb-history-actions .scb-text-button:disabled img.scb-button-icon.scb-icon-image,
.scb-history-actions .scb-text-button[disabled] > .scb-button-icon,
.scb-history-actions .scb-text-button[disabled] > span.scb-button-icon,
.scb-history-actions .scb-text-button[disabled] img.scb-button-icon.scb-icon-image{
  opacity:.38!important;
  filter:grayscale(1) brightness(1.45) contrast(.75)!important;
}
.scb-history-actions .scb-text-button:disabled,
.scb-history-actions .scb-text-button[disabled]{
  color:#bcc2cc!important;
}
.scb-history-actions .scb-text-button:disabled .scb-button-icon svg,
.scb-history-actions .scb-text-button[disabled] .scb-button-icon svg{
  opacity:.38!important;
}
@media (max-width:760px){
  .scb-editor-mode .scb-editor-toolbar .scb-history-actions .scb-text-button:disabled > .scb-button-icon,
  .scb-editor-mode .scb-editor-toolbar .scb-history-actions .scb-text-button:disabled > span.scb-button-icon,
  .scb-editor-mode .scb-editor-toolbar .scb-history-actions .scb-text-button:disabled img.scb-button-icon.scb-icon-image,
  .scb-editor-mode .scb-editor-toolbar .scb-history-actions .scb-text-button[disabled] > .scb-button-icon,
  .scb-editor-mode .scb-editor-toolbar .scb-history-actions .scb-text-button[disabled] > span.scb-button-icon,
  .scb-editor-mode .scb-editor-toolbar .scb-history-actions .scb-text-button[disabled] img.scb-button-icon.scb-icon-image{
    opacity:.32!important;
    filter:grayscale(1) brightness(1.5) contrast(.7)!important;
  }
}


/* v3.6.28 — larger mobile tool icons */
@media (max-width:760px){
  .scb-editor-mode .scb-tools{
    gap:14px !important;
  }
  .scb-editor-mode .scb-tool{
    gap:10px !important;
    font-size:14px !important;
    line-height:1.1 !important;
  }
  .scb-editor-mode .scb-tool .scb-tool-icon{
    width:72px !important;
    height:72px !important;
    min-width:72px !important;
    min-height:72px !important;
    flex:0 0 72px !important;
    border-width:2px !important;
  }
  .scb-editor-mode .scb-tool .scb-tool-icon svg,
  .scb-editor-mode .scb-tool .scb-tool-icon img,
  .scb-editor-mode .scb-tool img.scb-tool-icon.scb-icon-image{
    width:36px !important;
    height:36px !important;
    min-width:36px !important;
    min-height:36px !important;
    max-width:36px !important;
    max-height:36px !important;
    flex:0 0 36px !important;
  }
  .scb-editor-mode .scb-tool.is-active .scb-tool-icon{
    border-width:3px !important;
  }
}

/* v3.6.29 — mobile preset-palette color picker */
.scb-mobile-palette{display:none}
.scb-mobile-palette-button{
	appearance:none;
	-webkit-appearance:none;
	border:0;
	padding:0;
	cursor:pointer;
}

@media (max-width:760px){
	.scb-editor-mode .scb-recent-title,
	.scb-editor-mode .scb-recent-colors,
	.scb-editor-mode .scb-hex-input{
		display:none !important;
	}
	.scb-editor-mode .scb-mobile-palette{
		display:grid !important;
		grid-template-columns:repeat(10,minmax(0,1fr));
		gap:8px;
		padding:10px;
		margin:10px 0 14px;
		background:#fff;
		border:1px solid #dadde3;
		border-radius:20px;
		box-shadow:0 1px 0 rgba(17,24,39,.03);
	}
	.scb-editor-mode .scb-mobile-palette-button{
		width:100%;
		aspect-ratio:1 / 1;
		border-radius:8px;
		border:2px solid rgba(255,255,255,.95);
		box-shadow:inset 0 0 0 1px rgba(17,24,39,.08);
	}
	.scb-editor-mode .scb-mobile-palette-button.is-selected{
		box-shadow:0 0 0 2px #fff,0 0 0 4px #8e96a3,inset 0 0 0 1px rgba(17,24,39,.08);
	}
	.scb-editor-mode .scb-color-picker{
		display:block !important;
		grid-template-columns:none !important;
		margin-top:0 !important;
	}
	.scb-editor-mode .scb-color-field{
		display:none !important;
	}
	.scb-editor-mode .scb-hue-wrap{
		position:relative !important;
		width:100% !important;
		height:34px !important;
		display:block !important;
		align-self:auto !important;
		padding:0 !important;
		overflow:visible !important;
		margin-top:0 !important;
		box-shadow:none !important;
		background:transparent !important;
		border:0 !important;
	}
	.scb-editor-mode .scb-hue-wrap::after{display:none !important;content:none !important}
	.scb-editor-mode .scb-hue-wrap .scb-hue-range,
	.scb-editor-mode .scb-hue-range{
		position:relative !important;
		left:auto !important;
		top:auto !important;
		width:100% !important;
		height:34px !important;
		margin:0 !important;
		transform:none !important;
		transform-origin:center !important;
		border:2px solid #111 !important;
		border-radius:999px !important;
		background:linear-gradient(90deg,#ff3a2d 0%,#ff981f 12%,#f8df2a 24%,#66cf45 37%,#34d2a9 50%,#44b6f3 63%,#3c80f0 74%,#8b49ef 85%,#f050b7 100%) !important;
		box-shadow:none !important;
	}
	.scb-editor-mode .scb-hue-range::-webkit-slider-thumb{
		-webkit-appearance:none !important;
		appearance:none !important;
		width:18px !important;
		height:42px !important;
		border-radius:999px !important;
		background:#fff !important;
		border:2px solid #111 !important;
		box-shadow:none !important;
	}
	.scb-editor-mode .scb-hue-range::-moz-range-thumb{
		width:18px !important;
		height:42px !important;
		border-radius:999px !important;
		background:#fff !important;
		border:2px solid #111 !important;
		box-shadow:none !important;
	}
}


/* v3.6.32 — refined desktop editor toolbar */
@media (min-width:761px){
  .scb-editor-mode .scb-editor-toolbar{
    display:grid !important;
    grid-template-columns:auto 1fr auto !important;
    align-items:center !important;
    gap:20px !important;
    min-height:56px !important;
    padding:12px 18px !important;
    margin-bottom:14px !important;
    border:1px solid #e4e7ec !important;
    border-radius:16px !important;
    background:#fff !important;
    box-shadow:0 1px 2px rgba(17,24,39,.04) !important;
  }

  .scb-editor-mode #scbBack{
    justify-self:start !important;
  }

  .scb-editor-mode .scb-history-actions{
    justify-self:center !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:22px !important;
    min-width:0 !important;
  }

  .scb-editor-mode .scb-editor-toolbar .scb-text-button,
  .scb-editor-mode .scb-editor-toolbar .scb-download{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:10px !important;
    line-height:1 !important;
    white-space:nowrap !important;
    align-self:center !important;
  }

  .scb-editor-mode .scb-editor-toolbar .scb-text-button{
    padding:0 !important;
    min-height:0 !important;
    font-size:15px !important;
    font-weight:700 !important;
    color:#111827 !important;
    background:transparent !important;
    border:0 !important;
  }

  .scb-editor-mode .scb-editor-toolbar .scb-text-button > span:not(.scb-button-icon),
  .scb-editor-mode .scb-editor-toolbar .scb-download > span:not(.scb-button-icon){
    display:inline-block !important;
    font-size:15px !important;
    line-height:1 !important;
  }

  .scb-editor-mode .scb-editor-toolbar .scb-text-button > .scb-button-icon,
  .scb-editor-mode .scb-editor-toolbar .scb-text-button > span.scb-button-icon,
  .scb-editor-mode .scb-editor-toolbar .scb-text-button > img.scb-button-icon.scb-icon-image,
  .scb-editor-mode .scb-editor-toolbar .scb-download > .scb-button-icon,
  .scb-editor-mode .scb-editor-toolbar .scb-download > span.scb-button-icon,
  .scb-editor-mode .scb-editor-toolbar .scb-download > img.scb-button-icon.scb-icon-image{
    width:20px !important;
    height:20px !important;
    min-width:20px !important;
    min-height:20px !important;
    flex:0 0 20px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
  }

  .scb-editor-mode .scb-editor-toolbar .scb-text-button > .scb-button-icon svg,
  .scb-editor-mode .scb-editor-toolbar .scb-text-button > span.scb-button-icon svg,
  .scb-editor-mode .scb-editor-toolbar .scb-download > .scb-button-icon svg,
  .scb-editor-mode .scb-editor-toolbar .scb-download > span.scb-button-icon svg{
    width:20px !important;
    height:20px !important;
    display:block !important;
  }

  .scb-editor-mode .scb-editor-toolbar .scb-download{
    justify-self:end !important;
    min-height:44px !important;
    padding:0 18px !important;
    border-radius:12px !important;
    font-size:16px !important;
    font-weight:800 !important;
    background:var(--scb-orange) !important;
    color:#fff !important;
    box-shadow:none !important;
  }

  .scb-editor-mode .scb-editor-toolbar .scb-download > span:not(.scb-button-icon){
    font-size:16px !important;
    font-weight:800 !important;
  }

  .scb-editor-mode .scb-editor-toolbar .scb-history-actions .scb-text-button:disabled,
  .scb-editor-mode .scb-editor-toolbar .scb-history-actions .scb-text-button[disabled]{
    color:#a5adb8 !important;
    opacity:1 !important;
  }

  .scb-editor-mode .scb-editor-toolbar .scb-history-actions .scb-text-button:disabled > .scb-button-icon,
  .scb-editor-mode .scb-editor-toolbar .scb-history-actions .scb-text-button:disabled > span.scb-button-icon,
  .scb-editor-mode .scb-editor-toolbar .scb-history-actions .scb-text-button:disabled img.scb-button-icon.scb-icon-image,
  .scb-editor-mode .scb-editor-toolbar .scb-history-actions .scb-text-button[disabled] > .scb-button-icon,
  .scb-editor-mode .scb-editor-toolbar .scb-history-actions .scb-text-button[disabled] > span.scb-button-icon,
  .scb-editor-mode .scb-editor-toolbar .scb-history-actions .scb-text-button[disabled] img.scb-button-icon.scb-icon-image{
    opacity:.55 !important;
    filter:grayscale(1) brightness(1.2) contrast(.8) !important;
  }
}

/* v3.6.33 — desktop toolbar centering + consistent disabled styling */
@media (min-width:761px){
  .scb-editor-mode .scb-editor-toolbar{
    grid-template-columns:max-content 1fr max-content !important;
    align-items:center !important;
    column-gap:24px !important;
    min-height:64px !important;
  }

  .scb-editor-mode #scbBack{
    justify-self:start !important;
  }

  .scb-editor-mode .scb-history-actions{
    justify-self:center !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:28px !important;
    width:100% !important;
    min-width:0 !important;
  }

  .scb-editor-mode .scb-history-actions .scb-text-button{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:10px !important;
    min-width:112px !important;
    padding:0 !important;
    margin:0 !important;
    text-align:center !important;
    line-height:1 !important;
    color:#111827 !important;
    white-space:nowrap !important;
    background:transparent !important;
    border:0 !important;
  }

  .scb-editor-mode .scb-history-actions .scb-text-button > span:not(.scb-button-icon){
    display:inline-block !important;
    color:inherit !important;
    font-size:15px !important;
    font-weight:700 !important;
    line-height:1 !important;
  }

  .scb-editor-mode .scb-history-actions .scb-text-button > .scb-button-icon,
  .scb-editor-mode .scb-history-actions .scb-text-button > span.scb-button-icon,
  .scb-editor-mode .scb-history-actions .scb-text-button > img.scb-button-icon.scb-icon-image{
    width:22px !important;
    height:22px !important;
    min-width:22px !important;
    min-height:22px !important;
    flex:0 0 22px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    margin:0 !important;
    object-fit:contain !important;
  }

  .scb-editor-mode .scb-history-actions .scb-text-button .scb-button-icon svg,
  .scb-editor-mode .scb-history-actions .scb-text-button > span.scb-button-icon svg{
    width:22px !important;
    height:22px !important;
    display:block !important;
  }

  .scb-editor-mode .scb-history-actions .scb-text-button:disabled,
  .scb-editor-mode .scb-history-actions .scb-text-button[disabled]{
    color:#bcc3cd !important;
    opacity:1 !important;
  }

  .scb-editor-mode .scb-history-actions .scb-text-button:disabled > .scb-button-icon,
  .scb-editor-mode .scb-history-actions .scb-text-button:disabled > span.scb-button-icon,
  .scb-editor-mode .scb-history-actions .scb-text-button:disabled > img.scb-button-icon.scb-icon-image,
  .scb-editor-mode .scb-history-actions .scb-text-button[disabled] > .scb-button-icon,
  .scb-editor-mode .scb-history-actions .scb-text-button[disabled] > span.scb-button-icon,
  .scb-editor-mode .scb-history-actions .scb-text-button[disabled] > img.scb-button-icon.scb-icon-image{
    opacity:.42 !important;
    filter:none !important;
  }

  .scb-editor-mode .scb-history-actions .scb-text-button:disabled .scb-button-icon svg,
  .scb-editor-mode .scb-history-actions .scb-text-button[disabled] .scb-button-icon svg{
    opacity:1 !important;
    color:currentColor !important;
    stroke:currentColor !important;
    fill:currentColor !important;
  }
}


/* v3.6.34 — low-latency mobile brush compositing */
@media (max-width:760px){
	.scb-editor-mode #scbPaintCanvas{
		will-change:contents;
		-webkit-backface-visibility:hidden;
		backface-visibility:hidden;
	}
	.scb-editor-mode .scb-stage-inner{
		will-change:transform;
	}
}


/* v3.6.36 — local-progress thumbnails + Reset action */
.scb-layered-thumb .scb-layered-progress{
	position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:contain!important;pointer-events:none;
}
.scb-layered-thumb.has-local-progress .scb-layered-base{z-index:2}
.scb-layered-thumb.has-local-progress .scb-layered-shading{z-index:3}

@media (min-width:761px){
	.scb-editor-mode .scb-editor-toolbar{position:relative!important}
	.scb-editor-mode .scb-history-actions{
		position:absolute!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important;
		width:auto!important;gap:18px!important;
	}
	.scb-editor-mode .scb-history-actions .scb-text-button{min-width:90px!important}
	.scb-editor-mode #scbReset{color:#111827!important}
	.scb-editor-mode .scb-history-actions .scb-text-button:disabled,
	.scb-editor-mode .scb-history-actions .scb-text-button[disabled]{color:#999!important}
	.scb-editor-mode .scb-history-actions .scb-text-button:disabled > .scb-button-icon,
	.scb-editor-mode .scb-history-actions .scb-text-button:disabled > span.scb-button-icon,
	.scb-editor-mode .scb-history-actions .scb-text-button:disabled > img.scb-button-icon.scb-icon-image,
	.scb-editor-mode .scb-history-actions .scb-text-button[disabled] > .scb-button-icon,
	.scb-editor-mode .scb-history-actions .scb-text-button[disabled] > span.scb-button-icon,
	.scb-editor-mode .scb-history-actions .scb-text-button[disabled] > img.scb-button-icon.scb-icon-image{opacity:.4!important;filter:none!important}
}

@media (max-width:760px){
	.scb-editor-mode .scb-history-actions{gap:2px!important;padding:2px!important}
	.scb-editor-mode .scb-history-actions .scb-text-button{width:29px!important;min-width:29px!important;height:32px!important}
	.scb-editor-mode .scb-editor-toolbar .scb-history-actions .scb-text-button > .scb-button-icon,
	.scb-editor-mode .scb-editor-toolbar .scb-history-actions .scb-text-button > span.scb-button-icon,
	.scb-editor-mode .scb-editor-toolbar .scb-history-actions img.scb-button-icon{
		width:19px!important;height:19px!important;min-width:19px!important;min-height:19px!important;
	}
	.scb-editor-mode #scbReset{color:#222!important}
	.scb-editor-mode .scb-history-actions .scb-text-button:disabled,
	.scb-editor-mode .scb-history-actions .scb-text-button[disabled]{color:#999!important}
	.scb-editor-mode .scb-history-actions .scb-text-button:disabled > .scb-button-icon,
	.scb-editor-mode .scb-history-actions .scb-text-button:disabled > span.scb-button-icon,
	.scb-editor-mode .scb-history-actions .scb-text-button:disabled > img.scb-button-icon.scb-icon-image,
	.scb-editor-mode .scb-history-actions .scb-text-button[disabled] > .scb-button-icon,
	.scb-editor-mode .scb-history-actions .scb-text-button[disabled] > span.scb-button-icon,
	.scb-editor-mode .scb-history-actions .scb-text-button[disabled] > img.scb-button-icon.scb-icon-image{opacity:.4!important;filter:none!important}
}


/* v3.6.37 — persistent Recent Colors + explicit empty state */
.scb-recent-colors:empty{
	display:flex!important;
}
.scb-recent-empty{
	display:inline-flex;
	align-items:center;
	min-height:36px;
	font-size:13px;
	font-weight:600;
	color:#98a0ab;
	letter-spacing:.01em;
}
.scb-recent-empty[hidden]{
	display:none!important;
}
.scb-recent-colors.is-empty{
	min-height:36px;
}

@media (max-width:760px){
	/* Keep Recent Colors visible above the mobile preset palette. */
	.scb-editor-mode .scb-recent-title{
		display:block!important;
		margin:2px 0 2px!important;
		font-size:12px!important;
		font-weight:800!important;
		line-height:1.2!important;
		color:#6b7280!important;
		text-transform:none!important;
		letter-spacing:0!important;
	}
	.scb-editor-mode .scb-recent-colors{
		display:flex!important;
		justify-content:flex-start!important;
		align-items:center!important;
		gap:9px!important;
		min-height:38px!important;
		padding:0 2px 8px!important;
		overflow-x:auto!important;
		flex-wrap:nowrap!important;
	}
	.scb-editor-mode .scb-recent-colors .scb-color-swatch{
		width:34px!important;
		height:34px!important;
		min-width:34px!important;
		min-height:34px!important;
		flex:0 0 34px!important;
	}
	.scb-editor-mode .scb-recent-empty{
		min-height:34px!important;
		font-size:12px!important;
		font-weight:600!important;
		color:#9aa1ab!important;
	}
}


/* v3.6.38 — in-game reset dialog + reliable saved-color card previews */
.scb-layered-thumb.has-local-progress{
	background:#fff;
	isolation:isolate;
}
.scb-layered-thumb.has-local-progress .scb-layered-progress{
	z-index:1!important;
	opacity:1!important;
	visibility:visible!important;
	mix-blend-mode:normal!important;
}
.scb-layered-thumb.has-local-progress .scb-layered-base{
	z-index:2!important;
	mix-blend-mode:multiply!important;
	background:transparent!important;
}
.scb-layered-thumb.has-local-progress .scb-layered-shading{
	z-index:3!important;
	mix-blend-mode:multiply!important;
}

body.scb-modal-open{overflow:hidden!important}
.scb-game-modal[hidden]{display:none!important}
.scb-game-modal{
	position:fixed;
	inset:0;
	z-index:100000;
	display:grid;
	place-items:center;
	padding:20px;
	opacity:0;
	visibility:hidden;
	transition:opacity .16s ease,visibility .16s ease;
}
.scb-game-modal.is-open{opacity:1;visibility:visible}
.scb-game-modal-backdrop{
	position:absolute;
	inset:0;
	background:rgba(17,24,39,.48);
	backdrop-filter:blur(4px);
	-webkit-backdrop-filter:blur(4px);
}
.scb-game-modal-card{
	position:relative;
	z-index:1;
	width:min(420px,calc(100vw - 32px));
	padding:28px;
	border:1px solid #e4e7ec;
	border-radius:22px;
	background:#fff;
	box-shadow:0 24px 70px rgba(17,24,39,.24);
	text-align:center;
	transform:translateY(10px) scale(.98);
	transition:transform .18s ease;
	outline:none;
}
.scb-game-modal.is-open .scb-game-modal-card{transform:translateY(0) scale(1)}
.scb-game-modal-icon{
	width:54px;
	height:54px;
	margin:0 auto 14px;
	border-radius:16px;
	display:grid;
	place-items:center;
	background:#fff1e9;
	color:var(--scb-orange);
}
.scb-game-modal-icon .scb-modal-reset-icon,
.scb-game-modal-icon .scb-modal-reset-icon svg,
.scb-game-modal-icon img.scb-modal-reset-icon{
	width:27px!important;
	height:27px!important;
	max-width:27px!important;
	max-height:27px!important;
}
.scb-game-modal-card h2{
	margin:0 0 9px;
	font-size:23px;
	line-height:1.15;
	color:#111827;
}
.scb-game-modal-card p{
	margin:0 auto;
	max-width:330px;
	font-size:14px;
	line-height:1.55;
	color:#697180;
}
.scb-game-modal-actions{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:10px;
	margin-top:23px;
}
.scb-game-modal-actions button{
	min-height:46px;
	border-radius:12px;
	font:inherit;
	font-weight:800;
	font-size:15px;
	cursor:pointer;
}
.scb-game-modal-cancel{
	border:1px solid #d9dde4;
	background:#fff;
	color:#1f2937;
}
.scb-game-modal-confirm{
	border:1px solid var(--scb-orange);
	background:var(--scb-orange);
	color:#fff;
}
.scb-game-modal-actions button:focus-visible{
	outline:3px solid rgba(255,90,0,.28);
	outline-offset:2px;
}
@media (max-width:760px){
	.scb-game-modal{padding:16px;align-items:end}
	.scb-game-modal-card{
		width:100%;
		max-width:none;
		padding:24px 20px calc(20px + env(safe-area-inset-bottom));
		border-radius:24px 24px 18px 18px;
	}
	.scb-game-modal-card h2{font-size:21px}
}


/* v3.6.39 — disabled reset state */
.scb-history-actions #scbReset:disabled,
.scb-history-actions #scbReset[disabled]{
	cursor:not-allowed !important;
}


/* v3.6.40 — unified disabled Reset + upgraded in-game confirmation */
.scb-editor-mode .scb-history-actions #scbReset:disabled,
.scb-editor-mode .scb-history-actions #scbReset[disabled]{
	color:#111827!important;
	opacity:.34!important;
	cursor:not-allowed!important;
	pointer-events:none!important;
}
.scb-editor-mode .scb-history-actions #scbReset:disabled > span:not(.scb-button-icon),
.scb-editor-mode .scb-history-actions #scbReset[disabled] > span:not(.scb-button-icon){
	color:inherit!important;
	opacity:1!important;
}
.scb-editor-mode .scb-history-actions #scbReset:disabled > .scb-button-icon,
.scb-editor-mode .scb-history-actions #scbReset:disabled > span.scb-button-icon,
.scb-editor-mode .scb-history-actions #scbReset:disabled > img.scb-button-icon.scb-icon-image,
.scb-editor-mode .scb-history-actions #scbReset[disabled] > .scb-button-icon,
.scb-editor-mode .scb-history-actions #scbReset[disabled] > span.scb-button-icon,
.scb-editor-mode .scb-history-actions #scbReset[disabled] > img.scb-button-icon.scb-icon-image{
	opacity:1!important;
	filter:grayscale(1)!important;
}
.scb-editor-mode .scb-history-actions #scbReset:disabled .scb-button-icon svg,
.scb-editor-mode .scb-history-actions #scbReset[disabled] .scb-button-icon svg{
	color:inherit!important;
	stroke:currentColor!important;
}

.scb-game-modal{
	padding:24px!important;
}
.scb-game-modal-backdrop{
	background:rgba(10,15,25,.58)!important;
	backdrop-filter:blur(8px)!important;
	-webkit-backdrop-filter:blur(8px)!important;
}
.scb-game-modal-card{
	width:min(438px,calc(100vw - 32px))!important;
	padding:32px 30px 28px!important;
	border:1px solid rgba(17,24,39,.08)!important;
	border-radius:28px!important;
	background:linear-gradient(180deg,#fff 0%,#fff 72%,#fffaf7 100%)!important;
	box-shadow:0 28px 90px rgba(8,15,28,.32),0 2px 8px rgba(8,15,28,.08)!important;
	overflow:hidden!important;
}
.scb-game-modal-card::before{
	content:"";
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:5px;
	background:var(--scb-orange);
}
.scb-game-modal-icon{
	width:66px!important;
	height:66px!important;
	margin:2px auto 16px!important;
	border:1px solid #ffd9c4!important;
	border-radius:22px!important;
	background:linear-gradient(145deg,#fff7f2,#ffe8da)!important;
	box-shadow:0 8px 24px rgba(255,90,0,.12)!important;
	color:var(--scb-orange)!important;
}
.scb-game-modal-icon .scb-modal-reset-icon,
.scb-game-modal-icon .scb-modal-reset-icon svg,
.scb-game-modal-icon img.scb-modal-reset-icon{
	width:30px!important;
	height:30px!important;
	max-width:30px!important;
	max-height:30px!important;
}
.scb-game-modal-kicker{
	margin:0 0 7px;
	font-size:11px;
	font-weight:900;
	line-height:1;
	letter-spacing:.13em;
	text-transform:uppercase;
	color:var(--scb-orange);
}
.scb-game-modal-card h2{
	margin:0 0 10px!important;
	font-size:27px!important;
	font-weight:900!important;
	line-height:1.08!important;
	letter-spacing:-.025em!important;
	color:#111827!important;
}
.scb-game-modal-card p{
	max-width:345px!important;
	font-size:14.5px!important;
	line-height:1.58!important;
	color:#687181!important;
}
.scb-game-modal-actions{
	grid-template-columns:1fr 1fr!important;
	gap:12px!important;
	margin-top:26px!important;
}
.scb-game-modal-actions button{
	min-height:50px!important;
	border-radius:14px!important;
	font-size:15px!important;
	font-weight:900!important;
	transition:transform .12s ease,box-shadow .12s ease,background .12s ease!important;
}
.scb-game-modal-actions button:active{
	transform:scale(.98)!important;
}
.scb-game-modal-cancel{
	border:1px solid #d9dee6!important;
	background:#f7f8fa!important;
	color:#252d39!important;
	box-shadow:inset 0 1px 0 rgba(255,255,255,.9)!important;
}
.scb-game-modal-cancel:hover{
	background:#eef1f5!important;
}
.scb-game-modal-confirm{
	border:1px solid var(--scb-orange)!important;
	background:var(--scb-orange)!important;
	color:#fff!important;
	box-shadow:0 8px 18px rgba(255,90,0,.20)!important;
}
.scb-game-modal-confirm:hover{
	box-shadow:0 10px 24px rgba(255,90,0,.28)!important;
}

@media (max-width:760px){
	.scb-game-modal{
		align-items:center!important;
		padding:18px!important;
	}
	.scb-game-modal-card{
		width:min(390px,100%)!important;
		padding:29px 22px 22px!important;
		border-radius:26px!important;
	}
	.scb-game-modal-icon{
		width:60px!important;
		height:60px!important;
		border-radius:20px!important;
		margin-bottom:14px!important;
	}
	.scb-game-modal-card h2{
		font-size:24px!important;
	}
	.scb-game-modal-card p{
		font-size:14px!important;
	}
	.scb-game-modal-actions{
		margin-top:22px!important;
	}
	.scb-game-modal-actions button{
		min-height:48px!important;
	}
}


/* v3.6.41 — cleaner Reset modal borders */
.scb-game-modal-card{
	position:relative!important;
	border:1px solid #e5e7eb!important;
	border-radius:24px!important;
	background:#fff!important;
	box-shadow:
		0 24px 70px rgba(15,23,42,.24),
		0 0 0 1px rgba(255,255,255,.72) inset!important;
	overflow:hidden!important;
}

/* Remove the heavy orange strip that made the card border look uneven. */
.scb-game-modal-card::before{
	display:none!important;
	content:none!important;
}

.scb-game-modal-icon{
	border:1px solid #f4cdb7!important;
	border-radius:18px!important;
	background:#fff7f2!important;
	box-shadow:none!important;
}

.scb-game-modal-cancel{
	border:1px solid #dfe3e8!important;
	background:#fff!important;
	box-shadow:none!important;
}

.scb-game-modal-cancel:hover{
	border-color:#cfd5dc!important;
	background:#f8f9fb!important;
}

.scb-game-modal-confirm{
	border:1px solid #e95000!important;
	background:var(--scb-orange)!important;
	box-shadow:none!important;
}

.scb-game-modal-confirm:hover{
	border-color:#d94b00!important;
	background:#f25500!important;
	box-shadow:0 5px 14px rgba(255,90,0,.16)!important;
}

.scb-game-modal-actions button:focus-visible{
	outline:3px solid rgba(255,90,0,.20)!important;
	outline-offset:3px!important;
}

@media (max-width:760px){
	.scb-game-modal-card{
		border-radius:22px!important;
		border-width:1px!important;
	}
	.scb-game-modal-icon{
		border-radius:17px!important;
	}
}


/* v3.6.43 — valid compact mobile tools + fully hide Recent Colors */
@media (max-width:760px){
  .scb-editor-mode .scb-recent-title,
  .scb-editor-mode .scb-recent-colors,
  .scb-editor-mode .scb-recent-empty,
  .scb-editor-mode [class*="scb-recent-title"],
  .scb-editor-mode [class*="scb-recent-colors"],
  .scb-editor-mode [class*="scb-recent-empty"]{
    display:none !important;
    visibility:hidden !important;
    height:0 !important;
    min-height:0 !important;
    max-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    overflow:hidden !important;
  }

  .scb-editor-mode .scb-tools-section{
    margin-top:2px !important;
    margin-bottom:0 !important;
  }

  .scb-editor-mode .scb-tools{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:6px !important;
    padding:0 !important;
    margin:0 !important;
    align-items:start !important;
  }

  .scb-editor-mode .scb-tool{
    gap:5px !important;
    padding:0 !important;
    margin:0 !important;
    min-height:0 !important;
    font-size:11px !important;
    line-height:1 !important;
    font-weight:700 !important;
  }

  .scb-editor-mode .scb-tool .scb-tool-icon{
    width:52px !important;
    height:52px !important;
    min-width:52px !important;
    min-height:52px !important;
    max-width:52px !important;
    max-height:52px !important;
    flex:0 0 52px !important;
    margin:0 auto !important;
    padding:0 !important;
    border-width:1.5px !important;
    box-shadow:none !important;
  }

  .scb-editor-mode .scb-tool.is-active .scb-tool-icon{
    border-width:2px !important;
    box-shadow:none !important;
  }

  .scb-editor-mode .scb-tool .scb-tool-icon svg,
  .scb-editor-mode .scb-tool .scb-tool-icon img,
  .scb-editor-mode .scb-tool img.scb-tool-icon.scb-icon-image{
    width:27px !important;
    height:27px !important;
    min-width:27px !important;
    min-height:27px !important;
    max-width:27px !important;
    max-height:27px !important;
    flex:0 0 27px !important;
    padding:0 !important;
  }

  .scb-editor-mode .scb-tool > :last-child{
    margin:0 !important;
    line-height:1 !important;
  }
}


/* v3.6.45 — original content / AdSense-readiness pass */
.scb-eyebrow{
	display:inline-block;
	margin:0 0 12px;
	font-size:12px;
	font-weight:800;
	letter-spacing:.12em;
	text-transform:uppercase;
	color:var(--scb-orange);
}
.scb-home-hero{max-width:900px;margin:0 auto}
.scb-home-hero p{max-width:760px;margin-left:auto!important;margin-right:auto!important;line-height:1.65}
.scb-content-panel{
	border:1px solid var(--scb-line);
	border-radius:18px;
	background:#fff;
	padding:26px 28px;
	color:#4d5560;
}
.scb-content-panel h2{margin:0 0 12px!important;font-size:24px;line-height:1.2;letter-spacing:-.025em;color:#111}
.scb-content-panel p{font-size:15.5px;line-height:1.75;margin:0 0 13px!important}
.scb-content-panel p:last-child{margin-bottom:0!important}
.scb-home-intro,.scb-categories-intro{max-width:980px;margin:0 auto 30px}
.scb-section-heading{margin:34px 0 10px;text-align:left}
.scb-section-heading h2{margin:0 0 6px!important;font-size:30px;letter-spacing:-.03em}
.scb-section-heading p{margin:0!important;color:#737b86}
.scb-content-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:28px 0 34px}
.scb-number-list,.scb-clean-list{margin:0 0 18px;padding-left:20px;color:#4d5560}
.scb-number-list li,.scb-clean-list li{margin:0 0 10px;line-height:1.6}
.scb-inline-link{font-weight:800;color:#111;text-decoration:none;border-bottom:1px solid #cdd2d8;padding-bottom:2px}
.scb-inline-link:hover{color:var(--scb-orange);border-color:var(--scb-orange)}
.scb-category-copy{margin-top:34px}
.scb-editor-help{max-width:1000px;margin:32px auto 12px}
.scb-info-card.scb-guide-card{max-width:900px}
.scb-tool-guide{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:16px 0 26px}
.scb-tool-guide>div{display:flex;flex-direction:column;gap:4px;padding:16px;border:1px solid var(--scb-line);border-radius:12px;background:#fafafa}
.scb-tool-guide strong{font-size:15px;color:#111}
.scb-tool-guide span{font-size:14px;line-height:1.55;color:#626a74}
.scb-faq-list{display:grid;gap:10px;margin-top:24px}
.scb-faq-list details{border:1px solid var(--scb-line);border-radius:14px;background:#fff;padding:0 18px}
.scb-faq-list summary{cursor:pointer;list-style:none;padding:17px 28px 17px 0;font-weight:800;color:#111;position:relative}
.scb-faq-list summary::-webkit-details-marker{display:none}
.scb-faq-list summary::after{content:'+';position:absolute;right:0;top:13px;font-size:24px;font-weight:500;color:#7b838e}
.scb-faq-list details[open] summary::after{content:'–'}
.scb-faq-list details p{margin:0!important;padding:0 0 17px;font-size:15px;line-height:1.7}

@media(max-width:760px){
	.scb-content-panel{padding:20px 18px;border-radius:14px}
	.scb-content-grid{grid-template-columns:1fr;gap:12px;margin:20px 0 26px}
	.scb-section-heading{margin-top:26px}
	.scb-section-heading h2{font-size:25px}
	.scb-tool-guide{grid-template-columns:1fr}
	.scb-editor-help{margin-top:24px}
}


/* v3.6.46 — no public categories, CMP-ready footer, safer ad spacing */
.scb-home-sneaker-grid .scb-sneaker-card{
	display:flex;
	flex-direction:column;
	overflow:hidden;
}
.scb-home-sneaker-grid .scb-sneaker-card h3{
	margin:0!important;
	padding:12px 16px 16px;
	font-size:17px;
	line-height:1.25;
	text-align:center;
}
.scb-home-sneaker-grid .scb-sneaker-card h3 a{color:#111!important;text-decoration:none!important}
.scb-home-sneaker-grid .scb-sneaker-card h3 a:hover{color:var(--scb-orange)!important}
.scb-ad-safe{
	max-width:1100px;
	margin:46px auto!important;
	padding:14px 0;
	text-align:center;
	clear:both;
}
.scb-ad-label{
	margin:0 0 8px;
	font-size:10px;
	font-weight:700;
	letter-spacing:.08em;
	text-transform:uppercase;
	color:#8a919b;
}
.scb-ad-code{overflow:hidden;max-width:100%}
.scb-ad-after-editor{
	margin-top:160px!important;
}
.scb-footer-privacy-button{
	appearance:none;
	-webkit-appearance:none;
	border:0;
	padding:0;
	margin:0;
	background:transparent;
	font:inherit;
	color:#505761;
	cursor:pointer;
}
.scb-footer-privacy-button:hover{color:var(--scb-orange)}
@media(max-width:760px){
	.scb-ad-safe{margin:34px auto!important;padding:10px 0}
	.scb-ad-after-editor{margin-top:160px!important}
	.scb-home-sneaker-grid .scb-sneaker-card h3{font-size:16px;padding:10px 12px 14px}
}

.scb-ad-code>*{max-width:100%!important}


/* v3.6.47 — saved-progress cards now match editor compositing */
.scb-layered-thumb.has-local-progress{
	background:#fff!important;
	isolation:isolate!important;
}
.scb-layered-thumb.has-local-progress .scb-layered-progress{
	z-index:1!important;
	opacity:1!important;
	visibility:visible!important;
	mix-blend-mode:normal!important;
}
.scb-layered-thumb.has-local-progress.has-progress-lineart .scb-layered-base{
	display:none!important;
}
.scb-layered-thumb .scb-layered-lineart{
	position:absolute!important;
	inset:0!important;
	z-index:2!important;
	width:100%!important;
	height:100%!important;
	object-fit:contain!important;
	pointer-events:none!important;
	mix-blend-mode:normal!important;
}
.scb-layered-thumb.has-local-progress.has-progress-lineart .scb-layered-shading{
	z-index:3!important;
	mix-blend-mode:multiply!important;
	opacity:1!important;
}
/* If pixel extraction is blocked by a cross-origin image/CDN, use the
   original artwork as the fallback and suppress the extra shading layer
   so the preview is never darkened twice. */
.scb-layered-thumb.has-local-progress.progress-lineart-fallback .scb-layered-base{
	z-index:2!important;
	mix-blend-mode:multiply!important;
}
.scb-layered-thumb.has-local-progress.progress-lineart-fallback .scb-layered-shading{
	display:none!important;
}


/* v3.6.48 — mobile AdSense-safe manual slots + faster card previews */
@media (max-width:760px){
	/* Manual ads stay in normal document flow on phones; never sticky/floating. */
	.scb-ad-safe,
	.scb-ad-live,
	.scb-ad-code{
		position:static!important;
		inset:auto!important;
		float:none!important;
		transform:none!important;
		width:100%!important;
		max-width:100%!important;
		height:auto!important;
		min-height:0!important;
		overflow:visible!important;
	}
	.scb-ad-safe{
		margin:48px auto!important;
		padding:10px 0!important;
	}
	.scb-ad-code ins.adsbygoogle,
	.scb-ad-code > ins{
		display:block!important;
		width:100%!important;
		max-width:100%!important;
	}
	/* Defensive CSS fallback; PHP also avoids rendering these on mobile. */
	.scb-ad-context-painting,
	.scb-ad-context-home.scb-ad-top{
		display:none!important;
	}
	.scb-ad-label{
		margin-bottom:10px!important;
		font-size:10px!important;
	}
	/* Browser can skip layout/paint work for sneaker cards far below the fold. */
	.scb-home-sneaker-grid .scb-sneaker-card{
		content-visibility:auto;
		contain-intrinsic-size:310px;
	}
}


/* v3.6.49 — desktop pinch zoom + Space hand/pan tool */
@media (min-width:761px){
	.scb-editor-mode .scb-stage.is-space-pan-ready #scbPaintCanvas{
		cursor:grab!important;
	}
	.scb-editor-mode .scb-stage.is-space-panning #scbPaintCanvas{
		cursor:grabbing!important;
	}
	.scb-editor-mode .scb-stage.is-space-panning .scb-stage-inner{
		transition:none!important;
	}
}


/* v3.6.50 — desktop two-finger trackpad pan */
@media (min-width:761px){
	.scb-editor-mode .scb-stage{
		overscroll-behavior:contain;
	}
}


/* v3.6.51 — touch history gesture feedback */
.scb-history-actions .scb-text-button.scb-gesture-flash{
	animation:scb-history-gesture-flash .22s ease-out;
}
@keyframes scb-history-gesture-flash{
	0%{transform:scale(1);}
	45%{transform:scale(.9);}
	100%{transform:scale(1);}
}


/* v3.6.60 — performance-first Suggested Sneakers loading */
.scb-editor-strip-wrap{margin-top:14px}
.scb-editor-strip-wrap .scb-editor-strip{margin-top:0}
.scb-suggested-more-row{display:flex;justify-content:center;padding:14px 0 2px}
.scb-suggested-more{
	appearance:none;
	-webkit-appearance:none;
	border:1px solid #d9dde4;
	background:#fff;
	color:#111827;
	border-radius:999px;
	min-height:42px;
	padding:0 22px;
	font:inherit;
	font-size:14px;
	font-weight:800;
	cursor:pointer;
	box-shadow:0 1px 2px rgba(17,24,39,.04);
}
.scb-suggested-more:hover{border-color:#bfc6d0;background:#fafafa}
.scb-suggested-more:disabled{cursor:wait;opacity:.62}
@media(max-width:760px){
	.scb-suggested-more-row{padding:10px 0 0}
	.scb-suggested-more{min-height:40px;padding:0 20px;font-size:13px}
}


/* v3.6.62 — mobile Suggested Sneakers list + footer on every page */
.scb-strip-title{
	display:none;
}

@media (max-width:760px){
	/* Mobile suggestions are a vertical list, never a horizontal carousel. */
	.scb-editor-mode .scb-editor-strip-wrap{
		margin-top:12px!important;
	}
	.scb-editor-mode .scb-editor-strip{
		display:grid!important;
		grid-template-columns:1fr!important;
		gap:10px!important;
		width:100%!important;
		overflow:visible!important;
		overflow-x:visible!important;
		padding:0!important;
		margin:0!important;
		scrollbar-width:auto!important;
	}
	.scb-editor-mode .scb-editor-strip::-webkit-scrollbar{
		display:none!important;
	}
	.scb-editor-mode .scb-strip-item{
		display:grid!important;
		grid-template-columns:104px minmax(0,1fr)!important;
		align-items:center!important;
		justify-items:stretch!important;
		gap:12px!important;
		width:100%!important;
		height:100px!important;
		min-height:100px!important;
		max-width:none!important;
		flex:none!important;
		padding:8px 14px 8px 8px!important;
		border-radius:16px!important;
		background:#fff!important;
		box-sizing:border-box!important;
		text-decoration:none!important;
	}
	.scb-editor-mode .scb-strip-item .scb-strip-thumb{
		width:96px!important;
		height:82px!important;
		min-width:96px!important;
		justify-self:start!important;
	}
	.scb-editor-mode .scb-strip-title{
		display:block!important;
		min-width:0!important;
		color:#171717!important;
		font-size:14px!important;
		font-weight:800!important;
		line-height:1.25!important;
		white-space:normal!important;
		overflow-wrap:anywhere!important;
	}
	.scb-editor-mode .scb-strip-item.is-active .scb-strip-title{
		color:var(--scb-orange)!important;
	}
	.scb-editor-mode .scb-suggested-more-row{
		padding:12px 0 0!important;
	}
	.scb-editor-mode .scb-suggested-more{
		width:100%!important;
		min-height:44px!important;
		border-radius:14px!important;
	}

	/* Keep the real site footer visible on every mobile page, including editor mode. */
	.scb-footer,
	.scb-editor-mode .scb-footer{
		display:block!important;
		visibility:visible!important;
		opacity:1!important;
	}
	.scb-footer-inner,
	.scb-editor-mode .scb-footer-inner{
		display:flex!important;
		flex-direction:column!important;
		align-items:flex-start!important;
		gap:14px!important;
		padding:22px 16px!important;
	}
	.scb-footer-inner > div,
	.scb-editor-mode .scb-footer-inner > div{
		display:flex!important;
		flex-wrap:wrap!important;
		gap:10px 16px!important;
	}
}


/* v3.6.63 — mobile Suggested Sneakers: 4 per row */
@media (max-width:760px){
	.scb-editor-mode .scb-editor-strip,
	.scb-editor-mode .scb-suggested-strip,
	.scb-editor-mode .scb-suggested-list{
		display:grid!important;
		grid-template-columns:repeat(4,minmax(0,1fr))!important;
		gap:8px!important;
		width:100%!important;
		overflow:visible!important;
		overflow-x:visible!important;
		scroll-snap-type:none!important;
		padding:0!important;
	}

	.scb-editor-mode .scb-strip-item{
		display:flex!important;
		flex-direction:column!important;
		align-items:center!important;
		justify-content:flex-start!important;
		width:100%!important;
		min-width:0!important;
		max-width:none!important;
		margin:0!important;
		padding:5px!important;
		gap:5px!important;
		border-radius:12px!important;
	}

	.scb-editor-mode .scb-strip-item .scb-layered-thumb{
		width:100%!important;
		aspect-ratio:1 / 1!important;
		height:auto!important;
		min-height:0!important;
		border-radius:10px!important;
	}

	.scb-editor-mode .scb-strip-item .scb-layered-thumb img,
	.scb-editor-mode .scb-strip-item .scb-layered-base,
	.scb-editor-mode .scb-strip-item .scb-layered-shading,
	.scb-editor-mode .scb-strip-item .scb-layered-progress{
		width:100%!important;
		height:100%!important;
		object-fit:contain!important;
	}

	.scb-editor-mode .scb-strip-item .scb-strip-title,
	.scb-editor-mode .scb-strip-item > span:not(.scb-layered-thumb){
		display:block!important;
		width:100%!important;
		font-size:10px!important;
		line-height:1.15!important;
		text-align:center!important;
		white-space:nowrap!important;
		overflow:hidden!important;
		text-overflow:ellipsis!important;
	}

	.scb-editor-mode .scb-suggested-more,
	.scb-editor-mode .scb-show-more-wrap{
		grid-column:1 / -1!important;
	}
}

@media (max-width:390px){
	.scb-editor-mode .scb-editor-strip,
	.scb-editor-mode .scb-suggested-strip,
	.scb-editor-mode .scb-suggested-list{
		gap:6px!important;
	}
	.scb-editor-mode .scb-strip-item{
		padding:4px!important;
	}
	.scb-editor-mode .scb-strip-item .scb-strip-title,
	.scb-editor-mode .scb-strip-item > span:not(.scb-layered-thumb){
		font-size:9px!important;
	}
}


/* v3.6.64 — individual Suggested Sneaker loading states */
.scb-strip-item[data-scb-suggested-card="1"]{
	position:relative!important;
	overflow:hidden;
}

.scb-suggested-card-loader{
	position:absolute;
	inset:0;
	z-index:20;
	display:flex;
	align-items:center;
	justify-content:center;
	background:rgba(255,255,255,.97);
	opacity:0;
	visibility:hidden;
	pointer-events:none;
	transition:opacity .16s ease,visibility .16s ease;
}

.scb-strip-item.is-scb-loading .scb-suggested-card-loader{
	opacity:1;
	visibility:visible;
}

.scb-suggested-card-spinner{
	width:26px;
	height:26px;
	border-radius:50%;
	border:3px solid #e7e9ed;
	border-top-color:var(--scb-orange);
	animation:scbSuggestedCardSpin .72s linear infinite;
}

@keyframes scbSuggestedCardSpin{
	to{transform:rotate(360deg)}
}

.scb-strip-item.is-scb-loading .scb-layered-thumb,
.scb-strip-item.is-scb-loading .scb-strip-title{
	visibility:hidden!important;
}

.scb-strip-item.is-scb-loaded .scb-layered-thumb,
.scb-strip-item.is-scb-loaded .scb-strip-title{
	visibility:visible;
}

@media (max-width:760px){
	.scb-suggested-card-spinner{
		width:22px;
		height:22px;
		border-width:2.5px;
	}
	.scb-suggested-card-loader{
		border-radius:12px;
	}
}

@media (prefers-reduced-motion:reduce){
	.scb-suggested-card-spinner{
		animation-duration:1.4s;
	}
}


/* v3.6.65 — guarantee footer on mobile Color Sneaker page */
@media (max-width:760px){
	body.scb-editor-mode .scb-site{
		min-height:100vh!important;
		height:auto!important;
		overflow:visible!important;
	}
	body.scb-editor-mode .scb-main{
		height:auto!important;
		overflow:visible!important;
	}
	body.scb-editor-mode .scb-footer{
		display:block!important;
		visibility:visible!important;
		opacity:1!important;
		position:relative!important;
		width:100%!important;
		margin-top:24px!important;
		border-top:1px solid #eee!important;
		background:#fff!important;
		z-index:1!important;
	}
	body.scb-editor-mode .scb-footer-inner{
		display:flex!important;
		flex-direction:column!important;
		align-items:flex-start!important;
		gap:14px!important;
		padding:22px 16px 28px!important;
	}
	body.scb-editor-mode .scb-footer-inner > div{
		display:flex!important;
		flex-wrap:wrap!important;
		gap:10px 16px!important;
	}
}


/* v3.6.66 — repair Suggested Sneaker loader visibility/layout */
.scb-strip-item[data-scb-suggested-card="1"] .scb-suggested-card-loader{
	display:flex!important;
	position:absolute!important;
	inset:0!important;
	width:auto!important;
	height:auto!important;
	min-width:0!important;
	min-height:0!important;
	align-items:center!important;
	justify-content:center!important;
	font-size:0!important;
	line-height:0!important;
	text-align:center!important;
	white-space:normal!important;
	overflow:hidden!important;
	text-overflow:clip!important;
	background:#fff!important;
	z-index:50!important;
	border-radius:inherit!important;
}

.scb-strip-item[data-scb-suggested-card="1"].is-scb-loading .scb-suggested-card-loader{
	opacity:1!important;
	visibility:visible!important;
}

.scb-strip-item[data-scb-suggested-card="1"].is-scb-loaded .scb-suggested-card-loader{
	opacity:0!important;
	visibility:hidden!important;
}

.scb-strip-item[data-scb-suggested-card="1"] .scb-suggested-card-spinner{
	display:block!important;
	width:28px!important;
	height:28px!important;
	min-width:28px!important;
	min-height:28px!important;
	border:3px solid #e6e8ec!important;
	border-top-color:var(--scb-orange)!important;
	border-radius:50%!important;
	animation:scbSuggestedCardSpin .68s linear infinite!important;
}

@media (max-width:760px){
	.scb-editor-mode .scb-strip-item[data-scb-suggested-card="1"] > .scb-suggested-card-loader{
		display:flex!important;
		width:auto!important;
		font-size:0!important;
		line-height:0!important;
		white-space:normal!important;
		text-overflow:clip!important;
	}
	.scb-editor-mode .scb-strip-item[data-scb-suggested-card="1"] .scb-suggested-card-spinner{
		width:22px!important;
		height:22px!important;
		min-width:22px!important;
		min-height:22px!important;
		border-width:2.5px!important;
	}
}


/* v3.6.74 — Suggested Sneakers use the same desktop hover motion as homepage cards */
@media (min-width:761px) and (hover:hover){
	.scb-editor-mode .scb-strip-item[data-scb-suggested-card="1"]{
		transition:.16s transform,.16s box-shadow!important;
	}
	.scb-editor-mode .scb-strip-item[data-scb-suggested-card="1"].is-scb-loaded:hover{
		transform:translateY(-3px)!important;
		box-shadow:0 14px 30px rgba(20,22,28,.08)!important;
	}
}