/*
 * Shell-Styles im Light DOM (CSS-first, keine Stile in JavaScript).
 *  · NotionKit liefert Rahmen und Komponenten (nk-*). <nk-*>-Hosts nie direkt stylen – sie sind display: contents.
 *  · Farben nur über --nk-*-Tokens. Marke: /shared/brand.css.
 *  · Views rendern im Shadow DOM; ihre Klassen stehen in css/layout.css (über js/sheets.js adoptiert).
 */

.sg-view { display: contents; }
.sg-view > * { display: contents; }

/* Ohne Sitzung zeigt die Shell nur die Anmeldung. */
body.sg-auth nk-sidebar,
body.sg-auth nk-topbar,
body.sg-auth nk-tab-bar { display: none; }

.sg-view > .sg-message {
  display: flex; flex-direction: column; align-items: flex-start; gap: 12px;
  padding: 24px max(28px, env(safe-area-inset-right, 0px)) 24px max(28px, env(safe-area-inset-left, 0px));
}

.sg-ws-logo { display: block; width: 20px; height: 20px; border-radius: 5px; flex: none; }

@media (prefers-reduced-motion: reduce) {
  ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
}