/* Your rules: Settings, its option pages (pushed like iOS), the dark appearance, the Pause sheet. */
.ru { background: #121214; }
.ru-theme { position: absolute; inset: 0; overflow: hidden; background: var(--a-canvas); }
.ru-d { visibility: hidden; }
.ru-set { position: absolute; inset: 0; --nav: 0; }
.ru-set::after { content: ""; position: absolute; inset: 0; background: #000; opacity: calc(var(--nav) * 0.1); pointer-events: none; }
.ru-opt { position: absolute; inset: 0; background: var(--a-canvas); box-shadow: -10px 0 24px rgba(0, 0, 0, 0.12); visibility: hidden; }
.ru-osb { position: absolute; left: 0; top: 0; width: 393px; }
.ru-nav { position: absolute; left: 0; top: 54px; width: 393px; height: 44px; display: flex; align-items: center; justify-content: center; }
.ru-nav span { position: absolute; left: 8px; top: 10px; display: flex; align-items: center; gap: 4px; font-size: 17px; color: var(--a-accent); }
.ru-nav span .sy { font-size: 20px; }
.ru-nav b { font-size: 17px; font-weight: 600; }
.ru-list { position: absolute; left: 22px; top: 122px; width: 349px; border-radius: 20px; overflow: hidden; background: var(--a-surface); box-shadow: 0 0 0 1px var(--a-border); }
.ru-o { --on: 0; height: 52px; display: flex; align-items: center; padding: 0 16px; font-size: 15px; font-weight: 600; box-shadow: inset 0 -1px 0 var(--a-border); }
.ru-o span { flex: 1; }
.ru-o i { font-size: 20px; color: var(--a-accent); opacity: var(--on); transform: scale(calc(0.5 + var(--on) * 0.5)); }
.ru-foot { position: absolute; left: 26px; top: 0; width: 341px; font-size: 13px; line-height: 1.36; color: var(--a-muted); }
.ru-ex .ru-foot { top: 238px; }
.ru-ap .ru-foot { top: 290px; }
.ru-dim { position: absolute; inset: 0; background: #000; opacity: 0; pointer-events: none; }

/* the Pause sheet (PauseSheet.swift), in the dark appearance */
.ru-psh { position: absolute; left: 0; top: 64px; width: 393px; height: 822px; visibility: hidden; border-radius: 34px 34px 0 0; background: #121214; color: #fff; }
.ru-pause { position: absolute; inset: 0; }
.ru-grab { position: absolute; left: 178.5px; top: 10px; width: 36px; height: 5px; border-radius: 3px; background: rgba(235, 235, 245, 0.3); }
.ru-pi { position: absolute; left: 158.5px; top: 33px; width: 76px; height: 76px; border-radius: 50%; display: grid; place-items: center; font-size: 30px; color: #f5a120; background: rgba(245, 161, 32, 0.18); }
.ru-pt { position: absolute; left: 0; right: 0; top: 123px; text-align: center; font-size: 28px; font-weight: 700; }
.ru-ps { position: absolute; left: 28px; right: 28px; top: 166px; text-align: center; font-size: 15px; line-height: 1.38; color: #8a8078; }
.ru-pb { position: absolute; left: 20px; top: 228px; width: 353px; display: flex; gap: 10px; padding: 14px; border-radius: 14px; font-size: 14px; line-height: 1.36; background: rgba(232, 117, 42, 0.08); box-shadow: inset 0 0 0 1px rgba(232, 117, 42, 0.24); }
.ru-pb .sy { color: #f5a120; font-size: 16px; margin-top: 1px; }
.ru-pl { position: absolute; left: 124.5px; top: 316px; width: 144px; height: 34px; border-radius: 17px; display: flex; align-items: center; justify-content: center; gap: 6px; font-size: 14px; font-weight: 600; color: #8a8078; background: #1c1c1e; }
.ru-pl .sy { font-size: 12px; }
.ru-pn { font-variant-numeric: tabular-nums; }
.ru-po { --live: 0; position: absolute; left: 20px; width: 353px; height: 66px; border-radius: 14px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; }
.ru-po b { font-size: 16px; font-weight: 600; color: color-mix(in srgb, #000 calc(var(--live) * 100%), #e6e6e6); }
.ru-po span { font-size: 12px; color: color-mix(in srgb, rgba(0, 0, 0, 0.6) calc(var(--live) * 100%), #a0a0a0); }
.ru-po1 { top: 364px; background: color-mix(in srgb, #f5a120 calc(var(--live) * 100%), #595959); }
.ru-po2 { top: 440px; background: color-mix(in srgb, #e53836 calc(var(--live) * 100%), #4d4d4d); }
.ru-po2 b { color: color-mix(in srgb, #fff calc(var(--live) * 100%), #e6e6e6); }
.ru-po2 span { color: color-mix(in srgb, rgba(255, 255, 255, 0.75) calc(var(--live) * 100%), #a0a0a0); }
.ru-pc { position: absolute; left: 146px; top: 712px; width: 101px; height: 36px; border-radius: 18px; display: grid; place-items: center; font-size: 16px; font-weight: 600; color: #8a8078; }