@import "https://fonts.googleapis.com/css2?family=Modak&family=Outfit:wght@400;500;700;800;900&display=swap";:root{--bg:#202020;--ink:#111;--charcoal:#171717;--panel:#232323;--paper:#f4f1ec;--paper-soft:#ebe7df;--white:#fff;--muted:#a9a9a0;--muted-dark:#66635d;--line:#fff3;--line-dark:#1111112e;--pink:#ff72a6;--rose:#e84886;--acid:#d5ff59;--cyan:#9de5ff;--shadow:0 28px 90px #00000059;--sans:Outfit, Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--display:Modak, Outfit, var(--sans);color:var(--paper);font:16px/1.5 var(--sans);font-synthesis:none;letter-spacing:0;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html{background:var(--bg)}body{background:linear-gradient(90deg, #ffffff08 1px, transparent 1px), linear-gradient(180deg, #ffffff06 1px, transparent 1px), var(--bg);background-size:56px 56px;margin:0}button,input,select{font:inherit}button,a{transition:background-color .2s,border-color .2s,color .2s,opacity .2s,transform .2s}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.35}a{color:inherit}#root{min-height:100svh}.portfolio-experience{min-height:100svh;position:relative;overflow-x:hidden}.grain-layer{opacity:.6;pointer-events:none;z-index:1;background-image:repeating-linear-gradient(0deg,#ffffff05 0 1px,#0000 1px 4px);position:fixed;inset:0}.site-nav,.brand-mark,.page-tabs,.page-tabs button,.nav-actions,.language-toggle,.nav-icon,.page-controls,.page-controls button,.meta-strip,.eyebrow,.see-more,.ghost-link,.control-strip,.search-box,.icon-action,.deployment-link,.project-notice,.poster-meta,.poster-footer,.metrics,.project-links,.contact-dock,.contact-button,.tech-cloud{align-items:center;display:flex}.site-nav{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);color:var(--paper);z-index:20;background:linear-gradient(135deg,#171717f7,#232323f5 62%,#e84886e6);border:1px solid #ffffff29;border-radius:0 0 8px 8px;justify-content:space-between;gap:22px;width:calc(100% - 80px);max-width:1180px;height:58px;padding:0 10px 0 18px;position:fixed;top:20px;left:50%;transform:translate(-50%);box-shadow:0 18px 60px #00000038}.brand-mark{background:var(--pink);color:var(--ink);text-transform:uppercase;border:0;border-radius:5px;flex:none;justify-content:center;height:34px;padding:0 14px;font-weight:900}.page-tabs{flex:1;justify-content:center;gap:4px}.page-tabs button{color:var(--paper);text-transform:uppercase;background:0 0;border:1px solid #0000;border-radius:999px;justify-content:center;height:34px;padding:0 14px;font-size:12px;font-weight:900}.page-tabs button:hover,.page-tabs button.is-active{color:var(--white);background:#ff72a62e;border-color:#ff72a661}.page-tabs button.is-active{background:var(--pink);color:var(--ink)}.nav-icon,.language-toggle,.page-controls button,.icon-action{color:var(--paper);background:#ff72a624;border:1px solid #ff72a657;border-radius:6px;justify-content:center;min-width:36px;height:36px}.nav-icon:hover,.language-toggle:hover,.page-controls button:hover:not(:disabled),.icon-action:hover{background:var(--pink);color:var(--ink);transform:translateY(-1px)}.nav-actions{flex:none;gap:8px}.language-toggle{text-transform:uppercase;gap:7px;padding:0 11px;font-size:12px;font-weight:900}.page-index{color:#ffffff8f;writing-mode:vertical-rl;z-index:10;align-items:center;gap:10px;font-size:13px;font-weight:900;display:flex;position:fixed;top:112px;right:28px}.page-index i{background:#ffffff59;width:1px;height:42px;display:block}.page-stage{z-index:2;min-height:100svh;padding:96px 40px 36px;position:relative}.page-panel{transform-origin:50%;width:100%;min-width:0;max-width:1180px;margin:0 auto}.page-panel.forward{animation:.62s cubic-bezier(.2,.8,.2,1) both pageInForward}.page-panel.backward{animation:.62s cubic-bezier(.2,.8,.2,1) both pageInBackward}.page-controls{z-index:18;gap:8px;position:fixed;bottom:26px;right:32px}.page-controls button{padding:0}.cover-page{grid-template-columns:minmax(0,1fr) 286px;gap:20px;min-width:0;display:grid}.cover-board,.cover-sidebar,.work-board,.paper-sheet{border:1px solid var(--line);box-shadow:var(--shadow);border-radius:8px}.cover-board{background:var(--charcoal);max-width:100%;min-height:610px;padding:22px;position:relative;overflow:hidden}.cover-board:before{content:"";pointer-events:none;background:linear-gradient(90deg,#ff72a614,#0000 28%),linear-gradient(#ffffff14,#0000 34%);position:absolute;inset:0}.meta-strip{color:currentColor;text-transform:uppercase;z-index:2;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;font-size:11px;line-height:1.25;display:grid;position:relative}.meta-strip span{gap:3px;min-width:0;display:grid}.meta-strip strong{font-size:10px;font-weight:900}.cover-title{z-index:2;min-height:108px;margin:14px 0 8px;position:relative}.cover-title h1{color:var(--white);font-family:var(--display);overflow-wrap:anywhere;text-transform:uppercase;margin:0;font-size:108px;font-weight:400;line-height:.82}.cover-title span{color:var(--pink);font-family:Brush Script MT,Segoe Script,cursive;font-size:58px;font-weight:700;line-height:1;position:absolute;top:48px;left:42%;transform:rotate(-8deg)}.cover-composition{z-index:2;grid-template-columns:minmax(0,1.2fr) minmax(240px,.8fr);gap:18px;min-width:0;display:grid;position:relative}.hero-art{width:100%;min-width:0;min-height:320px;position:relative;overflow:hidden}.hero-art img,.cover-sidebar>img,.wide-image img,.thanks-card img,.poster-visual img{object-fit:cover;width:100%;height:100%;display:block}.hero-art>img{border:1px solid var(--line);filter:saturate(1.08)contrast(1.04);border-radius:8px;min-height:320px}.avatar-badge{border:1px solid var(--line);color:var(--white);background:#111111d1;border-radius:8px;align-items:center;gap:10px;padding:10px 12px;display:flex;position:absolute;bottom:16px;left:16px}.avatar-badge img{border:2px solid var(--pink);object-fit:cover;border-radius:50%;width:38px;height:38px}.avatar-badge span{font-size:12px;font-weight:900}.about-block{border:1px solid var(--line);background:#ffffff0f;border-radius:8px;flex-direction:column;justify-content:center;align-self:stretch;gap:18px;min-width:0;padding:22px;display:flex}.block-label,.paper-kicker{text-transform:uppercase;font-size:11px;font-weight:900;display:block}.about-block p{color:#ffffffc7;margin:0;font-size:15px;line-height:1.7}.swatch-row{grid-template-columns:repeat(5,28px);gap:7px;display:grid}.swatch-row i{border:1px solid #ffffff3d;border-radius:5px;height:28px;display:block}.swatch-row .pink{background:var(--pink)}.swatch-row .rose{background:var(--rose)}.swatch-row .paper{background:var(--paper)}.swatch-row .ink{background:var(--ink)}.swatch-row .acid{background:var(--acid)}.see-more,.ghost-link,.contact-button{color:inherit;text-transform:uppercase;background:0 0;border:1px solid;border-radius:999px;justify-content:center;gap:9px;min-height:42px;padding:0 16px;font-weight:900;text-decoration:none}.see-more:hover,.ghost-link:hover{background:var(--pink);border-color:var(--pink);color:var(--ink)}.contact-button{--contact-accent:var(--pink);--contact-text:var(--ink)}.contact-button:hover{background:var(--contact-accent);border-color:var(--contact-accent);color:var(--contact-text);transform:translateY(-2px)}.contact-projects{--contact-accent:var(--acid)}.contact-github{--contact-accent:var(--paper)}.contact-linkedin{--contact-accent:#0a66c2;--contact-text:var(--white)}.contact-website{--contact-accent:var(--cyan)}.contact-email{--contact-accent:var(--pink)}.contact-phone{--contact-accent:#7dd3fc}.linkedin-mark{text-transform:none;border:1px solid;border-radius:4px;justify-content:center;align-items:center;width:19px;height:19px;font-size:12px;font-weight:900;line-height:1;display:inline-flex}.marquee{border:1px solid var(--line);color:var(--white);z-index:2;border-radius:999px;margin:20px 0;padding:9px 0;position:relative;overflow:hidden}.marquee div{gap:24px;width:max-content;animation:18s linear infinite marquee;display:flex}.marquee span{white-space:nowrap;align-items:center;gap:18px;font-size:12px;font-weight:900;display:inline-flex}.marquee i{background:var(--pink);border-radius:50%;width:10px;height:10px;display:block;box-shadow:0 0 0 4px #ff72a62e}.cover-stats{z-index:2;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;display:grid;position:relative}.stat-tile{border:1px solid var(--line);color:var(--white);border-radius:8px;gap:8px;min-height:88px;padding:13px;display:grid}.stat-tile svg{color:var(--pink)}.stat-tile span{color:#ffffff9e;text-transform:uppercase;font-size:12px;font-weight:800}.stat-tile strong{overflow-wrap:anywhere;font-size:24px;line-height:1}.cover-sidebar{background:var(--panel);grid-template-rows:210px auto auto;gap:16px;padding:14px;display:grid}.cover-sidebar>img{border-radius:8px}.side-note{border:1px solid var(--line);color:#ffffffbd;border-radius:8px;gap:10px;padding:14px;display:grid}.side-note svg{color:var(--pink)}.side-note p{text-transform:uppercase;margin:0;font-size:12px;line-height:1.55}.ghost-link{color:var(--white);align-self:end}.work-page{grid-template-columns:56px minmax(0,1fr);gap:18px;min-width:0;display:grid}.vertical-rail{background:var(--charcoal);border:1px solid var(--line);color:var(--white);border-radius:8px;justify-content:center;align-items:center;min-height:660px;display:flex}.vertical-rail span{font-family:var(--display);text-transform:uppercase;white-space:nowrap;font-size:30px;line-height:.9;transform:rotate(-90deg)}.work-board{background:var(--charcoal);min-width:0;min-height:660px;padding:24px}.work-heading{justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:18px;display:flex}.eyebrow{color:var(--pink);text-transform:uppercase;gap:8px;margin-bottom:10px;font-size:12px;font-weight:900}.work-heading h2{color:var(--white);font-family:var(--display);margin:0;font-size:64px;font-weight:400;line-height:.9}.control-strip{gap:12px;margin-bottom:18px}.search-box,.select-box select{border:1px solid var(--line);color:var(--white);background:#ffffff14;border-radius:8px;min-height:44px}.search-box{flex:1;gap:10px;padding:0 12px}.search-box input,.select-box select{color:var(--white);background:0 0;border:0;outline:0;width:100%}.search-box input::placeholder{color:#ffffff8f}.select-box{min-width:190px}.select-box select{appearance:none;padding:0 12px}.select-box option{background:var(--ink)}.work-content{grid-template-columns:minmax(0,1fr) 310px;gap:14px;display:grid}.poster-grid{grid-template-columns:repeat(auto-fit,minmax(260px,340px));place-content:start;gap:14px;display:grid}.project-poster{background:var(--paper);border:1px solid var(--line-dark);color:var(--ink);border-radius:8px;flex-direction:column;min-height:410px;display:flex;overflow:hidden}.work-summary{border:1px solid var(--line);color:var(--white);background:#ffffff0f;border-radius:8px;flex-direction:column;gap:16px;min-height:410px;padding:14px;display:flex}.summary-image{aspect-ratio:1.35;border-radius:8px;overflow:hidden}.summary-image img{object-fit:cover;width:100%;height:100%;display:block}.summary-copy h3{font-family:var(--display);margin:10px 0 8px;font-size:38px;font-weight:400;line-height:.9}.summary-copy p{color:#ffffffb8;text-transform:uppercase;margin:0;font-size:13px;line-height:1.6}.summary-list{border-top:1px solid var(--line);gap:0;margin-top:auto;display:grid}.summary-list span{border-bottom:1px solid var(--line);grid-template-columns:90px minmax(0,1fr);align-items:center;gap:6px;padding:10px 0;display:grid}.summary-list span,.summary-list strong{overflow-wrap:anywhere;text-transform:uppercase;font-size:12px;font-weight:900}.poster-visual{aspect-ratio:1.34;background:var(--panel);position:relative;overflow:hidden}.poster-visual img{filter:saturate(1.16)contrast(1.06)}.poster-visual:after{content:"";mix-blend-mode:color;opacity:.18;pointer-events:none;position:absolute;inset:0}.poster-visual.tone-0:after{background:var(--pink)}.poster-visual.tone-1:after{background:var(--cyan)}.poster-visual.tone-2:after{background:var(--acid);opacity:.25}.poster-visual.tone-3:after{opacity:.1;background:#fff}.poster-visual span{background:var(--paper);z-index:2;border-radius:0 0 0 8px;padding:2px 12px;font-size:32px;font-weight:900;position:absolute;top:0;right:0}.poster-copy{flex-direction:column;flex:1;padding:16px;display:flex}.poster-meta{color:var(--muted-dark);text-transform:uppercase;justify-content:space-between;font-size:11px;font-weight:900}.poster-copy h3{overflow-wrap:anywhere;text-transform:uppercase;margin:16px 0 10px;font-size:24px;line-height:1.05}.poster-copy p{color:var(--muted-dark);margin:0 0 14px;font-size:14px;line-height:1.55}.deployment-link{border:1px solid var(--line-dark);color:var(--ink);text-transform:uppercase;border-radius:999px;align-self:flex-start;gap:6px;min-height:30px;margin-bottom:14px;padding:0 10px;font-size:11px;font-weight:900;text-decoration:none}.deployment-link:hover{background:var(--ink);color:var(--paper)}.project-notice{border:1px solid var(--line-dark);color:var(--ink);text-transform:uppercase;background:#11111114;border-radius:999px;align-self:flex-start;gap:6px;min-height:30px;margin:0 0 10px;padding:0 10px;font-size:11px;font-weight:900}.project-notice.demo{background:var(--acid)}.topic-list{flex-wrap:wrap;gap:7px;margin-top:auto;display:flex}.topic-list span{background:var(--ink);color:var(--paper);text-transform:uppercase;border-radius:999px;padding:5px 8px;font-size:11px;font-weight:900}.poster-footer{border-top:1px solid var(--line-dark);justify-content:space-between;gap:12px;margin-top:16px;padding-top:12px}.metrics,.project-links{gap:8px}.project-links .icon-action{background:var(--ink);border-color:var(--line-dark);color:var(--white)}.project-links .icon-action:hover{background:var(--pink);color:var(--ink)}.metrics span{align-items:center;gap:4px;display:inline-flex}.state-panel{border:1px solid var(--line);color:#ffffffc2;border-radius:8px;justify-content:center;align-items:center;gap:10px;min-height:180px;display:flex}.state-panel.error{color:var(--pink);border-color:#ff72a680}.studio-page{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;padding:18px 24px 24px;display:grid}.paper-sheet{background:linear-gradient(145deg, transparent 0 42%, #0000000e 42.2%, transparent 43%), linear-gradient(38deg, transparent 0 58%, #0000000b 58.2%, transparent 59%), var(--paper);color:var(--ink);min-height:680px;padding:24px;position:relative;overflow:hidden}.paper-sheet:before{content:"";opacity:.55;pointer-events:none;background:repeating-linear-gradient(90deg,#00000005 0 1px,#0000 1px 5px);position:absolute;inset:0}.paper-sheet>*{z-index:2;position:relative}.typography-sheet .paper-kicker{margin-top:58px}.typography-sheet h2,.system-sheet h2{font-family:var(--display);margin:16px 0 0;font-size:58px;font-weight:400;line-height:.9}.sheet-number{margin-top:74px;font-size:48px;line-height:1;display:block}.font-sample{overflow-wrap:anywhere;text-transform:uppercase;justify-items:start;gap:4px;max-width:230px;margin:6px 0 0 auto;font-weight:900;display:grid}.workflow-list{gap:10px;max-width:310px}.workflow-list span{border-bottom:1px solid var(--line-dark);padding-bottom:8px}.profile-cut{gap:16px;width:176px;display:grid;position:absolute;bottom:28px;left:24px}.profile-cut img{aspect-ratio:1;object-fit:cover;border-radius:8px;width:100%}.profile-cut p{text-transform:uppercase;margin:0;font-size:12px;font-weight:900}.system-sheet .sheet-number{margin-top:26px;margin-left:58%}.wide-image{border-radius:8px;height:150px;margin:28px 0 22px;overflow:hidden}.stack-grid{grid-template-columns:1fr 1fr;align-items:end;gap:26px;display:grid}.stack-list{gap:8px;display:grid}.stack-list.compact{gap:6px}.stack-list span{border-bottom:1px solid var(--line-dark);justify-content:space-between;align-items:center;padding-bottom:8px;font-size:15px;font-weight:800;display:flex}.stack-list.compact span{padding-bottom:6px;font-size:12px}.tech-cloud{flex-wrap:wrap;align-content:start;gap:7px;margin-top:18px}.tech-cloud span{background:var(--ink);border:1px solid var(--line-dark);color:var(--paper);text-transform:uppercase;border-radius:999px;padding:7px 9px;font-size:10px;font-weight:900;line-height:1}.contact-page{place-items:center;min-height:calc(100svh - 170px);padding-top:48px;display:grid}.thanks-card{text-align:center;justify-items:center;display:grid}.thanks-card img{aspect-ratio:1;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:8px;max-width:330px;margin-bottom:26px}.thanks-card h2{color:var(--white);margin:0;font-size:34px;line-height:1}.thanks-card p{color:#ffffff9e;text-transform:uppercase;margin:12px 0 0;font-size:14px;font-weight:900}.contact-dock{flex-wrap:wrap;justify-content:center;gap:10px;margin-top:28px}.contact-button{color:var(--white);min-width:126px}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.spin{animation:1s linear infinite spin}@keyframes pageInForward{0%{opacity:0;transform:translate(58px)rotate(-1deg)scale(.985)}to{opacity:1;transform:translate(0)rotate(0)scale(1)}}@keyframes pageInBackward{0%{opacity:0;transform:translate(-58px)rotate(1deg)scale(.985)}to{opacity:1;transform:translate(0)rotate(0)scale(1)}}@keyframes marquee{0%{transform:translate(0)}to{transform:translate(-50%)}}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@media (width<=1040px){.site-nav{width:calc(100% - 36px)}.cover-page,.cover-composition,.studio-page{grid-template-columns:1fr}.cover-sidebar{grid-template-rows:auto;grid-template-columns:220px 1fr auto}.poster-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.cover-title h1{font-size:86px}.cover-title span{font-size:54px;left:38%}}@media (width<=760px){.site-nav{flex-wrap:wrap;align-items:center;gap:8px;width:calc(100% - 24px);height:auto;padding:9px;top:10px}.brand-mark{text-overflow:ellipsis;white-space:nowrap;flex:auto;max-width:140px;padding:0 10px;font-size:13px;overflow:hidden}.page-tabs{flex:0 0 100%;order:3;grid-template-columns:repeat(4,minmax(0,1fr));justify-content:stretch;gap:6px;display:grid;overflow:visible}.nav-actions{gap:6px;margin-left:auto}.language-toggle{min-width:54px;height:32px;padding:0 8px}.page-tabs button{white-space:nowrap;min-width:0;height:34px;padding:0 5px;font-size:10px;display:flex}.page-tabs button.is-active{display:flex}.nav-icon{display:none}.page-stage{padding:132px 14px 70px}.page-index{display:none}.cover-board,.work-board,.paper-sheet{padding:16px}.cover-board{width:100%;max-width:calc(100vw - 28px)}.cover-composition{max-width:100%;overflow:hidden}.meta-strip,.cover-stats,.work-content,.poster-grid,.stack-grid{grid-template-columns:1fr}.cover-title{min-height:98px}.cover-title h1{font-size:52px}.cover-title span{font-size:36px;top:48px;left:28%}.hero-art,.hero-art>img{min-height:260px}.hero-art{width:calc(100vw - 62px);max-width:calc(100vw - 62px)}.cover-sidebar{grid-template-columns:1fr}.cover-sidebar>img{max-height:240px}.work-page{grid-template-columns:1fr}.vertical-rail{min-height:52px}.vertical-rail span{font-size:22px;transform:none}.work-heading{align-items:flex-start}.work-heading h2{font-size:44px}.control-strip{flex-direction:column;align-items:stretch}.select-box{min-width:0}.paper-sheet{min-height:auto;overflow:visible}.typography-sheet h2,.system-sheet h2{font-size:44px}.typography-sheet .paper-kicker{margin-top:36px}.sheet-number,.system-sheet .sheet-number{margin-top:26px;margin-left:0}.font-sample{margin-left:0}.profile-cut{width:144px;margin-top:24px;position:static}.wide-image{height:128px;margin:20px 0 18px}.stack-grid{align-items:start;gap:16px}.stack-list span{gap:10px;min-width:0}.stack-list span strong{flex:none}.tech-cloud{gap:6px}.tech-cloud span{padding:7px 8px;font-size:9px}.project-poster{min-height:auto}.poster-visual{aspect-ratio:16/10}.project-pfa2025 .poster-visual{background:#101217}.project-pfa2025 .poster-visual img{object-fit:contain;padding:7px}.poster-copy{padding:14px}.poster-meta,.poster-footer{flex-wrap:wrap;align-items:flex-start}.poster-copy h3{font-size:21px}.poster-copy p{font-size:13px}.thanks-card img{max-width:260px}.page-controls{display:none}}
