:root{--bg:#131315;--panel:#1b1b1e;--line:#2c2c31;--text:#ece8e1;--mute:#a09b92;--accent:#d4a76a;--ok:#7fc29b;--bad:#e8806f;
--serif:'Instrument Serif',Georgia,serif;--sans:'DM Sans',system-ui,sans-serif;--r:14px}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{background:var(--bg);color:var(--text);font:400 16px/1.65 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.05;letter-spacing:-.01em}
h1{font-size:clamp(3rem,7.4vw,6.4rem)}
h2{font-size:clamp(2rem,4vw,3.2rem)}
em{color:var(--accent)}

/* ambient light */
.ambient{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.ambient i{position:absolute;width:60vmax;height:60vmax;border-radius:50%;filter:blur(90px);opacity:.16;background:radial-gradient(circle,#d4a76a,transparent 65%);left:-10vmax;top:-10vmax;transition:transform 1.6s cubic-bezier(.2,.7,.2,1)}
.ambient .g2{left:auto;right:-20vmax;top:auto;bottom:-20vmax;background:radial-gradient(circle,#4a6a8a,transparent 65%);opacity:.13}

/* nav */
.nav{position:fixed;inset:0 0 auto;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.8rem clamp(1rem,4vw,3rem);transition:background .3s,backdrop-filter .3s}
.nav.scrolled{background:rgba(19,19,21,.82);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.brand img{height:46px;width:auto}
.nav nav{display:flex;gap:1.6rem}
.nav nav a{color:var(--mute);font-size:.95rem;transition:color .2s}
.nav nav a:hover{color:var(--text)}
@media(max-width:760px){.nav nav{display:none}}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.85rem 1.5rem;border-radius:99px;background:var(--accent);color:#17130c;font:600 .95rem var(--sans);border:1px solid var(--accent);cursor:pointer;transition:transform .2s,background .2s,color .2s}
.btn:hover{transform:translateY(-2px)}
.btn.ghost{background:transparent;color:var(--text);border-color:var(--line)}
.btn.ghost:hover{border-color:var(--accent);color:var(--accent)}
.btn.sm{padding:.55rem 1.1rem;font-size:.88rem}
.link{background:none;border:0;color:var(--mute);cursor:pointer;font:inherit;text-decoration:underline}

/* hero */
.hero{min-height:100vh;display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(1.5rem,4vw,4rem);align-items:center;padding:7rem clamp(1rem,4vw,3rem) 3rem}
.hero-copy p{color:var(--mute);max-width:34rem;margin:1.5rem 0 2rem;font-size:1.1rem}
.badge{display:inline-flex;align-items:center;gap:.6rem;padding:.4rem .9rem;border:1px solid var(--line);border-radius:99px;font-size:.85rem;color:var(--mute);margin-bottom:1.6rem;background:rgba(255,255,255,.02)}
.badge b{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 0 var(--ok);animation:pulse 2s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 8px transparent}100%{box-shadow:0 0 0 0 transparent}}
.cta-row{display:flex;gap:.8rem;flex-wrap:wrap}
.card img,.grid img,.vcard img{width:100%;height:100%;object-fit:cover;transition:transform .7s,filter .4s}
@media(max-width:900px){.hero{grid-template-columns:1fr;min-height:auto;padding-top:6.5rem}}

/* sections */
.sec{padding:clamp(4rem,9vw,8rem) clamp(1rem,4vw,3rem);max-width:1400px;margin:auto}
.sec-head{margin-bottom:2rem;display:flex;justify-content:space-between;align-items:end;gap:1rem;flex-wrap:wrap}
.sec-head p{color:var(--mute);max-width:26rem}
.tabs{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1.5rem}
.tabs button{padding:.5rem 1.1rem;border-radius:99px;border:1px solid var(--line);background:none;color:var(--mute);font:500 .92rem var(--sans);cursor:pointer;transition:all .2s}
.tabs button:hover{color:var(--text)}
.tabs button[aria-selected=true]{background:var(--text);color:var(--bg);border-color:var(--text)}
.folders{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px;margin-bottom:2rem}
.card{position:relative;aspect-ratio:4/5;border-radius:var(--r);overflow:hidden;border:0;padding:0;cursor:pointer;background:var(--panel);text-align:left;color:var(--text)}
.card:hover img{transform:scale(1.06)}
.card::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 45%,rgba(10,10,12,.85))}
.card div{position:absolute;left:1rem;right:1rem;bottom:.9rem;z-index:1}
.card h3{font-size:1.7rem}.card span{font-size:.85rem;color:var(--mute)}
.masonry{columns:4 220px;column-gap:12px}
.masonry button{display:block;width:100%;margin:0 0 12px;padding:0;border:0;border-radius:10px;overflow:hidden;background:var(--panel);cursor:zoom-in;break-inside:avoid}
.masonry img{width:100%;height:auto;transition:transform .6s,opacity .6s;opacity:0}
.masonry img.in,.grid img.in{opacity:1}
.masonry button:hover img{transform:scale(1.04)}

/* videos */
.videos{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px}
.vcard{position:relative;aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;background:var(--panel);border:0;padding:0;cursor:pointer;color:var(--text);text-align:left}
.vcard::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 40%,rgba(10,10,12,.85))}
.vcard:hover img{transform:scale(1.05)}
.vcard .play{position:absolute;z-index:1;top:50%;left:50%;translate:-50% -50%;width:64px;height:64px;border-radius:50%;background:rgba(236,232,225,.92);display:grid;place-items:center;transition:transform .25s}
.vcard:hover .play{transform:scale(1.12)}
.play::before{content:"";border-left:16px solid #131315;border-block:10px solid transparent;margin-left:4px}
.vcard div.t{position:absolute;z-index:1;left:1rem;bottom:.9rem}
.vcard h3{font-size:1.5rem}.vcard span{font-size:.85rem;color:var(--mute)}
.vcard iframe{position:absolute;inset:0;width:100%;height:100%;border:0;z-index:2}

/* about */
.about{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(2rem,6vw,6rem);align-items:center}
.about-img{border-radius:var(--r);overflow:hidden;aspect-ratio:4/5;background:var(--panel)}
.about-img img{width:100%;height:100%;object-fit:cover;filter:grayscale(.25)}
.about-copy h2{margin-bottom:1.5rem}
.about-copy p{color:var(--mute);max-width:38rem;margin-bottom:1rem}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:2rem;border-top:1px solid var(--line);padding-top:1.5rem}
.stats dt{font:400 1.35rem var(--serif)}.stats dd{font-size:.85rem;color:var(--mute);margin:0}
@media(max-width:800px){.about{grid-template-columns:1fr}.stats{grid-template-columns:1fr}}

/* gear */
.gear{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px}
.gcat{border:1px solid var(--line);border-radius:var(--r);padding:1.4rem;background:var(--panel)}
.gcat h3{font-size:1.6rem;margin-bottom:.8rem}
.gcat ul{list-style:none;padding:0}
.gcat li{display:flex;justify-content:space-between;align-items:center;gap:.6rem;padding:.6rem 0;border-top:1px solid var(--line);font-size:.95rem}
.st{font-size:.76rem;padding:.15rem .65rem;border-radius:99px;white-space:nowrap}
.st.upgrading{background:rgba(212,167,106,.15);color:var(--accent);animation:blink 2.4s ease-in-out infinite}
.st.wishlist{border:1px dashed var(--mute);color:var(--mute)}
@keyframes blink{50%{opacity:.55}}

/* booking */
.book-grid{display:grid;grid-template-columns:1.3fr .7fr;gap:2rem;align-items:start}
form{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
label{display:grid;gap:.35rem;font-size:.88rem;color:var(--mute)}
.full{grid-column:1/-1}
input,select,textarea{width:100%;padding:.85rem 1rem;border-radius:10px;border:1px solid var(--line);background:var(--panel);color:var(--text);font:inherit;color-scheme:dark}
input:focus,select:focus,textarea:focus{border-color:var(--accent);outline:0}
label.bad input,label.bad select,label.bad textarea{border-color:var(--bad)}
small{color:var(--bad);min-height:1em;font-size:.8rem}
.success{border:1px solid var(--ok);border-radius:var(--r);padding:2rem;background:rgba(127,194,155,.06)}
.success h3{font-size:2rem;color:var(--ok);margin-bottom:.5rem}.success p{margin-bottom:1.2rem;color:var(--mute)}
.contact{border:1px solid var(--line);border-radius:var(--r);padding:1.5rem;background:var(--panel)}
.contact h3{font-size:1.6rem;margin-bottom:.8rem}
.contact ul{list-style:none;padding:0}
.contact li a{display:flex;justify-content:space-between;padding:.7rem 0;border-top:1px solid var(--line);color:var(--text)}
.contact li a span{color:var(--mute);font-size:.88rem}
.contact li a:hover span{color:var(--accent)}
@media(max-width:860px){.book-grid{grid-template-columns:1fr}form{grid-template-columns:1fr}}

.foot{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding:2rem clamp(1rem,4vw,3rem) 5rem;border-top:1px solid var(--line);color:var(--mute);font-size:.88rem}
.foot img{height:34px;width:auto;opacity:.85}
.fab{position:fixed;right:18px;bottom:18px;z-index:40;padding:.85rem 1.4rem;border-radius:99px;background:var(--accent);color:#17130c;font-weight:600;box-shadow:0 10px 30px rgba(0,0,0,.45);transition:transform .25s,opacity .25s}
.fab:hover{transform:translateY(-3px)}
.fab.hide{opacity:0;pointer-events:none;transform:translateY(20px)}

/* modals */
.modal,.lb{position:fixed;inset:0;z-index:100;background:rgba(10,10,12,.9);backdrop-filter:blur(8px);overflow:auto;padding:clamp(.5rem,3vw,2.5rem);animation:fade .25s}
.modal[hidden],.lb[hidden]{display:none}
@keyframes fade{from{opacity:0}}
.modal-box{max-width:1200px;margin:auto;background:var(--bg);border:1px solid var(--line);border-radius:18px;padding:clamp(1rem,3vw,2rem);animation:rise .35s cubic-bezier(.2,.8,.2,1)}
.modal-box.wide{max-width:1000px}
@keyframes rise{from{transform:translateY(24px);opacity:0}}
.modal-top{display:flex;justify-content:space-between;gap:1rem;align-items:start;margin-bottom:1.2rem;flex-wrap:wrap}
.modal-top p{color:var(--mute);font-size:.92rem}
.modal-top h3{font-size:2.2rem}
.row{display:flex;gap:.6rem;align-items:center}
.x{width:40px;height:40px;border-radius:50%;border:1px solid var(--line);background:none;color:var(--text);font-size:1.5rem;line-height:1;cursor:pointer}
.x:hover{border-color:var(--accent);color:var(--accent)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.grid button{aspect-ratio:1;border:0;padding:0;border-radius:10px;overflow:hidden;cursor:zoom-in;background:var(--panel)}
.grid img{opacity:0}
.lb{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.5rem;padding:1rem}
.lb[hidden]{display:none}
.lb .x{position:absolute;top:14px;right:14px;z-index:2}
.lb figure{display:grid;gap:.6rem;justify-items:center;min-width:0}
.lb img{max-height:80vh;width:auto;max-width:100%;border-radius:8px}
.lb figcaption{display:flex;gap:1rem;align-items:baseline;color:var(--text)}
.lb small{color:var(--mute)}
.nv{width:48px;height:48px;border-radius:50%;border:1px solid var(--line);background:rgba(27,27,30,.8);color:var(--text);font-size:2rem;cursor:pointer;line-height:1}
.nv:hover{border-color:var(--accent);color:var(--accent)}
@media(max-width:600px){.lb{grid-template-columns:1fr;grid-template-rows:1fr auto}.nv{position:absolute;bottom:14px}.nv.p{left:14px}.nv.n{right:14px}}

/* admin */
.atabs{display:flex;gap:.5rem;margin-bottom:1.2rem;flex-wrap:wrap}
.atabs button{padding:.45rem 1rem;border-radius:99px;border:1px solid var(--line);background:none;color:var(--mute);cursor:pointer;font:inherit}
.atabs button[aria-selected=true]{background:var(--text);color:var(--bg)}
.arow{display:grid;grid-template-columns:140px 1fr auto;gap:.6rem;align-items:center;padding:.6rem 0;border-top:1px solid var(--line)}
.arow input,.arow select{padding:.55rem .8rem;font-size:.9rem}
.inq{border:1px solid var(--line);border-radius:12px;padding:1rem;margin-bottom:.7rem;background:var(--panel)}
.inq header{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:.3rem}
.inq p{color:var(--mute);font-size:.92rem;white-space:pre-wrap}
.empty{color:var(--mute);padding:2rem;border:1px dashed var(--line);border-radius:12px;text-align:center}
.note{color:var(--mute);font-size:.85rem;margin-top:1rem}
.mini{padding:.3rem .8rem;font-size:.8rem}
@media(max-width:640px){.arow{grid-template-columns:1fr}}

@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.mosaic button{opacity:1;clip-path:none}}

/* v2: browse, album cards, dashboard, hidden admin */
.sec-head h3{font-size:2rem}
.albs{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.alb{display:block;text-align:left;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;color:var(--text);cursor:pointer;padding:0;transition:border-color .2s,transform .2s}
.alb:hover{border-color:var(--accent);transform:translateY(-3px)}
.alb .ph{aspect-ratio:4/3;background:#222;overflow:hidden}
.alb img{width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s}.alb img.in{opacity:1}
.alb .tx{padding:.9rem 1rem}.alb b{display:block;font:400 1.35rem var(--serif)}.alb span{color:var(--mute);font-size:.85rem}
.browse{margin-top:clamp(3rem,6vw,5rem)}
.ahead{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;margin-bottom:1.2rem}
.ahead h4{font:400 1.8rem var(--serif)}.ahead span{color:var(--mute);font-size:.9rem}
.more{display:flex;margin:1.5rem auto 0}
.masonry img{min-height:140px;background:var(--panel)}
.hot{position:fixed;left:0;bottom:0;width:110px;height:80px;z-index:60;display:flex;align-items:flex-end;padding:16px}
.hot button{width:44px;height:44px;border:0;border-radius:50%;background:radial-gradient(circle,rgba(212,167,106,.55) 0 3px,transparent 4px);opacity:0;cursor:pointer;transition:opacity .3s}
.hot:hover button,.hot button:focus-visible{opacity:1}
.dash{display:grid;grid-template-columns:190px minmax(0,1fr);gap:1.5rem}
.side{display:grid;align-content:start;gap:.3rem}
.side button{text-align:left;padding:.6rem .9rem;border-radius:10px;background:none;border:0;color:var(--mute);font:inherit;cursor:pointer}
.side button[aria-selected=true]{background:var(--panel);color:var(--text)}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:1rem}
.kpi{border:1px solid var(--line);border-radius:12px;padding:1rem;background:var(--panel)}
.kpi b{display:block;font:400 2rem var(--serif)}.kpi span{color:var(--mute);font-size:.85rem}
.dash h4{font:400 1.6rem var(--serif);margin:0 0 .6rem}
.stat{padding:.7rem 1rem;border-radius:10px;border:1px solid var(--line);margin-bottom:1rem;font-size:.92rem}
.stat.ok{border-color:var(--ok);color:var(--ok)}.stat.bad{border-color:var(--bad);color:var(--bad)}
@media(max-width:760px){.dash{grid-template-columns:1fr}.side{grid-auto-flow:column;overflow-x:auto}}
.vwrap{position:relative;aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;background:var(--panel)}
.vwrap iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.vwrap .vcard{border-radius:0}

/* v5: justified rows, album rows, explore, lightbox, video stage */
h1{font-size:clamp(2.8rem,5.4vw,5rem)}
@media(min-width:901px){.hero{grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr)}}
.mosaic{min-width:0}
.mosaic.loading{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.sk{height:125px;border-radius:8px;background:linear-gradient(90deg,var(--panel),#27272b,var(--panel));background-size:200% 100%;animation:sh 1.4s infinite}
@keyframes sh{to{background-position:-200% 0}}
.jrow{display:flex;gap:8px;margin-bottom:8px}
.jt{flex:none;position:relative;overflow:hidden;border:0;padding:0;border-radius:8px;background:var(--panel);cursor:zoom-in;opacity:0;transform:translateY(18px) scale(.96)}
.jt.in{opacity:1;transform:none;transition:opacity .8s cubic-bezier(.2,.8,.2,1),transform .8s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--i)*70ms)}
.jt img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .6s,transform .9s cubic-bezier(.2,.8,.2,1)}
.jt img.in{opacity:1}
.jt:hover img{transform:scale(1.05)}
.arow2{padding:2.2rem 0 1.6rem;border-top:1px solid var(--line)}
.ahd{display:flex;align-items:baseline;gap:1rem;flex-wrap:wrap;margin-bottom:1.2rem}
.ahd .num{color:var(--accent);letter-spacing:.12em;font-size:.9rem}
.ahd h3{font-size:clamp(2.4rem,5.5vw,4.4rem)}
.ahd .cnt{color:var(--mute);font-size:.9rem}
.ahd .btn{margin-left:auto;align-self:center}
.ex{position:fixed;inset:0;z-index:90;background:var(--bg);overflow:auto;padding:clamp(1rem,3vw,2.5rem);animation:exin .55s cubic-bezier(.2,.8,.2,1)}
.ex[hidden]{display:none}
@keyframes exin{from{transform:translateY(5%);opacity:0}}
.ex-top{display:flex;justify-content:space-between;align-items:start;gap:1rem;margin-bottom:1rem}
.ex-top h3{font-size:clamp(2.6rem,6vw,4.8rem)}.ex-top p{color:var(--mute)}
.ex .more{margin:1.5rem auto 3rem}
.lb{background:rgba(10,10,12,.94);backdrop-filter:none}
.lb img{max-width:none;max-height:none;justify-self:center;border-radius:8px;object-fit:contain;transform-origin:0 0;display:block}
.videos{display:block}
.vstage{position:relative;aspect-ratio:16/9;max-width:1280px;margin:0 auto;border-radius:var(--r);overflow:hidden;background:#000}
.vstage>img{width:100%;height:100%;object-fit:cover;display:block}
.vstage iframe{position:absolute;inset:0;width:100%;height:100%;border:0;pointer-events:none}
.vstage iframe.raw{pointer-events:auto}
.vov{position:absolute;inset:0;z-index:3;background:none;border:0;cursor:pointer;display:grid;place-items:center;padding:0}
.vov i{width:78px;height:78px;border-radius:50%;background:rgba(236,232,225,.94);display:grid;place-items:center;transition:opacity .3s,transform .25s}
.vov i::before{content:"";border-left:20px solid #131315;border-block:12px solid transparent;margin-left:5px}
.vov:hover i{transform:scale(1.08)}
.vstage.playing .vov i{opacity:0;transform:scale(.85)}
.vstage.playing .vov:hover i{opacity:.92}
.vstage.playing .vov i::before{border:0;border-inline:7px solid #131315;width:8px;height:26px;margin:0}
.vstrip{display:flex;gap:10px;max-width:1280px;margin:12px auto 0;overflow-x:auto;padding-bottom:4px}
.vt{flex:0 0 190px;aspect-ratio:16/9;border-radius:10px;overflow:hidden;border:2px solid transparent;padding:0;background:var(--panel);cursor:pointer;opacity:.65;transition:opacity .2s,border-color .2s}
.vt img{width:100%;height:100%;object-fit:cover;display:block}
.vt:hover,.vt.on{opacity:1}.vt.on{border-color:var(--accent)}