/* Shared Windows 98 chrome: ONE window component, used by the desktop (desktop.css) and by every Win98-framed
   inner page (win98.css). A window is always:
     .win > .tb (.tb-ico .tb-title .tb-btns | .tb-close) [optional .menu] > .body
   The desktop gives .win a position and drag (desktop.css); an inner page uses .win as the whole page frame, so a
   page looks the same whether it is opened as a desktop window or visited on its own. */
:root{--raised:inset -1px -1px #000,inset 1px 1px #dfdfdf,inset -2px -2px #808080,inset 2px 2px #fff;--sunk:inset -1px -1px #fff,inset 1px 1px #808080,inset -2px -2px #dfdfdf,inset 2px 2px #000;--field:inset -1px -1px #dfdfdf,inset 1px 1px #808080,inset -2px -2px #fff,inset 2px 2px #000;--face:#c0c0c0;--navy:#000080;--ink:#000;--hl:#0000c0;--tb-on:linear-gradient(90deg,#000080,#1084d0);--tb-off:linear-gradient(90deg,#5a5a5a,#767676);--tb-ink:#fff;--paper:#fff;--ui:Tahoma,"MS Sans Serif",Arial,sans-serif}
::selection{background:var(--navy);color:#fff}
[hidden]{display:none!important}

.win{display:flex;flex-direction:column;background:var(--face);box-shadow:var(--raised),3px 4px 0 #0007;padding:4px;outline:none}
.win[hidden]{display:none}
.win .tb{background:var(--tb-off);color:var(--tb-ink);font-weight:700;padding:3px 4px;display:flex;align-items:center;gap:6px;font-size:12px;user-select:none;touch-action:none;cursor:default}
.win.active .tb,.win.max .tb{background:var(--tb-on);color:var(--tb-ink)}
.tb-ico{width:16px;height:16px;shape-rendering:crispEdges;flex:none}
.tb-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tb-btns{margin-left:auto;display:flex;gap:2px}
.tb-btns button,.tb-close{width:18px;height:16px;background:var(--face);border:0;box-shadow:var(--raised);color:var(--ink);font:700 10px/1 var(--ui);padding:0;cursor:pointer;display:grid;place-items:center;text-decoration:none}
.tb-btns button:active,.tb-close:active{box-shadow:var(--sunk);padding:2px 0 0 2px}
.menu{display:flex;gap:14px;padding:3px 6px}
.win .body{margin:2px;background:var(--paper);color:var(--ink);box-shadow:var(--field);padding:14px;overflow:auto;line-height:1.5;font-size:13px}
.win .body.app{padding:0;height:min(var(--h,480px),calc(100dvh - 100px));background:#2c2c3a;overflow:hidden}
.win .body.app iframe{display:block;width:100%;height:100%;border:0}
.win.max .body{flex:1;min-height:0}
.win.max .body.app{height:auto}
.win .body h2{font:700 18px var(--ui);letter-spacing:.5px;margin-bottom:8px}
.win .body p{margin-bottom:10px}
.win .body a{color:var(--hl)}
.small{color:var(--ink);font-size:12px}
.empty{text-align:center;color:var(--ink);padding:16px 0}

/* taskbar: ONE bar shared by the desktop and every Win98 page — same box, Start button, clock and focus ring.
   The desktop adds window buttons (.tbtn, desktop.css); an inner page adds the "you are here" title (.w98-here, win98.css). */
.task{position:fixed;left:0;right:0;bottom:0;height:34px;z-index:9000;display:flex;align-items:center;gap:4px;padding:3px;background:var(--face);color:var(--ink);box-shadow:inset 0 2px #fff,inset 0 1px #dfdfdf}
.start{font:700 13px var(--ui);display:flex;gap:5px;align-items:center;height:28px;padding:3px 10px;background:var(--face);color:var(--ink);border:0;box-shadow:var(--raised);cursor:pointer;white-space:nowrap}
.start[aria-expanded="true"]{box-shadow:var(--sunk);padding:4px 9px 2px 11px}
.sm-ico{width:18px;height:18px;shape-rendering:crispEdges;flex:none}
.tasks{display:flex;gap:4px;flex:1;min-width:0;overflow:hidden}
.tray{margin-left:auto;box-shadow:var(--field);padding:5px 12px;font:12px var(--ui);color:var(--ink);white-space:nowrap}
.task a:focus-visible,.start:focus-visible{outline:1px dotted var(--ink);outline-offset:-4px}