.m-topbar,
.m-tabbar,
.m-sheet,
.m-backdrop,
.m-launch {
  display: none;
}
@media (max-width: 640px) {
  html.m-app,
  html.m-app body {
    height: 100%;
    overflow: hidden;
  }
  html.m-app header,
  html.m-app .breadcrumb,
  html.m-app .gs-intro,
  html.m-app .gs-menubar,
  html.m-app .gs-toolbar,
  html.m-app .gs-formula-bar,
  html.m-app .gs-status,
  html.m-app .gs-sheetbar,
  html.m-app .gs-examples,
  html.m-app .gs-cta-bar,
  html.m-app .gs-footer-note,
  html.m-app #faq,
  html.m-app footer,
  html.m-app .mobile-overlay {
    display: none !important;
  }
  html.m-app main {
    padding: 0 !important;
  }
  html.m-app .gs-shell {
    margin: 0;
    padding: 0;
    max-width: none;
  }
  html.m-app .gs-app {
    position: fixed;
    inset: 0;
    z-index: 60;
    display: flex;
    flex-direction: column;
    height: 100dvh;
    margin: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    background: #fff;
    -webkit-user-select: none;
    user-select: none;
    touch-action: manipulation;
  }
  html.m-app .gs-grid-wrap {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }
  html.m-app .m-topbar {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: calc(6px + env(safe-area-inset-top)) 8px 6px;
    background: #fff;
    border-bottom: 1px solid #dadce0;
    flex: 0 0 auto;
    -webkit-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
  }
  html.m-app .m-topbar .m-exit,
  html.m-app .m-topbar .m-iconbtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    min-width: 40px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #444;
    cursor: pointer;
  }
  html.m-app .m-topbar .m-exit:active,
  html.m-app .m-topbar .m-iconbtn:active {
    background: #e8f0fe;
  }
  html.m-app .m-namebox {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 52px;
    height: 36px;
    padding: 0 8px;
    border: 1px solid #c7c7c7;
    border-radius: 6px;
    font-family: Arial, sans-serif;
    font-size: 12px;
    color: #5f6368;
    background: #f8f9fa;
    white-space: nowrap;
  }
  html.m-app .m-fx {
    flex: 1 1 auto;
    min-width: 0;
    height: 36px;
    padding: 0 10px;
    border: 1px solid #c7c7c7;
    border-radius: 6px;
    font-family: Arial, sans-serif;
    font-size: 14px;
    color: #202124;
    background: #fff;
    -webkit-user-select: text;
    user-select: text;
    -webkit-touch-callout: default;
  }
  html.m-app .m-fx:focus {
    outline: 2px solid #1a73e8;
    outline-offset: 1px;
  }
  html.m-app .m-tabbar {
    display: flex;
    flex: 0 0 auto;
    background: #fff;
    border-top: 1px solid #dadce0;
    padding-bottom: env(safe-area-inset-bottom);
  }
  html.m-app .m-tab {
    flex: 1 1 0;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    min-height: 52px;
    border: 0;
    background: transparent;
    color: #5f6368;
    font-size: 11px;
    font-family: Roboto, Arial, sans-serif;
    cursor: pointer;
  }
  html.m-app .m-tab .material-icons {
    font-size: 22px;
  }
  html.m-app .m-tab[aria-selected="true"] {
    color: #1a73e8;
  }
  html.m-app .m-tab:active {
    background: #f1f3f4;
  }
  html.m-app .m-sheet {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 72;
    display: flex;
    flex-direction: column;
    max-height: 64dvh;
    background: #fff;
    border-radius: 16px 16px 0 0;
    box-shadow: 0 -4px 24px rgba(0, 0, 0, 0.18);
    transform: translateY(100%);
    transition: transform 0.22s ease;
    padding-bottom: env(safe-area-inset-bottom);
    overscroll-behavior: contain;
  }
  html.m-app .m-sheet.m-show {
    transform: translateY(0);
  }
  html.m-app .m-sheet-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px 10px;
    border-bottom: 1px solid #f1f3f4;
  }
  html.m-app .m-sheet-title {
    font-family: Roboto, Arial, sans-serif;
    font-size: 15px;
    font-weight: 700;
    color: #202124;
  }
  html.m-app .m-sheet-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: #5f6368;
    cursor: pointer;
  }
  html.m-app .m-sheet-body {
    overflow-y: auto;
    padding: 6px 0;
    -webkit-overflow-scrolling: touch;
  }
  html.m-app .m-row {
    display: flex;
    align-items: center;
    gap: 14px;
    width: 100%;
    min-height: 48px;
    padding: 0 18px;
    border: 0;
    border-bottom: 1px solid #f1f3f4;
    background: transparent;
    color: #202124;
    font-family: Roboto, Arial, sans-serif;
    font-size: 15px;
    text-align: left;
    text-decoration: none;
    box-sizing: border-box;
    cursor: pointer;
  }
  html.m-app .m-row:active {
    background: #e8f0fe;
  }
  html.m-app .m-row .material-icons {
    color: #5f6368;
  }
  html.m-app .m-row code {
    font-size: 13px;
    color: #1a73e8;
    overflow-wrap: anywhere;
  }
  html.m-app .m-backdrop {
    position: fixed;
    inset: 0;
    z-index: 71;
    background: rgba(32, 33, 36, 0.32);
    opacity: 0;
    transition: opacity 0.22s ease;
  }
  html.m-app .m-backdrop.m-show {
    opacity: 1;
  }
  html.m-exited .gs-app {
    position: static;
    height: auto;
  }
  html.m-exited .m-topbar,
  html.m-exited .m-tabbar,
  html.m-exited .gs-grid-wrap {
    display: none !important;
  }
  html:not(.m-app) .gs-menubar,
  html:not(.m-app) .gs-toolbar,
  html:not(.m-app) .gs-formula-bar,
  html:not(.m-app) .gs-status,
  html:not(.m-app) .gs-sheetbar,
  html:not(.m-app) .gs-examples {
    display: none !important;
  }
  html.m-exited .m-launch {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 28px 20px;
    text-align: center;
    font-family: Roboto, Arial, sans-serif;
    color: #5f6368;
  }
  html.m-exited .m-launch-try {
    width: 100%;
    margin-top: 6px;
    text-align: left;
  }
  html.m-exited .m-launch-try h4 {
    margin: 0 0 10px;
    font-size: 13px;
    font-weight: 700;
    color: #202124;
  }
  html.m-exited .m-launch-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
  }
  html.m-exited .m-launch-chip {
    min-height: 40px;
    padding: 6px 14px;
    border: 1px solid #dadce0;
    border-radius: 20px;
    background: #fff;
    color: #1a73e8;
    font-family: "Courier New", monospace;
    font-size: 12px;
    cursor: pointer;
  }
  html.m-exited .m-launch-chip:active {
    background: #e8f0fe;
  }
  html.m-exited .m-launch-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 52px;
    padding: 0 22px;
    border: 0;
    border-radius: 8px;
    background: #1a73e8;
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    font-family: Roboto, Arial, sans-serif;
    cursor: pointer;
  }
  html.m-exited .m-launch-btn:active {
    background: #1765cc;
  }
}
@media print {
  .m-topbar,
  .m-tabbar,
  .m-sheet,
  .m-backdrop,
  .m-launch {
    display: none !important;
  }
  html.m-app body {
    overflow: visible;
    height: auto;
  }
  html.m-app .gs-app {
    position: static;
    height: auto;
  }
  html.m-app .gs-menubar,
  html.m-app .gs-toolbar,
  html.m-app .gs-formula-bar,
  html.m-app .gs-status,
  html.m-app .gs-sheetbar {
    display: none !important;
  }
  html.m-app .gs-grid-wrap {
    overflow: visible !important;
    max-height: none !important;
  }
  html.m-app .gs-grid {
    min-width: 0 !important;
    width: 100% !important;
  }
}