/* Shared decorative surfaces: real text and photos remain separate from the artwork. */
.art-surface{position:relative;isolation:isolate;background:var(--paper);color:var(--ink);overflow:hidden}
.art-surface:before,.art-surface:after{content:'';position:absolute;inset:0;pointer-events:none;z-index:-1}
.design-night{background:var(--main);color:var(--onMain)}
.design-night:before{inset:4%;border:1px solid var(--accent);outline:1px solid var(--accent);outline-offset:5px;background:radial-gradient(ellipse at 50% 115%,transparent 48%,var(--accent) 48.15%,transparent 48.4%,transparent 53%,var(--accent) 53.1%,transparent 53.35%,transparent 59%,var(--accent) 59.1%,transparent 59.3%);opacity:.6}
.design-night:after{background:radial-gradient(circle at 12% 13%,var(--accent) 0 1px,transparent 2px),radial-gradient(circle at 78% 21%,var(--accent) 0 1px,transparent 2px),radial-gradient(circle at 85% 78%,var(--accent) 0 1px,transparent 2px),radial-gradient(ellipse at bottom,color-mix(in srgb,var(--accent) 15%,transparent),transparent 60%)}
.design-architecture:before{background:linear-gradient(155deg,transparent 72%,color-mix(in srgb,var(--main) 8%,var(--paper)) 72.2%,var(--paper) 83%,color-mix(in srgb,var(--main) 15%,var(--paper)) 83.2%,var(--paper) 100%)}
.design-architecture:after{inset:auto -12% -30% 35%;height:70%;border:1px solid color-mix(in srgb,var(--main) 20%,transparent);border-radius:50%;transform:rotate(-30deg)}
.design-emerald:before{inset:3%;border:solid var(--main);border-width:18px 22px;border-radius:48% 48% 0 0;outline:1px solid var(--accent);outline-offset:5px;background:linear-gradient(135deg,transparent 75%,color-mix(in srgb,var(--accent) 16%,transparent))}
.design-red:before{background:linear-gradient(90deg,transparent 67%,var(--main) 67%,var(--main) 92%,transparent 92%);opacity:.13}
.design-red:after{inset:72% -5% -18% 0;background:linear-gradient(145deg,var(--accent),var(--main));clip-path:polygon(0 100%,100% 0,100% 100%)}
.design-graphite{background:var(--main);color:var(--onMain)}
.design-graphite:before{background:repeating-radial-gradient(ellipse at 100% 0,transparent 0 17px,color-mix(in srgb,var(--accent) 36%,transparent) 18px,transparent 19px 35px);mask-image:linear-gradient(transparent 15%,#000)}
.design-graphite:after{background:linear-gradient(130deg,color-mix(in srgb,var(--accent) 24%,transparent),transparent 45%,color-mix(in srgb,var(--accent) 10%,transparent))}
.design-paper:before{inset:70% -20% -30%;border-radius:50% 60% 0 0;background:var(--accent);transform:rotate(-12deg);box-shadow:0 -25px 0 color-mix(in srgb,var(--accent) 35%,var(--paper)),0 -50px 0 color-mix(in srgb,var(--accent) 15%,var(--paper))}
.design-paper:after{background:radial-gradient(ellipse at -20% -10%,var(--accent) 0 26%,transparent 26.2%);opacity:.6}
.design-blue{background:var(--main);color:var(--onMain)}
.design-blue:before{background:linear-gradient(90deg,transparent 55%,color-mix(in srgb,var(--accent) 20%,transparent) 55% 78%,transparent 78%),linear-gradient(0deg,color-mix(in srgb,var(--accent) 24%,transparent) 0 20%,transparent 20%);clip-path:polygon(0 100%,0 85%,25% 85%,25% 65%,50% 65%,50% 40%,75% 40%,75% 0,100% 0,100% 100%)}
.design-blue:after{inset:auto 0 0;height:28%;background:linear-gradient(145deg,transparent 30%,color-mix(in srgb,var(--accent) 30%,transparent) 30.2% 60%,transparent 60.2%);clip-path:polygon(0 100%,23% 45%,40% 72%,68% 0,100% 100%)}
.design-aurora{background:var(--main);color:var(--onMain)}
.design-aurora:before{background:radial-gradient(ellipse at 18% 15%,color-mix(in srgb,var(--accent) 65%,transparent),transparent 35%),radial-gradient(ellipse at 95% 68%,#9668cb88,transparent 48%),conic-gradient(from 190deg at 70% 50%,transparent,var(--accent),transparent 28%);opacity:.55;filter:blur(16px)}
.design-aurora:after{inset:78% 0 0;background:color-mix(in srgb,var(--main) 75%,black);clip-path:polygon(0 60%,13% 30%,25% 70%,45% 10%,59% 40%,69% 0,84% 55%,100% 15%,100% 100%,0 100%)}
.design-deco{background:var(--main);color:var(--onMain)}
.design-deco:before{inset:4%;border:1px solid var(--accent);outline:3px double var(--accent);outline-offset:7px;background:repeating-conic-gradient(from 245deg at 50% 120%,transparent 0deg 6deg,color-mix(in srgb,var(--accent) 60%,transparent) 6.1deg 6.3deg,transparent 6.4deg 12deg);mask-image:linear-gradient(#000,transparent 30%,transparent 65%,#000)}
.design-deco:after{inset:7%;border-left:3px double var(--accent);border-right:3px double var(--accent);clip-path:polygon(0 0,20% 0,20% 8%,80% 8%,80% 0,100% 0,100% 100%,80% 100%,80% 92%,20% 92%,20% 100%,0 100%)}
.design-collage:before{inset:77% -3% -12%;background:var(--accent);transform:rotate(-5deg);clip-path:polygon(0 10%,8% 15%,14% 5%,23% 12%,30% 3%,38% 13%,47% 8%,55% 17%,64% 7%,74% 11%,83% 2%,91% 10%,100% 0,100% 100%,0 100%)}
.design-collage:after{inset:82% -5% -7%;background:var(--main);transform:rotate(6deg);opacity:.12}
