/* Adaptation for Olga's real portfolio and contacts. */
.backdrop{background-image:url('assets/imported/olga-b84c6b01d094c9d2.webp');background-position:center 30%}
.photo-people{display:none}
.book-card{text-align:left}.book-card>p.book-kicker,.book-ornament,.book-page-number{text-align:center}
.book-card section>p{max-width:none;text-align:left}.book-card section>.book-note{font:400 12px/1.6 Manrope,sans-serif}.book-note a,.book-contact a{color:inherit;text-decoration:underline;text-underline-offset:3px}.book-note a:focus-visible,.book-contact a:focus-visible,.book-gallery a:focus-visible{outline:2px solid #76583b;outline-offset:4px}
.about-portrait{display:block;width:100%;height:280px;object-fit:cover;object-position:center 30%;margin-top:24px}.book-gallery{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:24px}.book-gallery a{display:block;overflow:hidden}.book-gallery a:first-child{grid-column:1/-1}.book-gallery img{display:block;width:100%;height:180px;object-fit:cover}.book-gallery a:first-child img{height:240px}.book-form{display:flex;flex-direction:column;gap:8px;margin-top:24px;font:500 13px/1.5 Manrope,sans-serif}.book-form label:not(:first-child){margin-top:12px}.book-form input,.book-form select,.book-form textarea{width:100%;border:0;border-bottom:1px solid #8f806c;background:transparent;color:#30291f;border-radius:0;padding:10px 0;font:400 14px/1.5 Manrope,sans-serif}.book-form textarea{resize:vertical}.book-form button{border:0;background:#30291f;color:#fff;padding:14px 16px;text-align:left;font:600 13px Manrope,sans-serif;cursor:pointer;margin-top:16px}.book-form small{color:#756b5b;font-size:11px;line-height:1.6}.book-card section>.book-contact{margin-top:24px;font:500 12px/1.6 Manrope,sans-serif}.book-form :focus-visible{outline:2px solid #8a6944;outline-offset:4px}
.webgl-fallback #world,.webgl-fallback .camera-hotspots{display:none}.webgl-fallback .touch-nav{display:flex;position:absolute;left:24px;right:24px;top:36%;flex-wrap:wrap;gap:8px;justify-content:center;opacity:1}.webgl-fallback .touch-nav span{width:100%;text-align:center;font-size:10px;letter-spacing:.2em}.webgl-fallback .touch-nav button{border:1px solid #aaa;background:#222;color:#fff;padding:12px}.webgl-fallback .intro-note{display:none}.webgl-fallback .intro-ui:after{content:'Для просмотра разделов используйте кнопки';position:absolute;top:28%;left:0;right:0;text-align:center;font-size:13px;color:#fff}.webgl-fallback .story{pointer-events:auto}.webgl-fallback .photo-scene{pointer-events:none}
@media(max-width:700px){.book-gallery{grid-template-columns:1fr}.book-gallery a:first-child{grid-column:auto}.book-gallery img,.book-gallery a:first-child img{height:220px}.about-portrait{height:240px}}

/* Keep all destinations visible; the camera controls remain interactive. */
@media(min-width:701px){.touch-nav{position:absolute;left:24px;right:24px;bottom:44px;top:auto!important;display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:center;opacity:0;transition:opacity .5s cubic-bezier(.22,1,.36,1)}.ready .touch-nav{opacity:1}.touch-nav span{width:100%;text-align:center;font-size:9px;letter-spacing:.2em;color:#eee}.touch-nav button{border:1px solid rgba(255,255,255,.55);background:rgba(19,22,15,.88);color:#fff;padding:8px 12px;font:500 11px/1.4 Manrope,sans-serif;cursor:pointer}.touch-nav button:hover{background:#514b3f}.camera-control .nav-button{border-color:rgba(255,255,255,.55);box-shadow:0 0 0 3px rgba(0,0,0,.35)}}
#openStoryFromBook{display:none}
@media(prefers-reduced-motion:no-preference){.book-dialog[open] .book-card{animation:book-emerge 650ms cubic-bezier(.22,1,.36,1) both}@keyframes book-emerge{from{opacity:0;transform:translateY(24px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}}

/* Persistent labels make the camera's individual controls discoverable. */
@media(min-width:701px){
  .camera-control .camera-tooltip{opacity:1;transform:translate(0,-50%);font-size:10px;letter-spacing:.02em;padding:6px 8px;background:rgba(15,18,14,.92)}
  .camera-control:nth-child(3) .camera-tooltip{top:-14px;right:calc(100% + 70px)}
  .camera-control:nth-child(4) .camera-tooltip{top:calc(100% + 16px)}
  .camera-control .nav-button{border-color:rgba(255,255,255,.85);background:rgba(255,255,255,.08)}
}
@media(max-width:700px){
  .camera-control .camera-tooltip{display:block;opacity:1;transform:translate(0,-50%);font-size:8px;line-height:1.2;padding:3px 5px;background:rgba(15,18,14,.93)}
  .camera-control:nth-child(3) .camera-tooltip{top:-12px;right:calc(100% + 52px)}
  .camera-control:nth-child(4) .camera-tooltip{top:calc(100% + 12px)}
  .camera-control .nav-button{border-color:rgba(255,255,255,.85);background:rgba(255,255,255,.08)}
}
/* A numbered key keeps every label legible without covering the photograph. */
.camera-control .camera-tooltip{opacity:0!important;pointer-events:none}
@media(hover:hover){.camera-control:has(.nav-button:hover) .camera-tooltip,.camera-control:has(.nav-button:focus-visible) .camera-tooltip{display:block;opacity:1!important;font-size:12px;padding:8px 12px;right:calc(100% + 12px);top:50%;transform:translateY(-50%);background:#181818}}
.camera-control .nav-button{display:grid;place-items:center;min-width:28px;min-height:28px;border:1px solid rgba(255,255,255,.9);background:rgba(24,24,24,.88);box-shadow:0 2px 10px rgba(0,0,0,.45)}
.camera-control .hotspot-index{position:relative;display:grid;place-items:center;z-index:2;width:100%;height:100%;color:#fff;font:700 10px/1 Manrope,sans-serif;letter-spacing:0;pointer-events:none}
.touch-nav,.webgl-fallback .touch-nav{position:absolute;left:16px;right:16px;top:auto!important;bottom:40px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:center;opacity:0;transition:opacity .5s cubic-bezier(.22,1,.36,1)}
.ready .touch-nav,.webgl-fallback .touch-nav{opacity:1}
.touch-nav .touch-nav-heading,.webgl-fallback .touch-nav .touch-nav-heading{width:100%;text-align:center;font:600 10px/1.4 Manrope,sans-serif;letter-spacing:.14em;color:#fff;margin-bottom:4px}
.touch-nav button,.webgl-fallback .touch-nav button{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 12px;border:1px solid rgba(255,255,255,.42);background:#181818;color:#fff;font:600 12px/1.4 Manrope,sans-serif;cursor:pointer;white-space:nowrap;transition:background .3s cubic-bezier(.22,1,.36,1),border-color .3s cubic-bezier(.22,1,.36,1)}
.touch-nav button:hover,.touch-nav button:focus-visible{background:#313131;border-color:#fff}
.touch-nav button span,.webgl-fallback .touch-nav button span{width:auto;text-align:left}
.touch-nav button span:not(.nav-index),.webgl-fallback .touch-nav button span:not(.nav-index){font:600 12px/1.4 Manrope,sans-serif;letter-spacing:0;color:#fff}
.touch-nav button .nav-index{display:grid;place-items:center;flex:0 0 22px;width:22px;height:22px;border:1px solid #b8b5a9;border-radius:50%;font:700 9px/1 Manrope,sans-serif;color:#fff}
.webgl-fallback .intro-ui:after{display:none}
@media(max-width:700px){.touch-nav{bottom:38px;gap:6px}.touch-nav button{min-height:44px;padding:8px;font-size:12px}.intro-foot{bottom:12px}.camera-control .nav-button{min-width:28px;min-height:28px}.camera-control .hotspot-index{font-size:9px}}
@media(prefers-reduced-motion:reduce){.touch-nav,.touch-nav button{transition:none}}
/* Short labels follow the rim of each camera control. */
.camera-control .button-label{position:absolute;inset:0;width:100%;height:100%;display:block;overflow:visible;pointer-events:none}
.camera-control .button-label text{font:700 20px Manrope,sans-serif;letter-spacing:0;fill:#fff}
.camera-control .button-label circle{fill:#e9e5dc}
.camera-control .nav-button{background:rgba(24,24,24,.94);border:1px solid rgba(255,255,255,.85);box-shadow:0 2px 10px rgba(0,0,0,.5)}
.touch-nav button{min-height:44px;font-size:13px}
.touch-nav button span:not(.nav-index){font-size:13px}
@media(max-width:500px){.camera-control .button-label text{font-size:20px}.camera-control .nav-button{min-width:32px;min-height:32px}.touch-nav button{font-size:12px}.touch-nav button span:not(.nav-index){font-size:12px}}

/* Glossy raised controls without a contrasting outline. */
.camera-control .camera-button.nav-button{
  border:0;
  background:#242724;
  box-shadow:inset 0 2px 3px rgba(255,255,255,.34),inset 0 -4px 6px rgba(0,0,0,.75),0 3px 7px rgba(0,0,0,.75),0 1px 2px rgba(0,0,0,.9);
}
.camera-control .camera-button.nav-button::after{content:'';position:absolute;left:22%;right:22%;top:7%;height:18%;border-radius:50%;background:rgba(255,255,255,.16);box-shadow:0 1px 4px rgba(255,255,255,.12);pointer-events:none}
.camera-control .camera-button.nav-button:hover,.camera-control .camera-button.nav-button:focus-visible{background:#353a36;box-shadow:inset 0 2px 4px rgba(255,255,255,.5),inset 0 -4px 6px rgba(0,0,0,.75),0 4px 10px rgba(0,0,0,.8)}
.camera-control .camera-button.nav-button:focus-visible{outline:2px solid #f2ede3;outline-offset:3px}
.camera-control .camera-button.nav-button:active,.camera-control .camera-button.nav-button.is-pressed{box-shadow:inset 0 3px 7px rgba(0,0,0,.8),inset 0 -1px 2px rgba(255,255,255,.16)}
.camera-control .button-label text{font-size:18px;paint-order:stroke;stroke:rgba(0,0,0,.7);stroke-width:1px}

/* Let the photographed camera hardware provide the shape and depth. */
.camera-control .camera-button.nav-button,
.camera-control .camera-button.nav-button:hover,
.camera-control .camera-button.nav-button:active,
.camera-control .camera-button.nav-button.is-pressed {
  border: 0;
  background: rgba(0, 0, 0, .48);
  box-shadow: none;
}
.camera-control .camera-button.nav-button::after,
.camera-control .camera-button.nav-button::before,
.camera-control .nav-button .button-glint,
.camera-control .button-label circle { display: none; }
.camera-control .camera-button.nav-button:hover { background: rgba(0, 0, 0, .28); }
.camera-control .camera-button.nav-button:active,
.camera-control .camera-button.nav-button.is-pressed { transform: scale(.97); background: rgba(0, 0, 0, .62); }
.camera-control .camera-button.nav-button:focus-visible { outline: 2px solid #f2ede3; outline-offset: 3px; }
.camera-control .button-label text { fill: #f3f1eb; stroke: rgba(0,0,0,.9); stroke-width: 2px; paint-order: stroke; }

/* A subtle engraved label follows the existing shutter surface. */
.shutter-engraving{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.shutter-engraving text{font:600 13px Manrope,sans-serif;letter-spacing:.02em;fill:#353731;paint-order:stroke;stroke:rgba(255,255,255,.36);stroke-width:.8px;filter:drop-shadow(0 1px 0 rgba(255,255,255,.5))}
.shutter-button.is-pressed .shutter-engraving{transform:translateY(8%)}
@media(prefers-reduced-motion:reduce){.shutter-button.is-pressed .shutter-engraving{transform:none}}

/* Keep the photographed camera controls visible and reveal their names on interaction. */
.camera-control .camera-button.nav-button,
.camera-control .camera-button.nav-button:hover,
.camera-control .camera-button.nav-button:focus-visible,
.camera-control .camera-button.shutter-button { background: transparent; border: 0; box-shadow: none; }
.camera-control .camera-button.nav-button:hover { box-shadow: inset 0 1px 4px rgba(255,255,255,.28), inset 0 -2px 5px rgba(0,0,0,.22); transform: scale(1.04); }
.camera-control .camera-button.nav-button:active,
.camera-control .camera-button.nav-button.is-pressed { background: rgba(0,0,0,.22); box-shadow: inset 0 3px 7px rgba(0,0,0,.65); transform: scale(.94); }
.camera-control:has(.camera-button:hover), .camera-control:has(.camera-button:focus-visible) { z-index: 10; }
.camera-control .camera-tooltip { display: block; right: calc(100% + 12px); top: 50%; opacity: 0 !important; transform: translate(8px,-50%); padding: 8px 12px; color: #f7f4ed; background: rgba(24,24,24,.94); font: 600 12px/1.3 Manrope,sans-serif; letter-spacing: 0; white-space: nowrap; pointer-events: none; transition: opacity .25s cubic-bezier(.22,1,.36,1), transform .35s cubic-bezier(.22,1,.36,1); }
.camera-control:has(.camera-button:hover) .camera-tooltip,
.camera-control:has(.camera-button:focus-visible) .camera-tooltip { opacity: 1 !important; transform: translate(0,-50%); }
.camera-control .camera-button:focus-visible { outline: 2px solid #f2ede3; outline-offset: 3px; }
@media(prefers-reduced-motion:reduce) { .camera-control .camera-tooltip { transition: none; } .camera-control .camera-button.nav-button:hover { transform: none; } }

/* Keep the portfolio callout visible beside its camera control. */
.camera-control:has(.nav-button[data-panel="portfolio"]) .camera-tooltip {
  display: block;
  opacity: 1 !important;
  transform: translate(0, -50%);
}

/* Persistent callout for the shutter, which opens the portfolio. */
.camera-control.shutter-control .shutter-portfolio-callout { display:block; visibility:visible; opacity:1 !important; transform:translateY(-50%); z-index:20; }
.camera-control:has(.nav-button[data-panel="portfolio"]) .camera-tooltip { opacity:0 !important; }
.camera-control:has(.nav-button[data-panel="portfolio"]:hover) .camera-tooltip, .camera-control:has(.nav-button[data-panel="portfolio"]:focus-visible) .camera-tooltip { opacity:1 !important; }

/* Place the portfolio callout above the shutter. */
.camera-control.shutter-control .shutter-portfolio-callout {
  top: auto;
  right: auto;
  bottom: calc(100% + 12px);
  left: 50%;
  transform: translateX(-50%);
}
.camera-control.shutter-control:has(.camera-button:hover) .shutter-portfolio-callout,
.camera-control.shutter-control:has(.camera-button:focus-visible) .shutter-portfolio-callout {
  top: auto;
  right: auto;
  transform: translateX(-50%);
}
.camera-control.shutter-control .shutter-portfolio-callout { bottom: calc(100% + 2px); }
.camera-control.shutter-control .shutter-portfolio-callout { bottom: calc(100% - 8px); }


/* Gentle highlights make the camera's own controls discoverable. */
.camera-control .camera-button.nav-button,
.camera-control .camera-button.shutter-button {
  box-shadow: inset 0 0 0 1px rgba(238, 232, 210, .24), inset 0 1px 6px rgba(255, 255, 255, .10);
}
.camera-control .camera-button.nav-button::after,
.camera-control .camera-button.shutter-button::after {
  content: '';
  display: block;
  position: absolute;
  top: 17%; left: 20%; width: 60%; height: 25%;
  border-radius: 50%;
  background: rgba(255, 255, 255, .30);
  filter: blur(3px);
  opacity: .25;
  pointer-events: none;
  animation: control-glimmer 3.6s cubic-bezier(.22,1,.36,1) infinite;
}
.camera-control:nth-child(2n) .camera-button::after { animation-delay: .6s; }
.camera-control:nth-child(3n) .camera-button::after { animation-delay: 1.2s; }
@keyframes control-glimmer { 0%, 65%, 100% { opacity: .18; transform: translateY(0); } 30% { opacity: .8; transform: translateY(2px); } }
@media (hover: hover) {
  .camera-control .camera-button.nav-button:hover,
  .camera-control .camera-button.shutter-button:hover {
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.62), inset 0 2px 8px rgba(255,255,255,.26), 0 0 14px rgba(255,242,211,.25);
  }
}
.camera-control .camera-button:focus-visible { outline: 2px solid #f2ede3; outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) {
  .camera-control .camera-button.nav-button::after,
  .camera-control .camera-button.shutter-button::after { animation: none; opacity: .45; }
}

/* Brighter reflections while keeping the hardware visible. */
.camera-control .camera-button.nav-button::after,
.camera-control .camera-button.shutter-button::after { background: rgba(255,255,255,.55); filter: blur(2px); }
@keyframes control-glimmer { 0%, 65%, 100% { opacity: .3; transform: translateY(0); } 30% { opacity: 1; transform: translateY(2px); } }


/* Extend the setting beside the camera; retain the blurred background above and below. */
.side-environment{position:absolute;z-index:0;top:var(--scene-top,0px);height:var(--scene-height,0px);background-image:url('camera-environment-wall-v1.png');background-position:center;background-size:cover;background-attachment:fixed;background-repeat:no-repeat;filter:brightness(.68);pointer-events:none}.side-environment-left{left:0;width:var(--scene-left,0px);mask-image:linear-gradient(to right,#000 0%,#000 calc(100% - 16px),transparent 100%)}.side-environment-right{right:0;width:var(--scene-right,0px);mask-image:linear-gradient(to left,#000 0%,#000 calc(100% - 16px),transparent 100%)}
.webgl-fallback .side-environment{display:none}

/* Align the side background and marble horizon with the photographed scene. */
.side-environment{background-image:url('camera-side-photo-match-v1.webp');background-size:auto 105%;background-attachment:scroll;filter:brightness(.9);mask-image:none}.side-environment-left{background-position:left top}.side-environment-right{background-position:right top}

/* One continuous strip behind the camera. */
.side-environment-left{left:0;width:100%;background-size:100% 105%;background-position:center top;mask-image:none}.side-environment-right{display:none}

/* A soft contact shadow anchors the camera to the marble. */
.camera-grounding{position:absolute;z-index:0;left:var(--ground-x,50%);top:var(--ground-y,50%);width:var(--ground-width,0px);height:var(--ground-height,0px);transform:translate(-50%,-40%);pointer-events:none;background:radial-gradient(ellipse at center,rgba(0,0,0,.68) 0%,rgba(0,0,0,.45) 35%,rgba(0,0,0,.16) 66%,transparent 78%);opacity:.9;transition:opacity .25s cubic-bezier(.22,1,.36,1)}
.camera-grounding::after{content:"";position:absolute;left:10%;right:10%;top:44%;height:35%;border-radius:50%;background:rgba(225,219,200,.08);filter:blur(6px)}
.experience[data-state="flight"] .camera-grounding,.webgl-fallback .camera-grounding{opacity:0}

/* Confine the glint to the photographed button, independently of its larger hit area. */
.camera-control .camera-button.nav-button,.camera-control .camera-button.shutter-button{overflow:hidden;border-color:transparent;box-shadow:none}
.camera-control .camera-button.nav-button::after,.camera-control .camera-button.shutter-button::after{top:37%;left:50%;width:calc(30% * var(--physical-ratio,1));height:calc(12% * var(--physical-ratio,1));transform:translateX(-50%);filter:blur(1px);background:rgba(255,255,255,.58);box-shadow:none;animation:button-contained-glimmer 3.6s cubic-bezier(.22,1,.36,1) infinite}
@keyframes button-contained-glimmer{0%,65%,100%{opacity:.22}30%{opacity:.85}}
@media(hover:hover){.camera-control .camera-button.nav-button:hover,.camera-control .camera-button.shutter-button:hover{box-shadow:none;border-color:transparent}.camera-control .camera-button.nav-button:hover::after,.camera-control .camera-button.shutter-button:hover::after{background:rgba(255,255,255,.8)}}
@media(prefers-reduced-motion:reduce){.camera-control .camera-button.nav-button::after,.camera-control .camera-button.shutter-button::after{animation:none;opacity:.4}}

/* Wider highlights sit on the upper part of each physical control. */
.camera-control .camera-button.nav-button::after,
.camera-control .camera-button.shutter-button::after{
  top:calc(50% - 34% * var(--physical-ratio,1));
  left:50%;width:calc(58% * var(--physical-ratio,1));height:calc(18% * var(--physical-ratio,1));
  background:rgba(255,255,255,.78);filter:blur(1px)
}
@keyframes button-contained-glimmer{0%,65%,100%{opacity:.3}30%{opacity:1}}

/* A curved highlight follows the top edge of the physical button. */
.camera-control .camera-button.nav-button::after,
.camera-control .camera-button.shutter-button::after{
  top:calc(50% - 35% * var(--physical-ratio,1));left:50%;
  width:calc(70% * var(--physical-ratio,1));height:calc(58% * var(--physical-ratio,1));
  transform:translateX(-50%);border-radius:50%;border:0;border-top:2px solid rgba(255,255,255,.85);
  background:transparent;box-shadow:none;filter:none;
  mask-image:linear-gradient(to right,transparent,#000 20%,#000 80%,transparent)
}
@media(hover:hover){.camera-control .camera-button.nav-button:hover::after,.camera-control .camera-button.shutter-button:hover::after{background:transparent;border-top-color:#fff}}

/* Each camera control has its own highlight dimensions and position. */
.camera-control .camera-button[data-panel="pricing"]{--glint-width:65%;--glint-height:55%;--glint-top:34%;--glint-thickness:1.5px}
.camera-control .camera-button[data-panel="reviews"]{--glint-width:64%;--glint-height:50%;--glint-top:32%;--glint-thickness:1.5px}
.camera-control .camera-button[data-panel="about"]{--glint-width:60%;--glint-height:52%;--glint-top:34%;--glint-thickness:1.5px}
.camera-control .camera-button[data-panel="portfolio"]{--glint-width:67%;--glint-height:56%;--glint-top:34%;--glint-thickness:2px}
.camera-control .camera-button[data-panel="process"]{--glint-width:65%;--glint-height:62%;--glint-top:37%;--glint-thickness:2px}
.camera-control .camera-button[data-panel="contacts"]{--glint-width:62%;--glint-height:52%;--glint-top:34%;--glint-thickness:1.5px}
.camera-control .shutter-button{--glint-width:72%;--glint-height:35%;--glint-top:30%;--glint-thickness:1.5px}
.camera-control .camera-button.nav-button::after,
.camera-control .camera-button.shutter-button::after{
  top:calc(50% - var(--glint-top,34%) * var(--physical-ratio,1));
  width:calc(var(--glint-width,65%) * var(--physical-ratio,1));
  height:calc(var(--glint-height,55%) * var(--physical-ratio,1));
  border-top-width:var(--glint-thickness,1.5px)
}

/* Highlights sized against each photographed control. */
.camera-control .camera-button[data-panel="pricing"]{--glint-width:68%;--glint-height:63%;--glint-top:36%;--glint-thickness:1.5px}
.camera-control .camera-button[data-panel="reviews"]{--glint-width:68%;--glint-height:64%;--glint-top:36%;--glint-thickness:1.5px}
.camera-control .camera-button[data-panel="about"]{--glint-width:64%;--glint-height:60%;--glint-top:35%;--glint-thickness:1px}
.camera-control .camera-button[data-panel="portfolio"]{--glint-width:68%;--glint-height:64%;--glint-top:36%;--glint-thickness:1.5px}
.camera-control .camera-button[data-panel="process"]{--glint-width:72%;--glint-height:68%;--glint-top:38%;--glint-thickness:1.5px}
.camera-control .camera-button[data-panel="contacts"]{--glint-width:68%;--glint-height:64%;--glint-top:36%;--glint-thickness:1.5px}
.camera-control .shutter-button{--glint-width:68%;--glint-height:24%;--glint-top:18%;--glint-thickness:1.5px}

/* Broader, brighter glints, still inside each control. */
.camera-control .camera-button[data-panel="pricing"]{--glint-width:80%;--glint-thickness:2px}
.camera-control .camera-button[data-panel="reviews"]{--glint-width:80%;--glint-thickness:2px}
.camera-control .camera-button[data-panel="about"]{--glint-width:78%;--glint-thickness:2px}
.camera-control .camera-button[data-panel="portfolio"]{--glint-width:80%;--glint-thickness:2px}
.camera-control .camera-button[data-panel="process"]{--glint-width:82%;--glint-thickness:2px}
.camera-control .camera-button[data-panel="contacts"]{--glint-width:80%;--glint-thickness:2px}
.camera-control .shutter-button{--glint-width:80%;--glint-thickness:2px}
.camera-control .camera-button.nav-button::after,.camera-control .camera-button.shutter-button::after{border-top-color:rgba(255,255,255,.98)}
@keyframes button-contained-glimmer{0%,65%,100%{opacity:.48}30%{opacity:1}}

/* Keep each highlight comfortably within its photographed button. */
.camera-control .camera-button[data-panel="pricing"]{--glint-width:68%;--glint-height:54%;--glint-top:29%}
.camera-control .camera-button[data-panel="reviews"]{--glint-width:68%;--glint-height:54%;--glint-top:29%}
.camera-control .camera-button[data-panel="about"]{--glint-width:65%;--glint-height:52%;--glint-top:28%}
.camera-control .camera-button[data-panel="portfolio"]{--glint-width:70%;--glint-height:56%;--glint-top:30%}
.camera-control .camera-button[data-panel="process"]{--glint-width:68%;--glint-height:56%;--glint-top:30%}
.camera-control .camera-button[data-panel="contacts"]{--glint-width:68%;--glint-height:54%;--glint-top:29%}
.camera-control .shutter-button{--glint-width:70%;--glint-height:22%;--glint-top:15%}
/* Glint adjustment mode is shown only through its private editing link. */
.camera-control .camera-button.nav-button::after,.camera-control .camera-button.shutter-button::after{
  left:calc(50% + var(--glint-offset-x,0%) * var(--physical-ratio,1));
  top:calc(50% - var(--glint-top,34%) * var(--physical-ratio,1) + var(--glint-offset-y,0%) * var(--physical-ratio,1));
  border-top-color:rgba(255,255,255,var(--glint-opacity,.98));
}
html.glint-editing .camera-control .camera-button::after{animation:none!important;opacity:1!important}
html.glint-editing .camera-control .camera-button{cursor:move;touch-action:none}
html.glint-editing .camera-control .camera-button.glint-selected{outline:2px solid #eecb94;outline-offset:3px}
.glint-editor{position:fixed;z-index:50;right:16px;top:16px;width:min(290px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:auto;padding:16px;background:#181a17;color:#f6f1e7;border:1px solid #8c806d;box-shadow:0 12px 40px rgba(0,0,0,.5);font:500 13px/1.4 Manrope,sans-serif}
.glint-editor h2{font-size:18px;line-height:1.3;margin:0 0 8px}.glint-editor p{font-size:12px;color:#d2cbbd;margin:0 0 12px}.glint-editor label{display:block;margin-top:8px}.glint-editor select{width:100%;margin-top:4px;background:#30332d;border:1px solid #8c806d;color:#fff;padding:8px}.glint-editor .glint-range-line{display:grid;grid-template-columns:1fr 42px;gap:8px;align-items:center}.glint-editor input[type=range]{width:100%;accent-color:#e2c79e}.glint-editor output{text-align:right;font-variant-numeric:tabular-nums}.glint-editor-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.glint-editor-actions button,.glint-editor-actions a{display:inline-block;padding:8px 12px;background:#ece4d6;color:#242620;border:0;font:600 12px Manrope,sans-serif;cursor:pointer}.glint-editor-actions .glint-secondary{background:#41423b;color:#fff}.glint-editor-status{min-height:1.4em;margin:8px 0 0!important}.glint-editor :focus-visible{outline:2px solid #f1c993;outline-offset:2px}@media(max-width:700px){.glint-editor{top:auto;bottom:8px;right:8px;max-height:52dvh;width:min(280px,calc(100vw - 16px));padding:12px}}

/* Keep the editing panel clear of the controls; it can be moved if needed. */
.glint-editor{left:16px;right:auto;width:min(260px,calc(100vw - 32px))}.glint-editor.glint-editor-right{left:auto;right:16px}@media(max-width:700px){.glint-editor{left:8px;right:auto}.glint-editor.glint-editor-right{left:auto;right:8px}}

/* Keep the portfolio caption still, slightly above the shutter button. */
.portfolio-static-label{position:absolute;z-index:4;left:var(--static-shutter-x,50%);top:calc(var(--static-shutter-top,0px) - 4px);transform:translate(-50%,-100%);padding:8px 12px;background:rgba(24,24,24,.94);color:#f7f4ed;font:600 12px/1.3 Manrope,sans-serif;white-space:nowrap;pointer-events:none;opacity:0}.ready .portfolio-static-label{opacity:1}.webgl-fallback .portfolio-static-label{display:none}

/* A detailed close-up replaces the tiny original lens only during the flight. */
.lens-detail,.lens-photo-reveal{position:absolute;inset:0;z-index:3;opacity:0;pointer-events:none;background-position:center;background-size:cover;background-repeat:no-repeat;will-change:opacity,transform}.lens-detail{background-image:url('lens-detail-v1.webp')}.lens-photo-reveal{background-image:url('assets/imported/olga-b84c6b01d094c9d2.webp');background-position:center 30%}
@media(prefers-reduced-motion:reduce){.lens-detail,.lens-photo-reveal{display:none}}

/* Keep the arrival photo centred consistently through the page change. */
.lens-photo-reveal{background-position:center}
