/* Shared mobile visual rhythm; keeps the existing blue brand and page structure. */
:root{--ink:#172c49;--muted:#63748a;--line:#e3eaf3;--radius:16px;font-family:Arial,"Noto Sans",sans-serif}
body{background:#edf2f8}h1,h2,h3,.balance{font-family:Arial,"Noto Sans",sans-serif;letter-spacing:-.35px}
.flow-shell{background:#f5f7fb}.flow-header{height:72px;padding:12px 18px;background:#003b95;gap:10px;box-shadow:none}.flow-header h1{font-size:17px;line-height:1.3;font-weight:600;letter-spacing:-.2px}.flow-back{border:0;background:#ffffff0c;width:36px;height:36px}.language-trigger{border-color:#ffffff28;background:#ffffff0b;min-height:36px}
.main.flow-content{padding:22px 18px 30px}.with-bottom-nav .flow-content{padding-bottom:calc(100px + env(safe-area-inset-bottom,0px))}
.btn{border-radius:10px;font-size:14px;font-weight:600;min-height:46px;box-shadow:none}.btn:disabled{opacity:.6}.btn:focus-visible,a:focus-visible,button:focus-visible{outline:3px solid #76a9ed;outline-offset:3px}
.flow-bottom-nav{padding:7px 12px calc(7px + env(safe-area-inset-bottom,0px));border-color:#e1e8f2;box-shadow:0 -3px 16px #1b3e6807}.flow-bottom-nav a{min-height:50px;font-size:11px;font-weight:500;gap:4px;color:#65748a;border-radius:11px}.flow-bottom-nav a.is-active{font-weight:700;background:#edf4ff}.flow-bottom-nav .icon{width:21px;height:21px}
/* Personal details retain the reference's simple white, divided rows. */
.registration{background:#fff;border:1px solid #e4eaf2;border-radius:16px;padding:20px 18px}.personal-lead{font-size:13px;line-height:1.7;color:#65748a;margin-bottom:16px}.registration .field{padding:13px 0 12px;gap:7px;font-size:12px;font-weight:600;color:#53647b;border-color:#e5ebf2}.registration .field input,.registration .field select{min-height:37px;height:37px;font-size:15px;font-weight:400;color:#172c49;outline-offset:2px}.registration .field input::placeholder{font-size:14px;color:#7b8798}.registration .field input:focus,.registration .field select:focus{border-bottom:2px solid #0064cf}.registration .field small{font-size:11px;font-weight:400;line-height:1.5;color:#63748a}.registration .birth-selects{gap:10px}.registration .birth-selects select{font-size:13px}.registration h3{font-size:17px;color:#172c49;font-weight:700}.registration .form-divider{border:0;border-top:1px solid #e4eaf2;margin:24px 0}.registration .section-description,.registration .email-help{font-size:12px;line-height:1.65;color:#63748a}.registration .form-end p{font-size:11px}.registration .form-end{margin-top:22px}.registration .form-end .btn{min-height:48px}
/* Balance card remains the reference asset; supporting numbers are quieter. */
.rewards-page .reference-card{border-radius:16px;box-shadow:0 8px 20px #003b9518}.reference-card .card-title{font-size:21px;letter-spacing:-.6px}.reference-card .card-live-balance{inset-inline-end:21px}.reference-card .balance-label{font-size:11px}.rewards-page .reference-card .balance{font-size:37px}.point-summary{margin:14px 0 22px;padding:14px 6px;background:#fff;border:1px solid #e3eaf3;border-radius:12px}.point-summary span{font-size:12px;color:#63748a}.point-summary b{font-size:21px;margin-top:5px;color:#203a60}.point-summary>div+div{border-color:#e5ebf2}
.rewards-page .calendar-panel{padding:18px 16px;border:1px solid #e1e8f2;border-radius:16px;background:#fff}.rewards-page .calendar-panel h2{font-size:18px;color:#172c49}.panel-heading p{font-size:12px;line-height:1.5;color:#63748a}.badge{font-size:10px;padding:6px 8px;background:#edf8f2;color:#27684c}.rewards-page .calendar-title{margin:20px 0 13px}.calendar-title b{font-size:13px}.week{color:#6f7c8f;font-size:11px}.rewards-page .day{height:36px;font-size:13px;border-radius:9px}.day:disabled{opacity:1;color:#8390a1}.day.past{color:#8390a1}.day.today{color:#003b95;background:#e6f0ff;border:1px solid #a9c8f4}.day.checked{background:#eaf6ee;color:#22724d}.day small{font-size:8px}.rewards-page .calendar-bottom{margin-top:14px;padding-top:14px;align-items:center;border-color:#e5ebf2}.rewards-page .calendar-bottom p{font-size:11px;line-height:1.5}.rewards-page .calendar-bottom .btn{font-size:12px;padding:11px 14px;min-height:42px}
.formal-wheel-entry{margin-top:20px!important;background:#fff!important;border:1px solid #dce6f2!important;border-radius:16px!important;padding:20px!important;min-height:0!important}.formal-wheel-entry h3{font-size:18px!important}.formal-wheel-entry p{font-size:12px!important;color:#63748a!important}.formal-wheel-entry .btn{margin-top:15px!important;font-size:14px}.voucher-page-entry{margin-top:14px;padding:16px;background:#fff;border-radius:14px;gap:12px}.voucher-page-entry b{font-size:15px}.voucher-page-entry small{font-size:12px;color:#63748a}.voucher-entry-icon{background:#edf4ff}
/* Voucher pages share the same card and type scale. */
.voucher-tabs{margin:-22px -18px 22px;padding:12px 18px;gap:4px;background:#fff;border-bottom:1px solid #e2e9f2}.voucher-tabs button{min-height:45px;padding:10px 8px;border:0;border-radius:9px;font-size:12px;color:#617087}.voucher-tabs button.active{background:#003b95;color:#fff}.vouchers-page .section-head{margin:0 0 18px}.rewards-page .section-head h2{font-size:18px}.rewards-page .section-head p{font-size:12px;color:#63748a}.voucher{border-color:#dfe7f1;border-radius:13px;background:#fff;grid-template-columns:minmax(0,1fr) 65px}.voucher-main{padding:16px 14px}.voucher-heading{gap:9px}.voucher-heading h3{font-size:15px;line-height:1.35}.voucher-heading .icon{width:22px;height:22px;opacity:.8}.voucher-main>p{font-size:12px;color:#63748a;line-height:1.55;margin:10px 0 14px}.voucher dl>div{font-size:11px;line-height:1.6;margin-top:6px}.voucher dt{color:#63748a}.voucher dd{color:#334f70}.voucher-tail{background:#eef4fc;border-color:#d6e1f0}.voucher-tail label{font-size:11px;color:#536b88}.voucher-tail select{height:40px;font-size:14px}.voucher-terms{font-size:11px;margin-top:13px}.voucher-terms summary{color:#506886;min-height:27px;line-height:1.6}.redemption-summary{padding:17px;background:#fff;border:1px solid #dfe7f1;border-radius:13px;font-size:12px}.redemption-summary>p{font-size:12px;color:#63748a}.owned-voucher{border-radius:13px;box-shadow:none;padding:14px;gap:13px}.owned-voucher-copy strong{font-size:15px}.owned-voucher-copy small{font-size:11px;color:#63748a}.voucher-status{font-size:11px}.voucher-empty{background:#fff;border:1px solid #e1e8f2;border-radius:16px;padding:44px 20px}.voucher-empty p{font-size:13px;color:#63748a}
/* Wheel proportions retained; strengthen the supporting copy. */
.polished-wheel .wheel-stage{padding:24px 12px 22px;border-radius:16px;background:#fff;border-color:#dfe7f1}.polished-wheel .wheel-stage-title h2{font-size:25px}.polished-wheel .wheel-stage-title>span{color:#58708e;font-size:9px}.polished-wheel .wheel-stage-title p{font-size:12px;color:#63748a}.polished-wheel .wheel-outer{margin:24px auto 20px}.wheel-availability{font-size:12px;padding:9px 13px}.polished-wheel .prize-panel{background:transparent;padding:0 2px}.prize-section-title h2{font-size:18px}.polished-wheel .prize-row{padding:14px 0;border-color:#dfe7f1}.polished-wheel .prize-row b{font-size:13px}.polished-wheel .prize-row small{font-size:12px;color:#63748a;line-height:1.5}.polished-wheel .rules{font-size:12px;color:#63748a;line-height:1.7}.polished-wheel .wheel-stage>.wheel-next-day{font-size:11px;color:#63748a}.prize-symbol{background:#e9f0fb;border:0}
/* Modal sizing, close targets, toast clearance and right-to-left support. */
dialog{border-radius:20px;max-height:calc(100dvh - 40px);padding:26px 22px;max-width:calc(100vw - 32px)}.modal-close{width:36px;height:36px;display:grid;place-items:center;right:auto;inset-inline-end:12px;top:12px}.modal-content h2{font-size:22px}.modal-content p{font-size:13px;color:#63748a}.modal-form .field{font-size:12px;line-height:1.6}.modal-form input{min-height:44px}.language-option{min-height:52px}.rules-dialog li{font-size:13px;color:#53647b}.rules-dialog dd{font-size:13px}#toast{bottom:calc(86px + env(safe-area-inset-bottom,0px));font-size:12px;max-width:calc(100vw - 40px)}[dir=rtl] .owned-voucher> .icon,[dir=rtl] .voucher-page-entry> .icon{transform:rotate(180deg)}
@media(max-width:360px){.flow-header{padding-inline:13px;gap:5px}.flow-header h1{font-size:15px}.main.flow-content{padding-inline:14px}.registration{padding:18px 14px}.voucher-tabs{margin-inline:-14px;padding-inline:14px}.reference-card .card-title{font-size:19px}.rewards-page .reference-card .balance{font-size:32px}.rewards-page .calendar-panel{padding:16px 12px}.calendar-panel .badge{font-size:9px}.flow-bottom-nav a{font-size:10px}.voucher-heading h3{font-size:14px}.voucher-main{padding:14px 12px}.voucher{grid-template-columns:minmax(0,1fr) 57px}}
@media(prefers-reduced-motion:reduce){.fade-in{animation:none}}
.calendar-panel .badge{white-space:nowrap;flex-shrink:0}.calendar-panel .panel-heading{align-items:flex-start;gap:10px}.calendar-panel .panel-heading>div{min-width:0}.calendar-panel .panel-heading p{margin-top:6px}.language-dialog-icon .icon{opacity:.7}
.flow-header{grid-template-columns:36px minmax(0,1fr) max-content}.flow-header .language-trigger{width:max-content;min-width:98px;max-width:134px}.language-trigger>span:not(.language-chevron){flex-shrink:0}.language-chevron{flex-shrink:0}
@media(max-width:360px){.flow-header .language-trigger{min-width:94px;max-width:124px}}

/* Account API phase: long member identifiers and admin fields fit narrow screens. */
.card-number { overflow-wrap: anywhere; }
.admin-profile-row dd { min-width: 0; overflow-wrap: anywhere; }
.flow-header .language { max-width: 118px; }
select.language { display:block; color:#fff; background:#003b95; border:1px solid #ffffff50; border-radius:18px; padding:8px; font-size:12px; min-height:38px; }
select.language option { color:#142741; background:#fff; }
.reference-card .card-number { font-size:11px; letter-spacing:.2px; }
.points-history .admin-profile-row { display:flex; justify-content:space-between; gap:12px; }
.points-pagination { display:flex; flex-direction:row; align-items:center; justify-content:space-between; gap:10px; margin-top:18px; }
.points-pagination .btn { min-width:0; padding:10px; font-size:12px; flex:1; }

/* Server rewards: reuse existing wheel and voucher styling. */
.reward-paragraph { margin:14px 0; font-size:13px; line-height:1.7; color:#63748a; overflow-wrap:anywhere; }
.reward-terms { margin:16px 0; font-size:12px; line-height:1.7; overflow-wrap:anywhere; }
.reward-terms summary, .issued-voucher summary { cursor:pointer; color:#174d95; min-height:32px; }
.reward-terms p, .issued-voucher p { margin:10px 0; white-space:pre-wrap; overflow-wrap:anywhere; }
.reward-history .btn { margin-top:14px; }
.reward-history h2, .reward-vouchers h2 { margin-bottom:16px; }
.reward-vouchers { margin-top:28px; }
.issued-voucher { margin:14px 0; font-size:13px; line-height:1.7; }
.voucher-code { font-family:monospace; background:#edf4ff; padding:12px; border-radius:8px; color:#174d95; overflow-wrap:anywhere; }
#reward-settings .field, .admin-request .field { display:flex; flex-direction:column; gap:8px; margin:14px 0; font-size:13px; }
#reward-settings input:not([type=checkbox]), #reward-settings textarea, .admin-request input, .admin-request textarea { width:100%; min-width:0; border:1px solid #d4e0f0; border-radius:8px; padding:12px; font:inherit; background:white; color:#142741; }
#reward-settings textarea, .admin-request textarea { min-height:86px; resize:vertical; }
#reward-settings fieldset, .admin-request fieldset { min-width:0; border:1px solid #e3eaf3; border-radius:10px; padding:12px; margin-top:18px; }
#reward-settings .btn, #redemption-form>.btn, .confirmation .btn { margin-top:16px; }
.admin-request { margin-top:24px; padding-top:20px; border-top:1px solid #e3eaf3; overflow-wrap:anywhere; }
.admin-request h3 { font-size:14px; }
.review-actions { flex-wrap:wrap; }
.confirmation { margin-top:18px; line-height:1.8; }
.wheel-hub>span { max-width:100%; font-size:10px; white-space:normal; }
/* Keep the rotated square's transparent corners inside the wheel stage. */
.polished-wheel .wheel-stage { overflow:clip; }

/* Read-only administrator member details. */
dialog.member-details-dialog { width:680px; max-width:calc(100vw - 28px); text-align:start; }
.member-detail-heading { padding:0 26px 18px 0; border-bottom:1px solid #e5ebf4; }
.member-detail-heading h2 { margin:12px 0 7px; overflow-wrap:anywhere; }
.member-detail-heading p { overflow-wrap:anywhere; }
.member-details section { margin-top:24px; }
.member-details h3 { margin-bottom:12px; color:#17365b; font-size:15px; }
.member-details h3 small { font-size:11px; font-weight:400; margin-inline-start:6px; }
.member-info-grid { display:grid; grid-template-columns:1fr 1fr; gap:0 20px; margin:0; }
.member-info-grid>div { padding:11px 0; border-bottom:1px solid #edf1f7; min-width:0; }
.member-info-grid dt { font-size:11px; color:#718096; margin-bottom:6px; }
.member-info-grid dd { margin:0; font-size:13px; line-height:1.6; overflow-wrap:anywhere; }
.member-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:18px; }
.member-stats>div { background:#f0f5fd; border-radius:10px; padding:12px 8px; text-align:center; }
.member-stats span { display:block; font-size:11px; color:#61758f; }
.member-stats b { display:block; font-size:20px; color:#06469f; margin-top:7px; }
.member-activity-counts { grid-template-columns:repeat(4,minmax(0,1fr)); }
.member-table-scroll { overflow-x:auto; }
.member-activity { border-collapse:collapse; width:100%; font-size:12px; line-height:1.6; text-align:start; }
.member-activity th { color:#6f8097; font-weight:500; background:#f6f8fc; }
.member-activity th,.member-activity td { padding:10px 8px; border-bottom:1px solid #edf1f7; vertical-align:top; }
.member-activity td { color:#243b59; }
.member-activity .member-empty { text-align:center; color:#8a97a9; padding:18px; }
.member-checkins { display:flex; flex-wrap:wrap; gap:7px; }
.member-checkins span { background:#edf6f2; color:#267758; border-radius:6px; padding:5px 8px; font-size:11px; }
@media(max-width:380px) { .member-info-grid { grid-template-columns:1fr; } .member-activity-counts { grid-template-columns:repeat(2,minmax(0,1fr)); } }

/* Administrator member search stays separate from customer registration. */
.member-filters { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:18px 0; padding:16px; background:#f5f8fd; border:1px solid #e3ebf6; border-radius:12px; }
.member-filters label { display:flex; flex-direction:column; gap:7px; min-width:0; font-size:12px; color:#526982; }
.member-filters input,.member-filters select { width:100%; min-width:0; border:1px solid #cedced; border-radius:8px; padding:10px; color:#17365b; background:white; font:inherit; min-height:42px; }
.member-filter-query,.member-filter-actions,.member-filter-note { grid-column:1/-1; }
.member-filter-actions { display:flex; gap:10px; }
.member-filter-actions .btn { flex:1; min-width:0; }
.member-filter-note { color:#61758d; font-size:11px; line-height:1.5; min-height:0; }
.member-filter-note:empty { display:none; }