/* Android screens share the data components, with a dedicated touch-first layout. */
.android-app {
  font-family: "Noto Sans CJK SC", "Noto Sans SC", sans-serif;
  color: #374036;
}

.android-app body,
.android-app #app,
.android-app .main-shell {
  width: 100%;
  min-width: 0;
}

.android-app .main-shell { margin: 0; }
.android-app .topbar { padding: 0 18px; height: 52px; }
.android-app .breadcrumb { font-size: 12px; }
.android-app .topbar-right { gap: 9px; }
.android-app #header-date { font-size: 10px; }
.android-app .topbar-right > span > .icon { display: none; }
.android-app .avatar.small { width: 34px; height: 34px; }
.android-app main { padding: 19px 16px 82px; }
.android-app .page-heading { gap: 10px; margin-bottom: 17px; }
.android-app .eyebrow { display: none; }
.android-app h1 { font-size: 24px; letter-spacing: 0; }
.android-app .page-heading p { font-size: 11px; line-height: 1.7; }
.android-app .page-heading > .primary-button {
  width: 42px;
  height: 42px;
  padding: 10px;
  flex-shrink: 0;
  border-radius: 50%;
  font-size: 0;
}
.android-app .page-heading > .primary-button .icon { width: 22px; height: 22px; }
.android-app .demo-banner { font-size: 10px; gap: 7px; padding: 10px; line-height: 1.6; }
.android-app .demo-banner > span { min-width: 0; }
.android-app .demo-banner button { font-size: 10px; flex-shrink: 0; }

.android-app .sidebar {
  position: fixed;
  inset: auto 0 0;
  width: 100%;
  height: 67px;
  padding: 5px 8px;
  border-right: 0;
  border-top: 1px solid #e8ebe5;
  background: #fff;
}
.android-app .sidebar .brand,
.android-app .workspace-label,
.android-app .sidebar-bottom,
.android-app .local-profile { display: none; }
.android-app .sidebar nav { display: flex; gap: 5px; margin: 0; width: 100%; }
.android-app .nav-item {
  flex: 1;
  min-width: 0;
  padding: 7px 3px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
}
.android-app .nav-item > span:not(.soon-dot) { display: block; font-size: 11px; }
.android-app .nav-item .icon { width: 21px; height: 21px; }
.android-app .soon-dot { display: none; }

.android-app .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
.android-app .stat-card { padding: 14px; border-radius: 13px; }
.android-app .stat-heading { font-size: 12px; }
.android-app .stat-value { font-size: 31px; line-height: 1.4; margin: 5px 0; }
.android-app .stat-caption { font-size: 10px; line-height: 1.6; flex-wrap: wrap; gap: 4px; }
.android-app .stat-icon { width: 28px; height: 28px; }
.android-app button.stat-icon { width: 34px; height: 34px; margin: -3px; }
.android-app .stat-caption .text-link { font-size: 10px; }
.android-app .dashboard-grid { display: flex; flex-direction: column; gap: 17px; }
.android-app .card { padding: 19px; border-radius: 14px; }
.android-app .card h2 { font-size: 17px; }
.android-app .card-heading p { font-size: 11px; line-height: 1.7; }
.android-app .heading-unit { display: none; }
.android-app .field-label,
.android-app .note-label { font-size: 12px; color: #727d68; }
.android-app .record-time { font-size: 11px; }
.android-app .weight-input { height: 64px; }
.android-app .weight-input input { font-size: 34px; }
.android-app .day-options { gap: 7px; }
.android-app .day-option > span { font-size: 11px; flex-direction: column; padding: 13px 2px 11px; gap: 8px; }
.android-app .day-option .icon { width: 22px; height: 22px; }
.android-app .day-option input { top: 6px; right: 6px; width: 8px; height: 8px; }
.android-app .note-input { font-size: 12px; height: 45px; }
.android-app .save-button { min-height: 48px; font-size: 14px; }
.android-app .entry-note { font-size: 10px; }
.android-app .entry-card { order: 0; }
.android-app .trend-card { order: 1; }
.android-app .calendar-card { order: 2; }
.android-app .distribution-card { order: 3; }
.android-app .history-card { order: 4; }
.android-app .insight-card { order: 5; }

.android-app .chart-wrap { min-height: 180px; }
.android-app .chart-legend { flex-wrap: wrap; font-size: 10px; gap: 10px; }
.android-app .chart-note { display: none; }
.android-app .segmented button { padding: 8px; font-size: 11px; }
.android-app .trend-footnote { font-size: 11px; line-height: 1.8; }
.android-app .chart-empty { min-height: 230px; }
.android-app .chart-empty strong { font-size: 13px; }
.android-app .chart-empty p, .android-app .chart-empty .text-link { font-size: 11px; }
.android-app .calendar-grid { gap: 3px; }
.android-app .calendar-day { min-height: 57px; }
.android-app .calendar-day > span { font-size: 13px; }
.android-app .calendar-day strong { font-size: 11px; }
.android-app .calendar-legend { gap: 12px; }
.android-app .calendar-legend > span { font-size: 10px; }
.android-app .calendar-toolbar .icon-button { width: 36px; height: 36px; }
.android-app .today-button { min-height: 34px; font-size: 11px; }
.android-app .selected-day { gap: 8px; flex-wrap: wrap; font-size: 11px; }
.android-app .badge { font-size: 10px; }
.android-app .distribution-body { flex-direction: row; gap: 20px; padding: 30px 0; }
.android-app .distribution-legend { flex: 1; gap: 17px; }
.android-app .distribution-legend > div { font-size: 11px; }
.android-app .kind-note { font-size: 11px; line-height: 1.6; }
.android-app .distribution-note { font-size: 10px; }
.android-app .history-card { padding: 19px 10px 10px; }
.android-app .history-card .card-heading { padding: 0 8px; }
.android-app .history-actions select { min-height: 36px; font-size: 11px; max-width: 91px; }
.android-app .export-button { min-height: 36px; font-size: 11px; }
.android-app .row-actions .icon-button { width: 34px; height: 38px; }
.android-app .row-actions .icon { width: 17px; height: 17px; }
.android-app .history-card table { min-width: 320px; }
.android-app .history-card th, .android-app .history-card td { padding-inline: 6px; }
.android-app .history-card th:nth-child(4), .android-app .note-cell { display: none; }
.android-app .table-time { font-size: 10px; }
.android-app td > strong { font-size: 11px; }
.android-app .insight-card { padding: 23px; }
.android-app .insight-card > p { font-size: 13px; }
.android-app .insight-button { min-height: 42px; font-size: 13px; }
.android-app .insight-source, .android-app .ai-details { font-size: 11px; }
.android-app footer { flex-direction: column; font-size: 10px; gap: 10px; }
.android-app #toast { bottom: 82px; font-size: 12px; }
.android-app dialog .icon-button { min-width: 42px; min-height: 42px; }

.android-app[data-view="overview"] .calendar-card,
.android-app[data-view="overview"] .history-card,
.android-app[data-view="overview"] .trend-card,
.android-app[data-view="overview"] .distribution-card,
.android-app[data-view="overview"] .insight-card { display: none; }

.android-app:not([data-view="overview"]) .page-heading { display: none; }
.android-app:not([data-view="overview"]) .entry-card { display: none; }

.android-app[data-view="calendar"] .stats-grid,
.android-app[data-view="calendar"] .trend-card,
.android-app[data-view="calendar"] .distribution-card,
.android-app[data-view="calendar"] .insight-card { display: none; }

.android-app[data-view="analysis"] .calendar-card,
.android-app[data-view="analysis"] .history-card,
.android-app[data-view="analysis"] .insight-card { display: none; }

.android-app[data-view="intelligence"] .stats-grid,
.android-app[data-view="intelligence"] .calendar-card,
.android-app[data-view="intelligence"] .history-card,
.android-app[data-view="intelligence"] .trend-card,
.android-app[data-view="intelligence"] .distribution-card { display: none; }

@media (max-width: 360px) {
  .android-app main { padding-inline: 12px; }
  .android-app h1 { font-size: 21px; }
  .android-app .topbar-right > span { display: none; }
  .android-app .demo-banner { align-items: flex-start; }
  .android-app .demo-banner button .icon { display: none; }
  .android-app .card { padding: 16px; }
  .android-app .distribution-body { gap: 12px; }
  .android-app .donut { width: 105px; height: 105px; }
  .android-app .donut > div { width: 80px; height: 80px; }
}