/* Hallmark · macrostructure: Stat-Led · genre: editorial · theme: existing SST · audience: international card collectors and businesses · use: understand rewards and preview referral · nav: N1 (two in-page destinations) · footer: Ft1 · enrichment: native product gallery with original SST listing photos · motion: press only · pre-emit critique: P4 H5 E4 S5 R5 V4 */
*,*::before,*::after{box-sizing:border-box}
html{overflow-x:clip;scroll-padding-top:var(--sst-space-6);scrollbar-gutter:stable}
body{margin:0;overflow-x:clip;background:var(--sst-color-paper);color:var(--sst-color-ink);font-family:var(--sst-font-body);font-size:var(--sst-text-base);line-height:1.65;-webkit-font-smoothing:antialiased}
button,a,summary{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
button{font:inherit;cursor:pointer;border:0}
a{color:inherit;text-decoration:none}
button,a.sst-button,.sst-text-link,.sst-nav a{white-space:nowrap}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--sst-color-focus);outline-offset:4px}
button:disabled{opacity:.55;cursor:not-allowed}
button:not(:disabled):active,.sst-button:active{transform:translateY(1px)}
img{display:block;max-width:100%;height:auto}
h1,h2,h3,p,figure{margin:0}
h1,h2,h3{font-family:var(--sst-font-display);font-weight:700;overflow-wrap:anywhere;min-width:0}
h2{font-size:var(--sst-text-xl);line-height:1.18;letter-spacing:-.035em;text-wrap:balance}
h3{font-size:var(--sst-text-lg);line-height:1.3;letter-spacing:-.015em}
p{overflow-wrap:break-word}
[hidden]{display:none!important}
.sst-shell{width:100%;max-width:var(--sst-content-max);margin-inline:auto;padding-inline:var(--sst-gutter)}
.sst-icon-library{position:absolute;width:0;height:0;overflow:hidden}
.sst-icon{width:1.25rem;height:1.25rem;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.sst-skip{position:fixed;top:-10rem;left:var(--sst-space-4);z-index:30;padding:var(--sst-space-3) var(--sst-space-4);background:var(--sst-color-white);color:var(--sst-color-ink)}
.sst-skip:focus{top:var(--sst-space-2)}
.sst-draft-bar{background:var(--sst-color-ink);color:var(--sst-color-paper);font-size:var(--sst-text-xs)}
.sst-draft-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--sst-space-2);min-height:2.75rem}
.sst-draft-inner p{display:flex;align-items:center;gap:var(--sst-space-2)}
.sst-status-dot{width:.375rem;height:.375rem;border:1px solid currentColor;border-radius:50%;flex-shrink:0}
.sst-review-trigger{min-height:2.75rem;padding:0;background:transparent;color:inherit;font-size:inherit;text-decoration:underline;text-underline-offset:2px}
.sst-draft-bar :focus-visible{outline-color:var(--sst-color-white)}
.sst-site-header{display:flex;align-items:center;gap:var(--sst-space-6);padding-block:var(--sst-space-4)}
.sst-brand{display:inline-flex;align-items:center;min-height:3rem}
.sst-brand img{width:9rem}
.sst-nav{display:none;align-items:center;gap:var(--sst-space-6);margin-inline-start:auto;font-size:var(--sst-text-sm)}
.sst-nav a{display:inline-flex;align-items:center;justify-content:center;min-height:2.75rem;min-width:2.75rem}
.sst-language{display:flex;align-items:center;gap:var(--sst-space-1);font-size:var(--sst-text-sm);color:var(--sst-color-muted);margin-inline-start:auto}
.sst-language button{min-height:2.75rem;min-width:2.75rem;background:transparent;color:inherit;padding:var(--sst-space-1)}
.sst-language button[aria-pressed=true]{color:var(--sst-color-ink);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.sst-hero{display:grid;gap:var(--sst-space-6);padding-block:var(--sst-space-6) var(--sst-space-10)}
.sst-program-name{font-size:var(--sst-text-sm);font-weight:600;line-height:1.4;margin-bottom:var(--sst-space-4)}
h1{font-size:var(--sst-text-referral-hero);line-height:1.12;letter-spacing:-.045em}
h1>span{display:block}
h1 strong{font-weight:700;font-variant-numeric:tabular-nums}
.sst-accent-text{color:var(--sst-color-accent)}
.sst-hero-lede{font-size:var(--sst-text-base);line-height:1.7;color:var(--sst-color-muted);max-width:33rem;margin-top:var(--sst-space-5);text-wrap:pretty}
.sst-hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:var(--sst-space-2) var(--sst-space-5);margin-top:var(--sst-space-5)}
.sst-button{display:inline-flex;align-items:center;justify-content:center;gap:var(--sst-space-4);min-height:3.125rem;padding:var(--sst-space-3) var(--sst-space-5);border-radius:var(--sst-radius);font-size:var(--sst-text-sm);font-weight:600;line-height:1.35;transition:transform var(--sst-duration-press) var(--sst-ease-out)}
.sst-button-primary{background:var(--sst-color-accent);color:var(--sst-color-accent-ink)}
.sst-text-link{display:inline-flex;align-items:center;gap:var(--sst-space-2);min-height:2.75rem;min-width:2.75rem;padding:var(--sst-space-2) 0;background:transparent;color:var(--sst-color-ink);font-size:var(--sst-text-sm);font-weight:600;text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px}
.sst-hero-status{font-size:var(--sst-text-xs);color:var(--sst-color-muted);margin-top:var(--sst-space-3);max-width:32rem}
.sst-use-note{display:flex;align-items:flex-start;gap:var(--sst-space-2);font-size:var(--sst-text-xs);color:var(--sst-color-muted);margin-top:var(--sst-space-5);max-width:32rem}
.sst-use-note .sst-icon{width:1rem;height:1rem;margin-top:var(--sst-space-1);color:var(--sst-color-accent)}
.sst-referral-visual{min-width:0;align-self:center;background:var(--sst-color-soft);color:var(--sst-color-ink);padding:var(--sst-space-4) var(--sst-space-4) var(--sst-space-5);border-radius:var(--sst-radius-card)}
.sst-stage-illustration{width:100%;height:auto;max-width:30rem;margin-inline:auto}
.sst-referral-visual figcaption{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sst-space-5);font-size:var(--sst-text-xs);font-weight:600;line-height:1.5;text-align:center}
.sst-referral-visual.sst-campaign-visual{padding:0;background:transparent;max-width:28rem;width:100%;justify-self:center}
.sst-campaign-visual .sst-stage-illustration{border-radius:var(--sst-radius-card)}
.sst-referral-visual.sst-campaign-visual figcaption{display:block;color:var(--sst-color-muted);font-weight:400;padding-top:var(--sst-space-3)}
.sst-business-prompt{display:grid;gap:var(--sst-space-2);border-block:1px solid var(--sst-color-rule);padding-block:var(--sst-space-5)}
.sst-business-prompt h2{font-size:var(--sst-text-md);line-height:1.4;letter-spacing:-.015em}
.sst-business-prompt p{font-size:var(--sst-text-sm);color:var(--sst-color-muted);max-width:43rem;margin-top:var(--sst-space-1)}
.sst-business-prompt .sst-text-link{justify-self:start;color:var(--sst-color-accent)}
.sst-section{padding-block:var(--sst-space-12)}
.sst-section-header{display:grid;gap:var(--sst-space-5);margin-bottom:var(--sst-space-8)}
.sst-section-header p,.sst-rewards-head p,.sst-faq-heading p,.sst-availability-heading>p{font-size:var(--sst-text-sm);color:var(--sst-color-muted);margin-top:var(--sst-space-4);max-width:35rem}
.sst-role-selector{display:flex;flex-wrap:wrap;gap:var(--sst-space-5);align-self:end}
.sst-role-selector button{padding:var(--sst-space-2) 0;min-height:2.75rem;border-bottom:2px solid transparent;background:transparent;color:var(--sst-color-muted);font-size:var(--sst-text-sm)}
.sst-role-selector button[aria-pressed=true]{border-color:var(--sst-color-accent);color:var(--sst-color-accent);font-weight:600}
.sst-steps{list-style:none;padding:0;margin:0;display:grid;gap:var(--sst-space-6)}
.sst-steps li{display:grid;grid-template-columns:2rem minmax(0,1fr);gap:var(--sst-space-4)}
.sst-step-count{font-family:var(--sst-font-display);font-weight:500;font-size:var(--sst-text-md);font-variant-numeric:tabular-nums;color:var(--sst-color-accent);line-height:1.3;padding-top:var(--sst-space-1)}
.sst-steps h3{font-size:var(--sst-text-md)}
.sst-steps p{font-size:var(--sst-text-sm);color:var(--sst-color-muted);margin-top:var(--sst-space-2);max-width:36rem}
.sst-workflow-note{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--sst-space-2) var(--sst-space-6);margin-top:var(--sst-space-6)}
.sst-workflow-note>span{font-size:var(--sst-text-xs);color:var(--sst-color-muted)}
.sst-rewards-section{background:var(--sst-color-soft);color:var(--sst-color-ink)}
.sst-rewards-head{display:grid;gap:var(--sst-space-2);margin-bottom:var(--sst-space-6)}
.sst-comparison{width:100%;border-collapse:collapse;text-align:left}
.sst-comparison th{font-weight:400}
.sst-comparison thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.sst-comparison tbody{display:block}
.sst-comparison tbody tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sst-space-4);padding-block:var(--sst-space-5);border-top:1px solid var(--sst-color-rule-strong)}
.sst-comparison tbody th{grid-column:1/-1;min-width:0}
.sst-tier-name{display:block;font-family:var(--sst-font-display);font-size:var(--sst-text-md);font-weight:700;line-height:1.4}
.sst-tier-description{display:block;font-size:var(--sst-text-sm);color:var(--sst-color-muted);margin-top:var(--sst-space-1)}
.sst-comparison td{white-space:nowrap;min-width:0}
.sst-comparison strong{font-family:var(--sst-font-display);font-size:clamp(2rem,3.7vw,3rem);line-height:1.2;letter-spacing:-.045em;font-variant-numeric:tabular-nums}
.sst-table-unit{font-size:var(--sst-text-sm);margin-inline-start:var(--sst-space-2)}
.sst-mobile-label{display:block;font-size:var(--sst-text-xs);color:var(--sst-color-muted);margin-bottom:var(--sst-space-2)}
.sst-business-row strong{color:var(--sst-color-accent)}
.sst-business-note,.sst-value-note{font-size:var(--sst-text-xs);max-width:60rem;color:var(--sst-color-muted)}
.sst-business-note{border-top:1px solid var(--sst-color-rule-strong);padding-top:var(--sst-space-4)}
.sst-value-note{margin-top:var(--sst-space-3)}
.sst-availability{display:grid;gap:var(--sst-space-6)}
.sst-draft-label{display:inline-block;font-size:var(--sst-text-xs);color:var(--sst-color-accent);font-weight:600}
.sst-availability-heading .sst-draft-label{margin-top:var(--sst-space-4)}
.sst-release-plan{display:grid;gap:var(--sst-space-6)}
.sst-release-status{display:block;font-size:var(--sst-text-xs);color:var(--sst-color-muted);margin-bottom:var(--sst-space-2)}
.sst-release-item h3{font-size:var(--sst-text-md)}
.sst-release-item p{font-size:var(--sst-text-sm);color:var(--sst-color-muted);margin-top:var(--sst-space-2)}
.sst-release-ready{padding-top:var(--sst-space-6);border-top:1px solid var(--sst-color-rule)}
.sst-release-ready .sst-release-status{color:var(--sst-color-accent);font-weight:600}
.sst-cancellation-note{border-top:1px solid var(--sst-color-rule);padding-top:var(--sst-space-4);font-size:var(--sst-text-xs);color:var(--sst-color-muted)}
.sst-faq-section{display:grid;gap:var(--sst-space-6);padding-top:var(--sst-space-6)}
.sst-faq-list details{border-top:1px solid var(--sst-color-rule)}
.sst-faq-list details:last-child{border-bottom:1px solid var(--sst-color-rule)}
.sst-faq-list summary{font-size:var(--sst-text-sm);font-weight:600;list-style:none;padding:var(--sst-space-5) var(--sst-space-8) var(--sst-space-5) 0;position:relative;cursor:pointer;min-height:3.75rem}
.sst-faq-list summary::-webkit-details-marker{display:none}
.sst-faq-list summary::after{content:'+';font-weight:400;position:absolute;right:0;top:var(--sst-space-4);font-size:var(--sst-text-lg)}
.sst-faq-list details[open] summary::after{content:'−'}
.sst-faq-list details p{font-size:var(--sst-text-sm);color:var(--sst-color-muted);padding-bottom:var(--sst-space-5);max-width:45rem}
.sst-closing{display:grid;gap:var(--sst-space-6);padding-block:var(--sst-space-8) var(--sst-space-12)}
.sst-closing h2{font-size:var(--sst-text-xl)}
.sst-closing p{font-size:var(--sst-text-sm);color:var(--sst-color-muted);margin-top:var(--sst-space-3)}
.sst-closing .sst-button{justify-self:start}
.sst-footer{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--sst-space-6);padding-block:var(--sst-space-8) var(--sst-space-24);border-top:1px solid var(--sst-color-rule)}
.sst-footer img{width:8rem}
.sst-footer p{font-size:var(--sst-text-xs);color:var(--sst-color-muted);margin-top:var(--sst-space-3)}
.sst-footer-links{display:flex;align-items:center;flex-wrap:wrap;gap:var(--sst-space-2) var(--sst-space-6)}
.sst-mobile-bar{position:fixed;z-index:10;inset:auto 0 0;display:flex;align-items:center;justify-content:space-between;gap:var(--sst-space-3);padding:var(--sst-space-3) var(--sst-gutter);padding-bottom:max(var(--sst-space-3),env(safe-area-inset-bottom));border-top:1px solid var(--sst-color-rule);background:var(--sst-color-paper);color:var(--sst-color-ink)}
.sst-mobile-bar>span{font-size:var(--sst-text-xs);font-weight:600}
.sst-mobile-bar .sst-button{min-height:2.75rem;padding:var(--sst-space-3) var(--sst-space-4)}
.sst-dialog{width:min(38rem,calc(100% - 2rem));max-height:calc(100dvh - 2rem);padding:var(--sst-space-6);border:1px solid var(--sst-color-rule);border-radius:var(--sst-radius-card);background:var(--sst-color-paper);color:var(--sst-color-ink)}
.sst-dialog::backdrop{background:var(--sst-color-backdrop)}
.sst-dialog-open{overflow-y:hidden}
.sst-dialog-top{display:flex;align-items:center;justify-content:space-between;gap:var(--sst-space-4);margin-bottom:var(--sst-space-5)}
.sst-dialog-label{font-size:var(--sst-text-xs);color:var(--sst-color-muted)}
.sst-icon-button{width:2.75rem;height:2.75rem;display:grid;place-items:center;background:transparent;color:var(--sst-color-ink);flex-shrink:0}
.sst-dialog h2{font-size:var(--sst-text-xl)}
.sst-dialog>p{font-size:var(--sst-text-sm);color:var(--sst-color-muted);margin-top:var(--sst-space-4)}
.sst-dialog>.sst-button{margin-top:var(--sst-space-6)}
.sst-invite-preview{display:flex;align-items:center;gap:var(--sst-space-4);border-block:1px solid var(--sst-color-rule);padding-block:var(--sst-space-5);margin-top:var(--sst-space-6)}
.sst-invite-preview>.sst-icon{color:var(--sst-color-accent)}
.sst-invite-preview strong{font-size:var(--sst-text-sm)}
.sst-invite-preview p{font-size:var(--sst-text-xs);color:var(--sst-color-muted);margin-top:var(--sst-space-1)}
.sst-review-dialog{width:min(46rem,calc(100% - 2rem))}
.sst-review-dialog h3{font-size:var(--sst-text-md);margin-top:var(--sst-space-6)}
.sst-review-dialog ul{padding-inline-start:var(--sst-space-5);margin-block:var(--sst-space-3) 0;font-size:var(--sst-text-sm);color:var(--sst-color-muted)}
.sst-review-dialog li+li{margin-top:var(--sst-space-2)}
.sst-review-bottom{border-top:1px solid var(--sst-color-rule);padding-top:var(--sst-space-4)}
.sst-noscript{padding:var(--sst-space-6);color:var(--sst-color-accent)}
html[lang=ja] h1{font-size:var(--sst-text-referral-hero-ja);line-height:1.3;letter-spacing:-.045em}
html[lang=ja] h2{line-height:1.35;letter-spacing:-.025em}
html[lang=ja] .sst-hero-lede{line-height:1.85}
@media(hover:hover) and (pointer:fine){
  .sst-button-primary:hover{background:var(--sst-color-accent-dark);color:var(--sst-color-accent-ink)}
  .sst-text-link:hover,.sst-role-selector button:hover,.sst-language button:hover,.sst-nav a:hover,.sst-faq-list summary:hover{color:var(--sst-color-accent)}
}
@media(min-width:40rem){
  .sst-nav{display:flex}
  .sst-language{margin-inline-start:var(--sst-space-4)}
  .sst-site-header{padding-block:var(--sst-space-5)}
  .sst-brand img{width:10rem}
  .sst-hero{gap:var(--sst-space-8);padding-block:var(--sst-space-8) var(--sst-space-12)}
  .sst-referral-visual{max-width:34rem;width:100%;justify-self:center;padding:var(--sst-space-6)}
  .sst-section{padding-block:var(--sst-space-16)}
  .sst-business-prompt{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:var(--sst-space-8)}
  .sst-section-header{grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:var(--sst-space-8)}
  .sst-comparison thead{position:static;width:auto;height:auto;clip-path:none;overflow:visible}
  .sst-comparison thead th{font-size:var(--sst-text-xs);color:var(--sst-color-muted);padding-bottom:var(--sst-space-4)}
  .sst-comparison tbody{display:table-row-group}
  .sst-comparison tbody tr{display:table-row}
  .sst-comparison tbody th{width:48%;padding:var(--sst-space-6) var(--sst-space-6) var(--sst-space-6) 0}
  .sst-comparison td{width:26%;padding-block:var(--sst-space-6)}
  .sst-mobile-label{display:none}
  .sst-dialog{padding:var(--sst-space-8)}
  .sst-release-plan{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sst-space-8)}
  .sst-release-ready{padding-top:0;padding-inline-start:var(--sst-space-8);border-top:0;border-inline-start:1px solid var(--sst-color-rule)}
  .sst-closing{grid-template-columns:minmax(0,1fr) auto;align-items:center}
}
@media(min-width:60rem){
  .sst-hero{grid-template-columns:minmax(0,1.18fr) minmax(0,1fr);gap:var(--sst-space-8) var(--sst-space-12);padding-block:var(--sst-space-10) var(--sst-space-16)}
  .sst-hero-copy{align-self:center}
  .sst-hero-lede{font-size:var(--sst-text-md)}
  .sst-hero-actions{margin-top:var(--sst-space-6)}
  .sst-referral-visual{padding:var(--sst-space-6) var(--sst-space-4)}
  .sst-business-prompt{grid-column:1/-1;margin-top:var(--sst-space-4)}
  .sst-steps{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr) minmax(0,1.15fr);gap:var(--sst-space-8)}
  .sst-steps li{grid-template-columns:1fr;gap:var(--sst-space-3);align-content:start;min-height:12rem}
  .sst-steps li+li{padding-inline-start:var(--sst-space-8);border-inline-start:1px solid var(--sst-color-rule)}
  .sst-rewards-head{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:end;gap:var(--sst-space-12);margin-bottom:var(--sst-space-8)}
  .sst-rewards-head p{margin-top:0}
  .sst-availability{grid-template-columns:minmax(0,.85fr) minmax(0,1.4fr);gap:var(--sst-space-8) var(--sst-space-12)}
  .sst-cancellation-note{grid-column:2}
  .sst-faq-section{grid-template-columns:minmax(0,.85fr) minmax(0,1.4fr);gap:var(--sst-space-12);padding-top:var(--sst-space-6)}
  .sst-closing{padding-block:var(--sst-space-10) var(--sst-space-16)}
  .sst-footer{padding-bottom:var(--sst-space-8)}
  .sst-mobile-bar{display:none}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;transition-duration:0s!important;animation:none!important}
  button:not(:disabled):active,.sst-button:active{transform:none}
}