#projectPortal{position:fixed;inset:0;z-index:95;isolation:isolate;color:#e5f2f6;font-family:'Microsoft YaHei','PingFang SC',sans-serif;}
#projectPortal[hidden]{display:none!important;}
.project-veil{position:absolute;inset:0;background:rgba(2,6,19,var(--portal-dim,0));}
.project-window{position:absolute;left:0;top:0;transform-origin:0 0;transform-style:preserve-3d;outline:none;border:1px solid rgba(168,212,230,calc(.2 * var(--portal-frame,0)));background:rgba(8,15,31,var(--portal-glass,0));box-shadow:0 24px 70px rgba(0,0,0,calc(.53 * var(--portal-frame,0)));overflow:visible;will-change:transform;}
.project-window-back{position:absolute;inset:4px -6px -6px 4px;border:1px solid #99bddb36;transform:translateZ(-9px);pointer-events:none;background:#060d1d;opacity:var(--portal-glass,0);}
.project-morph-cover{position:absolute;left:0;top:0;z-index:2;transform-origin:0 0;overflow:hidden;pointer-events:none;background:linear-gradient(135deg,#0a2343,#25123e);will-change:transform;box-shadow:inset 0 0 0 1px #99dbe43d;}
.project-morph-cover img{display:block;width:100%;height:100%;object-fit:contain;user-select:none;}
.project-morph-cover[hidden]{display:none;}.project-cover-caption{display:none;}
.project-window-header{position:absolute;left:22px;right:16px;top:14px;min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:12px;}
.project-window-index{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:9px 'Orbitron',Consolas,monospace;letter-spacing:.16em;color:#8aa7bb;opacity:var(--portal-copy,0);}
.project-close{min-width:76px;min-height:44px;padding:8px 14px;white-space:nowrap;cursor:pointer;opacity:var(--portal-control,0);}
.project-tabs{position:absolute;left:22px;right:22px;top:64px;display:flex;gap:10px;height:44px;border-bottom:1px solid #a8c0e223;opacity:var(--portal-copy,0);}
.project-tabs button{padding:8px 13px;min-height:40px;cursor:pointer;}
.project-tabs button[aria-pressed=true]{color:#dafbff;border-color:var(--control-cyan);box-shadow:inset 0 -2px #87e4ee;}
.project-info{position:absolute;left:var(--project-copy-left,34%);right:24px;top:var(--project-copy-top,112px);bottom:22px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#67829a #101a2a;opacity:var(--portal-copy,0);}
.project-category{font:9px Consolas,monospace;letter-spacing:.18em;color:#8abdbb;}
.project-info h2{font-size:clamp(20px,2.8vw,32px);font-weight:500;line-height:1.4;letter-spacing:.02em;margin:12px 0;overflow-wrap:anywhere;}
.project-summary{font-size:13px;line-height:1.9;color:#c0d0da;margin:0 0 16px;}
.project-tags{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:16px;}
.project-tags span{border:1px solid #b1ccd62d;padding:5px 8px;font:9px Consolas,monospace;color:#a4bfc9;}
.project-info-link{display:inline-flex;align-items:center;min-height:40px;margin:0 0 16px;padding:8px 13px;text-decoration:none;}
.project-info-link[hidden],.project-embed-note[hidden]{display:none;}
.project-embed-note{margin:0 0 16px;font-size:10px;line-height:1.8;color:#8aa2b2;}
.project-copy{border-top:1px solid #a8c0e220;padding-top:16px;font-size:12px;line-height:2;color:#9fb3c3;overflow-wrap:anywhere;}
.project-copy :is(h2,h3){font-size:16px;color:#d6e5ec;}.project-copy img{max-width:100%;height:auto;}.project-copy a{color:#a9e6ed;}.project-copy ul{padding-left:18px;}.project-copy p{margin:0 0 16px;}
.project-browser{position:absolute;left:18px;right:18px;top:118px;bottom:18px;opacity:var(--portal-copy,0);display:flex;flex-direction:column;gap:8px;}
.project-browser[hidden],.project-info[hidden],.project-tabs button[hidden]{display:none;}
.project-browser-bar{display:flex;align-items:center;gap:8px;min-height:44px;flex-shrink:0;}
.project-address{margin-right:auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:10px Consolas,monospace;color:#90aeba;}
.project-browser-bar :is(button,a){min-height:40px;display:inline-flex;align-items:center;padding:6px 9px;text-decoration:none;white-space:nowrap;cursor:pointer;}
.project-web-status{margin:0;font-size:9px;line-height:1.5;color:#7f9db3;}
.project-browser iframe{border:1px solid #a8c0e229;flex:1;width:100%;min-height:0;background:#060b18;}
body.portfolio-window-open #portfolioStage{pointer-events:none!important;}body.portfolio-window-open #worksBack{pointer-events:none!important;}
#portfolioTitle[role=button]{pointer-events:auto;cursor:pointer;}
#portfolioCategory{display:flex;align-items:center;justify-content:center;gap:5px;pointer-events:auto;min-width:0;grid-column:1/-1;flex-wrap:wrap;margin:12px auto 0;}
#portfolioCategory button{min-height:40px;padding:8px 16px;cursor:pointer;white-space:nowrap;letter-spacing:.04em;}
#portfolioCategory button[aria-pressed=true]{color:#dbffff;border-color:#a0eaf1;box-shadow:inset 0 -2px #8ce5ef,0 4px 18px #70dcf016;}
#projectPortal :is(button,a,iframe):focus-visible,#portfolioTitle:focus-visible,#portfolioCategory button:focus-visible{outline:2px solid #b1e9e5;outline-offset:-3px;}
.project-compact .project-window-header{left:16px;right:12px;top:12px;}.project-compact .project-window-index{font-size:8px;letter-spacing:.06em;}
.project-compact .project-tabs{left:16px;right:16px;}.project-compact .project-info{right:20px;bottom:18px;}.project-compact .project-info h2{font-size:21px;}
.project-compact .project-browser{left:12px;right:12px;}.project-compact .project-browser-bar{flex-wrap:wrap;gap:5px;}.project-compact .project-address{flex-basis:100%;line-height:18px;}.project-compact .project-browser-bar :is(button,a){flex:1;justify-content:center;font-size:10px;}
@media(max-width:700px){#portfolioCategory{gap:4px;margin-top:8px;width:100%;}#portfolioCategory button{font-size:10px;min-height:40px;padding:6px 10px;flex:1;}}
@media(prefers-reduced-motion:reduce){#projectPortal *{transition-duration:.01ms!important;}}