/* Trainee workspace — scoped to body.is-trainee, loaded after polish.css */
body.is-trainee .main{padding-bottom:calc(104px + env(safe-area-inset-bottom))}
body.is-trainee .view>.headrow{padding-bottom:14px;margin-bottom:18px;border-bottom:1px solid var(--line)}
body.is-trainee .view>.headrow .title{font-size:26px;line-height:1.3}

/* Hero: the one bold moment — brand gradient with barbell-plate rings */
body.is-trainee #traineeView .hero{position:relative;overflow:hidden;min-height:150px;padding:26px 24px;border:0;border-radius:24px;color:#fff;background:linear-gradient(120deg,#4b2bb0 0%,#8a34b8 58%,#c2308f 100%);box-shadow:0 18px 44px #5b3cc440}
body.is-trainee #traineeView .hero::after{content:"";position:absolute;inset-block:-40% -40%;inset-inline-end:-8%;width:62%;pointer-events:none;background:repeating-radial-gradient(circle at 60% 50%,#ffffff1f 0 2px,transparent 2px 26px);-webkit-mask-image:radial-gradient(circle at 60% 50%,#000 0,transparent 68%);mask-image:radial-gradient(circle at 60% 50%,#000 0,transparent 68%)}
body.is-trainee #traineeView .hero>*{position:relative;z-index:1}
body.is-trainee #traineeView .hero h2{margin:6px 0;font-size:30px;line-height:1.25;color:#fff}
body.is-trainee #traineeView .hero p,body.is-trainee #traineeView .hero-brand-kicker{color:#ffffffd9}

/* Cards: each kind gets a quiet accent edge so the home reads at a glance */
body.is-trainee #traineeView .grid2{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
body.is-trainee #traineeView .grid2>.card{border-inline-start:3px solid var(--line)}
body.is-trainee #traineeView .card[data-kind="workout"]{border-inline-start-color:var(--purple)}
body.is-trainee #traineeView .card[data-kind="nutrition"]{border-inline-start-color:var(--green)}
body.is-trainee #traineeView .card[data-kind="inbody"]{border-inline-start-color:var(--gold)}
body.is-trainee #traineeView .card[data-kind="checkin"]{order:-1;grid-column:1/-1;border-inline-start-color:var(--pink);background:linear-gradient(135deg,#c2308f14,transparent 60%),var(--surface)}

/* Daily check-in: a big, thumb-sized tile instead of a tiny checkbox */
body.is-trainee .checkin-commitment{display:block;margin:6px 0 14px;padding:14px 16px;border:1.5px dashed var(--line);border-radius:16px;cursor:pointer;transition:border-color .15s,background .15s}
body.is-trainee .checkin-commitment input[type="checkbox"]{width:26px;height:26px;accent-color:var(--green);flex:none}
body.is-trainee .checkin-commitment:has(input:checked){border-style:solid;border-color:var(--green);background:#14966f14}

/* Bottom nav: clear active state, and a light-theme version */
body.is-trainee .app-bottom-nav button{border-radius:16px;transition:background .15s,color .15s}
body.is-trainee .app-bottom-nav button.is-active{background:linear-gradient(135deg,#5b3cc4,#c2308f);color:#fff;box-shadow:0 6px 16px #5b3cc44d}
body.theme-light.is-trainee .app-bottom-nav{background:#ffffffe6;border-color:#dfe2ee;box-shadow:0 16px 40px #3b2f7a26}
body.theme-light.is-trainee .app-bottom-nav button:not(.is-active){color:#4a4763}

@media (max-width:760px){
  body.is-trainee #traineeView .grid2{grid-template-columns:1fr}
  body.is-trainee #traineeView .hero{padding:22px 20px;min-height:132px}
  body.is-trainee #traineeView .hero h2{font-size:25px}
}