/* Home shortcuts float beside the heading, leaving space for the topic list. */
#start-screen{position:relative}
#start-screen .home-header .brand{background:var(--title-card-color,#ff69b4);color:#111}
#start-screen:has(.home-left-shortcuts.menu-open){z-index:1000}
#start-screen .home-header:has(.home-left-shortcuts.menu-open){z-index:1000;isolation:auto}
#start-screen .home-left-shortcuts.menu-open{z-index:1001}
#start-screen .home-left-shortcuts.menu-open .home-menu-links{z-index:1002}
#start-screen .home-header{position:relative;min-height:66px;padding-right:66px;justify-content:flex-start}
#start-screen .home-header .brand{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-2deg);margin:0;max-width:calc(100% - 130px)}
#start-screen .home-contact-actions{position:absolute;right:20px;top:20px;display:flex;flex-direction:column;align-items:center;gap:10px;width:48px;z-index:9}
#start-screen .home-contact-actions #btn-vault,#start-screen .home-contact-actions #btn-camera{width:44px;height:44px;min-width:44px;min-height:44px;padding:4px}
#start-screen .home-contact-actions .home-camera-controls{width:44px;min-height:44px;justify-content:center}
#start-screen .vocabulary-heading,#start-screen .catalog-view,#start-screen .grammar-tabs{margin-right:64px}
@media(max-width:600px){
 #start-screen .home-header{min-height:56px;padding-right:54px}
 #start-screen .home-header .brand{max-width:calc(100% - 104px)}
 #start-screen .home-contact-actions{right:16px;top:16px;width:40px;gap:8px}
 #start-screen .home-contact-actions #btn-vault,#start-screen .home-contact-actions #btn-camera{width:40px;height:40px;min-width:40px;min-height:40px}
 #start-screen .home-contact-actions #btn-vault svg{width:27px;height:27px}
 #start-screen .home-contact-actions .home-camera-controls{width:40px;min-height:40px}
 #start-screen .vocabulary-heading,#start-screen .catalog-view,#start-screen .grammar-tabs{margin-right:52px}
 .camera-layout #start-screen.active{height:76%;gap:6px;padding:10px}
 .camera-layout #app>.camera-panel{top:76%;bottom:0}
 .camera-layout #start-screen .home-header{min-height:48px}
 .camera-layout #start-screen .home-contact-actions{right:10px;top:10px}
 .camera-layout #start-screen .categories{min-height:64px}
 .camera-layout #start-screen .search-wrapper{margin-right:52px}
}
@media(hover:hover) and (pointer:fine){
 #start-screen .home-contact-actions:has([data-tooltip]:hover){z-index:100}
 #start-screen .home-contact-actions [data-tooltip]:hover,#start-screen .home-contact-actions [data-tooltip]:focus-visible{z-index:100}
 #start-screen .home-contact-actions [data-tooltip]::after{top:50%;left:auto;right:calc(100% + 12px);translate:0 -50%;text-align:left}
}

/* Keep the camera glyph centered rather than aligned to a text baseline. */
#start-screen .home-contact-actions #btn-camera{display:flex;align-items:center;justify-content:center;padding:0;line-height:1;text-indent:0}
#start-screen .grammar-tabs button{padding:5px 8px;font-size:13px;min-height:32px}
#start-screen .home-header .brand .brand-wordmark strong{display:block;transform:scaleY(1.12);line-height:1.18}
@media(max-width:600px),(max-height:600px){
 #start-screen .categories.grid-view{gap:8px}
 #start-screen .grid-view .category-card{min-height:76px;padding:8px;gap:8px}
 #start-screen .category-card strong{font-size:14px;padding:3px 6px}
 #start-screen .category-card .emoji{width:38px;height:38px;font-size:23px;flex-shrink:0}
 #start-screen .list-view .category-card{padding:7px 9px;gap:8px;min-height:48px}
}

#btn-camera{display:flex;align-items:center;justify-content:center;padding:0}
#btn-camera .camera-icon{display:block;width:26px;height:26px;flex-shrink:0;pointer-events:none}
@media(max-width:600px){
 #start-screen .home-header{min-height:76px;padding:0;isolation:isolate}
 #start-screen .home-header .brand{inset:0;width:100%;max-width:none;min-height:70px;transform:none;justify-content:center;padding:8px 52px;box-sizing:border-box;z-index:0}
 #start-screen .home-header .brand>img{display:none}
 #start-screen .home-header .brand .brand-wordmark{min-width:0;width:100%;gap:5px}
 #start-screen .home-header .brand .brand-wordmark strong{font-size:clamp(18px,6vw,26px);white-space:nowrap;transform:none;line-height:1.1}
 #start-screen .home-header .brand .brand-wordmark small{font-size:10px;padding:2px 5px}
 #start-screen .home-left-shortcuts{top:12px;left:8px;z-index:10}
 #start-screen .home-contact-actions{top:28px;z-index:12}
 body.camera-layout #start-screen .home-header{min-height:76px}
}

/* Reserve the shortcut column, including its shadow, even on narrow screens. */
#start-screen .grammar-tabs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));min-width:0;max-width:calc(100% - 64px);margin-right:64px;gap:6px}
#start-screen .grammar-tabs button{min-width:0;width:100%;overflow-wrap:anywhere;white-space:normal}
@media(max-width:360px){#start-screen .grammar-tabs button{font-size:11px;padding:5px 3px}}

/* Phone home catalog only: leave both game screens unchanged. */
@media(max-width:600px){
 body.camera-layout #start-screen .categories{gap:6px}
 body.camera-layout #start-screen .category-card{min-height:48px;padding:5px 7px;gap:6px}
 body.camera-layout #start-screen .category-card strong{font-size:12px;line-height:1.15;padding:2px 4px;border-width:2px;box-shadow:2px 2px 0 #111}
 body.camera-layout #start-screen .category-card .emoji{width:29px;height:29px;font-size:19px;border-width:2px;box-shadow:2px 2px 0 #111}
 body.camera-layout #start-screen .category-card small{font-size:10px}
 body.camera-layout #start-screen .grammar-tabs button{font-size:11px;min-height:28px;padding:3px 5px;border-width:2px;box-shadow:2px 2px 0 #ff69b4}
 body.camera-layout #start-screen #btn-correct-words{font-size:11px;min-height:28px;padding:3px 6px;border-width:2px;box-shadow:2px 2px 0 #ff69b4}
 body.camera-layout #start-screen .catalog-view button{font-size:11px;min-height:26px;padding:3px 6px}
}
