*{box-sizing:border-box}body{margin:0;min-height:100svh;display:flex;flex-direction:column;background:#fcfcf7;color:#173d32;font:14px/1.65 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}a{color:inherit}.account-page{width:calc(100% - 48px);max-width:850px;margin:0 auto;padding:42px 0 50px;flex:1}.account-heading{margin:0 0 30px}.eyebrow{font-size:9px;letter-spacing:1.8px;font-weight:650;color:#648653;margin:0 0 10px}h1{font:400 clamp(35px,4vw,50px)/1.1 Georgia,serif;letter-spacing:-1.5px;margin:0 0 18px}h1 em{color:#648653;font-weight:400}.account-heading>p:last-child{color:#596960}h2{font:400 27px/1.25 Georgia,serif;margin:0 0 10px}p{margin:0 0 12px}.account-card{background:#fffef9;border:1px solid #d5dfcf;border-radius:20px;padding:26px;margin-bottom:20px}.account-overview{display:flex;justify-content:space-between;align-items:center;gap:22px;background:#edf2e5}.account-overview p{margin-bottom:0;color:#596960}.account-overview h2{overflow-wrap:anywhere}.button,button{display:inline-flex;align-items:center;justify-content:center;padding:11px 18px;min-height:44px;border:0;border-radius:11px;background:#d9ea4b;color:#173d32;font:600 13px/1.4 system-ui;text-decoration:none;cursor:pointer;white-space:nowrap}button:disabled{background:#e9ece3;color:#7a8578;cursor:default}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px}.plan-badge{padding:5px 12px;background:#edf2e5;border:1px solid #d5dfcf;border-radius:999px;font-size:11px}.usage-label{display:flex;justify-content:space-between;margin-bottom:8px}.usage-label strong{font-variant-numeric:tabular-nums}progress{appearance:none;display:block;width:100%;height:9px;border:0;border-radius:10px;overflow:hidden;background:#e2e8dc;accent-color:#648653;margin-bottom:10px}progress::-webkit-progress-bar{background:#e2e8dc}progress::-webkit-progress-value{background:#648653}progress::-moz-progress-bar{background:#648653}.muted{color:#596960;font-size:12px}.plan-controls{display:grid;grid-template-columns:1fr auto;gap:8px 12px;margin:24px 0 10px}.plan-controls label{grid-column:1/-1;font-size:12px;font-weight:600}select,input{min-width:0;width:100%;font:inherit;border:1px solid #cdd8c6;background:#fcfcf7;color:#173d32;border-radius:10px;padding:10px 12px;min-height:44px}.account-plan-links{display:flex;align-items:center;flex-wrap:wrap;gap:10px 22px;margin-top:18px;font-size:12px}.text-action{background:none;padding:0;min-height:28px;font-size:12px;text-decoration:underline;font-weight:400}.test-note{padding:12px 14px;border-radius:10px;background:#f3f1dd;font-size:12px;color:#656137}.account-danger{display:flex;align-items:center;gap:24px;background:#fcf7f4;border-color:#e4d6d0}.account-danger>div{flex:1}.account-danger p:last-child{font-size:12px;color:#755e5e;margin:0}.account-danger .eyebrow{color:#9c4352}.danger-button{background:#a84455;color:#fff}.danger-button:hover{background:#91394b}.secondary{background:#edf2e5}dialog{width:min(510px,calc(100% - 32px));max-height:calc(100svh - 40px);overflow:auto;border:1px solid #d9dfd5;border-radius:20px;padding:28px;color:#173d32;background:#fffef9;box-shadow:0 15px 60px #173d3226}dialog::backdrop{background:#173d3266}dialog p{font-size:13px;color:#596960}dialog label{display:block;font-size:12px;font-weight:600;margin:15px 0 6px}.dialog-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:22px}#delete-error,#account-message[data-error=true]{color:#a23044}#account-message:empty{display:none}.site-footer{margin-top:auto}[hidden]{display:none!important}:focus-visible{outline:3px solid #648653;outline-offset:3px}@media(max-width:540px){.account-page{width:calc(100% - 36px);padding-top:28px}.account-card{padding:20px}.account-overview,.account-danger{flex-direction:column;align-items:stretch;gap:16px}.account-overview .button{align-self:flex-start}.plan-controls{grid-template-columns:1fr}.plan-controls label{grid-column:auto}.dialog-actions{flex-direction:column-reverse}dialog{padding:22px}}
.scheduled-change{background:#edf2e5;border:1px solid #d5dfcf;border-radius:10px;padding:12px 14px;font-size:12px}.account-activity{list-style:none;margin:0;padding:0}.account-activity li{display:grid;gap:4px;padding:13px 0;border-bottom:1px solid #e2e8dc;font-size:13px}.account-activity li:last-child{border:0}.account-activity span{font-size:11px;color:#596960}

.recovery-form{display:grid;gap:10px;max-width:480px;margin:24px 0}.recovery-form label{font-weight:600}.recovery-form input{width:100%;min-height:44px;padding:10px 12px;border:1px solid #cbd8c5;border-radius:9px;background:#fff;color:inherit;font:inherit}.recovery-form button{justify-self:start;margin-top:8px;min-height:44px;padding:10px 18px;border:0;border-radius:10px;background:#d7ee3e;color:#173d32;font:inherit;font-weight:600;cursor:pointer}

/* Shared account rhythm: 8px label gaps, 16px action gaps, 24px between cards. */
.account-card { padding:28px; margin-bottom:24px; }
.account-card:last-child { margin-bottom:0; }
.account-card > :last-child { margin-bottom:0; }
.account-card > h2 { margin-bottom:12px; }
.account-card > .eyebrow { margin-bottom:8px; }
.account-card > label { display:block; margin:20px 0 8px; font-size:12px; font-weight:600; }
.account-card > select { display:block; margin:0; min-height:44px; padding:10px 12px; }
.account-card > select + button { margin-top:16px; }
.account-card > button + p { margin-top:12px; }
.account-card > p:empty { display:none; }
.account-card .section-heading h2 { margin-bottom:0; }
.plan-controls { gap:8px 16px; margin:24px 0 12px; }
.account-plan-links { gap:12px 24px; margin-top:20px; }
#buy-minutes:disabled { cursor:default; }
@media(max-width:540px) { .account-card { padding:22px; margin-bottom:20px; } .account-card > select + button { width:100%; } }
.minutes-stepper { display:inline-flex; align-items:center; gap:12px; padding:6px; border:1px solid #cdd8c6; border-radius:12px; background:#fcfcf7; max-width:100%; }
.minutes-stepper button { width:44px; flex:none; padding:0; font-size:22px; }
.minutes-stepper input { width:76px; padding:8px; text-align:center; background:transparent; border:0; appearance:textfield; -moz-appearance:textfield; }
.minutes-stepper input::-webkit-inner-spin-button,.minutes-stepper input::-webkit-outer-spin-button { appearance:none; margin:0; }
.minutes-stepper > span { font-size:13px; color:#596960; }
.topup-total { margin:12px 0 16px; font-weight:600; font-variant-numeric:tabular-nums; }
#topup-availability { margin-top:12px; }
@media(max-width:540px) { .minutes-stepper { gap:8px; } .minutes-stepper input { width:60px; } }
/* Keep standalone card actions aligned with the plan action. */
#buy-minutes,#save-camera-preference { display:flex; width:fit-content; margin-left:auto; }
@media(max-width:540px) { #buy-minutes,#save-camera-preference { width:auto; max-width:100%; } }
.account-plan-picker { border:0; padding:0; margin:24px 0 12px; min-width:0; }
.account-plan-picker legend { padding:0; margin-bottom:12px; font-size:12px; font-weight:600; }
.account-plan-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.account-plan-option { position:relative; cursor:pointer; min-width:0; }
.account-plan-option > input { position:absolute; opacity:0; width:1px; height:1px; min-height:0; padding:0; border:0; }
.account-plan-box { display:flex; flex-direction:column; position:relative; height:100%; min-height:186px; padding:42px 14px 16px; border:1px solid #d5dfcf; border-radius:16px; background:#fcfcf7; gap:10px; }
.account-plan-box.is-current { border:2px solid #648653; padding:41px 13px 15px; background:#edf2e5; }
.account-plan-option > input:checked + .account-plan-box:not(.is-current) { border-color:#648653; background:#f3f6ec; box-shadow:0 0 0 1px #648653; }
.account-plan-option > input:focus-visible + .account-plan-box { outline:3px solid #648653; outline-offset:3px; }
.account-plan-option:has(input:disabled) { cursor:default; }
.account-current-badge { position:absolute; top:10px; right:10px; border-radius:999px; background:#173d32; color:#fffef9; padding:3px 8px; font:600 10px/1.4 system-ui; }
.account-plan-name { font:400 25px/1.2 Georgia,serif; }
.account-plan-price { font-size:12px; font-weight:650; font-variant-numeric:tabular-nums; }
.account-plan-detail { font-size:12px; line-height:1.6; color:#596960; }
.account-plan-state { font-size:11px; line-height:1.4; color:#596960; margin-top:auto; }
.account-plan-action { display:flex; justify-content:flex-end; margin-top:16px; }
@media(max-width:700px) { .account-plan-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:360px) { .account-plan-grid { grid-template-columns:1fr; } }

.account-usage-bar{display:flex;width:100%;height:12px;overflow:hidden;border-radius:999px;background:#e2e8dc;margin-bottom:10px}.account-usage-plan{height:100%;background:#e2e8dc}.account-usage-plan>span{display:block;height:100%;background:#648653}.account-usage-extra{height:100%;background:repeating-linear-gradient(135deg,#b1c86a 0,#b1c86a 5px,#e5edc7 5px,#e5edc7 9px);border-left:2px solid #fffef9;box-sizing:border-box}#account-usage-legend{line-height:1.6}

.account-usage-label{position:relative;min-height:20px;padding-right:110px}.account-usage-label #account-percentage{position:absolute;right:0;top:0}.account-usage-label #account-percentage.has-extra{right:30%;padding-right:6px}.account-usage-label #account-extra-minutes{position:absolute;right:0;top:0;font-size:12px}@media(max-width:420px){.account-usage-label>span{font-size:11px}.account-usage-label #account-extra-minutes{font-size:10px}}

.account-billing-toggle{display:flex;gap:4px;width:fit-content;padding:4px;margin:0 auto 18px;border:1px solid #d5dfcf;border-radius:999px;background:#edf2e5}.account-billing-toggle button{border-radius:999px;background:transparent;min-height:38px;padding:8px 16px;font-size:12px}.account-billing-toggle button[aria-pressed=true]{background:#173d32;color:#fffef9}.account-billing-toggle small{font-size:10px;margin-left:6px}

.account-plan-original{display:block;color:#7a807b;font-size:11px;font-weight:400}.account-billing-toggle small{font-size:9px;font-weight:400;color:#757b76}.account-billing-toggle button[aria-pressed=true] small{color:#c4c8c5}