/* Phone layout: reachable navigation, safe areas and a chat that follows the keyboard. */
@media (max-width:620px), (max-width:900px) and (max-height:500px) and (pointer:coarse){
 :root,:root[data-accent]{--app-header-height:calc(64px + env(safe-area-inset-top));--mobile-nav-height:calc(66px + env(safe-area-inset-bottom));scroll-padding-bottom:calc(var(--mobile-nav-height) + 16px)}
 .app-header.sidebar{backdrop-filter:none;-webkit-backdrop-filter:none;background:#101722;box-shadow:0 1px 0 #ffffff05}
 .app-header-inner{height:var(--app-header-height);min-height:var(--app-header-height);grid-template-columns:minmax(0,1fr) auto;grid-template-rows:1fr;grid-template-areas:"brand profile";padding:env(safe-area-inset-top) max(16px,env(safe-area-inset-right)) 0 max(16px,env(safe-area-inset-left));gap:12px}
 .app-header .brand{font-size:20px;gap:9px}
 .app-header .brand-mark{width:30px;height:30px;font-size:25px;border-radius:9px}
 .app-header .header-account{width:auto;max-width:142px;height:44px;min-height:44px;padding:3px 7px 3px 4px;gap:8px;border-radius:14px}
 .app-header .header-profile-orbit{width:34px;height:34px;flex-basis:34px}
 .app-header .header-account .avatar{width:28px;height:28px;min-width:28px;font-size:18px;border-width:2px}
 .app-header .header-account>.header-profile-copy{display:flex;gap:0;max-width:80px}
 .header-profile-detail,.header-profile-arrow{display:none}.header-profile-name{font-size:12px}.header-profile-level{width:19px;height:19px;font-size:9px}
 .app-header nav{position:fixed;inset:auto 0 0;z-index:50;width:auto;height:var(--mobile-nav-height);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:start;gap:4px;margin:0;padding:6px max(8px,env(safe-area-inset-right)) calc(6px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));border:0;border-top:1px solid #afcaff1c;border-radius:0;background:#111a28f5;box-shadow:0 -8px 28px #0002;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
 .app-header .nav-item{width:100%;min-width:0;height:53px;min-height:53px;padding:5px 2px;gap:4px;flex-direction:column;border-radius:12px;font-size:10px;font-weight:550;line-height:1.2;letter-spacing:0}
 .app-header .nav-item>svg{display:block;width:21px;height:21px;opacity:1}
 .app-header .nav-item>span{max-width:100%;overflow:hidden;text-overflow:ellipsis}
 :root[data-accent] .app-header .nav-item.active,.app-header .nav-item.active{background:#a9c7ff10;box-shadow:none;border-color:#a9c7ff12;color:var(--accent)}
 main{padding:0 max(16px,env(safe-area-inset-right)) calc(var(--mobile-nav-height) + 24px) max(16px,env(safe-area-inset-left))}
 input:not([type=range]):not([type=checkbox]):not([type=radio]),textarea,select,.home-toolbar .search-box input,.library-search input,.setting-field input,.setting-field select{font-size:16px}
 button,a,input,select,textarea,summary{touch-action:manipulation}
 .home-toolbar{gap:9px;margin:16px 0}.home-toolbar nav{gap:4px}.home-section-link{min-height:44px;padding:10px;font-size:13px}.home-toolbar .search-box{min-height:50px}
 .spotlight-copy{padding:22px 20px 14px;min-height:300px}.spotlight-copy h1{font-size:28px;letter-spacing:-.8px}.spotlight-label{font-size:10px;margin-bottom:15px}.spotlight-copy>p{font-size:14px;line-height:1.6;margin:15px 0}.spotlight-actions{width:100%;gap:8px}.spotlight-actions .button{flex:1;justify-content:center;font-size:12px;padding:10px;min-height:46px}.spotlight-pager{margin-top:8px}
 .home-categories{gap:8px;margin:16px 0 26px}.home-category{min-height:70px;padding:13px}.home-category>span{font-size:14px}
 .home-rail{grid-auto-columns:calc((100% - 22px)/2.2);gap:12px;scrollbar-width:none;padding-bottom:8px}.home-tile h3{font-size:14px;min-height:39px;margin-top:9px}.home-tile-meta{font-size:12px}
 .home-filters{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:13px}.home-filters label:last-child{grid-column:1/-1}.home-filters select,.home-filters .catalog-kind select{font-size:16px}
 .library-tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;max-width:100%;overscroll-behavior-x:contain}.library-tabs button{flex-shrink:0;min-height:44px}
 .profile-tabs{overflow-x:auto;scrollbar-width:none;gap:18px}.profile-tabs button{flex-shrink:0;white-space:nowrap;min-height:48px}
 .description-toggle{min-height:44px;font-size:13px}.detail-photo>span{opacity:1}.detail-gallery-toggle{min-height:44px}
 #toast,.library-undo{bottom:calc(var(--mobile-nav-height) + 12px);max-width:calc(100vw - 24px)}.room-mini{bottom:calc(var(--mobile-nav-height) + 10px);right:12px}
 body:has(.chat-room){overflow:hidden}
 body:has(.chat-room) main{position:fixed;top:calc(var(--wr-viewport-top,0px) + var(--app-header-height));left:0;right:0;max-width:none;height:calc(var(--wr-viewport-height,100dvh) - var(--app-header-height) - var(--mobile-nav-height));min-height:0;padding:6px max(12px,env(safe-area-inset-right)) 8px max(12px,env(safe-area-inset-left))}
 body:has(.chat-room) #content{height:100%;min-height:0}
 .chat-room{height:100%;min-height:0;max-width:none}
 .chat-heading{flex-shrink:0;min-height:50px;padding:0 0 7px;gap:8px}.chat-heading>div:first-child{gap:8px;min-width:0}.chat-engine-status{font-size:10px;line-height:1.4;max-width:130px}.chat-title{font-size:17px}.chat-title>span{display:none}.chat-heading-actions{gap:4px}.chat-heading-actions button{min-width:44px;min-height:44px;padding:0 10px}.chat-heading-actions svg{width:17px;height:17px}
 .chat-thread{padding:16px 4px 8px;scroll-padding-bottom:12px}.chat-message{margin-bottom:22px}.chat-message.user{max-width:90%;padding:10px 13px}.chat-message-text{font-size:15px;line-height:1.65}
 .chat-welcome{min-height:100%;padding:10px 0;justify-content:center}.chat-welcome-mark{width:54px;height:54px;font-size:30px;border-radius:18px;margin-bottom:14px}.chat-welcome h1{font-size:22px;margin-bottom:9px}.chat-welcome>p{font-size:12px;line-height:1.6;margin-bottom:16px}.chat-welcome>p br{display:none}
 .chat-room:has(.chat-device-setup:not(.compact):not([hidden])) .chat-welcome-mark{display:none}
 .chat-suggestions{display:flex;flex-wrap:nowrap;justify-content:flex-start;width:100%;max-width:100%;gap:8px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;padding-bottom:3px}.chat-suggestions button{flex:0 0 auto;max-width:92%;min-height:44px;font-size:12px;padding:10px 12px;scroll-snap-align:start}.chat-suggestions svg{flex-shrink:0}
 .chat-composer-wrap{flex-shrink:0;padding:6px 0 0}.chat-composer-wrap form{gap:7px;padding:6px;border-radius:18px;align-items:flex-end}.chat-composer-wrap textarea{font-size:16px;line-height:1.5;min-height:44px;max-height:110px;padding:10px 0}.chat-send,.chat-attach{width:44px;height:44px;flex:0 0 44px;border-radius:12px}.chat-composer-note{display:none}
 .chat-attachment-tray{flex-wrap:nowrap;max-height:85px;overflow-x:auto}.chat-attachment-tray .chat-attachment{flex-shrink:0}.chat-attachment button{width:44px;min-height:44px;flex-basis:44px}.chat-action button{min-width:44px;min-height:44px;font-size:12px}
 .chat-memory{position:absolute;top:50px;left:0;right:0;z-index:4;box-shadow:0 14px 35px #0008;flex-shrink:0;max-height:calc(var(--wr-viewport-height,100dvh) * .42);margin:6px 0 0;padding:10px 12px}.chat-memory button{width:44px;height:44px;flex-basis:44px}.chat-memory li{gap:8px}
 .chat-device-setup:not(.compact){flex-shrink:1;min-height:44px;overflow:auto;padding:12px;margin:6px 0 0;gap:10px}.chat-device-setup strong{font-size:13px}.chat-device-setup p{font-size:12px;line-height:1.5}.chat-device-setup button{min-height:44px;white-space:normal}.chat-device-setup.compact{margin:0;padding:0;gap:8px;font-size:10px;min-height:36px}.chat-device-setup.compact button{font-size:10px;min-height:40px}.chat-device-setup.compact>span{max-width:64%}
 :root.mobile-keyboard,:root[data-accent].mobile-keyboard{--mobile-nav-height:0px;--app-header-height:0px}.mobile-keyboard .app-header.sidebar{display:none}
 .mobile-keyboard .chat-welcome-mark,.mobile-keyboard .chat-welcome>p{display:none}.mobile-keyboard .chat-welcome h1{font-size:18px}.mobile-keyboard .chat-device-setup:not(.compact){max-height:94px;overflow:auto;flex-direction:row;align-items:center}.mobile-keyboard .chat-device-setup button{max-width:120px}.mobile-keyboard .chat-device-setup strong{display:none}
 .mobile-keyboard body:has(.chat-room) main{padding-bottom:max(8px,env(safe-area-inset-bottom))}
}
@media(max-width:350px){.app-header .header-account{max-width:112px}.app-header .header-account>.header-profile-copy{max-width:55px}.chat-heading-actions button>span{display:none}.chat-device-setup:not(.compact){padding:10px}.chat-welcome h1{font-size:20px}}
@media(max-height:500px) and (max-width:900px) and (pointer:coarse){
 :root,:root[data-accent]{--app-header-height:48px;--mobile-nav-height:54px}.app-header-inner{padding-top:0}.app-header .header-account{height:40px;min-height:40px}.app-header nav{padding-top:3px;padding-bottom:3px}.app-header .nav-item{height:47px;min-height:47px;flex-direction:row;gap:7px}.chat-heading{min-height:44px;padding-bottom:0}.chat-device-setup:not(.compact){flex-direction:row;align-items:center;margin-top:3px;padding:8px 12px}.chat-device-setup button{min-width:145px}.chat-welcome-mark{display:none}.chat-welcome{padding:6px 0}:root.mobile-keyboard,:root[data-accent].mobile-keyboard{--app-header-height:0px;--mobile-nav-height:0px}
}
@media (max-width:620px), (max-width:900px) and (max-height:500px) and (pointer:coarse){
 #content:not(:fullscreen) .watch-settings-panel{bottom:calc(var(--mobile-nav-height) + 8px);max-height:calc(100dvh - var(--app-header-height) - var(--mobile-nav-height) - 24px)}
 body:has(.chat-room) .room-mini{bottom:calc(var(--mobile-nav-height) + 82px)}
 .detail-lightbox button{width:44px;height:44px}.detail-lightbox-stage{grid-template-columns:44px minmax(0,1fr) 44px}.detail-lightbox-stage button{width:44px}
}
@media(max-width:620px) and (max-height:650px), (max-width:900px) and (max-height:500px) and (pointer:coarse){
 .chat-welcome>p{display:none}.chat-welcome{padding:4px 0}.chat-welcome h1{margin-bottom:12px}.chat-thread{padding-top:10px}
}