/* Miami — the app's own palette, so a link out of the store lands somewhere
   that is obviously the same product. */
:root { color-scheme: dark; }

body {
  margin: 0;
  background: #08090B;
  color: #D8DCE3;
  font: 16px/1.7 -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Helvetica, Arial, sans-serif;
}

.wrap { max-width: 720px; margin: 0 auto; padding: 46px 22px 90px; }

.rubric {
  font-size: 11px;
  letter-spacing: 2.4px;
  text-transform: uppercase;
  color: #8A6BF0;
  font-weight: 700;
}

h1 { font-size: 31px; margin: 8px 0 2px; color: #F2F4F7; letter-spacing: -0.4px; }
h2 { font-size: 18px; margin: 36px 0 8px; color: #D62B7F; letter-spacing: 0.2px; }

.eff { color: #9AA3AF; font-size: 13px; margin-bottom: 26px; }

.rule { height: 3px; margin-top: 14px; border-radius: 2px;
        background: linear-gradient(90deg, #D62B7F, #8A6BF0); }
.rule-thin { height: 1px; background: #1B1E23; margin: 3px 0 26px; }

a { color: #8A6BF0; text-decoration: none; border-bottom: 1px solid #2A2340; }
a:hover { color: #D62B7F; border-bottom-color: #D62B7F; }

ul { padding-left: 20px; }
li { margin: 6px 0; }
strong { color: #F2F4F7; }

.note {
  background: #141619;
  border: 1px solid #1B1E23;
  border-left: 3px solid #8A6BF0;
  border-radius: 10px;
  padding: 16px 18px;
  margin: 24px 0;
}

/* The medical disclaimer has to out-rank everything around it. */
.warn {
  background: #1A1013;
  border: 1px solid #3A1A28;
  border-left: 3px solid #D62B7F;
  border-radius: 10px;
  padding: 16px 18px;
  margin: 24px 0;
}

nav { margin-top: 46px; padding-top: 20px; border-top: 1px solid #1B1E23; }
nav a { margin-right: 18px; }

footer { margin-top: 34px; color: #5E6672; font-size: 13px; }