.tp-rule { position: relative; padding: 26px 22px 20px; }
.tp-rule > .sticker { position: absolute; right: -10px; top: -16px; }
.tp-rule-h { margin: 0; font: 800 1.6rem/1.05 var(--display); font-variation-settings: "wdth" 84; font-stretch: 84%; letter-spacing: -.02em; }
.tp-rule .check-list b { color: var(--ink); }
.tp-kind { margin: 30px 0 12px; }
.tp-kind:first-of-type { margin-top: 0; }
.tp-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 16px; }
.tp { display: flex; flex-direction: column; gap: 8px; padding: 18px; }
.tp h4 { margin: 0; font: 800 1.35rem/1.05 var(--display); font-variation-settings: "wdth" 84; font-stretch: 84%; letter-spacing: -.02em; }
.tp > p { margin: 0; color: var(--brown); font-size: .95rem; }
.tp dl { margin: auto 0 0; padding-top: 8px; border-top: 1.5px dashed var(--stone); display: grid; gap: 4px; }
.tp dl > div { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 8px; font-size: .88rem; }
.tp dt { font: 600 10.5px/1.6 var(--mono); text-transform: uppercase; letter-spacing: .06em; color: var(--brand-text); }
.tp dd { margin: 0; }
.tp::after { content: "Installs as drafts"; align-self: flex-start; margin-top: 6px; font: 600 10.5px/1 var(--mono); text-transform: uppercase; letter-spacing: .06em; padding: 5px 8px; border: 1.5px dashed var(--muted); border-radius: 99px; color: var(--muted); }
.tp-note { margin-top: 22px; }
@media (max-width: 480px) { .tp dl > div { grid-template-columns: 96px minmax(0, 1fr); } }