@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@400;500;600;700;800&display=swap');
:root{--blue:#1769e0;--deep:#0e3b89;--sky:#eaf3ff;--line:#e1ebf8;--text:#183250;--muted:#7d91ab;--white:#fff;--shadow:0 12px 30px rgba(28,91,170,.10)}*{box-sizing:border-box}body{margin:0;background:#f3f7fc;color:var(--text);font-family:'Noto Sans SC',sans-serif}.app-shell{min-height:100vh;max-width:520px;margin:auto;background:#f7faff;box-shadow:0 0 40px #b9cbe033}.topbar{height:64px;padding:0 20px;display:flex;align-items:center;justify-content:space-between;background:#fff;position:sticky;top:0;z-index:5;border-bottom:1px solid #edf3fa}.brand-mark{display:flex;align-items:center;gap:8px;color:var(--deep);font-size:20px}.brand-mark span{display:grid;place-items:center;width:34px;height:34px;border-radius:11px;background:linear-gradient(135deg,#2e8aff,#1255c7);color:#fff;font-weight:800}.brand-mark strong{font-weight:800;letter-spacing:2px}.top-action{border:0;background:none;color:var(--muted);font-size:13px;position:relative}.top-action i{position:absolute;width:6px;height:6px;background:#ff6876;border-radius:50%;right:-4px;top:0}.page-wrap{padding:18px 18px 92px;min-height:calc(100vh - 64px)}.hero{padding:24px 22px;border-radius:24px;background:linear-gradient(130deg,#e5f1ff,#fff);position:relative;overflow:hidden;min-height:192px}.hero:after{content:none!important;display:none!important}.eyebrow{color:var(--blue);font-size:11px;letter-spacing:2px;font-weight:700}.hero h1{position:relative;z-index:1;color:var(--deep);font-size:29px;line-height:1.35;margin:10px 0}.hero p{position:relative;z-index:1;color:#6280a4;font-size:13px;margin:0}.section-head{display:flex;justify-content:space-between;align-items:center;margin:26px 2px 13px}.section-head h2{font-size:18px;margin:0;color:var(--deep)}.section-head small{color:var(--muted)}.video-card,.news-card,.panel,.profile-card{background:#fff;border:1px solid #edf3fa;border-radius:18px;box-shadow:var(--shadow)}.video-card{height:178px;display:grid;place-items:center;background:linear-gradient(150deg,#e5f2ff,#d5e8ff);position:relative;overflow:hidden}.video-card:before{content:'';position:absolute;width:200px;height:200px;border-radius:50%;border:1px solid #fff8;top:-75px;right:-15px}.play{width:54px;height:54px;border-radius:50%;background:#fff;color:var(--blue);display:grid;place-items:center;font-size:22px;padding-left:3px;box-shadow:0 7px 18px #367bd333}.video-card label{position:absolute;left:15px;bottom:13px;color:#5b7ea7;font-size:12px}.quick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.quick{border:0;background:#fff;border-radius:15px;padding:13px 3px;color:var(--text);font-size:11px;box-shadow:var(--shadow)}.quick b{display:grid;place-items:center;color:var(--blue);font-size:22px;margin-bottom:6px}.news-list{padding:0 16px}.news-item{display:flex;align-items:center;gap:10px;padding:14px 0;border-bottom:1px solid #edf3fa;font-size:13px}.news-item:last-child{border-bottom:0}.news-item b{background:#eaf3ff;color:var(--blue);border-radius:6px;padding:3px 6px;font-size:11px}.news-item span{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.news-item time{font-size:11px;color:#aab8c8}.footer{text-align:center;color:#9aabc0;font-size:12px;padding:27px 0 0}.page-title{font-size:26px;color:var(--deep);margin:10px 0 4px}.sub-title{margin:0;color:var(--muted);font-size:13px}.share-banner{margin-top:22px;border-radius:22px;padding:22px;background:linear-gradient(135deg,#1667df,#3c95ff);color:#fff;position:relative;overflow:hidden}.share-banner:after{content:'↗';position:absolute;right:20px;bottom:-12px;font-size:100px;color:#ffffff22;font-weight:800}.share-banner h2{margin:0;font-size:22px}.share-banner p{margin:8px 0 0;color:#d9eaff;font-size:12px}.invite-code{display:flex;justify-content:space-between;align-items:center;margin-top:18px;background:#fff1;border:1px solid #ffffff44;padding:10px 12px;border-radius:10px;font-size:12px}.invite-code button,.primary{border:0;border-radius:10px;background:var(--blue);color:#fff;padding:11px 17px;font-weight:700}.invite-code button{padding:6px 12px;background:#fff;color:var(--blue);font-size:11px}.milestones{margin-top:18px}.milestone{display:flex;align-items:center;gap:12px;background:#fff;padding:15px;border-bottom:1px solid #edf3fa}.milestone:first-child{border-radius:18px 18px 0 0}.milestone:last-child{border-radius:0 0 18px 18px}.milestone .count{width:43px;height:43px;border-radius:13px;background:#eaf3ff;color:var(--blue);display:grid;place-items:center;font-weight:800}.milestone .reward{flex:1;font-size:14px;font-weight:600}.milestone .reward small{display:block;color:#9aaabd;font-weight:400;font-size:11px;margin-top:4px}.status{font-size:11px;color:#ff9a42;background:#fff5e9;padding:5px 8px;border-radius:7px}.reward-balance{padding:22px;border-radius:20px;background:linear-gradient(135deg,#0e3b89,#1973eb);color:#fff;margin-top:24px}.reward-balance small{color:#b9d5ff}.reward-balance strong{display:block;font-size:34px;margin:5px 0 17px}.reward-balance .primary{background:#fff;color:var(--blue)}.claim-list{margin-top:17px}.claim-row{display:flex;align-items:center;justify-content:space-between;background:#fff;padding:17px;border-bottom:1px solid #edf3fa}.claim-row:first-child{border-radius:17px 17px 0 0}.claim-row:last-child{border-radius:0 0 17px 17px}.claim-row p{margin:0;font-size:14px;font-weight:600}.claim-row small{display:block;color:var(--muted);font-size:11px;margin-top:4px}.claim-row button{background:#eaf3ff;border:0;color:var(--blue);border-radius:9px;padding:8px 12px;font-size:12px}.profile-card{padding:20px;display:flex;align-items:center;gap:13px;background:linear-gradient(135deg,#fff,#eaf3ff)}.avatar{width:54px;height:54px;border-radius:18px;background:linear-gradient(135deg,#7cbcff,#1769e0);display:grid;place-items:center;color:#fff;font-size:25px}.profile-card h2{margin:0;color:var(--deep);font-size:18px}.profile-card p{margin:5px 0 0;color:var(--muted);font-size:12px}.profile-card .edit{margin-left:auto;color:var(--blue);font-size:12px}.stats{display:grid;grid-template-columns:repeat(3,1fr);padding:17px 0;margin-top:15px;text-align:center}.stats strong{display:block;color:var(--deep);font-size:19px}.stats span{font-size:11px;color:var(--muted)}.tabs{display:grid;grid-template-columns:1fr 1fr;background:#eaf3ff;padding:4px;border-radius:11px;margin:18px 0}.tabs button{border:0;background:none;padding:10px;color:#6684a8;border-radius:8px}.tabs button.active{background:#fff;color:var(--blue);font-weight:700;box-shadow:0 3px 10px #4385c31a}.menu-title{font-weight:700;color:var(--deep);margin:21px 2px 12px}.menu-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#edf3fa;border-radius:17px;overflow:hidden}.menu-item{border:0;background:#fff;padding:17px 5px;color:var(--text);font-size:12px}.menu-item span{display:block;color:var(--blue);font-size:22px;margin-bottom:7px}.toast{position:fixed;left:50%;bottom:105px;transform:translate(-50%,20px);background:#183250;color:#fff;padding:10px 17px;border-radius:10px;font-size:12px;opacity:0;pointer-events:none;transition:.25s;z-index:20}.toast.show{opacity:1;transform:translate(-50%,0)}.bottom-nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(520px,100%);height:74px;background:#fff;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #eaf0f7;z-index:10;padding-bottom:5px}.bottom-nav button{border:0;background:none;color:#9aabc0;font-family:inherit;font-size:11px}.bottom-nav button span{display:block;font-size:24px;line-height:30px}.bottom-nav button.active{color:var(--blue);font-weight:700}.bottom-nav button.active span{font-size:27px}@media(min-width:600px){.bottom-nav{border-radius:18px 18px 0 0}.app-shell{min-height:100vh}}

/* four-color brand wordmark v20260818-8 */
.brand-mark{gap:2px!important;font-size:21px!important;letter-spacing:0!important;font-weight:800!important}.brand-mark .brand-char{display:inline!important;width:auto!important;height:auto!important;border-radius:0!important;background:none!important;font-weight:800!important;line-height:1!important}.brand-mark .brand-char-1{color:#2563eb!important}.brand-mark .brand-char-2{color:#0f766e!important}.brand-mark .brand-char-3{color:#d97706!important}.brand-mark .brand-char-4{color:#1e3a8a!important}

/* hero video spacing v20260818-9 */
.hero + .video-card{margin-top:24px!important}
.video-card{margin-bottom:4px}
.video-card .home-video{display:block;width:100%;height:100%;object-fit:cover;background:#dbeaf7}

/* darker slightly larger frontend text v20260818-11 */
:root{--text:#111827;--deep:#111827;--muted:#4b5563}
body{color:#111827;font-size:15px}
.section-head h2{font-size:19px!important;color:#111827!important}
.section-head small,.sub-title,.hero p,.video-card label,.footer{font-size:14px!important;color:#4b5563!important}
.page-title{font-size:27px!important;color:#111827!important}
.hero h1{font-size:30px!important;color:#111827!important}
.quick{font-size:12px!important;color:#111827!important}
.news-item{font-size:14px!important;color:#111827!important}
.share-banner h2{font-size:23px!important}
.share-banner p,.invite-code{font-size:13px!important}
.milestone .reward{font-size:15px!important;color:#111827!important}
.claim-row p{font-size:15px!important;color:#111827!important}
.claim-row small,.milestone .reward small,.stats span,.profile-card p{font-size:12px!important;color:#4b5563!important}
.profile-card h2,.menu-title{color:#111827!important}
.bottom-nav button em{font-size:14px!important}
/* visible route title in header v20260818-13 */
.route-brand{gap:3px!important;font-size:21px!important;letter-spacing:0!important}.route-brand .route-title-prefix{display:inline!important;width:auto!important;height:auto!important;background:none!important;color:#2563eb!important;font-weight:800!important}.route-brand .route-title-sep{display:inline!important;color:#94a3b8!important;font-weight:700!important}.route-brand .route-title-name{display:inline!important;color:#0f766e!important;font-weight:800!important}

/* centered clean route header v20260818-14 */
.topbar{justify-content:center!important;position:sticky!important}
.topbar .top-action{position:absolute;right:20px}
.route-brand{display:flex!important;align-items:center!important;justify-content:center!important;gap:3px!important;width:auto!important;font-size:22px!important;line-height:1!important;letter-spacing:0!important}
.route-brand span,.route-brand strong,.route-brand .route-title-prefix,.route-brand .route-title-sep,.route-brand .route-title-name{display:inline!important;width:auto!important;height:auto!important;min-width:0!important;min-height:0!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;line-height:1.2!important}
.route-brand .route-title-prefix{color:#2563eb!important;font-weight:800!important}
.route-brand .route-title-sep{color:#94a3b8!important;font-weight:600!important;margin:0 2px!important}
.route-brand .route-title-name{color:#0f766e!important;font-weight:800!important}
/* calm topbar without action v20260818-15 */
.topbar{background:linear-gradient(135deg,#edf5ff 0%,#f2fbfa 100%)!important;border-bottom:1px solid #dcecf2!important;box-shadow:0 3px 12px rgba(38,92,145,.06)!important}.topbar .top-action{display:none!important}.route-brand{font-size:21px!important}.route-brand .route-title-prefix{color:#245fc7!important}.route-brand .route-title-sep{color:#8aa4b6!important}.route-brand .route-title-name{color:#087f7a!important}

/* personalized left brand logo v20260818-16 */
.topbar{justify-content:space-between!important;padding:0 18px!important;position:sticky!important}
.brand-logo{position:relative;display:flex!important;align-items:center!important;gap:4px!important;height:40px!important;color:#123f82!important}
.logo-symbol{display:grid!important;place-items:center!important;width:34px!important;height:34px!important;border-radius:12px 12px 12px 5px!important;background:linear-gradient(145deg,#2563eb,#0faaa2)!important;color:#fff!important;font-size:20px!important;font-weight:900!important;box-shadow:0 6px 14px rgba(37,99,235,.2)!important}
.logo-word{font-size:22px!important;line-height:1!important;letter-spacing:1px!important;color:#123f82!important;font-weight:900!important}
.logo-accent{position:absolute!important;left:39px!important;bottom:1px!important;width:17px!important;height:3px!important;border-radius:3px!important;background:#0faaa2!important;transform:skewX(-25deg)!important}
.page-route-title{position:absolute!important;left:50%!important;transform:translateX(-50%)!important;color:#21466f!important;font-size:16px!important;font-weight:700!important;letter-spacing:1px!important}
/* unified svg icon system v20260818-17 */
.quick{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:6px!important}.quick-svg{width:27px!important;height:27px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.8!important;stroke-linecap:round!important;stroke-linejoin:round!important;color:#1769e0!important}.menu-item span{display:block!important;height:28px!important}.menu-item span svg{width:25px!important;height:25px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.8!important;stroke-linecap:round!important;stroke-linejoin:round!important;color:#0f8f95!important}

/* mine assistance balance layout v20260818-18 */
.mine-balance{display:flex;align-items:center;justify-content:space-between;margin-top:15px;padding:20px;border-radius:18px;background:linear-gradient(135deg,#eff7ff,#e9fbf8);border:1px solid #dcecf2;box-shadow:var(--shadow)}.mine-balance small{display:block;color:#4b5563;font-size:13px;margin-bottom:7px}.mine-balance strong{display:block;color:#123f82;font-size:26px;line-height:1.1}.mine-balance strong span{font-size:13px;font-weight:500;margin-left:3px;color:#4b5563}.mine-balance button{border:0;border-radius:10px;padding:10px 14px;background:#0faaa2;color:#fff;font-size:13px;font-weight:700;box-shadow:0 5px 12px rgba(15,170,162,.18)}

/* signin calendar and rules v20260818-19 */
.signin-summary{display:flex;align-items:center;justify-content:space-between;margin-top:18px;padding:20px;border-radius:18px;background:linear-gradient(135deg,#eef6ff,#e9fbf8);border:1px solid #dcecf2}.signin-summary strong{display:block;color:#123f82;font-size:30px}.signin-summary span{display:block;color:#4b5563;font-size:13px;margin-top:4px}.signin-today{border:0;border-radius:10px;padding:10px 15px;background:#0faaa2;color:#fff;font-size:13px;font-weight:700}.signin-calendar-card{margin-top:16px;padding:17px 12px;background:#fff;border:1px solid #edf3fa;border-radius:18px;box-shadow:var(--shadow)}.signin-calendar-head{display:flex;justify-content:space-between;align-items:center;padding:0 4px 13px;color:#123f82}.signin-calendar-head span{color:#71859b;font-size:12px}.signin-calendar{display:grid;grid-template-columns:repeat(7,1fr);gap:7px}.signin-day{min-height:48px;border:1px solid #e4edf5;border-radius:10px;background:#f8fbff;color:#123f82;padding:5px 2px}.signin-day b{display:block;font-size:14px}.signin-day small{display:block;color:#8a9caf;font-size:9px;margin-top:4px}.signin-day[data-action]:active,.signin-day.signed{background:#e7f8f5;border-color:#8ed9d1}.signin-day.signed small{color:#0f8f88}.signin-rules{background:#fff;border:1px solid #edf3fa;border-radius:18px;overflow:hidden;box-shadow:var(--shadow)}.signin-rules div{display:flex;align-items:center;justify-content:space-between;padding:15px 17px;border-bottom:1px solid #edf3fa}.signin-rules div:last-child{border-bottom:0}.signin-rules strong{color:#123f82;font-size:14px}.signin-rules span{color:#4b5563;font-size:13px}

/* clear signin entry and back control v20260818-20 */
.signin-entry{color:#087f7a!important;font-weight:800!important;box-shadow:0 3px 10px rgba(15,170,162,.12)!important}.signin-head{display:flex;align-items:center;gap:12px;margin:4px 0 4px}.signin-head .page-title{margin:0}.page-back{border:0;background:#e8f7f5;color:#087f7a;border-radius:9px;padding:7px 10px;font-size:13px;font-weight:700}.signin-today{min-width:112px!important;padding:12px 17px!important;font-size:14px!important;box-shadow:0 7px 15px rgba(15,170,162,.2)!important}.signin-today:after{content:'  ›';font-size:17px}.signin-today:disabled{background:#a7c8c5!important;box-shadow:none!important}
