.page-studio .product-plate{background:radial-gradient(78% 74% at 50% 40%,#f6f3ec 0%,#ebe6dc 44%,#cfc8bb 66%,#8d877c 86%,#4b4843 100%);box-shadow:inset 0 1px #ffffff24,inset 0 0 0 1px #ffffff0d,0 28px 60px -32px #000000f2}.page-studio .product-plate:before{content:"";z-index:1;pointer-events:none;border-radius:inherit;mix-blend-mode:screen;background:radial-gradient(55% 40% at 14% 0%, rgba(var(--light-azure), .34), transparent 70%), radial-gradient(60% 26% at 50% 104%, rgba(var(--light-brass), .32), transparent 72%);position:absolute;inset:0}.page-studio .product-plate:after{background:radial-gradient(closest-side,#00000052,#0000)}.page-studio a:hover .product-plate,.page-studio .product-plate[data-hover=zoom]:hover{box-shadow:inset 0 1px 0 #ffffff2e, inset 0 0 0 1px rgba(var(--light-azure), .35), 0 0 40px -12px rgba(var(--light-azure), .45), 0 28px 60px -32px #000000f2}.page-stage{isolation:isolate;background:radial-gradient(80% 60% at 50% 0%, rgba(var(--light-azure), .16), transparent 70%), linear-gradient(180deg, #ffffff08, #fff0 50%), #060709;border-radius:30px;padding:28px 28px 54px;position:relative;overflow:hidden;box-shadow:inset 0 1px #ffffff14,0 50px 120px -50px #000}.page-stage:after{content:"";border-radius:inherit;background:linear-gradient(160deg, rgba(var(--light-azure), .6), #ffffff0d 40%, #ffffff08 70%, rgba(var(--light-brass), .5));-webkit-mask-composite:xor;pointer-events:none;padding:1px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.page-stage-beam{z-index:-1;pointer-events:none;background:conic-gradient(from 180deg at 50% 0%, transparent 160deg, rgba(var(--light-azure), .16) 172deg, #ffffff29 180deg, rgba(var(--light-brass), .14) 188deg, transparent 200deg);filter:blur(22px);width:140%;height:120%;position:absolute;top:-40px;left:50%;transform:translate(-50%);-webkit-mask-image:linear-gradient(#000 20%,#0000 95%);mask-image:linear-gradient(#000 20%,#0000 95%)}.page-stage-floor{pointer-events:none;z-index:-1;background:radial-gradient(closest-side, rgba(var(--light-brass), .5), rgba(var(--light-brass), .12) 55%, transparent), radial-gradient(closest-side, rgba(var(--light-azure), .3), transparent);filter:blur(8px);border-radius:50%;height:46px;position:absolute;bottom:18px;left:10%;right:10%}.page-stage-floor:after{content:"";height:1px;box-shadow:0 0 18px 3px rgba(var(--light-brass), .6);background:linear-gradient(90deg,#0000,#fffc,#0000);position:absolute;top:50%;left:18%;right:18%}@media (max-width:640px){.page-stage{border-radius:24px;padding:16px 16px 40px}}.page-key{z-index:-1;pointer-events:none;background:radial-gradient(560px 460px at 22% 30%, rgba(var(--light-azure), .18), rgba(var(--light-azure), .05) 55%, transparent 75%), radial-gradient(420px 300px at 70% 22%, rgba(var(--light-brass), .07), transparent 70%);width:100vw;height:1000px;position:absolute;top:-160px;left:calc(50% - 50vw)}.page-key[data-side=right]{background:radial-gradient(560px 460px at 78% 30%, rgba(var(--light-azure), .18), rgba(var(--light-azure), .05) 55%, transparent 75%), radial-gradient(420px 300px at 30% 22%, rgba(var(--light-brass), .07), transparent 70%)}.page-glass{-webkit-backdrop-filter:blur(14px)saturate(130%);backdrop-filter:blur(14px)saturate(130%);transition:box-shadow var(--t-mid) var(--ease), transform var(--t-mid) var(--ease);background:linear-gradient(#ffffff0d,#ffffff04 70%),#0a0b0eb3;border-radius:20px;position:relative;box-shadow:inset 0 1px #ffffff12,inset 0 0 0 1px #ffffff0f}a.page-glass:hover,.page-glass[data-hover]:hover{box-shadow:inset 0 1px 0 #ffffff1a, inset 0 0 0 1px rgba(var(--light-azure), .4), 0 18px 50px -24px rgba(var(--light-azure), .55);transform:translateY(-1px)}.page-glass[data-win]{background:radial-gradient(80% 140% at 0% 50%, rgba(var(--light-brass), .14), transparent 70%), linear-gradient(180deg, #ffffff0f, #ffffff04 70%), #0c0b09bf;box-shadow:inset 0 1px 0 #ffffff1a, inset 0 0 0 1px rgba(var(--light-brass), .5), 0 0 50px -18px rgba(var(--light-brass), .55)}.page-bar{background:#ffffff0f;border-radius:999px;height:4px;position:relative;overflow:hidden}.page-bar>span{border-radius:inherit;background:linear-gradient(90deg, rgba(var(--light-azure), .9), rgba(var(--light-violet), .8));box-shadow:0 0 12px rgba(var(--light-azure), .7);position:absolute;inset:0 auto 0 0}.page-bar[data-win]>span{background:linear-gradient(90deg, var(--brass-hi), var(--brass));box-shadow:0 0 14px rgba(var(--light-brass), .85)}.page-hero{isolation:isolate;position:relative;overflow:hidden}.page-hero-beam{z-index:-1;pointer-events:none;background:conic-gradient(from 180deg at 50% 0%, transparent 164deg, rgba(var(--light-azure), .3) 174deg, #fff3 180deg, rgba(var(--light-brass), .24) 186deg, transparent 196deg);filter:blur(26px);width:min(1100px,140vw);height:900px;animation:9s ease-in-out infinite fx-beam-breathe;position:absolute;top:-120px;-webkit-mask-image:linear-gradient(#000 10%,#0000 85%);mask-image:linear-gradient(#000 10%,#0000 85%)}.page-hero-beam[data-side=left]{transform-origin:50% 0;left:-20%;transform:rotate(-14deg)}.page-hero-beam[data-side=right]{transform-origin:50% 0;right:-20%;transform:rotate(14deg)}.page-hero-beam[data-side=center]{left:50%;transform:translate(-50%)}.page-hero:after{content:"";background:linear-gradient(90deg, transparent, rgba(var(--light-azure), .5) 30%, #ffffff8c 50%, rgba(var(--light-brass), .5) 70%, transparent);height:1px;box-shadow:0 0 24px 2px rgba(var(--light-azure), .3);opacity:.7;position:absolute;bottom:0;left:0;right:0}.page-hero[data-horizon=none]:after{display:none}.page-num{width:40px;height:40px;font-family:var(--font-mono);color:var(--brass-hi);background:radial-gradient(circle at 30% 20%, rgba(var(--light-brass), .3), rgba(var(--light-brass), .06) 70%);box-shadow:inset 0 0 0 1px rgba(var(--light-brass), .45), 0 0 24px -6px rgba(var(--light-brass), .6);border-radius:12px;flex:none;justify-content:center;align-items:center;font-size:13px;display:inline-flex}.page-num[data-tone=azure]{color:var(--azure-hi);background:radial-gradient(circle at 30% 20%, rgba(var(--light-azure), .32), rgba(var(--light-azure), .06) 70%);box-shadow:inset 0 0 0 1px rgba(var(--light-azure), .5), 0 0 24px -6px rgba(var(--light-azure), .7)}.page-num[data-tone=violet]{color:var(--violet-hi);background:radial-gradient(circle at 30% 20%, rgba(var(--light-violet), .32), rgba(var(--light-violet), .06) 70%);box-shadow:inset 0 0 0 1px rgba(var(--light-violet), .5), 0 0 24px -6px rgba(var(--light-violet), .7)}.page-chip{min-height:36px;color:var(--text-2);transition:color var(--t-fast), box-shadow var(--t-fast), background var(--t-fast);background:#ffffff09;border-radius:999px;align-items:center;gap:8px;padding:0 14px;font-size:13px;display:inline-flex;box-shadow:inset 0 0 0 1px #ffffff1a}.page-chip:hover,.page-chip[aria-current=true],.page-chip[aria-pressed=true]{color:var(--text);background:rgba(var(--light-brass), .08);box-shadow:inset 0 0 0 1px rgba(var(--light-brass), .55), 0 0 22px -8px rgba(var(--light-brass), .7)}.page-aurora{border-radius:inherit;pointer-events:none;z-index:0;position:absolute;inset:0;overflow:hidden}.page-aurora:before{content:"";background:radial-gradient(40% 40% at 85% 20%, rgba(var(--light-violet), .35), transparent 70%), radial-gradient(30% 30% at 10% 90%, rgba(var(--light-azure), .18), transparent 70%);filter:blur(10px);height:160%;position:absolute;inset:-40% -10% auto}.page-seam{background:linear-gradient(90deg, transparent, rgba(var(--light-azure), .5), rgba(var(--light-brass), .5), transparent);width:min(560px,80%);height:1px;box-shadow:0 0 20px 1px rgba(var(--light-azure), .25);margin-inline:auto}.page-figure{background:radial-gradient(70% 60% at 0% 0%, rgba(var(--light-azure), .07), transparent 70%), linear-gradient(180deg, #ffffff0a, #ffffff03), #08090cc7;border-radius:24px;position:relative;box-shadow:inset 0 1px #ffffff12,inset 0 0 0 1px #ffffff0f,0 30px 80px -40px #000000e6}@media (prefers-reduced-motion:reduce){.page-hero-beam{animation:none}.page-glass,a.page-glass:hover{transition:none;transform:none}}.fx-btn[data-tone=violet].page-aa{background:linear-gradient(#7a55f0,#5a36d6)}
