/* Presentation adjustments for the embedded browser demo. */
html{color-scheme:dark}
body{padding-top:0!important;min-width:280px}
[hidden]{display:none!important}
.demo-banner{position:sticky;top:0;z-index:30;background:#142c50;color:#fff;max-width:720px;margin:0 auto 18px;padding:14px 16px;border-radius:0 0 14px 14px;display:grid;grid-template-columns:1fr auto;gap:7px 12px;border:1px solid #ffffff20}
.demo-banner strong{display:block;font:700 18px/1.4 system-ui,sans-serif}
.demo-banner span{display:block;color:#c4f36a;font:600 10px/1.8 system-ui,sans-serif;letter-spacing:.7px}
.demo-banner p{grid-column:1/-1;margin:0;color:#d6e1f2;font:12px/1.5 system-ui,sans-serif}
.demo-banner button{align-self:center;padding:8px 10px;border:1px solid #ffffff45;background:transparent;color:#fff;border-radius:8px;font-size:13px;cursor:pointer;min-height:40px}
.demo-banner button:hover{background:#ffffff12}
.demo-loading{max-width:720px;margin:20px auto;line-height:1.6}
.page{min-height:0!important;padding-bottom:14px}
.input{font-size:16px!important}
.btn,.navBtn,.tile,.moodBtn,.pill,.iconBtn{cursor:pointer}
.label,.tileSub,.miniStatLabel,.tiny,.moodBtn span{font-size:14px!important}
.btn:focus-visible,.navBtn:focus-visible,.tile:focus-visible,.moodBtn:focus-visible,.input:focus-visible,button:focus-visible{outline:3px solid #7fadff;outline-offset:3px}
.grid{gap:10px}
.tile{min-height:105px}
.bottomNav{z-index:25;backdrop-filter:blur(14px)}
.navBtn{min-width:0;flex:1;padding-inline:4px;min-height:52px}
.summaryMiniGrid{gap:7px}
.miniStatValue{font-size:22px}
.historyItem,.summaryBox{overflow-wrap:anywhere}
@media(max-width:360px){body{padding-inline:10px}.card{padding:13px}.demo-banner{padding-inline:12px}.bottomNav{left:7px;right:7px;gap:3px;padding:7px}.moodBtn{padding:10px 6px}.tileTitle{font-size:14px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}