@font-face{font-family:Averta;src:url(/fonts/Averta-Regular.otf) format("opentype");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Averta;src:url(/fonts/Averta-Semibold.otf) format("opentype");font-weight:600;font-style:normal;font-display:swap}@font-face{font-family:Averta;src:url(/fonts/Averta-Bold.otf) format("opentype");font-weight:700;font-style:normal;font-display:swap}@font-face{font-family:Averta;src:url(/fonts/Averta-Extrabold.otf) format("opentype");font-weight:800;font-style:normal;font-display:swap}:root{--red: #ec0029;--red-dark: #c70022;--red-soft: #fde7eb;--cream: #f5f0e4;--cream-deep: #ece4d2;--cyan: #00ffe9;--cyan-ink: #00b8a6;--pink: #fd2b54;--bg: #faf6ee;--card: #ffffff;--line: #ece6da;--ink: #1d1b19;--text: #2b2825;--muted: #9a9388;--good: #16a34a;--good-bg: #e9f8ee;--ok: #4ade80;--ok-bg: #f0fbf3;--thin: #d97706;--thin-bg: #fef6e7;--loss: #ec0029;--loss-bg: #fde7eb;--radius: 14px}*{box-sizing:border-box}body{margin:0;font-family:Averta,Segoe UI,system-ui,-apple-system,sans-serif;background:var(--bg);color:var(--text);font-size:14px;-webkit-font-smoothing:antialiased}.app{max-width:1180px;margin:0 auto;padding:22px 18px 60px}.app-header{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:18px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px 18px;position:relative;overflow:hidden}.app-header:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(90deg,var(--red) 0%,var(--pink) 55%,var(--cyan) 100%)}.brand{display:flex;align-items:center;gap:13px}.brand .logo{width:50px;height:50px;border-radius:13px;display:block;box-shadow:0 4px 14px #ec002947}.brand h1{font-size:19px;margin:0;color:var(--red);font-weight:800;letter-spacing:-.01em}.brand p{margin:3px 0 0;color:var(--muted);font-size:12.5px;font-weight:600}.header-actions{display:flex;gap:8px;flex-wrap:wrap}.btn{border:1.5px solid var(--line);background:#fff;color:var(--text);padding:9px 14px;border-radius:10px;cursor:pointer;font-size:13px;font-weight:700;transition:.15s;font-family:inherit}.btn:hover{border-color:var(--red);color:var(--red)}.btn.primary{background:var(--red);color:#fff;border-color:var(--red)}.btn.primary:hover{background:var(--red-dark);border-color:var(--red-dark);color:#fff}.btn.ghost{background:#fff}.platform-tabs{display:flex;gap:8px;margin-bottom:18px}.ptab{padding:10px 24px;border-radius:999px;border:1.5px solid var(--line);background:#fff;cursor:pointer;font-weight:800;color:var(--muted);transition:.15s;font-family:inherit;font-size:13.5px}.ptab:hover{border-color:var(--cream-deep)}.ptab.active.tiktok{background:#111;color:#fff;border-color:#111}.ptab.active.shopee{background:#ee4d2d;color:#fff;border-color:#ee4d2d}.grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}.col-left,.col-right{display:flex;flex-direction:column;gap:16px}@media (max-width: 900px){.grid{grid-template-columns:1fr}}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;box-shadow:0 2px 8px #2d1b0a0a}.card-title{font-size:11.5px;letter-spacing:.05em;font-weight:800;color:var(--muted);text-transform:uppercase;margin-bottom:12px}.card-title.big{font-size:16px;color:var(--ink);text-transform:none;letter-spacing:-.01em}.field{display:flex;flex-direction:column;gap:5px}.field>span{font-size:11px;font-weight:800;color:var(--muted);letter-spacing:.03em}.field input,.field select{border:1.5px solid var(--line);border-radius:9px;padding:9px 11px;font-size:14px;width:100%;background:#fff;color:var(--ink);font-weight:700;font-family:inherit}.field input:focus,.field select:focus{outline:none;border-color:var(--red);box-shadow:0 0 0 3px var(--red-soft)}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}.fee-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}@media (max-width: 520px){.fee-grid{grid-template-columns:1fr 1fr}}.input-suffix{position:relative}.input-suffix input{padding-right:26px}.input-suffix i{position:absolute;right:10px;top:50%;transform:translateY(-50%);color:var(--muted);font-style:normal;font-size:12px;font-weight:700}.cat-search,.search-input{position:relative}.search-input .search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);opacity:.5}.search-input input{width:100%;padding:11px 12px 11px 36px;border:1.5px solid var(--line);border-radius:10px;font-size:14px;font-family:inherit;font-weight:600}.search-input input:focus{outline:none;border-color:var(--red);box-shadow:0 0 0 3px var(--red-soft)}.cat-dropdown{position:absolute;z-index:20;left:0;right:0;top:46px;margin:0;padding:4px;list-style:none;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 14px 34px #2d1b0a29;max-height:320px;overflow-y:auto}.cat-dropdown li{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:9px 10px;border-radius:8px;cursor:pointer;font-size:13px}.cat-dropdown li:hover{background:var(--cream)}.cat-path{color:var(--text)}.cat-rate{font-weight:800;color:var(--red);flex-shrink:0}.breadcrumb{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}.crumb{background:var(--cream);color:var(--ink);padding:4px 10px;border-radius:6px;font-size:12px;font-weight:700}.scenario-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}@media (max-width: 640px){.scenario-grid{grid-template-columns:1fr 1fr}}.scenario{border:1.5px solid var(--line);border-radius:11px;padding:11px 12px;background:#fff}.sc-name{font-weight:800;font-size:13.5px;color:var(--ink)}.sc-sub{font-size:10.5px;color:var(--muted);margin-top:1px;font-weight:600}.sc-result{display:flex;align-items:baseline;justify-content:space-between;margin-top:8px;gap:6px}.sc-money{font-weight:800;font-size:13.5px;display:flex;align-items:center;gap:5px}.sc-pct{font-size:12px;font-weight:800}.badge-loss{background:var(--red);color:#fff;font-size:9px;font-weight:800;padding:1px 5px;border-radius:4px;letter-spacing:.05em}.tier-good{background:var(--good-bg);border-color:#b9e9c8}.tier-good .sc-money,.tier-good .sc-pct{color:var(--good)}.tier-ok{background:var(--ok-bg);border-color:#cdeed7}.tier-ok .sc-money,.tier-ok .sc-pct{color:#15803d}.tier-thin{background:var(--thin-bg);border-color:#f4e2bd}.tier-thin .sc-money,.tier-thin .sc-pct{color:var(--thin)}.tier-loss{background:var(--loss-bg);border-color:#f6c0c8}.tier-loss .sc-money,.tier-loss .sc-pct{color:var(--loss)}.legend{display:flex;flex-wrap:wrap;gap:14px;margin-top:12px;font-size:11.5px;color:var(--muted);font-weight:600}.legend span{display:flex;align-items:center;gap:5px}.legend .dot{width:10px;height:10px;border-radius:50%;display:inline-block}.dot.good{background:var(--good)}.dot.ok{background:var(--ok)}.dot.thin{background:var(--thin)}.dot.loss{background:var(--loss)}.bd-row{display:flex;justify-content:space-between;align-items:center;padding:7px 0;font-size:13.5px}.bd-label{color:var(--text)}.bd-sub{font-style:normal;color:var(--muted);font-size:11px;margin-left:7px;background:var(--cream);padding:1px 6px;border-radius:5px;font-weight:700}.bd-value{font-weight:800;white-space:nowrap}.bd-row.strong{font-weight:800}.bd-row.strong .bd-value{color:var(--red)}.bd-divider{height:1px;background:var(--line);margin:6px 0}.bd-row.lnr{font-size:16px;font-weight:800;padding:12px 0 4px}.tier-text-good .bd-value,.tier-text-good .bd-label{color:var(--good)}.tier-text-ok .bd-value,.tier-text-ok .bd-label{color:#15803d}.tier-text-thin .bd-value,.tier-text-thin .bd-label{color:var(--thin)}.tier-text-loss .bd-value,.tier-text-loss .bd-label{color:var(--loss)}.summary-boxes{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}.sbox{background:var(--cream);border:1px solid var(--line);border-radius:11px;padding:12px}.sbox-label{font-size:11px;color:var(--muted);font-weight:800}.sbox-value{font-size:16px;font-weight:800;margin-top:4px;color:var(--ink)}.sbox-value.warn{color:var(--thin)}.sbox-pct{font-size:11px;color:var(--muted);font-weight:700;margin-top:2px}.sbox:first-child{background:#fff;border-color:var(--cyan);box-shadow:inset 0 0 0 1px var(--cyan)}.sbox:first-child .sbox-value{color:var(--cyan-ink)}.tier-box-good{background:var(--good-bg);border-color:#b9e9c8}.tier-box-good .sbox-value,.tier-box-good .sbox-pct{color:var(--good)}.tier-box-ok{background:var(--ok-bg)}.tier-box-ok .sbox-value,.tier-box-ok .sbox-pct{color:#15803d}.tier-box-thin{background:var(--thin-bg);border-color:#f4e2bd}.tier-box-thin .sbox-value,.tier-box-thin .sbox-pct{color:var(--thin)}.tier-box-loss{background:var(--loss-bg);border-color:#f6c0c8}.tier-box-loss .sbox-value,.tier-box-loss .sbox-pct{color:var(--loss)}.bd-footer{margin-top:14px;text-align:center;font-size:11px;color:var(--muted);font-weight:600}.hint{font-size:12.5px;color:var(--muted);margin:0 0 12px;line-height:1.5;font-weight:600}.reverse-row{display:flex;gap:14px;align-items:flex-end;flex-wrap:wrap}.field.small{max-width:160px}.reverse-out{flex:1;min-width:180px}.ro-label{font-size:11px;color:var(--muted);font-weight:800}.ro-price{font-size:24px;font-weight:800;color:var(--red)}.ro-check{font-size:12px;color:var(--muted);margin-top:2px;font-weight:600}.ro-error{color:var(--loss);font-size:12.5px;font-weight:700}.btn-apply{background:var(--cyan);color:#04332e;border:none;padding:11px 16px;border-radius:10px;font-weight:800;cursor:pointer;font-size:13px;font-family:inherit}.btn-apply:hover{filter:brightness(.95)}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#1d1b1980;display:grid;place-items:center;z-index:100;padding:16px}.modal{background:#fff;border-radius:16px;padding:22px;max-width:560px;width:100%;box-shadow:0 24px 60px #0000004d}.modal-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.modal-head h3{margin:0;font-size:17px;color:var(--red);font-weight:800}.modal-head .x{border:none;background:var(--cream);width:30px;height:30px;border-radius:8px;cursor:pointer;font-size:14px}.modal .sample{background:var(--cream);border:1px solid var(--line);border-radius:8px;padding:10px;font-size:11.5px;white-space:pre-wrap;color:#5a534a;margin:8px 0}.modal textarea{width:100%;border:1.5px solid var(--line);border-radius:10px;padding:11px;font-family:Consolas,monospace;font-size:12.5px;resize:vertical}.modal textarea:focus{outline:none;border-color:var(--red)}.modal-actions{display:flex;gap:10px;margin-top:12px}.modal-msg{margin-top:12px;font-size:13px;font-weight:700}code{background:var(--cream);padding:1px 5px;border-radius:4px;font-size:12px}
