/* Platform layer: touch feedback, readable fields and iOS safe areas.
   Scroll-driven canvases retain their established viewport sizing. */
:root{
 --raw-native-target:44px;--raw-native-input:16px;--raw-native-gap:16px;
 --raw-native-pressed:.72;--raw-native-focus:#ff397a;
 --size-touch-control:var(--raw-native-target);--text-touch-input:var(--raw-native-input);
 --spacing-device-edge:var(--raw-native-gap);--opacity-control-pressed:var(--raw-native-pressed);
 --color-control-focus:var(--raw-native-focus);
 --native-control-height:var(--size-touch-control);--native-field-font:var(--text-touch-input);
 --native-edge:var(--spacing-device-edge);--native-press:var(--opacity-control-pressed);
 --native-focus:var(--color-control-focus);
}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
:where(button,[role="button"],summary,.button,.nav-cta,.hi-btn,.mobile-menu-toggle){
 touch-action:manipulation;-webkit-tap-highlight-color:transparent;
 -webkit-user-select:none;user-select:none;
}
a{touch-action:manipulation}
:where(button,[role="button"],summary,.button,.nav-cta,.hi-btn):active{opacity:var(--native-press)}
:where(button,a,summary,input,textarea,select):focus-visible{outline:2px solid var(--native-focus);outline-offset:4px}
:where(input,textarea,select){scroll-margin-block:20svh}
:where(dialog){overscroll-behavior:contain;overflow-y:auto;max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))}
#mobile-menu,.mobile-navigation[open]{height:100dvh;max-height:100dvh;box-sizing:border-box;padding-top:calc(80px + env(safe-area-inset-top,0px));padding-bottom:calc(32px + env(safe-area-inset-bottom,0px));padding-left:max(var(--native-edge),env(safe-area-inset-left,0px));padding-right:max(var(--native-edge),env(safe-area-inset-right,0px))}
#mobile-menu nav,.mobile-navigation nav{padding-bottom:var(--native-edge)}
@media (any-pointer:coarse),(max-width:699px){
 :where(input:not([type=checkbox]):not([type=radio]),textarea,select),.form-grid input,.form-grid select,.form-grid textarea{font-size:var(--native-field-font);min-height:var(--native-control-height)}
 :where(button,summary,.button,.nav-cta,.hi-btn,.back-link){min-height:var(--native-control-height)}
 :where(.close-menu,.close-reel,.menu-close,.menu-toggle){min-width:var(--native-control-height)}
 :where(.story-steps button,.ne-nav button,.universe-steps button,.cascade-rail button){min-height:var(--native-control-height)}
}
@media(max-width:1024px){
 body>.site-header{padding-top:calc(var(--spacing-medium,16px) + env(safe-area-inset-top,0px));padding-left:max(var(--spacing-gutter,16px),env(safe-area-inset-left,0px));padding-right:max(var(--spacing-gutter,16px),env(safe-area-inset-right,0px))}
 body:not(.static-flow) .mobile-menu-toggle,.static-flow .mobile-menu-toggle{top:calc(22px + env(safe-area-inset-top,0px));right:max(6%,env(safe-area-inset-right,0px))}
 .motion-toggle,.motion-retry{margin-bottom:env(safe-area-inset-bottom,0px);margin-right:env(safe-area-inset-right,0px)}
 .ne-nav,.story-steps{margin-bottom:env(safe-area-inset-bottom,0px)}
 footer,.clarix-footer{padding-bottom:calc(32px + env(safe-area-inset-bottom,0px))}
 #reel-dialog{width:calc(100% - 2 * var(--native-edge));padding-bottom:calc(var(--native-edge) + env(safe-area-inset-bottom,0px))}
 #reel-dialog .dialog-heading{position:sticky;top:0;z-index:2;background:inherit}
}