:root{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-synthesis:none;color:#193348;background:#0c1b30;--accent:#244a63;--muted:#3b536b;--border:#7493ae;--gold:#ddc38c;--surface:linear-gradient(150deg,#d3e5f5 0%,#c4dbee 52%,#b8d0e7 100%);--surface-hover:linear-gradient(150deg,#dcebf8 0%,#cce1f3 52%,#c0d8ee 100%);--surface-selected:linear-gradient(150deg,#d7eafa 0%,#c4ddf3 52%,#b3cfe9 100%)}
*{box-sizing:border-box}body{margin:0;min-height:100svh;background:linear-gradient(90deg,#07132255,transparent 70%),url('../assets/moonlight.webp') center/cover fixed no-repeat}
header{max-width:1220px;margin:auto;padding:22px 32px;display:flex;align-items:center;justify-content:space-between;gap:20px;color:#f7f3e7}.brand{color:inherit;font-size:24px;font-weight:600;letter-spacing:-.8px;text-decoration:none}.brand span{display:block;font-size:10px;font-weight:400;letter-spacing:.15px;margin-top:3px;color:#dedbd0}nav{display:flex;gap:25px}a{color:var(--accent);text-underline-offset:4px}nav a{color:inherit;font-size:13px;text-decoration:none;padding:8px 0;border-bottom:1px solid transparent}nav a[aria-current=page]{border-color:var(--gold)}
main{max-width:1080px;margin:auto;min-height:calc(100svh - 98px);padding:12px 32px 36px;display:flex;align-items:center}.panel{width:452px;max-width:100%;padding:28px 32px 20px;border:1px solid #c5ddf2;border-radius:20px;background:var(--surface);box-shadow:0 20px 60px #020b2052,inset 0 1px 0 #edf7ff80;backdrop-filter:blur(12px)}
h2{font-size:29px;line-height:1.2;letter-spacing:-.9px;font-weight:550;margin:0 0 8px}.intro{color:var(--muted);font-size:13px;line-height:1.5;margin:0 0 18px}.steps{display:flex;gap:18px;list-style:none;padding:0;margin:0 0 18px;font-size:10px;color:#3b536b}.steps .current{color:var(--accent);font-weight:600}.steps .done{color:#285e4c}
label{display:block;font-size:12px;font-weight:500;margin:12px 0 6px}input{appearance:none;background:#edf5fc;border:1px solid var(--border);border-radius:8px;padding:10px 12px;width:100%;font:inherit;font-size:14px;line-height:20px;color:inherit}input:focus{outline:2px solid #5a8daa;outline-offset:2px}.name-fields,.password-fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}.name-fields>div,.password-fields>div{min-width:0}.hint{font-size:11px;color:var(--muted);line-height:1.5;margin:7px 0}.delivery-status{margin:0 0 15px;padding:9px 11px;border:1px solid #7597b4;border-radius:8px;background:#c4dbee;color:#2c4d68}
.button,button{font:inherit;font-size:13px;font-weight:500;cursor:pointer;border-radius:8px;padding:10px 15px;background:transparent;color:var(--accent);border:1px solid var(--border);text-decoration:none;display:inline-block;text-align:center;transition:background .15s,border-color .15s}.button:hover,button:hover:not(:disabled){background:#bdd5e9}button.primary,.button.primary{background:var(--accent);border-color:var(--accent);color:#fff}button.primary:hover:not(:disabled),.button.primary:hover{background:#16364c}button:disabled{opacity:.5;cursor:default}button:focus-visible,a:focus-visible{outline:2px solid #7caaca;outline-offset:4px}.wide{display:block;width:100%;margin-top:18px}.actions{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-top:17px;font-size:12px}.text-button{border:0;padding:5px 0;background:none;font-size:12px}.account-details{margin:18px 0;border:1px solid var(--border);border-radius:10px;padding:3px 14px}.account-details>div{padding:10px 0;border-bottom:1px solid #93b0c9}.account-details>div:last-child{border:0}dt{font-size:10px;color:var(--muted);margin-bottom:4px}dd{margin:0;font-size:13px;overflow-wrap:anywhere}#usage-summary{font-size:12px;line-height:1.6;padding:13px;background:#acc8df;border-radius:8px;margin:15px 0}#admin-link{display:inline-block;font-size:12px;margin-bottom:12px}#notice,#error,#busy{font-size:12px;line-height:1.5;margin:12px 0 0}#error{color:#a42f3c}#notice:empty,#error:empty{display:none}footer{font-size:10px;text-align:center;color:var(--muted);padding-top:22px}.confirm-layout{display:block;max-width:440px;min-height:0;margin:14vh auto;padding:30px;background:var(--surface);border:1px solid #c5ddf2;border-radius:18px;box-shadow:0 20px 60px #020b2052,inset 0 1px 0 #edf7ff80}.confirm-layout h1{font-size:27px;letter-spacing:-.6px}.confirm-layout p{font-size:13px;line-height:1.6;color:var(--muted)}.confirm-icon{width:44px;height:44px;border-radius:11px}.confirm-layout .actions{align-items:stretch;flex-direction:column}
body.is-plans{background:radial-gradient(ellipse at 0% 0%,#635b78,transparent 80%),linear-gradient(135deg,#635b78,#302d3b)}.is-plans main{max-width:1220px;align-items:flex-start;padding-top:4px}.is-plans .panel{width:100%;padding:0;border:0;background:none;box-shadow:none;backdrop-filter:none;color:#f6f3eb}.is-plans h2{text-align:center;font-size:40px;margin:8px 0}.is-plans .intro{text-align:center;font-size:16px;color:#e1e2dd;margin-bottom:18px}.is-plans footer,.is-plans .terms,.is-plans #plan-identity,.is-plans .text-button{color:#e0e2df}.is-plans .steps{justify-content:center;color:#bac9d3}.is-plans .steps .current{color:#f0d8a4}.is-plans .delivery-status{max-width:680px;margin:0 auto 15px}.billing-cycles{display:flex;justify-content:center;gap:3px;width:fit-content;margin:0 auto 24px;padding:4px;border:1px solid #fff4;border-radius:11px;background:#302d3b99}.billing-cycles button{border:0;color:#eceae2;padding:9px 20px;border-radius:7px;font-size:12px}.billing-cycles button[aria-pressed=true]{background:#f4d799;color:#44331b}.billing-cycles button:hover:not(:disabled){background:#ffffff24}.billing-cycles button[aria-pressed=true]:hover{background:#ffe6b5}.plans{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;border:0;padding:0;margin:0;min-width:0}.plan-choice{position:relative;min-width:0}.plan-radio{position:absolute;width:1px;height:1px;opacity:0;padding:0;pointer-events:none}.plan-card{position:relative;height:100%;margin:0;padding:23px 23px 20px;border-radius:16px;border:2px solid #dcc8b98c;--muted:#fff1e5;background:linear-gradient(135deg,#a18b7d,#746155);color:#fff7ef;cursor:pointer;font-weight:400;box-shadow:0 8px 24px #020b2045,inset 0 1px 0 #d6e8f34d;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.plan-card:hover{background:linear-gradient(135deg,#aa9587,#7d695c);border-color:#ead9ca;box-shadow:0 12px 30px #020b2066,inset 0 1px 0 #e8f4ff66}.plan-radio:checked+.plan-card{z-index:1;border-color:#e9cf96;background:linear-gradient(135deg,#a18b7d,#746155);transform:translateY(-6px) scale(1.015);box-shadow:0 26px 55px #020b2099}.plan-radio:focus-visible+.plan-card{border-color:#f5deae}
.plan-radio:focus-visible+.plan-card .plan-name{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:2px}.plan-radio:disabled+.plan-card{cursor:wait}.plan-heading{display:flex;justify-content:space-between;align-items:center;gap:8px}.plan-card .plan-name{font-size:19px;font-weight:550;margin:0}.selection-mark{width:30px;height:30px;flex:0 0 30px;border:1px solid #fff1e566;border-radius:9px;display:inline-grid;place-items:center}.plan-radio:checked+.plan-card .selection-mark{background:linear-gradient(145deg,#4c9c76,#246b49);border-color:transparent;box-shadow:inset 0 1px 1px #c6f5d970,0 3px 5px #17332140}.plan-radio:checked+.plan-card .selection-mark:after{content:'';width:11px;height:6px;border:solid #fff;border-width:0 0 2px 2px;transform:translateY(-1px) rotate(-45deg)}.plan-description{color:var(--muted);font-size:11px;margin:7px 0 20px;min-height:17px}.price{color:#ffe3a2;font-size:38px;font-weight:500;letter-spacing:-1.5px;line-height:1.1}.price small{font-size:12px;letter-spacing:0;font-weight:400;color:var(--muted)}.billing-note{font-size:11px;color:var(--muted);margin:7px 0 19px;min-height:17px}.credit-allowance{font-size:14px;font-weight:550;margin:0 0 6px}.credit-description{font-size:11px;line-height:1.5;color:var(--muted);min-height:34px;margin:0 0 16px}.feature-list{padding:15px 0 0;margin:0;list-style:none;border-top:1px solid #dcc8b960}.feature-list li{display:flex;align-items:center;gap:9px;font-size:13px;line-height:1.4;padding:6px 0}.feature-list .included,.feature-list .excluded{color:#fff1e5}.feature-list .included .feature-icon{color:#ffe3a2}.feature-list .excluded .feature-icon{color:#941f2b}.plan-radio:checked+.plan-card .included .feature-icon{color:#ffe3a2}.plan-radio:checked+.plan-card .excluded .feature-icon{color:#b1363e}.feature-icon{width:20px;height:20px;flex:0 0 20px;margin-top:2px}.plan-prompt{margin:18px 0 0;text-align:center;padding:10px 0 0;border-top:1px solid #dcc8b960;font-size:12px;color:#fff1e5}.plan-radio:checked+.plan-card .plan-prompt{font-weight:600}.plan-checkout{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;margin-top:22px}.plan-checkout button.primary{background:linear-gradient(145deg,#ffedbe 0%,#f7d98f 48%,#eac16a 100%);color:#44331b;border-color:#fff0c6;min-width:240px;padding:12px 28px;box-shadow:inset 0 1px 0 #fff7,0 2px 0 #b68c42,0 4px 8px #32211520;transition:transform .16s,box-shadow .16s;transform:translateY(0)}.plan-checkout button.primary:hover:not(:disabled){background:linear-gradient(145deg,#fff1cb 0%,#f9df9e 48%,#efcc7d 100%);transform:translateY(-1px);box-shadow:inset 0 1px 0 #fff7,0 3px 0 #b68c42,0 5px 9px #32211525}.plan-checkout button.primary:active:not(:disabled){transform:translateY(1px);box-shadow:inset 0 1px 0 #fff5,0 1px 0 #b68c42,0 3px 6px #32211520}#plan-identity{text-align:center;font-size:14px;margin:15px 0 0}.terms{font-size:12px;line-height:1.6;text-align:center;max-width:780px;margin:15px auto 0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}[hidden]{display:none!important}
@media(min-width:761px) and (max-height:800px){header{padding-top:16px;padding-bottom:16px}main{min-height:calc(100svh - 80px);padding-top:0;padding-bottom:20px}.panel{padding:23px 28px 17px}.intro{margin-bottom:13px}.steps{margin-bottom:14px}label{margin-top:9px}.wide{margin-top:15px}footer{padding-top:16px}}
@media(max-width:760px){body{background-position:66% center}header{padding:20px}.brand span{display:none}nav{gap:18px}main{padding:8px 16px 28px;min-height:calc(100svh - 72px);justify-content:center}.panel{padding:26px 23px 20px}.confirm-layout{margin:30px 16px}.is-plans main{padding:4px 16px 28px}.is-plans h2{font-size:32px}.plans{grid-template-columns:1fr;max-width:420px;margin:auto;gap:16px}.plan-description{min-height:0;margin-bottom:15px}.credit-description{min-height:0}.billing-cycles{gap:1px;max-width:100%}.billing-cycles button{padding:9px 12px}.plan-checkout{gap:10px}.plan-checkout button.primary{width:100%;max-width:420px}.is-plans .intro{max-width:330px;margin:0 auto 20px}}
@media(max-width:360px){header{padding:16px}nav{gap:12px}.password-fields{grid-template-columns:1fr;gap:0}.panel{padding:23px 20px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

.is-plans #error{color:#ffc2c2}.is-plans .steps .done{color:#c7dcd0}

@media(min-width:761px){.plans{max-width:810px;margin:auto}}

/* Show the actual prepaid total alongside the discounted monthly equivalent. */
.cycle-value{display:block;margin-top:3px;font-size:9px;line-height:1.1;letter-spacing:.1px;opacity:.85}.price-comparison{display:flex;align-items:center;flex-wrap:wrap;gap:7px;min-height:23px;margin-top:8px;font-size:10px;color:var(--muted)}.savings-badge{display:inline-block;padding:4px 7px;border-radius:5px;background:#494054;color:#ffe3a2;font-size:10px;font-weight:500;line-height:1.1}

.comparison-note{max-width:840px;margin:18px auto 0;text-align:center;font-size:14px;line-height:1.6;color:#e0e2df}

/* Keep the selected surface inside narrow screens and honor reduced motion. */
@media(max-width:760px){.plan-radio:checked+.plan-card{transform:translateY(-3px)}}
@media(prefers-reduced-motion:reduce){.plan-radio:checked+.plan-card{transform:none}}

/* Customer workspace: same moonlight palette, with a quiet navigation rail. */
body.is-account{background:linear-gradient(140deg,#0b1a2cdd,#18364fbb),url('../assets/moonlight.webp') center/cover fixed}
.is-account>header{max-width:1280px;margin:auto}.is-account>header .brand{font-size:19px}.is-account>header .brand span{display:none}
.is-account main{max-width:1280px;display:block;padding:18px 24px 64px;margin:auto}
.is-account .panel{width:100%;max-width:none;padding:0;overflow:hidden;border:1px solid #cbe5f688;border-radius:22px;background:#eff7fd;box-shadow:0 24px 65px #020c2255;backdrop-filter:none;color:#193348}
.account-shell{display:grid;grid-template-columns:228px minmax(0,1fr);min-height:760px}
.account-sidebar{display:flex;flex-direction:column;padding:30px 18px;background:linear-gradient(180deg,#d2e6f6,#e0eff8);border-right:1px solid #b7d0e1}
.portal-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:#193348;font-size:21px;font-weight:600;padding:0 12px 34px}.portal-brand img{width:40px;height:40px;border-radius:11px}.portal-brand small{display:block;font-size:9px;letter-spacing:1.8px;font-weight:500;color:#526d80;margin-top:4px}
.account-sidebar nav{display:flex;flex-direction:column;gap:7px}.account-sidebar nav button{display:flex;align-items:center;gap:11px;text-align:left;border:0;background:none;color:#38566b;border-radius:10px;padding:12px 11px;font-size:13px;font-weight:500;width:100%}.account-sidebar nav svg{width:19px;height:19px;flex:none}.account-sidebar nav button:hover{background:#ffffff80}.account-sidebar nav button[aria-current=page]{background:#214b68;color:white;box-shadow:0 4px 12px #214b681a}
.sidebar-bottom{display:flex;flex-direction:column;align-items:flex-start;gap:14px;margin-top:0;padding:38px 12px 0;font-size:12px}.sidebar-bottom a{color:#42647c;text-decoration:none}.sidebar-bottom .text-button{font-size:12px;padding:0}
.account-content{min-width:0;padding:38px 38px 44px}.account-content h2{font-size:30px;letter-spacing:-.8px;margin:0 0 10px}.account-content>.intro{font-size:14px;margin-bottom:28px}.portal-welcome{margin-bottom:28px}.portal-welcome>p:not(.eyebrow){font-size:14px;color:#526d80}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:600;color:#526d80;margin:0 0 12px}
.portal-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.portal-card{padding:24px;border-radius:15px;border:1px solid #ccdde9;background:#fff;margin-bottom:20px;box-shadow:0 3px 10px #24425b05;min-width:0}.portal-card h3{margin:0 0 20px;font-size:15px;font-weight:600}.portal-card p{font-size:13px;line-height:1.65}.portal-card .muted,.portal-card .hint{color:#577185}.portal-card .text-button{padding:0;margin-top:12px;font-size:12px;font-weight:600}.credit-card{background:linear-gradient(145deg,#e6f3ff,#f8fcff);border-color:#c0d9ee}
.credit-number{font-size:30px;line-height:1.25;font-weight:600;letter-spacing:-.7px;margin:12px 0 18px}.credit-number span{font-size:12px;font-weight:400;letter-spacing:0;color:#526d80}.credit-meter{height:8px;border-radius:9px;background:#dce8f1;overflow:hidden}.credit-meter span{display:block;height:100%;background:linear-gradient(90deg,#357ba8,#52a6bc);border-radius:9px}.metric-caption{display:flex;justify-content:space-between;gap:10px;font-size:11px;color:#456478;margin-top:9px}
.portal-details{margin:15px 0}.portal-details>div{display:flex;justify-content:space-between;gap:16px;padding:13px 0;border-bottom:1px solid #e9eff4;font-size:12px}.portal-details dt{color:#577185}.portal-details dd{margin:0;text-align:right;overflow-wrap:anywhere;font-weight:500}.plan-summary{display:flex;align-items:center;flex-wrap:wrap;gap:10px}.plan-badge{font-size:24px;font-weight:600;letter-spacing:-.5px}.status-chip{background:#e8f5ed;color:#247244;border:1px solid #cde5d6;border-radius:20px;padding:4px 9px;font-size:10px}.status-chip.neutral{background:#f3efe6;color:#796234;border-color:#e6dac0}.detail-name{font-weight:600;font-size:17px!important}.portal-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.portal-card button{font-size:12px;border-radius:9px}.portal-card input{background:#f8fbfe;font-size:14px;padding:12px;border-radius:9px}.portal-card label{font-size:12px}.portal-card form{margin:0}.security-row{display:flex;gap:25px;align-items:center;justify-content:space-between}.security-row button{flex:none}.security-row p{overflow-wrap:anywhere}.topup-options{display:flex;gap:12px;margin:18px 0}.topup-options button{flex:1;padding:18px;font-size:18px}.portal-table-wrap{overflow-x:auto}.portal-card table{width:100%;border-collapse:collapse;text-align:left;font-size:12px}.portal-card th{font-weight:500;color:#577185;background:#f4f8fb;padding:12px}.portal-card td{padding:14px 12px;border-bottom:1px solid #e6eef4}.empty-state{padding:26px 12px;text-align:center;color:#577185;font-size:13px;background:#f7fafc;border-radius:10px}.portal-message{padding:15px;margin-bottom:20px;background:#e4f0fa;border:1px solid #c3d9eb;border-radius:10px;font-size:13px}.is-account .panel>footer{display:none}.is-account #notice,.is-account #error,.is-account #busy{margin:0;padding:0 30px}.is-account #notice:not(:empty),.is-account #error:not(:empty),.is-account #busy:not([hidden]){padding:18px 30px;border-top:1px solid #d4e2ec}.is-account button:focus-visible,.is-account a:focus-visible{outline:3px solid #52a6bc;outline-offset:3px}
@media(max-width:1000px){.account-content{padding:28px 24px}.account-shell{grid-template-columns:195px minmax(0,1fr)}.portal-grid{grid-template-columns:1fr}.account-sidebar{padding:28px 12px}.account-sidebar nav button{font-size:12px}.security-row{align-items:flex-start;flex-direction:column}}
@media(max-width:650px){.is-account main{padding:8px 12px 32px}.is-account .panel{border-radius:16px}.account-shell{display:block}.account-sidebar{padding:20px 16px 16px;border-right:0;border-bottom:1px solid #b7d0e1}.portal-brand{padding:0 0 18px}.account-sidebar nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}.account-sidebar nav button{padding:10px}.sidebar-bottom{flex-direction:row;flex-wrap:wrap;gap:20px;padding:18px 0 0;margin:0}.account-content{padding:25px 18px}.account-content h2{font-size:26px}.portal-card{padding:20px}.portal-details>div{flex-wrap:wrap}.portal-details dd{text-align:left}.portal-grid{gap:0}.credit-number{font-size:27px}.portal-actions button{flex:1}.is-account>header{padding:16px 20px}}

.portal-page-actions{display:flex;justify-content:flex-end;margin:-10px 0 10px}.portal-page-actions .text-button{font-size:12px;padding:2px 0}
/* Compact blue customer workspace. Long records use pages, never a hidden crop. */
body.is-account{background:radial-gradient(ellipse at 85% 0%,#236cae55,transparent 60%),linear-gradient(135deg,#081a35ee,#123862d9),url('../assets/moonlight.webp') center/cover fixed}
.is-account>header{padding:14px 24px;height:58px;max-width:1320px}.is-account main{max-width:1320px;min-height:0;padding:8px 20px 18px}.is-account .panel{border-radius:18px;background:linear-gradient(125deg,#eaf4ff,#f7fbff);border-color:#9ac6eb88}
.account-shell{grid-template-columns:204px minmax(0,1fr);min-height:calc(100svh - 88px)}
.account-sidebar{padding:24px 12px;background:linear-gradient(165deg,#123b6a,#0c2548 76%);border-right:1px solid #1e5489}
.portal-brand{padding:0 10px 26px;color:#f0f7ff;font-size:20px;gap:10px}.portal-brand img{box-shadow:0 0 18px #409aff44}.portal-brand small{color:#9bc6ed;font-size:8px;letter-spacing:1.6px}
.account-sidebar nav{gap:5px}.account-sidebar nav button{color:#bbd5ee;font-size:12px;padding:11px 10px;border:1px solid transparent;border-radius:9px}.account-sidebar nav button:hover{background:#ffffff12;color:white}.account-sidebar nav button[aria-current=page]{background:linear-gradient(100deg,#2677c4,#245d9e);border-color:#68b8ff55;box-shadow:0 5px 16px #041b3455;color:white}.account-sidebar nav svg{width:17px;height:17px}.sidebar-bottom{padding:22px 10px 0;gap:12px}.sidebar-bottom a,.sidebar-bottom .text-button{color:#bbd5ee}.sidebar-bottom a:hover,.sidebar-bottom button:hover{color:#fff;background:none}
.account-content{padding:22px 26px 20px}.account-content h2{font-size:26px;margin:0 0 6px;letter-spacing:-.8px}.account-content>.intro{font-size:12px;margin:0 0 16px}.portal-welcome{margin-bottom:18px}.portal-welcome>p:not(.eyebrow){font-size:12px;margin:7px 0 0}.eyebrow{font-size:9px;letter-spacing:1.6px;margin:0 0 8px;color:#4f79a4}
.portal-page-actions{margin:0 0 6px;height:20px}.portal-page-actions .text-button{color:#3975a7}
.portal-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.portal-card{padding:16px 18px;border-radius:12px;margin-bottom:14px;border-color:#cbdff1;box-shadow:0 3px 12px #1b578508;background:#ffffffde}.portal-card h3{font-size:13px;margin-bottom:12px;letter-spacing:-.1px}.portal-card p{font-size:12px;line-height:1.45;margin:7px 0}.portal-card .hint{font-size:10px}.portal-card .text-button{margin-top:8px;font-size:11px}.credit-card{background:linear-gradient(125deg,#ddecff,#f3f9ff);border-color:#b5d6f3}.credit-number{font-size:28px;margin:7px 0 12px;color:#154d83}.credit-number span{font-size:11px}.credit-meter{height:6px;background:#d4e5f6}.credit-meter span{background:linear-gradient(90deg,#2876c7,#63b4ef)}.metric-caption{font-size:10px;margin-top:6px}
.portal-details{margin:8px 0}.portal-details>div{padding:9px 0;gap:12px}.portal-details dd{font-size:12px}.plan-badge{font-size:23px;color:#154d83}.status-chip{font-size:9px;padding:3px 8px}.detail-name{font-size:15px!important}.portal-actions{margin-top:12px;gap:8px}.portal-card input{padding:8px 10px;font-size:13px}.portal-card label{margin:8px 0 4px;font-size:11px}.portal-card button{font-size:11px;padding:8px 12px}.security-row{gap:14px;flex-direction:row;align-items:center}.security-row p{max-width:460px}.topup-options{gap:10px;margin:12px 0}.topup-options button{padding:12px;font-size:16px}.credit-totals{display:flex;gap:20px;font-size:11px;color:#537699;margin-top:12px}.credit-totals strong{color:#193c60;margin-left:5px}
.portal-card th{padding:8px;font-size:10px;white-space:nowrap}.portal-card td{padding:9px 8px;font-size:11px}.portal-card td small{display:block;margin-top:3px;font-size:9px;color:#6684a1}.numeric{font-variant-numeric:tabular-nums;white-space:nowrap}.empty-state{padding:18px 10px;font-size:12px}.portal-message{padding:10px 12px;font-size:12px;margin-bottom:12px}.usage-card{margin-bottom:0}.usage-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}.usage-tabs{display:flex;border:1px solid #c6dbef;border-radius:8px;padding:3px;gap:3px;background:#eef5fc}.usage-tabs button{padding:5px 10px;border:0;font-size:10px}.usage-tabs button[aria-pressed=true]{background:#236aaf;color:white;box-shadow:0 2px 5px #215b8922}.range-label{display:flex;align-items:center;gap:6px!important;margin:0!important;font-size:10px!important}.range-label select{font:inherit;color:#264967;background:white;border:1px solid #bad3ea;border-radius:6px;padding:6px}.usage-pagination{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:10px;font-size:10px;color:#5b7690}.usage-pagination>div{display:flex;gap:6px}.usage-pagination button{padding:5px 8px;font-size:10px}.usage-state{font-size:9px;white-space:nowrap;color:#34658c;background:#edf5fc;border-radius:5px;padding:4px 6px}.usage-disclosure{margin-bottom:0!important}.is-account #notice:not(:empty),.is-account #error:not(:empty),.is-account #busy:not([hidden]){padding:8px 20px;font-size:11px}
@media(min-width:851px) and (max-height:800px){.account-content{padding:16px 22px}.portal-card{padding:13px 15px;margin-bottom:12px}.portal-welcome{margin-bottom:14px}.portal-card h3{margin-bottom:9px}.account-content>.intro{margin-bottom:12px}.portal-details>div{padding:7px 0}.portal-card td{padding:7px 8px}.credit-number{font-size:26px;margin:5px 0 10px}.portal-sidebar{padding-top:20px}.compact-credits .portal-card{padding-top:12px;padding-bottom:12px}}
@media(max-width:850px){.account-shell{grid-template-columns:180px minmax(0,1fr);min-height:0}.account-content{padding:20px}.portal-grid{grid-template-columns:1fr;gap:0}.security-row{align-items:flex-start;flex-direction:column}.usage-toolbar{align-items:flex-start;flex-direction:column}}
@media(max-width:650px){.is-account main{padding:4px 10px 16px}.is-account>header{padding:12px 16px}.account-shell{display:block}.account-sidebar{padding:15px}.portal-brand{padding:0 0 12px}.account-sidebar nav{grid-template-columns:repeat(3,minmax(0,1fr))}.account-sidebar nav button{font-size:10px;padding:8px 5px;gap:5px}.account-sidebar nav svg{width:14px;height:14px}.sidebar-bottom{padding:12px 0 0;gap:15px}.account-content{padding:18px 14px}.portal-card{padding:14px}.account-content h2{font-size:24px}.portal-details>div{flex-wrap:nowrap}.portal-details dd{text-align:right}.usage-pagination{align-items:flex-start;flex-direction:column}.usage-tabs button{padding:6px 8px}.account-sidebar nav button[aria-current=page]{color:white}.portal-card table{min-width:520px}}
.usage-tabs button[aria-pressed=true]:hover{background:#236aaf;color:white}
@media(min-width:851px) and (max-height:800px){.account-content{padding:14px 22px}.compact-credits .portal-card{padding:10px 15px}.compact-credits .credit-number{font-size:24px;margin:4px 0 8px}.compact-credits .topup-options{margin:8px 0}.compact-credits .topup-options button{padding:8px}.compact-credits .credit-totals{margin-top:7px}.compact-credits .portal-card p{margin:4px 0}.usage-card th{padding:6px 8px}.usage-card td{padding:5px 8px}.usage-card h3{margin-bottom:7px}.usage-toolbar{margin-bottom:7px}.usage-pagination{margin-top:7px}.usage-card .usage-disclosure{font-size:9px}}
/* One application frame: brand in the top bar, navigation and content below. */
.account-brand-logo{display:none}
body.is-account{background:#f3f7fc;color:#23364d}
.is-account>header{max-width:none;height:64px;margin:0;padding:0 28px;background:linear-gradient(110deg,#1765b5 0%,#2177bd 100%);border-bottom:1px solid #3a8dcb}
.is-account>header .brand{display:flex;align-items:center;gap:11px;font-size:22px;font-weight:600;letter-spacing:-.8px;color:#f5f8ff}
.is-account .account-brand-logo{display:block;position:relative;flex:none;width:34px;height:34px;border-radius:50%;overflow:hidden;filter:drop-shadow(0 0 5px #ffd67a66)}
/* Crop to the lunar disc so the icon tile never covers the banner. */
.is-account .account-brand-logo img{position:absolute;width:142.22%;height:142.22%;max-width:none;left:50%;top:50%;transform:translate(-50%,-50%)}
.is-account>header nav{gap:26px}.is-account>header nav a{font-size:12px;color:#fff;padding:22px 0}.is-account>header nav a[aria-current=page]{color:#fff;border-color:#8dbeec}
.is-account main{max-width:none;margin:0;padding:0;min-height:0}
.is-account .panel{border:0;border-radius:0;background:transparent;box-shadow:none;overflow:visible}
.account-shell{grid-template-columns:216px minmax(0,1fr);min-height:calc(100svh - 64px)}
.account-sidebar{padding:28px 15px 20px;background:#edf3fa;border-right:1px solid #dbe5f0}
.sidebar-section-label{font-size:9px;font-weight:600;letter-spacing:1.6px;color:#7a8ba2;margin:0 12px 18px}
.account-sidebar nav{gap:5px}.account-sidebar nav button{color:#54657c;font-size:12px;border:0;border-radius:6px;padding:11px 12px;font-weight:500}
.account-sidebar nav button:hover{color:#224b7a;background:#e1ebf7}
.account-sidebar nav button[aria-current=page]{color:#205b9b;background:#dceafa;box-shadow:none;font-weight:600}
.account-sidebar nav svg{width:17px;height:17px}.sidebar-bottom{padding:24px 12px 0;gap:14px}.sidebar-bottom a,.sidebar-bottom .text-button{color:#64758c}.sidebar-bottom a:hover,.sidebar-bottom button:hover{color:#205b9b}
.account-content{padding:22px 36px;max-width:1220px;width:100%;margin:0 auto}
.account-content h2{color:#1b2e47;font-size:26px;letter-spacing:-.7px}.account-content>.intro{color:#718198}.eyebrow{color:#8593a6;letter-spacing:1.5px}
.portal-welcome>p:not(.eyebrow){color:#718198}.portal-card{border-color:#dfe7f0;border-radius:9px;background:#fff;box-shadow:none}.portal-card h3{color:#384b64;font-weight:600}.portal-card .muted{color:#6a7d95}.credit-card{background:linear-gradient(120deg,#e8f1fc,#f8fbff);border-color:#ccdef2}.credit-number,.plan-badge{color:#235c97}.credit-meter span{background:linear-gradient(90deg,#357bbd,#70adde)}
.portal-details>div{border-bottom-color:#edf1f6}.portal-card input{background:#fbfcfe;border-color:#c9d5e3}.portal-card .text-button{color:#306ba6}.portal-card button.primary{background:#275f99;border-color:#275f99}.portal-card button.primary:hover{background:#1c4a79}.portal-card th{background:#f4f7fb;color:#738198}.portal-card td{border-bottom-color:#edf1f6}.usage-tabs{background:#f0f4f9;border-color:#dce5ef}.usage-tabs button[aria-pressed=true],.usage-tabs button[aria-pressed=true]:hover{background:#fff;color:#265f99;box-shadow:0 1px 4px #1d416b20}.usage-state{background:#edf3fa;color:#4c7095}.is-account #notice,.is-account #error,.is-account #busy{background:#f3f7fc}
@media(min-width:851px) and (max-height:800px){.account-content{padding:14px 28px}.account-sidebar{padding-top:22px}.portal-card{border-radius:8px}}
@media(max-width:1000px) and (min-width:851px){.account-shell{grid-template-columns:190px minmax(0,1fr)}.account-content{padding-left:22px;padding-right:22px}}
@media(max-width:850px){.account-shell{grid-template-columns:180px minmax(0,1fr);min-height:calc(100svh - 64px)}.account-content{padding:20px}.account-sidebar{padding:24px 10px}}
@media(max-width:650px){.is-account>header{height:60px;padding:0 16px}.is-account>header .brand{font-size:20px;gap:9px}.is-account .account-brand-logo{width:30px;height:30px}.is-account>header nav{gap:16px}.is-account>header nav a{padding:20px 0;font-size:11px}.is-account .panel{border-radius:0}.account-shell{display:block;min-height:calc(100svh - 60px)}.account-sidebar{padding:13px 12px;border-right:0;border-bottom:1px solid #dbe5f0}.sidebar-section-label{display:none}.account-sidebar nav button{padding:9px 6px;font-size:10px}.sidebar-bottom{padding:12px 6px 0;gap:18px}.account-content{padding:18px 14px}}

/* One continuous vertical sky: no color seam below the account banner. */
body.is-account{background:linear-gradient(180deg,#1765b5 0px,#2d8fe5 85px,#90cef2 180px,#dcedfa 320px,#f3f7fc 520px);background-repeat:no-repeat;background-color:#f3f7fc}
.is-account>header{background:transparent;border-bottom:0}
.is-account .account-sidebar{background:transparent;border-right-color:#507fab22}
.is-account .sidebar-section-label{color:#254969}
.is-account .account-sidebar nav button{color:#183d60}
.is-account .account-sidebar nav button[aria-current=page]{color:#205b9b;background:#dceafa}
.is-account .account-content .eyebrow{color:#385877}
.is-account .account-content>.intro,.is-account .portal-welcome>p:not(.eyebrow){color:#3d5e7e}

/* Readable account typography: 15px body, 13px controls, 11px fine print (owner-requested 1px reduction). */
body.is-account{--account-body:.9375rem;--account-ui:.8125rem;--account-small:.6875rem;font-size:var(--account-body);line-height:1.4}
.is-account>header nav a{font-size:var(--account-ui)}
.is-account .account-shell{grid-template-columns:232px minmax(0,1fr)}
.is-account .account-sidebar nav button{font-size:var(--account-ui);line-height:1.4;gap:10px;padding:10px}
.is-account .account-sidebar nav svg{width:18px;height:18px}
.is-account .sidebar-section-label,.is-account .eyebrow{font-size:var(--account-small);letter-spacing:1.2px}
.is-account .sidebar-bottom,.is-account .sidebar-bottom a,.is-account .sidebar-bottom .text-button{font-size:var(--account-ui);color:#365573}
.is-account .account-content h2{font-size:1.6875rem;line-height:1.2}
.is-account .account-content>.intro,.is-account .portal-welcome>p:not(.eyebrow){font-size:var(--account-body);line-height:1.4}
.is-account .portal-card h3{font-size:1rem;line-height:1.3}
.is-account .portal-card p,.is-account .portal-details dt,.is-account .portal-details dd,.is-account .portal-card input{font-size:var(--account-body);line-height:1.4}
.is-account .portal-details dt{color:#48627b;margin-bottom:0}
.is-account .portal-details>div{align-items:baseline;gap:14px}
.is-account .portal-card .muted,.is-account .portal-card .hint{color:#49627b}
.is-account .portal-card .hint,.is-account .metric-caption,.is-account .credit-number span,.is-account .credit-totals{font-size:var(--account-ui);line-height:1.4}
.is-account .portal-card label,.is-account .portal-card button,.is-account .portal-card .text-button,.is-account .portal-page-actions .text-button{font-size:var(--account-ui);line-height:1.4}
.is-account .portal-page-actions{height:24px}
.is-account .portal-page-actions .text-button{color:#183d60}
.is-account .detail-name{font-size:1.0625rem!important}
.is-account .credit-number,.is-account .compact-credits .credit-number{font-size:1.9375rem;line-height:1.15}
.is-account .plan-badge{font-size:1.5625rem}
.is-account .status-chip,.is-account .usage-state{font-size:var(--account-small);line-height:1.3}
.is-account .portal-card th,.is-account .portal-card td{font-size:var(--account-ui);line-height:1.3}
.is-account .portal-card th{color:#48627b}
.is-account .portal-card td small{font-size:var(--account-small);line-height:1.3;color:#49627b}
.is-account .range-label{font-size:var(--account-ui)!important}
.is-account .usage-pagination{font-size:var(--account-ui);line-height:1.4}
.is-account .usage-card .usage-disclosure{font-size:var(--account-small);line-height:1.4}
.is-account .portal-message,.is-account .empty-state{font-size:var(--account-ui)}
.is-account #notice:not(:empty),.is-account #error:not(:empty),.is-account #busy:not([hidden]){font-size:var(--account-ui)}
@media(max-width:1100px) and (min-width:651px){.is-account .account-shell{grid-template-columns:212px minmax(0,1fr)}.is-account .account-content{padding-left:20px;padding-right:20px}}
@media(max-width:650px){.is-account .account-shell{display:block}.is-account .account-sidebar nav{grid-template-columns:repeat(2,minmax(0,1fr))}.is-account .account-sidebar nav button{padding:9px 8px}.is-account .portal-details>div{flex-wrap:wrap}.is-account .portal-details dd{text-align:left}.is-account .metric-caption,.is-account .credit-totals{flex-wrap:wrap}.is-account .usage-toolbar{gap:12px}.is-account .usage-tabs{flex-wrap:wrap}.is-account .security-row{align-items:flex-start;flex-direction:column}}

@media(min-width:851px){
 .is-account .compact-credits .portal-card{padding:10px 15px;margin-bottom:10px}
 .is-account .compact-credits .portal-card h3{margin-bottom:7px}
 .is-account .compact-credits .credit-number{margin:4px 0 8px}
 .is-account .compact-credits .portal-card p{margin:4px 0}
 .is-account .compact-credits .topup-options{margin:8px 0}
 .is-account .compact-credits .topup-options button{padding:8px}
 .is-account .compact-credits .credit-totals{margin-top:7px}
 .is-account .usage-card{padding:12px 15px;margin-bottom:0}
 .is-account .usage-card h3{margin-bottom:7px}
 .is-account .usage-card th{padding:6px 8px}
 .is-account .usage-card td{padding:5px 8px}
 .is-account .usage-toolbar,.is-account .usage-pagination{margin-top:7px;margin-bottom:7px}
}

@media(min-width:1001px){
 .is-account .account-content:has(.compact-credits) .portal-page-actions{float:right;height:auto;margin:0 0 0 16px}
 .is-account .usage-card{display:grid;grid-template-columns:auto minmax(0,1fr);gap:7px 16px}
 .is-account .usage-card #customer-usage{display:contents}
 .is-account .usage-card h3{align-self:center;margin:0}
 .is-account .usage-card .usage-toolbar{margin:0}
 /* Descriptions and export controls are full rows, never implicit columns. */
 .is-account .usage-card #usage-rows,.is-account .usage-card .usage-pagination,.is-account .usage-card .usage-disclosure,
 .is-account .usage-card #usage-view-note,.is-account .usage-card #usage-export-note,.is-account .usage-card #usage-export-status,
 .is-account .usage-card .usage-toolbar:has(#usage-export){grid-column:1/-1;min-width:0}
 .is-account .usage-card .usage-toolbar{min-width:0;flex-wrap:wrap}
 .is-account .usage-card .usage-pagination{margin:0}
}

/* Apply the same 1px reduction to the independent account header/admin labels. */
.is-account>header .brand{font-size:21px}
.is-account #admin-link{font-size:var(--account-ui);font-weight:500}
@media(max-width:650px){.is-account>header .brand{font-size:19px}}

/* A sent reset has a clear, non-interactive cooldown state. */
.is-account #change-password[data-reset-wait]:disabled{background:#e4e9ef;border-color:#cdd7e1;color:#52657a;opacity:1;cursor:default}
.is-account .security-row #change-password{max-width:100%;white-space:normal}
@media(max-width:1100px){.is-account .security-row:has(#change-password){align-items:flex-start;flex-direction:column}}

/* Prevent the reset card margin from exposing the root canvas above the scenery. */
body.is-password-reset{display:grid;grid-template-columns:minmax(0,1fr);place-items:center;min-height:100svh;padding:32px 16px}
.is-password-reset .confirm-layout{width:100%;max-width:440px;min-width:0;margin:0}

/* A country menu and national number share one compact registration row. */
.phone-fields{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:8px}
.phone-fields select{appearance:none;-webkit-appearance:none;width:100%;min-width:0;border:1px solid var(--border);border-radius:8px;padding:10px 32px 10px 10px;background:#edf5fc url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14'%3E%3Cpath d='m3 5 4 4 4-4' fill='none' stroke='%23193348' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 12px center;background-size:14px 14px;color:inherit;font:inherit;font-size:13px;line-height:20px}
.phone-fields input{min-width:0}
.phone-fields select:focus-visible{outline:2px solid #5a8daa;outline-offset:2px}
.phone-fields select:disabled{opacity:.6}

/* Visible, live new-password checklist shared by signup and recovery. */
.password-requirements{margin:10px 0 0;padding:10px 12px;border:1px solid #acc9df;border-radius:8px;background:#eaf4fc88;color:#38536a}
.password-requirements>p{margin:0 0 7px!important;font-size:11px!important;font-weight:600;color:#243f55!important}
.password-requirements ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 12px;list-style:none;margin:0;padding:0}
.password-requirements li{display:flex;align-items:flex-start;gap:6px;font-size:11px;line-height:1.35}
.password-requirements li:last-child{grid-column:1/-1}
.rule-mark{width:12px;height:12px;margin-top:1px;flex:0 0 12px;border:1px solid #728ca1;border-radius:50%;position:relative}
.password-requirements [data-met=true]{color:#17613e}
[data-met=true]>.rule-mark{background:#24764f;border-color:#24764f}
[data-met=true]>.rule-mark:after{content:'';position:absolute;left:3px;top:2px;width:3px;height:5px;border:solid #fff;border-width:0 1.5px 1.5px 0;transform:rotate(45deg)}
@media(max-width:360px){.password-requirements ul{grid-template-columns:1fr}}

@media(min-width:761px) and (max-height:800px){
 .is-signup .panel{padding-top:18px;padding-bottom:14px}
 .is-signup .intro{margin-bottom:4px}
 .is-signup .steps{margin-bottom:10px}
 .is-signup label{margin-top:6px}
 .is-signup .wide{margin-top:12px}
 .is-signup .actions{margin-top:12px}
 .is-signup footer{padding-top:8px}
 .is-signup .password-requirements{padding-top:8px;padding-bottom:8px}
}

/* Keep requirements beside password entry; narrow screens stack the same content. */
.is-signup .panel{width:600px}
.is-password-reset .confirm-layout{max-width:600px}
.password-area{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:start}
.password-area .password-fields{grid-template-columns:1fr;gap:0}
.password-area .password-requirements{margin-top:12px}
.password-area .password-requirements ul{grid-template-columns:1fr;gap:8px}
.password-area .password-requirements li{font-size:12px;color:#38536a}
.password-area .password-requirements li:last-child{grid-column:auto}
.password-requirements .rule-mark{border:0;background:transparent;width:14px;height:14px;flex-basis:14px}
.password-requirements [data-met=false]>.rule-mark:before,.password-requirements [data-met=false]>.rule-mark:after{content:'';position:absolute;left:6px;top:1px;width:2px;height:12px;background:#b3263d;transform:rotate(45deg)}
.password-requirements [data-met=false]>.rule-mark:after{transform:rotate(-45deg)}
.password-requirements [data-met=true]>.rule-mark:after{left:4px;top:1px;width:5px;height:9px;border-color:#17613e;border-width:0 2px 2px 0}
.password-match{margin:7px 0 0!important;font-size:12px!important;line-height:1.4;color:#b3263d!important}
.password-match[data-met=true]{color:#17613e!important}
.password-fields input[aria-invalid=true]{border-color:#b3263d}
@media(max-width:600px){.password-area{grid-template-columns:1fr;gap:0}.password-area .password-requirements{margin-top:10px}}

/* Keep navigation on the dark left sky, clear of the moon on the right. */
body:not(.is-account)>header{max-width:none;justify-content:flex-start;flex-wrap:wrap;gap:16px 36px;padding:18px 40px}
body:not(.is-account)>header .brand{display:grid;grid-template-columns:36px auto;column-gap:10px;align-items:center}
body:not(.is-account)>header .brand>span{grid-column:2;grid-row:2}
body:not(.is-account) .account-brand-logo{display:block;position:relative;grid-row:1 / span 2;width:36px;height:36px;border-radius:50%;overflow:hidden;filter:drop-shadow(0 0 5px #ffd67a66)}
body:not(.is-account) .account-brand-logo img{position:absolute;width:142.22%;height:142.22%;max-width:none;left:50%;top:50%;transform:translate(-50%,-50%)}
body:not(.is-account)>header nav{text-shadow:0 1px 3px #071322}
body:is(.is-auth-entry,.is-signup)>header{position:absolute;inset:0 0 auto;z-index:1}
:is(.is-auth-entry,.is-signup)>main{max-width:none;min-height:100svh;justify-content:center;padding:110px 24px}
@media(max-width:650px){
 body:not(.is-account)>header{padding:18px 24px;column-gap:24px}
 body:not(.is-account)>header nav{gap:22px}
 :is(.is-auth-entry,.is-signup)>main{padding:110px 16px}
}

/* Authenticated plan browsing retains a visible account entry on the right. */
body.is-plans>header nav.signed-in{margin-left:auto}

/* Identity stays below My Account without changing its accessible link name. */
header nav.signed-in{align-items:center}
header nav .account-nav-identity{display:flex;flex-direction:column;align-items:flex-end;gap:4px;min-width:0}
header nav .account-nav-identity>a{padding:0 0 4px}
header nav .account-greeting{font-size:12px;line-height:1.3;max-width:min(320px,52vw);overflow-wrap:anywhere;text-align:right;color:inherit}
.is-account>header{height:auto;min-height:64px;padding-top:8px;padding-bottom:8px}
.is-account>header nav .account-nav-identity>a{padding:0 0 4px}
/* Keep the established compact header height with the second identity line. */
.is-account>header nav.signed-in>a{padding:12px 0}

/* Keep current-plan actions distinct from its refresh control. */
.is-account .plan-actions{display:flex;flex-wrap:wrap;align-items:center;gap:16px}

/* A distinct global action below the signed-in identity, shared by every tab. */
.is-account .account-shell{min-height:0}
.is-account #account-refresh{display:inline-flex;align-items:center;justify-content:center;gap:8px;margin-top:7px;min-height:36px;padding:8px 16px;border:1px solid #e2f2ff;border-radius:11px;background:linear-gradient(145deg,#f3fbff,#c6e6ff);color:#164f80;font-size:var(--account-ui);line-height:1.4;font-weight:600;box-shadow:0 3px 10px #063a742b,inset 0 1px 0 #ffffffb3;white-space:nowrap;transition:background .15s,box-shadow .15s,transform .15s}
.is-account #account-refresh:hover:not(:disabled){background:linear-gradient(145deg,#fff,#dcefff);box-shadow:0 5px 14px #063a743b;transform:translateY(-1px)}
.is-account #account-refresh:active:not(:disabled){transform:translateY(0)}
.is-account #account-refresh:focus-visible{outline:2px solid #fff;outline-offset:3px}
#account-refresh svg{width:17px;height:17px;flex:none}
#account-refresh[aria-busy=true] svg{animation:account-refresh-spin 1s linear infinite}
@keyframes account-refresh-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){#account-refresh[aria-busy=true] svg{animation:none}.is-account #account-refresh{transition:none}.is-account #account-refresh:hover:not(:disabled){transform:none}}

.is-account>header nav .account-nav-identity>a{font-size:15px;font-weight:600;letter-spacing:-.15px}
.is-account>header nav .account-greeting{font-size:14px;line-height:1.4;color:#eff8ff}
.is-account .portal-welcome .eyebrow{font-size:13px;font-weight:600;letter-spacing:1.5px;margin-bottom:9px}
.is-account .portal-welcome .workspace-greeting{font-size:20px;line-height:1.45;font-weight:600;letter-spacing:-.2px;margin:0;overflow-wrap:anywhere}
@media(min-width:851px) and (max-height:800px){
 .is-account .account-content:has(.compact-credits){padding-top:6px;padding-bottom:6px}
 .is-account .account-content:has(.compact-credits)>.intro{margin-bottom:4px}
}

/* Session restoration has no guest form or stale account identity. */
body.is-restoring{background:#f3f7fc;color:#23364d}
.is-restoring>header{max-width:none;margin:0;min-height:64px;padding:16px 28px;background:linear-gradient(180deg,#1765b5,#2d8fe5)}
.is-restoring main{max-width:none;justify-content:center;min-height:calc(100svh - 98px)}
.is-restoring .panel{width:auto;max-width:100%;background:transparent;border:0;box-shadow:none;backdrop-filter:none}
.is-restoring .session-loading{display:flex;align-items:center;justify-content:center;gap:12px;font-size:15px;color:#385b77}
.is-restoring .session-loading::before{content:'';width:18px;height:18px;border:2px solid #ccdfef;border-top-color:#2865a3;border-radius:50%;animation:session-loading-spin .8s linear infinite}
.is-restoring .panel>footer,.is-restoring #busy{display:none!important}
@keyframes session-loading-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.is-restoring .session-loading::before{animation:none}}

/* Account identity is visible in Profile and cannot be edited. */
.is-account #profile-email:disabled{background:#edf0f4;border-color:#cdd5df;color:#647184;-webkit-text-fill-color:#647184;opacity:1;cursor:default}

/* Native-style sign-in controls, with a touch-sized visibility toggle. */
.signin-password{position:relative}
.signin-password>input{padding-right:50px}
.signin-password>button{position:absolute;right:2px;top:50%;transform:translateY(-50%);width:44px;height:40px;padding:10px;border:0;background:transparent;display:grid;place-items:center}
.signin-password svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.signin-password [aria-pressed=true] .eye-slash{display:none}
label.remember-email{display:flex;align-items:center;gap:8px;min-height:36px;margin-top:8px;font-size:12px;font-weight:400;cursor:pointer}
.remember-email>input{width:16px;height:16px;margin:0;padding:0;accent-color:var(--accent)}

.remember-email>input{appearance:auto;-webkit-appearance:checkbox;border-radius:3px}

/* Compact plan cards without reducing text size or hiding benefits. */
.is-plans .plan-card{padding:18px 20px 14px}
.is-plans .plan-description{margin:5px 0 12px}
.is-plans .price-comparison{margin-top:6px;margin-bottom:0}
.is-plans .billing-note{margin:5px 0 12px}
.is-plans .credit-allowance{margin-bottom:4px}
.is-plans .credit-description{min-height:0;margin-bottom:10px}
.is-plans .feature-list{padding-top:10px}
.is-plans .feature-list li{padding:4px 0}
.is-plans .plan-prompt{margin-top:10px;padding-top:8px}

/* Plans keep their moonlit surface while identity and prices are loading. */
html[data-loading-surface="plans"] body.is-restoring{background:radial-gradient(ellipse at 0% 0%,#635b78,transparent 80%),linear-gradient(135deg,#635b78,#302d3b);color:#f6f3eb}
html[data-loading-surface="plans"] .is-restoring>header{max-width:1220px;margin:auto;padding:22px 32px;background:transparent}
html[data-loading-surface="plans"] .is-restoring .session-loading{color:#e1e2dd}
html[data-loading-surface="plans"] .is-restoring .session-loading::before{border-color:#ffffff30;border-top-color:#e7d8b6}

@media(prefers-reduced-motion:reduce){.plan-checkout button.primary{transition:none}}

/* Auth surfaces: smooth silver sheen, without texture or animated effects. */
:is(.is-auth-entry,.is-signup) .panel,.confirm-layout{
 background:radial-gradient(ellipse at 0% 40%,#ffffffa6 0%,#ffffff00 65%),radial-gradient(ellipse at 100% 70%,#ffffff99 0%,#ffffff00 65%),linear-gradient(180deg,#dbe1e6 0%,#abb8c5 52%,#d4dce4 100%);
 color:#233747;--muted:#465966;--accent:#29485d;--border:#8b9aa7;
 border:1px solid #f6f8fa;backdrop-filter:none;
 box-shadow:0 20px 50px #0006,inset 0 2px 2px #ffffffe0,inset 0 -2px 3px #60708060;
}
:is(.is-auth-entry,.is-signup) .panel input,.confirm-layout input{background:#ffffffbb;box-shadow:inset 0 1px 3px #23374712}
body.is-auth-confirm{display:flex;align-items:center;justify-content:center;min-height:100svh;padding:32px 16px}
.is-auth-confirm .confirm-layout{width:440px;max-width:100%;margin:0;min-height:0}

/* Auth navigation must not paint the dashboard banner while identity loads. */
html[data-loading-surface="auth"] body.is-restoring{background:linear-gradient(90deg,#07132255,transparent 70%),url('../assets/moonlight.webp') center/cover fixed no-repeat;color:#f7f3e7}
html[data-loading-surface="auth"] .is-restoring>header{background:transparent;position:absolute;inset:0 0 auto;z-index:1}
html[data-loading-surface="auth"] .is-restoring main{min-height:100svh;padding:110px 24px}
html[data-loading-surface="auth"] .is-restoring .session-loading{color:#e1e2dd}
html[data-loading-surface="auth"] .is-restoring .session-loading::before{border-color:#ffffff30;border-top-color:#e7d8b6}

/* Cancellation is distinct from ordinary account navigation; the billing
   portal still owns confirmation and no cancellation occurs on this page. */
.is-account #cancel-subscription{color:#a52e38;background:#fff2f3;border:1px solid #d59ba1;font-weight:600}
.is-account #cancel-subscription:hover:not(:disabled){color:#fff;background:#a52e38;border-color:#a52e38}
.is-account #cancel-subscription:disabled{opacity:.5}

.is-account #cancel-grant,.is-account #confirm-cancel-grant{color:#a52e38;background:#fff2f3;border:1px solid #d59ba1;font-weight:600}
.is-account #cancel-grant-confirm{margin-top:16px;padding:16px;border:1px solid #d59ba1;border-radius:12px;background:#fff8f8}

/* Match the approved inset, centered select chevrons in the admin user cards. */
.range-label select{appearance:none;-webkit-appearance:none;padding:8px 44px 8px 12px;min-height:40px;background-color:#fff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18' fill='none' stroke='%23346781' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4 7 5 5 5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 18px center;background-size:18px 18px}
.usage-tabs{flex-wrap:wrap;max-width:100%}

/* Keep the signup form below the header without excessive desktop gutters. */
@media(min-width:761px){
 body.is-signup>main{padding:96px 24px 24px}
}

#usage-export-status:empty{display:none}
@media(min-width:1001px) and (max-height:800px){
 .is-account .usage-card{row-gap:4px}
 .is-account .usage-card .usage-disclosure{margin-top:0}
 .is-account .usage-card #usage-rows{max-height:clamp(90px,calc(100svh - 600px),180px);overflow:auto}
 .is-account .usage-card #usage-rows th{position:sticky;top:0;background:#f3f7fc;z-index:1}
}
@media(min-width:1001px) and (max-width:1100px){
 .is-account .usage-card{grid-template-columns:130px minmax(0,1fr)}
 .is-account .usage-card .usage-toolbar:has(#usage-export){grid-column:1/-1;justify-content:flex-start}
 .is-account .usage-card #usage-export-note{grid-column:1/-1;margin:0}
}

/* Keep signup left of the moon on desktop; retain narrow-screen centering. */
@media(min-width:761px){body.is-signup>main{justify-content:flex-start;padding-left:clamp(32px,7vw,120px);padding-right:32px}}

/* Centered, compact email verification status. */
.is-email-verification>header{position:absolute;top:0;left:0;width:100%}
.is-email-verification main{width:100%;max-width:none;min-height:100svh;padding:100px 20px;justify-content:center;align-items:center;box-sizing:border-box}
.is-email-verification .panel{width:530px;max-width:100%;padding:36px 32px;min-height:0;height:auto;text-align:center}
.is-email-verification #screen h2{font-size:34px;font-weight:600;letter-spacing:-1px;line-height:1.15;margin:18px 0 22px}
.is-email-verification .intro{font-size:19px;line-height:1.65}.is-email-verification .intro strong{font-weight:600;color:#294b60;overflow-wrap:anywhere}
.is-email-verification .steps{justify-content:center;gap:16px;font-size:13px}.is-email-verification footer{display:none}
.verification-instruction{font-size:16px;color:#486173}.verification-actions{justify-content:flex-end;margin-top:26px}.verification-actions button{font-size:15px;min-height:44px}
.verification-help{text-align:left;margin-top:20px;font-size:14px;line-height:1.6}
@media(max-width:600px){.is-email-verification .panel{padding:28px 24px}.is-email-verification #screen h2{font-size:29px}}

/* Inline plan changes preserve the current plan action row. */
#plan-change-panel:not([hidden]){margin-top:16px}
#plan-change-panel label{display:block;margin:0 0 8px;font-weight:600}
#plan-change-panel select{display:block;width:100%;min-height:44px;padding:10px 12px;border:1px solid #98b5cb;border-radius:10px;background:#fff;color:#244a63;font:inherit;box-sizing:border-box}
#plan-change-panel select+h3{margin-top:18px}

/* Compact credit purchases share the Change Plan primary button palette. */
.is-account .compact-credits .topup-options{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:12px;margin:18px 0;}
.is-account .compact-credits .topup-options button{flex:0 1 auto;width:250px;max-width:100%;min-height:46px;padding:11px 20px;font-size:16px;line-height:1.4;}
@media(max-width:650px){.is-account .compact-credits .topup-options{gap:10px;}.is-account .compact-credits .topup-options button{width:250px;}}

/* Explicit recurring-price consent uses a native, visible checkbox. */
#plan-change-panel .plan-change-consent { display:flex; align-items:flex-start; gap:10px; margin:18px 0; font-weight:500; }
.plan-change-consent input[type="checkbox"] { appearance:auto; -webkit-appearance:checkbox; flex:0 0 18px; width:18px; height:18px; min-height:18px; padding:0; margin:3px 0 0; border-radius:3px; accent-color:#285f9c; }
