/* MosSuite Fluent-inspired shared UI. Independent project, not affiliated with Microsoft. */
:root{
  color-scheme:dark;
  --ms-bg:#000;--ms-bar:#212121;--ms-panel:#151515;--ms-panel-2:#252525;
  --ms-line:#383838;--ms-text:#f5f5f5;--ms-muted:#c5c5c5;--ms-accent:#4285f4;
}
html{background:var(--ms-bg);color-scheme:dark}
body{background:var(--ms-bg)!important;color:var(--ms-text)!important;font-family:"Segoe UI",system-ui,-apple-system,sans-serif!important}
header, .topbar, .toolbar, .app-header, .header, nav[aria-label], .menubar{
  background:var(--ms-bar)!important;color:var(--ms-text)!important;border-color:var(--ms-line)!important;
}
main, .main, .workspace, .content, .editor, .canvas-wrap, .sheet-wrap, .slide-stage{
  color:var(--ms-text);
}
aside, .sidebar, .panel, .toolbar-group, .menu, .dropdown, .modal, dialog,
.card, .app-card, .sheet-tabs, .tab-bar{
  background:var(--ms-panel)!important;color:var(--ms-text)!important;border-color:var(--ms-line)!important;
}
button, input, select, textarea{font:inherit}
button, .btn, input[type=button], input[type=submit]{
  border-radius:8px;transition:background-color .15s ease,border-color .15s ease;
}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--ms-accent)!important;outline-offset:2px;
}
button:not(.primary):not([type=submit]), .btn:not(.primary){
  border-color:var(--ms-line);
}
input,select,textarea,[contenteditable=true]{
  background:#171717;color:var(--ms-text);border-color:var(--ms-line);
}
a{ text-underline-offset:3px }
.muted,.subtitle,.description,.help-text,small{color:var(--ms-muted)}
@media(max-width:640px){
  body{font-size:15px}
  header,.topbar,.toolbar,.app-header{padding-left:14px!important;padding-right:14px!important}
  button,.btn,input[type=button],input[type=submit]{min-height:40px}
  .sidebar{left:0;right:0;width:100%;max-width:none}
  .sidebar .nav{width:100%;max-width:none}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* Fluent-style polish shared across MosSuite apps */
:root{--ms-radius:8px;--ms-focus:#60a5fa}
header,.topbar,.toolbar,.app-header,.header,.menubar{
  min-height:52px;
}
.card,.app-card,.appcard,.app,.panel,.modal,dialog{
  border-radius:10px!important;
  box-shadow:none;
}
button,.btn,input[type=button],input[type=submit],select{
  border-radius:6px;
}
button:hover,.btn:hover,input[type=button]:hover,input[type=submit]:hover{
  filter:brightness(1.12);
}
button:disabled{opacity:.55;cursor:not-allowed}
[role=tab],.tab{border-radius:6px}
hr{border-color:var(--ms-line)}
::selection{background:#264f78;color:#fff}
html[data-mos-theme="light"]{
  color-scheme:light;
  --ms-bg:#f5f5f5;--ms-bar:#fff;--ms-panel:#fff;--ms-panel-2:#f0f0f0;
  --ms-line:#d6d6d6;--ms-text:#242424;--ms-muted:#616161;--ms-accent:#0f6cbd;
}
html[data-mos-theme="light"],html[data-mos-theme="light"] body{
  background:var(--ms-bg)!important;color:var(--ms-text)!important;
}
html[data-mos-theme="light"] header,html[data-mos-theme="light"] .topbar,
html[data-mos-theme="light"] .toolbar,html[data-mos-theme="light"] .app-header,
html[data-mos-theme="light"] .header,html[data-mos-theme="light"] .menubar,
html[data-mos-theme="light"] aside,html[data-mos-theme="light"] .sidebar,
html[data-mos-theme="light"] .panel,html[data-mos-theme="light"] .card,
html[data-mos-theme="light"] .app-card,html[data-mos-theme="light"] .appcard,
html[data-mos-theme="light"] .app{
  background:var(--ms-panel)!important;color:var(--ms-text)!important;border-color:var(--ms-line)!important;
}
html[data-mos-theme="light"] input,html[data-mos-theme="light"] select,
html[data-mos-theme="light"] textarea,html[data-mos-theme="light"] [contenteditable=true]{
  background:#fff!important;color:#242424!important;border-color:#bdbdbd!important;
}
@media(max-width:640px){
  /* Keep the existing compact mobile navigation/layout intact. */
  .mobile-nav,.bottom-nav,.nav-bottom{max-width:100%}
}