/* Home reference: Canva page 2, 1920 × 1080. Desktop sizes stop growing.
   The scene may expand; its content follows an independently bounded column. */
:root{--u:1px;--menu-height:37px;--dock-clearance:133px;--window-top:clamp(52px,6.666667dvh,72px);--window-width:min(1735px,90.364583vw)}
.desktop{--wallpaper:url('assets/desktop-wallpaper.png');background:#d9cff1 var(--wallpaper) center / cover no-repeat}
.portfolio-window{left:calc((100% - var(--window-width))/2 - 4.5px);right:auto;width:var(--window-width);top:var(--window-top);height:min(837px,calc(100dvh - var(--window-top) - 143px));border-radius:29px;transition:left .48s cubic-bezier(.22,.8,.3,1),width .48s cubic-bezier(.22,.8,.3,1),top .48s cubic-bezier(.22,.8,.3,1),height .48s cubic-bezier(.22,.8,.3,1),border-radius .4s,box-shadow .4s}
.portfolio-window.is-expanded{left:0;right:auto;top:var(--menu-height);width:100%;height:calc(100dvh - var(--menu-height));border-radius:0}
.window-body{grid-template-columns:269px minmax(0,1fr)}
.content-panel{container-type:inline-size}
.introduction{--name-size:83px;--surname-size:117.2px;--name-overlap:-34.17px;--intro-top:121.9px;--intro-left:54px;--intro-right:54px;--heading-gap:20.25px;position:relative;min-height:100%;padding:var(--intro-top) var(--intro-right) 76px var(--intro-left)}
.intro-copy{width:100%;max-width:1176.3px;margin:0;text-align:left}
.introduction h1{margin:0 0 var(--heading-gap);font-weight:800;letter-spacing:0}
.first-name{display:block;margin:0 0 0 -6px;font-size:var(--name-size);line-height:1.2;letter-spacing:.015em;font-weight:800;white-space:nowrap}
.last-name{display:block;margin:var(--name-overlap) 0 0 -12.37px;font-size:var(--surname-size);line-height:1.2;letter-spacing:.005em;font-weight:900;transform:scaleX(.92);transform-origin:left center}
.roles{max-width:1176.3px;margin:0;font-size:27px;line-height:33px;font-weight:600;letter-spacing:-.005em}
.bio{max-width:1158px;margin:24.5px 0 0;font-size:21px;line-height:25px;letter-spacing:0}
.browse{width:264px;max-width:100%;min-height:56px;margin-top:37px;padding:15px 18px;font-size:21px;line-height:25px;border-radius:9px}
.background-video{inset:0;width:100%;height:100%;object-fit:cover;opacity:.6}
.is-expanded .introduction{padding-bottom:calc(var(--dock-clearance) + 36px)}
/* Top bar measured from the current Canva page. The two groups stay attached
   to their respective edges; widening a screen never stretches icon gaps. */
.menu-bar{display:block;padding:0;font-size:16px;height:37px}
.apple{position:absolute;left:24.9521px;top:8.2715px;width:16.1965px;height:19.7519px}
.owner{position:absolute;left:50.2628px;top:8.7587px;height:21px;font-size:16px;line-height:21px}
.menu-items{position:absolute;left:241.1671px;top:0;width:256.8055px;height:37px;display:block;margin:0}
.menu-items button{position:absolute;top:8.7587px;height:21px;padding:0;font-size:16px;line-height:21px;text-align:left}
.menu-items [data-menu="file"]{left:0;width:35.0171px}.menu-items [data-menu="edit"]{left:53.8158px;width:35.0171px}.menu-items [data-menu="view"]{left:107.6316px;width:40.4863px}.menu-items [data-menu="go"]{left:169.8329px;width:40.4863px}.menu-items [data-menu="help"]{left:216.3192px;width:40.4863px}
.system-tools{position:absolute;right:217.5564px;top:0;width:238.5922px;height:37px;display:block;margin:0;padding:0}
.theme-toggle{position:absolute;left:0;top:4.3563px;width:67.0712px;height:28.2675px;border:0;box-shadow:inset 0 0 0 1px #fffaf5;padding:0;display:block}
.theme-toggle button{position:absolute;top:1.9768px;height:24.3138px;padding:0;display:block}
.theme-toggle [data-theme="light"]{left:2.6169px;width:34.2603px}.theme-toggle [data-theme="dark"]{left:36.8772px;width:27.5771px}
.theme-toggle img{position:absolute;object-fit:contain}
.theme-toggle [data-theme="light"] img{left:7.8732px;top:3.4707px;width:17.3724px;height:17.3724px}
.theme-toggle [data-theme="dark"] img{left:5.0944px;top:3.8518px;width:15.6137px;height:16.6103px}
.search{position:absolute;left:93.5979px;top:10.5329px;width:17.4905px;height:17.4905px}
.wifi{position:absolute;left:132.0653px;top:7.1803px;width:23.2473px;height:19.6440px}
.volume{position:absolute;left:174.1893px;top:10.2383px;width:19.3012px;height:14.9584px}
.battery{position:absolute;left:207.4905px;top:9.5623px;width:31.1017px;height:16.4839px}
#clock{position:absolute;right:10.5214px;top:8.5716px;width:180.0351px;height:21px;margin:0;font-size:15px;line-height:21px;letter-spacing:0;font-variant-numeric:tabular-nums}
.dock{bottom:29px;--icon-size:66px;--dock-pad:7px;--label-gap:9px;--label-height:19px;gap:19px;padding:var(--dock-pad) 12px 0}
.dock-tray{height:calc(var(--icon-size) + 14px)}
.dock-label{font-size:16px}
body.dark .desktop{background:#33243d var(--wallpaper) center / cover no-repeat;background-blend-mode:multiply}
.genie-copy.portfolio-window{max-width:none!important;min-width:0!important}
/* Only constrained content changes type scale. An ultrawide never increases it. */
@container(max-width:1150px){
 .introduction{--name-size:64px;--surname-size:90.4px;--name-overlap:-26.35px;--intro-top:72px;--intro-left:40px;--intro-right:40px;--heading-gap:24px}
 .roles{font-size:21px;line-height:1.45}
 .bio{font-size:18px;line-height:1.55;margin-top:22px;max-width:65ch}
 .browse{width:fit-content;font-size:17px;line-height:1.3;min-height:48px;margin-top:30px;padding:14px 20px}
}
@container(max-width:850px){
 .introduction{--name-size:54px;--surname-size:76.3px;--name-overlap:-22.23px;--intro-top:52px;--intro-left:32px;--intro-right:32px}
 .roles{font-size:18px;line-height:1.5}
 .bio{font-size:17px;line-height:1.6}
}
/* A drawer replaces the sidebar before it can crowd the introduction. */
@media(max-width:1000px){
 :root{--menu-height:35px;--dock-clearance:105px}
 .menu-bar{display:flex;align-items:center;height:var(--menu-height);padding:0 12px;gap:6px}.apple,.owner,#clock{position:static;top:auto;left:auto;right:auto;width:auto;height:auto}.apple{width:13px;height:16px}.owner{font-size:11px;line-height:1}.menu-items,.system-tools{display:none}#clock{margin-left:auto;width:auto;font-size:10px;line-height:1;letter-spacing:-.3px}
 .portfolio-window{left:16px;right:auto;width:calc(100% - 32px);top:55px;height:calc(100dvh - 178px);border-radius:18px;box-shadow:0 5px 0 var(--shadow)}
 .window-header{min-height:58px;flex-basis:58px}.window-controls{left:16px;gap:10px}.window-dot{width:12px;height:12px;min-width:12px;min-height:12px}.window-dot:before{inset:-7px}
 .breadcrumb{left:102px;font-size:13px;gap:5px}.breadcrumb img{width:11px;height:11px}
 .mobile-sidebar-toggle{display:grid;place-items:center;position:absolute;right:8px;top:7px;width:44px;height:44px;background:transparent;font-size:21px;padding:0}
 .window-body{display:block;position:relative;overflow:hidden}.content-panel{height:100%;width:100%}
 .sidebar{display:none;position:absolute;inset:0;width:100%;z-index:3;overflow:auto;padding:24px;background:var(--sidebar);box-shadow:0 12px 20px #4d274822}.sidebar.is-visible{display:block}
 .sidebar h2{position:static;margin:0 0 10px;font-size:11px;line-height:1.3;letter-spacing:1px}
 .favorites{position:static;display:grid;gap:3px}.nav-item{font-size:15px;min-height:44px;height:auto;padding:10px 14px;gap:12px}.nav-item img{width:23px;height:21px}
 .sidebar-divider{position:static;height:1px;margin:20px 0}.locations{position:static;display:grid;gap:12px;margin:0;font-size:14px}.locations li{height:auto;gap:12px}.locations img{width:22px;height:21px}
 .tags{position:static;display:flex;flex-wrap:wrap;gap:8px 18px;padding:0 0 36px;font-size:12px;line-height:20px}.tags li{padding-left:14px;white-space:normal}.tags li:before{top:7px;width:6px;height:6px}
 .dock{bottom:18px;--icon-size:50px;--dock-pad:7px;--label-gap:8px;--label-height:14px;width:auto;max-width:calc(100% - 20px);height:calc(var(--dock-pad) + var(--icon-size) + var(--label-gap) + var(--label-height));min-height:0;gap:12px;padding:7px 12px 0}
 .dock-tray{height:calc(var(--icon-size) + 14px);border-radius:20px}.dock-item{flex:0 0 var(--icon-size);width:var(--icon-size);min-width:0;height:auto}.dock-label{font-size:10px;line-height:14px}
 .toast{font-size:13px;padding:13px 18px;bottom:calc(var(--dock-clearance) + 12px)}
}
@media(max-width:640px){
 :root{--menu-height:35px;--dock-clearance:98px}
 .portfolio-window{left:12px;width:calc(100% - 24px);top:51px;height:calc(100dvh - 161px);border-radius:16px}
 .window-header{min-height:56px;flex-basis:56px}.mobile-sidebar-toggle{top:6px}.breadcrumb{font-size:12px}
 .introduction{--name-size:35px;--surname-size:53px;--name-overlap:-10px;--intro-top:36px;--intro-left:24px;--intro-right:24px;--heading-gap:25px;padding:var(--intro-top) var(--intro-right) 36px var(--intro-left)}
 .introduction h1{margin-bottom:var(--heading-gap)}.first-name{margin-left:-2px;font-size:var(--name-size);line-height:1.2;letter-spacing:.005em}.last-name{margin:var(--name-overlap) 0 0 -3px;font-size:var(--surname-size);line-height:1.2;transform:scaleX(.92)}
 .roles{font-size:16px;line-height:1.55}.bio{font-size:16px;line-height:1.65;margin-top:22px;max-width:100%}.browse{font-size:15px;line-height:1.4;margin-top:26px;min-height:48px;padding:13px 18px}
 .is-expanded .introduction{padding-bottom:calc(var(--dock-clearance) + 32px)}
 .dock{--icon-size:44px;--label-gap:7px;--label-height:12px;gap:10px;padding:7px 10px 0;bottom:max(12px,env(safe-area-inset-bottom));max-width:calc(100% - 16px)}
 .dock-label{font-size:9px;line-height:12px}.dock-art{border-radius:10px}.dock-item:before{content:'';position:absolute;inset:-6px -3px 0}
 .dock-item:hover .dock-art{transform:translateY(-5px) scale(1.05)}
 .search-dialog{top:10vh;padding:24px}.search-dialog h2{font-size:20px}
}
@media(max-width:359px){
 .introduction{--name-size:29px;--surname-size:46px;--intro-left:20px;--intro-right:20px}
 .dock{--icon-size:40px;gap:7px;padding-left:9px;padding-right:9px}.dock-label{font-size:8px}
 #clock{font-size:9px}.owner{font-size:10px}.breadcrumb{left:96px;font-size:11px}
}
/* A short browser can scroll; width alone never stretches its vertical gaps. */
@media(max-height:560px) and (min-width:1001px){
 .portfolio-window{top:49px;height:calc(100dvh - 152px)}
}