/* The small screen is the handheld itself. The desktop keeps its original case. */
.screen-title:is(button){border:0;background:none;color:inherit;font:inherit;padding:0;text-align:left;cursor:pointer;min-width:0}
.screen-title:is(button) #screen-name{overflow:hidden;text-overflow:ellipsis}
.pocket-menu-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:20px 0 8px}
.pocket-menu-actions button{min-height:44px;padding:10px;border:1px solid #c099b7;background:#f3deeb;color:#664269;border-radius:6px;font:12px var(--pixel)}
.menu-caption{font-size:12px!important}
.install-button{margin-top:12px;border:1px solid #c099b7;background:#efdae8;color:#69436d;padding:10px;border-radius:7px;min-height:44px;font:12px var(--pixel)}
.install-steps{padding-left:22px;margin:12px 0;font-size:14px;line-height:1.9}.install-steps li+li{margin-top:8px}
.install-icon{display:block;width:80px;height:80px;border-radius:18px;margin-bottom:18px;image-rendering:pixelated}
.install-close{width:100%;margin:18px 0 10px;min-height:44px}
.login-card input{font-size:16px}
.offline-page{display:grid;place-items:center;min-height:100svh;padding:24px}.offline-card{max-width:380px;padding:32px;background:#fff2df;border:3px solid #977cac;border-radius:26px;box-shadow:0 8px #795e91}.offline-card h1{font:24px var(--pixel);margin:15px 0}.offline-card p{line-height:1.9;margin-bottom:16px}.offline-card a{min-height:44px;text-decoration:none}
@media(max-width:800px){
 body:not(.login-page):not(.offline-page){background:#c3b0d5;background-image:none;min-width:0}
 body>.folio,body>main>.under-device,body>.page-footer{display:none}
 body>main:not(.login-card){padding:calc(env(safe-area-inset-top,0px) + 6px) calc(env(safe-area-inset-right,0px) + 6px) calc(env(safe-area-inset-bottom,0px) + 12px) calc(env(safe-area-inset-left,0px) + 6px)}
 .device,.chat-expanded .device{width:100%;max-width:665px;height:calc(var(--pocket-height,100svh) - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 18px);min-height:620px;padding:8px 9px 16px;display:flex;flex-direction:column;border-radius:24px 24px 32px 24px;box-shadow:inset 0 2px #e9d9f1,inset -3px -6px #a489b9,0 6px #795e91}
 .device-head{height:49px;flex-shrink:0;padding:0 8px 5px}.device-wordmark{font-size:19px;gap:7px}.device-wordmark>svg{width:18px;height:18px}.edition-button{min-height:44px;min-width:44px}.tiny-stars{display:none}
 .device-center,.chat-expanded .device-center{display:flex;flex:1;min-height:0}.left-grip,.right-grip{display:none}
 .screen-bezel{display:flex;flex-direction:column;flex:1;min-height:0;padding:6px 6px 0;border-radius:12px 12px 18px 12px}
 .screen{display:flex;flex-direction:column;flex:1;min-height:0;border-width:2px}
 .screen-top{height:44px;min-height:44px;flex-shrink:0;padding:0 7px;gap:5px}
 .screen-title:is(button){min-height:44px;max-width:calc(100% - 56px);font-size:11px;gap:5px}
 .screen-title:after{content:'⌄';font:12px var(--body);margin-left:2px;color:#c597c5}.screen-status{font-size:9px;gap:4px}.screen-status #screen-mode{display:none}.screen-status #live-status{display:inline}
 .screen-content,.chat-expanded .screen-content{flex:1;min-height:0;height:auto;aspect-ratio:auto}
 .screen-nav{height:54px;min-height:54px;flex-shrink:0}.screen-nav button{flex-direction:column;gap:4px;font-size:10px;min-height:48px}
 .bezel-wordmark{height:19px;flex-shrink:0;font-size:6px;letter-spacing:.5px;gap:8px}
 .device-bottom{flex-shrink:0;margin:10px 2px 0;flex-wrap:wrap;gap:7px;min-height:0}
 .cartridge{flex-basis:100%;max-width:none;min-height:57px;padding:6px 8px;gap:8px}.cartridge-copy{overflow:hidden}.cartridge-copy strong{overflow:hidden;text-overflow:ellipsis;font-size:12px}.cartridge-copy em{font-size:9px;display:inline;margin-left:5px}.cartridge-copy small{font-size:9px}.cartridge-icon{width:27px;height:30px}.cartridge-edit{font-size:10px}
 .quick-combos{display:flex;align-items:center;margin-left:3px;gap:6px}.quick-label{font-size:7px;letter-spacing:0}.quick-combos button{min-height:44px;padding:3px 10px;font-size:11px}
 .device-links{display:flex;flex-direction:row;margin-left:auto;gap:5px}.device-links button{min-height:44px;padding:0 6px;font-size:10px}.device-links #telegram-link{min-width:44px}.device-links #telegram-link span{display:none}.device-links svg{width:15px;height:15px}
 .hotspot{min-height:44px}.hotspot i{display:none!important}.dialogue{left:7px;right:7px;font-size:12px;line-height:1.6;bottom:9px;gap:8px;padding:10px;min-height:65px}.speaker-name{padding-right:8px}.dialogue-next{font-size:8px}
 .hotspot-terminal{left:3%;top:42%}.hotspot-tasks{left:5%;top:8%}.hotspot-browser{right:3%;top:17%}.hotspot-files{right:3%;bottom:26%}.room-art{object-position:52% center}
 .view button,.view select,.paper-top button{min-height:44px}.back-button{min-width:44px}
 #prompt,.search-field input,.interaction input[type=text],.interaction textarea,.chat-toolbar select{font-size:16px}
 .search-field{min-height:44px}.model-label strong,.selection-summary strong{overflow-wrap:anywhere}
 .chat-heading{padding:7px 9px 3px}.chat-heading h1{font-size:15px}.chat-heading .pixel-eyebrow{display:none}.chat-toolbar{padding:0 8px 4px;flex-wrap:wrap;gap:4px}.chat-toolbar select{max-width:calc(100% - 104px);flex:1}.chat-toolbar #chat-model{max-width:100%;width:100%;margin:0;text-align:left;padding:0 3px;border:0;background:none;font-size:11px}
 .chat-view{overflow:hidden;min-height:0}.chat-heading,.chat-toolbar,.chat-status{flex-shrink:0}
 .messages{padding:8px 10px;min-height:0}.message{font-size:14px}.chat-status{margin:2px 10px 4px}.composer-bottom span{display:none}.composer-bottom{justify-content:flex-end}#composer{padding:0 8px 8px}#prompt{resize:none;min-height:52px;max-height:100px}.interaction{margin:0 8px 4px;max-height:30%}
 .chat-expanded .device-head,.chat-expanded .device-bottom{display:none}.chat-expanded .device{min-height:0;padding-top:8px}.chat-expanded .messages{padding:10px}.chat-expanded .chat-heading h1{font-size:15px}
 body.keyboard-open .device{height:calc(var(--pocket-height,100svh) - 12px);min-height:0;padding-top:4px;padding-bottom:5px}
 body.keyboard-open>main:not(.login-card){padding-top:2px;padding-bottom:10px}
 .keyboard-open .device-head,.keyboard-open .device-bottom,.keyboard-open .bezel-wordmark,.keyboard-open .chat-heading,.keyboard-open .chat-toolbar,.keyboard-open .chat-status{display:none}
 .keyboard-open .screen-nav{height:46px;min-height:46px}.keyboard-open .screen-nav button{min-height:44px;font-size:9px;gap:2px}.keyboard-open .screen-nav svg{width:12px;height:12px}
 .keyboard-open .screen-top{height:38px;min-height:38px}.keyboard-open .screen-title:is(button){min-height:38px}
 .keyboard-open .messages{min-height:24px}.keyboard-open #prompt{height:46px;min-height:46px}.keyboard-open #composer{padding-bottom:4px}.keyboard-open .composer-bottom{margin-top:2px}.keyboard-open .screw,.keyboard-open .device:after{display:none}
 dialog{max-height:calc(var(--pocket-height,100dvh) - 24px);max-width:calc(100vw - 24px)}.paper-body{padding:18px 20px 10px}.paper-body p,.paper-body li{font-size:13px}.paper-top button{min-width:44px}
 .toast{bottom:calc(env(safe-area-inset-bottom,0px) + 16px)}
 .login-page{min-height:100svh;padding:calc(env(safe-area-inset-top,0px) + 24px) 22px calc(env(safe-area-inset-bottom,0px) + 24px)}.login-card{width:100%;padding:25px;box-shadow:6px 8px #b49ac5}
}
@media(max-width:360px){.quick-label{display:none}.device-wordmark{font-size:17px}.screen-title:is(button){font-size:10px}.device-links{gap:1px}.device-links button{padding:0 3px}.cartridge-copy em{display:block;margin:2px 0 0}.chat-toolbar #chat-model{white-space:normal}.device-bottom{gap:3px}}
@media(max-width:800px) and (max-height:700px){body:has(#chat-view:not([hidden])) .device{min-height:0}body:has(#chat-view:not([hidden])) .device-head,body:has(#chat-view:not([hidden])) .device-bottom{display:none}#expand-chat{display:none}}
@media(max-width:800px) and (orientation:landscape){.device,.chat-expanded .device{min-height:380px}.device-head,.device-bottom{display:none}.chat-heading{display:none}.chat-toolbar{flex-wrap:nowrap}.chat-toolbar #chat-model{width:auto;max-width:35%;margin-left:auto}.screen-nav button{flex-direction:row}.chat-expanded .device{min-height:380px}.keyboard-open .device{min-height:0}}
