/* Independent SaaS chrome: not part of the editing document. */
.service-topbar{position:fixed;inset:0 0 auto;height:var(--service-bar-height);z-index:130;background:var(--app-surface-subtle);border-bottom:1px solid var(--line)}
html.service-menu-collapsed{--service-bar-height:0px}
.service-menu-collapsed .service-topbar{transform:translateY(-100%);visibility:hidden}
.service-bar-toggle{position:fixed;top:var(--service-bar-height);left:16px;z-index:131;width:44px;height:17px;padding:0;border:1px solid var(--line);border-top:0;border-radius:0 0 var(--radius-single) var(--radius-single);background:var(--app-surface-subtle);color:var(--app-muted);font-size:0;line-height:1;touch-action:manipulation}
.service-bar-toggle::after{content:'';position:absolute;left:50%;top:10px;width:6px;height:6px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:translate(-50%,-50%) rotate(225deg)}
.service-menu-collapsed .service-bar-toggle::after{top:7px;transform:translate(-50%,-50%) rotate(45deg)}
.service-bar-toggle:hover{background:var(--app-surface-subtle);color:var(--app-ink)}.service-bar-toggle:focus-visible{outline:2px solid var(--control-focus);outline-offset:2px}
.service-menu-slot{height:100%;width:100%;display:flex;align-items:center;padding:0 20px;gap:12px}
.service-text-group{display:flex;align-items:center;gap:22px;flex-shrink:0;font-size:var(--type-navigation);color:var(--muted);white-space:nowrap}
.service-account-group{margin-left:auto}
.service-utility-unavailable{color:var(--control-muted);cursor:default}
.service-appearance-controls{display:flex;align-items:center;gap:2px;padding-right:12px;border-right:1px solid var(--line)}
.service-appearance-controls button{min-width:29px;height:var(--service-control-height);padding:2px 5px;border:1px solid transparent;border-radius:var(--radius-single);background:transparent;color:var(--ink);font:inherit;line-height:1.2;white-space:nowrap}
.service-appearance-controls [data-app-appearance="theme"]{min-width:46px}
.service-appearance-controls button:hover:not(:disabled){background:var(--control-hover);border-color:var(--control-border)}
.service-appearance-controls button:active:not(:disabled){background:var(--control-selected)}
.service-appearance-controls button:disabled{opacity:1;color:var(--control-muted);background:var(--control-hover);cursor:not-allowed}
.service-appearance-controls output{min-width:44px;text-align:center;font-variant-numeric:tabular-nums;color:var(--muted)}
@media(max-width:750px){.service-menu-slot>.service-text-group:first-child{display:none}.service-account-group{gap:8px;margin-inline:auto}.service-appearance-controls{padding-right:8px}}
@media(max-width:600px){.service-menu-slot{padding-inline:var(--space-3);overflow-x:auto;scrollbar-width:none;gap:24px}.service-menu-slot::-webkit-scrollbar{display:none}.service-text-group{gap:var(--space-4);font-size:var(--type-navigation)}}
.production-app-surface{padding-top:var(--service-bar-height)}
.global-nav{top:var(--service-bar-height)}
.global-workspace .editor-app{height:calc(100dvh - var(--service-bar-height))}
.nav-bottom{display:flex;flex-direction:column;gap:var(--space-3);padding:24px 0 0;margin-top:auto;flex-shrink:0}
.nav-bottom>p{margin:0;padding:0 10px}
.service-ad-slot{display:grid;place-items:center;width:100%;aspect-ratio:4/5;flex-shrink:0;border-radius:16px;background:var(--app-surface-subtle);box-shadow:inset 0 0 0 1px var(--line);overflow:hidden}
.service-ad-slot img{display:block;width:100%;height:100%;object-fit:contain}
@media(max-width:1000px){
 .service-bar-toggle{left:96px;height:44px;background:transparent;border:0;padding:0}.service-bar-toggle::before{content:'';position:absolute;inset:0 0 auto;height:17px;box-sizing:border-box;border:1px solid var(--line);border-top:0;border-radius:0 0 var(--radius-single) var(--radius-single);background:var(--app-surface-subtle);z-index:-1}
 .global-workspace .editor-app{height:calc(100dvh - var(--service-bar-height) - 48px)}
 .global-workspace::before{top:var(--service-bar-height)}
 .mobile-menu-button{top:calc(var(--service-bar-height) + 7px)}
 html[data-mobile-panel=menu] .global-nav{top:var(--service-bar-height);height:calc(100dvh - var(--service-bar-height))}
 .global-nav .service-ad-slot{max-width:180px;align-self:center}
}
@media print{.service-topbar,.service-ad-slot,.service-bar-toggle{display:none!important}.production-app-surface{padding-top:0}}

.service-ai-notification-options{display:flex;flex-direction:column;gap:var(--space-2)}
.service-feedback-options hr{width:100%;margin:var(--space-1) 0;border:0;border-top:1px solid var(--line)}
.service-feedback{position:relative;color:var(--app-muted);font-size:var(--type-navigation)}
.service-feedback summary{cursor:pointer;white-space:nowrap}
.service-feedback-options{white-space:normal;overflow-wrap:anywhere;position:absolute;right:0;top:calc(100% + var(--space-2));z-index:100;display:flex;flex-direction:column;gap:var(--space-2);width:230px;max-width:calc(100vw - 24px);max-height:calc(100dvh - var(--service-bar-height) - 24px);overflow:auto;padding:var(--space-3);background:var(--app-surface);border:1px solid var(--line);border-radius:var(--radius-control);color:var(--app-ink);box-shadow:var(--app-shadow-overlay)}
.service-feedback-options label{min-width:0;display:flex;align-items:center;gap:var(--space-2);padding:var(--space-1) 0}
.service-feedback-options select{min-width:0;flex:1}
.service-feedback-options small{color:var(--app-muted)}
.service-feedback-options [data-feedback-status]{white-space:normal;overflow-wrap:anywhere;line-height:1.5}
/* Escape the narrow topbar's horizontal scroll clip without changing its policy. */
@media(max-width:600px){.service-feedback-options{position:fixed;right:var(--space-3);top:calc(var(--service-bar-height) + var(--space-2))}}
.preferences-page .panel{min-width:0}
.preferences-appearance{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4);margin-bottom:var(--space-5)}
.preferences-page .service-ai-notification-options small,.preferences-feedback small{color:var(--app-muted);font-size:var(--type-helper);line-height:1.5;white-space:normal}
.preferences-feedback{display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-3)}
.preferences-feedback>label{display:flex;align-items:center;gap:var(--space-2);max-width:100%;padding-block:var(--space-1)}
.preferences-page select{min-width:0;max-width:100%}
@media(max-width:600px){.preferences-appearance{grid-template-columns:minmax(0,1fr)}}
