:root{--amber:#ffb54a;--amber2:#ffd899;--bg:#050301;--line:rgba(255,181,74,.28)}
*{box-sizing:border-box}
html,body{height:100%}
html, body, button, input, textarea, select{font-family:"Courier New",Courier,monospace}
body{margin:0;background:#000;color:var(--amber2);overflow:hidden}
button{font:inherit}
.hidden{display:none!important}

.boot-screen{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:#000;color:var(--amber);z-index:50;overflow:hidden}
.boot-content{position:relative;z-index:3;display:flex;align-items:center;gap:12px;font-size:30px;letter-spacing:.05em;text-shadow:0 0 10px rgba(255,181,74,.35);transition:opacity .06s linear}
.boot-cursor{margin-left:8px;width:18px;height:24px;background:var(--amber);display:inline-block;box-shadow:0 0 10px rgba(255,181,74,.45);animation:blink 1s steps(1) infinite}
.boot-powerline{position:absolute;left:0;right:0;top:50%;height:2px;background:#ffc46b;box-shadow:0 0 18px rgba(255,181,74,.95),0 0 42px rgba(255,181,74,.45);transform:translateY(-50%) scaleX(0);transform-origin:center center;opacity:0}
.boot-noise{position:absolute;inset:0;opacity:.06;background-image:radial-gradient(circle at 20% 30%, rgba(255,255,255,.18) 0 1px, transparent 1px),radial-gradient(circle at 76% 62%, rgba(255,255,255,.12) 0 1px, transparent 1px),radial-gradient(circle at 42% 74%, rgba(255,255,255,.16) 0 1px, transparent 1px);background-size:7px 7px,9px 9px,11px 11px}
.boot-screen.powering .boot-content{opacity:0}
.boot-screen.powering .boot-powerline{animation:bootLineAcross .12s ease-out forwards,bootLineOpen .42s .12s ease-out forwards}
.boot-screen.fade{animation:fadeOut .35s ease forwards}

@keyframes fadeOut{to{opacity:0;visibility:hidden}}
@keyframes blink{0%,50%{opacity:1}50.01%,100%{opacity:0}}
@keyframes bootLineAcross{0%{opacity:0;transform:translateY(-50%) scaleX(0)}100%{opacity:1;transform:translateY(-50%) scaleX(1)}}
@keyframes bootLineOpen{0%{height:2px;opacity:1}45%{height:18vh;opacity:1}100%{height:120vh;opacity:1}}
@keyframes desktopReveal{0%{opacity:0;clip-path:inset(50% 0 50% 0);filter:brightness(1.75)}18%{opacity:1;clip-path:inset(48% 0 48% 0);filter:brightness(1.95)}55%{opacity:1;clip-path:inset(14% 0 14% 0);filter:brightness(1.15)}100%{opacity:1;clip-path:inset(0 0 0 0);filter:brightness(1)}}

.desktop{position:fixed;inset:0;background:radial-gradient(circle at center,#150b04 0%,var(--bg) 55%,#020100 100%);opacity:0;clip-path:inset(50% 0 50% 0)}
.desktop.turn-on{animation:desktopReveal .46s ease-out forwards}
.crt-overlay,.screen-static,.screen-vignette{position:fixed;inset:0;pointer-events:none}
.crt-overlay{background:linear-gradient(rgba(255,181,74,.022),rgba(255,181,74,.012)),repeating-linear-gradient(to bottom,rgba(255,181,74,.045) 0px,rgba(255,181,74,.045) 1px,transparent 2px,transparent 4px);opacity:.72;animation:crtFlicker 8s linear infinite}
.screen-static{opacity:.04;background-image:radial-gradient(circle at 14% 18%, rgba(255,255,255,.24) 0 1px, transparent 1px),radial-gradient(circle at 74% 28%, rgba(255,255,255,.14) 0 1px, transparent 1px),radial-gradient(circle at 34% 68%, rgba(255,255,255,.14) 0 1px, transparent 1px),radial-gradient(circle at 82% 82%, rgba(255,255,255,.16) 0 1px, transparent 1px);background-size:8px 8px,10px 10px,12px 12px,9px 9px}
.screen-vignette{box-shadow:inset 0 0 120px rgba(0,0,0,.65)}

.hub{position:absolute;inset:0;z-index:2}
.hub-card{position:absolute;left:50%;top:50%;width:246px;height:246px;transform:translate(-50%,-50%);border:1px solid rgba(255,181,74,.26);background:rgba(10,6,3,.8);box-shadow:0 0 0 1px rgba(255,181,74,.05) inset,0 0 18px rgba(255,181,74,.08);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:14px;border-radius:50%;cursor:pointer;transition:border-color .18s ease,box-shadow .18s ease,color .18s ease,transform .18s ease}
.hub-card:hover{border-color:rgba(255,208,141,.72);box-shadow:0 0 16px rgba(255,181,74,.15),0 0 0 1px rgba(255,181,74,.08) inset;transform:translate(-50%,-50%) scale(1.02)}
.hub-card:active{transform:translate(-50%,-50%) scale(.99)}
.hub-name{font-size:18px;line-height:1.05;white-space:nowrap;letter-spacing:0;color:#ffe3b0}
.hub-sub{margin-top:10px;font-size:9px;line-height:1.1;white-space:nowrap;letter-spacing:.08em;color:rgba(255,215,149,.72)}
.hub-pi{margin-top:18px;font-size:30px;color:rgba(255,191,97,.78)}

.node{position:absolute;width:190px;height:66px;border-radius:40px;border:1px solid rgba(255,181,74,.26);background:rgba(11,7,4,.86);color:var(--amber2);box-shadow:0 0 0 1px rgba(255,181,74,.05) inset;cursor:pointer;transition:border-color .18s ease,box-shadow .18s ease,color .18s ease}
.node:hover{border-color:rgba(255,208,141,.72);box-shadow:0 0 16px rgba(255,181,74,.15),0 0 0 1px rgba(255,181,74,.08) inset;color:#ffe3b0}
.node.active{border-color:rgba(255,210,140,.9);box-shadow:0 0 18px rgba(255,181,74,.35)}
.node-about{left:50%;top:8%;transform:translateX(-50%)}
.node-experience{right:15%;top:31%}
.node-skills{right:15%;bottom:24%}
.node-education{left:15%;bottom:24%}
.node-contact{left:15%;top:31%}
.node-linkedin{left:50%;bottom:8%;transform:translateX(-50%)}

.system-clock{position:absolute;right:2.5%;bottom:2.5%;z-index:3;color:rgba(255,216,153,.82);font-size:13px;line-height:1.35;letter-spacing:.06em;text-align:right;text-shadow:0 0 6px rgba(255,181,74,.18);user-select:none;-webkit-user-select:none}
.system-clock .clock-day{color:#ffe2ad;font-size:13px}
.system-clock .clock-date,.system-clock .clock-time{color:rgba(255,216,153,.78);font-size:12px}

.window-layer{position:fixed;inset:0;z-index:5;pointer-events:none}
.window{position:absolute;border-radius:10px;background:linear-gradient(180deg,rgba(18,11,6,.96),rgba(8,5,3,.97));border:1px solid rgba(255,181,74,.28);box-shadow:0 0 0 1px rgba(255,181,74,.05) inset,0 0 20px rgba(255,181,74,.12);display:none;pointer-events:auto;min-width:260px;min-height:160px;overflow:hidden}
.window.open{display:block}

.titlebar{height:34px;display:flex;align-items:center;justify-content:space-between;padding:0 8px 0 10px;background:rgba(255,181,74,.06);border-bottom:1px solid rgba(255,181,74,.18);cursor:move;user-select:none;-webkit-user-select:none}
.title-left{display:flex;align-items:center;gap:8px}
.title-dot{width:8px;height:8px;background:rgba(255,181,74,.8)}
.title-text{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#ffe1a7}
.controls{display:flex;gap:6px;justify-content:flex-end}
.control{border:none;background:transparent;color:#ffd899;font-size:16px;cursor:pointer}
.control:hover{color:#ffb54a}

.window-tabs{display:flex;gap:8px;padding:10px 16px 0 16px;border-bottom:1px solid rgba(255,181,74,.12);box-sizing:border-box}
.window-tab{border:none;background:transparent;color:rgba(255,216,153,.72);padding:6px 10px 8px 10px;cursor:pointer;font-size:13px;letter-spacing:.05em}
.window-tab:hover{color:#ffe2ad}
.window-tab.active{color:#ffe2ad;border-bottom:1px solid rgba(255,181,74,.6);text-shadow:0 0 6px rgba(255,181,74,.2)}

.window-body{height:calc(100% - 48px);overflow:auto;overflow-x:hidden;padding:14px 22px 18px 16px;font-size:14px;line-height:1.6;user-select:text;-webkit-user-select:text}
.window-body.two-col{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.tab-panel{display:none;height:calc(100% - 60px);overflow:auto;overflow-x:hidden;padding:14px 22px 18px 16px;box-sizing:border-box}
.tab-panel.active{display:block}
.window.dragging,.window.dragging *{user-select:none !important;-webkit-user-select:none !important;cursor:move !important}
body.dragging-window,body.dragging-window *{user-select:none !important;-webkit-user-select:none !important}

.window-body hr{border:none;border-top:1px solid rgba(255,181,74,.16);margin:16px 0}
.entry{margin-bottom:14px;max-width:100%}
.entry-title{color:#ffe2ad;font-weight:bold;max-width:100%;overflow-wrap:anywhere}
.entry-meta{color:rgba(255,215,149,.68);font-size:12px;margin:4px 0 6px;max-width:100%;overflow-wrap:anywhere}
.entry ul,.entry li{max-width:100%;overflow-wrap:anywhere;word-break:normal}
.project-card{border:1px solid rgba(255,181,74,.14);background:#090502;padding:10px 12px;margin-bottom:10px}
.resize-handle{position:absolute;right:2px;bottom:2px;width:14px;height:14px;cursor:nwse-resize;background:linear-gradient(135deg,transparent 0 38%,rgba(255,181,74,.6) 38% 46%,transparent 46% 58%,rgba(255,181,74,.6) 58% 66%,transparent 66%);z-index:7}
ul{margin:8px 0 0 18px}
p{margin:0 0 12px 0}
h4{margin:0 0 8px}

.cert-list a{color:#ffe2ad;text-decoration:none}
.cert-list a:hover{color:#ffb54a;text-shadow:0 0 6px rgba(255,181,74,.4)}

*{scrollbar-width:thin;scrollbar-color:rgba(255,181,74,.72) rgba(12,7,3,.88)}
*::-webkit-scrollbar{width:12px;height:12px}
*::-webkit-scrollbar-track{background:rgba(12,7,3,.88);border-left:1px solid rgba(255,181,74,.12);border-top:1px solid rgba(255,181,74,.12)}
*::-webkit-scrollbar-thumb{background:linear-gradient(180deg, rgba(255,216,153,.82), rgba(255,181,74,.72));border:2px solid rgba(12,7,3,.88);border-radius:10px;box-shadow:0 0 8px rgba(255,181,74,.18)}
*::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg, rgba(255,226,173,.96), rgba(255,181,74,.9));box-shadow:0 0 12px rgba(255,181,74,.3)}
*::-webkit-scrollbar-corner{background:rgba(12,7,3,.88)}
.window-body::-webkit-scrollbar-track,.tab-panel::-webkit-scrollbar-track{background:rgba(10,6,3,.96)}
.window-body::-webkit-scrollbar-thumb,.tab-panel::-webkit-scrollbar-thumb{background:linear-gradient(180deg, rgba(255,216,153,.86), rgba(255,181,74,.76))}

@media (max-width:980px){
  .hub-card{width:230px;height:230px}
  .hub-name{font-size:18px}
  .node{width:148px;height:58px;font-size:13px}
}

.window-body,
.tab-panel{
  scrollbar-gutter: stable;
  padding-bottom: 28px !important;
  padding-right: 28px !important;
}

.window-body{
  height: calc(100% - 56px) !important;
}

.tab-panel{
  height: calc(100% - 72px) !important;
}

.resize-handle{
  right: 4px !important;
  bottom: 4px !important;
  width: 16px !important;
  height: 16px !important;
  background:
    linear-gradient(135deg,
      transparent 0 34%,
      rgba(255,181,74,.72) 34% 42%,
      transparent 42% 56%,
      rgba(255,181,74,.72) 56% 64%,
      transparent 64%) !important;
}

#experienceWin{
  position:absolute;
  overflow:hidden;
}

#experienceWin .window-tabs{
  height:36px;
  align-items:flex-end;
}

#experienceWin .tab-panel{
  position:absolute;
  left:0;
  right:0;
  top:70px;
  bottom:22px;
  height:auto !important;
  padding:14px 26px 24px 16px !important;
  overflow:auto !important;
  overflow-x:hidden !important;
  box-sizing:border-box;
}

#experienceWin .tab-panel.active{
  display:block;
}

#experienceWin .resize-handle{
  z-index:10;
}

#experienceWin .tab-panel{
  padding-right: 30px !important;
  padding-bottom: 30px !important;
}

#experienceWin .resize-handle{
  background:
    linear-gradient(135deg,
      transparent 0 36%,
      rgba(255,181,74,.78) 36% 44%,
      transparent 44% 58%,
      rgba(255,181,74,.78) 58% 66%,
      transparent 66%) !important;
}

#educationWin{
  position:absolute;
  overflow:hidden;
}

#educationWin .window-tabs{
  height:36px;
  align-items:flex-end;
}

#educationWin .tab-panel{
  position:absolute;
  left:0;
  right:0;
  top:70px;
  bottom:22px;
  height:auto !important;
  padding:14px 26px 24px 16px !important;
  overflow:auto !important;
  overflow-x:hidden !important;
  box-sizing:border-box;
}

#educationWin .tab-panel.active{
  display:block;
}

#educationWin .resize-handle{
  z-index:10;
}

.node{
  position:absolute;
  overflow:visible;
}

.node::before{
  content:"";
  position:absolute;
  left:14px;
  top:50%;
  width:8px;
  height:8px;
  transform:translateY(-50%);
  background:rgba(255,181,74,.42);
  box-shadow:0 0 6px rgba(255,181,74,.14);
  transition:background .18s ease, box-shadow .18s ease, opacity .18s ease;
}

.node::after{
  content:"";
  position:absolute;
  inset:-5px;
  border:1px solid rgba(255,181,74,0);
  border-radius:46px;
  pointer-events:none;
  transition:border-color .18s ease, box-shadow .18s ease, opacity .18s ease;
  opacity:0;
}

.node:hover::after{
  opacity:1;
  border-color:rgba(255,181,74,.22);
  box-shadow:0 0 10px rgba(255,181,74,.14);
}

.node:hover{
  text-shadow:0 0 3px rgba(255,181,74,.28);
}

.node:hover::before{
  background:rgba(255,210,140,.82);
  box-shadow:0 0 8px rgba(255,181,74,.22);
}

.node.active::before{
  background:#ffb54a;
  box-shadow:0 0 10px rgba(255,181,74,.38), 0 0 18px rgba(255,181,74,.24);
}

.node.active{
  box-shadow:0 0 20px rgba(255,181,74,.20),0 0 0 1px rgba(255,181,74,.08) inset;
}

.node-tooltip{
  position:absolute;
  left:50%;
  top:calc(100% + 12px);
  transform:translate(-50%, -4px);
  min-width:170px;
  max-width:220px;
  padding:8px 10px;
  background:linear-gradient(180deg,rgba(18,11,6,.96),rgba(8,5,3,.98));
  color:rgba(255,216,153,.86);
  border:1px solid rgba(255,181,74,.20);
  box-shadow:0 0 10px rgba(255,181,74,.10), inset 0 0 0 1px rgba(255,181,74,.04);
  border-radius:2px;
  font-size:11px;
  line-height:1.35;
  letter-spacing:.04em;
  text-align:center;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:
    opacity .16s ease 5s,
    transform .16s ease 5s,
    visibility 0s linear 5s;
  z-index:15;
}

.node-tooltip::before{
  content:"";
  position:absolute;
  left:50%;
  top:-6px;
  width:10px;
  height:10px;
  transform:translateX(-50%) rotate(45deg);
  background:rgba(12,7,3,.98);
  border-left:1px solid rgba(255,181,74,.20);
  border-top:1px solid rgba(255,181,74,.20);
}

.node:hover .node-tooltip{
  opacity:1;
  visibility:visible;
  transform:translate(-50%, 0);
}

  18%{filter:brightness(1.35);opacity:1}
  32%{filter:brightness(.88)}
  48%{filter:brightness(1.18)}
  100%{filter:brightness(1);opacity:1}
}

.node{
  border-radius:4px;
  box-shadow:
    inset 0 0 0 1px rgba(255,181,74,.06),
    0 0 0 1px rgba(255,181,74,.10);
  letter-spacing:.05em;
  text-transform:uppercase;
}

.node::before{
  width:7px;
  height:7px;
  border-radius:1px;
}

.node-about,
.node-linkedin,
.node-experience,
.node-skills,
.node-education,
.node-contact{
  background:
    linear-gradient(180deg, rgba(18,11,6,.94), rgba(8,5,3,.96)),
    repeating-linear-gradient(to bottom, rgba(255,181,74,.018) 0 1px, transparent 1px 3px);
}

.node-tooltip{
  border-radius:2px;
  background:
    linear-gradient(180deg, rgba(18,11,6,.98), rgba(7,4,2,.99)),
    repeating-linear-gradient(to bottom, rgba(255,181,74,.02) 0 1px, transparent 1px 3px);
}

@keyframes crtFlicker{
  0%, 19%, 21%, 23%, 80%, 100% { opacity:.72; }
  20% { opacity:.68; }
  22% { opacity:.75; }
  81% { opacity:.69; }
}

@keyframes nodeBootFlicker{
  0%{filter:brightness(1);opacity:.96}
  18%{filter:brightness(1.18);opacity:1}
  34%{filter:brightness(.92)}
  48%{filter:brightness(1.10)}
  100%{filter:brightness(1);opacity:1}
}

#skillsWin{
  position:absolute;
  overflow:hidden;
}

#skillsWin .window-tabs{
  height:36px;
  align-items:flex-end;
  flex-wrap:wrap;
  gap:6px;
  padding-right:12px;
}

#skillsWin .tab-panel{
  position:absolute;
  left:0;
  right:0;
  top:70px;
  bottom:22px;
  height:auto !important;
  padding:14px 26px 24px 16px !important;
  overflow:auto !important;
  overflow-x:hidden !important;
  box-sizing:border-box;
}

#skillsWin .tab-panel.active{
  display:block;
}

#skillsWin .resize-handle{
  z-index:10;
}

.window-tabs .window-tab{
  position:relative;
  padding-bottom:6px;
}

.window-tabs .window-tab.active::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-1px;
  height:2px;
  background:rgba(255,181,74,.6);
}

.cert-list a,
#certificationsPanel a {
  color: #ffe2ad;
  text-decoration: none;
  transition: color 0.2s ease, text-shadow 0.2s ease;
}

.cert-list a:hover,
#certificationsPanel a:hover {
  color: #ffb54a;
  text-shadow: 0 0 6px rgba(255,181,74,0.4);
}

.window-tabs{
  display:flex;
  flex-wrap:nowrap !important;
  overflow-x:auto;
  overflow-y:hidden;
  white-space:nowrap;
  scrollbar-width:thin;
  padding-bottom:6px;
}

.window-tab{
  flex:0 0 auto;
}

#skillsWin .window-tabs,
#educationWin .window-tabs,
#experienceWin .window-tabs{
  padding-right:16px;
}

.window-tabs::-webkit-scrollbar{
  height:8px;
}

.window-tabs::-webkit-scrollbar-track{
  background:rgba(12,7,3,.78);
  border-top:1px solid rgba(255,181,74,.10);
}

.window-tabs::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg, rgba(255,216,153,.75), rgba(255,181,74,.65));
  border:1px solid rgba(12,7,3,.88);
  border-radius:8px;
}


#skillsWin .window-tabs{
  margin-bottom:18px !important;
  padding-bottom:14px !important;
  scrollbar-gutter: stable both-edges;
}

#skillsWin .window-tabs::-webkit-scrollbar{
  height:10px;
}

#skillsWin .window-tabs::-webkit-scrollbar-track{
  margin-top:6px;
}

#skillsWin .window-tab{
  padding-bottom:10px !important;
}

#skillsWin .window-tab.active::after{
  bottom:-3px !important;
}

#skillsWin .tab-panel{
  top:82px !important;
}


#skillsWin{
  min-width:420px;
}

#skillsWin .window-tabs{
  display:flex !important;
  flex-wrap:nowrap !important;
  align-items:flex-end !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  white-space:nowrap !important;
  gap:10px !important;
  padding:8px 14px 18px 14px !important;
  margin:0 !important;
  height:auto !important;
  min-height:52px !important;
  box-sizing:border-box !important;
  scrollbar-gutter:stable !important;
}

#skillsWin .window-tab{
  flex:0 0 auto !important;
  display:inline-block !important;
  line-height:1.2 !important;
  padding:0 6px 12px 6px !important;
  margin:0 !important;
  vertical-align:bottom !important;
}

#skillsWin .window-tab.active::after{
  bottom:2px !important;
}

#skillsWin .window-tabs::-webkit-scrollbar{
  height:8px !important;
}

#skillsWin .window-tabs::-webkit-scrollbar-track{
  background:rgba(12,7,3,.78) !important;
  border-top:1px solid rgba(255,181,74,.10) !important;
}

#skillsWin .window-tabs::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg, rgba(255,216,153,.75), rgba(255,181,74,.65)) !important;
  border:1px solid rgba(12,7,3,.88) !important;
  border-radius:8px !important;
}

#skillsWin .tab-panel{
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  top:92px !important;
  bottom:22px !important;
  height:auto !important;
  padding:18px 26px 24px 18px !important;
  overflow:auto !important;
  overflow-x:hidden !important;
  box-sizing:border-box !important;
}

#skillsWin .tab-panel p,
#skillsWin .tab-panel .entry{
  margin-top:0 !important;
  padding-top:0 !important;
  line-height:1.65 !important;
}