/* Resolves what happens when two apps' stylesheets meet.
 *
 * sleep.css and still.css were both lifted verbatim from apps that descend from
 * the same shell, so they declare 25 of the same selectors and 10 of those
 * differ. still.css loads second, so it won — and Sleep was quietly being
 * spaced like Still.
 *
 * ⚠ A CORRECTION IS RECORDED HERE ON PURPOSE. This file first claimed the
 * override had cost three FUNCTIONAL things: the iPhone notch inset on .topbar,
 * the overflow-x guard on .screen, and the min-width:0 flexbox guard on .stat.
 * That was wrong, and wrong because of a basic misreading of the cascade: when
 * two rules share a selector and specificity, the later one only wins for the
 * properties it actually DECLARES. All three of those are declared in sleep.css
 * and nowhere else, so none of them was ever at risk.
 *
 * What was genuinely overridden is nine properties, and every one is spacing:
 * .chip padding and font-size, .screen padding, .sheet max-height, .swatchrow
 * and .topbar margins, .topbar min-height. Real, worth fixing, and nothing to
 * do with the notch.
 *
 * The lesson worth keeping: diffing two stylesheets tells you which selectors
 * collide, not which properties do. Only the second question matters.
 *
 * Loaded LAST so it wins. Each domain keeps the spacing it was designed at.
 */

/* No "restore the guards" block here any more. overflow-x, min-width:0 and the
   safe-area inset live in sleep.css, are declared nowhere else, and were never
   overridden - see the correction above. Re-declaring them here would have been
   a fix for a problem that did not exist, and would have quietly spread Sleep's
   choices to every other domain as a side effect. */

/* ---- taste: each domain keeps the spacing it was designed at ---- */
.screen.dom-sleep{ padding:16px 20px calc(24px + var(--tabbar-h)); }
.screen.dom-still{ padding:20px 20px calc(32px + var(--tabbar-h)); }

.dom-sleep .chip{ padding:9px 14px; font-size:14.5px; }
.dom-still .chip{ padding:10px 16px; font-size:15px; }

.dom-sleep .topbar{ margin-bottom:14px; min-height:34px; }
.dom-still .topbar{ margin-bottom:18px; min-height:32px; }
.dom-sleep .sheet, #sleep-editor .sheet{ max-height:86vh; }

.dom-sleep .swatchrow{ margin-bottom:6px; }
.dom-still .swatchrow{ margin-bottom:20px; }

.dom-still .statrow{ margin:16px 0; }
.dom-still .segmented{ margin-bottom:8px; }

/* The settings sheet belongs to no domain now, so it gets the roomier of the
   two treatments — it is a long scrolling form, not a compact log screen. */
#settings-overlay .sheet{ max-height:86vh; }
#settings-overlay .swatchrow{ margin-bottom:12px; }