@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Noto+Sans+Bengali:wght@400;500;600;700&family=VT323&display=swap');

:root{
  --desktop-teal:#008080;
  --win-gray:#c0c0c0;
  --win-gray-dark:#808080;
  --win-gray-darker:#404040;
  --win-white:#ffffff;
  --navy:#000080;
  --navy-light:#1084d0;
  --black:#000000;
  --link-blue:#0000ee;
  --link-visited:#551a8b;
  --magenta:#ff00ff;
  --lime:#00ff00;
  --ui-font: 'Inter', Tahoma, Geneva, Verdana, sans-serif;
  --pixel-font: 'VT323', monospace;
}

*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  font-family:var(--ui-font);
  font-size:14px;
  color:var(--black);
  background:var(--desktop-teal);
  background-image:
    repeating-linear-gradient(45deg, rgba(255,255,255,0.03) 0, rgba(255,255,255,0.03) 2px, transparent 2px, transparent 40px);
  min-height:100vh;
  padding-bottom:54px;
}
a{ color:var(--link-blue); }
a:visited{ color:var(--link-visited); }
img{ max-width:100%; display:block; }

::selection{ background:var(--navy); color:#fff; }

/* ---------------- 3D bevel utility ---------------- */
.bevel-out{
  border-top:2px solid var(--win-white);
  border-left:2px solid var(--win-white);
  border-right:2px solid var(--win-gray-darker);
  border-bottom:2px solid var(--win-gray-darker);
  box-shadow: inset -1px -1px 0 var(--win-gray-dark), inset 1px 1px 0 #dfdfdf;
}
.bevel-in{
  border-top:2px solid var(--win-gray-darker);
  border-left:2px solid var(--win-gray-darker);
  border-right:2px solid var(--win-white);
  border-bottom:2px solid var(--win-white);
  box-shadow: inset -1px -1px 0 #dfdfdf, inset 1px 1px 0 var(--win-gray-dark);
}

/* ---------------- Window chrome ---------------- */
.window{
  background:var(--win-gray);
  max-width:880px;
  margin:34px auto;
}
.window.bevel-out{}
.titlebar{
  background:linear-gradient(90deg, var(--navy) 0%, var(--navy-light) 100%);
  color:#fff;
  font-family:var(--pixel-font);
  font-size:20px;
  letter-spacing:.02em;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:4px 6px 4px 10px;
}
.titlebar .ttl{ display:flex; align-items:center; gap:8px; }
.titlebar .ttl-icon{ font-family:var(--pixel-font); font-size:18px; }
.win-controls{ display:flex; gap:4px; }
.win-btn{
  width:20px; height:19px;
  background:var(--win-gray);
  font-family:var(--ui-font);
  font-weight:700;
  font-size:12px;
  line-height:1;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
  border-top:1px solid var(--win-white);
  border-left:1px solid var(--win-white);
  border-right:1px solid var(--win-gray-darker);
  border-bottom:1px solid var(--win-gray-darker);
  color:#000;
}
.win-btn:active{
  border-color: var(--win-gray-darker) var(--win-white) var(--win-white) var(--win-gray-darker);
}
.menubar{
  display:flex; gap:16px;
  padding:4px 12px;
  border-bottom:1px solid var(--win-gray-dark);
  font-size:13px;
}
.menubar span{ cursor:default; }
.menubar span:first-letter{ text-decoration:underline; }

.window-body{ padding:22px 26px 28px; }
.window-body h1, .window-body h2, .window-body h3{ font-family:var(--pixel-font); font-weight:400; letter-spacing:.01em; }
.window-body h1{ font-size:38px; margin:0 0 6px; color:var(--navy); }
.window-body h2{ font-size:26px; margin:0 0 10px; color:var(--navy); }
.window-body p{ margin:0 0 14px; line-height:1.55; }

.statusbar{
  display:flex; justify-content:space-between; padding:3px 10px;
  font-size:12px; border-top:1px solid var(--win-white);
}
.statusbar span{ padding:2px 8px; }

/* ---------------- inset panel ---------------- */
.panel{ background:var(--win-white); padding:14px; margin:14px 0; }

/* ---------------- buttons ---------------- */
.btn95{
  font-family:var(--ui-font);
  background:var(--win-gray);
  padding:7px 18px;
  cursor:pointer;
  font-size:13px;
  display:inline-block;
  text-decoration:none;
  color:#000;
}
.btn95:active, .btn95.pressed{
  border-color: var(--win-gray-darker) var(--win-white) var(--win-white) var(--win-gray-darker) !important;
}

/* ---------------- marquee replacement ---------------- */
.ticker{
  overflow:hidden; white-space:nowrap; background:#000; color:var(--lime);
  font-family:var(--pixel-font); font-size:19px; padding:6px 0;
}
.ticker span{
  display:inline-block; padding-left:100%;
  animation:ticker-scroll 18s linear infinite;
}
@media (prefers-reduced-motion: reduce){ .ticker span{ animation:none; padding-left:12px; } }
@keyframes ticker-scroll{ from{ transform:translateX(0);} to{ transform:translateX(-100%);} }

/* ---------------- blink ---------------- */
.blink{ animation:blink 1s steps(1) infinite; }
@keyframes blink{ 50%{ opacity:0; } }
@media (prefers-reduced-motion: reduce){ .blink{ animation:none; } }

/* ---------------- desktop icons ---------------- */
.desktop-icons{
  display:grid;
  grid-template-columns:repeat(auto-fill, 92px);
  gap:22px 10px;
  padding:26px 18px 10px;
}
.dicon{ text-decoration:none; color:#fff; text-align:center; display:block; }
.dicon .glyph{
  width:56px; height:56px; margin:0 auto 6px;
  background:var(--win-gray);
  display:flex; align-items:center; justify-content:center;
  font-size:28px;
}
.dicon .lbl{
  font-size:12.5px;
  background:transparent;
  padding:1px 4px;
  text-shadow: 1px 1px 1px #000;
}
.dicon:focus .lbl, .dicon:hover .lbl{ background:var(--navy); color:#fff; text-shadow:none; }

/* ---------------- polaroids ---------------- */
.polaroids{ display:flex; gap:26px; flex-wrap:wrap; padding:10px 0 6px; }
.polaroid{
  background:#fff; padding:10px 10px 34px; width:220px;
  box-shadow: 3px 3px 0 rgba(0,0,0,0.35);
  transform:rotate(-3deg);
}
.polaroid:nth-child(2){ transform:rotate(2.5deg); }
.polaroid img{ width:100%; height:220px; object-fit:cover; }
.polaroid .cap{ font-family:var(--pixel-font); font-size:16px; text-align:center; margin-top:8px; color:#333; }

/* ---------------- taskbar ---------------- */
.taskbar{
  position:fixed; bottom:0; left:0; right:0; height:44px;
  background:var(--win-gray);
  border-top:2px solid var(--win-white);
  display:flex; align-items:center; gap:6px;
  padding:0 6px; z-index:100;
}
.start-btn{
  font-family:var(--ui-font); font-weight:700; font-size:14px;
  padding:5px 12px; display:flex; align-items:center; gap:6px;
  text-decoration:none; color:#000;
}
.taskbar-sep{ width:2px; height:30px; border-left:1px solid var(--win-gray-darker); border-right:1px solid var(--win-white); }
.task-item{
  font-family:var(--ui-font); font-size:12.5px;
  padding:6px 12px; text-decoration:none; color:#000;
  display:flex; align-items:center; gap:6px;
  max-width:150px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.task-item.active{
  border-color: var(--win-gray-darker) var(--win-white) var(--win-white) var(--win-gray-darker) !important;
  background:#d4d0c8;
}
.tray{
  margin-left:auto;
  font-family:var(--ui-font); font-size:12.5px;
  padding:6px 12px; display:flex; align-items:center; gap:8px;
}

/* ---------------- tags / grid ---------------- */
.tag95{
  font-family:var(--ui-font); font-size:12.5px;
  background:var(--win-gray); padding:5px 10px; display:inline-block; margin:3px 4px 3px 0;
}
.grid2{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.file-row{
  display:flex; align-items:center; gap:10px; padding:9px 6px;
  border-bottom:1px solid #ddd;
}
.file-row .ic{ font-size:20px; }
.file-row .status{ margin-left:auto; font-size:11.5px; padding:2px 8px; background:var(--win-gray); }

/* ---------------- form ---------------- */
label{ display:block; font-size:12.5px; margin:10px 0 4px; }
input[type=text], input[type=email], textarea{
  width:100%; font-family:var(--ui-font); font-size:13px; padding:6px 8px;
  background:#fff;
  border-top:1px solid var(--win-gray-darker); border-left:1px solid var(--win-gray-darker);
  border-right:1px solid var(--win-white); border-bottom:1px solid var(--win-white);
}
textarea{ min-height:110px; resize:vertical; }
.form-msg{ font-family:var(--pixel-font); font-size:16px; color:var(--navy); min-height:18px; margin-top:8px; }

/* ---------------- Bengali language mode ---------------- */
body.lang-bn{ --ui-font: 'Noto Sans Bengali', 'Inter', sans-serif; }
body.lang-bn .window-body h1, body.lang-bn .window-body h2, body.lang-bn .titlebar .ttl,
body.lang-bn .ticker span{ font-family:'Noto Sans Bengali', sans-serif; }

/* ---------------- Black & white theme ---------------- */
html.theme-bw{ filter:grayscale(1) contrast(1.06); }

/* ---------------- lang / theme toggle buttons ---------------- */
.pref-btn{
  font-family:var(--ui-font); font-size:12px; font-weight:700;
  padding:6px 10px; cursor:pointer; background:var(--win-gray); color:#000;
  border:none;
}
.pref-btn[aria-pressed="true"]{
  border-color: var(--win-gray-darker) var(--win-white) var(--win-white) var(--win-gray-darker) !important;
  background:#d4d0c8;
}

@media (max-width:720px){
  .window{ margin:14px 10px; }
  .grid2, .about-flex{ grid-template-columns:1fr !important; }
  .polaroids{ justify-content:center; }
  .titlebar{ font-size:16px; }
  .window-body h1{ font-size:28px; }
}


/* =========================================================
   PRO MOBILE / ACCESSIBILITY UPGRADE
   Keeps the Windows 95 identity while improving readability.
   ========================================================= */
html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
}
body{
  line-height:1.5;
  overflow-x:hidden;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}
a, button, .win-btn{
  -webkit-tap-highlight-color:transparent;
}
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible{
  outline:3px solid #ffea00;
  outline-offset:2px;
}
.window{
  width:min(880px, calc(100% - 24px));
  box-shadow:10px 12px 0 rgba(0,0,0,.18);
}
.window-body{
  overflow-wrap:anywhere;
}
.panel{
  border:1px solid rgba(0,0,0,.12);
}
.file-row > div{
  min-width:0;
  flex:1;
}
.file-row .status{
  white-space:nowrap;
}
.btn95, .pref-btn, .start-btn, .task-item{
  min-height:36px;
}
input[type=text], input[type=email], textarea{
  font-size:16px;
  border-radius:0;
}
input[type=text]:focus, input[type=email]:focus, textarea:focus{
  outline:2px solid var(--navy);
  outline-offset:1px;
}
::placeholder{ color:#666; opacity:1; }

@media (max-width:720px){
  body{
    font-size:15px;
    padding-bottom:76px;
  }
  .window{
    width:calc(100% - 16px);
    margin:8px auto 16px;
    box-shadow:5px 6px 0 rgba(0,0,0,.18);
  }
  .titlebar{
    min-height:38px;
    padding:5px 6px 5px 8px;
    font-size:17px;
  }
  .titlebar .ttl{
    min-width:0;
    gap:6px;
  }
  .titlebar .ttl > span:last-child{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .win-controls{ gap:3px; flex:0 0 auto; }
  .win-btn{
    width:28px;
    height:28px;
    font-size:13px;
  }
  .menubar{
    gap:4px;
    padding:4px 6px;
    overflow-x:auto;
    scrollbar-width:none;
  }
  .menubar::-webkit-scrollbar{ display:none; }
  .menubar span{
    padding:6px 8px;
    white-space:nowrap;
  }
  .window-body{
    padding:18px 14px 22px;
  }
  .window-body h1{
    font-size:32px;
    line-height:1.05;
    margin-bottom:10px;
  }
  .window-body h2{
    font-size:24px;
    line-height:1.1;
  }
  body.lang-bn .window-body h1{
    font-size:27px;
    line-height:1.3;
    font-weight:700;
  }
  body.lang-bn .window-body h2{
    font-size:21px;
    line-height:1.35;
    font-weight:600;
  }
  .grid2, .about-flex{
    grid-template-columns:minmax(0,1fr) !important;
    gap:8px;
  }
  .panel{
    padding:14px 12px;
    margin:12px 0;
  }
  .file-row{
    align-items:flex-start;
    padding:12px 4px;
    gap:8px;
  }
  .file-row .ic{
    flex:0 0 auto;
    font-size:19px;
  }
  .file-row .status{
    font-size:10.5px;
    padding:3px 6px;
    max-width:34%;
    white-space:normal;
    text-align:center;
  }
  .tag95{
    font-size:12px;
    padding:7px 9px;
    margin:4px 3px 4px 0;
  }
  .btn95{
    padding:9px 13px;
    margin:3px 0;
    font-weight:600;
  }
  .polaroids{
    gap:22px;
    padding-top:6px;
  }
  .polaroid{
    width:min(250px, 82vw);
  }
  .polaroid img{
    height:auto;
    aspect-ratio:1/1;
  }
  .statusbar{
    gap:6px;
    padding:3px 5px;
    overflow:hidden;
  }
  .statusbar span{
    min-width:0;
    padding:3px 5px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .taskbar{
    height:64px;
    gap:3px;
    padding:5px 5px calc(5px + env(safe-area-inset-bottom));
    overflow-x:auto;
    overflow-y:hidden;
    scrollbar-width:none;
    justify-content:flex-start;
  }
  .taskbar::-webkit-scrollbar{ display:none; }
  .start-btn{
    min-width:48px;
    padding:7px 9px;
    justify-content:center;
  }
  .start-btn span, .taskbar-sep{
    display:none;
  }
  .task-item{
    min-width:52px;
    max-width:none;
    padding:7px 8px;
    flex-direction:column;
    justify-content:center;
    gap:1px;
    font-size:9.5px;
    line-height:1.1;
  }
  .tray{
    margin-left:2px;
    padding:5px;
    gap:4px;
    flex:0 0 auto;
  }
  .tray > span:first-of-type{
    display:none;
  }
  .pref-btn{
    min-height:38px;
    padding:6px 8px;
    font-size:10.5px;
  }
  #clock{
    min-width:42px;
    text-align:center;
    font-size:10.5px;
  }
  .ticker{
    font-size:18px;
  }
  .desktop-icons{
    grid-template-columns:repeat(3, minmax(0,1fr));
    gap:20px 6px;
    padding:20px 8px 12px;
  }
  .dicon .glyph{
    width:54px;
    height:54px;
  }
  .dicon .lbl{
    font-size:11.5px;
    line-height:1.25;
  }
}

@media (max-width:390px){
  .window-body{ padding-left:11px; padding-right:11px; }
  .window-body h1{ font-size:28px; }
  .task-item{ min-width:48px; padding-left:6px; padding-right:6px; }
  .pref-btn{ padding-left:6px; padding-right:6px; }
  .tray{ gap:2px; }
}

@media (hover:hover){
  .btn95:hover, .pref-btn:hover, .task-item:hover, .start-btn:hover{
    filter:brightness(1.04);
  }
}


/* ================= PREMIUM V3: WINDOWS 95 × MODERN ================= */
:root{ --glow:rgba(0,255,255,.28); }

body{
  background-attachment:fixed;
}
.window{
  animation:windowIn .42s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes windowIn{
  from{opacity:0;transform:translateY(14px) scale(.985)}
  to{opacity:1;transform:none}
}
.panel,.file-row,.polaroid{
  transition:transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
@media (hover:hover){
  .panel:hover,.file-row:hover{ transform:translateY(-2px); }
  .polaroid:hover{ transform:translateY(-5px) rotate(0deg) !important; box-shadow:10px 12px 0 rgba(0,0,0,.22); }
}
.page-transition{
  position:fixed; inset:0; z-index:99998; pointer-events:none;
  background:#000; opacity:0; transition:opacity .18s ease;
}
body.page-leaving .page-transition{ opacity:1; }

.boot-screen{
  position:fixed; inset:0; z-index:100000;
  display:flex; align-items:center; justify-content:center;
  background:#050505; color:#fff;
  font-family:'VT323', monospace;
  transition:opacity .45s ease, visibility .45s ease;
}
.boot-screen.boot-done{ opacity:0; visibility:hidden; }
.boot-box{ width:min(440px,84vw); text-align:center; }
.boot-logo{
  font-size:clamp(34px,10vw,64px); line-height:1; letter-spacing:1px;
  text-shadow:3px 3px 0 #004d4d;
}
.boot-sub{ margin:12px 0 18px; font:500 12px/1.5 var(--ui-font); opacity:.72; letter-spacing:2px; text-transform:uppercase; }
.boot-track{
  height:20px; padding:3px; background:var(--silver);
  border-top:2px solid #fff; border-left:2px solid #fff;
  border-right:2px solid #555; border-bottom:2px solid #555;
}
.boot-bar{ height:100%; width:0; background:var(--navy); animation:bootLoad 1.15s ease forwards; }
@keyframes bootLoad{ to{width:100%} }
.boot-status{ margin-top:10px; font-size:18px; opacity:.8; }

.start-menu-v3{
  position:fixed; left:6px; bottom:66px; z-index:9999;
  width:min(300px,calc(100vw - 12px));
  display:none; background:var(--silver); color:#111;
  border-top:2px solid #fff; border-left:2px solid #fff;
  border-right:2px solid #111; border-bottom:2px solid #111;
  box-shadow:7px 8px 0 rgba(0,0,0,.28);
  font-family:var(--ui-font);
}
.start-menu-v3.open{ display:flex; animation:startPop .16s ease-out both; }
@keyframes startPop{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
.start-rail{
  width:38px; background:#7b7b7b; color:#fff; display:flex;
  align-items:flex-end; justify-content:center; padding:8px 0;
  writing-mode:vertical-rl; transform:rotate(180deg); font-weight:700; letter-spacing:1px;
}
.start-links{ flex:1; padding:5px; }
.start-links a{
  display:flex; align-items:center; gap:10px; min-height:46px;
  padding:7px 10px; color:#111; text-decoration:none; font-weight:600;
}
.start-links a:hover,.start-links a:focus{ background:var(--navy); color:#fff; outline:none; }
.start-links .start-ico{ width:25px; text-align:center; font-size:20px; }
.start-divider{ height:2px; margin:4px 5px; border-top:1px solid #777; border-bottom:1px solid #fff; }

.v3-badge{
  display:inline-flex; align-items:center; gap:6px; margin:0 0 10px;
  padding:5px 8px; font-size:11px; font-weight:700; letter-spacing:.5px;
  background:#111; color:#fff; border-left:4px solid var(--teal);
}
.v3-badge::before{ content:"●"; font-size:8px; animation:pulse 1.5s infinite; }
@keyframes pulse{50%{opacity:.35}}

@media (min-width:900px) and (pointer:fine){
  body.v3-cursor, body.v3-cursor a, body.v3-cursor button{ cursor:none; }
  .cursor-dot,.cursor-ring{
    position:fixed; left:0; top:0; pointer-events:none; z-index:100001;
    border-radius:50%; transform:translate(-50%,-50%);
  }
  .cursor-dot{ width:7px; height:7px; background:#fff; mix-blend-mode:difference; }
  .cursor-ring{ width:27px; height:27px; border:1px solid #fff; mix-blend-mode:difference; transition:width .15s,height .15s; }
}
@media (max-width:720px){
  .start-menu-v3{ bottom:70px; }
  .boot-sub{ font-size:10px; }
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
}


/* =========================================================
   LOSTFAYSAL V4 — typography, timeline, motion, theme cleanup
   ========================================================= */
:root{
  --content-font:'Inter','Noto Sans Bengali',system-ui,sans-serif;
  --cyan:#00d4d4;
}
.panel, .panel p, .panel span, .panel a, .panel strong,
.file-row, .status, form, input, textarea, label,
.edu-content, .hobby-card{
  font-family:var(--content-font);
}
.panel p{ font-size:14.5px; line-height:1.72; letter-spacing:-.01em; }
body.lang-bn .panel p{ line-height:1.85; letter-spacing:0; }

/* Clean text-based taskbar: no mismatched emoji icons */
.taskbar .start-btn, .taskbar .task-item{
  letter-spacing:.01em;
}
.taskbar .start-btn::before{
  content:"▦"; font-family:var(--pixel-font); font-size:18px;
}
.taskbar .task-item::before{
  content:"■"; font-size:8px; color:var(--navy);
}
.taskbar .task-item.active::before{ animation:taskPulse 1.4s steps(2) infinite; }
@keyframes taskPulse{50%{opacity:.25}}

/* richer desktop depth */
body::before{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:-1;
  background:
    radial-gradient(circle at 18% 12%,rgba(255,255,255,.12),transparent 22%),
    radial-gradient(circle at 82% 72%,rgba(0,0,0,.13),transparent 30%);
}
.window{ transform-style:preserve-3d; perspective:1000px; }
.window:hover{ box-shadow:10px 14px 0 rgba(0,0,0,.2), 0 22px 50px rgba(0,0,0,.12); }

/* education story */
.story-section{ margin:34px 0 12px; }
.section-kicker{
  display:inline-block; margin-bottom:8px; padding:5px 8px;
  background:#111; color:#fff; font:700 10px/1 var(--content-font);
  letter-spacing:1.4px;
}
.edu-timeline{ position:relative; padding:8px 0 4px 112px; }
.edu-timeline::before{
  content:""; position:absolute; left:91px; top:10px; bottom:10px; width:2px;
  background:linear-gradient(var(--navy),var(--cyan));
}
.edu-card{ position:relative; margin:0 0 18px; min-height:105px; }
.edu-year{
  position:absolute; right:calc(100% + 28px); top:16px; width:82px;
  text-align:right; font:700 12px/1.2 var(--content-font); color:var(--navy);
}
.edu-node{
  position:absolute; left:-27px; top:17px; width:15px; height:15px;
  background:var(--win-gray); border:3px solid var(--navy); transform:rotate(45deg);
  box-shadow:0 0 0 4px var(--win-gray);
}
.edu-content{
  position:relative; background:#fff; padding:16px 16px 15px 56px;
  border-left:4px solid var(--navy);
  box-shadow:5px 6px 0 rgba(0,0,0,.12);
}
.edu-content h3,.hobby-card h3{
  font:700 15px/1.3 var(--content-font); color:#111; margin:0 0 6px;
}
.edu-content p,.hobby-card p{ margin:0 0 8px; font-size:13px; line-height:1.6; color:#3d3d3d; }
.edu-content strong{ font-size:12px; color:var(--navy); text-transform:uppercase; letter-spacing:.4px; }
.edu-icon{
  position:absolute; left:14px; top:16px; width:28px; height:28px;
  display:grid; place-items:center; background:var(--navy); color:#fff;
  font:700 11px/1 var(--content-font);
}
.edu-card.current .edu-content{ border-left-color:var(--cyan); }
.edu-card.current .edu-node{ border-color:var(--cyan); animation:eduPulse 1.8s ease-in-out infinite; }
@keyframes eduPulse{50%{box-shadow:0 0 0 8px rgba(0,128,128,.16)}}

/* hobbies */
.hobby-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.hobby-card{
  min-height:150px; position:relative; overflow:hidden; background:#fff;
  padding:18px; border:1px solid rgba(0,0,0,.15);
  box-shadow:4px 5px 0 rgba(0,0,0,.14);
  transform-style:preserve-3d; transition:transform .16s ease,box-shadow .2s ease;
}
.hobby-card::after{
  content:""; position:absolute; width:90px; height:90px; right:-38px; bottom:-40px;
  border:14px solid rgba(0,128,128,.09); transform:rotate(25deg);
}
.hobby-symbol{
  display:grid; place-items:center; width:42px; height:42px; margin-bottom:14px;
  background:#111; color:#fff; font:700 16px/1 var(--pixel-font);
  box-shadow:4px 4px 0 var(--cyan);
}

/* scroll reveal */
.reveal-card{ opacity:0; transform:translateY(22px); }
.reveal-card.is-visible{ opacity:1; transform:translateY(0); transition:opacity .55s ease,transform .55s cubic-bezier(.2,.8,.2,1); }

/* new boot: terminal scan */
.boot-screen::after{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(transparent 50%,rgba(255,255,255,.025) 50%);
  background-size:100% 4px;
}
.boot-logo{ text-shadow:3px 3px 0 #004d4d, 0 0 22px rgba(0,255,255,.28); }
.boot-track{ overflow:hidden; }
.boot-bar{ position:relative; }
.boot-bar::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent);
  animation:bootScan .6s linear infinite;
}
@keyframes bootScan{from{transform:translateX(-100%)}to{transform:translateX(100%)}}

/* form polish */
form button[disabled]{ opacity:.65; cursor:wait !important; }
.form-msg{ min-height:22px; font-weight:600; font-size:12px; }
.form-msg.success{ color:#006400; }
.form-msg.error{ color:#8b0000; }

@media (max-width:720px){
  .edu-timeline{ padding-left:30px; }
  .edu-timeline::before{ left:8px; }
  .edu-node{ left:-29px; }
  .edu-year{ position:static; width:auto; text-align:left; margin:0 0 6px; }
  .edu-content{ padding:15px 13px 15px 51px; }
  .hobby-grid{ grid-template-columns:1fr; }
  .hobby-card{ min-height:130px; }
  .panel p{ font-size:14px; line-height:1.68; }
}


/* =========================================================
   V5.2 — ACTUAL FONT + ICON FIX
   ========================================================= */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700&family=Noto+Sans+Bengali:wght@400;500;600;700&display=swap');

:root{
  --premium-font:'Manrope','DM Sans','Inter',Arial,sans-serif;
  --premium-bn:'Noto Sans Bengali','Manrope',sans-serif;
}

/* Premium font for every readable content area */
.window-body,
.window-body p,
.window-body li,
.window-body a,
.window-body span:not(.glyph):not(.hobby-symbol):not(.edu-icon),
.window-body strong,
.window-body label,
.window-body input,
.window-body textarea,
.window-body button,
.panel,
.panel *,
.file-row,
.file-row *,
.statusbar,
.menubar,
.taskbar,
.start-menu-v3,
.edu-content,
.hobby-card{
  font-family:var(--premium-font) !important;
}
body.lang-bn .window-body,
body.lang-bn .window-body *,
body.lang-bn .panel,
body.lang-bn .panel *{
  font-family:var(--premium-bn) !important;
}

/* Keep pixel font ONLY where it belongs to the retro identity */
.window-body h1,
.window-body h2,
.titlebar,
.boot-logo,
.hobby-symbol,
.edu-icon,
.dicon .glyph{
  font-family:'VT323','Courier New',monospace !important;
}
.window-body h1{
  font-weight:400;
  letter-spacing:.025em;
}
.panel p{
  font-size:15px !important;
  font-weight:450;
  line-height:1.78 !important;
  letter-spacing:-.012em;
}

/* System-theme icons: monochrome, square, no colorful emoji */
.file-row .ic{
  width:34px;
  height:34px;
  flex:0 0 34px;
  display:grid;
  place-items:center;
  background:#fff;
  color:var(--navy);
  border-top:2px solid #fff;
  border-left:2px solid #fff;
  border-right:2px solid #555;
  border-bottom:2px solid #555;
  box-shadow:2px 2px 0 #111;
  font-family:'VT323','Courier New',monospace !important;
  font-size:24px !important;
  line-height:1;
  filter:none !important;
}
.file-row:hover .ic{
  background:var(--navy);
  color:#fff;
}
.start-links .start-ico{
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  background:#fff;
  color:var(--navy);
  border:1px solid #555;
  font-family:'VT323','Courier New',monospace !important;
  font-size:21px;
}
.taskbar .task-item::before,
.taskbar .start-btn::before{
  font-family:'VT323','Courier New',monospace !important;
}

/* cleaner content cards */
.panel{
  background:#fbfbfb;
}
.file-row{
  min-height:58px;
}
.file-row > div{
  font-weight:600;
  letter-spacing:-.01em;
}
.file-row .status{
  font-size:11px;
  font-weight:600;
  letter-spacing:.02em;
  text-transform:uppercase;
}

@media(max-width:720px){
  .panel p{
    font-size:14.5px !important;
    line-height:1.74 !important;
  }
  .file-row .ic{
    width:32px;
    height:32px;
    flex-basis:32px;
    font-size:22px !important;
  }
}


/* =========================================================
   V6 — BUNDLED PREMIUM ENGLISH FONT + VISIBLE LOADER
   ========================================================= */
@font-face{font-family:'Plus Jakarta Sans Local';src:url('./fonts/PlusJakartaSans-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Plus Jakarta Sans Local';src:url('./fonts/PlusJakartaSans-Medium.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Plus Jakarta Sans Local';src:url('./fonts/PlusJakartaSans-SemiBold.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Plus Jakarta Sans Local';src:url('./fonts/PlusJakartaSans-Bold.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}

:root{
  --premium-font:'Plus Jakarta Sans Local','Segoe UI',Arial,sans-serif;
}
html,body{
  font-family:var(--premium-font) !important;
}
body:not(.lang-bn) .window-body,
body:not(.lang-bn) .window-body p,
body:not(.lang-bn) .window-body li,
body:not(.lang-bn) .window-body a,
body:not(.lang-bn) .window-body span:not(.glyph):not(.hobby-symbol):not(.edu-icon),
body:not(.lang-bn) .window-body strong,
body:not(.lang-bn) .panel,
body:not(.lang-bn) .panel *,
body:not(.lang-bn) .file-row,
body:not(.lang-bn) .file-row *,
body:not(.lang-bn) .menubar,
body:not(.lang-bn) .statusbar,
body:not(.lang-bn) .taskbar,
body:not(.lang-bn) .start-menu-v3,
body:not(.lang-bn) form,
body:not(.lang-bn) input,
body:not(.lang-bn) textarea,
body:not(.lang-bn) button{
  font-family:var(--premium-font) !important;
}
/* Retro pixel typography is deliberately limited to OS identity elements */
.window-body h1,.window-body h2,.titlebar,.boot-logo,.hobby-symbol,.edu-icon,.dicon .glyph{
  font-family:'VT323','Courier New',monospace !important;
}

/* New full-screen boot loader */
.boot-screen-v6{
  position:fixed;inset:0;z-index:2147483647;
  display:grid;place-items:center;overflow:hidden;
  background:#050708;color:#fff;
  opacity:1;visibility:visible;
  transition:opacity .5s ease,visibility .5s ease;
}
.boot-screen-v6.hide{opacity:0;visibility:hidden}
.boot-screen-v6::before{
  content:"";position:absolute;inset:-30%;
  background:
    linear-gradient(rgba(0,212,212,.06) 1px,transparent 1px),
    linear-gradient(90deg,rgba(0,212,212,.06) 1px,transparent 1px);
  background-size:34px 34px;
  transform:perspective(500px) rotateX(62deg) translateY(22%);
  animation:v6Grid 2.8s linear infinite;
}
@keyframes v6Grid{to{background-position:0 34px,34px 0}}
.boot-v6-core{position:relative;width:min(520px,84vw);text-align:center}
.boot-v6-mark{
  width:78px;height:78px;margin:0 auto 24px;
  position:relative;border:2px solid #00d4d4;
  box-shadow:0 0 28px rgba(0,212,212,.25);
  animation:v6Cube 1.8s cubic-bezier(.5,0,.5,1) infinite;
}
.boot-v6-mark::before,.boot-v6-mark::after{
  content:"";position:absolute;background:#00d4d4;
}
.boot-v6-mark::before{width:2px;height:100%;left:50%}
.boot-v6-mark::after{height:2px;width:100%;top:50%}
@keyframes v6Cube{50%{transform:rotate(45deg) scale(.72)}100%{transform:rotate(90deg)}}
.boot-v6-name{
  font:600 clamp(25px,7vw,44px)/1 var(--premium-font);
  letter-spacing:-.045em;
}
.boot-v6-name span{color:#00d4d4}
.boot-v6-status{
  margin:12px 0 22px;font:500 11px/1.4 var(--premium-font);
  letter-spacing:.18em;text-transform:uppercase;opacity:.62;
}
.boot-v6-track{
  height:3px;background:rgba(255,255,255,.14);overflow:hidden;
}
.boot-v6-progress{
  height:100%;width:0;background:#00d4d4;
  box-shadow:0 0 14px #00d4d4;
  animation:v6Load 1.65s cubic-bezier(.2,.8,.2,1) forwards;
}
@keyframes v6Load{0%{width:0}35%{width:28%}65%{width:71%}100%{width:100%}}
.boot-v6-percent{
  margin-top:9px;text-align:right;font:500 10px/1 var(--premium-font);opacity:.55;
}
body.v6-loading{overflow:hidden!important}

@media(max-width:720px){
  .window-body p,.panel p{font-family:var(--premium-font)!important}
  .boot-v6-mark{width:62px;height:62px}
}