/* RAPF*CK V6 — streetwear premium + hip hop */
:root{
  --display-font:"Arial Black","Franklin Gothic Heavy",Impact,Haettenschweiler,sans-serif;
  --body-font:Inter,Arial,Helvetica,sans-serif;
  --acid:#d9ff43;--ink:#f7f4eb;--muted:#9c9c95;--panel:#111;--panel-hi:#171717;--line:#303030;
  --r1:12px;--r2:18px;--r3:26px;--r4:34px;--shadow:0 18px 50px rgba(0,0,0,.32)
}
body{font-family:var(--body-font)}
h1,h2,h3,.brand,.primary,.inverted,.google-login,.ghost-link,.price-card>strong,.grade,.mock-word,.stats-grid strong,.rank-row>b,.xp-pill strong,.final-cta h2,.mock-rank{font-family:var(--display-font);font-weight:900}
h1,h2,h3{text-transform:uppercase}

/* stronger CTA system */
.primary,.inverted,.ghost,.google-login,.ghost-link,.toggle-btn,.segmented button,.beat-tabs button,.session-actions button,.mock-actions button,.text-btn{
  min-height:54px;padding:16px 22px;font-size:15px!important;font-weight:900!important;text-transform:uppercase;letter-spacing:.65px;
  display:inline-flex;align-items:center;justify-content:center;text-align:center;line-height:1.05
}
.huge{min-height:64px!important;font-size:17px!important}
.small-login{min-height:46px!important;padding:12px 18px!important;font-size:13px!important}
.primary{box-shadow:0 8px 0 #273000,0 18px 40px rgba(217,255,67,.08)}
.primary:hover{transform:translateY(-3px);box-shadow:0 11px 0 #273000,0 22px 46px rgba(217,255,67,.12)}
.primary:active{transform:translateY(4px) scale(.99);box-shadow:0 3px 0 #273000}

/* streetwear surfaces */
.price-card,.mode-card,.feature-grid article,.big-mode-grid article,.daily-card,.stats-grid article,.setup-card,.profile-card,.profile-preview,.beats-panel,.tool-card,.history-item,.rank-row,.goal-progress,.xp-panel,.phone-mock,.beat-list article,.mini-beats article,.public-card,.rank-banner,.recording-result,.sticky-start{
  border-radius:var(--r3)!important;border:1px solid var(--line);background:linear-gradient(155deg,#151515 0%,#0e0e0e 100%);box-shadow:0 10px 30px rgba(0,0,0,.16)
}
.price-card:hover,.mode-card:hover,.feature-grid article:hover,.big-mode-grid article:hover,.rank-row:hover,.history-item:hover,.beat-list article:hover,.mini-beats article:hover{
  transform:translateY(-4px) rotate(-.15deg);border-color:#4a4a4a;box-shadow:var(--shadow)
}

/* subtle tape / tag language */
.eyebrow,.kicker,.ticker,.step-label span,.price-card>span,.daily-top,.profile-badge,.rank-banner span{
  font-family:var(--display-font);font-weight:900;letter-spacing:2.2px
}
.eyebrow,.kicker{display:inline-flex;align-items:center;gap:8px}
.eyebrow:before,.kicker:before{content:'✦';color:var(--acid);font-size:.9em}
.v4-section{position:relative}
.v4-section:before{content:'';position:absolute;left:0;top:0;width:74px;height:5px;border-radius:99px;background:var(--acid);opacity:.9}

/* hero details */
.v4-hero{position:relative}
.v4-hero:after{content:'RESPECT / CREATE / EVOLVE';position:absolute;right:0;bottom:18px;color:#363636;font-family:var(--display-font);font-size:10px;letter-spacing:2.6px;transform:rotate(-2deg)}
.hero-copy h1{letter-spacing:-5px}
.hero-copy .lead{font-size:clamp(18px,2.1vw,24px);line-height:1.45;max-width:760px}
.phone-mock{border-radius:32px!important;box-shadow:18px 18px 0 #141414,var(--shadow)}
.phone-mock:after{content:'RAPF*CK TRAINING';position:absolute;left:18px;bottom:18px;background:var(--acid);color:#090909;padding:7px 10px;border-radius:999px;font:900 9px var(--display-font);letter-spacing:1.2px}

/* identity badges */
.mode-card b,.feature-grid b,.big-mode-grid>article>span,.beat-list b,.mini-beats b{font-family:var(--display-font)}
.mode-card b,.feature-grid b,.big-mode-grid>article>span{display:inline-flex;align-items:center;justify-content:center;min-width:36px;height:28px;padding:0 9px;border-radius:999px;background:#202500;color:var(--acid)!important;border:1px solid #3b4500}
.value-card{border-radius:var(--r3)!important;background:linear-gradient(160deg,#151515,#0d0d0d)}
.value-card h3{font-size:30px!important}

/* richer cards */
.price-card.featured{background:linear-gradient(160deg,#202500 0%,#111 52%);border-color:#536000!important}
.price-card>b{border-radius:999px;padding:7px 11px!important}
.daily-card{border-radius:30px!important;transform:rotate(-.2deg)}
.daily-card:hover{transform:translateY(-3px) rotate(-.5deg)}

/* navigation like an app bar */
.bottom-nav{max-width:720px;left:50%!important;right:auto!important;transform:translateX(-50%);width:calc(100% - 20px)!important;bottom:10px!important;border:1px solid #2f2f2f!important;border-radius:22px!important;overflow:hidden;background:rgba(9,9,9,.94)!important;box-shadow:0 14px 50px rgba(0,0,0,.4)}
.bottom-nav button{min-height:58px!important;margin:5px!important;border-radius:15px!important;font-size:10px!important}
.bottom-nav button.active{background:#202500!important;color:var(--acid)!important}
.topbar,.landing-top{border-radius:0 0 24px 24px!important;border-bottom:1px solid #292929;background:rgba(8,8,8,.93)!important}

/* stats and rank feel collectible */
.stats-grid article{position:relative;overflow:hidden}
.stats-grid article:after{content:'★';position:absolute;right:10px;top:8px;color:#252525;font-size:28px}
.stats-grid strong{font-size:clamp(32px,7vw,50px)!important}
.rank-row{padding:14px 16px!important}
.rank-row>b{font-size:20px!important}
.rank-row.me{border-color:var(--acid)!important;background:linear-gradient(150deg,#1b2100,#111)!important}

/* profile = flex card / ego wall */
.profile-preview{background:radial-gradient(circle at 50% 0,#222900 0,#101010 45%);border-color:#394000!important}
.profile-preview:before{content:'PUBLIC PROFILE';display:inline-flex;margin-bottom:18px;padding:6px 10px;border-radius:999px;background:var(--acid);color:#080808;font:900 8px var(--display-font);letter-spacing:1.4px}
.profile-badge{background:#202500;border-color:#4a5600!important;padding:9px 12px!important}
.ego-chip{font-size:10px!important;padding:9px 12px!important;background:#121212!important}
.ego-stat strong{font-size:18px!important}
.public-card{background:radial-gradient(circle at 50% 0,#202500 0,#101010 36%);border-color:#353d00!important}
.public-showcase .show-row{border-radius:18px!important}
.social-row a{min-height:38px;padding:9px 13px!important}

/* micro motion */
button,a,.mode-card,.price-card,.rank-row,.feature-grid article,.big-mode-grid article,.beat-list article,.mini-beats article,.value-card{transition:transform .16s cubic-bezier(.2,.8,.2,1),box-shadow .16s ease,border-color .16s ease,filter .16s ease}
button:active,a:active{transform:scale(.975)}

/* mobile polish */
@media(max-width:560px){
  .primary,.inverted,.ghost,.google-login,.ghost-link{font-size:14px!important;min-height:56px}
  .huge{font-size:16px!important;min-height:62px!important}
  .hero-copy h1{letter-spacing:-3px}
  .bottom-nav{width:calc(100% - 12px)!important;bottom:6px!important}
  .phone-mock{border-radius:26px!important}
  .v4-section:before{width:52px}
  .v4-hero:after{display:none}
}