.mobile-only,.phone-tabs{display:none}
.spark-update{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-shrink:0;margin:8px 12px;padding:8px 12px;border:1px solid var(--line);border-radius:12px;background:var(--wash);color:var(--ink);font-size:13px}
.spark-update button{min-height:44px;white-space:nowrap}
#phone-dialog{max-width:440px;width:calc(100% - 32px);padding:25px;border:1px solid var(--line);border-radius:18px;color:var(--ink);background:var(--paper)}
#phone-dialog::backdrop{background:#102c2466}#phone-dialog p{font-size:14px}.chat-options{border:0;margin:0;padding:0}.chat-options[open] .row{padding:10px 0}.chat-options summary{min-height:40px;display:flex;align-items:center}
@media(max-width:700px){
 body{padding-bottom:calc(68px + env(safe-area-inset-bottom))}
 .sidebar{display:none}.phone-menu-open .sidebar{display:flex;position:fixed;inset:0 0 0 auto;width:min(85vw,320px);height:100dvh;z-index:40;box-shadow:-30px 0 80px #12281c44;padding:25px 20px 100px;overflow:auto}
 .phone-menu-open .sidebar nav{display:flex;flex-direction:column;overflow:visible}.phone-menu-open .sidebar nav a{min-height:44px}
 .mobile-only{display:inline-flex}.topbar{gap:8px;padding:8px 12px;height:auto;min-height:55px}.topbar #connection{flex:1;min-width:0;font-size:11px}.topbar #refresh{display:none}.topbar .session-actions{gap:5px}.topbar #session-clock{font-size:10px}.topbar #mobile-menu{min-width:44px;min-height:44px}
 .phone-tabs{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:30;justify-content:space-around;background:#fffefbf5;border-top:1px solid var(--line);padding:5px 8px calc(5px + env(safe-area-inset-bottom));gap:4px;backdrop-filter:blur(14px)}
 .phone-tabs a{flex:1;text-align:center;min-height:48px;display:flex;align-items:center;justify-content:center;padding:8px;font-size:13px}.phone-tabs a.active{background:var(--wash);color:var(--green)}
 .chat-page{padding:0;overflow:hidden}.chat-page .content{position:fixed;left:0;right:0;top:var(--phone-top,0px);height:var(--phone-height,100dvh);display:flex;flex-direction:column;padding-bottom:calc(64px + env(safe-area-inset-bottom))}
 .chat-page footer,.chat-page main>.intro,.chat-page .assistant-overview{display:none}.chat-page main{display:flex;flex-direction:column;flex:1;min-height:0;width:100%;padding:0 12px;overflow:hidden}.chat-page main>.list{flex:none;max-height:22vh;overflow:auto;margin:0}.chat-page main>.list:empty{display:none}
 .conversation-toolbar{padding:10px 0;flex-shrink:0;flex-wrap:nowrap;gap:8px}.conversation-toolbar select{flex:1;min-width:0;width:auto;font-size:14px;height:44px}.conversation-toolbar button{font-size:12px;min-height:44px}
 #chat-history{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:0 2px 16px;scroll-padding-bottom:15px;-webkit-overflow-scrolling:touch}.chat-message{border-radius:18px 18px 18px 4px;margin:12px 18px 12px 0;padding:14px 16px}.chat-message.user{border-radius:18px 18px 4px 18px;margin-left:32px;margin-right:0}.chat-message .copy{font-size:15px;line-height:1.55}.chat-message .eyebrow{font-size:9px;letter-spacing:1px}.chat-message.live-response{border-style:dashed}
 .chat-page .composer{position:relative;bottom:auto;flex-shrink:0;margin:0 0 8px;border-radius:18px;padding:10px 12px;box-shadow:0 -4px 20px #20352e08}.composer textarea{min-height:44px;max-height:160px;resize:none;border:0;padding:10px 4px;font-size:16px;background:transparent}.composer textarea:focus{outline:none}.composer:focus-within{border-color:var(--green)}.composer>.section-head{margin:0}.composer button[type=submit]{min-width:70px;min-height:44px;border-radius:12px}.chat-options summary{font-size:12px}.chat-options label.inline{font-size:12px}
 .chat-page #notice,.chat-page #error{flex-shrink:0;margin:5px 12px;font-size:12px;max-height:20vh;overflow:auto}.phone-keyboard .phone-tabs{display:none}.chat-page.phone-keyboard .content{padding-bottom:0}
}

@media(max-width:700px){.phone-tabs a{font-size:12px;padding:6px 4px}.chat-page #chat-history{min-height:0}.chat-page #end-session{font-size:11px;min-height:40px}}

@media screen and (prefers-color-scheme:dark){
  .phone-tabs{background:#16211bf5}
  .chat-page .composer{box-shadow:0 -4px 20px #0003}
  .phone-menu-open .sidebar{box-shadow:-30px 0 80px #0008}
  #phone-dialog::backdrop{background:#0009}
}

/* Private login form: phone-sized controls and no horizontal scrolling. */
#credential-vault{width:min(31rem,calc(100vw - 2rem));max-height:calc(100dvh - 2rem);overflow:auto;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:22px;box-sizing:border-box}
#credential-vault::backdrop{background:rgba(0,0,0,.55)}
#credential-vault header{display:flex;align-items:center;justify-content:space-between;gap:12px}
#credential-vault h2{margin:0}
#credential-vault .vault-site{font-weight:700;overflow-wrap:anywhere}
#credential-vault form{display:grid;gap:10px}
#credential-vault input{width:100%;box-sizing:border-box;min-height:48px;font-size:16px}
#credential-vault button{min-height:44px}
#credential-vault .actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
#credential-vault [hidden]{display:none!important}

#link-wallet-dialog{width:min(36rem,calc(100vw - 2rem));max-height:calc(100dvh - 2rem);overflow:auto;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:22px;box-sizing:border-box}
#link-wallet-dialog::backdrop{background:rgba(0,0,0,.55)}
#link-wallet-dialog header{display:flex;justify-content:space-between;gap:12px}#link-wallet-dialog button,#link-wallet-dialog a{min-height:44px}#link-wallet-dialog .actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px}#wallet-summary{white-space:pre-wrap}#link-wallet-dialog [hidden]{display:none!important}

/* Private website screens never enter the chat document or offline cache. */
#website-help{width:min(31rem,calc(100vw - 1rem));max-height:calc(100dvh - 1rem);overflow:auto;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:16px;box-sizing:border-box}
#website-help::backdrop{background:rgba(0,0,0,.6)}
#website-help header{display:flex;align-items:center;justify-content:space-between;gap:10px}
#website-help h2{font-size:1.5rem;margin:0}
#website-help .vault-site{font-weight:700;overflow-wrap:anywhere}
#website-help .actions{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
#website-help button{min-height:44px}
#website-help form{display:grid;gap:10px;margin:12px 0;padding:12px;border:1px solid var(--line);border-radius:12px}
#website-help input,#website-help select{width:100%;box-sizing:border-box;min-height:48px;font-size:16px}
#website-help-canvas{position:relative;width:100%;max-width:390px;aspect-ratio:390/640;margin:auto;overflow:hidden;background:#fff;border:1px solid var(--line)}
#website-help-screen{display:block;width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-select:none}
#website-help-controls{position:absolute;inset:0}
#website-help .website-help-control{position:absolute;background:transparent;border:0;border-radius:0;padding:0;min-height:0;min-width:0;box-shadow:none}
#website-help .website-help-control:focus-visible{outline:3px solid var(--accent);outline-offset:-3px}
#website-help [hidden]{display:none!important}

/* Keep the destination outside the website screenshot. */
.website-help-destination { border: 1px solid var(--line); border-radius: 12px; padding: 12px; margin: 12px 0; }
.website-help-destination .vault-site { overflow-wrap: anywhere; font-weight: 600; }

/* Version sits directly above the live connection status in the menu. */
.spark-version{font-size:11px;line-height:1.5;margin-bottom:8px;overflow-wrap:anywhere}
.phone-menu-open .sidebar-foot{display:block}
.spark-connection{display:inline-flex;align-items:center;gap:7px;font-size:12px}
.spark-connection::before{content:"";display:inline-block;flex-shrink:0;width:7px;height:7px;border-radius:50%;background:var(--red)}
.spark-connection[data-connected="true"]::before{background:#35825c}
@media(prefers-color-scheme:dark){.spark-connection[data-connected="true"]::before{background:#80cda5}.spark-connection[data-connected="false"]::before{background:#ef9690}}