@import url("brand-palette.css");
/* SEDI surface runtime — geometry behavior only; additive to protected ProductExperience authority. */
.design-plane[data-surface-type]{overflow:visible}
.design-plane[data-surface-type]::before,.design-plane[data-surface-type]::after{content:"";position:absolute;pointer-events:none;z-index:8;opacity:0;transition:opacity .2s ease}
.design-plane[data-surface-type="curve"]::before{left:8%;right:8%;top:4%;bottom:4%;opacity:.6;border-top:1px dashed color-mix(in srgb,var(--sedi-brand-accent) 80%,transparent);border-bottom:1px dashed color-mix(in srgb,var(--sedi-brand-accent) 80%,transparent);border-radius:45% / 12%}
.design-plane[data-surface-type="curve"] .proof-object{transform-style:preserve-3d;filter:drop-shadow(0 2px 3px rgba(0,0,0,.08))}
.design-plane[data-surface-type="wrap"]::before{top:3%;bottom:3%;left:5%;width:1px;opacity:.7;background:repeating-linear-gradient(to bottom,color-mix(in srgb,var(--sedi-brand-accent) 90%,transparent) 0 5px,transparent 5px 10px);box-shadow:calc(var(--sedi-plane-width,100px)*.9) 0 0 color-mix(in srgb,var(--sedi-brand-accent) 70%,transparent)}
.design-plane[data-surface-type="wrap"]::after{left:5%;right:5%;top:3%;bottom:3%;opacity:.35;border-top:1px solid color-mix(in srgb,var(--sedi-brand-accent) 70%,transparent);border-bottom:1px solid color-mix(in srgb,var(--sedi-brand-accent) 70%,transparent)}
.wrap-ghost{opacity:.32;pointer-events:none!important;border:0!important}
.surface-runtime-note{display:inline-flex;align-items:center;gap:6px;margin-top:8px;color:var(--sedi-brand-accent-palette-765b34);font-size:10px;font-weight:750}

/* Real geometry cues: Flat remains planar; Curve bends visual content; Wrap exposes seam continuity. */
.design-plane[data-surface-type="curve"] .proof-object.geometry-curve > strong,
.design-plane[data-surface-type="curve"] .proof-object.geometry-curve > small,
.design-plane[data-surface-type="curve"] .proof-object.geometry-curve > img{display:block;transform:perspective(520px) rotateY(var(--surface-bend,0deg)) rotateX(2deg) scaleX(.985);transform-origin:center center}
.design-plane[data-surface-type="wrap"] .proof-object.geometry-wrap > strong,
.design-plane[data-surface-type="wrap"] .proof-object.geometry-wrap > small,
.design-plane[data-surface-type="wrap"] .proof-object.geometry-wrap > img{display:block;transform:perspective(600px) rotateY(var(--surface-bend,0deg)) scaleX(.97);transform-origin:center center}
.design-plane[data-surface-type="flat"] .proof-object.geometry-flat > strong,
.design-plane[data-surface-type="flat"] .proof-object.geometry-flat > small,
.design-plane[data-surface-type="flat"] .proof-object.geometry-flat > img{transform:none}