/* The same supplied 3D survivor in creation, the canonical HUD and paperdoll. */
.f8-avatar-canvas{display:block;width:100%;height:100%;image-rendering:auto;pointer-events:none}
.f8-character-creator .v12-gender-wrap{width:min(800px,100%)}
.f8-character-creator .v12-gender-grid{gap:20px;margin:18px 0 16px}
.f8-character-creator .v12-gender-card{display:grid;grid-template-rows:minmax(0,1fr) auto auto;justify-items:center;gap:8px;height:300px;padding:10px 14px 16px;overflow:hidden}
.f8-character-creator .v12-gender-label{font-size:23px}
.f8-character-creator .f8-gender-selected{font-size:10px}
.f8-character-creator .f8-gender-preview{width:100%;height:100%;min-height:0;pointer-events:auto;cursor:grab;touch-action:pan-y}
.f8-character-creator .f8-gender-preview:active{cursor:grabbing}
.f8-character-creator .v12-gender-mark{z-index:1}
.f8-appearance-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;text-align:left}
.f8-appearance-controls label{display:block;min-width:0;color:var(--cc-ui-muted);font-size:11px;letter-spacing:.1em}
.f8-appearance-controls label[hidden]{display:none}
.f8-appearance-controls select{display:block;width:100%;height:38px;margin-top:7px;padding:5px 12px;border:1px solid var(--cc-ui-panel-border);border-radius:var(--cc-ui-radius-control);background:#0b0d18;color:var(--cc-ui-control-text);font-family:var(--chronocairn-font);font-size:16px;letter-spacing:.025em;cursor:pointer;color-scheme:dark}
.f8-appearance-controls select:focus-visible{outline:2px solid var(--cc-ui-gold);outline-offset:2px}
.f8-preview-tools{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:10px;margin:12px 0;color:var(--cc-ui-muted);font-size:12px}
.f8-preview-tools button{min-width:34px;min-height:30px;margin:0;padding:3px 10px;border:1px solid var(--cc-ui-panel-border);border-radius:var(--cc-ui-radius-control);background:var(--cc-ui-control-fill);color:var(--cc-ui-gold);font-size:16px}
.f8-preview-tools button:hover{border-color:var(--cc-ui-gold)}
.f8-preview-tools button[hidden]{display:none}
.f8-character-creator .v12-primary:disabled{opacity:.5;cursor:wait}
.v12-creator-steps[hidden]{display:none}
#hud-player-portrait .f8-avatar-canvas{width:100%;height:100%;image-rendering:auto}
#inventory .v5-avatar #f8-character-portrait{display:block;width:100%;height:100%;min-height:0}
#inventory #f8-character-portrait .f8-avatar-canvas{width:100%;height:100%;filter:drop-shadow(0 10px 10px #0009)}
@media(max-height:850px){
  .f8-character-creator .v12-gender-screen{padding:16px 24px}
  .f8-character-creator .f8-creator-heading h2{font-size:30px;margin:7px 0}
  .f8-character-creator .v12-gender-card{height:270px;padding-block:8px 12px;gap:6px}
  .f8-character-creator .v12-gender-grid{margin:14px 0}
  .f8-character-creator .v12-gender-actions small{margin-top:10px}
}
@media(max-width:600px){
  .f8-character-creator .v12-gender-screen{padding:18px 14px}
  .f8-character-creator .v12-gender-grid{gap:12px}
  .f8-character-creator .v12-gender-card{height:230px;padding:6px 8px 14px}
  .f8-character-creator .v12-gender-label{font-size:21px}
  .f8-appearance-controls{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .f8-appearance-controls label:last-child{grid-column:1/-1}
  .f8-character-creator .f8-creator-heading h2{font-size:28px}
  .f8-character-creator .f8-creator-heading p{font-size:13px}
  .f8-preview-tools{font-size:11px;gap:8px}
}

/* Avatar presentation: a diegetic selection dais, not a plain form card.
   Decoration never intercepts character selection or the drag-to-rotate canvas. */
.f8-character-creator .v12-gender-card{
  isolation:isolate;
  border-color:#5c496a;
  background:
    linear-gradient(150deg,#e9d4950a 0%,transparent 30%),
    radial-gradient(ellipse at 50% 37%,#322843 0%,#161322 43%,#090b16 90%);
  box-shadow:inset 0 0 0 1px #ffffff09,inset 0 -25px 50px #02030b99,0 12px 26px #0005;
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease;
}
.f8-character-creator .v12-gender-card::before{
  content:"";position:absolute;inset:9px 9px 53px;z-index:-1;pointer-events:none;
  border:1px solid #cfb9801b;clip-path:polygon(0 0,100% 0,100% 100%,0 100%);
  background:radial-gradient(ellipse at 50% 34%,#bb9a6230,transparent 53%);
}
.f8-character-creator .v12-gender-card::after{
  content:"";position:absolute;left:24%;right:24%;bottom:61px;height:24px;z-index:-1;pointer-events:none;
  border:1px solid #dec17d5c;border-radius:50%;
  background:radial-gradient(ellipse,#d7b77923 0%,#53436915 52%,transparent 75%);
  box-shadow:0 0 18px #e9c8782c,0 0 0 9px #dbc37b09;
  transform:perspective(180px) rotateX(56deg);
}
.f8-character-creator .v12-gender-card:hover{transform:translateY(-2px);border-color:#c0a06b;box-shadow:inset 0 0 0 1px #ead39415,inset 0 -25px 50px #02030b99,0 12px 26px #0008;}
.f8-character-creator .v12-gender-card.selected{border-color:var(--cc-ui-gold);box-shadow:inset 0 0 0 1px #f4dfaa55,inset 0 -30px 55px #090916bb,0 0 0 2px #f1d68e2c,0 14px 30px #0009;}
.f8-character-creator .v12-gender-label,.f8-character-creator .f8-gender-selected{z-index:2;text-shadow:0 2px 6px #000c;}
.f8-character-creator .f8-gender-preview{position:relative;z-index:1;filter:drop-shadow(0 12px 12px #0009);}
.f8-appearance-controls{
  border-block:1px solid #ad8c4b24;
  background:linear-gradient(90deg,transparent,#e3c68a08,transparent);
  padding:15px 12px;
}
.f8-appearance-controls select{border-color:#716080;background:linear-gradient(180deg,#171326,#0c0c17);box-shadow:inset 0 1px #ffffff0b;}
.f8-character-creator .v12-primary:not(:disabled){box-shadow:inset 0 1px #fff4cf49,0 6px 22px #0009,0 0 0 1px #4b341d;}
@media(prefers-reduced-motion:reduce){.f8-character-creator .v12-gender-card{transition:none;}.f8-character-creator .v12-gender-card:hover{transform:none;}}