:root{--o:#ff6500;--i:#17241f;--m:#66736d;--l:#dfe5e1;--bg:#f6f8f6}*{box-sizing:border-box}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--i);background:var(--bg);line-height:1.5}
button{font:inherit}.top{height:68px;background:#fff;border-bottom:1px solid var(--l);display:flex;justify-content:space-between;align-items:center;padding:0 5%}
.logo{font-weight:900;font-size:27px;letter-spacing:-2px}.logo span{color:var(--o)}.topright{display:flex;gap:18px;align-items:center;font-size:13px}.avatar{background:var(--i);color:#fff;border-radius:50%;width:36px;height:36px;display:grid;place-items:center;font-weight:bold}
.layout{display:grid;grid-template-columns:235px 1fr;min-height:calc(100vh - 68px)}.side{background:#fff;border-right:1px solid var(--l);padding:25px 15px}.side a{display:block;padding:11px 13px;border-radius:10px;margin:3px 0;font-size:14px}.side a.active{background:#fff0e7;color:#d95200;font-weight:bold}.label{font-size:10px;letter-spacing:1.5px;color:#8b9690;font-weight:bold;margin:25px 13px 7px}
main{max-width:1250px;width:100%;margin:auto;padding:34px 5% 55px}.eyebrow{font-size:10px;letter-spacing:2px;color:#77827d;font-weight:bold}.hero{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:24px}.hero h1{font-size:clamp(38px,5vw,60px);line-height:.98;letter-spacing:-3px;margin:7px 0}.hero p{max-width:700px;color:var(--m)}
.stagehero{background:var(--i);color:#fff;border-radius:18px;padding:26px;margin-bottom:20px}.stagehero .eyebrow{color:#aebbb5}.stagehero h2{font-size:32px;margin:4px 0}.stagehero p{color:#cbd3cf}.stagemeta{display:flex;justify-content:space-between;gap:20px}.pill{display:inline-block;border:1px solid #53615b;background:#2d3a34;border-radius:30px;padding:7px 11px;font-size:11px}
.progress{height:9px;background:#394741;border-radius:20px;overflow:hidden;margin:20px 0 7px}.progress i{display:block;height:100%;background:var(--o);width:0}.progressline{font-size:11px;color:#cbd3cf;display:flex;justify-content:space-between}
.journey{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:20px 0}.j{background:#fff;border:1px solid var(--l);border-radius:11px;padding:13px;min-height:92px}.j strong{font-size:11px;color:var(--o);display:block}.j.current{border:2px solid var(--o)}.j.complete{background:#f0f6f2;border-color:#c7d7cf}.j.lock{opacity:.43}.j small{display:block;color:var(--m);margin-top:5px}
.grid{display:grid;grid-template-columns:1.15fr .85fr;gap:20px}.card{background:#fff;border:1px solid var(--l);border-radius:16px;padding:22px}.card h3{margin:0 0 5px;font-size:21px}.card>p{color:var(--m);font-size:14px}
.task{display:flex;gap:13px;align-items:center;border:1px solid var(--l);border-radius:11px;padding:14px;margin:10px 0;cursor:pointer}.task.done{background:#f1f7f3}.check{width:22px;height:22px;border:1px solid #aeb9b3;border-radius:6px;display:grid;place-items:center;flex:0 0 22px}.task.done .check,.milestone.done .check{background:var(--o);border-color:var(--o);color:#fff}.task small{display:block;color:var(--m);margin-top:2px}.tag{margin-left:auto;background:#eef2ef;border-radius:20px;padding:5px 8px;font-size:10px;white-space:nowrap}.tag.orange{background:#fff0e7;color:#d95200}
.milestone{display:flex;gap:10px;align-items:center;padding:12px 0;border-bottom:1px solid var(--l);cursor:pointer;font-size:13px}.milestone .status{margin-left:auto;font-size:10px;font-weight:bold;color:var(--o)}.milestone.done .status{color:#3d6a55}
.module{border:1px solid var(--l);border-radius:11px;padding:15px;margin:9px 0;cursor:pointer}.module b{display:block}.module small{color:var(--m)}.module.done{background:#f1f7f3;border-color:#c7d7cf}.module.done b:after{content:" ✓";color:#3d6a55}
.twocol{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:20px}.cta,.ghost{border-radius:10px;padding:12px 16px;font-weight:bold;cursor:pointer}.cta{background:var(--o);color:#fff;border:0}.cta:disabled{opacity:.45}.ghost{background:#fff;border:1px solid var(--l)}
.notice{padding:14px;background:#fff0e7;border-left:4px solid var(--o);font-size:13px}.safety{font-size:12px;color:#59665f;background:#eef2ef;border-radius:10px;padding:14px;margin-top:20px}
.modal{display:none;position:fixed;inset:0;background:#17241fcc;z-index:20;align-items:center;justify-content:center;padding:20px}.modal.open{display:flex}.modalbox{background:#fff;max-width:760px;width:100%;max-height:88vh;overflow:auto;border-radius:18px;padding:28px}.close{float:right}.edu-head{padding-bottom:15px;border-bottom:1px solid var(--l)}.edu-section{margin:22px 0}.edu-section h3{font-size:15px;margin-bottom:8px}.edu-section ul{padding-left:20px}.actionbox{background:#f4f7f5;border-radius:12px;padding:18px}.actionbox textarea{width:100%;min-height:100px;border:1px solid var(--l);border-radius:10px;padding:10px;font:inherit;margin:10px 0}.readtime{font-size:11px;color:var(--m)}
footer{padding:25px 5%;font-size:12px;color:#78837e}
@media(max-width:850px){.layout{grid-template-columns:1fr}.side{display:none}.hero{display:block}.grid,.twocol{grid-template-columns:1fr}.journey{grid-template-columns:1fr 1fr}.j:last-child{grid-column:1/-1}.stagemeta{display:block}}

.exercise{border:1px solid var(--l);border-radius:12px;margin:10px 0;overflow:hidden;background:#fff;cursor:pointer}.exercise.done{background:#f1f7f3;border-color:#c7d7cf}.ex-top{display:flex;align-items:center;gap:12px;padding:15px}.ex-name{flex:1}.ex-name b{display:block}.ex-name small{display:block;color:var(--m);margin-top:3px}.ex-detail{display:none;border-top:1px solid var(--l);padding:15px 18px 18px 50px;background:#fafcfa;font-size:13px;color:#53605a}.exercise:hover .ex-detail,.exercise.done .ex-detail{display:block}.ex-detail p{margin:5px 0 0}.exercise .check{width:22px;height:22px;border:1px solid #aeb9b3;border-radius:6px;display:grid;place-items:center;flex:0 0 22px}.exercise.done .check{background:var(--o);border-color:var(--o);color:#fff}

.milestone{display:flex;align-items:center;gap:10px;padding:11px 0;border-top:1px solid var(--l);font-size:13px;cursor:pointer}.milestone .check{width:21px;height:21px;border:1px solid #aeb9b3;border-radius:6px;display:grid;place-items:center;flex:0 0 21px}.milestone.done .check{background:var(--o);border-color:var(--o);color:#fff}.milestone.done{color:#53605a}.milestone .status{margin-left:auto;font-size:10px;font-weight:700;letter-spacing:.08em;color:#7a8580}.module{border:1px solid var(--l);border-radius:12px;padding:14px 16px;margin:10px 0;cursor:pointer;background:#fff}.module.done{background:#f1f7f3;border-color:#c7d7cf}.module b{display:block}.module small{display:block;color:var(--m);margin-top:4px}