:root{font-family:Inter,PingFang SC,Microsoft YaHei,sans-serif;color:#193747;background:#f5f8fa;font-synthesis:none;text-rendering:optimizeLegibility;--ink: #193747;--muted: #596d7a;--teal: #0f7a78;--line: #d8e8e5}*{box-sizing:border-box}body{margin:0;min-width:280px}button,input,select{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:wait;opacity:.6}button:focus-visible,a:focus-visible{outline:3px solid #7fc8c2;outline-offset:4px}a{color:inherit;text-decoration:none}h1,h2,p{margin:0}h1{font-size:30px;letter-spacing:-.8px;line-height:1.4}h2{font-size:19px;line-height:1.5}.muted,.section-description,.form-note{color:var(--muted);line-height:1.7}.eyebrow{color:var(--teal);font-size:10px;font-weight:700;letter-spacing:2px;margin-bottom:7px}.brand{display:flex;align-items:center;gap:10px;font-size:12px;letter-spacing:1px}.brand b{color:var(--teal)}.brand-mark{font-size:32px;color:var(--teal);line-height:1}.app-shell{max-width:720px;margin:auto}.app-header{height:78px;padding:calc(18px + env(safe-area-inset-top)) 24px 18px;height:calc(78px + env(safe-area-inset-top));display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:#fff}.portal-label{color:var(--teal);font-size:12px;border-left:1px solid var(--line);padding-left:16px}.page{padding:28px 24px calc(110px + env(safe-area-inset-bottom))}.page-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:24px}.heading-note{font-size:12px;color:var(--muted);padding-bottom:5px}.card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px;margin-bottom:20px}.identity-card{display:flex;gap:16px;align-items:center;position:relative;padding:24px;margin-bottom:20px;border-radius:20px;background:#eaf6f4;border:1px solid #d8e8e5}.avatar{width:60px;height:60px;display:grid;place-items:center;flex-shrink:0;border-radius:18px;background:var(--teal);color:#fff;font-size:26px}.identity-copy{min-width:0;flex:1;overflow-wrap:anywhere}.identity-copy h2{font-size:21px;padding-right:56px}.identity-copy p{margin-top:5px;font-size:14px}.identity-copy .agent-no{font-size:11px;color:var(--muted)}.level-badge{position:absolute;right:20px;top:24px;border:1px solid #abd2ca;border-radius:6px;padding:3px 7px;font-size:11px;color:var(--teal)}.section-heading{display:flex;justify-content:space-between;gap:12px;align-items:center}.subtle-badge{font-size:10px;color:var(--muted);border-radius:5px;background:#f3f6f7;padding:5px 7px}.rate-grid{display:grid;grid-template-columns:1fr 1fr;margin:24px 0 16px}.rate-item{padding:4px 16px 4px 0}.rate-item+.rate-item{border-left:1px solid var(--line);padding:4px 0 4px 24px}.rate-item p{color:var(--muted);font-size:12px;margin-bottom:9px}.rate-item strong{color:var(--teal);font-size:34px;font-weight:600}.rate-item small{font-size:16px;padding-left:4px}.form-note{font-size:11px}.text-btn{color:var(--teal);border:0;padding:8px 0 8px 10px;background:transparent;font-size:13px;white-space:nowrap}.section-description{font-size:12px;margin-top:12px}.payment-details{margin:16px 0 0}.payment-details>div{display:flex;justify-content:space-between;gap:20px;padding:16px 0;border-bottom:1px solid #eef3f4;font-size:14px}.payment-details>div:last-child{border-bottom:0;padding-bottom:0}.payment-details dt{color:var(--muted);flex-shrink:0}.payment-details dd{margin:0;text-align:right;overflow-wrap:anywhere}.empty-payment{text-align:center;padding:24px 0 4px}.empty-symbol{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#eaf6f4;color:var(--teal);margin:0 auto 12px;font-size:24px}.empty-payment p{font-size:14px;margin-bottom:7px}.empty-payment .muted{font-size:12px;margin-bottom:18px}.primary-btn,.secondary-btn{min-height:46px;border-radius:12px;padding:11px 20px;border:1px solid var(--teal);font-weight:500}.primary-btn{color:#fff;background:var(--teal)}.primary-btn:hover:not(:disabled){background:#0b6664}.secondary-btn{color:var(--teal);background:#fff}label{display:grid;gap:9px;font-size:13px;font-weight:500}input{width:100%;min-width:0;height:48px;border:1px solid var(--line);border-radius:10px;background:#f9fbfc;color:var(--ink);padding:12px 14px;font-size:16px}input::placeholder{color:#778994;font-size:13px}input:focus{outline:2px solid #a2d8d0;outline-offset:1px;border-color:var(--teal)}.payment-form{margin-top:22px}fieldset{padding:0;border:0;margin:0;display:grid;gap:18px;min-width:0}.form-actions{display:flex;gap:12px;margin-top:24px}.form-actions .primary-btn{flex:1}.error,.error-banner{color:#a33131;font-size:13px;line-height:1.6}.error{margin:14px 0}.error-banner{background:#fff0ef;padding:14px 18px;border-radius:12px;margin-bottom:20px;display:flex;align-items:center;gap:8px;justify-content:space-between}.success{color:#187449;background:#edf9f0;border-radius:8px;padding:10px 12px;font-size:13px;margin-top:16px}.state-card{color:var(--muted);text-align:center;padding:40px 20px}.logout-btn{width:100%;min-height:48px;color:var(--muted);background:transparent;border:1px solid var(--line);border-radius:12px;font-size:14px}.bottom-nav{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:min(100%,720px);padding:12px 24px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:#fff;z-index:10}.bottom-nav a{display:flex;flex-direction:column;align-items:center;gap:5px;color:var(--teal);font-size:11px}.bottom-nav{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;padding-left:12px;padding-right:12px}.bottom-nav a{color:#607580;padding:5px 0;border-radius:10px}.bottom-nav a.router-link-active{color:var(--teal);background:#edf7f5;font-weight:600}.portal-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:24px}.portal-heading>span{color:var(--muted);font-size:12px}select{color:var(--ink);border:1px solid var(--line);border-radius:10px;background:#fff;min-height:40px;padding:8px 12px}.commission-hero{background:var(--teal);color:#fff;border-radius:20px;padding:28px 24px;margin-bottom:20px}.commission-hero p{font-size:13px;margin-bottom:12px;color:#daf1ed}.commission-hero strong{display:block;font-size:clamp(28px,6vw,40px);overflow-wrap:anywhere;font-weight:600}.dashboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:20px}.dashboard-grid .card{margin:0;padding:20px 16px}.dashboard-grid p{color:var(--muted);font-size:12px}.dashboard-grid strong{display:block;font-size:clamp(16px,4.4vw,29px);font-weight:600;color:var(--teal);margin:12px 0 8px;white-space:nowrap;overflow-x:auto}.dashboard-grid small{display:block;color:var(--muted);font-size:10px;line-height:1.7}.trend-chart{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-top:28px}.trend-column{display:flex;flex-direction:column;align-items:center;min-width:0}.trend-column>span{color:var(--muted);font-size:9px;white-space:nowrap}.trend-track{display:flex;align-items:end;height:130px;width:min(100%,32px);background:#f3f8f7;border-radius:6px 6px 0 0;margin-top:10px}.trend-track>div{width:100%;background:#49a8a0;border-radius:6px 6px 0 0;min-height:2px}.trend-column>small{color:var(--muted);font-size:11px;margin-top:12px}.search-form{display:flex;align-items:center;gap:10px;margin:20px 0}.search-form>input{flex:1}.search-form button{flex-shrink:0}.portal-page>.form-note{margin:12px 0 20px}.record-row{display:flex;gap:16px;justify-content:space-between;align-items:start;border-bottom:1px solid #e9f0f1;padding:20px 0;font-size:13px;overflow-wrap:anywhere}.record-row:last-child{border-bottom:0}.record-row p{color:var(--muted);font-size:11px;margin-top:8px;line-height:1.5}.record-amount{display:flex;flex-direction:column;gap:8px;align-items:end;text-align:right;flex-shrink:0}.status-badge{font-size:10px;background:#f1f5f6;color:#596d7a;border-radius:5px;padding:4px 7px}.status-badge.paid{color:#187449;background:#edf9f0}.empty-copy{color:var(--muted);text-align:center;font-size:13px;padding:28px 0}.pagination-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;color:var(--muted);font-size:12px;margin-top:20px}.pagination-bar button{min-height:38px;padding:7px 12px;flex-shrink:0}.pagination-bar>span{text-align:center;font-size:11px}.data-table-wrap{overflow-x:auto;margin-top:20px}.data-table-wrap table{border-collapse:collapse;white-space:nowrap;width:100%;font-size:12px}.data-table-wrap th{color:var(--muted);font-weight:500;background:#f5f9fa;text-align:left}.data-table-wrap th,.data-table-wrap td{border-bottom:1px solid #e9f0f1;padding:14px 12px}.data-table-wrap td small{display:block;font-size:10px;color:var(--muted);margin-top:6px}.team-row{border-bottom:1px solid #e9f0f1;padding:24px 0 16px}.team-row:last-of-type{border-bottom:0}.team-row h3{margin:0;font-size:16px}.team-row>p{color:var(--muted);font-size:12px;margin-top:8px}.rate-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.rate-chips>span{font-size:11px;border:1px solid var(--line);border-radius:8px;padding:8px;color:var(--muted)}.rate-chips b{font-weight:500;color:var(--teal)}.rate-editor{display:grid;gap:14px}.check-label{display:flex;align-items:center;gap:8px}input[type=checkbox]{width:18px;height:18px;accent-color:var(--teal)}.three-rates{grid-template-columns:repeat(3,minmax(0,1fr))}.three-rates .rate-item{min-width:0;padding:4px 10px}.three-rates .rate-item:first-child{padding-left:0}.three-rates .rate-item strong{font-size:clamp(21px,5vw,32px)}.three-rates .rate-item p{font-size:11px}.payment-form>.form-note,.payment-details+.form-note{margin-top:16px}.login-page{max-width:480px;margin:auto;min-height:100dvh;padding:calc(34px + env(safe-area-inset-top)) 24px 28px}.login-intro{margin:70px 0 30px}.login-intro h1{font-size:36px;margin-bottom:12px}.login-intro .muted{font-size:14px}.login-form{display:grid;gap:22px;padding:26px}.login-form h2{margin-bottom:2px}.login-form .primary-btn{display:flex;justify-content:space-between;align-items:center}.login-form .error{margin:-4px 0}.login-form .form-note{text-align:center}.login-footer{text-align:center;font-size:11px;color:var(--muted);margin-top:30px}@media(max-width:380px){.page{padding-left:16px;padding-right:16px}.card,.identity-card{padding:20px}.heading-note{display:none}.rate-item strong{font-size:29px}.subtle-badge{font-size:9px}.brand{font-size:10px}.login-page{padding-left:20px;padding-right:20px}}.full-width{width:100%;margin-bottom:20px}.child-editor form{margin-top:24px}.child-editor .form-note{margin-top:20px}.checkbox-label{display:flex;align-items:center;gap:8px}.fee-editor{display:grid;gap:12px}.rules-copy{white-space:pre-line}.customer-level{display:inline-block;margin-left:8px}