:root{--bg:#0b1115;--surface:#111a20;--accent:#62e6bd;--text:#eef3f3;--muted:#94a3ab;--line:#253139;--font:Arial,Helvetica,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);font-size:15px;line-height:1.7}button,input,textarea,select{font:inherit}a{color:inherit;text-decoration:none}button{cursor:pointer}button:disabled{cursor:wait;opacity:.55}a,button,input,textarea{outline-offset:5px}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--accent)}p{color:var(--muted);margin:0 0 22px}h1,h2,h3{line-height:1.15;margin:0;font-weight:600;letter-spacing:-1.3px}h2{font-size:clamp(30px,3.2vw,44px);max-width:620px}h3{font-size:21px;letter-spacing:-.5px}small{color:var(--muted)}.wrap{max-width:1240px;margin:auto;padding-left:40px;padding-right:40px}header{max-width:1440px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:23px 5.5%;border-bottom:1px solid var(--line);position:relative;z-index:5}.logo{display:flex;align-items:center;gap:14px;font-size:12px;font-weight:bold;letter-spacing:1.4px}.logo-mark{font-size:37px;letter-spacing:-4px;line-height:1}.logo span span,.logo>span:last-child:not(.logo-sub){color:inherit}.logo-mark span,footer .logo span{color:var(--accent)!important}.logo-sub{display:block;font-size:8px;letter-spacing:2px;color:var(--muted);margin-top:3px}nav{display:flex;gap:31px;align-items:center;font-size:12px}nav a:hover,.actions>a:hover{color:var(--accent)}.nav-contact{border:1px solid #45514f;padding:9px 18px;border-radius:5px}.nav-contact span{margin-left:18px;color:var(--accent)}.menu-toggle{display:none;background:none;color:var(--text);border:1px solid var(--line);border-radius:4px;padding:6px 12px}.hero{display:grid;grid-template-columns:1.12fr 1fr;gap:35px;align-items:center;min-height:630px;padding-top:62px;padding-bottom:62px}.eyebrow{font-family:monospace;letter-spacing:1.4px;font-size:10px;color:var(--accent);display:flex;gap:9px;align-items:center;margin-bottom:22px;text-transform:uppercase}.status-dot{display:inline-block;width:6px;height:6px;flex-shrink:0;background:var(--accent);border-radius:50%;box-shadow:0 0 12px #62e6bd55}.hello{font:10px monospace;letter-spacing:1.7px;margin:31px 0 18px;color:#b6c2c7}h1{font-size:clamp(44px,5.1vw,68px);letter-spacing:-3.1px;line-height:1.06;margin-bottom:25px}h1 em{color:var(--accent);font-style:normal}.role{font-size:12px;color:#e1e7e9;margin-bottom:17px}.role span{color:var(--accent);margin:0 8px}.intro{font-size:13px;line-height:1.9;max-width:530px}.actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:22px;padding:12px 20px;border:1px solid #364148;background:transparent;color:var(--text);font-size:12px;font-weight:600;border-radius:5px;transition:transform .2s,background .2s}.button:hover{transform:translateY(-2px);background:#1b282e}.button.primary{background:var(--accent);color:#09261d;border-color:var(--accent)}.button.primary:hover{filter:brightness(1.08)}.hero-location{display:flex;flex-wrap:wrap;gap:13px;margin-top:30px;font-size:10px;color:var(--muted)}.hero-location>span:first-child{color:var(--accent)}.divider{color:#39464a}.hero-visual{height:435px;position:relative;background:radial-gradient(ellipse at center,#203e354a,transparent 67%);display:flex;align-items:center;justify-content:center;isolation:isolate}.circuit{position:absolute;inset:0;width:100%;height:100%;color:var(--accent);opacity:.22;z-index:-1}.visual-label,.coordinate{position:absolute;left:18px;right:18px;top:8px;font:8px monospace;letter-spacing:1.3px;color:#748c8a;display:flex;justify-content:space-between}.coordinate{top:auto;bottom:10px;font-size:8px}.portrait{width:228px;height:280px;border:1px solid #546e61;border-radius:100px 100px 12px 12px;position:relative;overflow:hidden;background:#253b35;box-shadow:0 0 65px #62e6bd12}.portrait img{width:100%;height:100%;object-fit:cover;object-position:center 20%;filter:saturate(.4);opacity:.9}.portrait:after{content:'';position:absolute;inset:55% 0 0;background:linear-gradient(transparent,#0b1518)}.portrait-label{position:absolute;bottom:16px;z-index:1;left:14px;right:12px;font:6px monospace;letter-spacing:1px;display:flex;gap:8px;align-items:center}.orbit{position:absolute;border:1px dashed #38594b;border-radius:50%;width:340px;height:340px;z-index:-1}.orbit-two{width:410px;height:410px;border:1px solid #233b32;transform:rotateX(58deg) rotate(-25deg)}.float-label{position:absolute;display:flex;gap:11px;align-items:center;padding:12px 15px;background:#14221fdd;backdrop-filter:blur(12px);border:1px solid #385149;border-radius:7px;font-size:10px;box-shadow:0 10px 30px #0003}.float-label>span{color:var(--accent);font-size:24px}.float-label small{display:block;font:7px monospace;letter-spacing:.5px;margin-top:5px}.label-top{right:0;top:72px}.label-bottom{left:0;bottom:67px}.stats{display:grid;grid-template-columns:repeat(4,1fr);padding-top:25px;padding-bottom:30px;border-top:1px solid var(--line)}.stats>div{border-right:1px solid var(--line);padding-left:35px;display:flex;align-items:center;gap:15px}.stats>div:first-child{padding-left:0}.stats>div:last-child{border:0}.stats strong{font-size:30px;font-weight:500;letter-spacing:-1.5px}.stats span{font-size:10px;color:var(--muted);max-width:65px;line-height:1.5}.tech-strip{border-block:1px solid var(--line);display:flex;justify-content:center;gap:45px;padding:23px 30px;color:#7b8d94;font:11px monospace;letter-spacing:1.4px;flex-wrap:wrap}.tech-strip>span:first-child{font-size:8px;max-width:105px;letter-spacing:1.2px}.section{padding-top:88px;padding-bottom:88px}.section-top{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:30px}.section-top h2{max-width:530px}.section-top>p{font-size:12px;max-width:280px;margin:0}.filters{display:flex;flex-wrap:wrap;gap:7px;margin:32px 0 25px}.filter{padding:8px 16px;border-radius:5px;border:1px solid transparent;background:transparent;color:var(--muted);font-size:11px}.filter.active{border-color:#356151;background:#193229;color:var(--accent)}.filter:hover{color:var(--accent)}.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.project-card{background:var(--surface);border:1px solid var(--line);border-radius:8px;overflow:hidden;transition:transform .25s,border .25s}.project-card:hover{transform:translateY(-5px);border-color:#4c7764}.project-open{display:block;background:none;border:0;color:inherit;padding:0;width:100%;height:100%;text-align:left}.project-art{height:200px;position:relative;background-color:#101e20;background-image:linear-gradient(#6bbea009 1px,transparent 1px),linear-gradient(90deg,#6bbea009 1px,transparent 1px);background-size:20px 20px;overflow:hidden;isolation:isolate}.project-art>img{width:100%;height:100%;object-fit:cover}.art-category{position:absolute;bottom:12px;left:16px;font:8px monospace;letter-spacing:1px;color:#acc9bd;background:#15261edb;padding:4px 8px;border:1px solid #345046;border-radius:3px}.art-arrow{position:absolute;right:14px;top:12px;border:1px solid #426154;border-radius:50%;width:27px;height:27px;text-align:center;color:var(--accent)}.project-copy{padding:22px}.card-index{font:8px monospace;color:#79938d;letter-spacing:1.3px}.project-copy h3{font-size:18px;line-height:1.35;margin:12px 0}.project-copy p{font-size:11px;line-height:1.85;margin-bottom:20px}.chips{display:flex;gap:6px;flex-wrap:wrap}.chip{font:9px monospace;padding:4px 7px;border:1px solid #314039;background:#16221f;color:#b1c9c0;border-radius:3px}.board-art{height:100%;position:relative;display:flex;justify-content:center;align-items:center;transform:rotate(-12deg)}.board-art .circuit{opacity:.5}.chip-core{width:100px;height:82px;background:linear-gradient(135deg,#385950,#101d1a);border:4px solid #4c7461;outline:1px solid #90a894;outline-offset:4px;box-shadow:10px 14px 20px #0007;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#cae1d4;font:bold 22px monospace;border-radius:4px}.chip-core small{font:5px monospace;margin-top:9px;color:#accbb9;letter-spacing:1px}.camera-art{width:200px;height:160px;margin:15px auto;position:relative}.camera-body{width:133px;height:79px;background:linear-gradient(145deg,#c4d4ca,#54796b);position:absolute;left:30px;top:28px;border-radius:15px 24px 24px 15px;transform:rotate(-12deg);box-shadow:14px 14px 18px #0005}.camera-body>span{position:absolute;right:8px;top:18px;font:6px monospace;color:#284c3a}.lens{width:72px;height:72px;border-radius:50%;border:9px solid #30493f;background:radial-gradient(circle at 40% 35%,#789689 0,#244d50 18%,#0e1d26 30%,#122226 45%,#3c6354 46%,#0b1317 58%);position:absolute;left:-15px;top:4px;box-shadow:0 0 0 3px #93ab9b}.lens i{position:absolute;width:8px;height:8px;border-radius:50%;background:#b5eadf55;left:17px;top:12px}.camera-stand{height:44px;width:20px;background:#577869;position:absolute;top:108px;left:108px;transform:rotate(-20deg)}.camera-stand:after{content:'';position:absolute;width:65px;height:9px;background:#8ba598;bottom:-3px;left:-25px;border-radius:50%}.scan-line{height:1px;position:absolute;left:0;right:0;top:42%;background:#74e2b530;box-shadow:0 0 12px #74e2b5}.mesh-art{height:100%;position:relative}.mesh-art svg{height:100%;width:100%;stroke:#547c69;stroke-width:1;fill:none}.mesh-art i{position:absolute;width:24px;height:24px;background:#447861;border:5px solid #aac9b4;box-shadow:0 0 0 6px #52795e33,0 0 35px #64dba633;border-radius:6px;left:47%;top:14%}.mesh-art i:nth-child(2){left:15%;top:44%}.mesh-art i:nth-child(3){left:79%;top:44%}.mesh-art i:nth-child(4){left:47%;top:76%}.mesh-art i:nth-child(5){left:47%;top:44%;width:34px;height:34px;margin:-5px}.lab{background:linear-gradient(110deg,#14251f,#111c1c);border:1px solid #30473c;border-radius:10px;display:grid;grid-template-columns:1.5fr 1fr;padding-top:42px;padding-bottom:42px;align-items:center;overflow:hidden;width:calc(100% - 80px);max-width:1160px}.lab h2{font-size:35px;margin-bottom:17px}.lab p{font-size:12px;max-width:510px}.outline-label{font:8px monospace;color:var(--accent);padding:6px 10px;border:1px solid #3e6653;letter-spacing:1.5px;border-radius:3px}.robot-art{height:220px;width:250px;position:relative;margin:auto;transform:rotate(-6deg)}.robot-head{position:absolute;left:63px;top:28px;width:125px;height:80px;border-radius:22px;background:linear-gradient(135deg,#b9cbbd,#557f6b);border:5px solid #829e8c;box-shadow:8px 8px 20px #0004}.robot-head:before{content:'';position:absolute;inset:12px 8px;background:#0e2623;border-radius:12px}.robot-head i{position:absolute;background:var(--accent);width:12px;height:18px;top:25px;left:26px;border-radius:5px;box-shadow:0 0 15px #62e6bd88}.robot-head i:nth-child(2){left:76px}.robot-head span{position:absolute;bottom:16px;width:17px;height:4px;left:49px;background:#62e6bd88;border-radius:5px}.robot-body{position:absolute;left:73px;top:116px;width:100px;height:70px;background:linear-gradient(130deg,#77998a,#2f5346);border-radius:15px;border:3px solid #749b86;text-align:center;padding-top:20px;font:11px monospace;color:#c2e1d0}.robot-body:before,.robot-body:after{content:'';position:absolute;width:20px;height:50px;top:5px;background:#86a794;border-radius:10px;left:-30px;transform:rotate(15deg)}.robot-body:after{left:auto;right:-30px;transform:rotate(-15deg)}.robot-track{position:absolute;bottom:12px;left:65px;width:120px;height:20px;background:repeating-linear-gradient(90deg,#446754 0 8px,#20372e 8px 12px);border:4px solid #67836f;border-radius:12px}.robot-antenna{position:absolute;width:3px;height:26px;background:#8db49b;top:4px;left:125px}.robot-antenna:before{content:'';width:9px;height:9px;background:var(--accent);position:absolute;left:-3px;top:-5px;border-radius:50%;box-shadow:0 0 15px #62e6bd}.robot-ring{position:absolute;inset:-25px;border:1px dashed #426c533f;border-radius:50%;z-index:-1}.skills-grid{margin-top:35px;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.skill-card{border:1px solid var(--line);padding:25px;border-radius:6px}.skill-card h3{margin:18px 0;font-size:17px}.skill-card .chip{background:transparent;color:#a0b0b6;border-color:#2a353c;font-size:10px}.experience-section{border-block:1px solid var(--line);background:#0e161b}.experience{display:grid;grid-template-columns:260px 1fr;gap:35px;margin-top:45px}.experience-side{font:11px monospace;border-top:1px solid var(--line);padding-top:20px}.experience-side p{color:#d4deda;display:inline;margin-left:10px}.experience-side small{display:block;margin-top:10px}.experience h3{font-size:24px;margin-bottom:8px}.company{color:var(--accent);font-size:12px}.experience p:not(.company){font-size:12px}.experience ul{padding-left:16px;color:var(--muted);font-size:12px;line-height:1.9}.experience li{padding:3px 0 3px 8px}.experience li::marker{color:var(--accent)}.achievements{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:25px}.achievements>div{border:1px solid var(--line);border-radius:4px;padding:14px;font-size:10px;color:#b1bfc3;display:flex;gap:12px}.achievements span{color:var(--accent)}.education-heading{margin-top:65px;border-top:1px solid var(--line);padding-top:35px}.education-heading .eyebrow{margin-bottom:10px}.education-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:23px}.education-grid article{padding:23px;background:var(--surface);border:1px solid var(--line);border-radius:6px}.education-grid h3{font-size:17px;margin:12px 0}.education-grid p{font-size:12px;margin-bottom:4px}.education-grid small{font-size:10px}.contact{display:grid;grid-template-columns:1fr 1fr;gap:65px}.contact h2{font-size:48px;margin-bottom:20px}.contact p{font-size:13px}.email-link{font-size:13px;color:var(--accent);overflow-wrap:anywhere}.contact .actions{font-size:11px;margin-top:24px;gap:25px}label{font-size:11px;display:block;color:#c0ced2;margin-bottom:17px}input,textarea,select{display:block;border:1px solid #34424a;color:var(--text);background:#111a20;border-radius:5px;padding:12px;width:100%;margin-top:7px;font-size:12px}textarea{resize:vertical;min-height:90px}input::placeholder,textarea::placeholder{color:#75848d}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.honeypot{position:absolute;left:-10000px}#contact-status{margin-top:12px;min-height:22px}footer{border-top:1px solid var(--line);padding:30px 0}footer>.wrap{display:flex;align-items:center;gap:30px;font-size:10px;color:#87969d}footer .logo{font-size:33px;gap:0;letter-spacing:-3px;color:var(--text)}footer small{display:block;font-size:9px}footer a:nth-last-child(2){margin-left:auto}dialog{max-width:720px;width:calc(100% - 32px);padding:45px;background:#111e22;border:1px solid #426050;border-radius:12px;color:var(--text);max-height:85vh}dialog::backdrop{background:#03090bd9;backdrop-filter:blur(8px)}dialog h2{font-size:32px;margin-bottom:25px}dialog p,dialog li{font-size:14px;color:var(--muted)}dialog ul{padding-left:20px}dialog .button{margin-top:25px}.close{position:absolute;right:15px;top:10px;border:0;background:none;color:var(--text);font-size:28px}.loading{padding:120px 30px;text-align:center}.skip{position:absolute;top:-70px;left:15px;z-index:20;background:var(--accent);color:#10231b;padding:10px}.skip:focus{top:10px}
/* Content management */
.admin-shell{max-width:1300px;margin:40px auto;padding:0 30px}.admin-header{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:30px}.admin-header h1{font-size:30px;letter-spacing:-1px;margin:0}.admin-grid{display:grid;grid-template-columns:190px 1fr;gap:30px}.admin-nav{display:flex;flex-direction:column;gap:5px;align-self:start;position:sticky;top:25px}.admin-nav button{border:1px solid transparent;background:none;color:var(--muted);text-align:left;padding:10px 14px;border-radius:5px;font-size:13px}.admin-nav button.active{background:#193229;color:var(--accent);border-color:#356151}.admin-panel{padding:30px;border:1px solid var(--line);border-radius:8px;background:var(--surface);min-width:0}.admin-panel h2{font-size:26px;margin-bottom:25px}.admin-panel h3{font-size:17px;margin:10px 0 20px}.admin-panel input,.admin-panel textarea{background:#0c151a}.admin-toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:25px}.admin-toolbar span{font-size:11px;color:var(--muted)}.admin-item{padding:20px;border:1px solid #33443c;border-radius:6px;margin:20px 0;background:#0d171b}.item-actions{display:flex;justify-content:flex-end;gap:8px;margin-bottom:15px}.small-button{border:1px solid #3b4c43;background:#17281f;color:#c0d3c6;border-radius:4px;padding:5px 10px;font-size:11px}.danger{color:#ffb6ae;border-color:#684441;background:#322222}.admin-status{padding:12px 0;color:var(--accent);font-size:13px;min-height:45px}.login-card{max-width:440px;margin:100px auto;padding:32px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}.login-card h1{font-size:30px;letter-spacing:-1px}.login-card p{font-size:12px}.login-card .button{width:100%}.upload-row{display:flex;align-items:center;gap:12px}.upload-row input[type=file]{font-size:11px}.help{font-size:11px;color:var(--muted);margin:4px 0 14px}.message{border:1px solid var(--line);padding:20px;border-radius:6px;margin-bottom:15px}.message.unread{border-left:3px solid var(--accent)}.message h3{margin:0 0 8px}.message p{white-space:pre-wrap;overflow-wrap:anywhere;font-size:13px;margin:16px 0}.message small{font-size:11px}.message a{color:var(--accent);font-size:12px}.message .item-actions{margin:15px 0 0}.admin-preview{max-height:140px;max-width:200px;object-fit:cover;margin-top:10px;border-radius:6px}
@media(min-width:1600px){.hero{min-height:690px}.hero-visual{height:480px}}@media(max-width:1000px){.hero{gap:15px}h1{font-size:48px}.hero-visual{transform:scale(.9);margin:0 -20px}.stats>div{padding-left:20px}.stats strong{font-size:25px}.tech-strip{gap:22px}.project-grid{grid-template-columns:repeat(2,1fr)}.experience{grid-template-columns:200px 1fr}.contact{gap:35px}.contact h2{font-size:40px}.float-label{padding:9px}.label-top{right:-5px}}@media(max-width:720px){header{padding:18px 22px}.menu-toggle{display:block}nav{display:none;position:absolute;top:79px;left:0;right:0;background:#111b20;padding:25px;flex-direction:column;border-bottom:1px solid var(--line)}nav.open{display:flex}.wrap{padding-left:22px;padding-right:22px}.hero{grid-template-columns:1fr;padding-top:38px;padding-bottom:25px}.hero-copy{max-width:530px}h1{font-size:clamp(43px,10vw,65px)}.hello{font-size:9px}.hero-visual{height:370px;max-width:430px;width:100%;margin:15px auto 0;transform:none}.portrait{height:240px;width:195px}.orbit-one{width:290px;height:290px}.orbit-two{width:340px;height:340px}.label-top{top:60px;right:0}.label-bottom{bottom:53px}.stats{grid-template-columns:repeat(2,1fr);gap:22px;padding-block:25px}.stats>div{padding-left:0;border:0}.stats strong{font-size:30px}.stats span{max-width:none}.tech-strip{padding:18px 22px;gap:15px;font-size:9px}.tech-strip>span:first-child{display:none}.section{padding-top:58px;padding-bottom:58px}.section-top{display:block}.section-top>p{max-width:100%;margin-top:20px}.project-grid{gap:15px}.project-copy{padding:17px}.project-copy h3{font-size:16px}.project-art{height:180px}.skills-grid{grid-template-columns:repeat(2,1fr);gap:12px}.skill-card{padding:20px}.lab{width:calc(100% - 44px);grid-template-columns:1fr;padding:30px 24px}.lab h2{font-size:30px}.robot-art{margin-top:25px}.experience{grid-template-columns:1fr;gap:22px;margin-top:30px}.education-grid{grid-template-columns:1fr}.contact{grid-template-columns:1fr;gap:35px}.contact h2{font-size:40px}footer>.wrap{flex-wrap:wrap;gap:15px}footer a:nth-last-child(2){margin-left:0}footer .logo+span{width:calc(100% - 65px)}.admin-shell{padding:0 15px;margin-top:25px}.admin-grid{grid-template-columns:1fr;gap:15px}.admin-nav{position:static;flex-direction:row;overflow:auto}.admin-nav button{white-space:nowrap}.admin-header{align-items:flex-start;flex-wrap:wrap}.admin-panel{padding:20px}.login-card{margin:60px 20px}.admin-toolbar .button{padding:10px 13px}}@media(max-width:450px){.project-grid{grid-template-columns:1fr}.project-art{height:220px}.skills-grid{grid-template-columns:1fr}.achievements{grid-template-columns:1fr}.form-row{grid-template-columns:1fr;gap:0}.hero-location{gap:10px}.role{font-size:11px}.float-label small{font-size:6px}.hero-visual{height:340px}.orbit-two{width:300px;height:300px}.coordinate{font-size:6px}.visual-label{font-size:6px}.stats span{font-size:9px}.button{padding:12px 14px;gap:13px}.admin-item{padding:13px}dialog{padding:30px 22px}dialog h2{font-size:26px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
/* Keep decorative orbital paths inside the illustration on narrow screens. */
.hero-visual{overflow:clip}

/* Compact phone layout: paired cards with full project details one tap away. */
.project-mobile-details { display:none; }
@media (max-width:720px) {
  #projects, #skills, #contact, .experience-section > .section {
    padding:36px 16px;
  }
  #projects .eyebrow, #skills .eyebrow, #contact .eyebrow { margin-bottom:12px; }
  #projects h2, #skills h2, #contact h2 { font-size:28px; letter-spacing:-1px; }
  .section-top { margin-bottom:18px; }
  .section-top > p { margin-top:12px; font-size:12px; line-height:1.65; }
  .filters { gap:4px; margin:18px 0 14px; }
  .filter { min-height:40px; padding:7px 9px; font-size:10px; }
  .project-grid, .skills-grid, .education-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }
  .project-card, .skill-card, .education-grid article { min-width:0; }
  .project-open { display:flex; flex-direction:column; }
  .project-art { height:118px; width:100%; flex-shrink:0; }
  .project-art .chip-core { transform:scale(.67); }
  .project-art .camera-art {
    position:absolute; margin:0; left:50%; top:50%;
    transform:translate(-50%,-50%) scale(.6);
  }
  .project-art .mesh-art i { width:16px; height:16px; border-width:3px; }
  .project-art .mesh-art i:nth-child(5) { width:23px; height:23px; margin:-3px; }
  .art-category {
    left:7px; bottom:7px; max-width:calc(100% - 14px);
    font-size:8px; letter-spacing:0; padding:2px 5px; overflow-wrap:anywhere;
  }
  .art-arrow { right:7px; top:7px; width:23px; height:23px; font-size:13px; }
  .project-copy { padding:12px 10px; display:flex; flex-direction:column; flex:1; width:100%; }
  .project-copy .card-index { font-size:8px; letter-spacing:.6px; }
  .project-copy h3 {
    font-size:14px; line-height:1.35; letter-spacing:-.25px;
    margin:8px 0; overflow-wrap:anywhere;
  }
  .project-copy p {
    font-size:11px; line-height:1.6; margin-bottom:12px;
    display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3;
    overflow:hidden;
  }
  .project-copy .chips { margin-top:auto; gap:4px; }
  .project-copy .chip, .skill-card .chip {
    font-size:9px; line-height:1.4; padding:3px 5px;
    max-width:100%; overflow-wrap:anywhere;
  }
  .project-mobile-details { display:block; margin-top:12px; color:var(--accent); font-size:10px; }
  .skills-grid { margin-top:20px; }
  .skill-card { padding:14px 11px; }
  .skill-card h3 { font-size:14px; line-height:1.35; margin:10px 0 12px; overflow-wrap:anywhere; }
  .skill-card .chips { gap:5px; }
  .tech-strip { padding:14px 16px; gap:12px 18px; font-size:9px; letter-spacing:.6px; }
  .education-heading { margin-top:32px; padding-top:24px; }
  .education-heading h3 { font-size:22px; }
  .education-grid { margin-top:16px; }
  .education-grid article { padding:14px 11px; }
  .education-grid h3 { font-size:14px; line-height:1.4; margin:9px 0; overflow-wrap:anywhere; }
  .education-grid p { font-size:11px; line-height:1.6; margin-bottom:7px; overflow-wrap:anywhere; }
  .education-grid small { display:block; font-size:10px; line-height:1.5; }
  .education-grid .card-index { font-size:9px; letter-spacing:.4px; }
  #contact { gap:22px; }
  #contact > div, #contact form { min-width:0; }
  #contact h2 { margin-bottom:12px; }
  #contact p { font-size:12px; line-height:1.65; margin-bottom:12px; }
  #contact .email-link { font-size:12px; }
  #contact .actions { margin-top:10px; gap:18px; }
  #contact .actions a { display:inline-flex; align-items:center; min-height:40px; }
  #contact form { padding:16px 12px; background:var(--surface); border:1px solid var(--line); border-radius:8px; }
  #contact .form-row { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
  #contact label { min-width:0; font-size:11px; margin-bottom:12px; }
  #contact input, #contact textarea { min-width:0; font-size:16px; padding:10px; margin-top:5px; }
  #contact input { min-height:44px; }
  #contact textarea { min-height:100px; height:100px; }
  #contact .button { width:100%; min-height:44px; padding:10px 14px; }
  #contact-status:empty { display:none; }
  #contact #contact-status:not(:empty) { margin:12px 0 0; }
}
@media (max-width:360px) {
  .project-grid, .skills-grid, .education-grid { gap:8px; }
  .project-copy, .skill-card, .education-grid article { padding:11px 8px; }
  .project-art { height:105px; }
}

/* Portfolio Studio — admin-only layout and controls. */
.admin-page { background:#0b1116; --surface:#111b22; --muted:#9aaab5; }
.admin-page > header { max-width:none; padding:18px 4%; background:#101920; border-color:#27333c; }
.admin-page > header > a:last-child { font-size:12px; color:#b6c8d0; }
.admin-page > header .logo { gap:10px; font-size:11px; letter-spacing:1.7px; }
.admin-page .admin-shell { max-width:1440px; padding:0 4%; margin:36px auto 70px; }
.admin-page .admin-header { margin-bottom:28px; }
.admin-page .admin-header .eyebrow { font-size:9px; margin-bottom:9px; letter-spacing:1.8px; }
.admin-page .admin-header h1 { font-size:32px; }
.admin-page .admin-header p { font-size:12px; margin:9px 0 0; }
.studio-version { display:inline-block; vertical-align:middle; font:11px monospace; letter-spacing:0; color:#617785; margin-left:14px; }
.admin-account { display:flex; gap:12px; align-items:center; }
.account-avatar { display:grid; place-items:center; width:40px; height:40px; border-radius:50%; color:var(--accent); background:#203c33; border:1px solid #376451; font-size:17px; }
.admin-account strong { display:block; font-size:11px; font-weight:500; }
.admin-account small { display:block; font-size:10px; margin-top:2px; }
.admin-account .button { font-size:11px; padding:8px 12px; margin-left:8px; }
.studio-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-bottom:25px; }
.studio-metrics > div { position:relative; display:flex; gap:17px; align-items:center; padding:23px 20px 35px; background:linear-gradient(125deg,#15232a,#101a21); border:1px solid #2a3a42; border-radius:10px; }
.metric-icon { display:grid; place-items:center; width:42px; height:42px; flex-shrink:0; border:1px solid #355245; border-radius:12px; color:var(--accent); background:#1a332c; font-size:23px; }
.studio-metrics strong { display:block; font-size:26px; line-height:1.2; font-weight:500; letter-spacing:-.6px; }
.studio-metrics div div span { font-size:11px; color:#a3b5bf; }
.studio-metrics > div > small { position:absolute; bottom:12px; left:80px; font:7px monospace; letter-spacing:1.6px; color:#6c8693; }
.admin-page .admin-toolbar { position:sticky; top:0; z-index:8; display:flex; justify-content:space-between; gap:14px; padding:13px 16px; border:1px solid #30443e; background:#13221fee; backdrop-filter:blur(15px); border-radius:8px; margin-bottom:20px; box-shadow:0 8px 25px #0002; }
.toolbar-actions { display:flex; gap:9px; }
.admin-page .admin-toolbar .button { font-size:11px; padding:10px 14px; }
.save-indicator { display:flex; align-items:center; gap:9px; }
.admin-page .save-indicator #save-state { font-size:11px; color:#b2cbbb; }
.save-indicator.has-changes .status-dot { background:#efc274; box-shadow:0 0 10px #efc27444; }
.admin-page .save-indicator.has-changes #save-state { color:#efc274; }
.admin-page button:disabled { cursor:default; opacity:.38; }
.admin-page #admin-status:empty { display:none; }
.admin-page #admin-status:not(:empty) { padding:12px 17px; margin:-6px 0 20px; border-radius:6px; border:1px solid #315545; background:#153026; font-size:12px; min-height:0; }
.admin-page #admin-status[data-tone=error] { color:#ffc6bb; border-color:#764a42; background:#322321; }
.admin-page .admin-grid { grid-template-columns:215px minmax(0,1fr); gap:25px; align-items:start; }
.admin-page .admin-nav { gap:3px; top:86px; }
.nav-group { display:block; color:#738a97; font:8px monospace; letter-spacing:1.5px; margin:8px 12px 12px; }
.nav-group-secondary { margin-top:24px; }
.admin-page .admin-nav button { display:flex; align-items:center; gap:11px; padding:12px; font-size:12px; color:#a4b8c2; border-radius:6px; }
.admin-page .admin-nav button:hover { background:#16262a; color:#e1f1ee; }
.admin-page .admin-nav button.active { background:linear-gradient(90deg,#203e33,#162922); border-color:#365b49; color:#92efcc; }
.nav-icon { font-size:19px; width:20px; line-height:1; text-align:center; }
.nav-chevron { margin-left:auto; opacity:0; }
.active .nav-chevron { opacity:1; }
.sidebar-tip { margin:24px 5px 0; padding:18px 14px; border:1px solid #293a3f; border-radius:8px; background:linear-gradient(145deg,#15272b,#101b20); }
.sidebar-tip > span { display:block; color:var(--accent); font-size:24px; margin-bottom:7px; }
.sidebar-tip strong { display:block; font-size:12px; line-height:1.6; font-weight:500; }
.sidebar-tip p { font-size:11px; line-height:1.7; margin:7px 0 0; }
.admin-page .admin-panel { border-color:#2a3a44; background:#111b23; border-radius:10px; padding:30px; }
.editor-heading { display:flex; gap:16px; align-items:flex-start; padding-bottom:22px; border-bottom:1px solid #2a3943; }
.editor-icon { width:46px; height:46px; display:grid; place-items:center; border:1px solid #355545; border-radius:12px; background:#1b332b; color:var(--accent); font-size:26px; flex-shrink:0; }
.editor-heading .eyebrow { margin:1px 0 7px; font-size:8px; letter-spacing:1.4px; }
.admin-page .editor-heading h2 { margin:0; font-size:25px; letter-spacing:-.7px; }
.editor-heading p { font-size:12px; margin:9px 0 0; }
.editor-guidance { padding:11px 0 20px; font-size:10px; color:#8fa5af; }
.editor-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:19px 20px; }
.field-block { min-width:0; }
.field-wide { grid-column:1/-1; }
.admin-page .field-block label { font-size:12px; color:#c7d5db; margin:0; line-height:1.6; }
.admin-page .field-block input:not([type=file]):not([type=color]),.admin-page .field-block textarea { background:#0c151d; border-color:#334550; padding:12px 13px; border-radius:6px; font-size:13px; margin-top:8px; }
.admin-page .field-block textarea { min-height:96px; line-height:1.65; }
.admin-page .field-block input:focus,.admin-page .field-block textarea:focus { border-color:#69caa1; }
.admin-page .field-block input[type=color] { height:47px; padding:5px; max-width:180px; }
.admin-page .field-block .help { font-size:10px; margin:6px 0 0; }
.media-field { display:flex; gap:20px; padding:17px; margin-top:12px; border:1px dashed #415d5a; background:#142326; border-radius:7px; align-items:center; }
.media-field > div { flex:1; min-width:0; }
.admin-page .admin-preview { width:78px; height:85px; flex-shrink:0; object-fit:cover; margin:0; border:1px solid #4a625b; border-radius:9px; }
.admin-page .upload-row { display:block; font-size:11px; }
.admin-page .upload-row input { margin-top:7px; font-size:11px; padding:0; border:0; background:transparent; min-width:0; }
.admin-page input[type=file]::file-selector-button { border:1px solid #496c5b; padding:8px 11px; color:#bfe9d7; background:#203d32; border-radius:5px; margin-right:10px; cursor:pointer; font:11px Arial,sans-serif; }
.asset-link { color:var(--accent); font-size:11px; }
.admin-page .admin-item { padding:0; margin:0 0 12px; border:1px solid #34454d; background:#0f1921; border-radius:8px; overflow:hidden; }
.admin-item summary { list-style:none; display:flex; align-items:center; gap:12px; padding:18px; cursor:pointer; }
.admin-item summary::-webkit-details-marker { display:none; }
.admin-item summary:hover { background:#15242a; }
.admin-item summary:focus-visible { outline:2px solid var(--accent); outline-offset:-3px; }
.item-number { display:grid; place-items:center; width:33px; height:33px; border-radius:7px; background:#1c3030; color:#8ec3b1; font:10px monospace; flex-shrink:0; }
.item-summary { flex:1; min-width:0; }
.item-summary strong { display:block; font-size:13px; font-weight:500; overflow-wrap:anywhere; line-height:1.5; }
.item-summary small { font-size:10px; margin-top:3px; display:block; }
.expand-icon { color:#8ba89b; font-size:20px; }
.admin-item[open] .expand-icon { rotate:45deg; }
.item-content { padding:0 20px 22px; }
.admin-page .item-actions { align-items:center; padding-top:12px; border-top:1px solid #293b43; margin-bottom:19px; }
.item-actions > span { margin-right:auto; font:8px monospace; letter-spacing:1px; color:#719188; }
.admin-page .small-button { min-height:32px; border-radius:5px; }
.admin-page .add-item { width:100%; justify-content:center; background:#142622; border:1px dashed #436955; color:var(--accent); padding:14px; margin-top:6px; }
.editor-empty { padding:48px 20px; text-align:center; border:1px dashed #3b5155; border-radius:9px; margin:20px 0; background:#0e1a20; }
.editor-empty > span { font-size:35px; color:var(--accent); }
.admin-page .editor-empty h3 { font-size:19px; margin:15px 0 10px; }
.editor-empty p { font-size:12px; max-width:370px; margin:0 auto; }
.admin-page .message { background:#0d171f; border-radius:8px; }
.admin-page .message h3 { font-size:17px; }
.admin-page .message.unread { background:linear-gradient(110deg,#162b25,#101b22); }
.admin-page .studio-login { max-width:1080px; display:grid; grid-template-columns:1.15fr 1fr; margin:70px auto; padding:0 30px; gap:90px; align-items:center; }
.login-story .eyebrow { font-size:9px; }
.login-story h2 { font-size:42px; line-height:1.17; margin-bottom:20px; letter-spacing:-1.5px; }
.login-story > p { font-size:13px; line-height:1.8; }
.login-art { height:230px; position:relative; display:grid; place-items:center; background:radial-gradient(ellipse,#2b815330,transparent 68%); }
.login-art > span { font-size:70px; color:#9aedc9; border:1px solid #4b8c70; border-radius:25px; padding:0 27px; background:linear-gradient(140deg,#2c5946,#162c27); transform:rotate(-12deg); box-shadow:12px 18px 40px #0004; }
.login-art i { position:absolute; width:250px; height:165px; border:1px dashed #3e6b5955; border-radius:50%; rotate:-25deg; z-index:-1; }
.login-art i:nth-of-type(2) { rotate:35deg; width:300px; height:150px; }
.login-art small { position:absolute; bottom:7px; font:8px monospace; letter-spacing:2px; color:#83a794; }
.login-note { display:flex; gap:9px; align-items:center; margin-top:20px; font-size:11px; color:#9fb5ac; }
.admin-page .login-card { max-width:none; width:100%; margin:0; padding:34px; border-color:#34494e; background:linear-gradient(145deg,#18262d,#0f1a22); box-shadow:0 20px 70px #0003; }
.login-icon { display:grid; place-items:center; width:42px; height:42px; border:1px solid #446f57; border-radius:11px; background:#234231; color:#8feabd; font-size:25px; margin-bottom:28px; }
.login-card .eyebrow { font-size:8px; letter-spacing:1.8px; margin-bottom:12px; }
.admin-page .login-card h1 { font-size:30px; margin-bottom:13px; }
.admin-page .login-card p { font-size:12px; line-height:1.8; margin-bottom:25px; }
.password-field { position:relative; margin:8px 0 24px; }
.password-field input { font-size:14px; padding:13px 62px 13px 13px; background:#0a151c; }
.password-field button { position:absolute; right:8px; top:7px; padding:7px 8px; background:none; border:0; color:#91c8ae; font-size:11px; }
.admin-page .login-card .button { min-height:45px; }
.login-card .admin-status { font-size:12px; color:#ffd2c4; min-height:30px; }
.login-back { display:block; font-size:11px; text-align:center; color:#92a8b2; margin-top:7px; }
@media(max-width:1050px) {
 .admin-account > div { display:none; }
 .studio-metrics > div { padding-left:15px; gap:10px; }
 .studio-metrics > div > small { left:68px; }
 .studio-metrics div div span { font-size:10px; }
 .studio-metrics strong { font-size:23px; }
 .admin-page .admin-grid { grid-template-columns:190px minmax(0,1fr); gap:18px; }
 .admin-page .admin-panel { padding:22px; }
 .admin-page .studio-login { gap:45px; }
}
@media(max-width:720px) {
 .admin-page > header { padding:17px 16px; }
 .admin-page > header > a:last-child { font-size:10px; }
 .admin-page .admin-shell { padding:0 16px; margin-top:25px; }
 .admin-page .admin-header { flex-wrap:nowrap; align-items:center; gap:10px; }
 .admin-page .admin-header h1 { font-size:26px; }
 .admin-page .admin-header p { font-size:10px; }
 .studio-version,.account-avatar { display:none; }
 .admin-account .button { margin-left:0; padding:8px; font-size:10px; white-space:nowrap; }
 .studio-metrics { grid-template-columns:1fr 1fr; gap:10px; margin-bottom:18px; }
 .studio-metrics > div { padding:16px 12px; gap:10px; }
 .studio-metrics > div:last-child,.studio-metrics > div > small { display:none; }
 .metric-icon { width:33px; height:33px; font-size:19px; border-radius:9px; }
 .studio-metrics strong { font-size:23px; }
 .studio-metrics div div span { font-size:9px; line-height:1.4; display:block; }
 .admin-page .admin-toolbar { align-items:flex-start; gap:10px; flex-direction:column; padding:12px; }
 .toolbar-actions { width:100%; gap:6px; }
 .admin-page .admin-toolbar .button { padding:9px 10px; font-size:10px; flex:1; justify-content:center; white-space:nowrap; }
 .admin-page .admin-grid { grid-template-columns:minmax(0,1fr); gap:16px; }
 .admin-page .admin-nav { position:static; flex-direction:row; overflow:auto; gap:5px; padding-bottom:8px; }
 .nav-group,.sidebar-tip,.nav-chevron { display:none; }
 .admin-page .admin-nav button { padding:10px 12px; font-size:11px; flex-shrink:0; gap:7px; border-color:#2a3c40; }
 .nav-icon { font-size:16px; width:17px; }
 .admin-page .admin-panel { padding:20px 16px; }
 .editor-heading { gap:12px; padding-bottom:17px; }
 .editor-icon { width:37px; height:37px; font-size:22px; border-radius:9px; }
 .admin-page .editor-heading h2 { font-size:22px; }
 .editor-heading p { font-size:11px; }
 .editor-fields { grid-template-columns:minmax(0,1fr); gap:17px; }
 .admin-page .field-block input:not([type=file]):not([type=color]),.admin-page .field-block textarea { font-size:16px; padding:10px; }
 .admin-page .field-block label { font-size:11px; }
 .media-field { padding:12px; gap:12px; flex-wrap:wrap; }
 .admin-page .admin-preview { width:60px; height:67px; }
 .media-field > div { min-width:160px; }
 .admin-item summary { padding:14px 12px; gap:9px; }
 .item-summary strong { font-size:12px; }
 .item-content { padding:0 12px 17px; }
 .admin-page .small-button { min-height:38px; }
 .admin-page .studio-login { grid-template-columns:1fr; margin:35px auto; max-width:460px; padding:0 20px; gap:25px; }
 .login-story { display:none; }
 .admin-page .login-card { padding:27px; }
 .password-field input { font-size:16px; }
}
@media(max-width:360px) {
 .admin-page .admin-shell { padding:0 10px; }
 .admin-page .admin-header h1 { font-size:23px; }
 .admin-page .admin-header .eyebrow { font-size:7px; }
 .admin-page .admin-toolbar .button { padding:9px 6px; font-size:9px; }
 .studio-metrics > div { gap:7px; padding:13px 9px; }
 .studio-metrics div div span { font-size:8px; }
 .admin-page .admin-panel { padding:18px 12px; }
}
@media(max-width:720px) {
 .admin-page .toolbar-actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
 .admin-page .admin-toolbar .button { min-width:0; white-space:normal; text-align:center; line-height:1.4; gap:0; min-height:42px; }
}