/* Shared desktop chrome and a single accessible appearance picker. */
:root { --accent: #000080; --surface: #c0c0c0; }
button, a { -webkit-tap-highlight-color: transparent; }
.desktop-panel, .mobile-status, .mobile-settings-app, .workspace-switcher { display: none; }
.icon-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.tablet-settings-sidebar { display: none; }
.panel-nav { display: flex; align-items: center; height: 100%; gap: 2px; }
.panel-button { border: 0; background: transparent; padding: 5px 11px; min-height: 32px; font-size: 14px; }
.panel-button:hover, .panel-button[aria-expanded="true"] { background: var(--accent); color: #fff; }
.panel-clock { margin-left: auto; padding: 0 14px; font-size: 13px; white-space: nowrap; }
.ubuntu-nav, .mac-nav { display: none; }
.system-menu {
  position: fixed; z-index: 20; left: var(--menu-left, 5px); bottom: 44px;
  display: flex; width: min(326px, calc(100vw - 12px)); max-height: calc(100svh - 54px);
  padding: 3px; overflow: auto; color: #000; background: #c0c0c0;
  border: 1px solid; border-color: #fff #000 #000 #fff;
  box-shadow: inset 1px 1px #dfdfdf, inset -1px -1px #808080, 2px 2px #0006;
  font-size: 14px;
}
.menu-brand { width: 34px; flex-shrink: 0; background: linear-gradient(#000080, #1084d0); position: relative; }
.menu-brand-name { position: absolute; left: 5px; bottom: 9px; writing-mode: vertical-rl; transform: rotate(180deg); color: #fff; font-size: 21px; font-weight: bold; white-space: nowrap; }
.menu-body { flex: 1; min-width: 0; }
.menu-titlebar { display: flex; align-items: center; justify-content: space-between; padding: 9px 12px 5px; }
.menu-heading { margin: 0; font-size: 14px; font-weight: bold; }
.menu-done { display: none; }
.menu-links { padding: 4px; border-bottom: 1px solid #808080; box-shadow: 0 1px #fff; }
.menu-link { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 37px; padding: 5px 8px; border: 0; background: transparent; color: inherit; text-align: left; text-decoration: none; }
.menu-link svg { width: 23px; height: 23px; flex-shrink: 0; }
.menu-link:hover, .menu-link:focus-visible { background: var(--accent); color: #fff; }
.theme-list { padding: 4px; }
.theme-choice { position: relative; display: flex; align-items: center; gap: 11px; width: 100%; min-height: 43px; padding: 5px 28px 5px 8px; border: 0; border-radius: 0; background: transparent; color: inherit; text-align: left; }
.theme-choice:hover, .theme-choice:focus-visible { background: var(--accent); color: #fff; }
.theme-choice[aria-pressed="true"]::after { content: '✓'; position: absolute; right: 10px; font-size: 17px; font-weight: bold; }
.theme-copy { display: flex; flex: 1; min-width: 0; flex-direction: column; gap: 1px; }
.theme-copy small { font-size: 12px; opacity: .8; }
.theme-preview { position: relative; width: 32px; height: 26px; flex-shrink: 0; border: 1px solid #000; background: #008080; box-shadow: inset 1px 1px #ffffff80; }
.theme-preview::before { content: ''; position: absolute; inset: 6px 5px 4px; border: 1px solid #ddd; background: linear-gradient(#000080 0 4px, #fff 4px); }
.theme-preview[data-preview="auto"] { background: conic-gradient(#000080 0 25%, #a77849 0 50%, #73a834 0 75%, #68798f 0); }
.theme-preview[data-preview="auto"]::before { background: #ddd; }
.theme-preview[data-preview="mac"] { background: #989898; }
.theme-preview[data-preview="mac"]::before { border-color: #000; background: linear-gradient(#aaa 0 4px, #fff 4px); }
.theme-preview[data-preview="ubuntu"] { background: #75482e; }
.theme-preview[data-preview="ubuntu"]::before { background: linear-gradient(#a77849 0 4px, #fff 4px); }
.theme-preview[data-preview="android"] { background: #172616; border-radius: 3px; }
.theme-preview[data-preview="android"]::before { background: linear-gradient(#a7cf4d 0 4px, #101010 4px); }
.theme-preview[data-preview="ios"] { background: #677b96; border-radius: 5px; }
.theme-preview[data-preview="ios"]::before { border-radius: 2px; background: linear-gradient(#b5c3d3 0 4px, #eef0f5 4px); }
.settings-symbol { width: 26px; height: 26px; }
.profile-icon { display: block; }
.mobile-home { display: none; }
button:focus-visible, a:focus-visible { outline-offset: -3px; }

/* Each desktop app is a persistent window; mobile uses its full-screen app view. */
.app-window { position: fixed; margin: 0; min-width: 0; width: min(570px, calc(100vw - 16px)); max-height: calc(100dvh - 98px); display: flex; flex-direction: column; }
.app-window > .title-bar, .app-window > .path-bar { flex-shrink: 0; }
.app-window .window-content { min-height: 0; overflow: hidden; padding: 10px; }
.app-window .cv-notes, .app-window .music-player { display: flex; flex-direction: column; min-height: 0; }
.app-window .cv-toolbar, .app-window .music-toolbar { flex-shrink: 0; }
.app-window .cv-paper, .app-window .music-scroll { min-height: 0; overflow: auto; }
.app-window.maximized { max-height: none; }
.app-window .music-scroll { max-height: none; }
.app-window .music-back, .app-window .cv-back { display: none; }
.taskbar, .desktop-panel { z-index: 10 !important; }
:is([data-theme="android"], [data-theme="ios"]) .app-window,
:is([data-theme="android"], [data-theme="ios"]) .app-task { display: none; }
[data-theme="mac"] [data-window-action="close"] { order: 0; }
[data-theme="mac"] [data-window-action="maximize"] { order: 3; }
[data-theme="mac"] [data-window-action="minimize"] { order: 4; }
[data-theme="mac"] [data-window-action="close"] svg { visibility: hidden; }
[data-theme="mac"] [data-window-action="close"]::after { content: ''; position: absolute; inset: 4px; border: 1px solid #555; background: #bbb; }
[data-theme="mac"] .title-bar > .window-title { min-width: 0; }

/* Maximized geometry takes precedence over each skin’s normal window width. */
[data-theme] .window.maximized { width: auto; max-width: none; }

.window-maximize-icon .restore-symbol,
.window-control[aria-pressed="true"] .maximize-symbol { display: none; }
.window-control[aria-pressed="true"] .restore-symbol { display: block; }