/* Production PHP pages retain their original data, fields and navigation. */
body.cv-interior {
    --cv-bg: #100f0e;
    --cv-surface: linear-gradient(135deg, #24201b, #171512 76%);
    --cv-line: #493a2d;
    --cv-ink: #f5ecdf;
    --cv-text: #d5c7b6;
    --cv-muted: #b6a99a;
    --cv-accent: #eac49a;
    --cv-serif: Cinzel, Georgia, serif;
    margin: 0;
    min-width: 0;
    color: var(--cv-ink);
    background: var(--cv-bg);
    font: 400 16px/1.56 Barlow, Arial, sans-serif;
    color-scheme: dark;
}
body.cv-interior main {min-height: calc(100svh - 150px)}
body.cv-interior .page.wrap {
    width: 92%;
    max-width: 1350px;
    margin: 0 auto;
    padding: 0 0 clamp(45px, 6vw, 76px);
    min-width: 0;
}
body.cv-interior :is(.page, .auth-scene) :is(h1, h2, h3, h4) {
    font-family: var(--cv-serif);
    font-weight: 600;
    line-height: 1.24;
    color: var(--cv-ink);
    letter-spacing: 0;
    overflow-wrap: anywhere;
}
body.cv-interior .page h2 {font-size: clamp(24px, 2.45vw, 36px); margin: 1.2em 0 .55em}
body.cv-interior .page h3 {font-size: clamp(20px, 1.65vw, 26px); margin: 0 0 .45em}
body.cv-interior .page :is(p, li) {color: var(--cv-text)}
body.cv-interior :is(.page, .auth-scene) .eyebrow,
body.cv-interior :is(.realm-tile, .roster, .honours, .client-pack) small,
body.cv-interior .hall-nav h3 {
    display: block;
    color: #d3ab80;
    font: 600 10px/1.5 Barlow, Arial, sans-serif;
    letter-spacing: .13em;
    text-transform: uppercase;
}
body.cv-interior .realm-mast {
    isolation: isolate;
    display: grid;
    align-content: center;
    align-items: center;
    min-height: clamp(184px, 20vw, 280px);
    position: relative;
    width: 100%;
    margin: 0 0 clamp(24px, 3vw, 42px);
    overflow: hidden;
    border: 1px solid var(--cv-line);
    border-top: 0;
    border-radius: 0;
    background: #1b1713;
}
body.cv-interior .realm-mast > img {
    position: absolute;
    inset: 0;
    z-index: -2;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 40%;
}
body.cv-interior .realm-mast::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(90deg, #15100cf0 2%, #16110cdd 34%, #15100c33 80%),
                linear-gradient(0deg, #100d0a78, transparent 65%);
}
body.cv-interior .realm-mast > div {max-width: 810px; padding: clamp(25px, 3.6vw, 58px)}
body.cv-interior .realm-mast nav {
    display: block;
    height: auto;
    color: #e1bf96;
    font: 600 10px/1.5 Barlow, Arial, sans-serif;
    letter-spacing: .16em;
    text-transform: uppercase;
}
body.cv-interior .realm-mast nav a {color: inherit; font: inherit}
body.cv-interior .realm-mast h1 {font-size: clamp(33px, 4vw, 62px); line-height: 1.12; margin: .2em 0}
body.cv-interior .realm-mast p {max-width: 62ch; margin: .5rem 0 0; color: #e1d3bf}
body.cv-interior .page > .scene {display: none}
body.cv-interior .tile-grid, body.cv-interior .cards, body.cv-interior .honours {display: grid; gap: 16px}
body.cv-interior .tile-grid {grid-template-columns: repeat(auto-fit, minmax(min(100%, 275px), 1fr))}
body.cv-interior .cards {grid-template-columns: repeat(3, minmax(0, 1fr))}
body.cv-interior :is(.realm-tile, .hall-nav, .quiet, .honours article, .entry, .roster, .install-steps, .reading, .compose),
body.cv-interior .cards > a {
    min-width: 0;
    background: var(--cv-surface);
    border: 1px solid var(--cv-line);
    border-radius: 0;
    box-shadow: none;
}
body.cv-interior .cards > a {display: flex; flex-direction: column; overflow: hidden; padding: 0}
body.cv-interior .cards a > img {display: block; width: 100%; aspect-ratio: 2.12; object-fit: cover; border-radius: 0}
body.cv-interior .cards a > div {width: 100%; flex: 1; padding: 18px 20px; background: transparent}
body.cv-interior .cards a > div h3 {margin: 5px 0 8px; font-size: clamp(20px, 1.8vw, 28px)}
body.cv-interior .cards a > div p {margin: 0}
body.cv-interior .cards a > div small:last-child {display: block; color: var(--cv-accent); font: 600 12px/1.5 Barlow, Arial, sans-serif; margin-top: 14px}
body.cv-interior .realm-tile {
    display: grid;
    grid-template-columns: 37px minmax(0, 1fr) 16px;
    align-items: start;
    gap: 14px;
    padding: 21px 18px;
}
body.cv-interior .realm-tile > .sigil {width: 16px; color: var(--cv-accent)}
body.cv-interior .seal {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    color: #efd0aa;
    background: linear-gradient(135deg, #59422d, #241b14);
    border: 1px solid #796046;
    border-radius: 0;
}
body.cv-interior .seal svg {width: 20px; height: 20px}
body.cv-interior .realm-tile strong {display: block; margin: 4px 0 6px; font: 600 clamp(18px, 1.55vw, 23px)/1.35 var(--cv-serif); overflow-wrap: anywhere}
body.cv-interior .realm-tile em {display: block; color: var(--cv-text); font-style: normal; line-height: 1.45}
body.cv-interior .cards a:hover, body.cv-interior .realm-tile:hover {border-color: #9a754f; background: linear-gradient(135deg, #31271d, #1a1713)}
body.cv-interior .hall-layout, body.cv-interior .guide-layout, body.cv-interior .install-layout {
    display: grid;
    grid-template-columns: minmax(185px, 240px) minmax(0, 1fr);
    align-items: start;
    gap: clamp(20px, 3vw, 44px);
}
body.cv-interior .hall-nav {padding: 22px}
body.cv-interior .hall-nav h2 {margin: 0 0 12px; font-size: 22px}
body.cv-interior .hall-nav h3 {margin: 19px 0 5px}
body.cv-interior .hall-nav a {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    border-radius: 0;
    padding: 6px 9px;
    font: 400 15px/1.4 Barlow, Arial, sans-serif;
    color: #e3d7c9;
    height: auto;
}
body.cv-interior .hall-nav a:is(:hover, [aria-current="page"]) {background: #3b2c20; color: #ffe0b6; box-shadow: inset 2px 0 #d8a572}
body.cv-interior .hall-nav a span {color: #c79968}
body.cv-interior .guide-index details {display: block}
body.cv-interior .guide-index summary {display: block; cursor: pointer; margin-bottom: 8px; font: 600 18px/1.4 var(--cv-serif); color: var(--cv-accent)}
body.cv-interior .hall-main {min-width: 0}
body.cv-interior .honours {grid-template-columns: repeat(auto-fit, minmax(min(100%, 125px), 1fr)); margin: 18px 0 25px}
body.cv-interior :is(.honours article, .quiet, .roster, .entry) {padding: 21px}
body.cv-interior .honours article:first-child {background: linear-gradient(120deg, #49321f, #1b1713); border-color: #876241}
body.cv-interior :is(.honours, .roster, .quiet) .sigil {color: var(--cv-accent)}
body.cv-interior .honours article > .sigil {float: right}
body.cv-interior .honours strong {display: block; margin: 6px 0 2px; font: 600 clamp(19px, 2vw, 29px)/1.25 var(--cv-serif); overflow-wrap: anywhere}
body.cv-interior .honours span, body.cv-interior .install-steps span {color: var(--cv-muted); font-size: 14px}
body.cv-interior .quiet h3 {margin: .4em 0}
body.cv-interior .table-head {display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 12px 0}
body.cv-interior .table-head label {display: inline-flex; align-items: center; gap: 7px; color: var(--cv-accent); font-weight: 600}
body.cv-interior .table-head input {width: min(48%, 310px)}
body.cv-interior .scroll {max-width: 100%; overflow-x: auto; border-radius: 0; background: #151310}
body.cv-interior table {border-collapse: collapse; width: 100%; color: var(--cv-text); text-align: left}
body.cv-interior table :is(th, td) {padding: 12px 14px; border-bottom: 1px solid var(--cv-line); text-align: left}
body.cv-interior table th {color: #dfb78d; font: 600 11px/1.4 Barlow, Arial, sans-serif; letter-spacing: .08em; text-transform: uppercase}
body.cv-interior table thead, body.cv-interior table tr:has(> th) {background: #2a221c}
body.cv-interior table tbody tr:nth-child(even) {background: #1e1a16}
body.cv-interior .standings tbody tr:hover {background: #32271d}
body.cv-interior .standings td:first-child {color: var(--cv-accent); font-variant-numeric: tabular-nums}
body.cv-interior .no-match {color: var(--cv-accent)}
body.cv-interior .install-layout {grid-template-columns: 1.15fr 1fr}
body.cv-interior .client-pack {
    align-self: stretch;
    display: grid;
    align-items: center;
    min-height: 245px;
    border: 1px solid #634b35;
    border-radius: 0;
    background: linear-gradient(90deg, #17130ff2 8%, #19140fd6 48%, #17130f42), url("/crystal/assets/images/crystal-vanguard/gate-guardians.webp") 72% 40% / cover;
}
body.cv-interior :is(.client-pack > div, .install-steps, .reading, .compose) {padding: clamp(22px, 3vw, 38px)}
body.cv-interior .client-pack p {max-width: 40ch; margin: 8px 0 16px; color: #e0d1bf}
body.cv-interior .client-pack small {margin-top: 9px}
body.cv-interior .install-steps ol {margin: 0; padding: 0; display: grid; gap: 15px; list-style: none; counter-reset: install}
body.cv-interior .install-steps li {counter-increment: install; display: grid; grid-template-columns: 35px minmax(0, 1fr); column-gap: 12px}
body.cv-interior .install-steps li::before {content: counter(install, decimal-leading-zero); grid-row: span 2; display: grid; place-items: center; width: 34px; height: 34px; font: 600 14px var(--cv-serif); color: var(--cv-accent); background: #31271d; border: 1px solid #614833; border-radius: 0}
body.cv-interior .reading {min-width: 0; width: 100%; max-width: 87ch; margin: 0 auto}
body.cv-interior .reading p {margin: .55em 0; line-height: 1.66; color: var(--cv-text)}
body.cv-interior .reading h3 {margin: 1.35em 0 .45em; padding-top: .7em; border-top: 1px solid var(--cv-line); color: #efd0a8}
body.cv-interior .reading h3:first-child {margin-top: 0; padding-top: 0; border-top: 0}
body.cv-interior .reading a, body.cv-interior .entry a {color: var(--cv-accent); text-decoration: underline; text-underline-offset: .18em}
body.cv-interior .reading .scroll {margin: 14px 0}
body.cv-interior .reading :target {scroll-margin-top: 18px}
body.cv-interior .article-copy {font: 400 clamp(18px, 1.5vw, 22px)/1.65 Barlow, Arial, sans-serif}
body.cv-interior .entry {margin: 12px 0}
body.cv-interior .entry small {color: var(--cv-muted)}
body.cv-interior .entry p {overflow-wrap: anywhere; margin: .7em 0 0}
body.cv-interior .compose {max-width: 680px; margin-top: 24px}
body.cv-interior .roster dl {display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 12px 0 0}
body.cv-interior .roster dl div {padding: 8px 11px; background: #17130f; border-radius: 0; border-left: 1px solid #6e533a}
body.cv-interior .roster dt {color: var(--cv-muted); font-size: 12px}
body.cv-interior .roster dd {margin: 0; font-variant-numeric: tabular-nums}
body.cv-interior :is(.page, .auth-scene) label {color: var(--cv-text); font: 600 14px/1.5 Barlow, Arial, sans-serif}
body.cv-interior :is(.page, .auth-scene) :is(input:not([type="hidden"], [type="checkbox"]), select, textarea) {
    display: block;
    max-width: 100%;
    padding: 11px 13px;
    border: 1px solid #705a44;
    border-radius: 1px;
    background: #14110f;
    color: var(--cv-ink);
    font: 400 16px/1.4 Barlow, Arial, sans-serif;
}
body.cv-interior input::placeholder, body.cv-interior textarea::placeholder {color: #aea092; opacity: 1}
body.cv-interior .compose :is(label, input, textarea, select), body.cv-interior .formpane :is(label, input:not([type="checkbox"]), select) {display: block; width: 100%}
body.cv-interior .compose label, body.cv-interior .formpane label {margin: 0 0 13px}
body.cv-interior .compose textarea {min-height: 120px; resize: vertical}
body.cv-interior :is(.page, .auth-scene) .button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 43px;
    padding: 10px 18px;
    border: 1px solid #ebbd8c;
    border-radius: 0;
    clip-path: none;
    color: #21130c;
    background: linear-gradient(115deg, #f6d4a6, #c68e5f);
    box-shadow: inset 0 0 0 2px #44211025;
    font: 600 14px/1.4 Barlow, Arial, sans-serif;
    text-decoration: none;
    cursor: pointer;
}
body.cv-interior :is(.page, .auth-scene) .button:hover {filter: brightness(1.1)}
body.cv-interior .button.muted {background: #251e18; color: var(--cv-accent); border-color: var(--cv-line)}
body.cv-interior .page > .button {margin: 18px 0 0}
body.cv-interior .auth-scene {
    display: grid;
    place-items: center;
    min-height: calc(100svh - 145px);
    padding: clamp(24px, 5vw, 76px) 4%;
    background: linear-gradient(110deg, #17120ed6, #14110de8), url("/crystal/assets/images/crystal-vanguard/ashen.webp") center / cover;
}
body.cv-interior .auth-scene > .auth {
    display: grid;
    grid-template-columns: minmax(240px, .85fr) minmax(0, 1fr);
    align-items: stretch;
    gap: 0;
    isolation: isolate;
    position: relative;
    width: min(100%, 970px);
    min-height: 490px;
    margin: auto;
    overflow: hidden;
    border: 1px solid #72573e;
    border-radius: 0;
    box-shadow: 0 22px 65px #0006;
    background: linear-gradient(130deg, #24201b, #151310);
}
body.cv-interior .auth-scene .auth > aside {
    position: relative;
    display: grid;
    align-items: end;
    min-height: 100%;
    border-right: 1px solid var(--cv-line);
    background: linear-gradient(0deg, #100d0bf2, transparent 48%), url("/crystal/assets/images/aethran/crystal-wings.webp") center 25% / cover;
}
body.cv-interior .auth-scene:has(form[action="/register"]) .auth > aside {
    background-image: linear-gradient(0deg, #100d0bf2, transparent 48%), url("/crystal/assets/images/aethran/crystal-wings.webp");
}
body.cv-interior .auth-scene aside > div {position: static; padding: 24px; display: grid; gap: 10px}
body.cv-interior .auth-scene aside img {width: min(180px, 75%); height: auto}
body.cv-interior .auth-scene aside small {color: #e0c6a8; letter-spacing: .14em; text-transform: uppercase; font-size: 10px}
body.cv-interior .formpane {align-self: center; min-width: 0; padding: 40px clamp(24px, 3.4vw, 50px)}
body.cv-interior .formpane h1 {font-size: clamp(32px, 3.15vw, 47px); margin: 7px 0 10px}
body.cv-interior .formpane p {margin: 0 0 12px; color: var(--cv-text)}
body.cv-interior .formpane form {margin: 20px 0}
body.cv-interior .formpane a {color: var(--cv-accent)}
body.cv-interior .formpane input {margin: 5px 0 0}
body.cv-interior .formpane .pass {position: relative; display: block; margin: 5px 0 0}
body.cv-interior .formpane .pass input {padding-right: 45px; margin: 0}
body.cv-interior .formpane .eye, body.cv-interior .formpane .close {color: var(--cv-accent); background: #272019; border: 1px solid var(--cv-line); border-radius: 0; cursor: pointer}
body.cv-interior .formpane .eye {position: absolute; inset: 4px 4px 4px auto; width: 35px}
body.cv-interior .formpane .close {position: absolute; top: 8px; right: 8px; display: grid; place-items: center; width: 30px; height: 30px; font: 22px/1 Barlow, Arial, sans-serif}
body.cv-interior .formpane .pair {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px}
body.cv-interior .formpane .recovery {display: block; text-align: right; font-size: 14px}
body.cv-interior .formpane .check {display: block; font-weight: 400}
body.cv-interior .formpane .check input {display: inline-block; width: auto; margin: 0 5px 0 0; accent-color: #d9a875}
body.cv-interior .formpane .check a, body.cv-interior .formpane p a {text-decoration: underline}
body.cv-interior .formpane .button {width: 100%; height: auto; margin-top: 7px}
body.cv-interior :is(.error, [role="alert"]) {color: #ffb9a6}
body.cv-interior :is(a, button, input, textarea, summary, select):focus-visible {outline: 2px solid #ffcb8f; outline-offset: 3px}
body.cv-interior [hidden] {display: none !important}

@media (max-width: 760px) {
    body.cv-interior .page.wrap {width: 92%; padding-bottom: 32px}
    body.cv-interior .hall-layout, body.cv-interior .guide-layout, body.cv-interior .install-layout {grid-template-columns: minmax(0, 1fr)}
    body.cv-interior .hall-nav:not(.guide-index) {display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 12px}
    body.cv-interior .hall-nav:not(.guide-index) h2 {grid-column: 1 / -1}
    body.cv-interior .hall-nav h3 {margin: 5px 0}
    body.cv-interior .cards {grid-template-columns: repeat(2, minmax(0, 1fr))}
    body.cv-interior .realm-mast {min-height: 174px}
    body.cv-interior .realm-mast::after {background: linear-gradient(90deg, #17120def, #19130c85), linear-gradient(0deg, #12100dc9, transparent)}
    body.cv-interior .realm-mast > div {padding: 24px 20px}
    body.cv-interior .auth-scene > .auth {grid-template-columns: minmax(0, 1fr); min-height: 0; max-width: 540px}
    body.cv-interior .auth-scene .auth > aside {min-height: 115px; height: 115px; border-right: 0; border-bottom: 1px solid var(--cv-line); background-position: center, 50% 23%}
    body.cv-interior .auth-scene aside > div {width: fit-content; max-width: 54%; padding: 16px; background: #17130fc4}
    body.cv-interior .auth-scene aside img {width: 100px}
    body.cv-interior .formpane {padding: 22px}
    body.cv-interior .table-head {align-items: stretch; flex-direction: column}
    body.cv-interior .table-head input {width: 100%}
}
@media (max-width: 520px) {
    body.cv-interior .cards, body.cv-interior .formpane .pair {grid-template-columns: minmax(0, 1fr)}
    body.cv-interior .formpane .pair {gap: 0}
    body.cv-interior .honours {grid-template-columns: repeat(auto-fit, minmax(min(100%, 92px), 1fr)); gap: 7px}
    body.cv-interior .honours article {padding: 12px 9px}
    body.cv-interior .honours article > .sigil {float: none; width: 17px}
    body.cv-interior .honours strong {font-size: 17px}
    body.cv-interior .reading {padding: 18px}
    body.cv-interior table td, body.cv-interior table th {padding: 10px 8px}
}
@media (prefers-reduced-motion: reduce) {
    body.cv-interior *, body.cv-interior *::before, body.cv-interior *::after {scroll-behavior: auto !important; transition: none !important; animation: none !important}
}
.cv-interior .cv-guild-mark { width:32px; height:32px; object-fit:contain; vertical-align:middle; image-rendering:pixelated; }
.cv-interior .standings .cv-guild-mark { margin-right:9px; }
.cv-interior .honours .cv-guild-mark { width:48px; height:48px; }
.cv-interior .realm-mast:has(img[src$="/aethran/crystal-wings.webp"]) { background:#19202a; }
.cv-interior .realm-mast > img[src$="/aethran/crystal-wings.webp"] { left:auto; right:0; width:min(70%,650px); object-position:50% 14%; }
.cv-interior .cv-dashboard { --panel:#19191b; --line:#534638; --label:#c9baa8; }
.cv-dashboard .cv-roster-head { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:22px; padding:clamp(22px,3vw,44px); margin-bottom:22px; background:linear-gradient(108deg,#282322,#15191c 70%); border:1px solid var(--line); }
.cv-dashboard .cv-kicker,.cv-dashboard .cv-wallet h2 { font:600 11px/1.4 Barlow,sans-serif; text-transform:uppercase; color:#ddbd94; letter-spacing:.14em; margin:0 0 7px; }
.cv-dashboard .cv-roster-head h1 { margin:0; font:600 clamp(32px,4.6vw,60px)/1.12 Cinzel,serif; }
.cv-dashboard .cv-roster-head p:not(.cv-kicker) { color:var(--label); margin:10px 0 0; }
.cv-dashboard .cv-wallet dl,.cv-dashboard .cv-progression,.cv-dashboard .cv-attributes { margin:0; }
.cv-dashboard .cv-wallet dl { display:flex; flex-wrap:wrap; gap:12px 22px; }
.cv-dashboard dt { font:400 13px Barlow,sans-serif; color:var(--label); }
.cv-dashboard dd { margin:3px 0 0; color:#fff1d9; font-weight:600; font-variant-numeric:tabular-nums; }
.cv-dashboard .cv-wallet dd { font-size:21px; }
.cv-dashboard .cv-roster-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,245px),1fr)); gap:clamp(12px,1.2vw,20px); }
.cv-dashboard .cv-roster-card:only-child { width:min(100%,390px); }
.cv-dashboard .cv-roster-card { --accent:#8ed3ed; background:var(--panel); border:1px solid var(--line); min-width:0; position:relative; overflow:hidden; box-shadow:0 10px 24px #0003; }
.cv-dashboard [data-job="gladiator"] { --accent:#f1b77d; }
.cv-dashboard [data-job="summoner"],.cv-dashboard [data-job="wizard"] { --accent:#cfacf0; }
.cv-dashboard [data-job="elf"] { --accent:#9cdbc9; }
.cv-dashboard [data-job="knight"],.cv-dashboard [data-job="lord"] { --accent:#edc7a3; }
.cv-dashboard .cv-portrait { position:relative; isolation:isolate; aspect-ratio:2/3; max-height:510px; overflow:hidden; perspective:720px; background:#161616; }
.cv-dashboard .cv-portrait img { display:block; width:100%; height:100%; object-fit:contain; }
.cv-dashboard .cv-portrait::before { content:""; position:absolute; inset:0; z-index:1; pointer-events:none; box-shadow:inset 0 1px 0 #ffffff30,inset 0 -10px 35px #0e101450; }
.cv-dashboard .cv-portrait::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(0deg,var(--panel),transparent 5%); }
.cv-dashboard .cv-sheet { padding:0 clamp(14px,1.35vw,24px) 20px; position:relative; }
.cv-dashboard .cv-sheet .cv-kicker { color:var(--accent); margin:0; }
.cv-dashboard .cv-sheet h2 { margin:3px 0 13px; font:600 clamp(24px,2.3vw,36px)/1.18 Cinzel,serif; overflow-wrap:anywhere; }
.cv-dashboard .cv-progression { display:grid; grid-template-columns:1fr 1fr; border-block:1px solid #584c40; padding:10px 0; }
.cv-dashboard .cv-progression dd { font-size:22px; line-height:1.08; }
.cv-dashboard .cv-attributes { display:grid; grid-template-columns:1fr 1fr; gap:8px 14px; padding-top:14px; }
.cv-dashboard .cv-attributes dd { font-size:16px; }
.cv-dashboard .cv-account-logout { margin:22px 0 0; }
@media(hover:hover) and (prefers-reduced-motion:no-preference) {
    .cv-dashboard .cv-roster-card:hover { border-color:var(--accent); }
    .cv-dashboard .cv-portrait img { transition:scale .45s ease,rotate .45s ease; }
    .cv-dashboard .cv-roster-card:hover .cv-portrait img { scale:1.05; rotate:y -4deg; }
}
@media(max-width:600px) {
    .cv-dashboard .cv-roster-head { align-items:start; flex-direction:column; }
    .cv-dashboard .cv-portrait { max-height:440px; }
}