.body-composition{margin-top:18px}.body-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:20px 0}.body-tile{border:1px solid #34475f;background:linear-gradient(145deg,#1a2c43,#101d30);color:#dbe9fa;text-align:left;border-radius:16px;padding:15px 12px;min-height:116px;cursor:pointer;font:inherit;display:flex;flex-direction:column;gap:9px;min-width:0}.body-tile span{font-size:13px}.body-tile strong{font-size:19px;color:#fff;overflow-wrap:anywhere}.body-tile small{font-size:11px;color:#afc2d9}.body-tile[aria-pressed=true]{border-color:#7bd4dc;background:#1c354b}.body-tile:focus-visible,.exact-chart input:focus-visible{outline:3px solid #f6d58a;outline-offset:3px}.exact-chart{width:100%;min-width:0}.chart-readout{font-size:16px;font-weight:650;color:#f6d58a;min-height:48px;overflow-wrap:anywhere}.chart-surface{width:100%;touch-action:pan-y;user-select:none;overscroll-behavior-x:contain}.chart-surface svg{width:100%;display:block;height:auto}.chart-controls{display:flex;align-items:center;gap:10px;margin:10px 0}.chart-controls label{flex:1;min-width:0;font-size:12px}.chart-controls input{display:block;width:100%;min-height:44px;accent-color:#9edcfd;padding:0}.history-scroll{max-height:340px;overflow:auto}.history-scroll table{width:100%;border-collapse:collapse;font-size:12px;table-layout:fixed}.history-scroll td,.history-scroll th{padding:10px 7px;text-align:left;overflow-wrap:anywhere;border-bottom:1px solid #33475f}.history-scroll caption{text-align:left;padding:10px 0;color:#a8bfd9}.body-composition summary,.observation-history summary{min-height:44px;padding:12px 0;cursor:pointer}.body-composition select{width:100%;min-height:48px;font-size:16px}.readiness-row{grid-template-columns:1fr!important}#body-detail{scroll-margin-top:16px}#body-detail:focus{outline:none}#trends .formgrid>*{min-width:0}@media(min-width:768px){.body-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(min-width:1100px){.body-tiles{grid-template-columns:repeat(5,minmax(0,1fr))}}
.chart-surface,.chart-surface *{-webkit-user-select:none;user-select:none}
#trend-chart.chart.exact-chart{height:auto!important;min-height:0;max-height:none;overflow:visible}.exact-chart .chart-surface{min-height:0}#progress-saved-summary{margin-bottom:16px}#trend-comparison{margin-top:16px}
@media(max-width:360px){.body-tile{padding:13px 10px}.body-tile strong{font-size:15px;overflow-wrap:normal}.body-tile small{font-size:10px}}