:root{--green:#285c47;--lime:#d8eb94;--ink:#23382e;--muted:#7a847b;--bg:#f5f6f0}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.5 'Segoe UI',Arial,sans-serif}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #9bbd58;outline-offset:3px}.shell{max-width:1560px;margin:auto;display:flex}aside{width:236px;padding:42px 28px;min-height:100vh;border-right:1px solid #e1e5d9;position:sticky;top:0;height:100vh;display:flex;flex-direction:column}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-size:21px;font-weight:700;line-height:1.12;color:var(--green)}.logo{background:var(--green);color:var(--lime);border-radius:15px;padding:13px;font-size:25px}.tag{font-size:9px;letter-spacing:3px;margin:23px 0 45px;color:#8d9886}nav{display:grid;gap:9px}nav button{text-align:left;border:0;background:transparent;color:#71816d;border-radius:12px;padding:13px 12px}nav button.active{background:#e5ecd8;color:var(--green);font-weight:600}.aside-note{margin-top:auto;padding-top:70px;font-size:23px;line-height:1.4;font-family:Georgia,serif}.aside-note span{display:block;font:12px 'Segoe UI';color:var(--muted);margin-top:16px}.demo{font-size:10px;color:var(--muted);margin-top:45px}main{flex:1;min-width:0;padding:29px 45px}header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #e1e5d9;padding-bottom:22px;font-size:10px;letter-spacing:2px}#reward{letter-spacing:0;font-size:12px;background:#e9eddc;border-radius:25px;padding:8px 15px}.heading{display:flex;justify-content:space-between;gap:20px;align-items:center}h1{font-size:48px;line-height:1.1;letter-spacing:-2px;font-weight:500;margin:34px 0 18px}h1 span{color:#a9bf66}p{margin:10px 0 18px}.heading p{color:var(--muted);font-size:14px}.datebox label{font-size:11px;color:var(--muted);display:grid;gap:6px}.grid{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:24px;margin-top:24px}.card{background:#fff;border:1px solid #e5e8dc;border-radius:21px;padding:27px;margin-bottom:20px}.section-head{display:flex;justify-content:space-between;align-items:center}small{font-size:10px;letter-spacing:1.7px;color:#829275}h2{font-size:23px;letter-spacing:-.5px;margin:7px 0 14px;font-weight:600}.round{background:#edf2df;border-radius:50%;width:45px;height:45px;text-align:center;line-height:45px;font-size:25px}.toolbar{display:flex;justify-content:space-between;align-items:center;margin-top:17px}.text-btn{border:0;color:var(--green);background:transparent;font-size:12px;padding:8px 0}.muted{color:var(--muted);font-size:13px}.dish{display:flex;justify-content:space-between;gap:10px;padding:16px 0;border-top:1px solid #edf0e6;align-items:center}.dish-title{font-size:14px;font-weight:500}.dish-meta{color:var(--muted);font-size:11px;margin-top:4px}.portions{display:flex;background:#f4f6f0;border-radius:9px;padding:3px;flex-shrink:0}.portions button{border:0;background:transparent;font-size:11px;padding:7px 9px;border-radius:7px;color:#7a847b}.portions button.selected{background:var(--green);color:white}.issue{color:#9a702c;font-size:11px}details{font-size:11px;color:var(--muted);border-top:1px solid #edf0e6;padding-top:14px}summary{cursor:pointer}input,select{border:1px solid #dfe5d7;background:#fafbf7;border-radius:9px;padding:10px;min-width:0;color:var(--ink)}#foodform{display:flex;gap:8px;align-items:center;flex-wrap:wrap}#food{flex:1;min-width:160px}#grams{width:78px}.primary{background:var(--green);color:#fff;border:0;border-radius:10px;padding:12px 17px;font-weight:500}.wide{width:100%}.footnote,.privacy{font-size:11px;color:#899080;line-height:1.6;margin-top:17px}.entry{display:flex;align-items:center;justify-content:space-between;font-size:13px;border-bottom:1px solid #edf0e6;padding:13px 0}.entry button{border:0;background:transparent;color:#927762;font-size:18px}.chips{display:flex;flex-wrap:wrap;gap:9px}.chips button{border:1px solid #e1e7d9;border-radius:20px;padding:9px 13px;background:#fafbf7;font-size:12px}.chips button.selected{background:#e6efcf;border-color:#b6cb83;color:var(--green)}.balance{background:var(--green);border-radius:22px;padding:27px;color:white}.balance small{color:#c9d9b1}.balance h2{font-size:25px}.energy{border-radius:50%;width:190px;height:190px;border:12px solid #638267;border-top-color:var(--lime);margin:27px auto;display:flex;flex-direction:column;justify-content:center;align-items:center}.energy span{font-size:40px;font-weight:500}.energy small{font-size:11px;letter-spacing:0}.macros{display:flex;justify-content:space-between;text-align:center}.macros b{font-size:19px;display:block;font-weight:500}.macros small{font-size:10px;letter-spacing:0}.balance p{font-size:11px;color:#d3dfc6;margin-top:23px}.balance #target{font-size:12px;color:var(--lime)}.tip{background:#e9edda;border-radius:20px;padding:25px;margin-top:20px}.tip>span{font-size:30px;color:#67814c}.tip h3{font-size:20px;font-weight:500;margin:9px 0}.tip p{font-size:13px;color:#69775c}.privacy{padding:0 14px}footer{display:flex;justify-content:space-between;gap:20px;font-size:11px;color:#8d9687;border-top:1px solid #e1e5d9;margin-top:42px;padding:20px 0}.profileform{max-width:550px;display:grid;gap:16px}.profileform label{display:grid;gap:6px;font-size:13px}.recipe{display:flex;gap:22px;align-items:center}.recipe-icon{background:#eff3e3;font-size:40px;padding:20px;border-radius:20px}.nutrition{font-size:12px;color:var(--green)}[hidden]{display:none!important}@media(max-width:1100px){aside{width:190px;padding:30px 18px}main{padding:25px}.grid{grid-template-columns:minmax(0,1fr) 255px}h1{font-size:39px}.card{padding:22px}.dish{flex-wrap:wrap}}@media(max-width:800px){aside{width:100%;height:auto;position:static;min-height:0;padding:18px;border-right:0}.shell{display:block}.brand{font-size:18px}.logo{padding:9px}.tag,.aside-note,.demo{display:none}nav{display:flex;margin-top:18px;gap:5px}nav button{flex:1;text-align:center;padding:10px 5px;font-size:12px}main{padding:15px 18px}header{font-size:8px;letter-spacing:1px}.grid{grid-template-columns:1fr}.right{display:grid;gap:15px;grid-template-columns:1fr 1fr}.tip{margin:0}.privacy{grid-column:1/-1}.heading{align-items:flex-start;flex-direction:column;gap:0}h1{font-size:36px;margin-top:24px}.datebox{width:100%}.datebox label{display:flex;align-items:center;justify-content:space-between}.card{padding:20px;border-radius:17px}.energy{width:150px;height:150px}.energy span{font-size:32px}.balance{padding:19px}.balance h2{font-size:21px}footer span{display:none}}@media(max-width:450px){.right{grid-template-columns:1fr}.energy{width:180px;height:180px}.dish{align-items:flex-start}.portions{margin-left:auto}.recipe{align-items:flex-start}.recipe-icon{padding:12px;font-size:28px}}
/* Touch layouts: keep the daily summary and navigation within easy reach. */
button:disabled{cursor:not-allowed;opacity:.55}
#ai-output{overflow-wrap:anywhere}
@media(max-width:800px){
 :root{--muted:#64705f}
 body{padding-bottom:calc(78px + env(safe-area-inset-bottom,0px))}
 aside{padding:16px 18px 8px}
 .brand{font-size:17px;line-height:1.15}
 .logo{font-size:20px;border-radius:12px;padding:10px 12px}
 nav{position:fixed;bottom:0;left:0;right:0;z-index:10;margin:0;padding:8px 12px calc(8px + env(safe-area-inset-bottom,0px));background:#fafcf5;border-top:1px solid #dce3d2;box-shadow:0 -4px 20px #23382e08;gap:5px}
 nav button{min-height:48px;font-size:13px;border-radius:12px;color:#4f654b}
 main{padding:8px 16px 16px}
 header{border:0;justify-content:flex-end;padding-bottom:0;min-height:34px;margin-top:-51px;margin-bottom:17px}
 header>span{display:none}
 #reward{font-size:11px;padding:8px 10px;max-width:155px}
 h1{font-size:32px;line-height:1.14;letter-spacing:-1px;margin:18px 0 12px}
 .heading p{font-size:14px;line-height:1.5;margin:0 0 16px;max-width:450px}
 .datebox label{font-size:13px;gap:12px}
 input,select{font-size:16px;min-height:46px;max-width:100%}
 .grid{gap:16px;margin-top:18px}
 .grid>div:first-child{order:2;min-width:0}
 .right{order:1;display:block;min-width:0}
 .right .tip,.right .privacy{display:none}
 .balance{padding:18px 20px;border-radius:18px;display:grid;grid-template-columns:112px minmax(0,1fr);column-gap:16px;align-items:center}
 .balance>small{grid-column:1/-1;font-size:10px}
 .balance h2{grid-column:1/-1;font-size:21px;margin:4px 0 10px}
 .energy{grid-column:1;width:auto;height:auto;border:0;border-radius:0;align-items:flex-start;margin:0;min-width:0}
 .energy span{font-size:34px;line-height:1.2}
 .energy small{font-size:11px;margin-top:4px}
 .macros{grid-column:2;gap:10px;min-width:0}
 .macros b{font-size:17px;white-space:nowrap}
 .macros small{font-size:10px}
 .balance p{grid-column:1/-1;font-size:12px;line-height:1.5;margin:15px 0 8px}
 .balance #target{grid-column:1/-1;font-size:12px}
 .card{padding:20px;margin-bottom:16px}
 h2{font-size:22px;line-height:1.25}
 .round{width:40px;height:40px;line-height:40px;flex-shrink:0;margin-left:8px}
 .toolbar{gap:12px;align-items:flex-end}
 .toolbar label{flex:1;min-width:0;font-size:13px;display:grid;gap:6px}
 .toolbar select{width:100%;font-size:14px;padding:10px 7px}
 .text-btn{min-height:44px;font-size:13px;padding:10px 5px}
 #eatall{flex-shrink:0;max-width:none;white-space:nowrap}
 .muted{font-size:14px;line-height:1.55}
 .dish{display:grid;grid-template-columns:1fr;gap:12px;padding:16px 0}
 .dish-title{font-size:16px;line-height:1.4;overflow-wrap:anywhere}
 .dish-meta{font-size:12px;line-height:1.5;color:#65715d}
 .issue{font-size:12px}
 .portions{width:100%;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:3px}
 .portions button{min-height:44px;font-size:14px;padding:10px 8px;color:#58664f}
 details{font-size:13px;line-height:1.5}
 summary{min-height:44px;align-content:center;padding:10px 0}
 #foodform{display:grid;grid-template-columns:minmax(70px,1fr) auto minmax(130px,1.5fr);gap:10px}
 #food{grid-column:1/-1;width:100%;min-width:0}
 #grams{width:100%}
 #foodform .primary{width:100%;padding:12px 10px}
 .primary{min-height:48px;font-size:15px;white-space:normal}
 .entry{font-size:14px;gap:10px}
 .entry>span{min-width:0;overflow-wrap:anywhere}
 .entry button{min-width:44px;min-height:44px;flex-shrink:0}
 .chips{gap:8px}
 .chips button{min-height:44px;font-size:14px;padding:10px 13px;text-align:left}
 .footnote{font-size:12px;line-height:1.6}
 .recipe{display:block}
 .recipe-icon{display:none}
 .recipe p{font-size:14px;line-height:1.6;overflow-wrap:anywhere}
 .nutrition{font-size:14px;line-height:1.7}
 #generate-ai{width:100%}
 #ai-status{font-size:13px;line-height:1.5;overflow-wrap:anywhere}
 #ai-output p{font-size:15px;line-height:1.6}
 .profileform label{font-size:14px;gap:7px}
 .profileform{gap:18px}
 footer{margin-top:26px;padding-bottom:16px}
}
@media(max-width:359px){
 aside{padding-left:14px;padding-right:14px}
 main{padding-left:12px;padding-right:12px}
 .brand{font-size:15px;gap:8px}.logo{font-size:18px;padding:9px}
 #reward{max-width:140px;font-size:10px;padding:8px}
 h1{font-size:29px}
 .card{padding:16px}
 .balance{padding:16px;grid-template-columns:92px minmax(0,1fr);column-gap:10px}
 .macros{gap:6px}.macros b{font-size:15px}
 .toolbar{gap:5px}#eatall{font-size:12px}
 nav{padding-left:7px;padding-right:7px}nav button{font-size:12px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
/* Give the useful content room; keep reference material behind disclosures. */
#balance-note:empty,#target:empty,#ai-status:empty,#ai-output:empty{display:none}
#ai-output{font-size:17px;line-height:1.6;margin-top:20px}
.ai-details{margin:0 0 18px;border-top:0;padding-top:0}
.ai-details p{max-width:620px}
.meal-reason{font-size:16px;line-height:1.6;color:#40543c}
.meal-parts{display:grid;gap:9px;margin:20px 0}
.meal-parts span{display:flex;justify-content:space-between;gap:20px;padding-bottom:8px;border-bottom:1px solid #edf0e6;font-size:15px}
.meal-parts b{white-space:nowrap;font-weight:500}
.picked-meal>div{width:100%}
.preferences{border:1px solid #dfe5d7;border-radius:12px;padding:14px 16px;display:grid;gap:10px}
.preferences legend{font-size:15px;padding:0 5px}
.profileform .preferences label{display:flex;align-items:center;gap:12px;min-height:44px;font-size:15px}
.preferences input[type=checkbox]{width:22px;height:22px;min-height:22px;accent-color:#285c47}
@media(max-width:800px){.meal-reason{font-size:16px}.meal-parts span{font-size:15px}.ai-details{font-size:14px}.nutrition{font-size:14px}.picked-meal small{font-size:11px}.balance{padding-bottom:20px}.heading p{display:none}}
.logo{padding:0;width:54px;height:54px;flex-shrink:0;display:block;overflow:hidden;border-radius:14px;background:#fff3d4}
.logo img{display:block;width:100%;height:100%;object-fit:cover;transform:scale(1.9);transform-origin:50% 51%}
.ai-answer{border:1px solid #b6cda2;background:#f0f5e6;box-shadow:0 5px 22px #285c4708}
.ai-answer-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.ai-answer-heading h2{margin:0;font-size:24px}
#ai-response-state{font-size:13px;color:#5e7054;background:#e2eacc;padding:6px 11px;border-radius:20px}
#ai-response-state.received{background:#285c47;color:white}
#ai-output{margin-top:20px;font-size:17px;line-height:1.65}
#ai-output p{margin:10px 0 18px}
#ai-output h3{font-size:18px;margin:23px 0 5px;font-weight:600}
#ai-output .ai-placeholder{color:#627456;font-size:16px;margin:0}
@media(max-width:800px){.logo{width:44px;height:44px;padding:0;border-radius:12px}.ai-answer-heading h2{font-size:22px}#ai-output{font-size:16px}#ai-output h3{font-size:17px}.ai-answer{padding:20px}}
@media(max-width:359px){.logo{width:40px;height:40px;padding:0}}
.professor-identity{display:flex;align-items:center;gap:16px;min-width:0;flex:1}
.professor-avatar{display:block;width:76px;height:76px;border-radius:20px;overflow:hidden;flex-shrink:0;background:#fff0cc}
.professor-avatar img{display:block;width:100%;height:100%;object-fit:cover;transform:scale(1.4);transform-origin:50% 50%}
.ai-answer-heading .professor-identity h2{font-size:23px;line-height:1.2}
@media(max-width:800px){.professor-avatar{width:64px;height:64px;border-radius:17px}.professor-identity{gap:13px}.ai-answer-heading .professor-identity h2{font-size:22px}.ai-answer-heading{align-items:center}.ai-answer-heading #ai-response-state{margin-left:77px;margin-top:-4px}}
@media(max-width:359px){.ai-answer-heading .professor-identity h2{font-size:20px}.professor-avatar{width:56px;height:56px}.ai-answer-heading #ai-response-state{margin-left:69px}}
.ai-answer-heading{display:grid;grid-template-columns:minmax(0,1fr) auto}
.ai-answer-heading #ai-response-state{justify-self:end}
@media(max-width:800px){.ai-answer-heading{grid-template-columns:minmax(0,1fr);gap:10px}.ai-answer-heading #ai-response-state{justify-self:start;margin:0 0 0 77px}.professor-identity{min-width:0}.ai-answer-heading .professor-identity h2{max-width:190px}}
@media(max-width:359px){.ai-answer-heading #ai-response-state{margin-left:69px}}
/* Preserve the supplied artwork, including the app tile's baked-in shadow. */
.logo{overflow:visible;background:transparent;border-radius:0}
.logo img{object-fit:contain;transform:none;border-radius:0}
.professor-avatar{background:transparent;border-radius:0;overflow:visible}
.professor-avatar img{object-fit:contain;transform:none;border-radius:0}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.chat-heading{display:flex;align-items:center;gap:13px;margin-bottom:18px}
.chat-heading img{object-fit:contain;flex-shrink:0}.chat-heading h2{margin:0 0 5px}.chat-heading p{margin:0;color:#66765e;font-size:14px}
#chat-messages{max-height:480px;overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:13px;padding:6px 3px 12px}
.chat-welcome{font-size:16px;line-height:1.6;color:#5c7050;margin:0 0 10px}
.chat-bubble{max-width:90%;border-radius:17px;padding:14px 17px;overflow-wrap:anywhere}
.chat-bubble strong{font-size:12px;font-weight:600}.chat-bubble p{white-space:pre-wrap;line-height:1.6;font-size:16px;margin:6px 0 0}
.from-user{align-self:flex-end;background:#285c47;color:#fff;border-bottom-right-radius:4px}.from-professor{align-self:flex-start;background:#edf3e2;border-bottom-left-radius:4px}
.chat-starters{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
.chat-starters button{background:#f5f7ed;border:1px solid #dce5ce;border-radius:22px;padding:10px 13px;color:#33573d;font-size:14px;min-height:44px}
#chat-form{display:flex;gap:10px;align-items:flex-end}#chat-input{resize:vertical;min-height:80px;max-height:200px;flex:1;min-width:0;font:16px/1.5 'Segoe UI',Arial,sans-serif;border:1px solid #cedbbc;border-radius:12px;padding:12px;color:#23382e;background:#fafcf7}
#chat-input:focus-visible{outline:3px solid #9bbd58;outline-offset:2px}
.chat-footer{display:flex;justify-content:space-between;align-items:center;gap:15px}.chat-footer p{font-size:14px;margin:12px 0}.chat-footer .text-btn{flex-shrink:0}
@media(max-width:800px){#chat-form{display:grid;grid-template-columns:1fr}#chat-send{width:100%}.chat-bubble{max-width:95%;padding:12px 14px}.chat-bubble p{font-size:16px}#chat-messages{max-height:420px}.chat-heading h2{font-size:22px}.chat-footer{align-items:flex-start}.chat-heading{align-items:flex-start}}
.chat-plan{width:100%;margin:12px 0 0}
.chat-recipes{display:grid;gap:12px;margin-top:17px}
.chat-meal{border-top:1px solid #cddcbb;padding-top:12px}.chat-meal h3{font-size:17px;line-height:1.4;margin:0 0 7px}.chat-meal .nutrition{font-size:14px}
.professor-chat #chat-messages{max-height:620px;min-height:150px}
@media(max-width:800px){.professor-chat #chat-messages{max-height:55dvh;min-height:150px}.chat-heading{align-items:center}.chat-heading h2{margin:0}}
#plan-answer{font-size:16px;line-height:1.65;white-space:pre-line}
#plan-status:empty{display:none}#plan-status{font-size:14px;margin-bottom:0}
.professor-chat{border-top:1px solid #e5e8dc;font-size:15px;color:var(--ink);padding:0;overflow:hidden}
.chat-toggle{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:22px 25px;font-size:20px;font-weight:600;cursor:pointer;list-style:none;min-height:64px}
.chat-toggle::-webkit-details-marker{display:none}
.chat-toggle-icon{font-size:25px;color:#476843;font-weight:400}
.professor-chat[open] .chat-toggle-icon{transform:rotate(45deg)}
.chat-body{padding:0 25px 20px}.professor-chat #chat-messages{min-height:0}
@media(max-width:800px){.chat-toggle{padding:20px;font-size:19px}.chat-body{padding:0 17px 17px}}
.meal-parts>span>span{display:block;border:0;padding:0;font:inherit;min-width:0}
#chat .professor-chat{padding:24px;overflow:visible}
#chat .chat-heading{margin-bottom:16px}
#chat .chat-body{padding:0}
#chat #chat-messages{max-height:55dvh;min-height:180px}
@media(max-width:800px){nav{gap:3px;padding-left:8px;padding-right:8px}nav button{font-size:12px;padding:10px 3px;min-width:0}#chat .professor-chat{padding:18px}#chat .chat-heading h2{font-size:21px}}
@media(max-width:359px){nav button{font-size:11px;padding-left:2px;padding-right:2px}}
@media(max-width:800px){nav button.professor-nav{white-space:normal;line-height:1.15;font-size:12px}}
@media(max-width:359px){nav button.professor-nav{font-size:11px}}
nav button.professor-nav{display:flex;align-items:center;gap:8px;line-height:1.3;font-size:15px;white-space:nowrap}
.professor-nav img{width:25px;height:25px;object-fit:contain;flex-shrink:0}
@media(max-width:800px){nav button.professor-nav{flex-direction:row;justify-content:center;gap:3px;font-size:12px;line-height:1.3;white-space:nowrap}.professor-nav img{width:21px;height:21px}}
@media(max-width:359px){nav button.professor-nav{font-size:11px;gap:2px}.professor-nav img{width:18px;height:18px}}
nav button.professor-nav{gap:8px;font-size:15px}
.lozhkin-ai-icon{width:20px;height:22px;flex-shrink:0;display:block}
@media(max-width:800px){nav button.professor-nav{gap:4px;font-size:12px}.lozhkin-ai-icon{width:16px;height:18px}}
@media(max-width:359px){nav button.professor-nav{gap:2px;font-size:11px}.lozhkin-ai-icon{width:14px;height:16px}}
@media(max-width:359px){nav button.professor-nav{font-size:10.5px;gap:2px}.lozhkin-ai-icon{width:12px;height:15px}}
nav button,nav button.professor-nav{font-size:15px;line-height:1.3}
@media(max-width:800px){nav button,nav button.professor-nav{font-size:12px;justify-content:center}}
@media(max-width:359px){nav button,nav button.professor-nav{font-size:11px}}
.portion-label{font-size:14px;color:#607252;line-height:1.5;margin:12px 0 0}.portion-label:empty{display:none}
@media(max-width:800px){.portions button{font-size:13px;padding-left:4px;padding-right:4px}}
@media(max-width:359px){.portions button{font-size:12px}}
.profileform textarea{font:16px/1.5 'Segoe UI',Arial,sans-serif;color:#23382e;background:#fafbf7;border:1px solid #dfe5d7;border-radius:9px;padding:12px;resize:vertical;width:100%;min-height:100px;max-height:250px}
.profileform textarea:focus-visible{outline:3px solid #9bbd58;outline-offset:3px}
.energy-estimate{padding:20px;background:#edf3e2;border-radius:15px;border:1px solid #d3dfc3}
.energy-estimate h3{font-size:18px;margin:0 0 10px}.energy-estimate #energy-suggestion{font-size:21px;font-weight:600;line-height:1.4;margin:0 0 15px}
.energy-caption{font-size:14px;line-height:1.5;color:#5b6d50;margin:15px 0 0}
/* One conversation window: fixed header, scrolling history, attached composer. */
#chat{padding-top:24px}
#chat .professor-chat{padding:0;overflow:hidden;display:flex;flex-direction:column;height:clamp(500px,calc(100dvh - 170px),850px);margin-bottom:0}
#chat .chat-heading{flex-shrink:0;margin:0;padding:16px 24px;border-bottom:1px solid #e0e7f3;background:#f8faff}
#chat .chat-heading h1{font-size:23px;font-weight:600;letter-spacing:-.5px;line-height:1.25;margin:0}
#chat .chat-heading img{width:52px;height:52px}
#chat .chat-body{display:flex;flex-direction:column;flex:1;min-height:0;padding:0}
#chat #chat-messages{flex:1;min-height:0;max-height:none;padding:22px 24px;scroll-padding-bottom:15px}
#chat .chat-composer{flex-shrink:0;border-top:1px solid #dfe7f5;background:#f8faff;padding:12px 20px 4px}
#chat .chat-starters{flex-wrap:nowrap;overflow-x:auto;margin:0 0 10px;padding:0 0 3px;gap:8px}
#chat .chat-starters button{white-space:nowrap;flex-shrink:0;background:white;color:#45638d;border-color:#dbe4f4}
#chat #chat-input{background:white;border-color:#d5e0f2;resize:none;min-height:60px;max-height:100px}
#chat .chat-footer{min-height:38px;gap:12px}#chat .chat-footer p{margin:6px 0;font-size:12px}
#chat #chat-clear{font-size:12px;min-height:38px;padding:6px 0;margin-left:auto}
@media(max-width:800px){#chat{padding-top:12px}#chat .professor-chat{height:calc(100dvh - 170px - env(safe-area-inset-bottom,0px));min-height:400px;padding:0;border-radius:16px}#chat .chat-heading{padding:12px 16px;gap:10px}#chat .chat-heading h1{font-size:21px}#chat .chat-heading img{width:42px;height:42px}#chat #chat-messages{padding:16px 13px}#chat .chat-composer{padding:10px 12px 3px}#chat #chat-form{display:flex;align-items:flex-end;gap:8px}#chat #chat-send{width:auto;min-height:58px;padding:12px 11px;font-size:13px}#chat #chat-input{font-size:16px;min-height:58px;padding:10px;line-height:1.4}#chat .chat-starters button{font-size:12px;min-height:40px;padding:8px 11px}.chat-bubble{max-width:95%}}
#chat{padding-top:0}
#chat .professor-chat{border:0;border-radius:0;background:transparent;box-shadow:none;height:calc(100dvh - 135px);margin:0;overflow:hidden}
#chat .chat-heading{background:transparent;padding:14px 0;border-bottom:1px solid #dfe7f3}
#chat #chat-messages{padding:20px 0}
#chat .chat-composer{background:transparent;padding:12px 0 0;border-top:1px solid #dfe7f3}
body:has(#chat:not([hidden])) footer{display:none}
@media(max-width:800px){body:has(#chat:not([hidden])){padding-bottom:calc(68px + env(safe-area-inset-bottom,0px))}#chat{padding-top:0}#chat .professor-chat{border:0;border-radius:0;box-shadow:none;background:transparent;padding:0;min-height:0;height:calc(100dvh - 145px - env(safe-area-inset-bottom,0px))}#chat .chat-heading{padding:8px 0 12px}#chat #chat-messages{padding:16px 0}#chat .chat-composer{padding:10px 0 0}}
#chat .chat-heading h1{flex:1;min-width:0}
#chat .chat-heading #chat-clear{margin:0 0 0 auto;align-self:center;white-space:nowrap;flex-shrink:0;min-height:44px;font-size:12px}
#chat .chat-footer:has(#chat-status:empty){display:none}
#chat .chat-composer{padding-bottom:0}
#chat #chat-form{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:stretch;gap:8px}
#chat #chat-input{box-sizing:border-box;height:60px;min-height:60px;max-height:60px;margin:0;align-self:stretch}
#chat #chat-send{box-sizing:border-box;width:auto;height:60px;min-height:60px;margin:0;align-self:stretch;display:flex;align-items:center;justify-content:center}
@media(max-width:800px){#chat .chat-heading{gap:8px}#chat .chat-heading h1{font-size:18px}#chat .chat-heading img{width:36px;height:36px}#chat .chat-heading #chat-clear{font-size:11px;padding:4px 0}#chat #chat-form{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:stretch}#chat #chat-send{padding:10px 12px;font-size:13px}#chat .professor-chat{height:calc(100dvh - 133px - env(safe-area-inset-bottom,0px))}body:has(#chat:not([hidden])) main{padding-bottom:0}}
@media(max-width:359px){#chat .chat-heading h1{font-size:16px}#chat .chat-heading img{width:30px;height:30px}#chat .chat-heading #chat-clear{font-size:10px}}
#chat .chat-starters{scrollbar-width:none}#chat .chat-starters::-webkit-scrollbar{display:none}
@media(max-width:800px){#chat .professor-chat{height:calc(100dvh - 161px - env(safe-area-inset-bottom,0px))}}