/* Two foil ribbons wrap the corner of the complete card, above the artwork.
   The shaped exclusion lets the title flow around their shared diagonal. */
.preview-media-zone{position:relative;min-height:0;overflow:hidden;height:100%}
.project-screen .preview-media-zone .preview-image{height:100%}
.project-screen>a{position:relative;overflow:visible}
.project-screen .carousel-art{overflow:hidden}
.project-screen .preview-heading::before{content:"";float:right;width:180px;height:195px;margin:-5px -22px 0 10px;shape-outside:polygon(0 0,100% 0,100% 100%)}
.carousel-ribbons{--ribbon-size:200px;position:absolute;top:-7px;right:-7px;width:var(--ribbon-size);height:var(--ribbon-size);pointer-events:none;z-index:3;isolation:isolate}
.carousel-ribbon{--band-width:280px;--band-right:-67px;--band-top:48px;--fold-left:52px;--fold-side:135px;--band-height:35px;--ribbon-text-shadow:0 1px #ffffff65;position:absolute;inset:0;overflow:hidden;pointer-events:none;color:#24200f;--foil:linear-gradient(110deg,#c18b20 0%,#efbd45 16%,#ffe6a0 30%,#d99a24 45%,#f7cd65 66%,#ffe8a6 80%,#c18b20 100%)}
.carousel-ribbon>.ribbon-label{position:absolute;display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:var(--band-width);height:var(--band-height);right:var(--band-right);top:var(--band-top);transform:rotate(45deg);padding:0 9px 1px;text-align:center;font:750 12px/1.2 Manrope,Arial,sans-serif;letter-spacing:.015em;white-space:nowrap;background:var(--foil);border-radius:1px;border-top:1px solid #ffffffb3;border-bottom:1px solid #00000073;box-shadow:0 5px 8px #06180f66,inset 0 1px #fffc,inset 0 -2px #ffffff30;text-shadow:var(--ribbon-text-shadow);z-index:1}
.carousel-ribbon>.ribbon-label::before{content:"";position:absolute;inset:3px 0 auto;height:1px;background:linear-gradient(90deg,transparent,#fff9 22%,#fff 44%,#fff4 72%,transparent)}
.carousel-ribbon>.ribbon-label::after{content:"";position:absolute;inset:5px 0;border-top:1px solid #ffffff36;border-bottom:1px solid #0000001c;background:repeating-linear-gradient(0deg,#ffffff0a 0 .5px,transparent .5px 2px);pointer-events:none}
.carousel-ribbon::before,.carousel-ribbon::after{content:"";position:absolute;background:var(--foil);filter:brightness(.46);z-index:0}
.carousel-ribbon::before{top:0;left:var(--fold-left);width:16px;height:11px;clip-path:polygon(0 0,100% 0,100% 100%)}
.carousel-ribbon::after{right:0;top:var(--fold-side);width:11px;height:16px;clip-path:polygon(0 0,100% 0,0 100%)}
.ribbon-primary{z-index:2}
.ribbon-secondary{--band-width:285px;--band-right:-53px;--band-top:81px;--band-height:30px;--fold-left:6px;--fold-side:180px;z-index:1}
.ribbon-secondary>.ribbon-label{font-size:11.5px;font-weight:700;letter-spacing:.005em;box-shadow:0 4px 7px #06180f55,inset 0 1px #fffc,inset 0 -2px #ffffff30}
/* Neutral foils remain available to existing projects and the editor. */
.metal-brass{--foil:linear-gradient(110deg,#c18b20 0%,#efbd45 16%,#ffe6a0 30%,#d99a24 45%,#f7cd65 66%,#ffe8a6 80%,#c18b20 100%);color:#30230a}
.metal-champagne{--foil:linear-gradient(112deg,#af8d63 0%,#e7cba1 18%,#fff2d9 31%,#d8b382 46%,#f7deb7 69%,#ffefd3 82%,#b99668 100%);color:#302519}
.metal-titanium{--foil:linear-gradient(112deg,#8a9eac 0%,#d4e5ec 18%,#fff 30%,#aec6d3 46%,#e7f4f9 68%,#fff 81%,#97b1c0 100%);color:#152c3b}
.metal-petrol{--foil:linear-gradient(112deg,#6f9e9a 0%,#7cccb1 18%,#c7f5dd 31%,#5cb594 46%,#a4e4bf 68%,#d5f6de 82%,#5fa290 100%);color:#092f25}
.metal-bronze{--foil:linear-gradient(112deg,#ce8149 0%,#e7a16f 18%,#ffdfb9 31%,#cb7f4b 46%,#f6bc8d 68%,#ffdfb3 82%,#ce8149 100%);color:#38200f}
.metal-graphite{--foil:linear-gradient(112deg,#1d2931 0%,#4b606e 22%,#2c414e 44%,#415866 63%,#566b76 81%,#25343e 100%);color:#fff8e7;--ribbon-text-shadow:0 1px 2px #000b}
/* A saturated spectrum with narrow light reflections, rather than pale tints. */
.metal-ruby{--foil:linear-gradient(112deg,#8d1039 0%,#ce1c52 18%,#cb2456 30%,#af123e 45%,#cb2456 67%,#cd285a 82%,#92123d 100%);color:#fff9f7;--ribbon-text-shadow:0 1px 2px #600b27,0 0 2px #600b27}
.metal-mandarin{--foil:linear-gradient(112deg,#dc7621 0%,#f59431 18%,#ffcc78 30%,#ed7b20 45%,#ffb14a 67%,#ffda89 82%,#dc7621 100%);color:#3c1e08}
.metal-amber{--foil:linear-gradient(112deg,#c08b26 0%,#f6bb25 18%,#ffe78a 30%,#e9a415 45%,#ffd154 67%,#ffeb9c 82%,#c38a23 100%);color:#352607}
.metal-citrine{--foil:linear-gradient(112deg,#89a31c 0%,#cce72c 18%,#f4ff9c 30%,#b8d51d 45%,#dff64c 67%,#f4ffad 82%,#889f10 100%);color:#243009}
.metal-emerald{--foil:linear-gradient(112deg,#30bb80 0%,#3cce8d 18%,#a3f4c9 30%,#26b77a 45%,#64e6a7 67%,#baf8d5 82%,#30bb80 100%);color:#073d2a}
.metal-turquoise{--foil:linear-gradient(112deg,#1fb2c7 0%,#39ccdb 18%,#a7f7f7 30%,#23b7cd 45%,#61e3ec 67%,#b6f8f6 82%,#1fb2c7 100%);color:#063742}
.metal-cobalt{--foil:linear-gradient(112deg,#173b99 0%,#2156d0 18%,#3768d5 30%,#1a44ad 45%,#3266d5 67%,#3969d1 82%,#193d95 100%);color:#fff;--ribbon-text-shadow:0 1px 2px #0a205f,0 0 2px #0a205f}
.metal-amethyst{--foil:linear-gradient(112deg,#57228f 0%,#8731c4 18%,#9342cd 30%,#6c25a5 45%,#9843ce 67%,#9640ca 82%,#60258f 100%);color:#fff9ff;--ribbon-text-shadow:0 1px 2px #34104f,0 0 2px #34104f}
.metal-fuchsia{--foil:linear-gradient(112deg,#90116b 0%,#c21b91 18%,#be2492 30%,#a5187b 45%,#c02a94 67%,#be2492 82%,#971973 100%);color:#fff9ff;--ribbon-text-shadow:0 1px 2px #550e41,0 0 2px #550e41}
.carousel-editor-image{position:relative;overflow:visible;isolation:isolate}
.carousel-editor-image>img{min-height:0}
.carousel-preview-title::before{content:"";float:right;width:136px;height:165px;margin:-8px -8px 0 6px;shape-outside:polygon(0 0,100% 0,100% 100%)}
.carousel-editor-image>.carousel-ribbons{--ribbon-size:164px}
.carousel-editor-image>.carousel-ribbons .ribbon-primary{--band-width:238px;--band-right:-62px;--band-top:38px;--band-height:31px;--fold-left:45px;--fold-side:106px}
.carousel-editor-image>.carousel-ribbons .ribbon-secondary{--band-width:250px;--band-right:-46px;--band-top:69px;--band-height:29px;--fold-left:-7px;--fold-side:157px}
.carousel-editor-image .carousel-ribbon>.ribbon-label{font-size:10.5px;letter-spacing:0}
.carousel-editor-image .ribbon-secondary>.ribbon-label{font-size:10px}
.carousel-tag-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.carousel-tag-fields label{min-width:0;margin:0}.carousel-tag-fields input{width:100%}
@media(max-width:767px){
 .project-screen .carousel-ribbons{--ribbon-size:164px}
 .project-screen .ribbon-primary{--band-width:238px;--band-right:-62px;--band-top:38px;--band-height:31px;--fold-left:45px;--fold-side:106px}
 .project-screen .ribbon-secondary{--band-width:250px;--band-right:-46px;--band-top:69px;--band-height:29px;--fold-left:-7px;--fold-side:157px}
 .project-screen .carousel-ribbon>.ribbon-label{font-size:10.5px;letter-spacing:0}
 .project-screen .ribbon-secondary>.ribbon-label{font-size:10px}
 .project-screen .preview-heading::before{width:142px;height:170px;margin:-4px -8px 0 7px}
 .carousel-tag-fields{grid-template-columns:1fr}
}

/* Keep all nine carousel buttons reachable on narrow phones. */
@media(max-width:767px){.project-carousel .carousel-indicators{gap:clamp(4px,calc((100vw - 286px)/8),14px)}}
@media(max-width:374px){.is-home .closing-title{flex-wrap:wrap}}
