/* Workout pages in the Instagram look of the home page (1.11.2026). Loaded after /home/style.css. */
.wk-top{gap:6px;padding:0 6px}
.wk-hd{flex:1;font-weight:700;font-size:17px}
.wk-top .icon-btn svg{width:24px;height:24px}

/* profile stats, like an Instagram profile */
.wk-stats{list-style:none;margin:0;padding:0;flex:1;display:flex;justify-content:space-around;text-align:center}
.wk-stats b{display:block;font-size:19px;font-weight:700;line-height:1.2}
.wk-stats span{font-size:14px}
.wk-name{margin:12px 0 0;font-size:16px;font-weight:700}
.bio-fg{margin:2px 0 0;font-size:15px}
.wk-list .bio{margin-top:6px}

/* story rings with a gradient fill */
.story .fill.g2,.wk-tile.g2{background:linear-gradient(150deg,#4F5BD5 0%,#962FBF 55%,#D62976 100%)}
.wk-tile.g1{background:linear-gradient(150deg,#FA7E1E 0%,#D62976 60%,#962FBF 100%)}
.wk-tile.g3{background:linear-gradient(150deg,#FEDA75 0%,#FA7E1E 45%,#D62976 100%)}
.wk-tile.g4{background:linear-gradient(150deg,#D62976 0%,#962FBF 50%,#4F5BD5 100%)}
.wk-tile.g5{background:linear-gradient(150deg,#0095F6 0%,#4F5BD5 50%,#962FBF 100%)}
.wk-tile.g6{background:linear-gradient(150deg,#962FBF 0%,#D62976 50%,#FA7E1E 100%)}
.story .ring img{object-position:50% 0}
.story .fill svg{fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round}

/* post media */
.wk-link{display:block;text-decoration:none;color:#fff}
.wk-media{aspect-ratio:4/5}
.wk-media img{object-position:50% 0;background:#fff}
.wk-tile .m-title{max-width:92%;text-shadow:0 2px 12px rgba(0,0,0,.25)}
.wk-tile .m-eyebrow,.wk-tile .m-sub{text-shadow:0 2px 10px rgba(0,0,0,.25)}
.wk-badge{position:absolute;bottom:12px;inset-inline-start:12px;z-index:2;background:rgba(0,0,0,.62);color:#fff;font-size:13px;font-weight:700;padding:6px 10px;border-radius:999px}
.wk-go{padding:10px 14px 2px;display:flex}
.wk-go .btn{height:42px;font-size:15px}

/* workout hero */
.wk-hero .caption h1{margin:2px 0 4px;font-family:var(--display);font-weight:400;font-size:26px;line-height:1.2}
.wk-hero .caption p{margin:0;font-size:16px;color:var(--fg)}

/* level picker, sticky under the top bar */
.wk-level{position:sticky;top:54px;z-index:15;background:var(--bg);padding:12px 12px 12px;border-bottom:1px solid var(--line)}
.wk-level h2{margin:0 4px 8px;font-size:15px;font-weight:700}
.levels{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.levels button{display:flex;flex-direction:column;align-items:center;gap:5px;min-height:62px;padding:8px 4px;border-radius:12px;background:var(--chip);font-size:13.5px;font-weight:600;line-height:1.25;text-align:center;border:2px solid transparent}
.levels button[aria-checked="true"]{border-color:var(--blue);background:var(--bg);color:var(--fg)}
.lv{display:flex;gap:3px;align-items:flex-end;height:14px}
.lv b{width:5px;border-radius:2px;background:var(--line)}
.lv b:nth-child(1){height:6px}.lv b:nth-child(2){height:10px}.lv b:nth-child(3){height:14px}
.lv1 b:nth-child(1),.lv2 b:nth-child(-n+2),.lv3 b{background:var(--blue)}

/* cards */
.wk-card{margin:12px;padding:14px 16px;border:1px solid var(--line);border-radius:14px}
.wk-card h2{margin:0;font-size:17px;display:inline}
.wk-card summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;min-height:30px}
.wk-card summary::-webkit-details-marker{display:none}
.wk-card summary::after{content:"";width:9px;height:9px;border-inline-end:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin-inline-end:4px;transition:transform .2s}
.wk-card[open] summary::after{transform:rotate(-135deg)}
.wk-points{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:10px}
.wk-points li{display:grid;gap:2px;font-size:15px}
.wk-points span{color:var(--muted)}
.wk-warn{margin:12px 0 0;padding:10px 12px;border-radius:10px;background:var(--chip);font-size:13.5px;line-height:1.5}
section.wk-card h2{display:block}

/* exercises */
.wk-steps{border-top:0}
.ex{scroll-margin-top:150px}
.ex-dot{width:38px;height:38px;flex:none;display:grid;place-items:center;border-radius:50%;background:var(--ring-grad);color:#fff;font-weight:800;font-size:16px;box-shadow:inset 0 0 0 2px var(--bg)}
.ex .p-name{font-size:15px}
.ex-media{aspect-ratio:4/5}
.ex-media .ex-num{position:relative;font-size:clamp(64px,22vw,96px);font-weight:800;line-height:1;opacity:.9;font-variant-numeric:tabular-nums}
.ex-media .m-title{font-size:clamp(28px,8vw,38px)}
.ex-video{padding:0;background:#fff}
.ex-video video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#fff;cursor:pointer}
.ex-cap .do{display:none;margin:0;font-size:16.5px;line-height:1.55}
body[data-energy="seated"] .ex-cap .do[data-energy="seated"],
body[data-energy="supported"] .ex-cap .do[data-energy="supported"],
body[data-energy="free"] .ex-cap .do[data-energy="free"]{display:block}
.ex-cap .goal{margin:8px 0 0;color:var(--muted);font-size:14.5px}
.seq{margin:0;padding-inline-start:20px;font-size:16.5px;line-height:1.55}
.wk-poster{aspect-ratio:auto;padding:0;background:#fff}
.wk-poster img{position:static;width:100%;height:auto}

/* finish */
.wk-done{padding:18px 14px 6px;display:grid;gap:12px;text-align:center}
.wk-finish{height:52px;font-size:17px;flex:none}
.wk-bravo{padding:16px;border-radius:14px;background:var(--grad);color:#fff}
.wk-bravo[hidden]{display:none}
.wk-bravo p{margin:0;font-size:16px}
.wk-bravo .wk-bravo-t{font-family:var(--display);font-size:30px;line-height:1.2;margin-bottom:4px}
.wk-row{display:flex;gap:8px}
.wk-row .btn{height:42px;gap:6px;display:flex;align-items:center;justify-content:center}
.wk-row svg{width:18px;height:18px}
.wk-more{border-top:1px solid var(--line);border-bottom:0;margin-top:14px}
.wk-more h2{margin:14px 16px 0;font-size:16px}

/* tab bar uses links on these pages */
.tabbar a{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;color:var(--fg)}

/* toast */
.wk-toast{position:fixed;z-index:70;inset-inline:0;margin-inline:auto;bottom:calc(84px + env(safe-area-inset-bottom));width:max-content;max-width:calc(100% - 32px);background:#262626;color:#fff;padding:10px 16px;border-radius:10px;font-size:14px;box-shadow:0 6px 20px rgba(0,0,0,.25)}

@media print{
  .tabbar,.wk-top,.wk-level,.wk-done,.wk-more,.foot .legal,.stories,.ex-media,.wk-hero .media,.wk-poster,.home-bar{display:none!important}
  .app{border:0;padding:0;max-width:none}
  .post{break-inside:avoid}
  .wk-before .wk-points,.wk-warn{display:grid}
}
.wk-hero .wk-media{aspect-ratio:1/1}
.ex-media.wk-tile{aspect-ratio:5/3;padding:16px}
.ex-media.wk-tile .ex-num{font-size:56px}
.ex-media.wk-tile .m-title{font-size:clamp(24px,7vw,32px)}

.wk-why{margin:0 0 12px;line-height:1.6;opacity:.9}
