*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
    margin:0;
    font-family:Arial,sans-serif;
    background:
        radial-gradient(circle at 80px 80px,rgba(216,255,84,.18),transparent 35%),
        radial-gradient(circle at bottom right,rgba(255,211,77,.12),transparent 35%),
        #0b0e13;
    color:#fff;
}
a{text-decoration:none;color:inherit}
.page{width:100%;min-height:100vh;padding:18px 16px 90px;max-width:760px;margin:auto}
.hero{padding:54px 0 28px}
.chip{
    display:inline-flex;padding:8px 12px;border-radius:999px;
    background:rgba(216,255,84,.12);border:1px solid rgba(216,255,84,.35);
    color:#d8ff54;font-size:12px;font-weight:800;letter-spacing:.8px;text-transform:uppercase
}
h1{font-size:clamp(42px,13vw,72px);line-height:.92;margin:22px 0 12px;letter-spacing:-2px}
h1 span{color:#d8ff54}
.hero p,.muted{color:#aab1bd;line-height:1.6}
.btn{
    min-height:52px;border-radius:18px;display:flex;align-items:center;justify-content:center;
    font-weight:900;border:1px solid rgba(255,255,255,.14)
}
.btn-primary{background:#d8ff54;color:#111;box-shadow:0 16px 40px rgba(216,255,84,.22)}
.btn-dark{background:rgba(255,255,255,.08);color:#fff}
.hero-actions{display:grid;gap:12px;margin-top:24px}
.section{margin-top:34px}
.section-head{display:flex;align-items:end;justify-content:space-between;gap:12px;margin-bottom:14px}
.section-head h2{margin:0;font-size:23px}
.section-head small{color:#8f98a8}
.card{
    background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.045));
    border:1px solid rgba(255,255,255,.12);
    border-radius:26px;padding:18px;margin-bottom:14px;
    box-shadow:0 18px 60px rgba(0,0,0,.28);
    position:relative;overflow:hidden
}
.card:before{
    content:"";position:absolute;right:-45px;top:-45px;width:130px;height:130px;border-radius:50%;
    background:repeating-radial-gradient(circle,rgba(216,255,84,.20) 0 3px,transparent 4px 12px);
    opacity:.35
}
.card-content{position:relative;z-index:1}
.top{display:flex;justify-content:space-between;gap:14px}
.day{color:#d8ff54;font-size:12px;text-transform:uppercase;letter-spacing:1px;font-weight:900}
.time{font-size:24px;font-weight:900;margin-top:5px}
.title{font-size:20px;font-weight:900;margin-top:14px}
.remarks{color:#b8bfca;font-size:14px;line-height:1.5;margin-top:6px}
.pill{
    padding:8px 10px;border-radius:999px;font-size:11px;font-weight:900;
    height:max-content;text-transform:uppercase;white-space:nowrap
}
.ok{background:rgba(216,255,84,.12);border:1px solid rgba(216,255,84,.4);color:#d8ff54}
.full{background:rgba(239,68,68,.12);border:1px solid rgba(239,68,68,.35);color:#fca5a5}
.capacity{margin-top:14px;font-size:14px;color:#d9dde5}
.progress{height:8px;background:rgba(255,255,255,.12);border-radius:999px;overflow:hidden;margin-top:8px}
.progress span{display:block;height:100%;background:#d8ff54;border-radius:999px}
.card .btn{margin-top:16px}
.grid{display:grid;gap:12px}
.floating-book{
    position:fixed;left:14px;right:14px;bottom:14px;z-index:99;
    max-width:730px;margin:auto
}

.hero-v2{
    min-height:92vh;
    padding:70px 0 38px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    position:relative;
    overflow:hidden;
}
.hero-v2 h1{
    font-size:clamp(48px,15vw,96px);
    line-height:.86;
    margin:24px 0 18px;
    letter-spacing:-3px;
    max-width:760px;
}
.hero-v2 h1 span{color:#d8ff54}
.hero-v2 p{
    max-width:600px;
    color:#aab1bd;
    line-height:1.65;
    font-size:16px;
}
.hero-bg-ball{
    position:absolute;
    width:230px;
    height:230px;
    border-radius:50%;
    right:-80px;
    top:80px;
    background:
        repeating-radial-gradient(circle,rgba(11,14,19,.45) 0 4px,transparent 5px 18px),
        #d8ff54;
    opacity:.18;
    filter:blur(.2px);
}
.hero-bg-paddle{
    position:absolute;
    width:170px;
    height:260px;
    right:20px;
    bottom:75px;
    border-radius:90px 90px 70px 70px;
    border:2px solid rgba(216,255,84,.18);
    transform:rotate(-18deg);
    opacity:.45;
}
.hero-bg-paddle:after{
    content:"";
    position:absolute;
    width:34px;
    height:120px;
    background:rgba(216,255,84,.12);
    left:68px;
    bottom:-100px;
    border-radius:20px;
}
.feature-session{
    background:
        linear-gradient(135deg,rgba(216,255,84,.16),rgba(255,255,255,.045)),
        rgba(255,255,255,.04);
    border:1px solid rgba(216,255,84,.25);
    border-radius:30px;
    padding:22px;
    box-shadow:0 24px 70px rgba(216,255,84,.10);
}
.big-time{
    font-size:48px;
    font-weight:900;
    letter-spacing:-1px;
    margin-top:8px;
}
.program-list{
    display:grid;
    gap:12px;
}
.program-item{
    display:grid;
    grid-template-columns:42px 1fr;
    gap:14px;
    padding:18px;
    border-radius:24px;
    background:rgba(255,255,255,.065);
    border:1px solid rgba(255,255,255,.11);
}
.program-icon{
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    border-radius:50%;
    background:#d8ff54;
    color:#111;
    font-size:18px;
    box-shadow:0 10px 30px rgba(216,255,84,.25);
}
.program-item h3{
    margin:0 0 6px;
    font-size:18px;
}
.program-item p{
    margin:0;
    color:#aab1bd;
    line-height:1.45;
    font-size:14px;
}
.coach-section{
    display:grid;
    gap:16px;
}
.coach-photo{
    min-height:360px;
    border-radius:34px;
    background:
        linear-gradient(180deg,rgba(216,255,84,.18),rgba(0,0,0,.2)),
        rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.12);
    display:grid;
    place-items:center;
    overflow:hidden;
    position:relative;
}
.coach-photo:before{
    content:"";
    position:absolute;
    width:260px;
    height:260px;
    border-radius:50%;
    background:#d8ff54;
    opacity:.14;
}
.coach-placeholder{
    position:relative;
    z-index:1;
    font-size:48px;
    font-weight:900;
    line-height:.9;
    text-align:center;
    color:#fff;
    letter-spacing:-2px;
}
.coach-copy{
    padding:8px 2px;
}
.coach-copy h2{
    font-size:36px;
    line-height:1;
    margin:18px 0 12px;
    letter-spacing:-1px;
}
.coach-copy p{
    color:#aab1bd;
    line-height:1.6;
}
@media(min-width:900px){
    .page{max-width:1100px}
    .coach-section{
        grid-template-columns:.9fr 1.1fr;
        align-items:center;
    }
}

.back-link{
    display:inline-flex;
    margin:18px 0;
    color:#d8ff54;
    font-weight:900;
    text-decoration:none;
}

.page-title{
    font-size:42px;
    line-height:1;
    margin:20px 0;
}

.page-title span{
    color:#d8ff54;
}

.schedule-summary{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:10px;
    margin:18px 0;
}

.schedule-summary > div{
    border:1px solid rgba(255,255,255,.12);
    background:rgba(255,255,255,.06);
    border-radius:18px;
    padding:14px;
}

.schedule-summary small{
    display:block;
    color:#aab1bd;
    font-size:11px;
    font-weight:900;
    text-transform:uppercase;
}

.schedule-summary strong{
    display:block;
    margin-top:6px;
    font-size:24px;
    color:#fff;
}

.day-tabs{
    display:flex;
    gap:8px;
    overflow-x:auto;
    padding:4px 0 14px;
    margin-top:10px;
    scrollbar-width:none;
}

.day-tabs::-webkit-scrollbar{
    display:none;
}

.day-tab{
    flex:0 0 auto;
    min-width:82px;
    min-height:48px;
    border-radius:16px;
    border:1px solid rgba(255,255,255,.12);
    background:rgba(255,255,255,.06);
    color:#aab1bd;
    font-weight:1000;
    cursor:pointer;
}

.day-tab span{
    display:block;
    margin-top:2px;
    font-size:11px;
    color:#6f7784;
}

.day-tab.active{
    background:#d8ff54;
    color:#111;
    border-color:#d8ff54;
}

.day-tab.active span{
    color:#111;
}

.schedule-panel{
    display:none;
}

.schedule-panel.active{
    display:block;
}

.schedule-panel-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    margin:14px 0;
}

.schedule-panel-head h2{
    margin:0;
    font-size:28px;
}

.schedule-panel-head p{
    margin:5px 0 0;
    color:#aab1bd;
    font-weight:800;
}

.schedule-table-like{
    display:grid;
    gap:8px;
}

.schedule-line{
    display:grid;
    grid-template-columns:1.3fr 1fr auto auto;
    gap:12px;
    align-items:center;
    padding:14px;
    border-radius:18px;
    background:rgba(255,255,255,.055);
    border:1px solid rgba(255,255,255,.10);
}

.schedule-line-time{
    color:#fff;
    font-size:16px;
    font-weight:1000;
}

.schedule-line-time span{
    color:#6f7784;
    font-size:12px;
    margin:0 4px;
}

.schedule-line-info strong{
    display:block;
    color:#fff;
    font-size:14px;
}

.schedule-line-info small{
    display:block;
    color:#aab1bd;
    margin-top:3px;
}

.schedule-line-meta{
    display:flex;
    align-items:center;
    gap:7px;
    color:#aab1bd;
    font-size:12px;
    font-weight:900;
}

.status-dot{
    width:8px;
    height:8px;
    border-radius:999px;
    display:inline-block;
}

.status-dot.on{
    background:#d8ff54;
}

.status-dot.off{
    background:#ef4444;
}

.schedule-line-price{
    color:#fff;
    font-size:13px;
    font-weight:900;
}

.empty-state{
    padding:18px;
    border-radius:18px;
    background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.12);
    color:#aab1bd;
}

@media(max-width:680px){
    .schedule-summary{
        grid-template-columns:1fr 1fr 1fr;
    }

    .schedule-line{
        grid-template-columns:1fr;
        gap:8px;
    }

    .schedule-line-price{
        display:none;
    }
}

.week-control{
    display:grid;
    grid-template-columns:auto 1fr auto;
    gap:10px;
    align-items:center;
    margin:18px 0;
}

.week-btn{
    min-height:46px;
    padding:0 14px;
    border-radius:16px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(255,255,255,.07);
    border:1px solid rgba(255,255,255,.12);
    color:#fff;
    font-weight:900;
    white-space:nowrap;
}

.week-label{
    text-align:center;
    padding:12px;
    border-radius:18px;
    background:rgba(216,255,84,.10);
    border:1px solid rgba(216,255,84,.25);
}

.week-label small{
    display:block;
    color:#aab1bd;
    font-size:11px;
    font-weight:900;
    text-transform:uppercase;
}

.week-label strong{
    display:block;
    margin-top:4px;
    color:#d8ff54;
    font-size:16px;
}

.day-select-form{
    display:grid;
    gap:8px;
    margin:16px 0;
}

.day-select-form label{
    color:#aab1bd;
    font-size:12px;
    font-weight:900;
    text-transform:uppercase;
}

.day-select-form select{
    width:100%;
    min-height:54px;
    border-radius:18px;
    border:1px solid rgba(255,255,255,.14);
    background:rgba(255,255,255,.08);
    color:#fff;
    padding:0 14px;
    font-size:16px;
    font-weight:900;
}

.day-select-form option{
    color:#111;
}

.selected-day-card{
    margin:14px 0;
    padding:18px;
    border-radius:22px;
    background:linear-gradient(135deg,rgba(216,255,84,.16),rgba(255,255,255,.05));
    border:1px solid rgba(216,255,84,.25);
}

.selected-day-card small{
    display:block;
    color:#d8ff54;
    font-size:12px;
    font-weight:1000;
    text-transform:uppercase;
    letter-spacing:.08em;
}

.selected-day-card strong{
    display:block;
    margin-top:6px;
    font-size:24px;
    color:#fff;
}

.selected-day-card span{
    display:block;
    margin-top:5px;
    color:#aab1bd;
    font-weight:800;
}

.schedule-list-compact{
    display:grid;
    gap:8px;
}

.schedule-compact-row{
    display:grid;
    grid-template-columns:120px 1fr auto;
    gap:12px;
    align-items:center;
    padding:14px;
    border-radius:18px;
    background:rgba(255,255,255,.055);
    border:1px solid rgba(255,255,255,.10);
}

.schedule-compact-time strong{
    display:block;
    font-size:17px;
    color:#fff;
}

.schedule-compact-time span{
    display:block;
    margin-top:3px;
    color:#aab1bd;
    font-size:13px;
    font-weight:800;
}

.schedule-compact-main strong{
    display:block;
    color:#fff;
    font-size:15px;
}

.schedule-compact-main span{
    display:block;
    margin-top:3px;
    color:#aab1bd;
    font-size:13px;
}

.schedule-compact-side{
    text-align:right;
}

.mini-status{
    display:inline-flex;
    padding:6px 9px;
    border-radius:999px;
    font-size:11px;
    font-weight:1000;
    text-transform:uppercase;
}

.mini-status.is-active{
    background:rgba(216,255,84,.12);
    border:1px solid rgba(216,255,84,.35);
    color:#d8ff54;
}

.mini-status.is-inactive{
    background:rgba(239,68,68,.12);
    border:1px solid rgba(239,68,68,.35);
    color:#fca5a5;
}

.schedule-compact-side small{
    display:block;
    margin-top:5px;
    color:#aab1bd;
    font-size:12px;
    font-weight:800;
}

@media(max-width:620px){
    .week-control{
        grid-template-columns:1fr 1fr;
    }

    .week-label{
        grid-column:1 / -1;
        order:-1;
    }

    .schedule-compact-row{
        grid-template-columns:1fr;
        gap:8px;
    }

    .schedule-compact-side{
        text-align:left;
    }
}