.review-grid.with-c { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: 100%; align-items: start; }
.type-c #app, .type-c { background: #f5f7f7; color: #101417; letter-spacing: -.35px; }
.type-c .a-status { height: 53px; padding: 0 19px 7px 35px; background: #f5f7f7; font-weight: 500; }
.type-c .c-header { display: flex; justify-content: space-between; height: 40px; padding: 0 16px; background: #f5f7f7; }
.c-header .iconbtn { padding: 0; width: 23px; height: 25px; color: #11171d; }
.c-header .iconbtn svg { width: 22px; height: 22px; }
.c-header-actions { display: flex; align-items: center; gap: 22px; }
.c-header-logo { display: block; width: 92px; height: auto; align-self: center; }
.c-main { display: grid; gap: 16px; padding: 23px 17px 86px; }
.c-points { min-height: 90px; display: flex; justify-content: space-between; align-items: flex-start; padding: 3px 6px 0 7px; }
.c-points h1 { margin: 0; color: #101417; font-size: 33px; line-height: 1.12; font-weight: 500; letter-spacing: -1px; }
.c-points h1 strong { font-weight: 700; }
.c-points-pill { background: #ff9300; border-radius: 20px; padding: 6px 12px; min-height: 34px; font-weight: 700; font-size: 14px; }
.c-points-pill span { font-size: 18px; line-height: 1; }
.c-total { position: relative; color: white; border-radius: 19px; overflow: hidden; background: linear-gradient(111deg,#329cf5,#0768fa); }
.c-total-amount { height: 130px; padding: 20px 21px 0; }
.c-total-amount > span { display: block; font-size: 12px; font-weight: 650; color: #e3f1ff; }
.c-total-amount strong { display: block; margin-top: 3px; font-size: 36px; line-height: 1.15; font-weight: 400; letter-spacing: -1px; }
.c-total-amount small { font-size: inherit; }
.c-total-detail { display: flex; align-items: center; gap: 3px; margin-top: 13px; padding: 0; color: #e3f1ff; font-weight: 600; font-size: 12px; }
.c-total-detail svg { width: 12px; height: 12px; }
.c-more { position: absolute; right: 17px; top: 17px; padding: 0 5px; font-size: 21px; color: white; }
.c-total-actions { display: grid; grid-template-columns: repeat(3,1fr); height: 57px; border-top: 1px solid #ffffff22; }
.c-total-actions button { display: flex; justify-content: center; align-items: center; gap: 6px; padding: 0; font-size: 15px; font-weight: 650; white-space: nowrap; }
.c-total-actions svg { width: 19px; height: 19px; }
.c-feature-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.c-feature-grid button { position: relative; height: 88px; overflow: hidden; border-radius: 17px; background: white; display: flex; align-items: flex-start; padding: 16px; text-align: left; }
.c-feature-grid strong { position: relative; z-index: 1; font-size: 18px; font-weight: 700; }
.c-feature-grid img { position: absolute; right: -3px; bottom: -9px; width: 91px; height: 82px; object-fit: contain; }
.c-shortcuts { height: 89px; display: grid; grid-template-columns: repeat(3,1fr); background: white; border-radius: 16px; padding: 0 16px; }
.c-shortcuts button { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 4px; padding: 0; font-size: 16px; font-weight: 700; }
.c-shortcuts img { width: 35px; height: 31px; object-fit: contain; }
.c-accounts { margin: 5px 1px 0; overflow: hidden; border-radius: 14px; background: white; }
.c-accounts summary { background: #006094; color: white; list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; height: 59px; padding: 0 20px; font-size: 16px; font-weight: 650; }
.c-accounts summary::-webkit-details-marker { display: none; }
.c-accounts details + details summary { background: #00ace8; color: #102333; }
.c-accounts details + details summary b { color: inherit; }
.c-accounts summary b { margin-left: 2px; font-weight: 600; color: #fff3b9; }
.c-accordion-end { display: flex; align-items: center; gap: 10px; }
.c-chevron { width: 8px; height: 8px; border-right: 1.5px solid; border-bottom: 1.5px solid; transform: rotate(45deg); margin-right: 4px; }
.c-accounts details[open] .c-chevron { transform: rotate(225deg); }
.c-accounts button { width: calc(100% - 40px); margin: 0 20px; min-height: 80px; display: flex; align-items: center; gap: 14px; text-align: left; padding: 0; }
.c-accounts button + button { border-top: 1px solid #edf1f4; }
.c-accounts button strong, .c-accounts button small { display: block; }
.c-accounts button strong { font-size: 16px; font-weight: 600; }
.c-accounts button small { color: #73777b; font-size: 13px; margin-top: 4px; }
.c-accounts button svg { width: 15px; height: 15px; color: #68788a; margin-left: auto; }
.c-bank-mark { display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; color: white; background: #0868e8; font-size: 11px; font-weight: 700; }
.c-bank-light { background: #139ee8; }
.type-c .bottomnav.c-nav { height: 69px; padding: 0 19px; align-items: flex-start; background: transparent; border: 0; box-shadow: none; backdrop-filter: none; isolation: isolate; }
.type-c .bottomnav.c-nav::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: white;
  mask-image: radial-gradient(circle at 50% -0.5px, transparent 38px, black 38.5px);
}
.type-c .c-nav a { width: 20%; height: 61px; display: grid; place-items: center; color: #2867a2; padding: 0; }
.type-c .c-nav a > svg { width: 30px; height: 30px; margin: 0; }
.c-nav .c-pay { position: relative; }
.c-pay > span { position: absolute; top: -39px; display: grid; place-items: center; width: 77px; height: 77px; border-radius: 50%; }
.c-pay > span::before { content: ''; position: absolute; inset: 8px; border-radius: 50%; background: linear-gradient(135deg,#418dff,#1464e4); box-shadow: 0 -2px 4px #245dab2b; }
.type-c .c-nav .c-pay svg { position: relative; width: 36px; height: 36px; margin: 0; color: white; }
.c-avatar { display: grid; place-items: center; overflow: hidden; border-radius: 50%; background: #e9f4ff; width: 31px; height: 31px; }
.c-avatar img { width: 38px; height: 38px; object-fit: contain; }

.c-recent { margin-left: auto; text-align: right; }
.c-recent small { margin: 0 0 4px; font-size: 11px; }
.c-recent strong { font-variant-numeric: tabular-nums; }
.c-owner-cycle { position: absolute; right: 2px; bottom: -2px; width: 72px; height: 77px; pointer-events: none; }
.c-feature-grid .c-owner-cycle img { inset: auto 0 0; width: 100%; height: 100%; object-fit: contain; object-position: center bottom; }
.c-owner-thumb { opacity: 0; animation: c-owner-thumb 7s ease-in-out infinite; }
.c-owner-crossed { animation: c-owner-crossed 7s ease-in-out infinite; }
@keyframes c-owner-thumb { 0%, 37%, 100% { opacity: 0; } 47%, 86% { opacity: 1; } }
@keyframes c-owner-crossed { 0%, 37%, 100% { opacity: 1; } 47%, 86% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  .c-owner-cycle img { animation: none; }
}

/* Revision: C background matches the pale grey status/header area. */
body.type-c, body.type-c #app, body.type-c .c-main { background-color: #f5f7f7 !important; }
/* Keep a blue gradient, with its dominant hue aligned to the D home sky. */
body.type-c .c-total { background: linear-gradient(112deg, #13b9ed 0%, #00ace8 57%, #008bd4 100%); }