/* Account identity follows the PWU blue/cyan panels and yellow calls to action. */
.profile-wrap { width: calc(100% - 48px); max-width: 1120px; margin: 0 auto; }
.profile-editor { border: 1px solid #448dc1; border-radius: 26px; overflow: hidden; background: radial-gradient(ellipse at 0 0, #234b60 0, transparent 65%), #122447; color: #fff; box-shadow: 0 24px 80px #03091b35; }
.profile-editor__heading { padding: 30px 34px 24px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-bottom: 1px solid #ffffff12; }
.profile-eyebrow { color: #89e9f6; font: 500 11px var(--montreal); letter-spacing: .16em; text-transform: uppercase; margin-bottom: 8px; }
.profile-editor h2 { font: 400 42px/1 var(--bebas); letter-spacing: .01em; }
.profile-editor h2 span { color: #fcd05c; }
.profile-editor__intro { color: #b8c9df; font: 400 14px/1.6 var(--montreal); margin-top: 10px; }
.profile-editor__badge { padding: 8px 12px; border: 1px solid #70f5ff38; border-radius: 30px; color: #9cecf4; font: 500 11px var(--montreal); white-space: nowrap; }
.profile-editor__body { display: grid; grid-template-columns: 330px minmax(0,1fr); gap: 30px; padding: 30px 34px; }
.profile-preview-panel { align-self: start; }
.profile-preview { width: 100%; aspect-ratio: 3 / 4; border: 0; border-radius: 0; overflow: visible; box-shadow: 0 12px 30px #0005; background: transparent; }
.profile-preview svg { display: block; width: 100%; height: 100%; }
.profile-tabs { display: flex; padding: 5px; border-radius: 13px; background: #07142d; gap: 6px; margin-bottom: 22px; }
.profile-tabs button { flex: 1; min-height: 46px; padding: 8px; border: 1px solid transparent; border-radius: 10px; color: #a5bad5; background: transparent; cursor: pointer; font: 500 14px var(--montreal); }
.profile-tabs button[aria-selected="true"] { background: linear-gradient(110deg,#25405f,#183359); color: #fff; border-color: #70f5ff55; box-shadow: 0 2px 12px #0002; }
.profile-tabs button span { margin-left: 5px; color: #81d9ef; font-size: 11px; }
.profile-panel[hidden] { display: none !important; }
.profile-panel__heading { font: 500 16px var(--montreal); margin-bottom: 6px; }
.profile-panel__text { font: 400 12px/1.5 var(--montreal); color: #9eb2cd; margin-bottom: 18px; }
.profile-choice { position: relative; min-width: 0; padding: 5px; border: 1px solid #647c9d55; border-radius: 13px; background: #172c4a; color: #d7e6f8; cursor: pointer; transition: border-color .15s, background .15s, transform .15s; }
.profile-choice:hover { transform: translateY(-2px); border-color: #72e8f4; background: #25425f; }
.profile-choice[aria-pressed="true"] { border: 2px solid #f4c550; padding: 4px; background: #3c3b36; box-shadow: 0 0 0 2px #f4c55012; }
.profile-choice__art { display: block; aspect-ratio: 3 / 4; border-radius: 0; overflow: visible; background: transparent; }
.profile-choice__art svg { display: block; width: 100%; height: 100%; }
.profile-choice__label { display: flex; justify-content: center; align-items: center; min-height: 36px; font: 500 13px/1.25 var(--montreal); text-align: center; padding: 6px 1px 2px; }
.profile-choice__check { display: none; position: absolute; right: 5px; top: 5px; width: 21px; height: 21px; border-radius: 50%; background: #fcd05c; color: #112542; font: 700 13px/21px Arial,sans-serif; text-align: center; box-shadow: 0 2px 6px #0005; }
.profile-choice[aria-pressed="true"] .profile-choice__check { display: block; }
.profile-choice--card .profile-choice__art { aspect-ratio: 3 / 4; background: transparent; }
.profile-choice--card img { display: block; width: 100%; height: 100%; object-fit: contain; padding: 7px; }
.profile-choice__empty { display: grid; place-items: center; background: radial-gradient(ellipse at center,#2c4d73,#102040); color: #75a1d144; font: 400 40px var(--bebas); }
.profile-editor__footer { display: flex; gap: 24px; justify-content: space-between; align-items: center; padding: 22px 34px; background: #07162b66; border-top: 1px solid #ffffff12; }
.profile-editor__message { margin: 0; max-width: 480px; color: #9eb5d2; font: 400 12px/1.5 var(--montreal); }
.profile-editor__message.is-error { color: #ffb6b6; }
.profile-actions { margin-left: auto; display: flex; gap: 10px; flex-shrink: 0; }
.profile-actions button { min-height: 46px; border-radius: 24px; padding: 10px 24px; font: 400 19px var(--bebas); letter-spacing: .025em; cursor: pointer; }
.profile-restore { border: 1px solid #7088ae66; background: transparent; color: #c1d1e8; }
.profile-save { border: 0; color: #122447; background: var(--grad-yellow); }
.profile-actions button:disabled { opacity: .5; cursor: default; }
.profile-editor button:focus-visible { outline: 3px solid #83f0ff; outline-offset: 4px; }
.profile-choice:disabled { cursor: wait; }
@media (max-width: 1050px) {
  .profile-editor__body { grid-template-columns: 260px minmax(0,1fr); gap: 24px; }
}
@media (max-width: 720px) {
  .profile-wrap { width: calc(100% - 28px); }
  .profile-editor__heading { padding: 24px 20px; }
  .profile-editor__badge { display: none; }
  .profile-editor h2 { font-size: 35px; }
  .profile-editor__body { display: block; padding: 20px; }
  .profile-preview-panel { width: min(100%,300px); margin: 0 auto 24px; }
  .profile-tabs button { font-size: 13px; }
  .profile-editor__footer { padding: 20px; flex-direction: column; align-items: stretch; gap: 16px; }
  .profile-actions button { flex: 1; padding: 10px 12px; }
}
@media (prefers-reduced-motion: reduce) { .profile-choice { transition: none; } }

.profile-editor__message:empty { display: none; }
@media (max-width: 720px) { .profile-actions { margin-left: 0; } }

/* Exactly three choices per viewport; touch scrolling remains native. */
.profile-options { min-width: 0; }
.profile-grid { --profile-gap: 12px; position: relative; display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 2 * var(--profile-gap)) / 3); gap: var(--profile-gap); width: 100%; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: #dfb74f #07162b; padding: 3px 0 12px; }
.profile-grid::-webkit-scrollbar { height: 8px; }
.profile-grid::-webkit-scrollbar-track { background: #07162b; border-radius: 8px; }
.profile-grid::-webkit-scrollbar-thumb { background: #dfb74f; border-radius: 8px; }
.profile-grid > .profile-choice { scroll-snap-align: start; }
.profile-grid > .profile-choice:hover { transform: none; }
.profile-grid > .profile-choice:focus-visible { outline-offset: -3px; }
.profile-carousel__controls { display: flex; align-items: center; justify-content: center; gap: 18px; padding-top: 8px; }
.profile-carousel__controls button { display: grid; place-items: center; width: 44px; height: 44px; flex: 0 0 44px; padding: 0; border: 1px solid #f3ca65; border-radius: 11px; background: linear-gradient(145deg,#284969,#122847); color: #ffda71; cursor: pointer; }
.profile-carousel__controls button span { font: 400 32px/1 Arial,sans-serif; margin-top: -3px; }
.profile-carousel__controls button:hover:not(:disabled) { background: #fcd05c; color: #122447; }
.profile-carousel__controls button:disabled { opacity: .3; cursor: default; }
.profile-carousel__controls [data-range] { min-width: 80px; text-align: center; color: #b8cee7; font: 500 12px/1.3 var(--montreal); font-variant-numeric: tabular-nums; }
@media (max-width: 720px) { .profile-grid { --profile-gap: 10px; } }