/* Carta, revision 03. Three text roles: introduction 22, reading 15, detail 13. */
:root[data-letter]{
  --letter-intro:22px;
  --letter-reading:15px;
  --letter-detail:13px;
  --letter-width:584px;
  --ns-canvas:#F7F7F8;
  --ns-ink:#29292D;
  --ns-text-secondary:#6A6A70;
  --ns-line:#E5E5E8;
}
:root[data-letter][data-theme=dark]{--ns-canvas:#151617;--ns-ink:#E8E8E8;--ns-text-secondary:#A4A5AA;--ns-line:#2D2E31}
body.letter{font-size:var(--letter-reading);line-height:1.65;letter-spacing:-.12px}
.letter-page{width:min(var(--letter-width),calc(100% - 48px));margin-inline:auto;position:relative;padding-top:154px}
.letter-page::before,.letter-page::after{content:"";position:absolute;top:0;bottom:0;width:1px;background:var(--ns-line);opacity:.65;pointer-events:none}
.letter-page::before{left:-27px}.letter-page::after{right:-27px}
.letter :where(h1,h2,h3){font-weight:400;text-wrap:initial;letter-spacing:inherit}
.letter .icon{width:15px;height:15px;stroke-width:1.4}
.letter-identity{display:flex;align-items:center;gap:16px;position:relative}
.letter-identity>div>p{font-size:var(--letter-reading);line-height:1.5}
.letter-identity>div>span{display:block;font-size:var(--letter-detail);line-height:1.55;color:var(--ns-text-secondary);margin-top:2px}
.letter-photo-link{display:block;flex-shrink:0;width:48px;height:56px;transform:rotate(-5deg);transition:transform 320ms var(--ns-ease);padding:3px;background:#FDFDFD;border-radius:5px;box-shadow:0 1px 2px #00000014,0 5px 10px #00000012}
.letter-photo-link img{width:100%;height:100%;border-radius:3px;object-fit:cover;object-position:center}
.letter-photo-link:hover,.letter-photo-link:focus-visible{transform:rotate(0) translateY(-2px)}
.letter-monogram{width:31px;height:31px;margin-left:auto;color:var(--ns-text-secondary);opacity:.8}
.letter-intro h1{font-size:var(--letter-intro);line-height:1.5;letter-spacing:-.48px;margin-top:43px;text-wrap:pretty}
.letter-intro-note{font-size:var(--letter-reading);line-height:1.7;color:var(--ns-text-secondary);margin-top:26px;max-width:550px;text-wrap:pretty}
.letter-gesture{height:110px;margin:30px -2px 43px;pointer-events:none}
.letter-gesture svg{display:block;width:100%;height:100%;overflow:visible}
[data-theme=dark] .letter-gesture{opacity:.85}
.letter-section{margin-bottom:88px;scroll-margin-top:44px}
.letter-section>h2{font-size:var(--letter-detail);line-height:1.6;color:var(--ns-text-secondary);margin-bottom:26px}
.letter-work{margin-bottom:86px}
.letter-projects{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:29px}
.letter-project-link{display:block;border-radius:7px}
.letter-folder{height:167px;position:relative;perspective:750px;isolation:isolate}
.letter-folder-back{position:absolute;inset:38px 0 0;background:linear-gradient(135deg,#D9D9DE,#C7C8CD);border-radius:7px 7px 8px 8px;box-shadow:inset 0 1px 1px #FFFFFFA0,0 1px 2px #00000020}
.letter-folder-back::before{content:"";position:absolute;left:0;top:-11px;width:67px;height:22px;border-radius:7px 9px 0 0;background:#D9D9DE;z-index:-1}
.letter-paper,.letter-photo{position:absolute;left:10px;right:10px;top:22px;height:101px;border-radius:4px;transform-origin:50% 100%;transition:transform 500ms var(--ns-ease);overflow:hidden}
.letter-paper{background:#FDFDFD;box-shadow:0 0 1px #00000055,0 2px 4px #00000013;transform:rotate(-8deg) translateY(-7px);padding:15px}
.letter-paper span{display:block;width:75%;height:2px;background:#D4D4D9;margin-top:7px}.letter-paper span:first-child{width:25%;height:4px;background:#A6A6AE}.letter-paper span:last-child{width:55%}
.letter-photo{background:white;padding:3px;transform:rotate(5deg);box-shadow:0 0 1px #00000066,0 3px 5px #00000012}
.letter-photo img{width:100%;height:100%;object-fit:cover;border-radius:2px}
.letter-project:last-child .letter-photo img{object-position:top left}
.letter-folder-front{position:absolute;inset:57px 0 0;padding:17px 15px 14px;border-radius:6px 6px 8px 8px;background:linear-gradient(157deg,#EEEFF1 0%,#E6E6E9 45%,#DADBE0 100%);box-shadow:inset 0 1px 1px #FFFFFFEE,inset 0 -1px 1px #00000016,0 4px 5px #00000012;transform-origin:50% 100%;transition:transform 500ms var(--ns-ease);display:flex;flex-direction:column;justify-content:space-between;color:#51515A;z-index:3}
.letter-folder-front::after{content:"";position:absolute;bottom:7px;left:0;right:0;height:1px;background:#FFFFFF60;box-shadow:0 2px #00000005}
.letter-folder-front>span:last-child{font-size:var(--letter-detail);line-height:1.5;position:relative;z-index:1}
.letter-folder-mark>img,.letter-folder-mark>.icon{width:23px;height:23px;object-fit:contain}.letter-folder-mark>img{filter:brightness(0);opacity:.6}
.letter-project-copy{padding:18px 0 0}
.letter-project-copy h3{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.letter-project-copy p{font-size:var(--letter-reading);line-height:1.6;text-wrap:pretty}
.letter-project-status{font-size:var(--letter-detail);color:var(--ns-text-secondary);display:block;margin-top:8px}
.letter-footnote{font-size:var(--letter-detail);color:var(--ns-text-secondary);margin-top:26px;line-height:1.6}
[data-theme=dark] .letter-folder-back{background:linear-gradient(135deg,#54565C,#393B41);box-shadow:inset 0 1px 1px #FFFFFF20,0 1px 2px #00000040}
[data-theme=dark] .letter-folder-back::before{background:#54565C}
[data-theme=dark] .letter-folder-front{background:linear-gradient(157deg,#3E4046,#303238 70%,#2B2D33);color:#DCDDDF;box-shadow:inset 0 1px 1px #FFFFFF22,inset 0 -1px 1px #00000055,0 4px 5px #00000030}
[data-theme=dark] .letter-folder-front::after{background:#FFFFFF10}
[data-theme=dark] .letter-folder-mark>img{filter:brightness(0) invert(1);opacity:.8}
.letter-project-link:focus-visible .letter-folder-front{transform:rotateX(-18deg)}
.letter-project-link:focus-visible .letter-photo{transform:translateY(-23px) rotate(7deg)}
.letter-project-link:focus-visible .letter-paper{transform:translateY(-25px) rotate(-11deg)}
.letter-section-note{font-size:var(--letter-reading);color:var(--ns-text-secondary);line-height:1.7;margin-bottom:28px;text-wrap:pretty}
.letter-services>a{display:grid;grid-template-columns:160px 1fr 15px;gap:20px;align-items:start;padding:22px 0;border-top:1px solid var(--ns-line)}
.letter-services>a:last-child{border-bottom:1px solid var(--ns-line)}
.letter-services h3,.letter-services p{font-size:var(--letter-reading);line-height:1.65}
.letter-services p{color:var(--ns-text-secondary);text-wrap:pretty}.letter-services .icon{margin-top:5px;color:var(--ns-text-secondary)}
.letter-services a:hover .icon,.letter-resource:hover>.icon,.letter-email:hover .icon{transform:translate(2px,-2px);color:var(--ns-ink)}
.letter-services a:hover h3{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.letter-resource{display:flex;gap:25px;align-items:center;padding:16px 0;min-height:133px}
.letter-resource+.letter-resource{margin-top:12px}
.letter-resource>div{flex:1}.letter-resource h3,.letter-resource p{font-size:var(--letter-reading);line-height:1.6}.letter-resource p{color:var(--ns-text-secondary);margin-top:4px;text-wrap:pretty}
.letter-resource>div>span{display:block;font-size:var(--letter-detail);color:var(--ns-text-secondary);margin-top:9px}
.letter-resource>.icon{color:var(--ns-text-secondary)}
.letter-resource-object{display:grid;place-items:center;width:88px;flex-shrink:0;height:102px;perspective:450px}
.letter-book{display:flex;flex-direction:column;justify-content:space-between;width:74px;height:96px;background:linear-gradient(90deg,#282B2A,#424541 7%,#242725 12%,#30332F 18%,#30332F);color:#E8E8DF;padding:14px 9px 10px 13px;border-radius:2px 5px 5px 2px;box-shadow:inset -1px 0 1px #FFFFFF22,2px 3px 2px #00000010,5px 7px 10px #00000016;transform:rotate(-6deg);transition:transform 400ms var(--ns-ease);position:relative}
.letter-book::after{content:"";position:absolute;left:5px;right:2px;bottom:-2px;height:3px;background:#D8D7CE;border-radius:0 0 2px 1px;box-shadow:0 1px 1px #00000022}
.letter-book>span{font-size:var(--letter-detail);line-height:1.13;letter-spacing:-.5px}.letter-book svg{width:18px;height:18px;opacity:.7;align-self:flex-end}
.letter-calculator{width:65px;height:91px;padding:8px;background:linear-gradient(135deg,#ECEAE4,#D9D7D0);border-radius:8px;box-shadow:inset 0 1px 1px #FFFFFFDD,inset 0 -2px 1px #BEBDB7,2px 6px 9px #00000016;transform:rotate(6deg);transition:transform 400ms var(--ns-ease)}
.letter-calculator-screen{display:block;font-size:var(--letter-detail);background:#CFD3C3;color:#4D5647;border-radius:3px;height:22px;text-align:right;padding:0 5px;line-height:22px;box-shadow:inset 0 1px 2px #00000018}
.letter-calculator-keys{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-top:7px}
.letter-calculator-keys>i{font-size:var(--letter-detail);font-style:normal;text-align:center;line-height:19px;height:19px;border-radius:3px;background:#F8F7F4;color:#696A65;box-shadow:0 1px 1px #00000020}
.letter-calculator-keys>i:last-child{background:#A9B9A8;color:#354C36}
.letter-resource:hover .letter-book{transform:rotate(-2deg) translateY(-3px)}
.letter-resource:hover .letter-calculator{transform:rotate(2deg) translateY(-3px)}
.letter-about p{font-size:var(--letter-reading);line-height:1.8;text-wrap:pretty}.letter-about p+p{margin-top:20px;color:var(--ns-text-secondary)}
.letter-signature{display:flex;align-items:center;gap:10px;margin-top:27px}.letter-signature svg{width:29px;height:29px}.letter-signature span{font-size:var(--letter-detail);color:var(--ns-text-secondary)}
.letter-footer{border-top:1px solid var(--ns-line);padding-top:44px}
.letter-footer>h2{font-size:var(--letter-intro);line-height:1.5;letter-spacing:-.48px;margin-bottom:15px}
.letter-footer>p{font-size:var(--letter-reading);color:var(--ns-text-secondary)}
.letter-email{font-size:var(--letter-reading);display:inline-flex;align-items:center;gap:12px;min-height:40px;text-decoration:underline;text-decoration-color:var(--ns-line-strong);text-underline-offset:5px;text-decoration-thickness:1px}
.letter-email:hover{text-decoration-color:var(--ns-ink)}
.letter-footer-bottom{margin-top:65px;padding:22px 0 30px;display:flex;justify-content:space-between;align-items:center;gap:12px;color:var(--ns-text-secondary);font-size:var(--letter-detail)}
.letter-footer .theme-panel{top:auto;bottom:calc(100% + 8px);right:0}
.letter-footer .theme-toggle{padding-right:0;min-height:44px}
.letter-margin-contact{position:fixed;left:max(32px,calc(50% - 560px));bottom:36px;display:flex;flex-direction:column;gap:8px;font-size:var(--letter-detail);color:var(--ns-text-secondary)}
.letter-margin-contact>span{font-size:var(--letter-detail);max-width:160px;line-height:1.6}
.letter-margin-contact>a{display:flex;gap:9px;align-items:center;min-height:32px;text-decoration:underline;text-decoration-color:var(--ns-line);text-underline-offset:6px;text-decoration-thickness:1px}
.letter-margin-contact a:hover{color:var(--ns-ink)}.letter-margin-contact .icon{width:13px;height:13px}
@media(hover:hover){.letter-project-link:hover .letter-folder-front{transform:rotateX(-18deg)}.letter-project-link:hover .letter-photo{transform:translateY(-23px) rotate(7deg)}.letter-project-link:hover .letter-paper{transform:translateY(-25px) rotate(-11deg)}}
@media(prefers-reduced-motion:no-preference){.letter-identity{animation:letter-arrive 650ms ease-out both}.letter-intro h1{animation:letter-arrive 700ms 60ms ease-out both}@keyframes letter-arrive{from{opacity:.6;transform:translateY(4px)}to{opacity:1;transform:none}}}
@media(max-width:1200px){.letter-margin-contact{display:none}}
@media(max-width:700px){.letter-page{padding-top:72px}.letter-page::before,.letter-page::after{display:none}.letter-projects{gap:22px}.letter-services>a{grid-template-columns:140px 1fr 15px;gap:15px}}
@media(max-width:520px){
 .letter-page{padding-top:52px;width:calc(100% - 48px)}
 .letter-identity{gap:14px}.letter-photo-link{width:44px;height:52px}.letter-monogram{display:none}.letter-identity>div>span{max-width:230px}
 .letter-intro h1{margin-top:35px;letter-spacing:-.4px;line-height:1.48}
 .letter-intro-note{margin-top:23px;line-height:1.75}
 .letter-gesture{height:83px;margin:23px 0 32px}
 .letter-section{margin-bottom:68px}.letter-section>h2{margin-bottom:23px}
 .letter-projects{display:flex;flex-direction:column;gap:23px}
 .letter-project-link{display:grid;grid-template-columns:138px minmax(0,1fr);align-items:center;gap:25px}
 .letter-folder{height:151px}.letter-folder-front{inset:53px 0 0;padding:14px 12px}.letter-folder-back{inset:36px 0 0}.letter-folder-back::before{width:58px}.letter-paper,.letter-photo{left:8px;right:8px;height:86px;top:24px}
 .letter-folder-mark>img,.letter-folder-mark>.icon{width:21px;height:21px}.letter-project-copy{padding:18px 0 0}.letter-project-copy p{line-height:1.6}.letter-project-status{margin-top:7px}.letter-footnote{margin-top:25px}
 .letter-services>a{grid-template-columns:1fr 15px;gap:6px 18px;padding:20px 0}.letter-services h3{grid-column:1}.letter-services p{grid-column:1}.letter-services .icon{grid-column:2;grid-row:1}
 .letter-resource{gap:17px;padding:11px 0}.letter-resource-object{width:70px}.letter-book{width:68px}.letter-resource>.icon{width:13px;height:13px}.letter-resource>div>span{margin-top:7px}.letter-resource+.letter-resource{margin-top:16px}
 .letter-footer{padding-top:34px}.letter-footer-bottom{margin-top:48px;padding-bottom:24px}.letter-footer .theme-toggle>[data-theme-name],.letter-footer .theme-toggle>.icon:last-child{display:inline-block}.letter-footer .theme-toggle{padding-left:6px;gap:7px}.letter-footer .theme-panel{right:0;width:220px}
}
@media(max-width:360px){.letter-project-link{grid-template-columns:124px 1fr;gap:18px}.letter-identity>div>span{max-width:190px}.letter-resource{gap:14px}}

/* Restored shared navigation. The contact in the lower margin stays in place. */
.letter-header{height:88px;width:min(1100px,calc(100% - 80px));z-index:40}
.letter-header .brand>svg{height:21.6px;width:auto;max-width:none}
.letter-header .header-actions{gap:15px}.letter-header .theme-panel{right:0}
.site-navigation{position:fixed;top:157px;left:max(32px,calc(50% - 550px));width:166px;color:var(--ns-text-secondary);font-size:13px;line-height:1.65}
.site-navigation nav{display:flex;flex-direction:column;gap:7px}
.site-navigation a{min-height:33px;display:flex;align-items:center;position:relative;transition:color 160ms ease}
.site-navigation a::before{content:"";position:absolute;left:-12px;top:15px;width:4px;height:4px;background:currentColor;border-radius:50%;opacity:0}
.site-navigation a[aria-current]{color:var(--ns-ink)}.site-navigation a[aria-current]::before{opacity:1}.site-navigation a:hover{color:var(--ns-ink)}
.site-menu-toggle{display:none;align-items:center;gap:9px;background:transparent;font-size:13px;min-height:44px;padding:0 0 0 7px}.site-menu-toggle .icon{width:16px;height:16px}.site-menu-toggle[aria-expanded=true] .icon{transform:rotate(45deg)}
.letter-header~.letter-page{padding-top:66px}
.letter-inline-link{display:inline-flex;align-items:center;gap:9px;font-size:var(--letter-detail);min-height:44px;margin-top:16px;text-decoration:underline;text-decoration-color:var(--ns-line-strong);text-underline-offset:5px;text-decoration-thickness:1px}
.letter-inline-link:hover{text-decoration-color:var(--ns-ink)}.letter-inline-link:hover .icon{transform:translate(2px,-2px)}
@media(max-width:1190px){
 .site-menu-toggle{display:inline-flex}
 .site-navigation{display:none;position:absolute;left:auto;right:0;top:calc(100% - 1px);width:240px;padding:14px 21px;background:var(--ns-surface);border:1px solid var(--ns-line);border-radius:8px;box-shadow:var(--ns-shadow-raised)}
 .site-navigation[data-open=true]{display:block}.site-navigation nav{gap:0}.site-navigation a{min-height:44px}.site-navigation a::before{top:20px;left:-10px}
}
@media(max-width:700px){.letter-header{width:calc(100% - 48px);height:76px}.letter-header~.letter-page{padding-top:48px}.letter-header .header-actions{gap:8px}.letter-header .theme-toggle{min-width:40px;justify-content:center;padding:0 7px}.letter-header .theme-toggle [data-theme-name],.letter-header .theme-toggle>.icon:last-child{display:none}}
@media(max-width:360px){.letter-header .header-actions{gap:4px}}

/* The home identity joins the navigation once its introduction has left view. */
.header-identity-slot{display:flex;align-items:center;position:relative;min-height:44px}
.nav-profile{position:fixed;top:88px;left:max(32px,calc(50% - 550px));width:166px;min-height:44px;display:flex;align-items:center;gap:10px;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(4px);transition:opacity 180ms ease,transform 180ms ease,visibility 180ms}
.home.has-nav-profile .nav-profile{opacity:1;visibility:visible;pointer-events:auto;transform:none}
.nav-profile-photo{width:34px;height:40px;flex-shrink:0;padding:2px;background:#FDFDFD;border-radius:4px;box-shadow:0 1px 2px #00000016,0 3px 7px #00000012;transform:rotate(-4deg)}
.nav-profile-photo img{width:100%;height:100%;object-fit:cover;border-radius:2px}
.nav-profile-copy{display:flex;flex-direction:column;gap:1px;min-width:0;white-space:nowrap}
.nav-profile-copy>span:first-child{font-size:var(--letter-reading);line-height:1.5;color:var(--ns-ink)}
.nav-profile-copy>span:last-child{font-size:var(--letter-detail);line-height:1.5;color:var(--ns-text-secondary)}
.nav-profile:hover .nav-profile-copy>span:first-child{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
@media(max-width:1190px){
 .home .letter-header{position:sticky;top:0;background:var(--ns-canvas)}
 .home .letter-header::before{content:"";position:absolute;top:0;bottom:0;left:calc((100vw - 100%)/-2);right:calc((100vw - 100%)/-2);background:var(--ns-canvas);z-index:-1;pointer-events:none}
 .home .header-identity-slot{flex:1;min-width:0;height:44px}
 .home .header-actions{flex-shrink:0}
 .home .site-navigation{max-height:calc(100dvh - 100px);overflow-y:auto}
 .home .nav-profile{position:absolute;inset:0 auto 0 0;width:166px;max-width:100%}
 .home .header-identity-slot>.brand{transition:opacity 180ms ease,visibility 180ms}
 .home.has-nav-profile .header-identity-slot>.brand{opacity:0;visibility:hidden;pointer-events:none}
 .home .letter-section,.home .letter-intro{scroll-margin-top:76px}
}