.referral-page{max-width:1080px}.referral-page h2{display:flex;align-items:center;gap:8px;font-size:22px}.referral-page h3{font-size:17px;margin:0 0 14px}.referral-page section{padding:24px 0;border-bottom:1px solid var(--line,#ddd)}.referral-share{display:grid;grid-template-columns:minmax(0,1fr) 256px;align-items:center;gap:40px}.referral-share .badge{margin-bottom:12px}.referral-code{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:18px}.referral-code code{font-size:20px;overflow-wrap:anywhere}.referral-share canvas{width:256px;height:256px;max-width:100%;image-rendering:pixelated;justify-self:center}.referral-page .field{min-width:0}.referral-page input,.referral-page textarea{box-sizing:border-box;max-width:100%;min-width:0}.referral-page input[data-referral-link]{font-size:14px;width:100%}.referral-page .button,.referral-page .icon-button{min-height:44px}.referral-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding:24px 0;border-bottom:1px solid var(--line,#ddd)}.referral-metrics span,.referral-metrics strong{display:block}.referral-metrics span{font-size:14px;color:#596266}.referral-metrics strong{font-size:24px;margin-top:8px}.referral-rules p{line-height:1.8;font-size:14px}.referral-settings form{display:grid;gap:16px}.referral-switches{display:grid;gap:0}.referral-switch{display:flex;justify-content:space-between;gap:16px;align-items:center;min-height:54px;border-bottom:1px solid var(--line,#ddd)}.referral-switch input{width:20px;height:20px;flex:0 0 auto;accent-color:var(--brand,#a42825)}.referral-page .check-row{display:flex;align-items:flex-start;gap:8px}.referral-page .check-row input{width:18px;height:18px;flex:0 0 auto}.referral-records article{display:flex;justify-content:space-between;gap:24px;padding:16px 0;border-top:1px solid var(--line,#ddd)}.referral-records p{font-size:14px;line-height:1.6;margin:6px 0}.referral-store-list>div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) 80px;gap:14px;padding:14px 0;border-top:1px solid var(--line,#ddd)}.referral-page code,.referral-page strong,.referral-page p{overflow-wrap:anywhere}.referral-registration{margin:24px 0}.referral-registration h2{font-size:18px}.referral-registration p{font-size:14px;line-height:1.7}.referral-code-field{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap}.referral-code-field .field{flex:1 1 240px;margin:0}.referral-code-field .button{min-height:44px}.referral-page :focus-visible,.referral-registration :focus-visible{outline:2px solid #276e98;outline-offset:3px}
@media(max-width:640px){.referral-share{grid-template-columns:1fr;gap:20px}.referral-share canvas{width:220px;height:220px}.referral-metrics{gap:10px}.referral-metrics strong{font-size:20px}.referral-metrics span{font-size:13px}.referral-code code{font-size:17px}.referral-records article{flex-direction:column;gap:4px}.referral-store-list>div{grid-template-columns:1fr}.referral-page h2{font-size:20px}.referral-code-field{align-items:stretch}.referral-code-field .field{flex-basis:100%}}
.referral-poster-preview{display:block;width:100%;max-width:256px;aspect-ratio:1080/1720;padding:0;border:1px solid var(--line,#ddd);border-radius:4px;overflow:hidden;background:#f6f6f7;justify-self:center;cursor:pointer;color:var(--muted,#666);font:inherit}.referral-poster-preview img{display:block;width:100%;height:auto}.referral-poster-preview span{display:block;padding:20px;font-size:14px}.referral-poster-dialog{width:min(600px,calc(100% - 24px));max-height:calc(100dvh - 24px);padding:0;border:0;border-radius:8px;color:var(--ink,#28282b);background:white;overflow:auto;overscroll-behavior:contain}.referral-poster-dialog::backdrop{background:#0008}.referral-poster-dialog header{position:sticky;top:0;z-index:1;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding:14px 16px;background:white;border-bottom:1px solid #ddd}.referral-poster-dialog h2{font-size:18px;margin:0}.referral-poster-dialog .action-list{gap:8px}.referral-poster-dialog .icon-button,.referral-poster-dialog .button{min-height:44px}.referral-poster-image{padding:16px;background:#f1f2f3}.referral-poster-image img{display:block;width:100%;height:auto;user-select:auto;-webkit-user-select:auto;-webkit-touch-callout:default}.referral-poster-dialog :focus-visible{outline:2px solid #276e98;outline-offset:3px}@media(max-width:640px){.referral-poster-preview{max-width:220px}.referral-poster-dialog header{padding:10px}.referral-poster-dialog h2{font-size:16px}.referral-poster-dialog .button{font-size:13px;padding-inline:10px}.referral-poster-image{padding:10px}}
