*{
margin:0;
padding:0;
box-sizing:border-box;
}

body{
background:#090909;
font-family:'Inter',sans-serif;
color:white;
overflow-x:hidden;
}

/* =========================
   HEADER
========================= */

header{

height:82px;

display:flex;
align-items:center;
justify-content:space-between;

padding:0 30px;

border-bottom:
1px solid #1f1f1f;
}

.logo{

font-size:30px;
font-weight:900;
}

.logo span{
color:#ff3b3b;
}

.download-btn{

height:48px;

padding:0 20px;

border:none;
border-radius:14px;

background:#1a1a1a;

color:white;

font-weight:700;

cursor:pointer;
}

/* =========================
   CONTAINER
========================= */

.container{

max-width:1200px;

margin:auto;

padding:40px 20px 120px;
}

/* =========================
   HERO
========================= */

.hero{
text-align:center;
padding-top:100px;
}

.badge{

display:inline-block;

padding:10px 16px;

border-radius:999px;

background:
rgba(255,59,59,0.12);

color:#ff6666;

font-size:13px;
font-weight:700;

margin-bottom:30px;
}

.hero h1{

font-size:84px;

line-height:0.9;

font-weight:900;

margin-bottom:30px;
}

.hero h1 span{
color:#ff3b3b;
}

.hero p{

max-width:700px;

margin:auto;

font-size:22px;

line-height:1.8;

color:#9a9a9a;
}

/* =========================
   HERO BUTTONS
========================= */

.hero-buttons{

display:flex;
justify-content:center;

gap:20px;

margin-top:50px;

flex-wrap:wrap;
}

.primary-btn,
.secondary-btn{

height:68px;

padding:0 32px;

border:none;
border-radius:20px;

font-size:16px;
font-weight:800;

cursor:pointer;
}

.primary-btn{

background:#ff3b3b;
color:white;
}

.secondary-btn{

background:#1a1a1a;
color:white;
}

/* =========================
   FEATURES
========================= */

.features{

display:grid;

grid-template-columns:
repeat(3,1fr);

gap:24px;

margin-top:90px;
}

.feature{

background:#161616;

border:
1px solid #2a2a2a;

border-radius:30px;

padding:34px;
}

.feature-number{

color:#ff3b3b;

font-size:14px;
font-weight:900;

margin-bottom:20px;
}

.feature-title{

font-size:30px;

font-weight:900;

margin-bottom:20px;
}

.feature-text{

font-size:17px;

line-height:1.7;

color:#9a9a9a;
}

/* =========================
   WIZARD
========================= */

.wizard{
display:none;
margin-top:80px;
}

.step{
display:none;
}

.step.active{
display:block;
}

.wizard h2{

font-size:52px;

margin-bottom:40px;
}

/* =========================
   OPTIONS
========================= */

.options{

display:grid;

grid-template-columns:
repeat(2,1fr);

gap:20px;
}

.option{

background:#161616;

border:
1px solid #2a2a2a;

border-radius:24px;

padding:30px;

font-size:24px;
font-weight:700;

cursor:pointer;

transition:0.2s;
}

.option:hover{
border-color:#444;
}

.option.selected{

border-color:#ff3b3b;

background:
rgba(255,59,59,0.10);
}

/* =========================
   BUTTONS
========================= */

.generate-btn,
.back-btn{

margin-top:30px;

height:68px;

padding:0 34px;

border:none;
border-radius:20px;

font-size:16px;
font-weight:800;

cursor:pointer;
}

.generate-btn{

background:#ff3b3b;
color:white;
}

.back-btn{

background:#1a1a1a;
color:white;
}

.wizard-buttons{

display:flex;

gap:16px;

margin-top:30px;
}

.request-grid{

display:grid;

grid-template-columns:
repeat(2,1fr);

gap:18px;
}

.request-field{

display:flex;
flex-direction:column;

gap:10px;

padding:18px;

border-radius:22px;

background:#161616;

border:
1px solid #2a2a2a;
}

.request-field-wide{

grid-column:1 / -1;
}

.request-field span{

font-size:12px;
font-weight:900;

color:#8a8a8a;

text-transform:uppercase;
}

.request-field select,
.request-field textarea{

width:100%;

border:none;
outline:none;

border-radius:16px;

background:#1f1f1f;

color:white;

font-family:inherit;
font-size:15px;
font-weight:700;
}

.request-field select{

height:52px;

padding:0 14px;
}

.request-field textarea{

min-height:110px;

padding:14px;

line-height:1.5;

resize:vertical;
}

.request-field textarea::placeholder{

color:#6f6f6f;
}

.equipment-hint{

margin-bottom:12px;

color:#a8a8a8;

font-size:13px;
font-weight:600;
line-height:1.45;
}

.equipment-chips,
.tag-chips{

display:flex;
flex-wrap:wrap;
gap:10px;
}

.equipment-chip,
.tag-chip{

height:42px;

padding:0 14px;

border:
1px solid #333;

border-radius:14px;

background:#1f1f1f;

color:white;

font-family:inherit;
font-size:14px;
font-weight:800;

cursor:pointer;

transition:0.2s;
}

.equipment-chip:hover,
.tag-chip:hover{

border-color:#555;
}

.equipment-chip.selected,
.tag-chip.selected{

border-color:#ff3b3b;

background:
rgba(255,59,59,0.12);
}

.tag-chip.caution.selected{

border-color:#ff8a3b;

background:
rgba(255,138,59,0.13);
}

/* =========================
   LOADING
========================= */

.loading{

display:none;

text-align:center;

padding-top:120px;
}

.loader{

width:80px;
height:80px;

border-radius:50%;

border:5px solid #222;

border-top:
5px solid #ff3b3b;

margin:auto;

animation:spin 1s linear infinite;
}

.loading-text{

margin-top:30px;

font-size:30px;
font-weight:800;
}

/* =========================
   RESULT
========================= */

.result{
display:none;
padding-top:100px;
}

.result-card{

background:#161616;

border:
1px solid #2a2a2a;

border-radius:30px;

padding:40px;

text-align:center;
}

.result-card h2{

font-size:48px;

margin-bottom:20px;
}

.result-card p{

font-size:18px;

color:#9a9a9a;

margin-bottom:30px;
}

.import-btn{

height:68px;

padding:0 34px;

border:none;
border-radius:20px;

background:#ff3b3b;

color:white;

font-size:16px;
font-weight:800;

cursor:pointer;
}

/* =========================
   ANIMATION
========================= */

@keyframes spin{

100%{
transform:rotate(360deg);
}

}

/* =========================
   PROGRAM RESULT
========================= */

.result-top{

display:flex;
justify-content:space-between;
align-items:center;

margin-bottom:30px;

gap:20px;

flex-wrap:wrap;
}

.program-badge{

padding:10px 14px;

border-radius:999px;

background:
rgba(255,59,59,0.12);

color:#ff6666;

font-size:13px;
font-weight:800;
}

.program-days{

display:flex;
flex-direction:column;

gap:20px;

margin-bottom:40px;
}

.coach-notes{

display:grid;

grid-template-columns:
repeat(4,minmax(0,1fr));

gap:14px;

margin-bottom:26px;

text-align:left;
}

.coach-note-card{

background:#101010;

border:
1px solid #262626;

border-radius:14px;

padding:16px;
}

.coach-note-card-wide{

grid-column:span 2;
}

.coach-note-card-hero{

grid-column:span 2;

background:#141414;

border-color:#343434;
}

.coach-note-kicker{

font-size:11px;
font-weight:900;

text-transform:uppercase;
letter-spacing:0;

color:#9a9a9a;

margin-bottom:8px;
}

.coach-note-headline{

font-size:20px;
font-weight:900;
line-height:1.15;

color:#ffffff;

margin-bottom:10px;
}

.safety-note-card{

border-color:#5a3434;

background:#151010;
}

.coach-note-title{

font-size:13px;
font-weight:900;

color:#ff6666;

margin-bottom:8px;
}

.coach-note-text{

font-size:13px;
line-height:1.45;

color:#cfcfcf;
}

.coach-note-mini{

margin-top:9px;

color:#a9a9a9;
}

.coach-note-list{

display:flex;
flex-direction:column;
gap:8px;

margin:12px 0 0;
padding-left:18px;

color:#d7d7d7;

font-size:13px;
line-height:1.4;
}

.coach-note-list-numbered{

padding-left:20px;
}

.safety-zones{

font-weight:900;

color:#ffffff;

margin-bottom:8px;
}

.safety-note-line{

margin-top:7px;
}

.volume-grid{

display:flex;
flex-wrap:wrap;

gap:8px;

margin-top:2px;
}

.volume-pill{

display:inline-flex;
align-items:center;
gap:6px;

min-height:30px;

padding:7px 9px;

border:
1px solid #2c2c2c;

border-radius:8px;

background:#171717;

font-size:12px;
line-height:1;

color:#d8d8d8;
}

.volume-pill b{

color:#ffffff;
font-weight:900;
}

.volume-balance{

margin-top:12px;
}

.day-card{

background:#101010;

border:
1px solid #262626;

border-radius:22px;

padding:24px;
}

.day-title{

font-size:24px;
font-weight:900;

margin-bottom:20px;
}

.day-coach-note{

margin:-6px 0 18px;

padding:12px 14px;

border-radius:12px;

background:#181818;

color:#bdbdbd;

font-size:13px;
line-height:1.45;

text-align:left;
}

.exercise{

display:flex;
justify-content:space-between;
align-items:center;

overflow:hidden;

gap:20px;

padding:18px 0;

border-bottom:
1px solid #1d1d1d;
}

.exercise-stage{

padding:10px 0 4px;
}

.exercise-stage + .exercise-stage{

margin-top:12px;
}

.exercise-stage-title{

display:flex;
align-items:center;

margin:0 0 4px;

color:#ff6b6b;

font-size:12px;
font-weight:900;
letter-spacing:0;
text-transform:uppercase;
}

.exercise:last-child{
border-bottom:none;
}

.program-exercise-image{

width:58px;
height:58px;

border-radius:14px;

object-fit:cover;

background:#202020;

flex:0 0 58px;
}

.program-exercise-placeholder{

display:flex;
align-items:center;
justify-content:center;

border:
1px solid #303030;

color:#ff6666;

font-size:13px;
font-weight:900;
}

.exercise-left{
flex:1;
min-width:180px;
}

.exercise-name{

font-size:17px;
font-weight:800;

margin-bottom:6px;

line-height:1.3;
}

.exercise-block-label{

display:inline-flex;
align-items:center;

width:max-content;
max-width:100%;

margin-bottom:8px;
padding:5px 9px;

border-radius:999px;

background:#231f1d;
border:1px solid #3b2a25;

color:#ff9b7a;

font-size:11px;
font-weight:900;
line-height:1;
text-transform:uppercase;
letter-spacing:0;
}

.exercise-block-label.intent-knee_control{
background:#211f16;
border-color:#4a3f1c;
color:#ffd166;
}

.exercise-block-label.intent-foot_ankle{
background:#17211b;
border-color:#254833;
color:#84e0a3;
}

.exercise-block-label.intent-balance,
.exercise-block-label.intent-single_leg_strength{
background:#171f24;
border-color:#254252;
color:#8bd3ff;
}

.exercise-block-label.intent-lower_mobility{
background:#201b23;
border-color:#3d3048;
color:#d7a8ff;
}

.exercise-muscle{

font-size:13px;

color:#7f7f7f;
}

.exercise-right{

display:flex;
align-items:center;
justify-content:flex-end;

gap:10px;

flex-wrap:wrap;

max-width:360px;
}

.exercise-meta,
.exercise-rest,
.exercise-level{

padding:8px 12px;

border-radius:12px;

background:#1c1c1c;

font-size:13px;
font-weight:700;
}

.exercise-meta{
color:white;
}

.exercise-rest{
color:#b3b3b3;
}

.exercise-level{
color:#ff7777;
}

@media(max-width:760px){

.result{
padding-top:40px;
}

.result-card{
padding:22px;
border-radius:18px;
}

.day-card{
padding:18px;
border-radius:16px;
}

.coach-notes{
grid-template-columns:1fr;
}

.coach-note-card-wide{
grid-column:span 1;
}

.coach-note-card-hero{
grid-column:span 1;
}

.exercise{
align-items:flex-start;
gap:12px;
}

.program-exercise-image{
width:48px;
height:48px;
border-radius:12px;
flex-basis:48px;
}

.exercise-right{
width:100%;
max-width:none;
justify-content:flex-start;
margin-left:60px;
}

.exercise-meta,
.exercise-rest,
.exercise-level{
font-size:12px;
padding:7px 10px;
}

}

/* =========================
   EXERCISE SELECTOR
========================= */

.exercise-selector{
margin-top:80px;
}

.exercise-selector h2{

font-size:42px;
font-weight:900;

margin-bottom:30px;
}

.exercise-selector-grid{

display:grid;

grid-template-columns:
repeat(auto-fill,minmax(170px,1fr));

gap:16px;
}

.exercise-card{

background:#161616;

border:
1px solid #2a2a2a;

border-radius:20px;

overflow:hidden;

transition:0.2s;

cursor:pointer;
}

.exercise-card:hover{

transform:translateY(-4px);

border-color:#ff3b3b;
}

.exercise-image{

width:100%;
height:180px;

object-fit:cover;

object-position:center top;

display:block;
}

.exercise-card-content{
padding:10px;
}

.exercise-card-title{

font-size:13px;
font-weight:800;

line-height:1.4;

margin-bottom:8px;
}

.exercise-card-muscle{

font-size:12px;

color:#8a8a8a;
}

.exercise-card.selected{

border-color:#ff3b3b;

box-shadow:
0 0 0 2px
rgba(255,59,59,0.3);

transform:translateY(-4px);
}

.exercise-header{

display:flex;
justify-content:space-between;
align-items:center;

margin-bottom:30px;

gap:20px;

flex-wrap:wrap;
}

.selected-count{

padding:12px 18px;

border-radius:999px;

background:
rgba(255,59,59,0.12);

color:#ff6666;

font-size:13px;
font-weight:800;
}

.exercise-search{

width:100%;

height:60px;

padding:0 20px;

margin-bottom:30px;

border:none;
border-radius:20px;

background:#161616;

color:white;

font-size:16px;

outline:none;

border:
1px solid #2a2a2a;
}

.exercise-search:focus{

border-color:#ff3b3b;
}

.empty-search{

padding:80px 20px;

text-align:center;

color:#6f6f6f;

font-size:18px;
font-weight:700;
}

.muscle-filters{

display:flex;
gap:12px;

margin-bottom:30px;

overflow-x:auto;

padding-bottom:4px;
}

.muscle-filter{

height:44px;

padding:0 18px;

border:none;
border-radius:14px;

background:#161616;

color:#8a8a8a;

font-size:13px;
font-weight:800;

cursor:pointer;

flex-shrink:0;

transition:0.2s;
}

.muscle-filter.active{

background:#ff3b3b;

color:white;
}

.exercise-modal{

position:fixed;

inset:0;

background:
rgba(0,0,0,0.75);

display:none;

justify-content:center;
align-items:center;

padding:20px;

z-index:999;
}

.exercise-modal.active{
display:flex;
}

.exercise-modal-card{

width:100%;
max-width:500px;

background:#111111;

border:
1px solid #2a2a2a;

border-radius:28px;

overflow:hidden;

position:relative;
}

.modal-video{

width:100%;
height:320px;

object-fit:cover;
}

.modal-content{
padding:24px;
}

#modalTitle{

font-size:28px;
font-weight:900;

margin-bottom:12px;
}

.modal-muscle{

font-size:15px;

color:#8a8a8a;

margin-bottom:24px;
}

.modal-add-btn{

width:100%;
height:60px;

border:none;
border-radius:18px;

background:#ff3b3b;

color:white;

font-size:16px;
font-weight:800;

cursor:pointer;
}

.close-modal{

position:absolute;

top:16px;
right:16px;

width:42px;
height:42px;

border:none;
border-radius:50%;

background:
rgba(0,0,0,0.5);

color:white;

font-size:18px;

cursor:pointer;

z-index:2;
}

.selected-panel{

margin-top:80px;
margin-bottom:80px;
}

.selected-panel-top{

display:flex;
justify-content:space-between;
align-items:center;

margin-bottom:24px;

gap:20px;

flex-wrap:wrap;
}

.selected-list{

display:flex;
flex-wrap:wrap;

gap:14px;
}

.selected-item{

display:flex;
align-items:center;

gap:10px;

padding:12px 16px;

border-radius:16px;

background:#161616;

border:
1px solid #2a2a2a;
}

.selected-item-name{

font-size:14px;
font-weight:700;
}

.remove-selected{

width:26px;
height:26px;

border:none;
border-radius:50%;

background:#ff3b3b;

color:white;

font-size:12px;
font-weight:900;

cursor:pointer;
}

.selected-list{

display:flex;
flex-direction:column;

gap:18px;
}

.selected-exercise-card{

display:flex;
align-items:flex-start;

gap:12px;

padding:14px;

border-radius:18px;

background:#161616;

border:
1px solid #2a2a2a;
}

.selected-exercise-image{

width:72px;
height:72px;

border-radius:16px;

object-fit:cover;

flex-shrink:0;
}

.selected-exercise-content{
flex:1;
}

.selected-exercise-title{

font-size:18px;
font-weight:800;

margin-bottom:8px;
}

.selected-exercise-muscle{

font-size:14px;

color:#8a8a8a;

margin-bottom:14px;
}

.selected-exercise-meta{

display:flex;
flex-wrap:wrap;

gap:10px;
}

.selected-meta-item{

padding:8px 12px;

border-radius:12px;

background:#1f1f1f;

font-size:12px;
font-weight:700;
}

.remove-selected-large{

width:42px;
height:42px;

border:none;
border-radius:50%;

background:#ff3b3b;

color:white;

font-size:18px;
font-weight:900;

cursor:pointer;

flex-shrink:0;
}

@media(max-width:700px){

.selected-exercise-card{

flex-direction:row;

align-items:flex-start;

padding:14px;

gap:14px;
}

.selected-exercise-image{

width:72px;
height:72px;

border-radius:16px;

flex-shrink:0;
}

.selected-exercise-title{
font-size:15px;
}

.remove-selected-large{

width:34px;
height:34px;

font-size:14px;
}

}

.selected-exercise-controls{

display:flex;
gap:14px;

flex-wrap:wrap;
}

.selected-control{

display:flex;
flex-direction:column;

gap:8px;
}

.selected-control label{

font-size:11px;
font-weight:800;

color:#8a8a8a;
}

.selected-control input{

width:90px;
height:42px;

border:none;
border-radius:12px;

background:#1f1f1f;

color:white;

padding:0 14px;

font-size:14px;
font-weight:700;

outline:none;
}

.exercise-sets{

display:flex;
flex-direction:column;

gap:12px;
}

.set-row{

display:flex;
align-items:center;

gap:10px;
}

.set-number{

width:34px;
height:34px;

border-radius:50%;

background:#1f1f1f;

display:flex;
justify-content:center;
align-items:center;

font-size:13px;
font-weight:800;

flex-shrink:0;
}

.set-input{

flex:1;

height:42px;

border:none;
border-radius:12px;

background:#1f1f1f;

color:white;

padding:0 14px;

font-size:14px;
font-weight:700;

outline:none;
}

.add-set-btn{

height:44px;

border:none;
border-radius:14px;

background:#1f1f1f;

color:#ff6666;

font-size:13px;
font-weight:800;

cursor:pointer;
}

.remove-set-btn{

width:36px;
height:36px;

border:none;
border-radius:50%;

background:#2a1a1a;

color:#ff6666;

cursor:pointer;

flex-shrink:0;
}

.sets-header{

display:grid;

grid-template-columns:
40px
1fr
1fr
40px;

gap:10px;

margin-bottom:6px;

padding:0 4px;

font-size:11px;
font-weight:800;

color:#8a8a8a;

letter-spacing:1px;
}

.set-row{

display:grid;

grid-template-columns:
40px
1fr
1fr
40px;

gap:10px;

align-items:center;
}

.exercise-rest-row{

display:flex;
align-items:center;

gap:12px;

margin-bottom:20px;

margin-top:10px;
}

.exercise-rest-row label{

font-size:12px;
font-weight:800;

color:#8a8a8a;

letter-spacing:1px;
}

.rest-input{

width:90px;
height:42px;

border:none;
border-radius:12px;

background:#1f1f1f;

color:white;

padding:0 14px;

font-size:14px;
font-weight:700;

outline:none;
}

.exercise-rest-row span{

font-size:13px;
font-weight:700;

color:#8a8a8a;
}

.drag-handle{

width:42px;
height:42px;

display:flex;
justify-content:center;
align-items:center;

border-radius:14px;

background:#1f1f1f;

font-size:18px;
font-weight:900;

color:#8a8a8a;

cursor:grab;

flex-shrink:0;

}

.save-program-btn{

width:100%;
height:58px;

border:none;

border-radius:18px;

background:#ff3b30;

color:white;

font-size:16px;
font-weight:800;

margin-top:20px;

cursor:pointer;
}

.program-exercise-image{

width:72px;
height:72px;

object-fit:cover;

border-radius:18px;

margin-right:14px;

flex-shrink:0;

}

.my-programs{

margin-top:80px;

}

.programs-list{

display:flex;
flex-direction:column;

gap:16px;

}

.program-item{

display:flex;
justify-content:space-between;
align-items:center;

gap:20px;

padding:20px;

border-radius:22px;

background:#161616;

border:
1px solid #2a2a2a;

}

.program-item-info{

display:flex;
flex-direction:column;

gap:8px;

}

.program-item-title{

font-size:18px;
font-weight:800;

}

.program-item-date{

font-size:13px;

color:#8a8a8a;

}

.program-item-actions{

display:flex;

gap:12px;

}

.program-action-btn{

height:44px;

padding:0 18px;

border:none;
border-radius:14px;

background:#1f1f1f;

color:white;

font-size:13px;
font-weight:800;

cursor:pointer;

}

.public-hero{

display:flex !important;
flex-direction:column;
align-items:flex-start;

padding-top:40px;

}

.exercise-comment{

width:100%;
min-height:90px;

margin-bottom:20px;

padding:16px;

border:none;
border-radius:18px;

background:#1f1f1f;

color:white;

font-size:14px;
line-height:1.6;

resize:vertical;

outline:none;

font-family:inherit;

}

.exercise-comment::placeholder{

color:#777;

}

.exercise-comment-view{

margin-top:10px;

padding:14px 16px;

border-radius:16px;

background:#1a1a1a;

font-size:13px;
line-height:1.6;

color:#cfcfcf;

}

.program-title-input{

width:100%;

background:transparent;

border:none;

outline:none;

color:white;

font-size:34px;
font-weight:900;

margin-bottom:10px;

font-family:inherit;

}

.program-tags{

display:flex;
gap:10px;

flex-wrap:wrap;

margin-bottom:18px;

font-size:11px;
font-weight:900;

letter-spacing:1px;

text-transform:uppercase;

color:#ff7777;

}

/* =========================
   MOBILE
========================= */

@media(max-width:900px){

.features,
.options{
grid-template-columns:1fr;
}

.hero{
padding-top:20px;
}

.hero h1{
font-size:38px;
}

.hero p{
font-size:16px;
line-height:1.5;
}

.hero-buttons{
flex-direction:column;
}

.primary-btn,
.secondary-btn{
width:100%;
height:56px;
}

.wizard h2{
font-size:30px;
}

.option{
padding:20px;
font-size:18px;
}

.request-grid{
grid-template-columns:1fr;
}

.exercise-selector-grid{

grid-template-columns:
repeat(2,1fr);

gap:10px;
}

.exercise-image{
height:110px !important;
}

.exercise-card-title{
font-size:11px;
}

.exercise-search{
height:52px;
font-size:14px;
}

/* =========================
   SELECTED EXERCISE
========================= */

.selected-exercise-card{

position:relative;

display:flex;

flex-direction:column;

align-items:stretch;

padding:16px !important;

gap:16px;

border-radius:20px;

width:100%;

overflow:hidden;
}

.selected-exercise-image{

width:64px !important;
height:64px !important;

border-radius:16px;

object-fit:cover;

flex-shrink:0;
}

.selected-exercise-content{

width:100%;

min-width:0;

overflow:hidden;
}

.selected-exercise-title{

font-size:16px;

line-height:1.3;

margin-bottom:6px;
}

.selected-exercise-muscle{

font-size:13px;

margin-bottom:14px;
}

.exercise-comment{

width:100%;

min-height:80px;

padding:14px;

font-size:14px;
}

.exercise-rest-row{

display:flex;

align-items:center;

gap:10px;

margin-top:0;

margin-bottom:18px;

flex-wrap:nowrap;
}

.rest-input{

width:90px;

flex-shrink:0;
}

.exercise-sets{

width:100%;

overflow:hidden;
}

.sets-header{

grid-template-columns:
34px
1fr
1fr
34px;

gap:6px;
}

.set-row{

display:grid;

grid-template-columns:
34px
1fr
1fr
34px;

gap:6px;

width:100%;

align-items:center;
}

.set-input{

width:100%;

min-width:0;
}

.add-set-btn{

width:100%;
}

.drag-handle{

margin-top:-6px;

width:36px;
height:36px;

border-radius:12px;

font-size:16px;
}

.remove-selected-large{

position:absolute;

top:14px;
right:14px;

width:36px;
height:36px;

font-size:16px;

z-index:5;
}

/* =========================
   PROGRAMS
========================= */

.program-item{
padding:14px !important;
}

.program-item-actions{
flex-wrap:wrap;
gap:8px;
}

.program-action-btn{

height:36px !important;

padding:0 12px;

font-size:11px;
}

.day-card{
padding:16px !important;
}

.exercise{
gap:10px;
}

.program-exercise-image{

width:56px !important;
height:56px !important;

border-radius:14px;
}

.exercise-name{
font-size:14px;
}

.exercise-meta,
.exercise-rest,
.exercise-level{

font-size:11px;

padding:6px 10px;
}

}

/* =========================
   APP MODE
========================= */
body.app-mode .download-btn{
display:none !important;
}

body.app-mode .share-btn{
display:none !important;
}

body.app-mode .hero{
padding-top:20px !important;
}

body.public-mode .my-programs{
display:none !important;
}

body.app-mode .program-item-actions{
flex-wrap:wrap;
}

body.app-mode .program-action-btn{
min-width:90px;
}