/* PWA behavior layered over the approved UI. Default faces, typography and layout
   remain in app.css/full.css. Larger type is an explicit display preference. */
html {background:var(--yon-canvas-workbench);overscroll-behavior-y:none}
body {overscroll-behavior-y:none}
#app {height:var(--viewport-height,100%)}
.app-shell {height:100%;padding-top:env(safe-area-inset-top);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
.login-page {height:100%;padding-top:max(32px,env(safe-area-inset-top));padding-left:max(32px,env(safe-area-inset-left));padding-right:max(32px,env(safe-area-inset-right))}
.app-shell {padding-bottom:env(safe-area-inset-bottom)}
.composer-dock {padding-bottom:22px}
.workspace {overflow-y:auto}
.feed-scroll {min-height:80px;overflow-x:hidden;overscroll-behavior-y:contain}
.side-list,.switch-list,.member-list,.draft-files,.composer textarea,.image-stage,.preview-text {overscroll-behavior:auto}
/* No fullscreen/UA inference: only standalone display (or iOS standalone flag).
   Browser mode retains page pinch; ancestor constraints are not bypassed by children. */
html[data-installed=true] #app,html[data-installed=true] .sheet {touch-action:pan-x pan-y}
button,.yon-button,.topbar-right .yon-button,.space-control,.space-row,.side-mine,
.topbar-secondary button,.draft-attachment .yon-button,.draft-thumb {min-width:48px;min-height:48px}
.draft-thumb {width:48px;height:48px}
.topbar-secondary button::after {display:none}
.yon-button:active:not(:disabled) .yon-button__face {opacity:.65}
button:not(.yon-button):active:not(:disabled),a:active {background-color:var(--yon-surface-secondary)}
input,textarea,select {font-size:16px}
@media(max-width:1000px) {.search-wrap input {font-size:16px}}
.sheet,.sheet[data-kind=preview] {
 top:calc(var(--viewport-offset,0px) + env(safe-area-inset-top) + 20px);
 bottom:calc(var(--viewport-bottom,0px) + env(safe-area-inset-bottom) + 20px);
 max-height:calc(var(--viewport-height,100dvh) - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 40px);
 height:fit-content;overscroll-behavior-x:auto;overscroll-behavior-y:contain;
}
.login-page {overflow:auto;align-items:safe center;justify-content:safe center}
.login-tools {top:calc(20px + env(safe-area-inset-top));right:calc(24px + env(safe-area-inset-right));flex-wrap:wrap}
.login-bottom {bottom:calc(24px + env(safe-area-inset-bottom))}
.pwa-banner {flex:none;max-height:26%;overflow:auto;padding:0 12px;font-size:13px}
.pwa-banner:empty {display:none}
.pwa-banner p {max-width:760px;margin:0 auto;padding:8px 0}
.login-page>.pwa-banner {position:absolute;bottom:60px;left:16px;right:16px}
.text-options {display:flex;flex-wrap:wrap;gap:8px}
.draft-recovery {flex-direction:column;align-items:flex-start;border-radius:12px}
.draft-recovery small {color:var(--yon-text-secondary)}
@media(min-width:1400px) {.composer-dock {padding-bottom:26px}}
@media(max-width:1000px) {.composer-dock {padding-bottom:16px}}
@media(max-width:600px) {
 .composer-dock {padding-bottom:10px}
 .login-page {padding-top:max(24px,env(safe-area-inset-top));padding-left:max(24px,env(safe-area-inset-left));padding-right:max(24px,env(safe-area-inset-right))}
 .sheet,.sheet[data-kind=preview] {top:auto;bottom:calc(var(--viewport-bottom,0px) + max(10px,env(safe-area-inset-bottom)));left:max(10px,env(safe-area-inset-left));right:max(10px,env(safe-area-inset-right));width:calc(100% - max(10px,env(safe-area-inset-left)) - max(10px,env(safe-area-inset-right)));max-height:calc(var(--viewport-height,100dvh) - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 24px)}
 .login-tools {top:calc(16px + env(safe-area-inset-top));right:calc(16px + env(safe-area-inset-right))}
 .login-bottom {bottom:calc(20px + env(safe-area-inset-bottom))}
 .notice {top:calc(var(--viewport-offset,0px) + env(safe-area-inset-top) + 12px)}
}
@media(max-height:560px) {
 .composer-dock {padding-top:6px;padding-bottom:6px}
 .login-page {padding-top:100px}
}
/* User-selected 125/150/200 percent type, including every control. No default-size
   override to the approved typography. Wrapping avoids losing labels at 200%. */
html:not([data-text-size="1"]) body {font-size:calc(16px * var(--text-scale))}
html:not([data-text-size="1"]) :is(.yon-button,.side-mine,.space-row,.search-wrap input,.form-field,.invite-name,.login-state,.review-field) {font-size:calc(14px * var(--text-scale));line-height:1.5}
html:not([data-text-size="1"]) .menu-row {font-size:calc(15px * var(--text-scale));line-height:1.6;white-space:normal}
html:not([data-text-size="1"]) :is(.card-meta,.side-label,.side-footer,.space-row .count,.prototype-link,.card-status,.composer-bottom,.composer-status,.login-sub,.login-bottom,.sheet-note,.receipt,.preview-source,.recent-source) {font-size:calc(12px * var(--text-scale));line-height:1.6}
html:not([data-text-size="1"]) :is(.topbar-secondary,.topbar-secondary button,.network-strip,.network-strip .yon-button,.card-status .yon-button,.image-tools .yon-button,.card-actions .yon-button,.composer .yon-button,.content-card>.yon-button--quiet,.file-sub,.form-error,.notice,.pwa-banner) {font-size:calc(13px * var(--text-scale));line-height:1.5}
html:not([data-text-size="1"]) :is(.card-link .url,.preview-text) {font-size:calc(14px * var(--text-scale));line-height:1.6}
html:not([data-text-size="1"]) :is(.sheet-header h2,.sheet[data-kind=preview] .sheet-header h2,.card-link strong) {font-size:calc(20px * var(--text-scale));line-height:1.4}
html:not([data-text-size="1"]) :is(.feed-empty p,.file-name) {font-size:calc(19px * var(--text-scale));line-height:1.5}
html:not([data-text-size="1"]) :is(.feed-empty small,.empty-search,.draft-attachment) {font-size:calc(13px * var(--text-scale));line-height:1.6}
html:not([data-text-size="1"]) :is(.time-label,.author,.kind) {font-size:calc(11px * var(--text-scale))}
html:not([data-text-size="1"]) :is(.card-text,.fallback-text,.composer textarea,.sheet .form-field input,.sheet .form-field textarea,.sheet .form-field select) {font-size:calc(16px * var(--text-scale));line-height:1.6}
html:not([data-text-size="1"]) .sheet .code-input {font-size:calc(36px * var(--text-scale))!important;letter-spacing:0;height:auto;min-height:76px}
html:not([data-text-size="1"]) .yon-button__face {white-space:normal;overflow-wrap:anywhere}
html:not([data-text-size="1"]) :is(.composer-bar,.composer-tools,.card-meta,.topbar-secondary) {flex-wrap:wrap}
html:not([data-text-size="1"]) :is(.composer-status,.composer-target,.sheet-note) {max-width:100%;overflow-wrap:anywhere}
html[data-text-size="2"] .space-control .title {white-space:normal;overflow-wrap:anywhere}
html[data-text-size="2"] .topbar .mobile-brand {display:none}
html[data-text-size="2"] .composer-target {white-space:normal}
html[data-text-size="2"] .topbar {min-height:0}
@media(max-width:1000px) {
 html:not([data-text-size="1"]) :is(.space-control .title,.recent-heading) {font-size:calc(16px * var(--text-scale));line-height:1.4}
 html:not([data-text-size="1"]) .topbar-secondary button {font-size:calc(11px * var(--text-scale))}
}
@media(prefers-reduced-motion:reduce) {*,*::before,*::after {transition:none!important;animation:none!important;scroll-behavior:auto!important}}
