:root{--accent:#6164FF;--bg:#070b12;--panel:#0b111a;--line:#283241;--text:#f3f5f7;--muted:#9ca6b3}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:radial-gradient(circle at 20% 0,rgba(97,100,255,.10),transparent 28%),var(--bg);color:var(--text);font-family:"Courier New",monospace}
a{color:inherit;text-decoration:none}img{max-width:100%;display:block}
p{font-size:16px;line-height:1.65}
.browser{width:min(1280px,calc(100% - 22px));margin:14px auto;border:2px solid #626262;background:#111;box-shadow:0 16px 50px rgba(0,0,0,.55)}
.window-title{height:34px;display:flex;align-items:center;padding:0 10px;background:linear-gradient(#dedede,#aaa);border-bottom:1px solid #555;color:#111;font:700 13px Tahoma,Arial,sans-serif}
.window-title .title{flex:1}.window-buttons{display:flex;gap:3px}.window-buttons i{display:block;width:22px;height:20px;border:1px solid #555;background:linear-gradient(#eee,#bbb)}
.browser-menu{display:flex;align-items:center;background:#cfcfcf;border-bottom:1px solid #737373;color:#111;font:12px Tahoma,Arial,sans-serif;padding:0 8px}
.browser-menu a{padding:8px 12px;border-right:1px solid #aaa}.browser-menu a:hover{background:#eee;color:#3639d8}.browser-menu .lang{margin-left:auto;display:flex}.browser-menu .lang a{font-weight:700}.browser-menu .lang a.active{background:var(--accent);color:#fff}
.toolbar{background:linear-gradient(#ddd,#b7b7b7);border-bottom:1px solid #737373;padding:6px 8px;display:flex;gap:5px;color:#111}
.tool{width:36px;height:31px;display:grid;place-items:center;border:1px solid #888;background:linear-gradient(#fafafa,#c9c9c9);font:18px Tahoma,Arial,sans-serif}
.address-row{display:flex;align-items:center;gap:7px;padding:5px 8px;background:#ccc;color:#111;border-bottom:2px solid #777;font:12px Tahoma,Arial,sans-serif}
.address{flex:1;height:27px;background:#fff;border:1px solid #6c6c6c;padding:5px 9px}.go{height:27px;padding:5px 12px;border:1px solid #777;background:linear-gradient(#f2f2f2,#c6c6c6)}
.site{background:linear-gradient(rgba(255,255,255,.012) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.012) 1px,transparent 1px),var(--bg);background-size:28px 28px}
.container{width:min(1160px,calc(100% - 36px));margin:auto;padding:18px 0}.section{margin-bottom:18px;border:1px solid var(--line);border-radius:13px;background:linear-gradient(180deg,rgba(14,22,33,.96),rgba(8,13,20,.97));overflow:hidden}.section-inner{padding:28px}
.section-title{margin:0 0 22px;font:400 24px Tahoma,Arial,sans-serif}.section-title .num{color:var(--accent);font-family:"Courier New",monospace}
.hero{display:grid;grid-template-columns:1.02fr .98fr;gap:34px;align-items:center;min-height:420px}.hello{color:var(--accent);font-size:16px;margin-bottom:12px}
h1{margin:0 0 10px;font:700 43px/1.05 Tahoma,Arial,sans-serif}.subtitle{color:var(--accent);font:16px Tahoma,Arial,sans-serif;margin-bottom:18px}.lead{color:#c0c7d0;font:16px/1.75 Tahoma,Arial,sans-serif}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}.btn{display:inline-block;border:1px solid #46505e;background:#0d131b;color:#fff;padding:11px 15px;border-radius:5px;font:12px Tahoma,Arial,sans-serif;cursor:pointer}.btn.primary{background:var(--accent);border-color:var(--accent)}
.photo{min-height:340px;border:1px solid rgba(97,100,255,.55);border-radius:14px;overflow:hidden;box-shadow:0 0 28px rgba(97,100,255,.22);background:linear-gradient(135deg,#111927,#06090e)}.photo img{width:100%;height:340px;object-fit:cover}.photo.placeholder{display:grid;place-items:center;color:#465064;font:700 25px Tahoma}
.timeline{display:grid;gap:20px}.job{display:grid;grid-template-columns:160px 1fr;gap:22px;position:relative;padding-left:20px}.job:before{content:"";position:absolute;left:3px;top:6px;width:8px;height:8px;border-radius:50%;background:var(--accent)}.job:after{content:"";position:absolute;left:6px;top:22px;bottom:-23px;width:1px;background:#30394a}.job:last-child:after{display:none}
.job-date{font-size:14px}.job h3{margin:0 0 7px;color:var(--accent);font:700 18px Tahoma,Arial,sans-serif}.job p{margin:0;color:#9ea8b4;font:16px/1.65 Tahoma,Arial,sans-serif}
.skill-label{color:#bcc5d0;font:14px Tahoma,Arial,sans-serif;margin:5px 0 12px 8px}.marquee{overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}.marquee-track{display:flex;width:max-content;gap:14px;animation:marquee 34s linear infinite;padding:4px 0 10px}.marquee.reverse .marquee-track{animation-direction:reverse;animation-duration:39s}.marquee:hover .marquee-track{animation-play-state:paused}@keyframes marquee{to{transform:translateX(-50%)}}
.skill-card{width:118px;height:108px;flex:0 0 auto;border:1px solid #2c3644;border-radius:7px;background:linear-gradient(#0f1721,#0a1018);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}.skill-card img{width:44px;height:44px;object-fit:contain}.skill-card span{font:11px Tahoma,Arial,sans-serif;color:#d4d7dc}
.projects-window{overflow:hidden}.projects-track{display:flex;gap:16px;width:max-content;animation:projectsMove 42s linear infinite}.projects-window:hover .projects-track{animation-play-state:paused}@keyframes projectsMove{to{transform:translateX(calc(-50% - 8px))}}
.project-card{width:288px;flex:0 0 auto;border:1px solid #2d3745;border-radius:9px;background:#0a1018;overflow:hidden}.project-img{height:160px;background:#111927;border-bottom:1px solid #27313f}.project-img img{width:100%;height:160px;object-fit:cover}.project-fallback{height:160px;display:grid;place-items:center;background:radial-gradient(circle at 70% 20%,rgba(97,100,255,.26),transparent 30%),#101725;color:var(--accent);font:700 24px Tahoma,Arial,sans-serif}
.project-body{padding:15px}.project-body h3{margin:0 0 8px;font:18px Tahoma,Arial,sans-serif}.project-body p{margin:0 0 14px;color:#a7b0bb;font:16px/1.5 Tahoma,Arial,sans-serif;min-height:96px}.project-actions{display:flex;gap:7px;flex-wrap:wrap}.project-link{display:inline-flex;padding:9px 11px;border-radius:4px;background:var(--accent);font:12px Tahoma,Arial,sans-serif}.project-link.secondary{background:#161e2b;border:1px solid #354155}
.project-dots{display:flex;justify-content:center;gap:8px;margin-top:18px}.project-dots i{display:block;width:7px;height:7px;border-radius:50%;background:#4b5360}.project-dots i.active{background:var(--accent);box-shadow:0 0 10px rgba(97,100,255,.7)}
.contact{display:grid;grid-template-columns:.72fr 1.28fr;gap:30px}.contact-info{padding-right:25px;border-right:1px solid #2c3542;color:#c4cad1;font:14px/1.9 Tahoma,Arial,sans-serif}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
input,textarea,select{width:100%;background:#0b1119;border:1px solid #313b49;border-radius:5px;color:#fff;padding:11px 12px;outline:none;font:12px Tahoma,Arial,sans-serif}textarea{min-height:112px;resize:vertical;margin-top:10px}
.footer{text-align:center;color:#737d8a;font:11px Tahoma;padding:8px 0 24px}.status{height:27px;background:linear-gradient(#d7d7d7,#b9b9b9);border-top:1px solid #777;color:#222;display:flex;align-items:center;justify-content:space-between;padding:0 9px;font:11px Tahoma,Arial,sans-serif}

/* VIDEO MODAL */
.modal{position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.86);display:none;align-items:center;justify-content:center;padding:20px}.modal.open{display:flex}.modal-box{width:min(1000px,96vw);background:#070b12;border:1px solid #3b4660;border-radius:10px;box-shadow:0 0 60px rgba(97,100,255,.25);overflow:hidden}.modal-head{height:42px;background:linear-gradient(#1a2230,#0c121b);border-bottom:1px solid #303b4d;display:flex;align-items:center;padding:0 14px;font:13px Tahoma,Arial,sans-serif}.modal-title{flex:1;color:#fff}.modal-close{width:30px;height:28px;border:1px solid #4b5668;background:#151c27;color:#fff;cursor:pointer}.modal-body{padding:12px}.modal video{width:100%;max-height:75vh;background:#000;display:block}

/* ADMIN */
.admin-wrap{max-width:1160px;margin:30px auto;padding:0 16px;font-family:Tahoma,Arial,sans-serif}.admin-card{background:#0c121b;border:1px solid #293344;border-radius:10px;padding:20px;margin-bottom:18px}.admin-card h2,.admin-card h3{margin-top:0}.admin-card label{display:block;color:#bfc7d1;font-size:12px;margin:12px 0 6px}.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.admin-actions{position:sticky;bottom:0;background:#070b12;padding:12px 0;border-top:1px solid #293344;z-index:20}.notice{padding:11px 14px;border-radius:6px;background:#142037;border:1px solid #35456b;margin-bottom:16px}.login{max-width:420px;margin:90px auto}.admin-img{width:180px;height:100px;object-fit:cover;border:1px solid #344057;border-radius:6px;margin-top:8px}.admin-icon{width:54px;height:54px;object-fit:contain;background:#080c12;border:1px solid #344057;border-radius:7px;padding:6px;margin-top:8px}.small{font-size:11px;color:#8f99a5}.skill-admin-row{display:grid;grid-template-columns:62px 1fr 1.5fr 130px;gap:12px;align-items:end;padding:12px 0;border-bottom:1px solid #202a38}.skill-admin-row:last-child{border-bottom:0}.toggle-line{display:flex;align-items:center;gap:8px;height:39px}.toggle-line input{width:auto}.file-current{font-size:11px;color:#8893a2;margin-top:6px;word-break:break-all}

@media(max-width:850px){.hero,.contact,.admin-grid{grid-template-columns:1fr}.contact-info{border-right:0;border-bottom:1px solid #2c3542;padding:0 0 18px}.skill-admin-row{grid-template-columns:62px 1fr}}
@media(max-width:580px){.browser{width:100%;margin:0;border-left:0;border-right:0}.browser-menu{overflow:auto}.browser-menu a{white-space:nowrap}.toolbar .tool:nth-child(n+5){display:none}.address-row span:first-child,.go{display:none}.container{width:calc(100% - 16px)}.section-inner{padding:19px 16px}.hero{min-height:auto}h1{font-size:34px}.job{grid-template-columns:1fr;gap:6px}.form-grid{grid-template-columns:1fr}.project-card{width:250px}.project-body p{font-size:14px}.skill-admin-row{display:block}.skill-admin-row>*{margin-bottom:10px}}

/* contacts */
.contact-item{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:14px;
  color:#d8dde5;
  transition:.2s ease;
}
.contact-item:hover{color:var(--accent)}
.contact-icon{
  width:34px;height:34px;flex:0 0 34px;
  display:grid;place-items:center;
  border:1px solid #344054;
  border-radius:7px;
  background:#0a1018;
}
.contact-icon svg{width:20px;height:20px}
.contact-item.whatsapp:hover{color:#25D366}
.hp-field{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important}
.form-status{margin-top:10px;padding:9px 11px;border-radius:5px;font:12px Tahoma,Arial,sans-serif}
.form-status.ok{background:#102719;border:1px solid #245d34;color:#9ee0ad}
.form-status.error{background:#2a1518;border:1px solid #67333b;color:#f0a7b0}

/* preserve readable multiline experience descriptions */
.job p{white-space:normal}

/* Collapsible experience */
.job-main{min-width:0}
.experience-content{
  position:relative;
  overflow:hidden;
  transition:max-height .35s ease;
  max-height:5000px;
}
.experience-content.is-collapsed{
  max-height:235px;
}
.experience-content.is-collapsed::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:85px;
  pointer-events:none;
  background:linear-gradient(transparent,#0a1018 88%);
}
.experience-toggle{
  margin-top:10px;
  padding:8px 13px;
  border:1px solid #434f61;
  border-radius:5px;
  color:#fff;
  background:#111925;
  font:12px Tahoma,Arial,sans-serif;
  cursor:pointer;
}
.experience-toggle:hover{
  border-color:var(--accent);
  color:#fff;
  box-shadow:0 0 14px rgba(97,100,255,.15);
}

/* Admin icon preview */
.admin-icon{
  width:54px!important;
  height:54px!important;
  object-fit:contain!important;
  background:#080c12;
  padding:7px;
}

/* Project publish toggle */
.project-publish-control{margin:14px 0 4px}
.publish-switch{display:inline-flex!important;align-items:center;gap:10px!important;margin:0!important;cursor:pointer;color:#d9dee6!important}
.publish-switch input{position:absolute;opacity:0;pointer-events:none}
.publish-slider{position:relative;width:44px;height:23px;border-radius:20px;background:#343d4a;border:1px solid #4b5666;transition:.2s}
.publish-slider:before{content:"";position:absolute;width:17px;height:17px;left:2px;top:2px;border-radius:50%;background:#a9b1bd;transition:.2s}
.publish-switch input:checked + .publish-slider{background:var(--accent);border-color:var(--accent)}
.publish-switch input:checked + .publish-slider:before{transform:translateX(21px);background:#fff}
.publish-switch strong{font-size:12px;font-weight:400}

/* ===== v6 STRUCTURE FIX ===== */
.marquee{
  position:relative;
  width:100%;
  min-height:122px;
  overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);
}
.marquee-track{
  display:flex!important;
  align-items:stretch;
  gap:14px;
  width:max-content!important;
  min-width:max-content!important;
  padding:4px 0 10px;
  animation:none!important;
  will-change:transform;
}
.marquee-group{
  display:flex;
  align-items:stretch;
  gap:14px;
  flex:0 0 auto;
}
.skill-card{
  display:flex!important;
  width:118px!important;
  height:108px!important;
  flex:0 0 118px!important;
  opacity:1!important;
  visibility:visible!important;
}
.tools-label{margin-top:20px!important}

.projects-window{
  position:relative;
  width:100%;
  min-height:355px;
  overflow:hidden;
}
.projects-track{
  display:flex!important;
  align-items:stretch;
  gap:16px;
  width:max-content!important;
  min-width:max-content!important;
  animation:none!important;
  will-change:transform;
}
.projects-group{
  display:flex;
  align-items:stretch;
  gap:16px;
  flex:0 0 auto;
}
.project-card{
  display:flex!important;
  flex-direction:column;
  width:288px!important;
  min-height:345px;
  flex:0 0 288px!important;
  opacity:1!important;
  visibility:visible!important;
}
.project-body{
  display:flex;
  flex-direction:column;
  flex:1;
}
.project-body p{flex:1}
.project-actions{margin-top:auto}
.project-dots{min-height:10px}
.empty-state{
  padding:36px 20px;
  border:1px dashed #364155;
  border-radius:8px;
  color:#8f99a7;
  text-align:center;
  font:14px Tahoma,Arial,sans-serif;
}
.contact-info .contact-item:first-child span:last-child{word-break:break-word}

@media(max-width:700px){
  .marquee{min-height:116px}
  .skill-card{width:104px!important;flex-basis:104px!important}
  .projects-window{min-height:340px}
  .project-card{width:250px!important;flex-basis:250px!important;min-height:330px}
}