/* Fluid shell and content: the viewport is never pinned to a design resolution. */
:root{--page-gutter:clamp(.75rem,3vw,6rem);--layout-gap:clamp(.875rem,2vw,2rem)}
html{min-inline-size:0;scroll-padding-block:1rem}
body{min-inline-size:0;inline-size:100%;min-block-size:100vh;min-block-size:100svh;display:flex;flex-direction:column;overflow-wrap:anywhere}
#main{flex:1;inline-size:100%;min-inline-size:0}
img{max-inline-size:100%;block-size:auto}
button,input,select{touch-action:manipulation}
button,a,input,select{scroll-margin-block:5rem}
.button{min-inline-size:0;max-inline-size:100%;min-block-size:44px;white-space:normal;line-height:1.4}
.icon-button,.global-motion,#logout,.orbit-pagination .icon-button{min-inline-size:44px;min-block-size:44px;inline-size:44px;block-size:44px;flex:0 0 44px}
body .site-header,body.auth-screen .site-header{inline-size:auto;block-size:auto;min-block-size:76px;margin-block:0;margin-inline:calc(var(--page-gutter) + env(safe-area-inset-left,0px)) calc(var(--page-gutter) + env(safe-area-inset-right,0px));padding-block:clamp(.75rem,1vw,1.125rem);display:grid;grid-template-columns:auto minmax(0,1fr) auto;column-gap:clamp(.75rem,2.25vw,3rem);row-gap:.5rem;flex:none}
.site-header>*{min-inline-size:0}
.site-header .brand{grid-column:1;gap:clamp(.5rem,.8vw,.875rem)}
.brand>span:last-child{font-size:clamp(1.1rem,1rem + .4vw,1.8rem);letter-spacing:clamp(2px,.25vw,4px)}
.brand small{line-height:1.4}
.site-header .main-nav{grid-column:2;grid-row:1;inline-size:100%;block-size:auto;min-block-size:44px;display:flex;flex-wrap:wrap;justify-content:center;align-items:stretch;gap:clamp(.5rem,2vw,2rem);margin:0}
.site-header .nav-link{block-size:auto;min-block-size:44px;padding:.65rem .25rem;font-size:clamp(.75rem,.7rem + .2vw,1rem);line-height:1.4}
.site-header .header-actions{grid-column:3;grid-row:1;min-inline-size:0;display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:clamp(.25rem,.65vw,.75rem)}
.header-actions .quality-control{display:flex;min-block-size:44px;max-inline-size:100%}
.quality-control select{min-block-size:44px;inline-size:5rem;max-inline-size:100%;font-size:.75rem}
.private-label{white-space:normal;font-size:clamp(.5rem,.45rem + .1vw,.7rem);max-inline-size:13em}
.user-button{min-block-size:44px;min-inline-size:44px;justify-content:center}
.user-label{overflow-wrap:anywhere}
body .site-footer,body.auth-screen .site-footer{block-size:auto;min-block-size:52px;margin-inline:var(--page-gutter);padding-block:1rem calc(1rem + env(safe-area-inset-bottom,0px));display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem 1.25rem;font-size:clamp(.5rem,.45rem + .12vw,.75rem);line-height:1.5;flex:none}
.site-footer>*{min-inline-size:0}
.site-footer>.text-button{min-block-size:44px;display:inline-flex;align-items:center}
.footer-center{margin-inline:auto;white-space:normal;text-align:center}
.footer-demo{font-size:inherit}
body .page-view{inline-size:100%;max-inline-size:none;min-inline-size:0;min-block-size:0;margin-inline:0;padding:clamp(1.25rem,3vw,3rem) var(--page-gutter)}
body .page-heading,body .scene-heading{min-inline-size:0;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.25rem}
.page-heading>*,.scene-heading>*{min-inline-size:0}
.page-heading h1{font-size:clamp(1.75rem,1.25rem + 1.5vw,3.5rem);line-height:1.16;text-wrap:balance;max-inline-size:26ch}
.scene-heading h1{font-size:clamp(1.6rem,1.3rem + .9vw,3rem);line-height:1.2;text-wrap:balance}
.page-heading p,.scene-heading-right{font-size:clamp(.75rem,.7rem + .15vw,1rem);line-height:1.6;max-inline-size:65ch}
.page-heading>.status-badge,.page-heading>.demo-pill{max-inline-size:100%;white-space:normal}
.profile-grid{inline-size:100%;max-inline-size:none;margin-block:clamp(1.5rem,3vw,3rem);margin-inline:0;display:grid;grid-template-columns:minmax(0,1fr);gap:var(--layout-gap)}
.profile-grid>*,.profile-right,.orders-panel,.access-panel{min-inline-size:0}
.profile-right{gap:var(--layout-gap)}
.panel{padding:clamp(1rem,2vw,2rem)}
.panel-topline{flex-wrap:wrap;align-items:center;gap:.75rem}
.panel h2,.service-card h2{font-size:clamp(1.5rem,1.25rem + .7vw,2.5rem);line-height:1.2;overflow-wrap:anywhere}
.profile-details>div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem;line-height:1.6;font-size:clamp(.7rem,.65rem + .15vw,.95rem)}
.profile-details dt,.profile-details dd{min-inline-size:0;overflow-wrap:anywhere}
.profile-details dd{text-align:end}
.profile-identity>.button{white-space:normal}
.access-panel p,.empty-orders{font-size:clamp(.75rem,.7rem + .15vw,1rem);line-height:1.7}
.subscription-duration{flex-wrap:wrap}
.remaining-number{font-size:clamp(3.5rem,5vw,6rem)}
.small-note{font-size:clamp(.65rem,.6rem + .12vw,.85rem);line-height:1.6}
.order-row{flex-wrap:wrap;line-height:1.6}
.order-row>div{min-inline-size:0;flex:1 1 12rem}
.order-row>strong{min-inline-size:0}
.services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr));gap:var(--layout-gap);margin-block-start:clamp(1.5rem,3vw,3rem)}
.services-grid .service-card{min-inline-size:0;min-block-size:clamp(21rem,30vw,29rem);margin:0;padding:clamp(1.25rem,2.5vw,2.5rem)}
.service-card .service-art{position:relative;inset:auto;inline-size:auto;block-size:clamp(4.5rem,8vw,8rem);margin:.25rem 0 1.25rem;opacity:1}
.service-card h2{max-inline-size:none;margin:.75rem 0}
.service-card p{min-block-size:0;max-inline-size:52ch;font-size:clamp(.75rem,.7rem + .15vw,1rem);line-height:1.8}
.service-price{font-size:clamp(1.6rem,1.3rem + .6vw,2.75rem);line-height:1.3;overflow-wrap:anywhere}
.service-price small{font-size:clamp(.7rem,.65rem + .12vw,.9rem);white-space:normal}
.service-card>.button{font-size:clamp(.75rem,.7rem + .15vw,1rem);min-block-size:48px}
.service-note{align-items:flex-start;justify-content:center;gap:1rem;font-size:clamp(.7rem,.65rem + .15vw,.95rem);line-height:1.8}
.service-note p{min-inline-size:0}
.account-dock{inline-size:100%;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,10rem),1fr));align-items:center;gap:clamp(.875rem,2vw,2rem);margin:1rem 0 0;padding:clamp(1rem,2vw,2rem) 0;min-block-size:0}
.account-dock>*{min-inline-size:0;max-inline-size:100%;margin:0}
.account-dock .dock-member{display:flex;flex-wrap:wrap;min-inline-size:0;gap:.65rem;flex:initial}
.dock-member>div{min-inline-size:0}
.account-dock .dock-access{min-inline-size:0;display:grid;grid-template-columns:minmax(0,1fr);gap:.25rem;flex:initial;border:0;padding:0}
.dock-access .tiny-label{grid-column:auto}
.dock-access>strong{font-size:clamp(.95rem,.85rem + .3vw,1.4rem);overflow-wrap:anywhere}
.dock-access .days-badge{display:block;font-size:clamp(.65rem,.6rem + .12vw,.85rem);line-height:1.5}
.account-dock>.button{min-block-size:44px;padding:.75rem 1rem;flex:initial;font-size:clamp(.75rem,.7rem + .12vw,.95rem)}
.account-dock .dock-services{min-inline-size:0;display:flex;flex:initial;gap:.75rem;min-block-size:44px;padding:0;border:0}
.dock-services>span+span{min-inline-size:0;font-size:clamp(.75rem,.7rem + .12vw,.95rem)}
.dock-services small{font-size:clamp(.65rem,.6rem + .12vw,.85rem);line-height:1.5}
.platform-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));inline-size:min(100%,50rem);max-inline-size:100%;gap:clamp(2px,.6vw,8px)}
.platform-tab{min-inline-size:0;min-block-size:44px;block-size:auto;inline-size:100%;padding:.5rem .375rem;font-size:clamp(.65rem,.6rem + .15vw,.9rem);white-space:normal;overflow-wrap:anywhere}
.orbit-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;margin-inline:0;min-block-size:56px;padding-block:.5rem}
.orbit-bottom .drag-hint,.orbit-bottom .render-mode{position:static;inset:auto}
.orbit-pagination{gap:.5rem}
.orbit-pagination .icon-button{font-size:1rem}
dialog{inline-size:min(32rem,calc(100vw - 1.5rem));max-inline-size:calc(100vw - 1.5rem);max-block-size:calc(100vh - 2rem);max-block-size:calc(100dvh - 2rem - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));margin:auto;overflow:auto;overscroll-behavior:contain}
.dialog-content{padding:clamp(1.25rem,3vw,2.25rem)}
.dialog-content h2{font-size:clamp(1.5rem,1.2rem + .8vw,2.25rem);line-height:1.25;overflow-wrap:anywhere}
.dialog-content p{font-size:clamp(.75rem,.7rem + .15vw,.95rem);line-height:1.7}
.dialog-content .button{min-block-size:48px}
.dialog-close{inset-block-start:.375rem;inset-inline-end:.375rem}
.dialog-summary{display:flex;flex-wrap:wrap;gap:.75rem;font-size:clamp(.75rem,.7rem + .15vw,1rem)}
.dialog-summary>*{min-inline-size:0;overflow-wrap:anywhere}
.renew-options{grid-template-columns:repeat(auto-fit,minmax(min(100%,6rem),1fr));gap:.5rem}
.renew-option>span{min-block-size:70px;display:flex;flex-direction:column;justify-content:center;line-height:1.5;white-space:normal}
.demo-alert{overflow-wrap:anywhere}
#toast{max-inline-size:calc(100vw - 1.5rem);inline-size:max-content;bottom:max(1rem,env(safe-area-inset-bottom,0px));font-size:clamp(.75rem,.7rem + .12vw,.95rem);line-height:1.5}
@media(min-width:64rem){.profile-grid{grid-template-columns:minmax(16rem,.72fr) minmax(0,1.28fr)}}
@media(min-width:72rem){.account-dock{grid-template-columns:minmax(0,1.1fr) minmax(0,1.2fr) auto minmax(0,1fr)}}
@media(max-width:72rem){
  body .site-header,body.auth-screen .site-header{grid-template-columns:auto minmax(0,1fr)}
  .site-header .header-actions{grid-column:2;grid-row:1}
  .site-header .main-nav{grid-column:1/-1;grid-row:2;justify-content:center;gap:clamp(.5rem,3vw,2rem)}
  .user-label{display:none}
}
@media(max-width:48rem){.platform-tab>.icon{display:none}.footer-center{display:none}.scene-heading-right{display:none}.page-heading h1 em{display:inline}.scene-heading{padding-inline:0}.service-note{justify-content:flex-start}}
@media(max-width:32rem){.header-actions .quality-control,.private-label{display:none}.brand-symbol{inline-size:28px;block-size:32px}.brand small{font-size:5px}.site-footer>.text-button{margin-inline-start:0}.site-footer{justify-content:flex-start}.account-dock .dock-member>.status-badge{display:none}.page-heading>.demo-pill{display:none}}
@media(max-width:22rem){.header-actions .user-button{display:none}.brand>span:last-child{font-size:1rem;letter-spacing:2px}.site-header .header-actions{gap:0}.site-header .main-nav{gap:.25rem}.nav-link{overflow-wrap:anywhere}}
body .site-header:has(.main-nav:not([hidden])){height:auto;block-size:auto;min-block-size:76px;padding-block:clamp(.75rem,1vw,1.125rem)}
button.text-button,a.text-button,.site-header .brand{min-block-size:44px}
body .orbit-panel .orbit-stage{touch-action:pan-y pinch-zoom}
