.sbp-board {
	--sbp-card-radius: 20px;
	--sbp-border: rgba(96, 83, 110, .18);
	--sbp-shadow: 0 16px 40px rgba(40, 28, 54, .10);
	--sbp-fill: 0%;
	--sbp-liquid-color: #ffd84d;
	box-sizing: border-box;
	max-width: 100%;
	margin: 1.5rem 0;
	padding: clamp(14px, 3vw, 24px);
	border: 1px solid var(--sbp-border);
	border-radius: 24px;
	background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(253,249,253,.92));
	box-shadow: var(--sbp-shadow);
	color: #2f2837;
}

.sbp-board *,
.sbp-board *::before,
.sbp-board *::after {
	box-sizing: border-box;
}

.sbp-board-title {
	margin: 0 0 1rem;
	font-size: clamp(1.25rem, 2vw, 1.7rem);
	line-height: 1.35;
}

.sbp-toolbar {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	align-items: center;
	justify-content: flex-end;
	margin-bottom: 16px;
}

.sbp-save-status {
	margin-right: auto;
	font-size: .92rem;
	color: #695f72;
}

.sbp-button {
	appearance: none;
	border: 1px solid rgba(95, 82, 112, .22);
	border-radius: 999px;
	background: #fff;
	color: #34293d;
	font: inherit;
	font-size: .9rem;
	line-height: 1;
	padding: .62rem .9rem;
	cursor: pointer;
	box-shadow: 0 3px 10px rgba(33, 25, 43, .06);
	transition: transform .16s ease, box-shadow .16s ease, background .16s ease;
}

.sbp-button:hover,
.sbp-button:focus-visible {
	background: #fff7fb;
	box-shadow: 0 6px 18px rgba(33, 25, 43, .10);
	transform: translateY(-1px);
}

.sbp-button:disabled {
	cursor: not-allowed;
	opacity: .55;
	transform: none;
}

.sbp-grid {
	display: grid;
	grid-template-columns: repeat(var(--sbp-cols), minmax(100px, 1fr));
	gap: clamp(10px, 2vw, 18px);
	align-items: stretch;
}

.sbp-bottle-card {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	min-width: 0;
	padding: clamp(10px, 2vw, 16px) clamp(8px, 2vw, 12px);
	border: 1px solid rgba(105, 91, 120, .15);
	border-radius: var(--sbp-card-radius);
	background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,250,253,.92));
	box-shadow: 0 9px 28px rgba(41, 31, 56, .075);
	outline: none;
	transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.sbp-is-editable .sbp-bottle-card {
	cursor: pointer;
}

.sbp-is-editable .sbp-bottle-card:hover,
.sbp-bottle-card:focus-visible {
	border-color: rgba(255, 111, 174, .42);
	box-shadow: 0 14px 34px rgba(255, 111, 174, .13), 0 5px 16px rgba(41,31,56,.09);
	transform: translateY(-1px);
}

.sbp-bottle-svg-wrap {
	width: min(100%, 118px);
	max-width: 118px;
	aspect-ratio: 2 / 3;
}

.sbp-bottle-svg {
	display: block;
	width: 100%;
	height: 100%;
	touch-action: none;
	-webkit-tap-highlight-color: transparent;
}

.sbp-glass-fill {
	fill: rgba(255,255,255,.42);
}

.sbp-glass-line,
.sbp-neck-line {
	fill: none;
	stroke: rgba(68, 57, 80, .46);
	stroke-width: 3.2;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.sbp-neck-line {
	stroke-width: 2.2;
	opacity: .55;
}

.sbp-highlight {
	fill: none;
	stroke: rgba(255,255,255,.9);
	stroke-width: 4;
	stroke-linecap: round;
	opacity: .9;
}

.sbp-shine {
	fill: rgba(255,255,255,.7);
	opacity: .18;
	transform-origin: center;
	transition: opacity .2s ease, transform .2s ease;
}

.sbp-bottle-card.sbp-full .sbp-shine {
	opacity: .48;
	transform: scale(1.08);
}

.sbp-liquid-rect,
.sbp-wave-path {
	transition: fill .2s ease;
}

.sbp-wave-path {
	filter: drop-shadow(0 -1px 2px rgba(255,255,255,.35));
}

.sbp-bubbles circle {
	fill: rgba(255,255,255,.86);
}

.sbp-bubble-one {
	animation: sbp-bubble-drift 3.4s ease-in-out infinite;
}
.sbp-bubble-two {
	animation: sbp-bubble-drift 4.1s ease-in-out infinite reverse;
}
.sbp-bubble-three {
	animation: sbp-bubble-drift 3.8s ease-in-out infinite;
}

.sbp-brush-feedback {
	fill: var(--sbp-liquid-color);
	opacity: 0;
	pointer-events: none;
}

.sbp-bottle-card.sbp-painting .sbp-brush-feedback {
	opacity: .22;
}

.sbp-hit-target {
	fill: transparent;
	pointer-events: all;
}

.sbp-bottle-meta {
	display: grid;
	gap: 4px;
	justify-items: center;
	width: 100%;
}

.sbp-bottle-label,
.sbp-label-input {
	max-width: 100%;
	font-weight: 700;
	font-size: clamp(.84rem, 2vw, .98rem);
	line-height: 1.35;
	text-align: center;
	word-break: keep-all;
	overflow-wrap: anywhere;
}

.sbp-label-input {
	width: 100%;
	border: 1px solid rgba(105, 91, 120, .22);
	border-radius: 10px;
	padding: .35rem .45rem;
	background: rgba(255,255,255,.8);
	color: inherit;
}

.sbp-percentage {
	font-size: .78rem;
	color: #766b80;
}

.sbp-hidden-percentage {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	white-space: nowrap;
}

.sbp-visually-hidden {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

.sbp-theme-simple {
	background: #fff;
	box-shadow: none;
}

.sbp-theme-simple .sbp-bottle-card {
	box-shadow: none;
	background: #fff;
}

.sbp-theme-simple .sbp-glass-fill {
	fill: rgba(255,255,255,.15);
}

.sbp-theme-mono {
	--sbp-liquid-color: #555;
	background: #fff;
	filter: grayscale(1);
}

.sbp-theme-mono .sbp-bottle-card {
	box-shadow: none;
}

.sbp-error {
	padding: 12px 14px;
	border: 1px solid #d63638;
	border-radius: 8px;
	background: #fff5f5;
	color: #8a2424;
}

@keyframes sbp-bubble-drift {
	0%, 100% { transform: translateY(0); opacity: .25; }
	50% { transform: translateY(-7px); opacity: .6; }
}

@media (max-width: 820px) {
	.sbp-grid {
		grid-template-columns: repeat(auto-fit, minmax(112px, 1fr));
	}
}

@media (max-width: 520px) {
	.sbp-board {
		padding: 12px;
		border-radius: 18px;
	}

	.sbp-toolbar {
		justify-content: stretch;
	}

	.sbp-save-status {
		flex-basis: 100%;
		margin-right: 0;
	}

	.sbp-button {
		flex: 1 1 auto;
	}

	.sbp-grid {
		grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
		gap: 10px;
	}

	.sbp-bottle-card {
		padding: 10px 8px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.sbp-board *,
	.sbp-board *::before,
	.sbp-board *::after {
		animation-duration: .001ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
		transition-duration: .001ms !important;
	}
}

/* v2 example / entertainment / liquid physics */
.sbp-board-heading {
	text-align: center;
	margin: 0 0 14px;
}

.sbp-board-description {
	max-width: 760px;
	margin: 6px auto 0;
	color: #6e6174;
	font-size: 14px;
	line-height: 1.7;
}

.sbp-board--example {
	outline: 1px solid rgba(255, 111, 174, .22);
}

.sbp-flip-enable {
	background: linear-gradient(180deg, #fff, #fff7fb);
}

.sbp-liquid-body,
.sbp-liquid-surface,
.sbp-liquid-puddle,
.sbp-liquid-meniscus,
.sbp-liquid-highlight {
	transition: opacity .22s ease;
}

.sbp-liquid-highlight {
	mix-blend-mode: screen;
}

.sbp-pointer-target,
.sbp-hit-target {
	fill: transparent;
	pointer-events: all;
	touch-action: none;
}

.sbp-bottle-card.sbp-pulling .sbp-bottle-svg-wrap {
	filter: drop-shadow(0 10px 18px rgba(255, 111, 174, .18));
}

.sbp-bottle--full-shine .sbp-shine {
	animation: sbp-full-shine 1.05s ease-out 1;
}

@keyframes sbp-full-shine {
	0% { opacity: .2; transform: scale(.85); }
	35% { opacity: .92; transform: scale(1.2); }
	100% { opacity: .22; transform: scale(1); }
}

.sbp-emotion-layer {
	position: fixed;
	inset: 0;
	pointer-events: none;
	z-index: 9999;
	overflow: hidden;
}

.sbp-floating-thought {
	position: fixed;
	left: 0;
	top: 0;
	max-width: min(260px, 72vw);
	padding: 8px 12px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .9);
	border: 1px solid rgba(255, 111, 174, .18);
	box-shadow: 0 10px 26px rgba(70, 54, 82, .13);
	color: #382c42;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.45;
	letter-spacing: .02em;
	backdrop-filter: blur(9px);
	transform: translate(-50%, -50%) scale(.75);
	animation: sbp-thought-fall var(--sbp-thought-duration, 10000ms) cubic-bezier(.2, .8, .2, 1) forwards;
	will-change: transform, opacity;
	pointer-events: none;
	white-space: normal;
}

.sbp-floating-thought--bubble {
	border-radius: 18px 18px 18px 6px;
	background: rgba(247, 252, 255, .92);
	border-color: rgba(100, 199, 188, .24);
}

.sbp-floating-thought--sparkle {
	background: rgba(255, 252, 239, .92);
	border-color: rgba(244, 162, 97, .28);
}

.sbp-floating-thought--calm {
	background: rgba(255, 255, 255, .84);
	border-color: rgba(120, 110, 130, .2);
	font-weight: 600;
}

.sbp-floating-thought--rain {
	font-size: 12px;
	padding: 7px 10px;
}

@keyframes sbp-thought-fall {
	0% {
		opacity: 0;
		transform: translate(-50%, -50%) scale(.74) rotate(0deg);
	}
	7% {
		opacity: 1;
		transform: translate(-50%, -50%) scale(1.02) rotate(0deg);
	}
	82% {
		opacity: .94;
	}
	100% {
		opacity: 0;
		transform: translate(calc(-50% + var(--sbp-thought-drift-x, 32px)), calc(-50% + var(--sbp-thought-fall-y, 220px))) scale(.98) rotate(var(--sbp-thought-rotate, 8deg));
	}
}

.sbp-drop-particle {
	position: fixed;
	width: 7px;
	height: 7px;
	border-radius: 999px;
	opacity: .72;
	box-shadow: 0 0 0 3px rgba(255,255,255,.32);
	transform: translate(-50%, -50%);
	animation: sbp-drop-particle 1200ms ease-out forwards;
}

@keyframes sbp-drop-particle {
	0% { opacity: .8; transform: translate(-50%, -50%) scale(.7); }
	100% { opacity: 0; transform: translate(calc(-50% + var(--sbp-particle-x, 0px)), calc(-50% + var(--sbp-particle-y, 70px))) scale(.2); }
}

.sbp-liquid-tether {
	position: fixed;
	height: 7px;
	border-radius: 999px;
	transform-origin: left center;
	opacity: .58;
	filter: blur(.2px) drop-shadow(0 5px 8px rgba(255, 111, 174, .16));
}

.sbp-liquid-tether::after {
	content: "";
	position: absolute;
	right: -7px;
	top: 50%;
	width: 12px;
	height: 12px;
	border-radius: 999px;
	background: inherit;
	transform: translateY(-50%);
}

.sbp-liquid-tether--release {
	animation: sbp-tether-release .24s ease-out forwards;
}

@keyframes sbp-tether-release {
	to { opacity: 0; transform: scaleX(.35); }
}

.sbp-board--flipping .sbp-grid {
	animation: sbp-board-flip .85s cubic-bezier(.2, .9, .2, 1);
}

@keyframes sbp-board-flip {
	0% { transform: rotate(0deg) scale(1); }
	35% { transform: rotate(5deg) scale(1.01); }
	62% { transform: rotate(-3deg) scale(1.01); }
	100% { transform: rotate(0deg) scale(1); }
}

.sbp-theme-mono .sbp-floating-thought {
	background: rgba(255, 255, 255, .94);
	border-color: rgba(0, 0, 0, .18);
	color: #222;
}

.sbp-theme-mono .sbp-liquid-highlight,
.sbp-theme-simple .sbp-liquid-highlight {
	opacity: .08 !important;
}

.sbp-board--physics-off .sbp-liquid-bubbles,
.sbp-board--physics-off .sbp-liquid-highlight,
.sbp-board--physics-off .sbp-liquid-meniscus {
	display: none;
}

@media (max-width: 520px) {
	.sbp-floating-thought {
		font-size: 12px;
		max-width: 68vw;
	}
}

@media (prefers-reduced-motion: reduce) {
	.sbp-floating-thought {
		animation-name: sbp-thought-fade;
	}
	.sbp-drop-particle,
	.sbp-liquid-tether,
	.sbp-board--flipping .sbp-grid {
		animation-duration: .001ms !important;
	}
}

@keyframes sbp-thought-fade {
	0% { opacity: 0; transform: translate(-50%, -50%) scale(.98); }
	15% { opacity: 1; }
	100% { opacity: 0; transform: translate(-50%, calc(-50% + 40px)) scale(.98); }
}

/* v2.1 dark neon direction: one continuous board, not individual cards. */
.sbp-board {
	--sbp-card-radius: 0;
	--sbp-border: rgba(126, 88, 255, .26);
	--sbp-shadow: 0 28px 80px rgba(0, 0, 0, .48), inset 0 0 42px rgba(255, 111, 174, .055);
	position: relative;
	isolation: isolate;
	border-color: var(--sbp-border);
	background:
		radial-gradient(circle at 16% 0%, rgba(255, 74, 199, .18), transparent 33%),
		radial-gradient(circle at 82% 12%, rgba(0, 220, 255, .14), transparent 36%),
		linear-gradient(180deg, rgba(8, 8, 20, .98), rgba(13, 10, 24, .97) 48%, rgba(5, 4, 12, .98));
	box-shadow: var(--sbp-shadow);
	color: #f1ecff;
}

.sbp-board::before {
	content: "";
	position: absolute;
	inset: 1px;
	z-index: -1;
	border-radius: inherit;
	background:
		linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px),
		linear-gradient(0deg, rgba(255,255,255,.035) 1px, transparent 1px);
	background-size: 34px 34px;
	mask-image: radial-gradient(circle at 50% 15%, #000, transparent 78%);
	opacity: .38;
}

.sbp-board-title {
	color: #f7f2ff;
	letter-spacing: .04em;
	text-shadow: 0 0 18px rgba(255, 111, 224, .32), 0 0 30px rgba(83, 226, 255, .16);
}

.sbp-board-description,
.sbp-save-status,
.sbp-percentage {
	color: rgba(222, 216, 245, .72);
}

.sbp-toolbar {
	border: 1px solid rgba(164, 132, 255, .12);
	border-radius: 999px;
	padding: 8px;
	background: rgba(6, 7, 18, .48);
	box-shadow: inset 0 0 24px rgba(0, 220, 255, .04);
}

.sbp-button,
.sbp-flip-enable {
	border-color: rgba(173, 128, 255, .26);
	background: linear-gradient(180deg, rgba(24, 20, 42, .94), rgba(10, 9, 22, .94));
	color: #efeaff;
	box-shadow: 0 0 0 1px rgba(255, 111, 224, .05), 0 8px 22px rgba(0,0,0,.28), inset 0 0 14px rgba(83, 226, 255, .035);
}

.sbp-button:hover,
.sbp-button:focus-visible {
	background: linear-gradient(180deg, rgba(35, 27, 58, .98), rgba(14, 12, 28, .98));
	box-shadow: 0 0 20px rgba(255, 111, 224, .22), 0 12px 26px rgba(0,0,0,.34), inset 0 0 16px rgba(83, 226, 255, .06);
	transform: translateY(-1px);
}

.sbp-grid {
	gap: clamp(14px, 2.4vw, 26px);
	align-items: end;
}

.sbp-bottle-card,
.sbp-theme-simple .sbp-bottle-card,
.sbp-theme-mono .sbp-bottle-card {
	padding: clamp(6px, 1.4vw, 12px) clamp(4px, 1.3vw, 10px);
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	border-radius: 0 !important;
	transform: none;
	-webkit-user-drag: none;
	user-select: none;
	-webkit-user-select: none;
	cursor: default;
}

.sbp-is-editable .sbp-bottle-card {
	cursor: crosshair;
}

.sbp-is-editable .sbp-bottle-card:hover,
.sbp-bottle-card:focus-visible {
	border-color: transparent !important;
	box-shadow: none !important;
	transform: none !important;
}

.sbp-bottle-card:focus-visible {
	outline: 2px solid rgba(87, 223, 255, .76);
	outline-offset: 5px;
}

.sbp-bottle-svg-wrap {
	width: min(100%, 138px);
	max-width: 138px;
	filter: drop-shadow(0 0 10px var(--sbp-liquid-color)) drop-shadow(0 20px 26px rgba(0, 0, 0, .32));
	-webkit-user-drag: none;
	user-select: none;
}

.sbp-bottle-svg,
.sbp-bottle-svg * {
	-webkit-user-drag: none;
	user-select: none;
}

.sbp-bottle-svg {
	filter: drop-shadow(0 0 2px rgba(255,255,255,.12));
}

.sbp-glass-fill {
	fill: rgba(7, 10, 22, .30);
}

.sbp-glass-line,
.sbp-neck-line {
	stroke: var(--sbp-liquid-color);
	stroke-width: 3;
	opacity: .88;
	filter: drop-shadow(0 0 3px var(--sbp-liquid-color)) drop-shadow(0 0 12px var(--sbp-liquid-color));
}

.sbp-neck-line {
	stroke-width: 1.9;
	opacity: .78;
}

.sbp-highlight,
.sbp-glass-highlight {
	stroke: rgba(226, 248, 255, .72);
	stroke-width: 3.2;
	opacity: .76;
	filter: drop-shadow(0 0 8px rgba(117, 232, 255, .24));
}

.sbp-liquid-group {
	filter: drop-shadow(0 0 7px var(--sbp-liquid-color)) drop-shadow(0 0 20px var(--sbp-liquid-color));
}

.sbp-liquid-body,
.sbp-liquid-surface,
.sbp-liquid-puddle {
	filter: saturate(1.35) brightness(1.1);
}

.sbp-liquid-meniscus {
	filter: drop-shadow(0 0 8px var(--sbp-liquid-color));
}

.sbp-liquid-highlight {
	mix-blend-mode: screen;
	opacity: .5;
}

.sbp-bubbles circle {
	fill: rgba(235, 255, 255, .92);
	filter: drop-shadow(0 0 6px rgba(255,255,255,.36));
}

.sbp-brush-feedback {
	filter: drop-shadow(0 0 10px var(--sbp-liquid-color));
}

.sbp-bottle-card.sbp-pulling .sbp-bottle-svg-wrap,
.sbp-bottle-card.sbp-painting .sbp-bottle-svg-wrap {
	filter: drop-shadow(0 0 13px var(--sbp-liquid-color)) drop-shadow(0 0 32px var(--sbp-liquid-color));
}

.sbp-bottle-label,
.sbp-label-input {
	color: #f4eeff;
	font-weight: 800;
	letter-spacing: .045em;
	text-shadow: 0 0 8px rgba(255, 111, 224, .26), 0 0 18px rgba(79, 223, 255, .16);
}

.sbp-label-input {
	border-color: rgba(128, 206, 255, .22);
	background: rgba(8, 10, 23, .72);
	box-shadow: inset 0 0 14px rgba(255,255,255,.03);
}

.sbp-percentage {
	font-size: .76rem;
	letter-spacing: .04em;
	text-shadow: 0 0 8px rgba(83, 226, 255, .22);
}

.sbp-theme-simple,
.sbp-theme-mono {
	background:
		radial-gradient(circle at 50% 0%, rgba(110, 115, 255, .13), transparent 40%),
		linear-gradient(180deg, #070912, #05050a);
	color: #f1ecff;
	box-shadow: var(--sbp-shadow);
}

.sbp-theme-simple .sbp-glass-fill {
	fill: rgba(7, 10, 22, .22);
}

.sbp-theme-mono {
	--sbp-liquid-color: #aee8ff;
	filter: none;
}

.sbp-theme-mono .sbp-glass-line,
.sbp-theme-mono .sbp-neck-line {
	stroke: #d8f2ff;
	filter: drop-shadow(0 0 7px rgba(216, 242, 255, .45));
}

.sbp-board--example {
	outline: 1px solid rgba(126, 88, 255, .34);
	box-shadow: 0 28px 85px rgba(0,0,0,.52), 0 0 45px rgba(255, 111, 224, .08), inset 0 0 42px rgba(83, 226, 255, .035);
}

.sbp-floating-thought {
	padding: 9px 14px;
	border-radius: 999px;
	background: linear-gradient(135deg, rgba(12, 14, 30, .94), rgba(36, 17, 52, .88));
	border: 1px solid rgba(255, 111, 224, .34);
	box-shadow: 0 0 18px rgba(255, 111, 224, .18), 0 0 28px rgba(83, 226, 255, .10), 0 16px 40px rgba(0,0,0,.42);
	color: #fff6ff;
	text-shadow: 0 0 9px rgba(255, 111, 224, .32), 0 0 16px rgba(83, 226, 255, .18);
	font-weight: 800;
	letter-spacing: .055em;
	animation-duration: var(--sbp-thought-duration, 10000ms);
}

.sbp-floating-thought--bubble {
	background: linear-gradient(135deg, rgba(8, 28, 42, .92), rgba(14, 12, 35, .90));
	border-color: rgba(83, 226, 255, .36);
}

.sbp-floating-thought--sparkle {
	background: linear-gradient(135deg, rgba(38, 24, 48, .93), rgba(12, 13, 31, .90));
	border-color: rgba(255, 210, 111, .36);
}

.sbp-floating-thought--calm {
	background: rgba(10, 12, 25, .90);
	border-color: rgba(199, 183, 255, .26);
	color: #f4f1ff;
}

.sbp-liquid-tether {
	height: 5px;
	opacity: .70;
	filter: blur(.15px) drop-shadow(0 0 8px var(--sbp-liquid-color)) drop-shadow(0 0 20px var(--sbp-liquid-color));
}

.sbp-liquid-tether::after {
	width: 14px;
	height: 14px;
	box-shadow: 0 0 14px currentColor;
}

.sbp-drop-particle {
	box-shadow: 0 0 10px currentColor, 0 0 20px currentColor;
	animation-duration: 2200ms;
}

@keyframes sbp-thought-fall {
	0% {
		opacity: 0;
		transform: translate(-50%, -50%) scale(.72) rotate(0deg);
	}
	5% {
		opacity: 1;
		transform: translate(-50%, -50%) scale(1.03) rotate(0deg);
	}
	78% {
		opacity: .96;
	}
	100% {
		opacity: 0;
		transform: translate(calc(-50% + var(--sbp-thought-drift-x, 56px)), calc(-50% + var(--sbp-thought-fall-y, 420px))) scale(.96) rotate(var(--sbp-thought-rotate, 8deg));
	}
}

@media (max-width: 520px) {
	.sbp-toolbar {
		border-radius: 18px;
	}
	.sbp-floating-thought {
		font-size: 12px;
		max-width: 74vw;
	}
}

@media (prefers-reduced-motion: reduce) {
	.sbp-floating-thought {
		animation-duration: var(--sbp-thought-duration, 4200ms);
	}
}

/* v2.2 refined dark neon: clearer alchemical bottle silhouette and calmer glow. */
.sbp-board {
	--sbp-border: rgba(151, 119, 255, .34);
	--sbp-shadow: 0 32px 96px rgba(0, 0, 0, .54), inset 0 0 48px rgba(85, 214, 255, .045), inset 0 0 70px rgba(255, 74, 199, .038);
	background:
		radial-gradient(circle at 14% -6%, rgba(255, 76, 205, .16), transparent 34%),
		radial-gradient(circle at 86% 3%, rgba(75, 229, 255, .14), transparent 34%),
		linear-gradient(180deg, rgba(7, 8, 20, .985), rgba(13, 11, 27, .98) 46%, rgba(5, 5, 13, .99));
}

.sbp-board::before {
	opacity: .30;
	background-size: 42px 42px;
}

.sbp-grid {
	gap: clamp(12px, 2.1vw, 24px);
}

.sbp-bottle-svg-wrap {
	width: min(100%, 150px);
	max-width: 150px;
	filter:
		drop-shadow(0 0 7px color-mix(in srgb, var(--sbp-liquid-color) 70%, transparent))
		drop-shadow(0 18px 22px rgba(0, 0, 0, .36));
	will-change: filter;
}

@supports not (color: color-mix(in srgb, #fff 50%, #000)) {
	.sbp-bottle-svg-wrap {
		filter: drop-shadow(0 0 8px var(--sbp-liquid-color)) drop-shadow(0 18px 22px rgba(0, 0, 0, .36));
	}
}

.sbp-bottle-svg {
	overflow: visible;
	shape-rendering: geometricPrecision;
}

.sbp-glass-fill {
	fill: rgba(8, 12, 28, .20);
}

.sbp-glass-line,
.sbp-bottle-outline {
	stroke-width: 2.45;
	opacity: .96;
	filter: drop-shadow(0 0 2px var(--sbp-liquid-color)) drop-shadow(0 0 8px var(--sbp-liquid-color));
	vector-effect: non-scaling-stroke;
}

.sbp-bottle-core-line {
	fill: none;
	stroke: rgba(231, 251, 255, .64);
	stroke-width: .8;
	stroke-linecap: round;
	stroke-linejoin: round;
	opacity: .78;
	pointer-events: none;
	filter: drop-shadow(0 0 4px rgba(185, 240, 255, .20));
	vector-effect: non-scaling-stroke;
}

.sbp-neck-line {
	stroke-width: 1.35;
	opacity: .82;
	filter: drop-shadow(0 0 3px var(--sbp-liquid-color));
	vector-effect: non-scaling-stroke;
}

.sbp-highlight,
.sbp-glass-highlight {
	stroke-width: 2.45;
	opacity: .70;
	filter: drop-shadow(0 0 5px rgba(205, 248, 255, .20));
	vector-effect: non-scaling-stroke;
}

.sbp-shine {
	fill: rgba(235, 255, 255, .52);
	opacity: .18;
	filter: blur(.3px) drop-shadow(0 0 6px rgba(225, 255, 255, .18));
}

.sbp-liquid-group {
	filter: drop-shadow(0 0 5px var(--sbp-liquid-color)) drop-shadow(0 0 16px color-mix(in srgb, var(--sbp-liquid-color) 72%, transparent));
}

@supports not (color: color-mix(in srgb, #fff 50%, #000)) {
	.sbp-liquid-group {
		filter: drop-shadow(0 0 6px var(--sbp-liquid-color)) drop-shadow(0 0 16px var(--sbp-liquid-color));
	}
}

.sbp-liquid-body,
.sbp-liquid-surface,
.sbp-liquid-puddle {
	filter: saturate(1.22) brightness(1.08);
}

.sbp-liquid-surface {
	mix-blend-mode: screen;
}

.sbp-liquid-meniscus {
	stroke-width: 1.75;
	opacity: .54;
	filter: drop-shadow(0 0 5px var(--sbp-liquid-color));
	vector-effect: non-scaling-stroke;
}

.sbp-liquid-highlight {
	stroke-width: 4.2;
	opacity: .46;
	filter: blur(.15px) drop-shadow(0 0 8px rgba(255, 255, 255, .16));
}

.sbp-bubbles circle {
	opacity: .78;
	filter: drop-shadow(0 0 4px rgba(255,255,255,.28));
}

.sbp-bottle-card.sbp-pulling .sbp-bottle-svg-wrap,
.sbp-bottle-card.sbp-painting .sbp-bottle-svg-wrap {
	filter: drop-shadow(0 0 10px var(--sbp-liquid-color)) drop-shadow(0 0 24px color-mix(in srgb, var(--sbp-liquid-color) 68%, transparent));
}

.sbp-bottle-label,
.sbp-label-input {
	color: #fbf7ff;
	text-shadow: 0 0 5px rgba(255, 111, 224, .24), 0 0 10px rgba(79, 223, 255, .12);
}

.sbp-percentage {
	color: rgba(232, 242, 255, .76);
	text-shadow: 0 0 5px rgba(83, 226, 255, .18);
}

.sbp-floating-thought {
	animation-duration: var(--sbp-thought-duration, 10000ms);
}

/* v2.3 supplied bottle silhouette: khaki outline, yellow liquid, professional cap-safe mask. */
.sbp-board {
	--sbp-liquid-color: #ffd84d;
	--sbp-bottle-line-color: #f0e68c;
}

.sbp-bottle-svg-wrap {
	width: min(100%, 152px);
	max-width: 152px;
	filter:
		drop-shadow(0 0 5px rgba(240, 230, 140, .54))
		drop-shadow(0 0 13px rgba(255, 216, 77, .22))
		drop-shadow(0 20px 24px rgba(0, 0, 0, .38));
}

.sbp-glass-line,
.sbp-bottle-outline,
.sbp-neck-line {
	stroke: var(--sbp-bottle-line-color, #f0e68c) !important;
	filter:
		drop-shadow(0 0 2px rgba(240, 230, 140, .78))
		drop-shadow(0 0 8px rgba(240, 230, 140, .38)) !important;
}

.sbp-bottle-core-line {
	stroke: rgba(255, 255, 224, .70);
	opacity: .70;
}

.sbp-glass-fill {
	fill: rgba(12, 13, 23, .12);
}

.sbp-liquid-group {
	filter:
		drop-shadow(0 0 6px var(--sbp-liquid-color, #ffd84d))
		drop-shadow(0 0 18px rgba(255, 216, 77, .28));
}

.sbp-liquid-body,
.sbp-liquid-surface,
.sbp-liquid-puddle {
	filter: saturate(1.08) brightness(1.08);
}

.sbp-liquid-surface {
	fill: var(--sbp-liquid-color, #ffd84d);
}

.sbp-liquid-meniscus {
	stroke: var(--sbp-liquid-color, #ffd84d);
}

.sbp-shine {
	fill: rgba(255, 250, 202, .42);
}

.sbp-highlight,
.sbp-glass-highlight {
	stroke: rgba(255, 255, 221, .62);
	filter: drop-shadow(0 0 4px rgba(240, 230, 140, .22));
}

.sbp-liquid-tether {
	background: var(--sbp-liquid-color, #ffd84d) !important;
	transform-origin: 0 50%;
	box-shadow: 0 0 10px rgba(255, 216, 77, .44), 0 0 22px rgba(255, 216, 77, .24);
}

.sbp-liquid-tether--mouth {
	height: 4px;
	opacity: .62;
}

.sbp-bottle-card.sbp-pulling .sbp-bottle-svg-wrap,
.sbp-bottle-card.sbp-painting .sbp-bottle-svg-wrap {
	filter:
		drop-shadow(0 0 7px rgba(240, 230, 140, .64))
		drop-shadow(0 0 21px rgba(255, 216, 77, .32))
		drop-shadow(0 20px 24px rgba(0,0,0,.38));
}

/* v2.4 iPhone motion arming feedback */
.sbp-flip-enable--active {
	border-color: rgba(240, 230, 140, .56) !important;
	color: #fff9b8 !important;
	box-shadow: 0 0 18px rgba(240, 230, 140, .28), 0 8px 22px rgba(0,0,0,.28), inset 0 0 16px rgba(255, 216, 77, .09) !important;
}

.sbp-board--word-rain-active .sbp-bottle-svg {
	filter: drop-shadow(0 0 16px rgba(255,216,77,.34)) drop-shadow(0 0 28px rgba(240,230,140,.18));
}


/* v2.5 production example layout: compact, logo + character, no toolbar/text/percentage. */
@media screen and (min-width: 901px) {
	.single_post:has(.sbp-board--example),
	.single_post.sbp-has-example-board {
		padding: 0 !important;
	}
}

.sbp-board--example {
	--sbp-example-bottle-width: clamp(48px, 5.2vw, 66px);
	--sbp-example-gap: clamp(0px, .45vw, 4px);
	width: 100%;
	max-width: none;
	margin: 0 !important;
	padding: clamp(5px, 1.25vw, 10px) !important;
	border-radius: 16px;
	border-color: rgba(240, 230, 140, .26);
	background:
		radial-gradient(circle at 18% 70%, rgba(255, 216, 77, .12), transparent 30%),
		radial-gradient(circle at 78% 14%, rgba(98, 235, 255, .10), transparent 34%),
		linear-gradient(180deg, rgba(5, 6, 16, .995), rgba(11, 9, 23, .99) 56%, rgba(4, 4, 10, .995));
	box-shadow: inset 0 0 34px rgba(255, 216, 77, .035), inset 0 0 46px rgba(84, 224, 255, .028);
	overflow: hidden;
}

.sbp-board--example::before {
	opacity: .18;
	background-size: 28px 28px;
}

.sbp-board--example .sbp-board-heading,
.sbp-board--example .sbp-board-title,
.sbp-board--example .sbp-board-description,
.sbp-board--example .sbp-toolbar,
.sbp-board--example .sbp-save-status,
.sbp-board--example .sbp-export-png,
.sbp-board--example .sbp-percentage {
	display: none !important;
}

.sbp-example-brand {
	position: relative;
	z-index: 3;
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 0;
	margin: 0 0 clamp(0px, .5vw, 4px);
	pointer-events: none;
}

.sbp-example-logo {
	display: block;
	width: min(244px, 48vw);
	max-height: 72px;
	object-fit: contain;
	opacity: .88;
	filter: drop-shadow(0 0 10px rgba(255, 216, 77, .18)) drop-shadow(0 0 15px rgba(96, 222, 255, .10));
	user-select: none;
	-webkit-user-drag: none;
}

.sbp-example-stage {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	gap: clamp(0px, .4vw, 5px);
	width: 100%;
	min-height: 0;
	padding: 0;
}

.sbp-example-character {
	position: relative;
	z-index: 1;
	flex: 0 0 auto;
	width: clamp(62px, 13vw, 132px);
	max-height: clamp(120px, 32vw, 214px);
	object-fit: contain;
	object-position: bottom center;
	align-self: flex-end;
	margin-right: clamp(-8px, -0.9vw, -2px);
	opacity: .94;
	filter: drop-shadow(0 0 12px rgba(255, 163, 204, .18)) drop-shadow(0 18px 22px rgba(0,0,0,.34));
	pointer-events: none;
	user-select: none;
	-webkit-user-drag: none;
}

.sbp-example-grid-wrap {
	position: relative;
	z-index: 2;
	flex: 0 1 auto;
	min-width: 0;
}

.sbp-board--example .sbp-grid {
	display: grid;
	grid-template-columns: repeat(5, minmax(46px, var(--sbp-example-bottle-width))) !important;
	gap: var(--sbp-example-gap) var(--sbp-example-gap) !important;
	align-items: end;
	justify-content: center;
	width: auto;
	margin: 0;
}

.sbp-board--example .sbp-bottle-card,
.sbp-board--example .sbp-theme-simple .sbp-bottle-card,
.sbp-board--example .sbp-theme-mono .sbp-bottle-card {
	gap: 1px !important;
	padding: 0 !important;
	min-width: 0;
}

.sbp-board--example .sbp-bottle-svg-wrap {
	width: var(--sbp-example-bottle-width) !important;
	max-width: var(--sbp-example-bottle-width) !important;
	filter:
		drop-shadow(0 0 4px rgba(240, 230, 140, .48))
		drop-shadow(0 0 9px rgba(255, 216, 77, .18))
		drop-shadow(0 10px 12px rgba(0, 0, 0, .32));
}

.sbp-board--example .sbp-glass-line,
.sbp-board--example .sbp-bottle-outline,
.sbp-board--example .sbp-neck-line {
	stroke-width: 2.25;
	filter: drop-shadow(0 0 2px rgba(240, 230, 140, .66)) drop-shadow(0 0 5px rgba(240, 230, 140, .22)) !important;
}

.sbp-board--example .sbp-bottle-core-line {
	stroke-width: .72;
	opacity: .64;
}

.sbp-board--example .sbp-liquid-group {
	filter: drop-shadow(0 0 4px var(--sbp-liquid-color, #ffd84d)) drop-shadow(0 0 12px rgba(255, 216, 77, .22));
}

.sbp-board--example .sbp-bottle-meta {
	gap: 0;
	min-height: 1.18em;
	line-height: 1.1;
}

.sbp-board--example .sbp-bottle-label,
.sbp-board--example .sbp-label-input {
	font-size: .76rem !important;
	line-height: 1.08;
	font-weight: 800;
	letter-spacing: .035em;
	text-shadow: 0 0 5px rgba(255, 216, 77, .22), 0 0 8px rgba(97, 223, 255, .10);
}

.sbp-board--example .sbp-label-input {
	padding: .12rem .2rem;
	border-radius: 6px;
}

.wp-block-shortcode:has(.sbp-board--example),
.wp-block-group:has(.sbp-board--example),
.entry-content:has(.sbp-board--example) > .wp-block-shortcode {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

@media (max-width: 640px) {
	.sbp-board--example {
		--sbp-example-bottle-width: clamp(42px, 12.6vw, 52px);
		--sbp-example-gap: 0px;
		padding: 4px !important;
		border-radius: 12px;
	}
	.sbp-example-logo {
		width: min(188px, 52vw);
		max-height: 54px;
	}
	.sbp-example-character {
		width: clamp(50px, 17vw, 74px);
		max-height: 132px;
		margin-right: -5px;
	}
	.sbp-board--example .sbp-grid {
		grid-template-columns: repeat(5, minmax(38px, var(--sbp-example-bottle-width))) !important;
	}
	.sbp-board--example .sbp-bottle-label,
	.sbp-board--example .sbp-label-input {
		font-size: .64rem !important;
		letter-spacing: .01em;
	}
}

@media (max-width: 360px) {
	.sbp-board--example {
		--sbp-example-bottle-width: 40px;
	}
	.sbp-example-character {
		width: 44px;
		margin-right: -6px;
	}
	.sbp-board--example .sbp-grid {
		grid-template-columns: repeat(5, minmax(35px, 40px)) !important;
	}
	.sbp-board--example .sbp-bottle-label,
	.sbp-board--example .sbp-label-input {
		font-size: .58rem !important;
	}
}

/* v2.6 refined example showcase: editorial lounge composition, not a literal full grid. */
.sbp-board--example-lounge {
	--sbp-example-bottle-width: clamp(78px, 7.2vw, 106px);
	--sbp-example-gap-x: clamp(0px, .45vw, 5px);
	--sbp-example-gap-y: clamp(2px, .65vw, 8px);
	position: relative;
	isolation: isolate;
	min-height: clamp(392px, 48vw, 560px);
	padding: 0 !important;
	border: 1px solid rgba(240, 230, 140, .20);
	border-radius: clamp(18px, 3vw, 32px);
	background:
		radial-gradient(circle at 16% 30%, rgba(255, 128, 190, .18), transparent 28%),
		radial-gradient(circle at 80% 16%, rgba(255, 216, 77, .18), transparent 27%),
		radial-gradient(circle at 64% 78%, rgba(67, 221, 255, .13), transparent 30%),
		linear-gradient(135deg, #070713 0%, #111020 42%, #080711 72%, #04040a 100%);
	box-shadow:
		inset 0 0 0 1px rgba(255,255,255,.035),
		inset 0 -24px 90px rgba(0,0,0,.54),
		0 18px 70px rgba(0,0,0,.34);
	overflow: hidden;
}

.sbp-board--example-lounge::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	background:
		linear-gradient(105deg, rgba(255,255,255,.065), transparent 24%, transparent 72%, rgba(255,216,77,.045)),
		repeating-linear-gradient(115deg, rgba(255,255,255,.025) 0 1px, transparent 1px 18px);
	mix-blend-mode: screen;
	opacity: .56;
	pointer-events: none;
}

.sbp-board--example-lounge::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 5;
	background:
		linear-gradient(90deg, rgba(3,3,8,.06) 0%, rgba(3,3,8,.11) 34%, rgba(3,3,8,0) 54%),
		linear-gradient(0deg, rgba(0,0,0,.48) 0%, rgba(0,0,0,0) 34%, rgba(0,0,0,.20) 100%);
	pointer-events: none;
}

.sbp-board--example-lounge .sbp-example-brand {
	position: absolute;
	z-index: 8;
	top: clamp(10px, 1.7vw, 22px);
	left: clamp(14px, 2.2vw, 34px);
	justify-content: flex-start;
	width: min(38vw, 260px);
	margin: 0;
	pointer-events: none;
}

.sbp-board--example-lounge .sbp-example-logo {
	width: min(100%, 238px);
	max-height: 62px;
	opacity: .78;
	filter:
		drop-shadow(0 0 8px rgba(255,216,77,.18))
		drop-shadow(0 0 18px rgba(255,91,165,.10))
		drop-shadow(0 4px 16px rgba(0,0,0,.46));
}

.sbp-board--example-lounge .sbp-example-stage {
	position: relative;
	z-index: 2;
	display: block;
	width: 100%;
	min-height: inherit;
	padding: 0;
	overflow: hidden;
}

.sbp-board--example-lounge .sbp-example-stage::before {
	content: "";
	position: absolute;
	z-index: 1;
	left: -12%;
	bottom: -20%;
	width: 58%;
	height: 92%;
	border-radius: 50%;
	background:
		radial-gradient(circle at 54% 42%, rgba(255,181,208,.24), transparent 0 42%, transparent 67%),
		radial-gradient(circle at 44% 66%, rgba(240,230,140,.11), transparent 0 48%);
	filter: blur(7px);
	opacity: .82;
	pointer-events: none;
}

.sbp-board--example-lounge .sbp-example-light {
	position: absolute;
	z-index: 0;
	border-radius: 999px;
	filter: blur(24px);
	pointer-events: none;
}

.sbp-board--example-lounge .sbp-example-light--gold {
	right: 6%;
	top: 11%;
	width: 34%;
	height: 34%;
	background: rgba(255, 216, 77, .13);
}

.sbp-board--example-lounge .sbp-example-light--cyan {
	right: 26%;
	bottom: 4%;
	width: 28%;
	height: 30%;
	background: rgba(78, 224, 255, .10);
}

.sbp-board--example-lounge .sbp-example-character {
	position: absolute;
	z-index: 2;
	left: clamp(-92px, -5.5vw, -38px);
	bottom: clamp(-110px, -8.5vw, -52px);
	width: clamp(348px, 38vw, 520px);
	max-width: none;
	max-height: none;
	object-fit: contain;
	object-position: left bottom;
	transform: scale(1.08);
	transform-origin: left bottom;
	opacity: .94;
	filter:
		drop-shadow(0 0 22px rgba(255,148,198,.22))
		drop-shadow(0 28px 38px rgba(0,0,0,.55));
	-webkit-mask-image: linear-gradient(90deg, #000 0%, #000 58%, rgba(0,0,0,.84) 72%, transparent 100%);
	mask-image: linear-gradient(90deg, #000 0%, #000 58%, rgba(0,0,0,.84) 72%, transparent 100%);
	pointer-events: none;
}

.sbp-board--example-lounge .sbp-example-grid-wrap {
	position: absolute;
	z-index: 6;
	right: clamp(12px, 3.2vw, 48px);
	top: clamp(62px, 8.5vw, 104px);
	bottom: clamp(16px, 4vw, 48px);
	width: min(63%, 620px);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: clamp(10px, 1.7vw, 18px);
}

.sbp-board--example-lounge .sbp-example-grid-wrap::before {
	content: "";
	position: absolute;
	inset: clamp(2px, .5vw, 6px);
	z-index: -1;
	border-radius: clamp(24px, 4vw, 46px);
	border: 1px solid rgba(240,230,140,.15);
	background:
		linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.018) 43%, rgba(255,216,77,.035)),
		radial-gradient(circle at 80% 18%, rgba(255,216,77,.10), transparent 42%),
		radial-gradient(circle at 18% 88%, rgba(83,218,255,.08), transparent 38%);
	box-shadow:
		inset 0 0 30px rgba(255,255,255,.035),
		0 18px 44px rgba(0,0,0,.24);
	backdrop-filter: blur(2px);
}

.sbp-board--example-lounge .sbp-grid {
	position: relative;
	z-index: 2;
	display: grid;
	grid-template-columns: repeat(4, minmax(62px, var(--sbp-example-bottle-width))) !important;
	grid-auto-rows: auto;
	gap: var(--sbp-example-gap-y) var(--sbp-example-gap-x) !important;
	align-items: end;
	justify-content: center;
	width: auto;
	margin: 0;
	padding: 0;
}

.sbp-board--example-lounge .sbp-bottle-card,
.sbp-board--example-lounge .sbp-theme-simple .sbp-bottle-card,
.sbp-board--example-lounge .sbp-theme-mono .sbp-bottle-card {
	--sbp-card-x: 0px;
	--sbp-card-y: 0px;
	--sbp-card-scale: 1;
	position: relative;
	z-index: 1;
	gap: 1px !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	border-radius: 0 !important;
	transform: translate(var(--sbp-card-x), var(--sbp-card-y)) scale(var(--sbp-card-scale)) !important;
	transform-origin: center bottom;
}

.sbp-board--example-lounge .sbp-bottle-card--1 { --sbp-card-x: 12px; --sbp-card-y: 22px; --sbp-card-scale: .88; opacity: .88; }
.sbp-board--example-lounge .sbp-bottle-card--2 { --sbp-card-x: 4px; --sbp-card-y: 2px; --sbp-card-scale: .98; }
.sbp-board--example-lounge .sbp-bottle-card--3 { --sbp-card-x: -2px; --sbp-card-y: 16px; --sbp-card-scale: .92; }
.sbp-board--example-lounge .sbp-bottle-card--4 { --sbp-card-x: -8px; --sbp-card-y: 42px; --sbp-card-scale: .82; opacity: .82; }
.sbp-board--example-lounge .sbp-bottle-card--5 { --sbp-card-x: 3px; --sbp-card-y: -12px; --sbp-card-scale: .97; }
.sbp-board--example-lounge .sbp-bottle-card--6 { --sbp-card-x: -2px; --sbp-card-y: -30px; --sbp-card-scale: 1.06; z-index: 3; }
.sbp-board--example-lounge .sbp-bottle-card--7 { --sbp-card-x: -8px; --sbp-card-y: -14px; --sbp-card-scale: 1; z-index: 2; }
.sbp-board--example-lounge .sbp-bottle-card--8 { --sbp-card-x: -14px; --sbp-card-y: 14px; --sbp-card-scale: .90; }
.sbp-board--example-lounge .sbp-bottle-card--9 { --sbp-card-x: 18px; --sbp-card-y: -12px; --sbp-card-scale: .90; opacity: .92; }
.sbp-board--example-lounge .sbp-bottle-card--10 { --sbp-card-x: 6px; --sbp-card-y: -34px; --sbp-card-scale: 1; }
.sbp-board--example-lounge .sbp-bottle-card--11 { --sbp-card-x: -6px; --sbp-card-y: -18px; --sbp-card-scale: .95; }
.sbp-board--example-lounge .sbp-bottle-card--12 { --sbp-card-x: -18px; --sbp-card-y: 4px; --sbp-card-scale: .84; opacity: .86; }

.sbp-is-editable.sbp-board--example-lounge .sbp-bottle-card:hover,
.sbp-board--example-lounge .sbp-bottle-card:focus-visible {
	transform: translate(var(--sbp-card-x), calc(var(--sbp-card-y) - 3px)) scale(calc(var(--sbp-card-scale) * 1.025)) !important;
	filter: brightness(1.08);
}

.sbp-board--example-lounge .sbp-bottle-svg-wrap {
	width: var(--sbp-example-bottle-width) !important;
	max-width: var(--sbp-example-bottle-width) !important;
	filter:
		drop-shadow(0 0 3px rgba(240, 230, 140, .74))
		drop-shadow(0 0 12px rgba(255, 216, 77, .22))
		drop-shadow(0 14px 16px rgba(0, 0, 0, .46));
}

.sbp-board--example-lounge .sbp-glass-line,
.sbp-board--example-lounge .sbp-bottle-outline,
.sbp-board--example-lounge .sbp-neck-line {
	stroke-width: 2.38;
	filter:
		drop-shadow(0 0 2px rgba(240, 230, 140, .84))
		drop-shadow(0 0 7px rgba(240, 230, 140, .30)) !important;
}

.sbp-board--example-lounge .sbp-bottle-core-line {
	stroke-width: .84;
	opacity: .76;
}

.sbp-board--example-lounge .sbp-liquid-group {
	filter:
		drop-shadow(0 0 4px rgba(255, 216, 77, .72))
		drop-shadow(0 0 14px rgba(255, 216, 77, .26));
}

.sbp-board--example-lounge .sbp-bottle-meta {
	gap: 0;
	min-height: 1.05em;
	line-height: 1;
	margin-top: -2px;
}

.sbp-board--example-lounge .sbp-bottle-label,
.sbp-board--example-lounge .sbp-label-input {
	font-size: .68rem !important;
	line-height: 1.05;
	font-weight: 800;
	letter-spacing: .055em;
	color: rgba(255, 250, 195, .96);
	text-shadow:
		0 0 4px rgba(255, 216, 77, .42),
		0 0 12px rgba(97, 223, 255, .12),
		0 1px 2px rgba(0,0,0,.72);
}

.sbp-board--example-lounge .sbp-label-input {
	padding: .12rem .2rem;
	border-radius: 6px;
}

@media (max-width: 760px) {
	.sbp-board--example-lounge {
		--sbp-example-bottle-width: clamp(52px, 16.2vw, 68px);
		--sbp-example-gap-x: 0px;
		--sbp-example-gap-y: 2px;
		min-height: clamp(430px, 132vw, 580px);
		border-radius: 18px;
	}

	.sbp-board--example-lounge .sbp-example-brand {
		top: 10px;
		left: 12px;
		width: min(42vw, 172px);
	}

	.sbp-board--example-lounge .sbp-example-logo {
		max-height: 46px;
		opacity: .76;
	}

	.sbp-board--example-lounge .sbp-example-character {
		left: clamp(-128px, -32vw, -74px);
		bottom: clamp(-96px, -19vw, -46px);
		width: clamp(292px, 83vw, 420px);
		transform: scale(1.10);
		opacity: .88;
		-webkit-mask-image: linear-gradient(90deg, #000 0%, #000 52%, rgba(0,0,0,.72) 68%, transparent 100%);
		mask-image: linear-gradient(90deg, #000 0%, #000 52%, rgba(0,0,0,.72) 68%, transparent 100%);
	}

	.sbp-board--example-lounge .sbp-example-grid-wrap {
		top: 58px;
		right: 3px;
		bottom: 8px;
		width: 70vw;
		padding: 8px 4px 10px 2px;
	}

	.sbp-board--example-lounge .sbp-example-grid-wrap::before {
		inset: 3px 0 3px 0;
		border-radius: 26px;
		background:
			linear-gradient(145deg, rgba(255,255,255,.062), rgba(255,255,255,.014) 44%, rgba(255,216,77,.026)),
			radial-gradient(circle at 83% 20%, rgba(255,216,77,.09), transparent 42%);
	}

	.sbp-board--example-lounge .sbp-grid {
		grid-template-columns: repeat(3, minmax(48px, var(--sbp-example-bottle-width))) !important;
		gap: var(--sbp-example-gap-y) var(--sbp-example-gap-x) !important;
	}

	.sbp-board--example-lounge .sbp-bottle-card--1 { --sbp-card-x: 4px; --sbp-card-y: 12px; --sbp-card-scale: .88; }
	.sbp-board--example-lounge .sbp-bottle-card--2 { --sbp-card-x: -2px; --sbp-card-y: -2px; --sbp-card-scale: .98; }
	.sbp-board--example-lounge .sbp-bottle-card--3 { --sbp-card-x: -8px; --sbp-card-y: 16px; --sbp-card-scale: .88; }
	.sbp-board--example-lounge .sbp-bottle-card--4 { --sbp-card-x: 7px; --sbp-card-y: -8px; --sbp-card-scale: .94; }
	.sbp-board--example-lounge .sbp-bottle-card--5 { --sbp-card-x: 0px; --sbp-card-y: -24px; --sbp-card-scale: 1.03; z-index: 3; }
	.sbp-board--example-lounge .sbp-bottle-card--6 { --sbp-card-x: -7px; --sbp-card-y: -6px; --sbp-card-scale: .96; }
	.sbp-board--example-lounge .sbp-bottle-card--7 { --sbp-card-x: 8px; --sbp-card-y: -12px; --sbp-card-scale: .93; }
	.sbp-board--example-lounge .sbp-bottle-card--8 { --sbp-card-x: 0px; --sbp-card-y: -26px; --sbp-card-scale: 1; }
	.sbp-board--example-lounge .sbp-bottle-card--9 { --sbp-card-x: -10px; --sbp-card-y: -9px; --sbp-card-scale: .92; }
	.sbp-board--example-lounge .sbp-bottle-card--10 { --sbp-card-x: 8px; --sbp-card-y: -8px; --sbp-card-scale: .86; opacity: .88; }
	.sbp-board--example-lounge .sbp-bottle-card--11 { --sbp-card-x: 0px; --sbp-card-y: -22px; --sbp-card-scale: .96; }
	.sbp-board--example-lounge .sbp-bottle-card--12 { --sbp-card-x: -9px; --sbp-card-y: -4px; --sbp-card-scale: .84; opacity: .84; }

	.sbp-board--example-lounge .sbp-bottle-label,
	.sbp-board--example-lounge .sbp-label-input {
		font-size: .56rem !important;
		letter-spacing: .018em;
	}
}

@media (max-width: 380px) {
	.sbp-board--example-lounge {
		--sbp-example-bottle-width: clamp(47px, 15.4vw, 57px);
		min-height: 420px;
	}
	.sbp-board--example-lounge .sbp-example-character {
		left: -120px;
		width: 306px;
	}
	.sbp-board--example-lounge .sbp-example-grid-wrap {
		width: 72vw;
	}
	.sbp-board--example-lounge .sbp-bottle-label,
	.sbp-board--example-lounge .sbp-label-input {
		font-size: .52rem !important;
	}
}

/* v2.8 [seiheki_bottle_example] seamless layout polish. */
.single_post:has(.sbp-board--example),
.single_post.sbp-has-example-board {
	padding: 0 !important;
}

.sbp-board--example-premiere {
	--sbp-example-bottle-width: clamp(62px, 6vw, 84px);
	--sbp-example-bottle-gap-x: clamp(5px, .8vw, 12px);
	--sbp-example-bottle-gap-y: clamp(10px, 1.1vw, 18px);
	position: relative;
	isolation: isolate;
	width: 100%;
	max-width: 100%;
	min-height: clamp(430px, 48vw, 600px);
	padding: 0 !important;
	border: 0 !important;
	border-radius: clamp(18px, 2.6vw, 32px);
	background:
		radial-gradient(circle at 15% 42%, rgba(255, 150, 205, .22), transparent 33%),
		radial-gradient(circle at 73% 17%, rgba(255, 216, 77, .17), transparent 31%),
		radial-gradient(circle at 72% 78%, rgba(74, 218, 255, .12), transparent 32%),
		linear-gradient(132deg, #05050b 0%, #0d0916 38%, #151022 64%, #05050c 100%);
	box-shadow:
		inset 0 -48px 130px rgba(0, 0, 0, .56),
		0 24px 80px rgba(0, 0, 0, .30);
	overflow: hidden;
}

.sbp-board--example-premiere::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	background:
		linear-gradient(98deg, rgba(255,255,255,.068), transparent 25%, transparent 70%, rgba(240,230,140,.046)),
		repeating-linear-gradient(116deg, rgba(255,255,255,.020) 0 1px, transparent 1px 22px);
	mix-blend-mode: screen;
	opacity: .54;
	pointer-events: none;
}

.sbp-board--example-premiere::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 12;
	background:
		linear-gradient(90deg, rgba(0,0,0,.02), rgba(0,0,0,.12) 42%, rgba(0,0,0,0) 66%),
		linear-gradient(0deg, rgba(0,0,0,.48) 0%, transparent 30%, rgba(0,0,0,.16) 100%);
	pointer-events: none;
}

.sbp-board--example-premiere .sbp-example-brand {
	position: absolute;
	z-index: 16;
	top: clamp(12px, 1.7vw, 24px);
	left: clamp(14px, 2vw, 30px);
	width: clamp(140px, 18vw, 246px);
	margin: 0;
	justify-content: flex-start;
	pointer-events: none;
}

.sbp-board--example-premiere .sbp-example-logo {
	width: 100%;
	max-height: 62px;
	opacity: .80;
	filter:
		drop-shadow(0 0 6px rgba(255, 216, 77, .18))
		drop-shadow(0 0 14px rgba(255, 91, 165, .10))
		drop-shadow(0 6px 18px rgba(0, 0, 0, .52));
}

.sbp-board--example-premiere .sbp-example-stage {
	position: relative;
	z-index: 2;
	min-height: inherit;
	width: 100%;
	padding: 0;
	overflow: hidden;
}

.sbp-board--example-premiere .sbp-example-stage::before {
	content: "";
	position: absolute;
	left: -5%;
	bottom: -12%;
	z-index: 1;
	width: 53%;
	height: 91%;
	border-radius: 999px;
	background:
		radial-gradient(circle at 48% 38%, rgba(255, 184, 214, .23), transparent 42%),
		radial-gradient(circle at 56% 72%, rgba(240, 230, 140, .11), transparent 48%);
	filter: blur(11px);
	opacity: .88;
	pointer-events: none;
}

.sbp-board--example-premiere .sbp-example-light {
	position: absolute;
	z-index: 0;
	border-radius: 999px;
	filter: blur(28px);
	pointer-events: none;
}

.sbp-board--example-premiere .sbp-example-light--gold {
	right: 12%;
	top: 14%;
	width: 34%;
	height: 28%;
	background: rgba(255, 216, 77, .12);
}

.sbp-board--example-premiere .sbp-example-light--cyan {
	right: 36%;
	bottom: 10%;
	width: 24%;
	height: 28%;
	background: rgba(72, 222, 255, .09);
}

.sbp-board--example-premiere .sbp-example-character {
	position: absolute;
	z-index: 3;
	left: clamp(-40px, -2.4vw, -16px);
	bottom: clamp(-28px, -2.5vw, -10px);
	height: clamp(378px, 91%, 580px);
	width: auto;
	max-width: 46%;
	max-height: none;
	object-fit: contain;
	object-position: left bottom;
	opacity: .76;
	filter:
		drop-shadow(0 0 18px rgba(255, 155, 205, .20))
		drop-shadow(0 30px 40px rgba(0, 0, 0, .56));
	-webkit-mask-image: linear-gradient(90deg, #000 0%, #000 66%, rgba(0,0,0,.78) 80%, transparent 100%), linear-gradient(0deg, transparent 0%, #000 12%, #000 100%);
	-webkit-mask-composite: source-in;
	mask-image: linear-gradient(90deg, #000 0%, #000 66%, rgba(0,0,0,.78) 80%, transparent 100%), linear-gradient(0deg, transparent 0%, #000 12%, #000 100%);
	mask-composite: intersect;
	pointer-events: none;
}

.sbp-board--example-premiere .sbp-example-grid-wrap {
	position: absolute;
	z-index: 8;
	right: clamp(18px, 3.4vw, 58px);
	bottom: clamp(28px, 5.2vw, 72px);
	width: min(59%, 590px);
	min-width: 420px;
	height: clamp(245px, 31vw, 365px);
	display: flex;
	align-items: flex-end;
	justify-content: center;
	padding: clamp(16px, 2vw, 24px) clamp(10px, 1.4vw, 18px) clamp(22px, 2.5vw, 34px);
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
}

.sbp-board--example-premiere .sbp-example-grid-wrap::before {
	content: "";
	position: absolute;
	left: 4%;
	right: 4%;
	bottom: clamp(10px, 1.3vw, 18px);
	height: clamp(92px, 12vw, 142px);
	z-index: -1;
	border: 0 !important;
	border-radius: 999px 999px clamp(22px, 3vw, 42px) clamp(22px, 3vw, 42px);
	background:
		linear-gradient(180deg, rgba(255,255,255,.074), rgba(255,255,255,.018) 45%, rgba(0,0,0,.12)),
		radial-gradient(ellipse at 50% 0%, rgba(255, 216, 77, .12), transparent 67%),
		linear-gradient(90deg, rgba(74, 220, 255, .07), rgba(255, 216, 77, .055), rgba(255, 96, 174, .06));
	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.06),
		0 14px 44px rgba(0,0,0,.30);
	backdrop-filter: blur(2px);
}

.sbp-board--example-premiere .sbp-example-grid-wrap::after {
	content: "";
	position: absolute;
	left: 10%;
	right: 10%;
	bottom: clamp(74px, 9vw, 118px);
	height: 1px;
	z-index: -1;
	border: 0;
	background: linear-gradient(90deg, transparent, rgba(240,230,140,.34), rgba(74,220,255,.16), transparent);
	box-shadow: 0 0 9px rgba(255,216,77,.18);
	pointer-events: none;
}

.sbp-board--example-premiere .sbp-grid {
	position: relative;
	z-index: 2;
	display: grid;
	grid-template-columns: repeat(5, minmax(50px, var(--sbp-example-bottle-width))) !important;
	grid-auto-rows: auto;
	gap: var(--sbp-example-bottle-gap-y) var(--sbp-example-bottle-gap-x) !important;
	align-items: end;
	justify-content: center;
	width: auto;
	max-width: 100%;
	margin: 0;
	padding: 0;
}

.sbp-board--example-premiere .sbp-bottle-card,
.sbp-board--example-premiere .sbp-theme-simple .sbp-bottle-card,
.sbp-board--example-premiere .sbp-theme-mono .sbp-bottle-card {
	--sbp-card-x: 0px;
	--sbp-card-y: 0px;
	--sbp-card-scale: 1;
	position: relative;
	z-index: 1;
	gap: 2px !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	border-radius: 0 !important;
	transform: translate3d(var(--sbp-card-x), var(--sbp-card-y), 0) scale(var(--sbp-card-scale)) !important;
	transform-origin: center bottom;
}

.sbp-board--example-premiere .sbp-bottle-card--1 { --sbp-card-x: 0px; --sbp-card-y: 8px; --sbp-card-scale: .92; opacity: .92; }
.sbp-board--example-premiere .sbp-bottle-card--2 { --sbp-card-x: 0px; --sbp-card-y: 2px; --sbp-card-scale: .97; opacity: .96; }
.sbp-board--example-premiere .sbp-bottle-card--3 { --sbp-card-x: 0px; --sbp-card-y: -3px; --sbp-card-scale: 1.02; z-index: 3; }
.sbp-board--example-premiere .sbp-bottle-card--4 { --sbp-card-x: 0px; --sbp-card-y: 2px; --sbp-card-scale: .97; opacity: .96; }
.sbp-board--example-premiere .sbp-bottle-card--5 { --sbp-card-x: 0px; --sbp-card-y: 8px; --sbp-card-scale: .92; opacity: .92; }
.sbp-board--example-premiere .sbp-bottle-card--6 { --sbp-card-x: 0px; --sbp-card-y: 2px; --sbp-card-scale: .96; opacity: .96; }
.sbp-board--example-premiere .sbp-bottle-card--7 { --sbp-card-x: 0px; --sbp-card-y: -5px; --sbp-card-scale: 1.01; z-index: 4; }
.sbp-board--example-premiere .sbp-bottle-card--8 { --sbp-card-x: 0px; --sbp-card-y: -9px; --sbp-card-scale: 1.04; z-index: 5; }
.sbp-board--example-premiere .sbp-bottle-card--9 { --sbp-card-x: 0px; --sbp-card-y: -5px; --sbp-card-scale: 1.01; z-index: 4; }
.sbp-board--example-premiere .sbp-bottle-card--10 { --sbp-card-x: 0px; --sbp-card-y: 2px; --sbp-card-scale: .96; opacity: .96; }

.sbp-is-editable.sbp-board--example-premiere .sbp-bottle-card:hover,
.sbp-board--example-premiere .sbp-bottle-card:focus-visible {
	transform: translate3d(var(--sbp-card-x), calc(var(--sbp-card-y) - 2px), 0) scale(calc(var(--sbp-card-scale) * 1.018)) !important;
	filter: brightness(1.06);
}

.sbp-board--example-premiere .sbp-bottle-svg-wrap {
	width: var(--sbp-example-bottle-width) !important;
	max-width: var(--sbp-example-bottle-width) !important;
	filter:
		drop-shadow(0 0 3px rgba(240, 230, 140, .76))
		drop-shadow(0 0 11px rgba(255, 216, 77, .22))
		drop-shadow(0 15px 17px rgba(0, 0, 0, .45));
}

.sbp-board--example-premiere .sbp-glass-line,
.sbp-board--example-premiere .sbp-bottle-outline,
.sbp-board--example-premiere .sbp-neck-line {
	stroke-width: 2.36;
	filter:
		drop-shadow(0 0 2px rgba(240, 230, 140, .82))
		drop-shadow(0 0 7px rgba(240, 230, 140, .25)) !important;
}

.sbp-board--example-premiere .sbp-bottle-core-line {
	stroke-width: .82;
	opacity: .76;
}

.sbp-board--example-premiere .sbp-liquid-group {
	filter:
		drop-shadow(0 0 4px rgba(255, 216, 77, .70))
		drop-shadow(0 0 12px rgba(255, 216, 77, .22));
}

.sbp-board--example-premiere .sbp-bottle-meta {
	gap: 0;
	min-height: 1.22em;
	line-height: 1.1;
	margin-top: -1px;
}

.sbp-board--example-premiere .sbp-bottle-label,
.sbp-board--example-premiere .sbp-label-input {
	font-size: .63rem !important;
	line-height: 1.1;
	font-weight: 800;
	letter-spacing: .035em;
	white-space: nowrap;
	color: rgba(255, 249, 195, .96);
	text-shadow:
		0 0 4px rgba(255, 216, 77, .40),
		0 0 10px rgba(97, 223, 255, .10),
		0 1px 2px rgba(0,0,0,.70);
}

.sbp-board--example-premiere .sbp-label-input {
	padding: .12rem .18rem;
	border: 0;
	border-radius: 6px;
}

.sbp-board--example-premiere .sbp-percentage {
	display: none !important;
}

@media (max-width: 760px) {
	.sbp-board--example-premiere {
		--sbp-example-bottle-width: clamp(52px, 17.6vw, 68px);
		--sbp-example-bottle-gap-x: 0px;
		--sbp-example-bottle-gap-y: 3px;
		width: 100vw;
		max-width: 100vw;
		margin-left: calc(50% - 50vw);
		margin-right: calc(50% - 50vw);
		min-height: clamp(548px, 134vw, 690px);
		border-radius: 0;
	}

	.sbp-board--example-premiere .sbp-example-brand {
		top: 10px;
		left: 12px;
		width: min(48vw, 180px);
	}

	.sbp-board--example-premiere .sbp-example-logo {
		max-height: 45px;
		opacity: .78;
	}

	.sbp-board--example-premiere .sbp-example-stage::before {
		left: -24%;
		bottom: 17%;
		width: 88%;
		height: 68%;
		opacity: .76;
	}

	.sbp-board--example-premiere .sbp-example-character {
		left: clamp(-72px, -16vw, -32px);
		top: clamp(42px, 10vw, 68px);
		bottom: auto;
		height: clamp(318px, 80vw, 440px);
		max-width: none;
		opacity: .52;
		-webkit-mask-image: linear-gradient(90deg, #000 0%, #000 64%, rgba(0,0,0,.68) 80%, transparent 100%), linear-gradient(0deg, transparent 0%, #000 10%, #000 84%, transparent 100%);
		-webkit-mask-composite: source-in;
		mask-image: linear-gradient(90deg, #000 0%, #000 64%, rgba(0,0,0,.68) 80%, transparent 100%), linear-gradient(0deg, transparent 0%, #000 10%, #000 84%, transparent 100%);
		mask-composite: intersect;
	}

	.sbp-board--example-premiere .sbp-example-grid-wrap {
		left: 0;
		right: 0;
		bottom: clamp(16px, 4vw, 30px);
		top: auto;
		width: 100%;
		min-width: 0;
		height: clamp(242px, 62vw, 330px);
		padding: 14px 6px 26px;
	}

	.sbp-board--example-premiere .sbp-example-grid-wrap::before {
		left: 3.5%;
		right: 3.5%;
		bottom: 8px;
		height: clamp(106px, 28vw, 142px);
		border: 0 !important;
		border-radius: 999px 999px 24px 24px;
	}

	.sbp-board--example-premiere .sbp-example-grid-wrap::after {
		left: 10%;
		right: 10%;
		bottom: clamp(76px, 20vw, 106px);
	}

	.sbp-board--example-premiere .sbp-grid {
		grid-template-columns: repeat(5, minmax(46px, var(--sbp-example-bottle-width))) !important;
		gap: var(--sbp-example-bottle-gap-y) var(--sbp-example-bottle-gap-x) !important;
	}

	.sbp-board--example-premiere .sbp-bottle-card--1,
	.sbp-board--example-premiere .sbp-bottle-card--5 { --sbp-card-y: 5px; --sbp-card-scale: .92; }
	.sbp-board--example-premiere .sbp-bottle-card--2,
	.sbp-board--example-premiere .sbp-bottle-card--4 { --sbp-card-y: 1px; --sbp-card-scale: .96; }
	.sbp-board--example-premiere .sbp-bottle-card--3 { --sbp-card-y: -3px; --sbp-card-scale: 1; }
	.sbp-board--example-premiere .sbp-bottle-card--6,
	.sbp-board--example-premiere .sbp-bottle-card--10 { --sbp-card-y: 1px; --sbp-card-scale: .95; }
	.sbp-board--example-premiere .sbp-bottle-card--7,
	.sbp-board--example-premiere .sbp-bottle-card--9 { --sbp-card-y: -4px; --sbp-card-scale: 1; }
	.sbp-board--example-premiere .sbp-bottle-card--8 { --sbp-card-y: -8px; --sbp-card-scale: 1.03; }

	.sbp-board--example-premiere .sbp-bottle-label,
	.sbp-board--example-premiere .sbp-label-input {
		font-size: .52rem !important;
		letter-spacing: 0;
	}
}

@media (max-width: 380px) {
	.sbp-board--example-premiere {
		--sbp-example-bottle-width: clamp(48px, 16.6vw, 60px);
		min-height: 528px;
	}

	.sbp-board--example-premiere .sbp-example-character {
		left: -80px;
		height: 330px;
		opacity: .50;
	}

	.sbp-board--example-premiere .sbp-bottle-label,
	.sbp-board--example-premiere .sbp-label-input {
		font-size: .49rem !important;
	}
}

/* v2.9 [seiheki_bottle_example] nebula layout: no table/shelf, evenly distributed, tap-friendly. */
.sbp-board--example-premiere {
	--sbp-example-bottle-width: clamp(74px, 6.8vw, 96px);
	--sbp-example-bottle-gap-x: clamp(10px, 1.4vw, 22px);
	--sbp-example-bottle-gap-y: clamp(14px, 1.9vw, 28px);
	width: 100% !important;
	max-width: 100% !important;
	min-height: clamp(560px, 56vw, 720px) !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: clamp(18px, 2.6vw, 32px);
	background:
		radial-gradient(circle at 15% 42%, rgba(255, 150, 205, .22), transparent 33%),
		radial-gradient(circle at 73% 17%, rgba(255, 216, 77, .17), transparent 31%),
		radial-gradient(circle at 72% 78%, rgba(74, 218, 255, .12), transparent 32%),
		linear-gradient(132deg, #05050b 0%, #0d0916 38%, #151022 64%, #05050c 100%) !important;
	box-shadow:
		inset 0 -48px 130px rgba(0, 0, 0, .56),
		0 24px 80px rgba(0, 0, 0, .30) !important;
	overflow: hidden;
}

.sbp-board--example-premiere::after {
	background:
		radial-gradient(circle at 26% 58%, rgba(255, 216, 77, .052), transparent 42%),
		linear-gradient(0deg, rgba(0,0,0,.38) 0%, transparent 34%, rgba(0,0,0,.15) 100%) !important;
}

.sbp-board--example-premiere .sbp-example-stage {
	position: relative;
	z-index: 2;
	min-height: inherit !important;
	width: 100%;
	padding: 0 !important;
	overflow: hidden;
}

.sbp-board--example-premiere .sbp-example-stage::before {
	left: -8% !important;
	bottom: -18% !important;
	width: 62% !important;
	height: 104% !important;
	opacity: .68 !important;
	filter: blur(16px) !important;
}

.sbp-board--example-premiere .sbp-example-light--gold {
	right: 7% !important;
	top: 9% !important;
	width: 45% !important;
	height: 38% !important;
	background: rgba(255, 216, 77, .115) !important;
}

.sbp-board--example-premiere .sbp-example-light--cyan {
	right: 46% !important;
	bottom: 10% !important;
	width: 32% !important;
	height: 36% !important;
	background: rgba(72, 222, 255, .082) !important;
}

.sbp-board--example-premiere .sbp-example-character {
	left: clamp(-70px, -4vw, -24px) !important;
	bottom: clamp(-52px, -4vw, -18px) !important;
	top: auto !important;
	height: clamp(490px, 91%, 680px) !important;
	max-width: 52% !important;
	opacity: .36 !important;
	z-index: 1 !important;
	filter:
		drop-shadow(0 0 22px rgba(255, 155, 205, .18))
		drop-shadow(0 28px 46px rgba(0, 0, 0, .62)) !important;
	-webkit-mask-image:
		linear-gradient(90deg, #000 0%, #000 48%, rgba(0,0,0,.64) 70%, transparent 100%),
		linear-gradient(0deg, transparent 0%, #000 10%, #000 92%, transparent 100%) !important;
	-webkit-mask-composite: source-in !important;
	mask-image:
		linear-gradient(90deg, #000 0%, #000 48%, rgba(0,0,0,.64) 70%, transparent 100%),
		linear-gradient(0deg, transparent 0%, #000 10%, #000 92%, transparent 100%) !important;
	mask-composite: intersect !important;
	pointer-events: none !important;
}

.sbp-board--example-premiere .sbp-example-brand {
	z-index: 20 !important;
	top: clamp(12px, 1.6vw, 22px) !important;
	left: clamp(14px, 2vw, 30px) !important;
	width: clamp(138px, 17vw, 230px) !important;
}

.sbp-board--example-premiere .sbp-example-grid-wrap {
	position: absolute !important;
	z-index: 9 !important;
	inset: clamp(76px, 8vw, 110px) clamp(30px, 5vw, 72px) clamp(28px, 4vw, 52px) clamp(30px, 5vw, 72px) !important;
	width: auto !important;
	min-width: 0 !important;
	height: auto !important;
	display: flex !important;
	align-items: stretch !important;
	justify-content: center !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
}

.sbp-board--example-premiere .sbp-example-grid-wrap::before,
.sbp-board--example-premiere .sbp-example-grid-wrap::after {
	display: none !important;
	content: none !important;
}

.sbp-board--example-premiere .sbp-grid {
	position: relative !important;
	z-index: 4 !important;
	display: grid !important;
	grid-template-columns: repeat(5, minmax(84px, var(--sbp-example-bottle-width))) !important;
	grid-template-rows: repeat(3, minmax(146px, 1fr)) !important;
	gap: var(--sbp-example-bottle-gap-y) var(--sbp-example-bottle-gap-x) !important;
	align-items: center !important;
	justify-items: center !important;
	align-content: space-evenly !important;
	justify-content: space-evenly !important;
	width: min(100%, 1040px) !important;
	height: 100% !important;
	margin: 0 auto !important;
	padding: 0 !important;
}

.sbp-board--example-premiere .sbp-bottle-card,
.sbp-board--example-premiere .sbp-theme-simple .sbp-bottle-card,
.sbp-board--example-premiere .sbp-theme-mono .sbp-bottle-card {
	--sbp-card-x: 0px;
	--sbp-card-y: 0px;
	--sbp-card-scale: 1;
	position: relative !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
	width: calc(var(--sbp-example-bottle-width) + 22px) !important;
	min-width: calc(var(--sbp-example-bottle-width) + 22px) !important;
	min-height: clamp(144px, 14vw, 184px) !important;
	gap: 4px !important;
	padding: 6px 8px 7px !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	border-radius: 16px !important;
	transform: translate3d(var(--sbp-card-x), var(--sbp-card-y), 0) scale(var(--sbp-card-scale)) !important;
	transform-origin: center center !important;
	cursor: pointer;
	touch-action: none;
	-webkit-tap-highlight-color: transparent;
}

.sbp-board--example-premiere .sbp-bottle-card::before {
	content: "";
	position: absolute;
	inset: 8px 3px 2px;
	z-index: -1;
	border-radius: 999px;
	background:
		radial-gradient(ellipse at 50% 36%, rgba(255, 216, 77, .070), transparent 55%),
		radial-gradient(ellipse at 50% 88%, rgba(74, 220, 255, .036), transparent 62%);
	filter: blur(1px);
	opacity: .92;
	pointer-events: none;
}

.sbp-board--example-premiere .sbp-bottle-card--1 { --sbp-card-x: -4px; --sbp-card-y: 8px; --sbp-card-scale: .96; }
.sbp-board--example-premiere .sbp-bottle-card--2 { --sbp-card-x: 3px; --sbp-card-y: -5px; --sbp-card-scale: 1; }
.sbp-board--example-premiere .sbp-bottle-card--3 { --sbp-card-x: -1px; --sbp-card-y: 5px; --sbp-card-scale: .98; }
.sbp-board--example-premiere .sbp-bottle-card--4 { --sbp-card-x: 5px; --sbp-card-y: -7px; --sbp-card-scale: 1.01; }
.sbp-board--example-premiere .sbp-bottle-card--5 { --sbp-card-x: -3px; --sbp-card-y: 7px; --sbp-card-scale: .96; }
.sbp-board--example-premiere .sbp-bottle-card--6 { --sbp-card-x: 5px; --sbp-card-y: -4px; --sbp-card-scale: .99; }
.sbp-board--example-premiere .sbp-bottle-card--7 { --sbp-card-x: -5px; --sbp-card-y: 6px; --sbp-card-scale: 1.02; }
.sbp-board--example-premiere .sbp-bottle-card--8 { --sbp-card-x: 3px; --sbp-card-y: -8px; --sbp-card-scale: 1; }
.sbp-board--example-premiere .sbp-bottle-card--9 { --sbp-card-x: -2px; --sbp-card-y: 4px; --sbp-card-scale: .99; }
.sbp-board--example-premiere .sbp-bottle-card--10 { --sbp-card-x: 4px; --sbp-card-y: -5px; --sbp-card-scale: .97; }
.sbp-board--example-premiere .sbp-bottle-card--11 { --sbp-card-x: -5px; --sbp-card-y: 5px; --sbp-card-scale: .97; }
.sbp-board--example-premiere .sbp-bottle-card--12 { --sbp-card-x: 2px; --sbp-card-y: -6px; --sbp-card-scale: 1.01; }
.sbp-board--example-premiere .sbp-bottle-card--13 { --sbp-card-x: 5px; --sbp-card-y: 7px; --sbp-card-scale: .98; }
.sbp-board--example-premiere .sbp-bottle-card--14 { --sbp-card-x: -3px; --sbp-card-y: -5px; --sbp-card-scale: 1; }
.sbp-board--example-premiere .sbp-bottle-card--15 { --sbp-card-x: 4px; --sbp-card-y: 6px; --sbp-card-scale: .96; }

.sbp-is-editable.sbp-board--example-premiere .sbp-bottle-card:hover,
.sbp-board--example-premiere .sbp-bottle-card:focus-visible {
	transform: translate3d(var(--sbp-card-x), calc(var(--sbp-card-y) - 3px), 0) scale(calc(var(--sbp-card-scale) * 1.025)) !important;
	filter: brightness(1.08);
	outline: 0;
}

.sbp-board--example-premiere .sbp-bottle-svg-wrap {
	width: var(--sbp-example-bottle-width) !important;
	max-width: var(--sbp-example-bottle-width) !important;
	pointer-events: none;
}

.sbp-board--example-premiere .sbp-bottle-meta {
	width: 100%;
	min-height: 1.35em !important;
	line-height: 1.1 !important;
	margin-top: 0 !important;
	padding: 0 2px;
}

.sbp-board--example-premiere .sbp-bottle-label,
.sbp-board--example-premiere .sbp-label-input {
	font-size: clamp(.57rem, .72vw, .68rem) !important;
	line-height: 1.12 !important;
	font-weight: 800;
	letter-spacing: .018em !important;
	max-width: 100%;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	color: rgba(255, 249, 195, .97);
	text-shadow:
		0 0 4px rgba(255, 216, 77, .40),
		0 0 10px rgba(97, 223, 255, .10),
		0 1px 2px rgba(0,0,0,.72);
}

@media (max-width: 760px) {
	.sbp-board--example-premiere {
		--sbp-example-bottle-width: clamp(68px, 23.4vw, 86px);
		--sbp-example-bottle-gap-x: clamp(0px, 1.4vw, 6px);
		--sbp-example-bottle-gap-y: clamp(5px, 1.7vw, 10px);
		width: 100vw !important;
		max-width: 100vw !important;
		margin-left: calc(50% - 50vw) !important;
		margin-right: calc(50% - 50vw) !important;
		min-height: clamp(770px, 198vw, 980px) !important;
		border-radius: 0 !important;
	}

	.sbp-board--example-premiere .sbp-example-brand {
		top: 9px !important;
		left: 12px !important;
		width: min(46vw, 170px) !important;
	}

	.sbp-board--example-premiere .sbp-example-character {
		left: clamp(-96px, -24vw, -52px) !important;
		top: clamp(58px, 15vw, 92px) !important;
		bottom: auto !important;
		height: clamp(410px, 106vw, 560px) !important;
		max-width: none !important;
		opacity: .28 !important;
		-webkit-mask-image:
			linear-gradient(90deg, #000 0%, #000 46%, rgba(0,0,0,.50) 68%, transparent 100%),
			linear-gradient(0deg, transparent 0%, #000 10%, #000 84%, transparent 100%) !important;
		mask-image:
			linear-gradient(90deg, #000 0%, #000 46%, rgba(0,0,0,.50) 68%, transparent 100%),
			linear-gradient(0deg, transparent 0%, #000 10%, #000 84%, transparent 100%) !important;
	}

	.sbp-board--example-premiere .sbp-example-grid-wrap {
		inset: 62px 6px 18px 6px !important;
		align-items: stretch !important;
	}

	.sbp-board--example-premiere .sbp-grid {
		grid-template-columns: repeat(3, minmax(88px, 1fr)) !important;
		grid-template-rows: repeat(5, minmax(132px, 1fr)) !important;
		gap: var(--sbp-example-bottle-gap-y) var(--sbp-example-bottle-gap-x) !important;
		width: 100% !important;
		height: 100% !important;
	}

	.sbp-board--example-premiere .sbp-bottle-card,
	.sbp-board--example-premiere .sbp-theme-simple .sbp-bottle-card,
	.sbp-board--example-premiere .sbp-theme-mono .sbp-bottle-card {
		width: calc(var(--sbp-example-bottle-width) + 12px) !important;
		min-width: calc(var(--sbp-example-bottle-width) + 12px) !important;
		min-height: clamp(126px, 35vw, 154px) !important;
		padding: 4px 5px 6px !important;
	}

	.sbp-board--example-premiere .sbp-bottle-card--1,
	.sbp-board--example-premiere .sbp-bottle-card--4,
	.sbp-board--example-premiere .sbp-bottle-card--7,
	.sbp-board--example-premiere .sbp-bottle-card--10,
	.sbp-board--example-premiere .sbp-bottle-card--13 { --sbp-card-x: -2px; --sbp-card-y: 3px; --sbp-card-scale: .98; }
	.sbp-board--example-premiere .sbp-bottle-card--2,
	.sbp-board--example-premiere .sbp-bottle-card--5,
	.sbp-board--example-premiere .sbp-bottle-card--8,
	.sbp-board--example-premiere .sbp-bottle-card--11,
	.sbp-board--example-premiere .sbp-bottle-card--14 { --sbp-card-x: 0px; --sbp-card-y: -3px; --sbp-card-scale: 1; }
	.sbp-board--example-premiere .sbp-bottle-card--3,
	.sbp-board--example-premiere .sbp-bottle-card--6,
	.sbp-board--example-premiere .sbp-bottle-card--9,
	.sbp-board--example-premiere .sbp-bottle-card--12,
	.sbp-board--example-premiere .sbp-bottle-card--15 { --sbp-card-x: 2px; --sbp-card-y: 3px; --sbp-card-scale: .98; }

	.sbp-board--example-premiere .sbp-bottle-label,
	.sbp-board--example-premiere .sbp-label-input {
		font-size: clamp(.52rem, 2.35vw, .62rem) !important;
		letter-spacing: 0 !important;
	}
}

@media (max-width: 380px) {
	.sbp-board--example-premiere {
		--sbp-example-bottle-width: clamp(62px, 22.2vw, 78px);
		min-height: 730px !important;
	}

	.sbp-board--example-premiere .sbp-grid {
		grid-template-columns: repeat(3, minmax(82px, 1fr)) !important;
		grid-template-rows: repeat(5, minmax(124px, 1fr)) !important;
	}

	.sbp-board--example-premiere .sbp-bottle-card,
	.sbp-board--example-premiere .sbp-theme-simple .sbp-bottle-card,
	.sbp-board--example-premiere .sbp-theme-mono .sbp-bottle-card {
		min-height: 120px !important;
	}
}

/* v3.0 [seiheki_bottle_example] character-safe composition.
 * Keep the current character artwork position untouched and reserve the left-side
 * character lane. Bottles are distributed in the remaining stage area with no
 * table/shelf/border impression and with comfortable tap targets.
 */
.sbp-board--example-premiere {
	--sbp-example-bottle-width: clamp(66px, 5.9vw, 88px);
	--sbp-example-bottle-gap-x: clamp(12px, 1.55vw, 24px);
	--sbp-example-bottle-gap-y: clamp(18px, 2.1vw, 30px);
	min-height: clamp(560px, 54vw, 720px) !important;
	background:
		radial-gradient(circle at 16% 42%, rgba(255, 150, 205, .23), transparent 34%),
		radial-gradient(circle at 74% 17%, rgba(255, 216, 77, .18), transparent 30%),
		radial-gradient(circle at 72% 79%, rgba(74, 218, 255, .13), transparent 33%),
		linear-gradient(132deg, #05050b 0%, #0d0916 38%, #151022 64%, #05050c 100%) !important;
}

.sbp-board--example-premiere .sbp-example-grid-wrap {
	/* Character-safe lane: do not place bottles in the left visual column. */
	inset: clamp(76px, 8vw, 110px) clamp(28px, 4.8vw, 70px) clamp(30px, 4vw, 54px) clamp(260px, 30vw, 400px) !important;
	justify-content: center !important;
	align-items: stretch !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
}

.sbp-board--example-premiere .sbp-grid {
	grid-template-columns: repeat(4, minmax(76px, var(--sbp-example-bottle-width))) !important;
	grid-template-rows: repeat(3, minmax(146px, 1fr)) !important;
	gap: var(--sbp-example-bottle-gap-y) var(--sbp-example-bottle-gap-x) !important;
	width: min(100%, 760px) !important;
	height: 100% !important;
	align-content: space-evenly !important;
	justify-content: space-evenly !important;
	place-items: center !important;
	padding: 0 !important;
	margin: 0 auto !important;
}

.sbp-board--example-premiere .sbp-bottle-card,
.sbp-board--example-premiere .sbp-theme-simple .sbp-bottle-card,
.sbp-board--example-premiere .sbp-theme-mono .sbp-bottle-card {
	width: calc(var(--sbp-example-bottle-width) + 26px) !important;
	min-width: calc(var(--sbp-example-bottle-width) + 26px) !important;
	min-height: clamp(148px, 13.8vw, 184px) !important;
	padding: 7px 9px 8px !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
}

/* A soft constellation rather than a visible table: slight offsets only, never enough to overlap. */
.sbp-board--example-premiere .sbp-bottle-card--1 { --sbp-card-x: -5px; --sbp-card-y: 7px; --sbp-card-scale: .98; }
.sbp-board--example-premiere .sbp-bottle-card--2 { --sbp-card-x: 2px; --sbp-card-y: -7px; --sbp-card-scale: 1.02; }
.sbp-board--example-premiere .sbp-bottle-card--3 { --sbp-card-x: 4px; --sbp-card-y: 4px; --sbp-card-scale: .99; }
.sbp-board--example-premiere .sbp-bottle-card--4 { --sbp-card-x: -2px; --sbp-card-y: -5px; --sbp-card-scale: 1; }
.sbp-board--example-premiere .sbp-bottle-card--5 { --sbp-card-x: 3px; --sbp-card-y: -3px; --sbp-card-scale: 1.01; }
.sbp-board--example-premiere .sbp-bottle-card--6 { --sbp-card-x: -4px; --sbp-card-y: 6px; --sbp-card-scale: .99; }
.sbp-board--example-premiere .sbp-bottle-card--7 { --sbp-card-x: 5px; --sbp-card-y: -8px; --sbp-card-scale: 1.03; }
.sbp-board--example-premiere .sbp-bottle-card--8 { --sbp-card-x: -3px; --sbp-card-y: 4px; --sbp-card-scale: .98; }
.sbp-board--example-premiere .sbp-bottle-card--9 { --sbp-card-x: -2px; --sbp-card-y: 6px; --sbp-card-scale: .98; }
.sbp-board--example-premiere .sbp-bottle-card--10 { --sbp-card-x: 4px; --sbp-card-y: -4px; --sbp-card-scale: 1.01; }
.sbp-board--example-premiere .sbp-bottle-card--11 { --sbp-card-x: -5px; --sbp-card-y: -2px; --sbp-card-scale: 1; }
.sbp-board--example-premiere .sbp-bottle-card--12 { --sbp-card-x: 3px; --sbp-card-y: 7px; --sbp-card-scale: .98; }
.sbp-board--example-premiere .sbp-bottle-card--13,
.sbp-board--example-premiere .sbp-bottle-card--14,
.sbp-board--example-premiere .sbp-bottle-card--15 { display: none !important; }

.sbp-board--example-premiere .sbp-bottle-card::before {
	inset: 8px 4px 2px !important;
	opacity: .76 !important;
}

.sbp-board--example-premiere .sbp-bottle-label,
.sbp-board--example-premiere .sbp-label-input {
	font-size: clamp(.58rem, .70vw, .68rem) !important;
	line-height: 1.12 !important;
}

@media (min-width: 761px) and (max-width: 1020px) {
	.sbp-board--example-premiere .sbp-example-grid-wrap {
		inset: clamp(74px, 8vw, 104px) clamp(18px, 3vw, 38px) clamp(28px, 4vw, 46px) clamp(220px, 27vw, 300px) !important;
	}
	.sbp-board--example-premiere {
		--sbp-example-bottle-width: clamp(62px, 6vw, 76px);
		--sbp-example-bottle-gap-x: clamp(8px, 1vw, 14px);
		--sbp-example-bottle-gap-y: clamp(14px, 1.4vw, 22px);
	}
}

@media (max-width: 760px) {
	.sbp-board--example-premiere {
		--sbp-example-bottle-width: clamp(70px, 24vw, 88px);
		--sbp-example-bottle-gap-x: clamp(0px, 1.4vw, 6px);
		--sbp-example-bottle-gap-y: clamp(8px, 2.2vw, 14px);
		min-height: clamp(700px, 176vw, 900px) !important;
	}

	.sbp-board--example-premiere .sbp-example-grid-wrap {
		/* On phones, keep the stage readable while the character remains a soft background layer. */
		inset: 62px 6px 18px 6px !important;
	}

	.sbp-board--example-premiere .sbp-grid {
		grid-template-columns: repeat(3, minmax(88px, 1fr)) !important;
		grid-template-rows: repeat(4, minmax(138px, 1fr)) !important;
		gap: var(--sbp-example-bottle-gap-y) var(--sbp-example-bottle-gap-x) !important;
	}

	.sbp-board--example-premiere .sbp-bottle-card,
	.sbp-board--example-premiere .sbp-theme-simple .sbp-bottle-card,
	.sbp-board--example-premiere .sbp-theme-mono .sbp-bottle-card {
		width: calc(var(--sbp-example-bottle-width) + 14px) !important;
		min-width: calc(var(--sbp-example-bottle-width) + 14px) !important;
		min-height: clamp(130px, 36vw, 160px) !important;
		padding: 4px 5px 6px !important;
	}

	.sbp-board--example-premiere .sbp-bottle-card--1,
	.sbp-board--example-premiere .sbp-bottle-card--4,
	.sbp-board--example-premiere .sbp-bottle-card--7,
	.sbp-board--example-premiere .sbp-bottle-card--10 { --sbp-card-x: -2px; --sbp-card-y: 3px; --sbp-card-scale: .98; }
	.sbp-board--example-premiere .sbp-bottle-card--2,
	.sbp-board--example-premiere .sbp-bottle-card--5,
	.sbp-board--example-premiere .sbp-bottle-card--8,
	.sbp-board--example-premiere .sbp-bottle-card--11 { --sbp-card-x: 0px; --sbp-card-y: -3px; --sbp-card-scale: 1; }
	.sbp-board--example-premiere .sbp-bottle-card--3,
	.sbp-board--example-premiere .sbp-bottle-card--6,
	.sbp-board--example-premiere .sbp-bottle-card--9,
	.sbp-board--example-premiere .sbp-bottle-card--12 { --sbp-card-x: 2px; --sbp-card-y: 3px; --sbp-card-scale: .98; }
}

/* v3.1 [seiheki_bottle_example] stage-fit constellation.
 * Same visual composition on desktop and mobile: character stays in the left
 * gradient atmosphere, bottles become smaller, never use a shelf/table/grid look,
 * and every bottle remains within the stage bounds with reliable tap targets.
 */
.sbp-board--example-premiere {
	--sbp-example-bottle-width: clamp(38px, 4.7vw, 62px);
	--sbp-example-tap-width: clamp(64px, 7.1vw, 92px);
	--sbp-example-tap-height: clamp(104px, 11vw, 142px);
	position: relative !important;
	isolation: isolate !important;
	width: 100% !important;
	max-width: 100% !important;
	min-height: clamp(500px, 62vw, 700px) !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: clamp(18px, 2.4vw, 30px) !important;
	overflow: hidden !important;
	background:
		radial-gradient(circle at 12% 39%, rgba(255, 150, 205, .25), transparent 35%),
		radial-gradient(circle at 58% 12%, rgba(255, 216, 77, .16), transparent 32%),
		radial-gradient(circle at 88% 77%, rgba(74, 218, 255, .13), transparent 36%),
		radial-gradient(circle at 32% 87%, rgba(128, 70, 255, .12), transparent 42%),
		linear-gradient(132deg, #05050b 0%, #0d0916 39%, #151022 66%, #05050c 100%) !important;
	box-shadow:
		inset 0 -52px 138px rgba(0, 0, 0, .58),
		0 24px 80px rgba(0, 0, 0, .30) !important;
}

.sbp-board--example-premiere::before {
	background:
		linear-gradient(110deg, rgba(255,255,255,.050), transparent 28%, transparent 70%, rgba(240,230,140,.040)),
		radial-gradient(circle at 22% 58%, rgba(255, 216, 77, .052), transparent 38%),
		repeating-linear-gradient(116deg, rgba(255,255,255,.014) 0 1px, transparent 1px 25px) !important;
	opacity: .62 !important;
	border: 0 !important;
}

.sbp-board--example-premiere::after {
	background:
		linear-gradient(90deg, rgba(0,0,0,.02), rgba(0,0,0,.10) 48%, rgba(0,0,0,0) 72%),
		linear-gradient(0deg, rgba(0,0,0,.44) 0%, transparent 36%, rgba(0,0,0,.18) 100%) !important;
	border: 0 !important;
}

.sbp-board--example-premiere .sbp-example-stage {
	position: relative !important;
	z-index: 2 !important;
	width: 100% !important;
	min-height: inherit !important;
	height: 100% !important;
	padding: 0 !important;
	overflow: hidden !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
}

.sbp-board--example-premiere .sbp-example-stage::before {
	left: -10% !important;
	bottom: -16% !important;
	width: 68% !important;
	height: 108% !important;
	background:
		radial-gradient(circle at 44% 38%, rgba(255, 184, 214, .26), transparent 42%),
		radial-gradient(circle at 55% 73%, rgba(240, 230, 140, .13), transparent 48%) !important;
	filter: blur(16px) !important;
	opacity: .82 !important;
	border: 0 !important;
}

.sbp-board--example-premiere .sbp-example-light--gold {
	right: 8% !important;
	top: 9% !important;
	width: 46% !important;
	height: 40% !important;
	background: rgba(255, 216, 77, .11) !important;
}

.sbp-board--example-premiere .sbp-example-light--cyan {
	right: 39% !important;
	bottom: 8% !important;
	width: 36% !important;
	height: 36% !important;
	background: rgba(72, 222, 255, .078) !important;
}

.sbp-board--example-premiere .sbp-example-character {
	position: absolute !important;
	z-index: 1 !important;
	left: clamp(-70px, -4vw, -24px) !important;
	bottom: clamp(-56px, -4.4vw, -20px) !important;
	top: auto !important;
	height: clamp(430px, 91%, 650px) !important;
	width: auto !important;
	max-width: none !important;
	max-height: none !important;
	object-fit: contain !important;
	object-position: left bottom !important;
	opacity: .46 !important;
	filter:
		drop-shadow(0 0 22px rgba(255, 155, 205, .20))
		drop-shadow(0 28px 48px rgba(0, 0, 0, .62)) !important;
	-webkit-mask-image:
		linear-gradient(90deg, #000 0%, #000 42%, rgba(0,0,0,.66) 60%, rgba(0,0,0,.25) 76%, transparent 100%),
		linear-gradient(0deg, transparent 0%, #000 10%, #000 92%, transparent 100%) !important;
	-webkit-mask-composite: source-in !important;
	mask-image:
		linear-gradient(90deg, #000 0%, #000 42%, rgba(0,0,0,.66) 60%, rgba(0,0,0,.25) 76%, transparent 100%),
		linear-gradient(0deg, transparent 0%, #000 10%, #000 92%, transparent 100%) !important;
	mask-composite: intersect !important;
	pointer-events: none !important;
}

.sbp-board--example-premiere .sbp-example-brand {
	z-index: 22 !important;
	top: clamp(10px, 1.5vw, 22px) !important;
	left: clamp(12px, 1.8vw, 28px) !important;
	width: clamp(126px, 16vw, 220px) !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
}

.sbp-board--example-premiere .sbp-example-logo {
	opacity: .72 !important;
	filter:
		drop-shadow(0 0 6px rgba(255, 216, 77, .16))
		drop-shadow(0 0 14px rgba(255, 91, 165, .08))
		drop-shadow(0 6px 18px rgba(0, 0, 0, .52)) !important;
}

.sbp-board--example-premiere .sbp-example-grid-wrap {
	position: absolute !important;
	z-index: 9 !important;
	inset: clamp(62px, 7vw, 92px) clamp(12px, 3.4vw, 52px) clamp(26px, 3.8vw, 54px) clamp(12px, 3.4vw, 52px) !important;
	width: auto !important;
	min-width: 0 !important;
	height: auto !important;
	display: block !important;
	padding: 0 !important;
	margin: 0 !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	overflow: visible !important;
}

.sbp-board--example-premiere .sbp-example-grid-wrap::before,
.sbp-board--example-premiere .sbp-example-grid-wrap::after {
	display: none !important;
	content: none !important;
	border: 0 !important;
	background: none !important;
	box-shadow: none !important;
}

.sbp-board--example-premiere .sbp-grid {
	position: absolute !important;
	z-index: 4 !important;
	inset: 0 !important;
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	overflow: visible !important;
}

.sbp-board--example-premiere .sbp-bottle-card,
.sbp-board--example-premiere .sbp-theme-simple .sbp-bottle-card,
.sbp-board--example-premiere .sbp-theme-mono .sbp-bottle-card {
	--sbp-card-left: 50%;
	--sbp-card-top: 50%;
	--sbp-card-scale: 1;
	position: absolute !important;
	left: var(--sbp-card-left) !important;
	top: var(--sbp-card-top) !important;
	right: auto !important;
	bottom: auto !important;
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
	width: var(--sbp-example-tap-width) !important;
	min-width: var(--sbp-example-tap-width) !important;
	max-width: var(--sbp-example-tap-width) !important;
	min-height: var(--sbp-example-tap-height) !important;
	padding: 5px 6px 6px !important;
	gap: 2px !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	border-radius: 0 !important;
	transform: translate3d(-50%, -50%, 0) scale(var(--sbp-card-scale)) !important;
	transform-origin: center center !important;
	cursor: pointer !important;
	touch-action: none !important;
	-webkit-tap-highlight-color: transparent !important;
	contain: layout paint !important;
}

.sbp-board--example-premiere .sbp-bottle-card::before {
	content: "" !important;
	position: absolute !important;
	inset: 8px 8px 0 !important;
	z-index: -1 !important;
	border-radius: 999px !important;
	border: 0 !important;
	background:
		radial-gradient(ellipse at 50% 42%, rgba(255, 216, 77, .060), transparent 58%),
		radial-gradient(ellipse at 50% 86%, rgba(74, 220, 255, .030), transparent 64%) !important;
	filter: blur(.7px) !important;
	opacity: .74 !important;
	pointer-events: none !important;
}

/* Character-safe, evenly distributed constellation. Nothing occupies the left lane. */
.sbp-board--example-premiere .sbp-bottle-card--1 { --sbp-card-left: 34%; --sbp-card-top: 19%; --sbp-card-scale: .95; }
.sbp-board--example-premiere .sbp-bottle-card--2 { --sbp-card-left: 49%; --sbp-card-top: 15%; --sbp-card-scale: 1.01; }
.sbp-board--example-premiere .sbp-bottle-card--3 { --sbp-card-left: 65%; --sbp-card-top: 20%; --sbp-card-scale: .98; }
.sbp-board--example-premiere .sbp-bottle-card--4 { --sbp-card-left: 82%; --sbp-card-top: 16%; --sbp-card-scale: .95; }
.sbp-board--example-premiere .sbp-bottle-card--5 { --sbp-card-left: 39%; --sbp-card-top: 46%; --sbp-card-scale: 1; }
.sbp-board--example-premiere .sbp-bottle-card--6 { --sbp-card-left: 56%; --sbp-card-top: 42%; --sbp-card-scale: .96; }
.sbp-board--example-premiere .sbp-bottle-card--7 { --sbp-card-left: 72%; --sbp-card-top: 48%; --sbp-card-scale: 1.03; }
.sbp-board--example-premiere .sbp-bottle-card--8 { --sbp-card-left: 88%; --sbp-card-top: 43%; --sbp-card-scale: .96; }
.sbp-board--example-premiere .sbp-bottle-card--9 { --sbp-card-left: 34%; --sbp-card-top: 74%; --sbp-card-scale: .95; }
.sbp-board--example-premiere .sbp-bottle-card--10 { --sbp-card-left: 51%; --sbp-card-top: 70%; --sbp-card-scale: 1.01; }
.sbp-board--example-premiere .sbp-bottle-card--11 { --sbp-card-left: 68%; --sbp-card-top: 77%; --sbp-card-scale: .98; }
.sbp-board--example-premiere .sbp-bottle-card--12 { --sbp-card-left: 85%; --sbp-card-top: 72%; --sbp-card-scale: .94; }
.sbp-board--example-premiere .sbp-bottle-card--13,
.sbp-board--example-premiere .sbp-bottle-card--14,
.sbp-board--example-premiere .sbp-bottle-card--15,
.sbp-board--example-premiere .sbp-bottle-card--16,
.sbp-board--example-premiere .sbp-bottle-card--17,
.sbp-board--example-premiere .sbp-bottle-card--18,
.sbp-board--example-premiere .sbp-bottle-card--19,
.sbp-board--example-premiere .sbp-bottle-card--20 {
	display: none !important;
}

.sbp-is-editable.sbp-board--example-premiere .sbp-bottle-card:hover,
.sbp-board--example-premiere .sbp-bottle-card:focus-visible {
	transform: translate3d(-50%, calc(-50% - 2px), 0) scale(calc(var(--sbp-card-scale) * 1.03)) !important;
	filter: brightness(1.08) !important;
	outline: 0 !important;
}

.sbp-board--example-premiere .sbp-bottle-svg-wrap {
	width: var(--sbp-example-bottle-width) !important;
	max-width: var(--sbp-example-bottle-width) !important;
	min-width: var(--sbp-example-bottle-width) !important;
	pointer-events: none !important;
	filter:
		drop-shadow(0 0 3px rgba(240, 230, 140, .70))
		drop-shadow(0 0 10px rgba(255, 216, 77, .20))
		drop-shadow(0 12px 16px rgba(0, 0, 0, .45)) !important;
}

.sbp-board--example-premiere .sbp-bottle-svg {
	width: 100% !important;
	height: auto !important;
	display: block !important;
}

.sbp-board--example-premiere .sbp-glass-line,
.sbp-board--example-premiere .sbp-bottle-outline,
.sbp-board--example-premiere .sbp-neck-line {
	stroke-width: 2.25 !important;
	filter:
		drop-shadow(0 0 2px rgba(240, 230, 140, .80))
		drop-shadow(0 0 7px rgba(240, 230, 140, .22)) !important;
}

.sbp-board--example-premiere .sbp-liquid-group {
	filter:
		drop-shadow(0 0 3px rgba(255, 216, 77, .64))
		drop-shadow(0 0 10px rgba(255, 216, 77, .20)) !important;
}

.sbp-board--example-premiere .sbp-bottle-meta {
	width: 100% !important;
	min-height: 1.25em !important;
	line-height: 1.05 !important;
	margin-top: 0 !important;
	padding: 0 1px !important;
	pointer-events: none !important;
}

.sbp-board--example-premiere .sbp-bottle-label,
.sbp-board--example-premiere .sbp-label-input {
	font-size: clamp(.48rem, .62vw, .60rem) !important;
	line-height: 1.08 !important;
	font-weight: 800 !important;
	letter-spacing: .01em !important;
	max-width: 100% !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	color: rgba(255, 249, 195, .96) !important;
	text-shadow:
		0 0 4px rgba(255, 216, 77, .38),
		0 0 10px rgba(97, 223, 255, .08),
		0 1px 2px rgba(0,0,0,.72) !important;
}

.sbp-board--example-premiere .sbp-percentage,
.sbp-board--example-premiere .sbp-toolbar,
.sbp-board--example-premiere .sbp-board-heading,
.sbp-board--example-premiere .sbp-board-title,
.sbp-board--example-premiere .sbp-board-description,
.sbp-board--example-premiere .sbp-save-status,
.sbp-board--example-premiere .sbp-export-png {
	display: none !important;
}

@media (max-width: 760px) {
	.sbp-board--example-premiere {
		--sbp-example-bottle-width: clamp(34px, 10.4vw, 44px);
		--sbp-example-tap-width: clamp(60px, 18.8vw, 72px);
		--sbp-example-tap-height: clamp(96px, 30vw, 118px);
		width: 100vw !important;
		max-width: 100vw !important;
		margin-left: calc(50% - 50vw) !important;
		margin-right: calc(50% - 50vw) !important;
		min-height: clamp(500px, 139vw, 620px) !important;
		border-radius: 0 !important;
	}

	.sbp-board--example-premiere .sbp-example-brand {
		top: 9px !important;
		left: 11px !important;
		width: min(42vw, 154px) !important;
	}

	.sbp-board--example-premiere .sbp-example-character {
		left: clamp(-58px, -13vw, -24px) !important;
		bottom: clamp(-48px, -10vw, -22px) !important;
		top: auto !important;
		height: clamp(390px, 94vw, 520px) !important;
		max-width: none !important;
		opacity: .42 !important;
	}

	.sbp-board--example-premiere .sbp-example-grid-wrap {
		inset: 54px 6px 20px 6px !important;
	}

	.sbp-board--example-premiere .sbp-bottle-label,
	.sbp-board--example-premiere .sbp-label-input {
		font-size: clamp(.45rem, 2.05vw, .54rem) !important;
		letter-spacing: 0 !important;
	}
}

@media (max-width: 380px) {
	.sbp-board--example-premiere {
		--sbp-example-bottle-width: clamp(31px, 9.8vw, 39px);
		--sbp-example-tap-width: 58px;
		--sbp-example-tap-height: 92px;
		min-height: 480px !important;
	}

	.sbp-board--example-premiere .sbp-example-grid-wrap {
		inset: 52px 4px 18px 4px !important;
	}

	.sbp-board--example-premiere .sbp-bottle-label,
	.sbp-board--example-premiere .sbp-label-input {
		font-size: .43rem !important;
	}
}


/* v3.2 [seiheki_bottle_example] stage-fit refinement.
 * Fixed 380px visual height, stronger character presence, larger logo,
 * and 15 intentionally scattered bottles that avoid the logo/character zones.
 * The composition is identical on PC and mobile to prevent layout regressions.
 */
.sbp-board--example-premiere {
	--sbp-example-bottle-width: clamp(31px, 4.1vw, 46px) !important;
	--sbp-example-tap-width: clamp(48px, 6.1vw, 68px) !important;
	--sbp-example-tap-height: clamp(72px, 8.1vw, 96px) !important;
	height: 380px !important;
	min-height: 380px !important;
	max-height: 380px !important;
	width: 100% !important;
	max-width: 100% !important;
	border: 0 !important;
	border-radius: clamp(16px, 2vw, 28px) !important;
	overflow: hidden !important;
	background:
		radial-gradient(circle at 10% 44%, rgba(255, 142, 203, .30), transparent 36%),
		radial-gradient(circle at 33% 18%, rgba(240, 230, 140, .16), transparent 28%),
		radial-gradient(circle at 78% 22%, rgba(255, 216, 77, .13), transparent 35%),
		radial-gradient(circle at 86% 78%, rgba(74, 218, 255, .14), transparent 35%),
		radial-gradient(circle at 42% 92%, rgba(128, 70, 255, .13), transparent 40%),
		linear-gradient(132deg, #05050b 0%, #0d0916 41%, #141022 68%, #05050c 100%) !important;
}

.sbp-board--example-premiere .sbp-example-stage {
	height: 380px !important;
	min-height: 380px !important;
	max-height: 380px !important;
}

.sbp-board--example-premiere .sbp-example-stage::before {
	left: -16% !important;
	bottom: -34% !important;
	width: 78% !important;
	height: 142% !important;
	background:
		radial-gradient(circle at 36% 33%, rgba(255, 184, 214, .30), transparent 43%),
		radial-gradient(circle at 54% 72%, rgba(240, 230, 140, .15), transparent 49%),
		linear-gradient(90deg, rgba(255,255,255,.035), transparent 74%) !important;
	filter: blur(18px) !important;
	opacity: .92 !important;
}

.sbp-board--example-premiere .sbp-example-character {
	left: clamp(-82px, -5.8vw, -34px) !important;
	bottom: -62px !important;
	height: 456px !important;
	min-height: 456px !important;
	width: auto !important;
	max-width: none !important;
	max-height: none !important;
	opacity: .58 !important;
	filter:
		drop-shadow(0 0 24px rgba(255, 155, 205, .24))
		drop-shadow(0 0 34px rgba(240, 230, 140, .08))
		drop-shadow(0 26px 52px rgba(0, 0, 0, .66)) !important;
	-webkit-mask-image:
		linear-gradient(90deg, #000 0%, #000 50%, rgba(0,0,0,.76) 64%, rgba(0,0,0,.34) 80%, transparent 100%),
		linear-gradient(0deg, transparent 0%, #000 8%, #000 94%, transparent 100%) !important;
	mask-image:
		linear-gradient(90deg, #000 0%, #000 50%, rgba(0,0,0,.76) 64%, rgba(0,0,0,.34) 80%, transparent 100%),
		linear-gradient(0deg, transparent 0%, #000 8%, #000 94%, transparent 100%) !important;
}

.sbp-board--example-premiere .sbp-example-brand {
	top: clamp(10px, 1.2vw, 18px) !important;
	left: clamp(12px, 1.5vw, 24px) !important;
	width: clamp(174px, 21vw, 282px) !important;
	z-index: 24 !important;
}

.sbp-board--example-premiere .sbp-example-logo {
	opacity: .80 !important;
	filter:
		drop-shadow(0 0 8px rgba(255, 216, 77, .20))
		drop-shadow(0 0 18px rgba(255, 91, 165, .10))
		drop-shadow(0 8px 20px rgba(0, 0, 0, .54)) !important;
}

.sbp-board--example-premiere .sbp-example-grid-wrap {
	inset: 0 !important;
	height: 380px !important;
	min-height: 380px !important;
	max-height: 380px !important;
	overflow: visible !important;
}

.sbp-board--example-premiere .sbp-grid {
	height: 380px !important;
	min-height: 380px !important;
	max-height: 380px !important;
}

.sbp-board--example-premiere .sbp-bottle-card,
.sbp-board--example-premiere .sbp-theme-simple .sbp-bottle-card,
.sbp-board--example-premiere .sbp-theme-mono .sbp-bottle-card {
	--sbp-card-rotate: 0deg;
	width: var(--sbp-example-tap-width) !important;
	min-width: var(--sbp-example-tap-width) !important;
	max-width: var(--sbp-example-tap-width) !important;
	min-height: var(--sbp-example-tap-height) !important;
	padding: 3px 4px 5px !important;
	gap: 1px !important;
	transform: translate3d(-50%, -50%, 0) rotate(var(--sbp-card-rotate)) scale(var(--sbp-card-scale)) !important;
	contain: layout paint style !important;
}

.sbp-is-editable.sbp-board--example-premiere .sbp-bottle-card:hover,
.sbp-board--example-premiere .sbp-bottle-card:focus-visible {
	transform: translate3d(-50%, calc(-50% - 2px), 0) rotate(var(--sbp-card-rotate)) scale(calc(var(--sbp-card-scale) * 1.04)) !important;
}

.sbp-board--example-premiere .sbp-bottle-svg-wrap {
	width: var(--sbp-example-bottle-width) !important;
	max-width: var(--sbp-example-bottle-width) !important;
	min-width: var(--sbp-example-bottle-width) !important;
}

/* Fifteen-bottle scattered composition. Reserved zones:
 * left character area and upper-left logo area stay clear.
 */
.sbp-board--example-premiere .sbp-bottle-card--1  { --sbp-card-left: 72%; --sbp-card-top: 17%; --sbp-card-scale: .95; --sbp-card-rotate: -3.5deg; }
.sbp-board--example-premiere .sbp-bottle-card--2  { --sbp-card-left: 87%; --sbp-card-top: 21%; --sbp-card-scale: .88; --sbp-card-rotate: 3deg; }
.sbp-board--example-premiere .sbp-bottle-card--3  { --sbp-card-left: 50%; --sbp-card-top: 32%; --sbp-card-scale: 1.00; --sbp-card-rotate: 2deg; }
.sbp-board--example-premiere .sbp-bottle-card--4  { --sbp-card-left: 64%; --sbp-card-top: 36%; --sbp-card-scale: .91; --sbp-card-rotate: -2deg; }
.sbp-board--example-premiere .sbp-bottle-card--5  { --sbp-card-left: 78%; --sbp-card-top: 35%; --sbp-card-scale: 1.04; --sbp-card-rotate: 1.5deg; }
.sbp-board--example-premiere .sbp-bottle-card--6  { --sbp-card-left: 89%; --sbp-card-top: 43%; --sbp-card-scale: .86; --sbp-card-rotate: -4deg; }
.sbp-board--example-premiere .sbp-bottle-card--7  { --sbp-card-left: 47%; --sbp-card-top: 52%; --sbp-card-scale: .88; --sbp-card-rotate: -1.5deg; }
.sbp-board--example-premiere .sbp-bottle-card--8  { --sbp-card-left: 57%; --sbp-card-top: 55%; --sbp-card-scale: 1.03; --sbp-card-rotate: 3.5deg; }
.sbp-board--example-premiere .sbp-bottle-card--9  { --sbp-card-left: 71%; --sbp-card-top: 59%; --sbp-card-scale: .92; --sbp-card-rotate: -2.5deg; }
.sbp-board--example-premiere .sbp-bottle-card--10 { --sbp-card-left: 86%; --sbp-card-top: 61%; --sbp-card-scale: 1.00; --sbp-card-rotate: 2deg; }
.sbp-board--example-premiere .sbp-bottle-card--11 { --sbp-card-left: 49%; --sbp-card-top: 77%; --sbp-card-scale: .96; --sbp-card-rotate: -3deg; }
.sbp-board--example-premiere .sbp-bottle-card--12 { --sbp-card-left: 63%; --sbp-card-top: 82%; --sbp-card-scale: 1.02; --sbp-card-rotate: 1deg; }
.sbp-board--example-premiere .sbp-bottle-card--13 { --sbp-card-left: 77%; --sbp-card-top: 80%; --sbp-card-scale: .90; --sbp-card-rotate: -1deg; }
.sbp-board--example-premiere .sbp-bottle-card--14 { --sbp-card-left: 88%; --sbp-card-top: 84%; --sbp-card-scale: .86; --sbp-card-rotate: 3deg; }
.sbp-board--example-premiere .sbp-bottle-card--15 { --sbp-card-left: 67%; --sbp-card-top: 69%; --sbp-card-scale: .86; --sbp-card-rotate: 4deg; }

.sbp-board--example-premiere .sbp-bottle-card--13,
.sbp-board--example-premiere .sbp-bottle-card--14,
.sbp-board--example-premiere .sbp-bottle-card--15 {
	display: flex !important;
}

.sbp-board--example-premiere .sbp-bottle-card--16,
.sbp-board--example-premiere .sbp-bottle-card--17,
.sbp-board--example-premiere .sbp-bottle-card--18,
.sbp-board--example-premiere .sbp-bottle-card--19,
.sbp-board--example-premiere .sbp-bottle-card--20 {
	display: none !important;
}

.sbp-board--example-premiere .sbp-bottle-meta {
	min-height: 1.12em !important;
	line-height: 1 !important;
}

.sbp-board--example-premiere .sbp-bottle-label,
.sbp-board--example-premiere .sbp-label-input {
	font-size: clamp(.43rem, .55vw, .56rem) !important;
	line-height: 1.02 !important;
	font-weight: 800 !important;
	letter-spacing: 0 !important;
}

@media (max-width: 760px) {
	.sbp-board--example-premiere {
		--sbp-example-bottle-width: clamp(29px, 8.8vw, 38px) !important;
		--sbp-example-tap-width: clamp(47px, 14.7vw, 58px) !important;
		--sbp-example-tap-height: clamp(68px, 21vw, 82px) !important;
		height: 380px !important;
		min-height: 380px !important;
		max-height: 380px !important;
		width: 100vw !important;
		max-width: 100vw !important;
		margin-left: calc(50% - 50vw) !important;
		margin-right: calc(50% - 50vw) !important;
		border-radius: 0 !important;
	}

	.sbp-board--example-premiere .sbp-example-stage,
	.sbp-board--example-premiere .sbp-example-grid-wrap,
	.sbp-board--example-premiere .sbp-grid {
		height: 380px !important;
		min-height: 380px !important;
		max-height: 380px !important;
	}

	.sbp-board--example-premiere .sbp-example-character {
		left: -74px !important;
		bottom: -70px !important;
		height: 448px !important;
		min-height: 448px !important;
		opacity: .60 !important;
	}

	.sbp-board--example-premiere .sbp-example-brand {
		top: 10px !important;
		left: 11px !important;
		width: clamp(166px, 52vw, 218px) !important;
	}

	.sbp-board--example-premiere .sbp-bottle-label,
	.sbp-board--example-premiere .sbp-label-input {
		font-size: clamp(.40rem, 1.75vw, .49rem) !important;
	}
}

@media (max-width: 380px) {
	.sbp-board--example-premiere {
		--sbp-example-bottle-width: clamp(27px, 8.6vw, 34px) !important;
		--sbp-example-tap-width: 46px !important;
		--sbp-example-tap-height: 66px !important;
		height: 380px !important;
		min-height: 380px !important;
		max-height: 380px !important;
	}

	.sbp-board--example-premiere .sbp-example-character {
		left: -84px !important;
		height: 440px !important;
		min-height: 440px !important;
	}

	.sbp-board--example-premiere .sbp-example-brand {
		width: 166px !important;
	}

	.sbp-board--example-premiere .sbp-bottle-label,
	.sbp-board--example-premiere .sbp-label-input {
		font-size: .38rem !important;
	}
}


/* v3.3 [seiheki_bottle_example] label legibility and collision-safe scatter.
 * Keep the 380px stage from v3.2, but make labels solid and readable in Chrome,
 * keep them horizontal, and use a fixed random-feeling 15-bottle composition whose
 * tap/label boxes do not overlap on desktop or iPhone widths.
 */
.sbp-board--example-premiere {
	--sbp-example-bottle-width: clamp(30px, 3.9vw, 44px) !important;
	--sbp-example-tap-width: clamp(46px, 5.7vw, 62px) !important;
	--sbp-example-tap-height: clamp(62px, 7.2vw, 78px) !important;
}

.sbp-board--example-premiere .sbp-bottle-card,
.sbp-board--example-premiere .sbp-theme-simple .sbp-bottle-card,
.sbp-board--example-premiere .sbp-theme-mono .sbp-bottle-card {
	transform: translate3d(-50%, -50%, 0) !important;
	overflow: visible !important;
	z-index: 18 !important;
}

.sbp-is-editable.sbp-board--example-premiere .sbp-bottle-card:hover,
.sbp-board--example-premiere .sbp-bottle-card:focus-visible {
	transform: translate3d(-50%, calc(-50% - 2px), 0) !important;
	z-index: 28 !important;
}

.sbp-board--example-premiere .sbp-bottle-svg-wrap {
	transform: rotate(var(--sbp-card-rotate)) scale(var(--sbp-card-scale)) !important;
	transform-origin: 50% 72% !important;
	will-change: transform !important;
}

.sbp-board--example-premiere .sbp-bottle-meta {
	position: relative !important;
	z-index: 6 !important;
	min-height: 1.18em !important;
	line-height: 1 !important;
	margin-top: 0 !important;
	pointer-events: none !important;
	isolation: isolate !important;
}

.sbp-board--example-premiere .sbp-bottle-label,
.sbp-board--example-premiere .sbp-label-input {
	box-sizing: border-box !important;
	display: inline-block !important;
	max-width: calc(var(--sbp-example-tap-width) + 4px) !important;
	min-width: 0 !important;
	padding: 1px 3px 1px !important;
	border: 0 !important;
	border-radius: 999px !important;
	background: linear-gradient(90deg, rgba(4, 4, 10, .54), rgba(4, 4, 10, .22)) !important;
	color: rgba(255, 250, 219, .98) !important;
	font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", "YuGothic", "Meiryo", system-ui, -apple-system, BlinkMacSystemFont, sans-serif !important;
	font-size: clamp(.51rem, .62vw, .61rem) !important;
	font-weight: 560 !important;
	line-height: 1.05 !important;
	letter-spacing: -.025em !important;
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	text-align: center !important;
	text-shadow: 0 1px 0 rgba(0, 0, 0, .88), 0 0 2px rgba(0, 0, 0, .42) !important;
	-webkit-font-smoothing: antialiased !important;
	-moz-osx-font-smoothing: grayscale !important;
	text-rendering: geometricPrecision !important;
	font-kerning: normal !important;
}

/* Collision-safe random-feeling placement. The upper-left logo zone and left
 * character zone are kept clear; rows are separated enough that labels never
 * collide with neighboring bottles at 320px+ viewport widths.
 */
.sbp-board--example-premiere .sbp-bottle-card--1  { --sbp-card-left: 62%; --sbp-card-top: 17%; --sbp-card-scale: .93; --sbp-card-rotate: -4deg; }
.sbp-board--example-premiere .sbp-bottle-card--2  { --sbp-card-left: 76%; --sbp-card-top: 18%; --sbp-card-scale: .99; --sbp-card-rotate: 2.4deg; }
.sbp-board--example-premiere .sbp-bottle-card--3  { --sbp-card-left: 89%; --sbp-card-top: 16%; --sbp-card-scale: .90; --sbp-card-rotate: -1.8deg; }

.sbp-board--example-premiere .sbp-bottle-card--4  { --sbp-card-left: 44%; --sbp-card-top: 41%; --sbp-card-scale: .88; --sbp-card-rotate: 2.2deg; }
.sbp-board--example-premiere .sbp-bottle-card--5  { --sbp-card-left: 58%; --sbp-card-top: 39.5%; --sbp-card-scale: 1.03; --sbp-card-rotate: -2.8deg; }
.sbp-board--example-premiere .sbp-bottle-card--6  { --sbp-card-left: 72%; --sbp-card-top: 42%; --sbp-card-scale: .92; --sbp-card-rotate: 3.3deg; }
.sbp-board--example-premiere .sbp-bottle-card--7  { --sbp-card-left: 86%; --sbp-card-top: 40%; --sbp-card-scale: 1.00; --sbp-card-rotate: -3deg; }

.sbp-board--example-premiere .sbp-bottle-card--8  { --sbp-card-left: 40%; --sbp-card-top: 66%; --sbp-card-scale: .94; --sbp-card-rotate: -2.4deg; }
.sbp-board--example-premiere .sbp-bottle-card--9  { --sbp-card-left: 54%; --sbp-card-top: 64%; --sbp-card-scale: .88; --sbp-card-rotate: 3.8deg; }
.sbp-board--example-premiere .sbp-bottle-card--10 { --sbp-card-left: 69%; --sbp-card-top: 66.5%; --sbp-card-scale: 1.03; --sbp-card-rotate: -1.5deg; }
.sbp-board--example-premiere .sbp-bottle-card--11 { --sbp-card-left: 84%; --sbp-card-top: 65%; --sbp-card-scale: .91; --sbp-card-rotate: 2deg; }

.sbp-board--example-premiere .sbp-bottle-card--12 { --sbp-card-left: 48%; --sbp-card-top: 88%; --sbp-card-scale: .89; --sbp-card-rotate: 3deg; }
.sbp-board--example-premiere .sbp-bottle-card--13 { --sbp-card-left: 63%; --sbp-card-top: 86.5%; --sbp-card-scale: 1.00; --sbp-card-rotate: -2.5deg; }
.sbp-board--example-premiere .sbp-bottle-card--14 { --sbp-card-left: 78%; --sbp-card-top: 88.5%; --sbp-card-scale: .93; --sbp-card-rotate: 1.8deg; }
.sbp-board--example-premiere .sbp-bottle-card--15 { --sbp-card-left: 91%; --sbp-card-top: 86.5%; --sbp-card-scale: .86; --sbp-card-rotate: -3.4deg; }

@media (max-width: 760px) {
	.sbp-board--example-premiere {
		--sbp-example-bottle-width: clamp(28px, 8.4vw, 36px) !important;
		--sbp-example-tap-width: clamp(44px, 13.4vw, 52px) !important;
		--sbp-example-tap-height: clamp(61px, 18.4vw, 70px) !important;
	}

	.sbp-board--example-premiere .sbp-bottle-label,
	.sbp-board--example-premiere .sbp-label-input {
		font-size: clamp(.47rem, 2.05vw, .55rem) !important;
		font-weight: 560 !important;
		letter-spacing: -.035em !important;
		max-width: calc(var(--sbp-example-tap-width) + 3px) !important;
		padding-left: 2px !important;
		padding-right: 2px !important;
	}
}

@media (max-width: 380px) {
	.sbp-board--example-premiere {
		--sbp-example-bottle-width: clamp(27px, 8.1vw, 33px) !important;
		--sbp-example-tap-width: 44px !important;
		--sbp-example-tap-height: 60px !important;
	}

	.sbp-board--example-premiere .sbp-bottle-label,
	.sbp-board--example-premiere .sbp-label-input {
		font-size: .46rem !important;
		max-width: 46px !important;
	}
}

/* v3.4 example plus: seamless bottle demo + long-jump rating editorial. */
.sbp-example-plus {
	--sbp-lj-gold: #ffd84d;
	--sbp-lj-glass: #f0e68c;
	--sbp-lj-pink: #ff83c8;
	--sbp-lj-cyan: #79e8ff;
	--sbp-lj-violet: #9d7aff;
	width: 100%;
	max-width: 100%;
	margin: 0 auto;
}

.sbp-example-plus .sbp-board--example {
	margin-bottom: 0 !important;
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
}

.sbp-longjump {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	box-sizing: border-box;
	margin: 0 auto clamp(22px, 4vw, 42px);
	padding: clamp(22px, 4vw, 34px) clamp(14px, 4vw, 40px) clamp(24px, 5vw, 42px);
	max-width: 1120px;
	border: 0 !important;
	border-radius: 0 0 28px 28px;
	background:
		radial-gradient(circle at 12% 2%, rgba(255, 216, 77, .18), transparent 30%),
		radial-gradient(circle at 82% 18%, rgba(255, 131, 200, .16), transparent 34%),
		radial-gradient(circle at 42% 100%, rgba(121, 232, 255, .09), transparent 38%),
		linear-gradient(135deg, #05040a 0%, #0b0714 44%, #070814 100%);
	box-shadow: 0 34px 92px rgba(0, 0, 0, .55), inset 0 0 72px rgba(255, 216, 77, .035), inset 0 -1px 0 rgba(255, 255, 255, .05);
	color: #fff9e8;
}

.sbp-longjump::before,
.sbp-longjump::after,
.sbp-longjump-bg {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -2;
	pointer-events: none;
}

.sbp-longjump::before {
	background:
		linear-gradient(118deg, transparent 0 18%, rgba(255, 216, 77, .10) 36%, transparent 56%),
		linear-gradient(22deg, transparent 0 52%, rgba(255, 131, 200, .10) 68%, transparent 84%);
	mix-blend-mode: screen;
	opacity: .74;
}

.sbp-longjump::after {
	inset: 18px;
	border-radius: 26px;
	background:
		radial-gradient(circle at 18% 20%, rgba(255, 255, 255, .08), transparent 18%),
		radial-gradient(circle at 72% 82%, rgba(121, 232, 255, .07), transparent 18%);
	filter: blur(1px);
	z-index: -1;
}

.sbp-longjump-bg {
	background-image: radial-gradient(circle, rgba(255, 255, 255, .32) 0 1px, transparent 1.8px);
	background-size: 42px 42px;
	opacity: .12;
	mask-image: linear-gradient(180deg, transparent, #000 18%, #000 70%, transparent);
}

.sbp-longjump-kicker {
	position: absolute;
	right: clamp(12px, 3vw, 34px);
	top: clamp(14px, 3vw, 28px);
	font-size: clamp(.58rem, .9vw, .74rem);
	letter-spacing: .34em;
	font-weight: 700;
	color: rgba(255, 216, 77, .45);
	text-shadow: 0 0 18px rgba(255, 216, 77, .20);
	pointer-events: none;
}

.sbp-longjump-hero {
	position: absolute;
	right: clamp(-88px, -6vw, -24px);
	top: clamp(-100px, -7vw, -48px);
	width: clamp(220px, 28vw, 360px);
	aspect-ratio: 1;
	opacity: .18;
	filter: blur(.15px) drop-shadow(0 0 32px rgba(255, 131, 200, .28));
	transform: rotate(-10deg);
	pointer-events: none;
	z-index: -1;
}

.sbp-longjump-hero img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.sbp-longjump-head {
	display: grid;
	grid-template-columns: minmax(240px, .9fr) minmax(280px, 1.15fr);
	gap: clamp(16px, 3vw, 36px);
	align-items: end;
	position: relative;
	z-index: 1;
	margin-bottom: clamp(16px, 3vw, 28px);
}

.sbp-longjump-eyebrow {
	margin: 0 0 6px;
	font-size: .72rem;
	letter-spacing: .22em;
	font-weight: 700;
	color: rgba(121, 232, 255, .76);
	text-shadow: 0 0 18px rgba(121, 232, 255, .22);
}

.sbp-longjump-head h2 {
	margin: 0;
	font-size: clamp(1.38rem, 3.6vw, 2.7rem);
	line-height: .98;
	font-weight: 900;
	letter-spacing: .08em;
	color: #fff7d1;
	text-shadow: 0 0 12px rgba(255, 216, 77, .28), 0 0 28px rgba(255, 131, 200, .20);
}

.sbp-longjump-head > p {
	margin: 0;
	max-width: 46em;
	font-size: clamp(.78rem, 1.1vw, .95rem);
	line-height: 1.78;
	letter-spacing: .05em;
	color: rgba(255, 247, 225, .72);
}

.sbp-longjump-actions {
	display: flex;
	justify-content: flex-end;
	margin: -4px 0 14px;
}

.sbp-longjump-run-all,
.sbp-lj-button {
	appearance: none;
	border: 0;
	border-radius: 999px;
	background: linear-gradient(135deg, rgba(255, 216, 77, .92), rgba(255, 131, 200, .88));
	color: #1b0d16;
	font-weight: 900;
	letter-spacing: .08em;
	box-shadow: 0 0 18px rgba(255, 216, 77, .28), 0 0 34px rgba(255, 131, 200, .18), inset 0 1px 0 rgba(255, 255, 255, .55);
	cursor: pointer;
	transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
}

.sbp-longjump-run-all {
	padding: 10px 17px;
	font-size: .76rem;
}

.sbp-lj-button {
	align-self: center;
	padding: 10px 16px;
	font-size: .74rem;
	white-space: nowrap;
}

.sbp-longjump-run-all:hover,
.sbp-longjump-run-all:focus-visible,
.sbp-lj-button:hover,
.sbp-lj-button:focus-visible {
	transform: translateY(-1px);
	filter: brightness(1.08);
	box-shadow: 0 0 24px rgba(255, 216, 77, .38), 0 0 45px rgba(255, 131, 200, .22), inset 0 1px 0 rgba(255, 255, 255, .62);
}

.sbp-lj-button:disabled {
	cursor: wait;
	filter: saturate(.74) brightness(.92);
	opacity: .72;
	transform: none;
}

.sbp-longjump-list {
	display: grid;
	gap: clamp(12px, 1.6vw, 18px);
	position: relative;
	z-index: 1;
}

.sbp-lj-row {
	position: relative;
	display: grid;
	grid-template-columns: minmax(218px, .78fr) minmax(360px, 1.28fr) auto;
	gap: clamp(12px, 2vw, 22px);
	align-items: stretch;
	min-height: 144px;
	padding: clamp(12px, 2vw, 18px) 0;
	border: 0 !important;
	background: transparent !important;
}

.sbp-lj-row + .sbp-lj-row::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(255, 216, 77, .18), rgba(121, 232, 255, .10), transparent);
}

.sbp-lj-copy {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 12px;
	align-items: start;
	min-width: 0;
}

.sbp-lj-number {
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: rgba(255, 216, 77, .10);
	color: rgba(255, 216, 77, .86);
	font-size: .73rem;
	font-weight: 900;
	letter-spacing: .08em;
	box-shadow: inset 0 0 18px rgba(255, 216, 77, .08), 0 0 16px rgba(255, 216, 77, .08);
}

.sbp-lj-copy h3 {
	margin: 0 0 6px;
	font-size: clamp(.84rem, 1.15vw, 1.04rem);
	line-height: 1.38;
	font-weight: 850;
	letter-spacing: .055em;
	color: #fff8d7;
	text-shadow: 0 0 10px rgba(255, 216, 77, .14);
}

.sbp-lj-copy p {
	margin: 0;
	font-size: clamp(.7rem, .9vw, .82rem);
	line-height: 1.72;
	letter-spacing: .035em;
	color: rgba(255, 247, 229, .64);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.sbp-lj-stage {
	position: relative;
	min-width: 0;
	padding-top: 8px;
}

.sbp-lj-track-labels {
	display: flex;
	justify-content: space-between;
	margin: 0 8px 5px;
	font-size: .58rem;
	font-weight: 800;
	letter-spacing: .14em;
	color: rgba(255, 247, 225, .48);
}

.sbp-lj-track {
	position: relative;
	height: 72px;
	margin-inline: 2px;
	isolation: isolate;
}

.sbp-lj-line,
.sbp-lj-fill {
	position: absolute;
	left: 6%;
	right: 5%;
	top: 43px;
	height: 7px;
	border-radius: 999px;
}

.sbp-lj-line {
	background: linear-gradient(90deg, rgba(121, 232, 255, .18), rgba(255, 216, 77, .44), rgba(255, 131, 200, .42));
	box-shadow: 0 0 18px rgba(255, 216, 77, .18), inset 0 0 7px rgba(255, 255, 255, .18);
}

.sbp-lj-fill {
	right: auto;
	width: calc(var(--sbp-lj-target, 10%) - 6%);
	background: linear-gradient(90deg, rgba(121, 232, 255, .78), rgba(255, 216, 77, .94), rgba(255, 131, 200, .82));
	box-shadow: 0 0 22px rgba(255, 216, 77, .28);
	transform-origin: left center;
	transform: scaleX(.15);
	transition: transform .72s cubic-bezier(.16, .72, .16, 1);
}

.sbp-lj-row.is-landed .sbp-lj-fill,
.sbp-lj-row.is-jumping .sbp-lj-fill {
	transform: scaleX(1);
}

.sbp-lj-mark {
	position: absolute;
	top: 35px;
	width: 20px;
	height: 20px;
	margin-left: -10px;
	border-radius: 50%;
	background: rgba(8, 8, 18, .84);
	box-shadow: 0 0 0 1px rgba(255, 216, 77, .28), 0 0 12px rgba(255, 216, 77, .12);
	display: grid;
	place-items: center;
	font-size: .62rem;
	font-weight: 900;
	color: rgba(255, 249, 224, .72);
	z-index: 1;
}

.sbp-lj-mark--1 { left: 10%; }
.sbp-lj-mark--2 { left: 30%; }
.sbp-lj-mark--3 { left: 50%; }
.sbp-lj-mark--4 { left: 70%; }
.sbp-lj-mark--5 { left: 90%; }

.sbp-lj-runner {
	position: absolute;
	left: 4%;
	bottom: 18px;
	width: var(--sbp-lj-runner-width, 46px);
	height: auto;
	object-fit: contain;
	object-position: center bottom;
	filter: drop-shadow(0 9px 12px rgba(0, 0, 0, .38)) drop-shadow(0 0 13px rgba(255, 216, 77, .14));
	pointer-events: none;
	user-select: none;
	-webkit-user-drag: none;
	z-index: 3;
}

.sbp-lj-ready {
	--sbp-lj-runner-width: 36px;
	opacity: .94;
	transform: translateX(-50%);
}

.sbp-lj-jump {
	--sbp-lj-runner-width: 56px;
	display: none;
	left: 0;
	bottom: 19px;
	transform: translateX(0);
	z-index: 5;
}

.sbp-lj-land {
	--sbp-lj-runner-width: 48px;
	display: none;
	left: var(--sbp-lj-target, 10%);
	bottom: 17px;
	transform: translateX(-50%);
	z-index: 4;
}

.sbp-lj-row.is-jumping .sbp-lj-ready,
.sbp-lj-row.is-landed .sbp-lj-ready {
	display: none;
}

.sbp-lj-row.is-jumping .sbp-lj-jump {
	display: block;
}

.sbp-lj-row.is-landed .sbp-lj-land {
	display: block;
	animation: sbp-lj-land-pop .42s cubic-bezier(.2, .8, .2, 1) both;
}

.sbp-lj-result {
	display: grid;
	grid-template-rows: 0fr;
	margin-top: 0;
	opacity: 0;
	transform: perspective(900px) rotateX(-84deg) translateY(-8px);
	transform-origin: 50% 0%;
	transition:
		grid-template-rows .68s cubic-bezier(.18, .78, .2, 1),
		opacity .42s ease,
		transform .68s cubic-bezier(.18, .78, .2, 1),
		margin-top .38s ease;
	pointer-events: none;
	will-change: transform, opacity, grid-template-rows;
}

.sbp-lj-result-inner {
	position: relative;
	min-height: 0;
	overflow: hidden;
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	grid-template-areas:
		"score label"
		"score text";
	gap: 6px 10px;
	align-items: start;
	padding: 9px 13px 10px;
	border-radius: 18px;
	background:
		linear-gradient(110deg, rgba(255, 255, 255, .075), transparent 28%),
		linear-gradient(90deg, rgba(255, 216, 77, .12), rgba(255, 131, 200, .075), rgba(121, 232, 255, .06));
	box-shadow: inset 0 0 22px rgba(255, 255, 255, .028), 0 12px 28px rgba(0, 0, 0, .12);
}

.sbp-lj-result-inner::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(105deg, transparent 0 42%, rgba(255, 255, 255, .20) 50%, transparent 60% 100%);
	transform: translateX(-120%);
	pointer-events: none;
}

.sbp-lj-row.is-result-pending .sbp-lj-result {
	opacity: .18;
	transform: perspective(900px) rotateX(-70deg) translateY(-6px);
}

.sbp-lj-row.is-revealed .sbp-lj-result {
	grid-template-rows: 1fr;
	margin-top: 8px;
	opacity: 1;
	transform: perspective(900px) rotateX(0deg) translateY(0);
	pointer-events: auto;
}

.sbp-lj-row.is-revealed .sbp-lj-result-inner::before {
	animation: sbp-lj-result-sheen .86s .08s cubic-bezier(.2, .72, .18, 1) both;
}

.sbp-lj-score {
	grid-area: score;
	align-self: start;
	font-size: .68rem;
	font-weight: 950;
	letter-spacing: .08em;
	color: #151018;
	background: linear-gradient(135deg, rgba(255, 216, 77, .98), rgba(255, 131, 200, .82));
	border-radius: 999px;
	padding: 4px 8px;
	white-space: nowrap;
}

.sbp-lj-result strong {
	grid-area: label;
	font-size: .75rem;
	line-height: 1.32;
	letter-spacing: .07em;
	color: #fff2bd;
	white-space: nowrap;
}

.sbp-lj-result-text {
	grid-area: text;
	min-width: 0;
	font-size: .69rem;
	line-height: 1.62;
	letter-spacing: .035em;
	color: rgba(255, 247, 229, .70);
	overflow-wrap: anywhere;
	word-break: normal;
}

@keyframes sbp-lj-land-pop {
	0% { opacity: 0; transform: translateX(-50%) translateY(-12px) scale(.88); }
	100% { opacity: 1; transform: translateX(-50%) translateY(0) scale(1); }
}

@keyframes sbp-lj-result-sheen {
	0% { transform: translateX(-120%); opacity: 0; }
	22% { opacity: .88; }
	100% { transform: translateX(120%); opacity: 0; }
}

@media (max-width: 860px) {
	.sbp-longjump {
		width: 100vw;
		max-width: 100vw;
		margin-left: calc(50% - 50vw);
		margin-right: calc(50% - 50vw);
		border-radius: 0 0 24px 24px;
		padding-inline: clamp(12px, 4vw, 20px);
	}
	.sbp-longjump-head {
		grid-template-columns: 1fr;
		gap: 10px;
	}
	.sbp-longjump-actions {
		justify-content: flex-start;
	}
	.sbp-lj-row {
		grid-template-columns: 1fr;
		gap: 10px;
		min-height: 0;
		padding: 16px 0;
	}
	.sbp-lj-copy {
		grid-template-columns: 34px 1fr;
	}
	.sbp-lj-number {
		width: 32px;
		height: 32px;
	}
	.sbp-lj-copy p {
		-webkit-line-clamp: 2;
	}
	.sbp-lj-stage {
		padding-top: 0;
	}
	.sbp-lj-track {
		height: 78px;
	}
	.sbp-lj-button {
		justify-self: start;
		margin-top: -2px;
	}
	.sbp-lj-result-inner {
		grid-template-columns: auto minmax(0, 1fr);
		grid-template-areas:
			"score label"
			"text text";
	}
	.sbp-lj-score {
		align-self: center;
	}
	.sbp-longjump-hero {
		width: 260px;
		right: -80px;
		top: -78px;
		opacity: .12;
	}
}

@media (max-width: 420px) {
	.sbp-longjump-head h2 {
		font-size: 1.34rem;
	}
	.sbp-lj-runner {
		--sbp-lj-runner-width: 42px;
	}
	.sbp-lj-ready {
		--sbp-lj-runner-width: 32px;
	}
	.sbp-lj-jump {
		--sbp-lj-runner-width: 50px;
	}
	.sbp-lj-copy h3 {
		font-size: .82rem;
	}
	.sbp-lj-copy p,
	.sbp-lj-result-text {
		font-size: .65rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.sbp-lj-fill,
	.sbp-lj-runner,
	.sbp-lj-land,
	.sbp-lj-result,
	.sbp-lj-result-inner::before {
		transition: none !important;
		animation: none !important;
	}
}
