/* Shared page atmosphere also paints top-layer dialogs. */
:root{--ambient-base:linear-gradient(145deg,#e9effc,#f4eafa 50%,#e7f4f8)}
.dark-theme{--ambient-base:linear-gradient(145deg,#151d30,#251d36 50%,#102832)}
/* A full-viewport atmosphere: three visible, softly travelling composited gradient layers. */
body{position:relative;isolation:isolate;background:var(--page);overflow-x:clip}
.ambient-background{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;contain:strict;background:var(--ambient-base)}
.ambient-background i{position:absolute;display:block;border-radius:50%;width:82vmax;height:74vmax;background:radial-gradient(ellipse at 46% 45%,#94b5efab 0%,#bdd2f775 28%,#bcd2f12b 48%,transparent 69%);animation:ambient-drift 14s ease-in-out infinite alternate;top:-35vmax;left:-26vmax;transform-origin:50% 55%}
.ambient-background i:nth-child(2){top:-5vh;left:20vw;background:radial-gradient(ellipse at 48% 48%,#c4a2ef9c 0%,#e4bfe879 30%,#eacbe537 49%,transparent 69%);animation-name:ambient-drift-reverse;animation-duration:18s;animation-delay:-12s}
.ambient-background i:nth-child(3){top:40vh;left:-45vw;background:radial-gradient(ellipse at 50% 42%,#8ed5db9c 0%,#b4e1eb85 28%,#c4e3ec40 48%,transparent 69%);animation-duration:16s;animation-delay:-18s}
.dark-theme .ambient-background{background:var(--ambient-base)}
.dark-theme .ambient-background i{opacity:.34}
@keyframes ambient-drift{from{transform:translate(-8vw,-5vh) rotate(-8deg) scale(.94)}to{transform:translate(23vw,19vh) rotate(12deg) scale(1.1)}}
@keyframes ambient-drift-reverse{from{transform:translate(12vw,10vh) rotate(8deg)}to{transform:translate(-21vw,-15vh) rotate(-12deg) scale(1.12)}}
.hero{overflow:visible}.sound-orb{padding:0;color:inherit;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;outline-offset:9px;overflow:visible}
.sound-orb .orb-core,.sound-orb .orb-bars,.orb-ripple,.water-impact,.water-impact i{pointer-events:none}
.sound-orb:focus-visible{outline:2px solid #8479cd;border-radius:40%}
.sound-orb:active{box-shadow:inset 0 2px 20px #fff,0 0 42px #9b97ed77}
.orb-ripple{display:none}
.water-impact{position:absolute;inset:0;z-index:-1;overflow:visible}
.water-impact i{position:absolute;left:var(--impact-x,50%);top:var(--impact-y,50%);width:64px;height:64px;margin:-32px;border-radius:50%;border:1px solid #f9fbffde;box-shadow:0 0 0 1px #9baee660,inset 0 0 10px #fff8,0 0 14px #bbcafa66;background:radial-gradient(circle,transparent 58%,#fff2 72%,transparent 75%);opacity:0;animation:water-wave 1.85s cubic-bezier(.12,.54,.24,1) both;animation-delay:calc(var(--ring-index)*.17s)}
.water-impact i:nth-child(2){border-color:#dfdcfbc9;box-shadow:0 0 0 1px #b7a4d64d,inset 0 0 7px #fff6,0 0 12px #c5b6eb55}
.water-impact i:nth-child(3){border-color:#e4f9ffad;box-shadow:0 0 0 1px #83b7ce40,inset 0 0 8px #fff4}
@keyframes water-wave{0%{transform:scale(.55,.51);opacity:0}10%{opacity:.7}37%{transform:scale(2.05,1.98);opacity:.48}72%{opacity:.16}100%{transform:scale(5.7,5.5);opacity:0}}
.sound-orb.is-tapped{animation:orb-tap .85s ease-out both,orb-morph 12s ease-in-out infinite}
.sound-orb.is-tapped .orb-bars{animation:orb-bars-tap .85s ease-out both}
@keyframes orb-tap{0%{transform:scale(1)}16%{transform:scale(.96,1.025)}38%{transform:scale(1.035,.975)}61%{transform:scale(.99,1.012)}83%{transform:scale(1.005,.995)}100%{transform:scale(1)}}
@keyframes orb-bars-tap{18%{transform:scale(.97,.88)}42%{transform:scale(1.02,1.09)}68%{transform:scale(.995,.97)}100%{transform:scale(1)}}
.sound-orb.is-touch-feedback{box-shadow:inset 0 2px 22px #fff,0 0 38px #a8a1ed88}
@media(prefers-reduced-motion:reduce){.ambient-background i,.sound-orb.is-tapped,.water-impact i,.sound-orb.is-tapped .orb-bars{animation:none!important}.water-impact{display:none}}
.motion-paused .ambient-background i,.page-hidden .ambient-background i{animation-play-state:paused!important}
.motion-paused .water-impact,.page-hidden .water-impact{display:none}
/* Source-labelled references keep external work distinct from Artem’s portfolio. */
.media-notice{font-size:12px!important;line-height:1.6!important;color:var(--muted)}
.example-body h4{font-size:15px;font-weight:550;margin:10px 0}.source-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:22px 0}.source-cards a{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:20px 16px;border-radius:22px;border:1px solid var(--glass-line);background:var(--glass-sheet);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);font-size:13px;transition:transform .25s,background .25s}.source-cards a:hover{transform:translateY(-3px);background:#ffffff66}.source-cards a:focus-visible{outline:2px solid #8479cd;outline-offset:3px}.dark-theme .source-cards a:hover{background:#ffffff18}.popcity-gallery{grid-column:1/-1}.player-slot iframe{max-width:100%}@media(max-width:420px){.source-cards{grid-template-columns:1fr}}

/* Real Pop City photographs: preserve each source image's complete composition. */
.studio-photo-grid{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,4fr);align-items:start;gap:28px;margin:26px 0}.studio-photo{margin:0;min-width:0}.studio-photo-room{max-width:360px}.studio-photo-detail{max-width:640px}.studio-photo>a{display:block;border-radius:22px}.studio-photo img{display:block;width:100%;height:auto;border-radius:22px;border:1px solid var(--glass-line);background:var(--glass-sheet)}.studio-photo figcaption{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 14px;padding:14px 2px 0;font-size:14px;line-height:1.5}.studio-photo .photo-source{font-size:12px;color:var(--muted);text-decoration:underline;text-underline-offset:3px}.studio-photo a:focus-visible{outline:2px solid #8479cd;outline-offset:5px}@media(max-width:650px){.studio-photo-grid{grid-template-columns:1fr;gap:28px}.studio-photo-room{width:100%;max-width:480px}.studio-photo-detail{width:100%}.studio-photo figcaption{gap:5px 12px}}

/* Local click-to-play studio reel; no automatic animation or video loading. */
.studio-video-block{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,360px);gap:28px;align-items:center;margin:34px 0 26px;padding-top:28px;border-top:1px solid var(--glass-line)}.studio-video-copy{max-width:480px;min-width:0}.studio-video-copy h4{font-size:22px;line-height:1.25;margin:0 0 14px}.studio-video-copy .photo-source{font-size:12px;text-decoration:underline;text-underline-offset:3px}.studio-video-block video{display:block;width:100%;height:auto;aspect-ratio:9/16;max-width:360px;background:#111;border-radius:22px}.studio-video-block video:focus-visible{outline:2px solid #8479cd;outline-offset:5px}@media(max-width:650px){.studio-video-block{grid-template-columns:1fr;gap:18px}.studio-video-block video{justify-self:center}}

/* Compact studio media and legible address. */
.studio-photo-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:24px 0}.studio-photo-room,.studio-photo-detail{max-width:none;width:auto}.studio-photo img{height:180px;object-fit:cover;border-radius:16px}.studio-video-block{grid-template-columns:1fr 230px}.studio-video-block video{max-width:230px}#address h3{font-size:22px;line-height:1.3}#address p{font-size:16px;line-height:1.6;max-width:600px}#address p:has(.text-link){display:flex;flex-wrap:wrap;gap:12px 24px}.calc-message textarea{cursor:text}@media(max-width:650px){.studio-photo-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.studio-photo img{height:160px}.studio-video-block{grid-template-columns:1fr}.studio-video-block video{max-width:250px}#address h3{font-size:21px}#address p{font-size:16px}}
