@font-face{
  font-family:"Franklin XP";
  src:local("Franklin Gothic Demi Italic"),url("fonts/framdit.ttf") format("truetype");
  font-display:swap;
}

:root{
  --ui:Tahoma,"Segoe UI",Verdana,Geneva,sans-serif;
  --title-font:"Trebuchet MS",Tahoma,sans-serif;
  --text:#1b1b1b;
  --text-dim:#5d5870;
  --link:#0b56d0;
  --link-hover:#d1418a;
  --pink:#e56aa5;
  --lilac:#9a7fe0;
  --groupbox:#d6cfe6;
  --sel:#316ac5;          /* XP selection highlight */
  --focus:#d1418a;        /* keyboard focus ring */
  --fav-bg:#fde6f1;       /* "favorite" highlight */
  --fav-line:#f3b6d3;
  --play-hi:#b8f58a;      /* green play buttons */
  --play:#3fae2a;
  --play-lo:#227a19;
  --taskbar-h:30px;
  --cursor:url("xp/cursor/default_arrow.png") 0 0, auto;
  --cursor-link:url("xp/cursor/default_link.png") 5 0, pointer;
}

*{box-sizing:border-box;}
html,body{height:100%;}
body{
  margin:0;
  font:11px/1.45 var(--ui);
  color:var(--text);
  background:#bcd3f2;
  cursor:var(--cursor);
  overflow-x:hidden;
}
a,button,summary,[role="button"]{cursor:var(--cursor-link);}
a{color:var(--link);}
a:hover{color:var(--link-hover);}
:focus-visible{outline:2px solid var(--focus);outline-offset:1px;}
img{display:block;}
p{margin:0 0 9px;}
p:last-child{margin-bottom:0;}

/* ---------- desktop + wallpaper ---------- */
.desktop{
  position:relative;
  min-height:100vh;
  padding:16px 16px calc(var(--taskbar-h) + 24px);
  display:flex;
  gap:20px;
  align-items:flex-start;
}
.wallpaper{position:fixed;inset:0;z-index:-1;background-size:cover;background-position:center;}
.wallpaper::after{content:"";position:absolute;inset:0;}
.wallpaper[data-wall="bliss"]{background-image:url("xp/wall/bliss.jpg");}
.wallpaper[data-wall="bliss"]::after{background:linear-gradient(160deg,rgba(255,190,225,.55),rgba(200,185,255,.35) 45%,rgba(190,255,230,.35));}
.wallpaper[data-wall="azul"]{background-image:url("xp/wall/azul.jpg");}
.wallpaper[data-wall="azul"]::after{background:linear-gradient(180deg,rgba(255,200,235,.45),rgba(215,200,255,.35));}
.wallpaper[data-wall="friend"]{background-image:url("xp/wall/friend.jpg");}
.wallpaper[data-wall="friend"]::after{background:rgba(255,220,240,.35);}
.wallpaper[data-wall="checker"]{
  background-color:#cfe1fb;
  background-image:
    linear-gradient(45deg,#dcebff 25%,transparent 25%,transparent 75%,#dcebff 75%),
    linear-gradient(45deg,#dcebff 25%,transparent 25%,transparent 75%,#dcebff 75%);
  background-size:64px 64px;
  background-position:0 0,32px 32px;
}

.icons{
  flex:0 0 84px;
  display:flex;
  flex-direction:column;
  gap:10px;
  position:sticky;
  top:16px;
}
.icon{
  width:84px;
  padding:4px 2px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:4px;
  text-decoration:none;
  color:#fff;
  text-align:center;
  text-shadow:1px 1px 1px #000,0 0 2px #3a2a55;
  font-size:11px;
  border:1px solid transparent;
}
.icon img{width:32px;height:32px;image-rendering:pixelated;}
.icon span{padding:0 2px;}
.icon:hover{color:#fff;}
.icon:hover span,.icon:focus-visible span,.icon[aria-current="page"] span{background:var(--sel);text-shadow:none;}
.icon[aria-current="page"] img{filter:drop-shadow(0 0 0 var(--sel)) brightness(.85) sepia(.3) hue-rotate(180deg);}

.windows{
  flex:1;
  min-width:0;
  display:grid;
  gap:18px;
  grid-template-columns:minmax(0,1fr) 330px;
  align-items:start;
  max-width:1080px;
  margin:0 auto;
}
.windows > .program{display:contents;}
.windows > .program[hidden]{display:none;}
.windows > .program > .win.wide{grid-column:1 / -1;}
.windows > .program > .col{display:grid;gap:18px;align-content:start;min-width:0;}

/* ---------- window chrome (sprites from the pack) ---------- */
.win{
  display:flex;
  flex-direction:column;
  min-width:0;
  filter:drop-shadow(2px 3px 4px rgba(60,30,90,.35));
  position:relative;
}
.win-title{
  height:29px;
  border-style:solid;
  border-width:0 8px;
  border-image:var(--title) 0 8 fill / 0 8px stretch;
  display:flex;
  align-items:center;
  gap:5px;
  padding:0 0 1px;
  color:#fff;
  font:bold 13px/1 var(--title-font);
  text-shadow:1px 1px 0 var(--title-shadow,#0a1f75);
  user-select:none;
  touch-action:none;
}
.win.inactive .win-title{border-image-source:var(--title-inactive);}
.win-title img{width:16px;height:16px;margin-left:-2px;}
.win-title h2{
  all:unset;
  flex:1;
  min-width:0;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}
.win-btns{display:flex;gap:2px;margin-right:-3px;}
.cb{
  width:21px;height:21px;
  border:0;padding:0;
  background:var(--cb) no-repeat;
}
.cb[data-act="min"]{--cb:var(--cb-min);}
.cb[data-act="min"]:hover{--cb:var(--cb-min-h);}
.cb[data-act="min"]:active{--cb:var(--cb-min-d);}
.cb[data-act="max"]{--cb:var(--cb-max);}
.cb[data-act="max"]:hover{--cb:var(--cb-max-h);}
.cb[data-act="max"]:active{--cb:var(--cb-max-d);}
.win.maxed .cb[data-act="max"]{--cb:var(--cb-restore);}
.win.maxed .cb[data-act="max"]:hover{--cb:var(--cb-restore-h);}
.cb[data-act="close"]{--cb:url("xp/luna/cb-close.png");}
.cb[data-act="close"]:hover{--cb:url("xp/luna/cb-close-hover.png");}
.cb[data-act="close"]:active{--cb:url("xp/luna/cb-close-down.png");}

.win-body{
  border-style:solid;
  border-width:0 5px 5px;
  border-image:var(--frame) 0 5 5 / 0 5px 5px;
  background:var(--body,#ece9d8);
  min-width:0;
}
.win.min .win-body{display:none;}
.win.closed{display:none;}
.win.maxed{
  position:fixed;
  inset:0 0 var(--taskbar-h) 0;
  z-index:40;
  filter:none;
}
.win.maxed .win-body{flex:1;overflow:auto;}
.win.dragged{position:fixed;z-index:30;margin:0;}

.win-inner{padding:12px 14px;}
.win-addr{
  display:flex;align-items:center;gap:6px;
  padding:3px 6px;
  border-bottom:1px solid #d7d2e4;
  background:linear-gradient(#fdfcff,#f1eef8);
  color:var(--text-dim);
}
.win-addr b{font-weight:normal;color:#7c7795;}
.win-addr .field{
  flex:1;min-width:0;
  display:flex;align-items:center;gap:4px;
  padding:1px 4px;
  background:#fff;
  border:1px solid #7f9db9;
  color:var(--text);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.win-addr .field img{width:16px;height:16px;flex:none;}
.win-status{
  display:flex;gap:2px;
  padding:2px 2px 0;
  background:var(--body,#ece9d8);
  border-top:1px solid #fff;
  color:var(--text-dim);
}
.win-status > span{
  flex:1;
  padding:1px 6px;
  border:1px solid;
  border-color:#d4d0c8 #fff #fff #d4d0c8;
}
.win-status > span:first-child{flex:3;}

/* ---------- explorer layout (side task pane + content) ---------- */
.explorer{display:flex;min-height:100%;}
.taskpane{
  flex:0 0 190px;
  padding:12px 10px;
  background:linear-gradient(var(--pane-a,#7ba2e7),var(--pane-b,#6375d6));
}
.pane-group{margin-bottom:12px;border-radius:3px 3px 0 0;overflow:hidden;}
.pane-group summary{
  list-style:none;
  display:flex;justify-content:space-between;align-items:center;
  padding:4px 10px;
  background:linear-gradient(90deg,#fff,var(--pane-head,#c6d3f7));
  color:var(--pane-ink,#215dc6);
  font-weight:bold;
}
.pane-group summary::-webkit-details-marker{display:none;}
.pane-group summary::after{
  content:"";width:17px;height:17px;border-radius:50%;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='9'%3E%3Cpath d='M1 5l3.5-3.5L8 5M1 8l3.5-3.5L8 8' fill='none' stroke='%23555' stroke-width='1.2'/%3E%3C/svg%3E") center no-repeat;
  box-shadow:0 0 0 1px #cbd3ea inset;
}
.pane-group:not([open]) summary::after{transform:rotate(180deg);}
.pane-group ul{
  list-style:none;margin:0;padding:8px 10px;
  background:var(--pane-body,#d6dff7);
}
.pane-group li{display:flex;align-items:center;gap:6px;padding:2px 0;}
.pane-group li img{width:16px;height:16px;flex:none;}
.pane-group a{color:var(--pane-ink,#215dc6);text-decoration:none;}
.pane-group a:hover{text-decoration:underline;color:var(--pane-ink,#215dc6);}
.pane-group .dim{color:#555;}
.explorer-main{flex:1;min-width:0;padding:12px 14px;background:#fff;}
.pane-details{display:flex;flex-direction:column;gap:2px;padding:8px 10px;background:var(--pane-body,#d6dff7);}
.pane-details img{width:64px;height:64px;margin-bottom:4px;border:1px solid #fff;outline:1px solid #b9a6ea;object-fit:cover;}
.pane-details span{color:#555;}

/* My Computer: grouped tile view */
.group-head{
  margin:0 0 8px;padding:0 0 3px;
  font:bold 12px var(--ui);color:var(--head-ink,#5a3d8c);
  border-bottom:1px solid;
  border-image:linear-gradient(90deg,var(--head-line,#b48ae6),transparent 85%) 1;
}
.group-head ~ .group-head{margin-top:16px;}
.home-intro p{margin:0 0 6px;}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:4px 10px;}
.tile{
  display:flex;align-items:center;gap:8px;
  padding:4px;
  border:1px solid transparent;
  color:var(--text);text-decoration:none;
}
.tile > img{width:32px;height:32px;flex:none;}
.tile .t{display:block;}
.tile .d{display:block;color:var(--text-dim);}
.tile:hover{color:var(--text);}
.tile:hover .t{text-decoration:underline;color:var(--link-hover);}
.tile:focus-visible{outline:2px solid var(--focus);}
.tile:active .t{background:var(--sel);color:#fff;}

/* ---------- content pieces ---------- */
.heading{
  display:flex;align-items:center;gap:6px;
  margin:0 0 8px;
  padding:0 0 3px;
  font:bold 12px var(--ui);
  color:var(--head-ink,#5a3d8c);
  border-bottom:1px solid;
  border-image:linear-gradient(90deg,var(--head-line,#b48ae6),transparent 85%) 1;
}
.heading img{width:16px;height:16px;}
.heading + *{margin-top:0;}
section + section{margin-top:16px;}

fieldset.group{
  margin:0;
  padding:8px 10px 10px;
  border:1px solid var(--groupbox);
  border-radius:4px;
}
fieldset.group legend{padding:0 4px;color:#3a5fcd;}
.groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px;}
.groups ul{margin:0;padding-left:16px;}

.xp-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:4px;
  min-width:64px;height:23px;
  padding:0 10px;
  border-style:solid;border-width:3px;
  border-image:url("xp/button.png") 3 fill / 3px stretch;
  font:11px var(--ui);
  color:#000;
  text-decoration:none;
  white-space:nowrap;
}
.xp-btn:hover{border-image-source:url("xp/button-hover.png");color:#000;}
.xp-btn:active{border-image-source:url("xp/button-down.png");}
.xp-btn img{width:16px;height:16px;}

.chips{display:flex;flex-wrap:wrap;gap:6px;}
.chip{
  display:inline-flex;align-items:center;gap:5px;
  padding:2px 8px;
  background:#fff;
  border:1px solid #c9bde8;
  border-radius:3px;
  box-shadow:inset 0 -2px 0 #efe9ff;
}

/* profile card */
.profile{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;}
.avatar-frame{
  padding:4px;
  background:#fff;
  border:1px dotted #9a7fe0;
}
.avatar-frame img{width:100%;max-width:220px;height:auto;image-rendering:auto;}
.profile .name{font:bold 14px var(--title-font);color:#5a3d8c;}
.profile .role{color:var(--text);}
.profile .pron{color:var(--text-dim);}

.kv{list-style:none;margin:0;padding:0;}
.kv li{display:flex;align-items:center;gap:6px;padding:3px 0;border-bottom:1px dotted #e1d9ef;}
.kv li:last-child{border-bottom:0;}
.kv li img{width:16px;height:16px;flex:none;}
.kv .k{color:var(--text-dim);min-width:52px;}

/* games list */
.games{display:grid;gap:8px;}
.game{
  display:grid;
  grid-template-columns:auto 128px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  padding:6px;
  background:#fff;
  border:1px solid #dcd3ee;
  border-radius:3px;
}
.game:hover{background:#f6f2ff;border-color:#b9a6ea;}
.game .num{color:#7a6f99;font:bold 12px var(--title-font);width:18px;text-align:right;}
.game .thumb{position:relative;display:block;width:128px;aspect-ratio:16/9;background:#000;border:1px solid #7f9db9;overflow:hidden;}
.game .thumb img{width:100%;height:100%;object-fit:cover;}
.game .thumb .play{
  position:absolute;inset:0;margin:auto;width:30px;height:30px;border-radius:50%;
  background:rgba(255,255,255,.85) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12'%3E%3Cpath d='M2 1l9 5-9 5z' fill='%23d1418a'/%3E%3C/svg%3E") 10px center no-repeat;
  box-shadow:0 1px 3px rgba(0,0,0,.4);
}
.game h3{margin:0 0 3px;font:bold 13px var(--title-font);}
.game h3 a{text-decoration:none;color:#3a2a6d;}
.game h3 a:hover{color:var(--link-hover);text-decoration:underline;}
.stats{display:flex;flex-wrap:wrap;gap:4px 12px;color:var(--text-dim);}
.stats b{color:var(--text);}
.game .acts{display:flex;flex-direction:column;gap:4px;}

/* projects as large-icon folder view */
.folders{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;}
.folder{
  display:flex;flex-direction:column;align-items:center;gap:4px;
  padding:10px 6px;
  text-align:center;
  text-decoration:none;
  color:var(--text);
  border:1px solid transparent;
  border-radius:3px;
}
.folder img{width:48px;height:48px;}
.folder .t{padding:0 3px;}
.folder small{color:var(--text-dim);}
.folder:hover{background:#eef3ff;border-color:#c1d2ee;color:var(--text);}
.folder:focus-visible .t,.folder:active .t{background:var(--sel);color:#fff;}

/* music */
.tracks{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px;}
.track{background:#fff;border:1px solid #dcd3ee;padding:4px;}
.track iframe{display:block;width:100%;height:120px;border:0;}
.track a{display:block;padding:3px 2px 0;}

/* ---------- taskbar ---------- */
.taskbar{
  position:fixed;left:0;right:0;bottom:0;z-index:60;
  height:var(--taskbar-h);
  display:flex;align-items:stretch;
  background:var(--taskbar) repeat-x;
  background-size:auto 100%;
}
.start{
  flex:none;
  width:97px;height:100%;
  border:0;padding:0 0 0 8px;
  display:flex;align-items:center;gap:5px;
  background:url("xp/start.png") 0 0 / 100% 100% no-repeat;
  color:#fff;
  font:italic bold 17px/1 "Franklin XP","Franklin Gothic Medium",var(--title-font);
  text-shadow:1px 1px 1px rgba(0,0,0,.6);
  text-transform:lowercase;
}
.start:hover{background-image:url("xp/start-hover.png");}
.start[aria-expanded="true"],.start:active{background-image:url("xp/start-down.png");}
.start img{width:20px;height:18px;filter:drop-shadow(1px 1px 0 rgba(0,0,0,.4));}
.tasks{flex:1;min-width:0;display:flex;gap:3px;padding:2px 6px;overflow:hidden;}
.task{
  flex:0 1 160px;min-width:0;
  display:flex;align-items:center;gap:5px;
  padding:0 8px;
  border-style:solid;border-width:3px;
  border-image:var(--task) 3 fill / 3px stretch;
  color:#fff;
  font:11px var(--ui);
  text-align:left;
  white-space:nowrap;overflow:hidden;
}
.task:hover{border-image-source:var(--task-h);}
.task[aria-pressed="true"]{border-image-source:var(--task-d);}
.task img{width:16px;height:16px;flex:none;}
.task span{overflow:hidden;text-overflow:ellipsis;}
.tray{
  flex:none;
  display:flex;align-items:center;gap:6px;
  padding:0 10px 0 14px;
  background:var(--tray) 0 0 / 100% 100% no-repeat;
  color:#fff;
  font:11px var(--ui);
  text-shadow:0 0 1px rgba(0,0,0,.3);
}
.tray img{width:16px;height:16px;}
.tray button{all:unset;cursor:var(--cursor-link);display:flex;}

/* ---------- start menu ---------- */
.startmenu{
  position:fixed;left:0;bottom:var(--taskbar-h);z-index:70;
  width:min(380px,100vw);
  border-radius:7px 7px 0 0;
  overflow:hidden;
  background:var(--sm-edge,#d887b6);
  padding:0 2px 2px;
  box-shadow:2px -2px 10px rgba(40,10,60,.4);
}
.startmenu[hidden]{display:none;}
.sm-left small[hidden]{display:none;}
.sm-head{
  display:flex;align-items:center;gap:8px;
  padding:6px 8px;
  background:linear-gradient(var(--sm-a,#f0a2c9),var(--sm-b,#d775ab));
  color:#fff;
  font:bold 14px var(--title-font);
  text-shadow:1px 1px 1px rgba(0,0,0,.4);
}
.sm-head img{width:44px;height:44px;border:2px solid #fff;border-radius:3px;object-fit:cover;background:#fff;}
.sm-cols{display:grid;grid-template-columns:1fr 1fr;}
.sm-cols ul{list-style:none;margin:0;padding:6px 0;}
.sm-left{background:#fff;}
.sm-right{background:#fdeef7;border-left:1px solid #f1c3dc;}
.sm-cols a,.sm-cols span.item{
  display:flex;align-items:center;gap:6px;
  padding:4px 8px;
  color:#000;text-decoration:none;
}
.sm-left img{width:32px;height:32px;}
.sm-right img{width:24px;height:24px;}
.sm-cols a:hover,.sm-cols a:focus-visible{background:var(--sel);color:#fff;}
.sm-cols b{display:block;}
.sm-cols small{display:block;color:#777;}
.sm-cols a:hover small{color:#dde;}
.sm-sep{height:1px;margin:4px 8px;background:linear-gradient(90deg,transparent,#e4a9c8,transparent);}
.sm-foot{
  display:flex;justify-content:flex-end;align-items:center;gap:10px;
  padding:5px 8px;
  background:linear-gradient(var(--sm-a,#f0a2c9),var(--sm-b,#d775ab));
  color:#fff;
}
.sm-foot button{
  all:unset;cursor:var(--cursor-link);
  display:flex;align-items:center;gap:4px;
  padding:2px 4px;
}
.sm-foot button:hover{background:rgba(255,255,255,.2);}
.sm-foot img{width:22px;height:22px;}

/* ---------- assistant ---------- */
.clippy{
  position:fixed;right:18px;bottom:calc(var(--taskbar-h) + 8px);z-index:50;
  display:flex;flex-direction:column;align-items:flex-end;gap:2px;
}
.clippy[hidden]{display:none;}
.balloon{
  position:relative;
  max-width:220px;
  padding:8px 10px;
  background:#ffffe1;
  border:1px solid #000;
  border-radius:8px;
  font:11px var(--ui);
  margin-right:40px;
}
.balloon::after{
  content:"";position:absolute;right:28px;bottom:-11px;
  border:11px solid transparent;border-top-color:#000;border-bottom:0;border-right:0;
}
.balloon::before{
  content:"";position:absolute;right:29px;bottom:-9px;z-index:1;
  border:9px solid transparent;border-top-color:#ffffe1;border-bottom:0;border-right:0;
}
.balloon .x{all:unset;position:absolute;top:2px;right:6px;cursor:var(--cursor-link);font-weight:bold;color:#555;}
.balloon p{margin:0 12px 6px 0;}
.balloon .opts{display:flex;gap:6px;justify-content:flex-end;}
.clip-sprite{
  all:unset;
  cursor:var(--cursor-link);
  width:120px;height:120px;
  background:url("xp/clip/idle.png") 0 0 no-repeat;
}

/* ---------- dialog (errors) ---------- */
.dialog{max-width:420px;margin:12vh auto 0;}
.dialog .win-inner{display:flex;gap:12px;align-items:flex-start;}
.dialog .win-inner img{width:32px;height:32px;flex:none;}
.dialog code{background:#fff;border:1px solid #ccc;padding:0 3px;}

.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}

@media (prefers-reduced-motion:reduce){
  .clip-sprite{animation:none!important;}
}

/* on short desktop screens the icons fill a second column instead of running under the taskbar */
@media (min-width:861px){
  .icons{
    flex:none;display:grid;grid-auto-flow:column;grid-auto-columns:84px;
    grid-template-rows:repeat(auto-fill,74px);gap:4px 6px;align-content:start;
    max-height:calc(100vh - var(--taskbar-h) - 40px);
  }
}

/* ---------- small screens ---------- */
@media (max-width:860px){
  .desktop{flex-direction:column;padding:12px 10px calc(var(--taskbar-h) + 150px);gap:12px;}
  .icons{
    position:static;flex:none;
    flex-direction:row;flex-wrap:wrap;justify-content:center;gap:2px;
    width:100%;
  }
  .icon{width:72px;}
  .windows{grid-template-columns:minmax(0,1fr);width:100%;}
  .win-btns .cb[data-act="max"]{display:none;}
  .explorer{flex-direction:column;}
  .taskpane{flex:none;}
  .game{grid-template-columns:96px minmax(0,1fr);}
  .game .num{display:none;}
  .game .thumb{width:96px;}
  .game .acts{grid-column:1 / -1;flex-direction:row;}
  .tasks .task{flex-basis:44px;}
  .tasks .task span{display:none;}
  .clip-sprite{width:80px;height:80px;background-size:auto 80px;}
  .clippy{right:6px;}
  .balloon{max-width:180px;margin-right:24px;}
}

/* ---------- language chips + wikipedia windows ---------- */
.chip-btn{font:11px var(--ui);color:var(--text);}
.chip-btn img{width:16px;height:16px;}
.chip-btn:hover{background:#eef3ff;border-color:#9a7fe0;}
.chip-btn:active{box-shadow:inset 0 1px 2px rgba(0,0,0,.15);}
.win.popup{position:fixed;z-index:35;}
.win.maxed{left:0!important;top:0!important;width:auto!important;height:auto!important;}
.win.popup .win-body{max-height:calc(100vh - var(--taskbar-h) - 60px);overflow:auto;}
.wiki{font:12px/1.5 var(--ui);}
.wiki::after{content:"";display:block;clear:both;}
.wiki h3{margin:0 0 2px;font:normal 20px/1.2 "Linux Libertine",Georgia,"Times New Roman",serif;border-bottom:1px solid #a2a9b1;padding-bottom:3px;}
.wiki-desc{color:#54595d;font-style:italic;}
.wiki-thumb{float:right;max-width:120px;max-height:140px;margin:0 0 8px 10px;border:1px solid #c8ccd1;background:#f8f9fa;padding:3px;}
.wiki-more{clear:both;margin-top:8px;}
.wiki-loading{color:#666;}
.folder .where{color:var(--text-dim);font-size:11px;}
.folder-wrap .folder:hover{background:transparent;border-color:transparent;}

/* ---------- project windows ---------- */
.folder-btn{all:unset;cursor:var(--cursor-link);display:block;}
.folder-btn:focus-visible .t{background:var(--sel);color:#fff;}
.folder-btn .folder{height:100%;}
.project-video{display:block;width:100%;aspect-ratio:16/9;background:#000;border:1px solid #7f9db9;}
.project-title{margin:10px 0 4px;font:bold 15px var(--title-font);color:#1d6b52;}
.project-made{color:var(--text-dim);}
.project-code{margin-top:12px;}
.code{
  margin:0;
  max-height:320px;
  overflow:auto;
  padding:6px 8px;
  background:#fff;
  border:1px solid #7f9db9;
  font:12px/1.4 "Lucida Console",Consolas,monospace;
  color:#000;
  white-space:pre;
  tab-size:4;
}
.project-code-foot{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:6px;}
.project-code-foot small{color:var(--text-dim);}

/* ---------- LimeWire-style music library ---------- */
.lw{background:#ece9d8;padding:6px 6px 8px;display:grid;gap:6px;}
.lw-tabs{display:flex;align-items:flex-end;gap:2px;border-bottom:1px solid #919b9c;padding:0 4px;}
.lw-tab{
  display:flex;align-items:center;gap:5px;
  padding:4px 12px 5px;
  background:linear-gradient(#fff,#f3f3ee);
  border:1px solid #919b9c;border-bottom:0;
  border-top:3px solid #ffc83c;
  border-radius:3px 3px 0 0;
  margin-bottom:-1px;
  font:12px var(--ui);
}
.lw-tab img{width:16px;height:16px;}
.lw-brand{
  margin-left:auto;display:flex;align-items:center;gap:6px;
  padding-bottom:4px;
  font:22px/1 "Trebuchet MS",var(--ui);
  color:#2f8a2b;letter-spacing:-.02em;
}
.lw-logo{
  width:26px;height:26px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#d8ff9c,#67c23a 55%,#2f8a2b);
  box-shadow:inset 0 0 0 2px #fff,0 0 0 1px #2f8a2b;
}
.lw-main{display:grid;grid-template-columns:190px minmax(0,1fr);gap:6px;}
.lw-side{display:flex;flex-direction:column;gap:6px;}
.lw-search{display:grid;gap:2px;}
.lw-search input{
  font:11px var(--ui);padding:3px 4px;
  border:1px solid #7f9db9;background:#fff;
}
.lw-side-label{margin-top:2px;}
.lw-filter{background:#fff;border:1px solid #7f9db9;}
.lw-filter-head{
  padding:1px 6px;text-align:center;font-weight:bold;
  background:linear-gradient(#ffe68f,#ffcf45);
  border-bottom:1px solid #d9a521;
}
.lw-filter ul{list-style:none;margin:0;padding:2px 0;max-height:150px;overflow:auto;}
.lw-filter button{
  all:unset;box-sizing:border-box;cursor:var(--cursor-link);
  display:flex;align-items:center;gap:5px;width:100%;
  padding:1px 6px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.lw-filter button img{width:16px;height:16px;flex:none;}
.lw-filter button:hover{background:#eef3ff;}
.lw-filter button[aria-pressed="true"]{font-weight:bold;background:#e8f1ff;}
.lw-filter button:focus-visible{outline:2px solid var(--focus);outline-offset:-1px;}

.lw-results{min-width:0;display:flex;flex-direction:column;}
.lw-subtabs{display:flex;padding-left:4px;}
.lw-subtab{
  display:flex;align-items:center;gap:5px;
  padding:2px 10px;
  background:var(--sel);color:#fff;
  border:1px solid #1c4b98;border-bottom:0;border-radius:3px 3px 0 0;
}
.lw-subtab img{width:16px;height:16px;}
.lw-panel{border:1px solid #919b9c;background:#f7f7f2;padding:4px;display:flex;flex-direction:column;gap:4px;min-width:0;}
.lw-scroll{background:#fff;border:1px solid #7f9db9;max-height:300px;overflow:auto;}
.lw-table{width:100%;border-collapse:collapse;font:11px var(--ui);}
.lw-table th{
  position:sticky;top:0;z-index:1;
  padding:3px 6px;text-align:left;font-weight:normal;
  background:linear-gradient(#fff,#ebeadb);
  border-right:1px solid #d6d2c2;border-bottom:2px solid #d6d2c2;
  white-space:nowrap;
}
.lw-table td{padding:2px 6px;white-space:nowrap;border-bottom:1px solid #f1f0ea;}
.lw-table tbody tr{cursor:var(--cursor-link);}
.lw-table tbody tr:hover td{background:#eef3ff;}
.lw-table tbody tr[aria-selected="true"] td{background:var(--sel);color:#fff;}
.lw-table tbody tr:focus-visible{outline:2px solid var(--focus);outline-offset:-1px;}
.lw-table .c-n{text-align:right;color:#666;width:1%;}
.lw-table tr[aria-selected="true"] .c-n{color:#dfe8ff;}
.lw-table .c-q{width:1%;}
.stars{display:inline-flex;gap:1px;vertical-align:middle;}
.stars img{width:11px;height:11px;}
.c-name{display:flex;align-items:center;gap:6px;}
.c-name span{overflow:hidden;text-overflow:ellipsis;}
.lw-thumb{width:16px;height:16px;object-fit:cover;flex:none;border:1px solid rgba(0,0,0,.2);}
.lw-empty{text-align:center;color:#666;padding:12px!important;}
.lw-actions{display:flex;align-items:center;justify-content:center;gap:28px;padding:6px 0 2px;flex-wrap:wrap;}
.lw-actions a{text-decoration:none;}
.lw-act{
  all:unset;box-sizing:border-box;cursor:var(--cursor-link);
  display:flex;flex-direction:column;align-items:center;gap:3px;
  padding:3px 8px;border:1px solid transparent;border-radius:3px;
  color:#000;font:bold 11px var(--ui);
}
.lw-act img{width:32px;height:32px;}
.lw-act:hover{border-color:#c9c4ae;background:#f4f2e8;}
.lw-act:focus-visible{outline:2px solid var(--focus);}
.lw-play{
  width:32px;height:32px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,var(--play-hi),var(--play) 60%,var(--play-lo));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.5),0 1px 2px rgba(0,0,0,.35);
  position:relative;
}
.lw-play::after{
  content:"";position:absolute;left:12px;top:9px;
  border-left:11px solid #fff;border-top:7px solid transparent;border-bottom:7px solid transparent;
  filter:drop-shadow(0 1px 0 rgba(0,0,0,.3));
}
.lw-hint{color:#777;font-weight:normal;}

.lw-now{border:1px solid #919b9c;background:#fff;}
.lw-now-head{padding:2px 6px;background:linear-gradient(#fff,#ebeadb);border-bottom:1px solid #d6d2c2;}
.lw-now-row{display:flex;gap:10px;padding:8px;align-items:flex-start;}
.lw-art{width:120px;height:120px;object-fit:cover;flex:none;border:1px solid #7f9db9;background:#ddd;}
.lw-now-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;}
.lw-now-info b{font:bold 13px var(--title-font);}
.lw-now-info > span{color:var(--text-dim);}
.lw-player iframe{display:block;width:100%;height:120px;border:0;margin-top:4px;}

.lw-status{display:inline-flex;align-items:center;gap:6px;}
.lw-bars{display:inline-flex;align-items:flex-end;gap:1px;height:11px;}
.lw-bars i{width:3px;background:#2f8a2b;}
.lw-bars i:nth-child(1){height:3px;}.lw-bars i:nth-child(2){height:5px;}.lw-bars i:nth-child(3){height:7px;}
.lw-bars i:nth-child(4){height:9px;}.lw-bars i:nth-child(5){height:11px;}

@media (max-width:860px){
  .lw-main{grid-template-columns:minmax(0,1fr);}
  .lw-side{display:grid;grid-template-columns:1fr 1fr;}
  .lw-search,.lw-side-label{grid-column:1 / -1;}
  .lw-table .c-al,.lw-table .c-t,.lw-table .c-n{display:none;}
  .lw-brand{font-size:16px;}
  .lw-hint{display:none;}
  .lw-art{width:72px;height:72px;}
  .lw-now-row{flex-wrap:wrap;}
}

/* ---------- media player ---------- */
.mp{margin-top:6px;}
.mp[hidden],.lw-player[hidden],.mp-tracks[hidden]{display:none;}
.mp-controls{
  display:flex;align-items:center;gap:4px;flex-wrap:wrap;
  padding:4px 8px;
  background:linear-gradient(#f8f8f3,#e3e1d3);
  border:1px solid #a9a68f;border-radius:12px;
}
.mp-btn{
  width:23px;height:23px;flex:none;
  border-style:solid;border-width:3px;
  border-image:url("xp/button.png") 3 fill / 3px stretch;
  padding:0;position:relative;
  background:none;
}
.mp-btn:hover{border-image-source:url("xp/button-hover.png");}
.mp-btn:active{border-image-source:url("xp/button-down.png");}
.mp-btn span{position:absolute;inset:0;margin:auto;}
.mp-prev span,.mp-next span{width:10px;height:8px;}
.mp-prev span{background:linear-gradient(#333,#333) 0 0/2px 100% no-repeat;}
.mp-prev span::after{content:"";position:absolute;right:0;top:0;border-right:8px solid #333;border-top:4px solid transparent;border-bottom:4px solid transparent;}
.mp-next span{background:linear-gradient(#333,#333) 100% 0/2px 100% no-repeat;}
.mp-next span::after{content:"";position:absolute;left:0;top:0;border-left:8px solid #333;border-top:4px solid transparent;border-bottom:4px solid transparent;}
.mp-stop span{width:8px;height:8px;background:#333;}
.mp-playpause{
  width:30px;height:30px;border:0;border-radius:50%;
  border-image:none;
  background:radial-gradient(circle at 35% 30%,var(--play-hi),var(--play) 60%,var(--play-lo));
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.5),0 1px 2px rgba(0,0,0,.35);
}
.mp-playpause:hover{border-image:none;filter:brightness(1.08);}
.mp-playpause:active{border-image:none;filter:brightness(.92);}
.mp-playpause span{width:10px;height:12px;left:3px;}
.mp-playpause span::after{content:"";position:absolute;inset:0;border-left:10px solid #fff;border-top:6px solid transparent;border-bottom:6px solid transparent;}
.mp-playpause.is-playing span{left:0;}
.mp-playpause.is-playing span::after{border:0;background:linear-gradient(90deg,#fff 0 3px,transparent 3px 7px,#fff 7px 10px);}
.mp-time{min-width:78px;text-align:center;font:11px var(--ui);color:#333;}
.mp-vol-wrap{display:flex;align-items:center;gap:3px;}
.mp-vol-wrap img{width:16px;height:16px;}

.mp-seek,.mp-vol{
  -webkit-appearance:none;appearance:none;
  height:16px;background:transparent;margin:0;
  cursor:var(--cursor-link);
}
.mp-seek{flex:1;min-width:100px;}
.mp-vol{width:60px;}
.mp-seek::-webkit-slider-runnable-track,.mp-vol::-webkit-slider-runnable-track{
  height:4px;background:#fff;border:1px solid;border-color:#9d9c99 #fff #fff #9d9c99;box-shadow:inset 1px 1px 0 #d4d0c8;
}
.mp-seek::-moz-range-track,.mp-vol::-moz-range-track{
  height:4px;background:#fff;border:1px solid;border-color:#9d9c99 #fff #fff #9d9c99;
}
.mp-seek::-webkit-slider-thumb,.mp-vol::-webkit-slider-thumb{
  -webkit-appearance:none;width:11px;height:16px;margin-top:-7px;
  background:linear-gradient(#fff,#d6e7c4 60%,#7ec365);
  border:1px solid #3d8a2c;border-radius:2px 2px 5px 5px;
}
.mp-seek::-moz-range-thumb,.mp-vol::-moz-range-thumb{
  width:9px;height:14px;
  background:linear-gradient(#fff,#d6e7c4 60%,#7ec365);
  border:1px solid #3d8a2c;border-radius:2px 2px 5px 5px;
}
.mp-msg{margin:4px 2px 0;color:#7a5b00;min-height:0;}
.mp-msg:empty{display:none;}

.mp-tracks{list-style:none;margin:6px 0 0;padding:0;max-height:150px;overflow:auto;border:1px solid #d6d2c2;}
.mp-tracks button{
  all:unset;box-sizing:border-box;cursor:var(--cursor-link);
  display:flex;gap:8px;width:100%;padding:2px 6px;
}
.mp-tracks li:nth-child(even) button{background:#f7f6f0;}
.mp-tracks button:hover{background:#eef3ff;}
.mp-tracks button[aria-current="true"]{background:var(--sel);color:#fff;}
.mp-tracks button:focus-visible{outline:2px solid var(--focus);outline-offset:-1px;}
.mp-tracks .n{width:18px;text-align:right;color:var(--text-dim);}
.mp-tracks button[aria-current="true"] .n{color:#dfe8ff;}
.mp-tracks .t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.mp-tracks .d{color:var(--text-dim);}
.mp-tracks button[aria-current="true"] .d{color:#dfe8ff;}

.lw-table tbody tr.playing .c-name span::before{content:"♪ ";color:#2f8a2b;}
.lw-table tbody tr.playing[aria-selected="true"] .c-name span::before{color:#c9ffb0;}

@media (max-width:860px){
  .mp-seek{order:10;flex-basis:100%;}
  .mp-vol-wrap{display:none;}
}

.sc-host{position:absolute;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none;}
.sc-frame{width:300px;height:120px;border:0;}
.lw-now-info{position:relative;}

/* ---------- now playing card (home + tray) ---------- */
.np{display:flex;gap:10px;align-items:center;min-width:0;}
.np-art{width:56px;height:56px;flex:none;object-fit:cover;border:1px solid #7f9db9;}
.np-art[hidden]{display:none;}
.np-info{display:flex;flex-direction:column;gap:2px;min-width:0;}
.np-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;}
.np-sub{color:var(--text-dim);}
.np-row{display:flex;align-items:center;gap:10px;margin-top:4px;}
.np-row .xp-btn[hidden]{display:none;}

.tray-music img{transition:filter .2s;}
.tray-music.is-playing img{filter:drop-shadow(0 0 3px #b8ffb0);}
.tray-pop{
  position:fixed;right:6px;bottom:calc(var(--taskbar-h) + 6px);z-index:65;
  width:min(300px,calc(100vw - 12px));
  padding:10px 12px;
  background:#ffffe1;
  border:1px solid #000;border-radius:6px;
  box-shadow:2px 3px 8px rgba(0,0,0,.35);
}
.tray-pop[hidden]{display:none;}

/* ---------- right-click menu ---------- */
.ctxmenu{
  position:fixed;z-index:90;
  min-width:180px;padding:2px;
  background:#fff;border:1px solid #aca899;
  box-shadow:2px 2px 4px rgba(0,0,0,.35);
}
.ctxmenu[hidden]{display:none;}
.ctxmenu button{
  all:unset;box-sizing:border-box;display:block;width:100%;
  padding:3px 20px;font:11px var(--ui);color:#000;cursor:var(--cursor);
}
.ctxmenu button:hover,.ctxmenu button:focus{background:var(--sel);color:#fff;}
.ctxmenu button.b{font-weight:bold;}
.ctx-sep{height:1px;margin:3px 2px;background:#aca899;}

/* ---------- display properties ---------- */
.props{display:grid;gap:10px;}
.wall-opts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
.wall-opt{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;gap:3px 6px;align-items:center;}
.wall-opt input{grid-row:1 / 3;}
.wall-thumb{
  display:block;height:56px;border:2px solid #fff;outline:1px solid #7f9db9;
  background-size:cover;background-position:center;
}
.wall-thumb[data-wall="bliss"]{background-image:url("xp/wall/bliss.jpg");}
.wall-thumb[data-wall="azul"]{background-image:url("xp/wall/azul.jpg");}
.wall-thumb[data-wall="friend"]{background-image:url("xp/wall/friend.jpg");}
.wall-thumb[data-wall="checker"]{
  background-color:#cfe1fb;
  background-image:
    linear-gradient(45deg,#dcebff 25%,transparent 25%,transparent 75%,#dcebff 75%),
    linear-gradient(45deg,#dcebff 25%,transparent 25%,transparent 75%,#dcebff 75%);
  background-size:16px 16px;background-position:0 0,8px 8px;
}
.props-check{display:flex;align-items:center;gap:6px;margin-bottom:8px;}
.props-btns{display:flex;flex-wrap:wrap;gap:6px;}

/* ---------- boot + welcome screen ---------- */
.boot{position:fixed;inset:0;z-index:200;background:#000;color:#fff;transition:opacity .45s;}
.boot.boot-out{opacity:0;}
.boot-load{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:40px;}
.boot-load img{width:min(260px,60vw);height:auto;}
.boot-bar{
  position:relative;width:150px;height:16px;
  border:2px solid #b2b2b2;border-radius:4px;overflow:hidden;
}
.boot-bar i{
  position:absolute;top:2px;width:9px;height:8px;border-radius:1px;
  background:linear-gradient(#2c57dc,#7fa4ff 45%,#2346b8);
  animation:boot-slide 2.2s linear infinite;
}
.boot-bar i:nth-child(2){animation-delay:.12s;}
.boot-bar i:nth-child(3){animation-delay:.24s;}
@keyframes boot-slide{from{left:-34px;}to{left:150px;}}
@media (prefers-reduced-motion:reduce){.boot-bar i{animation:none;left:58px;}.boot-bar i:nth-child(2){left:70px;}.boot-bar i:nth-child(3){left:82px;}}
.bw-skip{
  all:unset;position:absolute;right:18px;bottom:14px;
  color:#fff;opacity:.7;font:12px var(--ui);cursor:var(--cursor-link);text-decoration:underline;
}
.bw-skip:hover,.bw-skip:focus-visible{opacity:1;}
.boot-welcome{height:100%;display:flex;flex-direction:column;background:#5a7edc;}
.bw-top{height:12%;background:#00309c;border-bottom:2px solid #93aef0;}
.bw-bottom{position:relative;height:12%;background:#00309c;border-top:2px solid #f29b4a;}
.bw-mid{
  flex:1;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle at 30% 30%,#a5c0f5 0,#5a7edc 45%);
}
.bw-left{
  flex:1;max-width:420px;padding-right:30px;text-align:right;
  border-right:1px solid rgba(255,255,255,.6);
}
.bw-left img{margin:0 0 12px auto;width:150px;height:auto;}
.bw-left p{margin:0;font:20px var(--title-font);color:#fff;}
.bw-right{flex:1;max-width:420px;padding-left:30px;}
.boot-user{
  all:unset;display:flex;align-items:center;gap:12px;
  padding:6px 10px 6px 6px;border-radius:6px;cursor:var(--cursor-link);
}
.boot-user:hover,.boot-user:focus-visible{background:linear-gradient(90deg,#0e3fbc,transparent);}
.boot-user img{width:56px;height:56px;border:2px solid #fff;border-radius:4px;object-fit:cover;}
.boot-user b{display:block;font:20px var(--title-font);color:#fff;}
.boot-user small{font:12px var(--ui);color:#d4e1ff;}
@media (max-width:640px){
  .bw-mid{flex-direction:column;gap:20px;}
  .bw-left{border:0;padding:0;text-align:center;}
  .bw-left img{margin:0 auto 10px;}
  .bw-right{padding:0;}
}
body.logging-off::after{
  content:"";position:fixed;inset:0;z-index:300;background:#000;
  animation:log-off 1.4s forwards;
}
@keyframes log-off{from{opacity:0;}to{opacity:1;}}

/* ---------- guestbook (notepad) ---------- */
.notepad{display:flex;flex-direction:column;background:#fff;}
.np-menu{display:flex;gap:2px;padding:2px 4px;background:#ece9d8;border-bottom:1px solid #d6d2c2;}
.np-menu span{padding:1px 6px;}
.gb-notes{
  max-height:380px;overflow:auto;padding:8px 10px;
  font:12px/1.5 "Lucida Console",Consolas,monospace;
}
.gb-note{padding:6px 0;border-bottom:1px dashed #c9c9c9;}
.gb-note header{display:flex;gap:10px;align-items:baseline;}
.gb-note.pinned{background:var(--fav-bg);margin:0 -6px;padding:6px;border:1px solid var(--fav-line);border-radius:3px;margin-bottom:6px;}
.gb-pin{display:inline-flex;align-items:center;gap:3px;color:#a0326e;font-weight:bold;align-self:center;}
.gb-pin img{width:12px;height:12px;}
.gb-heart{
  margin-left:auto;display:inline-flex;align-items:center;gap:3px;
  padding:0 5px;background:#fff;border:1px solid #c9c9c9;border-radius:2px;
  font:11px var(--ui);color:#555;cursor:var(--cursor-link);
}
.gb-heart:hover{border-color:#d1418a;}
.gb-heart-icon{color:#8a8494;font-size:12px;line-height:1;}
.gb-heart[aria-pressed="true"]{border-color:#e9a8c9;background:#fff3f9;color:#a0326e;cursor:default;}
.gb-heart[aria-pressed="true"] .gb-heart-icon{color:#d1418a;}
.gb-reply{margin:6px 0 2px 16px;padding:4px 8px;background:#f3f8ff;border-left:3px solid #7ba2e7;}
.gb-reply header{display:flex;align-items:center;gap:5px;}
.gb-reply header img{width:16px;height:16px;object-fit:cover;}
.gb-reply time{margin-left:6px;}
.gb-reply-img{display:block;max-width:min(100%,320px);max-height:240px;margin-top:4px;border:1px solid #7f9db9;}
.gb-note time{color:#777;}
.gb-note p{margin:2px 0 0;white-space:pre-wrap;overflow-wrap:anywhere;}
.gb-empty{color:#777;}
.gb-form{position:relative;display:grid;gap:6px;padding:8px 10px;background:#f6f5ef;border-top:1px solid #d6d2c2;}
.gb-field{display:grid;gap:2px;}
.gb-field input,.gb-field textarea{
  width:100%;padding:3px 4px;border:1px solid #7f9db9;
  font:12px "Lucida Console",Consolas,monospace;resize:vertical;
}
.gb-trap{position:absolute;left:-9999px;width:1px;height:1px;}
.gb-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.gb-left{color:#777;}

/* ---------- paint ---------- */
.pt{display:flex;flex-direction:column;background:#ece9d8;}
.pt-menu{display:flex;flex-wrap:wrap;gap:4px;padding:4px;border-bottom:1px solid #d6d2c2;}
.pt-main{display:flex;min-height:0;}
.pt-box{flex:none;display:flex;flex-direction:column;gap:6px;padding:4px;border-right:1px solid #d6d2c2;}
.pt-tools{display:grid;grid-template-columns:repeat(2,24px);gap:1px;}
.pt-tool{
  width:24px;height:24px;padding:0;
  display:flex;align-items:center;justify-content:center;
  background:#ece9d8;border:1px solid transparent;font-size:14px;color:#000;
}
.pt-tool:hover{border-color:#fff #848284 #848284 #fff;}
.pt-tool[aria-pressed="true"]{background:#fff;border-color:#848284 #fff #fff #848284;}
.pt-sizes{display:flex;flex-direction:column;gap:2px;padding:3px;background:#fff;border:1px solid;border-color:#848284 #fff #fff #848284;}
.pt-size{display:flex;align-items:center;justify-content:center;height:16px;padding:0;background:none;border:0;}
.pt-size i{display:block;background:#000;border-radius:50%;}
.pt-size[aria-pressed="true"]{background:var(--sel);}
.pt-size[aria-pressed="true"] i{background:#fff;}
.pt-well{flex:1;min-width:0;overflow:auto;padding:6px;background:#808080;}
.pt-canvas{display:block;max-width:100%;height:auto;background:#fff;cursor:crosshair;touch-action:none;box-shadow:1px 1px 0 #000;}
.pt-colors{display:flex;align-items:center;gap:6px;padding:4px;border-top:1px solid #d6d2c2;}
.pt-current{width:30px;height:30px;flex:none;border:1px solid;border-color:#848284 #fff #fff #848284;}
.pt-palette{display:grid;grid-template-columns:repeat(14,15px);gap:1px;}
.pt-palette button{width:15px;height:15px;padding:0;border:1px solid;border-color:#848284 #fff #fff #848284;}

/* ---------- last.fm ---------- */
.lfm{list-style:none;margin:0;padding:0;max-height:330px;overflow:auto;}
.lfm li{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:8px;align-items:center;padding:4px 2px;border-bottom:1px solid #e3e8f4;}
.lfm li img,.lfm-noart{width:34px;height:34px;object-fit:cover;background:#dde4f2;}
.lfm-t{display:flex;flex-direction:column;min-width:0;}
.lfm-t a,.lfm-t small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.lfm-t small{color:var(--text-dim);}
.lfm-when{color:var(--text-dim);white-space:nowrap;}
.lfm-now{color:#2c8a2c;font-weight:bold;}
.lfm-empty{color:var(--text-dim);}
.gb-privacy{margin:0;color:var(--text-dim);font-size:11px;}

/* ---------- balloon tooltip ---------- */
.xp-tip{
  position:fixed;z-index:95;max-width:260px;
  display:flex;flex-direction:column;gap:2px;
  padding:4px 6px;
  background:#ffffe1;color:#000;
  border:1px solid #000;
  box-shadow:2px 2px 3px rgba(0,0,0,.3);
  font:11px var(--ui);
  pointer-events:none;
}
.xp-tip[hidden]{display:none;}
.xp-tip small{color:#555;}
a.chip-btn{text-decoration:none;}

/* ---------- system properties ---------- */
.sysprops{background:#ece9d8;}
.sysprops-tabs{display:flex;gap:2px;margin-bottom:-1px;}
.sysprops-tabs button{
  position:relative;padding:2px 8px;
  background:#f4f3ee;border:1px solid #919b9c;border-bottom:0;border-radius:3px 3px 0 0;
  color:#000;font:11px var(--ui);cursor:var(--cursor-link);
}
.sysprops-tabs button:hover{border-top-color:#e68b2c;}
.sysprops-tabs .on{z-index:1;background:#fcfcfe;border-top:2px solid #e68b2c;padding-bottom:3px;}
.sysprops-page[hidden]{display:none;}
.sysprops-page{padding:10px;background:#fcfcfe;border:1px solid #919b9c;}
.sysprops-top{display:flex;gap:12px;align-items:flex-start;margin-bottom:10px;}
.sysprops-top img{flex:none;width:96px;height:auto;}
.sysprops-top dl{margin:0;}
.sysprops-top dt{margin-top:4px;color:#000;}
.sysprops-top dt:first-child{margin-top:0;}
.sysprops-top dd{margin:0 0 0 12px;display:flex;flex-direction:column;}
.sysprops .kv .k{min-width:78px;}

html.booting,html.booting body{overflow:hidden;}

/* device manager tree */
.dm-note{margin:0 0 8px;color:#555;}
.dm-tree,.dm-tree ul{list-style:none;margin:0;padding:0;}
.dm-tree ul{margin-left:8px;padding-left:12px;border-left:1px dotted #808080;}
.dm-tree li{padding:1px 0;}
.dm-tree li li li{display:flex;align-items:center;gap:4px;}
.dm-root,.dm-tree summary{display:flex;align-items:center;gap:4px;}
.dm-tree summary{list-style:none;cursor:var(--cursor-link);}
.dm-tree summary::-webkit-details-marker{display:none;}
.dm-tree summary::before{
  content:"+";flex:none;width:9px;height:9px;margin-left:-17px;margin-right:4px;
  display:flex;align-items:center;justify-content:center;
  font:9px/1 monospace;background:#fff;border:1px solid #919b9c;color:#000;
}
.dm-tree details[open] > summary::before{content:"‘2";}
.dm-tree summary:focus-visible{outline:2px solid var(--focus);}
.dm-tree img{width:16px;height:16px;flex:none;}

/* ---------- blog (outlook express) ---------- */
.oe{display:flex;flex-direction:column;background:#fff;}
.oe-bar{display:flex;gap:2px;padding:3px 6px;background:#ece9d8;border-bottom:1px solid #d6d2c2;}
.oe-tool{display:flex;flex-direction:column;align-items:center;gap:1px;min-width:56px;padding:2px 4px;color:#000;}
.oe-tool img{width:24px;height:24px;}
.oe-folder{display:flex;align-items:center;gap:6px;padding:4px 8px;background:linear-gradient(90deg,#3b6fd6,#9ab8f0);color:#fff;font-size:13px;}
.oe-list{max-height:180px;overflow:auto;border-bottom:3px double #aca899;}
.oe-table{width:100%;border-collapse:collapse;table-layout:fixed;}
.oe-table th{
  position:sticky;top:0;padding:2px 6px;text-align:left;font-weight:normal;
  background:linear-gradient(#fff,#ebeadb);border-right:1px solid #c7c5b2;border-bottom:1px solid #c7c5b2;
}
.oe-table td{padding:2px 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:var(--cursor-link);}
.oe-table .oe-ic{width:26px;}
.oe-table .oe-date{width:110px;}
.oe-table tr.sel td{background:var(--sel);color:#fff;}
.oe-table tbody tr:focus{outline:2px solid var(--focus);outline-offset:-1px;}
.oe-read{min-height:220px;max-height:460px;overflow:auto;}
.oe-head{padding:6px 10px;background:#ece9d8;border-bottom:1px solid #d6d2c2;display:grid;gap:1px;}
.oe-body{padding:10px 12px;font-size:12px;line-height:1.5;}
.oe-body p{margin:0 0 10px;overflow-wrap:anywhere;}
.oe-img{display:block;max-width:100%;max-height:360px;margin:0 0 10px;border:1px solid #7f9db9;}
.oe-empty{padding:10px 12px;color:#777;}

/* ---------- minesweeper ---------- */
.ms-win{width:auto;max-width:max-content;}
.ms{background:#c0c0c0;}
.ms-frame{
  display:inline-flex;flex-direction:column;gap:6px;margin:6px;padding:6px;
  border:3px solid;border-color:#fff #808080 #808080 #fff;
}
.ms-top{
  display:flex;align-items:center;justify-content:space-between;padding:4px 5px;
  border:2px solid;border-color:#808080 #fff #fff #808080;
}
.ms-led{
  min-width:39px;padding:0 2px;background:#000;color:#f00;
  font:bold 22px/1 "Courier New",monospace;letter-spacing:1px;text-align:center;
  border:1px solid;border-color:#808080 #fff #fff #808080;
}
.ms-face{
  width:30px;height:30px;padding:0;display:flex;align-items:center;justify-content:center;
  background:#c0c0c0;border:2px solid;border-color:#fff #808080 #808080 #fff;cursor:var(--cursor-link);
}
.ms-face:active{border-color:#808080 #fff #fff #808080;}
.ms-face img{width:24px;height:24px;image-rendering:pixelated;}
.ms-grid{
  display:grid;grid-template-columns:repeat(var(--cols),var(--ms-cell,20px));
  border:3px solid;border-color:#808080 #fff #fff #808080;
}
.ms-cell{
  width:var(--ms-cell,20px);height:var(--ms-cell,20px);padding:0;
  display:flex;align-items:center;justify-content:center;
  background:#c0c0c0;border:2px solid;border-color:#fff #808080 #808080 #fff;
  font:bold 13px/1 Tahoma,var(--ui);color:#000;cursor:default;
}
.ms-cell:focus-visible{outline:2px solid var(--focus);outline-offset:-3px;}
.ms-cell:not(.open):active{border:1px solid #808080;border-width:1px 0 0 1px;}
.ms-cell.open{border:0;border-right:1px solid #808080;border-bottom:1px solid #808080;}
.ms-cell.boom{background:#f00;}
.ms-cell.wrong{background:#ffb3b3;}
.ms-cell img{image-rendering:pixelated;}
.ms-cell.n1{color:#0000ff;}
.ms-cell.n2{color:#008000;}
.ms-cell.n3{color:#ff0000;}
.ms-cell.n4{color:#000080;}
.ms-cell.n5{color:#800000;}
.ms-cell.n6{color:#008080;}
.ms-cell.n7{color:#000;}
.ms-cell.n8{color:#808080;}

/* ---------- screensaver ---------- */
.saver{position:fixed;inset:0;z-index:400;width:100vw;height:100vh;background:#000;cursor:none;}
.props-saver{align-items:center;}
.props-saver select{font:11px var(--ui);}

/* ---------- media player visualizer ---------- */

/* ---------- msn messenger ---------- */
.msn{display:flex;flex-direction:column;background:#fff;}
.msn-head{display:flex;gap:8px;align-items:center;padding:8px;background:linear-gradient(#e4eefc,#c3d6f5);border-bottom:1px solid #9cb6e3;}
.msn-pic{width:48px;height:48px;object-fit:cover;border:2px solid #fff;outline:1px solid #7f9db9;border-radius:3px;}
.msn-head > div{min-width:0;}
.msn-online{color:#2c8a2c;}
.msn-note{display:block;color:#555;font-style:italic;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.msn-list{padding:6px 8px;min-height:120px;}
.msn-list summary{font-weight:bold;color:#1f3f8f;cursor:var(--cursor-link);padding:2px 0;}
.msn-list ul{list-style:none;margin:0 0 6px;padding:0 0 0 10px;}
.msn-list li > a,.msn-list li > button{
  all:unset;box-sizing:border-box;display:flex;align-items:center;gap:5px;width:100%;
  padding:2px 4px;border:1px solid transparent;cursor:var(--cursor-link);font:11px var(--ui);color:#000;
}
.msn-list li > a:hover,.msn-list li > button:hover,.msn-list li > a:focus-visible,.msn-list li > button:focus-visible{background:#e8f0fd;border-color:#9cb6e3;}
.msn-list small{color:#666;}
.msn-dot{width:7px;height:7px;flex:none;border-radius:50%;background:#c9c9c9;box-shadow:inset 0 0 0 1px #8a8a8a;}
.msn-dot.on{background:#3fbf3f;box-shadow:inset 0 0 0 1px #1d7a1d;}
.msn-foot{display:flex;align-items:center;gap:8px;padding:6px 8px;background:#ece9d8;border-top:1px solid #d6d2c2;}
.msn-status{color:#555;}
@keyframes nudge{0%,100%{translate:0 0;}10%{translate:-8px 3px;}20%{translate:7px -4px;}30%{translate:-6px -3px;}40%{translate:8px 4px;}50%{translate:-5px 2px;}60%{translate:6px -2px;}70%{translate:-3px 3px;}80%{translate:4px -1px;}90%{translate:-2px 1px;}}
.win.nudge{animation:nudge .6s;}
.msn-toast{
  all:unset;box-sizing:border-box;position:fixed;right:8px;bottom:calc(var(--taskbar-h) + 8px);z-index:70;
  width:min(220px,calc(100vw - 16px));display:flex;flex-direction:column;
  background:linear-gradient(#fff,#dfe9fb);border:1px solid #6d8fd0;border-radius:4px 4px 0 0;
  box-shadow:1px 2px 6px rgba(0,0,0,.35);cursor:var(--cursor-link);font:11px var(--ui);color:#000;
  animation:toast-in .5s ease-out;
}
.msn-toast.out{transition:opacity .5s;opacity:0;}
.msn-toast-bar{display:flex;align-items:center;gap:4px;padding:2px 6px;background:linear-gradient(#5c8be0,#2e5fc4);color:#fff;font-weight:bold;border-radius:3px 3px 0 0;}
.msn-toast-body{display:flex;align-items:center;gap:8px;padding:10px 8px;}
.msn-toast-body img{width:32px;height:32px;object-fit:cover;border:1px solid #7f9db9;}
@keyframes toast-in{from{transform:translateY(30px);opacity:0;}to{transform:none;opacity:1;}}
@media (prefers-reduced-motion: reduce){.win.nudge,.msn-toast{animation:none;}}

/* ---------- phones ---------- */
@media (max-width:640px){
  /* one swipeable row of desktop icons instead of three rows */
  .icons{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin;}
  .icon{width:64px;flex:none;}
  /* page content first, the blue task pane after it */
  .explorer .taskpane{order:2;}
  .explorer-main{padding:10px;}
  .tiles{grid-template-columns:minmax(0,1fr);}
  /* Clippy covers too much of a small screen */
  .clippy{display:none!important;}
  .sysprops-top img{width:64px;}
  .oe-bar{display:none;}
  .oe-table .oe-date{width:84px;}
  .msn-toast{right:4px;}
}

/* paint text tool */
.pt-text{
  position:fixed;z-index:80;min-width:120px;padding:0 2px;
  background:transparent;border:1px dashed #000;outline:none;
  font-family:Tahoma,Verdana,sans-serif;
}
.pt-tool[aria-label="Text"] span{font:bold 14px "Times New Roman",serif;}

/* ---------- run box, error box, command prompt ---------- */
.run-row,.xp-error-row{display:flex;gap:12px;align-items:flex-start;}
.run-row p,.xp-error-row p{margin:2px 0 0;}
.run-open{display:flex;align-items:center;gap:8px;margin:14px 0 12px;}
.run-input{flex:1;min-width:0;padding:2px 3px;border:1px solid #7f9db9;font:11px var(--ui);}
.run-btns,.xp-error-btns{display:flex;justify-content:flex-end;gap:6px;margin:0;}
.xp-error-btns{justify-content:center;margin-top:12px;}
.xp-btn[type="submit"]{min-width:72px;}
.cmd{
  height:320px;overflow:auto;padding:4px 6px;
  background:#000;color:#c0c0c0;cursor:text;
  font:14px/1.2 "Lucida Console",Consolas,"Courier New",monospace;
}
.cmd-out{margin:0;font:inherit;white-space:pre-wrap;overflow-wrap:anywhere;}
.cmd-line{display:flex;}
.cmd-line span{white-space:pre;}
.cmd-in{flex:1;min-width:0;padding:0;background:transparent;border:0;outline:0;color:#c0c0c0;font:inherit;caret-color:#c0c0c0;}

/* ---------- interests ---------- */
.pane-art{display:flex;flex-direction:column;gap:3px;padding:8px 10px 0;background:var(--pane-body,#d6dff7);}
.pane-art span{color:#555;}
.art-thumb{display:block;width:100%;max-width:200px;padding:0;margin-bottom:4px;border:1px solid #fff;outline:1px solid #b9a6ea;background:#fff;}
.art-thumb img{display:block;width:100%;aspect-ratio:1;object-fit:cover;}
.art-thumb:hover{outline-color:var(--pink);}
.icon-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:8px 4px;}
.icon-tile{display:flex;flex-direction:column;align-items:center;gap:4px;padding:4px 2px;text-align:center;border:1px solid transparent;border-radius:3px;}
.icon-tile img{width:32px;height:32px;image-rendering:pixelated;}
.icon-tile.fav{background:var(--fav-bg);border-color:var(--fav-line);}
.fav-star{color:var(--pink);}
.chip.fav{background:var(--fav-bg);border-color:var(--fav-line);box-shadow:inset 0 -2px 0 #fbd3e6;}

/* Windows Picture and Fax Viewer */
.pv{display:flex;flex-direction:column;background:#fff;outline:none;}
.pv:focus-visible{outline:2px solid var(--focus);outline-offset:-2px;}
.pv-stage{display:grid;place-items:center;height:min(420px,60vh);padding:8px;background:#fff;border-bottom:1px solid #d4d0c8;}
.pv-img{max-width:100%;max-height:100%;object-fit:contain;box-shadow:2px 2px 6px rgba(0,0,0,.25);}
.pv-bar{display:flex;justify-content:center;flex-wrap:wrap;gap:6px;padding:6px;background:#ece9d8;}
.pv-foot{display:flex;justify-content:space-between;gap:8px;padding:3px 8px;background:#ece9d8;border-top:1px solid #d4d0c8;color:#555;}

/* ---------- audit fixes ---------- */
/* video projects show their poster */
.folder .folder-thumb{position:relative;display:block;width:120px;aspect-ratio:16/9;background:#000;border:1px solid #7f9db9;overflow:hidden;}
.folder .folder-thumb img{width:100%;height:100%;object-fit:cover;}
.folder .folder-thumb.repo{background:#fff;}
.folder-thumb .play{
  position:absolute;inset:0;margin:auto;width:26px;height:26px;border-radius:50%;
  background:rgba(255,255,255,.85) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12'%3E%3Cpath d='M2 1l9 5-9 5z' fill='%23d1418a'/%3E%3C/svg%3E") 8px center no-repeat;
  box-shadow:0 1px 3px rgba(0,0,0,.4);
}

/* interests: artists with songs here are buttons into the music program */
.icon-btn{font:inherit;color:inherit;background:none;cursor:var(--cursor-link);}
.icon-btn:hover{background:#efe7ff;border-color:#d6c8f5;}
.icon-btn.fav:hover{background:#fbd3e6;}
.icon-btn:hover > span{color:var(--link-hover);text-decoration:underline;}

/* Clippy steps up while the MSN toast is showing */
.clippy{transition:bottom .3s;}
html.toasting .clippy{bottom:calc(var(--taskbar-h) + 100px);}

/* busy and blocked controls look it */
.xp-btn:disabled,button:disabled{color:#8d8d8d;text-shadow:1px 1px 0 #fff;cursor:default;}
.xp-btn:disabled img,button:disabled img{filter:grayscale(1);opacity:.6;}
input:disabled,textarea:disabled{background:#ece9d8;color:#6d6d6d;}

/* bigger tap targets on touch screens */
@media (pointer:coarse){
  .cb{position:relative;}
  .cb::after{content:"";position:absolute;inset:-5px -2px;}
  .ms-grid{--ms-cell:28px;}
  .ms-cell{font-size:15px;}
  .pt-palette{grid-template-columns:repeat(14,22px);}
  .pt-palette button{width:22px;height:22px;}
  .pt-size{height:24px;}
  .lw-filter button,.msn-list li > a,.msn-list li > button{min-height:32px;}
}

@media (max-width:640px){
  /* desktop icons wrap into a grid instead of a hidden sideways row */
  .icons{flex-wrap:wrap;justify-content:center;overflow-x:visible;padding-bottom:0;}
  .icon{width:68px;}
  .icon span{font-size:12px;}
  .gb-privacy,.folder .where{font-size:12px;}
}

/* ---------- synapse x (sizes and colors from asunax's SynapseUI XAML) ---------- */
.win.syn-win{
  --syn-font:"Segoe UI",system-ui,-apple-system,sans-serif;
  filter:drop-shadow(0 4px 12px rgba(0,0,0,.45));
  font:13px var(--syn-font);
  color:#fff;
}
.windows > .program > .win.syn-main{grid-column:1 / -1;justify-self:center;width:330px;max-width:100%;}
.windows > .program > .win.syn-main.syn-ready{width:800px;}
.syn-win .win-title{
  position:relative;height:30px;padding:0;gap:0;
  border:0;border-image:none;background:#1f1f1f;
  font:13px var(--syn-font);text-shadow:none;
}
.syn-win .win-title > img{width:20px;height:auto;max-height:24px;margin:0 0 0 6px;image-rendering:auto;}
.syn-win .win-title h2{position:absolute;inset:0 50px;line-height:30px;text-align:center;pointer-events:none;}
.syn-main .win-title h2{inset:0 125px;}
.syn-win .win-btns{gap:0;margin:0 0 0 auto;}
.syn-win .cb{
  width:45px;height:30px;
  background:#1f1f1f center / 10px 10px no-repeat;
  transition:background-color .15s cubic-bezier(.25,1,.5,1);
}
.syn-win .cb:hover{background-color:#343436;}
.syn-win .cb[data-act="max"]{display:none;}
.syn-win .cb[data-act="min"]{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M0 5.5h10' stroke='%23fff'/%3E%3C/svg%3E");}
.syn-win .cb[data-act="close"]{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M0 0l10 10M10 0L0 10' stroke='%23fff'/%3E%3C/svg%3E");}
.syn-win .cb.syn-gear{width:21px;height:21px;margin:0 10px 0 auto;border-radius:3px;background:transparent;display:grid;place-items:center;}
.syn-win .cb.syn-gear:hover{background:#2c3d4d;}
.syn-gear img{width:13px;height:13px;}
.syn-win .syn-gear + .win-btns{margin-left:0;}
.syn-options .cb[data-act="min"],.syn-confirm .cb[data-act="min"]{display:none;}
.syn-win .win-body{border:0;border-image:none;background:#121212;color:#fff;}
.syn-win.maxed .win-body{display:flex;flex-direction:column;}
.syn-win.maxed .syn{flex:1;height:auto;}
html.syn-round .win.syn-win{border-radius:8px;overflow:hidden;}
html.syn-top .win.syn-win.dragged,html.syn-top .win.syn-win.popup{z-index:59!important;}
.syn-win button{font-family:var(--syn-font);}
.syn-win :focus-visible{outline:2px solid #bb86fc;outline-offset:1px;}
.syn-win ::-webkit-scrollbar{width:5px;height:5px;}
.syn-win ::-webkit-scrollbar-thumb{background:#018786;border-radius:4px;}
.syn-win ::-webkit-scrollbar-track,.syn-win ::-webkit-scrollbar-corner{background:transparent;}
.syn-win *{scrollbar-color:#018786 transparent;scrollbar-width:thin;}

.syn-splash{display:grid;justify-items:center;align-content:center;height:120px;padding:0 30px 10px;}
.syn-splash p{margin:0;}
.syn-splash-head{font:600 14px var(--syn-font);}
.syn-splash .syn-splash-text{margin:2px 0 10px;}
.syn-bar{width:100%;height:15px;border-radius:7px;background:#252525;overflow:hidden;}
.syn-bar i{display:block;width:0;height:100%;border-radius:7px;background:#3700b3;transition:width .45s cubic-bezier(.25,1,.5,1);}

.syn{
  display:grid;
  grid-template-columns:minmax(0,1fr) 125px;
  grid-template-rows:35px minmax(0,1fr) 45px;
  height:325px;
}
.syn-tabs{display:flex;align-items:center;gap:4px;padding:15px 0 0 5px;min-width:0;}
.syn-tablist{display:flex;min-width:0;overflow:hidden;}
.syn-tab{
  display:flex;align-items:center;flex:none;
  width:65px;height:20px;padding:0 3px 0 6px;
  border-radius:5px 5px 0 0;background:#121212;
  font-size:11px;cursor:default;user-select:none;
  transition:background-color .15s;
}
.syn-tab:hover,.syn-tab[aria-selected="true"]{background:#1f1f1f;}
.syn-tab span{flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.syn-tab-x{
  flex:none;width:10px;height:10px;padding:0;border:0;border-radius:5px;
  background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M3 3l4 4M7 3L3 7' stroke='%23fff'/%3E%3C/svg%3E") center / 10px no-repeat;
}
.syn-tab-x:hover{background-color:#121212;}
.syn-add{
  flex:none;position:relative;width:15px;height:15px;padding:0;border:0;border-radius:50%;background:#1f1f1f;
  transition:background-color .15s;
}
.syn-add:hover{background:#343436;}
.syn-add::before,.syn-add::after{content:"";position:absolute;left:50%;top:50%;background:#fff;translate:-50% -50%;}
.syn-add::before{width:8px;height:2px;}
.syn-add::after{width:2px;height:8px;}
.syn-fade{font-size:11px;color:#fff;opacity:1;transition:opacity .5s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.syn-fade.out{opacity:0;}
.syn-status{grid-column:2;align-self:center;text-align:center;padding-top:9px;}

.syn-ed{
  --ed-bg:#2d2d2d;--ed-fg:#ccc;--ed-gutter:#272727;--ed-gutter-fg:#ccc;--ed-line:#393939;--ed-sel:#515151;
  --kw:#c9c;--str:#9c9;--num:#f99157;--com:#999;--fn:#69c;--gl:#f2777a;
  grid-row:2;grid-column:1;margin:0 7px;
  display:flex;min-width:0;overflow:hidden;
  background:var(--ed-bg);color:var(--ed-fg);
  font:13px/17px Monaco,Menlo,"Ubuntu Mono",Consolas,"Source Code Pro",monospace;
}
.syn-ed[data-theme="monokai"]{--ed-bg:#272822;--ed-fg:#f8f8f2;--ed-gutter:#2f3129;--ed-gutter-fg:#8f908a;--ed-line:#202020;--ed-sel:#49483e;--kw:#f92672;--str:#e6db74;--num:#ae81ff;--com:#75715e;--fn:#a6e22e;--gl:#66d9ef;}
.syn-ed[data-theme="dracula"]{--ed-bg:#282a36;--ed-fg:#f8f8f2;--ed-gutter:#282a36;--ed-gutter-fg:#6272a4;--ed-line:#44475a;--ed-sel:#44475a;--kw:#ff79c6;--str:#f1fa8c;--num:#bd93f9;--com:#6272a4;--fn:#50fa7b;--gl:#8be9fd;}
.syn-ed[data-theme="cobalt"]{--ed-bg:#002240;--ed-fg:#fff;--ed-gutter:#011e3a;--ed-gutter-fg:#4d90b1;--ed-line:#00000059;--ed-sel:#b36539bf;--kw:#ff9d00;--str:#3ad900;--num:#ff628c;--com:#08f;--fn:#ffb054;--gl:#80ffbb;}
.syn-ed[data-theme="twilight"]{--ed-bg:#141414;--ed-fg:#f8f8f8;--ed-gutter:#232323;--ed-gutter-fg:#e2e2e2;--ed-line:#ffffff08;--ed-sel:#ddf0ff33;--kw:#cda869;--str:#8f9d6a;--num:#cf6a4c;--com:#5f5a60;--fn:#dad085;--gl:#7587a6;}
.syn-gutter{flex:none;width:41px;padding-right:12px;background:var(--ed-gutter);color:var(--ed-gutter-fg);text-align:right;user-select:none;}
.syn-gutter div{height:17px;}
.syn-gutter .on{background:var(--ed-line);margin-right:-12px;padding-right:12px;}
.syn-code{position:relative;flex:1;min-width:0;overflow:hidden;}
.syn-hl,.syn-ta{
  position:absolute;inset:0;margin:0;padding:0 4px;
  font:inherit;tab-size:4;white-space:pre;
}
.syn-hl{right:auto;bottom:auto;min-width:100%;color:var(--ed-fg);pointer-events:none;}
.syn-ta{
  width:100%;height:100%;border:0;outline:0;resize:none;overflow:auto;
  background:transparent;color:transparent;caret-color:var(--ed-fg);
}
.syn-ta::selection{background:var(--ed-sel);color:transparent;}
.syn-active{position:absolute;left:0;right:0;top:0;height:17px;background:var(--ed-line);pointer-events:none;}
.syn-ed .kw{color:var(--kw);}
.syn-ed .str{color:var(--str);}
.syn-ed .num{color:var(--num);}
.syn-ed .com{color:var(--com);font-style:italic;}
.syn-ed .fn{color:var(--fn);}
.syn-ed .gl{color:var(--gl);}

.syn-list{grid-row:2;grid-column:2;margin:0 7px 0 0;padding:0;list-style:none;overflow:auto;background:#1f1f1f;font-size:12px;}
.syn-list li{padding:1px 4px;border:1px solid transparent;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:default;user-select:none;}
.syn-list li:hover{background:#1f3a4d;border-color:#1f5f8b;}
.syn-list li[aria-selected="true"]{background:#26425a;border-color:#26a0da;}
.syn-ctx{position:fixed;z-index:80;min-width:120px;padding:2px 0;background:#2b2b2b;border:1px solid #a0a0a0;font:12px "Segoe UI",system-ui,sans-serif;}
.syn-ctx[hidden]{display:none;}
.syn-ctx button{display:block;width:100%;padding:3px 20px 3px 8px;border:0;background:none;color:#fff;font:inherit;text-align:left;}
.syn-ctx button:hover,.syn-ctx button:focus-visible{background:#3e3e40;outline:0;}

.syn-btns{grid-row:3;grid-column:1 / -1;display:flex;align-items:center;min-width:0;padding-right:7px;}
.syn-btn{
  flex:none;width:90px;height:30px;margin-left:7px;padding:0;
  border:0;border-radius:3px;background:#2d2d2d;color:#fff;font:14px "Segoe UI",system-ui,sans-serif;
  transition:background-color .2s cubic-bezier(.25,1,.5,1);
}
.syn-btn:hover{background:#2c3d4d;box-shadow:inset 0 0 0 1px #868686;}
.syn-attach-info{margin-left:auto;padding-left:8px;font-size:11.5px;}
.syn-btns .syn-attach{margin-left:7px;}
.syn-frozen .win-body{position:relative;cursor:wait;}
.syn-frozen .win-body::after{content:"";position:absolute;inset:0;background:rgba(255,255,255,.45);}

.syn-opt{display:grid;grid-template-columns:105px minmax(0,1fr);height:340px;}
.syn-opt-nav{display:grid;align-content:start;justify-items:end;padding-top:2px;}
.syn-opt-nav button{width:100px;height:30px;margin-bottom:2px;padding:0 0 0 10px;border:0;border-radius:7px;background:#121212;color:#fff;font-size:13px;text-align:left;transition:background-color .15s;}
.syn-opt-nav button:hover,.syn-opt-nav button[aria-selected="true"]{background:#1f1f1f;}
.syn-opt-panel{min-width:0;overflow:auto;padding:0 0 10px;}
.syn-opt-panel[hidden]{display:none;}
.syn-opt-row{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:32px;padding:5px 10px 0 4px;}
.syn-toggle{position:relative;flex:none;width:40px;height:22px;padding:0;border:0;border-radius:9px;background:#72767d;transition:background-color .5s cubic-bezier(.25,1,.5,1);}
.syn-toggle::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:translate .5s cubic-bezier(.25,1,.5,1);}
.syn-toggle[aria-checked="true"]{background:#3ea660;}
.syn-toggle[aria-checked="true"]::after{translate:18px 0;}
.syn-select{display:block;width:calc(100% - 15px);height:25px;margin:10px 10px 30px 5px;padding:0 5px;border:0;border-radius:3px;background:#1f1f1f;color:#fff;font:13px "Segoe UI",system-ui,sans-serif;}
.syn-hub{display:grid;justify-items:center;align-content:start;gap:30px;padding:10px 6px 20px 0;}
.syn-hub[hidden]{display:none;}
.syn-hub-item{display:grid;width:170px;padding:0;border:0;border-radius:7px;background:#1f1f1f;color:#fff;overflow:hidden;transition:scale .2s cubic-bezier(.25,1,.5,1);}
.syn-hub-item:hover{scale:1.05;}
.syn-hub-item span{height:20px;line-height:20px;font:600 10px "Segoe UI",system-ui,sans-serif;}
.syn-hub-item img{display:block;width:100%;height:auto;}
.syn-note{margin:0;padding:0 10px 0 4px;font-size:9px;}
.syn-wide{display:block;width:200px;margin:10px auto 0;}
.syn-credit{margin-top:14px;font-size:10px;color:#aaa;text-align:center;}
.syn-credit a{color:#bb86fc;}

.syn-confirm-body{padding:10px 20px 12px;text-align:center;}
.syn-confirm-body p{margin:0 0 12px;min-height:34px;}
.syn-confirm-btns{display:flex;justify-content:center;}
.syn-log-wrap{display:grid;gap:8px;padding:8px;}
.syn-log{height:200px;overflow:auto;padding:6px 8px;background:#1f1f1f;font:12px/1.45 Consolas,"Courier New",monospace;color:#ddd;white-space:pre-wrap;overflow-wrap:anywhere;}
.syn-spy{height:260px;}
.syn-spy div{padding:3px 0;border-bottom:1px solid #2d2d2d;}
.syn-log-btns{display:flex;justify-content:flex-end;}
.syn-log-btns[hidden]{display:none;}
.syn-log-btns .syn-btn{width:auto;padding:0 12px;}

/* dark dex v3, colors sampled from screenshots of the real one */
@font-face{font-family:"Source Sans 3";src:url("fonts/source-sans-3.woff2") format("woff2");font-weight:200 900;font-display:swap;}
.dex{
  --dex-font:"Source Sans 3","Source Sans Pro","Segoe UI",system-ui,sans-serif;
  position:fixed;top:0;right:0;bottom:var(--taskbar-h);z-index:60;
  display:flex;max-width:100vw;
  font:14px/1 var(--dex-font);color:#fff;
}
.dex button{font:inherit;color:inherit;}
.dex :focus-visible{outline:1px solid #007a95;outline-offset:-1px;}
.dex-side{
  flex:none;display:flex;flex-direction:column;align-items:center;gap:8px;
  width:35px;padding:6px 0 10px;background:#2b2b2b;border-radius:8px 0 0 8px;align-self:flex-start;
}
.dex-logo{display:grid;justify-items:center;gap:3px;margin-bottom:4px;font:700 14px/1 var(--dex-font);letter-spacing:.5px;}
.dex-logo b:last-child{font-size:12px;}
.dex-side-btn{display:grid;place-items:center;width:30px;height:30px;padding:0;border:0;background:none;opacity:.7;}
.dex-side-btn:hover,.dex-side-btn.on{opacity:1;}
.dex-side-btn img{display:block;}
.dex-main{display:flex;flex-direction:column;width:330px;min-width:0;background:#2b2b2b;}
.dex.collapsed .dex-main{display:none;}
.dex-bar{display:flex;align-items:center;justify-content:space-between;height:26px;padding:0 4px 0 6px;flex:none;}
.dex-bar > span{font-size:15px;}
.dex-bar2{height:21px;background:#141414;}
.dex-tools{display:flex;align-items:center;}
.dex-tool{display:grid;place-items:center;padding:0 1px;border:0;background:none;}
.dex-tool:hover{background:#3a3a3a;}
.dex-tool img{display:block;}
.dex-pad{padding:0 4px 2px 6px;flex:none;}
.dex-filter,.dex-search{
  display:block;width:100%;height:19px;padding:0 3px;border:0;border-radius:0;
  background:#434343;color:#fff;font:15px/19px var(--dex-font);
}
.dex-search{background:#313031;border:1px solid #434343;height:20px;margin-top:2px;}
.dex-filter::placeholder,.dex-search::placeholder{color:#e6e6e6;opacity:.85;}
.dex-search::placeholder{color:#9a9a9a;}
.dex-tree,.dex-props{
  flex:1 1 0;min-height:0;overflow:auto;margin:0;padding:2px 0;list-style:none;background:#313031;
  scrollbar-color:#353536 #404040;
}
.dex-tree ul{list-style:none;margin:0;padding:0;}
.dex-props{flex:.8 1 0;padding:0;}
.dex-row{display:flex;align-items:center;height:23px;white-space:nowrap;}
.dex-row:hover{background:#383838;}
.dex-arrow{flex:none;width:16px;height:16px;padding:0;border:0;background:none;}
button.dex-arrow{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M5 3l5 5-5 5' fill='none' stroke='%23fff' stroke-width='1.6'/%3E%3C/svg%3E") center/16px no-repeat;}
button.dex-arrow.open{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 5.5l5 5 5-5' fill='none' stroke='%23fff' stroke-width='1.6'/%3E%3C/svg%3E");}
.dex-name{
  display:flex;align-items:center;gap:7px;min-width:250px;height:21px;margin-left:3px;padding:0 6px 0 3px;
  border:1px solid transparent;background:none;text-align:left;white-space:nowrap;
}
.dex-name.on{background:#05668d;border-color:#007a95;}
.dex-ic{flex:none;width:16px;height:16px;background:url("synapse/dex/classes.png") 0 0 no-repeat;image-rendering:pixelated;}
.dex-cat{height:22px;padding:0 6px;line-height:22px;background:#2b2b2b;font-weight:600;}
.dex-prop{display:grid;grid-template-columns:42% 1fr;align-items:center;height:22px;border-bottom:1px solid #2b2b2b;}
.dex-prop > span:first-child{padding-left:14px;border-right:1px solid #2b2b2b;line-height:21px;color:#e6e6e6;overflow:hidden;text-overflow:ellipsis;}
.dex-prop > span:last-child{padding:0 6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.dex-check{margin:0 6px;accent-color:#05668d;}
.dex ::-webkit-scrollbar{width:18px;height:18px;}
.dex ::-webkit-scrollbar-track{background:#404040;}
.dex ::-webkit-scrollbar-thumb{background:#353536 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M1 2.5h8M1 5h8M1 7.5h8' stroke='%23fff'/%3E%3C/svg%3E") center/10px no-repeat;}
.dex ::-webkit-scrollbar-button:single-button{display:block;height:18px;background:#353536 center/9px no-repeat;}
.dex ::-webkit-scrollbar-button:single-button:vertical:decrement{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M1 7h8L5 2z' fill='%23fff'/%3E%3C/svg%3E");}
.dex ::-webkit-scrollbar-button:single-button:vertical:increment{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M1 3h8L5 8z' fill='%23fff'/%3E%3C/svg%3E");}
.dex ::-webkit-scrollbar-corner{background:#2b2b2b;}
@media (max-width:640px){
  .dex-main{width:calc(100vw - 35px);}
}

/* infinite yield */
.iy{
  position:fixed;right:12px;bottom:calc(var(--taskbar-h) + 12px);z-index:70;
  width:260px;background:#242424;color:#fff;
  font:14px "Segoe UI",system-ui,sans-serif;box-shadow:0 4px 14px rgba(0,0,0,.5);
}
.iy-head{display:flex;align-items:center;justify-content:space-between;height:24px;padding:0 4px 0 8px;background:#2e2e2e;font-size:13px;}
.iy-head button{width:22px;height:22px;border:0;background:none;color:#fff;font-size:16px;line-height:1;}
.iy-head button:hover{background:#c42b1c;}
.iy input{display:block;width:100%;height:28px;padding:0 8px;border:0;background:#363636;color:#fff;font:14px "Segoe UI",system-ui,sans-serif;}
.iy input::placeholder{color:#aaa;}
.iy input:focus{outline:1px solid #6b6b6b;outline-offset:-1px;}
.iy-list{max-height:190px;overflow:auto;padding:4px 0;font-size:12.5px;color:#ccc;scrollbar-color:#555 transparent;scrollbar-width:thin;}
.iy-list div{padding:2px 8px;}
.iy-list b{color:#fff;font-weight:600;}
.iy-note{
  position:fixed;right:12px;bottom:calc(var(--taskbar-h) + 270px);z-index:71;
  display:grid;gap:2px;width:260px;padding:8px 10px;
  background:#242424;color:#ddd;font:13px "Segoe UI",system-ui,sans-serif;box-shadow:0 4px 14px rgba(0,0,0,.5);
  animation:iy-in .3s cubic-bezier(.25,1,.5,1);transition:opacity .4s;
}
.iy-note b{color:#fff;}
.iy-note.out{opacity:0;}
@keyframes iy-in{from{translate:30px 0;opacity:0;}}
html.iy-fly .win:not(.maxed){animation:iy-fly 2.4s ease-in-out infinite alternate;}
html.iy-spin .win:not(.maxed){animation:iy-spin 8s linear infinite;}
html.iy-fly.iy-spin .win:not(.maxed){animation:iy-fly 2.4s ease-in-out infinite alternate,iy-spin 8s linear infinite;}
@keyframes iy-fly{from{translate:0 0;}to{translate:0 -16px;}}
@keyframes iy-spin{to{rotate:360deg;}}
html.iy-invis .win{opacity:.2;}
html.iy-gravity .win{translate:0 var(--fall,0px);transition:translate .9s cubic-bezier(.55,0,1,.45);}

/* esp */
html.syn-esp .win:not(.closed){outline:2px solid #ff3b3b;outline-offset:2px;}
html.syn-esp .win:not(.closed)::after{
  content:attr(data-esp);position:absolute;left:0;bottom:100%;margin-bottom:5px;
  color:#ff3b3b;font:bold 11px/1 Consolas,"Courier New",monospace;text-shadow:1px 1px 0 #000;white-space:nowrap;pointer-events:none;
}
.esp-lines{position:fixed;inset:0;z-index:55;width:100%;height:100%;pointer-events:none;}
.esp-lines line{stroke:#ff3b3b;stroke-width:1.5;}

/* the roblox kick screen */
.rbx-kick{position:fixed;inset:0;z-index:95;display:grid;place-items:center;padding:16px;background:rgba(0,0,0,.55);}
.rbx-kick-box{width:min(400px,100%);padding:18px 20px 20px;border-radius:8px;background:#393b3d;color:#fff;text-align:center;font:16px/1.4 "Segoe UI",system-ui,sans-serif;box-shadow:0 8px 30px rgba(0,0,0,.5);}
.rbx-kick-box h2{margin:0 0 12px;padding-bottom:12px;border-bottom:1px solid #56585a;font:bold 20px "Segoe UI",system-ui,sans-serif;}
.rbx-kick-box p{margin:0 0 4px;overflow-wrap:anywhere;}
.rbx-kick-code{color:#bdbebe;font-size:14px;}
.rbx-kick-box button{width:100%;height:40px;margin-top:16px;border:0;border-radius:8px;background:#fff;color:#393b3d;font:600 16px "Segoe UI",system-ui,sans-serif;}
.rbx-kick-box button:hover{background:#e5e5e5;}

@media (max-width:860px){
  .windows > .program > .win.syn-main.syn-ready{width:100%;}
}
@media (max-width:640px){
  .syn{grid-template-columns:minmax(0,1fr) 96px;grid-template-rows:35px minmax(0,1fr) auto;height:380px;}
  .syn-btns{flex-wrap:wrap;gap:6px 0;padding:7px 7px 7px 0;}
  .syn-btn{width:auto;min-width:64px;padding:0 10px;font-size:13px;}
  .syn-attach-info{order:9;width:100%;text-align:right;margin:0;}
  .syn-main .win-title h2{inset:0 125px 0 32px;}
}
@media (prefers-reduced-motion:reduce){
  html.iy-fly .win,html.iy-spin .win{animation-duration:20s;}
}

/* ---------- floating, resizable windows (wide screens) ---------- */
.win.sized .win-body{flex:1 1 auto;min-height:0;overflow:auto;}
.win.sized.popup .win-body{max-height:none;}
.syn-win.sized .win-body{display:flex;flex-direction:column;overflow:hidden;}
.syn-win.sized .syn-body,.syn-win.maxed .syn-body{flex:1;min-height:0;display:flex;flex-direction:column;}
.syn-win.sized .syn{flex:1;height:auto;min-height:0;}
.rz{position:absolute;z-index:2;display:none;}
.rz-n,.rz-s{left:6px;right:6px;height:6px;cursor:ns-resize;}
.rz-n{top:-3px;}
.rz-s{bottom:-3px;}
.rz-e,.rz-w{top:6px;bottom:6px;width:6px;cursor:ew-resize;}
.rz-e{right:-3px;}
.rz-w{left:-3px;}
.rz-ne,.rz-nw,.rz-se,.rz-sw{width:12px;height:12px;}
.rz-ne{top:-4px;right:-4px;cursor:nesw-resize;}
.rz-sw{bottom:-4px;left:-4px;cursor:nesw-resize;}
.rz-nw{top:-4px;left:-4px;cursor:nwse-resize;}
.rz-se{bottom:-4px;right:-4px;cursor:nwse-resize;}
html.resizing,html.resizing *{user-select:none;}
html.resizing iframe{pointer-events:none;}
@media (min-width:861px){
  /* minimized windows go to the taskbar, like XP */
  .win.dragged.min{display:none;}
  .win.dragged:not(.maxed) > .rz{display:block;}
}

/* ---------- more synapse scripts ---------- */
/* ClockTime */
.wallpaper{transition:filter 1.6s ease;}
.wallpaper::after{content:"";position:absolute;inset:0;opacity:0;transition:opacity 1.6s ease;pointer-events:none;
  background:
    radial-gradient(1.5px 1.5px at 12% 18%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 27% 8%,#fff 50%,transparent 51%),
    radial-gradient(1.5px 1.5px at 41% 22%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 55% 12%,#fff 50%,transparent 51%),
    radial-gradient(2px 2px at 68% 6%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 79% 25%,#fff 50%,transparent 51%),
    radial-gradient(1.5px 1.5px at 90% 14%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 6% 33%,#fff 50%,transparent 51%),
    radial-gradient(1px 1px at 35% 35%,#fff 50%,transparent 51%),radial-gradient(1.5px 1.5px at 62% 30%,#fff 50%,transparent 51%),
    radial-gradient(1px 1px at 85% 38%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 18% 42%,#fff 50%,transparent 51%);
}
html.syn-clock .wallpaper{filter:brightness(calc(.28 + .72 * var(--day,1))) saturate(calc(.55 + .45 * var(--day,1))) hue-rotate(calc((1 - var(--day,1)) * 25deg));}
html.syn-clock .wallpaper::after{opacity:calc(1 - var(--day,1) * 1.6);}

/* Humanoid.Health = 0 */
html.syn-dead .win{translate:0 var(--fall,0px);rotate:var(--spin,0deg);transition:translate .9s cubic-bezier(.55,0,1,.45),rotate .9s ease-in;}
html.syn-dead::after{content:"";position:fixed;inset:0;z-index:58;background:rgba(160,0,0,.18);pointer-events:none;animation:rbx-hurt 3s ease-out;}
@keyframes rbx-hurt{from{background:rgba(200,0,0,.45);}}
.win{transition:translate .5s cubic-bezier(.25,1,.5,1),rotate .5s ease;}

/* Instance.new("Part") */
.rbx-parts{position:fixed;left:0;right:0;bottom:var(--taskbar-h);height:0;z-index:54;}
.rbx-part{
  position:absolute;width:64px;height:26px;
  background:linear-gradient(180deg,color-mix(in srgb,var(--c) 75%,#fff) 0 3px,var(--c) 3px calc(100% - 3px),color-mix(in srgb,var(--c) 70%,#000) calc(100% - 3px));
  border:1px solid color-mix(in srgb,var(--c) 60%,#000);
  box-shadow:inset 1px 0 0 rgba(255,255,255,.25),0 2px 3px rgba(0,0,0,.3);
  animation:rbx-drop .7s cubic-bezier(.5,0,.9,.6) both;
}
.rbx-part.landed{animation:none;}
.rbx-part.grabbed{z-index:1;outline:2px solid #2f8cff;cursor:grabbing;}
@keyframes rbx-drop{from{translate:0 calc(-100vh - 40px);}to{translate:0 0;}}

/* HopperBin btools */
.rbx-backpack{position:fixed;left:50%;bottom:calc(var(--taskbar-h) + 10px);z-index:75;display:flex;gap:6px;translate:-50% 0;}
.rbx-slot{
  position:relative;display:grid;place-items:center;width:60px;height:60px;padding:0;
  border:0;border-radius:8px;background:rgba(31,31,31,.65);color:#fff;
  font:600 13px "Source Sans 3","Segoe UI",system-ui,sans-serif;cursor:pointer;
}
.rbx-slot:hover{background:rgba(60,60,60,.75);}
.rbx-slot[aria-pressed="true"]{box-shadow:inset 0 0 0 2px #fff;}
.rbx-slot-n{position:absolute;top:3px;left:6px;font-size:11px;font-weight:400;opacity:.8;}
html[data-btool="Hammer"] .win,html[data-btool="Hammer"] .rbx-part{cursor:crosshair;}
html[data-btool="Clone"] .rbx-part,html[data-btool="Grab"] .rbx-part{cursor:copy;}
html[data-btool="Grab"] .rbx-part{cursor:grab;}
html[data-btool] .rbx-parts{pointer-events:auto;}
.rbx-parts{pointer-events:none;}
.rbx-part{pointer-events:auto;}
.rbx-smash{animation:rbx-smash .22s ease-in forwards!important;}
@keyframes rbx-smash{to{scale:.6;opacity:0;filter:brightness(2);}}

/* TeleportService */
.rbx-tp{position:fixed;inset:0;z-index:96;display:grid;place-items:center;background:#000;color:#fff;font:16px "Source Sans 3","Segoe UI",system-ui,sans-serif;animation:rbx-fade .25s ease;transition:opacity .4s;}
.rbx-tp.out{opacity:0;}
.rbx-tp-box{display:grid;justify-items:center;gap:8px;}
.rbx-tp-box b{font-size:22px;font-weight:600;}
.rbx-tp-box span:last-child{color:#bbb;}
.rbx-spin{width:38px;height:38px;border:4px solid rgba(255,255,255,.2);border-top-color:#fff;border-radius:50%;animation:rbx-spin .8s linear infinite;}
@keyframes rbx-spin{to{rotate:360deg;}}
@keyframes rbx-fade{from{opacity:0;}}

/* Chat bubble */
.rbx-bubble{
  position:absolute;left:50%;bottom:calc(100% + 14px);z-index:3;translate:-50% 0;
  max-width:260px;padding:8px 12px;border-radius:10px;background:#fff;color:#393b3d;
  font:600 16px/1.25 "Source Sans 3","Segoe UI",system-ui,sans-serif;text-align:center;overflow-wrap:anywhere;
  box-shadow:0 2px 6px rgba(0,0,0,.25);animation:rbx-pop .2s cubic-bezier(.25,1,.5,1);transition:opacity .4s;
}
.rbx-bubble::after{content:"";position:absolute;left:50%;top:100%;translate:-50% 0;border:8px solid transparent;border-top-color:#fff;}
.rbx-bubble.below{bottom:auto;top:44px;}
.rbx-bubble.below::after{top:auto;bottom:100%;border-top-color:transparent;border-bottom-color:#fff;}
.rbx-bubble.out{opacity:0;}
@keyframes rbx-pop{from{scale:.6;opacity:0;}}
@media (prefers-reduced-motion:reduce){
  .rbx-part{animation-duration:.01s;}
}

/* kickassapp.com */
.kick-canvas{position:fixed;inset:0;z-index:97;width:100vw;height:100vh;pointer-events:none;}
.kick-gone{visibility:hidden!important;}
.kick-hud{
  position:fixed;top:10px;right:10px;z-index:98;display:grid;grid-template-columns:auto auto;align-items:baseline;gap:2px 6px;
  padding:8px 12px;border:2px solid #222;border-radius:6px;background:#fff;color:#222;
  font:600 14px/1.2 "Segoe UI",system-ui,sans-serif;box-shadow:3px 3px 0 #222;
}
.kick-hud b{font-size:20px;}
.kick-hud small{grid-column:1/-1;font-weight:400;font-size:11px;color:#555;}