/*
 * Short laptop / Chromebook layout.
 *
 * Watches are handled by watch.css. This breakpoint keeps desktop browser
 * chrome while making short, wide workspaces less crowded.
 */
@media (min-width:481px) and (max-width:1100px) and (max-height:650px){
  /* The unified theme contract uses ID-weighted :is() selectors. Match that
     specificity so these rules remain limited to this viewport. */
  html body:is(body,#nyx-compact-laptop):is(body,#nyx-compact-layout):is(body,#nyx-compact-theme).browser-shell
    .browser-window.browser-home-page .browser-home{
    box-sizing:border-box!important;
    justify-content:flex-start!important;
    gap:15px!important;
    padding:32px 16px 58px!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    scrollbar-width:none;
  }
  html body:is(body,#nyx-compact-laptop):is(body,#nyx-compact-layout):is(body,#nyx-compact-theme).browser-shell
    .browser-window.browser-home-page .browser-home::-webkit-scrollbar{display:none}
  html body:is(body,#nyx-compact-laptop):is(body,#nyx-compact-layout):is(body,#nyx-compact-theme).browser-shell
    .browser-home .nyx-home-hero{
    width:min(820px,calc(125vw - 48px))!important;
    gap:13px!important;
    transform:none!important;
  }
  html body:is(body,#nyx-compact-laptop):is(body,#nyx-compact-layout):is(body,#nyx-compact-theme).browser-shell
    .browser-window.browser-home-page .browser-home h1.nyx-home-title{font-size:38px!important}
  html body:is(body,#nyx-compact-laptop):is(body,#nyx-compact-layout):is(body,#nyx-compact-theme).browser-shell
    .browser-window.browser-home-page .browser-home h1.nyx-home-title::before{
    width:34px!important;
    height:34px!important;
    flex-basis:34px!important;
  }
  html body:is(body,#nyx-compact-laptop):is(body,#nyx-compact-layout):is(body,#nyx-compact-theme).browser-shell
    .browser-window.browser-home-page .nyx-home-search{
    height:47px!important;
    min-height:47px!important;
    border-radius:15px!important;
  }
  html body:is(body,#nyx-compact-laptop):is(body,#nyx-compact-layout):is(body,#nyx-compact-theme).browser-shell
    .browser-window.browser-home-page .nyx-home-search-icon{
    width:17px!important;
    height:17px!important;
    flex-basis:17px!important;
    margin-left:16px!important;
  }
  html body:is(body,#nyx-compact-laptop):is(body,#nyx-compact-layout):is(body,#nyx-compact-theme).browser-shell
    .browser-window.browser-home-page .nyx-home-search input{
    padding:0 12px!important;
    font-size:13px!important;
  }
  html body:is(body,#nyx-compact-laptop):is(body,#nyx-compact-layout):is(body,#nyx-compact-theme).browser-shell
    .browser-window.browser-home-page .nyx-home-actions{
    width:100%!important;
    height:39px!important;
    gap:7px!important;
  }
  html body:is(body,#nyx-compact-laptop):is(body,#nyx-compact-layout):is(body,#nyx-compact-theme).browser-shell
    .browser-window.browser-home-page .nyx-home-actions > button{
    min-width:0!important;
    height:34px!important;
    flex:1 1 0!important;
    gap:7px!important;
    padding:0 8px!important;
    font-size:11px!important;
  }
  html body:is(body,#nyx-compact-laptop):is(body,#nyx-compact-layout):is(body,#nyx-compact-theme).browser-shell
    .browser-window.browser-home-page .nyx-home-action-icon{
    width:15px!important;
    height:15px!important;
    flex-basis:15px!important;
  }
  html body:is(body,#nyx-compact-laptop):is(body,#nyx-compact-layout):is(body,#nyx-compact-theme).browser-shell
    .browser-home div.quick-grid.home-shortcut-grid.browser-home-normal[data-home-shortcuts]{
    position:absolute!important;
    left:50%!important;
    right:auto!important;
    top:auto!important;
    bottom:72px!important;
    width:auto!important;
    max-width:calc(125vw - 46px)!important;
    min-height:58px!important;
    padding:4px 8px!important;
    border-radius:16px!important;
    transform:translateX(-50%)!important;
  }
  html body:is(body,#nyx-compact-laptop):is(body,#nyx-compact-layout):is(body,#nyx-compact-theme).browser-shell
    .browser-home div.quick-grid.home-shortcut-grid.browser-home-normal[data-home-shortcuts] > .quick-tile{
    width:52px!important;
    min-width:52px!important;
    max-width:52px!important;
    height:50px!important;
    min-height:50px!important;
    max-height:50px!important;
  }
  html body:is(body,#nyx-compact-laptop):is(body,#nyx-compact-layout):is(body,#nyx-compact-theme).browser-shell
    .nyx-home-presence{
    left:12px!important;
    top:10px!important;
    min-height:27px!important;
    padding:0 9px!important;
    font-size:10px!important;
  }
  html[data-nyx-theme] body:is(body,#nyx-compact-laptop):is(body,#nyx-compact-layout):is(body,#nyx-compact-theme).browser-shell
    .nyx-home-presence .nyx-profile-slot .nyx-account-button.nyx-account-button-rich{
    width:126px!important;
    min-width:126px!important;
    height:31px!important;
    padding-right:7px!important;
  }
  html body:is(body,#nyx-compact-laptop):is(body,#nyx-compact-layout):is(body,#nyx-compact-theme).browser-shell
    .browser-window.browser-home-page .nyx-home-weather{display:none!important}

  /* The account dropdown fits above the footer without its own scrollbar. */
  html body .nyx-account-menu{padding:0 6px 6px!important;border-radius:11px!important}
  html body .nyx-account-menu-banner{height:46px!important;margin:0 -6px!important}
  html body .nyx-account-menu-profile{
    min-height:75px!important;
    margin:0 -6px!important;
    padding:25px 11px 7px!important;
  }
  html body .nyx-account-menu-avatar{
    top:-23px!important;
    left:10px!important;
    width:48px!important;
    height:48px!important;
    border-width:4px!important;
    font-size:17px!important;
  }
  html body .nyx-account-menu-avatar > .nyx-user-status{
    right:-2px!important;
    bottom:0!important;
    width:9px!important;
    height:9px!important;
    border-width:3px!important;
  }
  html body .nyx-account-menu-status{
    top:-19px!important;
    left:66px!important;
    max-width:calc(100% - 76px)!important;
    padding:5px 8px!important;
    font-size:10px!important;
  }
  html body .nyx-account-menu-profile h2{font-size:15px!important}
  html body .nyx-account-menu-handle{margin-top:2px!important;font-size:11px!important}
  html body .nyx-account-menu-bio{
    display:block!important;
    max-height:13px!important;
    margin-top:4px!important;
    overflow:hidden!important;
    font-size:10px!important;
    line-height:1.3!important;
    text-overflow:ellipsis;
    white-space:nowrap!important;
  }
  html body .nyx-account-menu-group{margin-top:4px!important;padding:2px!important;border-radius:8px!important}
  html body .nyx-account-menu-group button{
    min-height:26px!important;
    gap:8px!important;
    padding:4px 7px!important;
    border-radius:6px!important;
    font-size:11px!important;
  }
  html body .nyx-account-menu-group button svg{width:15px!important;height:15px!important;flex-basis:15px!important}
  html body .nyx-account-menu-group button svg:last-child:not(:first-child){width:13px!important;height:13px!important}
  html body .nyx-account-menu-group hr{margin:1px 7px!important}

  /* Full weather details remain available from the browser toolbar. */
  html body:is(body,#nyx-weather-specificity) .weather-panel{
    width:min(300px,calc(125vw - 30px))!important;
    max-height:370px!important;
    padding:10px!important;
    border-radius:15px!important;
  }

  html body.browser-shell .browser-shell-settings-panel .nyx-settings-control :is(
    select,
    .settings-select,
    input:not([type="range"]):not([type="color"]),
    .settings-input
  ){
    width:100%!important;
    max-width:240px!important;
    min-height:34px!important;
    max-height:34px!important;
    padding-top:5px!important;
    padding-bottom:5px!important;
    font-size:12px!important;
  }
}