*{box-sizing:border-box}body{color:#203c31;background:#fff;margin:0;font-family:system-ui,-apple-system,PingFang SC,sans-serif;font-size:20px;line-height:1.65}a{color:#236250;text-decoration:none}a:hover{text-decoration:underline}.h5-shell{max-width:760px;min-height:100vh;margin:auto}.topbar{border-bottom:1px solid #e5ebe7;justify-content:space-between;align-items:center;padding:20px 24px;font-size:18px;display:flex}.topbar>a:first-child{font-weight:700}main{overflow-wrap:anywhere;padding:28px 24px 120px}h1{margin:0 0 12px;font-size:30px;line-height:1.35}h2{margin:0;font-size:23px;line-height:1.4}p{margin:12px 0 20px}.page-title{margin:10px 0 28px}.page-title p,.muted{color:#65746e}.small{font-size:17px}.notice{color:#963e29;background:#fff4f1;border:1px solid #e5d2ce;border-radius:8px;margin:18px 0;padding:16px 18px;line-height:1.6}.notice.info{color:#365b49;background:#f1f7f3;border-color:#d5e4dc}.notice.success{color:#236250;background:#edf7ef;border-color:#c4ddcd}.loading{color:#65746e;padding:40px 0}.empty{border-block:1px solid #e4ebe6;padding:28px 0}.empty h2{margin-bottom:12px}label{margin:20px 0 8px;font-weight:600;display:block}input,select{font:inherit;color:#203c31;background:#fff;border:1px solid #bccbc2;border-radius:8px;width:100%;min-height:54px;padding:12px 14px}input::placeholder{color:#8b968f}button,.button-link{font:inherit;color:#fff;cursor:pointer;text-align:center;background:#236250;border:1px solid #0000;border-radius:8px;width:100%;min-height:54px;margin-top:22px;padding:14px 18px;font-weight:600;line-height:1.45;text-decoration:none;display:block}button.secondary,.button-link.secondary{color:#236250;background:#fff;border-color:#b3c8bd}button:disabled{opacity:.55;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline-offset:3px;outline:3px solid #c09b38}.code-row{gap:10px;display:flex}.code-row input{flex:1;min-width:0}.code-row button{flex:none;width:auto;min-width:124px;margin:0;padding:12px;font-size:17px}.bottom-nav{width:min(760px,100%);padding:10px 12px max(10px, env(safe-area-inset-bottom));z-index:5;background:#fffffff7;border-top:1px solid #dce6df;display:flex;position:fixed;bottom:0;left:50%;transform:translate(-50%)}.bottom-nav a{text-align:center;color:#6c7b73;flex:1;padding:10px;font-size:19px}.bottom-nav a.active{color:#236250;background:#eef5f0;border-radius:8px;font-weight:700}.course-list,.lesson-list{margin:0;padding:0;list-style:none}.course-list li{border-bottom:1px solid #dde5e0;padding:24px 0}.course-link{color:#203c31;justify-content:space-between;align-items:center;gap:16px;display:flex}.course-link>span{color:#698475;font-size:34px}.course-link p{color:#65746e;margin:10px 0;font-size:18px}.course-status{color:#236250;font-size:17px}.lesson-list li{border-bottom:1px solid #dde5e0;align-items:center;gap:14px;padding:22px 0;display:flex}.lesson-list li>div{flex:1;min-width:0}.lesson-list h2{font-size:21px}.lesson-list p{margin:6px 0 0}.lesson-number{color:#7a8c80;align-self:flex-start;font-size:18px}.lesson-action{flex:none;padding:10px 8px;font-size:18px}.back-link{margin-bottom:20px;font-size:18px;display:inline-block}.receipt{background:#f5f8f5;border:1px solid #dfe8e1;border-radius:10px;margin:24px 0;padding:24px}.receipt ul{padding-left:24px}.receipt p:last-child{margin-bottom:0}.help-section{border-bottom:1px solid #e1e8e3;padding:22px 0}.help-section p:last-child{margin-bottom:0}.video-wrap{background:#122019;border-radius:8px;margin:24px -8px 18px;overflow:hidden}.video-wrap video{aspect-ratio:16/9;background:#122019;width:100%;max-height:65vh;display:block}.player-options{align-items:center;gap:20px;display:flex}.player-options label{white-space:nowrap;margin:0}.player-options select{flex:1;min-width:0}@media (width>=640px){main{padding:40px 40px 120px}.topbar{padding:22px 40px}.video-wrap{margin-left:0;margin-right:0}}@media (width<=360px){main,.topbar{padding-inline:16px}.code-row{gap:8px}.code-row button{min-width:110px;font-size:16px}.receipt{padding:18px}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}.environment-banner{color:#654507;background:#fff5d9;border:1px solid #d6a33e;border-radius:8px;margin-bottom:16px;padding:12px 16px;font-size:15px;line-height:1.6}