body:has(#accountView:not([hidden])) main{max-width:1180px}#accountView>h1{font-size:clamp(24px,4vw,38px)}#accountView>.eyebrow{margin-bottom:8px}#commercePortal{margin-top:28px}.campaign-hero{display:grid;grid-template-columns:1.6fr 1fr;gap:24px;align-items:center;background:#edf4ec;border-radius:28px;padding:30px}.campaign-hero h2{font-size:clamp(26px,4vw,42px);line-height:1.12;margin:10px 0}.campaign-hero p{max-width:590px}.campaign-hero svg{width:100%;max-width:350px}.soft,.locked{background:#eaf0f3;color:#17384b;padding:12px 18px;border:0;border-radius:14px;font:inherit;font-weight:650;cursor:pointer}.locked{color:#7b8590;background:#eef0f2}.campaign-nav{display:flex;gap:10px;margin:26px 0}.campaign-nav button{padding:14px 18px;border:0;border-radius:14px;font:inherit;background:#eaf0f3;cursor:pointer}.campaign-nav [aria-current=page]{background:#173e53;color:white}.budget-bar{position:sticky;top:12px;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:16px;background:#173e53;color:#fff;border-radius:18px;padding:15px 22px;box-shadow:0 6px 20px #163e5320}.budget-bar strong{display:block;font-size:27px;color:#d1f79a}.budget-bar .primary{margin:0;width:auto}.builder-heading,.history-heading{display:flex;justify-content:space-between;align-items:center;gap:20px}.builder-heading p{max-width:730px}.builder-heading button{flex-shrink:0}.campaign-note{padding:15px 18px;background:#f0f3f5;border-radius:14px}.hour-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.hour-choice{padding:20px;border:1px solid #d8e1e5;border-radius:18px;background:white}.hour-choice.chosen{border:2px solid #248875;background:#f2faf7;padding:19px}.hour-choice.unavailable{background:#f0f1ef;color:#7a858a}.hour-pick{display:flex;align-items:center;gap:12px;margin:0;cursor:pointer}.hour-pick input{width:21px;height:21px;margin:0;accent-color:#188b76}.hour-pick strong{font-size:20px}.hour-pick small{display:block;font-weight:400}.hour-choice p,.hour-choice>small{font-size:13px}.quantity-label{display:flex;align-items:center;justify-content:space-between;font-size:13px}.quantity-label input{width:76px;padding:10px;margin:0}.receipt{margin-top:25px;padding:28px;border:1px solid #cbdcda;border-radius:22px;background:#f6faf8;scroll-margin-top:120px}.receipt ul{list-style:none;padding:0}.receipt li,.receipt-total{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid #dbe4e2}.receipt li small{display:block;font-size:13px;color:#59727a;margin-top:4px}.receipt-total{font-size:22px;border:0}.receipt>p{font-size:14px}.receipt .primary{width:auto}.order-card{background:#fff;border:1px solid #d8e2e5;border-radius:20px;padding:24px;margin:18px 0}.order-heading{display:flex;justify-content:space-between;align-items:center;gap:15px}.order-heading h4{font-size:22px;margin:5px 0 15px}.order-heading p{margin:0}.payment-state{padding:7px 12px;border-radius:20px;font-size:13px;background:#f8ecd1;white-space:nowrap}.payment-state.paid{background:#ddf4e8;color:#176348}.payment-state.refunded,.payment-state.cancelled{background:#eceff1}.order-summary{display:flex;gap:20px;flex-wrap:wrap;align-items:center;margin:10px 0 20px}.order-summary>strong{font-size:24px}.order-summary>span{font-size:14px}.order-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.order-actions button{width:auto;margin:0;font-size:14px}.order-lines{padding:0;list-style:none}.order-lines li{display:flex;justify-content:space-between;padding:8px 0;gap:12px}.history-pages{display:flex;justify-content:center;align-items:center;gap:18px}.profile-card{margin-top:32px;padding:20px;background:#f1f3f4;border-radius:18px}.profile-card summary{cursor:pointer;font-weight:650}.empty-campaign{padding:45px 20px;text-align:center;background:#eef5f2;border-radius:18px}#campaignDialog{border:0;border-radius:24px;padding:32px;max-width:660px;width:calc(100% - 32px);max-height:90vh;box-sizing:border-box;color:#163649;background:#fff}#campaignDialog::backdrop{background:#102e43aa}.dialog-close{float:right;border:0;border-radius:50%;background:#edf1f4;font-size:27px;width:40px;height:40px;cursor:pointer}.help-steps{padding-left:24px}.help-steps li{margin:18px 0}.help-steps strong{display:block}#pixCode{width:100%;min-height:95px;box-sizing:border-box;padding:12px}.upload-campaign{display:block;position:relative;overflow:hidden;padding:22px;background:#d8f2e8;border:2px dashed #459a87;border-radius:17px;text-align:center;font-size:20px;cursor:pointer}.upload-campaign input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}#mediaPreview img,#mediaPreview video{display:block;max-width:100%;max-height:300px;margin:18px auto;border-radius:14px}#campaignProgress{width:100%;height:16px;accent-color:#228e77}#portalMessage:empty{display:none}#portalMessage{padding:14px;border-radius:12px;background:#f8efdb}button:disabled{opacity:.55;cursor:not-allowed}[hidden]{display:none!important}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #3488c4;outline-offset:3px}@media(max-width:800px){.hour-choices{grid-template-columns:repeat(2,minmax(0,1fr))}.campaign-hero{grid-template-columns:1fr}.campaign-hero svg{display:none}.builder-heading{display:block}.builder-heading button{margin-bottom:12px}}@media(max-width:520px){.hour-choices{grid-template-columns:1fr}.campaign-hero{padding:23px}.budget-bar{padding:12px;top:5px}.budget-bar strong{font-size:24px}.budget-bar span{font-size:12px}.budget-bar button{font-size:13px;padding:12px}.campaign-nav button{padding:12px;font-size:14px}.order-card,.receipt{padding:18px}.order-heading{align-items:flex-start}.order-actions button{flex:1 1 145px}.history-heading{display:block}.history-pages{gap:9px;font-size:13px}.history-pages button{padding:10px}#campaignDialog{padding:22px}}
.category-filter{display:flex;flex-direction:column;gap:10px;margin:20px 0;font-weight:650}.category-filter select{width:100%;min-width:0;min-height:54px;padding:12px;border:1px solid #a6bbc6;border-radius:12px;background:#fff;color:#17384b;font:inherit;font-size:16px}.category-filter option:disabled{color:#87929a}.hour-editor{padding:24px;border:1px solid #b8d4cc;border-radius:18px;background:#f2faf7}.hour-editor h3{margin-top:0}.hour-purchase{display:flex;align-items:flex-end;gap:20px;flex-wrap:wrap}.hour-purchase>label{flex:1 1 180px;margin:0}.hour-purchase input{min-height:54px;font-size:20px;margin:10px 0 0;width:100%}.hour-purchase>.primary{width:auto;margin:0;min-height:54px}.item-total{flex:1 1 180px}.item-total span{display:block;font-size:13px}.item-total strong{display:block;font-size:26px;margin-top:8px}.receipt-item-actions{text-align:right}.receipt-item-actions>div{display:flex;gap:8px;margin-top:10px}.receipt-item-actions button{font-size:13px;padding:10px;min-height:40px}.receipt li{flex-wrap:wrap}.category-filter select:focus-visible{outline:3px solid #3488c4;outline-offset:3px}@media(max-width:520px){.hour-editor{padding:18px}.hour-purchase{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}.hour-purchase>.primary{width:100%}.receipt-total{font-size:19px}.receipt-item-actions{text-align:left}.receipt li{gap:10px}}

/* Clear hierarchy: supporting copy stays readable; fields and totals lead. */
#commercePortal .campaign-step{margin-top:22px;padding:24px;border:1px solid #dce5e6;border-radius:20px;background:#fff}
#commercePortal .step-heading{display:flex;align-items:center;gap:12px;margin:0 0 20px;font-size:21px;line-height:1.3;color:#183b4c}
#commercePortal .step-heading>span{display:inline-grid;place-items:center;flex:0 0 30px;height:30px;border-radius:50%;background:#e3f1ed;color:#176551;font-size:16px}
#commercePortal .builder-heading{align-items:flex-start;gap:12px}
#commercePortal .builder-heading .step-heading{margin-bottom:10px}
#commercePortal .compact-refresh{font-size:13px!important;padding:6px 10px;min-height:44px;margin:0}
#commercePortal p,#commercePortal .context-copy,#commercePortal .campaign-note,#commercePortal .purchase-details{font-size:14px!important;line-height:1.55;color:#354e5b}
#commercePortal .campaign-hero p{margin:12px 0}
#commercePortal .campaign-hero .eyebrow{font-size:11px!important}
#commercePortal #pricingNotice{margin:6px 0 20px;padding:9px 12px;border-radius:9px;background:#f0f5f4;font-size:13px!important}
#commercePortal .campaign-field,#commercePortal .category-filter,#commercePortal .hour-purchase>label{font-size:17px!important;color:#183b4c}
#commercePortal .campaign-field{margin-bottom:0}
#commercePortal input,#commercePortal select{font-size:18px!important;line-height:1.4;min-height:54px}
#commercePortal .category-filter{margin:18px 0;gap:6px}
#commercePortal .hour-editor{padding:18px;margin-top:18px}
#commercePortal .hour-editor h3{font-size:20px;margin:0 0 8px}
#commercePortal .hour-editor .context-copy{margin:0 0 18px}
#commercePortal #quantityHelp{margin-bottom:0;font-size:13px!important}
#commercePortal .item-total strong{font-size:28px}
#commercePortal .receipt{margin-top:22px}
#commercePortal .receipt .step-heading{margin-bottom:14px}
#commercePortal .purchase-details{margin:14px 0 20px}
#commercePortal .purchase-details summary{cursor:pointer;text-decoration:underline;text-underline-offset:3px}
#commercePortal .budget-bar>span{font-size:13px!important;line-height:1.4}
#commercePortal .budget-bar strong{font-size:27px}
#commercePortal .budget-bar button{font-size:15px!important}
#commercePortal .receipt li small{font-size:13px!important;line-height:1.5;color:#354e5b}
#commercePortal .receipt-total{font-size:22px!important}
#commercePortal .order-heading h4{font-size:23px;line-height:1.3}
#campaignDialog p,#campaignDialog .help-steps{font-size:14px!important;line-height:1.6;color:#354e5b}
#campaignDialog .help-steps strong{font-size:17px}
#campaignDialog .upload-campaign{font-size:20px!important}
@media(max-width:600px){
 body:has(#accountView:not([hidden])) main{padding:22px 14px;margin:12px 10px}
 #commercePortal .campaign-step{padding:18px 14px}
 #commercePortal .step-heading{font-size:20px;gap:9px}
 #commercePortal .builder-heading{display:flex}
 #commercePortal .builder-heading .step-heading{max-width:235px}
 #commercePortal .budget-bar{top:8px;padding:12px 14px;gap:10px}
 #commercePortal .budget-bar .primary{padding:10px 12px;min-height:46px;white-space:nowrap}
 #commercePortal .hour-editor{padding:16px 12px}
 #commercePortal .campaign-hero{padding:22px 18px}
 #commercePortal .receipt{padding:20px 14px}
}

#commercePortal .multi-hour-notice{display:flex;align-items:flex-start;gap:12px;margin:20px 0 16px;padding:16px;border:1px solid #b8d8c5;border-radius:14px;background:#edf8f0;color:#184c35}#commercePortal .multi-hour-notice svg{flex:0 0 26px;margin-top:2px}#commercePortal .multi-hour-notice strong{display:block;font-size:16px;line-height:1.4}#commercePortal .multi-hour-notice p{margin:7px 0 0;color:#284f3d;font-size:14px!important;line-height:1.55}