/* Phone-only polish. Desktop styling and navigation stay in their original files. */
@media (max-width:650px) {
  html {scroll-padding-bottom:calc(90px + env(safe-area-inset-bottom,0px))}
  body {padding-bottom:calc(76px + env(safe-area-inset-bottom,0px))}
  body.mobile-menu-open {overflow:hidden}
  .topbar {padding:10px max(16px,env(safe-area-inset-right,0px)) 10px max(16px,env(safe-area-inset-left,0px));min-height:92px;gap:12px}
  .top-actions {min-width:0}
  #sidebar {position:fixed;inset:auto 0 0;z-index:15;width:100%;padding:6px max(8px,env(safe-area-inset-right,0px)) calc(6px + env(safe-area-inset-bottom,0px)) max(8px,env(safe-area-inset-left,0px));border:0;border-top:1px solid var(--line);background:var(--deep);box-shadow:0 -6px 22px #0003}
  #sidebar nav {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:4px}
  #sidebar .nav-item {min-width:0;min-height:56px;padding:5px 2px;justify-content:center;gap:3px;font-size:20px}
  #sidebar .nav-item span {font-size:11px;line-height:1.2}
  #sidebar .nav-item .mobile-plus {font-size:27px;line-height:23px;color:var(--gold)}
  #sidebar .nav-item:hover {transform:none}
  #main {padding:20px max(16px,env(safe-area-inset-right,0px)) 12px max(16px,env(safe-area-inset-left,0px));overflow-wrap:anywhere}
  .app-layout {min-height:calc(100dvh - 180px)}
  #main h1 {font-size:27px;line-height:1.2}
  #main h2 {font-size:18px;line-height:1.3}
  .auth-intro h1 {font-size:32px!important}
  .page-heading,.panel-title {flex-wrap:wrap;gap:12px;margin-bottom:18px}
  .page-heading>div,.panel-title>div {min-width:0}
  .panel {padding:16px;margin-bottom:16px;min-width:0}
  .grid-two,.form-grid,.review-layout {grid-template-columns:minmax(0,1fr);gap:16px}
  .form-grid {gap:0}
  input,select,textarea {font-size:16px;min-width:0;max-width:100%}
  #main input[type=file] {font-size:16px}
  input[type=file] {padding:10px 6px}
  label {min-width:0;line-height:1.5}
  button,summary,.upload label {min-height:44px}
  button {max-width:100%;white-space:normal}
  .check {align-items:center;min-height:44px}
  .folder {flex-wrap:wrap;padding:12px;gap:8px}
  .folder-name {flex-basis:calc(100% - 44px)}
  .folder>.chip {margin-left:34px}
  .folder>button {margin-left:auto}
  .filter-row {align-items:center;gap:10px}
  .filter-row select {max-width:100%}
  .card-tile .info {padding:10px;overflow-wrap:anywhere}
  .card-tile strong {font-size:14px;line-height:1.4}
  .card-tile small {font-size:12px;line-height:1.5}
  .card-controls button,.card-controls select {min-height:44px;font-size:14px}
  .card-controls select {font-size:16px}
  .card-photo img {max-width:100%;height:auto}
  .card-photo:hover {transform:none}
  .card-grid {gap:12px}
  .card-controls label {margin-bottom:4px}
  .upload {padding:20px 12px}
  .upload label {display:block;margin:10px 0;padding:12px}
  .review-layout .card-photo {max-width:300px;margin:auto}
  .social-panel>.panel-title {margin:-16px -16px 16px}
  .feed-post>p,.chat-message-content p,.community-post-body {font-size:14px;line-height:1.65}
  .feed-author {max-width:100%;min-width:0}
  .feed-author>span:last-child {min-width:0}
  .social-item-heading {align-items:flex-start;row-gap:8px}
  .feed-post button,.event-item button {min-height:44px;font-size:13px}
  .event-editor summary {padding:12px 0}
  .profile-top-grid {gap:16px}
  .compact-profile .panel-title {margin:0;padding:10px 12px}
  .compact-profile .panel-title h2 {font-size:16px!important}
  .compact-profile .profile-body {padding:16px}
  .compact-profile .profile-intro .status,.compact-profile .profile-about .bio {font-size:14px}
  .compact-profile .profile-intro .hint {font-size:12px}
  .compact-profile .profile-identity-row .avatar {width:88px;height:106px}
  .people-bench {gap:8px}
  .people-bench-panel,.compact-profile .profile-about {padding:0}
  .bench-person strong,.bench-caption {font-size:11px}
  .bench-person small {font-size:10px}
  .people-bench-panel .panel-title button {min-height:44px;padding:8px}
  .profile-community-grid {grid-template-columns:minmax(0,1fr)}
  .profile-community {min-height:64px}
  #live-chat .chat-messages {height:clamp(220px,42dvh,380px)}
  .chat-message-heading button {min-height:44px;font-size:12px;padding:8px}
  .chat-compose-footer {align-items:flex-start;flex-wrap:wrap}
  .chat-compose-footer button {margin-left:auto;min-width:80px}
  .chat-compose-footer small {font-size:11px;flex:1;min-width:140px}
  .chat-body textarea {min-height:88px}
  .community-tabs {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px}
  .community-tabs>[role=tab] {white-space:normal;font-size:13px;min-height:48px}
  .community-tabs small {font-size:9px}
  .community-search {grid-template-columns:minmax(0,1fr)}
  .community-search>label:first-child {grid-column:auto}
  .community-search input,.community-search select {font-size:16px}
  .community-profile-body {padding:20px 16px}
  .community-member>div {min-width:0}
  .community-post .feed-author {gap:8px}
  .community-post .feed-author strong {min-width:0;overflow-wrap:anywhere}
  #toast {bottom:calc(86px + env(safe-area-inset-bottom,0px));width:max-content;max-width:calc(100% - 32px)}
  #photoDialog {font:inherit;width:calc(100vw - 24px);max-width:calc(100vw - 24px);height:90dvh;max-height:calc(100dvh - 24px)}
  #photoDialog .dialog-toolbar {padding:8px;gap:6px;flex-wrap:wrap}
  #photoDialog .dialog-toolbar button {min-width:44px;min-height:44px;font-size:12px}
  #photoDialog.saved-card-detail #photoScroll {padding:16px;overscroll-behavior:contain}
  #savedCardInfo {font-size:14px}
  #mobileMenu {position:fixed;inset:auto 0 calc(12px + env(safe-area-inset-bottom,0px));width:calc(100% - 24px);max-width:440px;height:auto;max-height:calc(100dvh - 32px - env(safe-area-inset-bottom,0px));margin:0 auto;background:var(--surface);color:var(--bone);border:1px solid var(--line);border-radius:16px;box-shadow:0 8px 32px #0006}
  #mobileMenu::backdrop {background:#100b15c9}
  .mobile-menu-heading {display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line);flex-shrink:0}
  .mobile-menu-heading h2 {margin:0;font-size:18px;color:var(--gold)}
  .mobile-menu-heading button {width:44px;padding:8px}
  .mobile-menu-body {overflow:auto;overscroll-behavior:contain;padding:16px;min-height:0}
  .mobile-menu-body section+section {margin-top:20px}
  .mobile-menu-body h3 {font-size:12px;color:var(--muted);margin-bottom:8px}
  .mobile-menu-links {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  #mobileMenu .nav-item,#mobileMenu .quiet {display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:8px;min-height:48px;padding:10px;font-size:16px;text-align:left;border:1px solid var(--line);border-radius:8px}
  #mobileMenu .nav-item span,#mobileMenu .quiet {font-size:13px;white-space:normal;overflow-wrap:anywhere}
  footer {padding:16px;line-height:1.8;overflow-wrap:anywhere}
}