/* Golden Vault Studio — motion + modals. Spring physics on everything you touch, pop-up modals instead of new tabs.
   Loaded by the Studio, the portal and the community. Pairs with gv-motion.js. */
:root{
  --spring:linear(0, 0.047, 0.165, 0.322, 0.493, 0.659, 0.806, 0.927, 1.018, 1.081, 1.118, 1.134, 1.133, 1.121, 1.101, 1.079, 1.056, 1.034, 1.016, 1.002, 0.992, 0.986, 0.982, 0.982, 0.983, 0.985, 0.988, 0.991, 0.994, 0.997, 0.999, 1.001, 1.002, 1.002, 1.002, 1.002, 1.002, 1.002, 1.001, 1.001, 1);
  --spring-soft:linear(0, 0.033, 0.113, 0.219, 0.336, 0.452, 0.562, 0.66, 0.745, 0.816, 0.874, 0.919, 0.953, 0.979, 0.997, 1.009, 1.016, 1.02, 1.021, 1.021, 1.019, 1.017, 1.014, 1.012, 1.01, 1.007, 1.006, 1.004, 1.003, 1.002, 1.001, 1.001, 1, 1, 1, 1, 1, 1, 1, 1, 1);
  --spring-pop:linear(0, 0.051, 0.179, 0.354, 0.545, 0.731, 0.894, 1.026, 1.12, 1.179, 1.205, 1.205, 1.185, 1.152, 1.113, 1.074, 1.037, 1.007, 0.983, 0.968, 0.959, 0.957, 0.959, 0.965, 0.973, 0.981, 0.989, 0.996, 1.001, 1.005, 1.008, 1.009, 1.009, 1.008, 1.006, 1.005, 1.003, 1.002, 1, 0.999, 1);
  --gm-gold:#d8b46a;--gm-hi:#f6e3a8;
}

/* ---------- page-to-page: a soft cinematic cross-fade between Studio screens (Chrome, Edge, Safari 18+) ---------- */
@view-transition{navigation:auto}
::view-transition-old(root){animation:gm-out .28s cubic-bezier(.4,0,1,1) both}
::view-transition-new(root){animation:gm-in .7s var(--spring-soft) both}
@keyframes gm-out{to{opacity:0;transform:scale(.985);filter:blur(4px)}}
@keyframes gm-in{from{opacity:0;transform:translateY(14px) scale(1.01)}}

/* ---------- press + hover: everything clickable has weight ---------- */
.btn,.filters a,.side a.nav,.pill,.gvc-card button,.stars button,.media-grid a,tr.click,.fields-help code,.gm-press{transition:transform .55s var(--spring-pop),box-shadow .3s,background-color .25s,color .25s,border-color .25s,filter .25s;will-change:transform}
.btn:hover,.filters a:hover{transform:translateY(-2px)}
.btn:not(.ghost):hover{box-shadow:0 10px 30px -10px rgba(216,180,106,.65);filter:brightness(1.06)}
.btn:active,.filters a:active,.pill:active,.gm-press:active,.gvc-card button:active{transform:scale(.93);transition-duration:.08s}
.side a.nav:hover{transform:translateX(3px)}
.side a.nav:active{transform:translateX(3px) scale(.96);transition-duration:.08s}
.side a.nav.on{box-shadow:inset 2px 0 0 var(--gm-gold)}
.stars button:hover{transform:scale(1.3) rotate(-8deg)}
.stars button:active{transform:scale(.8);transition-duration:.08s}
.media-grid a:hover{transform:translateY(-4px) scale(1.02);box-shadow:0 18px 40px -16px rgba(0,0,0,.9),0 0 0 1px rgba(216,180,106,.35)}
.media-grid a:active{transform:scale(.97);transition-duration:.08s}
tr.click:active{transform:scale(.995)}

/* ---------- cards arrive on a spring as they scroll in ---------- */
html.gm-on .gm-pre{opacity:0;transform:translateY(22px) scale(.985)}
html.gm-on .gm-arrive{opacity:1;transform:none;transition:opacity .5s ease,transform .9s var(--spring);transition-delay:var(--gm-d,0ms)}
.card,.gvc-card{transition:border-color .3s,box-shadow .4s,transform .6s var(--spring-soft)}
.card:hover{border-color:rgba(216,180,106,.3);box-shadow:0 24px 60px -34px rgba(0,0,0,.9)}

/* ---------- the modal ---------- */
.gm-modal{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;padding:max(16px,env(safe-area-inset-top)) 16px max(16px,env(safe-area-inset-bottom))}
.gm-scrim{position:absolute;inset:0;background:radial-gradient(1000px 700px at 50% 40%,rgba(30,22,10,.55),rgba(0,0,0,.86));backdrop-filter:blur(14px) saturate(120%);-webkit-backdrop-filter:blur(14px) saturate(120%);opacity:0;transition:opacity .35s ease}
.gm-modal.is-open .gm-scrim{opacity:1}
.gm-modal.is-closing .gm-scrim{opacity:0;transition-duration:.25s}
.gm-panel{position:relative;max-width:min(1100px,100%);max-height:100%;display:flex;flex-direction:column;border-radius:20px;background:#0b0907;border:1px solid rgba(216,180,106,.28);box-shadow:0 50px 120px -30px rgba(0,0,0,.95),0 0 0 1px rgba(0,0,0,.6);overflow:hidden;transform-origin:var(--gm-ox,50%) var(--gm-oy,50%);opacity:0;transform:scale(.86) translateY(18px)}
.gm-modal.is-open .gm-panel{opacity:1;transform:none;transition:opacity .25s ease,transform .75s var(--spring)}
.gm-modal.is-closing .gm-panel{opacity:0;transform:scale(.92) translateY(10px);transition:opacity .2s ease,transform .3s cubic-bezier(.4,0,1,1)}
.gm-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px 12px 18px;border-bottom:1px solid rgba(216,180,106,.16);font:400 10px "JetBrains Mono",ui-monospace,monospace;letter-spacing:.22em;text-transform:uppercase;color:#9a8e78}
.gm-head b{color:var(--gm-hi);font-weight:500}
.gm-actions{display:flex;gap:8px;align-items:center}
.gm-x,.gm-ext{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:50%;border:1px solid rgba(216,180,106,.3);background:rgba(0,0,0,.35);color:var(--gm-hi);cursor:pointer;text-decoration:none;font:400 16px/1 system-ui;transition:transform .5s var(--spring-pop),background .2s}
.gm-x:hover,.gm-ext:hover{background:rgba(216,180,106,.16);transform:rotate(90deg)}
.gm-ext:hover{transform:translate(2px,-2px)}
.gm-x:active,.gm-ext:active{transform:scale(.85);transition-duration:.08s}
.gm-body{position:relative;flex:1;min-height:0;overflow:auto}
.gm-frame{display:block;width:min(1100px,92vw);height:min(86vh,1000px);border:0;background:#050403}
.gm-frame.cc{width:min(1000px,92vw)}
.gm-load{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;transition:opacity .3s}
.gm-load.gone{opacity:0}

/* lightbox */
.gm-modal.is-light .gm-panel{background:transparent;border:0;box-shadow:none;border-radius:0;overflow:visible;max-width:none}
.gm-modal.is-light .gm-body{overflow:visible}
.gm-modal.is-light .gm-head{position:fixed;top:max(14px,env(safe-area-inset-top));left:16px;right:16px;border:0;padding:0;z-index:2}
.gm-stage{position:relative;display:grid;grid-template:100% / 100%;place-items:center;width:min(92vw,1200px);height:min(84vh,1400px);touch-action:pan-y}
.gm-img{max-width:min(92vw,1200px);max-height:min(84vh,1400px);width:auto;height:auto;object-fit:contain;border-radius:14px;box-shadow:0 40px 120px -30px rgba(0,0,0,.95);user-select:none;-webkit-user-drag:none;transition:transform .7s var(--spring),opacity .3s}
.gm-img.out-l{transform:translateX(-14%) scale(.94) rotate(-2deg);opacity:0;transition:transform .25s cubic-bezier(.4,0,1,1),opacity .2s}
.gm-img.out-r{transform:translateX(14%) scale(.94) rotate(2deg);opacity:0;transition:transform .25s cubic-bezier(.4,0,1,1),opacity .2s}
.gm-img.in-l{transform:translateX(-10%) scale(.96);opacity:0;transition:none}
.gm-img.in-r{transform:translateX(10%) scale(.96);opacity:0;transition:none}
.gm-nav{position:absolute;top:50%;width:48px;height:48px;margin-top:-24px;border-radius:50%;border:1px solid rgba(216,180,106,.35);background:rgba(0,0,0,.45);color:var(--gm-hi);font:300 26px/1 system-ui;cursor:pointer;display:grid;place-items:center;transition:transform .5s var(--spring-pop),background .2s;z-index:2}
.gm-nav:hover{background:rgba(216,180,106,.18);transform:scale(1.1)}
.gm-nav:active{transform:scale(.88);transition-duration:.08s}
.gm-prev{left:-8px}.gm-next{right:-8px}
@media (max-width:700px){.gm-prev{left:4px}.gm-next{right:4px}}
.gm-dots{position:absolute;left:0;right:0;bottom:-30px;display:flex;justify-content:center;gap:6px}
.gm-dots i{width:6px;height:6px;border-radius:99px;background:rgba(216,180,106,.3);transition:width .5s var(--spring),background .3s}
.gm-dots i.on{width:22px;background:var(--gm-hi)}
html.gm-locked{overflow:hidden}

/* ---------- Studio person page polish ---------- */
.person-head .btn.gm-mail{text-transform:none;letter-spacing:.04em;font:600 13px "Inter Tight",system-ui,sans-serif}
.person-head .hs-empty{display:grid;place-items:center;align-content:center;gap:8px;background:radial-gradient(circle at 50% 35%,rgba(216,180,106,.18),transparent 70%),#120d07}
.person-head .hs-empty b{font:900 46px/1 "Big Shoulders Display",Impact,sans-serif;letter-spacing:.04em;background:linear-gradient(100deg,#b8862e,#f6e3a8 45%,#d8b46a 60%,#b8862e);-webkit-background-clip:text;background-clip:text;color:transparent}
.person-head .hs-empty small{font:400 9px "JetBrains Mono",ui-monospace,monospace;letter-spacing:.2em;text-transform:uppercase;color:#6f6553}
.person-head img.hs{transition:transform .6s var(--spring),box-shadow .3s}
.person-head a:hover img.hs{transform:scale(1.03) rotate(-.6deg);box-shadow:0 24px 60px -20px rgba(0,0,0,.9)}
.rating{display:flex;align-items:center;gap:10px}
.rating > span{font:400 9px "JetBrains Mono",ui-monospace,monospace;letter-spacing:.2em;text-transform:uppercase;color:#6f6553}
.media-grid .empty{grid-column:1/-1;text-align:left;padding:8px 0}
.notes .compose .btn{justify-self:start;width:auto}
.empty.left{text-align:left;padding:4px 0}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}
  html.gm-on .gm-pre{opacity:1;transform:none}
  ::view-transition-old(root),::view-transition-new(root){animation:none}
}
