/* v6.9.191 — the tool landing pages (/tools/…) and the ICM page's new sections (PP_Tool_Landing). Loaded on those pages only,
   in the plugin-CSS slot (after pokerpath.css, before the theme). No script. Phone first: 380 px, no sideways scroll,
   tap targets at least 44 px. The site's navy background; text in light colours with readable contrast. */

.pp-tl { max-width: 760px; margin: 0 auto; padding: 16px; box-sizing: border-box; color: #e6edf3; font-size: 16px; line-height: 1.55; overflow-wrap: anywhere; }
.pp-tl-crumbs { max-width: 760px; margin: 0 auto; padding: 8px 16px 0; box-sizing: border-box; font-size: 13px; }
.pp-tl .pp-tl-crumbs { padding: 0 0 8px; }
.pp-tl-crumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0 6px; color: #9fb3c8; }
.pp-tl-crumbs li + li::before { content: "\203A"; margin-right: 6px; color: #9fb3c8; }
.pp-tl-crumbs a { display: inline-flex; align-items: center; min-height: 44px; color: #04CE78; }
.pp-tl-crumbs li[aria-current] { display: inline-flex; align-items: center; min-height: 44px; }
.pp-tl-h1 { margin: 4px 0 12px; font-size: 28px; line-height: 1.2; color: #ffffff; }
.pp-tl h2 { margin: 24px 0 8px; font-size: 20px; line-height: 1.3; color: #ffffff; }
.pp-tl h3 { margin: 16px 0 4px; font-size: 16px; color: #ffffff; }
.pp-tl p { margin: 0 0 12px; }
.pp-tl a { color: #04CE78; }
.pp-tl-lead { font-size: 17px; color: #e6edf3; }
.pp-tl-pill { display: inline-block; padding: 4px 12px; border-radius: 14px; background: #0f3d3f; color: #e9c46a; font-size: 13px; font-weight: 700; }
.pp-tl-cta { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 20px; }
.pp-tl-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 16px; border-radius: 10px; border: 2px solid #04CE78;
    color: #04CE78; font-weight: 700; text-decoration: none; box-sizing: border-box; }
.pp-tl a.pp-tl-btn-primary, .pp-tl-btn-primary { background: #e9c46a; border-color: #e9c46a; color: #0f1623; }
.pp-tl-btn:focus-visible { outline: 3px solid #ffffff; outline-offset: 2px; }

.pp-tl-example { margin: 20px 0; padding: 16px; border-radius: 14px; background: #0f3d3f; border: 1px dashed #e9c46a; }
.pp-tl-example h2 { margin-top: 0; }
.pp-tl-tag { display: inline-block; margin: 0 0 8px; padding: 2px 10px; border-radius: 10px; background: #e9c46a; color: #0f1623; font-size: 12px; font-weight: 800; letter-spacing: .08em; }
.pp-tl-rows { list-style: none; margin: 0 0 12px; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.pp-tl-rows li { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px; background: #0b3133; }
.pp-tl-rows li em { display: block; font-style: normal; font-size: 13px; color: #b7d3cf; }
.pp-tl-v { flex: 0 0 auto; padding: 2px 10px; border-radius: 10px; font-size: 13px; }
.pp-tl-v-safe { background: #d1fae5; color: #065f46; }
.pp-tl-v-controlled_shot { background: #fef3c7; color: #92400e; }
.pp-tl-v-too_expensive { background: #fee2e2; color: #991b1b; }
.pp-tl-pin { color: #e9c46a; font-size: 12px; }
.pp-tl-bar-l { margin: 0 0 4px; font-size: 14px; }
.pp-tl-bar { height: 10px; border-radius: 5px; background: #0b3133; overflow: hidden; }
.pp-tl-bar span { display: block; height: 100%; background: #04CE78; width: 0; }
.pp-tl-bar .pp-tl-bar-10 { width: 10%; } .pp-tl-bar .pp-tl-bar-20 { width: 20%; } .pp-tl-bar .pp-tl-bar-30 { width: 30%; }
.pp-tl-bar .pp-tl-bar-40 { width: 40%; } .pp-tl-bar .pp-tl-bar-50 { width: 50%; } .pp-tl-bar .pp-tl-bar-60 { width: 60%; }
.pp-tl-bar .pp-tl-bar-70 { width: 70%; } .pp-tl-bar .pp-tl-bar-80 { width: 80%; } .pp-tl-bar .pp-tl-bar-90 { width: 90%; }
.pp-tl-bar .pp-tl-bar-100 { width: 100%; }
.pp-tl-ss { margin: 0 0 12px; }
.pp-tl-ss-h { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-weight: 700; }
.pp-tl-ss-h b { font-size: 24px; color: #e9c46a; }
.pp-tl-steps { margin: 0; padding-left: 20px; }
.pp-tl-steps li { margin-bottom: 12px; }
.pp-tl-step-h { font-weight: 600; }
.pp-tl-quote { padding-left: 12px; border-left: 3px solid #e9c46a; }
.pp-tl-list { margin: 0 0 8px; padding-left: 20px; }
.pp-tl-alert { padding: 12px; border-radius: 10px; background: #0b3133; }
.pp-tl-alert-n { margin: 0; font-size: 20px; font-weight: 700; color: #ffffff; }
.pp-tl-small { font-size: 14px; color: #b7d3cf; }
.pp-tl-scroll { overflow-x: auto; max-width: 100%; }
.pp-tl-table { width: 100%; border-collapse: collapse; font-size: 15px; }
.pp-tl-table th, .pp-tl-table td { padding: 8px; text-align: left; border-bottom: 1px solid #1f4f50; }
.pp-tl-table td { white-space: nowrap; }

.pp-tl-cards { list-style: none; margin: 16px 0; padding: 0; display: grid; grid-template-columns: 1fr; gap: 12px; }
.pp-tl-card { padding: 16px; border-radius: 14px; background: #0f3d3f; }
.pp-tl-card h2 { margin: 0 0 6px; font-size: 18px; }
.pp-tl-card-links { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 0; }
.pp-tl-next ul { margin: 0; padding-left: 20px; }
.pp-tl-next li { min-height: 44px; display: list-item; line-height: 44px; }
.pp-tl-growth { margin-top: 20px; padding: 12px; border-radius: 10px; background: #0f3d3f; font-weight: 600; }
.pp-tl-legal { margin-top: 16px; font-size: 13px; color: #9fb3c8; }
.pp-tl-legal a { display: inline-flex; align-items: center; min-height: 44px; }

@media (min-width: 700px) {
    .pp-tl-cards { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 400px) {
    .pp-tl { padding: 12px; }
    .pp-tl-h1 { font-size: 24px; }
    .pp-tl-btn { flex: 1 1 100%; }
}

/* the tournament page's two new boxes (class-pp-tournament-detail.php): light card theme */
.pp-td-next, .pp-td-plan { margin: 16px 0; padding: 14px 16px; border-radius: 12px; background: #f8fafc; border: 1px solid #e5e7eb; color: #111827; }
.pp-td-next h2, .pp-td-plan h2 { margin: 0 0 8px; font-size: 17px; color: #111827; }
.pp-td-next ul, .pp-td-plan ul { list-style: none; margin: 0; padding: 0; }
.pp-td-next li, .pp-td-plan li { min-height: 44px; display: flex; flex-wrap: wrap; align-items: center; gap: 0 8px; }
.pp-td-next li span { font-size: 13px; color: #4b5563; }
.pp-td-next a, .pp-td-plan a, .pp-td-next-all { color: #047857; font-weight: 600; }
.pp-tools-line { margin: 16px 0; font-size: 14px; }
.pp-tools-line a { display: inline-flex; align-items: center; min-height: 44px; margin-right: 12px; }