/* ═══════════════════════════════════════════════════
   DESKTOP (only shown when terminal minimized/closed)
═══════════════════════════════════════════════════ */
#desktop{
  position:fixed;inset:0;
  background:transparent;
  z-index:1;
  overflow:hidden;
}
#desktop::before{
  /* subtle pixel grid */
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(255,200,120,0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,200,120,0.035) 1px, transparent 1px);
  background-size:40px 40px;
  mix-blend-mode:screen;
  z-index:1;
}
#desktop::after{
  /* CRT scanlines on the desktop itself */
  content:"";position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(0deg, rgba(0,0,0,0.18) 0 1px, transparent 1px 3px);
  opacity:0.35;mix-blend-mode:multiply;
  z-index:2;
}
/* Wordmark watermark in the corner */
#desktop-wm{
  position:absolute;right:20px;bottom:50px;
  font-family:'Share Tech Mono','VT323',monospace;
  font-size:88px;line-height:0.85;
  color:transparent;
  -webkit-text-stroke:1px rgba(217,155,63,0.22);
  letter-spacing:4px;
  pointer-events:none;
  z-index:3;
  user-select:none;
  text-shadow:0 0 20px rgba(217,155,63,0.08);
}
#desktop-wm small{
  display:block;font-size:14px;letter-spacing:6px;
  color:rgba(217,155,63,0.35);
  -webkit-text-stroke:0;
  margin-top:6px;text-align:right;
}
/* Grid de ícones estilo XP: posição derivada de --c/--r (coluna/linha)
   definidos inline em cada ícone; o drag solto faz snap para esta grade. */
:root{
  --icon-ox:18px;  /* origem X da grade */
  --icon-oy:18px;  /* origem Y da grade */
  --icon-cw:90px;  /* largura da célula */
  --icon-ch:90px;  /* altura da célula */
}
.desk-icon{
  position:absolute;
  left:calc(var(--icon-ox) + var(--c,0) * var(--icon-cw));
  top:calc(var(--icon-oy) + var(--r,0) * var(--icon-ch));
  display:flex;flex-direction:column;align-items:center;
  gap:5px;cursor:pointer;
  width:84px;padding:6px 4px;
  border:1px dotted transparent;
  user-select:none;
  z-index:4;
  transition:transform 0.12s ease;
}
.desk-icon:hover{ transform:translateY(-2px); }
.desk-icon:hover .desk-icon-img{
  filter:drop-shadow(0 0 6px rgba(255,200,120,0.55)) drop-shadow(0 2px 0 rgba(0,0,0,0.4)) brightness(1.12);
}
.desk-icon:hover .desk-icon-label{
  color:#ffe5b8;
  text-shadow:1px 1px 0 #000, 0 0 8px rgba(255,180,90,0.7);
}
.desk-icon:active .desk-icon-img{ transform:translateY(1px); }
.desk-icon.selected{
  background:rgba(217,155,63,0.18);
  border:1px dotted rgba(255,210,140,0.65);
  box-shadow:inset 0 0 12px rgba(217,155,63,0.15);
}
.desk-icon-img{
  width:48px;height:48px;
  display:flex;align-items:center;justify-content:center;
  filter:drop-shadow(0 2px 0 rgba(0,0,0,0.45));
  transition:filter 0.15s ease, transform 0.15s ease;
}
/* PNGs 96px exibidos a 48px (2x): escala suave, sem pixelated */
.desk-icon-img img{ width:48px;height:48px;display:block; }
.desk-icon-label{
  font-size:11px;color:#fff;
  text-align:center;
  line-height:1.15;
  text-shadow:1px 1px 0 #000, 1px 1px 2px #000;
  font-family:Tahoma, 'MS Sans Serif', sans-serif;
  letter-spacing:0;
  word-break:break-word;
}

/* TASKBAR — WinXP Luna style */
/* TASKBAR */
#taskbar{
  position:fixed;bottom:0;left:0;right:0;
  height:30px;
  background:
    linear-gradient(180deg,
      #4a3320 0%,
      #6e4a2a 3%,
      #5a3a20 6%,
      #4a2e18 10%,
      #3a2410 50%,
      #2e1c0a 90%,
      #1a1006 100%);
  border-top:1px solid #6a4220;
  display:flex;align-items:stretch;
  padding:0;z-index:200;
  font-family:Tahoma, 'MS Sans Serif', sans-serif;
  box-shadow:inset 0 1px 0 rgba(255,210,140,0.35), 0 -2px 8px rgba(0,0,0,0.5);
}
#start-btn{
  position:relative;
  background:
    linear-gradient(180deg,
      #d49a55 0%,
      #e8b270 12%,
      #c0832f 30%,
      #8a5a1c 70%,
      #5e3c10 95%,
      #3d2608 100%);
  border:none;
  border-right:1px solid #2a1808;
  color:#fff;font-family:Tahoma, 'MS Sans Serif', sans-serif;
  font-size:15px;font-style:italic;font-weight:bold;
  padding:0 28px 0 12px;cursor:pointer;
  display:flex;align-items:center;gap:6px;
  border-radius:0 12px 12px 0;
  text-shadow:1px 1px 1px rgba(0,0,0,0.6);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.35), inset -1px 0 0 rgba(0,0,0,0.2);
  height:30px;
  letter-spacing:0;
}
#start-btn:hover{
  background:
    linear-gradient(180deg,
      #e4aa65 0%,
      #f8c280 12%,
      #d09340 30%,
      #9a6a2c 70%,
      #6e4c20 95%,
      #4d3618 100%);
}
#start-btn:active{ box-shadow:inset 0 2px 4px rgba(0,0,0,0.3); }

/* Idol silhouette logo on start button */
.start-flag{
  width:22px;height:22px;
  display:inline-block;
  flex-shrink:0;
  background-image:url('../assets/idol-silhouette.png');
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  filter:drop-shadow(0 0 4px rgba(255,200,120,0.8)) drop-shadow(1px 1px 0 rgba(0,0,0,0.5));
  animation:idolPulse 2.4s ease-in-out infinite;
}
@keyframes idolPulse{
  0%, 100%{ filter:drop-shadow(0 0 3px rgba(255,200,120,0.5)) drop-shadow(1px 1px 0 rgba(0,0,0,0.5)); }
  50%     { filter:drop-shadow(0 0 7px rgba(255,220,150,0.95)) drop-shadow(1px 1px 0 rgba(0,0,0,0.5)); }
}
#start-btn:hover .start-flag{
  animation:idolPulse 1s ease-in-out infinite;
  transform:scale(1.08);
}

.tb-divider{
  width:1px;background:#0a2870;
  box-shadow:1px 0 0 rgba(255,255,255,0.18);
}
#tb-items{
  display:flex;align-items:center;gap:3px;
  padding:0 6px;flex:1;min-width:0;
  overflow:hidden;
}
.tb-item{
  background:
    linear-gradient(180deg,
      #c08850 0%,
      #a0682a 8%,
      #8a5420 50%,
      #6a3e18 100%);
  border:1px solid #2a1808;
  border-top-color:#d09858;
  border-left-color:#d09858;
  color:#fff;font-family:Tahoma, 'MS Sans Serif', sans-serif;
  font-size:11px;padding:0 8px;cursor:pointer;
  display:flex;align-items:center;gap:6px;
  min-width:160px;max-width:200px;height:22px;
  border-radius:2px;
  text-shadow:1px 1px 1px rgba(0,0,0,0.4);
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.tb-item:hover{
  background:linear-gradient(180deg,#d09860 0%,#b07838 8%,#9a6428 50%,#7a4e20 100%);
}
.tb-item.active{
  background:linear-gradient(180deg,#3a2410 0%,#5a3818 8%,#7a4e20 50%,#9a6428 100%);
  box-shadow:inset 1px 1px 2px rgba(0,0,0,0.5);
  border-color:#2a1808;
  border-top-color:#2a1808;
  border-left-color:#2a1808;
}
.tb-item-text{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; flex:1; }
#tb-tray{
  display:flex;align-items:center;gap:8px;
  background:
    linear-gradient(180deg,
      #c87830 0%,
      #a05a18 30%,
      #804410 70%,
      #5a2e08 100%);
  padding:0 10px 0 12px;
  border-left:1px solid #2a1808;
  box-shadow:inset 1px 0 0 rgba(255,210,140,0.3);
  height:30px;
  color:#fff;font-size:11px;
  text-shadow:1px 1px 1px rgba(0,0,0,0.5);
}
#tb-tray .tb-icon{ width:16px;height:16px;display:flex;align-items:center;justify-content:center; }
#tb-time-txt{ font-size:11px; }
#tb-lang{
  font-size:11px;font-weight:bold;
  background:#fff;color:#000;
  padding:0 4px;border-radius:1px;
  text-shadow:none;
  font-family:Tahoma,sans-serif;
  border:1px solid #888;
}

/* ── XP Start Menu ── */
#start-menu{
  position:fixed;bottom:36px;left:0;
  width:420px;
  background:#fff;
  border:1px solid #0a246a;
  border-radius:8px 8px 0 0;
  box-shadow:4px -4px 16px rgba(0,0,0,0.55);
  z-index:9990;
  overflow:hidden;
  font-family:Tahoma,'MS Sans Serif',Arial,sans-serif;
  font-size:12px;
  user-select:none;
}
/* Header */
#sm-header{
  background:linear-gradient(180deg,#c97820 0%,#7a3a08 100%);
  display:flex;align-items:center;gap:10px;
  padding:8px 12px 6px;
  border-bottom:2px solid #5a2a04;
}
#sm-avatar{
  width:44px;height:44px;border-radius:3px;
  background:#5a2a04;overflow:hidden;
  border:2px solid rgba(255,255,255,0.4);flex-shrink:0;
}
#sm-username{
  color:#fff;font-size:14px;font-weight:bold;
  text-shadow:1px 1px 2px rgba(0,0,0,0.7);
  letter-spacing:0.5px;
}
/* Body */
#sm-body{display:flex;height:330px;}
/* Left column */
#sm-left{
  width:220px;background:#fff;
  border-right:1px solid #c0c0c0;
  display:flex;flex-direction:column;
  overflow:hidden;
}
.sm-pin-row{padding:6px 4px 2px;}
.sm-pin-item{
  display:flex;align-items:center;gap:8px;
  padding:5px 8px;cursor:pointer;border-radius:3px;
  line-height:1.3;
}
.sm-pin-item:hover{background:#316ac5;color:#fff;}
.sm-pin-item:hover .sm-pin-label span{color:rgba(255,255,255,0.75);}
.sm-pin-icon{font-size:26px;width:32px;text-align:center;flex-shrink:0;display:flex;align-items:center;justify-content:center;}
.sm-pin-icon img{width:30px;height:30px;display:block;}
.sm-pin-label{font-size:11px;color:#000;}
.sm-pin-label b{font-size:12px;}
.sm-pin-label span{color:#666;font-size:10px;}
.sm-sep-dots{
  border-top:1px dotted #c0c0c0;
  margin:4px 8px;
}
.sm-section-label{
  font-size:10px;color:#666;padding:3px 10px 1px;
  letter-spacing:0.5px;text-transform:uppercase;
}
.sm-item{
  padding:4px 8px 4px 22px;cursor:pointer;
  display:flex;align-items:center;gap:6px;
  font-size:12px;color:#000;
}
.sm-item:hover{background:#316ac5;color:#fff;}
.sm-icon{font-size:14px;display:inline-flex;align-items:center;justify-content:center;width:18px;flex-shrink:0;}
.sm-icon img{width:16px;height:16px;display:block;}
#sm-all-progs{
  margin-top:auto;
  position:relative;
}
#sm-all-btn{
  display:flex;align-items:center;padding:5px 10px;
  background:#d8e4f8;border-top:1px solid #c0c0c0;
  cursor:pointer;font-weight:bold;font-size:12px;color:#000;
}
#sm-all-btn:hover{background:#316ac5;color:#fff;}
#sm-allprog-fly{
  position:absolute;bottom:100%;left:100%;
  width:180px;background:#d8e4f8;
  border:1px solid #0a246a;box-shadow:3px -2px 8px rgba(0,0,0,0.35);
}
.sm-fly-item{padding:5px 12px;cursor:pointer;font-size:12px;color:#000;display:flex;align-items:center;gap:6px;}
.sm-fly-ico{width:16px;height:16px;flex-shrink:0;}
.sm-fly-item:hover{background:#316ac5;color:#fff;}
/* Right column */
#sm-right{
  flex:1;background:#d8e4f8;
  display:flex;flex-direction:column;
  padding:6px 0;
  overflow-y:auto;
}
.sm-right-item{
  display:flex;align-items:center;gap:7px;
  padding:4px 10px;cursor:pointer;font-size:12px;color:#000;
  white-space:nowrap;
}
.sm-right-item:hover{background:#316ac5;color:#fff;}
.sm-ri-icon{font-size:16px;width:20px;text-align:center;flex-shrink:0;display:flex;align-items:center;justify-content:center;}
.sm-ri-icon img{width:18px;height:18px;display:block;}
.sm-sep-line{height:1px;background:#a0b8d8;margin:3px 8px;}
.sm-dim{opacity:0.75;}
/* Footer */
#sm-footer{
  background:linear-gradient(180deg,#1248a8 0%,#0a246a 100%);
  display:flex;justify-content:flex-end;gap:6px;
  padding:5px 8px;border-top:2px solid #0a246a;
}
.sm-foot-btn{
  background:linear-gradient(180deg,#4a7cd8,#2858b0);
  border:1px solid #0a246a;border-top-color:#6a9ae8;
  color:#fff;font-family:Tahoma,Arial,sans-serif;font-size:11px;
  padding:3px 10px;cursor:pointer;border-radius:3px;
  display:flex;align-items:center;gap:4px;
}
.sm-foot-btn:hover{background:linear-gradient(180deg,#6090e8,#3868c8);}
.sm-foot-btn:active{box-shadow:inset 0 1px 3px rgba(0,0,0,0.4);}

#desk-ctx{
  position:fixed;display:none;z-index:9999;
  background:#d4d0c8;border:2px solid;
  border-color:#fff #808080 #808080 #fff;
  box-shadow:2px 2px 4px rgba(0,0,0,0.5);
  font-family:'Tahoma','Arial',sans-serif;font-size:11px;min-width:160px;
  padding:2px 0;
}
#desk-ctx .dctx-item{
  padding:4px 20px 4px 24px;cursor:default;color:#000;white-space:nowrap;
}
#desk-ctx .dctx-item:hover{background:#316ac5;color:#fff;}
#desk-ctx .dctx-sep{height:1px;background:#808080;margin:2px 0;}
