.feature-section{padding-bottom:100px}.feature-row{display:grid;grid-template-columns:1fr 1.15fr;gap:70px;align-items:center;margin-bottom:100px}.feature-copy .eyebrow,.badge-heading .eyebrow{color:var(--orange);margin-bottom:22px}.feature-copy h2{font-size:clamp(3.2rem,5.4vw,5.6rem);margin-bottom:28px}.feature-copy>p:not(.eyebrow){max-width:450px;margin-top:18px;font-size:16px}.feature-note{color:#a7a79f;font-size:13px!important;display:block;margin-top:20px}.demo-panel{border:1px solid #41413a;background:#191a17;box-shadow:0 24px 70px #0003;min-width:0}.panel-heading{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:20px 24px;font-size:11px;letter-spacing:.09em;border-bottom:1px solid var(--line)}.demo-tag{font-size:10px;border:1px solid #5c5c51;color:#c7c7bc;padding:3px 7px}.activity-map{height:300px;position:relative;overflow:hidden}.activity-map svg{width:100%;height:100%;position:absolute;inset:0}.map-label{position:absolute;left:24px;top:20px;letter-spacing:.13em;font-size:9px;color:#bcc7b6}.court-pin{position:absolute;background:#dddcd1;border:2px solid #111;color:#111;display:flex;gap:15px;align-items:center;padding:9px 13px;font-weight:700;font-size:20px;border-radius:30px;cursor:pointer;box-shadow:0 4px 16px #0006;transition:transform .2s,background .2s}.court-pin span{font-size:14px}.court-pin[aria-pressed=true]{background:var(--orange);transform:scale(1.12);outline:2px solid #ff5a1f55;outline-offset:5px}.court-pin:focus-visible{outline:3px solid white}.pin-north{left:29%;top:24%}.pin-park{left:67%;top:43%}.pin-south{left:38%;top:65%}.map-caption{position:absolute;bottom:8px;right:10px;background:#111b;padding:3px 6px;font-size:10px;color:#c9cac0}.court-detail{display:flex;justify-content:space-between;padding:25px 24px 15px;gap:20px}.court-detail h3{font-size:32px;margin:6px 0}.court-detail p{font-size:13px;max-width:300px;min-height:42px}.court-count{text-align:right;flex-shrink:0}.court-count strong{font:54px/1 var(--display);display:block;color:var(--orange)}.court-count span{font-size:11px;color:var(--muted)}.activity-bars{padding:0 24px 24px;display:flex;gap:15px;align-items:center;font-size:12px;color:var(--muted)}.activity-bars>div{display:flex;gap:4px;flex:1}.activity-bars i{height:6px;flex:1;background:var(--orange)}.activity-bars i.dim{background:#3a3b33}.activity-bars strong{font-weight:400;color:var(--white);min-width:60px;text-align:right}.rating-toolbar{padding:20px 24px 0;display:flex;justify-content:space-between;gap:15px;align-items:center}.demo-switch{display:flex;gap:3px;padding:3px;background:#111}.demo-switch button,.friend-switch button{border:0;color:#aaa;background:transparent;padding:8px 10px;cursor:pointer;font-size:12px}.demo-switch button[aria-pressed=true]{background:#37382f;color:var(--white)}.period-label{font-size:9px;letter-spacing:.06em;color:#aaa}.rating-summary{display:flex;justify-content:space-between;padding:24px 24px 0;align-items:center}.rating-summary>div>strong{font:66px/1 var(--display);display:block;margin-top:5px}.rating-summary p{display:flex;flex-direction:column;align-items:end;font-size:11px}.rating-summary p strong{font-size:23px;font-weight:600;color:var(--orange)}.chart-wrap{padding:10px 18px 0}.chart-wrap svg{display:block;width:100%;height:auto;overflow:visible}.chart-wrap text{fill:#a6a79b;font:11px var(--body)}.chart-legend{display:flex;justify-content:space-between;align-items:center;padding:0 24px 15px;font-size:12px}.legend-you:before,.friend-switch button:before{content:'';display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--orange);margin-right:8px}.friend-switch{display:flex;gap:5px}.friend-switch button{border:1px solid transparent}.friend-switch button:before{background:#d5d1b5}.friend-switch button[aria-pressed=true]{border-color:#676754;color:#e4e2d2}.comparison-summary{border-top:1px solid var(--line);padding:14px 24px;color:#d4d3c8;font-size:13px}.chart-values{padding:0;border-top:1px solid var(--line);border-bottom:0}.chart-values summary{font-size:12px;padding:14px 24px}.table-scroll{padding:0 24px 18px;overflow-x:auto}.chart-values table{width:100%;border-collapse:collapse;font-size:12px;text-align:left}.chart-values caption{text-align:left;color:var(--muted);margin:0 0 10px}.chart-values td,.chart-values th{border-bottom:1px solid var(--line);padding:6px 10px}.badge-heading{display:grid;grid-template-columns:1.2fr 1fr;gap:70px;align-items:end;margin-bottom:40px}.badge-heading h2{font-size:clamp(3.2rem,5.4vw,5.6rem)}.badge-heading p:not(.eyebrow){font-size:16px;margin-top:15px}.badge-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.badge-card{display:flex;flex-direction:column;align-items:center;background:#181916;border:1px solid var(--line);color:var(--white);cursor:pointer;padding:25px;transition:background .2s,border-color .2s,transform .2s}.badge-card:hover{transform:translateY(-4px)}.badge-card[aria-pressed=true]{background:#231d16;border-color:var(--orange)}.badge-glyph{width:80px;height:80px;border:1px solid #78775e;border-radius:50%;display:grid;place-items:center;color:#d6d3b0;font:47px/1 var(--body);margin:0 0 24px;background:#25251d}.badge-card[aria-pressed=true] .badge-glyph{color:var(--orange);border-color:var(--orange);background:#352719}.badge-title{font:35px/1 var(--display)}.badge-subtitle{font-size:13px;color:var(--muted);margin-top:8px}.badge-track{height:4px;background:#3b3a32;width:100%;margin-top:30px}.badge-track i{height:100%;background:var(--orange);display:block}.badge-progress{font-size:12px;color:#bbb9ab;margin-top:12px}.badge-detail{display:flex;gap:25px;align-items:center;padding:25px 0;border-bottom:1px solid var(--line)}.badge-detail>span{white-space:nowrap;min-width:115px}.badge-detail p{font-size:14px}.demo-disclosure{font-size:12px;margin-top:20px;max-width:850px;color:#96968d}
@media(max-width:1000px){.feature-row{gap:35px}.badge-heading{gap:35px}.rating-toolbar{flex-wrap:wrap}.badge-card{padding:20px}.badge-title{font-size:30px}}
@media(max-width:650px){.feature-section{padding-bottom:60px}.feature-row{grid-template-columns:1fr;gap:28px;margin-bottom:65px}.feature-copy h2,.badge-heading h2{font-size:clamp(3rem,12vw,4.7rem)}.feature-copy>p:not(.eyebrow),.badge-heading p:not(.eyebrow){font-size:15px}.panel-heading{padding:16px;font-size:9px}.activity-map{height:250px}.court-detail{padding:20px 16px 12px;gap:12px}.court-detail h3{font-size:29px}.court-detail p{font-size:12px}.activity-bars{padding:0 16px 20px;gap:10px}.rating-toolbar{padding:16px 16px 0;gap:10px}.rating-summary{padding:20px 16px 0}.rating-summary>div>strong{font-size:56px}.chart-legend{padding:0 16px 15px}.comparison-summary{padding:14px 16px}.chart-values summary{padding:14px 16px}.badge-heading{grid-template-columns:1fr;gap:18px}.badge-grid{grid-template-columns:1fr;gap:12px}.badge-card{display:grid;grid-template-columns:64px 1fr;text-align:left;column-gap:18px;padding:20px}.badge-glyph{grid-column:1;grid-row:1/4;width:60px;height:60px;font-size:36px;margin:0}.badge-title,.badge-subtitle{grid-column:2}.badge-track{grid-column:1/-1;margin-top:20px}.badge-progress{grid-column:1/-1}.badge-detail{display:block;padding:20px 0}.badge-detail p{margin-top:8px}.map-caption{font-size:9px}.demo-disclosure{font-size:11px}}
/* Commendation concept ladder; palette shared with the mobile app. */
.progress-strip{grid-template-columns:1fr 1fr 1.2fr}
.badge-card{--badge-color:#FFD60A}
.badge-card .badge-glyph,.badge-card[aria-pressed=true] .badge-glyph{color:var(--badge-color);border-color:var(--badge-color);background:color-mix(in srgb,var(--badge-color) 10%,#161713);box-shadow:inset 0 0 20px color-mix(in srgb,var(--badge-color) 8%,transparent)}
.badge-card[aria-pressed=true]{border-color:var(--badge-color);background:color-mix(in srgb,var(--badge-color) 5%,#181916)}
.badge-card .badge-track i{background:var(--badge-color)}
.badge-tier{color:var(--badge-color);font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;margin-top:16px}
.tier-explorer{margin-top:32px;border:1px solid var(--line);padding:25px}
.tier-explorer-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:14px}
.tier-explorer-heading label>span{display:block;color:var(--muted);font-size:12px;margin-top:3px}
#commendation-total{color:var(--muted);font-size:13px}
#commendation-count{width:100%;margin:24px 0;cursor:pointer;min-height:24px}
.tier-ladder{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
.tier-ladder button{background:transparent;border:1px solid transparent;color:var(--white);display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 4px;cursor:pointer;font-size:12px;border-radius:4px}
.tier-ladder button[aria-pressed=true]{border-color:var(--badge-color);background:color-mix(in srgb,var(--badge-color) 7%,transparent)}
.tier-emblem{width:42px;height:42px;border:1px solid var(--badge-color);border-radius:50%;display:grid;place-items:center;font-size:29px;color:var(--badge-color);background:color-mix(in srgb,var(--badge-color) 10%,#111)}
.tier-ladder small{color:var(--muted);font-size:12px}
#tier-explainer{font-size:12px;color:var(--muted);margin-top:20px}
@media(max-width:650px){.progress-strip{grid-template-columns:1fr 1fr}.progress-strip>p{grid-column:1/-1}.badge-tier{grid-column:2;margin-top:8px}.tier-explorer{padding:18px 12px}.tier-ladder{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.tier-ladder button{font-size:11px}.tier-explorer-heading{gap:10px}.tier-explorer-heading label{font-size:13px}#commendation-total{font-size:12px;text-align:right}}