/* Homepage fills the window. ONLY the print handoff reflows to a 16:9 panel.
   This is the final viewport authority. No scaleX/scaleY, zoom or fixed home aspect. */
html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#000}
#screen-layer{position:fixed!important;inset:0!important;width:100%!important;height:100%!important;display:block!important;overflow:hidden!important;background:#000!important;z-index:3!important;pointer-events:none}
#screen-layer #screen-anchor#screen-anchor{
 position:absolute!important;inset:auto!important;left:50%!important;top:50%!important;
 width:var(--console-width,100vw)!important;height:var(--console-height,100dvh)!important;
 min-width:0!important;min-height:0!important;max-width:none!important;max-height:none!important;
 aspect-ratio:auto!important;transform:translate(-50%,-50%)!important;transform-origin:center!important;
 margin:0!important;border:0!important;box-shadow:none!important;overflow:hidden!important;
 pointer-events:auto;transition:none!important;--console-header:86px;
}
#screen-layer #screen-anchor#screen-anchor :is(.device,.screen){width:100%!important;height:100%!important;min-height:0!important;max-width:none!important}
#screen-layer #screen-anchor#screen-anchor .topbar{height:var(--console-header)!important;gap:20px}
#screen-layer #screen-anchor#screen-anchor .brand{font-size:48px}
#screen-layer #screen-anchor#screen-anchor .navigation a{font-size:24px}
#screen-layer #screen-anchor#screen-anchor .console-layout{display:block!important;height:calc(100% - var(--console-header))!important;min-height:0!important;padding:16px 2.2%}
#screen-layer #screen-anchor#screen-anchor #main{height:100%!important;min-height:0!important;padding:0!important;overflow:auto!important}
#screen-layer #screen-anchor#screen-anchor #main:has(.home-layout){display:flex!important;flex-direction:column}
#screen-layer #screen-anchor#screen-anchor .home-layout{flex:1!important;min-height:0!important;overflow:auto!important}
#screen-layer #screen-anchor#screen-anchor .home-left{display:block}
#screen-layer #screen-anchor#screen-anchor h1{font-size:clamp(40px,4.5vw,68px);margin:4px 0 14px}
#screen-layer #screen-anchor#screen-anchor .identity{font-size:17px;line-height:1.6}
#screen-layer #screen-anchor#screen-anchor .identity-meta{margin-bottom:12px}
#screen-layer #screen-anchor#screen-anchor .skill{min-height:56px;padding-block:7px}
#screen-layer #screen-anchor#screen-anchor .skill strong{font-size:28px}
#screen-layer #screen-anchor#screen-anchor .skill-top svg{width:34px;height:34px}
#screen-layer #screen-anchor#screen-anchor .print-dock{flex:0 0 auto!important;margin-top:10px;padding-top:8px}
#screen-layer #screen-anchor#screen-anchor .start{min-height:54px;font-size:24px}
@media(max-width:759px){
 #screen-layer #screen-anchor#screen-anchor{--console-header:68px;padding:10px}
 #screen-layer #screen-anchor#screen-anchor .topbar{gap:8px}
 #screen-layer #screen-anchor#screen-anchor .brand{font-size:32px}
 #screen-layer #screen-anchor#screen-anchor .navigation{gap:12px}
 #screen-layer #screen-anchor#screen-anchor .navigation a{font-size:18px}
 #screen-layer #screen-anchor#screen-anchor .status{display:none}
 #screen-layer #screen-anchor#screen-anchor .info-grid{grid-template-columns:1fr}
 #screen-layer #screen-anchor#screen-anchor .resume-heading{flex-direction:column;align-items:flex-start}
}

/* Old mobile header rules wrapped a 103px header inside a 68px slot. */
@media(max-width:759px){
 #screen-layer #screen-anchor#screen-anchor .topbar{flex-wrap:nowrap!important;align-content:center!important;justify-content:space-between;padding:0 8px!important}
 #screen-layer #screen-anchor#screen-anchor .brand{flex:0 0 auto!important;margin:0!important;line-height:1!important}
 #screen-layer #screen-anchor#screen-anchor .navigation{flex:0 1 auto!important;width:auto!important;min-width:0;gap:12px!important;height:auto!important;margin:0!important}
 #screen-layer #screen-anchor#screen-anchor .navigation a{min-height:40px!important;padding:8px 0!important;white-space:nowrap}
}
