.charprofile-wrap {width: min(96vw, 1500px);margin: 40px auto;background: rgba(14,22,32,0.45);border: 1px solid rgba(170,210,160,0.08);backdrop-filter: blur(6px);}

.charprofile-header {position: relative;min-height: 260px;padding: 58px 70px 78px;background: linear-gradient(rgba(11,17,25,0.62), rgba(11,17,25,0.86)),url(https://f2.toyhou.se/file/f2-toyhou-se/images/100689333_KZyN65uEzL5In5R.png);background-size: cover;background-position: center;overflow: visible;}

.charprofile-avatarcrest {position: absolute;left: 55px;bottom: -52px;width: 145px;height: 145px;padding: 6px;background: #0b1119;border: 1px solid rgba(170,210,160,0.22);box-shadow: 0 0 25px rgba(0,0,0,0.45);z-index: 5;}

.charprofile-avatarcrest img {width: 100%;height: 100%;display: block;object-fit: cover;border: 4px solid #121B26;}

.charprofile-bgname {position: relative;z-index: 1;font-family: 'DM Serif Display', serif;font-size: clamp(58px, 6vw, 110px);color: rgba(160,181,198,0.08);text-transform: uppercase;line-height: 0.95;}

.charprofile-name {position: relative;z-index: 3;margin-top: -55px;margin-left: 175px;text-align: left;font-family: 'DM Serif Display', serif;font-size: clamp(38px, 4vw, 68px);color: #8DAEC0;text-transform: uppercase;letter-spacing: 3px;}

.charprofile-subtitle {position: relative;z-index: 3;margin-top: 8px;margin-left: 175px;text-align: left;color: #E7EEF4;font-size: 11px;letter-spacing: 3px;text-transform: uppercase;}

.charprofile-topstats {margin-top: 20px;padding-left: 210px;display: grid;grid-template-columns: repeat(4, 1fr);border-top: 1px solid rgba(170,210,160,0.08);border-bottom: 1px solid rgba(170,210,160,0.08);}

.charprofile-stat {padding: 18px 14px;background: rgba(255,255,255,0.018);border-right: 1px solid rgba(170,210,160,0.08);border-bottom: 1px solid rgba(170,210,160,0.08);text-align: center;}

.charprofile-stat(4n) {border-right: none;}

.charprofile-stat span,.charprofile-moodbar span,.charprofile-health-label span,.charprofile-skillbox span,.charprofile-contentbox span {display: block;color: #b6d78a;font-size: 9px;font-weight: bold;letter-spacing: 1.8px;text-transform: uppercase;margin-bottom: 6px;}

.charprofile-stat b,.charprofile-moodbar b,.charprofile-health-label b,.charprofile-skillbox b,.charprofile-contentbox b {display: block;color: #d8d2c5;font-family: Georgia, serif;font-size: 13px;font-weight: normal;letter-spacing: 1px;text-transform: uppercase;}

.charprofile-moodbar {padding: 18px 20px;text-align: center;background: rgba(255,255,255,0.025);border-bottom: 1px solid rgba(170,210,160,0.08);}

.charprofile-moodbar b {color: rgba(231,238,244,0.55);font-size: 11px;font-style: italic;letter-spacing: 2px;}

.charprofile-systemrow {display: grid;grid-template-columns: 2fr 1fr 1fr 1fr;gap: 10px;padding: 22px;border-bottom: 1px solid rgba(170,210,160,0.08);}

.charprofile-healthbox,.charprofile-skillbox,.charprofile-contentbox {background: rgba(255,255,255,0.025);border: 1px solid rgba(170,210,160,0.10);padding: 14px;text-align: center;}

.charprofile-health-label {display: flex;justify-content: space-between;align-items: center;margin-bottom: 8px;}

.charprofile-health-label span,.charprofile-health-label b {margin-bottom: 0;}

.charprofile-health-bar {width: 100%;height: 10px;background: #0b1119;border: 1px solid rgba(170,210,160,0.2);overflow: hidden;}

.charprofile-health-fill {height: 100%;background: linear-gradient(90deg, #4f829c, #b6d78a);}

.charprofile-contentrow {display: grid;grid-template-columns: 1fr 2fr 1fr 1fr;gap: 10px;padding: 0 22px 22px;border-bottom: 1px solid rgba(170,210,160,0.08);}

.charprofile-warningbox b {text-transform: lowercase;font-size: 12px;line-height: 1.4;}

.charprofile-body {padding: 42px;}

.charprofile-section {margin-bottom: 24px;background: rgba(255,255,255,0.02);border: 1px solid rgba(170,210,160,0.08);}

.charprofile-splitrow {display: grid;grid-template-columns: 1fr 1fr;gap: 24px;}

.charprofile-splitrow .charprofile-section {margin-bottom: 0;}

.charprofile-title {padding: 14px 18px;background: rgba(255,255,255,0.03);color: #b6d78a;text-transform: uppercase;letter-spacing: 2px;font-size: 10px;font-weight: bold;}

.charprofile-traits-grid {display: grid;grid-template-columns: repeat(3, 1fr);border-bottom: 1px solid rgba(170,210,160,0.08);}

.charprofile-trait {padding: 18px 14px;background: rgba(255,255,255,0.018);border-right: 1px solid rgba(170,210,160,0.08);border-bottom: 1px solid rgba(170,210,160,0.08);text-align: center;}

.charprofile-trait(3n) {border-right: none;}

.charprofile-trait span {display: block;color: #b6d78a;font-size: 9px;font-weight: bold;letter-spacing: 1.8px;text-transform: uppercase;margin-bottom: 6px;}

.charprofile-trait b {display: block;color: #d8d2c5;font-family: Georgia, serif;font-size: 13px;font-weight: normal;letter-spacing: 1px;text-transform: uppercase;}

.charprofile-text {padding: 24px;color: #d8d2c5;font-family: 'EB Garamond', serif;font-size: 15px;line-height: 1.8;text-align: justify;}

.charprofile-appearance-grid {display: grid;grid-template-columns: minmax(320px, 40%) 1fr;gap: 28px;padding: 24px;align-items: start;}

.charprofile-appearance-image {width: 100%;}

.charprofile-refsheet {width: 100%;display: block;border: 1px solid rgba(170,210,160,0.12);}

.charprofile-appearance-details {display: grid;grid-template-columns: 1fr 1fr;margin-bottom: 18px;border: 1px solid rgba(170,210,160,0.08);}

.charprofile-appearance-stat {padding: 16px 14px;background: rgba(255,255,255,0.018);border-right: 1px solid rgba(170,210,160,0.08);text-align: center;}

.charprofile-appearance-stat {border-right: none;}

.charprofile-appearance-stat span {display: block;color: #b6d78a;font-size: 9px;font-weight: bold;letter-spacing: 1.8px;text-transform: uppercase;margin-bottom: 6px;}

.charprofile-appearance-stat b {display: block;color: #d8d2c5;font-family: Georgia, serif;font-size: 13px;font-weight: normal;letter-spacing: 1px;text-transform: uppercase;}

.charprofile-appearance-text {color: #d8d2c5;font-family: 'EB Garamond', serif;font-size: 15px;line-height: 1.8;text-align: justify;}

@media (max-width: 900px) {.charprofile-wrap {width: 96vw;}

.charprofile-header {padding: 35px 24px 45px;min-height: auto;}

.charprofile-avatarcrest {position: relative;left: auto;bottom: auto;margin: 0 auto 18px;width: 120px;height: 120px;}

.charprofile-name,.charprofile-subtitle {margin-left: 0;text-align: center;}

.charprofile-name {font-size: 32px;margin-top: -38px;}

.charprofile-bgname {font-size: 48px;text-align: center;}

.charprofile-topstats {padding-left: 0;}

.charprofile-topstats,.charprofile-systemrow,.charprofile-contentrow,.charprofile-appearance-grid,.charprofile-splitrow {grid-template-columns: 1fr;}

.charprofile-stat,.charprofile-stat(4n) {border-right: none;}

.charprofile-body {padding: 20px;}}



/* START OOC PROFILES */

.oocprofile-wrap {width: min(96vw, 1500px);margin: 40px auto;background: rgba(14,22,32,0.45);border: 1px solid rgba(170,210,160,0.08);backdrop-filter: blur(6px);}

.oocprofile-header {position: relative;min-height: 240px;padding: 58px 70px 78px;background: linear-gradient(rgba(11,17,25,0.62), rgba(11,17,25,0.86)),url(https://i.ibb.co/QjRLCLr/ezgif-129111cbe0b44.png);background-size: cover;background-position: center;}

.oocprofile-avatar {position: absolute;left: 55px;bottom: -52px;width: 145px;height: 145px;padding: 6px;background: #0b1119;border: 1px solid rgba(170,210,160,0.22);box-shadow: 0 0 25px rgba(0,0,0,0.45);}

.oocprofile-avatar img {width: 100%;height: 100%;object-fit: cover;border: 4px solid #121B26;}

.oocprofile-bgname {font-family: 'DM Serif Display', serif;font-size: clamp(58px, 6vw, 110px);color: rgba(160,181,198,0.08);text-transform: uppercase;line-height: .95;}

.oocprofile-name {margin-top: -55px;margin-left: 175px;font-family: 'DM Serif Display', serif;font-size: clamp(38px, 4vw, 68px);color: #8DAEC0;text-transform: uppercase;letter-spacing: 3px;}

.oocprofile-tagline {margin-top: 8px;margin-left: 175px;color: #E7EEF4;font-size: 11px;letter-spacing: 3px;text-transform: uppercase;}

.oocprofile-topstats {margin-top: 20px;display: grid;grid-template-columns: repeat(4, 1fr);border-top: 1px solid rgba(170,210,160,0.08);border-bottom: 1px solid rgba(170,210,160,0.08);}

.oocprofile-stat,.oocprofile-trope {padding: 18px 14px;background: rgba(255,255,255,0.018);border-right: 1px solid rgba(170,210,160,0.08);border-bottom: 1px solid rgba(170,210,160,0.08);text-align: center;}

.oocprofile-stat span,.oocprofile-moodbar span,.oocprofile-trope span {display: block;color: #b6d78a;font-size: 9px;font-weight: bold;letter-spacing: 1.8px;text-transform: uppercase;margin-bottom: 6px;}

.oocprofile-stat b,.oocprofile-moodbar b,.oocprofile-trope b {display: block;color: #d8d2c5;font-family: Georgia, serif;font-size: 13px;font-weight: normal;letter-spacing: 1px;}

.oocprofile-moodbar {padding: 18px 20px;text-align: center;background: rgba(255,255,255,0.025);border-bottom: 1px solid rgba(170,210,160,0.08);}

.oocprofile-moodbar b {color: rgba(231,238,244,0.55);font-size: 11px;font-style: italic;letter-spacing: 2px;}

.oocprofile-body {padding: 42px;}

.oocprofile-section {margin-bottom: 24px;background: rgba(255,255,255,0.02);border: 1px solid rgba(170,210,160,0.08);}

.oocprofile-title {padding: 14px 18px;background: rgba(255,255,255,0.03);color: #b6d78a;text-transform: uppercase;letter-spacing: 2px;font-size: 10px;font-weight: bold;}

.oocprofile-text,.oocprofile-list {padding: 24px;color: #d8d2c5;font-family: 'EB Garamond', serif;font-size: 15px;line-height: 1.8;}

.oocprofile-splitrow {display: grid;grid-template-columns: 1fr 1fr;gap: 24px;}

.oocprofile-splitrow .oocprofile-section {margin-bottom: 0;}

.oocprofile-tropegrid {display: grid;grid-template-columns: repeat(3, 1fr);}

@media (max-width: 900px) {.oocprofile-topstats,.oocprofile-splitrow,.oocprofile-tropegrid {grid-template-columns: 1fr;}

.oocprofile-topstats {padding-left: 0;}

.oocprofile-avatar {position: relative;left: auto;bottom: auto;margin: 0 auto 18px;}

.oocprofile-name,.oocprofile-tagline {margin-left: 0;text-align: center;}

.oocprofile-body {padding: 20px;}}

/* UNIVERSAL WIDTH PATCH - add at very bottom */

.charprofile-wrap,
.oocprofile-wrap {
  width: 95%;
  max-width: 1500px;
  box-sizing: border-box;
}

.charprofile-wrap *,
.charprofile-wrap *::before,
.charprofile-wrap *::after,
.oocprofile-wrap *,
.oocprofile-wrap *::before,
.oocprofile-wrap *::after {
  box-sizing: border-box;
}

@media (max-width: 900px) {
  .charprofile-wrap,
  .oocprofile-wrap {
    width: 95%;
    max-width: 95%;
  }
}