.modal:has(.pc-sheet),.modal:has(.char-overview){width:min(1280px,calc(100vw - 40px));max-height:94dvh;padding:28px}
.player-sheet{grid-column:1/-1}

/* Player sheet: values read as text and are edited in place */
.pc-sheet{--sh-card:var(--on-vermilion);display:flex;flex-direction:column;gap:16px}
.pc-sheet input,.pc-sheet textarea,.pc-sheet select{background:transparent;border:1px solid transparent;border-radius:var(--radius);color:var(--ink);font:500 16px var(--sans);padding:6px 8px;width:100%;box-sizing:border-box;min-width:0;transition:border-color .15s,background .15s}
.pc-sheet input:hover,.pc-sheet textarea:hover,.pc-sheet select:hover{border-color:var(--line)}
.pc-sheet input:focus,.pc-sheet textarea:focus,.pc-sheet select:focus{outline:none;border-color:color-mix(in srgb,var(--vermilion) 60%,transparent);background:var(--sheet)}
.pc-sheet ::placeholder{color:var(--text-soft)}
.pc-sheet textarea{resize:none;overflow:hidden;line-height:1.6;min-height:70px}
.pc-sheet select{appearance:none;cursor:pointer;text-align:center}
.pc-sheet select option{background:var(--sheet)}
.pc-sheet button:focus-visible,.sh-nav a:focus-visible{outline:2px solid var(--lime);outline-offset:2px}
.sh-label{font:500 10.5px var(--mono);letter-spacing:.12em;font-variant-caps:all-small-caps;color:var(--muted)}

.sh-hero{display:grid;grid-template-columns:112px minmax(0,1fr);gap:22px;align-items:center}
.sh-portrait{position:relative;width:112px;height:112px;border-radius:var(--radius-tag);overflow:hidden;border:1px solid var(--line);background:var(--panel2)}
.sh-portrait .csv-initial{width:100%;height:100%}.sh-portrait img:not([hidden])+.csv-initial{display:none}
.sh-portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 20%;display:block}
.sh-portrait button{position:absolute;inset:auto 0 0;border:0;background:color-mix(in srgb,var(--shadow) 80%,transparent);color:var(--ink);font:600 11.5px var(--sans);padding:7px;cursor:pointer;opacity:0;transition:opacity .15s}
.sh-portrait:hover button,.sh-portrait button:focus-visible{opacity:1}
.pc-sheet .sh-name{font:700 41.5px var(--serif);letter-spacing:0;padding:2px 8px}
.sh-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.sh-chip{display:flex;flex-direction:column;flex:1 1 120px;max-width:230px;border:1px solid var(--line);border-radius:var(--radius);padding:6px 4px 1px;background:var(--sh-card)}
.sh-chip>span{font:500 9px var(--mono);letter-spacing:.12em;font-variant-caps:all-small-caps;color:var(--muted);padding-left:8px}
.pc-sheet .sh-chip input{padding:3px 8px;font-weight:600}
.sh-toolbar{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin:0 40px 18px 0;min-height:40px}.sh-chips .sh-inspiration{flex:0 0 auto;align-self:stretch}.sh-name-row{display:flex;gap:10px;align-items:stretch}.sh-name-row .sh-name{flex:1;min-width:0}.sh-level-up{flex:0 0 auto}
.sh-inspiration{border:1px solid color-mix(in srgb,var(--gold-leaf) 35%,transparent);background:transparent;color:var(--muted);border-radius:var(--radius-tag);padding:8px 14px;font:700 14px var(--sans);cursor:pointer;transition:.2s}
.sh-inspiration[aria-pressed=true]{background:color-mix(in srgb,var(--gold-leaf) 16%,transparent);color:var(--gold);border-color:var(--gold);box-shadow:none}

.sh-nav{position:sticky;top:-1px;z-index:2;display:flex;gap:2px;overflow-x:auto;padding:6px;border:1px solid var(--line);border-radius:var(--radius);background:var(--leaf);}
.sh-nav a{color:var(--muted);text-decoration:none;font:600 14px var(--sans);padding:7px 11px;border-radius:var(--radius);white-space:nowrap}
.sh-nav a:hover{color:var(--ink);background:color-mix(in srgb,var(--vermilion) 9%,transparent)}
.pc-sheet .sh-section[hidden],.pc-sheet .sh-vitals[hidden]{display:none}

.sh-vitals{display:grid;grid-template-columns:minmax(250px,1.7fr) repeat(4,minmax(0,1fr));gap:10px}
.sh-death-tile{grid-column:span 2}
.sh-tile,.sh-hp{border:1px solid var(--line);border-radius:var(--radius);padding:12px;background:var(--sh-card);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-align:center;min-width:0}
.pc-sheet .sh-big{font:600 34.5px var(--serif);text-align:center;padding:2px 4px;color:var(--ink)}
.sh-hp{grid-row:span 2;border-color:color-mix(in srgb,var(--wound) 40%,transparent);background:var(--sh-card)}
.sh-hp-row{display:flex;align-items:center;gap:6px}
.pc-sheet .sh-hp .sh-big{font-size:66.5px;width:2.4em;line-height:1}
.sh-hp-max{display:flex;align-items:center;color:var(--muted);font:600 23px var(--serif)}
.pc-sheet .sh-hp-max input{width:3em;font:600 23px var(--serif);text-align:center;color:var(--muted)}
.sh-hp-row button{width:38px;height:38px;flex:none;border-radius:50%;border:1px solid var(--line);background:transparent;color:var(--ink);font-size:23px;cursor:pointer}
.sh-hp-row button:hover{border-color:var(--red);color:var(--red)}
.sh-temp{display:flex;align-items:center;gap:4px;font:500 12.5px var(--sans);color:var(--muted)}
.pc-sheet .sh-temp input{width:56px;text-align:center}
.sh-dice{display:flex;align-items:center;gap:2px;color:var(--muted);font-size:12.5px}
.pc-sheet .sh-dice input{width:5em;text-align:center;padding:2px 4px}
.pc-sheet .sh-big::placeholder{color:var(--ink);opacity:.8}
.sh-death{display:grid;grid-template-columns:auto auto;gap:10px 14px;align-items:center;font-size:14px;color:var(--muted);text-align:left}
.sh-pips{display:inline-flex;gap:6px;flex-wrap:wrap}
.sh-pips button{width:16px;height:16px;padding:0;border-radius:50%;border:1.5px solid var(--rule-strong);background:transparent;cursor:pointer;transition:.15s}
.sh-pips button.on{background:var(--lime);border-color:var(--lime)}
[data-pips=deathF] button.on{background:var(--red);border-color:var(--red)}

.sh-section{border:1px solid var(--line);border-radius:var(--radius-tag);padding:18px;background:linear-gradient(135deg,var(--foxed),var(--leaf))}
.sh-section-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:14px}
.sh-section-head h3{font:600 23px var(--serif);margin:0;letter-spacing:0}
.sh-hint{font-size:12.5px;color:var(--muted);margin:10px 0 0}

.sh-ab-layout{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:14px}
.sh-abilities{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;align-content:start}
.sh-ability{border:1px solid var(--line);border-radius:var(--radius);padding:12px 14px;background:var(--sh-card);display:grid;grid-template-columns:1fr auto;grid-template-areas:"label label" "mod score" "save save";gap:4px 8px;align-items:center}
.sh-ability .sh-label{grid-area:label}
.sh-mod{grid-area:mod;justify-self:start;border:0;padding:0 4px;margin-left:-4px;background:transparent;border-radius:var(--radius);cursor:pointer}
.sh-mod:hover{background:color-mix(in srgb,var(--text) 4%,transparent)}
.sh-mod b{font:600 41.5px var(--serif);line-height:1.1;color:var(--ink)}
.sh-score{grid-area:score;display:flex;flex-direction:column;align-items:center;gap:2px;font:500 9px var(--mono);letter-spacing:.1em;font-variant-caps:all-small-caps;color:var(--muted)}
.pc-sheet .sh-score input{width:54px;text-align:center;font:500 18.5px var(--mono);border-color:var(--line);border-radius:var(--radius-tag);padding:4px}
.sh-save,.sh-skill{display:flex;align-items:center;gap:9px;width:100%;border:0;background:transparent;color:var(--muted);font:600 14px var(--sans);cursor:pointer;text-align:left}
.sh-save{grid-area:save;border-top:1px solid var(--line);padding:8px 0 0;margin-top:4px}
.sh-save:hover{color:var(--ink)}
.sh-save b,.sh-skill b{margin-left:auto;color:var(--ink);font:500 16px var(--mono)}
.sh-save[aria-pressed=true]{color:var(--ink)}
/* Edit proficiencies mode: the pips become the point, so outline them and swap the hint. */
.sh-edit-hint,.sh-editing .sh-roll-hint{display:none}
.sh-editing .sh-edit-hint{display:inline}
.sh-editing .sh-save,.sh-editing .sh-skill{cursor:copy}
.sh-editing .sh-mod{cursor:default;background:transparent}
.sh-editing .sh-save i,.sh-editing .sh-skill i{box-shadow:0 0 0 3px color-mix(in srgb,var(--vermilion) 18%,transparent)}
.sh-editing .sh-skill-group,.sh-editing .sh-ability{border-style:dashed}
.sh-save i,.sh-skill i{width:10px;height:10px;flex:none;border-radius:50%;border:1.5px solid var(--rule-strong);transition:.15s}
.sh-save[aria-pressed=true] i,.sh-skill[data-level="1"] i{background:var(--lime);border-color:var(--lime)}
.sh-skill[data-level="2"] i{background:var(--gold);border-color:var(--gold);border-radius:2px;transform:rotate(45deg)}
.sh-skills{columns:2 220px;column-gap:10px}
.sh-skill-group{break-inside:avoid;border:1px solid var(--line);border-radius:var(--radius);padding:10px;margin-bottom:10px;background:var(--sh-card)}
.sh-skill-group h4{display:flex;justify-content:space-between;margin:0 0 4px;padding:0 6px;font:700 15px var(--sans)}
.sh-skill-group h4 b{font:500 15px var(--mono);color:var(--muted)}
.sh-pips{flex-wrap:nowrap}
.sh-skill{font:500 15px var(--sans);padding:6px;border-radius:var(--radius)}
.sh-skill:hover{background:color-mix(in srgb,var(--text) 4%,transparent)}
.sh-skill[data-level="1"],.sh-skill[data-level="2"]{color:var(--ink);background:color-mix(in srgb,var(--vermilion) 7%,transparent)}

.sh-attack{display:grid;grid-template-columns:minmax(0,2.4fr) minmax(0,1fr) minmax(0,.8fr) minmax(0,1.3fr) minmax(0,1.1fr) 30px;gap:6px;align-items:center;padding:5px;border:1px solid color-mix(in srgb,var(--gold-leaf) 18%,transparent);border-radius:var(--radius);margin-bottom:6px;background:var(--sh-card)}
.sh-attack-head{border:0;background:none;padding:0 5px;margin:0}
.sh-attack-head span{font:500 10.5px var(--mono);letter-spacing:.12em;font-variant-caps:all-small-caps;color:var(--muted);padding-left:9px}
.pc-sheet .sh-attack-name{font-weight:700}
.sh-remove{width:28px;height:28px;flex:none;border-radius:50%;border:0;background:transparent;color:var(--muted);font-size:20.5px;line-height:1;cursor:pointer}
.sh-remove:hover{color:var(--red);background:color-mix(in srgb,var(--wound) 10%,transparent)}
.sh-empty{color:var(--muted);font-size:15px;margin:0 0 6px}

.sh-spell-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:12px}
.sh-spell-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px;align-items:start}
.sh-spell-level{border:1px solid color-mix(in srgb,var(--lapis) 22%,transparent);border-radius:var(--radius);padding:12px;background:var(--sh-card)}
.sh-spell-head{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px}
.sh-spell-head h4{margin:0;font:600 18.5px var(--serif);color:var(--violet)}
.sh-slots{display:flex;align-items:center;gap:8px}
.sh-slots label{display:flex;align-items:center;gap:2px;font:500 10.5px var(--mono);letter-spacing:.08em;font-variant-caps:all-small-caps;color:var(--muted)}
.pc-sheet .sh-slots input{width:38px;text-align:center;font:500 15px var(--mono)}
.sh-spell-level [data-pips] button.on{background:var(--violet);border-color:var(--violet)}
.sh-spell-level ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.sh-spell-level li{display:flex;align-items:center;gap:4px}
.sh-prep{width:12px;height:12px;flex:none;margin-left:4px;padding:0;border-radius:var(--radius);border:1.5px solid var(--rule-strong);background:transparent;cursor:pointer}
.sh-prep[aria-pressed=true]{background:var(--violet);border-color:var(--violet)}
.pc-sheet .sh-add{margin-top:4px;color:var(--violet)}
.sh-add-levels{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:12px}
.sh-add-levels .outline-btn{padding:6px 10px}

.sh-note{display:flex;flex-direction:column;gap:2px;border:1px solid var(--line);border-radius:var(--radius);padding:10px 6px 4px;background:var(--sh-card)}
.sh-note .sh-label{padding-left:8px}
.sh-two{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}
.sh-four{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.sh-coins{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-bottom:10px}
.sh-coin{display:flex;align-items:center;gap:4px;border:1px solid var(--line);border-radius:var(--radius-tag);padding:2px 2px 2px 14px;background:var(--sh-card)}
.sh-coin span{flex:none;font:700 11.5px var(--mono);color:var(--muted)}
.pc-sheet .sh-coin input{text-align:right;font:500 17px var(--mono)}
.sh-coin-cp span{color:var(--gold)}.sh-coin-sp span{color:var(--text)}.sh-coin-ep span{color:var(--lapis)}.sh-coin-gp span{color:var(--gold)}.sh-coin-pp span{color:var(--text)}
.sh-physical{margin:0 0 10px}
.sh-allies{display:grid;grid-template-columns:150px minmax(0,1fr);gap:10px;margin-top:10px}
.sh-allies .sh-chip{max-width:none;margin-bottom:10px}
.sh-symbol{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;border:1px dashed var(--line);border-radius:var(--radius);padding:12px}
.sh-symbol img{max-width:100%;max-height:110px;border-radius:var(--radius)}

@media(hover:none){.sh-portrait button{opacity:1}}
@media(max-width:1000px){.sh-ab-layout{grid-template-columns:1fr}.sh-four{grid-template-columns:1fr 1fr}.sh-vitals{grid-template-columns:repeat(4,minmax(0,1fr))}.sh-hp{grid-column:1/-1;grid-row:auto}}
@media(max-width:640px){
 .modal:has(.pc-sheet),.modal:has(.char-overview){padding:18px 14px;width:100%}
 .sh-hero{grid-template-columns:76px minmax(0,1fr);gap:14px}.sh-portrait{width:76px;height:76px}
 .sh-toolbar{flex-wrap:wrap;row-gap:6px}
 .pc-sheet .sh-name{font-size:30px}
 .sh-chips{display:grid;grid-template-columns:1fr 1fr}.sh-chip{max-width:none}
 .sh-hero .sh-chips{grid-column:1/-1}
 .sh-vitals{grid-template-columns:repeat(2,minmax(0,1fr))}.sh-hp{grid-row:auto}
 .sh-section{padding:14px 10px}
 .sh-skills{columns:1}
 .sh-attack{grid-template-columns:1fr 1fr 30px;grid-auto-flow:dense}
 .sh-attack-head{display:none}
 .sh-attack>:nth-child(1){grid-column:1/3}
 .sh-attack>:nth-child(2),.sh-attack>:nth-child(4){grid-column:1}
 .sh-attack>:nth-child(3),.sh-attack>:nth-child(5){grid-column:2}
 .sh-attack>:nth-child(6){grid-column:3;grid-row:1}
 .sh-spell-stats{grid-template-columns:1fr 1fr}
 .sh-two,.sh-four{grid-template-columns:1fr}
 .sh-coins{grid-template-columns:repeat(3,minmax(0,1fr))}
 .sh-allies{grid-template-columns:1fr}
}

/* DM overview */
.csv-actions{position:absolute;top:14px;right:52px;display:flex;gap:10px}
.char-overview{display:flex;flex-direction:column;gap:16px}
.csv-header{display:flex;gap:20px;align-items:center;padding-right:120px}
.csv-header :is(img,.csv-initial){width:96px;height:96px;border-radius:var(--radius);object-fit:cover;object-position:50% 20%;border:1px solid var(--line);flex:none}
.csv-initial{display:grid;place-items:center;text-transform:uppercase;font:44px var(--serif);color:var(--muted);box-sizing:border-box}
.csv-header h2{font-size:34.5px;margin-bottom:10px}
.csv-facts{display:flex;flex-wrap:wrap;gap:6px 22px;margin:0}
.csv-facts dt{font:500 10.5px var(--mono);letter-spacing:.1em;font-variant-caps:all-small-caps;color:var(--muted)}
.csv-facts dd{margin:2px 0 0;font-weight:600}
.csv-stats{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
.csv-stat,.csv-abilities>div{border:1px solid var(--line);border-radius:var(--radius);padding:10px 6px;text-align:center;display:flex;flex-direction:column;gap:4px;min-width:0}
.csv-stat b,.csv-abilities b{font:600 23px var(--serif)}
.csv-stat small{font:500 12.5px var(--sans);color:var(--muted)}
.csv-stat span,.csv-abilities span{font:500 10.5px var(--mono);letter-spacing:.1em;font-variant-caps:all-small-caps;color:var(--muted)}
.csv-abilities{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.csv-abilities small{font:500 12.5px var(--mono);color:var(--muted)}
.csv-grid{columns:3 280px;column-gap:14px}
.csv-card{break-inside:avoid;border:1px solid var(--line);border-radius:var(--radius);padding:12px 14px;margin-bottom:14px;background:var(--ink-wash)}
.csv-card h4{font:500 11.5px var(--mono);letter-spacing:.12em;font-variant-caps:all-small-caps;color:var(--lime);margin:0 0 10px}
.csv-card p{margin:6px 0 0;color:var(--ink);font-size:15px;line-height:1.6}
.csv-pre{white-space:pre-wrap;overflow-wrap:anywhere}
.csv-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:3px}
.csv-list li{display:flex;justify-content:space-between;gap:8px;font-size:14px;color:var(--muted)}
.csv-list li.is-prof{color:var(--ink)}
.csv-list li.is-prof span{color:var(--ink)}
.csv-list li em{font-style:normal;font-size:11.5px;color:var(--muted)}
.csv-list b{font-family:var(--mono);font-weight:500;color:var(--ink)}
.csv-table{width:100%;border-collapse:collapse;margin-top:10px;font-size:14px}
.csv-table th{font:500 10.5px var(--mono);letter-spacing:.1em;font-variant-caps:all-small-caps;color:var(--muted);text-align:left;padding-bottom:4px}
.csv-table td{padding:4px 6px 4px 0;border-top:1px solid var(--line)}
.csv-coins{display:flex;gap:12px;flex-wrap:wrap}
.csv-spell-level h5{margin:12px 0 4px;font:600 15px var(--sans)}
.csv-spell-level h5 small{font-weight:500;color:var(--muted);margin-left:6px}
.csv-spell-level ul{margin:0;padding:0;list-style:none;font-size:14px;display:flex;flex-direction:column;gap:2px}
.csv-symbol{max-width:80px;max-height:80px;border-radius:var(--radius)}
@media(max-width:900px){.csv-stats{grid-template-columns:repeat(4,minmax(0,1fr))}.csv-abilities{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:640px){.csv-actions{position:static;margin:0 30px 12px 0}.csv-header{padding-right:0;flex-direction:column;align-items:flex-start}.csv-stats{grid-template-columns:repeat(2,minmax(0,1fr))}}
.csv-legend{color:var(--muted);font-size:12.5px;margin:8px 0 0}
.csv-spellcasting{margin:0}.csv-spell-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding-bottom:12px;border-bottom:1px solid var(--line)}.csv-spell-heading h4{margin:0}.csv-spell-heading .csv-facts{margin:0;gap:24px}.csv-spell-groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px}.csv-spell-level{min-width:0}.csv-spell-level h5{display:flex;justify-content:space-between;gap:8px;align-items:baseline;margin:12px 0 8px}.csv-spell-level h5 small{font-size:11.5px;margin:0}.csv-spell-level ul{display:flex;flex-flow:row wrap;gap:6px}.csv-spell-level li{background:color-mix(in srgb,var(--text) 2%,transparent);border:1px solid var(--line);padding:5px 8px;border-radius:var(--radius);line-height:1.3;font-size:14px}@media(max-width:640px){.csv-spell-groups{grid-template-columns:1fr}.csv-spell-heading .csv-facts{gap:16px}}
.csv-card p.csv-empty{color:var(--muted)}

.sh-tracker{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,.6fr) minmax(0,2fr) auto 30px;gap:6px;align-items:center;margin-bottom:6px}
.sh-tracker:not(:has(.sh-prep)){grid-template-columns:minmax(0,2fr) minmax(0,.6fr) minmax(0,2fr) 30px}
.sh-sub-head{margin-top:18px}
.sh-sub-head h4{margin:0}