/* ============================================================
   WIN95 WINDOW MANAGER + DESKTOP APPS  —  PROTOTYPE
   Chrome states (focus/inactive/maximized), taskbar buttons,
   Start menu, and the shared app-content widgets (icon grids,
   list views, notepad, inbox). See js/win95-wm.js / win95-apps.js.
   ============================================================ */

/* ---- window focus states ---- */
.w95-window.inactive .w95-titlebar{
  background:linear-gradient(90deg,#808080,#b5b5b5);
}
.w95-window.maximized{ transition:none; }

/* ---- taskbar buttons ---- */
.w95-taskitem.on{
  box-shadow:inset 1px 1px 0 var(--w95-shadow), inset -1px -1px 0 #dfdfdf;
  background:repeating-conic-gradient(#fff 0% 25%, #dfdfdf 0% 50%) 0 0/4px 4px;
  font-weight:700;
}

/* ---- generic app window ---- */
.w95-app{ min-width:260px; min-height:140px; }
.w95-app-body{
  flex:1; margin:3px; display:flex; flex-direction:column; overflow:hidden;
  background:#fff;
  border:2px solid; border-color:var(--w95-shadow) var(--w95-light) var(--w95-light) var(--w95-shadow);
}
.w95-app-toolbar{
  flex:0 0 auto; display:flex; align-items:center; gap:8px;
  padding:3px 6px; background:var(--w95-face);
  border-bottom:1px solid var(--w95-shadow);
  font-size:11px;
}
.w95-path{ color:#000; }
.w95-btn{
  font-family:var(--w95-font); font-size:11px; color:#000;
  background:var(--w95-face); padding:2px 10px; cursor:pointer;
  border:2px solid; border-color:var(--w95-light) var(--w95-dark) var(--w95-dark) var(--w95-light);
  box-shadow:inset 1px 1px 0 #dfdfdf, inset -1px -1px 0 var(--w95-shadow);
}
.w95-btn:active{ box-shadow:inset -1px -1px 0 #dfdfdf, inset 1px 1px 0 var(--w95-shadow); }
.w95-btn[disabled]{ color:var(--w95-shadow); text-shadow:1px 1px 0 #fff; cursor:default; }
.w95-app-status{
  flex:0 0 auto; padding:3px 6px; font-size:11px; color:#000;
  background:var(--w95-face); border-top:1px solid var(--w95-shadow);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}

/* ---- icon grid (My Computer / Network / Recycle / Briefcase) ---- */
.w95-icon-grid{
  flex:1; overflow:auto; display:flex; flex-wrap:wrap; align-content:flex-start;
  gap:10px; padding:12px;
}
.w95-fsicon{
  width:86px; display:flex; flex-direction:column; align-items:center; gap:3px;
  text-align:center; cursor:default; user-select:none; padding:3px;
}
.w95-fsicon .glyph{ font-size:30px; line-height:34px; }
.w95-fsicon .label{ font-size:11px; color:#000; line-height:1.15; padding:1px 2px; word-break:break-word; }
.w95-fsicon.selected .label{ background:var(--w95-title); color:#fff; outline:1px dotted #fff; }

/* ---- notepad ---- */
.w95-notepad .w95-app-body{ background:#fff; }
.w95-notepad-text{
  flex:1; margin:0; padding:8px 10px; overflow:auto;
  font-family:"Consolas","Courier New",monospace; font-size:12px; line-height:1.4;
  color:#000; white-space:pre;
}

/* ---- inbox ---- */
.w95-inbox .w95-app-body{ background:#fff; }
.w95-mail-list{
  flex:0 0 45%; overflow:auto; border-bottom:2px solid var(--w95-shadow);
}
.w95-mail-row{
  display:flex; gap:10px; padding:4px 8px; font-size:12px; color:#000; cursor:default;
  border-bottom:1px solid #e4e4e4;
}
.w95-mail-row .mf{ flex:0 0 110px; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.w95-mail-row .ms{ flex:1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.w95-mail-row.selected{ background:var(--w95-title); color:#fff; }
.w95-mail-body{
  flex:1; margin:0; padding:8px 10px; overflow:auto;
  font-family:"Consolas","Courier New",monospace; font-size:12px; line-height:1.45;
  color:#000; white-space:pre-wrap; word-break:break-word;
}

/* ---- inbox compose (Write to Luke) ---- */
.w95-compose{
  flex:1; display:flex; flex-direction:column; gap:6px; padding:8px; background:#fff;
}
.w95-compose-row{ display:flex; align-items:center; gap:8px; }
.w95-compose-row label{ flex:0 0 64px; font-size:11px; color:#000; text-align:right; }
.w95-compose-row input{
  flex:1; font-family:"Consolas","Courier New",monospace; font-size:12px;
  padding:3px 6px; background:#fff; color:#000; outline:none;
  border:2px solid; border-color:var(--w95-shadow) var(--w95-light) var(--w95-light) var(--w95-shadow);
}
.w95-compose textarea{
  flex:1; resize:none; font-family:"Consolas","Courier New",monospace; font-size:12px;
  padding:6px; background:#fff; color:#000; outline:none;
  border:2px solid; border-color:var(--w95-shadow) var(--w95-light) var(--w95-light) var(--w95-shadow);
}
.w95-compose-actions{ display:flex; align-items:center; gap:8px; }
.w95-compose-status{ font-size:11px; color:#000; }
.w95-compose-status a{ color:#000080; }

/* ---- MSN gag dialog ---- */
.w95-msn .w95-app-body{ background:var(--w95-face); border:none; }
.w95-msn-body{ flex:1; display:flex; gap:14px; padding:14px; align-items:flex-start; }
.w95-msn-globe{ font-size:34px; }
.w95-msn-text{ font-size:12px; color:#000; line-height:1.4; }
.w95-msn-actions{ flex:0 0 auto; display:flex; justify-content:center; padding:8px; }

/* ---- ghost cursor: KIST visibly at the controls ---- */
.w95-ghost{
  position:absolute; z-index:15000; width:14px; height:22px;
  pointer-events:none; opacity:0; transition:opacity .5s ease;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='22'%3E%3Cpath d='M1 1 L1 16 L5 12.5 L8 19.5 L10.5 18.5 L7.5 11.5 L12.5 11.5 Z' fill='%23fff' stroke='%23000' stroke-width='1.4'/%3E%3C/svg%3E") no-repeat;
  image-rendering:pixelated;
}
.w95-ghost.press{ transform:scale(.85) translate(1px,1px); }

/* ---- deliberately primitive 1995 Perslis icon (chunky pixel orb) ---- */
.w95-icon .glyph.pixel-perslis{
  width:32px; height:32px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' shape-rendering='crispEdges'%3E%3Cg fill='%23001a0d'%3E%3Crect x='2' y='0' width='4' height='1'/%3E%3Crect x='1' y='1' width='1' height='1'/%3E%3Crect x='6' y='1' width='1' height='1'/%3E%3Crect x='0' y='2' width='1' height='4'/%3E%3Crect x='7' y='2' width='1' height='4'/%3E%3Crect x='1' y='6' width='1' height='1'/%3E%3Crect x='6' y='6' width='1' height='1'/%3E%3Crect x='2' y='7' width='4' height='1'/%3E%3C/g%3E%3Cg fill='%2300a844'%3E%3Crect x='2' y='1' width='4' height='1'/%3E%3Crect x='1' y='2' width='6' height='4'/%3E%3Crect x='2' y='6' width='4' height='1'/%3E%3C/g%3E%3Cg fill='%237dffb4'%3E%3Crect x='2' y='2' width='2' height='1'/%3E%3Crect x='2' y='3' width='1' height='1'/%3E%3C/g%3E%3Cg fill='%23056a2e'%3E%3Crect x='5' y='5' width='1' height='1'/%3E%3Crect x='4' y='6' width='2' height='1'/%3E%3C/g%3E%3C/svg%3E") no-repeat center/32px 32px;
  image-rendering:pixelated;
  filter:drop-shadow(1px 1px 0 rgba(0,0,0,.35));
}

/* ---- PAYRUN /95: the untouched DOS-blue legacy app ---- */
.w95-payrun .w95-app-body{ background:#0000a8; border-color:var(--w95-shadow) var(--w95-light) var(--w95-light) var(--w95-shadow); }
.w95-payrun-screen{
  flex:1; margin:0; padding:8px 10px; overflow:auto;
  font-family:"Consolas","Courier New",monospace; font-size:12px; line-height:1.35;
  color:#fff; background:#0000a8; white-space:pre;
}

/* ---- Start menu ---- */
.w95-startmenu{
  position:absolute; left:2px; bottom:32px; z-index:12000;
  display:none; min-width:220px;
  background:var(--w95-face);
  border:2px solid; border-color:var(--w95-light) var(--w95-dark) var(--w95-dark) var(--w95-light);
  box-shadow:2px 2px 0 rgba(0,0,0,.35);
}
.w95-startmenu.open{ display:flex; }
.sm-side{
  flex:0 0 24px; background:linear-gradient(180deg,var(--w95-title),var(--w95-title2));
  display:flex; align-items:flex-end; justify-content:center; padding:6px 0;
}
.sm-side span{
  color:#fff; font-weight:700; font-size:13px; letter-spacing:1px;
  writing-mode:vertical-rl; transform:rotate(180deg);
}
.sm-items{ flex:1; display:flex; flex-direction:column; padding:2px; overflow:visible; }
.sm-item{
  display:flex; align-items:center; gap:10px;
  padding:6px 10px; font-size:12px; color:#000; cursor:default; white-space:nowrap;
}
.sm-item:hover, .sm-item.hover{ background:var(--w95-title); color:#fff; }
.sm-icon{ width:20px; text-align:center; font-size:15px; }
.sm-sep{ height:0; border-top:1px solid var(--w95-shadow); border-bottom:1px solid var(--w95-light); margin:2px 4px; }

/* one flyout level (Programs ▸) */
.sm-item.sm-parent{ position:relative; }
.sm-arrow{ margin-left:auto; padding-left:14px; font-size:10px; }
.sm-flyout{
  display:none; position:absolute; left:100%; top:-4px; z-index:2; min-width:200px;
  background:var(--w95-face); padding:2px;
  border:2px solid; border-color:var(--w95-light) var(--w95-dark) var(--w95-dark) var(--w95-light);
  box-shadow:2px 2px 0 rgba(0,0,0,.35);
}
.sm-item.sm-parent:hover > .sm-flyout,
.sm-item.sm-parent.hover > .sm-flyout,
.sm-item.sm-parent.submenu-open > .sm-flyout{ display:block; }
.sm-flyout .sm-item{ color:#000; }
.sm-flyout .sm-item:hover,.sm-flyout .sm-item.hover{color:#fff}
.w95-program-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(82px,1fr));grid-auto-rows:min-content;gap:12px}.w95-program-grid .w95-fsicon{width:auto;min-width:0}.w95-program-grid .glyph{filter:drop-shadow(1px 1px 0 #888)}

/* ---- Executive View jump (taskbar tray) ---- */
.w95-exec{
  font-family:var(--w95-font); font-size:11px; color:#000;
  background:var(--w95-face); height:18px; padding:0 8px; cursor:pointer;
  border:2px solid; border-color:var(--w95-light) var(--w95-dark) var(--w95-dark) var(--w95-light);
  box-shadow:inset 1px 1px 0 #dfdfdf, inset -1px -1px 0 var(--w95-shadow);
  margin-right:4px;
}
.w95-exec:active{ box-shadow:inset -1px -1px 0 #dfdfdf, inset 1px 1px 0 var(--w95-shadow); }
.w95-mac{
  height:20px; margin-right:3px; padding:0 10px; cursor:pointer;
  border:2px solid; border-color:#f7fbff #273f67 #273f67 #f7fbff;
  background:linear-gradient(180deg,#eff7ff,#9dbde3); color:#071b36;
  font:bold 11px Arial,sans-serif; box-shadow:inset 1px 1px 0 #fff;
}
.w95-mac:hover{background:linear-gradient(180deg,#fff,#b9d8fb)}
.w95-mac:active{border-color:#273f67 #f7fbff #f7fbff #273f67;box-shadow:none}

/* ---- WinZip 6.3 working archive window ---- */
.w95-winzip .w95-app-body{background:#fff}.w95-winzip-toolbar{display:flex;gap:3px;padding:5px;background:var(--w95-face);border-bottom:1px solid var(--w95-shadow)}.w95-winzip-toolbar button{min-width:60px;padding:3px 5px;border:2px outset #eee;background:var(--w95-face);font:10px var(--w95-font)}.w95-winzip-toolbar button:active{border-style:inset}.w95-winzip-toolbar i{display:block;font-style:normal;font-size:18px}.w95-winzip-path{padding:4px 7px;background:#fff;border-bottom:1px solid #aaa;font:10px "Courier New",monospace}.w95-winzip-head,.w95-winzip-list button{display:grid;grid-template-columns:1.35fr 1fr 65px 78px;gap:6px;text-align:left}.w95-winzip-head{padding:3px 7px;background:var(--w95-face);border-bottom:1px solid #777;font:bold 10px Arial,sans-serif}.w95-winzip-list{flex:1;overflow:auto}.w95-winzip-list button{width:100%;padding:5px 7px;border:0;border-bottom:1px solid #eee;background:#fff;color:#000;font:10px Arial,sans-serif}.w95-winzip-list button.selected{background:var(--w95-title);color:#fff}.w95-winzip-eval{padding:4px 7px;background:#fff8c9;border-top:1px solid #b9a65a;color:#6d5300;font:9px Arial,sans-serif}

/* ---- Real era software in iframes (DOOM vendored, Tetris/Oregon via archive.org) ---- */
.w95-doom .w95-app-body{ background:#000; }
.w95-ia-app .w95-app-body{ background:#000; }

/* ---- About Perslis guide chat ---- */
.w95-guide .w95-app-body{ background:#fff; }
.w95-guide-log{ flex:1; overflow:auto; padding:10px; display:flex; flex-direction:column; gap:8px; }
.w95-guide-msg{
  font-size:12px; line-height:1.45; color:#000; white-space:pre-wrap;
  max-width:92%; padding:6px 9px;
}
.w95-guide-msg.guide{ background:#e9f4e9; border:1px solid #9ec99e; align-self:flex-start; }
.w95-guide-msg.you{ background:#e9edff; border:1px solid #9fa8cf; align-self:flex-end; }
.w95-guide-ask{
  flex:0 0 auto; display:flex; gap:6px; padding:6px;
  background:var(--w95-face); border-top:1px solid var(--w95-shadow);
}
.w95-guide-ask input{
  flex:1; font-family:"Consolas","Courier New",monospace; font-size:12px;
  padding:3px 6px; background:#fff; color:#000; outline:none;
  border:2px solid; border-color:var(--w95-shadow) var(--w95-light) var(--w95-light) var(--w95-shadow);
}