@font-face {
  font-family: "Material Symbols Rounded";
  src: url("/icons/MaterialSymbolsRounded-subset.ttf") format("truetype");
  font-weight: 100 700;
  font-style: normal;
  font-display: block;
}

:root {
  --accent: #1ab1c3;
  --accent-rgb: 26, 177, 195;
  --icon-scale: 1;
  --taskbar-height: 62px;
  --panel-surface: rgba(11, 16, 18, .9);
  --panel-border: rgba(255, 255, 255, .12);
}

.glyph {
  display: inline-grid !important;
  place-items: center !important;
  width: 1.2em !important;
  height: 1.2em !important;
  flex: 0 0 auto;
  background: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: inherit;
  font-style: normal;
  overflow: visible !important;
}

.glyph::before {
  content: var(--symbol, "description") !important;
  position: static !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  inset: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  box-shadow: none !important;
  transform: none !important;
  font-family: "Material Symbols Rounded" !important;
  font-size: 1em !important;
  font-weight: 430 !important;
  font-style: normal !important;
  line-height: 1 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
  white-space: nowrap !important;
  word-wrap: normal !important;
  direction: ltr !important;
  font-feature-settings: "liga" !important;
  -webkit-font-feature-settings: "liga" !important;
  -webkit-font-smoothing: antialiased;
}

.glyph::after { display: none !important; }
.glyph-folder { --symbol: "folder"; }
.glyph-folder-add { --symbol: "create_new_folder"; }
.glyph-computer { --symbol: "computer"; }
.glyph-photo { --symbol: "image"; }
.glyph-trash { --symbol: "delete"; }
.glyph-calculator { --symbol: "calculate"; }
.glyph-calendar { --symbol: "calendar_month"; }
.glyph-notepad,.glyph-document { --symbol: "description"; }
.glyph-download { --symbol: "download"; }
.glyph-settings { --symbol: "settings"; }
.glyph-keyboard { --symbol: "keyboard"; }
.glyph-wifi { --symbol: "wifi"; }
.glyph-volume { --symbol: "volume_up"; }
.glyph-sun { --symbol: "light_mode"; }
.glyph-theme { --symbol: "dark_mode"; }
.glyph-language { --symbol: "language"; }
.glyph-lock { --symbol: "lock"; }
.glyph-close { --symbol: "close"; }
.glyph-palette { --symbol: "palette"; }
.glyph-grid { --symbol: "grid_view"; }
.glyph-taskbar { --symbol: "more_horiz"; }
.glyph-pdf { --symbol: "picture_as_pdf"; }
.glyph-word { --symbol: "description"; }
.glyph-sheet { --symbol: "spreadsheet"; }
.glyph-presentation { --symbol: "presentation"; }
.glyph-video { --symbol: "video_file"; }
.glyph-audio { --symbol: "audio_file"; }
.glyph-refresh { --symbol: "refresh"; }

#desktop {
  --turquoise: var(--accent);
  --cyan: var(--accent);
}

.os-wallpaper {
  transition: background .32s ease, filter .25s ease;
}

#desktop[data-wallpaper="signature"] .os-wallpaper {
  background:
    radial-gradient(circle at 76% 28%, rgba(var(--accent-rgb), .20), transparent 26%),
    radial-gradient(circle at 18% 92%, rgba(16, 83, 90, .22), transparent 34%),
    linear-gradient(142deg, #020606 0%, #071013 48%, #020505 100%) !important;
}

#desktop[data-wallpaper="summit"] .os-wallpaper {
  background:
    linear-gradient(154deg, transparent 52%, rgba(var(--accent-rgb), .14) 52.2%, transparent 53%),
    linear-gradient(26deg, #05090a 0%, #0d191b 44%, #081113 45%, #020404 100%) !important;
}

#desktop[data-wallpaper="minimal"] .os-wallpaper {
  background:
    radial-gradient(circle at 72% 42%, rgba(var(--accent-rgb), .14), transparent 22%),
    #050808 !important;
}

#desktop[data-wallpaper="light"] .os-wallpaper {
  background:
    radial-gradient(circle at 74% 20%, rgba(var(--accent-rgb), .22), transparent 30%),
    linear-gradient(132deg, #edf4f3, #cdd9d8 52%, #e9efee) !important;
}

#desktop[data-wallpaper="light"] .wall-copy { color: rgba(2, 25, 28, .14); }
#desktop[data-wallpaper="light"] .wall-dots { opacity: .25; filter: invert(1); }
#desktop[data-wallpaper="minimal"] .wall-sphere,
#desktop[data-wallpaper="minimal"] .wall-copy { opacity: .08; }

.desktop-icons { bottom: var(--taskbar-height) !important; }
.desktop-icon {
  width: calc(86px * var(--icon-scale)) !important;
  min-height: calc(82px * var(--icon-scale)) !important;
  padding: 7px 5px !important;
  gap: 4px !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  color: #f7fbfb !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.9) !important;
}

.desktop-icon:hover,
.desktop-icon:focus-visible {
  background: rgba(255,255,255,.09) !important;
  border-color: rgba(255,255,255,.16) !important;
}

.desktop-icon .icon-tile {
  width: calc(48px * var(--icon-scale)) !important;
  height: calc(48px * var(--icon-scale)) !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: linear-gradient(145deg, rgba(var(--accent-rgb), .96), rgba(var(--accent-rgb), .5)) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.28), 0 8px 22px rgba(0,0,0,.28) !important;
}

.desktop-icon .icon-tile .glyph { font-size: calc(29px * var(--icon-scale)); }
.desktop-icon > span:last-child { font-size: calc(12px * var(--icon-scale)); line-height: 1.15; }

.window {
  overflow: hidden !important;
  border: 1px solid var(--panel-border) !important;
  border-radius: 12px !important;
  background: rgba(8, 12, 13, .965) !important;
  box-shadow: 0 30px 90px rgba(0,0,0,.55), 0 0 0 1px rgba(0,0,0,.25) !important;
  backdrop-filter: blur(24px) saturate(125%);
}

#desktop[data-theme="light"] .window {
  background: rgba(246,249,249,.97) !important;
  color: #122023;
  --panel-border: rgba(7, 33, 37, .16);
}

.window-titlebar {
  min-height: 42px !important;
  height: 42px !important;
  padding: 0 7px 0 14px !important;
  background: rgba(255,255,255,.025) !important;
  border-bottom: 1px solid rgba(255,255,255,.085) !important;
}

.window-brand { gap: 9px !important; font-size: 12px !important; }
.window-brand .glyph { color: var(--accent); font-size: 19px; }
.window-actions { align-self: stretch; gap: 2px !important; }
.window-actions button {
  width: 42px !important;
  height: 34px !important;
  margin-top: 3px;
  border: 0 !important;
  border-radius: 6px !important;
  background: transparent !important;
  color: inherit !important;
  font-size: 15px !important;
}
.window-actions button:hover { background: rgba(255,255,255,.09) !important; }
.window-actions button[data-close]:hover { background: #c42b1c !important; color: #fff !important; }

.command-bar,
.explorer-toolbar,
.media-toolbar,
.trash-toolbar,
.preview-toolbar,
.notepad-toolbar {
  border-color: rgba(255,255,255,.075) !important;
}

.command-bar button,
.explorer-toolbar button,
.media-toolbar button,
.trash-toolbar button {
  border-radius: 6px !important;
}

.private-command { color: var(--accent) !important; }
.private-code-button {
  width: 100%;
  margin-top: 10px;
  padding: 9px 11px;
  border: 1px solid rgba(var(--accent-rgb),.3);
  border-radius: 7px;
  background: rgba(var(--accent-rgb),.1);
  color: var(--accent);
}

.file-grid:not(.is-list) {
  grid-template-columns: repeat(auto-fill, minmax(116px, 1fr)) !important;
  gap: 8px !important;
}

.file-card {
  position: relative;
  min-height: 112px !important;
  padding: 10px 7px !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  transition: background .13s ease, border-color .13s ease, transform .13s ease;
}
.file-card:hover { background: rgba(255,255,255,.055) !important; border-color: rgba(255,255,255,.09) !important; }
.file-card.is-selected { background: rgba(var(--accent-rgb),.14) !important; border-color: rgba(var(--accent-rgb),.42) !important; }

.file-icon {
  width: 58px !important;
  height: 58px !important;
  display: grid !important;
  place-items: center !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: linear-gradient(145deg, rgba(231,189,75,.98), rgba(180,125,26,.78)) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.35), 0 10px 20px rgba(0,0,0,.22) !important;
}
.file-icon .glyph { color: #fff !important; font-size: 34px !important; }
.file-icon.is-image { background-position: center !important; background-size: cover !important; box-shadow: inset 0 0 0 1px rgba(255,255,255,.16), 0 10px 22px rgba(0,0,0,.25) !important; }
.file-icon.is-image .glyph { display: none !important; }
.file-ext {
  position: absolute !important;
  right: -4px !important;
  bottom: 2px !important;
  min-width: 27px;
  padding: 3px 4px !important;
  border-radius: 4px !important;
  background: rgba(3,7,8,.88) !important;
  color: #fff !important;
  font-size: 7px !important;
  letter-spacing: .08em;
}
.file-card[data-category="pdf"] .file-icon { background: linear-gradient(145deg,#e14e4e,#a91f28) !important; }
.file-card[data-category="word"] .file-icon { background: linear-gradient(145deg,#4388e7,#174a9d) !important; }
.file-card[data-category="sheet"] .file-icon { background: linear-gradient(145deg,#27a764,#12633c) !important; }
.file-card[data-category="presentation"] .file-icon { background: linear-gradient(145deg,#ec7a3f,#a6361e) !important; }
.file-card[data-category="video"] .file-icon { background: linear-gradient(145deg,#936ad8,#483085) !important; }
.file-card[data-category="audio"] .file-icon { background: linear-gradient(145deg,#28b9aa,#12645d) !important; }
.file-card[data-category="text"] .file-icon { background: linear-gradient(145deg,#6d8387,#34464a) !important; }
.file-card.is-private .file-icon { background: linear-gradient(145deg,var(--accent),#0b6570) !important; }
.private-badge {
  position: absolute !important;
  right: -7px;
  top: -7px;
  width: 22px !important;
  height: 22px !important;
  border: 2px solid #101617 !important;
  border-radius: 50% !important;
  background: #f2c94c !important;
  color: #18201f !important;
  font-size: 13px !important;
}

.photo-viewer {
  position: absolute !important;
  inset: 42px 0 0 0 !important;
  z-index: 10 !important;
  display: flex !important;
  flex-direction: column !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #050707 !important;
}
.photo-viewer.is-hidden { display: none !important; }
.photo-viewer > header {
  display: flex !important;
  flex: 0 0 48px !important;
  align-items: center !important;
  justify-content: space-between !important;
  min-width: 0;
  padding: 0 12px 0 16px !important;
  border-bottom: 1px solid rgba(255,255,255,.09) !important;
  background: rgba(15,20,21,.96) !important;
}
.photo-viewer > header > div { display: flex; align-items: center; gap: 9px; min-width: 0; }
.photo-viewer > header b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.photo-viewer > header button {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  min-width: 34px;
  height: 32px;
  padding: 0 9px;
  border: 1px solid rgba(255,255,255,.1) !important;
  border-radius: 6px !important;
  background: rgba(255,255,255,.06) !important;
  color: #fff !important;
}
.photo-stage {
  flex: 1 1 auto !important;
  display: grid !important;
  place-items: center !important;
  min-width: 0 !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 20px !important;
  background:
    radial-gradient(circle at center, rgba(var(--accent-rgb),.06), transparent 45%),
    #030505 !important;
}
.photo-stage img {
  display: block !important;
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  border-radius: 5px !important;
  box-shadow: 0 20px 55px rgba(0,0,0,.5) !important;
}

.preview-window { width: min(1050px, calc(100vw - 54px)) !important; height: min(760px, calc(100vh - 94px)) !important; }
.preview-toolbar {
  height: 58px;
  padding: 0 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.preview-toolbar > div { display: grid; grid-template-columns: auto 1fr; align-items: center; column-gap: 9px; min-width: 0; }
.preview-toolbar b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.preview-toolbar small { grid-column: 2; opacity: .55; }
#previewTypeBadge { grid-row: 1 / span 2; padding: 7px 6px; border-radius: 5px; background: var(--accent); color: #041113; font-size: 8px; font-weight: 800; letter-spacing: .06em; }
.preview-toolbar > button { display: flex; align-items: center; gap: 7px; height: 34px; padding: 0 12px; border: 1px solid rgba(255,255,255,.12); border-radius: 6px; background: rgba(255,255,255,.06); color: inherit; }
.preview-content { height: calc(100% - 100px); min-height: 0; overflow: auto; background: #171b1c; }
.preview-content iframe,.preview-content video { display: block; width: 100%; height: 100%; border: 0; background: #202425; }
.preview-content video { object-fit: contain; background: #030404; }
.audio-preview { min-height: 100%; display: grid; place-items: center; padding: 28px; background: radial-gradient(circle at center,rgba(var(--accent-rgb),.15),transparent 40%),#080d0e; }
.audio-card { width: min(440px,100%); padding: 32px; border: 1px solid rgba(255,255,255,.11); border-radius: 18px; background: rgba(255,255,255,.055); text-align: center; box-shadow: 0 24px 60px rgba(0,0,0,.28); }
.audio-card .glyph { width: 88px !important; height: 88px !important; margin: 0 auto 18px; border-radius: 24px !important; background: linear-gradient(145deg,var(--accent),#14545c) !important; font-size: 46px; }
.audio-card h3 { margin: 0 0 24px; overflow-wrap: anywhere; }
.audio-card audio { width: 100%; }
.office-preview { min-height: 100%; padding: 28px; background: #2a2d2e; color: #1e2729; }
.document-page { width: min(760px,100%); min-height: 880px; margin: 0 auto; padding: 68px 72px; background: #fff; box-shadow: 0 15px 55px rgba(0,0,0,.28); line-height: 1.65; }
.document-page p { margin: 0 0 1em; white-space: pre-wrap; }
.sheet-page { width: max-content; min-width: min(900px,100%); margin: 0 auto; padding: 14px; background: #fff; box-shadow: 0 15px 55px rgba(0,0,0,.28); }
.sheet-page h3 { margin: 7px 6px 13px; }
.sheet-page table { border-collapse: collapse; font-size: 12px; }
.sheet-page th,.sheet-page td { min-width: 100px; padding: 7px 9px; border: 1px solid #cfd9d8; text-align: left; white-space: pre-wrap; }
.sheet-page th { min-width: 34px; background: #eaf1f0; text-align: center; }
.slide-deck { display: grid; gap: 24px; width: min(900px,100%); margin: 0 auto; }
.slide-card { aspect-ratio: 16/9; padding: 8%; display: flex; flex-direction: column; justify-content: center; background: #fff; box-shadow: 0 15px 55px rgba(0,0,0,.28); }
.slide-card h3 { margin: 0 0 18px; color: #0b737e; }
.slide-card p { margin: 7px 0; font-size: 17px; }
.unsupported-preview { min-height: 100%; display: grid; place-items: center; padding: 30px; text-align: center; background: #0a0f10; }
.unsupported-preview .glyph { font-size: 76px; color: var(--accent); }

.settings-window { width: min(920px,calc(100vw - 46px)) !important; height: min(700px,calc(100vh - 96px)) !important; }
.settings-layout { height: calc(100% - 42px) !important; grid-template-columns: 220px minmax(0,1fr) !important; }
.settings-layout > aside { padding: 21px 12px !important; background: rgba(255,255,255,.025) !important; border-right: 1px solid rgba(255,255,255,.08) !important; }
.settings-layout > aside > img { width: 40px !important; height: 40px !important; margin: 0 10px 8px; }
.settings-layout > aside h3,.settings-layout > aside small { margin-left: 10px; }
.settings-layout > aside small { display: block; margin-bottom: 22px; opacity: .48; font-size: 9px; letter-spacing: .1em; }
.settings-layout > aside button { width: 100%; display: flex; align-items: center; gap: 11px; min-height: 40px; margin: 3px 0; padding: 0 11px !important; border: 0 !important; border-radius: 7px !important; background: transparent !important; color: inherit !important; text-align: left; }
.settings-layout > aside button:hover { background: rgba(255,255,255,.055) !important; }
.settings-layout > aside button.is-active { background: rgba(var(--accent-rgb),.13) !important; color: var(--accent) !important; box-shadow: inset 3px 0 var(--accent); }
.settings-layout > section { overflow: auto !important; padding: 0 24px 34px !important; }
.settings-hero { position: sticky; top: 0; z-index: 1; height: 66px; display: flex; align-items: center; justify-content: space-between; background: rgba(8,12,13,.94); backdrop-filter: blur(15px); }
.settings-hero img { width: 128px; height: auto; }
.settings-hero span { color: var(--accent); font-size: 11px; font-weight: 800; letter-spacing: .08em; }
.settings-page { display: none; }
.settings-page.is-active { display: block; }
.settings-page > h2 { margin: 4px 0 18px; font-size: 25px; }
.settings-card { min-height: 66px !important; margin: 8px 0 !important; padding: 0 16px !important; display: grid !important; grid-template-columns: 34px minmax(130px,1fr) minmax(120px,240px) !important; align-items: center !important; gap: 10px !important; border: 1px solid rgba(255,255,255,.09) !important; border-radius: 9px !important; background: rgba(255,255,255,.035) !important; }
.settings-card > .glyph { font-size: 22px; color: var(--accent); }
.settings-card small { opacity: .56; }
.settings-card input[type="range"] { width: 100%; accent-color: var(--accent); }
.personal-section { margin: 17px 0 20px; }
.personal-section h3 { margin: 0 0 10px; font-size: 13px; }
.wallpaper-choices { display: grid; grid-template-columns: repeat(4,1fr); gap: 9px; }
.wallpaper-choices button { padding: 7px; border: 2px solid transparent; border-radius: 9px; background: rgba(255,255,255,.035); color: inherit; }
.wallpaper-choices button.is-active { border-color: var(--accent); }
.wallpaper-choices i { display: block; height: 68px; margin-bottom: 7px; border-radius: 6px; background: radial-gradient(circle at 72% 26%,rgba(26,177,195,.38),transparent 30%),linear-gradient(135deg,#030606,#0b181a); }
.wallpaper-choices button:nth-child(2) i { background: linear-gradient(155deg,transparent 48%,rgba(26,177,195,.24) 49%,transparent 51%),linear-gradient(25deg,#050707,#152326); }
.wallpaper-choices button:nth-child(3) i { background: radial-gradient(circle,rgba(26,177,195,.2),transparent 35%),#050808; }
.wallpaper-choices button:nth-child(4) i { background: radial-gradient(circle at 72% 26%,rgba(26,177,195,.25),transparent 33%),linear-gradient(135deg,#edf4f3,#cfdad9); }
.wallpaper-choices span { font-size: 10px; }
.accent-choices { display: flex; gap: 10px; }
.accent-choices button { width: 32px; height: 32px; padding: 0; border: 3px solid transparent; border-radius: 50%; background: var(--swatch); box-shadow: inset 0 0 0 1px rgba(255,255,255,.35); }
.accent-choices button.is-active { border-color: #fff; box-shadow: 0 0 0 2px var(--swatch); }
.language-hint { display: flex; gap: 14px; margin-top: 18px; padding: 18px; border: 1px solid rgba(255,255,255,.08); border-radius: 9px; background: rgba(255,255,255,.03); }
.language-hint .glyph { font-size: 24px; color: var(--accent); }
.language-hint p { margin: 5px 0 0; opacity: .58; }

.toggle.is-on { background: var(--accent) !important; }

.taskbar {
  height: var(--taskbar-height) !important;
  padding: 7px 8px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  background: rgba(8, 12, 13, .82) !important;
  border-top: 1px solid rgba(255,255,255,.105) !important;
  box-shadow: 0 -12px 38px rgba(0,0,0,.24) !important;
  backdrop-filter: blur(28px) saturate(135%) !important;
}
.taskbar > .task-tray { position: absolute !important; right: 8px; }
.task-center { display: flex !important; align-items: center; gap: 4px !important; height: 48px; padding: 3px 5px; border-radius: 11px; }
.task-center button,#startButton,#taskSearch {
  width: 42px !important;
  height: 42px !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  background: transparent !important;
}
.task-center button:hover,#startButton:hover,#taskSearch:hover { background: rgba(255,255,255,.075) !important; border-color: rgba(255,255,255,.06) !important; }
.task-center button.is-active { background: rgba(255,255,255,.08) !important; box-shadow: inset 0 -2px var(--accent); }
.task-search span { display: none !important; }
.taskbar .glyph { font-size: 23px; }
.tray-shell {
  height: 44px;
  display: flex;
  align-items: center;
  gap: 2px;
  padding: 3px 4px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 9px;
  background: rgba(255,255,255,.035);
}
.tray-shell button { height: 36px !important; border: 0 !important; border-radius: 6px !important; background: transparent !important; color: inherit !important; }
.tray-shell button:hover { background: rgba(255,255,255,.08) !important; }
.tray-language { min-width: 42px !important; padding: 0 8px !important; font-size: 10px !important; font-weight: 700; letter-spacing: .03em; }
#quickButton { width: 61px !important; display: flex !important; align-items: center !important; justify-content: center !important; gap: 5px !important; }
#quickButton .glyph { font-size: 16px !important; }
#clockButton { min-width: 72px !important; padding: 3px 9px !important; display: flex !important; flex-direction: column !important; align-items: flex-end !important; justify-content: center !important; font-variant-numeric: tabular-nums; }
#clockButton time { font-size: 11px !important; font-weight: 600; line-height: 1.05; }
#clockButton span { font-size: 9px !important; opacity: .68; line-height: 1.05; }
#showDesktop { width: 7px !important; height: 44px !important; margin-left: 4px !important; border: 0 !important; border-left: 1px solid rgba(255,255,255,.18) !important; border-radius: 0 !important; background: transparent !important; }
#desktop.taskbar-compact { --taskbar-height: 50px; }
#desktop.taskbar-compact .taskbar { padding-top: 3px !important; padding-bottom: 3px !important; }
#desktop.taskbar-compact .task-center,#desktop.taskbar-compact .tray-shell { height: 40px; }
#desktop.taskbar-compact .task-center button,#desktop.taskbar-compact #startButton,#desktop.taskbar-compact #taskSearch { width: 36px !important; height: 36px !important; }
#desktop.taskbar-compact .tray-shell button { height: 32px !important; }

.start-menu,.quick-panel,.calendar-panel,.language-panel,.context-menu {
  border: 1px solid rgba(255,255,255,.12) !important;
  background: rgba(11,16,18,.94) !important;
  box-shadow: 0 24px 70px rgba(0,0,0,.5) !important;
  backdrop-filter: blur(28px) saturate(135%) !important;
}
.context-menu { min-width: 220px !important; padding: 5px !important; border-radius: 9px !important; }
.context-menu button { min-height: 34px !important; padding: 0 9px !important; border-radius: 5px !important; }
.context-menu button:hover { background: rgba(var(--accent-rgb),.13) !important; }
.context-menu .glyph { font-size: 18px; color: var(--accent); }

.secure-backdrop {
  position: fixed;
  inset: 0;
  z-index: 10050;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(0,0,0,.56);
  backdrop-filter: blur(8px);
}
.secure-dialog {
  width: min(410px,100%);
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 13px;
  background: #101617;
  color: #f6f9f9;
  box-shadow: 0 30px 90px rgba(0,0,0,.58);
}
.secure-dialog header { display: flex; align-items: center; gap: 11px; padding: 20px 21px 13px; }
.secure-dialog header .glyph { width: 38px !important; height: 38px !important; border-radius: 10px !important; background: rgba(var(--accent-rgb),.14) !important; color: var(--accent); font-size: 22px; }
.secure-dialog header h3 { margin: 0; font-size: 17px; }
.secure-dialog header p { margin: 3px 0 0; opacity: .58; font-size: 11px; }
.secure-dialog form { padding: 8px 21px 21px; }
.secure-dialog label { display: block; margin: 10px 0; }
.secure-dialog label span { display: block; margin-bottom: 5px; opacity: .68; font-size: 11px; }
.secure-dialog input { width: 100%; height: 40px; padding: 0 11px; border: 1px solid rgba(255,255,255,.13); border-radius: 7px; outline: 0; background: rgba(255,255,255,.06); color: #fff; }
.secure-dialog input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(var(--accent-rgb),.13); }
.secure-error { min-height: 17px; margin: 5px 0 0; color: #ff8c86; font-size: 11px; }
.secure-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 14px; }
.secure-actions button { height: 36px; padding: 0 14px; border: 1px solid rgba(255,255,255,.12); border-radius: 7px; background: rgba(255,255,255,.06); color: #fff; }
.secure-actions button[type="submit"] { border-color: var(--accent); background: var(--accent); color: #041113; font-weight: 750; }

@media (max-width: 760px) {
  .settings-layout { grid-template-columns: 64px minmax(0,1fr) !important; }
  .settings-layout > aside h3,.settings-layout > aside small,.settings-layout > aside button span { display: none; }
  .settings-layout > aside button { justify-content: center; padding: 0 !important; }
  .settings-layout > section { padding-left: 14px !important; padding-right: 14px !important; }
  .wallpaper-choices { grid-template-columns: repeat(2,1fr); }
  .settings-card { grid-template-columns: 30px 1fr !important; padding: 10px 12px !important; }
  .settings-card > input,.settings-card > button { grid-column: 2; width: 100%; }
  .taskbar { justify-content: flex-start !important; }
  .tray-language { display: none !important; }
  .preview-window { width: calc(100vw - 12px) !important; height: calc(100vh - 72px) !important; }
  .document-page { padding: 30px 24px; }
}