/* Bloco de notas */
.np {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: #ece9d8;
}
.np-text {
  flex: 1;
  border: 0;
  border-top: 1px solid #aca899;
  outline: none;
  resize: none;
  padding: 0 0 0 2px;
  font: 13px/1.15 'Lucida Console', 'Courier New', monospace;
  color: #000;
  background: #fff;
  white-space: pre;
  user-select: text;
}
.np-text[wrap='soft'] {
  white-space: pre-wrap;
}

/* Calculadora */
.calc {
  background: #ece9d8;
}
.calc-display {
  background: #fff;
  border: 1px solid #7f9db9;
  text-align: right;
  padding: 2px 4px 0;
  font: 11px Tahoma, sans-serif;
  line-height: 18px;
  overflow: hidden;
  white-space: nowrap;
}
.calc-mem {
  text-align: center;
  line-height: 22px;
  background: #ece9d8;
}
.calc-btn {
  padding: 0;
  font-size: 11px;
}

/* Data e hora */
.dt-cal {
  background: #fff;
  border: 1px solid #7f9db9;
  font-size: 11px;
}
.dt-cal-head,
.dt-cal-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  text-align: center;
}
.dt-cal-head {
  background: #ece9d8;
  background: #d4d0c8;
  background: linear-gradient(#e3ebf9, #c3d4f2);
  color: #000;
  line-height: 16px;
}
.dt-cal-grid span {
  line-height: 17px;
}
.dt-cal-grid span.is-on {
  background: #316ac5;
  color: #fff;
}
.dt-map {
  overflow: hidden;
  border: 1px solid #7f9db9;
  background: #3a6ea5;
}
.dt-map img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  mix-blend-mode: luminosity;
  opacity: 0.85;
}

/* Propriedades de Vídeo */
.dp-walls > div {
  display: flex;
  align-items: center;
  gap: 4px;
  height: 17px;
}
.dp-walls img {
  width: 16px;
  height: 16px;
}
.dp-color {
  position: relative;
  padding: 0;
}
.dp-color > span {
  display: block;
  width: 28px;
  height: 9px;
  border: 1px solid #000;
  margin: -6px -4px;
}
.dp-color:after {
  content: '';
  margin: -6px -4px -6px 8px;
  border: 3px solid transparent;
  border-top: 4px solid #000;
  transform: translateY(2px);
}
.dp-color input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: default;
}
.dp-preview {
  border: 1px solid #7f9db9;
  overflow: hidden;
}
.dp-preview-win {
  position: absolute;
  left: 18%;
  top: 18%;
  width: 60%;
  height: 55%;
  border: 3px solid #0831d9;
  border-top: 0;
  border-radius: 6px 6px 0 0;
  background: #ece9d8;
}
.dp-preview-cap {
  height: 18px;
  margin: 0 -3px;
  border-radius: 6px 6px 0 0;
  background: linear-gradient(#0058ee, #3593ff 8%, #0058e6 20%, #0055eb 60%, #0040ab);
  color: #fff;
  font: bold 11px 'Trebuchet MS', Tahoma, sans-serif;
  line-height: 18px;
  padding-left: 6px;
}
.dp-preview-body {
  padding: 10px;
}
.dp-track {
  position: relative;
}
.dp-track-line {
  position: absolute;
  left: 4px;
  right: 4px;
  top: 8px;
  height: 4px;
  border: 1px solid;
  border-color: #9d9c99 #fff #fff #9d9c99;
  background: #f2f1e9;
}
.dp-track-thumb {
  position: absolute;
  left: 50%;
  top: 0;
  width: 11px;
  height: 21px;
  background: url(/xp-ui/track-thumb-0.png);
}
.dp-colorbar {
  background: linear-gradient(to right, red, yellow, lime, cyan, blue, magenta, red);
  border: 1px solid #808080;
}

/* barra de tarefas e relógio */
.tb {
  height: 30px;
  display: flex;
  align-items: stretch;
  background: url(/xp-ui/taskbar.png) repeat-x left top / auto 30px;
  font: 11px Tahoma, sans-serif;
}
.tb-start {
  padding: 0;
  background: none;
  width: 99px;
  border-style: solid;
  border-width: 13px 52px 14px 6px;
  border-image: url(/xp-ui/start-0.png) 13 52 14 6 fill stretch;
  position: relative;
  color: #fff;
}
.tb-start:hover {
  border-image-source: url(/xp-ui/start-1.png);
}
.tb-start:active {
  border-image-source: url(/xp-ui/start-2.png);
}
.tb-start span {
  position: absolute;
  left: 30px;
  top: -10px;
  font: italic bold 18px 'Franklin Gothic Medium', 'Trebuchet MS', Arial, sans-serif;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6);
  white-space: nowrap;
}
.tb-start i {
  position: absolute;
  left: 2px;
  top: -6px;
}
.tb-mid {
  flex: 1;
}
.tb-tray {
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 0 12px 0 16px;
  border-style: solid;
  border-width: 0 0 0 10px;
  border-image: url(/xp-ui/tray.png) 0 0 0 34 fill stretch;
  border-image-width: 0 0 0 34px;
  color: #fff;
}
.tb-tray img {
  width: 16px;
  height: 16px;
}
.tb-clock {
  margin-left: 6px;
  white-space: nowrap;
}

/* Windows Explorer: modo "Lado a lado" e "Miniaturas" do XP */
.xpx-tiles {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  gap: 2px 10px;
  padding: 10px 12px;
  font: 11px Tahoma, sans-serif;
}
.xpx-tile {
  width: 230px;
  height: 56px;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 2px;
  cursor: default;
}
.xpx-icon {
  width: 48px;
  height: 48px;
  object-fit: contain;
  flex: 0 0 48px;
  image-rendering: auto;
}
.xpx-label {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.xpx-name {
  color: #000;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 0 2px;
}
.xpx-meta {
  color: #808080;
  padding: 0 2px;
}
.xpx-tile.is-on .xpx-icon {
  filter: brightness(0.7) sepia(1) hue-rotate(185deg) saturate(3);
}
.xpx-tile.is-on .xpx-name {
  background: #316ac5;
  color: #fff;
}
.xpx-label input {
  font: 11px Tahoma, sans-serif;
  width: 160px;
  border: 1px solid #000;
}
.xpx-tile.is-thumb {
  width: 110px;
  height: 132px;
  flex-direction: column;
  gap: 4px;
}
.xpx-thumb {
  width: 100px;
  height: 100px;
  border: 1px solid #d0d0bf;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
.xpx-thumb img {
  max-width: 96px;
  max-height: 96px;
}
.xpx-tile.is-thumb.is-on .xpx-thumb {
  border: 2px solid #316ac5;
}
.xpx-tile.is-thumb .xpx-label {
  align-items: center;
  max-width: 108px;
}

/* Visualizador de imagens e fax do Windows */
.iv {
  height: 100%;
  display: flex;
  flex-direction: column;
  background: #ece9d8;
}
.iv-view {
  flex: 1;
  min-height: 0;
  overflow: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border-bottom: 1px solid #aca899;
}
.iv-view img {
  max-width: none;
  transition: transform 0.15s;
}
.iv-view img.is-fit {
  max-width: 100%;
  max-height: 100%;
}
.iv-bar {
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1px;
}
.iv-bar button {
  width: 24px;
  height: 24px;
  padding: 0;
  border: 1px solid transparent;
  border-radius: 3px;
  background: none;
  display: flex;
  align-items: center;
  justify-content: center;
}
.iv-bar button:hover {
  border-color: #cecec3;
  background: linear-gradient(#fff, #f1efe8);
}
.iv-bar button:active {
  border-color: #9d9d92;
  background: #e2e0d4;
}
.iv-sep {
  width: 1px;
  height: 18px;
  margin: 0 4px;
  background: #aca899;
  box-shadow: 1px 0 #fff;
}
.iv-slides {
  position: fixed;
  inset: 0;
  z-index: 100000;
  background: #000;
  display: flex;
  align-items: center;
  justify-content: center;
}
.iv-slides img {
  max-width: 100%;
  max-height: 100%;
}
.com__toolbar .xpui-menubar {
  flex: 1;
  border: 0;
  box-shadow: none;
  background: transparent;
}

/* Windows Media Player — capa "Clássico" (CLASSIC.WMZ) */
.wmp {
  position: relative;
  height: 100%;
  overflow: hidden;
  background: #d6d3ce;
  font: 11px Tahoma, sans-serif;
  user-select: none;
}
.wmp-line {
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
}
.wmp-nav {
  position: absolute;
  left: 0;
  right: 0;
  top: 1px;
  height: 23px;
  background: #d6d3ce;
}
.wmp-video {
  position: absolute;
  left: 0;
  right: 0;
  background: #000;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.wmp-video video {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.wmp-logo {
  max-width: 100%;
  max-height: 100%;
}
.wmp-cpane {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  background: #d6d3ce;
}
.wmp-btn {
  position: absolute;
  width: 21px;
  height: 21px;
  padding: 0;
  border: 0;
  background: none no-repeat;
}
.wmp-divider {
  position: absolute;
  width: 2px;
  height: 21px;
  background: url(/xp-ui/wmp/divider.png) no-repeat;
}
.wmp-slider {
  position: absolute;
  border-style: solid;
}
.wmp-slider span {
  position: absolute;
  top: 0;
  background: no-repeat;
}
.wmp-info {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  background: #000;
  border-top: 1px solid #848284;
  border-left: 1px solid #848284;
  color: #fff;
}
.wmp-text {
  position: absolute;
  left: 10px;
  right: 10px;
  height: 15px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wmp-small {
  font-size: 11px;
}
.wmp-time {
  left: auto;
  text-align: right;
}
.wmp-rule {
  position: absolute;
  left: 0;
  right: 0;
  height: 1px;
  background: #848284;
}
.wmp-stereo {
  position: absolute;
}
.wmp-video iframe {
  width: 100%;
  height: 100%;
  border: 0;
}
.wmp-modal {
  position: absolute;
  inset: 0;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.15);
}
.wmp-dialog {
  border: 3px solid #0831d9;
  border-top: 0;
  border-radius: 7px 7px 0 0;
  box-shadow: 2px 3px 8px rgba(0, 0, 0, 0.4);
  max-width: 100%;
  overflow: hidden;
}
.wmp-dialog-title {
  height: 22px;
  margin: 0 -3px;
  padding-left: 8px;
  border-radius: 7px 7px 0 0;
  background: linear-gradient(#0058ee, #3593ff 8%, #0058e6 20%, #0055eb 60%, #0040ab);
  color: #fff;
  font: bold 12px/22px 'Trebuchet MS', Tahoma, sans-serif;
  text-shadow: 1px 1px #0a1883;
}

/* Painel de controle — "Escolha uma categoria" */
.xpx-cp {
  padding: 18px 26px;
  font: 11px Tahoma, sans-serif;
}
.xpx-cp h1 {
  margin: 0 0 18px;
  font: bold 19px 'Trebuchet MS', Tahoma, sans-serif;
  color: #4a62b9;
  padding-bottom: 6px;
  border-bottom: 1px solid #d6dff7;
}
.xpx-cp-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 260px));
  gap: 6px 28px;
}
.xpx-cp-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 4px;
  border: 0;
  background: none;
  text-align: left;
  font: 12px Tahoma, sans-serif;
  color: #0b2b8c;
  cursor: pointer;
}
.xpx-cp-item:hover span {
  text-decoration: underline;
  color: #2a5fd0;
}
.xpx-cp-item img {
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
}

/* ---------------------------------------- Propriedades de Vídeo aplicadas */
/* Efeitos: sem sombras sob menus / sublinhados sempre visíveis / ClearType */
html.xp-no-menu-shadow .xpui-menu,
html.xp-no-menu-shadow .xp-context,
html.xp-no-menu-shadow .xp-context-sub {
  box-shadow: none;
}
html.xp-keys-always .xpui-u {
  text-decoration: underline;
}
html.xp-cleartype body {
  -webkit-font-smoothing: subpixel-antialiased;
  text-rendering: optimizeLegibility;
}
/* Qualidade da cor "Média (16 bits)": faixas visíveis nos degradês */
html.xp-16bit .xp-desktop-host {
  filter: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="b"><feComponentTransfer><feFuncR type="discrete" tableValues="0 .032 .065 .097 .129 .161 .194 .226 .258 .29 .323 .355 .387 .419 .452 .484 .516 .548 .581 .613 .645 .677 .71 .742 .774 .806 .839 .871 .903 .935 .968 1"/><feFuncG type="discrete" tableValues="0 .016 .032 .048 .063 .079 .095 .111 .127 .143 .159 .175 .19 .206 .222 .238 .254 .27 .286 .302 .317 .333 .349 .365 .381 .397 .413 .429 .444 .46 .476 .492 .508 .524 .54 .556 .571 .587 .603 .619 .635 .651 .667 .683 .698 .714 .73 .746 .762 .778 .794 .81 .825 .841 .857 .873 .889 .905 .921 .937 .952 .968 .984 1"/><feFuncB type="discrete" tableValues="0 .032 .065 .097 .129 .161 .194 .226 .258 .29 .323 .355 .387 .419 .452 .484 .516 .548 .581 .613 .645 .677 .71 .742 .774 .806 .839 .871 .903 .935 .968 1"/></feComponentTransfer></filter></svg>#b');
}
.dp-colorbar.is-16 {
  background: linear-gradient(to right, red, yellow, lime, cyan, blue, magenta, red);
  filter: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="b"><feComponentTransfer><feFuncR type="discrete" tableValues="0 .25 .5 .75 1"/><feFuncG type="discrete" tableValues="0 .25 .5 .75 1"/><feFuncB type="discrete" tableValues="0 .25 .5 .75 1"/></feComponentTransfer></filter></svg>#b');
}
/* Tamanho da fonte (Fontes grandes / extra grandes do Luna) */
html.xp-font-large .xp-window .app__header {
  font-size: 18px;
}
html.xp-font-xlarge .xp-window .app__header {
  font-size: 22px;
}
html.xp-font-large .xp-window .app__header,
html.xp-font-large .xp-window .header__bg {
  height: 30px;
  line-height: 30px;
}
html.xp-font-xlarge .xp-window .app__header,
html.xp-font-xlarge .xp-window .header__bg {
  height: 34px;
  line-height: 34px;
}
html.xp-font-large .xp-window .app__content {
  margin-top: 30px;
  height: calc(100% - 30px);
}
html.xp-font-xlarge .xp-window .app__content {
  margin-top: 34px;
  height: calc(100% - 34px);
}
html.xp-font-large .xpui-menubar,
html.xp-font-large .xpui-menu,
html.xp-font-large .xp-context,
html.xp-font-large footer,
html.xp-font-large .xp-desktop-icon-btn {
  font-size: 13px;
}
html.xp-font-xlarge .xpui-menubar,
html.xp-font-xlarge .xpui-menu,
html.xp-font-xlarge .xp-context,
html.xp-font-xlarge footer,
html.xp-font-xlarge .xp-desktop-icon-btn {
  font-size: 16px;
}

/* botão da barra piscando (mensagem nova no Messenger): alterna com o
   TaskBandFlashButton do Luna (laranja, margens 4) e termina laranja, até o
   clique; os esquemas verde-oliva e prateado trocam a imagem (scheme-*.css) */
.footer__window.flashing {
  animation: xp-task-flash 1s steps(1) 0s 7 normal forwards;
}
@keyframes xp-task-flash {
  0%,
  100% {
    border-image: var(--xp-flash, url(/xp-ui/taskband-flash.png)) 4 fill
      stretch;
    border-image-width: 4px;
  }
  50% {
    border-image: var(--xp-band, url(/xp-ui/taskband-0.png)) 15 5 8 17 fill
      stretch;
    border-image-width: 15px 5px 8px 17px;
  }
}
