.tocc-account { max-width: 880px; margin: 2rem auto; border: 1px solid #bccbda; border-radius: 12px; overflow: hidden; color: #183047; background: #fff; font: 16px/1.55 system-ui, sans-serif; }
.tocc-account-brand { display: flex; gap: 1.5rem; align-items: center; padding: 2rem; background: linear-gradient(120deg,#071c32,#07589e); color: #fff; }
.tocc-account-brand h1 { color: #fff; margin: .3rem 0; font: 800 clamp(28px,5vw,44px)/1.2 system-ui,sans-serif; }
.tocc-account-brand p { margin: 0; font-size: .8rem; }
.tocc-account-number { display: grid; place-items: center; min-width: 80px; height: 80px; border: 3px solid #fff; border-radius: 6px; font-size: 38px; font-weight: 900; font-style: italic; }
.tocc-account-body { padding: clamp(1rem,4vw,2rem); }
.tocc-account h2 { font: 700 1.4rem/1.4 system-ui,sans-serif; color: #12344f; }
.tocc-account-form { margin: 1.5rem 0; padding: 1.5rem 0; border-top: 1px solid #d8e2eb; }
.tocc-account-form label { display: block; font-weight: 600; margin: 1rem 0; }
.tocc-account input:not([type=checkbox]):not([type=hidden]) { box-sizing: border-box; display: block; width: 100%; max-width: 520px; margin-top: .35rem; padding: .75rem; border: 1px solid #73899f; border-radius: 5px; background: #fff; color: #183047; font: inherit; }
.tocc-account button { font: 600 1rem/1.4 system-ui,sans-serif; background: #07589e; color: #fff; padding: .8rem 1.2rem; border: 2px solid #07589e; border-radius: 5px; cursor: pointer; }
.tocc-account a { color: #07589e; text-decoration: underline; }
.tocc-account nav { display: flex; flex-wrap: wrap; gap: 1rem; }
.tocc-account :focus-visible { outline: 3px solid #efad36; outline-offset: 3px; }
.tocc-account-error { background: #fff0ed; color: #912900; padding: 1rem; border-left: 4px solid #b43100; }
.tocc-account-notice { background: #ecf6ff; padding: 1rem; border-left: 4px solid #07589e; }
.tocc-account-honeypot { position: absolute; left: -9999px; }
.tocc-membership { background: #edf5fc; border: 1px solid #b4cbe1; border-radius: 8px; padding: 1.25rem; margin: 1rem 0; }
.tocc-membership form { display: inline-block; margin: .5rem .5rem 0 0; }
@media(max-width:480px) { .tocc-account-brand { padding: 1.25rem; gap: 1rem; } .tocc-account-number { min-width: 58px; height: 58px; font-size: 30px; } }