:root{
    --bg1:#1f3b6f;
    --bg2:#1e2a44;
    --grid-w:100px;
    --grid-h:100px;
    --desktop-padding:20px;
    --taskbar-height:48px;
  }
  html,body{
    height:100%;
    margin:0;
    font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
    background: #0b1222;
  }
  #desktop{
    position:relative;
    width:100%;
    height:calc(100vh - var(--taskbar-height));
    background: linear-gradient(180deg,var(--bg1),var(--bg2));
    overflow:hidden;
    user-select:none;
    padding: var(--desktop-padding);
    box-sizing:border-box;
  }
  .icon {
    position:absolute;
    width:var(--grid-w);
    height:var(--grid-h);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
    gap:6px;
    transform: translateZ(0);
    cursor:default;
    transition: transform 0.08s ease;
  }
  .icon .glyph{
    width:64px;
    height:64px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:36px;
    border-radius:8px;
    overflow:hidden;
    background: rgba(255,255,255,0.06);
  }
  /* NEW: icon image styling */
  .icon .glyph img{
    width:100%;
    height:100%;
    object-fit:contain;
    display:block;
    pointer-events:none;
    user-select:none;
  }

  .icon .label{
    font-size:13px;
    text-align:center;
    color:#fff;
    text-shadow: 0 1px 0 rgba(0,0,0,0.6);
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    width:100%;
    padding:0 4px;
  }
  .icon.dragging{ opacity:0.8; transform: scale(1.02); z-index:9999; }

  .ctxmenu{
    position:fixed;
    background:#fafafa;
    box-shadow:0 8px 24px rgba(0,0,0,0.3);
    border-radius:8px;
    padding:6px 0;
    min-width:180px;
    display:none;
    z-index:99999;
    color:#111;
  }
  .ctxmenu .item{ padding:8px 12px; cursor:pointer; font-size:14px; }
  .ctxmenu .item:hover{ background:rgba(0,0,0,0.06); }

  #taskbar{
    position:fixed; left:0; right:0; bottom:0; height:var(--taskbar-height);
    background: rgba(0,0,0,0.25); display:flex; align-items:center; gap:8px; padding:6px;
    box-sizing:border-box; backdrop-filter: blur(6px);
  }
  .start-btn{ width:42px; height:36px; display:flex; align-items:center; justify-content:center;
    border-radius:6px; cursor:pointer; color:#fff; border:1px solid rgba(255,255,255,0.06); }
  .start-btn:hover{ background: rgba(255,255,255,0.04); }

  #startMenu{
    position:fixed; left:8px; bottom: calc(var(--taskbar-height) + 8px); width:260px; max-height:60vh;
    background:linear-gradient(180deg,#ffffff,#f3f4f6); color:#111; border-radius:10px; box-shadow:0 16px 32px rgba(0,0,0,0.35);
    overflow:auto; display:none; z-index:99999; padding:8px;
  }
  #startMenu .entry{ display:flex; align-items:center; gap:12px; padding:8px; cursor:pointer; border-radius:6px; }
  #startMenu .entry:hover{ background: rgba(0,0,0,0.04); }
  .muted { color: #888; font-size:13px; }

  /* Terminal inner styles (applied inside WinBox mount) */
  .dev-term {
    width:100%;
    height:100%;
    display:flex;
    flex-direction:column;
    background:#000;
    color:#9f9;
    font-family: Menlo, Monaco, "Courier New", monospace;
    font-size:13px;
  }
  .dev-term .term-content{
    padding:10px; overflow:auto; flex:1; white-space:pre-wrap; word-break:break-word;
  }
  .dev-term .term-input{
    display:flex; gap:8px; align-items:center; padding:8px; border-top:1px solid rgba(255,255,255,0.02);
  }
  .dev-term .prompt{ min-width:36px; color:#6f6; }
  .dev-term input.cmd {
    flex:1; background:transparent; border:0; outline:none; color:#9f9; font-family:inherit;
    font-size:13px;
  }
  .term-line { color:#9f9; margin:2px 0; }
  .term-err { color:#ff6b6b; margin:2px 0; }
  .term-info { color:#9fd; margin:2px 0; opacity:0.9; }
  .term-meta { color:#6f6; opacity:0.8; font-size:12px; margin:6px 0 0; }

  /* Syntax highlighting tokens */
  .tok-punc { color:#b9f; }
  .tok-key  { color:#7aa2f7; }
  .tok-str  { color:#a8ff60; }
  .tok-num  { color:#6fd3ff; }
  .tok-bool { color:#ffcc66; }
  .tok-null { color:#aaa; }
  .tok-undef{ color:#aaa; font-style:italic; }
  .tok-fn   { color:#ffd580; }
  .tok-sym  { color:#d7afff; }
  .tok-spec { color:#9ad; }
  .tok-note { color:#999; font-style:italic; }
  .tok-ellipsis { color:#888; }