:root{
 --blue:#236cff;--blue-2:#0c83f9;--navy:#152b4e;--muted:#8294b3;--line:#e9eff7;--bg:#eaf3ff;--white:#fff;--shadow:0 8px 26px rgba(41,102,166,.065);--green:#0abf9a;--orange:#ff9438;--purple:#8b69ff;
 font-family:"Noto Sans SC",-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
 font-synthesis:none;color:var(--navy);background:#e6f0fd;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;min-height:100%;}body{min-width:320px}button,input,textarea,select{font:inherit}button{cursor:pointer;appearance:none}button:disabled{cursor:not-allowed;opacity:.55}a{color:inherit;text-decoration:none}svg{vertical-align:middle}::selection{background:#c8ddff}
.ambient{position:fixed;border-radius:50%;filter:blur(2px);pointer-events:none}.ambient-one{width:55vw;height:55vw;top:-25vw;right:-10vw;background:radial-gradient(circle,#cae7ff77,transparent 67%)}.ambient-two{width:38vw;height:38vw;left:-12vw;bottom:-18vw;background:radial-gradient(circle,#bed2ff80,transparent 69%)}
.phone-frame{width:min(100%,450px);height:100dvh;position:relative;margin:0 auto;background:linear-gradient(155deg,#e4f0ff 0%,#edf6ff 32%,#f5f9ff 88%);overflow:hidden}
#app{height:100%;position:relative}.view{height:100%;overflow-y:auto;padding:0 17px calc(100px + env(safe-area-inset-bottom));scrollbar-width:none}.view::-webkit-scrollbar{display:none}.view.detail-view{padding-bottom:40px}
.desktop-brand{display:none}
.brand-symbol{width:35px;height:35px;background:linear-gradient(140deg,#1c86fc,#2646ff);border-radius:12px;display:inline-flex;align-items:center;justify-content:center;gap:3px;transform:rotate(-9deg);box-shadow:0 8px 18px #3179ff35}.brand-symbol span{width:5px;border-radius:5px;background:white;transform:rotate(27deg)}.brand-symbol span:nth-child(1){height:10px;opacity:.6}.brand-symbol span:nth-child(2){height:20px}.brand-symbol span:nth-child(3){height:14px;opacity:.8}
.top{padding:26px 1px 18px;display:flex;align-items:center;justify-content:space-between;gap:10px}.top-left{display:flex;align-items:center;gap:10px}.top .brand-symbol{height:30px;width:30px;border-radius:10px}.top-title{font-size:20px;font-weight:900;letter-spacing:-.7px;color:#14284b}.top-title em{font-style:normal;font-size:10px;color:var(--blue);background:#dbeaff;border-radius:6px;padding:4px 5px;vertical-align:middle;letter-spacing:.4px}.top-right{display:flex;gap:9px;align-items:center}.icon-btn{height:34px;width:34px;border:1px solid #dbe8ff;background:#ffffffb5;color:var(--blue);border-radius:12px;display:inline-flex;align-items:center;justify-content:center;position:relative}.notice-dot{position:absolute;right:6px;top:5px;width:6px;height:6px;background:#ff744c;border:1px solid white;border-radius:50%}.avatar-sm{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:linear-gradient(145deg,#d3e8ff,#a8c6ff);color:#2762d2;border:2px solid white}
.pill-outline{border:1.5px solid #8cb8ff;background:#fff;color:var(--blue);border-radius:100px;padding:7px 14px;font-size:12px;font-weight:700;white-space:nowrap}
.eyebrow{font-weight:800;letter-spacing:2px;font-size:10px;text-transform:uppercase;color:#4e83d2}.hero{position:relative;overflow:hidden;border-radius:23px;padding:24px 21px 22px;background:linear-gradient(120deg,#d4e9ff 0%,#cfe5ff 54%,#dff9ff 100%);border:1px solid #f9fdff;box-shadow:0 10px 28px #9fc5ee29;min-height:208px}.hero h1{font-size:25px;letter-spacing:-.7px;line-height:1.46;margin:10px 0 7px;font-weight:900}.hero h1 span{color:var(--blue)}.hero p{font-size:12px;color:#6989b1;margin:0;line-height:1.8;max-width:210px}.hero-cta{margin-top:19px;display:inline-flex;align-items:center;gap:5px;background:#236cff;color:white;border:0;border-radius:10px;padding:9px 13px;font-size:12px;font-weight:800;box-shadow:0 7px 15px #236cff33;position:relative;z-index:2}.hero-orbit{width:156px;height:156px;border-radius:50%;border:20px solid #ffffff70;position:absolute;right:-37px;top:22px;box-shadow:0 0 0 15px #ffffff36,inset 0 8px 30px #4295ff21;transform:rotate(-25deg)}.hero-widget{position:absolute;right:15px;top:54px;width:120px;height:102px;background:linear-gradient(145deg,#fff,#def1ff);border:1px solid white;border-radius:19px;box-shadow:8px 16px 20px #4e95d138;transform:rotate(-12deg);display:flex;flex-direction:column;align-items:center;justify-content:center}.hero-widget .hero-chart{width:70px;height:48px;border-bottom:3px solid #bddbff;border-left:3px solid #bddbff;position:relative}.hero-chart::after{content:"";position:absolute;inset:8px 4px 5px;background:linear-gradient(140deg,transparent 0 18%,#47b1f9 18% 24%,transparent 24% 39%,#47b1f9 39% 45%,transparent 45% 59%,#246bff 59% 66%,transparent 66%);clip-path:polygon(0 82%,30% 55%,50% 68%,100% 0,100% 15%,50% 84%,30% 72%,0 100%)}.hero-widget .little-lines{height:5px;width:58px;border-radius:9px;background:#cde3ff;margin-top:13px}.hero-widget .little-lines:last-child{width:35px;align-self:flex-start;margin:5px 0 0 31px}.float-coin{position:absolute;right:4px;top:28px;display:flex;justify-content:center;align-items:center;width:38px;height:38px;border-radius:13px;background:linear-gradient(140deg,#ffdd83,#ffa638);color:#fff;box-shadow:0 10px 15px #f9a94355;transform:rotate(12deg)}.float-spark{position:absolute;right:142px;top:34px;color:#4c92ff}
.ticker{border:1px solid #deebff;border-radius:13px;background:#ffffffbd;margin:13px 0 19px;padding:11px 12px;display:flex;align-items:center;gap:9px;font-size:12px;color:#7084a5}.ticker svg{color:var(--blue);flex:none}.ticker span{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.ticker b{color:var(--blue);font-size:11px}
.section{margin:24px 0 0}.section-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:13px}.section-header h2{font-size:17px;display:flex;align-items:center;gap:8px;margin:0;font-weight:900}.section-header h2:before{content:"";width:4px;height:18px;background:linear-gradient(#599bff,#1662f1);border-radius:5px}.section-header button,.mini-link{background:none;border:0;color:#7892b6;font-size:11px;display:inline-flex;align-items:center;gap:3px;padding:3px}
.quick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.quick-action{background:#fff;border:1px solid #e7effc;border-radius:16px;padding:15px 6px 14px;text-align:center;box-shadow:var(--shadow);display:flex;align-items:center;flex-direction:column;gap:9px;color:#2b3c5a;font-size:11px;font-weight:700}.quick-action .quick-icon{width:43px;height:43px;border-radius:14px;display:flex;align-items:center;justify-content:center}.tone-blue{background:#e8f2ff;color:#237aff}.tone-green{background:#e1fbf4;color:#0fb78d}.tone-purple{background:#f0eaff;color:#8864f8}.tone-orange{background:#fff0df;color:#f39527}.tone-pink{background:#ffe9f3;color:#f264a1}.tone-gray{background:#edf3fa;color:#7e90a9}
.notice-card{background:#fff;border-radius:16px;border:1px solid #ecf1fa;box-shadow:var(--shadow);padding:15px;display:flex;align-items:center;gap:11px}.notice-card .notice-big{border-radius:12px;height:47px;width:47px;display:grid;place-items:center;color:#2377ff;background:#eaf3ff}.notice-card strong{font-size:13px}.notice-card p{margin:5px 0 0;font-size:11px;color:#8b9bb1}.notice-card .arrow{margin-left:auto;color:#a3b3c9}
.card{background:white;border:1px solid #e8effa;border-radius:17px;box-shadow:var(--shadow)}.campaign-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}.campaign{padding:15px 13px 12px;min-width:0;position:relative}.campaign-top{display:flex;align-items:center;gap:9px}.campaign-icon{flex:none;width:44px;height:44px;border-radius:14px;display:grid;place-items:center;color:#fff}.campaign-quark{background:linear-gradient(135deg,#3f8dff,#402ed4)}.campaign-xunlei{background:linear-gradient(145deg,#38bdff,#066bdd)}.campaign-baidu{background:linear-gradient(145deg,#2acada,#1e68d8)}.campaign strong{font-size:14px;white-space:nowrap}.campaign p{font-size:10.5px;color:#91a0b5;margin:3px 0 0;white-space:nowrap}.tags{display:flex;flex-wrap:wrap;gap:5px;margin:13px 0}.tag{font-size:9px;color:#4a84d5;background:#ebf4ff;border-radius:5px;padding:4px 5px;white-space:nowrap}.campaign-btn{border:0;border-radius:9px;background:var(--blue);color:white;width:100%;padding:10px 6px;font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center;gap:4px}.campaign-footer{display:flex;justify-content:space-between;font-size:10px;color:#a2afc0;margin-top:9px;gap:4px}.campaign-footer .available{color:#0aae8d}.campaign-wide{grid-column:1/-1;display:flex;align-items:center;gap:13px}.campaign-wide .campaign-info{flex:1}.campaign-wide .campaign-btn{width:auto;padding:10px 13px}
.feature-strip{border-radius:17px;padding:18px;background:linear-gradient(130deg,#dcfff5,#cbf5ef);border:1px solid #f5ffff;display:flex;justify-content:space-between;align-items:center;position:relative;overflow:hidden}.feature-strip:after{content:"";width:93px;height:93px;background:#ffffff72;position:absolute;border-radius:50%;right:-16px;top:-34px}.feature-strip h3{font-size:16px;color:#087b70;margin:0 0 6px}.feature-strip p{font-size:11px;color:#359588;margin:0 0 12px}.feature-strip button{border:0;background:#01bf9c;color:white;padding:9px 13px;border-radius:10px;font-weight:800;font-size:11px}.feature-strip .feature-art{color:#0ca788;opacity:.7;position:relative;z-index:2}
.bottom-nav{position:absolute;z-index:12;bottom:0;left:0;right:0;height:calc(67px + env(safe-area-inset-bottom));padding:7px 5px calc(7px + env(safe-area-inset-bottom));border-top:1px solid #e6edf8;background:#ffffffed;backdrop-filter:blur(18px);display:grid;grid-template-columns:repeat(5,1fr);box-shadow:0 -7px 25px #86aceb17}.nav-item{border:0;background:none;color:#a2afc3;display:flex;flex-direction:column;align-items:center;gap:4px;justify-content:center;font-size:10px;font-weight:700}.nav-item.active{color:var(--blue)}.nav-icon{display:grid;place-items:center;width:31px;height:29px;border-radius:10px}.nav-item.active .nav-icon{background:#eaf3ff}.nav-item svg{width:21px;height:21px;stroke-width:2}
.page-heading{margin:8px 2px 18px}.page-heading h1{font-size:26px;margin:0 0 6px;font-weight:900;letter-spacing:-1px}.page-heading p{font-size:12px;color:#8ba0bd;margin:0;line-height:1.7}.page-hero{margin:10px 0 20px;border:1px solid white;border-radius:20px;background:linear-gradient(130deg,#d9eaff,#eef9ff);padding:19px;position:relative;overflow:hidden}.page-hero h2{font-size:21px;margin:0 0 8px}.page-hero p{margin:0;font-size:12px;color:#7994b8;max-width:230px;line-height:1.7}.page-hero .deco-icon{position:absolute;right:-8px;bottom:-8px;color:#a2c8ff;transform:rotate(-12deg)}.page-hero .deco-icon svg{width:99px;height:99px;stroke-width:1.1}
.tabs{display:flex;gap:5px;background:#e4eefe;border-radius:12px;padding:4px}.tab{flex:1;min-width:0;background:none;border:0;border-radius:9px;padding:10px 5px;color:#8da0ba;font-weight:700;font-size:12px}.tab.active{background:white;color:var(--blue);box-shadow:0 3px 7px #2a71cd11}
.lesson{display:flex;align-items:center;gap:12px;padding:14px;margin-top:10px}.lesson-icon{flex:none;display:grid;place-items:center;width:48px;height:48px;border-radius:15px}.lesson-meta{flex:1;min-width:0}.lesson-meta b{display:block;font-size:13px;line-height:1.5}.lesson-meta p{color:#a0adc0;font-size:10px;margin:5px 0 0}.lesson .play{width:31px;height:31px;display:grid;place-items:center;background:#edf4ff;color:var(--blue);border-radius:50%}
.progress-area{background:#fff;border:1px solid #e6effa;border-radius:16px;padding:15px;box-shadow:var(--shadow)}.progress-top{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:700}.progress-top span{color:var(--blue)}.progress-track{height:7px;background:#e9f1fc;border-radius:50px;margin-top:12px;overflow:hidden}.progress-track i{display:block;height:100%;background:linear-gradient(90deg,#34b8ff,#236bff);border-radius:inherit}
.intro-tiles{display:grid;grid-template-columns:1fr 1fr;gap:11px}.intro-tile{padding:16px;border-radius:16px;min-height:130px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;border:1px solid #fff}.intro-tile.blue{background:#e6f1ff;color:#2170df}.intro-tile.orange{background:#fff1e1;color:#e28a23}.intro-tile strong{font-size:14px;color:#193555}.intro-tile span{font-size:11px;line-height:1.5;opacity:.8}
.overview-card{padding:18px;margin-top:9px}.metric-main{display:flex;align-items:center;justify-content:space-between}.metric-main label{font-size:12px;color:#8396b4}.metric-main .amount{font-size:31px;font-weight:900;letter-spacing:-1px;color:#122c50;margin-top:3px}.metric-main .amount b{font-size:14px;color:#8c9bb0}.metric-main button{background:#eaf3ff;color:var(--blue);padding:9px 13px;border:0;border-radius:10px;font-size:11px;font-weight:800}.metrics-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#e8eff9;border-radius:12px;overflow:hidden;margin-top:15px}.metric{background:#f0f6ff;text-align:center;padding:13px 3px}.metric span{font-size:10px;color:#9aa9bf}.metric b{display:block;font-size:16px;margin-top:4px;color:#29466b}
.rate-card{display:flex;gap:2px;border-radius:13px;overflow:auto;padding:12px 6px;scrollbar-width:none;background:#e4efff;border:1px solid #f9fcff}.rate-item{flex:1;min-width:85px;text-align:center;border-right:1px solid #c6d7ed}.rate-item:last-child{border:0}.rate-item strong{display:block;font-size:13px;color:#314e75}.rate-item span{display:block;font-size:10px;color:#8298b5;margin-top:5px}.rate-tip{font-size:10px;color:#9baec7;margin:7px 2px 0}
.bind-box{padding:14px;margin-top:12px}.bind-heading{font-size:13px;font-weight:900;display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.form-inline{display:flex;gap:8px}.form-inline input,.field input,.field select,.field textarea{min-width:0;width:100%;border:1px solid #dfebfa;background:#f8fbff;border-radius:10px;padding:11px 12px;font-size:12px;color:#183455;outline:none;transition:.2s}.form-inline input:focus,.field input:focus,.field select:focus,.field textarea:focus{border-color:#75a9ff;box-shadow:0 0 0 3px #b9d7ff52}.form-inline button,.btn-primary{background:var(--blue);color:#fff;border:0;border-radius:10px;font-weight:800;font-size:12px;white-space:nowrap;padding:11px 14px}.select-pills{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:10px}.select-pill{padding:8px 11px;border-radius:9px;border:1px solid #dfe9f9;background:#f6f9ff;color:#8da0ba;font-size:11px;font-weight:700}.select-pill.active{background:#e7f0ff;color:var(--blue);border-color:#8bb6ff}
.empty{text-align:center;padding:38px 15px 33px;color:#a4b4cc}.empty-art{display:flex;justify-content:center;align-items:center;margin:0 auto 16px;width:82px;height:82px;border-radius:25px;background:linear-gradient(145deg,#edf5ff,#e1edfb);color:#aac4eb}.empty b{display:block;color:#8096b6;font-size:13px}.empty p{font-size:11px;color:#a7b6cb;line-height:1.7;margin:7px 0 0}
.team-banner{padding:19px;border-radius:19px;background:linear-gradient(120deg,#e5f2ff,#cfe7fc);border:1px solid white;position:relative;overflow:hidden}.team-banner .team-name{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:900}.level-tag{font-size:10px;font-weight:800;padding:4px 9px;background:#ffedcc;color:#b67c20;border-radius:7px}.level-progress{margin-top:16px;display:flex;align-items:center;gap:10px}.level-progress .progress-track{flex:1;margin:0}.level-progress span{font-size:10px;color:#7b92b4}.team-total{margin-top:12px;padding:18px;border:1px solid white;border-radius:18px;background:linear-gradient(135deg,#e0eeff,#f2f8ff);display:flex;align-items:center;justify-content:space-between;position:relative;overflow:hidden}.team-total p{margin:0 0 8px;font-size:12px;color:#8ca1bc}.team-total .value{font-size:29px;font-weight:900;color:var(--blue)}.team-total svg{color:#9bc4ff;opacity:.75}
.team-pair{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.team-slab{padding:15px 12px;border-radius:16px;min-width:0}.team-slab.orange{background:#fff0df;border:1px solid #ffe1b5}.team-slab.green{background:#e6fff5;border:1px solid #ccf3e3}.team-slab .slab-title{display:flex;align-items:center;gap:6px;font-size:14px;font-weight:900}.team-slab.orange .slab-title{color:#ef8635}.team-slab.green .slab-title{color:#15ae83}.team-slab .small-caption{font-size:10px;color:#97a5b3;margin:7px 0 12px}.team-slab .number{font-size:23px;font-weight:900}.team-slab .number span{font-size:11px}.team-slab button{width:100%;margin-top:10px;background:#ffffff9c;border:1px solid currentColor;padding:8px 4px;font-size:11px;border-radius:8px;font-weight:700}.team-slab.orange button{color:#e48c49}.team-slab.green button{color:#15a97f}
.invite-card{padding:18px;margin-top:14px}.invite-head{display:flex;justify-content:space-between;align-items:center}.invite-code{border:1px solid #dfeaff;color:var(--blue);font-size:11px;background:#f3f8ff;padding:7px 9px;border-radius:10px;display:flex;gap:7px;align-items:center}.invite-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;margin:19px 0 16px}.invite-step{text-align:center;position:relative}.invite-step .step-icon{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:#edf4ff;color:var(--blue);border:2px solid white;margin:auto auto 9px}.invite-step b{display:block;font-size:10px;color:#5f789d;font-weight:700}.invite-step:not(:last-child):after{content:"→";position:absolute;right:-10px;top:13px;color:#abc0df}.btn-full{display:block;width:100%;border:0;border-radius:12px;background:var(--blue);padding:13px;color:#fff;font-weight:900;font-size:13px;box-shadow:0 6px 15px #236cff22}
.rule-list{background:#fff;border:1px solid #e8f0fa;border-radius:16px;overflow:hidden}.rule-item{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px;border-bottom:1px solid #eef3fb}.rule-item:last-child{border:none}.rule-item strong{font-size:12px}.rule-item span{font-size:11px;color:#8da0bb}
.profile-banner{padding:22px 17px;margin:8px 0 15px;background:linear-gradient(125deg,#d8eafb,#e8f6ff);border:1px solid white;border-radius:19px;display:flex;align-items:center;gap:12px}.profile-avatar{width:59px;height:59px;background:linear-gradient(135deg,#9fd1ff,#d4e6ff);border:3px solid #fff;border-radius:18px;color:#1b71df;display:grid;place-items:center;flex:none}.profile-info{flex:1;min-width:0}.profile-info strong{font-size:16px;display:block}.profile-info p{font-size:11px;color:#8098b5;margin:6px 0}.profile-banner button{background:#fff;border:1px solid #b1d3ff;color:var(--blue);border-radius:100px;padding:8px 10px;font-size:10px;font-weight:800}
.wallet{padding:17px;margin-top:12px}.wallet-top{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ecf1f9;padding-bottom:13px;margin-bottom:12px}.wallet-top strong{font-size:16px}.wallet-top button{background:none;border:0;font-size:11px;color:#8fa0b7}.wallet-main{display:flex;align-items:flex-end;justify-content:space-between}.wallet-main span{font-size:11px;color:#8498b6}.wallet-main strong{display:block;color:#f57931;font-size:28px;line-height:1.3}.wallet-main button{border-radius:9px;background:var(--blue);color:#fff;font-size:11px;font-weight:800;padding:10px 14px;border:0}.wallet-items{margin-top:14px;background:#edf5ff;border-radius:12px;display:grid;grid-template-columns:repeat(3,1fr)}.wallet-items div{text-align:center;padding:13px 3px;border-right:1px solid #d5e4f7}.wallet-items div:last-child{border:0}.wallet-items span{font-size:10px;color:#8da1bc}.wallet-items strong{display:block;margin-top:5px;font-size:15px}
.service{padding:17px;margin-top:12px}.service h3{margin:0 0 15px;font-size:15px;display:flex;align-items:center;gap:8px}.service h3:before{content:"";width:4px;height:18px;border-radius:5px;background:var(--blue)}.service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px 4px}.service-action{border:0;background:transparent;color:#263b5b;display:flex;flex-direction:column;gap:9px;align-items:center;min-width:0;padding:5px 0;font-size:10px;white-space:nowrap}.service-action .quick-icon{width:44px;height:44px;border-radius:50%;display:grid;place-items:center}.service-action span:last-child{font-size:10px;color:#4c5c75}
.list-card{border-radius:16px;background:#fff;border:1px solid #e8effa;overflow:hidden}.list-row{width:100%;border:0;background:white;padding:14px 15px;display:flex;align-items:center;justify-content:space-between;gap:12px;border-bottom:1px solid #edf2f9;color:#253b5d;text-align:left}.list-row:last-child{border:0}.list-row span{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:700}.list-row svg{color:#8da1be}.list-row .row-right{font-size:11px;color:#9aacbf}
.detail-top{display:flex;align-items:center;justify-content:space-between;padding:25px 2px 17px}.back-btn{border:0;background:white;color:#2e4770;width:34px;height:34px;border-radius:11px;display:grid;place-items:center}.detail-title{font-size:17px;font-weight:900}.detail-top .side-placeholder{width:34px}
.content-card{padding:18px;margin-bottom:13px}.content-card h2{font-size:17px;margin:0 0 12px}.content-card h3{font-size:13px;margin:16px 0 8px}.content-card p,.content-card li{line-height:1.95;color:#7389a8;font-size:12px}.content-card ul,.content-card ol{padding-left:20px}.content-card p{margin:7px 0}.detail-banner{border-radius:19px;padding:24px;background:linear-gradient(130deg,#d4e8ff,#edf8ff);margin-bottom:14px;position:relative;overflow:hidden}.detail-banner strong{display:block;font-size:24px}.detail-banner p{max-width:260px;color:#718eb4;font-size:12px;line-height:1.8}.detail-banner .bubble{position:absolute;right:-30px;bottom:-47px;width:140px;height:140px;border:28px solid #ffffff78;border-radius:50%}
.tip{background:#eaf3ff;border:1px solid #d7e9ff;color:#6889b0;font-size:11px;line-height:1.75;border-radius:11px;padding:10px 12px;margin:12px 0}.tip.warn{color:#b08147;border-color:#ffe4bf;background:#fff6e9}.status{font-size:10px;border-radius:50px;padding:4px 8px;white-space:nowrap}.status.pending{color:#a57c28;background:#fff0d6}.status.good{color:#0caa7c;background:#dcfff1}.status.muted{color:#8395b3;background:#eaf0f8}
.record{border-bottom:1px solid #eaf1f9;padding:14px 2px;display:flex;align-items:center;justify-content:space-between;gap:10px}.record:last-child{border:0}.record b{font-size:12px}.record p{color:#a7b4c7;font-size:10px;margin:6px 0 0}
.field{margin:14px 0}.field label{font-size:12px;font-weight:800;color:#486183;display:block;margin-bottom:8px}.field small{font-size:10px;color:#9dafc3;margin-top:5px;display:block}.field textarea{resize:vertical;min-height:75px}
.auth-heading{margin:20px 0 8px;text-align:center}.auth-heading .brand-symbol{margin:auto}.auth-heading h2{font-size:24px;margin:15px 0 5px}.auth-heading p{font-size:12px;color:#8da2be}.auth-container{padding:22px 18px 20px}.auth-switch{display:flex;justify-content:center;gap:17px;margin-top:18px}.auth-switch button{border:0;background:none;color:var(--blue);font-size:12px}.auth-note{text-align:center;font-size:10px;color:#a9b7cb;line-height:1.7;margin-top:17px}
.modal-backdrop{position:absolute;inset:0;background:#13264180;backdrop-filter:blur(5px);z-index:25;display:flex;align-items:flex-end;justify-content:center}.modal{border-radius:22px 22px 0 0;background:#fff;width:100%;max-height:88%;overflow-y:auto;padding:22px 20px calc(23px + env(safe-area-inset-bottom));box-shadow:0 -10px 40px #10284044}.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.modal-head strong{font-size:17px}.modal-close{border:0;border-radius:10px;background:#eef4fc;color:#8094af;height:28px;width:28px;display:grid;place-items:center}
#toast-root{position:fixed;z-index:101;left:50%;top:25px;transform:translateX(-50%);pointer-events:none;display:flex;flex-direction:column;gap:8px}.toast{background:#193a65f0;color:white;border-radius:12px;padding:12px 17px;font-size:12px;box-shadow:0 9px 24px #27497333;min-width:170px;text-align:center;animation:pop .2s ease}@keyframes pop{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}
.line-divider{height:1px;background:#edf1f9;margin:15px 0}.two-buttons{display:flex;gap:9px;margin-top:13px}.btn-soft{border:1px solid #cce0ff;background:#f1f7ff;color:var(--blue);font-size:12px;font-weight:800;padding:11px 13px;border-radius:10px}.text-blue{color:var(--blue)!important}.text-orange{color:#f17832!important}.subtle{font-size:11px;color:#8fa3be}.space-between{display:flex;align-items:center;justify-content:space-between}.mt12{margin-top:12px}.mt18{margin-top:18px}.m0{margin:0}.badge-demo{font-size:9px;color:#8ca3c5;background:#dbe9f9;padding:4px 7px;border-radius:7px;font-weight:700}.fine-print{font-size:10px;color:#a4b4c6;line-height:1.6;margin:15px 4px 4px;text-align:center}.kbd{font-size:11px;letter-spacing:1px;font-weight:900;color:var(--blue);background:#ecf3ff;border-radius:5px;padding:4px 7px}.hide{display:none!important}
@media(max-width:360px){.view{padding-left:12px;padding-right:12px}.top-title{font-size:18px}.hero{padding:20px 15px}.hero h1{font-size:22px}.campaign{padding:12px 9px}.campaign-icon{height:39px;width:39px}.campaign strong{font-size:12px}.quick-grid{gap:6px}.team-slab{padding:12px 8px}}

/* App layout: native page scrolling, no phone mockup and no second scroll container */
html {scroll-behavior:auto;background:#eff5ff;width:100%;min-height:100%}
body {display:block;width:100%;min-height:100dvh;max-width:none;padding:0;margin:0;overflow-x:hidden;background:linear-gradient(150deg,#eaf3ff 0%,#f4f8ff 55%,#ecf4ff 100%);overscroll-behavior-y:auto}
#app {width:100%;min-height:100dvh;height:auto;position:static}
.view,.view.detail-view {width:100%;height:auto;min-height:100dvh;overflow:visible;max-width:1180px;margin:0 auto;border-radius:0;padding:0 16px calc(92px + env(safe-area-inset-bottom))}
.view.detail-view {max-width:800px;padding-bottom:calc(38px + env(safe-area-inset-bottom))}
.top {position:sticky;top:0;z-index:11;margin:0 -16px 13px;padding:calc(13px + env(safe-area-inset-top)) 16px 12px;background:rgba(238,246,255,.94);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid rgba(222,234,251,.75)}
.top-title{font-size:19px}
.bottom-nav {position:fixed;bottom:0;left:0;right:0;width:100%;z-index:40;display:flex;justify-content:center;gap:0;height:calc(65px + env(safe-area-inset-bottom));padding:6px 8px calc(5px + env(safe-area-inset-bottom));border-top:1px solid #e3eaf5;background:rgba(255,255,255,.97);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:0 -5px 22px #8da9d017}
.nav-item{flex:0 1 155px;min-width:0;font-size:11px}
.modal-backdrop{position:fixed;z-index:60;align-items:flex-end}
.modal{max-width:600px;border-radius:22px 22px 0 0}
#toast-root{z-index:100;top:calc(20px + env(safe-area-inset-top))}
.dashboard-welcome{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 2px 17px}
.dashboard-welcome .welcome-text{min-width:0}
.dashboard-welcome .eyebrow{font-size:10px;letter-spacing:1.5px}
.dashboard-welcome h1{font-size:24px;line-height:1.45;letter-spacing:-.5px;margin:7px 0 5px;font-weight:900}
.dashboard-welcome p{font-size:12px;color:#8b9fbb;margin:0;line-height:1.7}
.welcome-action{border:1px solid #cfe2ff;border-radius:13px;background:#ffffffc9;color:#2874ef;min-width:42px;height:42px;display:grid;place-items:center;flex:none}
.dashboard-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:15px 5px;margin-bottom:16px}
.dashboard-summary>div{text-align:center;padding:3px 6px;border-right:1px solid #e7effa}
.dashboard-summary>div:last-child{border:0}
.dashboard-summary span{font-size:11px;color:#8398b4;display:block;white-space:nowrap}
.dashboard-summary strong{display:block;font-size:22px;color:#1c3b68;margin-top:5px;font-weight:900}
.dashboard-announcement{width:100%;margin:0 0 16px;text-align:left}
.section{margin-top:21px}
.campaign-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.campaign .campaign-footer{font-size:10px}
.campaign-wide .campaign-btn{flex:none}
.detail-top{position:sticky;top:0;background:rgba(236,245,255,.96);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);z-index:20;margin:0 -16px 12px;padding:calc(10px + env(safe-area-inset-top)) 16px 10px}
.btn-primary,.btn-full,.campaign-btn{touch-action:manipulation;min-height:42px}
.nav-item{touch-action:manipulation;min-height:44px}
button:focus-visible,a:focus-visible{outline:3px solid #99c8ff;outline-offset:2px}
body.modal-open{overflow:hidden}
.auth-container{max-width:480px;margin:18px auto}
.rate-card{margin-top:5px}
@media(min-width:720px){
 .view{padding:0 30px 115px}
 .view.detail-view{padding:0 30px 56px}
 .top{margin:0 -30px 20px;padding:17px 30px}
 .detail-top{margin:0 -30px 16px;padding:14px 30px}
 .dashboard-welcome{padding:20px 3px}
 .dashboard-welcome h1{font-size:29px}
 .dashboard-summary{padding:23px}
 .dashboard-summary strong{font-size:29px}
 .quick-grid{grid-template-columns:repeat(3,1fr);gap:16px}
 .quick-action{padding:22px}
 .campaign-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
 .campaign-wide{grid-column:auto;display:block}
 .campaign-wide .campaign-btn{width:100%;padding:10px 6px}
 .campaign{padding:19px 17px}
 .campaign .campaign-top{gap:12px}
 .campaign .campaign-footer{margin-top:12px}
 .campaign strong{font-size:16px}
 .campaign p{font-size:12px}
 .feature-strip{min-height:150px}
 .page-heading h1{font-size:29px}
 .service-grid{gap:15px}
 .service-action{padding:10px}
 .bottom-nav{height:68px;padding:8px 12px;box-shadow:0 -3px 18px #7a9ec61a}
 .nav-item{flex:0 1 150px}
 .intro-tiles{gap:18px}
 .team-pair{gap:15px}
}
@media(min-width:1080px){
 .view{max-width:1040px}
 .view.detail-view{max-width:780px}
 .section{margin-top:27px}
 .service{padding:23px}
 .overview-card{padding:25px}
}
@media(max-width:360px){
 .dashboard-welcome h1{font-size:20px}
 .view{padding-left:12px;padding-right:12px}
 .top,.detail-top{margin-left:-12px;margin-right:-12px;padding-left:12px;padding-right:12px}
 .campaign .campaign-icon{width:38px;height:38px}
}

.campaign-wide{display:block}
.campaign-wide .campaign-btn{width:100%;padding:10px 6px}
.campaign .campaign-info{width:100%}
.campaign .campaign-btn{min-height:42px}
.campaign .campaign-footer{margin-top:11px}
@media(min-width:720px){.campaign{display:flex;flex-direction:column}.campaign .campaign-info{display:flex;flex-direction:column;flex:1}.campaign .campaign-btn{margin-top:auto}.campaign .campaign-footer{margin-top:12px}}