/* Self-contained photo booth section. Theme variables come from styles.css. */
.photo-booth { position: relative; isolation: isolate; overflow: hidden; background: radial-gradient(circle at 82% 12%,rgba(157,42,212,.26),transparent 33%),radial-gradient(circle at 8% 83%,rgba(255,106,26,.12),transparent 34%),#080411; }
.photo-booth::before { content: ''; position: absolute; z-index: -1; inset: 0; opacity: .35; background: repeating-linear-gradient(155deg,transparent 0 42px,rgba(240,153,255,.06) 43px,transparent 44px 86px); pointer-events: none; }
.photo-booth__inner { display: grid; grid-template-columns: minmax(0,.86fr) minmax(0,1.14fr); gap: clamp(28px,5vw,80px); align-items: center; max-width: 1250px; margin: auto; }
.photo-booth__intro .eyebrow { color: var(--lime,#a6ff54); }
.photo-booth__intro h2 { margin: 0 0 28px; color: #fff; font: 900 clamp(58px,6.5vw,92px)/.82 var(--display,Impact,sans-serif); letter-spacing: -.035em; text-transform: uppercase; text-shadow: 0 0 28px rgba(194,69,255,.55); }
.photo-booth__intro h2 em { display: inline-block; color: #ffb953; font-size: .8em; font-style: normal; white-space: nowrap; text-shadow: 0 0 7px #ff9b30,0 0 30px rgba(255,98,20,.72); }
.photo-booth__intro > p:not(.eyebrow) { max-width: 480px; color: #ecdaef; font: 600 clamp(20px,2.3vw,27px)/1.12 var(--display,Impact,sans-serif); }
.photo-booth__privacy { display: flex; align-items: start; gap: 12px; margin-top: 28px; max-width: 460px; padding: 15px 17px; border-left: 4px solid var(--lime,#a6ff54); background: rgba(166,255,84,.07); }
.photo-booth__privacy span { color: var(--lime,#a6ff54); font-size: 24px; line-height: 1; }
.photo-booth__privacy p { margin: 0; color: #f2e8f5; font: 650 18px/1.18 var(--display,Impact,sans-serif); }
.photo-booth__studio { padding: clamp(18px,3vw,35px); border: 2px solid #bc69ef; border-radius: 24px; background: linear-gradient(145deg,rgba(27,9,47,.96),rgba(10,4,20,.97)); box-shadow: 0 0 26px rgba(173,57,238,.42),inset 0 0 27px rgba(178,70,252,.1); }
.photo-booth__preview-wrap { max-width: 440px; margin: 0 auto 21px; }
.photo-booth__preview { display: block; width: 100%; height: auto; border-radius: 11px; box-shadow: 0 12px 36px rgba(0,0,0,.48); touch-action: none; cursor: grab; }
.photo-booth__preview:active { cursor: grabbing; }
.photo-booth__preview:focus-visible { outline: 3px solid var(--lime,#a6ff54); outline-offset: 5px; }
.photo-booth__hint { margin: 10px 0 0; text-align: center; color: #d8c8e5; font: 700 16px/1.15 var(--display,Impact,sans-serif); }
.photo-booth__inputs { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.photo-booth__upload { display: inline-flex; justify-content: center; align-items: center; min-height: 55px; padding: 10px; border: 2px solid #efac58; border-radius: 10px; color: #160717; background: linear-gradient(#ffda83,#ffaa3b); box-shadow: 0 0 13px rgba(255,147,31,.36); cursor: pointer; text-align: center; font: 900 clamp(18px,2vw,23px)/1 var(--display,Impact,sans-serif); text-transform: uppercase; letter-spacing: .035em; transition: transform .18s,box-shadow .18s; }
.photo-booth__upload--camera { border-color: #a9e7ff; color: #effaff; background: linear-gradient(130deg,#24526e,#15203d); box-shadow: 0 0 14px rgba(55,177,255,.3); }
.photo-booth__upload:hover { transform: translateY(-2px); box-shadow: 0 0 23px rgba(255,161,51,.75); }
.photo-booth__upload--camera:hover { box-shadow: 0 0 23px rgba(69,191,255,.7); }
.photo-booth__file { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; border: 0; opacity: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
.photo-booth__upload:focus-within { outline: 3px solid var(--lime,#a6ff54); outline-offset: 4px; }
.photo-booth__controls { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 16px; margin-top: 22px; }
.photo-booth__control-label,.photo-booth__legend { display: block; margin-bottom: 8px; color: #f8ecff; font: 800 19px/1 var(--display,Impact,sans-serif); letter-spacing: .035em; text-transform: uppercase; }
.photo-booth__select,.photo-booth__range { width: 100%; }
.photo-booth__select { min-height: 45px; padding: 7px 10px; border: 2px solid #ab69d4; border-radius: 8px; color: #fff; background: #180d2a; font: 700 18px/1 var(--display,Impact,sans-serif); }
.photo-booth__range { accent-color: #e478ff; min-height: 42px; cursor: pointer; }
.photo-booth__colors { grid-column: 1 / -1; margin: 0; padding: 0; border: 0; }
.photo-booth__colors-row { display: flex; flex-wrap: wrap; gap: 10px; }
.photo-booth__color { display: inline-flex; gap: 9px; align-items: center; min-height: 42px; padding: 7px 12px; border: 2px solid rgba(211,152,247,.42); border-radius: 9px; color: #f9edff; cursor: pointer; font: 800 18px/1 var(--display,Impact,sans-serif); }
.photo-booth__color:has(input:checked) { border-color: #f4c5ff; background: rgba(190,87,252,.2); box-shadow: 0 0 12px rgba(194,102,255,.38); }
.photo-booth__color input { accent-color: #dc89fc; }
.photo-booth__swatch { display: inline-block; width: 15px; height: 15px; border-radius: 50%; background: #db76fc; box-shadow: 0 0 10px currentColor; }
.photo-booth__color--orange .photo-booth__swatch { background: #ffad39; }
.photo-booth__color--blue .photo-booth__swatch { background: #5bd2ff; }
.photo-booth__color--gold { border-color: rgba(255,218,117,.72); color: #fff2c7; background: rgba(127,70,10,.19); }
.photo-booth__color--gold:has(input:checked) { border-color: #ffe49b; background: rgba(185,113,22,.34); box-shadow: 0 0 18px rgba(255,190,59,.54); }
.photo-booth__color--gold input { accent-color: #ffc95a; }
.photo-booth__color--gold .photo-booth__swatch { background: #ffd06a; box-shadow: 0 0 13px #ffb930; }
.photo-booth__color--encore { border-color: rgba(125,233,255,.72); color: #eafff8; background: linear-gradient(125deg,rgba(49,21,101,.39),rgba(18,80,99,.32)); }
.photo-booth__color--encore:has(input:checked) { border-color: #b8fffb; background: linear-gradient(125deg,rgba(131,53,219,.51),rgba(34,152,166,.38)); box-shadow: 0 0 19px rgba(134,245,255,.55); }
.photo-booth__color--encore input { accent-color: #9afad9; }
.photo-booth__color--encore .photo-booth__swatch { background: linear-gradient(135deg,#adff68,#77eaff,#d49dff,#ffb85d); box-shadow: 0 0 14px #b378ff; }
.photo-booth__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 23px; }
.photo-booth__action { min-height: 50px; padding: 9px 18px; border: 2px solid #ffbd53; border-radius: 9px; color: #1b0812; background: #ffba58; cursor: pointer; font: 900 20px/1 var(--display,Impact,sans-serif); text-transform: uppercase; letter-spacing: .035em; }
.photo-booth__action--share { color: #fff; border-color: #63c7ff; background: #164c71; }
.photo-booth__action--reset { color: #f2eaf8; border-color: #9564b4; background: transparent; }
.photo-booth__action:hover:not(:disabled) { filter: brightness(1.14); box-shadow: 0 0 15px rgba(255,173,61,.4); }
.photo-booth__action:disabled { opacity: .46; cursor: not-allowed; }
.photo-booth [hidden] { display: none !important; }
.photo-booth__status { min-height: 23px; margin: 13px 0 0; color: #e3d5ec; font: 600 17px/1.15 var(--display,Impact,sans-serif); }
.photo-booth__studio :focus-visible { outline: 3px solid var(--lime,#a6ff54); outline-offset: 4px; }
@media (max-width: 920px) { .photo-booth__inner { grid-template-columns: 1fr; gap: 27px; }.photo-booth__intro h2 { font-size: clamp(73px,12vw,110px); }.photo-booth__studio { max-width: 620px; width: 100%; margin: auto; } }
@media (max-width: 580px) { .photo-booth__intro h2 { font-size: clamp(59px,13vw,78px); }.photo-booth__studio { padding: 16px; border-radius: 16px; }.photo-booth__controls { grid-template-columns: 1fr; }.photo-booth__inputs { grid-template-columns: 1fr 1fr; }.photo-booth__upload { padding: 8px 5px; font-size: 17px; }.photo-booth__actions { display: flex; }.photo-booth__action { flex: 1 1 115px; padding: 9px; font-size: 18px; }.photo-booth__action--reset { flex-basis: 100%; }.photo-booth__colors { grid-column: auto; } }
@media (prefers-reduced-motion: reduce) { .photo-booth__upload { transition: none; } }