:root{
  --bg:#f6f7f9;
  --surface:#ffffff;
  --surface-soft:#fbfbfc;
  --text:#17191d;
  --muted:#6f7480;
  --line:#e8eaf0;
  --blue:#1677ff;
  --blue-strong:#0f62d8;
  --blue-soft:#eef6ff;
  --green:#18864b;
  --green-soft:#edf9f1;
  --orange:#bd6b16;
  --orange-soft:#fff5e9;
  --red:#ba3b3b;
  --red-soft:#fff0f0;
  --purple:#7753b8;
  --purple-soft:#f4effd;
  --shadow:0 8px 28px rgba(25,35,55,.06);
  --shadow-lg:0 28px 80px rgba(20,30,50,.18);
  --radius:22px;
  --radius-sm:14px;
  --sidebar:230px;
  font-family:Inter,-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,"PingFang SC","Microsoft YaHei",sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--text);font-size:15px;line-height:1.55}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
a{color:inherit;text-decoration:none}
.shell{min-height:100vh;display:grid;grid-template-columns:var(--sidebar) minmax(0,1fr)}
.sidebar{position:sticky;top:0;height:100vh;padding:30px 20px 22px;border-right:1px solid rgba(221,224,231,.9);background:rgba(249,250,252,.86);backdrop-filter:blur(18px);display:flex;flex-direction:column;z-index:20}
.brand{display:flex;align-items:center;gap:10px;padding:0 12px 26px;font-weight:780;font-size:21px;letter-spacing:-.6px;user-select:none}
.brand-mark{width:31px;height:31px;border-radius:10px;background:linear-gradient(145deg,#0d66e9,#58a4ff);box-shadow:inset 0 0 0 1px rgba(255,255,255,.25);position:relative}
.brand-mark:before,.brand-mark:after{content:"";position:absolute;background:#fff;border-radius:2px;opacity:.94}
.brand-mark:before{width:12px;height:4px;left:9px;top:8px}.brand-mark:after{width:4px;height:12px;left:13px;top:12px}
.nav{display:flex;flex-direction:column;gap:7px}
.nav-item{width:100%;border:0;background:transparent;border-radius:13px;padding:11px 12px;display:flex;align-items:center;gap:12px;color:#555b66;font-weight:590;text-align:left;transition:background .16s ease,color .16s ease}
.nav-item:hover{background:#f0f2f6;color:#20242a}.nav-item.active{background:#eaf3ff;color:#0965df}.nav-icon{width:21px;height:21px;display:grid;place-items:center;font-size:17px}.nav-label{flex:1}.nav-badge{min-width:21px;height:21px;padding:0 6px;border-radius:999px;background:var(--blue);color:white;font-size:11px;display:grid;place-items:center;font-weight:740}
.sidebar-foot{margin-top:auto}.account-menu{position:relative}.account-pop{position:absolute;left:0;bottom:48px;width:190px;background:white;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:7px;z-index:50}.account-pop button{width:100%;border:0;background:transparent;text-align:left;padding:10px 11px;border-radius:10px}.account-pop button:hover{background:#f4f5f7}
.main{min-width:0;padding:46px clamp(26px,4vw,72px) 90px}.content{max-width:1180px;margin:0 auto}.content.narrow{max-width:980px}.content.detail-width{max-width:1240px}
.page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:28px}.eyebrow{font-size:12px;font-weight:740;letter-spacing:.08em;text-transform:uppercase;color:#8b919c;margin-bottom:7px}.page-title{font-size:34px;line-height:1.15;letter-spacing:-1.2px;margin:0;font-weight:790}.page-subtitle{margin:8px 0 0;color:var(--muted);max-width:720px}.count-soft{font-weight:650;color:#9196a0;font-size:18px;margin-left:8px}
.btn{border:1px solid transparent;background:#f1f3f6;color:#22262d;border-radius:12px;padding:10px 15px;font-weight:650;transition:transform .12s ease,background .15s ease,border .15s ease}.btn:hover{background:#e9ecf1}.btn:active{transform:scale(.985)}.btn.primary{background:var(--blue);color:#fff}.btn.primary:hover{background:var(--blue-strong)}.btn.secondary{background:white;border-color:#dfe3ea}.btn.ghost{background:transparent;color:var(--blue);padding-left:4px;padding-right:4px}.btn.danger{background:var(--red-soft);color:var(--red)}.btn.small{padding:7px 10px;border-radius:10px;font-size:13px}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}
.search-wrap{position:relative}.search-icon{position:absolute;left:16px;top:50%;transform:translateY(-50%);color:#8e949e;pointer-events:none}.search{width:100%;height:52px;border:1px solid #e1e4e9;background:white;border-radius:16px;padding:0 45px 0 46px;outline:none;box-shadow:0 2px 10px rgba(30,40,55,.03);transition:border .16s ease,box-shadow .16s ease}.search:focus{border-color:#a9cfff;box-shadow:0 0 0 4px rgba(22,119,255,.08)}.search-clear{position:absolute;right:12px;top:50%;transform:translateY(-50%);border:0;background:#eceff3;width:27px;height:27px;border-radius:50%;color:#6c727c}
.filters{display:flex;gap:9px;flex-wrap:wrap;margin:18px 0 28px}.pill{border:1px solid #e2e5ea;background:white;color:#5f6570;border-radius:999px;padding:8px 13px;font-weight:610}.pill:hover{border-color:#cdd2d9}.pill.active{color:#0e66da;background:#edf5ff;border-color:#bedbff}
.offer-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.offer-card{background:white;border:1px solid #e9ebef;border-radius:20px;overflow:hidden;box-shadow:0 6px 22px rgba(26,35,50,.045);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;cursor:pointer;position:relative;min-width:0}.offer-card:hover{transform:translateY(-2px);box-shadow:0 14px 32px rgba(25,35,55,.085);border-color:#d9dde4}.offer-top{height:185px;background:linear-gradient(145deg,#f5f7fb,#eceff5);position:relative;display:flex;align-items:center;justify-content:center;padding:28px}.provider{position:absolute;left:15px;top:14px;font-size:12px;font-weight:780;letter-spacing:.035em;color:#606772;background:rgba(255,255,255,.78);padding:5px 8px;border-radius:8px;backdrop-filter:blur(7px)}.bookmark{position:absolute;right:13px;top:12px;width:36px;height:36px;border-radius:11px;border:1px solid rgba(215,219,226,.9);background:rgba(255,255,255,.86);display:grid;place-items:center;z-index:3;font-size:17px}.bookmark:hover{background:white}.bookmark.saved{background:#e9f3ff;border-color:#bcd9ff;color:var(--blue)}.status-tag{position:absolute;right:16px;bottom:13px;border-radius:999px;padding:5px 9px;background:#fff3e5;color:#a65c13;font-size:11px;font-weight:720}.mock-card-art{width:154px;height:96px;border-radius:12px;box-shadow:0 14px 28px rgba(25,35,55,.15);transform:rotate(-2deg);background:linear-gradient(135deg,#ece4d2,#b8a77a);position:relative;overflow:hidden}.mock-card-art.dark{background:linear-gradient(135deg,#252a34,#090b10)}.mock-card-art.blue{background:linear-gradient(135deg,#1e70db,#78bbff)}.mock-card-art.green{background:linear-gradient(135deg,#1b8b6a,#8ad5bb)}.mock-card-art.purple{background:linear-gradient(135deg,#564583,#a48ed2)}.mock-card-art.bank{border-radius:18px;background:linear-gradient(145deg,#fefefe,#dce4ef);height:90px}.mock-card-art:before{content:"";position:absolute;width:27px;height:20px;border-radius:5px;background:rgba(255,255,255,.56);left:16px;top:17px}.mock-card-art:after{content:"NEXT";position:absolute;bottom:13px;left:16px;font-weight:800;font-size:11px;color:rgba(255,255,255,.84);letter-spacing:.08em}.mock-card-art.bank:after{color:#55606c}.offer-body{padding:18px 18px 17px}.offer-name{font-weight:720;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.primary-value{font-weight:820;font-size:27px;letter-spacing:-.7px;margin-top:10px;line-height:1.15}.requirement{color:#6e747e;font-size:13px;margin-top:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:20px}.tag-row{display:flex;gap:8px;margin-top:15px;min-height:26px}.soft-tag{border-radius:8px;padding:4px 8px;font-size:11px;background:#f4f5f7;color:#606670;font-weight:650}
.empty{background:white;border:1px solid var(--line);border-radius:var(--radius);padding:58px 24px;text-align:center}.empty h3{font-size:20px;margin:0 0 8px}.empty p{color:var(--muted);max-width:520px;margin:0 auto 20px}
.section{margin-top:34px}.section-title-row{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:13px}.section-title{font-size:20px;margin:0;font-weight:760;letter-spacing:-.3px}.link-btn{border:0;background:transparent;color:var(--blue);font-weight:650;padding:6px 0}
.collapse-head{width:100%;background:transparent;border:0;border-top:1px solid #e1e4e8;padding:20px 2px;display:flex;align-items:center;justify-content:space-between;text-align:left;font-weight:730;font-size:16px}.chev{display:inline-block;transition:transform .18s ease;color:#8a9099}.chev.up{transform:rotate(-90deg)}
.detail-back{border:0;background:transparent;padding:4px 0;color:#6d737e;font-weight:620;display:flex;gap:7px;align-items:center;margin-bottom:19px}.detail-back:hover{color:#242932}
.offer-detail{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(390px,.82fr);gap:28px;align-items:start}.poster-panel,.decision-panel{background:white;border:1px solid var(--line);border-radius:26px;box-shadow:var(--shadow)}.poster-panel{padding:20px}.poster-stage{min-height:495px;border-radius:20px;background:linear-gradient(145deg,#f1f5fb,#e7edf6);display:flex;flex-direction:column;justify-content:flex-end;padding:38px;position:relative;overflow:hidden}.poster-stage:before{content:"";position:absolute;width:330px;height:330px;border-radius:50%;background:rgba(255,255,255,.55);right:-100px;top:-130px}.poster-card{position:absolute;top:86px;right:72px;width:220px;height:138px;border-radius:17px;background:linear-gradient(145deg,#d9cdb1,#7f7257);transform:rotate(7deg);box-shadow:0 24px 48px rgba(30,40,55,.2)}.poster-card.dark{background:linear-gradient(145deg,#242b38,#05070a)}.poster-kicker{position:relative;font-size:12px;font-weight:760;color:#68727f;letter-spacing:.08em}.poster-title{position:relative;font-size:37px;line-height:1.08;letter-spacing:-1.2px;font-weight:810;max-width:480px;margin:9px 0}.poster-copy{position:relative;color:#5f6772;max-width:480px}.poster-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.poster-tab{border:1px solid #e1e4e9;background:white;border-radius:999px;padding:7px 10px;font-size:12px;font-weight:650}.poster-tab.active{color:var(--blue);border-color:#bdd9ff;background:#eef6ff}.decision-panel{padding:25px;position:sticky;top:24px}.decision-top{display:flex;align-items:flex-start;justify-content:space-between;gap:15px}.decision-product{font-size:22px;font-weight:790;letter-spacing:-.5px}.decision-sub{font-size:13px;color:var(--muted);margin-top:3px}.result-block{background:linear-gradient(145deg,#edf6ff,#f6faff);border:1px solid #d6e9ff;border-radius:19px;padding:19px;margin-top:21px}.result-meta{font-size:12px;color:#748090}.recommendation{font-weight:820;font-size:27px;letter-spacing:-.7px;margin:5px 0 15px}.metric-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.metric{background:rgba(255,255,255,.72);border:1px solid rgba(211,226,244,.88);border-radius:13px;padding:12px}.metric-label{font-size:11px;color:#7e8792}.metric-value{margin-top:3px;font-weight:760}.decision-note{color:#6c737d;font-size:13px;margin:14px 2px}.actions{display:grid;gap:9px;margin-top:17px}.actions.two{grid-template-columns:1fr 1fr}
.modal-backdrop{position:fixed;inset:0;background:rgba(22,27,35,.34);backdrop-filter:blur(6px);z-index:100;display:grid;place-items:center;padding:22px}.modal{background:white;border:1px solid rgba(255,255,255,.8);border-radius:24px;box-shadow:var(--shadow-lg);width:min(640px,100%);max-height:88vh;overflow:auto}.modal.large{width:min(830px,100%)}.modal-head{position:sticky;top:0;background:rgba(255,255,255,.94);backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid #eef0f3;z-index:2}.modal-title{font-weight:780;font-size:19px}.close-btn{border:0;background:#eff1f4;width:34px;height:34px;border-radius:50%;font-size:18px}.modal-body{padding:22px}.modal-foot{position:sticky;bottom:0;background:rgba(255,255,255,.96);border-top:1px solid #eef0f3;padding:15px 22px;display:flex;justify-content:space-between;gap:10px;z-index:2}.confirm-copy{font-size:17px;margin:0 0 8px}.muted{color:var(--muted)}
.login-wrap{min-height:calc(100vh - 130px);display:grid;place-items:center}.login-card{width:min(440px,100%);background:white;border:1px solid var(--line);border-radius:26px;padding:33px;box-shadow:var(--shadow);text-align:center}.login-card .brand-mark{margin:0 auto 17px}.login-card h1{font-size:27px;margin:0;letter-spacing:-.6px}.login-card p{color:var(--muted);margin:9px 0 23px}.login-actions{display:grid;gap:10px}.legal{margin-top:18px;font-size:11px;color:#9a9fa7}
.attention-box{background:white;border:1px solid var(--line);border-radius:20px;overflow:hidden}.attention-row{width:100%;border:0;background:white;display:grid;grid-template-columns:1.18fr 1.35fr .8fr 28px;align-items:center;gap:16px;padding:15px 18px;text-align:left;border-bottom:1px solid #edf0f3}.attention-row.history-row{grid-template-columns:1.12fr 1.18fr .72fr .56fr 28px}.attention-row:hover{background:#fafbfc}.attention-row:last-child{border-bottom:0}.att-product{font-weight:700}.att-action{color:#343941}.att-time{font-size:12px;color:#717782;text-align:right}.attention-expanded{padding:20px;border-bottom:1px solid #edf0f3;background:#fcfcfd}.attention-expanded-inner{display:grid;grid-template-columns:3fr 2fr;gap:28px}.attention-summary{margin:0;color:#4e555f}.key-card{margin-top:14px;background:#f4f6f9;border-radius:14px;padding:13px 14px}.key-card strong{display:block;font-size:17px}.instruction-title{font-weight:760;margin-bottom:7px}.checklist{display:grid;gap:8px;margin:10px 0}.check{display:flex;gap:9px;align-items:flex-start;padding:8px 9px;border-radius:10px;background:#f6f7f9;cursor:pointer}.check input{margin-top:4px}.attention-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.attention-compact-empty{padding:24px;color:var(--muted)}
.product-tools{display:flex;gap:12px;align-items:center}.product-tools .search-wrap{flex:1}.product-section{margin-top:28px}.product-row-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.product-tile{background:white;border:1px solid var(--line);border-radius:17px;padding:14px;display:grid;grid-template-columns:74px minmax(0,1fr) 24px;align-items:center;gap:13px;cursor:pointer;transition:background .15s ease,border .15s ease}.product-tile:hover{background:#fcfdff;border-color:#d6dde6}.mini-art{width:68px;height:43px;border-radius:7px;background:linear-gradient(145deg,#232833,#0b0d11);box-shadow:0 5px 12px rgba(30,40,55,.14)}.mini-art.blue{background:linear-gradient(145deg,#206ed3,#79b7fa)}.mini-art.bank{height:48px;border-radius:12px;background:linear-gradient(145deg,#f7f9fc,#dbe4ef);box-shadow:inset 0 0 0 1px #d9dfe7}.mini-art.gold{background:linear-gradient(145deg,#d6c390,#837142)}.product-name{font-weight:720;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.product-meta{font-size:12px;color:var(--muted);margin-top:3px}.show-more{display:block;margin:11px auto 0;border:0;background:transparent;color:var(--blue);font-weight:640}.past-list{background:white;border:1px solid var(--line);border-radius:16px;overflow:hidden}.past-row{width:100%;border:0;background:white;padding:14px 16px;display:flex;justify-content:space-between;gap:12px;text-align:left;border-bottom:1px solid #edf0f3}.past-row:last-child{border-bottom:0}.past-row:hover{background:#fbfcfd}
.product-overview{background:white;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);padding:24px;display:grid;grid-template-columns:330px 1fr;gap:35px}.owned-art{width:260px;height:164px;border-radius:16px;background:linear-gradient(145deg,#242a36,#06080c);box-shadow:0 20px 42px rgba(28,36,50,.19);margin:8px auto 18px}.overview-external{display:flex;justify-content:center;gap:8px}.overview-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.overview-name{font-size:27px;font-weight:810;letter-spacing:-.7px}.facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 28px;margin-top:24px}.fact-label{font-size:11px;color:#8b919b;text-transform:none}.fact-value{font-weight:690;margin-top:3px}.benefit-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.benefit-card{border:1px solid var(--line);background:white;border-radius:17px;padding:15px;text-align:left}.benefit-card.clickable{cursor:pointer}.benefit-card.clickable:hover{border-color:#d3d9e1}.benefit-head{display:flex;justify-content:space-between;gap:16px}.benefit-title{font-weight:720}.benefit-short{font-size:12px;color:var(--muted);margin-top:3px}.benefit-detail{margin-top:13px;padding-top:13px;border-top:1px solid #edf0f3;color:#505761;font-size:13px}.benefit-detail dl{display:grid;grid-template-columns:100px 1fr;gap:7px 10px;margin:0}.benefit-detail dt{color:#8b929c}.benefit-detail dd{margin:0}.timeline{border-left:2px solid #e2e7ed;margin-left:8px;padding-left:20px;display:grid;gap:18px}.timeline-item{position:relative}.timeline-item:before{content:"";position:absolute;width:10px;height:10px;border-radius:50%;background:#9dbfe9;left:-26px;top:6px;box-shadow:0 0 0 4px white}.timeline-date{font-size:11px;color:#8b919a}.timeline-copy{font-weight:620;margin-top:2px}.timeline-item.clickable{cursor:pointer}.timeline-item.clickable .timeline-copy{color:var(--blue)}
.tabs{display:flex;gap:22px;border-bottom:1px solid #e2e5e9;margin-bottom:18px}.tab{border:0;background:transparent;padding:10px 2px 12px;font-weight:700;color:#777e89;position:relative}.tab.active{color:#1c2026}.tab.active:after{content:"";position:absolute;height:2px;left:0;right:0;bottom:-1px;background:var(--blue);border-radius:3px}.filter-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px}.select{height:40px;border:1px solid #dfe3e8;background:white;border-radius:11px;padding:0 34px 0 12px;outline:none}.history-status{font-size:12px;font-weight:700;border-radius:999px;padding:5px 9px;background:#f0f2f5;color:#626873}.history-status.used{background:var(--green-soft);color:var(--green)}.history-status.skipped{background:var(--orange-soft);color:var(--orange)}.history-status.expired{background:#f1f2f4;color:#7d838c}.history-status.stopped{background:var(--red-soft);color:var(--red)}
.form-group{margin-bottom:18px}.label{display:block;font-weight:690;margin-bottom:7px}.hint{font-size:12px;color:var(--muted);margin-top:5px}.input,.textarea{width:100%;border:1px solid #dfe3e8;background:white;border-radius:12px;padding:11px 12px;outline:none}.input:focus,.textarea:focus{border-color:#abcfff;box-shadow:0 0 0 3px rgba(22,119,255,.07)}.textarea{min-height:88px;resize:vertical}.option-list{display:grid;gap:10px}.option-row{width:100%;background:white;border:1px solid #e0e4e9;border-radius:15px;padding:14px 15px;display:flex;align-items:center;gap:12px;text-align:left}.option-row:hover{border-color:#cbd3dd}.option-row.selected{border-color:#84baff;background:#f3f8ff}.radio-dot{width:20px;height:20px;border:2px solid #c5cad2;border-radius:50%;display:grid;place-items:center;flex:0 0 auto}.option-row.selected .radio-dot{border-color:var(--blue)}.option-row.selected .radio-dot:after{content:"";width:10px;height:10px;border-radius:50%;background:var(--blue)}.option-main{flex:1}.option-title{font-weight:710}.option-sub{font-size:12px;color:var(--muted);margin-top:2px}.option-tag{font-size:10px;border-radius:999px;background:#edf5ff;color:#0f68df;padding:4px 7px;font-weight:700}.category-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}.category-tile{border:1px solid var(--line);background:white;border-radius:17px;padding:20px;text-align:left}.category-tile:hover{border-color:#cdd5df}.category-icon{font-size:24px;margin-bottom:13px}.category-title{font-weight:750}.category-sub{color:var(--muted);font-size:12px;margin-top:4px}.task-card{border:1px solid var(--line);border-radius:14px;padding:14px;margin-bottom:10px}.task-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;font-weight:690}.icon-btn{border:0;background:#f0f2f5;border-radius:9px;width:31px;height:31px}.success{text-align:center;padding:34px 12px}.success-icon{width:60px;height:60px;border-radius:50%;background:var(--green-soft);color:var(--green);display:grid;place-items:center;margin:0 auto 16px;font-size:27px;font-weight:800}.success h2{margin:0;font-size:25px}.success p{color:var(--muted);margin:8px 0 23px}
.report{background:white;border:1px solid var(--line);border-radius:20px;padding:21px}.report h3{margin:24px 0 7px;font-size:17px}.report h3:first-child{margin-top:0}.report p{color:#555d67;margin:0}
.toast{position:fixed;right:24px;bottom:24px;background:#1e232a;color:#fff;border-radius:13px;padding:12px 14px;box-shadow:0 14px 30px rgba(20,25,32,.2);z-index:200;display:flex;align-items:center;gap:13px;animation:toastIn .18s ease}.toast button{border:0;background:transparent;color:#8ec2ff;font-weight:700;padding:0}@keyframes toastIn{from{transform:translateY(10px);opacity:0}to{transform:translateY(0);opacity:1}}
.prototype-note{font-size:11px;color:#89909a;background:#f0f2f5;border-radius:8px;padding:6px 8px;display:inline-block}
@media(max-width:1050px){.offer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.offer-detail{grid-template-columns:1fr}.decision-panel{position:static}.product-overview{grid-template-columns:260px 1fr}.product-row-grid{grid-template-columns:1fr}}
@media(max-width:780px){:root{--sidebar:0px}.shell{display:block}.sidebar{position:fixed;top:auto;bottom:0;left:0;right:0;height:69px;border-right:0;border-top:1px solid #e2e5e9;padding:7px 9px;background:rgba(251,252,253,.94);display:block;z-index:70}.brand{display:none}.nav{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;height:100%}.nav-item{padding:4px 2px;border-radius:10px;display:flex;flex-direction:column;justify-content:center;gap:1px;font-size:10px;text-align:center}.nav-icon{height:22px}.nav-label{flex:0}.nav-badge{position:absolute;margin-left:20px;margin-top:-28px;min-width:17px;height:17px;font-size:9px}.sidebar-foot{display:none}.main{padding:26px 16px 102px}.page-title{font-size:29px}.page-head{align-items:flex-start}.offer-grid{grid-template-columns:1fr}.offer-top{height:180px}.poster-stage{min-height:440px;padding:27px}.poster-card{right:35px;top:66px;width:180px;height:113px}.poster-title{font-size:31px}.decision-panel{padding:20px}.metric-grid{grid-template-columns:1fr 1fr}.attention-row{grid-template-columns:1fr 1.2fr auto 22px;gap:8px;padding:13px 12px}.att-time{font-size:10px}.attention-expanded{padding:16px}.attention-expanded-inner{grid-template-columns:1fr;gap:17px}.product-tools{flex-direction:column;align-items:stretch}.product-overview{grid-template-columns:1fr;padding:18px;gap:18px}.owned-art{width:220px;height:139px}.facts{grid-template-columns:1fr 1fr}.benefit-grid{grid-template-columns:1fr}.category-grid{grid-template-columns:1fr}.modal-backdrop{padding:0;align-items:end}.modal,.modal.large{width:100%;max-height:92vh;border-radius:23px 23px 0 0}.actions.two{grid-template-columns:1fr}.toast{left:14px;right:14px;bottom:84px}.account-pop{display:none}}
@media(max-width:480px){.main{padding-left:13px;padding-right:13px}.offer-body{padding:16px}.page-head{margin-bottom:21px}.page-title{font-size:27px}.metric-grid{grid-template-columns:1fr}.facts{grid-template-columns:1fr}.attention-row{grid-template-columns:1fr auto}.att-product{grid-column:1}.att-action{grid-column:1}.att-time{grid-column:2;grid-row:1/3;align-self:center}.attention-row .chev{grid-column:3;grid-row:1/3}.attention-row{grid-template-columns:1fr auto 18px}.poster-tabs{overflow:auto;flex-wrap:nowrap;padding-bottom:3px}.poster-tab{white-space:nowrap}}

/* === Mock-matched visual pass 2026-09-12 === */
:root{
  --bg:#ffffff;
  --text:#0b173a;
  --muted:#60709a;
  --line:#e8edf5;
  --blue:#0877ff;
  --blue-soft:#eaf3ff;
  --sidebar:240px;
}
html,body{background:#fff;color:var(--text)}
body{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Segoe UI",Roboto,"PingFang SC","Microsoft YaHei",sans-serif}
.shell{grid-template-columns:var(--sidebar) minmax(0,1fr);background:#fff}
.sidebar{
  background:#fff;
  border-right:1px solid #edf1f6;
  backdrop-filter:none;
  padding:48px 28px 30px;
}
.brand{padding:0 8px 42px;gap:8px;font-size:25px;font-weight:760;letter-spacing:-1.1px;color:#06164b}
.brand-mark{width:45px;height:34px;background:none;box-shadow:none;border-radius:0;display:flex;align-items:center;position:relative;letter-spacing:-10px;font-weight:900;font-style:italic;line-height:1}
.brand-mark:before,.brand-mark:after{display:none}
.brand-mark .nb-n,.brand-mark .nb-b{display:inline-block;font-size:32px;letter-spacing:-7px}
.brand-mark .nb-n{color:#1688ff;transform:skew(-8deg)}
.brand-mark .nb-b{color:#13b6db;transform:translateX(-2px) skew(-8deg)}
.brand-word{font-weight:750;color:#071750}.brand-word span{color:#0a83ff}
.nav{gap:10px}
.nav-divider{height:1px;background:#e7ebf2;margin:14px 10px 16px}
.nav-item{
  min-height:54px;
  padding:0 15px;
  border-radius:14px;
  gap:14px;
  color:#111c3f;
  font-weight:650;
  font-size:17px;
}
.nav-item:hover{background:#f4f7fb;color:#0c1b4a}
.nav-item.active{background:linear-gradient(90deg,#eaf3ff 0%,#dfeeff 100%);color:#0a5fff}
.nav-icon{width:27px;height:27px;font-size:0;display:grid;place-items:center}
.nav-icon svg{width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.nav-item.login-item{margin-top:12px;background:linear-gradient(90deg,#0b69ff,#087eff);color:#fff;box-shadow:0 7px 18px rgba(8,119,255,.18)}
.nav-item.login-item:hover{background:linear-gradient(90deg,#075fe8,#0873ea);color:#fff}
.nav-badge{margin-left:auto;background:#ff3b30;color:#fff}
.sidebar-foot{display:none}
.main{padding:56px clamp(32px,4vw,72px) 90px;background:#fff}
.content{max-width:1080px}
.discover-page{max-width:1080px;margin:0 auto}
.discover-search-row{margin-bottom:18px}
.discover-page .search{height:56px;border-radius:14px;border:1px solid #d8e1ee;box-shadow:0 2px 9px rgba(29,49,86,.04);font-size:16px;padding-left:48px;color:#101d42}
.discover-page .search::placeholder{color:#7b89a7}
.discover-page .search:focus{border-color:#8cbcff;box-shadow:0 0 0 4px rgba(8,119,255,.08)}
.discover-page .search-icon{left:16px;color:#7b89a7;width:22px;height:22px;display:grid;place-items:center}
.discover-page .search-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.discover-page .filters{display:flex;flex-wrap:nowrap;gap:10px;margin:0 0 22px;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}
.discover-page .filters::-webkit-scrollbar{display:none}
.discover-page .pill{height:42px;padding:0 14px;border-radius:999px;border:1px solid #e2e8f1;background:#fff;color:#1c2a50;font-weight:650;font-size:14px;display:inline-flex;align-items:center;gap:7px;white-space:nowrap;box-shadow:0 2px 7px rgba(31,52,88,.025)}
.discover-page .pill:hover{border-color:#cfd8e6;background:#fbfdff}
.discover-page .pill.active{color:#0a71ff;border-color:#d8e7ff;background:#f6faff}
.pill-icon{width:19px;height:19px;display:grid;place-items:center;color:#0a71ff}
.pill-icon svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.cat-银行 .pill-icon{color:#15b95a}.cat-券商 .pill-icon{color:#8739ef}.cat-羊毛省钱 .pill-icon{color:#ff7a00}.cat-旅行 .pill-icon{color:#0b79ff}.cat-购物 .pill-icon{color:#ff2c79}.cat-生活 .pill-icon{color:#16b8d6}
.offer-grid{grid-template-columns:repeat(5,minmax(0,202px));gap:14px 12px;justify-content:start;align-items:start}
.mock-visual-card{width:202px;height:330px;border:0;border-radius:14px;box-shadow:none;overflow:hidden;background:#fff;position:relative;transition:transform .15s ease,filter .15s ease}
.mock-visual-card:hover{transform:translateY(-2px);box-shadow:none;border:0;filter:drop-shadow(0 8px 14px rgba(30,51,89,.08))}
.offer-card-mock{display:block;width:202px;height:330px;object-fit:cover;pointer-events:none;user-select:none}
.mock-bookmark{right:7px;top:11px;width:28px;height:31px;border:0;border-radius:7px;background:#fff;color:#26334c;box-shadow:none;padding:3px;display:grid;place-items:center}
.mock-bookmark:hover{background:#fff}
.mock-bookmark.saved{background:#fff;color:#0877ff;border:0}
.mock-bookmark svg{width:20px;height:24px;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round}
.fallback-offer-card{border-radius:14px;border:1px solid #e7ecf3;box-shadow:0 4px 16px rgba(25,45,80,.05)}
.fallback-offer-card .bookmark svg{width:20px;height:24px;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round}
.compact-empty{padding:44px 24px;border-radius:14px;box-shadow:none}
/* Keep saved cards on the same visual system */
body .content > .offer-grid{justify-content:start}

@media(max-width:1380px){
  .content,.discover-page{max-width:872px}
  .offer-grid{grid-template-columns:repeat(4,minmax(0,202px))}
}
@media(max-width:1160px){
  .content,.discover-page{max-width:658px}
  .offer-grid{grid-template-columns:repeat(3,minmax(0,202px))}
}
@media(max-width:930px){
  :root{--sidebar:210px}
  .sidebar{padding-left:20px;padding-right:20px}
  .brand{font-size:21px;padding-left:4px}
  .content,.discover-page{max-width:444px}
  .offer-grid{grid-template-columns:repeat(2,minmax(0,202px))}
}
@media(max-width:780px){
  :root{--sidebar:0px}
  .sidebar{position:fixed;top:auto;bottom:0;left:0;right:0;height:72px;padding:7px 8px;background:rgba(255,255,255,.97);border-top:1px solid #e7ecf3;border-right:0;display:block}
  .brand,.nav-divider{display:none}
  .nav{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;height:100%}
  .nav-item,.nav-item.login-item{min-height:auto;margin:0;padding:5px 2px;border-radius:10px;background:transparent;box-shadow:none;color:#58647d;display:flex;flex-direction:column;gap:2px;justify-content:center;font-size:10px}
  .nav-item.active{background:#eef5ff;color:#0a6eff}
  .nav-item.login-item{color:#0a6eff}
  .nav-icon{width:22px;height:22px}.nav-icon svg{width:22px;height:22px}
  .main{padding:22px 16px 102px}
  .content,.discover-page{max-width:100%}
  .discover-page .filters{margin-bottom:18px}
  .offer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .mock-visual-card{width:100%;height:auto;aspect-ratio:202/330}
  .offer-card-mock{width:100%;height:100%;object-fit:cover}
  .mock-bookmark{right:3.5%;top:3%;width:25px;height:28px}
}
@media(max-width:520px){
  .offer-grid{grid-template-columns:1fr}
  .mock-visual-card{max-width:202px;margin:0 auto}
  .discover-page .search{height:52px}
}

/* === Mock-matched remaining pages pass (V3) === */
.mock-page-top{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:18px}
.mock-page-title{margin:0;color:#06164b;font-size:28px;line-height:1.08;font-weight:800;letter-spacing:-.8px}
.mock-page-count{margin-top:4px;color:#8b97af;font-size:12px;font-weight:600}
.mock-add-btn{border:0;background:#0877ff;color:#fff;border-radius:999px;min-height:34px;padding:0 14px;font-weight:750;font-size:13px;box-shadow:0 5px 13px rgba(8,119,255,.15)}
.mock-add-btn:hover{background:#066ce8}
.mock-section-title-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:9px}
.mock-section-title{margin:0;color:#07163e;font-size:16px;font-weight:800;letter-spacing:-.2px}
.mock-section-title .section-count,.section-count{color:#96a1b5;font-size:12px;font-weight:650;margin-left:4px}
.mock-link{border:0;background:transparent;color:#0877ff;font-size:12px;font-weight:700;padding:6px 0}
.attention-count-dot{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;margin-left:3px;border-radius:999px;background:#ff4b4b;color:#fff;font-size:10px;vertical-align:2px}

/* Wishlist */
.wishlist-page{max-width:1080px}
.wishlist-page .mock-page-top{margin-bottom:22px}
.wishlist-grid{margin-top:0}
.wishlist-unavailable{margin-top:30px}
.unavailable-grid{margin-top:16px;opacity:.78}
.mock-empty-state{padding:68px 24px;border:1px solid #edf1f6;border-radius:15px;background:#fff;box-shadow:none}
.empty-icon{font-size:34px;color:#7caeff;margin-bottom:8px}

/* My Products */
.products-page{max-width:1080px}
.mock-product-search{margin-bottom:18px}
.mock-product-search .search{height:42px;border-radius:9px;border-color:#e0e7f1;box-shadow:none;font-size:12px;padding-left:40px}
.mock-product-search .search-icon{left:13px;width:18px;height:18px;color:#8a96ac}
.mock-product-search .search-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.mock-product-block{margin-top:0;margin-bottom:22px}
.product-attention-box{border-radius:10px;border-color:#e8edf5;box-shadow:0 3px 12px rgba(30,52,91,.025)}
.mock-product-section{margin-top:18px;padding-top:0}
.owned-product-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.owned-product-card{min-width:0;border:0;background:transparent;padding:0;text-align:left;color:inherit;cursor:pointer}
.owned-product-art{display:flex;width:100%;aspect-ratio:1.58/1;border-radius:8px;overflow:hidden;background:linear-gradient(135deg,#15233b,#07101f);box-shadow:0 3px 10px rgba(23,44,75,.12);align-items:center;justify-content:center;transition:transform .14s ease,box-shadow .14s ease}
.owned-product-card:hover .owned-product-art{transform:translateY(-1px);box-shadow:0 8px 18px rgba(23,44,75,.16)}
.owned-product-art img{width:100%;height:100%;object-fit:cover;display:block}
.owned-product-copy{display:block;margin-top:7px;min-width:0}
.owned-product-copy strong{display:block;font-size:11px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#172346}
.owned-product-copy small{display:block;margin-top:2px;color:#8a96aa;font-size:9.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fallback-brand{font-size:18px;font-weight:850;letter-spacing:.03em;color:#fff}.fallback-brand.large{font-size:38px}
.compact-owned-card .owned-product-art{aspect-ratio:3.05/1;border-radius:7px;background:#fff;border:1px solid #e5ebf3;box-shadow:none}
.compact-owned-card .owned-product-art img{object-fit:cover}
.compact-owned-card .fallback-brand{color:#163c80;font-size:16px}
.compact-owned-card:hover .owned-product-art{box-shadow:0 5px 14px rgba(23,44,75,.08)}
.membership-products .owned-product-art{background:linear-gradient(135deg,#0a1021,#0d2a5f);border:0;box-shadow:none}.membership-products .fallback-brand{color:#fff}
.past-products-section{margin-top:24px;border-top:1px solid #edf1f5}
.past-products-head{width:100%;border:0;background:transparent;padding:15px 2px;display:flex;align-items:center;justify-content:space-between;color:#1a2747;font-size:12px;font-weight:740;text-align:left}
.past-products-head b{font-weight:650;color:#99a2b3;margin-left:5px}
.mock-past-list{border-radius:9px;border-color:#e9eef5}
.mock-past-list .past-row{padding:10px 12px;font-size:11px}
.mock-past-list .past-row small{display:block;margin-top:2px;color:#8b96a8;font-size:9.5px}
.success-empty{display:flex;align-items:center;gap:10px;background:#f5fff9;color:#244a34}
.success-empty div{display:flex;flex-direction:column}.success-empty span{font-size:11px;color:#718178}.success-dot{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#23b26d;color:#fff!important;font-weight:800}

/* Attention rows reused on product/detail/all-attention */
.attention-box{border-radius:10px;border-color:#e8edf5;box-shadow:0 2px 9px rgba(24,45,80,.025)}
.attention-row{grid-template-columns:1.25fr 1.3fr .62fr 20px;gap:14px;padding:11px 12px;border-bottom-color:#edf1f6;color:#142042}
.attention-row.history-row{grid-template-columns:1.2fr 1.2fr .55fr .5fr 20px}
.attention-row:hover{background:#fbfdff}
.att-product-cell{display:flex;align-items:center;gap:10px;min-width:0}
.att-thumb{width:48px;height:30px;border-radius:5px;background:#f5f7fa;border:1px solid #edf0f4;overflow:hidden;display:grid;place-items:center;flex:0 0 auto;color:#5270a6;font-size:9px;font-weight:800}
.att-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.att-product-copy,.att-action-cell{min-width:0;display:flex;flex-direction:column;align-items:flex-start}
.att-product-copy strong,.att-action-cell strong{display:block;font-size:11px;line-height:1.25;font-weight:750;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.att-product-copy small,.att-action-cell small{display:block;margin-top:2px;font-size:9px;line-height:1.2;color:#8a96a9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.att-time{justify-self:end;border-radius:999px;padding:4px 8px;font-size:9px;white-space:nowrap;text-align:center}
.att-time-due{background:#fff1f1;color:#f05b60;border:1px solid #ffdede}
.att-time-info{background:#eef6ff;color:#2781e8;border:1px solid #dbeaff}
.att-time-soft{background:#f4f6f9;color:#788397}
.attention-row .chev{justify-self:end;color:#6d7b95;font-size:16px}
.attention-expanded{padding:16px 18px;background:#fcfdff;border-bottom-color:#edf1f6}
.attention-expanded-inner{gap:20px}
.attention-summary{font-size:12px;color:#4e5a73}
.key-card{border-radius:9px;background:#f4f8fd;padding:10px 11px}.key-card strong{font-size:14px}.key-card .muted{font-size:10px}
.instruction-title{font-size:12px}.check{font-size:11px;border-radius:8px;background:#f6f8fb}
.attention-actions .btn.small{font-size:10px;padding:6px 10px}
.history-status{font-size:9px;padding:4px 7px}

/* All Attention */
.attention-page{max-width:980px}
.attention-top{align-items:center;margin-bottom:6px}
.mock-filter-select,.mock-status-select{height:32px;border-radius:7px;border-color:#dfe6f0;color:#314161;font-size:10px;padding:0 28px 0 10px;background:#fff}
.attention-toolbar{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;border-bottom:1px solid #edf1f5;margin-bottom:12px}
.mock-tabs{margin:0;border:0;gap:18px}
.mock-tabs .tab{font-size:11px;padding:8px 1px 10px;color:#7a879d}
.mock-tabs .tab.active{color:#0877ff}.mock-tabs .tab.active:after{height:2px;background:#0877ff}
.mock-status-select{margin-bottom:6px}
.active-filter-chip{display:inline-flex;align-items:center;gap:7px;margin-bottom:10px;padding:5px 8px;border-radius:999px;background:#f2f7ff;color:#4774b8;font-size:10px}.active-filter-chip button{border:0;background:transparent;color:inherit;padding:0}
.all-attention-box{border-radius:9px}

/* Product Detail */
.product-detail-page{max-width:1060px}
.mock-back{font-size:11px;color:#75839b;margin-bottom:12px}
.pd-overview{border:1px solid #e7edf5;border-radius:10px;background:#fff;padding:14px 16px;display:grid;grid-template-columns:260px 1fr;gap:22px;box-shadow:0 3px 12px rgba(24,45,80,.03)}
.pd-art-column{display:flex;flex-direction:column;align-items:center}
.pd-card-art{width:210px;aspect-ratio:1.58/1;border-radius:9px;overflow:hidden;background:linear-gradient(135deg,#131d30,#050812);display:grid;place-items:center;box-shadow:0 7px 17px rgba(20,35,65,.16)}
.pd-card-art img{width:100%;height:100%;object-fit:cover}
.pd-quick-actions{display:flex;gap:14px;margin-top:10px}.pd-quick-actions button{border:0;background:transparent;color:#4770b4;font-size:12px;display:flex;align-items:center;gap:4px}.pd-quick-actions button span{font-size:9px;color:#74829b}
.pd-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.pd-name{font-size:19px;font-weight:800;letter-spacing:-.35px;color:#101d3f}.pd-id{font-size:10px;color:#8692a6;margin-top:3px}
.pd-edit{border:0;background:transparent;color:#5d7fb9;font-size:10px;font-weight:700;padding:3px 0}
.pd-status-strip{display:flex;align-items:center;gap:6px;margin-top:10px;padding:6px 8px;border-radius:7px;background:#f8fbff;color:#5c6d89;font-size:10px}.pd-status-strip strong{color:#283755}.pd-status-dot{width:7px;height:7px;border-radius:50%;background:#2db46f}.pd-status-dot.past{background:#a8afb9}
.pd-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:14px}
.pd-facts>div{padding:8px 9px;border-left:1px solid #edf1f5}.pd-facts>div:first-child{border-left:0}
.pd-facts .fact-label{font-size:9px;color:#8e99ab}.pd-facts .fact-value{font-size:11px;color:#233152;font-weight:720}
.pd-inline-note{margin-top:13px;border-radius:7px;background:#f3f7fc;color:#6d7c94;padding:7px 9px;font-size:9.5px}
.pd-section{margin-top:18px}
.pd-benefit-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.pd-benefit-grid .benefit-card{padding:11px 12px;border-radius:8px;box-shadow:none;background:#fff}
.pd-benefit-grid .benefit-title{font-size:11px}.pd-benefit-grid .benefit-short{font-size:9px}.pd-benefit-grid .benefit-detail{font-size:10px}.pd-benefit-grid .benefit-detail dl{grid-template-columns:78px 1fr}
.history-section{border-top:1px solid #edf1f5;padding-top:0}.history-section .timeline{font-size:11px;margin-top:10px}

/* Offer Detail visual pass */
.offer-detail-page{max-width:1120px}
.mock-offer-detail{grid-template-columns:minmax(0,1.05fr) minmax(380px,.78fr);gap:10px}
.mock-poster-panel,.mock-decision-panel{border-radius:12px;border:1px solid #e9eef6;box-shadow:0 4px 18px rgba(23,45,82,.04)}
.mock-poster-panel{padding:0;background:#fff;overflow:hidden}
.mock-poster-panel .poster-stage{min-height:590px;border-radius:11px 11px 0 0;background:linear-gradient(180deg,#102a49,#0a1830);padding:36px;justify-content:flex-start;color:#fff;overflow:hidden}
.mock-poster-panel .poster-stage.plat-poster{background:linear-gradient(180deg,#0c1c2f,#071426)}
.poster-photo{position:absolute;inset:0;background:radial-gradient(circle at 77% 18%,rgba(255,184,111,.72),transparent 32%),linear-gradient(135deg,#091522 0%,#10334d 45%,#c36f3d 100%);opacity:.88}
.poster-dark-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,10,21,.72) 0%,rgba(2,10,21,.28) 55%,rgba(2,10,21,.1) 100%)}
.poster-brand,.poster-hero-title,.poster-hero-copy,.poster-subcopy,.poster-feature-row{position:relative;z-index:2}.poster-brand{font-size:12px;letter-spacing:.22em;color:#eef4ff}.poster-hero-title{font-family:Georgia,"Times New Roman",serif;font-size:39px;line-height:1;margin-top:10px}.poster-hero-copy{font-size:28px;line-height:1.28;font-weight:770;max-width:440px;margin-top:15px}.poster-subcopy{font-size:13px;line-height:1.55;color:#e1eaf6;max-width:390px;margin-top:8px}
.mock-poster-panel .poster-card{z-index:2;top:270px;right:80px;width:225px;height:142px;transform:rotate(-5deg)}
.poster-feature-row{margin-top:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;position:absolute;left:24px;right:24px;bottom:22px}.poster-feature-row span{display:flex;flex-direction:column;border:1px solid rgba(255,255,255,.3);background:rgba(4,15,31,.42);backdrop-filter:blur(6px);border-radius:9px;padding:11px}.poster-feature-row b{font-size:14px;color:#fff}.poster-feature-row small{font-size:9px;color:#cbd9ea;margin-top:4px}
.mock-poster-tabs{margin:0;padding:9px 12px;border-top:1px solid #eef2f7;background:#fff}.mock-poster-tabs .poster-tab{font-size:10px;padding:5px 8px;border-radius:999px}
.mock-decision-panel{padding:24px 22px;position:relative;top:0;background:#fff}
.decision-logo{display:flex;justify-content:center;margin:4px 0 8px}.nb-mini{display:inline-block;font-size:28px;font-weight:900;font-style:italic;background:linear-gradient(135deg,#0d6fff,#19c3dd);-webkit-background-clip:text;background-clip:text;color:transparent;letter-spacing:-3px}
.decision-brand-title{text-align:center;color:#12398b;font-size:23px;font-weight:820;letter-spacing:-.5px}.decision-brand-copy{text-align:center;color:#7587b0;font-size:12px;line-height:1.55;margin:7px auto 15px;max-width:340px}
.detail-save{position:absolute;right:16px;top:14px;border:1px solid #e3ebf5;background:#fff;color:#5570a6;border-radius:9px;padding:7px 10px;font-size:10px}.detail-save.saved{color:#0877ff;background:#f5f9ff}
.mock-result-block{margin-top:8px;border-radius:10px;padding:16px;background:linear-gradient(145deg,#eef8ff,#f7fbff);border-color:#d8edff}.mock-result-block .result-meta{font-size:10px;color:#6681a9}.mock-result-block .recommendation{color:#0877ff;font-size:29px;margin:5px 0 13px}.mock-result-block .metric-grid{gap:7px}.mock-result-block .metric{border-radius:8px;padding:10px;background:#fff;border-color:#e2edf8}.mock-result-block .metric-label{font-size:9px;color:#5570a6}.mock-result-block .metric-value{font-size:14px;color:#0d2b72}.result-disclaimer{font-size:9px;color:#7c8ca7;margin-top:9px}
.mock-detail-actions{grid-template-columns:1.45fr 1fr;display:grid;gap:8px;margin-top:13px}.mock-detail-actions .btn{border-radius:999px;font-size:12px;padding:10px 14px}
.detail-trust-row{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:18px;border-top:1px solid #edf2f7;padding-top:14px}.detail-trust-row span{text-align:center;color:#516795;font-size:9px}

/* Login */
.mock-login-card{border-radius:14px;border-color:#e7edf5;box-shadow:0 12px 38px rgba(35,55,90,.07);padding:36px}.login-logo{margin:0 auto 10px}.mock-login-card h1{font-size:24px;color:#101d3f}.mock-login-card p{font-size:12px}.login-primary{border-radius:999px}

/* Add Product */
.add-product-backdrop{background:rgba(20,31,52,.3)}
.add-product-modal{width:min(760px,100%);border-radius:14px;box-shadow:0 26px 70px rgba(20,33,60,.2)}
.add-product-modal .modal-head{padding:16px 20px;background:#fff}.modal-kicker{font-size:9px;color:#8b96aa;text-transform:uppercase;letter-spacing:.08em;margin-bottom:2px}.add-product-modal .modal-title{font-size:16px;color:#162344}
.add-progress-wrap{padding:14px 22px 4px;border-bottom:1px solid #f0f3f7}.add-progress{display:grid;grid-template-columns:24px 1fr 24px 1fr 24px 1fr 24px;align-items:center}.add-progress span{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#edf1f6;color:#8490a3;font-size:10px;font-weight:800}.add-progress span.done{background:#0877ff;color:#fff}.add-progress i{height:2px;background:#e6ebf2}.add-progress-labels{display:grid;grid-template-columns:repeat(4,1fr);margin-top:5px;color:#8b96a8;font-size:8px}.add-progress-labels b{text-align:center;font-weight:650}
.add-product-modal .modal-body{padding:18px 20px 20px}.add-product-modal .modal-foot{padding:12px 20px;background:#fff}.add-product-modal .category-grid{gap:9px}.add-product-modal .category-tile{border-radius:9px;padding:15px}.add-product-modal .category-icon{font-size:18px;margin-bottom:8px}.add-product-modal .category-title{font-size:12px}.add-product-modal .category-sub{font-size:9px}.add-product-modal .option-list{gap:7px}.add-product-modal .option-row{border-radius:8px;padding:10px 11px}.add-product-modal .option-title{font-size:11px}.add-product-modal .option-sub{font-size:9px}.add-product-modal .label{font-size:11px}.add-product-modal .input,.add-product-modal .textarea{border-radius:8px;font-size:11px}.add-product-modal .btn{font-size:11px;border-radius:8px}.add-product-modal .filters{margin:10px 0 12px}.add-product-modal .pill{font-size:9px;padding:5px 9px}.add-product-modal .mini-art{width:50px;height:31px}

/* Higher-resolution offer card assets keep same visual size */
.offer-card-mock{image-rendering:auto}

@media(max-width:1160px){
  .owned-product-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .mock-offer-detail{grid-template-columns:1fr}
  .mock-decision-panel{position:static}
}
@media(max-width:930px){
  .owned-product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .pd-overview{grid-template-columns:220px 1fr}.pd-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:780px){
  .mock-page-title{font-size:24px}.owned-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .attention-row,.attention-row.history-row{grid-template-columns:minmax(0,1fr) auto 18px}.att-product-cell{grid-column:1}.att-action-cell{grid-column:1}.att-time{grid-column:2;grid-row:1/3;align-self:center}.attention-row .chev{grid-column:3;grid-row:1/3}.history-row .history-status{grid-column:2;grid-row:3}.history-row .att-time{grid-row:1/2}.history-row .att-action-cell{grid-row:2}.history-row .att-product-cell{grid-row:1}
  .pd-overview{grid-template-columns:1fr}.pd-art-column{align-items:flex-start}.pd-card-art{width:230px}.pd-quick-actions{margin-left:5px}.pd-facts{grid-template-columns:repeat(2,minmax(0,1fr))}.pd-benefit-grid{grid-template-columns:1fr}
  .mock-poster-panel .poster-stage{min-height:520px}.mock-poster-panel .poster-card{top:245px;right:35px;width:190px;height:120px}.poster-feature-row{grid-template-columns:1fr 1fr 1fr;left:12px;right:12px}.poster-feature-row span{padding:8px}.poster-hero-title{font-size:32px}.poster-hero-copy{font-size:23px}
  .attention-toolbar{align-items:center}.detail-trust-row{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:520px){
  .owned-product-grid{grid-template-columns:1fr 1fr}.mock-page-top{align-items:center}.mock-add-btn{font-size:11px;min-height:31px}.pd-facts{grid-template-columns:1fr 1fr}.poster-feature-row{position:relative;left:auto;right:auto;bottom:auto;margin-top:auto;grid-template-columns:1fr}.mock-poster-panel .poster-stage{min-height:650px}.mock-poster-panel .poster-card{top:310px;right:28px}.mock-detail-actions{grid-template-columns:1fr}.attention-top{align-items:flex-end}.attention-toolbar{flex-direction:column;align-items:stretch}.mock-status-select{align-self:flex-end}
}

/* === V4 mock fidelity pass === */
/* Discover: every card has the exact same footprint as the screenshot-backed cards. */
.fallback-offer-card{width:202px;height:330px;display:flex;flex-direction:column;border:1px solid #e8edf4;border-radius:14px;box-shadow:none;background:#fff;overflow:hidden}
.fallback-offer-card .offer-top{height:154px;min-height:154px;padding:24px 18px;background:#f6f8fb}
.fallback-offer-card .mock-card-art{width:132px;height:82px;border-radius:10px;box-shadow:0 8px 18px rgba(25,40,65,.14)}
.fallback-offer-card .offer-body{padding:13px 13px 12px;display:flex;flex-direction:column;min-height:0;flex:1}
.fallback-offer-card .offer-name{font-size:11.5px;line-height:1.25;font-weight:760;color:#111c3c}
.fallback-offer-card .primary-value{font-size:22px;line-height:1.08;margin-top:8px;color:#091a4a}
.fallback-offer-card .requirement{font-size:10px;line-height:1.35;margin-top:6px;min-height:28px;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.fallback-offer-card .tag-row{gap:5px;margin-top:auto;min-height:20px;align-items:flex-end}
.fallback-offer-card .soft-tag{font-size:8.5px;padding:3px 6px;border-radius:6px}
.fallback-offer-card .provider{left:10px;top:9px;font-size:8.5px;padding:3px 5px;border-radius:5px}
.fallback-offer-card .bookmark{right:7px;top:8px;width:28px;height:30px;border:0;border-radius:7px;background:#fff;box-shadow:none}
.fallback-offer-card .status-tag{right:10px;bottom:8px;font-size:8px;padding:3px 6px}

/* Product Page - matched to the current overview mock. */
.v4-products-page{max-width:1220px;margin:0 auto}
.v4-products-head{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;margin-bottom:12px}
.v4-products-head h1{margin:0;color:#070f22;font-size:31px;line-height:1.05;font-weight:850;letter-spacing:-1px}
.v4-products-head>div>div{margin-top:4px;color:#516aa2;font-size:12px;font-weight:650}
.v4-add-product{height:42px;min-height:42px;padding:0 20px;font-size:13px;box-shadow:none}
.v4-add-product span{margin-left:3px}
.v4-product-search{margin:0 0 14px}
.v4-product-search .search{height:44px;border-radius:11px;border:1px solid #e0e6ef;background:#fff;box-shadow:0 2px 10px rgba(28,53,91,.025);font-size:12px;color:#162552;padding-left:46px}
.v4-product-search .search::placeholder{color:#7180a3}
.v4-product-search .search-icon{left:15px;color:#6177aa}
.v4-product-section-card{border:1px solid #e9eef5;border-radius:13px;background:#fff;box-shadow:0 4px 16px rgba(31,54,92,.025);padding:12px 16px;margin:0 0 14px}
.v4-section-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:6px}
.v4-section-head h2{margin:0;color:#0a1021;font-size:16px;line-height:1.1;font-weight:820;letter-spacing:-.25px}
.v4-section-head .section-count{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:18px;padding:0 6px;border-radius:999px;background:#eef1f6;color:#63718e;font-size:10px;font-weight:700;vertical-align:2px}
.v4-needs-attention{padding-top:13px;padding-bottom:8px}
.v4-needs-attention .mock-link{font-size:12px;color:#0b72ff;padding:3px 0}
.v4-pp-attention-list{border-top:1px solid #eef2f6}
.v4-pp-attention-item{border-bottom:1px solid #eef2f6}
.v4-pp-attention-item:last-child{border-bottom:0}
.v4-pp-attention-row{width:100%;display:grid;grid-template-columns:1.5fr 2fr .8fr 20px;align-items:center;gap:12px;border:0;background:transparent;padding:9px 2px;color:#18264d;text-align:left;cursor:pointer}
.v4-pp-product{font-size:11px;font-weight:720;color:#18243e;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.v4-pp-action{font-size:10.5px;color:#536487;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.v4-pp-time{font-size:10px;color:#51638f;text-align:right;white-space:nowrap}
.v4-pp-time.tone-urgent{color:#ff3b30}.v4-pp-time.tone-soon{color:#ff8a00}
.v4-pp-chevron{font-size:23px;line-height:1;color:#4966a7;text-align:center;font-weight:350}
.v4-needs-attention .attention-expanded{margin:0 0 8px;border-radius:10px}
.v4-product-section{padding-top:10px;padding-bottom:11px}
.v4-owned-product-grid{display:grid;gap:10px 12px;align-items:start}
.credit-products .v4-owned-product-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
.account-products .v4-owned-product-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
.membership-products .v4-owned-product-grid,.other-products .v4-owned-product-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
.v4-owned-product-card{display:block;width:100%;min-width:0;padding:0;border:0;background:transparent;cursor:pointer}
.v4-owned-product-art{display:block;width:100%;overflow:hidden;border-radius:7px;background:#fff;transition:transform .14s ease,filter .14s ease}
.v4-owned-product-art img{display:block;width:100%;height:auto;object-fit:contain}
.v4-owned-product-card:hover .v4-owned-product-art{transform:translateY(-1px);filter:drop-shadow(0 7px 12px rgba(24,44,78,.09))}
.v4-show-more{margin-top:7px;border:0;background:transparent;color:#0a71ff;font-size:10px;font-weight:700;padding:0;cursor:pointer}
.v4-past-products{padding:0 16px}
.v4-past-head{width:100%;border:0;background:transparent;display:flex;justify-content:space-between;align-items:center;padding:11px 0;font-size:15px;color:#10182e;font-weight:800;text-align:left}
.v4-past-head b{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:18px;padding:0 6px;border-radius:999px;background:#eef1f6;color:#64718b;font-size:10px;margin-left:4px}
.v4-past-list{border-top:1px solid #eef2f6;padding-bottom:5px}
.v4-past-row{width:100%;display:grid;grid-template-columns:1.2fr 1fr 18px;gap:12px;align-items:center;border:0;border-bottom:1px solid #eef2f6;background:transparent;padding:7px 0;color:#203153;text-align:left}
.v4-past-row:last-child{border-bottom:0}.v4-past-row span{font-size:10.5px}.v4-past-row small{font-size:9.5px;color:#617099;text-align:right}.v4-past-row b{font-size:20px;color:#4e67a0;text-align:right;font-weight:400}

/* Product Detail - matched to the AMEX Platinum reference mock. */
.v4-product-detail-page{max-width:1180px;margin:0 auto}
.v4-pd-overview{border:1px solid #e4ebf4;border-radius:15px;background:#fff;box-shadow:0 6px 20px rgba(27,49,84,.035);padding:16px 18px;display:grid;grid-template-columns:365px minmax(0,1fr);gap:30px}
.v4-pd-left{display:flex;flex-direction:column;align-items:center;justify-content:flex-start}
.v4-pd-card{width:315px;max-width:100%;border-radius:11px;overflow:hidden;background:#f6f7fa;box-shadow:0 4px 12px rgba(25,43,72,.08)}
.v4-pd-card img{display:block;width:100%;height:auto}
.v4-pd-actions{display:flex;align-items:center;justify-content:center;gap:24px;margin-top:12px;width:100%}
.v4-pd-actions button{border:0;background:transparent;color:#0877ff;font-size:14px;font-weight:700;display:flex;align-items:center;gap:9px;padding:4px 10px}
.v4-pd-actions button span{font-size:12px}.v4-pd-actions i{width:1px;height:20px;background:#dce3ee}
.v4-pd-right{min-width:0;padding-top:7px}
.v4-pd-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
.v4-pd-title-row h1{margin:0;color:#0b1134;font-size:27px;line-height:1.15;font-weight:850;letter-spacing:-.8px}
.v4-pd-edit{border:0;background:transparent;color:#8092ba;font-size:12px;font-weight:700;padding:3px 0;white-space:nowrap}
.v4-pd-status{display:flex;align-items:center;gap:10px;margin-top:12px;color:#162648;font-size:12px}
.v4-pd-status>i{width:1px;height:20px;background:#dfe5ee}.v4-pd-status>b{width:9px;height:9px;border-radius:50%;background:#18c783}.v4-pd-status>b.past{background:#a9b0bd}.v4-pd-status>strong{color:#19bd78;font-size:12px}.v4-pd-status>b.past+strong{color:#808a9a}
.v4-pd-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:18px;border-top:1px solid transparent}
.v4-pd-facts>div{display:flex;align-items:center;gap:12px;padding:9px 16px;border-left:1px solid #e6ebf2}.v4-pd-facts>div:first-child{border-left:0;padding-left:0}
.fact-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:9px;background:#f6f8fb;color:#5b72a4;font-size:17px}
.v4-pd-facts small{display:block;color:#7481a0;font-size:10px;margin-bottom:2px}.v4-pd-facts strong{display:block;color:#0d1636;font-size:12px}
.v4-pd-earning{margin-top:15px;border-radius:10px;background:#f7f9fc;display:grid;grid-template-columns:1fr 1px 1fr 1px 1fr;align-items:center;padding:8px 12px}
.v4-pd-earning>div{display:flex;align-items:center;justify-content:center;gap:11px}.v4-pd-earning>i{width:1px;height:40px;background:#dde4ee}
.earn-icon{font-size:25px}.earn-icon.blue{color:#0877ff}.earn-icon.purple{color:#8b2cff}.earn-icon.green{color:#12be77}
.v4-pd-earning b{display:block;color:#10183a;font-size:16px}.v4-pd-earning small{display:block;color:#6e7892;font-size:10px;margin-top:1px}
.v4-pd-section{margin-top:14px;border:1px solid #e4ebf4;border-radius:15px;background:#fff;box-shadow:0 5px 18px rgba(28,51,89,.025);padding:13px 18px}
.v4-pd-section .v4-section-head{margin-bottom:8px}.v4-pd-section .v4-section-head h2{font-size:18px}
.v4-pd-attention-list{border:1px solid #edf1f5;border-radius:10px;overflow:hidden}
.v4-pd-attention-item{border-bottom:1px solid #edf1f5}.v4-pd-attention-item:last-child{border-bottom:0}
.v4-pd-attention-row{width:100%;display:grid;grid-template-columns:42px 1.7fr .9fr 22px;align-items:center;gap:10px;border:0;background:#fff;padding:8px 9px;text-align:left;color:#152244}
.v4-pd-att-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:#f4f8ff;color:#0877ff;font-size:16px}
.v4-pd-att-copy strong{display:block;font-size:12px;color:#17203a}.v4-pd-att-copy small{display:block;margin-top:2px;font-size:10px;color:#60719a}
.v4-pd-att-time{text-align:right;color:#5f709a;font-size:10px}.v4-pd-att-time.urgent{color:#ff4a40}.v4-pd-att-chevron{font-size:23px;color:#48649e;text-align:center;font-weight:350}
.v4-pd-attention-item .attention-expanded{border-top:1px solid #edf1f5;margin:0;background:#fbfcfe}
.v4-pd-benefits{padding-top:12px;padding-bottom:14px}
.v4-featured-benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:2px}
.v4-feature-benefit{display:grid;grid-template-columns:122px 1fr 15px;align-items:center;gap:12px;border:1px solid #e5ebf3;border-radius:10px;background:#fff;padding:7px;text-align:left;color:#17203a}
.v4-feature-benefit img{width:122px;height:82px;border-radius:8px;object-fit:cover}.v4-feature-benefit strong{display:block;font-size:11px}.v4-feature-benefit small{display:block;margin-top:5px;font-size:9.5px;line-height:1.35;color:#63739a}.v4-feature-benefit>b{font-size:22px;color:#5069a2;font-weight:350}
.v4-benefit-lists{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:12px}.v4-benefit-lists>div{border:1px solid #e5ebf3;border-radius:10px;overflow:hidden}
.v4-benefit-row{width:100%;display:grid;grid-template-columns:28px 1fr .7fr 16px;align-items:center;gap:8px;border:0;border-bottom:1px solid #edf1f5;background:#fff;padding:7px 10px;text-align:left}.v4-benefit-row:last-child{border-bottom:0}
.v4-benefit-icon{font-size:14px;color:#10183a;text-align:center}.v4-benefit-row strong{font-size:10.5px;color:#17203a}.v4-benefit-row small{font-size:9.5px;color:#60719a;text-align:right}.v4-benefit-row>b{font-size:20px;color:#4f68a1;font-weight:350;text-align:right}
.v4-pd-history{padding-top:0;padding-bottom:0}.v4-pd-history .v4-past-head{padding:12px 0}

/* Offer Detail - current reference mock proportions and spacing. */
.v4-offer-detail-page{max-width:1210px;margin:0 auto}
.v4-offer-detail-grid{display:grid;grid-template-columns:minmax(0,1.38fr) minmax(390px,1fr);gap:8px;align-items:stretch}
.v4-offer-poster-shell,.v4-decision-panel{border:1px solid #e6edf6;border-radius:14px;background:#fff;overflow:hidden;box-shadow:0 4px 16px rgba(28,50,88,.025)}
.v4-reference-poster{position:relative;width:100%;height:100%;background:#07152a}
.v4-reference-poster img{display:block;width:100%;height:100%;object-fit:cover}
.poster-hotspot{position:absolute;top:1.5%;height:6%;border:0;background:transparent;cursor:pointer;z-index:4}.poster-hotspot.prev{right:13%;width:5%}.poster-hotspot.next{right:3.6%;width:5%}
.v4-generic-poster{height:100%;min-height:760px;padding:42px 34px 26px;display:flex;flex-direction:column;color:#fff;background:linear-gradient(145deg,#0b1830,#173d72 56%,#c77b48);position:relative;overflow:hidden}
.v4-generic-poster:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 78% 25%,rgba(255,211,162,.55),transparent 28%),linear-gradient(90deg,rgba(2,10,22,.54),rgba(2,10,22,.08));pointer-events:none}.v4-generic-poster>*{position:relative;z-index:1}
.v4-generic-brand{font-size:13px;letter-spacing:.23em}.v4-generic-name{font:700 44px/1.08 Georgia,serif;margin-top:18px}.v4-generic-big{font-size:31px;font-weight:850;margin-top:34px}.v4-generic-copy{font-size:15px;line-height:1.55;margin-top:8px;color:#eef3fb;max-width:80%}.v4-generic-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:auto}.v4-generic-cards span{padding:16px 12px;border:1px solid rgba(255,255,255,.28);border-radius:11px;background:rgba(6,20,42,.45)}.v4-generic-cards b{display:block;font-size:14px}.v4-generic-cards small{display:block;font-size:10px;color:#cbd7ea;margin-top:5px}
.v4-decision-panel{position:relative;padding:26px 23px 19px;display:flex;flex-direction:column;min-height:100%}
.v4-detail-save{position:absolute;right:18px;top:18px;height:38px;padding:0 15px;border:1px solid #e4eaf3;border-radius:9px;background:#fff;color:#6378aa;font-size:12px;font-weight:700}.v4-detail-save.saved{color:#0877ff;border-color:#d5e7ff;background:#f8fbff}
.v4-nb-logo{height:88px;display:flex;align-items:center;justify-content:center;margin-top:4px}.v4-nb-logo img{height:82px;width:auto;display:block}
.v4-decision-panel h1{margin:2px 0 0;text-align:center;color:#173c92;font-size:25px;font-weight:850;letter-spacing:-.4px}.v4-decision-copy{text-align:center;color:#788ab3;font-size:12px;line-height:1.65;margin:8px auto 16px;max-width:390px}
.v4-result-card{border:1px solid #cfe8ff;border-radius:12px;background:linear-gradient(145deg,#eef9ff,#f5fbff);padding:16px 14px 12px}.v4-result-meta{font-size:11px;color:#173d8b;font-weight:750}.v4-recommendation{font-size:34px;line-height:1.05;font-weight:850;color:#1175f4;margin:14px 0 18px}
.v4-metric-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.v4-metric{display:grid;grid-template-columns:45px 1fr;gap:10px;align-items:center;background:#fff;border-radius:10px;padding:11px 10px;border:1px solid #e5eef9}.v4-metric-icon{width:42px;height:42px;display:grid;place-items:center;color:#0877ff}.v4-metric-icon svg{width:37px;height:37px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.v4-metric .metric-label{font-size:10px;color:#183575;font-weight:750}.v4-metric .metric-value{font-size:15px;font-weight:850;margin-top:2px}.tone-green{color:#17bd68!important}.tone-blue{color:#0877ff!important}.tone-orange{color:#ff9c00!important}.v4-metric .metric-sub{font-size:8.7px;line-height:1.3;color:#8a9ab9;margin-top:2px}.v4-result-note{font-size:8.8px;color:#8095bd;margin-top:9px;text-align:center}
.v4-detail-actions{display:grid;grid-template-columns:1.35fr 1fr;gap:10px;margin-top:13px}.v4-detail-actions .btn{border-radius:999px;font-size:14px;padding:11px 16px}.v4-detail-actions .btn.primary{background:linear-gradient(90deg,#0877ff,#18b5ff)}.v4-security-line{text-align:center;color:#8091ba;font-size:9.5px;margin-top:9px}.v4-security-line span{margin-left:5px}
.v4-trust-row{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:auto;padding-top:17px;border-top:1px solid #edf2f7;color:#234994}.v4-trust-row span{text-align:center;font-size:20px}.v4-trust-row b{display:block;font-size:9px;color:#284f9a;margin-top:3px}.v4-trust-row small{display:block;font-size:7.7px;color:#9aa7c0;margin-top:1px}

@media(max-width:1180px){
  .v4-products-page,.v4-product-detail-page,.v4-offer-detail-page{max-width:980px}
  .credit-products .v4-owned-product-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .account-products .v4-owned-product-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .membership-products .v4-owned-product-grid,.other-products .v4-owned-product-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .v4-pd-overview{grid-template-columns:310px minmax(0,1fr)}
  .v4-offer-detail-grid{grid-template-columns:1fr}
  .v4-offer-poster-shell{max-width:760px;margin:0 auto}.v4-decision-panel{max-width:760px;width:100%;margin:0 auto}
}
@media(max-width:780px){
  .fallback-offer-card{width:100%;height:auto;aspect-ratio:202/330}
  .v4-products-head h1{font-size:27px}.v4-product-section-card{padding:11px 12px}
  .credit-products .v4-owned-product-grid,.account-products .v4-owned-product-grid,.membership-products .v4-owned-product-grid,.other-products .v4-owned-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .v4-pp-attention-row{grid-template-columns:1fr auto 18px;gap:7px}.v4-pp-action{grid-column:1}.v4-pp-product{grid-column:1}.v4-pp-time{grid-column:2;grid-row:1/3;align-self:center}.v4-pp-chevron{grid-column:3;grid-row:1/3}
  .v4-pd-overview{grid-template-columns:1fr}.v4-pd-card{width:290px}.v4-pd-left{align-items:flex-start}.v4-pd-title-row h1{font-size:23px}.v4-pd-facts{grid-template-columns:1fr}.v4-pd-facts>div{border-left:0;border-top:1px solid #edf1f5;padding-left:0}.v4-pd-facts>div:first-child{border-top:0}.v4-pd-earning{grid-template-columns:1fr}.v4-pd-earning>i{display:none}.v4-pd-earning>div{justify-content:flex-start;padding:6px 0}.v4-featured-benefits{grid-template-columns:1fr}.v4-benefit-lists{grid-template-columns:1fr}.v4-feature-benefit{grid-template-columns:100px 1fr 15px}.v4-feature-benefit img{width:100px;height:72px}
  .v4-pd-attention-row{grid-template-columns:38px 1fr auto 20px}.v4-pd-att-copy small{white-space:normal}
  .v4-decision-panel{padding:22px 15px}.v4-recommendation{font-size:30px}.v4-metric-grid{grid-template-columns:1fr 1fr}.v4-metric{grid-template-columns:36px 1fr}.v4-metric-icon{width:34px;height:34px}.v4-metric-icon svg{width:30px;height:30px}.v4-trust-row{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:520px){
  .v4-products-head{align-items:center}.v4-add-product{height:36px;min-height:36px;padding:0 13px;font-size:11px}
  .credit-products .v4-owned-product-grid,.account-products .v4-owned-product-grid,.membership-products .v4-owned-product-grid,.other-products .v4-owned-product-grid{grid-template-columns:1fr 1fr}
  .v4-metric-grid{grid-template-columns:1fr}.v4-detail-actions{grid-template-columns:1fr}
}

/* V5 — credit-card artwork uses a real ISO/IEC 7810 card silhouette instead of the stretched mock crops. */
.credit-products .v4-owned-product-art{
  aspect-ratio:1.586 / 1;
  height:auto;
  border-radius:9px;
  overflow:hidden;
  background:transparent;
  box-shadow:none;
  display:flex;
  align-items:center;
  justify-content:center;
}
.credit-products .v4-owned-product-art img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:9px;
  filter:drop-shadow(0 3px 5px rgba(20,36,62,.12));
}
.credit-products .v4-owned-product-card:hover .v4-owned-product-art{
  filter:none;
  transform:translateY(-1px);
}
.credit-products .v4-owned-product-card:hover .v4-owned-product-art img{
  filter:drop-shadow(0 7px 11px rgba(20,36,62,.16));
}

/* V5 Assessment — deterministic questionnaire pulled from the production Assessment contracts. */
.v5-assessment-page{max-width:930px;margin:0 auto;padding-top:24px}
.assessment-shell{max-width:760px;margin:18px auto 0}
.assessment-progress-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}
.assessment-progress-head h1{margin:5px 0 0;color:#0b1332;font-size:30px;line-height:1.22;letter-spacing:-.7px}
.assessment-progress-head>strong{color:#62708f;font-size:13px;font-weight:750;margin-top:12px;white-space:nowrap}
.assessment-progress{height:5px;background:#e9edf4;border-radius:999px;overflow:hidden;margin:18px 0 22px}
.assessment-progress i{display:block;height:100%;background:#0877ff;border-radius:inherit;transition:width .18s ease}
.assessment-card{background:#fff;border:1px solid #e4e9f1;border-radius:18px;box-shadow:0 8px 26px rgba(29,50,85,.045);padding:22px}
.assessment-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.assessment-choices.compact{margin-top:12px}
.assessment-choices.multi{grid-template-columns:1fr 1fr}
.assessment-choice{min-height:52px;border:1px solid #dfe5ee;background:#fff;border-radius:12px;padding:12px 14px;display:flex;align-items:center;gap:11px;color:#152241;text-align:left;font:inherit;font-size:13px;font-weight:650;cursor:pointer;transition:border .14s ease,background .14s ease,box-shadow .14s ease}
.assessment-choice:hover{border-color:#aacbfb;background:#fbfdff}
.assessment-choice.selected{border-color:#0a76ff;background:#f3f8ff;box-shadow:0 0 0 1px rgba(10,118,255,.08)}
.assessment-mark{flex:0 0 20px;width:20px;height:20px;border:1.5px solid #c8d1df;border-radius:50%;display:grid;place-items:center;color:white;font-size:12px;font-weight:900;background:#fff}
.assessment-choice.selected .assessment-mark{border-color:#0a76ff;background:#0a76ff}
.assessment-compound{display:grid;gap:22px}
.assessment-subq{padding-bottom:20px;border-bottom:1px solid #edf1f6}
.assessment-subq:last-child{padding-bottom:0;border-bottom:0}
.assessment-subq-title{display:flex;align-items:flex-start;gap:9px;color:#17223f;font-size:14px;font-weight:760;line-height:1.45}
.assessment-subq-title>span{width:23px;height:23px;border-radius:999px;background:#eef5ff;color:#0877ff;display:grid;place-items:center;font-size:11px;flex:0 0 23px}
.assessment-help{margin:16px 2px 0;color:#7b8498;font-size:11px;line-height:1.55}
.assessment-nav{display:flex;justify-content:space-between;gap:12px;margin-top:18px}
.assessment-nav .btn{min-width:120px}
.assessment-nav .btn[disabled]{opacity:.38;cursor:default;pointer-events:none}
.assessment-footnote{text-align:center;color:#9299a8;font-size:10px;margin:14px 0 0}
.v5-short-summary{font-size:12px;color:#53627f;text-align:center;margin:-2px 0 10px;font-weight:650}
.v5-primary-alert{border:1px solid #ffd7d2;background:#fff6f5;color:#c73a32;border-radius:10px;padding:9px 11px;font-size:11px;line-height:1.45;margin:10px 0 12px;font-weight:650}
.v5-reassess{display:block;margin:8px auto 0;border:0;background:transparent;color:#6d7b96;font-size:11px;font-weight:700;cursor:pointer;padding:6px 10px}
.v5-reassess:hover{color:#0877ff}
.v5-report-summary{color:#53627f;font-size:13px;margin:2px 0 12px}
.v5-full-report h3{margin-top:22px}.v5-full-report h3:first-child{margin-top:0}
.v5-tip-list{display:grid;gap:10px;margin-top:10px}
.v5-tip-list>div{background:#f8fafc;border:1px solid #e8edf4;border-radius:12px;padding:12px 14px}
.v5-tip-list strong{display:block;color:#16213f;font-size:13px;margin-bottom:3px}.v5-tip-list p{margin:0!important;font-size:12px!important;color:#5d687e!important}

@media(max-width:780px){
  .credit-products .v4-owned-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .assessment-progress-head h1{font-size:25px}
  .assessment-choices,.assessment-choices.multi{grid-template-columns:1fr}
  .assessment-card{padding:16px;border-radius:15px}
}

/* V6 — exact card-art mapping across Product Page and Product Detail. */
.v4-pd-card.credit-card-art{
  width:315px;
  aspect-ratio:1.586 / 1;
  height:auto;
  border-radius:11px;
  overflow:hidden;
  background:transparent;
  box-shadow:none;
}
.v4-pd-card.credit-card-art img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:11px;
  filter:drop-shadow(0 5px 10px rgba(20,36,62,.12));
}
@media(max-width:780px){
  .v4-pd-card.credit-card-art{width:290px}
}

/* V7 Add Product: use exact credit-card artwork and preserve real card aspect ratio */
.add-product-modal .add-card-art{width:72px;height:45px;flex:0 0 72px;display:flex;align-items:center;justify-content:center;overflow:hidden;background:transparent;border-radius:7px}
.add-product-modal .add-card-art img{display:block;width:100%;height:100%;object-fit:contain;object-position:center}
.assessment-inline-number{margin-top:10px;display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:10px;background:#f8fafc;border:1px solid #e7ebf0}
.assessment-inline-number label{font-size:12px;font-weight:700;color:#455066;white-space:nowrap}
.assessment-inline-number .input{max-width:150px;margin-left:auto}

/* V8 interaction closeout */
.v4-generic-poster-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px}
.v4-generic-poster-tabs button{border:1px solid rgba(255,255,255,.28);background:rgba(6,20,42,.24);color:rgba(255,255,255,.78);border-radius:999px;padding:7px 12px;font:inherit;font-size:10px;font-weight:720;cursor:pointer}
.v4-generic-poster-tabs button.active{background:#fff;color:#17365f;border-color:#fff}
.v4-generic-kicker{margin-top:28px;font-size:10px;letter-spacing:.18em;color:#cbd8ec;font-weight:760}
.v4-no-action-note{margin:12px 0 4px;padding:10px 12px;border-radius:10px;background:#f7f9fc;color:#6f7d98;font-size:11px;text-align:center}
.v4-detail-actions:has(.btn:only-child){grid-template-columns:1fr}

.owned-product-meta{display:grid;grid-template-columns:minmax(0,1fr) 16px;gap:6px;align-items:center;margin-top:7px;text-align:left}
.owned-product-meta strong{display:block;color:#17203a;font-size:10.5px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.owned-product-meta small{display:block;color:#77839a;font-size:9px;line-height:1.25;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.owned-product-chevron{font-size:18px;color:#6075a6;font-weight:350;text-align:right}
.account-products .v4-owned-product-art,.membership-products .v4-owned-product-art,.other-products .v4-owned-product-art{height:62px;display:flex;align-items:center;justify-content:center;background:#f7f9fc;border:1px solid #edf1f5}
.account-products .v4-owned-product-art img,.membership-products .v4-owned-product-art img,.other-products .v4-owned-product-art img{max-height:54px;width:auto;max-width:90%}
.attention-zero-state{padding:18px 4px 12px;color:#76839c;font-size:11px;border-top:1px solid #eef2f6}

.product-sort-wrap{position:relative;margin-left:auto}
.product-sort-button{border:0;background:transparent;color:#0a71ff;font-size:10px;font-weight:720;cursor:pointer;padding:3px 2px}
.product-sort-menu{position:absolute;right:0;top:26px;z-index:20;width:150px;padding:6px;background:#fff;border:1px solid #e3e9f1;border-radius:11px;box-shadow:0 12px 28px rgba(25,45,78,.12)}
.product-sort-menu button{display:block;width:100%;border:0;background:transparent;text-align:left;padding:8px 9px;border-radius:7px;color:#2c3958;font-size:10px;cursor:pointer}
.product-sort-menu button:hover{background:#f3f7fc}

.assessment-result-reasons{margin:18px 0;padding:16px 18px;border:1px solid #e5ebf3;border-radius:14px;background:#fff}
.assessment-result-reasons h3{margin:0 0 8px;font-size:15px;color:#14203c}
.assessment-result-reasons p{margin:6px 0;color:#5f6c84;font-size:12px;line-height:1.55}

.edit-product-page{max-width:760px;margin:0 auto;padding-bottom:36px}
.edit-panel{background:#fff;border:1px solid #e4eaf2;border-radius:16px;padding:18px;box-shadow:0 7px 24px rgba(27,48,82,.035)}
.edit-product-page .option-list{margin-top:14px}
.edit-footer{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}
.edit-footer.split{justify-content:space-between;align-items:center}
.edit-footer .btn{min-width:132px}
.edit-product-page .task-card{margin-top:10px}

.v4-benefit-item-wrap,.v4-feature-benefit-wrap{display:block}
.v4-benefit-expanded{padding:12px 14px;border:1px solid #e6ebf2;border-top:0;background:#fbfcfe;color:#52617d;font-size:10.5px;line-height:1.55}
.v4-benefit-expanded dl{display:grid;grid-template-columns:98px 1fr;gap:7px 12px;margin:0}
.v4-benefit-expanded dt{color:#78849a;font-weight:650}.v4-benefit-expanded dd{margin:0;color:#33405e}
.v4-benefit-expanded .official-link{margin-top:10px;border:0;background:transparent;color:#0a71ff;font-size:10.5px;font-weight:700;padding:0;cursor:pointer}
.timeline-empty{padding:14px 2px;color:#7b869c;font-size:11px}
.load-more-wrap{text-align:center;padding:16px 0 4px}
.load-more-wrap .btn{min-width:120px}

.date-field-row{display:flex;gap:8px;align-items:center}
.date-field-row .input{flex:1}
.date-field-row .btn{flex:0 0 auto;white-space:nowrap}
.duplicate-warning{margin:12px 0;padding:14px;border:1px solid #f0d79d;background:#fffaf0;border-radius:12px;color:#4b3b1a}
.duplicate-warning strong{display:block;font-size:12px}.duplicate-warning p{margin:4px 0 10px;font-size:11px;color:#77643d}
.submitted-note{display:inline-flex;margin-top:8px;padding:7px 11px;border-radius:999px;background:#effaf4;color:#138752;font-size:11px;font-weight:700}
.add-more-filter{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0 12px;padding:8px;border:1px solid #e5eaf2;background:#fafbfd;border-radius:10px}
.add-more-filter button{border:0;background:#fff;border-radius:8px;padding:7px 10px;color:#445372;font:inherit;font-size:10px;cursor:pointer;box-shadow:0 0 0 1px #e5eaf2}
.v4-pd-earning.single{grid-template-columns:1fr}

@media(max-width:780px){
  .v4-generic-poster{min-height:620px;padding:26px 20px 22px}
  .v4-generic-name{font-size:34px}.v4-generic-big{font-size:27px}.v4-generic-copy{max-width:100%}
  .v4-generic-cards{grid-template-columns:1fr}
  .owned-product-meta strong{font-size:10px}
  .edit-footer.split{flex-direction:column-reverse;align-items:stretch}.edit-footer.split .btn{width:100%}
  .product-sort-menu{right:0}
}

/* V8 final acceptance states */
.v4-result-card.is-ended,.v4-result-card.assessment-unavailable{background:#f8fafc;border-color:#e4e9f0}
.v4-recommendation.ended{color:#657188;font-size:27px;letter-spacing:-.03em}
.v4-recommendation.neutral{color:#50617e;font-size:24px;letter-spacing:-.025em}
.v4-detail-actions.single{grid-template-columns:1fr}


/* === V9 VISUAL ACCEPTANCE PASS ===
   Visual-only alignment to the approved Need Review mocks.
   No routing, assessment, attention, add-product, or persistence logic is changed here. */
@media(min-width:781px){
  :root{--sidebar:188px}
  .sidebar{padding:38px 18px 26px}
  .brand{padding:0 8px 31px;gap:7px;font-size:20px;letter-spacing:-.7px}
  .brand-mark{width:37px;height:30px}
  .brand-mark .nb-n,.brand-mark .nb-b{font-size:27px;letter-spacing:-6px}
  .nav{gap:7px}
  .nav-divider{margin:11px 9px 12px}
  .nav-item{min-height:46px;padding:0 12px;border-radius:11px;gap:11px;font-size:15px}
  .nav-icon,.nav-icon svg{width:23px;height:23px}
  .nav-item.login-item{margin-top:8px;min-height:43px;border-radius:9px;box-shadow:none}
  .nav-badge{min-width:18px;height:18px;padding:0 5px;font-size:9px}
  .main{padding:34px 36px 76px}

  /* The mocks align page content to the left edge of the main canvas rather than floating it in the center. */
  .content,.discover-page,.wishlist-page,.attention-page,.v4-products-page,.v4-product-detail-page,.v4-offer-detail-page{margin-left:0;margin-right:auto}
  .discover-page,.wishlist-page{max-width:1080px}
  .v4-products-page{max-width:1260px}
  .v4-product-detail-page{max-width:1260px}
  .v4-offer-detail-page{max-width:1210px}
  .attention-page{max-width:1180px}
}

/* Discover / Wishlist — preserve the approved 202x330 Offer Card footprint and tighten surrounding chrome. */
.discover-search-row{margin-bottom:14px}
.discover-page .search{height:50px;border-radius:11px;font-size:13px}
.discover-page .filters{gap:8px;margin-bottom:18px}
.discover-page .pill{height:36px;padding:0 12px;font-size:12px}
.discover-page .pill-icon,.discover-page .pill-icon svg{width:17px;height:17px}
.offer-grid{gap:12px 10px}
.wishlist-head{align-items:flex-start;margin-bottom:18px!important}
.wishlist-head .mock-page-count{margin-top:6px;color:#7f8da9;white-space:nowrap}
.mock-page-subtitle{margin-top:4px;color:#7583a1;font-size:11px;font-weight:500}
.wishlist-unavailable{margin-top:22px}
.wishlist-page .past-products-head{font-size:11px}

/* Product Page — remove duplicate labels under artwork; the approved mock uses the artwork itself as the tile. */
.v4-products-page{padding-bottom:10px}
.v4-products-head{margin-bottom:10px}
.v4-products-head h1{font-size:29px}
.v4-products-head>div>div{font-size:11px}
.v4-product-search{margin-bottom:11px}
.v4-product-section-card{padding:10px 14px;margin-bottom:11px;border-radius:11px}
.v4-section-head{margin-bottom:5px}
.v4-section-head h2{font-size:15px}
.v4-needs-attention{padding-top:11px;padding-bottom:6px}
.v4-pp-attention-row{padding:8px 2px;grid-template-columns:1.45fr 1.75fr .75fr 18px}
.v4-pp-product{font-size:11.5px}
.v4-pp-action{font-size:11px}
.v4-pp-time{font-size:10.5px}
.v4-product-section{padding-top:9px;padding-bottom:10px}
.v4-owned-product-grid{gap:9px 12px}
.v4-owned-product-card .owned-product-meta,.v4-owned-product-card .owned-product-chevron{display:none}
.account-products .v4-owned-product-art,.membership-products .v4-owned-product-art,.other-products .v4-owned-product-art{height:58px;border-radius:6px}
.account-products .v4-owned-product-art img,.membership-products .v4-owned-product-art img,.other-products .v4-owned-product-art img{max-height:52px;max-width:96%}
.account-products .fallback-brand,.other-products .fallback-brand{color:#18325e;font-size:13px;letter-spacing:0}
.membership-products .fallback-brand{font-size:13px}
.v4-show-more{margin-top:6px;font-size:10px}
.v4-past-products{padding:0 14px}
.v4-past-head{padding:9px 0;font-size:14px}
.v4-past-row{padding:6px 0}
.v4-past-row span{font-size:11px}.v4-past-row small{font-size:10px}

/* Product Detail — approved mock is a little denser and wider than V8. */
.v4-pd-overview{border-radius:12px;padding:15px 18px;grid-template-columns:350px minmax(0,1fr);gap:26px}
.v4-pd-card.credit-card-art{width:300px}
.v4-pd-right{padding-top:4px}
.v4-pd-title-row h1{font-size:26px}
.v4-pd-status{margin-top:9px}
.v4-pd-facts{margin-top:14px}
.v4-pd-facts>div{padding:8px 14px}
.v4-pd-earning{margin-top:12px;padding:7px 10px}
.v4-pd-section{margin-top:12px;border-radius:12px;padding:11px 16px}
.v4-pd-section .v4-section-head h2{font-size:17px}
.v4-pd-attention-row{padding:8px 8px}
.v4-featured-benefits{gap:12px}
.v4-feature-benefit{grid-template-columns:112px 1fr 14px;padding:6px}
.v4-feature-benefit img{width:112px;height:75px}
.v4-benefit-lists{gap:15px;margin-top:10px}
.v4-benefit-row{padding:7px 9px}
.v4-pd-history .v4-past-head{padding:10px 0}

/* All Attention — the approved page fills more of the content canvas and uses larger rows. */
.attention-page .mock-page-title{font-size:28px}
.attention-page .mock-page-top{margin-bottom:10px}
.attention-toolbar{margin-bottom:10px}
.mock-tabs .tab{font-size:12px;padding:8px 1px 9px}
.mock-filter-select,.mock-status-select{height:34px;font-size:11px}
.attention-box{border-radius:11px}
.attention-row{grid-template-columns:1.25fr 1.5fr .78fr 24px;gap:14px;padding:13px 15px}
.attention-row.history-row{grid-template-columns:1.18fr 1.28fr .72fr .58fr 24px}
.att-thumb{width:54px;height:34px;border-radius:5px}
.att-product-copy strong,.att-action-cell strong{font-size:12px}
.att-product-copy small,.att-action-cell small{font-size:10px}
.att-time{font-size:11px}
.history-status{font-size:10px}
.attention-expanded{padding:17px}

/* Offer Detail — keep exact poster artwork and reduce the extra framing around the reference mock. */
.v4-offer-detail-grid{gap:6px}
.v4-offer-poster-shell,.v4-decision-panel{border-radius:10px;box-shadow:none}
.v4-decision-panel{padding:22px 20px 16px}
.v4-detail-save{top:14px;right:14px;height:34px;border-radius:8px;font-size:10px}
.v4-nb-logo{height:76px;margin-top:0}.v4-nb-logo img{height:72px}
.v4-decision-panel h1{font-size:22px}
.v4-decision-copy{font-size:10.5px;margin:6px auto 12px}
.v4-result-card{padding:14px 12px 10px;border-radius:10px}
.v4-recommendation{font-size:30px;margin:11px 0 14px}
.v4-metric{grid-template-columns:39px 1fr;padding:9px 8px}
.v4-metric-icon{width:36px;height:36px}.v4-metric-icon svg{width:31px;height:31px}
.v4-detail-actions{margin-top:10px}.v4-detail-actions .btn{font-size:12px;padding:9px 13px}
.v4-trust-row{padding-top:12px;margin-top:auto}

/* Add Product — match the compact desktop mock proportions without touching the flow. */
.add-product-backdrop{background:rgba(28,39,58,.28);backdrop-filter:blur(2px)}
.add-product-modal{width:min(720px,100%);border-radius:12px}
.add-product-modal .modal-head{padding:13px 17px}
.add-product-modal .modal-title{font-size:15px}
.add-progress-wrap{padding:11px 19px 3px}
.add-product-modal .modal-body{padding:15px 17px 17px}
.add-product-modal .modal-foot{padding:10px 17px}
.add-product-modal .category-tile{padding:13px}
.add-product-modal .option-row{padding:9px 10px}

/* Login has no frozen mock; keep the same visual language as the approved shell. */
.mock-login-card{width:min(390px,100%);padding:30px;border-radius:12px;box-shadow:0 12px 34px rgba(35,55,90,.06)}

/* V9 visual-only fallback labels for tiles that do not yet have a frozen artwork asset. */
.account-products .fallback-brand,.membership-products .fallback-brand,.other-products .fallback-brand{
  display:block;max-width:100%;padding:0 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center;
}
.other-products .fallback-brand{font-size:11px;line-height:1.2;font-weight:700}

/* V9.1 visual-only: normalize non-card product sections into desktop info tiles.
   Scope intentionally limited to 银行和券商账户 / 会籍 / 其他. */
.account-products .v4-owned-product-grid,
.membership-products .v4-owned-product-grid,
.other-products .v4-owned-product-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px 12px}

.account-products .v10-info-tile,
.membership-products .v10-info-tile,
.other-products .v10-info-tile{
  min-height:78px;
  display:grid;
  grid-template-columns:48px minmax(0,1fr) 14px;
  align-items:center;
  gap:11px;
  padding:10px 11px;
  border:1px solid #e3e9f2;
  border-radius:10px;
  background:#fff;
  box-shadow:0 1px 2px rgba(24,42,74,.018);
  text-align:left;
  transition:border-color .14s ease,background .14s ease,box-shadow .14s ease,transform .14s ease;
}
.account-products .v10-info-tile:hover,
.membership-products .v10-info-tile:hover,
.other-products .v10-info-tile:hover{
  border-color:#cfdcf0;
  background:#fcfdff;
  box-shadow:0 5px 14px rgba(28,49,84,.045);
  transform:translateY(-1px);
}
.v10-info-logo{
  width:48px;
  height:48px;
  border:1px solid #edf1f6;
  border-radius:10px;
  background:#f8fafc;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  box-sizing:border-box;
}
.v10-info-logo img{
  width:100%;
  height:100%;
  object-fit:contain;
  padding:4px;
  box-sizing:border-box;
}
.v10-logo-fallback{
  display:flex;
  width:100%;
  height:100%;
  align-items:center;
  justify-content:center;
  color:#17365f;
  font-size:13px;
  font-weight:800;
  letter-spacing:.01em;
}
.v10-info-copy{min-width:0;display:block}
.v10-info-copy strong{
  display:block;
  color:#12213f;
  font-size:11.5px;
  line-height:1.18;
  font-weight:760;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.v10-info-copy small{
  display:block;
  margin-top:4px;
  color:#6f7f9f;
  font-size:9.5px;
  line-height:1.28;
  font-weight:520;
  white-space:normal;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
}
.v10-info-chevron{
  color:#7184ac;
  font-size:19px;
  line-height:1;
  font-weight:360;
  text-align:right;
}

@media(max-width:1100px){
  .account-products .v4-owned-product-grid,
  .membership-products .v4-owned-product-grid,
  .other-products .v4-owned-product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:760px){
  .account-products .v4-owned-product-grid,
  .membership-products .v4-owned-product-grid,
  .other-products .v4-owned-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .account-products .v10-info-tile,
  .membership-products .v10-info-tile,
  .other-products .v10-info-tile{grid-template-columns:44px minmax(0,1fr) 12px;min-height:70px;padding:8px 9px;gap:9px}
  .v10-info-logo{width:44px;height:44px;border-radius:9px}
}
