/* Screen-based revision. The original document remains available without JS. */
body.screen-mode{height:100vh;height:100dvh;min-height:0;display:flex;flex-direction:column;font-size:1.125rem;line-height:1.5}
.screen-mode .scene,.screen-mode.page-about .scene{position:fixed;height:100%;inset:0;z-index:-1}
.screen-mode .scene img,.screen-mode.page-about .scene img{object-position:center 35%;opacity:.65}
.screen-mode.page-about .scene img{object-position:70% 22%;opacity:.83}
.screen-mode .scene:after{background:linear-gradient(90deg,rgba(3,12,25,.6),rgba(3,12,25,.15)),linear-gradient(0deg,rgba(3,12,25,.9),transparent 80%)}
.screen-mode .site-header{width:calc(100% - 64px);max-width:1400px;flex:none;margin:18px auto 0;padding:10px 24px;min-height:62px;gap:24px}
.screen-mode .brand{font-size:1.6875rem}.screen-mode .site-header nav a{font-size:1.0625rem;padding:7px 12px}
.screen-mode main{width:100%;max-width:1440px;align-self:center;flex:1;min-height:0;display:flex;flex-direction:column;padding:0 32px}
.screen-mode .hero,.screen-mode .detail-hero{min-height:0;flex:none;padding:20px 0 16px;display:block;text-align:left}
.screen-mode .hero-content{max-width:none;animation:none}.screen-mode h1,.screen-mode .detail-hero h1{font-size:clamp(2.3rem,1.5rem + 2.8vw,3.65rem);line-height:1.03;letter-spacing:-.015em}
.screen-mode .hero-subtitle,.screen-mode .detail-hero .hero-subtitle{font-size:1.8125rem;line-height:1.15;margin-top:7px}
.screen-mode .hero-description,.screen-mode .detail-hero .hero-description{font-size:1.0625rem;line-height:1.45;max-width:90ch;margin:10px 0 0;text-wrap:pretty}
.screen-mode .back-link{font-size:0.9375rem;margin-bottom:10px}.screen-mode .page-body,.screen-mode .prose{width:100%;max-width:none;margin:0;padding:0;flex:1;min-height:0;display:flex;flex-direction:column}
.screen-mode .screen-tabs{display:flex;gap:7px;align-items:center;flex-wrap:wrap;flex:none;border-bottom:1px solid var(--rule);padding:0 0 10px;margin:0 0 16px}
.screen-mode .screen-tab{font-size:1rem;line-height:1.3;min-height:36px;border:1px solid transparent;background:rgba(7,26,43,.5);color:var(--muted);padding:7px 13px;border-radius:24px}
.screen-mode .screen-tab[aria-selected=true]{color:var(--ink);background:#24485c;border-color:#5d899b}.screen-mode .screen-tab:hover{color:white;border-color:#63899c}
.screen-mode .screen-stage{flex:1;min-height:0;display:flex;flex-direction:column;position:relative}
.screen-mode .screen-panel{min-height:0;flex:1;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding:5px 14px 10px 0;max-width:100%;outline-offset:-3px}
.screen-mode .screen-panel[hidden]{display:none!important}.screen-mode .screen-panel>.section,.screen-mode .screen-panel>.story-section{margin:0;max-width:100%}
.screen-mode .screen-panel h2{font-size:clamp(1.7rem,1.3rem + 1vw,2.3rem);line-height:1.15;max-width:38ch;margin:0 0 16px}
.screen-mode .screen-panel p{font-size:1.1875rem;line-height:1.6;max-width:78ch}.screen-mode .screen-panel p+p{margin-top:15px}
.screen-mode .section-heading{margin:0 0 16px;max-width:100%}.screen-mode .section-heading p{margin-top:10px}
.screen-mode .screen-panel .section-heading h2{font-family:Source,sans-serif;font-size:1.375rem;font-weight:500;margin-bottom:8px}
.screen-mode .index-row{padding:17px 0;gap:24px}.screen-mode .index-row h3{font-size:1.4375rem;margin-bottom:5px}.screen-mode .index-row p{font-size:1.0625rem;line-height:1.4;max-width:80ch}
.screen-mode .row-action{font-size:0.9375rem;gap:4px}.screen-mode .stage{font-size:0.875rem}.screen-mode .story-index{width:100%}
.screen-mode .screen-controls{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid var(--rule);padding:9px 0 3px;margin-top:8px;flex:none}
.screen-mode .screen-count{font-size:0.9375rem;color:var(--muted)}.screen-mode .screen-buttons{display:flex;gap:8px}.screen-mode .screen-step{font-size:0.9375rem;padding:6px 16px;line-height:1.3;min-height:34px;background:#0b2335;color:var(--ink);border:1px solid #587d90;border-radius:22px}.screen-mode .screen-step:disabled{opacity:.35;cursor:default}
.screen-mode .site-footer{width:calc(100% - 64px);max-width:1400px;margin:8px auto 0;padding:10px 0 12px;min-height:40px;flex:none;gap:20px;align-items:center;font-size:0.875rem}.screen-mode .footer-name{font-size:1.125rem}.screen-mode .site-footer>div{display:flex;align-items:center;gap:20px}.screen-mode .site-footer p{font-size:0.875rem;margin:0}.screen-mode .site-footer>div:last-child>p{display:none}
.screen-mode .lesson{margin:8px 0;padding:10px 0 10px 26px;max-width:900px}.screen-mode .lesson span{font-size:1rem}.screen-mode .lesson p{font:400 2.25rem/1.3 Cormorant,Georgia,serif;color:var(--ink);max-width:48ch;margin-top:16px}
.screen-mode .split{display:block;margin:0}.screen-mode .split h2 br{display:none}.screen-mode .split h2 br:after{content:' '}.screen-mode .closing-links{margin:22px 0 8px;gap:20px}.screen-mode .button{font-size:1.0625rem;min-height:42px;padding:10px 22px}.screen-mode .status-line{font-size:0.9375rem;position:absolute;right:0;top:0;margin:0;color:var(--cyan)}
.screen-mode .product-grid{gap:28px;margin-top:16px}.screen-mode .product-link img{width:100%;max-height:27dvh;object-fit:contain;background:#03101d}.screen-mode .product-link div{padding:12px 0 0}.screen-mode .product-link h2{font-family:Source,sans-serif;font-size:1.4375rem;margin:7px 0 0}.screen-mode .product-link p{font-size:1rem;margin:5px 0 0;line-height:1.4}.screen-mode .product-link .reference{font-size:0.875rem;color:var(--cyan)}.screen-mode .image-disclosure{font-size:0.875rem;margin:16px 0 0;max-width:100ch;line-height:1.4}
.screen-mode .product-figure{height:100%;display:flex;flex-direction:column;gap:9px;margin:0}.screen-mode .product-figure>a{flex:1;min-height:0;display:flex;justify-content:center}.screen-mode .product-figure img{width:100%;height:100%;max-height:100%;object-fit:contain;border:0;background:transparent}.screen-mode .product-figure figcaption{font-size:0.875rem;line-height:1.4;max-width:100ch;margin:0;flex:none}
.screen-mode .material-list div{padding:16px 0;gap:30px}.screen-mode .material-list dt,.screen-mode .material-list dd{font-size:1.125rem;line-height:1.5}.screen-mode .source-note{border:0;padding:0;margin:0}.screen-mode .source-note p,.screen-mode .source-note a{font-size:1.0625rem}
.screen-mode .contact-layout{display:block;margin:0}.screen-mode .email-link{font-size:1.6875rem;margin:25px 0 8px}.screen-mode .text-button{font-size:1.0625rem}.screen-mode .feedback{font-size:1rem}.screen-mode #contact-form{max-width:780px;display:grid;grid-template-columns:1fr 1fr;gap:6px 22px;align-content:start}.screen-mode #contact-form label{font-size:1rem;margin-top:0}.screen-mode #contact-form label[for=contact-name]{grid-column:1;grid-row:1}.screen-mode #contact-name{grid-column:1;grid-row:2}.screen-mode #contact-form label[for=contact-email]{grid-column:2;grid-row:1}.screen-mode #contact-email{grid-column:2;grid-row:2}.screen-mode #contact-form label[for=contact-topic],.screen-mode #contact-topic,.screen-mode #contact-form label[for=contact-message],.screen-mode #contact-message,.screen-mode #contact-form .form-note{grid-column:1/-1}.screen-mode input,.screen-mode select,.screen-mode textarea{font-size:1.0625rem;padding:8px 11px;min-height:38px}.screen-mode #contact-form label[for=contact-topic],.screen-mode #contact-form label[for=contact-message]{margin-top:7px}.screen-mode textarea{min-height:85px;height:100px;resize:vertical}.screen-mode form .button{margin-top:7px}.screen-mode .form-note{font-size:0.875rem!important;line-height:1.4!important;margin:5px 0 0!important}
.screen-mode.page-about main{flex-direction:row;gap:65px;align-items:center}.screen-mode.page-about .hero{flex:1;min-width:0;padding:22px 0 32px}.screen-mode.page-about .page-body{flex:.85;min-width:0;max-height:78%;border-left:1px solid #416076;padding-left:35px}
.screen-mode .name-display{font-size:clamp(2.8rem,1.5rem + 3.5vw,4.8rem);margin-bottom:18px;line-height:1.1}.screen-mode.page-about h1{font-size:clamp(3rem,2rem + 3.3vw,5rem);line-height:1.05;text-wrap:initial}.screen-mode.page-about .hero-description{font-size:1.125rem;margin-top:24px}.screen-mode.page-about .hero-note{font-size:1.0625rem;line-height:1.55;margin:20px 0 0;max-width:48ch}.screen-mode.page-about .hero .button{margin-top:24px}.screen-mode.page-about .screen-panel h2{font-size:2.375rem}.screen-mode.page-about .screen-panel p{font-size:1.1875rem}
@media(max-height:800px) and (min-width:801px){.screen-mode .site-header{margin-top:12px;min-height:54px;padding:7px 22px}.screen-mode .hero,.screen-mode .detail-hero{padding:14px 0 12px}.screen-mode .hero-subtitle{font-size:1.5625rem}.screen-mode h1,.screen-mode .detail-hero h1{font-size:2.875rem}.screen-mode .index-row{padding:11px 0}.screen-mode .index-row h3{font-size:1.3125rem}.screen-mode .screen-panel .section-heading p{font-size:1rem}.screen-mode .screen-panel .section-heading{margin-bottom:12px}.screen-mode .site-footer{padding:7px 0 9px}.screen-mode .product-link img{max-height:25dvh}.screen-mode .screen-tabs{margin-bottom:10px;padding-bottom:8px}.screen-mode .screen-panel p{font-size:1.125rem}.screen-mode.page-about h1{font-size:4.25rem}.screen-mode.page-about .name-display{font-size:3.6875rem}}
@media(max-width:1000px){.screen-mode .site-header{width:calc(100% - 36px);padding:10px 17px;gap:10px}.screen-mode .brand{font-size:1.5rem}.screen-mode .site-header nav a{font-size:0.9375rem;padding:7px 9px}.screen-mode main{padding:0 24px}.screen-mode .site-footer{width:calc(100% - 48px)}.screen-mode.page-about main{gap:30px}.screen-mode.page-about .page-body{padding-left:24px}.screen-mode.page-about .screen-tabs{gap:3px}.screen-mode .screen-tab{font-size:0.9375rem;padding:7px 10px}.screen-mode .index-row h3{font-size:1.3125rem}}
@media(max-width:800px){.screen-mode .site-header{flex-direction:row;flex-wrap:wrap;justify-content:center;min-height:0;margin-top:10px;padding:8px 12px;gap:4px;border-radius:24px}.screen-mode .site-header nav{gap:1px;flex-wrap:wrap;justify-content:center}.screen-mode .site-header nav a{font-size:0.875rem;padding:6px 9px}.screen-mode .brand{font-size:1.5rem;line-height:1.2}.screen-mode main{padding:0 19px}.screen-mode .hero,.screen-mode .detail-hero{padding:14px 0 12px}.screen-mode h1,.screen-mode .detail-hero h1{font-size:2.5rem;line-height:1.04}.screen-mode .hero-subtitle,.screen-mode .detail-hero .hero-subtitle{font-size:1.5rem;margin-top:5px}.screen-mode .hero-description,.screen-mode .detail-hero .hero-description{font-size:0.9375rem;line-height:1.45;margin-top:7px}.screen-mode .back-link{font-size:0.875rem;margin-bottom:7px}.screen-mode .screen-tabs{gap:5px;margin-bottom:10px;padding-bottom:8px}.screen-mode .screen-tab{font-size:0.875rem;min-height:33px;padding:6px 10px}.screen-mode .screen-panel{padding-right:5px}.screen-mode .screen-panel h2{font-size:1.8125rem;margin-bottom:12px}.screen-mode .screen-panel p{font-size:1.0625rem;line-height:1.55}.screen-mode .screen-panel .section-heading h2{font-size:1.1875rem;margin-bottom:8px}.screen-mode .section-heading{margin-bottom:10px}.screen-mode .section-heading p{font-size:1rem}.screen-mode .index-row{padding:11px 0;gap:14px}.screen-mode .index-row h3{font-size:1.1875rem;margin-bottom:4px}.screen-mode .index-row p{font-size:0.9375rem;line-height:1.4}.screen-mode .row-action{font-size:0.8125rem;min-width:42px;white-space:normal}.screen-mode .stage{font-size:0.75rem}.screen-mode .screen-controls{padding-top:8px;gap:9px}.screen-mode .screen-count{font-size:0.8125rem}.screen-mode .screen-step{font-size:0.875rem;min-height:33px;padding:6px 12px}.screen-mode .site-footer{width:calc(100% - 38px);margin-top:6px;padding:9px 0;min-height:34px;flex-direction:row;font-size:0.8125rem}.screen-mode .footer-name{font-size:1rem}.screen-mode .site-footer>div>p{display:none}.screen-mode .site-footer>div{display:block}.screen-mode .lesson{padding-left:19px;margin:5px 0}.screen-mode .lesson p{font-size:1.8125rem;line-height:1.3}.screen-mode .closing-links{margin:15px 0;gap:16px}.screen-mode .button{font-size:1rem;min-height:39px;padding:9px 18px}.screen-mode .status-line{position:static;display:block;font-size:0.8125rem;margin-bottom:9px}.screen-mode .material-list div{grid-template-columns:1fr;gap:4px;padding:10px 0}.screen-mode .material-list dt,.screen-mode .material-list dd{font-size:1rem;line-height:1.45}.screen-mode .source-note p,.screen-mode .source-note a{font-size:1rem}.screen-mode .product-grid{grid-template-columns:1fr 1fr;gap:16px;margin-top:12px}.screen-mode .product-link img{max-height:24dvh}.screen-mode .product-link h2{font-size:1.1875rem;margin-top:6px}.screen-mode .product-link p{font-size:0.875rem;line-height:1.4;margin-top:5px}.screen-mode .product-link .reference{font-size:0.75rem}.screen-mode .image-disclosure{font-size:0.8125rem;line-height:1.4;margin-top:14px}.screen-mode .product-figure figcaption{font-size:0.8125rem;line-height:1.4}.screen-mode .email-link{font-size:1.4375rem;margin-top:20px}.screen-mode #contact-form{gap:5px 12px}.screen-mode #contact-form label{font-size:0.9375rem}.screen-mode input,.screen-mode select,.screen-mode textarea{font-size:1rem;padding:7px 9px;min-height:36px}.screen-mode textarea{height:88px;min-height:75px}.screen-mode .form-note{font-size:0.8125rem!important}.screen-mode .contact-layout p{margin-bottom:14px}.screen-mode .text-button{font-size:1rem}.screen-mode.page-about main{display:flex;flex-direction:column;gap:0;align-items:stretch}.screen-mode.page-about .hero{flex:none;padding:20px 0 17px}.screen-mode.page-about .page-body{flex:1;max-height:none;border-left:0;padding-left:0}.screen-mode .name-display{font-size:2.625rem;margin-bottom:12px}.screen-mode.page-about h1{font-size:3.0625rem;line-height:1.01}.screen-mode.page-about h1 br{display:none}.screen-mode.page-about .hero-description{font-size:0.9375rem;line-height:1.45;margin-top:15px}.screen-mode.page-about .hero-note{display:none}.screen-mode.page-about .hero .button{display:none}.screen-mode.page-about .screen-panel h2{font-size:1.875rem}.screen-mode.page-about .screen-panel p{font-size:1.0625rem}.screen-mode.page-about .screen-panel .closing-links{gap:14px}}
.screen-mode .screen-picker{display:none}
.screen-mode.page-experience:not(.detail-page) .story-index,.screen-mode.page-businesses:not(.detail-page) #ideas-and-collaboration .story-index{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:35px}
.screen-mode.page-experience:not(.detail-page) .index-row,.screen-mode.page-businesses:not(.detail-page) #ideas-and-collaboration .index-row{min-height:107px}
.screen-mode .status-line{position:static;display:inline-block;margin-top:7px;font-size:0.875rem}
@media(max-height:800px) and (min-width:801px){.screen-mode #contact-form{gap:4px 20px}.screen-mode #contact-form label[for=contact-topic],.screen-mode #contact-form label[for=contact-message]{margin-top:4px}.screen-mode #contact-form textarea{height:80px;min-height:65px}.screen-mode form .button{min-height:35px;margin-top:4px;padding:8px 20px}.screen-mode .form-note{font-size:0.8125rem!important}.screen-mode.page-experience:not(.detail-page) .index-row,.screen-mode.page-businesses:not(.detail-page) #ideas-and-collaboration .index-row{min-height:94px}}
@media(max-width:800px){.screen-mode .screen-tabs{display:none}.screen-mode .screen-picker{display:block;width:100%;flex:none;font-size:1rem;min-height:39px;height:39px;margin-bottom:12px;padding:6px 10px}.screen-mode.detail-page .hero-subtitle{display:none}.screen-mode:not(.detail-page) .index-row p{display:none}.screen-mode:not(.detail-page) .section-heading p{font-size:1rem}.screen-mode.page-experience:not(.detail-page) .section-heading{display:none}.screen-mode.page-experience:not(.detail-page) .story-index{gap:0 18px}.screen-mode.page-experience:not(.detail-page) .index-row{min-height:86px;display:block}.screen-mode.page-experience:not(.detail-page) .row-action{display:block;margin-top:8px}.screen-mode.page-experience:not(.detail-page) .row-action .stage{display:none}.screen-mode.page-businesses:not(.detail-page) #ideas-and-collaboration .story-index{column-gap:18px}.screen-mode.page-businesses:not(.detail-page) #ideas-and-collaboration .index-row{min-height:100px;display:block}.screen-mode.page-businesses:not(.detail-page) #ideas-and-collaboration .row-action{display:block;margin-top:7px}.screen-mode.page-businesses:not(.detail-page) #ideas-and-collaboration .stage{display:none}}
@media(max-width:420px){.screen-mode .site-header nav{max-width:340px}.screen-mode .site-header nav a{padding:5px 10px}.screen-mode.page-about h1{font-size:2.8125rem}.screen-mode .screen-panel{scrollbar-gutter:auto}.screen-mode .screen-tab{padding:6px 9px}.screen-mode .site-footer>div:last-child>a{font-size:0.75rem}.screen-mode .index-row h3{font-size:1.125rem}.screen-mode .index-row p{font-size:0.875rem}.screen-mode .row-action{font-size:0.75rem}.screen-mode .product-grid{gap:12px}}
@media(max-width:800px){.screen-mode .lesson p{font-size:1.6875rem;line-height:1.28}.screen-mode.page-about .screen-stage{background:linear-gradient(90deg,rgba(3,12,25,.2),transparent);border-radius:6px}}
@media(max-height:700px) and (max-width:800px){.screen-mode .hero-description{display:none}.screen-mode .hero-subtitle{font-size:1.3125rem}.screen-mode h1{font-size:2.125rem}.screen-mode.page-about .hero{padding:14px 0}.screen-mode.page-about .name-display{font-size:2.125rem;margin-bottom:8px}.screen-mode.page-about h1{font-size:2.5rem}.screen-mode .screen-panel p{font-size:1rem}.screen-mode .index-row{padding:8px 0}}

/* Portrait identity block: source-photo edit, matching navy lighting. */
.screen-mode.page-experience:not(.detail-page) .section-heading{display:none}
.screen-mode.page-businesses:not(.detail-page) #current-projects .story-index{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:35px}
.screen-mode.page-businesses:not(.detail-page) #current-projects .index-row{min-height:107px}
@media(max-width:800px){.screen-mode.page-businesses:not(.detail-page) #current-projects .story-index{column-gap:18px}.screen-mode.page-businesses:not(.detail-page) #current-projects .index-row{display:block;min-height:86px}.screen-mode.page-businesses:not(.detail-page) #current-projects .row-action{display:block;margin-top:7px}.screen-mode.page-businesses:not(.detail-page) #current-projects .stage{display:block}}
.screen-mode .identity{display:flex;align-items:center;gap:23px;margin-bottom:20px}
.screen-mode .identity .portrait{width:118px;height:146px;flex:none;object-fit:cover;object-position:center 42%;border-radius:16px;border:1px solid #38566b}
.screen-mode .identity .name-display{margin:0;font-size:clamp(2.5rem,1.5rem + 2.7vw,4.1rem);line-height:1.08}
@media(max-height:800px) and (min-width:801px){.screen-mode .identity .portrait{width:98px;height:122px}.screen-mode .identity{gap:19px;margin-bottom:16px}.screen-mode .identity .name-display{font-size:3.375rem}}
@media(max-width:800px){.screen-mode .identity{gap:17px;margin-bottom:14px}.screen-mode .identity .portrait{width:67px;height:83px;border-radius:10px}.screen-mode .identity .name-display{font-size:2.125rem}.screen-mode.page-about .hero{padding-top:15px}}

/* Centred main menu, no repeated header name. */
.screen-mode .site-header{justify-content:center}.screen-mode .site-header nav{margin-inline:auto;justify-content:center}

/* Products begin with three named stories, without process-navigation tabs. */
.screen-mode .screen-tabs[hidden],.screen-mode .screen-picker[hidden],.screen-mode .screen-controls[hidden]{display:none!important}
.screen-mode.product-overview .story-index{max-width:1100px}
.screen-mode.product-overview .index-row{padding:25px 0;min-height:112px}
.screen-mode.product-overview .index-row h3{font-size:1.6875rem}
.screen-mode.glove-hub .screen-panel>p:first-child{font-size:1.125rem;max-width:90ch;margin-bottom:20px}
.screen-mode.glove-hub .product-link img{max-height:28dvh}
@media(max-width:800px){.screen-mode.product-overview .index-row{padding:20px 0;min-height:100px}.screen-mode.product-overview .index-row h3{font-size:1.4375rem}.screen-mode.product-overview .index-row p{display:block;font-size:1rem;line-height:1.45;max-width:30ch}.screen-mode.product-overview .row-action{min-width:68px}.screen-mode.glove-hub .screen-panel>p:first-child{font-size:1.0625rem;line-height:1.5;margin-bottom:15px}.screen-mode.glove-hub .product-link img{max-height:26dvh}}

/* Borderless portrait requested by Nabil. */
.screen-mode .identity .portrait{border:0;border-radius:0;box-shadow:none}

/* Transparent portrait cutout: no separate rectangular background. */
.screen-mode .identity .portrait{background:transparent;-webkit-mask-image:linear-gradient(to bottom,#000 88%,transparent 100%);mask-image:linear-gradient(to bottom,#000 88%,transparent 100%)}
.screen-mode .source-inline{margin:10px 0 16px;font-size:0.9375rem;color:var(--muted)}
.screen-mode .source-inline a{font-size:0.9375rem}

.screen-mode .screen-panel p.source-inline{font-size:0.9375rem;line-height:1.4;margin-top:14px}

/* Audit: readable copy over the living artwork; no change to the art itself. */
.screen-mode .screen-stage,.screen-mode.page-about .screen-stage{background:linear-gradient(90deg,rgba(3,12,25,.74),rgba(3,12,25,.48));border-radius:8px}
.screen-mode .screen-panel{padding:14px 16px 14px 12px}
.screen-mode.product-overview .index-title{font-family:Source,sans-serif;font-weight:500;font-size:1.6875rem;line-height:1.25;margin:0 0 5px}
.screen-mode.page-experience:not(.detail-page) .section-heading{display:block;position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.screen-mode .screen-tab{max-width:100%;white-space:normal}
.screen-mode .back-link,.screen-mode .site-footer a,.screen-mode .source-note a{min-height:24px;display:inline-flex;align-items:center}
.screen-mode .index-row>div{min-width:0}.screen-mode .index-row h3,.screen-mode .index-title{overflow-wrap:anywhere}
.screen-mode.glove-hub .screen-panel p.image-disclosure{font-size:.875rem;line-height:1.4;margin:12px 0 0;max-width:100ch}
.screen-mode.page-research .hero-description{background:rgba(3,12,25,.55);box-shadow:0 0 12px 8px rgba(3,12,25,.55);border-radius:3px}
@media(min-width:801px) and (max-height:800px){
 .screen-mode.detail-page .hero-subtitle,.screen-mode.page-connect .hero-subtitle{display:none}
 .screen-mode .material-list div{padding:8px 0}
 .screen-mode .closing-links{margin-top:12px;margin-bottom:4px}
 .screen-mode.glove-hub .product-link img{max-height:22dvh}
 .screen-mode.page-connect #contact-form label[for=contact-topic],.screen-mode.page-connect #contact-form label[for=contact-message]{margin-top:2px}
 .screen-mode.page-connect .hero{padding-bottom:8px}
}
@media(max-width:800px){
 .screen-mode.page-about .closing-links{gap:10px;margin:10px 0 4px}
 .screen-mode .screen-panel{padding:10px 9px 10px 8px}
 .screen-mode.product-overview .index-title{font-size:1.4375rem}
 .screen-mode.page-experience:not(.detail-page) .index-row p{display:block;font-size:.875rem;line-height:1.35;margin-top:7px}
 .screen-mode.page-experience:not(.detail-page) .index-row{min-height:132px}
 .screen-mode .product-figure img{height:auto;max-height:100%;object-fit:contain}
}
/* Small heights and enlarged text use a readable flow instead of a clipped stage. */
@media(max-height:650px){
 body.screen-mode{height:auto;min-height:100dvh}
 .screen-mode main,.screen-mode .page-body,.screen-mode .screen-stage,.screen-mode .screen-panel{flex:none;min-height:0}
 .screen-mode .screen-panel{overflow:visible}
 .screen-mode .screen-stage{min-height:210px}
 .screen-mode.page-about main{flex-direction:column;align-items:stretch;gap:0}
 .screen-mode.page-about .page-body{max-height:none;border:0;padding-left:0}
 .screen-mode .site-footer{margin-top:22px}
 .screen-mode .product-figure img{max-height:55dvh;height:auto}
}
body.readable-flow{height:auto;min-height:100dvh}
.readable-flow main,.readable-flow .page-body,.readable-flow .screen-stage,.readable-flow .screen-panel{flex:none;min-height:0}
.readable-flow .screen-panel{overflow:visible}.readable-flow .screen-stage{min-height:210px}
.readable-flow.page-about main{flex-direction:column;align-items:stretch;gap:0}
.readable-flow.page-about .page-body{max-height:none;border:0;padding-left:0}
.readable-flow .site-header nav{flex-wrap:wrap;justify-content:center}
.readable-flow .story-index{display:block!important}
.readable-flow .index-row{flex-wrap:wrap}
.readable-flow #contact-form{display:flex;flex-direction:column}
.readable-flow .product-grid{grid-template-columns:1fr}
.readable-flow .product-figure img{height:auto;max-height:none}
.readable-flow .site-footer{margin-top:22px;flex-wrap:wrap}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;scroll-behavior:auto!important}}
@media(forced-colors:active){.screen-mode .screen-tab[aria-selected=true]{outline:2px solid Highlight}.screen-mode .site-header{border:1px solid CanvasText}}

/* Every lesson offers something useful; every screen offers a human next step. */
.screen-mode .practical-takeaway{margin-top:24px;border-top:1px solid var(--rule);padding-top:14px}
.screen-mode .screen-panel .practical-takeaway h2{font-family:Source,sans-serif;font-size:1.0625rem;font-weight:500;line-height:1.3;margin:0 0 8px;color:var(--cyan)}
.screen-mode .screen-panel .practical-takeaway p{font:400 1.125rem/1.5 Source,sans-serif;margin:0;max-width:76ch;color:var(--muted)}
.screen-mode .footer-action{color:var(--cyan);font-size:1rem;text-decoration:underline}
.screen-mode.page-connect .screen-panel .button{margin:12px 18px 0 0}
@media(min-width:801px) and (max-height:800px){
 .screen-mode .screen-panel>.lesson{padding-top:6px;padding-bottom:6px;margin-top:4px;margin-bottom:4px}
 .screen-mode .screen-panel>.lesson>p{font-size:1.875rem;line-height:1.25;margin-top:10px}
 .screen-mode .practical-takeaway{margin-top:16px;padding-top:10px}
 .screen-mode .screen-panel .practical-takeaway p{font-size:1.0625rem;line-height:1.4}
}
@media(max-width:800px){
 .screen-mode .lesson p{font-size:1.5rem;line-height:1.25;margin-top:12px}
 .screen-mode .practical-takeaway{margin-top:16px;padding-top:12px}
 .screen-mode .screen-panel .practical-takeaway h2{font-size:1rem;margin-bottom:7px}
 .screen-mode .screen-panel .practical-takeaway p{font-size:1rem;line-height:1.45}
 .screen-mode .footer-action{font-size:.9375rem}
}

@media(min-width:801px){
 .screen-mode .screen-panel>.lesson{padding-top:6px;padding-bottom:6px;margin-top:4px;margin-bottom:4px}
 .screen-mode .screen-panel>.lesson>p{font-size:2rem;line-height:1.25;margin-top:10px;max-width:100%}
 .screen-mode .practical-takeaway{margin-top:16px;padding-top:10px}
}
@media(min-width:801px) and (max-height:800px){.screen-mode .screen-panel>.lesson>p{font-size:1.875rem}}
@media(min-width:801px) and (max-height:800px){.screen-mode .screen-panel>.lesson+.closing-links{margin-top:8px}}

/* Personal profiles verified from the owner's signed-in browser. */
.screen-mode .personal-socials{display:flex;align-items:center;gap:14px;margin-top:18px;flex-wrap:wrap}
.screen-mode .personal-socials a{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:5px 14px;border:1px solid #587d90;border-radius:24px;color:var(--cyan);font-size:1rem}
.screen-mode .footer-socials{display:inline-flex;gap:8px;align-items:center}
.screen-mode .footer-socials a{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;min-height:30px;border-radius:7px;color:var(--cyan)}
.screen-mode .footer-socials a:hover{background:#17364b}
@media(max-width:800px){.screen-mode .site-footer>div:last-child{display:flex;gap:10px;align-items:center}.screen-mode .site-footer>div:last-child>a[href^="mailto:"]{display:none}.screen-mode .personal-socials{margin-top:14px;gap:12px}}

/* Founder introduction: one useful introduction, not a three-part autobiography. */
.screen-mode.page-about h1{font-size:clamp(2.5rem,1.7rem + 2vw,3.7rem);line-height:1.08}
.screen-mode .founder-line{font-size:1.0625rem;line-height:1.45;color:var(--muted);margin:0 0 20px}
.screen-mode .founder-line a{color:var(--cyan);text-decoration-thickness:1px}
.screen-mode.page-about .hero-description{font-size:1.125rem;line-height:1.55;margin-top:20px;max-width:46ch}
.screen-mode .intro-actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:24px}
.screen-mode.page-about .hero .intro-actions .button{margin-top:0}
.screen-mode.page-about .page-body{max-height:none;flex:.85}
.screen-mode.page-about .screen-panel h2{font-size:2.125rem}
.screen-mode.page-about .screen-panel p{font-size:1.125rem;line-height:1.6}
.screen-mode.page-about .screen-panel p+p{margin-top:16px}
.mobile-menu{display:none}
@media(max-width:800px){
 body.screen-mode{height:auto;min-height:100svh;min-height:100dvh;display:flex;flex-direction:column}
 .screen-mode .site-header{display:block;width:calc(100% - 32px);padding:0;margin:12px auto 0;min-height:0;border-radius:16px}
 .screen-mode .mobile-menu{display:block;width:100%}
 .screen-mode .mobile-menu summary{list-style:none;display:flex;align-items:center;justify-content:space-between;min-height:46px;padding:10px 16px;font-size:1rem;color:var(--ink);cursor:pointer;touch-action:manipulation}
 .screen-mode .mobile-menu summary::-webkit-details-marker{display:none}
 .screen-mode .mobile-menu summary span{font-size:1.25rem}
 .screen-mode .mobile-menu[open] summary span{transform:rotate(180deg)}
 .screen-mode .mobile-menu:not([open]) nav{display:none}
 .screen-mode .mobile-menu[open] nav{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:0 8px 9px;border-top:1px solid var(--rule)}
 .screen-mode .site-header nav a{display:flex;align-items:center;justify-content:center;min-height:44px;font-size:1rem;padding:9px}
 .screen-mode main{display:block;flex:none;min-height:0;max-height:none;padding:0 max(18px,env(safe-area-inset-right)) 0 max(18px,env(safe-area-inset-left))}
 .screen-mode .page-body,.screen-mode .screen-stage,.screen-mode .screen-panel{display:block;flex:none;height:auto;min-height:0;max-height:none}
 .screen-mode .screen-panel{overflow:visible;scrollbar-gutter:auto;padding:15px 14px}
 .screen-mode .hero,.screen-mode .detail-hero{padding:20px 0 18px}
 .screen-mode .hero-description,.screen-mode .detail-hero .hero-description{display:block;font-size:1rem;line-height:1.5;margin-top:10px}
 .screen-mode h1,.screen-mode .detail-hero h1{font-size:clamp(2rem,1.4rem + 3vw,2.75rem);line-height:1.08;overflow-wrap:normal;text-wrap:balance}
 .screen-mode .hero-subtitle{font-size:1.5rem;line-height:1.2}
 .screen-mode .back-link{min-height:38px;align-items:center;margin-bottom:8px;font-size:.9375rem}
 .screen-mode .screen-picker{height:auto;min-height:44px;font-size:1rem;margin:0 0 12px;padding:10px 12px}
 .screen-mode .screen-panel h2{font-size:1.75rem;line-height:1.15;margin-bottom:14px}
 .screen-mode .screen-panel p{font-size:1.0625rem;line-height:1.6}
 .screen-mode .screen-controls{margin-top:12px;padding:10px 0 0;min-height:55px}
 .screen-mode .screen-step,.screen-mode .button{min-height:44px;font-size:1rem;padding:10px 16px}
 .screen-mode .site-footer{margin-top:auto;padding:12px 0 max(12px,env(safe-area-inset-bottom));width:calc(100% - 36px);min-height:68px;gap:10px}
 .screen-mode .footer-action{font-size:1rem;min-height:44px}
 .screen-mode .footer-socials a{width:44px;height:44px;min-height:44px}
 .screen-mode.page-about main{display:block;padding-bottom:20px}
 .screen-mode.page-about .hero{padding:20px 0 24px}
 .screen-mode .identity{gap:16px;margin:0 0 10px}
 .screen-mode .identity .portrait{width:56px;height:70px}
 .screen-mode .identity .name-display{font-size:2rem;line-height:1.12}
 .screen-mode .founder-line{font-size:1rem;margin:0 0 16px;line-height:1.4}
 .screen-mode.page-about h1{font-size:clamp(2rem,1.5rem + 2.5vw,2.5rem);line-height:1.08}
 .screen-mode.page-about h1 br{display:block}
 .screen-mode.page-about .hero-description{display:block;font-size:1rem;line-height:1.5;margin-top:16px;max-width:35ch}
 .screen-mode .intro-actions{gap:14px;margin-top:18px}
 .screen-mode .intro-actions .text-link{font-size:1rem;min-height:44px;display:inline-flex;align-items:center}
 .screen-mode.page-about .hero .button{display:inline-flex}
 .screen-mode.page-about .page-body{border:0;padding:0;max-height:none}
 .screen-mode.page-about .screen-panel{padding:18px 16px}
 .screen-mode.page-about .screen-panel h2{font-size:1.75rem}
 .screen-mode.page-about .screen-panel p{font-size:1rem;line-height:1.6}
 .screen-mode.page-about .screen-panel p+p{margin-top:12px}
 .screen-mode .story-index,.screen-mode.page-experience:not(.detail-page) .story-index,.screen-mode.page-businesses:not(.detail-page) #current-projects .story-index,.screen-mode.page-businesses:not(.detail-page) #ideas-and-collaboration .story-index{display:block;max-width:100%}
 .screen-mode:not(.detail-page) .index-row,.screen-mode.page-experience:not(.detail-page) .index-row,.screen-mode.page-businesses:not(.detail-page) #current-projects .index-row,.screen-mode.page-businesses:not(.detail-page) #ideas-and-collaboration .index-row{display:flex;align-items:center;gap:15px;padding:16px 0;min-height:90px}
 .screen-mode .index-row h3,.screen-mode.product-overview .index-title{font-size:1.1875rem;line-height:1.3;margin-bottom:7px;overflow-wrap:normal}
 .screen-mode:not(.detail-page) .index-row p,.screen-mode.page-experience:not(.detail-page) .index-row p{display:block;font-size:1rem;line-height:1.45;margin-top:0;max-width:35ch}
 .screen-mode .row-action,.screen-mode.page-experience:not(.detail-page) .row-action,.screen-mode.page-businesses:not(.detail-page) #current-projects .row-action,.screen-mode.page-businesses:not(.detail-page) #ideas-and-collaboration .row-action{display:flex;flex-direction:column;justify-content:center;gap:8px;min-width:60px;margin:0;font-size:.875rem}
 .screen-mode .row-action .stage,.screen-mode.page-businesses:not(.detail-page) #current-projects .stage,.screen-mode.page-businesses:not(.detail-page) #ideas-and-collaboration .stage{display:block;font-size:.8125rem;line-height:1.35}
 .screen-mode .product-grid{grid-template-columns:1fr;gap:26px;margin-top:16px}
 .screen-mode .product-link img,.screen-mode.glove-hub .product-link img{width:100%;height:auto;max-height:none;aspect-ratio:3/2;object-fit:contain}
 .screen-mode .product-link h2{font-size:1.25rem;margin-top:7px}
 .screen-mode .product-link p{font-size:1rem;line-height:1.45}
 .screen-mode .product-link .reference{font-size:.875rem}
 .screen-mode .product-figure{height:auto;display:block}
 .screen-mode .product-figure>a{display:block}
 .screen-mode .product-figure img{width:100%;height:auto;max-height:none;aspect-ratio:3/2;object-fit:contain}
 .screen-mode .product-figure figcaption{font-size:.9375rem;line-height:1.5;margin-top:14px}
 .screen-mode .material-list div{display:block;padding:14px 0}
 .screen-mode .material-list dt{font-size:1.0625rem;line-height:1.4;margin-bottom:7px}
 .screen-mode .material-list dd{font-size:1rem;line-height:1.5}
 .screen-mode #contact-form{display:flex;flex-direction:column;gap:8px;max-width:100%;width:100%}
 .screen-mode #contact-form label{font-size:1rem;line-height:1.4;margin-top:8px}
 .screen-mode #contact-form input,.screen-mode #contact-form select,.screen-mode #contact-form textarea{font-size:1rem;min-height:44px;padding:11px 12px}
 .screen-mode #contact-form textarea{height:auto;min-height:140px}
 .screen-mode #contact-form .button{align-self:flex-start;margin-top:12px}
 .screen-mode .screen-panel .form-note{font-size:.9375rem!important;line-height:1.5!important;margin-top:8px!important}
 .screen-mode .personal-socials a{min-height:44px}
}
@media(min-width:600px) and (max-width:800px){
 .screen-mode .product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .screen-mode.page-about .hero-description{max-width:50ch}
}
@media(min-width:801px) and (max-height:800px){
 .screen-mode .screen-panel{padding-bottom:8px}
 .screen-mode.page-connect .screen-panel{padding-top:8px;padding-bottom:6px}
}
@media(max-width:800px){
 .screen-mode .mobile-menu summary:focus-visible{outline:3px solid var(--cyan);outline-offset:3px;border-radius:14px}
 .screen-mode .mobile-menu nav a{white-space:normal;overflow-wrap:anywhere;text-align:center}
 .screen-mode.readable-flow .mobile-menu[open] nav{grid-template-columns:1fr}
}

/* Natural-tone preview: shared identity across the retained story screens. */
.screen-mode h1,.screen-mode .detail-hero h1{font-family:Source,'Segoe UI',sans-serif;font-weight:500;letter-spacing:-.03em}
.screen-mode .screen-panel h2{font-family:Source,'Segoe UI',sans-serif;font-weight:500;line-height:1.2;font-size:1.5rem}
.screen-mode .site-header{max-width:1280px;width:calc(100% - 64px);padding:8px 14px;margin:20px auto 0;min-height:62px}
.screen-mode .site-header nav a{padding:9px 18px;font-size:1rem;min-height:44px}
.screen-mode .site-header nav a[aria-current=page]{background:#324e61a6;color:#f1f7fc}
.screen-mode .button{background:#d3e9ef;color:#092034;border-color:#d3e9ef;font-weight:600}
.screen-mode .button:hover{background:#fff;color:#092034}
@media(max-width:1000px) and (min-width:801px){.screen-mode .site-header nav a{padding-inline:12px}}
@media(max-width:800px){.screen-mode .site-header{width:calc(100% - 32px);margin-top:12px;border-radius:18px;padding:5px 14px;min-height:0}.screen-mode .site-header nav a{padding:9px 10px;font-size:1rem}.screen-mode .screen-panel h2{font-size:1.45rem}}

/* A single reflection should read as practical experience, not a quotation. */
.screen-mode .lesson p{font-family:Source,'Segoe UI',sans-serif;font-size:1.25rem;line-height:1.6;max-width:70ch}.screen-mode .lesson span{display:block;color:var(--cyan);font-size:1rem;margin-bottom:10px}
.screen-mode .story-group{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:42px;max-width:1260px}.screen-mode .story-group>*{min-width:0}.screen-mode .story-group>:only-child{grid-column:1/-1;max-width:80ch}.screen-mode .story-group>.story-section,.screen-mode .story-group>.section,.screen-mode .story-group>.source-note{margin:0}.screen-mode .story-group>.lesson{margin:0}.screen-mode .story-group>.product-figure{max-width:none;height:100%;min-height:0;flex:1}.screen-mode .story-group:has(>.product-figure){height:100%;min-height:0;display:flex;flex-direction:column;gap:0}.screen-mode .story-group:has(.material-list){display:block}.screen-mode .story-group>.source-note{max-width:85ch}
@media(max-width:800px){.screen-mode .lesson p{font-size:1.15rem}}
@media(max-width:1000px){.screen-mode .story-group{grid-template-columns:1fr;gap:26px}}

/* 26 October: project collections; tabs replace duplicate overview paging. */
.screen-controls[hidden]{display:none!important}.project-collections{display:flex;flex-wrap:wrap;gap:8px 22px;padding:0 0 14px}.project-collections a{min-height:44px;display:inline-flex;align-items:center;font-size:1rem}.project-collections a[aria-current=page]{color:var(--cyan)}
