:root{--pine:#315f50;--paper:#f5f6f1}html{background:var(--paper)}body{min-height:100dvh}input,textarea,select{font-size:16px}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible{outline:3px solid #b09258;outline-offset:3px}#mobile-menu,.sidebar-shade{display:none}
@media(max-width:760px){
 body:has(> #app > .sidebar){height:var(--usable-height,100dvh);min-height:0;overflow:hidden}
 #app>.sidebar{position:fixed;inset:0 auto 0 0;height:100dvh;width:min(82vw,320px);z-index:30;transform:translateX(-105%);transition:transform .15s;padding-top:max(16px,env(safe-area-inset-top));padding-bottom:max(16px,env(safe-area-inset-bottom));background:#28483e}
 .nav-open #app>.sidebar{transform:translateX(0)}
 .nav-open .sidebar-shade{display:block;position:fixed;inset:0;width:100%;height:100%;background:#0006;border:0;z-index:20}
 #mobile-menu{display:block;flex-shrink:0;margin:0;padding:8px 12px;background:var(--pine);min-height:44px}
 .chat-header{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:calc(8px + env(safe-area-inset-top)) 12px 8px}
 .chat-header h3{flex:1;min-width:0;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .chat-actions{display:flex;gap:8px;width:100%;justify-content:flex-end}.chat-actions button{margin:0;padding:4px 10px;font-size:13px;min-height:36px}
 .message-container{padding:16px 12px}.message{max-width:92%;margin-bottom:20px}.message-content{padding:12px 14px;font-size:16px;line-height:1.7}
 .message.user .message-content{background:#dcebe4;color:#203f34}.message.assistant .message-content{background:white}
 .input-area{padding:10px 12px max(10px,env(safe-area-inset-bottom));gap:8px;align-items:flex-end;background:var(--paper)}
 .input-area textarea{min-height:52px;max-height:140px;height:76px;resize:none}.input-area .btn-primary{min-width:58px;padding:12px;background:var(--pine)}
 #chat-notice{margin:0;padding:0 12px;font-size:12px;max-height:54px;overflow:auto}
 .settings-container{width:auto;max-width:100%;margin:0;padding:24px 16px}.settings-container .mode-options{display:flex;flex-direction:column}
 .login-container{padding:20px}.login-card{width:100%;max-width:400px;padding:28px 22px}
 body>main{padding:20px 14px max(20px,env(safe-area-inset-bottom));width:100%}body>main>header{flex-wrap:wrap;gap:12px}h1{font-size:25px}
 .layout{grid-template-columns:1fr!important}.controls{flex-wrap:wrap}#conversation{max-height:42dvh}.task{overflow-wrap:anywhere}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}