* { box-sizing: border-box; }
  body { margin: 0; font-family: "Microsoft Sans Serif", "MS Sans Serif", Tahoma, "Segoe UI", Geneva, sans-serif; font-size: 11px; color: #000; overflow: hidden; }
  .desktop { position: relative; height: 100vh; width: 100vw; overflow: hidden; background: #4a80c0; user-select: none; }
  #wall { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; image-rendering: pixelated; image-rendering: crisp-edges; }

  .raise { box-shadow: inset -1px -1px 0 #0a0a0a, inset 1px 1px 0 #fff, inset -2px -2px 0 #808080, inset 2px 2px 0 #dfdfdf; }
  .win-raise { box-shadow: inset -1px -1px 0 #0a0a0a, inset 1px 1px 0 #dfdfdf, inset -2px -2px 0 #808080, inset 2px 2px 0 #fff; }
  .sink { box-shadow: inset -1px -1px 0 #fff, inset 1px 1px 0 #808080, inset -2px -2px 0 #dfdfdf, inset 2px 2px 0 #0a0a0a; }

  .icons { position: absolute; top: 10px; left: 8px; display: flex; flex-direction: column; gap: 14px; }
  .icon { width: 78px; padding: 3px; text-align: center; cursor: pointer; }
  .icon .glyph { font-size: 32px; line-height: 1; }
  .icon .name { display: inline-block; margin-top: 3px; font-size: 11px; color: #fff; padding: 1px 2px; line-height: 1.25; }
  .icon.sel .glyph { filter: brightness(.7) sepia(1) hue-rotate(190deg) saturate(3); }
  .icon.sel .name { background: #000080; outline: 1px dotted #fff; }

  .win { position: absolute; width: 462px; background: #c0c0c0; padding: 3px; }
  .win-title { display: flex; align-items: center; gap: 5px; height: 20px; padding: 0 3px 0 3px; margin-bottom: 2px;
    background: #808080; color: #dcdcdc; cursor: move; }
  .win.foc > .win-title { background: #000080; color: #fff; }
  .win-title .ic { font-size: 13px; }
  .win-title .t { flex: 1; font-weight: bold; font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .tb-btns { display: flex; gap: 2px; }
  .tb-btn { width: 16px; height: 14px; padding: 0; background: #c0c0c0; cursor: pointer; display: flex; align-items: center; justify-content: center; border: none; font-size: 10px; font-weight: bold; color: #000;
    box-shadow: inset -1px -1px 0 #0a0a0a, inset 1px 1px 0 #fff, inset -2px -2px 0 #808080, inset 2px 2px 0 #dfdfdf; }
  .tb-btn:active { box-shadow: inset -1px -1px 0 #fff, inset 1px 1px 0 #0a0a0a, inset -2px -2px 0 #dfdfdf, inset 2px 2px 0 #808080; }
  .tb-close { margin-left: 2px; }
  .g-min { width: 6px; height: 2px; background: #000; display: block; margin-top: 6px; }
  .g-max { width: 9px; height: 8px; border: 1px solid #000; border-top-width: 2px; display: block; }

  .win-menu { display: flex; gap: 14px; padding: 2px 4px 3px; font-size: 11px; }
  .win-menu u { text-decoration: none; }
  .win-menu span { cursor: default; }
  .win-menu span:hover { background: #000080; color: #fff; padding: 0 2px; margin: 0 -2px; }
  .win-body { padding: 12px; display: flex; gap: 13px; background: #c0c0c0; }
  .art { width: 128px; height: 128px; flex: none; padding: 2px; background: #c0c0c0; }
  .art > div { width: 100%; height: 100%; }
  .art-misprint { background: repeating-linear-gradient(0deg,#e9e6dd 0 6px,#c9c6bb 6px 8px), radial-gradient(circle at 50% 55%, rgba(0,0,0,.5), rgba(0,0,0,0) 60%); }
  .art-infrared { background: radial-gradient(circle at 50% 55%, #fff 4%, #ffd23f 16%, #ff7bd5 34%, #b23df0 52%, #3b1e8f 74%, #05010f 100%); }
  .info h2 { margin: 0 0 3px; font-size: 16px; font-weight: bold; color: #000080; text-transform: uppercase; letter-spacing: .5px; }
  .info .tag { margin: 0 0 6px; font-size: 11px; color: #000; }
  .info .req { margin: 0 0 10px; font-size: 11px; color: #404040; }
  .info .req b { color: #000080; }
  .price { font-size: 18px; font-weight: bold; color: #000; }
  .price small { font-size: 11px; font-weight: normal; color: #404040; }
  .price s { color: #808080; font-weight: normal; }
  .badge { display: inline-block; font-size: 10px; padding: 1px 5px; margin-left: 6px; vertical-align: middle; background: #008080; color: #fff; }
  .badge.soon { background: #808000; }
  .feat { margin: 10px 0 0; padding: 0; list-style: none; font-size: 11px; }
  .feat li { padding: 2px 0 2px 14px; position: relative; }
  .feat li::before { content: "\25AA"; position: absolute; left: 0; color: #000080; }
  .row { display: flex; gap: 8px; margin-top: 13px; align-items: center; }
  .btn95 { font-family: inherit; font-size: 11px; padding: 5px 14px; min-width: 84px; background: #c0c0c0; color: #000; cursor: pointer; border: none; text-decoration: none; text-align: center;
    box-shadow: inset -1px -1px 0 #0a0a0a, inset 1px 1px 0 #fff, inset -2px -2px 0 #808080, inset 2px 2px 0 #dfdfdf; }
  .btn95:active { box-shadow: inset -1px -1px 0 #fff, inset 1px 1px 0 #0a0a0a, inset -2px -2px 0 #dfdfdf, inset 2px 2px 0 #808080; }
  .btn95.def { font-weight: bold; outline: 1px solid #000; outline-offset: 1px; }
  .btn95[disabled] { color: #808080; text-shadow: 1px 1px 0 #fff; cursor: default; }
  .win-status { display: flex; gap: 3px; margin-top: 3px; padding: 1px; }
  .win-status .cell { padding: 2px 6px; font-size: 11px; color: #000;
    box-shadow: inset -1px -1px 0 #fff, inset 1px 1px 0 #808080; }
  .win-status .cell.grow { flex: 1; }

  .taskbar { position: absolute; left: 0; bottom: 0; width: 100%; height: 28px; display: flex; align-items: center; gap: 4px; padding: 2px; background: #c0c0c0;
    box-shadow: inset 0 1px 0 #fff, inset 0 2px 0 #dfdfdf; }
  .startbtn { display: flex; align-items: center; gap: 4px; height: 22px; padding: 0 7px 0 4px; font-weight: bold; font-size: 11px; cursor: pointer; background: #c0c0c0;
    box-shadow: inset -1px -1px 0 #0a0a0a, inset 1px 1px 0 #fff, inset -2px -2px 0 #808080, inset 2px 2px 0 #dfdfdf; }
  .startbtn.on { box-shadow: inset -1px -1px 0 #fff, inset 1px 1px 0 #0a0a0a, inset -2px -2px 0 #dfdfdf, inset 2px 2px 0 #808080; }
  .flag { width: 16px; height: 14px; position: relative; }
  .flag i { position: absolute; width: 7px; height: 6px; }
  .flag i:nth-child(1){ left:0; top:0; background:#f23030; } .flag i:nth-child(2){ right:0; top:0; background:#3ba53b; }
  .flag i:nth-child(3){ left:0; bottom:0; background:#3b7ee0; } .flag i:nth-child(4){ right:0; bottom:0; background:#f2c02e; }
  .tdiv { width: 2px; height: 22px; box-shadow: inset -1px 0 0 #fff, inset 1px 0 0 #808080; margin: 0 2px; }
  .tasks { flex: 1; display: flex; align-items: center; gap: 3px; min-width: 0; }
  .task { display: flex; align-items: center; gap: 6px; max-width: 168px; height: 22px; padding: 0 7px; font-size: 11px; cursor: pointer; background: #c0c0c0;
    box-shadow: inset -1px -1px 0 #0a0a0a, inset 1px 1px 0 #fff, inset -2px -2px 0 #808080, inset 2px 2px 0 #dfdfdf; white-space: nowrap; overflow: hidden; }
  .task .lbl { overflow: hidden; text-overflow: ellipsis; }
  .task.active { font-weight: bold; box-shadow: inset -1px -1px 0 #fff, inset 1px 1px 0 #0a0a0a, inset -2px -2px 0 #dfdfdf, inset 2px 2px 0 #808080; }
  .tray { display: flex; align-items: center; gap: 8px; height: 22px; padding: 0 8px; font-size: 11px;
    box-shadow: inset -1px -1px 0 #fff, inset 1px 1px 0 #808080; }

  .startmenu { position: absolute; left: 2px; bottom: 28px; width: 262px; display: none; background: #c0c0c0; padding: 3px;
    box-shadow: inset -1px -1px 0 #0a0a0a, inset 1px 1px 0 #fff, inset -2px -2px 0 #808080, inset 2px 2px 0 #dfdfdf; }
  .startmenu.open { display: flex; }
  .sm-side { width: 28px; flex: none; background: #000080; position: relative; }
  .sm-side span { position: absolute; bottom: 8px; left: 50%; transform: translateX(-50%) rotate(-90deg); transform-origin: center; white-space: nowrap; color: #c0c0c0; font-size: 15px; font-weight: bold; }
  .sm-side span b { color: #fff; font-size: 19px; }
  .sm-list { flex: 1; padding: 1px; }
  .sm-item { display: flex; align-items: center; gap: 9px; padding: 4px 16px 4px 6px; cursor: pointer; color: #000; }
  .sm-item .g { font-size: 20px; width: 24px; text-align: center; }
  .sm-item b { font-weight: normal; font-size: 12px; }
  .sm-item .arw { margin-left: auto; font-size: 10px; }
  .sm-item:hover { background: #000080; color: #fff; }
  .sm-sep { height: 2px; margin: 3px 2px; box-shadow: inset 0 1px 0 #808080, inset 0 -1px 0 #fff; }

  .art .thermal { width: 100%; height: 100%; display: block; }
  .doc { width: 384px; }
  .doc-body { margin: 2px; padding: 9px 12px; background: #fff; height: 250px; overflow: auto; }
  .doc-body pre { margin: 0; font-family: "Courier New", "Lucida Console", monospace; font-size: 12px; line-height: 1.5; white-space: pre-wrap; color: #000; }
  .nameplate { position: absolute; right: 12px; bottom: 38px; text-align: right; line-height: 1.25; pointer-events: none; user-select: none;
    color: #0c5c5c; font-size: 12px; text-shadow: 1px 1px 0 rgba(255,255,255,.18); }
  .nameplate b { display: block; font-size: 22px; font-weight: bold; letter-spacing: 1px; color: #eaf5f5; text-shadow: 2px 2px 0 rgba(0,0,0,.28); }

  #boot { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center;
    background: radial-gradient(circle at 50% 38%, #0c5757, #021616 78%); transition: opacity .55s ease; cursor: pointer; }
  #boot.hide { opacity: 0; pointer-events: none; }
  .boot-inner { display: flex; flex-direction: column; align-items: center; }
  .boot-logo { width: 128px; height: 128px; filter: drop-shadow(0 5px 12px rgba(0,0,0,.55)); }
  .boot-word { margin-top: 18px; font-size: 46px; font-weight: 900; letter-spacing: 1px; line-height: 1;
    font-family: "Arial Black", "Arial", sans-serif; color: #eafcfc; }
  .boot-word b { color: #ff7a2f; }
  .boot-sub { margin-top: 9px; font-size: 12px; letter-spacing: 3px; text-transform: uppercase; color: #7fd0d0; }
  .boot-bar { margin-top: 30px; width: 232px; height: 18px; padding: 2px; overflow: hidden; background: #021616;
    box-shadow: inset 1px 1px 0 #000, inset -1px -1px 0 #2a6f6f; }
  .boot-bar i { display: block; height: 100%; width: 44%;
    background: repeating-linear-gradient(90deg, #16b0b0 0 9px, transparent 9px 13px); animation: boot-march 1.05s linear infinite; }
  .boot-cap { margin-top: 12px; font-size: 12px; color: #bfeaea; }
  @keyframes boot-march { from { transform: translateX(-55%); } to { transform: translateX(285%); } }
  @media (prefers-reduced-motion: reduce) { .boot-bar i { animation: none; } #boot { transition: none; } }

  .fld input, .promo-in { border: none; background: #fff; font-family: inherit; color: #000;
    box-shadow: inset -1px -1px 0 #fff, inset 1px 1px 0 #808080, inset -2px -2px 0 #dfdfdf, inset 2px 2px 0 #0a0a0a; }
  .fld input:focus, .promo-in:focus { outline: 1px dotted #000; outline-offset: -3px; }
  .promo { display: flex; align-items: center; gap: 6px; margin-top: 9px; }
  .promo-in { width: 112px; font-size: 11px; padding: 3px 5px; }
  .promo-msg { font-size: 11px; }
  .promo-msg.ok { color: #007a2f; } .promo-msg.bad { color: #b00000; }

  .dlg { width: 344px; }
  .dlg-body { padding: 14px 15px 15px; }
  .dlg-lead { margin: 0 0 12px; font-size: 12px; line-height: 1.45; }
  .fld { display: block; margin-bottom: 10px; }
  .fld span { display: block; margin-bottom: 3px; font-size: 11px; }
  .fld input { width: 100%; font-size: 12px; padding: 4px 6px; }
  .dlg-row { margin-top: 4px; }
  .dlg-msg { margin: 11px 0 0; font-size: 11px; min-height: 13px; }
  .dlg-msg.ok { color: #007a2f; } .dlg-msg.bad { color: #b00000; }
  .dlg-fine { margin: 12px 0 0; font-size: 10px; color: #606060; line-height: 1.45; }

  .tray-cart { display: inline-flex; align-items: center; gap: 3px; cursor: pointer; }
  .tray-cart b { font-weight: bold; font-variant-numeric: tabular-nums; }
  .glyph.tile-glyph { line-height: 0; }
  .glyph .tile { width: 34px; height: 34px; display: inline-block; vertical-align: middle; }

  .cart { width: 384px; }
  .cart-body { padding: 10px 12px 12px; }
  .cart-empty { margin: 6px 0 12px; font-size: 12px; color: #404040; }
  .cart-list { margin-bottom: 10px; }
  .cart-row { display: flex; align-items: center; gap: 9px; padding: 6px 3px; box-shadow: inset 0 -1px 0 #a8a8a8; }
  .cart-row .ci { font-size: 22px; width: 26px; text-align: center; }
  .cart-row .cn { flex: 1; display: flex; flex-direction: column; line-height: 1.25; }
  .cart-row .cn small { color: #505050; font-size: 10px; }
  .cart-row .cq { font-size: 11px; color: #303030; font-variant-numeric: tabular-nums; }
  .cart-row .cp { font-size: 12px; font-weight: bold; min-width: 56px; text-align: right; font-variant-numeric: tabular-nums; }
  .cart-row .cx { border: none; background: #c0c0c0; width: 18px; height: 18px; margin-left: 3px; cursor: pointer; font-size: 10px; color: #000;
    box-shadow: inset -1px -1px 0 #0a0a0a, inset 1px 1px 0 #fff, inset -2px -2px 0 #808080, inset 2px 2px 0 #dfdfdf; }
  .cart-row .cx:active { box-shadow: inset -1px -1px 0 #fff, inset 1px 1px 0 #0a0a0a, inset -2px -2px 0 #dfdfdf, inset 2px 2px 0 #808080; }
  .cart-promo { display: flex; align-items: center; gap: 6px; margin: 4px 0 12px; }
  .cart-promo .promo-in { width: 120px; }
  .cart-tot { display: flex; justify-content: space-between; font-size: 12px; padding: 2px 0; font-variant-numeric: tabular-nums; }
  .cart-tot.disc { color: #007a2f; }
  .cart-tot.grand { font-weight: bold; font-size: 14px; border-top: 1px solid #808080; margin-top: 4px; padding-top: 5px; }
  .cart-actions { margin-top: 12px; }