/* ===== WIN95 CHROME (shared across subpages; extracted from the per-page
   copies, which were byte-identical). Drift fixes applied here once:
   --chrome-d is now defined (it was referenced but never declared, so the
   menu dividers silently dropped), and the dead animation references
   (risopulse, botbarScroll — keyframes that never existed) are removed. */
:root{
  --chrome-d:#b9af98; /* dark chrome tone for menu dividers */
}
  .topbar{
    position:fixed;top:0;left:0;right:0;height:34px;z-index:60;
    background:var(--chrome);
    background-image:
      radial-gradient(circle at 1px 1px, rgba(26,23,20,.1) .5px, transparent 1px);
    background-size:4px 4px;
    border-bottom:2px solid var(--bar);
    display:flex;justify-content:space-between;align-items:center;
    padding:0 4px;
    box-shadow: inset 0 1px 0 var(--chrome-l), 0 2px 0 rgba(26,23,20,.25);
  }
  .topbar .left{display:flex;gap:4px;align-items:center}
  .chrome-hamburger{
    display:none;
    background:var(--bar);padding:0 8px;height:22px;align-items:center;justify-content:center;
    font-family:var(--cut);font-size:13px;font-weight:400;color:var(--paper);
    border:2px solid var(--bar);letter-spacing:.08em;
  }
  .chrome-hamburger:active{background:var(--riso-pink);color:var(--bar)}
  .menu-panel{
    display:none;
    position:fixed;bottom:46px;left:4px;z-index:70;
    width:300px;max-width:calc(100vw - 8px);
    background:var(--paper);
    border:2.5px solid var(--bar);
    box-shadow:6px 6px 0 rgba(26,23,20,.5);
    font-family:var(--ms);font-size:13px;
    max-height:80vh;overflow:auto;
  }
    .menu-panel{ bottom:auto;top:34px;left:4px;right:4px;width:auto;max-width:none; }
  .menu-panel.open{display:block}
  .menu-panel .group-title{
    background:var(--bar);
    color:var(--riso-pink);padding:5px 8px;font-weight:400;font-size:11px;
    letter-spacing:.12em;text-transform:uppercase;font-family:var(--cut);
  }
  .menu-panel a, .menu-panel .menu-item{
    display:flex;align-items:center;gap:10px;
    padding:9px 12px;color:var(--bar);text-decoration:none;
    border-bottom:1px dashed var(--chrome-d);
    background:var(--paper);font-size:13px;
  }
  .menu-panel a:hover, .menu-panel .menu-item:hover{
    background:var(--riso-pink);color:var(--bar);
  }
  .menu-panel .swatch{
    width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center;
    border:2px solid var(--bar);font-family:var(--cut);font-size:10px;flex-shrink:0;
    background:var(--riso-yellow);color:var(--bar);
  }
  .winbtn{
    display:inline-flex;align-items:center;gap:4px;
    height:22px;padding:0 10px;
    background:var(--riso-pink);
    border:2px solid var(--bar);
    font-family:var(--cut);font-size:11px;letter-spacing:.1em;color:var(--bar);
    text-transform:uppercase;
  }
    .winbtn{font-size:10px;padding:0 7px}
  .winbtn:active{background:var(--riso-orange)}
  a.winbtn{cursor:pointer;text-decoration:none}
  a.winbtn:hover{background:var(--riso-yellow);color:var(--ink)}
  .topbar .right{display:flex;gap:6px;align-items:center;font-family:var(--type);font-size:11px}
    .topbar .right .audio-btn{display:none}
  .chrome-topnav{display:flex;gap:2px;align-items:center;margin-right:4px}
  .chrome-topnav a{
    display:inline-block;color:var(--bar);text-decoration:none;
    font-family:var(--cut);font-size:12px;letter-spacing:.06em;text-transform:uppercase;
    padding:3px 9px;border:2px solid var(--bar);background:var(--paper);
    line-height:1;
  }
  .chrome-topnav a:hover{background:var(--riso-pink);color:var(--ink);}
  .chrome-topnav a.active{background:var(--riso-pink);color:var(--ink);}
  .topbar .clock{
    background:var(--bar);padding:3px 8px;color:var(--riso-yellow);
    border:2px solid var(--bar);
    font-family:var(--type);
    font-variant-numeric:tabular-nums;
    min-width:58px;text-align:right;
  }
    .topbar .clock{min-width:auto}
  .audio-btn{
    background:var(--chrome);padding:3px 8px;font-family:var(--type);font-size:11px;
    border:2px solid var(--bar);color:var(--bar);
    text-transform:uppercase;letter-spacing:.05em;
  }
  .audio-btn.on{background:var(--riso-orange);color:var(--bar)}
  .botbar{
    position:fixed;bottom:0;left:0;right:0;height:42px;z-index:50;
    background:var(--chrome);
    background-image:radial-gradient(circle at 1px 1px, rgba(26,23,20,.1) .5px, transparent 1px);
    background-size:4px 4px;
    border-top:2.5px solid var(--bar);
    box-shadow:0 -2px 0 rgba(26,23,20,.25);
    display:flex;justify-content:space-between;align-items:center;
    padding:0 10px;
    font-family:var(--type);font-size:11px;color:var(--bar);
  }
  /* START is a real <button>; neutralize UA button extras and give it
     (and the hamburger) a visible keyboard-focus ring */
  .botbar .start{margin:0;font:inherit}
  .botbar .start:focus-visible,
  .chrome-hamburger:focus-visible{outline:2px solid var(--riso-pink);outline-offset:2px}
  .botbar .start{
    display:inline-flex;align-items:center;gap:9px;
    padding:7px 18px;font-family:var(--cut);font-size:17px;
    text-transform:uppercase;letter-spacing:.1em;color:var(--bar);
    background:var(--riso-pink);
    border:3px solid var(--bar);
    box-shadow:3px 3px 0 rgba(26,23,20,.45);
  }
  .botbar .start:hover{background:var(--riso-orange);transform:translate(1px,1px);box-shadow:2px 2px 0 rgba(26,23,20,.45)}
  .botbar .start{cursor:pointer}
  .botbar .start.active{background:var(--riso-orange);box-shadow:inset 2px 2px 0 rgba(26,23,20,.4);transform:translate(3px,3px)}
  .botbar .start::before{
    content:"";display:block;width:16px;height:16px;
    background:var(--bar);
    border-radius:50%;
  }
  .botbar .copy{letter-spacing:.08em;text-transform:uppercase}
  .botbar .copy b{color:var(--riso-pink)}
    .botbar .copy{
      flex:1;min-width:0;overflow:hidden;white-space:nowrap;
      position:relative;height:100%;display:flex;align-items:center;
      margin-left:8px;
    }
    /* the footer line is static by design (the old botbarScroll marquee was
       never shipped; its keyframes don't exist) */
    .botbar .copy-scroll{
      display:inline-block;white-space:nowrap;padding-left:0;
      overflow:hidden;text-overflow:ellipsis;max-width:100%;
    }
  @media (max-width:1100px){
    .chrome-topnav{display:none}
    .chrome-hamburger{display:inline-flex}
    .topbar .right .audio-btn{display:none}
    .menu-panel{ bottom:auto;top:34px;left:4px;right:4px;width:auto;max-width:none; }
  }
  @media (min-width:1101px){
    .chrome-hamburger{display:none}
  }

  body{
    padding-top:34px; padding-bottom:42px;
    background-color:#241b2e;
    background-image:
      radial-gradient(ellipse 90% 60% at 50% 0%, rgba(255,107,31,.05) 0%, transparent 55%),
      linear-gradient(180deg,#2b2236,#241b2e 70%);
    background-attachment:fixed;
  }
