/* Opaque tiled apps, three focus treatments, and macOS-inspired preferences. */
body[data-focus-style="ipad"] .window, body[data-focus-style="mac"] .window,
body[data-focus-style="transparency"] .window.snapped { opacity:1; background:#fff; }
body[data-focus-style="transparency"] .window:not(.active):not(.snapped) { opacity:.65; }
.window-titlebar { flex-shrink:0; }
.window.active:not(.closing):not(.minimizing) { animation:none; }
.window-focus-indicator { display:none; position:absolute; left:50%; top:5px; transform:translateX(-50%); border:0; border-radius:8px; padding:5px 12px; gap:3px; background:transparent; cursor:pointer; z-index:2; }
.window-focus-indicator span { width:4px; height:4px; border-radius:50%; background:#9b9da4; }
body[data-focus-style="ipad"] .window-focus-indicator { display:flex; }
body[data-focus-style="ipad"] .window.active .window-focus-indicator { background:#e4edff; }
body[data-focus-style="ipad"] .window.active .window-focus-indicator span { background:#2563eb; }
body[data-focus-style="ipad"] .window-title { padding-top:13px; }
body[data-focus-style="ipad"] .window.active { box-shadow:0 0 0 2px #ffffffaa,0 20px 60px #0004; }
body[data-focus-style="mac"] .window:not(.active) .window-titlebar { background:#eeeef0; color:#8a8a90; }
.window-control { transition:opacity .16s ease,visibility .16s; }
body[data-focus-style="mac"] .window:not(.active) .window-control { opacity:0; visibility:hidden; pointer-events:none; }
body[data-focus-style="mac"] .window.active .window-control { opacity:1; visibility:visible; }
body[data-focus-style="mac"] .window.active .window-titlebar { background:#fafafa; color:#202026; }
.window-focus-shield { position:absolute; inset:52px 0 0; width:100%; border:0; background:transparent; cursor:default; z-index:50; border-radius:0; }
.window-focus-shield[hidden] { display:none; }
.window-focus-shield:focus-visible { outline:3px solid #3981f7; outline-offset:-3px; }
.menubar-left > [role="button"] { cursor:pointer; }
:is(button,select,a,[role="button"]):focus-visible { outline:3px solid #3981f7; outline-offset:3px; }
.dock { transition:transform .22s ease,opacity .22s ease; }
body.dock-auto .dock:not(.dock-revealed):not(:focus-within) { transform:translate(-50%,calc(100% + 19px)); opacity:0; pointer-events:none; }
.dock-item { cursor:pointer; }
.settings-btn,.mid-btn { font:inherit; text-align:left; border:0; background:transparent; cursor:pointer; box-sizing:border-box; }
.settings-btn { width:100%; }
#settings-window .mid-btn { width:calc(100% - 20px); margin:6px 10px; padding:9px 10px; font-size:13px; }
.mid-left { min-width:0; }
.mid-left .icon,.mid-chevron,.switch-toggle { flex-shrink:0; }
#settings-window .window-content { min-height:0; }
#settings-window .window-content > :first-child { flex-shrink:0; overflow:auto; }
.settings-middle { flex-shrink:0; overflow:auto; }
.settings-main { min-width:0; }
.settings-page h1 { font-size:28px !important; letter-spacing:-.7px; margin-bottom:20px !important; color:#202027; }
.settings-main .setting-row { box-sizing:border-box; }
.settings-main .setting-row-left { min-width:0; flex:1; max-width:none; }
.settings-main .setting-description { line-height:1.55; margin:2px 0 0; }
.preference-intro { font-size:12px; line-height:1.6; color:#707078; margin:10px 14px 18px; }
.settings-page .preference-heading { font-size:15px; margin:22px 0 12px; }
.wallpaper-preview { height:130px; border:4px solid #292a30; border-radius:12px; box-shadow:0 6px 16px #0002; background-size:cover; }
.wallpaper-transition { position:absolute; inset:0; pointer-events:none; opacity:0; }
.wallpaper-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.wallpaper-choice { border:2px solid transparent; padding:4px; border-radius:12px; font:12px system-ui; background:transparent; cursor:pointer; color:#505058; }
.wallpaper-choice span { display:block; height:72px; border-radius:8px; margin-bottom:6px; }
.wallpaper-choice[aria-pressed="true"] { border-color:#3478f6; background:#e9f0ff; color:#145acb; }
.settings-main .setting-select { appearance:none; min-width:145px; max-width:180px; padding:8px 28px 8px 10px; border:1px solid #d8d8df; border-radius:8px; background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 16'%3E%3Cpath d='m3 6 3-3 3 3m-6 4 3 3 3-3' fill='none' stroke='%23666' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") right 8px center/10px 14px no-repeat; box-shadow:0 1px 2px #00000008; color:#292930; cursor:pointer; font-size:12px; }
.focus-choices { display:grid; gap:10px; margin-bottom:20px; }
.focus-choice { display:grid; grid-template-columns:80px 1fr; gap:5px 14px; padding:15px; text-align:left; background:white; color:#202027; border:1px solid #dedee4; border-radius:13px; cursor:pointer; }
.focus-choice[aria-pressed="true"] { border:2px solid #3478f6; padding:14px; background:#f2f6ff; }
.focus-demo { grid-row:span 2; border:1px solid #dedee4; border-radius:8px; padding:16px 5px; text-align:center; color:#327af6; background:#edf2fa; }
.focus-demo.mac { color:#f06659; } .focus-demo.transparency { opacity:.5; }
.focus-choice > span:last-child { font-size:12px; line-height:1.5; color:#74747e; }
.preference-card { background:#fff; border:1px solid #e0e0e6; border-radius:13px; padding:0 16px; margin:18px 0; font-size:13px; }
.preference-card > strong { display:block; margin-top:16px; }
.preference-card p { color:#74747e; font-size:12px; line-height:1.6; margin:12px 0 16px; }
.preference-row { display:flex; justify-content:space-between; align-items:center; gap:16px; min-height:60px; padding:12px 0; border-bottom:1px solid #eeeef2; }
.preference-row:last-child { border-bottom:0; }
.preference-row select { max-width:185px; font:12px system-ui; padding:7px; border:1px solid #d6d6de; border-radius:8px; background:#fafafa; }
.preference-row input { accent-color:#3478f6; width:18px; height:18px; }
.preference-action { padding:10px 15px; border:1px solid #d5d5df; border-radius:8px; background:white; color:#2868d3; cursor:pointer; }
@media(max-width:1000px) { #settings-window .settings-middle { width:150px !important; } #settings-window .settings-main { padding:22px !important; } }
@media(max-width:760px) { #settings-window { min-width:0; } #settings-window .window-content > :first-child { width:135px !important; } #settings-window .settings-middle { width:140px !important; } #settings-window .settings-main { padding:16px !important; } .wallpaper-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .setting-row-inline:has(select) { flex-direction:column; align-items:flex-start; } .settings-main .setting-select { max-width:100%; width:100%; } }
@media(prefers-reduced-motion:reduce) { .dock,.window-control { transition:none; } }
.desktop-minimizing { pointer-events:none; }
.desktop-icons { position:absolute; inset:16px 16px 48px; z-index:1; outline:none; user-select:none; touch-action:none; }
.desktop-icon { position:absolute; width:88px; height:92px; display:flex; flex-direction:column; align-items:center; gap:5px; padding:6px 3px; border:1px solid transparent; border-radius:8px; cursor:default; }
.desktop-icon-symbol { width:52px; height:52px; display:grid; place-items:center; font-size:29px; border-radius:12px; box-shadow:0 3px 10px #0003,inset 0 0 0 1px #ffffff30; pointer-events:none; }
.desktop-icon-label { max-width:100%; padding:2px 5px; border-radius:4px; color:white; font-size:12px; line-height:16px; text-shadow:0 1px 3px #000c; text-align:center; pointer-events:none; }
.desktop-icon[aria-selected="true"] { border-color:#ffffff50; background:#ffffff26; }
.desktop-icon[aria-selected="true"] .desktop-icon-label { background:#1674e9; text-shadow:none; }
.desktop-icon:focus-visible { outline:2px solid #ffffffcc; outline-offset:2px; }
.dragging-icons { cursor:grabbing; } .dragging-icons .desktop-icon[aria-selected="true"] { cursor:grabbing; }
.desktop-selection { position:absolute; background:#2788ff30; border:1px solid #7bb6ff; border-radius:2px; pointer-events:none; z-index:2; }
.desktop-selection[hidden] { display:none; }
.desktop-status { position:absolute; width:1px; height:1px; clip-path:inset(50%); overflow:hidden; }