/* Phone structure measured against ChatGPT/Claude mobile web, 2026-10-05.
   Existing identity and desktop geometry remain the source of style. */
@media (max-width:1023px) {
  .shell {height:var(--app-height,100dvh);padding-top:env(safe-area-inset-top,0px);padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}
  dialog:not(.drawer) {max-height:calc(var(--app-height,100dvh) - 32px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px))}
  .drawer {height:var(--app-height,100dvh);max-height:var(--app-height,100dvh)}
  .drawer-layout {padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
  .workspace-composer {padding-bottom:max(12px,env(safe-area-inset-bottom,0px))}
  .focus-select,.notes-input,dialog .field input,dialog .field select,dialog .field textarea {font-size:16px;line-height:24px}
  .pc1-conversation .pc1-facts dd,.pc1-conversation .pc1-knowledge p,.pc1-conversation .pc1-note p,.pc1-conversation .pc1-provider-card dl,.pc1-conversation .pc1-cost th,.pc1-conversation .pc1-cost td,.pc1-conversation .pc1-open-costs,.pc1-conversation .pc1-timeline p {font-size:16px;line-height:24px}
  .pc1-conversation .pc1-facts dt {font-size:14px;line-height:20px}
}
@media(min-width:600px) and (max-width:1023px) {
  .pc1-comparison .pc1-desktop-breakdown,.pc1-comparison .pc1-card-foot,.pc1-budget-card .pc1-desktop-breakdown {display:none}
  .pc1-comparison>.pc1-phone-only,.pc1-conversation .pc1-phone-details {display:block}
  .pc1-provider-scope .pc1-phone-only {display:inline}
  .pc1-conversation .pc1-phone-details summary {font-size:16px;line-height:24px}
  .pc1-conversation .pc1-phone-details[open]>div {padding-top:12px}
  .pc1-comparison .pc1-provider-scope {font-size:16px;line-height:24px}
  .pc1-comparison .pc1-card-foot,.pc1-comparison .pc1-caption {font-size:14px;line-height:20px}
}
@media (max-width:599px) {
  body:has(#public-view[hidden]) {overflow:hidden}
  .shell {height:calc(var(--app-height,100dvh) - var(--footer-height,0px))}
  #prototype-footer.public-footer {max-height:calc(var(--app-height,100dvh)*.35);overflow:auto;overscroll-behavior:contain}
  #prototype-footer .public-footer-inner {padding-top:4px;padding-bottom:max(4px,env(safe-area-inset-bottom,0px))}
  #prototype-footer .public-footer-note {margin-top:0;font-size:14px!important;line-height:20px!important}
  .footer-note-full {display:none}
  .public-footer .footer-note-phone {display:inline}
  .topbar {padding-inline:8px;gap:4px}
  .top-left,.top-actions {gap:4px}
  .topbar .brand {display:flex}
  .workspace .topbar .brand {display:none}
  .workspace .conversation-title {display:block;flex:1;max-width:none;font-size:16px;line-height:24px}
  .workspace:not(.signed-in) .conversation-title {display:block}
  .topbar .mobile-new {order:3}
  .topbar .plan-status {display:none}
  .topbar [data-action=signup] {display:flex;align-items:center;padding-inline:8px}
  .header-signup-full {display:none}
  .topbar .header-signup-short {display:inline}
  .guest-main {margin:0 auto;min-height:100%;padding:16px 0 max(12px,env(safe-area-inset-bottom,0px));flex:1}
  .welcome {order:1;margin-block:auto;padding-block:24px}
  .welcome p {font-size:16px;line-height:24px;margin-top:12px}
  .capabilities {order:2;margin-top:0;margin-bottom:16px}
  .capability {min-height:44px;font-size:16px;line-height:24px;gap:12px;padding:8px 12px}
  #guest-composer {order:3;margin-top:0;flex:none;position:sticky;bottom:0;background:var(--canvas);z-index:1}
  .composer,.composer.multiline {grid-template-columns:44px minmax(0,1fr) 88px;padding:3px;border-radius:var(--radius);min-height:88px}
  .composer textarea,.composer.multiline textarea {grid-column:1/-1;grid-row:1;min-height:36px;height:36px;padding:5px 12px;font-size:16px;line-height:26px}
  .composer .composer-attach {grid-column:1;grid-row:2}
  .composer .composer-right {grid-column:3;grid-row:2}
  .thread {padding:16px;scroll-padding-bottom:64px}
  .decision-card p,.decision-card li,.clarification-copy {font-size:16px;line-height:24px}
  .focus-select,.notes-input,dialog .field input,dialog .field select,dialog .field textarea {font-size:16px;line-height:24px}
  /* The unused toolbar center keeps Latest reachable without covering answer text. */
  .jump-latest {position:absolute;right:auto;left:calc(50% - 22px);bottom:max(16px,calc(env(safe-area-inset-bottom,0px) + 4px));margin:0;z-index:2;box-shadow:none}
  .workspace-composer {padding-top:8px}
  .pc1-intro-desktop {display:none!important}
  .pc1-intro-phone {display:inline}
  details.pc1-intro-phone {display:block}
  .pc1-story-intro:focus {outline:none}
  body[data-input-mode=keyboard] .pc1-story-intro:focus h1 {outline:2px solid var(--focus);outline-offset:4px;border-radius:var(--radius)}
}
.pc1-intro-phone {display:none}
.header-signup-short {display:none}
.footer-note-phone {display:none}
.pc1-story-intro:focus {outline:none}
body[data-input-mode=keyboard] .pc1-story-intro:focus h1 {outline:2px solid var(--focus);outline-offset:4px;border-radius:var(--radius)}
@media(max-width:599px) {.pc1-intro-phone {display:inline} details.pc1-intro-phone {display:block}}
@media(max-width:359px) {
  .topbar {padding-inline:4px}
  .topbar .brand {width:96px}
  .topbar .brand-wordmark {transform:scale(.827586);transform-origin:left center}
  .topbar .top-actions [data-action=login] {padding-inline:8px}
}
@media(prefers-reduced-motion:reduce) {
  .composer,.jump-latest {transition:none;animation:none}
}

/* Sidebar header measured from Claude; retain the 44px history target. */
#desktop-nav .nav-top,#mobile-nav .nav-top {height:48px;min-height:48px;padding:2px;gap:0;margin-bottom:4px}
#desktop-nav .nav-top .brand,#mobile-nav .nav-top .brand {width:74.8387px;height:20px;transform:translateY(-1px)}
#desktop-nav .nav-top .brand-wordmark,#mobile-nav .nav-top .brand-wordmark {width:74.8387px;height:20px;background-position:-11.329px -9.277px;background-size:170.723px 43.903px}

/* Compact controls measured directly from Claude, 5 October 2026.
   Claude app: 32px / 8px radius / 13px-17px type / 6px gap / 8px inset.
   Claude public account CTA: 36px / 8px radius / 15px type / 16px inset. */
.guest-main .capabilities {display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;margin-top:24px}
.guest-main .capability {flex:0 0 auto;width:auto;min-width:0;min-height:32px;height:32px;max-width:100%;padding:0 8px;gap:6px;border:1px solid var(--border);border-radius:var(--radius);background:transparent;font-size:13px;line-height:17px;text-align:center;justify-content:center}
.guest-main .capability svg {width:14px;height:14px;flex:none}
.guest-main .capability:hover:not(:disabled) {background:var(--paper);border-color:#a6bce7}
.top-actions [data-action=login],.top-actions [data-action=signup],.nav-bottom [data-action=login],.public-header-actions [data-public-action=auth] {display:inline-flex;align-items:center;justify-content:center;width:auto;min-height:36px;height:36px;padding:0 16px;border-radius:var(--radius);font-size:15px;line-height:15px}
.nav-bottom [data-action=login] {margin-left:46px}
@media(max-width:599px) {
 .guest-main .capabilities {margin-top:0;margin-bottom:12px;gap:12px 8px}
 .guest-main .capability {min-height:36px;height:auto;flex:0 0 calc(50% - 4px);padding:2px 8px;gap:6px;position:relative}
 .guest-main .capabilities {align-items:stretch;gap:8px}
 .guest-main .capability::after {content:"";position:absolute;inset:-3px 0}
 .cookie-banner-open .welcome {padding-block:8px}
 #prototype-footer .public-footer-inner {padding:0 8px env(safe-area-inset-bottom,0px)}
 .topbar [data-action=signup],.topbar [data-action=login] {padding-inline:12px}
}
