/* Keep the original profile layout; refine only its transition and portfolio. */
.hero{height:650px}.photo-shade{background:linear-gradient(180deg,#08090b5c 0%,#08090b45 24%,#08090b80 53%,#090a0cb5 83%,#090a0c 100%),linear-gradient(90deg,#06070858,transparent 27%,transparent 73%,#06070858)}
.work-section{min-height:580px;padding:12px 32px 88px;background:transparent;overflow:hidden}.ambient{inset:0;z-index:-1;background:radial-gradient(ellipse at 16% 60%,#858f9d25,transparent 48%),radial-gradient(ellipse at 89% 72%,#aeb5bf24,transparent 44%);mask-image:linear-gradient(transparent 0%,#000 18%,#000 89%,transparent)}
.fog{position:absolute;inset:auto;pointer-events:none;filter:blur(25px);will-change:transform;animation:mist-pass 36s ease-in-out infinite alternate;background:radial-gradient(ellipse at 18% 69%,#d2d7dd35 0%,transparent 28%),radial-gradient(ellipse at 38% 45%,#c9cfd547 0%,transparent 24%),radial-gradient(ellipse at 66% 77%,#dce0e83b 0%,transparent 35%),radial-gradient(ellipse at 79% 50%,#aeb8c23d 0%,transparent 27%)}.fog-left{width:850px;height:360px;left:-340px;top:190px;transform:rotate(-17deg);opacity:.7}.fog-right{width:900px;height:370px;right:-360px;top:195px;transform:rotate(15deg);animation-delay:-18s;opacity:.75}.fog-front{width:100%;height:220px;left:0;bottom:-70px;opacity:.35;filter:blur(34px);animation-delay:-9s}
.work-panel{max-width:1320px;padding:32px 22px 24px;border-color:#c5cbdc45;background:linear-gradient(140deg,#edf2fa05,#0506080a 60%,#f2f4ff03);box-shadow:inset 0 1px #ffffff05;backdrop-filter:blur(1px);border-radius:23px}.work-heading{margin-bottom:27px}h2{font-size:43px}.project-grid{gap:20px}.project-card{position:relative;padding:5px;border:1px solid #d0d7e24a;border-radius:14px;background:linear-gradient(140deg,#f4f7ff06,#05060817 55%,#e0e8f406);box-shadow:inset 0 1px #fff1,0 8px 24px #00000012;backdrop-filter:blur(2px);transition:border-color .25s,background .25s,transform .25s}.project-card:hover{border-color:#e0e5ef80;background:linear-gradient(140deg,#f4f7ff0a,#05060812 55%,#e0e8f40a);transform:translateY(-3px)}
.project-thumbnail{position:relative;display:block;width:100%;height:196px;border:0;border-radius:9px;padding:0;overflow:hidden;background:#181a1c55;cursor:pointer;text-align:left}.project-thumbnail::after{content:"";position:absolute;inset:0;border:1px solid #f4f7ff12;border-radius:inherit;background:linear-gradient(180deg,transparent 65%,#090a0c33);pointer-events:none}.project-thumbnail>img{width:100%;height:100%;object-fit:cover;opacity:.88;filter:brightness(.7);transition:filter .3s,transform .4s}.project-thumbnail:hover>img{filter:brightness(.9);transform:scale(1.025)}.thumbnail-open{position:absolute;right:11px;bottom:11px;display:grid;place-items:center;width:28px;height:28px;border:1px solid #ffffff42;background:#10111499;backdrop-filter:blur(4px);color:#eceef4;border-radius:50%;font-size:17px;opacity:0;transition:opacity .2s}.project-thumbnail:hover .thumbnail-open,.project-thumbnail:focus-visible .thumbnail-open{opacity:1}
.project-content{padding:15px 13px 14px}h3{font-size:25px;line-height:1.2;margin:0 0 9px}.project-summary{font-size:14px;line-height:1.55;color:#b7bdc7;margin:0 0 20px;max-width:32ch;min-height:44px}.project-link{font-size:14px;line-height:1.5;gap:14px}.project-link span{font-size:18px}.project-link:hover span{transform:translate(2px,-2px)}
/* The interface thumbnail is native HTML/CSS, not generated artwork. */
.interface-art{position:relative;height:100%;width:100%;background:radial-gradient(ellipse at 65% 30%,#d2d9e229,transparent 58%),linear-gradient(135deg,#1a1e2280,#0b0d1090);overflow:hidden;color:#dfe3e8}.mini-menu{position:absolute;left:14%;top:12%;width:64%;height:79%;padding:10px 13px;border:1px solid #e5eaff53;border-radius:9px;transform:rotate(-5deg);background:linear-gradient(135deg,#c4cdd51c,#08090b78);box-shadow:0 15px 30px #0005}.mini-mark{font-size:12px;color:#fff;margin-right:7px}.mini-name{font-size:12px;letter-spacing:.08em;font-family:Georgia,serif}.mini-tabs{display:flex;gap:17px;margin-top:10px;padding-bottom:7px;border-bottom:1px solid #ffffff20;color:#aeb5c0;font-size:8px}.mini-tabs span:first-child{color:#fafafa}.mini-slots{display:grid;grid-template-columns:repeat(6,1fr);gap:4px;margin:11px 0}.mini-slots i{display:grid;place-items:center;border:1px solid #c7d0e02e;border-radius:4px;height:31px;font-style:normal;font-size:15px;color:#cbd5df;background:#dfe7ef05}.mini-bottom{display:flex;justify-content:space-between;align-items:center;font-size:8px;color:#aeb7c5}.mini-bottom b{font-weight:400;font-size:8px;padding:3px 7px;border:1px solid #e2e9f32a;border-radius:3px;color:#dfe4e9}.mini-floating{position:absolute;bottom:20%;right:5%;display:flex;align-items:center;gap:9px;padding:10px 13px;border:1px solid #f2f5ff66;background:linear-gradient(145deg,#555e6670,#0c0e11b0);backdrop-filter:blur(7px);box-shadow:0 8px 25px #0005;border-radius:8px;transform:rotate(4deg)}.mini-floating>span{font-size:19px}.mini-floating strong,.mini-floating small{display:block;font-size:9px;font-weight:400}.mini-floating small{font-size:7px;color:#afb8c5;margin-top:4px}
dialog{padding:0;border:1px solid #b8c1d267;background:linear-gradient(130deg,#191c22f5,#0c0e12fa);color:#f0f0f2;border-radius:20px;width:min(850px,calc(100vw - 36px));max-height:88svh;overflow:auto;box-shadow:0 30px 120px #000b}dialog::backdrop{background:#030508af;backdrop-filter:blur(8px)}.dialog-shell{position:relative}.close-dialog{position:sticky;z-index:5;top:14px;float:right;margin:14px 14px -54px 0;width:38px;height:38px;border-radius:50%;border:1px solid #ffffff50;background:#11151de6;color:white;font-size:27px;line-height:1;cursor:pointer;display:grid;place-items:center}.detail-hero{height:245px;overflow:hidden;background:#16191e}.detail-hero>img{width:100%;height:100%;object-fit:cover;filter:brightness(.65)}.detail-hero .interface-art{max-width:600px;margin:auto}.detail-copy{padding:30px 36px 36px}.detail-eyebrow{font-size:12px;letter-spacing:.13em;color:#a5aebc;margin:0 0 10px}.detail-copy>h2{font-size:40px;text-align:left;margin:0 0 12px}.detail-intro{font-size:17px;line-height:1.7;color:#d2d7df;margin:0 0 30px;max-width:60ch}.detail-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:30px;border-top:1px solid #ffffff20;padding-top:24px}.detail-copy h3{font-family:inherit;font-size:15px;font-weight:600;margin:0 0 11px}.detail-copy section p,.detail-copy li{color:#acb5c3;font-size:15px;line-height:1.75}.detail-copy section p{margin:0}.detail-copy ul{padding-left:18px;margin:0}.detail-notes{margin-top:28px;padding-top:24px;border-top:1px solid #ffffff20}body.modal-open{overflow:hidden}.toast{z-index:15}
@keyframes mist-pass{from{translate:-12px -7px}to{translate:42px 12px}}@media(min-width:1600px){.hero{height:720px}}@media(max-width:900px){.work-section{padding-left:20px;padding-right:20px}.work-panel{padding-left:15px;padding-right:15px}.project-grid{gap:13px}.project-thumbnail{height:165px}.project-content{padding-left:9px;padding-right:9px}.project-summary{font-size:13px;min-height:61px}.mini-menu{left:8%;width:77%;padding:9px}.mini-slots{gap:2px}.mini-floating{right:2%;padding:7px 9px}}@media(max-width:620px){.hero{height:650px}.work-section{padding:0 16px 55px}.work-panel{padding:27px 13px 16px;border-radius:21px}.work-heading{margin-bottom:24px}h2{font-size:34px}.project-grid{gap:18px}.project-thumbnail{height:190px}.project-content{padding:14px 12px 17px}.project-summary{font-size:14px;min-height:0;margin-bottom:18px;max-width:unset}.fog-left{left:-500px;top:200px}.fog-right{top:650px;right:-550px}.fog-front{height:360px;bottom:50px}.mini-menu{left:12%;width:67%;padding:10px 13px}.mini-floating{right:4%;padding:10px 13px}.detail-copy{padding:24px}.detail-copy>h2{font-size:32px}.detail-grid{grid-template-columns:1fr;gap:25px}.detail-hero{height:180px}.detail-intro{font-size:16px}}@media(prefers-reduced-motion:reduce){.fog{animation:none!important}}
