/* Character creation inherits the account frames; only its surfaces and hierarchy change. */
.zt-ma[data-account-subpage=character-create] .zt-cc-main-card {
 background:radial-gradient(ellipse at 4% 0,#a67b2426,transparent 60%),linear-gradient(135deg,#251e13,#151711 55%,#0e1514);
 box-shadow:inset 0 1px #ffe2a138,inset 0 -2px #000b,inset 0 0 0 3px #c1973712,0 5px 12px #0005;
}
.zt-ma[data-account-subpage=character-create] .zt-cc-preview-card {
 background:radial-gradient(ellipse at 95% 0,#36546630,transparent 62%),linear-gradient(150deg,#23251b,#111c20 65%,#15150f);
 box-shadow:inset 0 1px #ffe2a138,inset 0 -2px #000b,inset 0 0 0 3px #c1973712,0 5px 12px #0006;
}
.zt-ma[data-account-subpage=character-create] .zt-cc-step>legend {
 color:#ffe8b6;text-shadow:0 1px 2px #000,0 0 12px #d6a74b20;
}
.zt-ma[data-account-subpage=character-create] .zt-cc-step>legend>span {
 display:inline-grid;place-items:center;box-sizing:border-box;min-width:20px;height:20px;
 border:1px solid #d7ac5c9c;border-radius:50%;color:#fff0c5;
 background:radial-gradient(circle at 35% 15%,#91703b,#3b2b15 72%);
 box-shadow:inset 0 1px #ffe8a855,0 2px 3px #0007;
 font-size:11px;line-height:1;vertical-align:middle;
}
.zt-ma[data-account-subpage=character-create] .zt-cc-step+.zt-cc-step::before {opacity:1;filter:drop-shadow(0 1px #000)}
.zt-ma[data-account-subpage=character-create] .zt-cc-step-description {color:#cfc2a7}
.zt-ma[data-account-subpage=character-create] .zt-cc-name-wrap {
 border-color:#b38d4b9c;background:linear-gradient(#091416,#152323);
 box-shadow:inset 0 2px 5px #0009,inset 0 -1px #cfb2741f,0 1px #ffe3a515;
}
.zt-ma[data-account-subpage=character-create] .zt-cc-name-wrap:focus-within {
 border-color:#f5cf7a;box-shadow:inset 0 2px 5px #0008,0 0 0 2px #e3b95c30,0 0 12px #e3b95c16;
}
.zt-ma[data-account-subpage=character-create] .zt-cc-name-wrap:has([aria-invalid=true]) {border-color:#f29c80;box-shadow:inset 0 2px 5px #0008,0 0 0 2px #db765b28}
#realm-route-content .zt-ma[data-account-subpage=character-create] .zt-cc input[type=text]::placeholder {color:#b4ae99}
.zt-ma[data-account-subpage=character-create] .zt-cc-help {color:#bfb293}
.zt-ma[data-account-subpage=character-create] .zt-cc-gender-choice>input:checked+span {
 border-color:#edc56c;background:linear-gradient(135deg,#76582d,#3b331e);
 color:#fff1cf;box-shadow:inset 0 1px #ffebae59,inset 0 -1px #0009,0 2px 5px #0004;
}
#realm-route-content .zt-ma[data-account-subpage=character-create] .zt-cc :is(.zt-cc-carousel-arrow,.zt-cc-outfit-thumb) {
 border-color:#98804c8c;background:linear-gradient(145deg,#2e3023,#122023 85%);
 box-shadow:inset 0 1px #f5dfad26,inset 0 -2px #0008;
}
#realm-route-content .zt-ma[data-account-subpage=character-create] .zt-cc .zt-cc-outfit-thumb[aria-pressed=true] {
 border-color:#f2cd76;background:radial-gradient(ellipse at 50% 0,#c8993f55,transparent 80%),linear-gradient(#514226,#22302a);
 box-shadow:inset 0 1px #fff0b67a,inset 0 -2px #0009,0 0 0 1px #d4ae554d,0 0 7px #d4ae5524;
}
#realm-route-content .zt-ma[data-account-subpage=character-create] .zt-cc .zt-cc-outfit-thumb[aria-pressed=true]::after {
 content:'✓';position:absolute;top:1px;right:2px;color:#ffe7a1;font:700 9px/1.2 'Source Sans 3',sans-serif;text-shadow:0 1px 2px #000;pointer-events:none;
}
#realm-route-content .zt-ma[data-account-subpage=character-create] .zt-cc :is(.zt-cc-carousel-arrow,.zt-cc-outfit-thumb):hover {
 border-color:#f5d68f;background:linear-gradient(145deg,#5d4e2c,#243127);
 box-shadow:inset 0 1px #fff0b66b,inset 0 -2px #0009,0 0 6px #d9b36024;
}
#realm-route-content .zt-ma[data-account-subpage=character-create] .zt-cc :is(.zt-cc-carousel-arrow,.zt-cc-outfit-thumb):active {
 border-color:#f9d888;background:linear-gradient(#201b12,#3c3720);box-shadow:inset 0 2px 5px #000b;
}
#realm-route-content .zt-ma[data-account-subpage=character-create] .zt-cc :is(.zt-cc-carousel-arrow,.zt-cc-outfit-thumb):focus-visible {
 outline:2px solid #a7e3f4;outline-offset:2px;
}
.zt-ma[data-account-subpage=character-create] .zt-cc-colors {
 border-color:#b28a4799;background:linear-gradient(115deg,#41321e,#1a2725 85%);
 box-shadow:inset 0 1px #ffe5aa38,inset 0 -1px #0009,0 2px 4px #0004;
}
.zt-ma[data-account-subpage=character-create] .zt-cc-colors>summary {color:#ffebbd;text-shadow:0 1px 2px #000}
.zt-ma[data-account-subpage=character-create] .zt-cc-colors>summary:focus-visible {outline:2px solid #a7e3f4;outline-offset:2px}
.zt-ma[data-account-subpage=character-create] .zt-cc-vocation-fixed {
 border-color:#b28e4a9c;background:radial-gradient(ellipse at 0 10%,#b68a2c28,transparent 70%),linear-gradient(110deg,#273024,#112522);
 box-shadow:inset 0 1px #ffe7b02b,inset 0 -1px #0008;
}
.zt-ma[data-account-subpage=character-create] .zt-cc-vocation-fixed strong {color:#f9df9d}
.zt-ma[data-account-subpage=character-create] .zt-cc-vocation-fixed p {color:#c5bba3}
.zt-ma[data-account-subpage=character-create] .zt-cc-path-emblem {background:radial-gradient(circle at 40% 20%,#b9913b66,#293124);border-color:#d0a6508c;box-shadow:inset 0 1px #ffe8a344,0 2px 5px #0006}
.zt-ma[data-account-subpage=character-create] .zt-cc-preview-card>header h2,
.zt-ma[data-account-subpage=character-create] .zt-cc-summary-title {color:#ffe6b0;text-shadow:0 1px 3px #000}
.zt-ma[data-account-subpage=character-create] .zt-cc-stage {border-color:#c2a060b3;box-shadow:inset 0 0 0 2px #0005,0 4px 10px #0007}
.zt-ma[data-account-subpage=character-create] .zt-cc-summary {border-color:#b28c4b73;background:linear-gradient(120deg,#26302b8c,#0b191dcc);box-shadow:inset 0 1px #ffe1a31a,inset 0 2px 5px #0004}
.zt-ma[data-account-subpage=character-create] .zt-cc-summary>div:nth-child(odd) {background:#d3b26007}
.zt-ma[data-account-subpage=character-create] .zt-cc-summary dt {color:#c3bba7}
.zt-ma[data-account-subpage=character-create] .zt-cc-summary dd {color:#fff0cf;font-weight:600;text-shadow:0 1px 2px #000}
.zt-ma[data-account-subpage=character-create] .zt-cc-information {border-color:#6796a77d;background:linear-gradient(120deg,#233c42bf,#13242ae6);box-shadow:inset 0 1px #bce9f01a}
.zt-ma[data-account-subpage=character-create] .zt-cc-information>span {color:#b9edfc;border-color:#91d4e7;box-shadow:0 0 7px #80cadd26}
.zt-ma[data-account-subpage=character-create] .zt-cc-information>p {color:#d8e2dd}
/* Keep the existing gold normal/hover/pressed atlas; add depth around its surface. */
#realm-route-content .zt-ma[data-account-subpage=character-create] .zt-cc .zt-cc-submit:not(:disabled) {box-shadow:0 3px 0 #4a2e11,0 5px 12px #0009,0 0 13px #d7a63c26}
#realm-route-content .zt-ma[data-account-subpage=character-create] .zt-cc .zt-cc-submit:not(:disabled):hover {box-shadow:0 3px 0 #51320f,0 5px 12px #0009,0 0 17px #e5b64a40}
#realm-route-content .zt-ma[data-account-subpage=character-create] .zt-cc .zt-cc-submit:not(:disabled):active {box-shadow:inset 0 2px 4px #0004,0 1px 0 #4a2e11,0 2px 5px #0008}
#realm-route-content .zt-ma[data-account-subpage=character-create] .zt-cc .zt-cc-submit:focus-visible {outline:2px solid #b8edff;outline-offset:3px}
/* Shared vocation guide: artwork and role copy never change native availability or IDs. */
.zt-ma[data-account-subpage=character-create] .zt-cc-vocations {grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.zt-ma[data-account-subpage=character-create] .zt-cc-vocation {--vocation-accent:#d4b878;--vocation-glow:#b99a4b23;min-width:0}
.zt-ma[data-account-subpage=character-create] .zt-cc-vocation[data-cc-vocation-art=sorcerer] {--vocation-accent:#d3a5fb;--vocation-glow:#a46bd526}
.zt-ma[data-account-subpage=character-create] .zt-cc-vocation[data-cc-vocation-art=druid] {--vocation-accent:#9ee2b1;--vocation-glow:#48b77926}
.zt-ma[data-account-subpage=character-create] .zt-cc-vocation[data-cc-vocation-art=paladin] {--vocation-accent:#f5cc83;--vocation-glow:#cb973126}
.zt-ma[data-account-subpage=character-create] .zt-cc-vocation[data-cc-vocation-art=knight] {--vocation-accent:#a2c8f0;--vocation-glow:#548cc426}
.zt-ma[data-account-subpage=character-create] .zt-cc-vocation[data-cc-vocation-art=monk] {--vocation-accent:#9cddd4;--vocation-glow:#3fbaaa26}
.zt-ma[data-account-subpage=character-create] .zt-cc-vocation>input {z-index:2;cursor:pointer;margin:0}
.zt-ma[data-account-subpage=character-create] .zt-cc-vocation>input+span {position:relative;display:grid;grid-template-columns:68px minmax(0,1fr);align-items:center;gap:8px;min-height:112px;height:100%;box-sizing:border-box;padding:10px 22px 10px 8px;border:1px solid #92734099;border-radius:4px;background:radial-gradient(ellipse at 0 30%,var(--vocation-glow),transparent 85%),linear-gradient(135deg,#24231d,#101a1b);box-shadow:inset 0 1px #ffe4a621,inset 0 -2px #0009,0 2px 5px #0005;transition:border-color .15s,background-color .15s,box-shadow .15s}
.zt-ma[data-account-subpage=character-create] .zt-cc-vocation-art {display:block;width:68px;height:76px;object-fit:contain;filter:drop-shadow(0 3px 3px #0009)}
.zt-ma[data-account-subpage=character-create] .zt-cc-vocation-copy {display:flex;min-width:0;flex-direction:column;gap:4px;text-align:left}
.zt-ma[data-account-subpage=character-create] .zt-cc-vocation-copy strong {color:#fff0d0;font:600 13px/1.3 'Cinzel',serif;white-space:normal;text-shadow:0 1px 2px #000}
.zt-ma[data-account-subpage=character-create] .zt-cc-vocation-role {color:var(--vocation-accent);font:600 11px/1.25 'Source Sans 3',sans-serif;letter-spacing:.2px}
.zt-ma[data-account-subpage=character-create] .zt-cc-vocation-description {color:#cbc9b9;font:400 11px/1.4 'Source Sans 3',sans-serif;white-space:normal}
.zt-ma[data-account-subpage=character-create] .zt-cc-vocation-check {position:absolute;top:8px;right:7px;display:grid;place-items:center;width:14px;height:14px;border:1px solid #8c7849;border-radius:50%;color:transparent;font:700 10px/1 sans-serif;font-style:normal;background:#080e10}
.zt-ma[data-account-subpage=character-create] .zt-cc-vocation>input:hover+span {border-color:var(--vocation-accent);box-shadow:inset 0 1px #ffe8b735,inset 0 -2px #0009,0 0 10px var(--vocation-glow)}
.zt-ma[data-account-subpage=character-create] .zt-cc-vocation>input:checked+span {border-color:#f5cf7c;background:radial-gradient(ellipse at 0 20%,var(--vocation-glow),transparent 100%),linear-gradient(125deg,#42351d,#172627);box-shadow:inset 0 1px #ffeab25c,inset 0 0 0 1px #c49e464d,0 0 8px #dfb85624}
.zt-ma[data-account-subpage=character-create] .zt-cc-vocation>input:checked+span .zt-cc-vocation-check {color:#291d08;background:#f7d27d;border-color:#ffecad;box-shadow:0 0 6px #e2b95533}
.zt-ma[data-account-subpage=character-create] .zt-cc-vocation>input:active+span {background-color:#090e0d;box-shadow:inset 0 2px 6px #000b}
.zt-ma[data-account-subpage=character-create] .zt-cc-vocation>input:focus-visible+span {outline:2px solid #b8edff;outline-offset:2px}
.zt-ma[data-account-subpage=character-create] .zt-cc-vocation-fixed {gap:12px;align-items:center}
.zt-ma[data-account-subpage=character-create] .zt-cc-path-emblem {flex:0 0 72px;width:72px;height:76px;border:0;border-radius:0;background:none;box-shadow:none}
.zt-ma[data-account-subpage=character-create] .zt-cc-path-emblem img {display:block;width:72px;height:76px;object-fit:contain;filter:drop-shadow(0 3px 3px #0008)}
.zt-ma[data-account-subpage=character-create] [data-cc-fixed-role] {display:block;margin:4px 0;color:#d7c48b;font-size:11px;font-weight:600}
@media(max-width:620px) {
 .zt-ma[data-account-subpage=character-create] .zt-cc-vocations {grid-template-columns:minmax(0,1fr)}
 .zt-ma[data-account-subpage=character-create] .zt-cc-vocation>input+span {min-height:100px;grid-template-columns:64px minmax(0,1fr)}
 .zt-ma[data-account-subpage=character-create] .zt-cc-vocation-art {width:64px;height:72px}
 .zt-ma[data-account-subpage=character-create] .zt-cc-vocation-description {font-size:12px}
}
@media(prefers-reduced-motion:reduce) {.zt-ma[data-account-subpage=character-create] .zt-cc-vocation>input+span {transition:none}}
/* Premium keeps the compact five-thumbnail window; arrows reveal the remaining outfits. */
.zt-ma[data-account-subpage=character-create] .zt-cc-outfit-thumbs {--outfit-gap:4px;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:calc((100% - 4 * var(--outfit-gap)) / 5);gap:var(--outfit-gap);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#9f7d3d #111a17;padding-bottom:3px}
.zt-ma[data-account-subpage=character-create] .zt-cc-outfit-thumb {scroll-snap-align:start}
.zt-ma[data-account-subpage=character-create] .zt-cc-outfit-access {display:flex;align-items:center;flex-wrap:wrap;gap:5px 8px;margin:5px 0 9px;padding:7px 9px;border:1px solid #8b774a66;border-radius:3px;background:#10201f8c;font:11px/1.35 'Source Sans 3',sans-serif;color:#d0c7b2}
.zt-ma[data-account-subpage=character-create] .zt-cc-outfit-access>svg {width:15px;height:15px;color:#d4b878}
.zt-ma[data-account-subpage=character-create] .zt-cc-outfit-access>strong {color:#eee4c9;font-weight:600}
.zt-ma[data-account-subpage=character-create] .zt-cc-outfit-access.is-premium {border-color:#d1aa5799;background:linear-gradient(110deg,#5c431d77,#18322b88)}
.zt-ma[data-account-subpage=character-create] .zt-cc-outfit-access.is-premium :is(strong,svg) {color:#ffe1a0}
.zt-ma[data-account-subpage=character-create] .zt-cc-thumb-premium {position:absolute;left:2px;top:2px;z-index:1;color:#ffe1a0;font:700 8px/1.2 'Source Sans 3',sans-serif;text-shadow:0 1px 2px #000;pointer-events:none}
@media(min-width:621px) and (max-width:1100px) {.zt-ma[data-account-subpage=character-create] .zt-cc-outfit-thumbs {--outfit-gap:3px}}

/* Fit fetched sprites by visible alpha bounds, preserving a shared foot baseline. */
.zt-ma[data-account-subpage=character-create] .zt-cc-outfit-thumb[data-cc-outfit-id=noble][data-cc-sex="1"] { --zt-thumb-center:47.5;--zt-thumb-bottom:64 }
.zt-ma[data-account-subpage=character-create] .zt-cc-outfit-thumb[data-cc-outfit-id=noble][data-cc-sex="0"] { --zt-thumb-center:48.0;--zt-thumb-bottom:63 }
.zt-ma[data-account-subpage=character-create] .zt-cc-outfit-thumb[data-cc-outfit-id=summoner][data-cc-sex="1"] { --zt-thumb-center:45.0;--zt-thumb-bottom:64 }
.zt-ma[data-account-subpage=character-create] .zt-cc-outfit-thumb[data-cc-outfit-id=summoner][data-cc-sex="0"] { --zt-thumb-center:47.0;--zt-thumb-bottom:64 }
.zt-ma[data-account-subpage=character-create] .zt-cc-outfit-thumb[data-cc-outfit-id=warrior][data-cc-sex="1"] { --zt-thumb-center:46.5;--zt-thumb-bottom:64 }
.zt-ma[data-account-subpage=character-create] .zt-cc-outfit-thumb[data-cc-outfit-id=warrior][data-cc-sex="0"] { --zt-thumb-center:48.0;--zt-thumb-bottom:64 }
.zt-ma[data-account-subpage=character-create] .zt-cc-outfit-thumb[data-cc-outfit-id=barbarian][data-cc-sex="1"] { --zt-thumb-center:45.5;--zt-thumb-bottom:64 }
.zt-ma[data-account-subpage=character-create] .zt-cc-outfit-thumb[data-cc-outfit-id=barbarian][data-cc-sex="0"] { --zt-thumb-center:45.5;--zt-thumb-bottom:64 }
.zt-ma[data-account-subpage=character-create] .zt-cc-outfit-thumb[data-cc-outfit-id=druid][data-cc-sex="1"] { --zt-thumb-center:46.0;--zt-thumb-bottom:64 }
.zt-ma[data-account-subpage=character-create] .zt-cc-outfit-thumb[data-cc-outfit-id=druid][data-cc-sex="0"] { --zt-thumb-center:47.0;--zt-thumb-bottom:64 }
.zt-ma[data-account-subpage=character-create] .zt-cc-outfit-thumb[data-cc-outfit-id=wizard][data-cc-sex="1"] { --zt-thumb-center:46.0;--zt-thumb-bottom:64 }
.zt-ma[data-account-subpage=character-create] .zt-cc-outfit-thumb[data-cc-outfit-id=wizard][data-cc-sex="0"] { --zt-thumb-center:46.5;--zt-thumb-bottom:64 }
.zt-ma[data-account-subpage=character-create] .zt-cc-outfit-thumb[data-cc-outfit-id=oriental][data-cc-sex="1"] { --zt-thumb-center:48.0;--zt-thumb-bottom:64 }
.zt-ma[data-account-subpage=character-create] .zt-cc-outfit-thumb[data-cc-outfit-id=oriental][data-cc-sex="0"] { --zt-thumb-center:48.0;--zt-thumb-bottom:64 }
/* Keep the step number as accessible HTML over an illustrated reusable medallion. */
.zt-ma[data-account-subpage=character-create] .zt-cc-step>legend>span {
 width:32px;min-width:32px;height:32px;margin-right:2px;padding:0;border:0;border-radius:0;
 background:transparent url('assets/account-icons/step-medallion-v1.webp') center/contain no-repeat;
 color:#fff0c2;font:600 12px/1 'Cinzel',serif;text-shadow:0 1px 2px #000;box-shadow:none;
 filter:drop-shadow(0 1px 2px #0008);vertical-align:middle;
}
@media(max-width:620px) {.zt-ma[data-account-subpage=character-create] .zt-cc-step>legend>span {width:30px;min-width:30px;height:30px;font-size:12px}}
