*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html,
body{

    width:100%;
    height:100%;

    overflow:hidden;

    background:#646464;

    font-family:Segoe UI,Tahoma,sans-serif;

    color:white;

}

header{

    height:70px;

    background:#2d2d2d;

    border-bottom:4px solid #d47a00;

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:0 25px;

}

#logo{

    font-size:28px;

    font-weight:bold;

    color:#ffb347;

    letter-spacing:2px;

}

.mainToolbar{

    display:flex;

    align-items:center;

    gap:12px;

}

.mainToolbar button{

    padding:12px 20px;

    border:none;

    border-radius:8px;

    background:#d47a00;

    color:white;

    cursor:pointer;

    transition:.2s;

}

.mainToolbar button:hover{

    background:#ff9800;

}

.mainToolbar input{

    color:white;

}

#homeGrid{
    width:100%;
    height:calc(100vh - 70px);
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    grid-auto-rows:calc((100vh - 150px) / 3);
    align-content:start;
    gap:20px;
    padding:20px;
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
}

.panel{

    background:#d47a00;

    border-radius:15px;

    display:flex;

    justify-content:center;

    align-items:center;

    cursor:pointer;

    transition:.25s;

    box-shadow:
    0 0 15px rgba(0,0,0,.35);

}

.panel:hover{

    transform:scale(1.03);

    background:#f39b1d;

}

.panelTitle{

    font-size:34px;

    font-weight:bold;

    text-align:center;

    user-select:none;

}

.hidden{

    display:none !important;

}

#editorView{

    width:100%;

    height:calc(100% - 70px);

    display:flex;

}

#editorLeft{

    flex:1;

    display:flex;

    flex-direction:column;

    background:#404040;

}

#editorHeader{

    height:70px;

    background:#2f2f2f;

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:0 20px;

}

#documentTitle{

    font-size:28px;

    font-weight:bold;

}

#backButton{

    border:none;

    background:#d47a00;

    color:white;

    padding:10px 18px;

    border-radius:8px;

    cursor:pointer;

}

#editorToolbar{

    height:60px;

    display:flex;

    align-items:center;

    gap:10px;

    background:#4a4a4a;

    padding:10px;

}

#editorToolbar button{

    width:50px;

    height:40px;

    border:none;

    border-radius:6px;

    background:#d47a00;

    color:white;

    cursor:pointer;

}

#editorToolbar button:hover{

    background:#ff9800;

}

#editorToolbar select{

    height:40px;

    padding:5px;

}

#editorToolbar input[type=color]{

    width:45px;

    height:40px;

    border:none;

}

#editor{

    flex:1;

    overflow:auto;

    background:white;

    color:black;

    padding:30px;

    outline:none;

    font-size:16px;

    line-height:1.8;

}

#editor img{

    max-width:500px;

    max-height:500px;

    display:block;

    object-fit:contain;

    margin:20px auto;

    border:2px solid #aaa;

}

#sideBar{

    width:260px;

    background:#2f2f2f;

    border-left:4px solid #d47a00;

    overflow:auto;

}

#sideBar h2{

    text-align:center;

    margin:20px 0;

    color:#ffb347;

}

#panelButtons{

    display:flex;

    flex-direction:column;

    gap:10px;

    padding:15px;

}

.sidePanelButton{


    border:none;

    background:#d47a00;

    color:white;

    padding:14px;

    border-radius:8px;

    cursor:pointer;

    font-size:16px;

    transition:.2s;


}

.sidePanelButton:hover{

    background:#ff9800;

}

#notification{

    position:fixed;

    right:30px;

    bottom:30px;

    background:#d47a00;

    color:white;

    padding:15px 25px;

    border-radius:10px;

    display:none;

    z-index:1000;

}

#renamePanelBtn{

    margin:20px;

    padding:12px;

    border:none;

    border-radius:8px;

    background:#d47a00;

    color:white;

    cursor:pointer;

    width:calc(100% - 40px);

}

#renamePanelBtn:hover{

    background:#ff9800;

}

#addPanelBtn,
#deletePanelBtn{

    margin:10px 20px;

    padding:12px;

    width:calc(100% - 40px);

    border:none;

    border-radius:8px;

    background:#d47a00;

    color:white;

    cursor:pointer;

    font-size:16px;

}

#addPanelBtn:hover,
#deletePanelBtn:hover{

    background:#ff9800;

}

.panel{

    position:relative;

}

.resizeBtn{

    position:absolute;

    bottom:10px;

    right:10px;

    width:35px;

    height:35px;

    border:none;

    border-radius:50%;

    background:#2d2d2d;

    color:white;

    cursor:pointer;

}

.panel.large{

    grid-column:span 2;

}

.panel.big{

    grid-column:span 2;

    grid-row:span 2;

}

#templateWindow{


    position:fixed;

    top:50%;

    left:50%;

    transform:translate(-50%,-50%);


    background:#2f2f2f;

    border:3px solid #d47a00;

    border-radius:12px;


    padding:25px;


    width:300px;


    z-index:1000;


    text-align:center;


}

#templateWindow h3{


    margin-bottom:20px;

    color:#ffb347;


}

.templateBtn{


    display:block;


    width:100%;


    margin:10px 0;


    padding:12px;


    background:#d47a00;


    border:none;


    border-radius:8px;


    color:white;


    cursor:pointer;


}

.templateBtn:hover{


    background:#ff9800;


}

.npcSheet{


display:flex;

flex-direction:column;

gap:8px;


font-size:16px;


}

.npcSheet h1{


color:#d47a00;


}

.npcSheet h2{


margin-top:15px;

color:#d47a00;


}

.sheetInput{


padding:8px;

background:#eeeeee;

border:1px solid #999;

border-radius:5px;


}

.sheetSmall{


width:80px;

padding:8px;


}

.sheetArea{


min-height:70px;


padding:8px;


resize:vertical;


}

.bigArea{


min-height:150px;


}

.npcPortrait{

width:180px;
height:180px;

object-fit:cover;

border-radius:10px;

border:3px solid #8b0000;

display:block;

margin-bottom:15px;

}

#templateWindow{
    position:relative;
    width:420px;
    max-width:90vw;
    max-height:90vh;

    background:#232323;

    border:2px solid #666;

    border-radius:10px;

    padding:25px;

    overflow:auto;

    box-sizing:border-box;
}

#templateWindow.hidden{

display:none;

}

.templateBox{

position:relative;

background:#222;

padding:30px;

border-radius:10px;

min-width:320px;

display:flex;

flex-direction:column;

gap:10px;

box-shadow:0 0 30px black;

}

#closeTemplate{

position:absolute;

right:10px;

top:10px;

width:32px;

height:32px;

border:none;

cursor:pointer;

font-size:22px;

background:#900;

color:white;

border-radius:50%;

}

#closeTemplate:hover{

background:red;

}

#templateOverlay{
    position:fixed;

    top:0;
    left:0;

    width:100%;
    height:100%;

    display:none;

    justify-content:center;
    align-items:center;

    background:rgba(0,0,0,.6);

    z-index:99999;
}

#templateOverlay.show{
    display:flex;
}

#initiativeTracker{
    display:none;
    flex:1;
    min-height:0;
    overflow:auto;
    padding:28px;

    background:
        radial-gradient(
            circle at top,
            #5a4631 0,
            #342a22 35%,
            #1d1916 100%
        );

    color:#f4e7ce;
}

#initiativeTracker.show{
    display:block;
}

.trackerToolbar{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:center;
    gap:14px;

    padding:18px;
    margin-bottom:18px;

    background:rgba(15,12,10,.78);

    border:2px solid #d47a00;
    border-radius:14px;

    box-shadow:
        0 8px 20px rgba(0,0,0,.45),
        inset 0 0 12px rgba(255,179,71,.08);
}

.trackerToolbar button{
    min-width:145px;
    min-height:52px;

    padding:12px 18px;

    border:2px solid #ffb347;
    border-radius:10px;

    background:
        linear-gradient(
            180deg,
            #d98716,
            #a95800
        );

    color:white;

    font-size:16px;
    font-weight:700;
    letter-spacing:.4px;

    cursor:pointer;

    box-shadow:
        0 5px 10px rgba(0,0,0,.35),
        inset 0 1px 0 rgba(255,255,255,.25);

    transition:
        transform .15s,
        box-shadow .15s,
        background .15s;
}

.trackerToolbar button:hover{
    transform:translateY(-2px);

    background:
        linear-gradient(
            180deg,
            #f5a329,
            #c46a00
        );

    box-shadow:
        0 8px 15px rgba(0,0,0,.45),
        0 0 12px rgba(255,179,71,.3);
}

.trackerToolbar button:active{
    transform:translateY(1px);
}

#addCombatantBtn::before{
    content:"➕ ";
}

#sortInitiativeBtn::before{
    content:"⬇ ";
}

#nextTurnBtn::before{
    content:"▶ ";
}

#newRoundBtn::before{
    content:"🔄 ";
}

#roundCounter{
    width:max-content;
    min-width:190px;

    margin:0 auto 20px;
    padding:12px 28px;

    background:
        linear-gradient(
            180deg,
            #2c2520,
            #171310
        );

    border:2px solid #ffb347;
    border-radius:30px;

    color:#ffd18b;

    font-size:25px;
    font-weight:800;
    text-align:center;
    letter-spacing:1px;

    box-shadow:
        0 5px 14px rgba(0,0,0,.5),
        0 0 12px rgba(212,122,0,.2);
}

#initiativeTable{
    width:100%;
    min-width:850px;

    border-collapse:separate;
    border-spacing:0;

    overflow:hidden;

    background:rgba(245,235,215,.96);

    border:3px solid #8d5100;
    border-radius:14px;

    color:#211a14;

    box-shadow:
        0 12px 30px rgba(0,0,0,.55);
}

#initiativeTable thead{
    position:sticky;
    top:0;
    z-index:5;
}

#initiativeTable th{
    padding:15px 10px;

    background:
        linear-gradient(
            180deg,
            #4a3425,
            #271d16
        );

    border-right:1px solid #7a5a3f;
    border-bottom:3px solid #d47a00;

    color:#ffcf85;

    font-size:15px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.7px;
    text-align:center;
}

#initiativeTable th:last-child{
    border-right:none;
}

#initiativeTable td{
    padding:10px;

    border-right:1px solid #bfae92;
    border-bottom:1px solid #cbb99c;

    background:rgba(255,250,238,.96);

    vertical-align:middle;
}

#initiativeTable td:last-child{
    border-right:none;
    text-align:center;
}

#initiativeTable tbody tr:last-child td{
    border-bottom:none;
}

#initiativeTable tbody tr{
    transition:
        transform .15s,
        background .15s,
        box-shadow .15s;
}

#initiativeTable tbody tr:hover td{
    background:#fff4d9;
}

#initiativeTable input{
    width:100%;
    min-height:42px;

    padding:8px 10px;

    border:2px solid #b6a383;
    border-radius:7px;

    background:#fffdf7;
    color:#1d1814;

    font-size:16px;
    font-weight:600;

    outline:none;

    transition:
        border-color .15s,
        box-shadow .15s,
        background .15s;
}

#initiativeTable input:focus{
    border-color:#d47a00;
    background:white;

    box-shadow:
        0 0 0 3px rgba(212,122,0,.2);
}

#initiativeTable td:nth-child(1){
    width:90px;
}

#initiativeTable td:nth-child(3){
    width:90px;
}

#initiativeTable td:nth-child(4){
    width:125px;
}

#initiativeTable td:nth-child(6){
    width:75px;
}

#initiativeTable td:last-child button{
    width:42px;
    height:42px;

    border:2px solid #ff8a76;
    border-radius:50%;

    background:
        linear-gradient(
            180deg,
            #b63226,
            #721b15
        );

    color:white;

    font-size:18px;
    font-weight:bold;

    cursor:pointer;

    box-shadow:0 4px 8px rgba(0,0,0,.3);

    transition:
        transform .15s,
        background .15s;
}

#initiativeTable td:last-child button:hover{
    transform:scale(1.1);
    background:#e23d2f;
}

#initiativeTable tr.activeTurn td{
    background:
        linear-gradient(
            90deg,
            #d9f3ce,
            #f3ffe9
        );

    border-top:3px solid #58a83c;
    border-bottom:3px solid #58a83c;

    box-shadow:
        inset 0 0 16px rgba(65,145,45,.18);
}

#initiativeTable tr.activeTurn td:first-child{
    border-left:6px solid #58a83c;
}

#initiativeTable tr.activeTurn td:first-child::before{
    content:"▶";
    display:inline-block;

    margin-right:7px;

    color:#257114;

    font-size:18px;
    font-weight:bold;

    animation:activeTurnPulse 1.2s infinite;
}

#initiativeTable tr.activeTurn input{
    border-color:#70a95a;
    background:#f9fff5;
}

@keyframes activeTurnPulse{
    0%{
        transform:translateX(0);
        opacity:.65;
    }

    50%{
        transform:translateX(4px);
        opacity:1;
    }

    100%{
        transform:translateX(0);
        opacity:.65;
    }
}

@media(max-width:900px){

    #initiativeTracker{
        padding:14px;
    }

    .trackerToolbar button{
        flex:1;
        min-width:130px;
    }

    #initiativeTable{
        min-width:760px;
    }

}

#resetInitiativeBtn{
    background:
    linear-gradient(
        180deg,
        #b52b2b,
        #7d1616
    );

    border-color:#ff7d7d;
}

#resetInitiativeBtn:hover{

    background:
    linear-gradient(
        180deg,
        #d93d3d,
        #962020
    );

}

#editorHeaderButtons{
    display:flex;
    align-items:center;
    gap:12px;
}

#panelMenuToggle,
#closePanelMenu{
    border:none;
    border-radius:8px;

    background:#d47a00;
    color:white;

    padding:10px 18px;

    font-size:15px;
    font-weight:700;

    cursor:pointer;

    transition:
        background .2s,
        transform .2s;
}

#panelMenuToggle:hover,
#closePanelMenu:hover{
    background:#ff9800;
    transform:translateY(-1px);
}

#topPanelMenu{
    flex-shrink:0;

    max-height:420px;
    overflow:hidden;

    background:#252525;

    border-bottom:4px solid #d47a00;

    opacity:1;

    transition:
        max-height .3s ease,
        opacity .2s ease,
        padding .3s ease,
        border-width .3s ease;
}

#topPanelMenu.panelMenuClosed{
    max-height:0;
    opacity:0;
    padding-top:0;
    padding-bottom:0;
    border-bottom-width:0;
}

#topPanelMenuHeader{
    display:flex;
    justify-content:space-between;
    align-items:center;

    padding:14px 20px;

    background:#1e1e1e;
}

#topPanelMenuHeader h2{
    color:#ffb347;
    font-size:22px;
    letter-spacing:1px;
}

#topPanelMenu #panelButtons{
    display:grid;

    grid-template-columns:
        repeat(auto-fill, minmax(150px, 1fr));

    gap:10px;

    max-height:170px;
    overflow-y:auto;

    padding:15px 20px;
}

#topPanelMenu .sidePanelButton{
    min-height:46px;
    padding:10px 12px;

    border:2px solid transparent;
    border-radius:8px;

    background:#d47a00;
    color:white;

    font-size:15px;
    font-weight:600;

    cursor:pointer;

    transition:
        background .2s,
        border-color .2s,
        transform .2s;
}

#topPanelMenu .sidePanelButton:hover{
    background:#ff9800;
    border-color:#ffd08a;
    transform:translateY(-2px);
}

#panelMenuActions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;

    padding:0 20px 15px;
}

#panelMenuActions button{
    min-height:42px;

    padding:9px 16px;

    border:none;
    border-radius:8px;

    background:#d47a00;
    color:white;

    font-weight:700;
    cursor:pointer;
}

#panelMenuActions button:hover{
    background:#ff9800;
}

#deletePanelBtn{
    background:#9d2929 !important;
}

#deletePanelBtn:hover{
    background:#ca3636 !important;
}

#panelCustomization{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:12px;

    padding:0 20px 18px;
}

#panelCustomization label{
    color:#ffcf89;
    font-weight:700;
}

#panelCustomization input[type="color"]{
    width:50px;
    height:38px;

    border:none;
    border-radius:6px;

    cursor:pointer;
}

#panelCustomization select{
    min-height:38px;

    padding:6px 10px;

    border:1px solid #777;
    border-radius:6px;

    background:#efefef;
    color:#222;
}

#topPanelMenu #panelButtons::-webkit-scrollbar{
    width:10px;
}

#topPanelMenu #panelButtons::-webkit-scrollbar-track{
    background:#333;
}

#topPanelMenu #panelButtons::-webkit-scrollbar-thumb{
    background:#d47a00;
    border-radius:10px;
}

#homeGrid{
    scrollbar-gutter:stable;
}

#homeGrid::-webkit-scrollbar{
    width:12px;
}

#homeGrid::-webkit-scrollbar-track{
    background:#353535;
}

#homeGrid::-webkit-scrollbar-thumb{
    background:#d47a00;
    border:3px solid #353535;
    border-radius:10px;
}

.panel{
    min-height:0;
}

#templateWindow{
    position:fixed;
    inset:0;
    width:100%;
    height:100%;
    transform:none;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:20px;
    background:rgba(0,0,0,.68);
    z-index:10000;
    overflow:auto;
}

#templateWindow.hidden{
    display:none !important;
}

.templateBox{
    position:relative;
    width:min(420px, 92vw);
    max-height:90vh;
    overflow:auto;
    padding:30px;
    background:#232323;
    border:3px solid #d47a00;
    border-radius:14px;
    box-shadow:0 18px 50px rgba(0,0,0,.65);
    text-align:center;
}

.panelMenuItem{
    display:grid;
    grid-template-columns:minmax(0, 1fr) auto;
    gap:6px;
    min-width:0;
}

.panelMenuItem .sidePanelButton{
    width:100%;
    min-width:0;
    margin:0;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.panelMenuDelete{
    width:44px;
    min-height:46px;
    border:2px solid #ff8b7b;
    border-radius:8px;
    background:#8f2424;
    color:#fff;
    font-size:18px;
    font-weight:800;
    cursor:pointer;
}

.panelMenuDelete:hover{
    background:#c43232;
}

#topPanelMenu{
    overflow:hidden;
}

#topPanelMenu:not(.panelMenuClosed){
    overflow-y:auto;
}

@media(max-width:900px){
    #homeGrid{
        grid-template-columns:repeat(2, minmax(0, 1fr));
        grid-auto-rows:220px;
    }
}

@media(max-width:620px){
    html, body{
        overflow:auto;
    }

    #homeGrid{
        height:auto;
        min-height:calc(100vh - 70px);
        grid-template-columns:1fr;
        grid-auto-rows:220px;
        overflow:visible;
    }
}

#initiativeTable td:nth-child(4){
    width:280px;
    min-width:280px;
}

.hpControl{
    display:grid;

    grid-template-columns:
        auto
        minmax(75px, 1fr)
        auto;

    align-items:center;
    gap:7px;
}

.hpButtons{
    display:flex;
    gap:4px;
}

.hpChangeBtn{
    min-width:40px;
    height:38px;

    padding:0 7px;

    border:2px solid transparent;
    border-radius:7px;

    color:white;

    font-size:14px;
    font-weight:800;

    cursor:pointer;

    box-shadow:
        0 3px 7px
        rgba(0,0,0,.28);

    transition:
        transform .15s,
        filter .15s;
}

.hpChangeBtn:hover{
    transform:
        translateY(-2px);

    filter:
        brightness(1.15);
}

.hpChangeBtn:active{
    transform:
        translateY(1px);
}

.hpDamageBtn{
    background:
        linear-gradient(
            180deg,
            #c83e32,
            #7e1e18
        );

    border-color:#ef8178;
}

.hpHealBtn{
    background:
        linear-gradient(
            180deg,
            #4e9a45,
            #286524
        );

    border-color:#8bc985;
}

.hpField{
    min-width:78px;
    text-align:center;

    font-size:17px !important;
    font-weight:800 !important;
}

.combatantNameCell{
    display:flex;
    flex-direction:column;
    gap:5px;
}

.unconsciousLabel{
    display:none;

    width:max-content;

    padding:3px 8px;

    border-radius:20px;

    background:#8c1717;
    color:white;

    font-size:11px;
    font-weight:900;
    letter-spacing:.7px;
}

#initiativeTable
tr.combatantUnconscious
td{
    background:
        linear-gradient(
            90deg,
            #f4c8c8,
            #ffeaea
        );

    border-top:
        2px solid #a82e2e;

    border-bottom:
        2px solid #a82e2e;
}

#initiativeTable
tr.combatantUnconscious
.unconsciousLabel{
    display:inline-block;
}

#initiativeTable
tr.combatantUnconscious
.nameField{
    border-color:#b42c2c;

    background:#fff1f1;

    text-decoration:
        line-through;
}

#initiativeTable
tr.combatantUnconscious
.hpField{
    border-color:#b42c2c;

    background:#ffe1e1;

    color:#8a1717;
}

#initiativeTable
tr.activeTurn.combatantUnconscious
td{
    background:
        linear-gradient(
            90deg,
            #e6c0c0,
            #f7dfcf
        );
}

@media(max-width:1000px){

    #initiativeTable{
        min-width:1050px;
    }

}

.monsterSheet{
    max-width:950px;
    margin:0 auto;
    padding:32px;
    background:linear-gradient(180deg,#f4e6c8,#ead5aa);
    border:3px solid #7d1f16;
    border-radius:10px;
    color:#241612;
    box-shadow:0 12px 34px rgba(0,0,0,.38);
    font-family:Georgia,"Times New Roman",serif;
}

.monsterHeader h1{margin:0;color:#7d1f16;font-size:40px;line-height:1.1;}

.monsterMeta{margin-top:6px;color:#49352d;font-style:italic;}

.monsterDivider{height:5px;margin:20px 0;background:linear-gradient(90deg,#7d1f16,#c18a3e,#7d1f16);clip-path:polygon(0 50%,2% 0,98% 0,100% 50%,98% 100%,2% 100%);}

.monsterBasicInfo,.monsterDetails{display:grid;gap:13px;}

.monsterBasicInfo label,.monsterDetails label{display:flex;flex-direction:column;gap:6px;color:#7d1f16;font-weight:700;}

.monsterShortFields{display:grid;grid-template-columns:repeat(3,minmax(130px,1fr));gap:13px;}

.monsterAbilities{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;}

.monsterAbility{display:flex;flex-direction:column;align-items:center;gap:7px;padding:13px 7px;background:rgba(255,255,255,.38);border:1px solid #aa7650;border-radius:8px;}

.monsterAbility strong{color:#7d1f16;font-size:16px;}

.monsterAbilityScore{width:68px;padding:8px;border:2px solid #9d6848;border-radius:6px;background:#fff9e9;color:#241612;text-align:center;font-size:18px;font-weight:800;}

.monsterAbilityModifier{min-width:44px;padding:4px 8px;background:#7d1f16;color:white;border-radius:20px;text-align:center;font-weight:800;}

.monsterSection{margin-top:22px;}

.monsterSection h2{margin-bottom:9px;border-bottom:2px solid #7d1f16;color:#7d1f16;font-size:26px;}

.monsterSheet .sheetInput,.monsterSheet .sheetSmall,.monsterSheet .sheetArea{width:100%;border:1px solid #9d6848;background:rgba(255,255,255,.76);color:#241612;}

.monsterSheet .sheetArea{min-height:95px;}

.addMonsterToInitiativeBtn{width:100%;margin-top:28px;padding:17px 24px;border:3px solid #d4a05a;border-radius:10px;background:linear-gradient(180deg,#9f3024,#691810);color:white;font-size:20px;font-weight:900;letter-spacing:.5px;cursor:pointer;box-shadow:0 7px 16px rgba(0,0,0,.32);transition:transform .15s,filter .15s;}

.addMonsterToInitiativeBtn:hover{transform:translateY(-2px);filter:brightness(1.15);}

@media(max-width:900px){.monsterShortFields{grid-template-columns:repeat(2,1fr);}.monsterAbilities{grid-template-columns:repeat(3,1fr);}}

@media(max-width:550px){.monsterShortFields,.monsterAbilities{grid-template-columns:repeat(2,1fr);}}

#monsterLibraryWindow{
    position:fixed;
    inset:0;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:28px;

    background:rgba(8,6,5,.78);

    z-index:12000;
}

#monsterLibraryWindow.hidden{
    display:none;
}

.monsterLibraryBox{
    width:min(1120px, 96vw);
    max-height:92vh;

    display:flex;
    flex-direction:column;

    overflow:hidden;

    background:
        linear-gradient(
            180deg,
            #2e241d,
            #171311
        );

    border:3px solid #b8752b;
    border-radius:16px;

    box-shadow:
        0 24px 70px rgba(0,0,0,.72),
        inset 0 0 30px rgba(255,179,71,.05);

    color:white;
}

.monsterLibraryHeader{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:20px;

    padding:22px 24px;

    background:
        linear-gradient(
            180deg,
            #482d20,
            #271b16
        );

    border-bottom:3px solid #b8752b;
}

.monsterLibraryHeader h2{
    margin:0;

    color:#ffbd61;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:30px;
}

.monsterLibraryHeader p{
    margin-top:5px;
    color:#d6bea0;
}

#closeMonsterLibrary{
    width:42px;
    height:42px;

    flex:0 0 auto;

    border:2px solid #f08b76;
    border-radius:50%;

    background:#8d241a;
    color:white;

    font-size:20px;
    font-weight:900;

    cursor:pointer;
}

#closeMonsterLibrary:hover{
    background:#c63b2c;
}

.monsterLibraryTools{
    display:grid;
    grid-template-columns:minmax(240px, 1fr) auto;
    gap:14px;

    padding:18px 24px 12px;
}

#monsterLibrarySearch{
    min-height:48px;
    padding:10px 15px;

    border:2px solid #856646;
    border-radius:9px;

    background:#fff8e8;
    color:#211812;

    font-size:16px;
    outline:none;
}

#monsterLibrarySearch:focus{
    border-color:#d47a00;
    box-shadow:0 0 0 3px rgba(212,122,0,.2);
}

#saveCurrentMonsterBtn{
    min-height:48px;
    padding:10px 20px;

    border:2px solid #ffbd61;
    border-radius:9px;

    background:
        linear-gradient(
            180deg,
            #b56b19,
            #7d3e08
        );

    color:white;

    font-size:16px;
    font-weight:800;

    cursor:pointer;
}

#saveCurrentMonsterBtn:hover{
    filter:brightness(1.16);
}

#monsterLibraryCount{
    padding:0 24px 12px;
    color:#d6bea0;
    font-size:14px;
}

#monsterLibraryList{
    display:grid;
    grid-template-columns:
        repeat(auto-fill, minmax(300px, 1fr));

    gap:16px;

    padding:8px 24px 24px;

    overflow-y:auto;
}

.monsterLibraryCard{
    display:flex;
    flex-direction:column;
    gap:14px;

    padding:17px;

    background:
        linear-gradient(
            180deg,
            #f2e2c4,
            #dbc39a
        );

    border:3px solid #7d1f16;
    border-radius:12px;

    color:#251711;

    box-shadow:
        0 9px 20px rgba(0,0,0,.34);
}

.monsterLibraryCardTop{
    display:grid;
    grid-template-columns:auto 1fr auto;
    gap:12px;
    align-items:start;
}

.monsterLibraryCardIcon{
    font-size:34px;
}

.monsterLibraryCardTitle h3{
    margin:0;

    color:#7d1f16;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:23px;
}

.monsterLibraryCardTitle p{
    margin-top:4px;
    color:#5e4435;
    font-size:13px;
    font-style:italic;
}

.monsterLibraryDeleteBtn{
    width:34px;
    height:34px;

    border:none;
    border-radius:50%;

    background:#8d241a;
    color:white;

    font-weight:900;
    cursor:pointer;
}

.monsterLibraryDeleteBtn:hover{
    background:#d13b2a;
}

.monsterLibraryStats{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:8px;
}

.monsterLibraryStats span{
    padding:9px 7px;

    background:rgba(255,255,255,.48);

    border:1px solid #a77b55;
    border-radius:7px;

    text-align:center;
}

.monsterLibraryStats strong{
    display:block;
    color:#7d1f16;
    font-size:12px;
}

.monsterLibraryCardActions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:9px;

    margin-top:auto;
}

.monsterLibraryCardActions button{
    min-height:43px;
    padding:8px 10px;

    border:2px solid #9c6230;
    border-radius:8px;

    background:#3d2b20;
    color:white;

    font-weight:800;
    cursor:pointer;
}

.monsterLibraryCardActions button:hover{
    background:#75411d;
}

.monsterLibraryInitiativeBtn{
    background:#7d1f16 !important;
    border-color:#d18772 !important;
}

.monsterLibraryInitiativeBtn:hover{
    background:#ad3022 !important;
}

.monsterLibraryEmpty{
    grid-column:1 / -1;

    min-height:260px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:10px;

    color:#d6bea0;
    text-align:center;
}

.monsterLibraryEmpty div{
    font-size:58px;
}

.monsterLibraryEmpty strong{
    color:#ffbd61;
    font-size:22px;
}

.monsterSheetActions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;

    margin-top:28px;
}

.saveMonsterToLibraryBtn,
.monsterSheetActions .addMonsterToInitiativeBtn{
    width:100%;
    margin-top:0;
    min-height:58px;
}

.saveMonsterToLibraryBtn{
    padding:16px 22px;

    border:3px solid #dfb966;
    border-radius:10px;

    background:
        linear-gradient(
            180deg,
            #9b6b1e,
            #60400d
        );

    color:white;

    font-size:18px;
    font-weight:900;

    cursor:pointer;

    box-shadow:
        0 7px 16px rgba(0,0,0,.3);
}

.saveMonsterToLibraryBtn:hover{
    filter:brightness(1.16);
    transform:translateY(-2px);
}

@media(max-width:720px){
    .monsterLibraryTools,
    .monsterLibraryCardActions,
    .monsterSheetActions{
        grid-template-columns:1fr;
    }

    #monsterLibraryWindow{
        padding:10px;
    }

    .monsterLibraryBox{
        max-height:96vh;
    }
}

#encounterBuilderWindow{
    position:fixed;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:22px;
    background:rgba(5,5,5,.82);
    z-index:12500;
}

#encounterBuilderWindow.hidden{display:none;}

.encounterBuilderBox{
    width:min(1450px, 98vw);
    height:min(880px, 94vh);
    display:flex;
    flex-direction:column;
    overflow:hidden;
    background:linear-gradient(180deg,#28211d,#14110f);
    border:3px solid #c17623;
    border-radius:16px;
    color:white;
    box-shadow:0 25px 80px rgba(0,0,0,.75);
}

.encounterBuilderHeader{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:18px;
    padding:20px 24px;
    background:linear-gradient(180deg,#4c2f20,#281b15);
    border-bottom:3px solid #c17623;
}

.encounterBuilderHeader h2{margin:0;color:#ffc36e;font-size:30px;font-family:Georgia,serif;}

.encounterBuilderHeader p{margin-top:5px;color:#d5b995;}

#closeEncounterBuilder{width:42px;height:42px;border:2px solid #f38b75;border-radius:50%;background:#8d241a;color:white;font-size:20px;font-weight:900;cursor:pointer;}

#closeEncounterBuilder:hover{background:#ca3829;}

.encounterBuilderLayout{
    min-height:0;
    flex:1;
    display:grid;
    grid-template-columns:minmax(280px,.9fr) minmax(430px,1.35fr) minmax(290px,.9fr);
    gap:16px;
    padding:18px;
}

.encounterMonsterPicker,.encounterDraftSection,.savedEncountersSection{
    min-height:0;
    display:flex;
    flex-direction:column;
    padding:16px;
    background:#201b18;
    border:2px solid #684724;
    border-radius:12px;
}

.encounterBuilderLayout h3{margin:0 0 12px;color:#ffbd61;font-size:21px;}

#encounterMonsterSearch,#encounterNameInput{width:100%;min-height:45px;padding:9px 12px;border:2px solid #846342;border-radius:8px;background:#fff8e9;color:#231a14;font-size:15px;outline:none;}

#encounterMonsterSearch:focus,#encounterNameInput:focus{border-color:#d47a00;box-shadow:0 0 0 3px rgba(212,122,0,.2);}

#encounterMonsterList,#savedEncounterList,#encounterDraftList{min-height:0;overflow-y:auto;margin-top:12px;padding-right:5px;}

.encounterMonsterRow{display:grid;grid-template-columns:1fr auto auto;gap:9px;align-items:center;padding:11px;margin-bottom:8px;background:#efe0c2;border:2px solid #845023;border-radius:9px;color:#271a12;}

.encounterMonsterRow strong{display:block;color:#7d1f16;font-size:16px;}

.encounterMonsterRow span{font-size:12px;color:#624a39;}

.encounterMonsterQuickStats{display:flex;flex-direction:column;gap:2px;text-align:center;}

.encounterMonsterRow button{padding:8px 10px;border:none;border-radius:7px;background:#8e4c12;color:white;font-weight:800;cursor:pointer;}

.encounterMonsterRow button:hover{background:#c26a17;}

.encounterDraftHeading{display:flex;justify-content:space-between;align-items:center;gap:10px;}

#clearEncounterBtn{padding:7px 12px;border:none;border-radius:7px;background:#86291f;color:white;font-weight:800;cursor:pointer;}

.encounterNameLabel{display:flex;flex-direction:column;gap:6px;color:#e1c49d;font-weight:700;}

.encounterDraftRow{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;padding:13px;margin-bottom:9px;background:#f1dfbc;border:2px solid #7d1f16;border-radius:9px;color:#251711;}

.encounterDraftMonsterInfo strong{display:block;color:#7d1f16;font-size:17px;}

.encounterDraftMonsterInfo span{font-size:12px;color:#624738;}

.encounterQuantityControl{display:flex;align-items:center;gap:7px;}

.encounterQuantityControl button{width:34px;height:34px;border:none;border-radius:50%;background:#81501e;color:white;font-size:19px;font-weight:900;cursor:pointer;}

.encounterQuantityControl span{min-width:27px;text-align:center;font-size:18px;font-weight:900;}

.encounterRemoveMonster{width:34px;height:34px;border:none;border-radius:50%;background:#94271d;color:white;font-weight:900;cursor:pointer;}

.encounterDraftEmpty,.savedEncounterEmpty{padding:30px 12px;color:#bda88d;text-align:center;border:2px dashed #5b4734;border-radius:9px;}

.encounterSummary{display:flex;justify-content:space-between;gap:12px;margin-top:auto;padding:14px 3px;color:#ffca7c;font-size:17px;font-weight:900;}

.encounterPrimaryActions{display:grid;grid-template-columns:1fr 1fr;gap:10px;}

.encounterPrimaryActions button{min-height:52px;border:2px solid #e1a84e;border-radius:9px;color:white;font-size:16px;font-weight:900;cursor:pointer;}

#saveEncounterBtn{background:linear-gradient(180deg,#9c6a1e,#5d3b0c);}

#startEncounterBtn{background:linear-gradient(180deg,#a93426,#6e1710);}

.encounterPrimaryActions button:hover{filter:brightness(1.15);}

.savedEncounterCard{padding:13px;margin-bottom:10px;background:#eee0c5;border:2px solid #875124;border-radius:9px;color:#271a12;}

.savedEncounterCardHeader{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;}

.savedEncounterCard h4{margin:0;color:#7d1f16;font-size:18px;}

.savedEncounterCardHeader span{font-size:12px;color:#624738;}

.deleteSavedEncounter{width:31px;height:31px;border:none;border-radius:50%;background:#8d241a;color:white;font-weight:900;cursor:pointer;}

.savedEncounterPreview{display:flex;flex-wrap:wrap;gap:5px;margin:10px 0;}

.savedEncounterPreview span{padding:4px 7px;background:#d3b98e;border-radius:20px;font-size:12px;}

.savedEncounterActions{display:grid;grid-template-columns:1fr 1fr;gap:7px;}

.savedEncounterActions button{min-height:38px;border:none;border-radius:7px;background:#4b3425;color:white;font-weight:800;cursor:pointer;}

.savedEncounterActions .startSavedEncounter{background:#7d1f16;}

.encounterEmptyState{min-height:220px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;color:#c3ab8c;text-align:center;}

.encounterEmptyState span{font-size:48px;}

@media(max-width:1100px){
    .encounterBuilderBox{height:96vh;}
    .encounterBuilderLayout{grid-template-columns:1fr;overflow-y:auto;}
    .encounterMonsterPicker,.encounterDraftSection,.savedEncountersSection{min-height:360px;}
}

@media(max-width:650px){
    #encounterBuilderWindow{padding:6px;}
    .encounterBuilderLayout{padding:9px;}
    .encounterPrimaryActions{grid-template-columns:1fr;}
}

#mapLibraryWindow{
    position:fixed;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;
    background:rgba(5,9,7,.82);
    z-index:12500;
}

#mapLibraryWindow.hidden{display:none;}

.mapLibraryBox{
    width:min(1280px, 97vw);
    max-height:94vh;
    display:flex;
    flex-direction:column;
    overflow:hidden;
    background:linear-gradient(180deg,#25352d,#101713);
    border:3px solid #62916e;
    border-radius:16px;
    color:white;
    box-shadow:0 25px 75px rgba(0,0,0,.72);
}

.mapLibraryHeader{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:20px;
    padding:20px 24px;
    background:linear-gradient(180deg,#315b46,#1c382b);
    border-bottom:3px solid #79a981;
}

.mapLibraryHeader h2{margin:0;color:#d9f2c9;font-size:30px;}

.mapLibraryHeader p{margin-top:5px;color:#bad4bc;}

#closeMapLibrary{
    width:42px;height:42px;border:2px solid #e7aca0;border-radius:50%;
    background:#8b2c22;color:white;font-size:20px;font-weight:900;cursor:pointer;
}

#closeMapLibrary:hover{background:#c74334;}

.mapLibraryLayout{
    display:grid;
    grid-template-columns:330px minmax(0,1fr);
    min-height:0;
    overflow:hidden;
}

.mapUploadSection{
    display:flex;
    flex-direction:column;
    gap:13px;
    padding:20px;
    overflow-y:auto;
    background:#18241e;
    border-right:2px solid #4c6e57;
}

.mapUploadSection h3,.mapCollectionSection h3{color:#d9f2c9;}

.mapUploadSection label{display:flex;flex-direction:column;gap:6px;color:#cde1cf;font-weight:700;}

.mapUploadSection input,.mapUploadSection select,.mapUploadSection textarea,
.mapCollectionTools input,.mapCollectionTools select{
    width:100%;padding:10px;border:2px solid #66806c;border-radius:8px;
    background:#f2f7ee;color:#182019;font-size:15px;outline:none;
}

.mapUploadSection textarea{min-height:95px;resize:vertical;}

.mapUploadPreview{
    min-height:180px;display:flex;align-items:center;justify-content:center;
    overflow:hidden;border:2px dashed #66806c;border-radius:10px;
    background:#0e1712;color:#9bb39e;text-align:center;
}

.mapUploadPreview img{width:100%;height:210px;object-fit:contain;background:#0a0e0b;}

#saveMapToLibraryBtn{
    min-height:50px;border:2px solid #b9dea9;border-radius:9px;
    background:linear-gradient(180deg,#4d895c,#285136);color:white;
    font-size:16px;font-weight:900;cursor:pointer;
}

#saveMapToLibraryBtn:hover{filter:brightness(1.15);}

.mapCollectionSection{display:flex;flex-direction:column;min-width:0;min-height:0;padding:18px 20px 22px;}

.mapCollectionTools{display:grid;grid-template-columns:minmax(220px,1fr) 190px;gap:12px;}

#mapLibraryCount{padding:12px 2px;color:#abc8af;font-size:14px;}

#mapLibraryList{
    display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
    gap:16px;overflow-y:auto;padding:2px 5px 12px 2px;
}

.mapLibraryCard{
    overflow:hidden;background:#e5eadc;border:3px solid #42654c;border-radius:12px;
    color:#172019;box-shadow:0 9px 22px rgba(0,0,0,.38);
}

.mapLibraryPreview{position:relative;height:180px;background:#111a14;overflow:hidden;}

.mapLibraryPreview img{width:100%;height:100%;object-fit:cover;transition:transform .25s;}

.mapLibraryCard:hover .mapLibraryPreview img{transform:scale(1.04);}

.mapLibraryPreview span{position:absolute;left:10px;bottom:10px;padding:5px 9px;border-radius:20px;background:rgba(17,31,22,.85);color:white;font-size:12px;font-weight:800;}

.mapLibraryCardBody{padding:14px;}

.mapLibraryCardHeading{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:start;}

.mapLibraryCardHeading h3{margin:0;color:#315b46;font-size:21px;}

.mapLibraryCardBody p{min-height:42px;margin:8px 0 13px;color:#4d5a4f;font-size:13px;white-space:pre-wrap;}

.mapLibraryDeleteBtn{width:34px;height:34px;border:none;border-radius:50%;background:#913026;color:white;font-weight:900;cursor:pointer;}

.mapLibraryDeleteBtn:hover{background:#d04535;}

.mapLibraryOpenBtn{width:100%;min-height:43px;border:2px solid #64856b;border-radius:8px;background:#315b46;color:white;font-weight:900;cursor:pointer;}

.mapLibraryOpenBtn:hover{background:#457b5e;}

.mapLibraryEmpty{grid-column:1/-1;min-height:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;color:#a9c3ad;text-align:center;}

.mapLibraryEmpty div{font-size:62px;}

.mapLibraryEmpty strong{color:#d9f2c9;font-size:23px;}

.mapPanel{display:flex;flex-direction:column;gap:14px;min-height:100%;}

.mapPanelToolbar{
    position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:center;
    flex-wrap:wrap;gap:9px;padding:11px;background:rgba(24,38,29,.94);
    border:2px solid #5f8b69;border-radius:10px;
}

.mapPanelToolbar button{min-width:48px;min-height:40px;padding:7px 13px;border:2px solid #a9cea8;border-radius:7px;background:#315b46;color:white;font-weight:800;cursor:pointer;}

.mapPanelToolbar button:hover{background:#4b8463;}

.mapZoomLabel{min-width:70px;color:white;text-align:center;font-weight:900;}

.mapPanelViewport{
    flex:1;min-height:500px;overflow:auto;display:flex;align-items:flex-start;justify-content:flex-start;
    padding:20px;background:#111713;border:3px solid #42654c;border-radius:12px;
}

.mapPanelImage{display:block;max-width:none;max-height:none;width:auto;height:auto;margin:0;transform-origin:top left;border:none;transition:transform .15s;}

.mapPanelInformation{padding:18px;background:#e8eddc;border:2px solid #65806c;border-radius:10px;color:#172019;}

.mapPanelInformation h1{margin:0 0 8px;color:#315b46;}

.mapPanelInformation p{white-space:pre-wrap;}

@media(max-width:850px){
    .mapLibraryLayout{grid-template-columns:1fr;overflow-y:auto;}
    .mapUploadSection{border-right:none;border-bottom:2px solid #4c6e57;}
    .mapCollectionSection{min-height:500px;}
}

@media(max-width:600px){
    #mapLibraryWindow{padding:8px;}
    .mapCollectionTools{grid-template-columns:1fr;}
}

#panelChooserWindow,
#npcLibraryWindow{
    position:fixed;
    inset:0;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:26px;

    background:rgba(7,6,5,.78);

    z-index:12500;
}

#panelChooserWindow.hidden,
#npcLibraryWindow.hidden{
    display:none;
}

.panelChooserBox,
.npcLibraryBox{
    width:min(1050px, 96vw);
    max-height:92vh;

    display:flex;
    flex-direction:column;

    overflow:hidden;

    background:
        linear-gradient(
            180deg,
            #2c2520,
            #171411
        );

    border:3px solid #d47a00;
    border-radius:16px;

    color:white;

    box-shadow:
        0 24px 70px rgba(0,0,0,.72);
}

.panelChooserHeader,
.npcLibraryHeader{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:20px;

    padding:21px 24px;

    background:#211b17;

    border-bottom:3px solid #d47a00;
}

.panelChooserHeader h2,
.npcLibraryHeader h2{
    margin:0;

    color:#ffbd61;

    font-size:29px;
}

.panelChooserHeader p,
.npcLibraryHeader p{
    margin-top:5px;
    color:#d4b998;
}

#closePanelChooser,
#closeNpcLibrary{
    width:42px;
    height:42px;

    border:2px solid #ed8b76;
    border-radius:50%;

    background:#8e281d;
    color:white;

    font-size:19px;
    font-weight:900;

    cursor:pointer;
}

.panelChooserTools,
.npcLibraryTools{
    display:grid;
    grid-template-columns:minmax(230px, 1fr) auto;
    gap:13px;

    padding:17px 24px 13px;
}

#panelChooserSearch,
#npcLibrarySearch{
    min-height:47px;
    padding:10px 14px;

    border:2px solid #806244;
    border-radius:9px;

    background:#fff8e9;
    color:#211812;

    font-size:16px;
}

#panelChooserAddBtn,
#saveCurrentNpcBtn{
    min-height:47px;
    padding:9px 19px;

    border:2px solid #ffbd61;
    border-radius:9px;

    background:
        linear-gradient(
            180deg,
            #bb711e,
            #783d09
        );

    color:white;

    font-size:16px;
    font-weight:800;

    cursor:pointer;
}

#panelChooserList,
#npcLibraryList{
    overflow-y:auto;
    padding:10px 24px 24px;
}

#panelChooserList{
    display:grid;
    grid-template-columns:
        repeat(auto-fill, minmax(245px, 1fr));
    gap:12px;
}

.panelChooserItem{
    display:grid;
    grid-template-columns:1fr auto;

    overflow:hidden;

    border:2px solid #8a623c;
    border-radius:10px;

    background:#30251e;
}

.panelChooserOpenBtn{
    display:flex;
    align-items:center;
    gap:12px;

    min-height:65px;
    padding:11px 14px;

    border:none;

    background:transparent;
    color:white;

    text-align:left;
    cursor:pointer;
}

.panelChooserOpenBtn:hover{
    background:#5c371b;
}

.panelChooserIcon{
    font-size:28px;
}

.panelChooserOpenBtn span:last-child{
    display:flex;
    flex-direction:column;
    gap:3px;
}

.panelChooserOpenBtn small{
    color:#cdb290;
    text-transform:capitalize;
}

.panelChooserDeleteBtn{
    width:45px;

    border:none;
    border-left:1px solid #7e5b39;

    background:#77231b;
    color:white;

    font-weight:900;
    cursor:pointer;
}

.panelChooserDeleteBtn:hover{
    background:#bd382a;
}

.panelChooserEmpty{
    grid-column:1 / -1;
    padding:60px 20px;

    color:#d4b998;
    text-align:center;
}

.npcSheet{
    max-width:900px;

    margin:0 auto;
    padding:30px;

    background:
        linear-gradient(
            180deg,
            #eee3f4,
            #d6c1e0
        );

    border:3px solid #62417b;
    border-radius:12px;

    color:#24182a;

    box-shadow:
        0 12px 30px rgba(0,0,0,.34);
}

.npcSheetHeader{
    margin-bottom:20px;
    padding-bottom:14px;

    border-bottom:4px double #76518d;
}

.npcSheetHeader h1{
    margin:0;
    color:#56346f;
    font-size:36px;
}

.npcSheetHeader p{
    margin-top:5px;
    color:#67506f;
    font-style:italic;
}

.npcIdentityGrid{
    display:grid;
    grid-template-columns:
        repeat(2, minmax(180px, 1fr));
    gap:13px;
}

.npcCombatGrid{
    display:grid;
    grid-template-columns:110px 110px 1fr;
    gap:13px;

    margin-top:15px;
}

.npcSheet label{
    display:flex;
    flex-direction:column;
    gap:5px;

    color:#56346f;
    font-weight:800;
}

.npcSection{
    margin-top:21px;
}

.npcSection h2{
    margin-bottom:9px;

    border-bottom:2px solid #76518d;

    color:#56346f;
    font-size:24px;
}

.npcSheet .sheetInput,
.npcSheet .sheetSmall,
.npcSheet .sheetArea{
    width:100%;

    border:1px solid #896da0;

    background:rgba(255,255,255,.78);
    color:#24182a;
}

.saveNpcToLibraryBtn{
    width:100%;

    margin-top:25px;
    padding:16px 22px;

    border:3px solid #c89be4;
    border-radius:10px;

    background:
        linear-gradient(
            180deg,
            #795097,
            #4b2d62
        );

    color:white;

    font-size:19px;
    font-weight:900;

    cursor:pointer;

    box-shadow:
        0 7px 16px rgba(0,0,0,.28);
}

.saveNpcToLibraryBtn:hover{
    filter:brightness(1.16);
    transform:translateY(-2px);
}

#npcLibraryCount{
    padding:0 24px 12px;
    color:#d4b998;
}

#npcLibraryList{
    display:grid;
    grid-template-columns:
        repeat(auto-fill, minmax(310px, 1fr));
    gap:16px;
}

.npcLibraryCard{
    display:flex;
    flex-direction:column;
    gap:14px;

    padding:17px;

    background:
        linear-gradient(
            180deg,
            #eee3f4,
            #d4bedf
        );

    border:3px solid #62417b;
    border-radius:12px;

    color:#25182d;

    box-shadow:
        0 9px 20px rgba(0,0,0,.34);
}

.npcLibraryCardTop{
    display:grid;
    grid-template-columns:auto 1fr auto;
    gap:12px;
    align-items:start;
}

.npcLibraryPortrait,
.npcLibraryPortraitPlaceholder{
    width:68px;
    height:68px;

    border:3px solid #76518d;
    border-radius:10px;

    object-fit:cover;
}

.npcLibraryPortraitPlaceholder{
    display:flex;
    align-items:center;
    justify-content:center;

    background:#f8f0fc;

    font-size:34px;
}

.npcLibraryCardTitle h3{
    margin:0;

    color:#56346f;
    font-size:23px;
}

.npcLibraryCardTitle p{
    margin-top:4px;

    color:#695171;
    font-size:13px;
    font-style:italic;
}

.npcLibraryDeleteBtn{
    width:34px;
    height:34px;

    border:none;
    border-radius:50%;

    background:#8d241a;
    color:white;

    font-weight:900;
    cursor:pointer;
}

.npcLibraryStats{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:8px;
}

.npcLibraryStats span{
    padding:9px 7px;

    background:rgba(255,255,255,.5);

    border:1px solid #9276a6;
    border-radius:7px;

    text-align:center;
}

.npcLibraryStats strong{
    display:block;

    color:#56346f;
    font-size:12px;
}

.npcLibraryMeta{
    display:flex;
    flex-wrap:wrap;
    gap:8px;

    min-height:25px;
}

.npcLibraryMeta span{
    padding:5px 8px;

    background:rgba(255,255,255,.45);

    border-radius:20px;

    font-size:12px;
}

.npcLibraryOpenBtn{
    min-height:43px;

    margin-top:auto;

    border:2px solid #87629d;
    border-radius:8px;

    background:#56346f;
    color:white;

    font-weight:800;
    cursor:pointer;
}

.npcLibraryOpenBtn:hover{
    background:#7b4e9a;
}

.npcLibraryEmpty{
    grid-column:1 / -1;

    min-height:260px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:10px;

    color:#d4b998;
    text-align:center;
}

.npcLibraryEmpty div{
    font-size:58px;
}

.npcLibraryEmpty strong{
    color:#ffbd61;
    font-size:22px;
}

@media(max-width:720px){
    .panelChooserTools,
    .npcLibraryTools,
    .npcIdentityGrid,
    .npcCombatGrid{
        grid-template-columns:1fr;
    }

    #panelChooserWindow,
    #npcLibraryWindow{
        padding:10px;
    }
}

.npcSheetActions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    margin-top:25px;
}

.npcSheetActions .saveNpcToLibraryBtn{
    margin-top:0;
}

.addNpcToInitiativeBtn{
    width:100%;
    min-height:58px;
    padding:16px 22px;

    border:3px solid #d7a66b;
    border-radius:10px;

    background:
        linear-gradient(
            180deg,
            #9d4d24,
            #642812
        );

    color:white;

    font-size:19px;
    font-weight:900;

    cursor:pointer;

    box-shadow:
        0 7px 16px rgba(0,0,0,.28);
}

.addNpcToInitiativeBtn:hover{
    filter:brightness(1.16);
    transform:translateY(-2px);
}

.monsterLibraryStats{
    grid-template-columns:repeat(4, 1fr);
}

@media(max-width:720px){
    .npcSheetActions{
        grid-template-columns:1fr;
    }

    .monsterLibraryStats{
        grid-template-columns:repeat(2, 1fr);
    }
}

.npcSheetLegacy{
    max-width:900px;
    margin:0 auto;
}

.npcSheetActions{
    display:grid !important;
    grid-template-columns:1fr 1fr;
    gap:12px;
    width:100%;
    margin-top:25px;
}

.addNpcToInitiativeBtn,
.saveNpcToLibraryBtn{
    display:block !important;
    min-height:58px;
}

@media(max-width:720px){
    .npcSheetActions{
        grid-template-columns:1fr;
    }
}

#editorHeader{
    min-height:78px;
    height:auto;

    gap:18px;
    padding:10px 18px;
}

#editorHeaderButtons{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    flex-wrap:wrap;
    gap:9px;
}

#editorHeaderButtons > button{
    min-height:42px;
    padding:8px 14px;

    border:none;
    border-radius:8px;

    background:#d47a00;
    color:white;

    font-weight:800;
    cursor:pointer;

    transition:
        transform .15s,
        filter .15s;
}

#editorHeaderButtons > button:hover{
    transform:translateY(-1px);
    filter:brightness(1.12);
}

#resetPanelBtn{
    background:#8a5c18 !important;
}

#deletePanelBtn{
    background:#9c2e24 !important;
}

#panelColorControl,
#panelIconControl{
    min-height:42px;

    display:flex;
    align-items:center;
    gap:7px;

    padding:5px 9px;

    border:1px solid #6e6e6e;
    border-radius:8px;

    background:#242424;
    color:#ffcf8b;

    font-size:12px;
    font-weight:800;
}

#panelColorControl input[type="color"]{
    width:38px;
    height:30px;

    padding:0;

    border:none;
    border-radius:5px;

    background:none;
    cursor:pointer;
}

#panelIconControl select{
    min-height:30px;
    max-width:135px;

    border:none;
    border-radius:5px;

    background:#f3f3f3;
    color:#222;

    cursor:pointer;
}

.npcLibraryTools,
.monsterLibraryTools{
    grid-template-columns:minmax(230px, 1fr) auto auto;
}

.libraryCreateBtn{
    min-height:48px;
    padding:9px 17px;

    border:2px solid #86c97d;
    border-radius:9px;

    background:
        linear-gradient(
            180deg,
            #4d9544,
            #286121
        );

    color:white;

    font-size:15px;
    font-weight:900;

    cursor:pointer;

    transition:
        transform .15s,
        filter .15s;
}

.libraryCreateBtn:hover{
    transform:translateY(-2px);
    filter:brightness(1.15);
}

#addCombatantBtn::before{
    content:none !important;
}

#topPanelMenu,
#panelMenuToggle{
    display:none !important;
}

@media(max-width:980px){

    #editorHeader{
        align-items:flex-start;
    }

    #editorHeaderButtons{
        justify-content:flex-start;
    }

    .npcLibraryTools,
    .monsterLibraryTools{
        grid-template-columns:1fr;
    }

}

header{
    position:sticky;
    top:0;
    z-index:5000;
    flex-shrink:0;
}

#logo{
    appearance:none;
    -webkit-appearance:none;

    border:none !important;
    outline:none;

    background:transparent !important;
    box-shadow:none !important;

    margin:0;
    padding:0;

    color:#ffb347;

    font-family:inherit;
    font-size:28px;
    font-weight:bold;
    letter-spacing:2px;

    cursor:pointer;
}

#logo:hover,
#logo:focus{
    background:transparent !important;
    color:#ffd08a;
    box-shadow:none !important;
}

#editorView{
    height:calc(100vh - 70px);
    min-height:0;
    overflow:hidden;
}

#editorLeft{
    min-width:0;
    min-height:0;

    display:flex;
    flex-direction:column;

    overflow:hidden;
}

#editorHeader{
    position:sticky;
    top:0;
    z-index:4000;

    width:100%;
    min-height:54px;
    height:54px;

    flex-shrink:0;

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;

    padding:7px 16px;

    background:#252525;
    border-bottom:3px solid #d47a00;

    box-shadow:0 4px 12px rgba(0,0,0,.28);
}

#documentTitle{
    min-width:0;

    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;

    font-size:23px;
    font-weight:800;
}

#editorHeaderButtons{
    display:flex;
    align-items:center;
    flex-shrink:0;
    gap:9px;
}

#backButton,
#panelSettingsBtn{
    width:auto !important;
    min-width:105px;
    height:38px !important;
    min-height:38px !important;

    padding:0 14px !important;

    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:6px;

    border:none;
    border-radius:8px;

    background:#d47a00;
    color:white;

    font-size:14px !important;
    font-weight:800;
    line-height:1;

    cursor:pointer;

    transition:
        background .18s,
        transform .18s;
}

#backButton:hover,
#panelSettingsBtn:hover{
    background:#ff9800;
    transform:translateY(-1px);
}

#panelSettingsWrapper{
    position:relative;
}

#panelSettingsMenu{
    position:absolute;
    top:46px;
    right:0;
    z-index:7000;

    width:230px;

    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:7px;

    padding:11px;

    background:#242424;
    border:2px solid #d47a00;
    border-radius:11px;

    box-shadow:0 14px 32px rgba(0,0,0,.58);
}

#panelSettingsMenu.hidden{
    display:none !important;
}

#panelSettingsMenu > button,
#panelSettingsMenu > label{
    width:100%;
    min-height:42px;

    margin:0;
    padding:9px 11px;

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;

    border:none;
    border-radius:7px;

    background:#353535;
    color:white;

    font-family:inherit;
    font-size:14px;
    font-weight:700;
    text-align:left;

    cursor:pointer;
}

#panelSettingsMenu > button:hover,
#panelSettingsMenu > label:hover{
    background:#484848;
}

#panelSettingsMenu input[type="color"]{
    width:44px;
    height:29px;

    padding:0;

    border:none;
    border-radius:5px;

    background:none;
    cursor:pointer;
}

#panelSettingsMenu select{
    width:112px;
    min-height:30px;

    border:none;
    border-radius:5px;

    background:#f2f2f2;
    color:#222;
}

#resetPanelBtn{
    background:#73501c !important;
}

#resetPanelBtn:hover{
    background:#946824 !important;
}

#deletePanelBtn{
    background:#86271f !important;
}

#deletePanelBtn:hover{
    background:#b5362a !important;
}

#editorToolbar{
    flex-shrink:0;
}

#editor,
#initiativeTracker{
    min-height:0;
    flex:1;

    overflow-y:auto;
    overflow-x:auto;
}

@media(max-width:760px){

    #editorHeader{
        min-height:58px;
        height:58px;

        padding:7px 9px;
        gap:8px;
    }

    #documentTitle{
        font-size:18px;
    }

    #backButton,
    #panelSettingsBtn{
        min-width:auto;
        padding:0 10px !important;
        font-size:13px !important;
    }

    #panelSettingsMenu{
        right:0;
        width:min(230px, 88vw);
    }

}

#initiativeTable{
    min-width:1450px;
}

#initiativeTable th:nth-child(1){ width:100px; }

#initiativeTable th:nth-child(2){ width:180px; }

#initiativeTable th:nth-child(3){ width:80px; }

#initiativeTable th:nth-child(4){ width:330px; }

#initiativeTable th:nth-child(5){ width:160px; }

#initiativeTable th:nth-child(6){ width:250px; }

#initiativeTable th:nth-child(7){ width:220px; }

#initiativeTable th:nth-child(8){ width:65px; }

.rollModeField,
.conditionSelect{
    width:100%;
    min-height:34px;
    margin-top:6px;
    padding:5px 7px;

    border:1px solid #a98c66;
    border-radius:6px;

    background:#fffaf0;
    color:#231a14;
}

.tempHpControl{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;

    margin-top:7px;

    color:#6b4317;
    font-size:12px;
    font-weight:800;
}

.tempHpControl input{
    width:65px !important;
    min-height:34px !important;
    text-align:center;
}

.deathSaves{
    display:flex;
    flex-direction:column;
    gap:5px;

    margin-top:8px;
    padding:8px;

    border:2px solid #8b2520;
    border-radius:8px;

    background:#fff0ee;
    color:#62201b;

    font-size:12px;
    font-weight:800;
}

.deathSaves.hidden{
    display:none;
}

.deathSaves > div{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
}

.deathSaveBtn{
    width:28px;
    height:28px;

    border:none;
    border-radius:50%;

    color:white;
    font-weight:900;
    cursor:pointer;
}

.deathSaveBtn.success{ background:#38843a; }

.deathSaveBtn.failure{ background:#9e2d25; }

.combatStateButtons{
    display:flex;
    flex-direction:column;
    gap:8px;
}

.combatToggleBtn{
    min-height:40px;
    padding:7px 9px;

    border:2px solid #9a8062;
    border-radius:7px;

    background:#efe3cf;
    color:#3b2b20;

    font-size:12px;
    font-weight:800;
    cursor:pointer;
}

.combatToggleBtn.active.concentrationBtn{
    border-color:#7656a8;
    background:#d8c7f1;
    color:#43296c;
}

.combatToggleBtn.active.reactionBtn{
    border-color:#a33d32;
    background:#f3c8c3;
    color:#78241d;
}

.conditionControl{
    display:flex;
    flex-direction:column;
    gap:8px;
}

.conditionTags{
    display:flex;
    flex-wrap:wrap;
    gap:5px;
}

.conditionTag{
    padding:4px 7px;

    border:1px solid #9a5f24;
    border-radius:16px;

    background:#f2d49f;
    color:#573713;

    font-size:11px;
    font-weight:800;
    cursor:pointer;
}

.noConditions{
    color:#806f5e;
    font-size:12px;
    font-style:italic;
}

#initiativeTable .notesField{
    width:100%;
    min-height:78px;
    padding:8px;

    resize:vertical;

    border:2px solid #b6a383;
    border-radius:7px;

    background:#fffdf7;
    color:#1d1814;
}

#initiativeTable tr.isConcentrating td:nth-child(2){
    box-shadow:inset 5px 0 0 #7656a8;
}

#initiativeTable tr.reactionUsed td:nth-child(5){
    opacity:.82;
}

#resetReactionsBtn{
    background:linear-gradient(180deg,#5d72a8,#34477e) !important;
    border-color:#a9b8e3 !important;
}

@media(max-width:900px){
    #initiativeTable{
        min-width:1400px;
    }
}

.mapPanelStatus{
    padding:10px 14px;

    border:1px solid #66866d;
    border-radius:8px;

    background:#dce9d9;
    color:#26392b;

    font-size:13px;
    font-weight:700;
}

.mapPanelViewport{
    position:relative;

    min-height:520px;
    max-height:72vh;

    overflow:auto;

    background:
        linear-gradient(
            45deg,
            #1d2520 25%,
            #222d26 25%,
            #222d26 50%,
            #1d2520 50%,
            #1d2520 75%,
            #222d26 75%
        );

    background-size:32px 32px;

    cursor:grab;
    user-select:none;
    touch-action:none;
}

.mapPanelViewport.mapDragging{
    cursor:grabbing;
}

.mapPanelViewport.mapPinMode{
    cursor:crosshair;
}

.mapStage{
    position:relative;

    min-width:1px;
    min-height:1px;

    transform-origin:top left;
}

.mapPanelImage{
    position:absolute;
    inset:0;

    display:block;

    max-width:none !important;
    max-height:none !important;

    margin:0 !important;

    object-fit:fill;

    border:none !important;

    pointer-events:none;
    user-select:none;
}

.mapPinLayer{
    position:absolute;
    inset:0;

    pointer-events:none;
}

.mapPin{
    position:absolute;

    display:flex;
    flex-direction:column;
    align-items:center;

    transform:translate(-50%, -100%);

    padding:0;

    border:none;
    background:transparent;

    color:white;

    cursor:pointer;
    pointer-events:auto;

    filter:drop-shadow(0 3px 4px rgba(0,0,0,.75));
}

.mapPinSymbol{
    width:36px;
    height:36px;

    display:flex;
    align-items:center;
    justify-content:center;

    border:3px solid white;
    border-radius:50% 50% 50% 0;

    background:#c1442e;
    color:white;

    font-size:17px;
    font-weight:900;

    transform:rotate(-45deg);
}

.mapPinSymbol::first-letter{
    transform:rotate(45deg);
}

.mapPinSymbol{
    line-height:1;
}

.mapPinSymbol > *{
    transform:rotate(45deg);
}

.mapPinLabel{
    max-width:180px;

    margin-top:6px;
    padding:5px 8px;

    border:1px solid rgba(255,255,255,.7);
    border-radius:7px;

    background:rgba(20,20,20,.86);
    color:white;

    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;

    font-size:12px;
    font-weight:800;
}

.mapLabelsHidden .mapPinLabel{
    display:none;
}

.mapPin-town .mapPinSymbol,
.mapPin-village .mapPinSymbol{
    background:#347a4c;
}

.mapPin-capital .mapPinSymbol,
.mapPin-castle .mapPinSymbol{
    background:#7652a8;
}

.mapPin-dungeon .mapPinSymbol,
.mapPin-cave .mapPinSymbol{
    background:#7a3528;
}

.mapPin-ruins .mapPinSymbol{
    background:#75644b;
}

.mapPin-temple .mapPinSymbol{
    background:#3f70a8;
}

.mapPin-camp .mapPinSymbol{
    background:#9a682a;
}

.mapPin-quest .mapPinSymbol{
    background:#b98713;
    color:#1e1708;
}

#mapPinWindow{
    position:fixed;
    inset:0;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:24px;

    background:rgba(5,7,6,.75);

    z-index:14000;
}

#mapPinWindow.hidden{
    display:none;
}

.mapPinBox{
    width:min(520px, 95vw);

    overflow:hidden;

    border:3px solid #4e8a61;
    border-radius:14px;

    background:#202823;
    color:white;

    box-shadow:0 22px 60px rgba(0,0,0,.7);
}

.mapPinHeader{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:18px;

    padding:18px 20px;

    border-bottom:3px solid #4e8a61;

    background:#172019;
}

.mapPinHeader h2{
    margin:0;
    color:#a9d7b1;
}

.mapPinHeader p{
    margin-top:5px;
    color:#abc0ae;
}

#closeMapPinWindow{
    width:38px;
    height:38px;

    border:2px solid #df8d7e;
    border-radius:50%;

    background:#8c2d22;
    color:white;

    font-weight:900;
    cursor:pointer;
}

.mapPinForm{
    display:grid;
    gap:14px;

    padding:20px;
}

.mapPinForm label{
    display:flex;
    flex-direction:column;
    gap:6px;

    color:#cbe1cf;
    font-weight:800;
}

.mapPinForm input,
.mapPinForm select,
.mapPinForm textarea{
    width:100%;

    padding:10px 11px;

    border:2px solid #66866d;
    border-radius:8px;

    background:#f2f7ef;
    color:#182019;

    font:inherit;
}

.mapPinForm textarea{
    min-height:110px;
    resize:vertical;
}

.mapPinActions{
    display:flex;
    justify-content:flex-end;
    gap:10px;

    padding:0 20px 20px;
}

.mapPinActions button{
    min-height:43px;

    padding:9px 16px;

    border:none;
    border-radius:8px;

    color:white;

    font-weight:900;
    cursor:pointer;
}

#deleteMapPinBtn{
    margin-right:auto;
    background:#8b2f25;
}

#saveMapPinBtn{
    background:#3e7a50;
}

#deleteMapPinBtn:hover,
#saveMapPinBtn:hover{
    filter:brightness(1.15);
}

.mapPanelViewport:fullscreen{
    max-height:none;

    width:100vw;
    height:100vh;

    background:#101512;
}

@media(max-width:720px){

    .mapPanelViewport{
        min-height:400px;
    }

    .mapPanelToolbar{
        align-items:stretch;
    }

    .mapPanelToolbar button{
        flex:1;
    }

}

.mapPanel{
    position:relative;
}

.mapPanelToolbar{
    position:sticky;
    top:0;
    z-index:3200;

    width:100%;

    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;

    margin:0;
    padding:10px 12px;

    background:#1e2922;
    border:2px solid #4f8060;
    border-radius:9px 9px 0 0;

    box-shadow:
        0 5px 12px rgba(0,0,0,.35);
}

.mapPanelStatus{
    position:sticky;
    top:60px;
    z-index:3100;

    margin:0 0 10px;

    border-radius:0 0 8px 8px;

    box-shadow:
        0 4px 9px rgba(0,0,0,.22);
}

.mapPanelViewport{
    position:relative;

    overflow:auto;

    padding:0;

    scroll-behavior:auto;
}

.mapStage{
    position:relative;

    transform-origin:top left;

    flex:none;
}

.mapPanelViewport::after{
    content:"";

    display:block;

    width:var(--scaled-map-width, 100%);
    height:var(--scaled-map-height, 100%);

    pointer-events:none;
}

.mapPinLayer{
    position:absolute;
    inset:0;

    width:100%;
    height:100%;

    pointer-events:none;
}

.mapPin{
    transform:translate(-50%, -100%);
    transform-origin:center bottom;
}

.mapPanelToolbar + .mapPanelStatus + .mapPanelViewport{
    margin-top:0;
}

@media(max-width:720px){

    .mapPanelToolbar{
        top:0;
    }

    .mapPanelStatus{
        top:112px;
    }

}

.mapPin{
    transform:
        translate(-50%, -100%)
        scale(var(--map-marker-scale, 1));

    transform-origin:center bottom;
}

.mapPinSymbol{
    transition:
        transform .12s ease,
        width .12s ease,
        height .12s ease;
}

.mapPinLabel{
    transition:
        font-size .12s ease,
        padding .12s ease;
}

.mapStage{
    --map-marker-scale:1;
}

#mapUploadPreview small{
    display:block;

    margin-top:8px;

    color:#a9d7b1;

    font-size:12px;
    font-weight:700;
    text-align:center;
}

html,
body{
    height:100%;
    overflow:hidden;
}

body{
    display:flex;
    flex-direction:column;
}

header{
    position:fixed !important;
    top:0;
    left:0;
    right:0;

    height:70px;

    z-index:20000 !important;

    flex-shrink:0;

    background:#2d2d2d;
}

#homeGrid{
    margin-top:70px;
    height:calc(100vh - 70px) !important;
}

#editorView{
    margin-top:70px;

    height:calc(100vh - 70px) !important;

    overflow:hidden !important;
}

#editorLeft{
    height:100%;
    min-height:0;

    display:flex;
    flex-direction:column;

    overflow:hidden;
}

#editorHeader{
    position:sticky !important;
    top:0 !important;

    z-index:15000 !important;

    flex-shrink:0;

    background:#252525 !important;
}

#editorToolbar{
    position:sticky;
    top:54px;

    z-index:14000;

    flex-shrink:0;
}

#editor,
#initiativeTracker{
    flex:1;
    min-height:0;

    overflow:auto !important;
}

.mapPanelToolbar{
    position:sticky !important;
    top:0 !important;

    z-index:5000 !important;
}

.mapPanelStatus{
    position:sticky !important;
    top:60px !important;

    z-index:4900 !important;
}

.mapPanelViewport:fullscreen{
    position:relative;
}

.mapPanelViewport:fullscreen #mapPinWindow,
.mapPanelViewport:-webkit-full-screen #mapPinWindow{
    position:fixed;
    inset:0;

    width:100%;
    height:100%;

    display:flex;
    align-items:center;
    justify-content:center;

    z-index:50000;
}

.mapPanelViewport:fullscreen #mapPinWindow.hidden,
.mapPanelViewport:-webkit-full-screen #mapPinWindow.hidden{
    display:none;
}

.mapPanelViewport:fullscreen .mapPinBox,
.mapPanelViewport:-webkit-full-screen .mapPinBox{
    position:relative;

    z-index:50001;

    max-height:90vh;
    overflow:auto;
}

.mapPanel{
    position:relative;

    display:flex;
    flex-direction:column;

    min-height:0;
}

.mapPanelToolbar{
    position:sticky !important;
    top:0 !important;
    z-index:6000 !important;

    flex-shrink:0;

    margin:0 !important;

    background:#1e2922 !important;

    border-radius:9px 9px 0 0 !important;
}

.mapPanelStatus{
    position:sticky !important;
    top:58px !important;
    z-index:5900 !important;

    flex-shrink:0;

    margin:0 !important;

    border-radius:0 !important;
}

.mapPanelViewport{
    position:relative;

    width:100%;
    min-height:520px;
    height:calc(100vh - 285px);
    max-height:none !important;

    overflow:auto !important;
    overscroll-behavior:contain;

    cursor:grab;

    user-select:none;
    touch-action:none;

    flex:1;
}

.mapPanelViewport.mapDragging{
    cursor:grabbing !important;
}

.mapPanelViewport.mapPinMode{
    cursor:crosshair !important;
}

#editor:has(.mapPanel){
    overflow:hidden !important;
    padding:0 !important;
}

#editor:has(.mapPanel) .mapPanelInformation{
    padding:20px 30px 30px;
}

.mapPanelViewport::after{
    pointer-events:none !important;
}

.mapPanelViewport:fullscreen{
    width:100vw;
    height:100vh;
    max-height:none !important;

    overflow:auto !important;

    cursor:grab;
}

.mapPanelViewport:fullscreen.mapDragging{
    cursor:grabbing !important;
}

@media(max-width:720px){

    .mapPanelViewport{
        height:calc(100vh - 340px);
        min-height:380px;
    }

    .mapPanelStatus{
        top:112px !important;
    }

}

#editor:has(.mapPanel){
    overflow-y:auto !important;
    overflow-x:hidden !important;

    padding:30px !important;
}

#editor:has(.mapPanel) .mapPanel{
    min-height:auto;
    height:auto;
    overflow:visible;
}

#editor:has(.mapPanel) .mapPanelToolbar{
    position:sticky !important;
    top:0 !important;
    z-index:6000 !important;
}

#editor:has(.mapPanel) .mapPanelStatus{
    position:sticky !important;
    top:58px !important;
    z-index:5900 !important;
}

#editor:has(.mapPanel) .mapPanelViewport{
    flex:none !important;

    width:100%;
    height:70vh !important;
    min-height:520px;
    max-height:850px !important;

    overflow:auto !important;
    overscroll-behavior:contain;
}

#editor:has(.mapPanel) .mapPanelInformation{
    padding:20px 0 10px !important;
}

@media(max-width:720px){
    #editor:has(.mapPanel){
        padding:14px !important;
    }

    #editor:has(.mapPanel) .mapPanelViewport{
        height:62vh !important;
        min-height:380px;
    }

    #editor:has(.mapPanel) .mapPanelStatus{
        top:112px !important;
    }
}

.mapPanelViewport{
    position:relative;
    overflow:auto !important;
    cursor:grab;
    user-select:none;
    overscroll-behavior:contain;
}

.mapStage{
    position:relative;
    display:block;
    transform:none !important;
    transform-origin:top left;
    flex:none;
}

.mapPanelImage{
    position:absolute;
    inset:0;
    width:100% !important;
    height:100% !important;
    max-width:none !important;
    max-height:none !important;
    margin:0 !important;
    pointer-events:none;
    user-select:none;
}

.mapPinLayer{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    pointer-events:none;
}

.mapPanelViewport::after{
    display:none !important;
    content:none !important;
}

.mapPin{
    transform:
        translate(-50%, -100%)
        scale(var(--map-marker-scale, 1));
    transform-origin:center bottom;
}

#mapPinWindow,
.mapPinBox,
#closeMapPinWindow{
    pointer-events:auto !important;
}

#campaignManagerWindow{
    position:fixed;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;
    background:rgba(7,5,4,.8);
    z-index:16000;
}

#campaignManagerWindow.hidden{display:none;}

.campaignManagerBox{
    width:min(1420px, 97vw);
    max-height:94vh;
    display:flex;
    flex-direction:column;
    overflow:hidden;
    background:linear-gradient(180deg,#2d251f,#17130f);
    border:3px solid #b8752b;
    border-radius:16px;
    color:white;
    box-shadow:0 26px 80px rgba(0,0,0,.75);
}

.campaignManagerHeader{
    display:flex;
    justify-content:space-between;
    gap:20px;
    padding:20px 24px;
    background:linear-gradient(180deg,#493122,#251a14);
    border-bottom:3px solid #b8752b;
}

.campaignManagerHeader h2{margin:0;color:#ffbd61;font-size:30px;}

.campaignManagerHeader p{margin-top:5px;color:#d7bea0;}

#closeCampaignManager{
    width:42px;height:42px;border:2px solid #ed8b76;border-radius:50%;
    background:#8e281d;color:white;font-size:19px;font-weight:900;cursor:pointer;
}

.campaignManagerTop{
    display:grid;
    grid-template-columns:2fr 1fr 1fr;
    gap:13px;
    padding:18px 24px 12px;
}

.campaignManagerTop label{
    display:flex;flex-direction:column;gap:6px;color:#f1c98e;font-weight:800;
}

.campaignManagerTop input,
.campaignManagerTop select,
.campaignManagerTop textarea{
    width:100%;padding:10px 12px;border:2px solid #806244;border-radius:8px;
    background:#fff8e9;color:#24190f;font:inherit;
}

.campaignDescriptionField{grid-column:1/-1;}

.campaignDescriptionField textarea{min-height:82px;resize:vertical;}

.campaignStats{
    display:grid;
    grid-template-columns:repeat(6,1fr);
    gap:10px;
    padding:5px 24px 15px;
}

.campaignStats article{
    padding:12px 8px;text-align:center;background:#31251d;border:1px solid #82613f;border-radius:9px;
}

.campaignStats strong{display:block;color:#ffbd61;font-size:25px;}

.campaignStats span{font-size:12px;color:#d4baa0;}

.campaignQuickLinks{
    display:flex;flex-wrap:wrap;gap:9px;padding:0 24px 16px;
}

.campaignQuickLinks button,
.campaignSectionHeader button{
    min-height:41px;padding:8px 14px;border:2px solid #d5984d;border-radius:8px;
    background:#754219;color:white;font-weight:800;cursor:pointer;
}

.campaignQuickLinks button:hover,
.campaignSectionHeader button:hover{filter:brightness(1.18);}

.campaignColumns{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
    min-height:0;
    padding:0 24px 18px;
    overflow:auto;
}

.campaignSection{
    min-height:360px;display:flex;flex-direction:column;overflow:hidden;
    background:#211a15;border:2px solid #765435;border-radius:12px;
}

.campaignSectionHeader{
    display:flex;justify-content:space-between;align-items:center;gap:12px;
    padding:14px;background:#302219;border-bottom:2px solid #765435;
}

.campaignSectionHeader h3{margin:0;color:#ffbd61;font-size:22px;}

.campaignSectionHeader span{font-size:12px;color:#cdb497;}

.campaignItemList{display:flex;flex-direction:column;gap:10px;padding:12px;overflow:auto;}

.campaignItemCard{
    padding:12px;background:linear-gradient(180deg,#f2e3c9,#dcc39c);
    color:#271a11;border:2px solid #9a622f;border-radius:10px;
}

.campaignItemTop{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;}

.campaignItemTop h4{margin:0;color:#713016;font-size:18px;}

.campaignItemTop small{color:#6a503d;}

.campaignItemCard p{margin:9px 0;white-space:pre-wrap;}

.campaignStatusBadge{
    padding:4px 8px;border-radius:20px;background:#754219;color:white;font-size:11px;font-weight:900;
}

.campaignItemActions{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;}

.campaignItemActions button{
    min-height:34px;border:none;border-radius:6px;background:#493228;color:white;font-weight:700;cursor:pointer;
}

.campaignItemActions button:last-child{background:#8b2d22;}

.campaignEmptyState{padding:55px 10px;text-align:center;color:#bca88e;}

.campaignFooter{
    display:flex;align-items:center;justify-content:space-between;gap:15px;
    padding:12px 24px;background:#19130f;border-top:2px solid #765435;color:#cdb497;
}

#resetCampaignBtn{
    padding:8px 14px;border:none;border-radius:7px;background:#84291f;color:white;font-weight:800;cursor:pointer;
}

@media(max-width:1050px){
    .campaignStats{grid-template-columns:repeat(3,1fr);}
    .campaignColumns{grid-template-columns:1fr;}
    .campaignSection{min-height:300px;}
}

@media(max-width:720px){
    #campaignManagerWindow{padding:7px;}
    .campaignManagerTop{grid-template-columns:1fr;}
    .campaignDescriptionField{grid-column:auto;}
    .campaignStats{grid-template-columns:repeat(2,1fr);}
}

#campaignManagerWindow{
    position:fixed;
    inset:0;
    z-index:16000;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:20px;
    overflow:hidden;

    background:rgba(7,5,4,.82);
}

#campaignManagerWindow.hidden{
    display:none !important;
}

.campaignManagerBox{
    width:min(1420px, 97vw);
    height:min(920px, 94vh);
    min-height:0;

    display:flex;
    flex-direction:column;

    overflow:hidden;

    background:linear-gradient(180deg,#2d251f,#17130f);
    border:3px solid #b8752b;
    border-radius:16px;

    color:white;
    box-shadow:0 26px 80px rgba(0,0,0,.75);
}

.campaignManagerHeader{
    flex:0 0 auto;

    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:20px;

    padding:18px 22px;

    background:linear-gradient(180deg,#493122,#251a14);
    border-bottom:3px solid #b8752b;
}

.campaignManagerHeader h2{
    margin:0;
    color:#ffbd61;
    font-size:30px;
}

.campaignManagerHeader p{
    margin-top:5px;
    color:#d7bea0;
}

#closeCampaignManager{
    width:42px;
    height:42px;
    flex:0 0 auto;

    border:2px solid #ed8b76;
    border-radius:50%;

    background:#8e281d;
    color:white;

    font-size:19px;
    font-weight:900;
    cursor:pointer;
}

.campaignManagerTop{
    flex:0 0 auto;

    display:grid;
    grid-template-columns:2fr 1fr 1fr;
    gap:13px;

    padding:16px 22px 10px;
}

.campaignManagerTop label{
    display:flex;
    flex-direction:column;
    gap:6px;

    color:#f1c98e;
    font-weight:800;
}

.campaignManagerTop input,
.campaignManagerTop select,
.campaignManagerTop textarea{
    width:100%;
    min-width:0;

    padding:10px 12px;

    border:2px solid #806244;
    border-radius:8px;

    background:#fff8e9;
    color:#24190f;
    font:inherit;
}

.campaignDescriptionField{
    grid-column:1 / -1;
}

.campaignDescriptionField textarea{
    min-height:76px;
    resize:vertical;
}

.campaignStats{
    flex:0 0 auto;

    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:10px;

    padding:4px 22px 12px;
}

.campaignStats article{
    min-width:0;
    padding:10px 7px;

    text-align:center;

    background:#31251d;
    border:1px solid #82613f;
    border-radius:9px;
}

.campaignStats strong{
    display:block;
    color:#ffbd61;
    font-size:24px;
}

.campaignStats span{
    font-size:12px;
    color:#d4baa0;
}

.campaignQuickLinks{
    flex:0 0 auto;

    display:flex;
    flex-wrap:wrap;
    gap:9px;

    padding:0 22px 14px;
}

.campaignQuickLinks button,
.campaignSectionHeader button{
    min-height:39px;
    padding:8px 13px;

    border:2px solid #d5984d;
    border-radius:8px;

    background:#754219;
    color:white;

    font-weight:800;
    cursor:pointer;
}

.campaignColumns{
    flex:1 1 auto;
    min-height:0;

    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;

    padding:0 22px 16px;
    overflow:auto;
}

.campaignSection{
    min-width:0;
    min-height:330px;

    display:flex;
    flex-direction:column;

    overflow:hidden;

    background:#211a15;
    border:2px solid #765435;
    border-radius:12px;
}

.campaignSectionHeader{
    flex:0 0 auto;

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;

    padding:13px;

    background:#302219;
    border-bottom:2px solid #765435;
}

.campaignSectionHeader h3{
    margin:0;
    color:#ffbd61;
    font-size:21px;
}

.campaignSectionHeader span{
    font-size:12px;
    color:#cdb497;
}

.campaignItemList{
    flex:1 1 auto;
    min-height:0;

    display:flex;
    flex-direction:column;
    gap:10px;

    padding:12px;
    overflow:auto;
}

.campaignItemCard{
    padding:12px;

    background:linear-gradient(180deg,#f2e3c9,#dcc39c);
    color:#271a11;

    border:2px solid #9a622f;
    border-radius:10px;
}

.campaignItemTop{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:10px;
}

.campaignItemTop h4{
    margin:0;
    color:#713016;
    font-size:18px;
}

.campaignItemCard p{
    margin:9px 0;
    white-space:pre-wrap;
}

.campaignStatusBadge{
    flex:0 0 auto;
    padding:4px 8px;

    border-radius:20px;

    background:#754219;
    color:white;

    font-size:11px;
    font-weight:900;
}

.campaignItemActions{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:6px;
}

.campaignItemActions button{
    min-width:0;
    min-height:34px;

    border:none;
    border-radius:6px;

    background:#493228;
    color:white;

    font-weight:700;
    cursor:pointer;
}

.campaignEmptyState{
    padding:55px 10px;
    color:#bca88e;
    text-align:center;
}

.campaignFooter{
    flex:0 0 auto;

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;

    padding:11px 22px;

    background:#19130f;
    border-top:2px solid #765435;
    color:#cdb497;
}

#resetCampaignBtn{
    padding:8px 14px;

    border:none;
    border-radius:7px;

    background:#84291f;
    color:white;

    font-weight:800;
    cursor:pointer;
}

@media(max-width:1050px){
    .campaignManagerBox{
        height:95vh;
    }

    .campaignStats{
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .campaignColumns{
        grid-template-columns:1fr;
    }

    .campaignSection{
        min-height:300px;
    }
}

@media(max-width:720px){
    #campaignManagerWindow{
        padding:7px;
    }

    .campaignManagerTop{
        grid-template-columns:1fr;
        padding:12px;
    }

    .campaignDescriptionField{
        grid-column:auto;
    }

    .campaignStats{
        grid-template-columns:repeat(2,minmax(0,1fr));
        padding:4px 12px 10px;
    }

    .campaignQuickLinks,
    .campaignColumns{
        padding-left:12px;
        padding-right:12px;
    }

    .campaignFooter{
        padding:10px 12px;
    }
}

#campaignManagerWindow{
    top:70px !important;
    bottom:0 !important;
    height:calc(100vh - 70px) !important;
    padding-top:12px !important;
}

.campaignManagerBox{
    max-height:calc(100vh - 94px) !important;
}

@media(max-width:720px){
    #campaignManagerWindow{
        top:70px !important;
        height:calc(100vh - 70px) !important;
        padding-top:6px !important;
    }
}

#campaignDescriptionInput{
    min-height:92px;

    cursor:pointer;

    background:
        linear-gradient(
            180deg,
            #f7edcf,
            #ead9ad
        );

    color:#4b3522;

    border:2px solid #a7763e;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-style:italic;
}

#campaignDescriptionInput:hover{
    border-color:#d18a2e;

    box-shadow:
        0 0 0 3px rgba(209,138,46,.15);
}

#campaignNoteWindow{
    position:fixed;
    inset:0;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:26px;

    background:rgba(10,7,4,.82);

    z-index:30000;
}

#campaignNoteWindow.hidden{
    display:none;
}

.campaignNoteBook{
    width:min(880px, 96vw);
    max-height:92vh;

    display:flex;
    flex-direction:column;

    overflow:hidden;

    border:4px double #7e4d20;
    border-radius:14px;

    background:
        radial-gradient(
            circle at top left,
            rgba(255,255,255,.35),
            transparent 36%
        ),
        linear-gradient(
            180deg,
            #f4e7c1,
            #e4ca91
        );

    color:#3b2717;

    box-shadow:
        0 28px 80px rgba(0,0,0,.72),
        inset 0 0 35px rgba(111,67,25,.18);

    font-family:
        Georgia,
        "Times New Roman",
        serif;
}

.campaignNoteHeader{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:18px;

    padding:20px 24px;

    border-bottom:4px double #8a5627;

    background:
        linear-gradient(
            180deg,
            rgba(112,66,29,.16),
            rgba(112,66,29,.04)
        );
}

.campaignNoteHeader h2{
    margin:0;

    color:#6b2d1d;

    font-size:31px;
}

.campaignNoteHeader p{
    margin-top:5px;

    color:#69503a;

    font-style:italic;
}

#closeCampaignNoteWindow{
    width:40px;
    height:40px;

    border:2px solid #8a4d31;
    border-radius:50%;

    background:#7e2b20;
    color:white;

    font-size:18px;
    font-weight:900;

    cursor:pointer;
}

.campaignNoteForm{
    display:grid;
    gap:16px;

    min-height:0;

    padding:22px 25px;

    overflow-y:auto;
}

.campaignNoteForm label{
    display:flex;
    flex-direction:column;
    gap:7px;

    color:#6b2d1d;

    font-size:15px;
    font-weight:800;
}

.campaignNoteForm input,
.campaignNoteForm textarea{
    width:100%;

    padding:11px 13px;

    border:2px solid #a8753e;
    border-radius:7px;

    background:
        rgba(255,249,226,.76);

    color:#342316;

    font:inherit;

    outline:none;
}

.campaignNoteForm input:focus,
.campaignNoteForm textarea:focus{
    border-color:#c36d22;

    box-shadow:
        0 0 0 3px rgba(195,109,34,.17);
}

.campaignNoteTextField{
    min-height:360px;
}

#campaignNoteTextInput{
    min-height:360px;

    resize:vertical;

    line-height:1.65;

    background:
        repeating-linear-gradient(
            180deg,
            rgba(255,250,232,.88) 0,
            rgba(255,250,232,.88) 30px,
            rgba(126,77,32,.12) 31px,
            rgba(255,250,232,.88) 32px
        );
}

.campaignNoteFooter{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:15px;

    padding:15px 24px;

    border-top:3px solid #a8753e;

    background:
        rgba(102,59,23,.09);
}

.campaignNoteFooter > span{
    color:#72563d;

    font-size:13px;
    font-style:italic;
}

.campaignNoteFooter > div{
    display:flex;
    gap:10px;
}

.campaignNoteFooter button{
    min-height:43px;

    padding:9px 18px;

    border:2px solid #8a5627;
    border-radius:8px;

    font-weight:900;
    cursor:pointer;
}

#cancelCampaignNoteBtn{
    background:#ddc79a;
    color:#4b3421;
}

#saveCampaignNoteBtn{
    background:#7a3f21;
    color:white;
}

.campaignItemCard{
    cursor:pointer;
}

.campaignItemCard:hover{
    transform:translateY(-2px);

    box-shadow:
        0 10px 20px rgba(0,0,0,.22);
}

#editor.parchmentEditor{
    background:
        radial-gradient(
            circle at 15% 10%,
            rgba(255,255,255,.45),
            transparent 28%
        ),
        radial-gradient(
            circle at 85% 90%,
            rgba(121,82,39,.12),
            transparent 30%
        ),
        linear-gradient(
            180deg,
            #f4e7c2,
            #e5cf9a
        ) !important;

    color:#362518 !important;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    box-shadow:
        inset 0 0 42px rgba(102,65,28,.18);
}

#editor.parchmentEditor:focus{
    outline:none;
}

#editor.parchmentEditor a{
    color:#7b321f;
}

@media(max-width:720px){

    #campaignNoteWindow{
        padding:8px;
    }

    .campaignNoteBook{
        max-height:97vh;
    }

    .campaignNoteTextField,
    #campaignNoteTextInput{
        min-height:280px;
    }

    .campaignNoteFooter{
        align-items:stretch;
        flex-direction:column;
    }

    .campaignNoteFooter > div{
        width:100%;
    }

    .campaignNoteFooter button{
        flex:1;
    }

}

#encounterBuilderWindow,
#mapLibraryWindow{
    top:70px !important;
    right:0 !important;
    bottom:0 !important;
    left:0 !important;
    inset:auto 0 0 0 !important;

    align-items:center !important;
    justify-content:center !important;

    padding:14px 20px 20px !important;

    overflow:auto !important;
}

.encounterBuilderBox{
    width:min(1380px, 96vw) !important;
    height:min(790px, calc(100vh - 104px)) !important;
    max-height:calc(100vh - 104px) !important;

    margin:auto !important;
}

.mapLibraryBox{
    width:min(1220px, 96vw) !important;
    height:auto !important;
    max-height:calc(100vh - 104px) !important;

    margin:auto !important;
}

.encounterBuilderHeader,
.mapLibraryHeader{
    position:sticky;
    top:0;
    z-index:50;

    flex-shrink:0;
}

#closeEncounterBuilder,
#closeMapLibrary{
    position:relative;
    z-index:60;
    flex-shrink:0;
}

.encounterBuilderLayout,
#mapLibraryList{
    min-height:0;
}

.mapLibraryBox{
    overflow:hidden !important;
}

#mapLibraryList{
    overflow-y:auto !important;
}

@media(max-width:1100px){
    .encounterBuilderBox{
        height:calc(100vh - 92px) !important;
        max-height:calc(100vh - 92px) !important;
    }
}

@media(max-width:650px){
    #encounterBuilderWindow,
    #mapLibraryWindow{
        padding:7px !important;
    }

    .encounterBuilderBox,
    .mapLibraryBox{
        width:100% !important;
        max-height:calc(100vh - 84px) !important;
        border-radius:10px;
    }
}

#campaignManagerWindow{
    overflow:hidden !important;
}

.campaignManagerBox{
    display:flex;
    flex-direction:column;

    max-height:calc(100vh - 92px) !important;
    overflow:hidden !important;
}

.campaignManagerHeader{
    flex-shrink:0;
}

.campaignManagerContent{
    flex:1;
    min-height:0;

    overflow-y:auto !important;
    overflow-x:hidden !important;

    scroll-behavior:smooth;

    padding-bottom:80px !important;
}

.campaignOverview,
.campaignQuickLinks,
.campaignWorkspace{
    overflow:visible !important;
}

.campaignWorkspace{
    display:flex !important;
    flex-direction:column !important;
    gap:56px !important;

    margin-top:42px !important;
}

.campaignColumn,
.campaignSection,
.campaignList,
.campaignItems,
.campaignItemList{
    max-height:none !important;
    height:auto !important;

    overflow:visible !important;
}

.campaignColumn{
    width:100% !important;

    padding:24px !important;

    border-radius:14px;

    scroll-margin-top:40px;
}

.campaignColumn + .campaignColumn{
    margin-top:0;
}

.campaignColumnHeader{
    position:relative !important;
    top:auto !important;

    margin-bottom:18px !important;
}

.campaignItemCard{
    margin-bottom:14px;
}

.campaignOverview{
    margin-bottom:46px !important;
}

.campaignQuickLinks{
    margin-top:26px !important;
    margin-bottom:50px !important;
}

.campaignWorkspace > *{
    min-height:220px;
}

.campaignManagerContent::-webkit-scrollbar{
    width:12px;
}

.campaignManagerContent::-webkit-scrollbar-track{
    background:#211b16;
}

.campaignManagerContent::-webkit-scrollbar-thumb{
    background:#9d6328;
    border:3px solid #211b16;
    border-radius:10px;
}

.campaignManagerContent::-webkit-scrollbar-thumb:hover{
    background:#c98235;
}

@media(max-width:900px){

    .campaignManagerBox{
        max-height:calc(100vh - 82px) !important;
    }

    .campaignManagerContent{
        padding-bottom:55px !important;
    }

    .campaignWorkspace{
        gap:36px !important;
        margin-top:30px !important;
    }

    .campaignColumn{
        padding:18px !important;
    }

}

.campaignManagerBox{
    display:block !important;

    width:min(1420px, 97vw) !important;
    height:auto !important;
    max-height:calc(100vh - 94px) !important;

    overflow-y:auto !important;
    overflow-x:hidden !important;

    scroll-behavior:smooth;
}

.campaignManagerHeader{
    position:sticky !important;
    top:0 !important;
    z-index:200 !important;

    width:100%;

    background:
        linear-gradient(
            180deg,
            #493122,
            #251a14
        ) !important;

    box-shadow:
        0 5px 14px rgba(0,0,0,.4);
}

.campaignManagerTop,
.campaignStats,
.campaignQuickLinks{
    position:relative !important;

    flex:none !important;

    overflow:visible !important;
}

.campaignColumns{
    display:flex !important;
    flex-direction:column !important;
    gap:58px !important;

    width:100%;

    min-height:0 !important;
    height:auto !important;

    padding:28px 24px 70px !important;

    overflow:visible !important;
}

.campaignSection{
    width:100% !important;

    min-height:320px !important;
    height:auto !important;
    max-height:none !important;

    overflow:visible !important;

    scroll-margin-top:95px;

    box-shadow:
        0 12px 28px rgba(0,0,0,.28);
}

.campaignSectionHeader{
    position:relative !important;
    top:auto !important;

    border-radius:
        10px
        10px
        0
        0;
}

.campaignItemList{
    display:flex !important;
    flex-direction:column !important;
    gap:12px !important;

    min-height:180px !important;
    height:auto !important;
    max-height:none !important;

    padding:16px !important;

    overflow:visible !important;
}

.campaignFooter{
    position:relative !important;

    margin-top:0;

    padding:16px 24px 24px !important;

    border-top:2px solid #765435;
}

.campaignManagerBox::-webkit-scrollbar{
    width:13px;
}

.campaignManagerBox::-webkit-scrollbar-track{
    background:#1b1511;
}

.campaignManagerBox::-webkit-scrollbar-thumb{
    background:#9d6328;

    border:3px solid #1b1511;
    border-radius:12px;
}

.campaignManagerBox::-webkit-scrollbar-thumb:hover{
    background:#c98235;
}

.campaignManagerContent,
.campaignWorkspace,
.campaignColumn,
.campaignList,
.campaignItems{
    max-height:none !important;
    height:auto !important;

    overflow:visible !important;
}

@media(max-width:900px){

    .campaignManagerBox{
        max-height:calc(100vh - 82px) !important;
    }

    .campaignColumns{
        gap:38px !important;

        padding:
            20px
            14px
            55px !important;
    }

    .campaignSection{
        min-height:280px !important;
    }

}

#worldDatabaseWindow,
#worldEntryWindow{
    position:fixed;
    inset:70px 0 0;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:18px;

    background:rgba(8,7,5,.8);

    z-index:25000;
}

#worldDatabaseWindow.hidden,
#worldEntryWindow.hidden{
    display:none;
}

.worldDatabaseBox{
    width:min(1380px, 97vw);
    height:min(860px, calc(100vh - 105px));

    display:flex;
    flex-direction:column;

    overflow:hidden;

    border:3px solid #93602c;
    border-radius:16px;

    background:
        linear-gradient(
            180deg,
            #2b241d,
            #17130f
        );

    color:white;

    box-shadow:
        0 26px 75px rgba(0,0,0,.72);
}

.worldDatabaseHeader,
.worldEntryHeader{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:20px;

    flex-shrink:0;

    padding:19px 23px;

    border-bottom:3px solid #93602c;

    background:
        linear-gradient(
            180deg,
            #493322,
            #251b14
        );
}

.worldDatabaseHeader h2,
.worldEntryHeader h2{
    margin:0;

    color:#f1c47a;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:30px;
}

.worldDatabaseHeader p,
.worldEntryHeader p{
    margin-top:5px;

    color:#d3b58d;
    font-style:italic;
}

#closeWorldDatabase,
#closeWorldEntryWindow{
    width:40px;
    height:40px;

    border:2px solid #df947f;
    border-radius:50%;

    background:#842b20;
    color:white;

    font-size:18px;
    font-weight:900;

    cursor:pointer;
}

.worldDatabaseToolbar{
    display:grid;
    grid-template-columns:minmax(240px, 1fr) 190px auto;
    gap:12px;

    flex-shrink:0;

    padding:15px 20px;

    border-bottom:1px solid #69503a;

    background:#201a15;
}

.worldDatabaseToolbar input,
.worldDatabaseToolbar select{
    min-height:44px;

    padding:9px 12px;

    border:2px solid #78593b;
    border-radius:8px;

    background:#fff8e7;
    color:#231812;

    font-size:15px;
}

#newWorldEntryBtn{
    min-height:44px;

    padding:9px 17px;

    border:2px solid #e1ad5f;
    border-radius:8px;

    background:
        linear-gradient(
            180deg,
            #a96721,
            #713c0b
        );

    color:white;

    font-weight:900;
    cursor:pointer;
}

.worldDatabaseLayout{
    display:grid;
    grid-template-columns:270px minmax(0, 1fr);

    flex:1;
    min-height:0;
}

.worldCategorySidebar{
    min-height:0;

    overflow-y:auto;

    border-right:2px solid #6d4a2b;

    background:#201914;
}

.worldCategoryHeading{
    position:sticky;
    top:0;
    z-index:5;

    padding:14px 16px;

    border-bottom:1px solid #694a31;

    background:#2c2119;
    color:#e6bd80;

    font-size:14px;
    font-weight:900;
    letter-spacing:.8px;
    text-transform:uppercase;
}

#worldCategoryList{
    display:flex;
    flex-direction:column;
    gap:6px;

    padding:12px;
}

.worldCategoryButton{
    width:100%;
    min-height:44px;

    display:grid;
    grid-template-columns:34px 1fr auto;
    align-items:center;
    gap:8px;

    padding:7px 10px;

    border:1px solid transparent;
    border-radius:8px;

    background:#30251e;
    color:#eee3d3;

    text-align:left;
    cursor:pointer;
}

.worldCategoryButton:hover{
    background:#493220;
}

.worldCategoryButton.active{
    border-color:#d89946;

    background:#70451e;
    color:white;
}

.worldCategoryIcon{
    font-size:20px;
    text-align:center;
}

.worldCategoryLabel{
    font-weight:800;
}

.worldCategoryCount{
    min-width:28px;

    padding:3px 7px;

    border-radius:20px;

    background:rgba(255,255,255,.12);

    text-align:center;
    font-size:12px;
}

.worldDatabaseMain{
    min-width:0;
    min-height:0;

    display:flex;
    flex-direction:column;

    background:
        linear-gradient(
            180deg,
            #efe0ba,
            #dbc18b
        );

    color:#342315;
}

.worldDatabaseMainHeader{
    display:flex;
    justify-content:space-between;
    align-items:center;

    flex-shrink:0;

    padding:16px 21px;

    border-bottom:3px double #8c5a2b;

    background:
        rgba(255,249,224,.72);
}

.worldDatabaseMainHeader h3{
    margin:0;

    color:#6c2f1c;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:26px;
}

.worldDatabaseMainHeader span{
    color:#745b43;

    font-size:13px;
}

#worldEntryList{
    display:grid;
    grid-template-columns:
        repeat(
            auto-fill,
            minmax(300px, 1fr)
        );

    gap:15px;

    min-height:0;

    padding:18px 20px 35px;

    overflow-y:auto;
}

.worldEntryCard{
    position:relative;

    display:flex;
    flex-direction:column;
    gap:13px;

    min-height:245px;

    padding:18px;

    border:3px solid #8a5528;
    border-radius:12px;

    background:
        radial-gradient(
            circle at top left,
            rgba(255,255,255,.45),
            transparent 34%
        ),
        linear-gradient(
            180deg,
            #f8edce,
            #e5cd98
        );

    color:#342315;

    box-shadow:
        0 8px 18px rgba(55,35,16,.28);

    transition:
        transform .16s,
        box-shadow .16s;
}

.worldEntryCard:hover{
    transform:translateY(-3px);

    box-shadow:
        0 13px 25px rgba(55,35,16,.34);
}

.worldEntryCard.favorite{
    border-color:#c68b24;
}

.worldFavoriteBtn{
    position:absolute;
    top:10px;
    right:11px;

    width:34px;
    height:34px;

    border:none;
    border-radius:50%;

    background:rgba(88,54,22,.13);
    color:#95600d;

    font-size:24px;
    cursor:pointer;
}

.worldEntryCardHeading{
    display:grid;
    grid-template-columns:48px 1fr;
    gap:11px;

    padding-right:30px;
}

.worldEntryCardIcon{
    font-size:34px;
    text-align:center;
}

.worldEntryCardHeading h3{
    margin:0;

    color:#6c2f1c;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:23px;
}

.worldEntryCardHeading p{
    margin-top:4px;

    color:#765f48;

    font-size:13px;
    font-style:italic;
}

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

    gap:7px;
}

.worldEntryFacts span{
    padding:7px;

    border:1px solid #b58a57;
    border-radius:7px;

    background:rgba(255,255,255,.35);

    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;

    font-size:12px;
}

.worldEntryFacts strong{
    display:block;

    margin-bottom:2px;

    color:#7a3a20;

    font-size:10px;
    text-transform:uppercase;
}

.worldEntrySummary{
    display:-webkit-box;

    overflow:hidden;

    color:#4b3827;

    line-height:1.45;

    -webkit-box-orient:vertical;
    -webkit-line-clamp:4;
}

.worldEntryCardFooter{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:10px;

    margin-top:auto;
}

.worldEntryCardFooter > span{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;

    color:#795e43;

    font-size:12px;
    font-style:italic;
}

.worldEntryOpenBtn{
    min-height:38px;

    padding:7px 14px;

    border:2px solid #8a5528;
    border-radius:7px;

    background:#6c351d;
    color:white;

    font-weight:900;
    cursor:pointer;
}

.worldDatabaseEmpty{
    grid-column:1 / -1;

    min-height:370px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:10px;

    color:#795d40;
    text-align:center;
}

.worldDatabaseEmpty div{
    font-size:65px;
}

.worldDatabaseEmpty strong{
    color:#6c2f1c;
    font-size:23px;
}

.worldEntryBook{
    width:min(930px, 96vw);
    max-height:calc(100vh - 105px);

    display:flex;
    flex-direction:column;

    overflow:hidden;

    border:4px double #7c4b23;
    border-radius:15px;

    background:
        radial-gradient(
            circle at top left,
            rgba(255,255,255,.4),
            transparent 32%
        ),
        linear-gradient(
            180deg,
            #f4e7c0,
            #dfc58d
        );

    color:#382516;

    box-shadow:
        0 28px 80px rgba(0,0,0,.72),
        inset 0 0 38px rgba(105,65,26,.18);

    font-family:
        Georgia,
        "Times New Roman",
        serif;
}

.worldEntryForm{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:15px;

    min-height:0;

    padding:21px 24px;

    overflow-y:auto;
}

.worldEntryForm > label{
    display:flex;
    flex-direction:column;
    gap:6px;

    color:#692f1d;

    font-weight:800;
}

.worldEntryForm > label:nth-last-child(-n/**/+2){
    grid-column:1 / -1;
}

.worldEntryForm input,
.worldEntryForm select,
.worldEntryForm textarea{
    width:100%;

    padding:10px 12px;

    border:2px solid #a5753d;
    border-radius:7px;

    background:rgba(255,250,232,.78);
    color:#332216;

    font:inherit;
}

.worldEntryGrid{
    grid-column:1 / -1;

    display:grid;
    grid-template-columns:
        repeat(2, 1fr);

    gap:13px;
}

.worldEntryGrid label{
    display:flex;
    flex-direction:column;
    gap:6px;

    color:#692f1d;

    font-weight:800;
}

.worldEntryForm textarea{
    min-height:145px;

    resize:vertical;

    line-height:1.55;
}

#worldEntryNotes{
    min-height:190px;

    background:
        repeating-linear-gradient(
            180deg,
            rgba(255,250,232,.88) 0,
            rgba(255,250,232,.88) 29px,
            rgba(116,75,31,.13) 30px,
            rgba(255,250,232,.88) 31px
        );
}

.worldEntryFooter{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;

    flex-shrink:0;

    padding:14px 23px;

    border-top:3px solid #9a6734;

    background:rgba(101,61,25,.1);
}

.worldEntryFooter > div{
    display:flex;
    gap:9px;
}

.worldEntryFooter button{
    min-height:42px;

    padding:8px 16px;

    border:2px solid #87532a;
    border-radius:8px;

    font-weight:900;
    cursor:pointer;
}

#deleteWorldEntryBtn{
    background:#842b20;
    color:white;
}

#duplicateWorldEntryBtn{
    background:#d7bd88;
    color:#392617;
}

#cancelWorldEntryBtn{
    background:#dcc89f;
    color:#392617;
}

#saveWorldEntryBtn{
    background:#70401e;
    color:white;
}

@media(max-width:850px){

    #worldDatabaseWindow,
    #worldEntryWindow{
        padding:8px;
    }

    .worldDatabaseBox{
        height:calc(100vh - 88px);
    }

    .worldDatabaseToolbar{
        grid-template-columns:1fr;
    }

    .worldDatabaseLayout{
        grid-template-columns:1fr;
    }

    .worldCategorySidebar{
        max-height:190px;

        border-right:none;
        border-bottom:2px solid #6d4a2b;
    }

    #worldCategoryList{
        display:grid;
        grid-template-columns:
            repeat(2, 1fr);
    }

    .worldEntryForm,
    .worldEntryGrid{
        grid-template-columns:1fr;
    }

    .worldEntryForm > label{
        grid-column:1 / -1;
    }

    .worldEntryFooter{
        align-items:stretch;
        flex-direction:column;
    }

    .worldEntryFooter > div{
        width:100%;
        flex-wrap:wrap;
    }

    .worldEntryFooter button{
        flex:1;
    }

}

#questManagerWindow,#questEditorWindow{position:fixed;inset:70px 0 0;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(8,6,4,.82);z-index:26000}

#questManagerWindow.hidden,#questEditorWindow.hidden{display:none}

.questManagerBox{width:min(1320px,97vw);max-height:calc(100vh - 105px);display:flex;flex-direction:column;overflow:hidden;border:3px solid #956128;border-radius:16px;background:#201812;color:white;box-shadow:0 28px 80px rgba(0,0,0,.72)}

.questManagerHeader,.questEditorHeader{display:flex;justify-content:space-between;align-items:flex-start;padding:19px 23px;border-bottom:3px solid #956128;background:linear-gradient(#4a3020,#251912)}

.questManagerHeader h2,.questEditorHeader h2{margin:0;color:#f0c372;font:30px Georgia,serif}

.questManagerHeader p,.questEditorHeader p{margin-top:5px;color:#d2b48a;font-style:italic}

#closeQuestManager,#closeQuestEditor{width:40px;height:40px;border:2px solid #df907b;border-radius:50%;background:#842b20;color:white;font-weight:900;cursor:pointer}

.questManagerToolbar{display:grid;grid-template-columns:minmax(220px,1fr) 180px 190px auto;gap:11px;padding:15px 20px;background:#211a15;border-bottom:1px solid #6c4d32}

.questManagerToolbar input,.questManagerToolbar select{min-height:44px;padding:9px 11px;border:2px solid #7b5a38;border-radius:8px;background:#fff7e4;color:#241912}

.questManagerToolbar button{border:2px solid #e0ad5c;border-radius:8px;background:#8a4d13;color:white;font-weight:900}

.questManagerStats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:14px 20px;background:#2d2119}

.questManagerStats article{padding:11px;border:1px solid #725236;border-radius:8px;background:#3a2a20;text-align:center}

.questManagerStats strong{display:block;color:#f0c372;font-size:22px}

.questManagerStats span{color:#d3b792;font-size:12px}

.questManagerList{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px;padding:19px 20px 35px;overflow-y:auto;background:linear-gradient(#efe0b8,#d8bd83)}

.questManagerCard{display:flex;flex-direction:column;gap:12px;min-height:280px;padding:17px;border:3px solid #7c4825;border-radius:12px;background:linear-gradient(#f8edcc,#e4cc94);color:#342315;box-shadow:0 9px 20px rgba(0,0,0,.25)}

.questCardTop{display:flex;justify-content:space-between;gap:10px}

.questCardTop h3{margin:7px 0 3px;color:#6b2d1c;font:24px Georgia,serif}

.questCardTop p{color:#775d42;font-size:13px}

.questTypeBadge,.questStatusBadge{display:inline-block;padding:4px 8px;border-radius:20px;background:#6e3b1c;color:white;font-size:11px;font-weight:800}

.questStatusBadge{height:max-content;background:#875b1f}

.questCardDescription{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:4;line-height:1.45}

.questCardProgress>div{height:9px;margin-top:5px;overflow:hidden;border-radius:10px;background:#c5a974}

.questCardProgress i{display:block;height:100%;background:#4e8746}

.questCardMeta{display:flex;justify-content:space-between;gap:10px;margin-top:auto;color:#6b5036;font-size:12px}

.questOpenBtn{min-height:40px;border:2px solid #875126;border-radius:8px;background:#6b351c;color:white;font-weight:900}

.questManagerEmpty{grid-column:1/-1;min-height:350px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#765a3e}

.questManagerEmpty div{font-size:62px}

.questEditorBook{width:min(1040px,97vw);max-height:calc(100vh - 105px);display:flex;flex-direction:column;overflow:hidden;border:4px double #79461f;border-radius:15px;background:linear-gradient(#f5e7bf,#dec38a);color:#382516;font-family:Georgia,serif;box-shadow:0 28px 80px rgba(0,0,0,.72)}

.questEditorBody{padding:20px 24px 35px;overflow-y:auto}

.questEditorGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}

.questEditorBody label{display:flex;flex-direction:column;gap:6px;color:#682f1c;font-weight:800}

.questEditorBody input,.questEditorBody select,.questEditorBody textarea{padding:10px 11px;border:2px solid #a5733a;border-radius:7px;background:rgba(255,250,231,.8);color:#342215;font:inherit}

.questWideField{margin-top:17px}

.questWideField textarea{min-height:135px;resize:vertical}

.questNotesArea{min-height:200px!important;background:repeating-linear-gradient(#fff8df 0,#fff8df 29px,#c5aa7b 30px,#fff8df 31px)!important}

.questObjectivesSection,.questRelationsSection{margin-top:22px;padding:16px;border:2px solid #9c6a35;border-radius:10px;background:rgba(255,248,222,.35)}

.questSectionHeading{display:flex;justify-content:space-between;align-items:center;margin-bottom:13px}

.questSectionHeading h3{margin:0;color:#6b2d1c;font-size:22px}

.questSectionHeading span{color:#765b42;font-size:12px}

.questSectionHeading button{padding:8px 13px;border:2px solid #8d5729;border-radius:7px;background:#6e3a1e;color:white;font-weight:900}

.questObjectiveRow{display:grid;grid-template-columns:auto 1fr auto;gap:9px;align-items:center;margin-bottom:8px}

.questObjectiveRow input[type=checkbox]{width:20px;height:20px}

.questObjectiveRow button{width:36px;height:36px;border:none;border-radius:50%;background:#8a2b20;color:white}

.questObjectiveEmpty{padding:25px;text-align:center;color:#775d42;font-style:italic}

.questRelationGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:13px}

.questRelationGrid select{min-height:145px}

.questEditorFooter{display:flex;justify-content:space-between;gap:12px;padding:14px 23px;border-top:3px solid #96602e;background:rgba(93,54,20,.1)}

.questEditorFooter>div{display:flex;gap:9px}

.questEditorFooter button{min-height:42px;padding:8px 16px;border:2px solid #855027;border-radius:8px;font-weight:900}

#deleteQuestBtn{background:#842b20;color:white}

#cancelQuestBtn{background:#dbc69c;color:#342215}

#saveQuestBtn{background:#70401e;color:white}

@media(max-width:850px){.questManagerToolbar,.questEditorGrid,.questRelationGrid{grid-template-columns:1fr}.questManagerStats{grid-template-columns:repeat(2,1fr)}#questManagerWindow,#questEditorWindow{padding:7px}.questEditorFooter{flex-direction:column}.questEditorFooter>div{width:100%}.questEditorFooter button{flex:1}}

:root{
    --app-bg:#0d1511;
    --app-bg-soft:#131f19;
    --surface:#18251e;
    --surface-raised:#203128;
    --surface-deep:#0e1712;

    --green:#4f7d5c;
    --green-bright:#6e9a79;
    --green-deep:#294535;
    --green-hover:#638c6d;

    --gold:#bda267;
    --gold-light:#dbc487;
    --gold-muted:#806f49;

    --parchment:#eadbb6;
    --parchment-light:#f5ead0;
    --ink:#30271d;

    --danger:#79362f;
    --danger-hover:#9b493f;

    --text:#f0eee7;
    --text-muted:#b9c3bb;

    --header-height:76px;
}

html,
body{
    background:
        radial-gradient(
            circle at 50% -15%,
            rgba(75,117,86,.24),
            transparent 42%
        ),
        linear-gradient(
            180deg,
            #101a15,
            var(--app-bg)
        ) !important;

    color:var(--text);
}

body::before{
    content:"";

    position:fixed;
    inset:0;

    z-index:-1;

    pointer-events:none;

    background:
        repeating-linear-gradient(
            135deg,
            rgba(255,255,255,.012) 0,
            rgba(255,255,255,.012) 1px,
            transparent 1px,
            transparent 7px
        ),
        radial-gradient(
            circle at center,
            transparent 35%,
            rgba(0,0,0,.42) 100%
        );
}

header{
    min-height:var(--header-height) !important;
    height:auto !important;

    padding:9px 22px !important;

    display:flex;
    align-items:center;
    gap:28px;

    background:
        linear-gradient(
            180deg,
            #17251d,
            #0e1712
        ) !important;

    border-bottom:
        1px solid
        rgba(189,162,103,.72) !important;

    box-shadow:
        0 5px 18px rgba(0,0,0,.52),
        inset 0 -1px 0 rgba(110,154,121,.22);

    overflow:visible;
}

#logo{
    position:relative;

    flex:0 0 auto;

    padding:7px 5px !important;

    background:transparent !important;

    color:var(--gold-light) !important;

    font-family:
        Georgia,
        "Times New Roman",
        serif !important;

    font-size:25px !important;
    font-weight:800 !important;
    letter-spacing:2.4px !important;

    text-shadow:
        0 2px 4px rgba(0,0,0,.65);

    border:none !important;
    box-shadow:none !important;
}

#logo::after{
    content:"";

    position:absolute;
    left:5px;
    right:5px;
    bottom:1px;

    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            var(--gold),
            transparent
        );
}

.mainToolbar{
    flex:1;

    display:flex !important;
    align-items:center;
    justify-content:flex-end;
    flex-wrap:wrap;

    gap:7px !important;
}

.mainToolbar button{
    position:relative;

    min-height:38px;

    padding:8px 13px !important;

    border:
        1px solid
        rgba(189,162,103,.68) !important;

    border-radius:4px !important;

    background:
        linear-gradient(
            180deg,
            rgba(63,101,75,.94),
            rgba(37,64,48,.96)
        ) !important;

    color:#f3f0e8 !important;

    font-size:13px;
    font-weight:750;
    letter-spacing:.2px;

    box-shadow:
        inset 0 0 0 1px rgba(255,255,255,.035),
        0 3px 7px rgba(0,0,0,.3);

    clip-path:
        polygon(
            5px 0,
            calc(100% - 5px) 0,
            100% 5px,
            100% calc(100% - 5px),
            calc(100% - 5px) 100%,
            5px 100%,
            0 calc(100% - 5px),
            0 5px
        );

    transition:
        transform .15s ease,
        filter .15s ease,
        border-color .15s ease !important;
}

.mainToolbar button::after{
    content:"";

    position:absolute;
    left:9px;
    right:9px;
    bottom:4px;

    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(219,196,135,.65),
            transparent
        );
}

.mainToolbar button:hover{
    transform:translateY(-2px);

    filter:brightness(1.14);

    border-color:
        var(--gold-light) !important;
}

#homeGrid{
    padding:28px !important;

    gap:24px !important;

    background:
        radial-gradient(
            circle at top,
            rgba(45,74,56,.18),
            transparent 42%
        ),
        transparent !important;
}

#homeGrid::-webkit-scrollbar-track{
    background:#111b16 !important;
}

#homeGrid::-webkit-scrollbar-thumb{
    background:
        linear-gradient(
            180deg,
            var(--green-bright),
            var(--green-deep)
        ) !important;

    border:
        3px solid #111b16 !important;
}

.panel{
    --panel-accent:#4f7d5c;

    position:relative !important;

    isolation:isolate;

    overflow:hidden;

    padding:22px !important;

    border:
        1px solid
        color-mix(
            in srgb,
            var(--panel-accent) 58%,
            var(--gold)
        ) !important;

    border-radius:6px !important;

    background:
        radial-gradient(
            circle at 50% -10%,
            color-mix(
                in srgb,
                var(--panel-accent) 28%,
                transparent
            ),
            transparent 46%
        ),
        linear-gradient(
            145deg,
            #22342a,
            #16231c 58%,
            #111b16
        ) !important;

    box-shadow:
        0 0 0 3px #0e1712,
        0 0 0 4px
            color-mix(
                in srgb,
                var(--panel-accent) 42%,
                var(--gold)
            ),
        0 14px 28px rgba(0,0,0,.45),
        inset 0 0 28px rgba(0,0,0,.28) !important;

    clip-path:
        polygon(
            13px 0,
            calc(100% - 13px) 0,
            100% 13px,
            100% calc(100% - 13px),
            calc(100% - 13px) 100%,
            13px 100%,
            0 calc(100% - 13px),
            0 13px
        );

    transition:
        transform .2s ease,
        box-shadow .2s ease,
        filter .2s ease !important;
}

.panel::before,
.panel::after{
    content:"";

    position:absolute;

    width:42px;
    height:42px;

    z-index:-1;

    opacity:.62;

    pointer-events:none;
}

.panel::before{
    top:8px;
    left:8px;

    border-top:
        2px solid var(--gold);
    border-left:
        2px solid var(--gold);
}

.panel::after{
    right:8px;
    bottom:8px;

    border-right:
        2px solid var(--gold);
    border-bottom:
        2px solid var(--gold);
}

.panel:hover{
    transform:
        translateY(-5px)
        scale(1.012) !important;

    filter:brightness(1.08);

    background:
        radial-gradient(
            circle at 50% -10%,
            color-mix(
                in srgb,
                var(--panel-accent) 38%,
                transparent
            ),
            transparent 48%
        ),
        linear-gradient(
            145deg,
            #294032,
            #1a2a21 58%,
            #131f19
        ) !important;

    box-shadow:
        0 0 0 3px #0e1712,
        0 0 0 5px
            color-mix(
                in srgb,
                var(--panel-accent) 58%,
                var(--gold-light)
            ),
        0 20px 38px rgba(0,0,0,.55),
        0 0 24px
            color-mix(
                in srgb,
                var(--panel-accent) 24%,
                transparent
            ),
        inset 0 0 32px rgba(0,0,0,.25) !important;
}

.panelIcon{
    margin-bottom:9px;

    font-size:35px;

    filter:
        drop-shadow(
            0 3px 4px rgba(0,0,0,.58)
        );
}

.panelTitle{
    max-width:88%;

    color:#f1eee5 !important;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:
        clamp(
            21px,
            2.1vw,
            31px
        ) !important;

    font-weight:750;

    letter-spacing:.7px;

    text-shadow:
        0 2px 4px rgba(0,0,0,.7);
}

.resizeBtn{
    border:
        1px solid
        rgba(189,162,103,.7) !important;

    background:
        rgba(15,25,19,.88) !important;

    color:var(--gold-light) !important;
}

#editorHeader{
    background:
        linear-gradient(
            180deg,
            #1c2c23,
            #111c16
        ) !important;

    border-bottom:
        1px solid
        rgba(189,162,103,.75) !important;
}

#documentTitle{
    color:var(--gold-light);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    letter-spacing:.5px;
}

#backButton,
#panelSettingsBtn{
    border:
        1px solid
        rgba(189,162,103,.7) !important;

    background:
        linear-gradient(
            180deg,
            #456b51,
            #294334
        ) !important;

    color:white !important;
}

#panelSettingsMenu{
    background:
        linear-gradient(
            180deg,
            #203128,
            #111b16
        ) !important;

    border:
        1px solid
        var(--gold) !important;
}

#panelSettingsMenu > button,
#panelSettingsMenu > label{
    background:
        #263a2f !important;

    border:
        1px solid
        rgba(189,162,103,.25) !important;
}

#panelSettingsMenu > button:hover,
#panelSettingsMenu > label:hover{
    background:
        #365442 !important;
}

#resetPanelBtn{
    background:#5b5332 !important;
}

#deletePanelBtn{
    background:
        var(--danger) !important;
}

#editorToolbar,
.trackerToolbar{
    background:
        linear-gradient(
            180deg,
            #203128,
            #15221b
        ) !important;

    border-bottom:
        1px solid
        rgba(189,162,103,.5);
}

#editorToolbar button,
.trackerToolbar button{
    border:
        1px solid
        rgba(189,162,103,.62) !important;

    background:
        linear-gradient(
            180deg,
            #4b7357,
            #2b4937
        ) !important;

    color:white !important;

    border-radius:4px !important;
}

#editorToolbar button:hover,
.trackerToolbar button:hover{
    filter:brightness(1.15);
}

.templateBox,
.panelChooserBox,
.npcLibraryBox,
.monsterLibraryBox,
.encounterBuilderBox,
.mapLibraryBox,
.campaignManagerBox,
.questManagerBox,
.worldDatabaseBox{
    border:
        1px solid
        var(--gold) !important;

    background:
        linear-gradient(
            180deg,
            #1c2b22,
            #0f1813
        ) !important;

    box-shadow:
        0 0 0 3px #0b120e,
        0 0 0 4px rgba(189,162,103,.38),
        0 28px 78px rgba(0,0,0,.72),
        inset 0 0 35px rgba(0,0,0,.2) !important;

    border-radius:7px !important;
}

.templateBox,
.panelChooserBox,
.npcLibraryBox,
.monsterLibraryBox,
.encounterBuilderBox,
.mapLibraryBox{
    clip-path:
        polygon(
            10px 0,
            calc(100% - 10px) 0,
            100% 10px,
            100% calc(100% - 10px),
            calc(100% - 10px) 100%,
            10px 100%,
            0 calc(100% - 10px),
            0 10px
        );
}

.panelChooserHeader,
.npcLibraryHeader,
.monsterLibraryHeader,
.encounterBuilderHeader,
.mapLibraryHeader,
.campaignManagerHeader,
.questManagerHeader,
.worldDatabaseHeader{
    background:
        linear-gradient(
            180deg,
            #24382c,
            #142119
        ) !important;

    border-bottom:
        1px solid
        rgba(189,162,103,.75) !important;
}

.panelChooserHeader h2,
.npcLibraryHeader h2,
.monsterLibraryHeader h2,
.encounterBuilderHeader h2,
.mapLibraryHeader h2,
.campaignManagerHeader h2,
.questManagerHeader h2,
.worldDatabaseHeader h2{
    color:var(--gold-light) !important;

    font-family:
        Georgia,
        "Times New Roman",
        serif !important;

    letter-spacing:.5px;
}

input,
select,
textarea{
    accent-color:var(--green);
}

.panelChooserTools input,
.npcLibraryTools input,
.monsterLibraryTools input,
.encounterBuilderTools input,
.mapLibraryTools input,
.questManagerToolbar input,
.questManagerToolbar select,
.worldDatabaseToolbar input,
.worldDatabaseToolbar select{
    border:
        1px solid
        rgba(189,162,103,.72) !important;

    background:
        #f0e5c7 !important;

    color:var(--ink) !important;

    border-radius:4px !important;
}

button{
    font-family:
        Segoe UI,
        Tahoma,
        sans-serif;
}

.libraryCreateBtn,
#newWorldEntryBtn,
#newQuestBtn,
#saveCurrentNpcBtn,
#saveCurrentMonsterBtn,
#saveMapBtn,
#saveEncounterBtn,
#startEncounterBtn{
    border:
        1px solid
        var(--gold) !important;

    background:
        linear-gradient(
            180deg,
            #527d5e,
            #2d4b38
        ) !important;

    color:white !important;

    border-radius:4px !important;
}

.libraryCreateBtn:hover,
#newWorldEntryBtn:hover,
#newQuestBtn:hover{
    filter:brightness(1.15);
}

.monsterSheet,
.npcSheet,
.worldEntryBook,
.questEditorBook,
.campaignNoteBook,
#editor.parchmentEditor{
    background:
        radial-gradient(
            circle at 12% 8%,
            rgba(255,255,255,.43),
            transparent 28%
        ),
        radial-gradient(
            circle at 86% 90%,
            rgba(91,62,30,.11),
            transparent 30%
        ),
        linear-gradient(
            180deg,
            var(--parchment-light),
            var(--parchment)
        ) !important;

    color:var(--ink) !important;

    border-color:
        #8b6d3d !important;
}

#initiativeTable{
    border:
        1px solid
        rgba(189,162,103,.7) !important;

    background:#15211a;
}

#initiativeTable th{
    background:
        linear-gradient(
            180deg,
            #35533f,
            #22382a
        ) !important;

    color:var(--gold-light) !important;

    border-color:
        rgba(189,162,103,.46) !important;
}

#initiativeTable td{
    border-color:
        rgba(189,162,103,.22) !important;
}

#initiativeTable tbody tr{
    background:
        rgba(30,48,38,.88);
}

#initiativeTable tbody tr:nth-child(even){
    background:
        rgba(37,59,46,.88);
}

#initiativeTable tbody tr.activeTurn{
    background:
        rgba(86,111,66,.9) !important;

    box-shadow:
        inset 4px 0 0
        var(--gold-light);
}

.npcLibraryCard,
.monsterLibraryCard,
.mapLibraryCard,
.encounterSavedCard,
.questCard,
.worldEntryCard,
.campaignItemCard{
    border:
        1px solid
        #8d7144 !important;

    background:
        radial-gradient(
            circle at top left,
            rgba(255,255,255,.3),
            transparent 34%
        ),
        linear-gradient(
            180deg,
            #efe2bd,
            #d7c18e
        ) !important;

    color:var(--ink) !important;

    border-radius:5px !important;

    box-shadow:
        0 7px 16px rgba(0,0,0,.28) !important;
}

.npcLibraryCard:hover,
.monsterLibraryCard:hover,
.mapLibraryCard:hover,
.questCard:hover,
.worldEntryCard:hover{
    transform:translateY(-3px);

    box-shadow:
        0 12px 24px rgba(0,0,0,.34) !important;
}

#closeTemplate,
#closePanelChooser,
#closeNpcLibrary,
#closeMonsterLibrary,
#closeEncounterBuilder,
#closeMapLibrary,
#closeCampaignManager,
#closeQuestManager,
#closeQuestEditor,
#closeWorldDatabase,
#closeWorldEntryWindow,
#closeMapPinWindow,
#closeCampaignNoteWindow{
    border:
        1px solid
        rgba(219,196,135,.7) !important;

    background:
        linear-gradient(
            180deg,
            #824238,
            #582821
        ) !important;

    color:white !important;
}

#closeTemplate:hover,
#closePanelChooser:hover,
#closeNpcLibrary:hover,
#closeMonsterLibrary:hover,
#closeEncounterBuilder:hover,
#closeMapLibrary:hover,
#closeCampaignManager:hover,
#closeQuestManager:hover{
    background:
        linear-gradient(
            180deg,
            #a85347,
            #743128
        ) !important;
}

#notification{
    border:
        1px solid
        var(--gold) !important;

    background:
        linear-gradient(
            180deg,
            #3f684d,
            #233d2e
        ) !important;

    color:white !important;

    box-shadow:
        0 8px 24px rgba(0,0,0,.48);
}

@media(max-width:1180px){

    header{
        align-items:flex-start;
        flex-direction:column;

        gap:7px;

        padding:
            10px
            16px !important;
    }

    .mainToolbar{
        width:100%;

        justify-content:flex-start;
    }

    .mainToolbar button{
        flex:1 1 auto;
    }

}

@media(max-width:760px){

    #homeGrid{
        padding:16px !important;
        gap:16px !important;
    }

    .panel{
        padding:16px !important;
    }

    .mainToolbar button{
        min-width:calc(50% - 6px);
    }

}

#sessionDashboardWindow{
    position:fixed;
    inset:var(--header-height) 0 0;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:18px;
    background:rgba(5,9,7,.86);
    z-index:26000;
}

#sessionDashboardWindow.hidden{display:none}

.sessionDashboardBox{
    width:min(1420px,97vw);
    max-height:calc(100vh - 105px);
    display:flex;
    flex-direction:column;
    overflow:hidden;
    border:1px solid var(--gold);
    border-radius:7px;
    background:linear-gradient(180deg,#1b2a21,#0e1712);
    box-shadow:0 0 0 3px #09100c,0 0 0 4px rgba(189,162,103,.38),0 30px 85px rgba(0,0,0,.75);
}

.sessionDashboardHeader{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:20px;
    flex-shrink:0;
    padding:20px 24px;
    border-bottom:1px solid rgba(189,162,103,.75);
    background:linear-gradient(180deg,#263b2e,#142119);
}

.sessionDashboardHeader h2{
    margin:0;
    color:var(--gold-light);
    font-family:Georgia,"Times New Roman",serif;
    font-size:31px;
}

.sessionDashboardHeader p{margin-top:5px;color:#bdc8be;font-style:italic}

#closeSessionDashboard{
    width:40px;height:40px;
    border:1px solid rgba(219,196,135,.7);
    border-radius:50%;
    background:linear-gradient(180deg,#824238,#582821);
    color:white;font-size:18px;font-weight:900;cursor:pointer;
}

.sessionDashboardContent{
    display:flex;
    flex-direction:column;
    gap:24px;
    min-height:0;
    padding:24px 26px 65px;
    overflow-y:auto;
}

.sessionDashboardHero{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    padding:24px 26px;
    border:1px solid rgba(189,162,103,.6);
    background:radial-gradient(circle at top left,rgba(103,145,113,.24),transparent 42%),linear-gradient(145deg,#243a2c,#142219);
    clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 10px,100% calc(100% - 10px),calc(100% - 10px) 100%,10px 100%,0 calc(100% - 10px),0 10px);
}

.sessionEyebrow{color:var(--gold);font-size:12px;font-weight:900;letter-spacing:1.5px;text-transform:uppercase}

.sessionDashboardHero h3{margin:5px 0 4px;color:#f2efe5;font-family:Georgia,"Times New Roman",serif;font-size:34px}

.sessionDashboardHero p{color:#bdc8be}

.sessionSaveState{display:flex;align-items:center;gap:8px;color:#c6d3c8;font-size:13px}

.sessionSaveDot{width:10px;height:10px;border-radius:50%;background:#75aa7e;box-shadow:0 0 12px rgba(117,170,126,.75)}

.sessionOverviewGrid{
    display:grid;
    grid-template-columns:repeat(4,minmax(180px,1fr));
    gap:13px;
}

.sessionFieldCard{
    display:flex;
    flex-direction:column;
    gap:7px;
    padding:15px;
    border:1px solid rgba(189,162,103,.48);
    background:linear-gradient(180deg,#203128,#15221b);
    color:#d9ddd8;
}

.sessionFieldCard>span{color:var(--gold-light);font-size:12px;font-weight:900;letter-spacing:.5px;text-transform:uppercase}

.sessionFieldCard input,.sessionFieldCard select{width:100%;min-height:41px;padding:8px 10px;border:1px solid rgba(189,162,103,.65);border-radius:4px;background:#efe4c6;color:var(--ink);font-size:14px}

.sessionQuickActions{
    display:grid;
    grid-template-columns:repeat(4,minmax(150px,1fr));
    gap:10px;
}

.sessionQuickActions button{
    min-height:48px;padding:10px 14px;
    border:1px solid rgba(189,162,103,.7);border-radius:4px;
    background:linear-gradient(180deg,#4c7558,#294837);
    color:white;font-weight:850;cursor:pointer;
    transition:transform .15s,filter .15s;
}

.sessionQuickActions button:hover{transform:translateY(-2px);filter:brightness(1.15)}

.sessionFocusGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}

.sessionFocusCard{
    min-height:165px;padding:19px;
    border:1px solid #8d7144;
    background:radial-gradient(circle at top left,rgba(255,255,255,.32),transparent 35%),linear-gradient(180deg,#efe2bd,#d5be88);
    color:var(--ink);
    box-shadow:0 8px 18px rgba(0,0,0,.28);
}

.sessionFocusCard>span{color:#796033;font-size:11px;font-weight:900;letter-spacing:1px;text-transform:uppercase}

.sessionFocusCard strong{display:block;margin:8px 0;color:#5d2c1d;font-family:Georgia,"Times New Roman",serif;font-size:22px}

.sessionFocusCard p{line-height:1.5}

.sessionNotesSection{overflow:hidden;border:1px solid #8d7144;background:linear-gradient(180deg,var(--parchment-light),var(--parchment));color:var(--ink)}

.sessionSectionHeading{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:16px 20px;border-bottom:3px double #8d7144}

.sessionSectionHeading span{color:#80683b;font-size:11px;font-weight:900;letter-spacing:1px;text-transform:uppercase}

.sessionSectionHeading h3{margin-top:3px;color:#5d2c1d;font-family:Georgia,"Times New Roman",serif;font-size:25px}

#clearSessionNotesBtn{min-height:39px;padding:8px 13px;border:1px solid #8b5637;background:#74352d;color:white;font-weight:800;cursor:pointer}

#sessionNotesInput{
    width:100%;min-height:420px;padding:24px 26px;border:none;resize:vertical;
    background:repeating-linear-gradient(180deg,rgba(249,239,207,.94) 0,rgba(249,239,207,.94) 31px,rgba(103,78,43,.13) 32px,rgba(249,239,207,.94) 33px);
    color:#35271b;font-family:Georgia,"Times New Roman",serif;font-size:16px;line-height:2.05;outline:none;
}

@media(max-width:1100px){
    .sessionOverviewGrid{grid-template-columns:repeat(2,1fr)}
    .sessionQuickActions{grid-template-columns:repeat(2,1fr)}
    .sessionFocusGrid{grid-template-columns:1fr}
}

@media(max-width:650px){
    #sessionDashboardWindow{padding:8px}
    .sessionDashboardBox{max-height:calc(100vh - 88px)}
    .sessionDashboardContent{padding:16px 14px 45px}
    .sessionDashboardHero{align-items:flex-start;flex-direction:column}
    .sessionOverviewGrid,.sessionQuickActions{grid-template-columns:1fr}
    #sessionNotesInput{min-height:330px}
}

#lootManagerWindow,
#lootEditorWindow,
#lootGeneratorWindow{
    position:fixed;
    inset:var(--header-height) 0 0;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:18px;

    background:rgba(5,8,6,.86);

    z-index:27000;
}

#lootManagerWindow.hidden,
#lootEditorWindow.hidden,
#lootGeneratorWindow.hidden{
    display:none;
}

.lootManagerBox{
    width:min(1380px,97vw);
    max-height:calc(100vh - 105px);

    display:flex;
    flex-direction:column;

    overflow:hidden;

    border:1px solid var(--gold);
    border-radius:7px;

    background:
        linear-gradient(
            180deg,
            #1b2b22,
            #0e1712
        );

    box-shadow:
        0 0 0 3px #09100c,
        0 0 0 4px rgba(189,162,103,.38),
        0 30px 85px rgba(0,0,0,.75);
}

.lootManagerHeader,
.lootEditorHeader,
.lootGeneratorHeader{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:20px;

    flex-shrink:0;

    padding:20px 24px;

    border-bottom:1px solid rgba(189,162,103,.75);

    background:
        linear-gradient(
            180deg,
            #2d402f,
            #17231b
        );
}

.lootManagerHeader h2,
.lootEditorHeader h2,
.lootGeneratorHeader h2{
    margin:0;

    color:var(--gold-light);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:30px;
}

.lootManagerHeader p,
.lootEditorHeader p,
.lootGeneratorHeader p{
    margin-top:5px;

    color:#c0cabf;
    font-style:italic;
}

#closeLootManager,
#closeLootEditor,
#closeLootGenerator{
    width:40px;
    height:40px;

    border:1px solid rgba(219,196,135,.7);
    border-radius:50%;

    background:
        linear-gradient(
            180deg,
            #824238,
            #582821
        );

    color:white;

    font-size:18px;
    font-weight:900;
    cursor:pointer;
}

.lootManagerToolbar{
    display:grid;
    grid-template-columns:minmax(240px,1fr) 210px auto auto;
    gap:11px;

    flex-shrink:0;

    padding:15px 20px;

    border-bottom:1px solid rgba(189,162,103,.32);

    background:#142019;
}

.lootManagerToolbar input,
.lootManagerToolbar select{
    min-height:44px;

    padding:9px 12px;

    border:1px solid rgba(189,162,103,.68);
    border-radius:4px;

    background:#efe4c6;
    color:var(--ink);

    font-size:14px;
}

#generateLootBtn,
#newLootBtn{
    min-height:44px;

    padding:9px 17px;

    border:1px solid var(--gold);
    border-radius:4px;

    color:white;
    font-weight:850;
    cursor:pointer;
}

#generateLootBtn{
    background:
        linear-gradient(
            180deg,
            #6b6538,
            #474223
        );
}

#newLootBtn{
    background:
        linear-gradient(
            180deg,
            #4f785a,
            #2b4937
        );
}

.lootManagerStats{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px;

    flex-shrink:0;

    padding:14px 20px;

    background:#101a14;
}

.lootManagerStats article{
    padding:13px 15px;

    border:1px solid rgba(189,162,103,.42);

    background:
        linear-gradient(
            180deg,
            #213329,
            #17241c
        );
}

.lootManagerStats span{
    display:block;

    color:#b9c5bb;

    font-size:11px;
    font-weight:850;
    letter-spacing:.7px;
    text-transform:uppercase;
}

.lootManagerStats strong{
    display:block;

    margin-top:5px;

    color:var(--gold-light);

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:23px;
}

#lootManagerList{
    display:grid;
    grid-template-columns:
        repeat(
            auto-fill,
            minmax(320px,1fr)
        );

    gap:15px;

    min-height:0;

    padding:19px 20px 35px;

    overflow-y:auto;
}

.lootCard{
    display:flex;
    flex-direction:column;
    gap:14px;

    min-height:285px;

    padding:18px;

    border:1px solid #8d7144;

    background:
        radial-gradient(
            circle at top left,
            rgba(255,255,255,.32),
            transparent 35%
        ),
        linear-gradient(
            180deg,
            #efe2bd,
            #d5be88
        );

    color:var(--ink);

    box-shadow:
        0 8px 18px rgba(0,0,0,.28);

    transition:
        transform .15s,
        box-shadow .15s;
}

.lootCard:hover{
    transform:translateY(-3px);

    box-shadow:
        0 14px 26px rgba(0,0,0,.36);
}

.lootCardHeader{
    display:flex;
    justify-content:space-between;
    gap:14px;
}

.lootCardHeader span{
    color:#80683b;

    font-size:11px;
    font-weight:900;
    letter-spacing:.8px;
    text-transform:uppercase;
}

.lootCardHeader h3{
    margin:5px 0 3px;

    color:#5d2c1d;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:23px;
}

.lootCardHeader p{
    color:#725e46;

    font-size:13px;
    font-style:italic;
}

.lootCardHeader > strong{
    align-self:flex-start;

    color:#356044;

    white-space:nowrap;
}

.lootCoinSummary{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:5px;
}

.lootCoinSummary span{
    padding:7px 4px;

    border:1px solid rgba(112,78,38,.32);

    background:rgba(255,255,255,.32);

    text-align:center;
    font-size:12px;
    font-weight:800;
}

.lootCardBody{
    flex:1;

    padding:12px;

    border:1px solid rgba(112,78,38,.25);

    background:rgba(255,255,255,.22);
}

.lootCardBody ul{
    margin:8px 0 0 18px;
}

.lootCardBody li{
    margin:4px 0;
}

.lootCardFooter{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:10px;
}

.lootCardFooter span{
    color:#786247;

    font-size:13px;
}

.lootCardFooter button{
    min-height:38px;

    padding:7px 14px;

    border:1px solid #7b653d;

    background:#385f46;
    color:white;

    font-weight:850;
    cursor:pointer;
}

.lootManagerEmpty{
    grid-column:1 / -1;

    min-height:360px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:10px;

    color:#bfc9bf;
    text-align:center;
}

.lootManagerEmpty div{
    font-size:64px;
}

.lootManagerEmpty strong{
    color:var(--gold-light);
    font-size:23px;
}

.lootEditorBook{
    width:min(1080px,97vw);
    max-height:calc(100vh - 105px);

    display:flex;
    flex-direction:column;

    overflow:hidden;

    border:4px double #7e6334;
    border-radius:8px;

    background:
        radial-gradient(
            circle at top left,
            rgba(255,255,255,.4),
            transparent 30%
        ),
        linear-gradient(
            180deg,
            var(--parchment-light),
            var(--parchment)
        );

    color:var(--ink);

    box-shadow:
        0 28px 80px rgba(0,0,0,.72),
        inset 0 0 38px rgba(105,65,26,.18);
}

.lootEditorContent{
    display:flex;
    flex-direction:column;
    gap:20px;

    min-height:0;

    padding:21px 24px 35px;

    overflow-y:auto;
}

.lootIdentityGrid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:14px;
}

.lootIdentityGrid label,
.lootNotesSection label{
    display:flex;
    flex-direction:column;
    gap:6px;

    color:#62321e;

    font-weight:850;
}

.lootIdentityGrid input,
.lootIdentityGrid select,
.lootNotesSection textarea,
.lootCoinGrid input,
.lootItemEditorRow input,
.lootItemEditorRow select{
    width:100%;

    padding:9px 10px;

    border:1px solid #9b7642;
    border-radius:4px;

    background:rgba(255,250,232,.82);
    color:var(--ink);

    font:inherit;
}

.lootCoinSection,
.lootItemSection,
.lootNotesSection{
    border:1px solid #9a7641;

    background:rgba(255,248,224,.36);
}

.lootSectionHeading{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:14px;

    padding:13px 16px;

    border-bottom:3px double #9a7641;
}

.lootSectionHeading span{
    color:#856b3b;

    font-size:10px;
    font-weight:900;
    letter-spacing:1px;
    text-transform:uppercase;
}

.lootSectionHeading h3{
    margin-top:3px;

    color:#5e2f1d;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size:24px;
}

#lootCoinValue{
    color:#356044;
}

.lootCoinGrid{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:11px;

    padding:16px;
}

.lootCoinGrid label{
    display:flex;
    flex-direction:column;
    gap:5px;

    color:#684426;

    font-weight:900;
    text-align:center;
}

#addLootItemBtn{
    min-height:39px;

    padding:7px 13px;

    border:1px solid #7f673d;

    background:#416b4e;
    color:white;

    font-weight:850;
    cursor:pointer;
}

#lootItemEditorList{
    display:flex;
    flex-direction:column;
    gap:9px;

    padding:14px;
}

.lootItemEditorRow{
    display:grid;
    grid-template-columns:145px minmax(190px,1.7fr) 75px 100px minmax(150px,1fr) 38px 38px;
    gap:8px;
    align-items:center;
}

.lootItemQuantity,
.lootItemValue{
    text-align:center;
}

.lootItemRemove,
.lootItemDetails{
    width:38px;
    height:38px;

    font-weight:900;
    cursor:pointer;
}

.lootItemDetails{
    border:1px solid #7f673d;

    background:#416b4e;
    color:white;
}

.lootItemRemove{

    border:1px solid #8a4d39;

    background:#7a332a;
    color:white;

}

.lootItemEmpty{
    padding:40px 20px;

    color:#796349;
    text-align:center;
    font-style:italic;
}

.lootNotesSection{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;

    padding:16px;
}

.lootNotesSection textarea{
    min-height:150px;
    resize:vertical;
}

.lootEditorFooter{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;

    flex-shrink:0;

    padding:14px 23px;

    border-top:3px solid #9a6734;

    background:rgba(101,61,25,.1);
}

.lootEditorFooter > div{
    display:flex;
    gap:9px;
}

.lootEditorFooter button{
    min-height:42px;

    padding:8px 16px;

    border:1px solid #87532a;

    font-weight:900;
    cursor:pointer;
}

#deleteLootBtn{
    background:#7a332a;
    color:white;
}

#duplicateLootBtn,
#cancelLootBtn{
    background:#dbc595;
    color:#392617;
}

#saveLootBtn{
    background:#3e674a;
    color:white;
}

.lootGeneratorBox{
    width:min(560px,95vw);

    overflow:hidden;

    border:1px solid var(--gold);

    background:
        linear-gradient(
            180deg,
            #1d2d23,
            #101a14
        );

    box-shadow:
        0 0 0 3px #09100c,
        0 0 0 4px rgba(189,162,103,.38),
        0 26px 70px rgba(0,0,0,.72);
}

.lootGeneratorForm{
    display:grid;
    gap:14px;

    padding:22px;
}

.lootGeneratorForm label{
    display:flex;
    flex-direction:column;
    gap:7px;

    color:var(--gold-light);

    font-weight:850;
}

.lootGeneratorForm input,
.lootGeneratorForm select{
    min-height:43px;

    padding:8px 10px;

    border:1px solid rgba(189,162,103,.7);

    background:#efe4c6;
    color:var(--ink);
}

.lootGeneratorActions{
    display:flex;
    justify-content:flex-end;
    gap:10px;

    padding:0 22px 22px;
}

.lootGeneratorActions button{
    min-height:42px;

    padding:8px 16px;

    border:1px solid var(--gold);

    font-weight:900;
    cursor:pointer;
}

#cancelLootGeneratorBtn{
    background:#36473c;
    color:white;
}

#createGeneratedLootBtn{
    background:#4c7558;
    color:white;
}

@media(max-width:980px){

    .lootManagerToolbar{
        grid-template-columns:1fr 1fr;
    }

    .lootItemEditorRow{
        grid-template-columns:1fr 1.4fr 70px 90px;
    }

    .lootItemNotes{
        grid-column:1 / -2;
    }

}

@media(max-width:700px){

    #lootManagerWindow,
    #lootEditorWindow,
    #lootGeneratorWindow{
        padding:8px;
    }

    .lootManagerBox,
    .lootEditorBook{
        max-height:calc(100vh - 88px);
    }

    .lootManagerToolbar,
    .lootManagerStats,
    .lootIdentityGrid,
    .lootCoinGrid,
    .lootNotesSection{
        grid-template-columns:1fr;
    }

    .lootItemEditorRow{
        grid-template-columns:1fr;
    }

    .lootItemNotes{
        grid-column:auto;
    }

    .lootItemRemove{
        width:100%;
    }

    .lootItemDetails{
        width:100%;
    }

    .lootEditorFooter{
        align-items:stretch;
        flex-direction:column;
    }

    .lootEditorFooter > div{
        display:grid;
        grid-template-columns:1fr;
    }

}

#spellbookWindow,
#customSpellWindow{
    position:fixed;
    inset:var(--header-height) 0 0;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:18px;
    background:rgba(5,8,7,.88);
    z-index:27500;
}

#spellbookWindow.hidden,
#customSpellWindow.hidden{
    display:none;
}

.spellbookBox{
    width:min(1450px,97vw);
    height:min(900px,calc(100vh - 105px));
    display:flex;
    flex-direction:column;
    overflow:hidden;
    border:1px solid var(--gold);
    border-radius:7px;
    background:linear-gradient(180deg,#1a2921,#0d1611);
    box-shadow:0 0 0 3px #08100b,0 0 0 4px rgba(189,162,103,.38),0 30px 85px rgba(0,0,0,.78);
}

.spellbookHeader,
.customSpellHeader{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:20px;
    flex-shrink:0;
    padding:20px 24px;
    border-bottom:1px solid rgba(189,162,103,.75);
    background:linear-gradient(180deg,#2c3f32,#17241c);
}

.spellbookHeader h2,
.customSpellHeader h2{
    margin:0;
    color:var(--gold-light);
    font-family:Georgia,"Times New Roman",serif;
    font-size:30px;
}

.spellbookHeader p,
.customSpellHeader p{
    margin-top:5px;
    color:#c0cac1;
    font-style:italic;
}

#closeSpellbook,
#closeCustomSpell{
    width:40px;
    height:40px;
    border:1px solid rgba(219,196,135,.7);
    border-radius:50%;
    background:linear-gradient(180deg,#824238,#582821);
    color:white;
    font-size:18px;
    font-weight:900;
    cursor:pointer;
}

.spellbookToolbar{
    display:grid;
    grid-template-columns:minmax(240px,1fr) 130px 170px 160px auto auto;
    gap:10px;
    padding:14px 18px;
    border-bottom:1px solid rgba(189,162,103,.28);
    background:#121e17;
}

.spellbookToolbar input,
.spellbookToolbar select{
    min-height:43px;
    padding:8px 10px;
    border:1px solid rgba(189,162,103,.65);
    border-radius:4px;
    background:#efe4c6;
    color:var(--ink);
}

#searchOnlineSpellsBtn,
#newCustomSpellBtn{
    min-height:43px;
    padding:8px 14px;
    border:1px solid var(--gold);
    color:white;
    font-weight:850;
    cursor:pointer;
}

#searchOnlineSpellsBtn{background:linear-gradient(180deg,#506c85,#30485d)}

#newCustomSpellBtn{background:linear-gradient(180deg,#4e7659,#2b4937)}

.spellbookStatus{
    display:flex;
    justify-content:space-between;
    gap:15px;
    padding:10px 18px;
    border-bottom:1px solid rgba(189,162,103,.2);
    background:#17231b;
    color:#bac7bd;
    font-size:13px;
}

.spellbookLayout{
    display:grid;
    grid-template-columns:390px minmax(0,1fr);
    flex:1;
    min-height:0;
}

#spellResultList{
    min-height:0;
    overflow-y:auto;
    padding:12px;
    border-right:1px solid rgba(189,162,103,.45);
    background:#111b15;
}

.spellResultCard{
    width:100%;
    min-height:64px;
    display:grid;
    grid-template-columns:42px 1fr 32px;
    gap:10px;
    align-items:center;
    margin-bottom:8px;
    padding:9px 10px;
    border:1px solid rgba(189,162,103,.35);
    background:linear-gradient(180deg,#21332a,#18251e);
    color:white;
    text-align:left;
    cursor:pointer;
}

.spellResultCard:hover,
.spellResultCard.active{
    border-color:var(--gold-light);
    background:linear-gradient(180deg,#365342,#22372a);
}

.spellLevelBadge{
    width:36px;
    height:36px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid var(--gold);
    border-radius:50%;
    background:#111b15;
    color:var(--gold-light);
    font-family:Georgia,"Times New Roman",serif;
    font-weight:900;
}

.spellResultText{
    display:flex;
    flex-direction:column;
    gap:4px;
    min-width:0;
}

.spellResultText strong{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-family:Georgia,"Times New Roman",serif;
    font-size:17px;
}

.spellResultText small{
    color:#b6c1b8;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.spellFavoriteMark{
    color:var(--gold-light);
    font-size:22px;
    text-align:center;
}

#spellDetailPane{
    min-width:0;
    min-height:0;
    overflow-y:auto;
    padding:22px;
    background:linear-gradient(180deg,#eadbb6,#d7c08d);
    color:var(--ink);
}

.spellDetailEmpty,
.spellResultEmpty{
    min-height:300px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:10px;
    text-align:center;
}

.spellDetailEmpty div{
    font-size:58px;
    color:#7c663b;
}

.spellDetailBook{
    max-width:950px;
    margin:0 auto;
    padding:24px;
    border:4px double #8a6c3d;
    background:radial-gradient(circle at top left,rgba(255,255,255,.42),transparent 32%),linear-gradient(180deg,#f5ead0,#e4d1a3);
    box-shadow:0 12px 28px rgba(73,49,22,.26),inset 0 0 34px rgba(99,66,26,.12);
}

.spellDetailHeader{
    display:flex;
    justify-content:space-between;
    gap:18px;
    padding-bottom:16px;
    border-bottom:4px double #8a6c3d;
}

.spellDetailHeader span{
    color:#80683d;
    font-size:12px;
    font-weight:900;
    letter-spacing:.8px;
    text-transform:uppercase;
}

.spellDetailHeader h3{
    margin:5px 0;
    color:#5d2c1d;
    font-family:Georgia,"Times New Roman",serif;
    font-size:36px;
}

.spellDetailHeader p{
    color:#6f5941;
    font-style:italic;
}

#selectedSpellFavoriteBtn{
    align-self:flex-start;
    min-height:40px;
    padding:8px 13px;
    border:1px solid #8a6c3d;
    background:#6e5b31;
    color:white;
    font-weight:850;
    cursor:pointer;
}

.spellDetailFacts{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:9px;
    margin:18px 0;
}

.spellDetailFacts span{
    padding:10px;
    border:1px solid rgba(116,82,39,.35);
    background:rgba(255,255,255,.3);
}

.spellDetailFacts strong{
    display:block;
    margin-bottom:4px;
    color:#6a3520;
    font-size:11px;
    text-transform:uppercase;
}

.spellDescriptionSection{
    margin-top:20px;
}

.spellDescriptionSection h4{
    margin-bottom:8px;
    padding-bottom:5px;
    border-bottom:2px solid #9a7641;
    color:#5d2c1d;
    font-family:Georgia,"Times New Roman",serif;
    font-size:23px;
}

.spellDescriptionSection p{
    line-height:1.65;
}

.spellDetailActions{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    margin-top:24px;
    padding-top:14px;
    border-top:1px solid #9a7641;
    color:#735c40;
    font-size:13px;
}

#editSelectedCustomSpellBtn{
    min-height:40px;
    padding:8px 14px;
    border:1px solid #7d6337;
    background:#3f684d;
    color:white;
    font-weight:850;
    cursor:pointer;
}

.customSpellBook{
    width:min(920px,96vw);
    max-height:calc(100vh - 105px);
    display:flex;
    flex-direction:column;
    overflow:hidden;
    border:4px double #806437;
    border-radius:8px;
    background:linear-gradient(180deg,var(--parchment-light),var(--parchment));
    color:var(--ink);
    box-shadow:0 28px 80px rgba(0,0,0,.72);
}

.customSpellForm{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:14px;
    min-height:0;
    padding:22px;
    overflow-y:auto;
}

.customSpellForm label{
    display:flex;
    flex-direction:column;
    gap:6px;
    color:#62321e;
    font-weight:850;
}

.customSpellForm input,
.customSpellForm select,
.customSpellForm textarea{
    width:100%;
    padding:9px 10px;
    border:1px solid #9a7641;
    background:rgba(255,250,232,.84);
    color:var(--ink);
    font:inherit;
}

.customSpellCheck{
    flex-direction:row !important;
    align-items:center;
}

.customSpellCheck input{
    width:auto;
}

.customSpellWide{
    grid-column:1 / -1;
}

.customSpellWide textarea{
    min-height:150px;
    resize:vertical;
    line-height:1.55;
}

.customSpellFooter{
    display:flex;
    justify-content:space-between;
    gap:12px;
    padding:14px 22px;
    border-top:3px solid #9a6734;
}

.customSpellFooter > div{
    display:flex;
    gap:9px;
}

.customSpellFooter button{
    min-height:41px;
    padding:8px 15px;
    border:1px solid #87532a;
    font-weight:900;
    cursor:pointer;
}

#deleteCustomSpellBtn{background:#7a332a;color:white}

#cancelCustomSpellBtn{background:#dbc595;color:#392617}

#saveCustomSpellBtn{background:#3e674a;color:white}

@media(max-width:1100px){
    .spellbookToolbar{
        grid-template-columns:1fr 1fr 1fr;
    }
}

@media(max-width:780px){
    #spellbookWindow,
    #customSpellWindow{
        padding:8px;
    }

    .spellbookBox{
        height:calc(100vh - 88px);
    }

    .spellbookToolbar{
        grid-template-columns:1fr;
    }

    .spellbookLayout{
        grid-template-columns:1fr;
    }

    #spellResultList{
        max-height:290px;
        border-right:none;
        border-bottom:1px solid rgba(189,162,103,.45);
    }

    .spellDetailFacts,
    .customSpellForm{
        grid-template-columns:1fr;
    }

    .customSpellWide{
        grid-column:auto;
    }

    .spellDetailHeader{
        flex-direction:column;
    }
}

#searchOnlineSpellsBtn:disabled{
    cursor:wait;
    opacity:.72;
    filter:saturate(.7);
}

.spellDetailActionButtons{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:9px;
}

.deleteSelectedSpellBtn{
    min-height:40px;
    padding:8px 14px;
    border:1px solid #8b5637;
    background:linear-gradient(180deg,#8a4036,#642c25);
    color:white;
    font-weight:850;
    cursor:pointer;
}

.deleteSelectedSpellBtn:hover{
    filter:brightness(1.15);
}

#panelSettingsMenu > button,
#panelSettingsMenu > label{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:12px !important;

    min-height:44px;
}

#panelSettingsMenu > button{
    justify-content:flex-start !important;
}

.settingsMenuLabel{
    display:flex;
    align-items:center;
    gap:10px;

    min-width:0;
}

.settingsMenuIcon{
    width:25px;
    height:25px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    flex:0 0 25px;

    border:1px solid rgba(219,196,135,.42);
    border-radius:5px;

    background:rgba(8,15,11,.34);
    color:var(--gold-light);

    font-size:15px;
    line-height:1;
}

#panelSettingsMenu #deletePanelBtn{
    border-color:#c46b60 !important;

    background:
        linear-gradient(
            180deg,
            #a8483e,
            #702b25
        ) !important;

    color:#fff !important;
}

#panelSettingsMenu #deletePanelBtn:hover{
    background:
        linear-gradient(
            180deg,
            #c65a4e,
            #8d342c
        ) !important;
}

#panelSettingsMenu #deletePanelBtn .settingsMenuIcon{
    border-color:rgba(255,224,218,.58);
    background:rgba(72,9,5,.28);
    color:#fff;
}

.panel{
    border-color:
        color-mix(
            in srgb,
            var(--panel-accent) 82%,
            var(--gold-light)
        ) !important;

    background:
        radial-gradient(
            circle at 50% -14%,
            color-mix(
                in srgb,
                var(--panel-accent) 58%,
                transparent
            ),
            transparent 52%
        ),
        linear-gradient(
            145deg,
            color-mix(
                in srgb,
                var(--panel-accent) 28%,
                #22342a
            ),
            #16231c 58%,
            #101914
        ) !important;

    box-shadow:
        0 0 0 3px #0e1712,
        0 0 0 5px
            color-mix(
                in srgb,
                var(--panel-accent) 76%,
                var(--gold)
            ),
        0 15px 30px rgba(0,0,0,.48),
        0 0 22px
            color-mix(
                in srgb,
                var(--panel-accent) 25%,
                transparent
            ),
        inset 0 0 34px
            color-mix(
                in srgb,
                var(--panel-accent) 18%,
                rgba(0,0,0,.28)
            ) !important;
}

.panel::before,
.panel::after{
    border-color:
        color-mix(
            in srgb,
            var(--panel-accent) 72%,
            var(--gold-light)
        ) !important;
}

.panelIcon{
    text-shadow:
        0 0 13px
        color-mix(
            in srgb,
            var(--panel-accent) 72%,
            transparent
        );
}

.panel:hover{
    background:
        radial-gradient(
            circle at 50% -12%,
            color-mix(
                in srgb,
                var(--panel-accent) 74%,
                transparent
            ),
            transparent 54%
        ),
        linear-gradient(
            145deg,
            color-mix(
                in srgb,
                var(--panel-accent) 39%,
                #294032
            ),
            #1a2a21 58%,
            #121e18
        ) !important;

    box-shadow:
        0 0 0 3px #0e1712,
        0 0 0 6px
            color-mix(
                in srgb,
                var(--panel-accent) 88%,
                var(--gold-light)
            ),
        0 22px 42px rgba(0,0,0,.58),
        0 0 34px
            color-mix(
                in srgb,
                var(--panel-accent) 42%,
                transparent
            ),
        inset 0 0 36px rgba(0,0,0,.2) !important;
}

#templateWindow,
#panelChooserWindow,
#npcLibraryWindow,
#monsterLibraryWindow,
#encounterBuilderWindow,
#mapLibraryWindow,
#campaignManagerWindow,
#campaignNoteWindow,
#worldDatabaseWindow,
#worldEntryWindow,
#questManagerWindow,
#questEditorWindow,
#sessionDashboardWindow,
#lootManagerWindow,
#lootEditorWindow,
#lootGeneratorWindow,
#spellbookWindow,
#customSpellWindow{
    top:var(--header-height) !important;
    right:0 !important;
    bottom:0 !important;
    left:0 !important;
    inset:var(--header-height) 0 0 0 !important;

    align-items:flex-start !important;
    justify-content:center !important;

    padding:14px 18px 20px !important;

    overflow-y:auto !important;
    overflow-x:hidden !important;
}

.templateBox,
.panelChooserBox,
.npcLibraryBox,
.monsterLibraryBox,
.encounterBuilderBox,
.mapLibraryBox,
.campaignManagerBox,
.campaignNoteBook,
.worldDatabaseBox,
.worldEntryBook,
.questManagerBox,
.questEditorBook,
.sessionDashboardBox,
.lootManagerBox,
.lootEditorBook,
.lootGeneratorBox,
.spellbookBox,
.customSpellBook{
    width:min(var(--modal-width, 1380px), 97vw);

    max-height:
        calc(
            100vh -
            var(--header-height) -
            30px
        ) !important;

    margin:0 auto !important;
}

.panelChooserHeader,
.npcLibraryHeader,
.monsterLibraryHeader,
.encounterBuilderHeader,
.mapLibraryHeader,
.campaignManagerHeader,
.campaignNoteHeader,
.worldDatabaseHeader,
.worldEntryHeader,
.questManagerHeader,
.questEditorHeader,
.sessionDashboardHeader,
.lootManagerHeader,
.lootEditorHeader,
.lootGeneratorHeader,
.spellbookHeader,
.customSpellHeader{
    position:sticky !important;
    top:0 !important;
    z-index:500 !important;

    flex-shrink:0 !important;
}

#closeTemplate,
#closePanelChooser,
#closeNpcLibrary,
#closeMonsterLibrary,
#closeEncounterBuilder,
#closeMapLibrary,
#closeCampaignManager,
#closeCampaignNoteWindow,
#closeWorldDatabase,
#closeWorldEntryWindow,
#closeQuestManager,
#closeQuestEditor,
#closeSessionDashboard,
#closeLootManager,
#closeLootEditor,
#closeLootGenerator,
#closeSpellbook,
#closeCustomSpell{
    position:relative !important;
    z-index:520 !important;
    flex-shrink:0 !important;
}

.encounterBuilderBox{
    height:auto !important;
    min-height:0 !important;
}

.encounterBuilderLayout{
    min-height:0 !important;
    overflow-y:auto !important;
}

@media(max-width:1180px){
    :root{
        --header-height:132px;
    }
}

@media(max-width:760px){
    :root{
        --header-height:178px;
    }

    #templateWindow,
    #panelChooserWindow,
    #npcLibraryWindow,
    #monsterLibraryWindow,
    #encounterBuilderWindow,
    #mapLibraryWindow,
    #campaignManagerWindow,
    #campaignNoteWindow,
    #worldDatabaseWindow,
    #worldEntryWindow,
    #questManagerWindow,
    #questEditorWindow,
    #sessionDashboardWindow,
    #lootManagerWindow,
    #lootEditorWindow,
    #lootGeneratorWindow,
    #spellbookWindow,
    #customSpellWindow{
        padding:7px !important;
    }
}

:root{--real-header-height:76px}

#floatingToolDock{
    position:fixed;right:18px;bottom:18px;z-index:24000;
    display:flex;flex-direction:column;gap:8px;
}

#floatingToolDock button{
    width:74px;min-height:54px;display:flex;flex-direction:column;
    align-items:center;justify-content:center;gap:2px;
    border:1px solid var(--gold);border-radius:8px;
    background:linear-gradient(180deg,#395c46,#20382a);color:white;
    box-shadow:0 8px 22px rgba(0,0,0,.46);font-size:20px;cursor:pointer;
}

#floatingToolDock button span{font-size:11px;font-weight:850}

#floatingToolDock button:hover{filter:brightness(1.16);transform:translateY(-2px)}

#quickDiceWindow{
    position:fixed;
    inset:var(--real-header-height) 0 0;
    z-index:52000;
    display:grid;
    place-items:center;
    padding:10px;
    overflow:hidden;
    background:rgba(7,5,4,.20);
    backdrop-filter:none;
}
#quickDiceWindow.hidden{display:none}

.quickDiceBox{
    position:relative;
    width:min(1080px,96vw);
    aspect-ratio:4 / 3;
    max-height:calc(100vh - var(--real-header-height) - 18px);
    border:0;
    background:transparent;
    box-shadow:none;
    overflow:visible;
    color:#f7e7c9;
    filter:drop-shadow(0 26px 34px rgba(0,0,0,.72));
}
.diceScreenReaderTitle{
    position:absolute!important;
    width:1px!important;height:1px!important;
    overflow:hidden!important;
    clip:rect(0,0,0,0)!important;
    white-space:nowrap!important;
}
.diceRollTray{
    position:absolute;
    inset:0;
    overflow:visible;
    background:transparent;
    isolation:isolate;
}
#dice3dCanvas{
    position:absolute;
    inset:0;
    z-index:1;
    width:100%;
    height:100%;
    display:block;
    background:transparent;
    touch-action:none;
}
.diceTrayClose{
    position:absolute;
    right:5.1%;
    top:4.2%;
    z-index:30;
    width:34px;
    height:34px;
    display:grid;
    place-items:center;
    border:1px solid #716552;
    border-radius:50%;
    background:radial-gradient(circle at 35% 30%,#8b8172 0,#48413a 38%,#1f1c1a 100%);
    color:#fff5df;
    font-size:17px;
    cursor:pointer;
    box-shadow:inset 0 1px 1px rgba(255,255,255,.34),0 4px 9px rgba(0,0,0,.5);
}
.diceTrayClose:hover{filter:brightness(1.18);transform:scale(1.06)}

.dicePickerPanel{
    position:absolute;
    left:8.8%;
    right:8.8%;
    top:5.8%;
    height:19.2%;
    z-index:15;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0 4.5%;
    pointer-events:none;
}
.dicePickerHeading{
    position:absolute!important;
    width:1px!important;height:1px!important;
    overflow:hidden!important;
    clip:rect(0,0,0,0)!important;
}
.quickDiceGrid{
    width:100%;
    display:grid;
    grid-template-columns:repeat(7,minmax(0,1fr));
    align-items:center;
    gap:clamp(5px,1.2vw,15px);
    padding:0;
    pointer-events:auto;
}
.quickDiceGrid button{
    position:relative;
    min-width:0;
    min-height:76px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:3px;
    border:0;
    background:transparent;
    color:#f4dfb9;
    text-shadow:0 2px 3px rgba(0,0,0,.9);
    cursor:pointer;
    transition:transform .16s ease,filter .16s ease;
}
.quickDiceGrid button:hover,.quickDiceGrid button.selected{
    transform:none;
    filter:brightness(1.12);
}
.quickDiceGrid button>span:nth-child(2){
    font-size:10px;
    font-weight:950;
    letter-spacing:.09em;
    text-transform:uppercase;
    color:#f7dfb5;
    background:rgba(33,18,10,.46);
    border-radius:4px;
    padding:1px 5px;
    box-shadow:0 1px 3px rgba(0,0,0,.45);
}
.diceCountBadge{
    position:absolute;
    right:8%;
    top:3%;
    min-width:21px;
    height:21px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:0 5px;
    border:1px solid rgba(255,235,194,.55);
    border-radius:50%;
    background:linear-gradient(145deg,#5f5549,#24211e);
    color:#fff4dd;
    font-size:10px;
    box-shadow:0 3px 6px rgba(0,0,0,.5);
}
.quickDiceGrid button:not(.selected) .diceCountBadge{opacity:.38}

.dicePickerMini{
    width:clamp(42px,4.8vw,59px);
    height:clamp(42px,4.8vw,59px);
    display:block;
    visibility:hidden;
    opacity:0;
    pointer-events:none;
}
.quickDiceGrid button:hover .dicePickerMini{transform:none}
.dice3dShape4,.dice3dShape6,.dice3dShape8,.dice3dShape10,.dice3dShape12,.dice3dShape20,.dice3dShape100{clip-path:none}

.dicePickerMini{
    visibility:visible!important;
    opacity:1!important;
    display:grid!important;
    place-items:center;
    border:1px solid rgba(247,223,154,.82);
    color:#fff8dc;
    font:900 15px/1 Georgia,serif;
    text-shadow:0 2px 3px rgba(0,0,0,.75);
    background:
        linear-gradient(145deg,rgba(102,177,231,.95),rgba(43,105,167,.98) 48%,rgba(22,59,108,.98));
    box-shadow:
        inset 6px 7px 10px rgba(255,255,255,.18),
        inset -7px -8px 12px rgba(0,0,0,.35),
        0 8px 16px rgba(0,0,0,.42);
    transform:rotateX(18deg) rotateY(-18deg);
    transform-style:preserve-3d;
    transition:transform .28s ease,filter .18s ease,box-shadow .18s ease;
}

.quickDiceGrid button:hover .dicePickerMini,
.quickDiceGrid button.selected .dicePickerMini{
    filter:brightness(1.15) saturate(1.1);
    animation:diceMiniSpin 4.4s linear infinite;
}

.dice3dShape4{clip-path:polygon(50% 4%,96% 88%,4% 88%)!important}
.dice3dShape6{border-radius:9px!important}
.dice3dShape8{clip-path:polygon(50% 2%,94% 50%,50% 98%,6% 50%)!important}
.dice3dShape10,.dice3dShape100{clip-path:polygon(50% 2%,94% 30%,82% 92%,18% 92%,6% 30%)!important}
.dice3dShape12{clip-path:polygon(50% 2%,86% 18%,98% 56%,72% 96%,28% 96%,2% 56%,14% 18%)!important}
.dice3dShape20{clip-path:polygon(50% 2%,83% 13%,98% 45%,88% 78%,50% 98%,12% 78%,2% 45%,17% 13%)!important}

@keyframes diceMiniSpin{
    from{transform:rotateX(18deg) rotateY(-18deg) rotateZ(0deg)}
    to{transform:rotateX(18deg) rotateY(342deg) rotateZ(360deg)}
}

.quickDiceGrid button::before{
    content:"";
    position:absolute;
    left:14%;right:14%;top:8%;bottom:23%;
    border-radius:50%;
    border:1px solid transparent;
    background:radial-gradient(circle,rgba(255,226,165,.10),transparent 68%);
    opacity:0;
    transition:opacity .15s ease,border-color .15s ease;
    pointer-events:none;
}
.quickDiceGrid button:hover::before,.quickDiceGrid button.selected::before{
    opacity:1;
    border-color:rgba(255,220,151,.38);
}

.diceControlBar{
    position:absolute;
    z-index:18;
    left:10.8%;
    right:10.8%;
    bottom:4.0%;
    display:grid;
    grid-template-columns:90px minmax(145px,1fr) auto auto auto;
    gap:7px;
    align-items:end;
    padding:8px 10px;
    border:1px solid rgba(169,139,91,.7);
    border-radius:8px;
    background:
        linear-gradient(180deg,rgba(54,43,33,.94),rgba(22,19,17,.96));
    box-shadow:inset 0 1px rgba(255,255,255,.12),0 5px 12px rgba(0,0,0,.5);
}
.diceControlBar label{display:flex;flex-direction:column;gap:3px;color:#e2c99f;font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.06em}
.diceControlBar input{
    height:34px;
    min-width:0;
    padding:6px 9px;
    border:1px solid #756550;
    border-radius:6px;
    background:rgba(13,12,11,.82);
    color:#fff1d2;
    outline:none;
    box-shadow:inset 0 2px 5px rgba(0,0,0,.5);
}
.diceControlBar input:focus{border-color:#d0a96e;box-shadow:0 0 0 2px rgba(208,169,110,.18),inset 0 2px 5px rgba(0,0,0,.5)}
.diceControlBar button{height:34px;padding:0 13px;border-radius:6px;font-weight:900;cursor:pointer}
.diceSecondaryAction{border:1px solid #756650;background:linear-gradient(180deg,#51483d,#26221e);color:#f2dfbe}
.dicePrimaryAction{min-width:112px;border:1px solid #d0aa6d;background:linear-gradient(180deg,#9a6b31,#5c3517);color:#fff4dc;box-shadow:0 4px 10px rgba(0,0,0,.38)}
.diceControlBar button:hover{filter:brightness(1.15);transform:translateY(-1px)}

.dice3dStatus{
    position:absolute;
    left:50%;
    top:52%;
    z-index:25;
    transform:translate(-50%,-50%);
    padding:10px 15px;
    border:1px solid #c09b68;
    border-radius:7px;
    background:rgba(34,25,19,.94);
    color:#fff0d2;
    font-weight:850;
    box-shadow:0 8px 20px rgba(0,0,0,.5);
}
.dice3dStatus.hidden{display:none}
.diceTrayEmpty{
    position:absolute;
    left:18%;
    right:18%;
    top:42%;
    z-index:9;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:5px;
    color:#f0c9cf;
    text-align:center;
    pointer-events:none;
    text-shadow:0 2px 5px rgba(0,0,0,.9);
}
.diceTrayEmpty.hidden{display:none}
.diceTrayEmpty strong{font-family:Georgia,"Times New Roman",serif;font-size:18px;color:#ffe8e8}
.diceTrayEmpty small{font-size:12px;color:#d9aeb5}
.diceTrayResult{
    position:absolute;
    z-index:16;
    left:50%;
    bottom:12.2%;
    transform:translateX(-50%);
    min-width:min(520px,65%);
    display:grid;
    grid-template-columns:auto auto minmax(130px,1fr);
    align-items:center;
    gap:10px;
    padding:8px 14px;
    border:1px solid rgba(221,181,117,.62);
    border-radius:8px;
    background:linear-gradient(180deg,rgba(52,37,27,.90),rgba(22,17,14,.94));
    box-shadow:inset 0 1px rgba(255,255,255,.11),0 5px 13px rgba(0,0,0,.48);
    pointer-events:none;
}
.diceTrayResult span{color:#d8bb8d;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.1em}
.diceTrayResult strong{color:#fff2d3;font-family:Georgia,"Times New Roman",serif;font-size:36px;line-height:1;text-align:center;text-shadow:0 3px 9px rgba(0,0,0,.6)}
.diceTrayResult small{color:#e3ccb0;line-height:1.3;text-align:left;font-size:11px}

@media (max-width:760px){
    #quickDiceWindow{padding:4px;place-items:start center;overflow:auto}
    .quickDiceBox{width:100%;margin-top:4px;aspect-ratio:1 / 1.12;max-height:none}
    .dicePickerPanel{left:6%;right:6%;top:6.2%;padding:0 1.5%;height:18%}
    .quickDiceGrid{gap:3px}
    .quickDiceGrid button{min-height:62px}
    .dicePickerMini{width:36px;height:36px;font-size:12px}
    .diceCountBadge{right:0;top:0;min-width:18px;height:18px;font-size:9px}
    .diceControlBar{left:6%;right:6%;bottom:3%;grid-template-columns:72px 1fr auto auto;padding:6px}
    .diceFormulaControl{grid-column:2/4}
    .dicePrimaryAction{grid-column:1/-1}
    .diceTrayResult{bottom:18%;min-width:76%;grid-template-columns:auto auto;gap:7px;padding:7px 10px}
    .diceTrayResult small{grid-column:1/-1;text-align:center}
}
@media (max-width:470px){
    .quickDiceBox{aspect-ratio:.82 / 1}
    .dicePickerPanel{top:6%;left:4%;right:4%}
    .quickDiceGrid{grid-template-columns:repeat(7,1fr);gap:1px}
    .quickDiceGrid button>span:nth-child(2){font-size:8px}
    .dicePickerMini{width:30px;height:30px;font-size:10px}
    .diceControlBar{left:4%;right:4%;grid-template-columns:64px 1fr auto;gap:4px}
    .diceFormulaControl{display:none!important}
    #loadQuickDiceExpression{display:none}
    .diceControlBar button{padding:0 8px}
    .dicePrimaryAction{grid-column:auto;min-width:76px}
    .diceTrayResult{bottom:16.5%;min-width:84%}
    .diceTrayResult strong{font-size:31px}
}
@media (prefers-reduced-motion:reduce){
    .quickDiceGrid button,.dicePickerMini,.diceTrayClose,.diceControlBar button{transition:none!important}
}
.copiedReferenceBlock{
    margin:20px 0;padding:18px;border:4px double #85683b;
    background:radial-gradient(circle at top left,rgba(255,255,255,.42),transparent 32%),linear-gradient(180deg,#f3e6c1,#dfc995);
    color:#342417;box-shadow:0 9px 20px rgba(67,43,20,.23),inset 0 0 28px rgba(100,66,28,.12);user-select:text;
}

.copiedReferenceHeader{display:flex;align-items:flex-start;gap:14px;padding-bottom:13px;border-bottom:3px double #8d7040}

.copiedReferenceIcon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;border:1px solid #8d7040;border-radius:50%;background:rgba(255,255,255,.28);font-size:25px}

.copiedReferenceHeader small{color:#82683c;font-weight:900;letter-spacing:.8px;text-transform:uppercase}

.copiedReferenceHeader h2{margin:3px 0;color:#5d2c1d;font-family:Georgia,"Times New Roman",serif}

.copiedReferenceHeader p{color:#735c41;font-style:italic}

.copiedReferenceFacts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px}

.copiedReferenceFact{padding:9px;border:1px solid rgba(117,82,39,.34);background:rgba(255,255,255,.27)}

.copiedReferenceFact strong{display:block;margin-bottom:3px;color:#69351f;font-size:10px;text-transform:uppercase}

.copiedReferenceText{margin-top:15px}

.copiedReferenceText>strong{display:block;margin-bottom:5px;padding-bottom:4px;border-bottom:1px solid #a18450;color:#65331f}

.copiedReferenceText p{line-height:1.55}

.copiedReferenceNotes{padding:10px;border-left:4px solid #826436;background:rgba(115,80,37,.08)}

.npcLibraryCardActions{display:grid;grid-template-columns:1fr 1fr;gap:8px}

.npcLibraryCopyToNoteBtn,.monsterLibraryCopyToNoteBtn,#copyWorldEntryToNoteBtn{
    min-height:39px;border:1px solid #8a7043;background:linear-gradient(180deg,#5d7042,#3b4c28);color:white;font-weight:850;cursor:pointer;
}

#templateWindow,#panelChooserWindow,#npcLibraryWindow,#monsterLibraryWindow,
#encounterBuilderWindow,#mapLibraryWindow,#campaignManagerWindow,#campaignNoteWindow,
#worldDatabaseWindow,#worldEntryWindow,#questManagerWindow,#questEditorWindow,
#sessionDashboardWindow,#lootManagerWindow,#lootEditorWindow,#lootGeneratorWindow,
#spellbookWindow,#customSpellWindow{
    position:fixed !important;
    inset:var(--real-header-height) 0 0 0 !important;
    padding:14px 18px 22px !important;
    align-items:flex-start !important;
    overflow-y:auto !important;
    z-index:50000 !important;
}

.templateBox,.panelChooserBox,.npcLibraryBox,.monsterLibraryBox,.encounterBuilderBox,
.mapLibraryBox,.campaignManagerBox,.campaignNoteBook,.worldDatabaseBox,.worldEntryBook,
.questManagerBox,.questEditorBook,.sessionDashboardBox,.lootManagerBox,.lootEditorBook,
.lootGeneratorBox,.spellbookBox,.customSpellBook{
    max-height:calc(100vh - var(--real-header-height) - 36px) !important;
    margin:0 auto !important;
}

#closeTemplate,#closePanelChooser,#closeNpcLibrary,#closeMonsterLibrary,#closeEncounterBuilder,
#closeMapLibrary,#closeCampaignManager,#closeCampaignNoteWindow,#closeWorldDatabase,
#closeWorldEntryWindow,#closeQuestManager,#closeQuestEditor,#closeSessionDashboard,
#closeLootManager,#closeLootEditor,#closeLootGenerator,#closeSpellbook,#closeCustomSpell{
    position:relative !important;z-index:50500 !important;opacity:1 !important;
    visibility:visible !important;pointer-events:auto !important;flex-shrink:0 !important;
}

#editorHeader{z-index:9000 !important}

#homeGrid,#editor,.sessionDashboardContent{padding-bottom:105px !important}

@media(max-width:760px){
    #floatingToolDock{right:9px;bottom:9px}
    #floatingToolDock button{width:59px;min-height:49px}
    #quickDiceWindow{padding:8px;align-items:center;justify-content:center}
    .copiedReferenceFacts,.npcLibraryCardActions{grid-template-columns:1fr}
}

#dataManagerWindow,
#campaignProfileEditorWindow{
    position:fixed;
    inset:var(--real-header-height) 0 0;

    display:flex;
    align-items:flex-start;
    justify-content:center;

    padding:14px 18px 22px;

    overflow-y:auto;

    background:rgba(4,8,5,.88);

    z-index:56000;
}

#dataManagerWindow.hidden,
#campaignProfileEditorWindow.hidden{
    display:none;
}

.dataManagerBox{
    width:min(1050px,96vw);
    max-height:calc(100vh - var(--real-header-height) - 36px);

    display:flex;
    flex-direction:column;

    overflow:hidden;

    border:1px solid var(--gold);
    border-radius:8px;

    background:
        linear-gradient(
            180deg,
            #19281f,
            #0d1611
        );

    box-shadow:
        0 0 0 3px #08100b,
        0 0 0 4px rgba(189,162,103,.38),
        0 30px 90px rgba(0,0,0,.78);
}

.dataManagerHeader,
.campaignProfileEditorHeader{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:18px;

    flex-shrink:0;

    padding:19px 22px;

    border-bottom:1px solid rgba(189,162,103,.7);

    background:
        linear-gradient(
            180deg,
            #2b4334,
            #17251c
        );
}

.dataManagerHeader h2,
.campaignProfileEditorHeader h2{
    margin:0;

    color:var(--gold-light);

    font-family:Georgia,"Times New Roman",serif;
    font-size:29px;
}

.dataManagerHeader p,
.campaignProfileEditorHeader p{
    margin-top:5px;

    color:#bec9c0;
    font-style:italic;
}

#closeDataManager,
#closeCampaignProfileEditor{
    width:39px;
    height:39px;

    flex-shrink:0;

    border:1px solid rgba(219,196,135,.7);
    border-radius:50%;

    background:
        linear-gradient(
            180deg,
            #824238,
            #582821
        );

    color:white;

    font-size:18px;
    font-weight:900;
    cursor:pointer;
}

.dataManagerContent{
    display:flex;
    flex-direction:column;
    gap:22px;

    min-height:0;

    padding:21px;

    overflow-y:auto;
}

.dataManagerSection{
    overflow:hidden;

    border:1px solid rgba(189,162,103,.48);

    background:
        linear-gradient(
            180deg,
            #203128,
            #142119
        );
}

.dataManagerSectionHeader{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:15px;

    padding:15px 18px;

    border-bottom:1px solid rgba(189,162,103,.42);
}

.dataManagerSectionHeader span{
    color:#aebdb1;

    font-size:10px;
    font-weight:900;
    letter-spacing:1px;
    text-transform:uppercase;
}

.dataManagerSectionHeader h3{
    margin-top:3px;

    color:var(--gold-light);

    font-family:Georgia,"Times New Roman",serif;
    font-size:24px;
}

#newCampaignProfileBtn{
    min-height:41px;

    padding:8px 14px;

    border:1px solid var(--gold);
    border-radius:4px;

    background:
        linear-gradient(
            180deg,
            #4f785a,
            #2b4937
        );

    color:white;

    font-weight:900;
    cursor:pointer;
}

#campaignProfileList{
    display:flex;
    flex-direction:column;
    gap:10px;

    padding:14px;
}

.campaignProfileCard{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:18px;

    padding:14px;

    border:1px solid rgba(189,162,103,.34);

    background:
        linear-gradient(
            180deg,
            #293d31,
            #1b2b22
        );
}

.campaignProfileCard.active{
    border-color:var(--gold-light);

    background:
        radial-gradient(
            circle at top left,
            rgba(104,151,115,.24),
            transparent 42%
        ),
        linear-gradient(
            180deg,
            #34513e,
            #22372a
        );

    box-shadow:
        inset 4px 0 0 var(--gold-light);
}

.campaignProfileIdentity{
    display:flex;
    align-items:center;
    gap:13px;

    min-width:0;
}

.campaignProfileIcon{
    width:45px;
    height:45px;

    display:flex;
    align-items:center;
    justify-content:center;

    flex-shrink:0;

    border:1px solid rgba(189,162,103,.62);
    border-radius:50%;

    background:#111b15;

    font-size:22px;
}

.campaignProfileIdentity small{
    color:var(--gold);

    font-size:10px;
    font-weight:900;
    letter-spacing:.9px;
}

.campaignProfileIdentity h4{
    margin:3px 0;

    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;

    color:#f0eee7;

    font-family:Georgia,"Times New Roman",serif;
    font-size:20px;
}

.campaignProfileIdentity p{
    color:#aebbb1;
    font-size:12px;
}

.campaignProfileActions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    flex-wrap:wrap;
    gap:7px;
}

.campaignProfileActions button,
.activeCampaignBadge{
    min-height:36px;

    padding:7px 11px;

    border:1px solid rgba(189,162,103,.55);
    border-radius:4px;

    font-weight:850;
}

.switchCampaignProfileBtn{
    background:#416b4e;
    color:white;
    cursor:pointer;
}

.renameCampaignProfileBtn{
    background:#46564a;
    color:white;
    cursor:pointer;
}

.deleteCampaignProfileBtn{
    background:#78342d;
    color:white;
    cursor:pointer;
}

.activeCampaignBadge{
    display:inline-flex;
    align-items:center;

    background:#756332;
    color:#fff2c7;
}

.backupActionGrid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;

    padding:16px;
}

.backupActionGrid article{
    display:flex;
    flex-direction:column;
    gap:9px;

    padding:17px;

    border:1px solid #8a7043;

    background:
        radial-gradient(
            circle at top left,
            rgba(255,255,255,.33),
            transparent 35%
        ),
        linear-gradient(
            180deg,
            #efe2bd,
            #d5be88
        );

    color:var(--ink);
}

.backupActionGrid strong{
    color:#5d2c1d;

    font-family:Georgia,"Times New Roman",serif;
    font-size:20px;
}

.backupActionGrid p{
    flex:1;

    line-height:1.5;
}

.backupActionGrid button{
    min-height:42px;

    border:1px solid #78623b;

    background:#3d674a;
    color:white;

    font-weight:900;
    cursor:pointer;
}

#chooseBackupFileBtn{
    background:#53667e;
}

.backupWarning{
    margin:0 16px 16px;
    padding:11px 13px;

    border-left:4px solid #b38c4c;

    background:rgba(189,162,103,.1);
    color:#cfcbc0;

    font-size:13px;
}

.campaignProfileEditorBox{
    width:min(520px,94vw);

    overflow:hidden;

    border:1px solid var(--gold);
    border-radius:8px;

    background:
        linear-gradient(
            180deg,
            #1d3025,
            #101a14
        );

    box-shadow:
        0 0 0 3px #08100b,
        0 25px 70px rgba(0,0,0,.75);
}

.campaignProfileEditorBox > label{
    display:flex;
    flex-direction:column;
    gap:7px;

    padding:22px;

    color:var(--gold-light);

    font-weight:850;
}

.campaignProfileEditorBox input{
    min-height:43px;

    padding:9px 11px;

    border:1px solid rgba(189,162,103,.68);
    border-radius:4px;

    background:#efe4c6;
    color:var(--ink);
}

.campaignProfileEditorActions{
    display:flex;
    justify-content:flex-end;
    gap:9px;

    padding:0 22px 22px;
}

.campaignProfileEditorActions button{
    min-height:41px;

    padding:8px 15px;

    border:1px solid var(--gold);

    font-weight:900;
    cursor:pointer;
}

#cancelCampaignProfileBtn{
    background:#394a3f;
    color:white;
}

#saveCampaignProfileBtn{
    background:#4a7557;
    color:white;
}

/* =========================================================
   v52 — campaign-specific saves
   ========================================================= */
.dataManagerTabs{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    flex-shrink:0;
    padding:10px 14px;
    border-bottom:1px solid rgba(189,162,103,.45);
    background:#101a14;
}
.dataManagerTabs button{
    min-height:39px;
    padding:8px 15px;
    border:1px solid rgba(189,162,103,.46);
    border-radius:4px;
    background:#263a2d;
    color:#d9e2db;
    font-weight:850;
    cursor:pointer;
}
.dataManagerTabs button:hover,
.dataManagerTabs button.active{
    border-color:var(--gold-light);
    background:linear-gradient(180deg,#4c7256,#2b4937);
    color:white;
}
.campaignManagerPrimaryActions{
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:8px;
}
#saveActiveCampaignNowBtn{
    min-height:41px;
    padding:8px 14px;
    border:1px solid rgba(189,162,103,.7);
    border-radius:4px;
    background:linear-gradient(180deg,#4f596f,#31394b);
    color:white;
    font-weight:900;
    cursor:pointer;
}
.campaignAutosaveNotice{
    display:flex;
    align-items:center;
    gap:8px;
    margin:0;
    padding:10px 17px;
    border-bottom:1px solid rgba(189,162,103,.2);
    background:rgba(79,120,90,.12);
    color:#b9c8bd;
    font-size:12px;
}
.campaignAutosaveNotice span{color:#72b480;font-size:10px}
.campaignProfileStats{
    display:flex;
    flex-wrap:wrap;
    gap:5px;
    margin-top:7px;
}
.campaignProfileStats span{
    padding:3px 6px;
    border:1px solid rgba(189,162,103,.26);
    border-radius:999px;
    background:rgba(4,10,7,.3);
    color:#c6d0c8;
    font-size:10px;
    white-space:nowrap;
}
.saveCampaignProfileNowBtn{
    background:#53667e;
    color:white;
    cursor:pointer;
}
.dataManagerSection.hidden{display:none!important}

@media(max-width:760px){
    .dataManagerTabs{display:grid;grid-template-columns:1fr 1fr;padding:8px}
    .dataManagerTabs button{min-width:0;padding:7px 4px;font-size:11px}
    .campaignManagerPrimaryActions{width:100%;justify-content:stretch}
    .campaignManagerPrimaryActions button{flex:1}
    .campaignProfileCard{
        align-items:flex-start;
        flex-direction:column;
    }

    .campaignProfileActions{
        width:100%;
        justify-content:stretch;
    }

    .campaignProfileActions button,
    .activeCampaignBadge{
        flex:1;
        justify-content:center;
        text-align:center;
    }

    .backupActionGrid{
        grid-template-columns:1fr;
    }
}

#adventureBuilderWindow,#adventureNodeEditorWindow{position:fixed;inset:var(--real-header-height) 0 0;display:flex;align-items:flex-start;justify-content:center;padding:14px 18px 22px;overflow:auto;background:rgba(4,8,5,.9);z-index:55500}

#adventureBuilderWindow.hidden,#adventureNodeEditorWindow.hidden{display:none}

.adventureBuilderBox{width:min(1500px,98vw);height:calc(100vh - var(--real-header-height) - 34px);min-height:600px;display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--gold);border-radius:8px;background:linear-gradient(180deg,#17261d,#0b130e);box-shadow:0 0 0 3px #07100a,0 0 0 4px rgba(189,162,103,.38),0 30px 90px rgba(0,0,0,.8)}

.adventureBuilderHeader,.adventureNodeEditorHeader{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;flex-shrink:0;padding:17px 21px;border-bottom:1px solid rgba(189,162,103,.7);background:linear-gradient(180deg,#2b4334,#17251c)}

.adventureBuilderHeader h2,.adventureNodeEditorHeader h2{margin:0;color:var(--gold-light);font-family:Georgia,"Times New Roman",serif;font-size:29px}

.adventureBuilderHeader p,.adventureNodeEditorHeader p{margin-top:4px;color:#bec9c0;font-style:italic}

#closeAdventureBuilder,#closeAdventureNodeEditor{width:39px;height:39px;flex-shrink:0;border:1px solid rgba(219,196,135,.7);border-radius:50%;background:linear-gradient(180deg,#824238,#582821);color:white;font-size:18px;font-weight:900;cursor:pointer}

.adventureBuilderToolbar{display:flex;align-items:center;flex-wrap:wrap;gap:7px;flex-shrink:0;padding:10px 13px;border-bottom:1px solid rgba(189,162,103,.35);background:#142119}

.adventureBuilderToolbar button,.adventureBuilderToolbar select{min-height:38px;padding:7px 10px;border:1px solid rgba(189,162,103,.58);border-radius:4px;background:linear-gradient(180deg,#3f644a,#263f30);color:white;font-weight:800;cursor:pointer}

.adventureBuilderToolbar select{background:#efe4c6;color:var(--ink)}

.adventureBuilderToolbar button:hover,.adventureBuilderToolbar button.active{filter:brightness(1.18);border-color:var(--gold-light)}

#deleteAdventureBtn,#deleteAdventureSelectionBtn{background:linear-gradient(180deg,#884239,#612a24)}

.adventureToolbarDivider{width:1px;height:27px;background:rgba(189,162,103,.4);margin:0 3px}

#adventureZoomLabel{min-width:48px;color:var(--gold-light);font-size:12px;text-align:center;font-weight:900}

#adventureBuilderStatus{flex-shrink:0;padding:8px 14px;border-bottom:1px solid rgba(189,162,103,.25);background:#1b2b22;color:#b9c5bb;font-size:12px}

#adventureCanvasViewport{position:relative;flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;background-color:#101914;background-image:linear-gradient(rgba(189,162,103,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(189,162,103,.08) 1px,transparent 1px),linear-gradient(rgba(189,162,103,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(189,162,103,.035) 1px,transparent 1px);background-size:100px 100px,100px 100px,20px 20px,20px 20px}

#adventureCanvasStage{position:relative;min-width:1600px;min-height:1000px}

#adventureConnectionLayer,#adventureNodeLayer{position:absolute;inset:0}

#adventureConnectionLayer{overflow:visible;pointer-events:none}

#adventureConnectionLayer path{pointer-events:stroke}

.adventureConnection{fill:none;stroke:#8daf94;stroke-width:4;opacity:.78;cursor:pointer}

.adventureConnection:hover,.adventureConnection.selected{stroke:var(--gold-light);stroke-width:7;opacity:1}

.adventureConnection+marker path,#adventureArrow path{fill:#8daf94}

.adventureNode{position:absolute;width:250px;min-height:136px;padding:13px;border:1px solid var(--node-accent,#8daf94);border-radius:7px;background:radial-gradient(circle at top left,color-mix(in srgb,var(--node-accent,#8daf94) 25%,transparent),transparent 45%),linear-gradient(145deg,#263d30,#17261d);color:white;box-shadow:0 0 0 3px #0a120d,0 10px 22px rgba(0,0,0,.48);cursor:grab;user-select:none;touch-action:none}

.adventureNode.dragging{cursor:grabbing;opacity:.9;z-index:50}

.adventureNode.selected{box-shadow:0 0 0 3px #0a120d,0 0 0 6px var(--gold-light),0 15px 28px rgba(0,0,0,.6);z-index:10}

.adventureNode.connectionSource{animation:adventurePulse 1s infinite alternate}

@keyframes adventurePulse{to{box-shadow:0 0 0 3px #0a120d,0 0 0 8px #7fc691,0 0 30px rgba(127,198,145,.65)}}

.adventureNodeTop{display:flex;align-items:center;gap:8px;padding-bottom:8px;border-bottom:1px solid rgba(189,162,103,.35)}

.adventureNodeTop span{font-size:20px}

.adventureNodeTop small{color:var(--gold-light);font-weight:900;letter-spacing:.7px;text-transform:uppercase}

.adventureNode h3{margin:10px 0 6px;color:#f4f0e7;font-family:Georgia,"Times New Roman",serif;font-size:20px}

.adventureNode p{display:-webkit-box;overflow:hidden;color:#bec9c0;font-size:13px;line-height:1.4;-webkit-box-orient:vertical;-webkit-line-clamp:3}

.adventureNode-start{--node-accent:#79b788}

.adventureNode-end{--node-accent:#b85d52}

.adventureNode-choice{--node-accent:#c5a95d}

.adventureNode-encounter{--node-accent:#b96658}

.adventureNode-npc{--node-accent:#8d78b5}

.adventureNode-location{--node-accent:#5f91a5}

.adventureNode-loot{--node-accent:#bd9d50}

.adventureNode-note{--node-accent:#9b8a68}

.adventureNodePorts i{position:absolute;top:62px;width:12px;height:12px;border:2px solid var(--gold-light);border-radius:50%;background:#142119}

.adventureNodePorts i:first-child{left:-7px}

.adventureNodePorts i:last-child{right:-7px}

.adventureNodeEditorBook{width:min(760px,95vw);max-height:calc(100vh - var(--real-header-height) - 36px);display:flex;flex-direction:column;overflow:hidden;border:4px double #806437;border-radius:8px;background:linear-gradient(180deg,var(--parchment-light),var(--parchment));color:var(--ink);box-shadow:0 28px 80px rgba(0,0,0,.75)}

.adventureNodeEditorForm{display:grid;grid-template-columns:1fr 210px;gap:14px;min-height:0;padding:20px;overflow:auto}

.adventureNodeEditorForm label{display:flex;flex-direction:column;gap:6px;color:#62321e;font-weight:850}

.adventureNodeEditorForm input,.adventureNodeEditorForm select,.adventureNodeEditorForm textarea{width:100%;padding:9px 10px;border:1px solid #9a7641;background:rgba(255,250,232,.84);color:var(--ink);font:inherit}

.adventureNodeEditorWide{grid-column:1/-1}

.adventureNodeEditorForm textarea{min-height:110px;resize:vertical;line-height:1.5}

#adventureNodeNotesInput{min-height:230px}

.adventureNodeEditorFooter{display:flex;justify-content:space-between;gap:12px;padding:13px 20px;border-top:3px solid #9a6734}

.adventureNodeEditorFooter>div{display:flex;gap:9px}

.adventureNodeEditorFooter button{min-height:41px;padding:8px 15px;border:1px solid #87532a;font-weight:900;cursor:pointer}

#deleteAdventureNodeBtn{background:#7a332a;color:white}

#cancelAdventureNodeBtn{background:#dbc595;color:#392617}

#saveAdventureNodeBtn{background:#3e674a;color:white}

@media(max-width:900px){.adventureBuilderToolbar{max-height:150px;overflow:auto}.adventureNodeEditorForm{grid-template-columns:1fr}.adventureNodeEditorWide{grid-column:auto}}

.adventureNodeTop{
    display:grid !important;
    grid-template-columns:auto 1fr auto;
    align-items:center;
    gap:8px;
}

.adventureNodeEditBtn{
    min-height:29px;
    padding:4px 9px;

    border:1px solid rgba(189,162,103,.72);
    border-radius:4px;

    background:linear-gradient(180deg,#527d5e,#2d4b38);
    color:white;

    font-size:11px;
    font-weight:900;
    cursor:pointer;

    pointer-events:auto;
}

.adventureNodeEditBtn:hover{
    filter:brightness(1.18);
}

#adventureNodeEditorWindow{
    z-index:61000 !important;
}

.adventureNodeEditorBox{
    position:relative;
    z-index:61010;
}

#lootDatabaseWindow,
#lootDatabaseEditorWindow{
    position:fixed;
    inset:var(--real-header-height) 0 0;

    display:flex;
    align-items:flex-start;
    justify-content:center;

    padding:14px 18px 22px;

    overflow-y:auto;

    background:rgba(4,8,5,.89);

    z-index:57000;
}

#lootDatabaseWindow.hidden,
#lootDatabaseEditorWindow.hidden{
    display:none;
}

.lootDatabaseBox{
    width:min(1420px,97vw);
    max-height:calc(100vh - var(--real-header-height) - 36px);

    display:flex;
    flex-direction:column;

    overflow:hidden;

    border:1px solid var(--gold);
    border-radius:8px;

    background:
        linear-gradient(
            180deg,
            #19291f,
            #0d1611
        );

    box-shadow:
        0 0 0 3px #08100b,
        0 0 0 4px rgba(189,162,103,.38),
        0 30px 90px rgba(0,0,0,.8);
}

.lootDatabaseHeader,
.lootDatabaseEditorHeader{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:18px;

    flex-shrink:0;

    padding:19px 22px;

    border-bottom:1px solid rgba(189,162,103,.7);

    background:
        linear-gradient(
            180deg,
            #2e4636,
            #18271e
        );
}

.lootDatabaseHeader h2,
.lootDatabaseEditorHeader h2{
    margin:0;

    color:var(--gold-light);

    font-family:Georgia,"Times New Roman",serif;
    font-size:29px;
}

.lootDatabaseHeader p,
.lootDatabaseEditorHeader p{
    margin-top:5px;

    color:#bdc9bf;
    font-style:italic;
}

#closeLootDatabase,
#closeLootDatabaseEditor{
    width:39px;
    height:39px;

    flex-shrink:0;

    border:1px solid rgba(219,196,135,.7);
    border-radius:50%;

    background:
        linear-gradient(
            180deg,
            #824238,
            #582821
        );

    color:white;

    font-size:18px;
    font-weight:900;
    cursor:pointer;
}

.lootDatabaseToolbar{
    display:grid;
    grid-template-columns:minmax(230px,1fr) 175px 160px repeat(3,auto);
    gap:9px;

    flex-shrink:0;

    padding:14px 17px;

    border-bottom:1px solid rgba(189,162,103,.28);

    background:#121e17;
}

.lootDatabaseToolbar input,
.lootDatabaseToolbar select{
    min-height:42px;

    padding:8px 10px;

    border:1px solid rgba(189,162,103,.65);
    border-radius:4px;

    background:#efe4c6;
    color:var(--ink);
}

.lootDatabaseToolbar button,
#lootDatabaseBtn{
    min-height:42px;

    padding:8px 13px;

    border:1px solid var(--gold);
    border-radius:4px;

    background:
        linear-gradient(
            180deg,
            #4c7558,
            #294837
        );

    color:white;

    font-weight:850;
    cursor:pointer;
}

#lootDatabaseBtn{
    background:
        linear-gradient(
            180deg,
            #536b82,
            #32495d
        );
}

#exportLootDatabaseBtn{
    background:
        linear-gradient(
            180deg,
            #665f3c,
            #403b23
        );
}

.lootDatabaseStatus{
    display:flex;
    justify-content:space-between;
    gap:15px;

    padding:10px 18px;

    border-bottom:1px solid rgba(189,162,103,.22);

    background:#17231b;
    color:#b9c5bb;

    font-size:13px;
}

#lootDatabaseList{
    display:grid;
    grid-template-columns:
        repeat(
            auto-fill,
            minmax(310px,1fr)
        );

    gap:14px;

    min-height:0;

    padding:18px 19px 35px;

    overflow-y:auto;
}

.lootDatabaseCard{
    display:flex;
    flex-direction:column;
    gap:12px;

    min-height:230px;

    padding:16px;

    border:1px solid #8d7144;

    background:
        radial-gradient(
            circle at top left,
            rgba(255,255,255,.32),
            transparent 35%
        ),
        linear-gradient(
            180deg,
            #efe2bd,
            #d5be88
        );

    color:var(--ink);

    box-shadow:
        0 8px 18px rgba(0,0,0,.3);

    transition:
        transform .15s,
        box-shadow .15s;
}

.lootDatabaseCard:hover{
    transform:translateY(-3px);

    box-shadow:
        0 14px 26px rgba(0,0,0,.38);
}

.lootDatabaseCardHeader{
    display:flex;
    justify-content:space-between;
    gap:13px;
}

.lootDatabaseCardHeader span{
    color:#80683b;

    font-size:10px;
    font-weight:900;
    letter-spacing:.8px;
    text-transform:uppercase;
}

.lootDatabaseCardHeader h3{
    margin:4px 0 3px;

    color:#5d2c1d;

    font-family:Georgia,"Times New Roman",serif;
    font-size:21px;
}

.lootDatabaseCardHeader p{
    color:#715c43;
    font-size:12px;
}

.lootDatabaseCardHeader > strong{
    color:#356044;
    white-space:nowrap;
}

.lootDatabaseCardFacts{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:7px;
}

.lootDatabaseCardFacts span{
    padding:8px;

    border:1px solid rgba(112,78,38,.3);

    background:rgba(255,255,255,.26);
}

.lootDatabaseCardFacts strong{
    display:block;

    margin-bottom:3px;

    color:#6a3520;

    font-size:10px;
    text-transform:uppercase;
}

.lootDatabaseCard > p{
    color:#6d5840;
    line-height:1.4;
}

.lootDatabaseCardFooter{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:10px;

    margin-top:auto;
}

.lootDatabaseCardFooter span{
    color:#745e43;
    font-size:11px;
    font-style:italic;
}

.lootDatabaseCardFooter button{
    min-height:36px;

    padding:7px 13px;

    border:1px solid #79623a;

    background:#3c6449;
    color:white;

    font-weight:850;
    cursor:pointer;
}

.lootDatabaseEmpty{
    grid-column:1 / -1;

    min-height:340px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:9px;

    color:#bdc8bf;
    text-align:center;
}

.lootDatabaseEmpty div{
    font-size:62px;
}

.lootDatabaseEmpty strong{
    color:var(--gold-light);
    font-size:22px;
}

.lootDatabaseEditorBook{
    width:min(850px,96vw);
    max-height:calc(100vh - var(--real-header-height) - 36px);

    display:flex;
    flex-direction:column;

    overflow:hidden;

    border:4px double #806437;
    border-radius:8px;

    background:
        radial-gradient(
            circle at top left,
            rgba(255,255,255,.4),
            transparent 30%
        ),
        linear-gradient(
            180deg,
            var(--parchment-light),
            var(--parchment)
        );

    color:var(--ink);

    box-shadow:
        0 28px 80px rgba(0,0,0,.76);
}

.lootDatabaseEditorForm{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:14px;

    min-height:0;

    padding:21px 22px;

    overflow-y:auto;
}

.lootDatabaseEditorForm label{
    display:flex;
    flex-direction:column;
    gap:6px;

    color:#62321e;

    font-weight:850;
}

.lootDatabaseEditorForm input,
.lootDatabaseEditorForm select,
.lootDatabaseEditorForm textarea{
    width:100%;

    padding:9px 10px;

    border:1px solid #9a7641;
    border-radius:4px;

    background:rgba(255,250,232,.84);
    color:var(--ink);

    font:inherit;
}

.lootDatabaseEditorWide{
    grid-column:1 / -1;
}

.lootDatabaseEditorWide textarea{
    min-height:140px;
    resize:vertical;
}

.lootDatabaseEditorFooter{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;

    flex-shrink:0;

    padding:14px 22px;

    border-top:3px solid #9a6734;
}

.lootDatabaseEditorFooter > div{
    display:flex;
    gap:9px;
}

.lootDatabaseEditorFooter button{
    min-height:41px;

    padding:8px 15px;

    border:1px solid #87532a;

    font-weight:900;
    cursor:pointer;
}

#deleteLootDatabaseItemBtn{
    background:#7a332a;
    color:white;
}

#cancelLootDatabaseItemBtn{
    background:#dbc595;
    color:#392617;
}

#saveLootDatabaseItemBtn{
    background:#3e674a;
    color:white;
}

@media(max-width:1050px){
    .lootDatabaseToolbar{
        grid-template-columns:1fr 1fr 1fr;
    }
}

@media(max-width:700px){
    #lootDatabaseWindow,
    #lootDatabaseEditorWindow{
        padding:7px;
    }

    .lootDatabaseToolbar,
    .lootDatabaseEditorForm{
        grid-template-columns:1fr;
    }

    .lootDatabaseEditorWide{
        grid-column:auto;
    }

    .lootDatabaseStatus,
    .lootDatabaseEditorFooter{
        align-items:stretch;
        flex-direction:column;
    }

    .lootDatabaseEditorFooter > div{
        display:grid;
        grid-template-columns:1fr;
    }
}

.lootManagerToolbar{
    grid-template-columns:
        minmax(220px,1fr)
        190px
        auto
        auto
        auto !important;
}

@media(max-width:980px){
    .lootManagerToolbar{
        grid-template-columns:1fr 1fr !important;
    }
}

#panelSettingsMenu{
    position:fixed !important;
    z-index:999999 !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:stretch !important;
    gap:8px !important;

    width:260px !important;
    max-width:calc(100vw - 20px) !important;
    max-height:calc(100vh - 90px) !important;

    margin:0 !important;
    padding:11px !important;

    overflow-y:auto !important;
    overflow-x:hidden !important;

    border:1px solid var(--gold) !important;
    border-radius:9px !important;

    background:linear-gradient(180deg,#263a2f,#111b16) !important;
    box-shadow:0 18px 45px rgba(0,0,0,.72) !important;

    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
}

#panelSettingsMenu > button,
#panelSettingsMenu > label,
#panelSettingsMenu #renamePanelBtn{
    position:relative !important;

    width:100% !important;
    min-height:44px !important;

    display:flex !important;
    align-items:center !important;
    gap:10px !important;

    flex:0 0 auto !important;

    margin:0 !important;
    padding:9px 11px !important;

    border:1px solid rgba(189,162,103,.3) !important;
    border-radius:6px !important;

    background:#2c4335 !important;
    color:#fff !important;

    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
}

#panelSettingsMenu #renamePanelBtn{
    order:1 !important;
    background:linear-gradient(180deg,#476d52,#294536) !important;
}

#panelColorControl{order:2 !important;}

#panelIconControl{order:3 !important;}

#panelSettingsMenu #resetPanelBtn{order:4 !important;background:#65562f !important;}

#panelSettingsMenu #deletePanelBtn{order:5 !important;background:linear-gradient(180deg,#a8483e,#702b25) !important;}

#panelSettingsMenu #renamePanelBtn:hover{
    background:linear-gradient(180deg,#5b8967,#345844) !important;
}

#panelSettingsMenu::-webkit-scrollbar{width:10px;}

#panelSettingsMenu::-webkit-scrollbar-track{background:#111b16;}

#panelSettingsMenu::-webkit-scrollbar-thumb{background:#567663;border:2px solid #111b16;border-radius:8px;}

#panelSettingsMenu{
    position:fixed !important;
    z-index:2147483647 !important;
    isolation:isolate !important;

    transform:none !important;
    translate:none !important;

    overflow-y:auto !important;
    overscroll-behavior:contain;
}

#panelSettingsMenu > :first-child{
    margin-top:0 !important;
}

#panelSettingsMenu #renamePanelBtn{
    display:flex !important;
    position:relative !important;
    z-index:2 !important;
}

.mapViewerShell{
    display:grid;
    grid-template-columns:300px minmax(0,1fr);

    min-height:0;

    border-top:1px solid rgba(189,162,103,.35);
    border-bottom:1px solid rgba(189,162,103,.35);

    background:#0c1510;
}

.mapViewerShell.mapMarkerSidebarClosed{
    grid-template-columns:0 minmax(0,1fr);
}

.mapMarkerSidebar{
    min-width:0;
    min-height:0;

    display:flex;
    flex-direction:column;

    overflow:hidden;

    border-right:1px solid rgba(189,162,103,.5);

    background:
        linear-gradient(
            180deg,
            #1d3025,
            #101a14
        );

    color:#eef1ec;

    transition:
        width .18s ease,
        opacity .18s ease;
}

.mapMarkerSidebarClosed .mapMarkerSidebar{
    width:0;
    opacity:0;
    pointer-events:none;
    border-right:none;
}

.mapMarkerSidebarHeader{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:12px;

    flex-shrink:0;

    padding:14px 14px 12px;

    border-bottom:1px solid rgba(189,162,103,.42);

    background:
        linear-gradient(
            180deg,
            #2a4233,
            #19291f
        );
}

.mapMarkerSidebarHeader small{
    color:#b6c2b8;

    font-size:9px;
    font-weight:900;
    letter-spacing:1px;
}

.mapMarkerSidebarHeader h3{
    margin-top:3px;

    color:var(--gold-light);

    font-family:Georgia,"Times New Roman",serif;
    font-size:20px;
}

.closeMapMarkerSidebarBtn{
    width:32px;
    height:32px;

    flex-shrink:0;

    border:1px solid rgba(219,196,135,.6);
    border-radius:50%;

    background:#673029;
    color:white;

    font-weight:900;
    cursor:pointer;
}

.mapMarkerSearchLabel{
    display:flex;
    flex-direction:column;
    gap:5px;

    flex-shrink:0;

    padding:12px;

    border-bottom:1px solid rgba(189,162,103,.25);

    color:#d8dfd9;

    font-size:11px;
    font-weight:850;
}

.mapMarkerSearchInput{
    min-height:38px;

    padding:8px 10px;

    border:1px solid rgba(189,162,103,.58);
    border-radius:4px;

    background:#efe4c6 !important;
    color:var(--ink) !important;
}

.mapLayerControls{
    max-height:260px;

    flex-shrink:0;

    padding:8px;

    overflow-y:auto;

    border-bottom:1px solid rgba(189,162,103,.3);
}

.mapLayerRow{
    display:grid;
    grid-template-columns:24px 31px 1fr auto;
    align-items:center;
    gap:7px;

    min-height:36px;

    padding:4px 7px;

    border-radius:4px;

    cursor:pointer;
}

.mapLayerRow:hover{
    background:rgba(111,153,121,.18);
}

.mapLayerRow input{
    width:16px;
    height:16px;
}

.mapLayerIcon,
.mapMarkerListIcon{
    width:28px;
    height:28px;

    display:flex;
    align-items:center;
    justify-content:center;

    border:1px solid
        color-mix(
            in srgb,
            var(--marker-color) 78%,
            var(--gold-light)
        );

    border-radius:50%;

    background:
        color-mix(
            in srgb,
            var(--marker-color) 72%,
            #172019
        );

    box-shadow:
        0 0 10px
        color-mix(
            in srgb,
            var(--marker-color) 32%,
            transparent
        );

    font-size:14px;
}

.mapLayerName{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;

    font-size:12px;
    font-weight:750;
}

.mapLayerCount{
    min-width:25px;

    padding:2px 6px;

    border-radius:20px;

    background:rgba(255,255,255,.09);

    color:#c2ccc4;

    text-align:center;
    font-size:11px;
}

.mapMarkerListHeader{
    display:flex;
    justify-content:space-between;
    align-items:center;

    flex-shrink:0;

    padding:11px 12px;

    color:var(--gold-light);

    font-size:12px;
    text-transform:uppercase;
    letter-spacing:.7px;
}

.mapMarkerListCount{
    min-width:28px;

    padding:3px 7px;

    border-radius:20px;

    background:#324c3a;

    text-align:center;
}

.mapMarkerList{
    display:flex;
    flex-direction:column;
    gap:6px;

    min-height:0;

    padding:0 8px 12px;

    overflow-y:auto;
}

.mapMarkerListItem{
    width:100%;

    display:grid;
    grid-template-columns:32px minmax(0,1fr);
    align-items:center;
    gap:8px;

    min-height:45px;

    padding:6px 8px;

    border:1px solid rgba(189,162,103,.28);
    border-radius:4px;

    background:
        linear-gradient(
            180deg,
            #283b30,
            #19271f
        );

    color:white;

    text-align:left;
    cursor:pointer;
}

.mapMarkerListItem:hover{
    border-color:var(--gold-light);

    background:
        linear-gradient(
            180deg,
            #3b5945,
            #263c2e
        );
}

.mapMarkerListItem > span:last-child{
    min-width:0;

    display:flex;
    flex-direction:column;
    gap:2px;
}

.mapMarkerListItem strong,
.mapMarkerListItem small{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.mapMarkerListItem strong{
    font-size:13px;
}

.mapMarkerListItem small{
    color:#b6c2b8;
    font-size:10px;
}

.mapMarkerListEmpty{
    padding:30px 12px;

    color:#9faca2;

    text-align:center;
    font-style:italic;
}

.mapPin{
    border:none !important;

    background:transparent !important;

    filter:
        drop-shadow(
            0 4px 5px rgba(0,0,0,.62)
        );
}

.mapPinSymbol{
    width:38px !important;
    height:38px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    border:
        2px solid
        color-mix(
            in srgb,
            var(--marker-color) 72%,
            var(--gold-light)
        ) !important;

    border-radius:
        50% 50% 50% 12% !important;

    background:
        radial-gradient(
            circle at 35% 25%,
            rgba(255,255,255,.28),
            transparent 30%
        ),
        color-mix(
            in srgb,
            var(--marker-color) 80%,
            #152019
        ) !important;

    color:white !important;

    box-shadow:
        0 0 0 2px rgba(8,13,10,.72),
        0 0 16px
            color-mix(
                in srgb,
                var(--marker-color) 42%,
                transparent
            ) !important;

    font-size:19px !important;

    transform:
        rotate(-45deg)
        scale(var(--map-marker-scale,1)) !important;

    transform-origin:center center !important;
}

.mapPinLabel{
    margin-top:8px !important;

    border:
        1px solid
        color-mix(
            in srgb,
            var(--marker-color) 62%,
            var(--gold)
        ) !important;

    background:
        rgba(12,20,15,.92) !important;

    color:#fff !important;
}

.mapPinFocused .mapPinSymbol{
    animation:
        mapMarkerFocusPulse
        .6s ease-in-out
        3;
}

@keyframes mapMarkerFocusPulse{
    0%{
        filter:brightness(1);
        box-shadow:
            0 0 0 2px rgba(8,13,10,.72),
            0 0 14px
                color-mix(
                    in srgb,
                    var(--marker-color) 42%,
                    transparent
                );
    }

    50%{
        filter:brightness(1.65);
        box-shadow:
            0 0 0 4px rgba(255,255,255,.65),
            0 0 34px
                color-mix(
                    in srgb,
                    var(--marker-color) 88%,
                    white
                );
    }

    100%{
        filter:brightness(1);
    }
}

.mapViewerShell .mapPanelViewport{
    min-width:0;
    min-height:520px;
    height:68vh;

    border:none !important;
}

.mapPanel:fullscreen .mapViewerShell,
.mapPanelViewport:fullscreen .mapViewerShell{
    height:100%;
}

.mapPanelViewport:fullscreen{
    height:100vh !important;
}

.mapPanelViewport:fullscreen .mapMarkerSidebar{
    display:flex;
}

@media(max-width:900px){
    .mapViewerShell{
        grid-template-columns:240px minmax(0,1fr);
    }
}

@media(max-width:700px){
    .mapViewerShell{
        display:flex;
        flex-direction:column;
    }

    .mapMarkerSidebar{
        width:100%;
        max-height:310px;

        border-right:none;
        border-bottom:1px solid rgba(189,162,103,.5);
    }

    .mapMarkerSidebarClosed .mapMarkerSidebar{
        display:none;
    }

    .mapLayerControls{
        max-height:145px;
    }

    .mapViewerShell .mapPanelViewport{
        min-height:440px;
        height:60vh;
    }
}

.categorizedToolbar{position:relative;overflow:visible!important;flex-wrap:nowrap!important}

.primaryNavButton{min-width:155px}

.navModuleGroup{position:relative;display:inline-flex}

.navGroupToggle{min-width:120px}

.navGroupMenu{position:absolute;top:calc(100% + 8px);right:0;z-index:65000;display:grid;grid-template-columns:1fr;gap:6px;min-width:210px;padding:9px;border:1px solid var(--gold);background:linear-gradient(180deg,#203128,#101914);box-shadow:0 16px 38px rgba(0,0,0,.65)}

.navGroupMenu.hidden{display:none!important}

.navGroupMenu button{width:100%;text-align:left;clip-path:none!important}

.legacyCampaignButton{display:none!important}

.sessionHeroActions{display:flex;align-items:center;gap:14px;flex-wrap:wrap}

.sessionHeroActions>button{min-height:40px;padding:8px 14px;border:1px solid var(--gold);background:linear-gradient(180deg,#4d7558,#294837);color:white;font-weight:850;cursor:pointer}

.sessionCoreActions{grid-template-columns:repeat(5,minmax(145px,1fr))!important}

#copyToNoteWindow{position:fixed;inset:var(--real-header-height) 0 0;z-index:59000;display:flex;align-items:flex-start;justify-content:center;padding:18px;background:rgba(4,8,5,.88);overflow-y:auto}

#copyToNoteWindow.hidden{display:none}

.copyToNoteBox{width:min(720px,95vw);max-height:calc(100vh - var(--real-header-height) - 36px);display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--gold);background:linear-gradient(180deg,#1b2c22,#0e1712);box-shadow:0 0 0 3px #08100b,0 25px 75px rgba(0,0,0,.75)}

.copyToNoteHeader{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:18px 20px;border-bottom:1px solid rgba(189,162,103,.65);background:linear-gradient(180deg,#2c4334,#17251c)}

.copyToNoteHeader h2{margin:0;color:var(--gold-light);font-family:Georgia,"Times New Roman",serif}

.copyToNoteHeader p{margin-top:4px;color:#bec8c0;font-style:italic}

#closeCopyToNote{width:38px;height:38px;border:1px solid rgba(219,196,135,.7);border-radius:50%;background:#713129;color:white;font-weight:900;cursor:pointer}

.copyToNoteTools{display:grid;grid-template-columns:1fr auto;gap:9px;padding:13px 16px;border-bottom:1px solid rgba(189,162,103,.3)}

.copyToNoteTools input{min-height:42px;padding:8px 10px;border:1px solid var(--gold);background:#efe4c6;color:var(--ink)}

#createCopyTargetNoteBtn{border:1px solid var(--gold);background:#416b4e;color:white;font-weight:850;cursor:pointer}

#copyToNoteList{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;padding:16px;overflow-y:auto}

.copyTargetNoteCard{display:grid;grid-template-columns:42px 1fr;align-items:center;gap:10px;min-height:66px;padding:10px;border:1px solid rgba(189,162,103,.42);background:linear-gradient(180deg,#293e31,#19271f);color:white;text-align:left;cursor:pointer}

.copyTargetNoteCard:hover{border-color:var(--gold-light);background:linear-gradient(180deg,#3a5944,#263c2e)}

.copyTargetNoteCard>span{font-size:25px;text-align:center}

.copyTargetNoteCard div{display:flex;flex-direction:column;gap:3px}

.copyTargetNoteCard small{color:#b9c5bb}

.copyToNoteEmpty{grid-column:1/-1;padding:35px;text-align:center;color:#b9c5bb}

.copiedReferenceBlock{position:relative;padding-top:46px!important}

.removeCopiedReferenceBtn{position:absolute;top:9px;right:9px;min-height:30px;padding:5px 9px;border:1px solid #9b4b40;background:#7b332b;color:white;font-size:11px;font-weight:850;cursor:pointer}

.mapPin{transform:translate(-50%,-100%) scale(var(--map-marker-scale,1))!important;transform-origin:center bottom!important}

.mapPinSymbol{transform:rotate(-45deg)!important}

#editor:has(.mapPanel){overflow:visible!important}

#editor:has(.mapPanel) .mapPanelToolbar{position:sticky!important;top:calc(var(--real-header-height) + 48px)!important;z-index:20000!important;margin:0!important;box-shadow:0 8px 18px rgba(0,0,0,.45)}

#editor:has(.mapPanel) .mapPanelStatus{position:sticky!important;top:calc(var(--real-header-height) + 104px)!important;z-index:19990!important;margin:0!important}

#lootManagerList{align-items:stretch!important;grid-auto-rows:1fr!important;padding-bottom:48px!important}

.lootCard{box-sizing:border-box!important;height:100%!important;min-width:0!important;overflow:hidden!important;border:2px solid #8d7144!important}

.lootCardHeader,.lootCardBody,.lootCardFooter{min-width:0!important}

.lootCardHeader>div,.lootCardBody{min-width:0!important;overflow-wrap:anywhere!important}

.lootCardBody{overflow:hidden!important}

.lootCardBody ul{padding-right:6px}

.lootManagerBox{min-height:min(760px,calc(100vh - var(--real-header-height) - 36px))!important}

@media(max-width:1000px){.categorizedToolbar{flex-wrap:wrap!important}.sessionCoreActions{grid-template-columns:repeat(2,1fr)!important}.navGroupMenu{left:0;right:auto}}

@media(max-width:700px){#copyToNoteList{grid-template-columns:1fr}.copyToNoteTools{grid-template-columns:1fr}.sessionCoreActions{grid-template-columns:1fr!important}#editor:has(.mapPanel) .mapPanelToolbar{top:var(--real-header-height)!important}#editor:has(.mapPanel) .mapPanelStatus{top:calc(var(--real-header-height) + 112px)!important}}

html,
body{
    min-height:100% !important;
    height:auto !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
}

#editorView{
    min-height:100vh !important;
    height:auto !important;
    overflow:visible !important;
}

#editor{
    min-height:calc(100vh - var(--real-header-height)) !important;
    height:auto !important;
    overflow:visible !important;
}

.mapPanel{
    position:relative !important;
    overflow:visible !important;
}

.mapPanelToolbar,
.interactiveMapToolbar{
    position:sticky !important;
    top:var(--real-header-height) !important;
    z-index:22000 !important;

    margin:0 !important;

    background:
        linear-gradient(
            180deg,
            #243a2c,
            #142219
        ) !important;

    border-top:1px solid rgba(189,162,103,.62) !important;
    border-bottom:1px solid rgba(189,162,103,.72) !important;

    box-shadow:
        0 7px 16px rgba(0,0,0,.38) !important;
}

.mapInteractionStatus,
.mapPanelInfoBar{
    position:sticky !important;
    top:calc(var(--real-header-height) + 54px) !important;
    z-index:21900 !important;

    background:#17251d !important;
    border-bottom:1px solid rgba(189,162,103,.38) !important;
}

.mapViewerShell{
    position:relative !important;
    overflow:visible !important;
}

.mapPanelViewport{
    position:relative !important;
    overflow:auto !important;
    overscroll-behavior:contain !important;
}

body.mapDragging,
body.mapZooming{
    overflow-y:auto !important;
}

.mapMarkerSidebarClosed{
    grid-template-columns:0 minmax(0,1fr) !important;
}

.mapMarkerSidebarClosed .mapMarkerSidebar{
    display:none !important;
}

.mapPanel:fullscreen .mapPanelToolbar,
.mapPanel:fullscreen .interactiveMapToolbar{
    top:0 !important;
}

.mapPanel:fullscreen .mapInteractionStatus,
.mapPanel:fullscreen .mapPanelInfoBar{
    top:54px !important;
}

@media(max-width:1180px){
    .mapPanelToolbar,
    .interactiveMapToolbar{
        top:var(--real-header-height) !important;
    }
}

@media(max-width:760px){
    .mapInteractionStatus,
    .mapPanelInfoBar{
        top:calc(var(--real-header-height) + 96px) !important;
    }
}

.mapViewerShell{
    position:relative !important;
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    overflow:visible !important;
}

.mapViewerShell .mapPanelViewport{
    width:100% !important;
    min-width:0 !important;
}

.mapMarkerSidebar{
    position:absolute !important;
    top:0 !important;
    left:0 !important;
    bottom:0 !important;

    width:300px !important;
    max-width:min(300px, 82vw) !important;

    z-index:12000 !important;

    opacity:1 !important;
    visibility:visible !important;

    pointer-events:auto !important;

    box-shadow:
        8px 0 22px rgba(0,0,0,.46) !important;
}

.mapViewerShell.mapMarkerSidebarClosed .mapMarkerSidebar,
.mapMarkerSidebarClosed .mapMarkerSidebar{
    display:none !important;
    width:300px !important;
    opacity:0 !important;
    visibility:hidden !important;
    pointer-events:none !important;
}

.mapViewerShell.mapMarkerSidebarClosed,
.mapMarkerSidebarClosed{
    display:block !important;
    grid-template-columns:none !important;
}

.mapPanelViewport{
    position:relative !important;
    cursor:grab !important;

    touch-action:none !important;
    user-select:none !important;
}

.mapPanelImage{
    pointer-events:none !important;
    user-select:none !important;
}

.mapPinLayer{
    pointer-events:none !important;
}

.mapPin{
    pointer-events:auto !important;
}

.mapPanelViewport::before,
.mapPanelViewport::after{
    pointer-events:none !important;
}

.mapStage{
    position:relative !important;
    display:block !important;
    pointer-events:auto !important;
}

.mapPanelViewport.mapPinMode{
    box-shadow:
        inset 0 0 0 3px rgba(211,169,63,.85) !important;
}

.mapPanelViewport.mapPinMode::before{
    content:"Click the map to place the marker" !important;

    position:sticky !important;
    top:10px !important;
    left:50% !important;

    display:block !important;
    width:max-content !important;
    max-width:calc(100% - 30px) !important;

    margin:10px auto -45px !important;
    padding:8px 13px !important;

    z-index:13000 !important;

    border:1px solid var(--gold-light) !important;
    border-radius:5px !important;

    background:rgba(17,27,21,.94) !important;
    color:#fff !important;

    font-size:12px !important;
    font-weight:850 !important;

    pointer-events:none !important;
}

@media(max-width:700px){
    .mapMarkerSidebar{
        width:min(280px,88vw) !important;
        max-height:100% !important;
    }
}

.mapPanelViewport.mapPinMode::before{
    content:none !important;
    display:none !important;
}

.mapPanelViewport{
    cursor:grab !important;
    user-select:none !important;
}

.mapStage{
    position:relative !important;
    pointer-events:auto !important;
}

.mapViewerShell{
    position:relative !important;
    display:block !important;
    width:100% !important;
}

.mapViewerShell .mapPanelViewport{
    display:block !important;
    width:100% !important;
    min-width:0 !important;
}

.mapViewerShell.mapMarkerSidebarClosed .mapMarkerSidebar{
    display:none !important;
}

.mapViewerShell.mapMarkerSidebarClosed .mapPanelViewport,
.mapViewerShell.mapMarkerSidebarClosed .mapStage,
.mapViewerShell.mapMarkerSidebarClosed .mapPanelImage{
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
}

.mapPanelViewport{
    position:relative !important;
    overflow:auto !important;
    cursor:grab !important;
    touch-action:none !important;
    user-select:none !important;
}

.mapPanelViewport{
    position:relative !important;
    overflow:hidden !important;
    overscroll-behavior:none !important;
    touch-action:none !important;
    cursor:grab !important;
    user-select:none !important;
}

.mapStage{
    position:absolute !important;
    top:0 !important;
    left:0 !important;
    margin:0 !important;
    transform-origin:0 0 !important;
    will-change:transform,width,height !important;
    pointer-events:auto !important;
}

.mapPanelImage{
    display:block !important;
    width:100% !important;
    height:100% !important;
    max-width:none !important;
    max-height:none !important;
    pointer-events:none !important;
    user-select:none !important;
}

.mapPinLayer{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    pointer-events:none !important;
}

html,
body,
#editorView,
#editor{
    overflow-x:hidden !important;
}

html,
body{
    overflow-y:auto !important;
}

.dm-map-root{
    position:relative !important;
    display:block !important;
    width:100% !important;
    min-height:0 !important;
    overflow:visible !important;
    background:#101914 !important;
}

.dm-map-toolbar{
    position:sticky !important;
    top:calc(var(--real-header-height, 76px) + 48px) !important;
    z-index:30000 !important;
    display:flex !important;
    align-items:center !important;
    flex-wrap:wrap !important;
    gap:8px !important;
    min-height:54px !important;
    padding:8px 12px !important;
    margin:0 !important;
    border:1px solid rgba(189,162,103,.72) !important;
    background:linear-gradient(180deg,#243a2c,#142219) !important;
    box-shadow:0 8px 18px rgba(0,0,0,.45) !important;
}

.dm-map-toolbar button{
    min-height:37px !important;
    padding:7px 12px !important;
    border:1px solid rgba(189,162,103,.62) !important;
    border-radius:4px !important;
    background:linear-gradient(180deg,#4c7558,#294837) !important;
    color:#fff !important;
    font-weight:850 !important;
    cursor:pointer !important;
}

.dm-map-toolbar button.active{
    background:linear-gradient(180deg,#b1883e,#765b27) !important;
    box-shadow:0 0 16px rgba(211,169,63,.55) !important;
}

.dm-map-zoom-label{
    min-width:58px !important;
    color:var(--gold-light,#dbc487) !important;
    text-align:center !important;
    font-weight:900 !important;
}

.dm-map-status{
    position:sticky !important;
    top:calc(var(--real-header-height, 76px) + 102px) !important;
    z-index:29990 !important;
    min-height:35px !important;
    padding:8px 13px !important;
    margin:0 !important;
    border-bottom:1px solid rgba(189,162,103,.38) !important;
    background:#17251d !important;
    color:#c9d1ca !important;
    font-size:13px !important;
}

.dm-map-workspace{
    position:relative !important;
    width:100% !important;
    height:68vh !important;
    min-height:520px !important;
    overflow:hidden !important;
    border:1px solid rgba(189,162,103,.55) !important;
    background:#070b08 !important;
}

.dm-map-viewport{
    position:absolute !important;
    inset:0 !important;
    display:block !important;
    overflow:hidden !important;
    cursor:grab !important;
    touch-action:none !important;
    user-select:none !important;
    background:#080d09 !important;
}

.dm-map-viewport.dm-map-dragging{
    cursor:grabbing !important;
}

.dm-map-viewport.dm-map-marker-mode{
    cursor:crosshair !important;
    box-shadow:inset 0 0 0 3px rgba(211,169,63,.85) !important;
}

.dm-map-stage{
    --dm-map-width:1200px;
    --dm-map-height:800px;
    --dm-map-x:0px;
    --dm-map-y:0px;
    --dm-map-zoom:1;

    position:absolute !important;
    left:0 !important;
    top:0 !important;
    width:var(--dm-map-width) !important;
    height:var(--dm-map-height) !important;
    margin:0 !important;
    padding:0 !important;
    overflow:visible !important;
    transform-origin:0 0 !important;
    transform:
        translate3d(var(--dm-map-x),var(--dm-map-y),0)
        scale(var(--dm-map-zoom)) !important;
    will-change:transform !important;
    pointer-events:auto !important;
}

.dm-map-image{
    position:absolute !important;
    inset:0 !important;
    display:block !important;
    width:100% !important;
    height:100% !important;
    max-width:none !important;
    object-fit:fill !important;
    margin:0 !important;
    padding:0 !important;
    transform:none !important;
    pointer-events:none !important;
    user-select:none !important;
}

.dm-map-pin-layer{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    pointer-events:none !important;
    overflow:visible !important;
}

.dm-map-pin{
    position:absolute !important;
    z-index:20 !important;
    transform:
        translate(-50%,-100%)
        scale(calc(1 / var(--dm-map-zoom))) !important;
    transform-origin:50% 100% !important;
    border:0 !important;
    background:transparent !important;
    padding:0 !important;
    pointer-events:auto !important;
    cursor:pointer !important;
    filter:drop-shadow(0 4px 5px rgba(0,0,0,.62)) !important;
}

.dm-map-pin-symbol{
    width:38px !important;
    height:38px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    border:2px solid color-mix(in srgb,var(--marker-color) 72%,#dbc487) !important;
    border-radius:50% 50% 50% 12% !important;
    background:color-mix(in srgb,var(--marker-color) 82%,#152019) !important;
    color:#fff !important;
    font-size:19px !important;
    transform:rotate(-45deg) !important;
    box-shadow:
        0 0 0 2px rgba(8,13,10,.72),
        0 0 16px color-mix(in srgb,var(--marker-color) 42%,transparent) !important;
}

.dm-map-pin-symbol::first-letter{
    transform:rotate(45deg) !important;
}

.dm-map-pin-label{
    display:block !important;
    width:max-content !important;
    max-width:180px !important;
    margin:7px auto 0 !important;
    padding:4px 8px !important;
    border:1px solid color-mix(in srgb,var(--marker-color) 62%,#bda267) !important;
    border-radius:4px !important;
    background:rgba(12,20,15,.94) !important;
    color:#fff !important;
    font-size:12px !important;
    font-weight:800 !important;
    white-space:nowrap !important;
}

.dm-map-labels-hidden .dm-map-pin-label{
    display:none !important;
}

.dm-map-pin-focused{
    animation:dmMapPinPulse .55s ease-in-out 3 !important;
}

@keyframes dmMapPinPulse{
    50%{
        filter:
            brightness(1.7)
            drop-shadow(0 0 16px #fff) !important;
    }
}

.dm-map-sidebar{
    position:absolute !important;
    top:0 !important;
    left:0 !important;
    bottom:0 !important;
    z-index:500 !important;
    width:300px !important;
    max-width:82vw !important;
    display:flex !important;
    flex-direction:column !important;
    overflow:hidden !important;
    border-right:1px solid rgba(189,162,103,.55) !important;
    background:linear-gradient(180deg,#1d3025,#101a14) !important;
    color:#eef1ec !important;
    box-shadow:8px 0 22px rgba(0,0,0,.46) !important;
}

.dm-map-sidebar-hidden .dm-map-sidebar{
    display:none !important;
}

.dm-map-sidebar-header{
    display:flex !important;
    justify-content:space-between !important;
    align-items:flex-start !important;
    gap:10px !important;
    padding:13px !important;
    border-bottom:1px solid rgba(189,162,103,.42) !important;
    background:linear-gradient(180deg,#2a4233,#19291f) !important;
}

.dm-map-sidebar-header small{
    color:#b6c2b8 !important;
    font-size:9px !important;
    font-weight:900 !important;
    letter-spacing:1px !important;
}

.dm-map-sidebar-header h3{
    margin:3px 0 0 !important;
    color:var(--gold-light,#dbc487) !important;
    font-family:Georgia,"Times New Roman",serif !important;
    font-size:20px !important;
}

.dm-map-sidebar-close{
    width:32px !important;
    height:32px !important;
    border:1px solid rgba(219,196,135,.6) !important;
    border-radius:50% !important;
    background:#673029 !important;
    color:#fff !important;
    font-weight:900 !important;
    cursor:pointer !important;
}

.dm-map-search-label{
    display:flex !important;
    flex-direction:column !important;
    gap:5px !important;
    padding:11px !important;
    color:#d8dfd9 !important;
    font-size:11px !important;
    font-weight:850 !important;
}

.dm-map-search{
    min-height:38px !important;
    padding:8px 10px !important;
    border:1px solid rgba(189,162,103,.58) !important;
    border-radius:4px !important;
    background:#efe4c6 !important;
    color:#30271d !important;
}

.dm-map-layer-list{
    max-height:245px !important;
    padding:7px !important;
    overflow-y:auto !important;
    border-bottom:1px solid rgba(189,162,103,.3) !important;
}

.dm-map-layer-row{
    display:grid !important;
    grid-template-columns:22px 30px 1fr auto !important;
    align-items:center !important;
    gap:7px !important;
    min-height:36px !important;
    padding:4px 6px !important;
    border-radius:4px !important;
    cursor:pointer !important;
}

.dm-map-layer-row:hover{
    background:rgba(111,153,121,.18) !important;
}

.dm-map-layer-icon,
.dm-map-marker-list-item > span:first-child{
    width:27px !important;
    height:27px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    border:1px solid color-mix(in srgb,var(--marker-color) 78%,#dbc487) !important;
    border-radius:50% !important;
    background:color-mix(in srgb,var(--marker-color) 72%,#172019) !important;
}

.dm-map-marker-list-title{
    display:flex !important;
    justify-content:space-between !important;
    padding:10px 12px !important;
    color:var(--gold-light,#dbc487) !important;
    font-size:12px !important;
    text-transform:uppercase !important;
}

.dm-map-marker-list{
    display:flex !important;
    flex-direction:column !important;
    gap:6px !important;
    min-height:0 !important;
    padding:0 8px 12px !important;
    overflow-y:auto !important;
}

.dm-map-marker-list-item{
    width:100% !important;
    display:grid !important;
    grid-template-columns:32px minmax(0,1fr) !important;
    align-items:center !important;
    gap:8px !important;
    min-height:44px !important;
    padding:6px 8px !important;
    border:1px solid rgba(189,162,103,.28) !important;
    border-radius:4px !important;
    background:linear-gradient(180deg,#283b30,#19271f) !important;
    color:#fff !important;
    text-align:left !important;
    cursor:pointer !important;
}

.dm-map-marker-list-item > span:last-child{
    min-width:0 !important;
    display:flex !important;
    flex-direction:column !important;
}

.dm-map-marker-list-item strong,
.dm-map-marker-list-item small{
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
}

.dm-map-marker-list-item small{
    color:#b6c2b8 !important;
}

.dm-map-empty{
    padding:25px 10px !important;
    color:#9faca2 !important;
    text-align:center !important;
    font-style:italic !important;
}

.dm-map-information{
    padding:20px !important;
}

.dm-map-viewport:fullscreen{
    width:100vw !important;
    height:100vh !important;
    background:#050805 !important;
}

.dm-map-viewport:fullscreen .dm-map-stage{
    z-index:1 !important;
}

@media(max-width:700px){
    .dm-map-toolbar{
        top:var(--real-header-height,76px) !important;
    }

    .dm-map-status{
        top:calc(var(--real-header-height,76px) + 102px) !important;
    }

    .dm-map-workspace{
        height:60vh !important;
        min-height:440px !important;
    }

    .dm-map-sidebar{
        width:min(280px,88vw) !important;
    }
}

#editorHeader{
    top:calc(var(--real-header-height, var(--header-height, 76px)) + 8px) !important;
    margin-top:0 !important;
    z-index:31000 !important;
}

#editorView{
    padding-top:8px !important;
}

#sessionNotesInput,
.questNotesArea,
.campaignNoteTextarea,
#campaignNoteTextarea,
#campaignNoteContent,
.parchmentEditor,
.parchmentEditor textarea,
.sessionNotesSection textarea,
.questEditorBody textarea,
.campaignNoteBook textarea{
    background:#f3e6c1 !important;
    background-image:none !important;
    line-height:1.55 !important;
}

#lootManagerList{
    align-items:start !important;
    grid-auto-rows:auto !important;
    overflow-y:auto !important;
    padding-bottom:48px !important;
}

.lootCard{
    height:auto !important;
    min-height:310px !important;
    max-height:none !important;
    align-self:start !important;
    overflow:visible !important;
    box-sizing:border-box !important;
}

.lootCardHeader,
.lootCoinSummary,
.lootCardBody,
.lootCardFooter{
    flex-shrink:0 !important;
    overflow:visible !important;
}

.lootCardBody{
    flex:1 0 auto !important;
    min-height:90px !important;
    max-height:none !important;
}

.lootCardBody ul,
.lootCardBody li{
    overflow:visible !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
}

header{
    z-index:100000 !important;
}

.navModuleGroup,
.navGroupMenu{
    z-index:100100 !important;
}

.navGroupMenu{
    position:absolute !important;
}

#notification{
    position:fixed !important;
    right:22px !important;
    bottom:22px !important;
    z-index:200000 !important;
    max-width:min(430px, calc(100vw - 32px)) !important;
    padding:14px 18px !important;
    border:2px solid var(--gold-light, #dbc487) !important;
    border-radius:7px !important;
    box-shadow:0 18px 50px rgba(0,0,0,.72) !important;
    font-size:15px !important;
    font-weight:800 !important;
    pointer-events:none !important;
}

[id$="Window"]:not(.hidden),
#templateWindow:not(.hidden),
#panelChooserWindow:not(.hidden){
    isolation:isolate !important;
}

#editorView{
    margin-top:var(--real-header-height, var(--header-height, 76px)) !important;
    padding-top:0 !important;
    height:calc(100vh - var(--real-header-height, var(--header-height, 76px))) !important;
    overflow:hidden !important;
}

#editorLeft{
    display:flex !important;
    flex-direction:column !important;
    height:100% !important;
    min-height:0 !important;
    overflow:hidden !important;
}

#editorToolbar{
    order:1 !important;
    position:relative !important;
    top:auto !important;
    left:auto !important;
    right:auto !important;
    z-index:32000 !important;
    flex:0 0 auto !important;
    min-height:58px !important;
    height:auto !important;
    margin:0 !important;
}

#editorHeader{
    order:2 !important;
    position:relative !important;
    top:auto !important;
    left:auto !important;
    right:auto !important;
    z-index:31000 !important;
    flex:0 0 auto !important;
    margin:0 !important;
    min-height:70px !important;
    padding:8px 18px !important;
}

#editor,
#initiativeTracker{
    order:3 !important;
    flex:1 1 auto !important;
    min-height:0 !important;
    overflow:auto !important;
}

#initiativeTracker{
    position:relative !important;
    padding-top:18px !important;
}

#initiativeTracker .trackerToolbar{
    position:sticky !important;
    top:0 !important;
    z-index:500 !important;
    flex-shrink:0 !important;
    margin:0 0 16px !important;
    background:rgba(15,12,10,.96) !important;
    box-shadow:
        0 8px 20px rgba(0,0,0,.55),
        inset 0 0 12px rgba(255,179,71,.08) !important;
}

#initiativeTracker #roundCounter{
    position:sticky !important;
    top:calc(var(--initiative-toolbar-height, 88px)) !important;
    z-index:490 !important;
}

@media(max-width:760px){
    #editorToolbar{
        min-height:54px !important;
    }

    #editorHeader{
        min-height:58px !important;
        padding:7px 9px !important;
    }

    #initiativeTracker .trackerToolbar{
        position:relative !important;
        top:auto !important;
    }

    #initiativeTracker #roundCounter{
        position:relative !important;
        top:auto !important;
    }
}

body{
    background:
        radial-gradient(circle at 50% 10%,rgba(74,105,82,.18),transparent 34%),
        linear-gradient(180deg,#111b15,#090f0c) !important;
}

body::before,
body::after{
    content:"";
    position:fixed;
    z-index:-1;
    width:220px;
    height:220px;
    opacity:.42;
    pointer-events:none;
    background:url("assets/corner_ornament.svg") center/contain no-repeat;
}

body::before{left:0;bottom:0;}

body::after{right:0;bottom:0;transform:scaleX(-1);}

header{
    isolation:isolate;
    background:
        linear-gradient(90deg,rgba(92,29,25,.96) 0 23%,rgba(29,47,36,.96) 48%,rgba(14,24,18,.98) 100%) !important;
    border-bottom:3px solid #aa8342 !important;
    box-shadow:0 6px 22px rgba(0,0,0,.62),inset 0 -1px 0 rgba(238,214,151,.22) !important;
}

header::before{
    content:"";
    position:absolute;
    inset:0 36% 0 0;
    z-index:-1;
    background:url("assets/header_fantasy.svg") left center/cover no-repeat;
    opacity:.72;
    pointer-events:none;
}

#logo{
    position:relative;
    z-index:1;
    color:#f0ddb0 !important;
    text-shadow:0 2px 2px #120806,0 0 16px rgba(225,192,111,.38) !important;
    letter-spacing:1.7px !important;
}

#logo::after{
    content:"";
    display:block;
    width:72%;
    height:2px;
    margin:4px auto 0;
    background:linear-gradient(90deg,transparent,#d7b66c,transparent);
}

#homeGrid.noNotes{
    position:relative;
    display:flex !important;
    align-items:center;
    justify-content:center;
    min-height:calc(100vh - var(--real-header-height,76px)) !important;
    padding:40px !important;
    background:
        linear-gradient(rgba(7,12,9,.3),rgba(7,12,9,.68)),
        url("assets/empty_fantasy.svg") center/cover no-repeat !important;
}

.emptyNotesState{
    width:min(580px,92vw);
    padding:34px 38px;
    border:1px solid #b99a5c;
    outline:3px solid rgba(7,13,9,.75);
    background:rgba(18,29,22,.88);
    box-shadow:0 22px 60px rgba(0,0,0,.65),inset 0 0 35px rgba(190,157,89,.08);
    color:#e8e3d5;
    text-align:center;
}

.emptyNotesCrest{color:#d8b968;font-size:42px;text-shadow:0 0 20px rgba(216,185,104,.48)}

.emptyNotesState h2{margin:6px 0;color:#f0dbab;font:700 34px Georgia,serif;}

.emptyNotesState p{margin:0 auto 20px;max-width:460px;color:#c5cec7;line-height:1.55;}

#emptyStateNewNoteBtn{min-height:46px;padding:9px 20px;border:1px solid #d0ad62;background:linear-gradient(#557c60,#2d4c39);color:#fff;font-weight:900;cursor:pointer;}

.panelVisual{
    width:68px;
    height:68px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
}

.panelPortrait{
    width:64px !important;
    height:64px !important;
    max-width:none !important;
    margin:0 !important;
    border:2px solid color-mix(in srgb,var(--panel-accent) 72%,#d9bd78) !important;
    border-radius:50% !important;
    object-fit:cover !important;
    box-shadow:0 0 0 3px #101914,0 0 18px color-mix(in srgb,var(--panel-accent) 40%,transparent) !important;
}

#editorToolbar{
    gap:10px !important;
    padding:9px 14px !important;
    background:linear-gradient(180deg,#24382d,#142119) !important;
    border-top:1px solid rgba(212,182,111,.45) !important;
    border-bottom:1px solid rgba(212,182,111,.72) !important;
}

.editorFormatGroup{display:flex;gap:6px;align-items:center;}

.formatGlyphButton,
.toolbarImageButton{
    min-width:56px !important;
    min-height:47px !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:1px !important;
    border:1px solid #8e794d !important;
    border-radius:6px !important;
    background:linear-gradient(180deg,#3c5847,#21382b) !important;
    color:#fff6dc !important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.04),0 4px 10px rgba(0,0,0,.22) !important;
}

.formatGlyphButton strong,.formatGlyphButton em,.formatGlyphButton u{font:700 20px Georgia,serif;line-height:1;}

.formatGlyphButton small,.toolbarImageButton small{font-size:9px;letter-spacing:.45px;text-transform:uppercase;color:#c8d2ca;}

.fantasyToolbarControl{
    min-height:47px;
    display:grid !important;
    grid-template-columns:auto auto minmax(70px,auto);
    align-items:center;
    gap:7px;
    padding:5px 8px;
    border:1px solid #8e794d;
    border-radius:6px;
    background:linear-gradient(180deg,#273d31,#18281f);
    color:#eadcb8;
}

.toolbarControlIcon{width:27px;height:27px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(213,183,112,.48);border-radius:50%;background:#111b15;color:#d8bb72;font-weight:900;}

.toolbarControlText{font-size:10px;font-weight:900;letter-spacing:.6px;text-transform:uppercase;}

#editorToolbar .fantasyToolbarControl select{
    min-height:33px !important;
    padding:5px 28px 5px 9px !important;
    border:1px solid #a58b52 !important;
    border-radius:4px !important;
    background:linear-gradient(180deg,#e8d9ae,#cdb77f) !important;
    color:#302316 !important;
    font-weight:850 !important;
}

#editorToolbar .fontColorToolbarControl input[type="color"]{
    width:42px !important;
    height:32px !important;
    padding:3px !important;
    border:1px solid #b39759 !important;
    border-radius:50% !important;
    background:#17231b !important;
    cursor:pointer;
}

#editorToolbar.sheetImageOnly > *{display:none !important;}

#editorToolbar.sheetImageOnly #insertImage{display:flex !important;min-width:130px !important;flex-direction:row !important;gap:7px !important;}

#editorToolbar.sheetImageOnly #insertImage small{font-size:11px;}

.sheetProfileUpload{
    width:112px;
    height:112px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex:0 0 112px;
    padding:0;
    border:4px double #8d7040;
    border-radius:50%;
    background:radial-gradient(circle,#fff4d5,#d8c18c);
    color:#5d3922;
    font-size:42px;
    cursor:pointer;
    overflow:hidden;
    box-shadow:0 7px 18px rgba(74,45,19,.25),inset 0 0 18px rgba(92,55,22,.15);
}

.sheetProfileUpload:hover{filter:brightness(1.08);box-shadow:0 0 0 4px rgba(85,119,91,.35),0 8px 20px rgba(0,0,0,.3);}

.sheetProfileImage{width:100% !important;height:100% !important;max-width:none !important;margin:0 !important;object-fit:cover !important;border-radius:50% !important;}

.npcSheetHeader,.monsterHeader{display:flex !important;align-items:center !important;gap:20px !important;}

.npcSheetHeader > div,.monsterHeader > div{min-width:0;}

.noteEmbeddedImage{
    display:block;
    max-width:min(100%,1100px) !important;
    height:auto !important;
    margin:20px auto !important;
    border:4px double #8d7040 !important;
    background:#e8d6a9 !important;
    box-shadow:0 12px 28px rgba(61,38,18,.28) !important;
    cursor:zoom-in !important;
}

#panelImageViewer{
    position:fixed;
    inset:0;
    z-index:90000;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:28px;
    background:rgba(3,6,4,.94);
    backdrop-filter:blur(5px);
}

#panelImageViewer.hidden{display:none;}

.panelImageViewerFrame{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center;}

#panelImageViewerImage{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;image-rendering:auto;box-shadow:0 0 0 1px #b99a5c,0 22px 80px #000;}

#closePanelImageViewer{position:absolute;top:0;right:0;z-index:2;width:48px;height:48px;border:1px solid #d8b76d;border-radius:50%;background:linear-gradient(#9e463c,#63251f);color:#fff;font-size:21px;font-weight:900;cursor:pointer;box-shadow:0 6px 20px #000;}

@media(max-width:720px){
    .fantasyToolbarControl{grid-template-columns:auto 1fr;}
    .fantasyToolbarControl select,.fantasyToolbarControl input{grid-column:1/-1;}
    .sheetProfileUpload{width:86px;height:86px;flex-basis:86px;}
    .npcSheetHeader,.monsterHeader{align-items:flex-start !important;}
}

.sheetHeaderText{min-width:0;display:flex;flex-direction:column;justify-content:center;}

.sheetHeaderText h1{margin-bottom:4px !important;}

#editor{
    font-size:12px !important;
}

#editor p,
#editor div,
#editor li,
#editor td,
#editor th{
    line-height:1.55;
}

.noteEmbeddedImageFrame{
    position:relative;
    display:block;
    width:fit-content;
    max-width:100%;
    margin:20px auto;
    padding:0;
    border:0;
    background:transparent;
}

.noteEmbeddedImageFrame .noteEmbeddedImage{
    margin:0 !important;
}

.removeEmbeddedImageBtn{
    position:absolute;
    top:9px;
    right:9px;
    z-index:8;
    width:38px;
    height:38px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid #f0b1a9;
    border-radius:50%;
    background:linear-gradient(180deg,#ad4b40,#702820);
    color:#fff;
    font-size:17px;
    font-weight:900;
    cursor:pointer;
    box-shadow:0 5px 14px rgba(0,0,0,.48);
    opacity:.9;
}

.removeEmbeddedImageBtn:hover{
    opacity:1;
    filter:brightness(1.15);
    transform:scale(1.06);
}

.moveEmbeddedImageBtn{
    position:absolute;
    top:9px;
    left:9px;
    z-index:8;
    min-width:68px;
    height:38px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:5px;
    padding:0 10px;
    border:1px solid #c8b071;
    border-radius:999px;
    background:linear-gradient(180deg,#42664d,#243f30);
    color:#fff4d5;
    font-weight:900;
    cursor:grab;
    touch-action:none;
    user-select:none;
    box-shadow:0 5px 14px rgba(0,0,0,.48);
}

.moveEmbeddedImageBtn:active{cursor:grabbing}
.moveEmbeddedImageBtn span{font-size:16px;line-height:1}
.moveEmbeddedImageBtn small{font-size:10px;text-transform:uppercase}
.noteEmbeddedImageFrame.noteImageMoving{opacity:.58;outline:3px dashed #355d43;outline-offset:5px}
.noteImageMoveTarget{outline:3px solid rgba(126,91,39,.65)!important;outline-offset:4px}
body.noteImageMoveActive{cursor:grabbing!important;user-select:none}

.sheetPortraitControls{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:8px;
    flex:0 0 auto;
}

.sheetProfileUpload:has(.sheetProfileImage){
    cursor:zoom-in;
}

.removeSheetPortraitBtn{
    min-height:31px;
    padding:5px 10px;
    border:1px solid #a95c50;
    border-radius:4px;
    background:linear-gradient(180deg,#9d463c,#68271f);
    color:#fff;
    font-size:10px;
    font-weight:900;
    letter-spacing:.3px;
    text-transform:uppercase;
    cursor:pointer;
    box-shadow:0 4px 10px rgba(0,0,0,.25);
}

.removeSheetPortraitBtn:hover{
    filter:brightness(1.13);
}

#editor{
    font-size:18px !important;
    line-height:1.55 !important;
}

#editor p,
#editor div,
#editor li,
#editor td,
#editor th{
    font-size:inherit;
}

#fontSize{
    min-width:88px !important;
}

#worldEntryNotes{
    background:#f3e6c1 !important;
    background-image:none !important;
    color:#332216 !important;
}

.open5eSearchPanel {
    margin: 0 0 24px;
    padding: 18px;
    border: 1px solid rgba(126, 96, 45, .55);
    border-radius: 12px;
    background: linear-gradient(180deg, rgba(246, 235, 198, .96), rgba(225, 207, 154, .94));
    box-shadow: inset 0 0 0 2px rgba(255,255,255,.22), 0 8px 22px rgba(32, 25, 13, .18);
    color: #2f2819;
}

.open5eSearchHeading { display:flex; justify-content:space-between; gap:12px; margin-bottom:12px; }

.open5eSearchHeading strong { display:block; font-family:"Cinzel", Georgia, serif; font-size:1.04rem; color:#254c35; }

.open5eSearchHeading span { display:block; margin-top:3px; font-size:.8rem; opacity:.75; }

.open5eSearchRow { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; }

.open5eSearchRow input {
    min-width:0; padding:11px 13px; border:1px solid #8d7849; border-radius:8px;
    background:#fffaf0; color:#251f15; font-size:16px;
}

.open5eSearchRow button, .open5eResultCard button {
    border:1px solid #23462f; border-radius:8px; padding:10px 15px; cursor:pointer;
    background:linear-gradient(180deg,#4f7d5c,#2f573d); color:#fff8df; font-weight:700;
}

.open5eSearchRow button:hover, .open5eResultCard button:hover { filter:brightness(1.1); }

.open5eSearchStatus { min-height:20px; padding-top:9px; font-size:.86rem; color:#654f27; }

.open5eSearchResults { display:grid; gap:9px; max-height:360px; overflow:auto; }

.open5eResultCard {
    display:flex; align-items:center; justify-content:space-between; gap:15px;
    padding:12px; border:1px solid rgba(105,82,39,.35); border-radius:9px;
    background:rgba(255,250,235,.78);
}

.open5eResultCard h3 { margin:0 0 3px; color:#3f3018; font-size:1rem; }

.open5eResultCard p { margin:0 0 3px; font-size:.86rem; }

.open5eResultCard small { opacity:.7; }

.lootOpen5eSearch { margin:18px; }

@media (max-width:650px) {
    .open5eSearchRow { grid-template-columns:1fr; }
    .open5eResultCard { align-items:stretch; flex-direction:column; }
    .open5eResultCard button { width:100%; }
}

.panel.panelDragging {
    opacity: .55;
    transform: scale(.98);
    outline: 2px dashed var(--panel-accent, #b99755);
    cursor: grabbing;
}

.panel { cursor: grab; }

.panel:active { cursor: grabbing; }

.monsterFormattingToolbar {
    display: flex;
    align-items: center;
    gap: .65rem;
    margin: .75rem 0 .35rem;
    padding: .5rem .7rem;
    border: 1px solid rgba(91, 66, 34, .45);
    border-radius: 8px;
    background: rgba(74, 94, 65, .12);
}

.monsterFormattingToolbar span { font-weight: 700; }

.monsterBoldBtn {
    min-width: 2.35rem;
    min-height: 2.1rem;
    border: 1px solid rgba(91, 66, 34, .7);
    border-radius: 6px;
    background: #f2e2b8;
    color: #2c2519;
    cursor: pointer;
}

.monsterRichField {
    box-sizing: border-box;
    width: 100%;
    min-height: 105px;
    overflow: auto;
    white-space: pre-wrap;
    word-break: break-word;
}

.monsterRichField.bigArea { min-height: 165px; }

.monsterRichField:empty::before {
    content: attr(data-placeholder);
    color: rgba(52, 43, 28, .55);
    pointer-events: none;
}

#editorToolbar.monsterBoldImageOnly > * { display:none !important; }

#editorToolbar.monsterBoldImageOnly .editorFormatGroup,
#editorToolbar.monsterBoldImageOnly #insertImage { display:flex !important; }

#editorToolbar.monsterBoldImageOnly .editorFormatGroup > button:not(:first-child) { display:none !important; }

.monsterSectionHeading { display:flex; align-items:center; justify-content:space-between; gap:12px; border-bottom:2px solid #7d1f16; margin-bottom:9px; }

.monsterSectionHeading h2 { border-bottom:0 !important; margin-bottom:0 !important; flex:1; }

.monsterBoldBtn { display:inline-flex !important; align-items:center; justify-content:center; flex:0 0 auto; min-width:38px; min-height:34px; font-size:18px; font-weight:800; }

.monsterRichField { padding:12px; border:1px solid rgba(91,66,34,.45); border-radius:6px; background:rgba(255,250,230,.72); outline:none; }

.monsterRichField:focus { border-color:#7d1f16; box-shadow:0 0 0 2px rgba(125,31,22,.13); }

.panel { touch-action:none; user-select:none; cursor:grab; }

.panel:active { cursor:grabbing; }

.panel.panelDragging { opacity:.72; transform:scale(.98); z-index:9999; box-shadow:0 18px 35px rgba(0,0,0,.38); }

body.panelDragActive, body.panelDragActive * { cursor:grabbing !important; }

.panel { user-select: none; cursor: grab; }

.panel.panelDragging {
    opacity: .58 !important;
    transform: scale(.985) !important;
    outline: 3px dashed var(--panel-accent, #b99755) !important;
    cursor: grabbing !important;
    transition: none !important;
}

body.panelDragActive { user-select: none !important; }

body.panelDragActive * { cursor: grabbing !important; }

#editorToolbar.monsterBoldImageOnly > * { display: none !important; }

#editorToolbar.monsterBoldImageOnly .editorFormatGroup,
#editorToolbar.monsterBoldImageOnly #insertImage { display: flex !important; }

#editorToolbar.monsterBoldImageOnly .editorFormatGroup > button { display: none !important; }

#editorToolbar.monsterBoldImageOnly .editorFormatGroup > button:first-child { display: inline-flex !important; }

.monsterSectionHeading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 9px;
    border-bottom: 2px solid #7d1f16;
}

.monsterSectionHeading h2 { margin: 0 !important; border: 0 !important; }

.monsterBoldBtn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-width: 40px;
    min-height: 36px;
    font-size: 20px;
    font-weight: 900;
    border: 1px solid rgba(91,66,34,.75);
    border-radius: 6px;
    background: #f2e2b8;
    color: #2c2519;
    cursor: pointer;
}

.monsterRichField {
    box-sizing: border-box;
    width: 100%;
    min-height: 110px;
    padding: 12px;
    overflow: auto;
    white-space: pre-wrap;
    word-break: break-word;
    border: 1px solid rgba(91,66,34,.45);
    border-radius: 6px;
    background: rgba(255,250,230,.72);
    outline: none;
}

.monsterRichField.bigArea { min-height: 170px; }

.monsterRichField:focus { border-color: #7d1f16; box-shadow: 0 0 0 2px rgba(125,31,22,.13); }

.monsterRichField:empty::before { content: attr(data-placeholder); color: rgba(52,43,28,.55); pointer-events: none; }

.panel { cursor: grab; touch-action: none; }

body.panelDragActive, body.panelDragActive * { cursor: grabbing !important; user-select: none !important; }

.monsterFormattingToolbar,
.monsterSectionHeading { display: flex; align-items: center; gap: 10px; }

.monsterSectionHeading { justify-content: space-between; border-bottom: 2px solid #7d1f16; margin-bottom: 9px; }

.monsterBoldBtn {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    min-height: 36px;
    border: 1px solid rgba(91,66,34,.75);
    border-radius: 6px;
    background: #f2e2b8;
    color: #2c2519;
    font-size: 20px;
    font-weight: 900;
    cursor: pointer;
}

#notification.notificationError{background:linear-gradient(180deg,#8a3a30,#57231e)!important;border-color:#e4aa83!important}

.open5eItemFilters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:9px}

.open5eItemFilters select{width:100%;padding:9px;border:1px solid rgba(151,116,54,.55);border-radius:6px;background:#f4ead0;color:#2d2117}

#open5ePreviewWindow{position:fixed;inset:0;z-index:300000;display:grid;place-items:center;padding:24px;background:rgba(7,11,8,.78);backdrop-filter:blur(4px)}

#open5ePreviewWindow.hidden{display:none!important}

.open5ePreviewBox{width:min(780px,96vw);max-height:90vh;overflow:auto;border:2px solid #c6a862;border-radius:12px;background:linear-gradient(180deg,#f5ecd6,#ded0ad);color:#251d14;box-shadow:0 30px 90px rgba(0,0,0,.75)}

.open5ePreviewHeader{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;padding:20px 22px 14px;border-bottom:1px solid rgba(93,67,29,.32)}

.open5ePreviewHeader small{text-transform:uppercase;letter-spacing:.12em;font-weight:900;color:#5f4424}

.open5ePreviewHeader h2{margin:3px 0;font-size:30px}

.open5ePreviewHeader p{margin:0;color:#6b5841}

.open5ePreviewClose{border:0;background:#6d2f28;color:white;border-radius:6px;width:38px;height:38px;font-size:18px;cursor:pointer}

.open5ePreviewContent{padding:18px 22px}

.open5ePreviewActions{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:9px;padding:15px 22px 21px;border-top:1px solid rgba(93,67,29,.32)}

.open5ePreviewActions button{padding:10px 14px;border:1px solid #806532;border-radius:6px;background:#ede0bf;color:#2e2418;font-weight:900;cursor:pointer}

.open5ePreviewActions button.primary{background:#365e43;color:white;border-color:#274631}

.open5ePreviewStatGrid,.open5ePreviewAbilities,.open5eItemPreviewFacts{display:grid;grid-template-columns:repeat(auto-fit,minmax(105px,1fr));gap:9px;margin-bottom:15px}

.open5ePreviewStatGrid span,.open5ePreviewAbilities span,.open5eItemPreviewFacts span{display:flex;flex-direction:column;gap:3px;padding:10px;border:1px solid rgba(98,71,30,.27);border-radius:6px;background:rgba(255,250,235,.62)}

.open5ePreviewWarning{padding:10px;border-left:4px solid #a66c2b;background:rgba(166,108,43,.1)}

.open5ePreviewDescription{line-height:1.55;white-space:normal}

.monsterHpField{display:flex!important;flex-direction:column}

.monsterHpButtons{display:flex;gap:4px;margin-top:5px}

.monsterHpButtons button,.monsterAbilityRollBtn,.monsterAttackRollBtn,.monsterDamageRollBtn{border:1px solid rgba(107,77,31,.55);border-radius:5px;background:#eadbb5;color:#352619;font-weight:900;cursor:pointer}

.monsterHpButtons button{padding:3px 6px;font-size:11px}

.monsterAbilityRollBtn{width:28px;height:27px;padding:0;margin-top:3px}

.monsterSectionHeading{flex-wrap:wrap}

.monsterAttackRollBtn,.monsterDamageRollBtn{padding:5px 8px;margin-left:4px;font-size:12px}

.monsterPassivePerception[readonly]{background:rgba(218,203,164,.65);cursor:default}

@media(max-width:680px){.open5eItemFilters{grid-template-columns:1fr}.open5ePreviewActions{justify-content:stretch}.open5ePreviewActions button{flex:1 1 150px}}


.panelDragHandle{
    position:absolute;top:7px;left:50%;transform:translateX(-50%);z-index:5;
    min-width:66px;height:23px;padding:0 9px;display:flex;align-items:center;justify-content:center;gap:5px;
    border:1px solid rgba(236,220,172,.38);border-radius:999px;
    background:rgba(20,31,23,.72);color:#ead9aa;cursor:grab;touch-action:none;user-select:none;
    opacity:.68;transition:opacity .16s ease,transform .16s ease,background .16s ease;
}

.panelDragHandle small{font-size:9px;text-transform:uppercase;letter-spacing:.08em}

.panel:hover .panelDragHandle,.panelDragHandle:focus{opacity:1;transform:translateX(-50%) translateY(-1px)}


.panelDragHandle.active{cursor:grabbing;background:rgba(114,75,34,.96);opacity:1}

.panel{cursor:pointer!important;touch-action:auto!important;position:relative}

.panel.panelDragging{cursor:grabbing!important;z-index:100;transition:none!important}

.panelDragTarget{outline:3px dashed rgba(214,180,103,.9)!important;outline-offset:5px;transform:translateY(2px)}

body.panelDragActive,body.panelDragActive *{cursor:grabbing!important;user-select:none!important}

/* =========================================================
   INTERACTIVE WELCOME GATEWAY v38
   ========================================================= */

body.welcomeActive{
    overflow:hidden !important;
}

.welcomeLanding{
    --welcome-red:#7f211b;
    --welcome-red-bright:#ad382c;
    --welcome-green:#183326;
    --welcome-green-light:#2e5540;
    --welcome-gold:#c5a561;
    --welcome-gold-light:#f0dba6;
    --welcome-ink:#08110d;
    position:fixed;
    inset:0;
    z-index:2147483647;
    display:block;
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:contain;
    background:#09120e;
    color:#ede8d9;
    font-family:"Segoe UI",Tahoma,sans-serif;
    scroll-behavior:smooth;
}

.welcomeLanding *,
.welcomeLanding *::before,
.welcomeLanding *::after{
    box-sizing:border-box;
}

.welcomeHero{
    position:relative;
    min-height:max(720px,100vh);
    isolation:isolate;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    background:
        radial-gradient(circle at 50% 45%,rgba(45,85,62,.26),transparent 38%),
        linear-gradient(115deg,rgba(102,27,23,.26),transparent 34%),
        linear-gradient(180deg,#0c1912 0%,#07100c 100%);
}

.welcomeHero::before{
    content:"";
    position:absolute;
    inset:-20%;
    z-index:-3;
    opacity:.62;
    background:
        repeating-linear-gradient(0deg,transparent 0 38px,rgba(205,177,111,.045) 39px 40px),
        repeating-linear-gradient(90deg,transparent 0 54px,rgba(205,177,111,.038) 55px 56px),
        repeating-linear-gradient(135deg,rgba(255,255,255,.016) 0 1px,transparent 1px 9px),
        radial-gradient(circle at 50% 45%,rgba(91,91,67,.14),transparent 54%);
    transform:rotate(-2deg);
}

.welcomeHero::after{
    content:"";
    position:absolute;
    left:50%;
    bottom:-280px;
    z-index:-1;
    width:780px;
    height:540px;
    border-radius:50%;
    transform:translateX(-50%);
    background:radial-gradient(ellipse,rgba(135,35,27,.28),rgba(135,35,27,.08) 42%,transparent 70%);
    filter:blur(12px);
}

#welcomeDungeonCanvas{
    position:absolute;
    inset:0;
    z-index:-2;
    width:100%;
    height:100%;
    pointer-events:none;
}

.welcomeHeroVignette{
    position:absolute;
    inset:0;
    z-index:4;
    pointer-events:none;
    background:
        linear-gradient(90deg,rgba(2,7,5,.5),transparent 14%,transparent 86%,rgba(2,7,5,.52)),
        linear-gradient(180deg,rgba(2,7,5,.5),transparent 24%,transparent 70%,rgba(2,7,5,.92)),
        radial-gradient(ellipse at center,transparent 30%,rgba(2,7,5,.32) 75%,rgba(2,7,5,.82));
}

.welcomeNav{
    position:absolute;
    top:0;
    left:0;
    right:0;
    z-index:20;
    min-height:84px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    padding:18px clamp(24px,5vw,80px);
    border-bottom:1px solid rgba(197,165,97,.22);
    background:linear-gradient(180deg,rgba(5,13,9,.82),rgba(5,13,9,.16));
    backdrop-filter:blur(6px);
}

.welcomeNav button{
    border:0;
    background:transparent;
    color:#d9d5c8;
    cursor:pointer;
}

.welcomeBrand{
    display:flex;
    align-items:center;
    gap:12px;
    padding:4px 0;
    font-family:Georgia,"Times New Roman",serif;
    text-transform:uppercase;
    letter-spacing:.13em;
}

.welcomeBrand span{
    width:36px;
    height:36px;
    display:grid;
    place-items:center;
    border:1px solid var(--welcome-gold);
    clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);
    color:var(--welcome-gold-light);
    box-shadow:0 0 18px rgba(197,165,97,.18);
}

.welcomeBrand strong{
    font-size:clamp(.78rem,1.2vw,1rem);
}

.welcomeNav > div{
    display:flex;
    align-items:center;
    gap:9px;
}

.welcomeNav > div button{
    min-height:40px;
    padding:8px 14px;
    font-size:.76rem;
    font-weight:800;
    letter-spacing:.09em;
    text-transform:uppercase;
}

.welcomeNav > div button:hover{
    color:var(--welcome-gold-light);
}

.welcomeNav .welcomeNavEnter{
    border:1px solid rgba(224,195,126,.72);
    background:linear-gradient(180deg,rgba(84,125,94,.92),rgba(37,70,50,.96));
    color:#fff;
    clip-path:polygon(7px 0,calc(100% - 7px) 0,100% 7px,100% calc(100% - 7px),calc(100% - 7px) 100%,7px 100%,0 calc(100% - 7px),0 7px);
}

.welcomeHeroContent{
    position:relative;
    z-index:10;
    width:min(920px,calc(100% - 40px));
    padding:125px 20px 100px;
    text-align:center;
}

.welcomeEyebrow{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:14px;
    margin:0 0 22px;
    color:#d3b36f;
    font-size:.72rem;
    font-weight:900;
    letter-spacing:.24em;
    text-transform:uppercase;
}

.welcomeEyebrow span{
    width:58px;
    height:1px;
    background:linear-gradient(90deg,transparent,var(--welcome-gold));
}

.welcomeEyebrow span:last-child{
    transform:scaleX(-1);
}

.welcomeHeroContent h1{
    max-width:920px;
    margin:0 auto;
    color:#f1e7cd;
    font:800 clamp(3.15rem,7.1vw,7.5rem)/.88 Georgia,"Times New Roman",serif;
    letter-spacing:-.045em;
    text-shadow:0 8px 34px rgba(0,0,0,.78);
}

.welcomeHeroContent h1 em{
    display:block;
    margin-top:.16em;
    color:#ddc98f;
    font-size:.49em;
    font-weight:500;
    letter-spacing:.01em;
}

.welcomeLead{
    max-width:680px;
    margin:30px auto 26px;
    color:#c0c9c2;
    font:400 clamp(1rem,1.6vw,1.22rem)/1.65 Georgia,"Times New Roman",serif;
}

.welcomeCampaignStatus{
    width:max-content;
    max-width:100%;
    display:flex;
    align-items:center;
    gap:12px;
    margin:0 auto 20px;
    padding:9px 16px 9px 11px;
    border:1px solid rgba(197,165,97,.32);
    background:rgba(7,18,12,.74);
    box-shadow:inset 0 0 18px rgba(197,165,97,.04);
    text-align:left;
}

.welcomeCampaignStatus > span{
    width:34px;
    height:34px;
    display:grid;
    place-items:center;
    border:1px solid rgba(197,165,97,.52);
    color:var(--welcome-gold-light);
}

.welcomeCampaignStatus div{
    display:flex;
    flex-direction:column;
    gap:2px;
}

.welcomeCampaignStatus small{
    color:#9aaa9d;
    font-size:.61rem;
    font-weight:900;
    letter-spacing:.14em;
}

.welcomeCampaignStatus strong{
    color:#e8dfc9;
    font-size:.86rem;
}

.welcomePrimaryAction,
.welcomeFinalAction{
    position:relative;
    min-width:min(340px,100%);
    min-height:64px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:22px;
    padding:14px 25px;
    border:1px solid #d18d6f;
    outline:1px solid rgba(210,176,99,.45);
    outline-offset:4px;
    background:
        linear-gradient(180deg,rgba(255,255,255,.08),transparent 35%),
        linear-gradient(180deg,var(--welcome-red-bright),var(--welcome-red));
    color:#fff4dd;
    font-family:Georgia,"Times New Roman",serif;
    font-size:1.05rem;
    font-weight:900;
    letter-spacing:.06em;
    cursor:pointer;
    box-shadow:0 16px 36px rgba(75,13,10,.45),inset 0 0 0 2px rgba(255,220,171,.06);
    clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 10px,100% calc(100% - 10px),calc(100% - 10px) 100%,10px 100%,0 calc(100% - 10px),0 10px);
    transition:transform .2s ease,filter .2s ease,box-shadow .2s ease;
}

.welcomePrimaryAction b,
.welcomeFinalAction span{
    font-size:1.28rem;
    transition:transform .2s ease;
}

.welcomePrimaryAction:hover,
.welcomeFinalAction:hover{
    transform:translateY(-3px);
    filter:brightness(1.13);
    box-shadow:0 21px 44px rgba(75,13,10,.56),0 0 28px rgba(173,56,44,.18);
}

.welcomePrimaryAction:hover b,
.welcomeFinalAction:hover span{
    transform:translateX(4px);
}

.welcomeStartupChoice{
    width:max-content;
    max-width:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    margin:19px auto 0;
    color:#9ca9a0;
    font-size:.78rem;
    cursor:pointer;
}

.welcomeStartupChoice input{
    width:16px;
    height:16px;
    accent-color:var(--welcome-red-bright);
}

.welcomePathLegend{
    position:absolute;
    left:50%;
    bottom:24px;
    z-index:9;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:9px;
    transform:translateX(-50%);
    color:#75867b;
    font-size:.63rem;
    font-weight:800;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.welcomePathLegend i{
    width:1px;
    height:22px;
    background:linear-gradient(var(--welcome-gold),transparent);
    animation:welcomePathPulse 1.9s ease-in-out infinite;
}

@keyframes welcomePathPulse{
    0%,100%{opacity:.3;transform:scaleY(.65)}
    50%{opacity:1;transform:scaleY(1)}
}

.welcomeDungeonObject{
    --react-x:0px;
    --react-y:0px;
    --react-scale:1;
    --react-glow:0;
    position:absolute;
    left:var(--object-x);
    top:var(--object-y);
    z-index:6;
    width:68px;
    height:68px;
    transform:translate(-50%,-50%) translate(var(--react-x),var(--react-y)) scale(var(--react-scale));
    opacity:calc(.78 + var(--react-glow) * .22);
    filter:drop-shadow(0 0 calc(4px + var(--react-glow) * 20px) rgba(224,186,101,calc(.08 + var(--react-glow) * .72)));
    transition:opacity .16s ease;
    pointer-events:none;
}

.welcomeDungeonObject svg{
    width:100%;
    height:100%;
    overflow:visible;
    fill:rgba(12,25,18,.92);
    stroke:#b79a59;
    stroke-width:2.4;
    stroke-linecap:round;
    stroke-linejoin:round;
}

.welcomeDungeonObject span{
    position:absolute;
    left:50%;
    top:calc(100% + 7px);
    width:max-content;
    max-width:150px;
    padding:5px 8px;
    transform:translate(-50%,5px);
    border:1px solid rgba(197,165,97,.42);
    background:rgba(7,16,11,.88);
    color:#e3cf99;
    font:700 .63rem Georgia,"Times New Roman",serif;
    letter-spacing:.06em;
    opacity:0;
    transition:opacity .16s ease,transform .16s ease;
}

.welcomeDungeonObject.awakened span{
    opacity:1;
    transform:translate(-50%,0);
}

.welcomeFeatureSection,
.welcomeGettingStarted{
    position:relative;
    padding:clamp(80px,10vw,145px) clamp(24px,6vw,96px);
}

.welcomeFeatureSection{
    background:
        linear-gradient(180deg,rgba(5,12,8,.2),rgba(5,12,8,.82)),
        radial-gradient(circle at 20% 10%,rgba(117,34,28,.2),transparent 27%),
        #101d16;
}

.welcomeFeatureSection::before,
.welcomeGettingStarted::before{
    content:"";
    position:absolute;
    top:0;
    left:50%;
    width:min(900px,80%);
    height:1px;
    transform:translateX(-50%);
    background:linear-gradient(90deg,transparent,var(--welcome-gold),transparent);
    opacity:.55;
}

.welcomeSectionHeading{
    width:min(760px,100%);
    margin:0 auto 55px;
    text-align:center;
}

.welcomeSectionHeading > p{
    margin:0 0 11px;
    color:#bd9c57;
    font-size:.7rem;
    font-weight:900;
    letter-spacing:.22em;
    text-transform:uppercase;
}

.welcomeSectionHeading h2{
    margin:0;
    color:#f0e3c3;
    font:700 clamp(2.25rem,4.8vw,4.6rem)/1 Georgia,"Times New Roman",serif;
}

.welcomeSectionHeading > span{
    display:block;
    margin-top:17px;
    color:#98a59c;
    font:400 1rem/1.6 Georgia,"Times New Roman",serif;
}

.welcomeFeatureGrid{
    width:min(1380px,100%);
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:18px;
    margin:0 auto;
}

.welcomeFeatureCard{
    position:relative;
    min-height:335px;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    padding:31px 29px 27px;
    overflow:hidden;
    border:1px solid rgba(186,158,96,.34);
    background:
        linear-gradient(145deg,rgba(34,58,43,.92),rgba(15,28,21,.96));
    box-shadow:0 16px 38px rgba(0,0,0,.24),inset 0 0 0 1px rgba(255,255,255,.02);
    transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
}

.welcomeFeatureCard::after{
    content:"";
    position:absolute;
    right:-58px;
    bottom:-72px;
    width:190px;
    height:190px;
    border:1px solid rgba(201,171,102,.1);
    transform:rotate(45deg);
}

.welcomeFeatureCard:hover{
    transform:translateY(-7px);
    border-color:rgba(220,190,120,.72);
    box-shadow:0 24px 50px rgba(0,0,0,.38),0 0 25px rgba(178,147,79,.07);
}

.welcomeFeatureCard:nth-child(2),
.welcomeFeatureCard:nth-child(5){
    background:linear-gradient(145deg,rgba(67,32,28,.92),rgba(27,24,19,.96));
}

.welcomeFeatureNumber{
    position:absolute;
    right:20px;
    top:17px;
    color:rgba(224,198,139,.17);
    font:800 2.5rem Georgia,"Times New Roman",serif;
}

.welcomeFeatureIcon{
    width:52px;
    height:52px;
    display:grid;
    place-items:center;
    margin-bottom:25px;
    border:1px solid rgba(206,174,102,.55);
    background:rgba(5,13,9,.42);
    color:#e1c780;
    font:700 1.65rem Georgia,"Times New Roman",serif;
    clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);
}

.welcomeFeatureCard h3{
    margin:0 0 13px;
    color:#eee1c1;
    font:700 1.45rem Georgia,"Times New Roman",serif;
}

.welcomeFeatureCard p{
    flex:1;
    margin:0 0 24px;
    color:#aeb9b1;
    font-size:.93rem;
    line-height:1.65;
}

.welcomeFeatureCard button{
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    gap:9px;
    padding:0 0 5px;
    border:0;
    border-bottom:1px solid rgba(200,166,91,.46);
    background:transparent;
    color:#d9bd78;
    font-size:.72rem;
    font-weight:900;
    letter-spacing:.09em;
    text-transform:uppercase;
    cursor:pointer;
}

.welcomeFeatureCard button b{
    font-size:1rem;
    transition:transform .18s ease;
}

.welcomeFeatureCard button:hover b{
    transform:translateX(4px);
}

.welcomeGettingStarted{
    background:
        radial-gradient(circle at 80% 35%,rgba(87,33,27,.19),transparent 28%),
        linear-gradient(180deg,#0b1610,#07100c);
}

.welcomeSteps{
    width:min(1080px,100%);
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:24px;
    margin:0 auto 55px;
}

.welcomeSteps article{
    display:flex;
    gap:18px;
    align-items:flex-start;
}

.welcomeSteps article > span{
    flex:0 0 46px;
    width:46px;
    height:46px;
    display:grid;
    place-items:center;
    border:1px solid #bda163;
    color:#ead59f;
    font:800 1.1rem Georgia,"Times New Roman",serif;
    clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);
}

.welcomeSteps h3{
    margin:1px 0 8px;
    color:#e8ddc2;
    font:700 1.15rem Georgia,"Times New Roman",serif;
}

.welcomeSteps p{
    margin:0;
    color:#96a39a;
    font-size:.88rem;
    line-height:1.55;
}

.welcomeInfoCards{
    width:min(1180px,100%);
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:1px;
    margin:0 auto 54px;
    border:1px solid rgba(189,161,99,.35);
    background:rgba(189,161,99,.24);
}

.welcomeInfoCards article{
    padding:28px;
    background:rgba(13,28,20,.96);
}

.welcomeInfoCards small{
    color:#b89a58;
    font-size:.63rem;
    font-weight:900;
    letter-spacing:.16em;
}

.welcomeInfoCards h3{
    margin:8px 0 10px;
    color:#eadfc7;
    font:700 1.18rem Georgia,"Times New Roman",serif;
}

.welcomeInfoCards p{
    margin:0;
    color:#96a49a;
    font-size:.86rem;
    line-height:1.58;
}

.welcomeInfoCards a{
    color:#ddbf79;
}

.welcomeFinalAction{
    min-width:min(390px,100%);
    display:flex;
    margin:0 auto;
}

.welcomeFooter{
    min-height:90px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    padding:24px clamp(24px,6vw,96px);
    border-top:1px solid rgba(189,161,99,.25);
    background:#050b08;
}

.welcomeFooterIdentity{
    display:flex;
    flex-direction:column;
    gap:7px;
    min-width:220px;
}

.welcomeFooter strong{
    color:#d9c491;
    font:700 .9rem Georgia,"Times New Roman",serif;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.welcomeFooterIdentity span{
    color:#748178;
    font-size:.75rem;
}

.welcomeFooterLinks{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:8px 18px;
}

.welcomeFooterLinks a,
.welcomeFooterSupport a{
    color:#cdb77d;
    font-size:.76rem;
    font-weight:800;
    text-decoration:none;
}

.welcomeFooterLinks a:hover,
.welcomeFooterSupport a:hover{
    color:#f0dba6;
    text-decoration:underline;
}

.welcomeFooterSupport{
    max-width:290px;
    margin:0;
    color:#748178;
    font-size:.73rem;
    line-height:1.5;
    text-align:right;
}

.welcomeFooterSupport a{
    display:block;
    overflow-wrap:anywhere;
}

.welcomeReturnButton{
    min-width:auto !important;
}

.welcomeLanding button:focus-visible,
.welcomeLanding a:focus-visible,
.welcomeLanding input:focus-visible{
    outline:3px solid #f0d58e !important;
    outline-offset:4px !important;
}

@media(max-width:980px){
    .welcomeFeatureGrid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .welcomeSteps{
        grid-template-columns:1fr;
        width:min(620px,100%);
    }

    .welcomeInfoCards{
        grid-template-columns:1fr;
    }

    .welcomeDungeonSpider,
    .welcomeDungeonScroll{
        display:none;
    }
}

@media(max-width:700px){
    .welcomeNav{
        min-height:68px;
        padding:12px 17px;
    }

    .welcomeBrand strong{
        max-width:150px;
        font-size:.68rem;
        line-height:1.25;
    }

    .welcomeNav > div button:not(.welcomeNavEnter){
        display:none;
    }

    .welcomeHero{
        min-height:760px;
    }

    .welcomeHeroContent{
        padding:110px 8px 90px;
    }

    .welcomeHeroContent h1{
        font-size:clamp(3rem,16vw,5.3rem);
    }

    .welcomeEyebrow span{
        width:26px;
    }

    .welcomeLead{
        margin-top:24px;
        font-size:.98rem;
    }

    .welcomeCampaignStatus{
        width:100%;
    }

    .welcomePathLegend{
        display:none;
    }

    .welcomeDungeonObject{
        width:52px;
        height:52px;
    }

    .welcomeFeatureSection,
    .welcomeGettingStarted{
        padding:75px 18px;
    }

    .welcomeFeatureGrid{
        grid-template-columns:1fr;
    }

    .welcomeFeatureCard{
        min-height:300px;
    }

    .welcomeFooter{
        flex-direction:column;
        align-items:flex-start;
    }

    .welcomeFooterLinks{
        justify-content:flex-start;
    }

    .welcomeFooterSupport{
        max-width:100%;
        text-align:left;
    }
}

@media(prefers-reduced-motion:reduce){
    .welcomeLanding{
        scroll-behavior:auto;
    }

    .welcomeLanding *,
    .welcomeLanding *::before,
    .welcomeLanding *::after{
        scroll-behavior:auto !important;
        animation:none !important;
        transition:none !important;
    }
}

.monsterImportMeta{margin:4px 0 0;color:#6b5435;font-size:12px;font-weight:800}

.monsterImportMeta[hidden]{display:none!important}

.monsterCurrentHP,.monsterMaxHP{font-variant-numeric:tabular-nums}

.open5eSearchStatus{min-height:22px;display:flex;align-items:center;gap:8px;font-weight:800}

.open5eSearchStatus.searching::before{content:"";width:13px;height:13px;border:2px solid rgba(82,63,31,.28);border-top-color:#365e43;border-radius:50%;animation:dmsSaveSpin .7s linear infinite}

.open5eSearchStatus.success{color:#2f6540}

.open5eSearchStatus.empty{color:#805a22}

.open5eSearchStatus.error{color:#8b2f27}

.open5eSearchStatus.info{color:#66533a}

.applicationStatusGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}

.applicationStatusGrid>div{display:flex;flex-direction:column;gap:4px;padding:12px;border:1px solid rgba(154,123,62,.35);border-radius:8px;background:rgba(255,248,225,.48)}

.applicationStatusGrid span{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:#756147;font-weight:900}

/* =========================================================
   v28 — stable dice tray and Party character home panels
   ========================================================= */
.quickDiceBox{
    flex:none!important;
    overflow:visible!important;
}

.characterHomePanel{
    justify-content:flex-start!important;
    gap:18px!important;
    text-align:left!important;
}

.characterHomePanel .panelVisual{
    width:82px;
    height:82px;
}

.characterHomePanel .panelPortrait{
    width:78px!important;
    height:78px!important;
}

.panelCharacterFallback{
    width:76px;
    height:76px;
    display:grid;
    place-items:center;
    border:2px solid color-mix(in srgb,var(--panel-accent) 72%,#d9bd78);
    border-radius:50%;
    background:radial-gradient(circle at 50% 32%,#efe4c2,#bda46d 68%,#6d5735);
    color:#263a2d;
    font:800 48px/1 Georgia,"Times New Roman",serif;
    box-shadow:0 0 0 3px #101914,0 0 18px color-mix(in srgb,var(--panel-accent) 40%,transparent);
}

.characterHomePanel .panelText{
    min-width:0;
    flex:1;
}

.characterHomePanel .panelTitle{
    max-width:100%;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.characterHomePanelMeta{
    margin-top:5px;
    color:#d8c89f;
    font-size:12px;
    font-weight:800;
}

.characterHomePanelStats{
    display:flex;
    gap:7px;
    margin-top:12px;
}

.characterHomePanelStats span{
    min-width:54px;
    padding:5px 8px;
    display:flex;
    align-items:baseline;
    justify-content:center;
    gap:5px;
    border:1px solid rgba(216,185,104,.48);
    border-radius:6px;
    background:rgba(5,11,7,.38);
    color:#fff3d3;
}

.characterHomePanelStats small{
    color:#c9b57d;
    font-size:8px;
    font-weight:900;
    letter-spacing:.08em;
}

.characterHomePanelStats strong{
    font:800 15px Georgia,"Times New Roman",serif;
}

.characterHomePanelMissing{
    margin-top:8px;
    color:#ffb3a7;
    font-size:12px;
    font-weight:800;
}

.panelChooserSectionHeading{
    grid-column:1/-1;
    display:flex;
    align-items:baseline;
    justify-content:space-between;
    gap:12px;
    margin-top:8px;
    padding:10px 12px 7px;
    border-bottom:1px solid rgba(208,173,98,.55);
    color:#f0d9a5;
}

.panelChooserSectionHeading strong{
    font:700 19px Georgia,"Times New Roman",serif;
}

.panelChooserSectionHeading small{color:#c9bda6}

.panelChooserCharacterItem{
    grid-template-columns:minmax(0,1fr) auto;
    border-color:#758f69;
    background:linear-gradient(145deg,#293c30,#1b2b21);
}

.panelChooserCharacterPortrait{
    width:44px;
    height:44px;
    flex:0 0 44px;
    display:grid!important;
    place-items:center;
    overflow:hidden;
    border:2px solid #bca463;
    border-radius:50%;
    background:#d6c18a;
    color:#294031;
    font:800 29px Georgia,"Times New Roman",serif;
}

.panelChooserCharacterPortrait img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.panelChooserCharacterAddBtn{
    min-width:78px;
    padding:0 10px;
    border:0;
    border-left:1px solid rgba(190,166,105,.45);
    background:linear-gradient(#53785d,#31503b);
    color:#fff3d1;
    font-weight:900;
    cursor:pointer;
}

.panelChooserCharacterAddBtn:hover:not(:disabled){filter:brightness(1.16)}
.panelChooserCharacterAddBtn.isRemove{
    background:linear-gradient(#75463e,#572c27);
    color:#ffd8cc;
}
.panelChooserCharacterAddBtn:disabled{
    background:#29352d;
    color:#9eaa9f;
    cursor:default;
}

@media(max-width:680px){
    .characterHomePanel{gap:10px!important;padding:18px 14px!important}
    .characterHomePanel .panelVisual{width:62px;height:62px}
    .characterHomePanel .panelPortrait,.panelCharacterFallback{width:58px!important;height:58px!important}
    .panelCharacterFallback{font-size:37px}
    .characterHomePanelStats{gap:4px}
    .characterHomePanelStats span{min-width:43px;padding:4px 5px}
    .panelChooserSectionHeading{align-items:flex-start;flex-direction:column}
}

.applicationStatusGrid strong{font-size:14px;color:#2e261a;overflow-wrap:anywhere}

.applicationStatusGrid strong.statusOk{color:#2f6540}

.applicationSupportCard{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    margin-top:15px;
    padding:16px;
    border:1px solid rgba(154,123,62,.5);
    border-radius:9px;
    background:linear-gradient(135deg,rgba(41,75,52,.13),rgba(154,123,62,.1));
}

.applicationSupportCard span{
    display:block;
    margin-bottom:4px;
    color:#756147;
    font-size:10px;
    font-weight:900;
    letter-spacing:.1em;
    text-transform:uppercase;
}

.applicationSupportCard strong{color:#2e261a}

.applicationSupportCard p{
    margin:5px 0 0;
    color:#6d5a43;
    font-size:13px;
}

.applicationSupportActions{
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:8px;
}

.applicationSupportActions a{
    display:inline-flex;
    min-height:38px;
    align-items:center;
    justify-content:center;
    padding:8px 12px;
    border:1px solid #7b5c2d;
    border-radius:6px;
    background:#31563f;
    color:#fff4d2;
    font-size:12px;
    font-weight:900;
    text-decoration:none;
}

.applicationSupportActions a:hover{filter:brightness(1.12)}

@media(max-width:680px){
    .applicationStatusGrid{grid-template-columns:1fr}
    .applicationSupportCard{align-items:flex-start;flex-direction:column}
    .applicationSupportActions{justify-content:flex-start;width:100%}
}

.monsterLibraryTools{
    display:flex;
    flex-direction:column;
    gap:10px;
}

.monsterLibrarySearchRow{
    display:grid;
    grid-template-columns:minmax(220px,1fr) auto auto;
    gap:10px;
    align-items:center;
}

.monsterLibraryFilterRow{
    display:grid;
    grid-template-columns:repeat(3,minmax(130px,1fr)) auto;
    gap:10px;
    align-items:end;
}

.monsterLibraryFilterRow label{
    display:flex;
    flex-direction:column;
    gap:4px;
    color:#d7c59d;
    font-size:11px;
    font-weight:900;
    letter-spacing:.05em;
    text-transform:uppercase;
}

.monsterLibraryFilterRow select{
    min-height:39px;
    padding:7px 10px;
    border:1px solid rgba(206,178,112,.62);
    border-radius:6px;
    background:#efe2c2;
    color:#2f2117;
    font-weight:700;
}

.monsterLibraryViewToggle{
    display:flex;
    gap:5px;
    align-items:center;
    padding-bottom:1px;
}

.monsterLibraryViewToggle button{
    width:40px;
    height:39px;
    border:1px solid rgba(206,178,112,.62);
    border-radius:6px;
    background:#263e2f;
    color:#dcca9d;
    font-size:20px;
    cursor:pointer;
}

.monsterLibraryViewToggle button.active{
    background:#b2934f;
    color:#18241c;
    box-shadow:inset 0 0 0 2px rgba(255,255,255,.22);
}

.monsterLibraryTitleLine{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:8px;
}

.monsterLibraryCardTitle small{
    display:block;
    margin-top:5px;
    color:#7c654d;
    font-size:11px;
    font-weight:800;
}

.monsterLibrarySourceBadge{
    display:inline-flex;
    align-items:center;
    min-height:22px;
    padding:3px 7px;
    border-radius:999px;
    font-size:10px;
    font-weight:900;
    letter-spacing:.04em;
    text-transform:uppercase;
}

.monsterLibrarySourceBadge.srd{
    background:#284f38;
    color:#eef7e9;
    border:1px solid #719a78;
}

.monsterLibrarySourceBadge.custom{
    background:#76502e;
    color:#fff0d4;
    border:1px solid #bd925c;
}

.monsterLibraryOrigin-srd{border-color:#376d4c!important}

.monsterLibraryOrigin-custom{border-color:#8a5429!important}

.monsterLibraryAbilities{
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:5px;
}

.monsterLibraryAbilities span{
    padding:6px 3px;
    border:1px solid rgba(117,82,39,.35);
    border-radius:5px;
    background:rgba(255,255,255,.28);
    text-align:center;
    font-size:12px;
}

.monsterLibraryAbilities strong{
    display:block;
    color:#7d1f16;
    font-size:9px;
}

#monsterLibraryList.monsterLibraryCardView{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(310px,1fr));
}

#monsterLibraryList.monsterLibraryListView{
    display:flex;
    flex-direction:column;
    gap:9px;
}

.monsterLibraryListView .monsterLibraryCard{
    display:grid;
    grid-template-columns:minmax(260px,1.5fr) minmax(250px,.9fr) minmax(310px,1.15fr);
    align-items:center;
    gap:14px;
    padding:12px 14px;
}

.monsterLibraryListView .monsterLibraryCardTop{align-items:center}

.monsterLibraryListView .monsterLibraryStats{grid-template-columns:repeat(4,1fr)}

.monsterLibraryListView .monsterLibraryAbilities{display:none}

.monsterLibraryListView .monsterLibraryCardActions{grid-template-columns:repeat(2,1fr);margin:0}

.monsterLibraryEncounterBtn{background:#355c3f!important;border-color:#8fbb91!important}

.monsterLibraryEncounterBtn:hover{background:#46794f!important}

.polyDie{
    --die-size:38px;
    width:var(--die-size);
    height:var(--die-size);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
    background:linear-gradient(145deg,#48baff,#0873bc 55%,#04345f 100%);
    color:#fff;
    border:1px solid rgba(255,255,255,.65);
    filter:drop-shadow(0 3px 3px rgba(0,0,0,.38));
    font-family:Georgia,"Times New Roman",serif;
    font-size:13px;
    font-weight:900;
    line-height:1;
    text-shadow:0 1px 1px rgba(0,0,0,.6);
}

.polyDie20,.polyDie12{clip-path:polygon(50% 0,90% 21%,100% 65%,72% 100%,28% 100%,0 65%,10% 21%)}

.polyDie10{clip-path:polygon(50% 0,92% 38%,70% 100%,30% 100%,8% 38%)}

.polyDie8{clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}

.polyDie6{border-radius:5px;clip-path:inset(0 round 5px)}

.polyDie4{clip-path:polygon(50% 0,100% 100%,0 100%);padding-top:7px}

.polyDie100{border-radius:50%;clip-path:circle(50%)}

.monsterAbilityRollBtn{
    width:34px!important;
    height:34px!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
}

.monsterAbilityRollBtn .polyDie{--die-size:31px;font-size:10px;transition:transform .15s ease}

.monsterAbilityRollBtn:hover .polyDie{transform:rotate(-8deg) scale(1.08)}


@media (max-width:900px){
    .monsterLibrarySearchRow{grid-template-columns:1fr 1fr}
    .monsterLibrarySearchRow #monsterLibrarySearch{grid-column:1/-1}
    .monsterLibraryFilterRow{grid-template-columns:1fr 1fr}
    .monsterLibraryListView .monsterLibraryCard{grid-template-columns:1fr}
}

@media (max-width:560px){
    .monsterLibrarySearchRow,.monsterLibraryFilterRow{grid-template-columns:1fr}
    .monsterLibraryViewToggle{justify-content:flex-end}
    .monsterLibraryAbilities{grid-template-columns:repeat(3,1fr)}
    .quickDiceGrid{grid-template-columns:repeat(4,1fr)}
    .diceControlBar{grid-template-columns:1fr 1fr}
    .dicePrimaryAction{grid-column:1/-1}
}


/* =====================================================
   ENCOUNTER COMBAT + OFFICIAL CONDITION REFERENCES v7
   ===================================================== */

.conditionReferenceTooltip{
    position:fixed;
    z-index:2147483000;
    max-height:min(470px,calc(100vh - 24px));
    overflow:auto;
    padding:0;
    color:#281d14;
    background:linear-gradient(145deg,#fff8e8,#ead7ad);
    border:2px solid #8d622e;
    border-radius:12px;
    box-shadow:0 18px 55px rgba(0,0,0,.46),inset 0 0 0 1px rgba(255,255,255,.55);
    pointer-events:auto;
}
.conditionReferenceTooltip.hidden{display:none!important;}
.conditionTooltipHeader{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;background:linear-gradient(135deg,#2f4938,#17261e);color:#ffe2a4;border-bottom:2px solid #9c7139;}
.conditionTooltipHeader strong{font:700 20px Georgia,serif;}
.conditionTooltipHeader span{padding:4px 8px;border:1px solid rgba(255,226,164,.5);border-radius:999px;font-size:11px;text-transform:uppercase;letter-spacing:.06em;}
.conditionTooltipBody{padding:13px 15px;font-size:14px;line-height:1.48;}
.conditionTooltipBody p{margin:0 0 9px;}
.conditionTooltipBody p:last-child{margin-bottom:0;}
.conditionTooltipSource{padding:8px 14px;border-top:1px solid rgba(92,62,31,.25);font-size:11px;color:#694b2f;background:rgba(255,255,255,.26);}
.conditionTag.conditionReference{cursor:help;}
.conditionTag b{font-size:14px;margin-left:4px;}

.activeEncounterSummary{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:8px 0 14px;padding:11px 14px;border:2px solid #9a713c;border-radius:10px;background:linear-gradient(135deg,#f5e4bd,#d8bb83);color:#2d2015;box-shadow:0 5px 16px rgba(35,23,13,.16);}
.activeEncounterSummary.hidden{display:none!important;}
.activeEncounterSummary>div:first-child{display:flex;align-items:baseline;gap:10px;}
.activeEncounterSummary strong{font:700 20px Georgia,serif;color:#712018;}
.activeEncounterSummary span{font-size:12px;font-weight:700;}
.activeEncounterMetrics{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end;}
.activeEncounterMetrics span{padding:5px 9px;border-radius:999px;background:rgba(55,77,57,.12);border:1px solid rgba(55,77,57,.3);}

#initiativeTable tr.combatantDefeated td{opacity:.62;background:linear-gradient(90deg,rgba(56,40,33,.16),rgba(120,33,29,.1));}
#initiativeTable tr.combatantDefeated .nameField{text-decoration:line-through;}
#initiativeTable .openCombatantSheetBtn{margin-top:5px;padding:4px 7px;border:1px solid #7a5a36;border-radius:6px;background:#eee0c3;color:#4b3020;font-size:11px;cursor:pointer;}
#initiativeTable .combatantNameCell small{display:block;margin-top:4px;color:#7a6048;font-size:10px;}
#initiativeTable .combatRollBtn{border-color:#836029;background:#5f3f24;color:#fff2cf;}
#initiativeTable .defeatedBtn.active{background:#7b211d;color:#fff;border-color:#a64a42;}

.savedEncounterRuntime{display:flex;gap:5px;flex-wrap:wrap;margin:8px 0;}
.savedEncounterRuntime span{padding:4px 7px;border-radius:999px;background:#e1c89b;border:1px solid #9a7545;font-size:11px;font-weight:700;}
.savedEncounterActions.hasResume{grid-template-columns:1fr 1fr 1fr;}
.savedEncounterActions .resumeSavedEncounter{background:#345b42;}
.savedEncounterCard.completedEncounter{filter:saturate(.72);}

.encounterEndSummaryWindow{position:fixed;inset:0;z-index:2147483200;display:grid;place-items:center;padding:18px;background:rgba(10,8,7,.72);backdrop-filter:blur(5px);}
.encounterEndSummaryBox{position:relative;width:min(620px,96vw);padding:28px;border:3px double #bd8c43;border-radius:15px;background:linear-gradient(145deg,#fff2d2,#d9bd84);box-shadow:0 24px 80px rgba(0,0,0,.58);color:#2a1c13;text-align:center;}
.encounterEndSummaryBox h2{margin:5px 0 20px;font:700 31px Georgia,serif;color:#762219;}
.closeEncounterEndSummary{position:absolute;right:12px;top:10px;border:0;background:transparent;font-size:22px;cursor:pointer;}
.encounterEndEyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:11px;font-weight:800;color:#5b5632;}
.encounterEndMetrics{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:18px 0;}
.encounterEndMetrics article{padding:13px 8px;border:1px solid #9b7442;border-radius:10px;background:rgba(255,255,255,.28);}
.encounterEndMetrics strong{display:block;font-size:24px;color:#31553c;}
.encounterEndMetrics span{font-size:11px;text-transform:uppercase;letter-spacing:.05em;}
.confirmEncounterEndSummary{min-height:42px;padding:9px 20px;border:0;border-radius:8px;background:#31553c;color:white;font-weight:800;cursor:pointer;}

@media(max-width:900px){
    .activeEncounterSummary{align-items:flex-start;flex-direction:column;}
    .activeEncounterMetrics{justify-content:flex-start;}
    .savedEncounterActions.hasResume{grid-template-columns:1fr;}
    .encounterEndMetrics{grid-template-columns:1fr 1fr;}
}


/* =========================================================
   v14 — constructed 3D tray, database search and scroll fixes
   ========================================================= */
#quickDiceWindow{
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding:10px!important;
    background:radial-gradient(circle at 50% 42%,rgba(55,35,24,.34),rgba(5,4,3,.76))!important;
}
.quickDiceBox{
    position:relative!important;
    width:min(1080px,96vw);
    max-width:100%!important;
    max-height:calc(100vh - var(--real-header-height,76px) - 20px)!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:9px!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
    filter:drop-shadow(0 24px 30px rgba(0,0,0,.62))!important;
    box-sizing:border-box!important;
}
.diceRollTray{
    position:relative!important;
    inset:auto!important;
    flex:1 1 auto!important;
    width:100%!important;
    min-height:280px!important;
    aspect-ratio:4 / 3!important;
    overflow:hidden!important;
    isolation:isolate!important;
    border:0!important;
    border-radius:4px!important;
    background:transparent!important;
    box-shadow:none!important;
}
#dice3dCanvas{position:absolute!important;inset:0!important;z-index:4!important;width:100%!important;height:100%!important;background:transparent!important;}
.dicePickerPanel{z-index:12!important;pointer-events:none!important;}
.quickDiceGrid,.quickDiceGrid button,.quickDiceGrid button *{pointer-events:none!important;}
.quickDiceGrid button::before{display:none!important;}
.quickDiceGrid button{min-height:72px!important;}
.quickDiceGrid button>span:nth-child(2){margin-top:2px;background:rgba(28,13,8,.7);border:1px solid rgba(232,197,145,.24);}
.diceFooterDock{
    position:relative!important;
    flex:0 0 auto!important;
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0 3px 3px!important;
    display:grid!important;
    grid-template-columns:minmax(220px,.72fr) minmax(0,1.55fr)!important;
    gap:9px!important;
    align-items:stretch!important;
    box-sizing:border-box!important;
}
.diceTrayResult{
    position:static!important;inset:auto!important;transform:none!important;min-width:0!important;
    display:grid!important;grid-template-columns:auto auto!important;grid-template-rows:auto auto!important;
    align-items:center!important;justify-content:center!important;gap:4px 12px!important;padding:8px 14px!important;
    border:1px solid rgba(202,157,92,.72)!important;border-radius:9px!important;
    background:linear-gradient(180deg,#4b2b18,#24150d)!important;
    box-shadow:inset 0 1px rgba(255,255,255,.14),inset 0 -3px 7px rgba(0,0,0,.34),0 5px 12px rgba(0,0,0,.42)!important;
    box-sizing:border-box!important;
}
.diceTrayResult span{grid-column:1;grid-row:1;font-size:9px}.diceTrayResult strong{grid-column:2;grid-row:1/3;font-size:38px}.diceTrayResult small{grid-column:1;grid-row:2;text-align:center;max-width:220px}
.diceControlBar{
    position:static!important;inset:auto!important;min-width:0!important;width:100%!important;
    display:grid!important;grid-template-columns:82px minmax(120px,1fr) auto auto minmax(112px,auto)!important;
    align-items:end!important;gap:7px!important;padding:8px 9px!important;box-sizing:border-box!important;
}
.diceControlBar>*{min-width:0!important;}
.dicePrimaryAction{min-width:112px!important;max-width:100%!important;white-space:nowrap!important;}

/* Data modal: the content area, campaign cards and backup sections remain scrollable. */
#dataManagerWindow{overflow-y:auto!important;overscroll-behavior:contain!important;}
.dataManagerBox{
    height:min(850px,calc(100vh - var(--real-header-height,76px) - 36px))!important;
    max-height:calc(100vh - var(--real-header-height,76px) - 36px)!important;
    min-height:0!important;
}
.dataManagerContent{
    flex:1 1 0!important;
    min-height:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    scrollbar-gutter:stable!important;
}
.dataManagerSection{flex:0 0 auto!important;overflow:visible!important;}
#campaignProfileList{max-height:none!important;overflow:visible!important;}

/* Map sidebar: reserve the remaining height for a fully scrollable marker list. */
.dm-map-sidebar{min-height:0!important;}
.dm-map-layer-list{flex:0 1 34%!important;max-height:220px!important;min-height:72px!important;overflow-y:auto!important;}
.dm-map-marker-list-title{flex:0 0 auto!important;}
.dm-map-marker-list{
    flex:1 1 0!important;
    min-height:120px!important;
    max-height:none!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    padding:0 8px 20px!important;
    box-sizing:border-box!important;
}
.dm-map-marker-list-item{flex:0 0 auto!important;box-sizing:border-box!important;overflow:visible!important;}
.dm-map-marker-list-item:last-child{margin-bottom:8px!important;}

/* Loot search displays local Item Database results together with saved treasure. */
.lootSearchSectionHeading{
    grid-column:1/-1!important;
    display:flex!important;align-items:center!important;justify-content:space-between!important;
    padding:10px 13px!important;border:1px solid rgba(189,162,103,.48)!important;
    background:linear-gradient(180deg,#263a2e,#17261d)!important;color:#e7d6a7!important;
    font-family:Georgia,"Times New Roman",serif!important;
}
.lootSearchSectionHeading span{font-family:Arial,sans-serif;font-size:12px;color:#b9c4ba;}
.lootDatabaseSearchCard{border-color:rgba(99,151,111,.72)!important;}
.localLootDatabaseResult{border-color:rgba(83,150,100,.72)!important;background:linear-gradient(180deg,rgba(53,94,65,.38),rgba(20,42,29,.36))!important;}
.monsterFormattingToolbar{justify-content:flex-start!important;}
.monsterFormattingToolbar>span{display:none!important;}

@media(max-width:760px){
    #quickDiceWindow{place-items:start center!important;padding:4px!important;}
    .quickDiceBox{width:100%!important;max-height:none!important;gap:6px!important;}
    .diceRollTray{min-height:300px!important;aspect-ratio:1 / 1.08!important;}
    .diceFooterDock{grid-template-columns:1fr!important;gap:6px!important;padding-bottom:8px!important;}
    .diceControlBar{grid-template-columns:72px minmax(100px,1fr) auto auto!important;}
    .dicePrimaryAction{grid-column:1/-1!important;width:100%!important;}
    .dataManagerBox{height:calc(100vh - var(--real-header-height,76px) - 16px)!important;}
}
@media(max-width:470px){
    .diceRollTray{aspect-ratio:.86 / 1!important;}
    .diceControlBar{grid-template-columns:64px minmax(80px,1fr) auto!important;gap:4px!important;}
    .diceControlBar .diceFormulaControl{grid-column:1/-1!important;}
    .diceTrayResult strong{font-size:32px!important;}
}


/* v15: Monster Sheet has no Bold toolbar or per-section Bold controls. */
.monsterFormattingToolbar,
.monsterBoldBtn{display:none!important;}
.monsterSectionHeading{
    display:block!important;
    margin-bottom:9px!important;
    border-bottom:2px solid #7d1f16!important;
}
.monsterSectionHeading h2{
    margin:0!important;
    padding-bottom:5px!important;
    border:0!important;
}

/* v15: Dice footer contains only Modifier, Clear and Roll Dice. */
.diceControlBar{
    grid-template-columns:minmax(80px,110px) auto minmax(122px,auto)!important;
    justify-content:end!important;
    align-items:end!important;
}
.diceFormulaControl,
#loadQuickDiceExpression{display:none!important;}
@media(max-width:700px){
    .diceControlBar{
        grid-template-columns:minmax(72px,1fr) auto minmax(112px,1fr)!important;
    }
}


/* v16: compact premium dice console below the wooden tray. */
.diceFooterDock{
    position:relative!important;
    width:calc(100% - 12px)!important;
    margin:0 6px 4px!important;
    padding:9px!important;
    display:grid!important;
    grid-template-columns:minmax(230px,.78fr) minmax(330px,1.22fr)!important;
    gap:10px!important;
    align-items:stretch!important;
    border:1px solid #9a5b2d!important;
    border-radius:12px!important;
    background:
        linear-gradient(90deg,rgba(255,255,255,.07),transparent 18%,rgba(0,0,0,.13) 52%,rgba(255,255,255,.04)),
        repeating-linear-gradient(5deg,#75401f 0 4px,#6b3619 4px 8px,#824a25 8px 12px)!important;
    box-shadow:inset 0 1px 0 rgba(255,226,177,.28),inset 0 -4px 8px rgba(31,12,4,.48),0 8px 18px rgba(0,0,0,.42)!important;
    box-sizing:border-box!important;
}
.diceTrayResult{
    min-height:66px!important;
    display:grid!important;
    grid-template-columns:auto minmax(70px,auto)!important;
    grid-template-rows:auto auto!important;
    align-items:center!important;
    justify-content:center!important;
    gap:2px 14px!important;
    padding:8px 14px!important;
    border:2px solid #4b160f!important;
    border-radius:9px!important;
    background:
        radial-gradient(circle at 30% 20%,rgba(255,255,255,.12),transparent 28%),
        repeating-radial-gradient(circle at 20% 30%,rgba(255,255,255,.025) 0 1px,transparent 1px 4px),
        linear-gradient(180deg,#871d30,#4d0b18)!important;
    box-shadow:inset 0 0 14px rgba(20,0,6,.52),0 2px 0 rgba(255,213,153,.18)!important;
}
.diceTrayResult span{font-size:10px!important;color:#f0c5ad!important;letter-spacing:.14em!important;}
.diceTrayResult strong{font-size:40px!important;color:#fff8dc!important;text-shadow:0 2px 7px rgba(0,0,0,.68)!important;}
.diceTrayResult small{max-width:250px!important;color:#f3d7c5!important;font-size:11px!important;}
.diceControlBar{
    min-height:66px!important;
    display:grid!important;
    grid-template-columns:minmax(92px,116px) minmax(92px,auto) minmax(150px,1fr)!important;
    align-items:end!important;
    gap:9px!important;
    padding:8px 9px!important;
    border:1px solid rgba(230,183,117,.46)!important;
    border-radius:9px!important;
    background:linear-gradient(180deg,rgba(42,25,16,.88),rgba(21,12,8,.94))!important;
    box-shadow:inset 0 1px rgba(255,255,255,.08)!important;
}
.diceModifierControl span{color:#e6c594!important;font-size:10px!important;letter-spacing:.09em!important;}
.diceModifierControl input{
    width:100%!important;
    height:38px!important;
    border:1px solid #8b633d!important;
    border-radius:7px!important;
    background:#1c1510!important;
    color:#fff3d4!important;
    font-size:17px!important;
    font-weight:800!important;
    text-align:center!important;
}
.diceControlBar button{height:40px!important;border-radius:7px!important;font-size:13px!important;letter-spacing:.02em!important;}
.diceSecondaryAction{border:1px solid #897052!important;background:linear-gradient(180deg,#51483c,#29231e)!important;}
.dicePrimaryAction{
    width:100%!important;
    min-width:150px!important;
    border:1px solid #e0b16d!important;
    background:linear-gradient(180deg,#b47732,#6b3b17)!important;
    box-shadow:inset 0 1px rgba(255,255,255,.24),0 4px 10px rgba(0,0,0,.38)!important;
}
@media(max-width:760px){
    .diceFooterDock{grid-template-columns:1fr!important;width:calc(100% - 8px)!important;margin:0 4px 4px!important;padding:7px!important;}
    .diceControlBar{grid-template-columns:minmax(78px,1fr) auto minmax(120px,1.35fr)!important;}
}
@media(max-width:470px){
    .diceControlBar{grid-template-columns:72px auto minmax(105px,1fr)!important;gap:5px!important;padding:6px!important;}
    .diceControlBar button{padding:0 8px!important;font-size:12px!important;}
    .diceTrayResult strong{font-size:34px!important;}
}


/* =========================================================
   v17 — 3D dice integration, advantage/disadvantage and Combat Log
   ========================================================= */
.initiativeWorkspace{
    display:grid;
    grid-template-columns:minmax(760px,1fr) minmax(280px,340px);
    align-items:start;
    gap:16px;
    min-width:0;
}
.initiativeTablePane{min-width:0;overflow:auto;border-radius:12px;}
.combatLogPanel{
    position:sticky;
    top:calc(var(--initiative-toolbar-height,88px) + 58px);
    display:flex;
    flex-direction:column;
    min-height:420px;
    max-height:calc(100vh - var(--real-header-height,76px) - 190px);
    overflow:hidden;
    border:2px solid #8c6538;
    border-radius:13px;
    background:linear-gradient(145deg,#f6e9c8,#d6ba83);
    box-shadow:0 12px 30px rgba(0,0,0,.24),inset 0 0 0 1px rgba(255,255,255,.42);
    color:#2b1d13;
}
.combatLogHeader{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 14px;background:linear-gradient(135deg,#304b38,#18291f);color:#f7d89c;border-bottom:2px solid #a77a3e;}
.combatLogHeader>div{display:flex;flex-direction:column;gap:1px;}
.combatLogHeader span{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:#c9b486;}
.combatLogHeader strong{font:700 20px Georgia,serif;}
.combatLogHeader button{padding:6px 10px;border:1px solid rgba(255,222,159,.45);border-radius:7px;background:rgba(255,255,255,.08);color:#ffe3ae;font-weight:700;cursor:pointer;}
.combatLogList{flex:1;min-height:0;overflow:auto;padding:10px;scrollbar-color:#8a6438 #ead7ac;}
.combatLogEntry{position:relative;margin-bottom:8px;padding:10px 11px 10px 14px;border:1px solid rgba(100,68,37,.28);border-radius:9px;background:rgba(255,252,239,.55);box-shadow:0 2px 7px rgba(55,35,18,.1);}
.combatLogEntry::before{content:"";position:absolute;left:0;top:7px;bottom:7px;width:4px;border-radius:0 4px 4px 0;background:#6f7958;}
.combatLogEntry.combatLog-damage::before{background:#a12f28;}
.combatLogEntry.combatLog-healing::before{background:#2f7e50;}
.combatLogEntry.combatLog-critical::before{background:#d69316;box-shadow:0 0 8px rgba(214,147,22,.7);}
.combatLogEntry.combatLog-miss::before{background:#665c55;}
.combatLogEntry.combatLog-condition::before{background:#6b4590;}
.combatLogEntry.combatLog-round::before,.combatLogEntry.combatLog-turn::before{background:#2b658d;}
.combatLogMeta{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:4px;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:#775d3f;}
.combatLogEntry p{margin:0;font-size:13px;line-height:1.38;font-weight:650;}
.combatLogEntry small{display:block;margin-top:5px;color:#705a43;font-size:11px;line-height:1.35;}
.combatLogEmpty{display:grid;place-items:center;gap:5px;min-height:240px;padding:20px;text-align:center;color:#715b42;}
.combatLogEmpty span{font-size:38px;opacity:.55;}.combatLogEmpty strong{font:700 17px Georgia,serif;}.combatLogEmpty small{max-width:220px;line-height:1.4;}

.diceRollModeControl{display:flex;flex-direction:column;gap:3px;min-width:132px;}
.diceRollModeControl.hidden{display:none!important;}
.diceRollModeControl span{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:#e8c98d;font-weight:800;}
.diceRollModeControl select{height:38px;padding:0 30px 0 10px;border:1px solid #9e753f;border-radius:7px;background:#2f2118;color:#ffe8b8;font-weight:800;}
.diceResultActions{display:grid;grid-template-columns:minmax(190px,1fr) auto;align-items:end;gap:9px 12px;width:100%;padding:10px 12px;border:1px solid rgba(171,126,66,.74);border-radius:10px;background:linear-gradient(135deg,rgba(48,32,22,.96),rgba(25,18,14,.98));box-sizing:border-box;}
.diceResultActions.hidden{display:none!important;}
.diceResultActions label{display:flex;flex-direction:column;gap:4px;color:#f0d49b;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.07em;}
.diceResultActions select{height:38px;padding:0 10px;border:1px solid #9e753f;border-radius:7px;background:#efe0bf;color:#2d1d12;font-weight:750;}
.diceResultActionButtons{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end;}
.diceResultActionButtons button{min-height:38px;padding:7px 12px;border:1px solid #b88845;border-radius:7px;background:linear-gradient(#496b51,#2d4936);color:#fff0c8;font-weight:850;cursor:pointer;}
.diceResultActionButtons .applyDiceDamageBtn{background:linear-gradient(#9b4439,#6f2520);}
.diceResultActionButtons .applyDiceHealingBtn{background:linear-gradient(#40875b,#28603f);}
.diceResolutionStatus{grid-column:1/-1;min-height:0;color:#dfc794;font-size:12px;font-weight:750;}
.diceResolutionStatus.success{color:#9fe2b3;}.diceResolutionStatus.failure{color:#ffaaa2;}
#initiativeTable .combatantInitiativeRollBtn{background:#315a7a;color:#e5f5ff;border-color:#668eab;}

@media(max-width:1180px){
    .initiativeWorkspace{grid-template-columns:1fr;}
    .combatLogPanel{position:relative;top:auto;max-height:380px;min-height:280px;}
}
@media(max-width:760px){
    .diceResultActions{grid-template-columns:1fr;}
    .diceResultActionButtons{justify-content:stretch;}.diceResultActionButtons button{flex:1;}
    .diceControlBar{flex-wrap:wrap!important;}
}

/* =========================================================
   v18 — Initiative History modal and combined HP roll
   ========================================================= */
.initiativeWorkspace{
    display:block!important;
    min-width:0;
}
.initiativeTablePane{
    width:100%;
    min-width:0;
    overflow:auto;
}
#openCombatLogBtn{
    background:linear-gradient(180deg,#6d5639,#3d2c1b);
    border-color:#a98651;
    color:#fff0c9;
}
#combatLogWindow{
    position:fixed;
    inset:var(--real-header-height,76px) 0 0;
    z-index:2140;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:24px;
    background:rgba(13,10,7,.68);
    backdrop-filter:blur(4px);
    box-sizing:border-box;
}
#combatLogWindow.hidden{display:none!important;}
#combatLogWindow .combatLogPanel{
    position:relative;
    top:auto;
    width:min(780px,94vw);
    min-height:360px;
    max-height:min(760px,82vh);
    margin:0;
}
.combatLogHeaderActions{
    display:flex;
    align-items:center;
    gap:7px;
}
.combatLogHeaderActions #closeCombatLogBtn{
    width:34px;
    min-width:34px;
    padding:6px;
    font-size:16px;
    line-height:1;
}
#initiativeTable .combatantHpHealRollBtn,
#initiativeTable .combatantHpDamageRollBtn{
    background:linear-gradient(135deg,#765029,#77372f);
    color:#fff1d6;
    border-color:#b78358;
}
@media(max-width:760px){
    #combatLogWindow{padding:10px;}
    #combatLogWindow .combatLogPanel{width:100%;max-height:88vh;min-height:320px;}
}


/* =========================================================
   v19 — timed conditions, ongoing effects and concentration
   ========================================================= */
#conditionEditorWindow{
    position:fixed;
    inset:var(--real-header-height,76px) 0 0;
    z-index:2147483300;
    display:grid;
    place-items:center;
    padding:20px;
    overflow:auto;
    background:rgba(12,9,6,.72);
    backdrop-filter:blur(5px);
    box-sizing:border-box;
}
#conditionEditorWindow.hidden{display:none!important;}
.conditionEditorBox{
    position:relative;
    width:min(680px,96vw);
    padding:26px;
    border:3px double #a8793d;
    border-radius:15px;
    color:#2c1d13;
    background:linear-gradient(145deg,#fff3d5,#d9bb80);
    box-shadow:0 26px 85px rgba(0,0,0,.62),inset 0 0 0 1px rgba(255,255,255,.55);
}
.closeConditionEditorBtn{position:absolute;right:12px;top:10px;border:0;background:transparent;color:#5b2b20;font-size:21px;cursor:pointer;}
.conditionEditorEyebrow{display:block;margin-bottom:3px;color:#50613e;font-size:10px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;}
.conditionEditorBox h2{margin:0 0 4px;font:700 29px Georgia,serif;color:#72231c;}
.conditionEditorBox>p{margin:0 0 19px;color:#6e573e;font-size:13px;line-height:1.45;}
.conditionEditorReference{margin:0 0 16px;padding:12px 14px;border:1px solid #9c7443;border-left:5px solid #496b51;border-radius:9px;background:rgba(255,248,232,.72);color:#352417;}
.conditionEditorReference>div{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px;}
.conditionEditorReference strong{color:#294533;font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;}
.conditionEditorReference span{color:#775936;font-size:11px;font-weight:800;}
.conditionEditorReference p{margin:0;font-size:13px;line-height:1.45;}
.conditionEditorReference[data-rule-type="Hazard"]{border-left-color:#a84428;background:linear-gradient(90deg,rgba(168,68,40,.12),rgba(255,248,232,.78));}
.conditionEditorReference[data-rule-type="Hazard"] strong{color:#862f20;}
.conditionEditorGrid{display:grid;grid-template-columns:1fr 1fr;gap:13px;}
.conditionEditorGrid>label,.conditionSaveFields label,.conditionEffectFields label{display:flex;flex-direction:column;gap:5px;min-width:0;}
.conditionEditorGrid label>span{color:#5d462f;font-size:10px;font-weight:900;letter-spacing:.07em;text-transform:uppercase;}
.conditionEditorGrid select,.conditionEditorGrid input{height:42px;min-width:0;padding:0 11px;border:1px solid #9c7443;border-radius:8px;background:#fff8e8;color:#2c1d13;font:700 13px inherit;box-sizing:border-box;}
.conditionConditionalField.hidden{display:none!important;}
.conditionSaveFields,.conditionEffectFields{display:grid;grid-template-columns:1fr 1fr;gap:10px;grid-column:1/-1;padding:12px;border:1px solid rgba(117,78,39,.34);border-radius:10px;background:rgba(255,255,255,.24);}
.conditionEditorActions{display:flex;justify-content:flex-end;gap:9px;margin-top:20px;}
.conditionEditorActions button{min-height:40px;padding:8px 16px;border:1px solid #8d6738;border-radius:8px;background:#ead4aa;color:#39261a;font-weight:850;cursor:pointer;}
.conditionEditorActions button.primary{background:linear-gradient(#496b51,#2d4936);color:#fff0c8;border-color:#66856b;}

#initiativeTable .conditionControl{align-items:stretch;}
#initiativeTable .conditionTags{display:flex;flex-direction:column;align-items:stretch;gap:6px;}
#initiativeTable .conditionTag{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:"name remove" "meta remove";
    gap:1px 8px;
    align-items:center;
    width:100%;
    padding:7px 7px 7px 9px;
    border:1px solid #87643a;
    border-radius:8px;
    background:linear-gradient(135deg,#f1dfb8,#d7bc87);
    color:#39251a;
    text-align:left;
    box-sizing:border-box;
}
#initiativeTable .conditionTagMain{grid-area:name;min-width:0;font-size:12px;font-weight:900;white-space:normal;}
#initiativeTable .conditionTagMeta{grid-area:meta;display:block;color:#765a3c;font-size:9px;font-weight:750;line-height:1.25;white-space:normal;}
#initiativeTable .conditionRemoveBtn{grid-area:remove;align-self:stretch;min-width:28px;padding:0;border:0;border-left:1px solid rgba(99,65,34,.22);background:transparent;color:#7b251f;font-size:17px;font-weight:900;cursor:pointer;}
#initiativeTable .conditionRemoveBtn:hover{background:rgba(124,36,28,.09);}
#initiativeTable .conditionTag[data-duration="rounds"]{border-left:4px solid #3e6f91;}
#initiativeTable .conditionTag[data-duration="savingThrow"]{border-left:4px solid #77509a;}
#initiativeTable .conditionTag[data-effect="damage"]{box-shadow:inset 0 -3px rgba(148,42,33,.18);}
#initiativeTable .conditionTag[data-effect="healing"]{box-shadow:inset 0 -3px rgba(39,119,72,.18);}

@media(max-width:680px){
    .conditionEditorGrid{grid-template-columns:1fr;}
    .conditionSaveFields,.conditionEffectFields{grid-template-columns:1fr;}
    .conditionEditorBox{padding:21px 15px;}
}


/* =====================================
   ENCOUNTER LIBRARY + OFFICIAL SRD SEARCH
   ===================================== */
.encounterMonsterSearchHeading{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:10px;
    margin-bottom:10px;
}

.encounterMonsterSearchHeading h3{margin:0;}

.encounterMonsterSearchHeading small{
    color:#c9aa7f;
    font-size:11px;
    font-weight:800;
    text-align:right;
}

.encounterMonsterSearchStatus{
    min-height:29px;
    padding:7px 9px;
    margin-top:8px;
    border:1px solid rgba(189,162,103,.32);
    border-radius:7px;
    background:rgba(255,255,255,.035);
    color:#c5b69f;
    font-size:11px;
    line-height:1.35;
}

.encounterMonsterSearchStatus.searching{color:#ffd17f;border-color:rgba(255,193,83,.5);}
.encounterMonsterSearchStatus.success{color:#a8d6af;border-color:rgba(104,177,118,.45);}
.encounterMonsterSearchStatus.error{color:#ff9b8e;border-color:rgba(221,84,69,.55);}

.encounterSearchSectionHeading{
    position:sticky;
    top:0;
    z-index:3;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:7px 9px;
    margin:0 0 8px;
    border:1px solid #76542f;
    border-radius:7px;
    background:linear-gradient(180deg,#3b2a1d,#241b16);
    color:#f1c77e;
    box-shadow:0 4px 10px rgba(0,0,0,.24);
}

.encounterSearchSectionHeading span{
    min-width:25px;
    padding:2px 7px;
    border-radius:999px;
    background:#795228;
    color:white;
    text-align:center;
    font-size:11px;
}

.encounterSearchSectionHeadingSrd{
    margin-top:13px;
    border-color:#486c4f;
    background:linear-gradient(180deg,#294431,#192b20);
    color:#bfe0b9;
}

.encounterSearchSectionHeadingSrd span{background:#3f7150;}

.encounterMonsterRowRemote{
    border-color:#52775a;
    background:linear-gradient(145deg,#eef0d8,#dce8d7);
}

.encounterMonsterRowRemote button{
    background:linear-gradient(180deg,#4f805b,#31523a);
}

.encounterMonsterSource{
    display:block;
    margin-top:4px;
    color:#806b52;
    font-size:10px;
    font-weight:800;
}

.encounterSearchLoading span{
    display:inline-block;
    animation:encounterSearchSpin .85s linear infinite;
}

@keyframes encounterSearchSpin{to{transform:rotate(360deg);}}

.adventureNodeEditBtn{
    position:relative;
    z-index:5;
    touch-action:manipulation;
    user-select:none;
}


/* =========================================================
   v21 — Monster information tab, foreground node editor and polished dice tray
   ========================================================= */

#adventureNodeEditorWindow{
    z-index:2147483000!important;
    isolation:isolate!important;
    pointer-events:auto!important;
    background:rgba(2,5,3,.94)!important;
}
#adventureNodeEditorWindow .adventureNodeEditorBook{
    position:relative!important;
    z-index:2!important;
    pointer-events:auto!important;
    box-shadow:0 0 0 2px rgba(221,191,118,.55),0 36px 110px rgba(0,0,0,.92)!important;
}
#adventureBuilderWindow.adventureEditorOpen{pointer-events:none!important;filter:brightness(.62) blur(1px);}

/* Opaque percentile dice and cleaner tray presentation. */
.quickDiceBox{filter:drop-shadow(0 24px 35px rgba(0,0,0,.64))!important;}
#dice3dCanvas{image-rendering:auto;}


/* =========================================================
   PARTY MANAGER + CHARACTER CREATOR v22
   ========================================================= */
#characterCreatorWindow,
#partyManagerWindow,
#partyPdfReviewWindow,
#partyPdfViewerWindow {
    position: fixed;
    inset: var(--real-header-height, 76px) 0 0;
    z-index: 2147482000;
    background: rgba(9, 12, 10, .86);
    backdrop-filter: blur(8px);
    padding: 22px;
    overflow: auto;
}
.characterCreatorBox,
.partyManagerBox,
.partyPdfReviewBox,
.partyPdfViewerBox {
    width: min(1480px, 96vw);
    min-height: min(820px, calc(100vh - var(--real-header-height, 76px) - 44px));
    margin: 0 auto;
    border: 1px solid #9e8249;
    border-radius: 20px;
    background:
        linear-gradient(rgba(244, 231, 192, .97), rgba(221, 200, 151, .98)),
        repeating-linear-gradient(0deg, transparent 0 6px, rgba(79, 50, 20, .035) 7px 8px);
    box-shadow: 0 28px 80px rgba(0,0,0,.62), inset 0 0 0 3px rgba(94, 68, 28, .18);
    color: #282116;
    overflow: hidden;
}
.characterCreatorHeader,
.partyManagerHeader,
.partyPdfReviewHeader,
.partyPdfViewerHeader {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 22px 28px;
    color: #f7e9bd;
    background: linear-gradient(135deg, #173a2d, #28533d 55%, #142e25);
    border-bottom: 3px solid #b79a54;
}
.characterCreatorHeader h2,
.partyManagerHeader h2,
.partyPdfReviewHeader h2,
.partyPdfViewerHeader h2 { margin: 2px 0 4px; font-family: "Eagle Lake", Georgia, serif; }
.characterCreatorHeader p,
.partyManagerHeader p,
.partyPdfReviewHeader p { margin: 0; opacity: .85; }
.characterCreatorEyebrow,
.partyManagerEyebrow { font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: #d4bc78; }
.characterCreatorHeader > button,
.partyManagerHeader > button,
.partyPdfReviewHeader > button,
.partyPdfViewerHeader > button {
    width: 42px; height: 42px; border-radius: 50%; border: 1px solid rgba(235,213,151,.55);
    background: rgba(0,0,0,.18); color: #fff3cc; font-size: 1.1rem; cursor: pointer;
}
.characterCreatorProgress {
    display: grid; grid-template-columns: repeat(6, 1fr); gap: 1px;
    background: #7c6737; border-bottom: 1px solid #816c3e;
}
.characterCreatorProgress button {
    border: 0; border-radius: 0; padding: 12px 8px; cursor: pointer;
    background: #e5d3a2; color: #544323; font-weight: 700;
}
.characterCreatorProgress button span {
    display: inline-grid; place-items: center; width: 24px; height: 24px; margin-right: 5px;
    border-radius: 50%; background: rgba(59,86,57,.18); color: #31563e;
}
.characterCreatorProgress button.active { background: #315a42; color: #fff1c7; }
.characterCreatorProgress button.active span { background: #c4a85f; color: #1e3024; }
.characterCreatorProgress button.complete { background: #b9c7a5; color: #294132; }
.characterCreatorBody { display: grid; grid-template-columns: 260px 1fr; min-height: 610px; }

/* =========================================================
   INTERACTIVE CHARACTER SHEET v25
========================================================= */

#interactiveCharacterSheetWindow,
#characterSheetItemBrowserWindow{
    position:fixed;
    inset:0;
    z-index:78000;
    box-sizing:border-box;
    padding:0;
    background:
        radial-gradient(circle at 50% 0,rgba(126,91,38,.23),transparent 38%),
        rgba(8,12,10,.92);
    backdrop-filter:blur(5px);
}

#interactiveCharacterSheetWindow header,
#characterSheetItemBrowserWindow header{
    position:static !important;
    inset:auto !important;
    z-index:auto !important;
    width:auto !important;
    height:auto !important;
    flex-shrink:0;
    isolation:auto;
    box-shadow:none !important;
}

#interactiveCharacterSheetWindow header::before,
#characterSheetItemBrowserWindow header::before{
    display:none !important;
    content:none !important;
}

#interactiveCharacterSheetWindow.hidden,
#characterSheetItemBrowserWindow.hidden{
    display:none;
}

.interactiveCharacterSheetBox{
    width:100%;
    height:100%;
    margin:0;
    overflow:hidden;
    border:0;
    border-radius:0;
    background:#e9ddbd;
    box-shadow:none;
}

#interactiveCharacterSheetContent{
    display:flex;
    flex-direction:column;
    min-width:0;
    height:100%;
}

.characterSheetHeader{
    display:grid;
    grid-template-columns:auto minmax(280px,1fr) auto auto auto auto;
    gap:14px;
    align-items:center;
    min-height:92px;
    padding:12px 18px;
    color:#f5ead0;
    border-bottom:2px solid #b58b46 !important;
    background:
        linear-gradient(90deg,rgba(151,105,45,.14),transparent 28%,transparent 72%,rgba(151,105,45,.12)),
        linear-gradient(180deg,#26392f,#111c17) !important;
}

.characterSheetHeader button,
.characterSheetHeader select{
    font:inherit;
}

.characterSheetBackBtn,
.characterSheetEditBtn,
.characterSheetCloseBtn{
    min-height:40px;
    padding:9px 13px;
    border:1px solid #a9894d;
    border-radius:8px;
    color:#f6ecd4;
    background:linear-gradient(#4b3926,#2c2118);
    cursor:pointer;
}

.characterSheetBackBtn:hover,
.characterSheetEditBtn:hover,
.characterSheetCloseBtn:hover{
    border-color:#e0bd71;
    background:linear-gradient(#6b4d2f,#39291d);
}

.characterSheetCloseBtn{
    width:42px;
    padding:0;
    color:#ffd9ce;
    border-color:#a55f53;
    background:#5b231f;
    font-size:20px;
}

.characterSheetIdentity{
    display:flex;
    gap:14px;
    align-items:center;
    min-width:0;
}

.characterSheetIdentity img,
.characterSheetPortraitFallback{
    flex:0 0 64px;
    width:64px;
    height:64px;
    object-fit:cover;
    border:2px solid #c9a45d;
    border-radius:50%;
    background:#cfbd91;
    box-shadow:0 3px 14px rgba(0,0,0,.38);
}

.characterSheetPortraitFallback{
    display:grid;
    place-items:center;
    color:#4d3723;
    font-size:34px;
}

.characterSheetIdentity>div{
    min-width:0;
}

.characterSheetIdentity span{
    color:#c8b58d;
    font-size:11px;
    font-weight:800;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.characterSheetIdentity h1{
    overflow:hidden;
    margin:2px 0 3px;
    color:#fff7e4;
    font-family:"Eagle Lake","Georgia",serif;
    font-size:clamp(22px,2vw,34px);
    line-height:1.12;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.characterSheetIdentity p{
    overflow:hidden;
    margin:0;
    color:#d9cdb5;
    font-size:13px;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.characterSheetRollMode{
    display:grid;
    gap:4px;
    color:#cdbb96;
    font-size:10px;
    font-weight:800;
    letter-spacing:.1em;
    text-transform:uppercase;
}

.characterSheetRollMode select{
    min-width:132px;
    height:40px;
    padding:0 32px 0 11px;
    border:1px solid #947640;
    border-radius:7px;
    color:#fff6df;
    background:#18261f;
}

.characterSheetCombatSummary{
    display:grid;
    grid-template-columns:repeat(5,minmax(120px,1fr));
    gap:1px;
    border-bottom:1px solid #9e8050;
    background:#927644;
}

.characterSheetCombatSummary>div,
.characterSheetCombatSummary>button{
    display:grid;
    place-items:center;
    min-height:72px;
    padding:8px 12px;
    border:0;
    color:#2c2116;
    background:linear-gradient(#f6edda,#decba6);
    font:inherit;
}

.characterSheetCombatSummary>button{
    cursor:pointer;
}

.characterSheetCombatSummary>button:hover{
    background:linear-gradient(#fff8e8,#ecd5a5);
}

.characterSheetCombatSummary span{
    color:#756044;
    font-size:10px;
    font-weight:900;
    letter-spacing:.09em;
    text-transform:uppercase;
}

.characterSheetCombatSummary strong{
    color:#2e2116;
    font-family:"Georgia",serif;
    font-size:24px;
}

.characterSheetCombatSummary small{
    color:#8c3a2f;
    font-size:9px;
    font-weight:800;
    text-transform:uppercase;
}

.characterSheetWorkspace{
    display:grid;
    grid-template-columns:320px minmax(0,1fr) 305px;
    min-height:0;
    flex:1;
    background:#d8c69e;
}

.characterSheetStatistics,
.characterSheetRightRail,
.characterSheetTabContent{
    scrollbar-color:#8e6d3f rgba(52,37,23,.12);
    scrollbar-width:thin;
}

.characterSheetStatistics{
    min-height:0;
    padding:16px;
    overflow-y:auto;
    border-right:1px solid #aa8d5c;
    background:
        linear-gradient(rgba(255,255,255,.38),rgba(255,255,255,.08)),
        #cdb98e;
}

.characterSheetStatistics section+section{
    margin-top:18px;
}

.characterSheetStatistics h2{
    margin:0 0 9px;
    color:#4b3422;
    font-family:"Georgia",serif;
    font-size:14px;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.characterSheetAbilityGrid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:8px;
}

.characterSheetAbilityCard{
    position:relative;
    display:grid;
    place-items:center;
    min-height:94px;
    padding:9px;
    border:1px solid #9d7b49;
    border-radius:16px 16px 10px 10px;
    color:#2c2016;
    background:linear-gradient(#fff9e9,#e5d2a7);
    box-shadow:0 3px 8px rgba(58,39,20,.17);
    cursor:pointer;
}

.characterSheetAbilityCard:hover,
.characterSheetAbilityCard:focus-visible{
    transform:translateY(-1px);
    border-color:#8f2f26;
    outline:2px solid rgba(143,47,38,.18);
    background:linear-gradient(#fffdf5,#efd9a6);
}

.characterSheetAbilityCard span{
    color:#735e3e;
    font-size:10px;
    font-weight:900;
    letter-spacing:.06em;
    text-transform:uppercase;
}

.characterSheetAbilityCard strong{
    font-family:"Georgia",serif;
    font-size:29px;
    line-height:1;
}

.characterSheetAbilityCard small{
    display:grid;
    place-items:center;
    width:31px;
    height:23px;
    margin-top:2px;
    border:1px solid #a48555;
    border-radius:50%;
    background:#f9efd7;
    font-weight:800;
}

.characterSheetRollList{
    display:grid;
    gap:3px;
}

.characterSheetListRoll{
    display:grid;
    grid-template-columns:14px 34px minmax(0,1fr) auto;
    gap:7px;
    align-items:center;
    min-height:30px;
    padding:4px 7px;
    border:0;
    border-bottom:1px solid rgba(91,65,35,.2);
    color:#302219;
    background:transparent;
    font:inherit;
    text-align:left;
    cursor:pointer;
}

.characterSheetListRoll:hover{
    border-radius:5px;
    background:rgba(255,248,227,.62);
}

.characterSheetListRoll strong{
    color:#743127;
    font-size:13px;
    text-align:center;
}

.characterSheetListRoll span:nth-child(3){
    font-size:12px;
    font-weight:700;
}

.characterSheetListRoll small{
    color:#7d6849;
    font-size:9px;
    font-weight:900;
}

.characterSheetProficiencyMark{
    display:grid;
    place-items:center;
    width:12px;
    height:12px;
    border:1px solid #70593b;
    border-radius:50%;
    color:transparent;
    font:900 9px/1 Arial,sans-serif;
}

.characterSheetListRoll.proficient .characterSheetProficiencyMark{
    background:#7d2e27;
    color:#fff5dc;
    box-shadow:0 0 0 2px rgba(125,46,39,.2);
}

.characterSheetListRoll.expertise .characterSheetProficiencyMark{
    background:#e8d29d;
    color:#7d2e27;
    outline:2px solid #7d2e27;
    outline-offset:1px;
}

#editorToolbar.mapToolbarHidden{display:none!important}

/* =========================================================
   v52.10 — map toolbar and imported character data fixes
   ========================================================= */

.characterSheetMain{
    display:flex;
    min-width:0;
    min-height:0;
    flex-direction:column;
    background:#eee2c4;
}

.characterSheetTabs{
    display:flex;
    gap:2px;
    padding:10px 12px 0;
    overflow-x:auto;
    border-bottom:1px solid #a58a5b;
    background:#33251b;
}

.characterSheetTabs button{
    min-width:max-content;
    min-height:42px;
    padding:9px 16px;
    border:1px solid transparent;
    border-bottom:0;
    border-radius:8px 8px 0 0;
    color:#d9c8a6;
    background:#4a3729;
    font:inherit;
    font-size:12px;
    font-weight:900;
    letter-spacing:.03em;
    cursor:pointer;
}

.characterSheetTabs button:hover{
    color:#fff5dc;
    background:#614733;
}

.characterSheetTabs button.active{
    color:#38261a;
    border-color:#a98d5c;
    background:#eee2c4;
}

.characterSheetTabContent{
    min-height:0;
    flex:1;
    padding:20px;
    overflow-y:auto;
}

.characterSheetSectionHeading{
    display:flex;
    gap:14px;
    align-items:flex-end;
    justify-content:space-between;
    margin-bottom:16px;
    padding-bottom:11px;
    border-bottom:2px solid #89502d;
}

.characterSheetSectionHeading span{
    color:#8c5b32;
    font-size:10px;
    font-weight:900;
    letter-spacing:.11em;
    text-transform:uppercase;
}

.characterSheetSectionHeading h2{
    margin:2px 0 0;
    color:#38261a;
    font-family:"Georgia",serif;
    font-size:25px;
}

.characterSheetSectionHeading small{
    color:#786649;
    font-size:11px;
}

.characterSheetActionList{
    display:grid;
    gap:11px;
}

.characterSheetActionCard{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:16px;
    align-items:center;
    padding:14px 16px;
    border:1px solid #a88c5c;
    border-left:5px solid #456c55;
    border-radius:10px;
    background:linear-gradient(100deg,#fffaf0,#e8d7b4);
    box-shadow:0 3px 10px rgba(67,44,25,.12);
}

.characterSheetActionCard.criticalReady{
    border-left-color:#b77a16;
    box-shadow:0 0 0 2px rgba(211,151,43,.2),0 3px 10px rgba(67,44,25,.12);
}

.characterSheetActionCard>div:first-child>span{
    color:#7a6545;
    font-size:9px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.characterSheetActionCard h3{
    margin:2px 0 4px;
    color:#342218;
    font-family:"Georgia",serif;
    font-size:18px;
}

.characterSheetActionCard p{
    margin:0;
    color:#6e5a42;
    font-size:11px;
}

.characterSheetActionValues{
    display:flex;
    gap:8px;
}

.characterSheetActionValues button,
.characterSheetFixedDamage{
    display:grid;
    place-items:center;
    min-width:92px;
    min-height:58px;
    padding:7px 10px;
    border:1px solid #94713f;
    border-radius:8px;
    color:#f7edd6;
    background:linear-gradient(#385d48,#20382b);
    cursor:pointer;
}

.characterSheetActionValues button:hover:not(:disabled){
    border-color:#d3b36e;
    background:linear-gradient(#4b765d,#2a4938);
}

.characterSheetActionValues button:disabled{
    cursor:not-allowed;
    opacity:.48;
}

.characterSheetActionValues span,
.characterSheetFixedDamage small{
    font-size:9px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.characterSheetActionValues strong,
.characterSheetFixedDamage strong{
    font-family:"Georgia",serif;
    font-size:18px;
}

.characterSheetFixedDamage{
    color:#38271c;
    background:#e4d2aa;
    cursor:default;
}

.characterSheetEditableBlock{
    display:grid;
    gap:7px;
    margin-top:17px;
    color:#5b422c;
    font-size:11px;
    font-weight:900;
    letter-spacing:.05em;
    text-transform:uppercase;
}

.characterSheetEditableBlock textarea{
    width:100%;
    box-sizing:border-box;
    padding:13px;
    resize:vertical;
    border:1px solid #9f8152;
    border-radius:8px;
    color:#2e2118;
    background:#fffaf0;
    font:500 14px/1.55 Arial,sans-serif;
    letter-spacing:normal;
    text-transform:none;
}

.characterSheetEditableBlock textarea:focus{
    border-color:#775a2f;
    outline:3px solid rgba(132,91,39,.15);
}

.characterSheetSpellStats{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:10px;
}

.characterSheetSpellStats>div,
.characterSheetSpellStats>button{
    display:grid;
    place-items:center;
    min-height:86px;
    border:1px solid #9d7c4c;
    border-radius:10px;
    color:#39271b;
    background:#fff8e8;
    font:inherit;
}

.characterSheetSpellStats>button{
    cursor:pointer;
}

.characterSheetSpellStats span{
    color:#765e3d;
    font-size:10px;
    font-weight:900;
    text-transform:uppercase;
}

.characterSheetSpellStats strong{
    font-family:"Georgia",serif;
    font-size:26px;
}

.characterSheetInventoryHeading{
    align-items:center;
}

.characterSheetAddItemBtn,
.characterSheetConfirmAddItem{
    min-height:42px;
    padding:9px 15px;
    border:1px solid #b6914d;
    border-radius:8px;
    color:#fff5da;
    background:linear-gradient(#50735c,#294431);
    font-weight:900;
    cursor:pointer;
}

.characterSheetOfficialLockNote{
    padding:9px 11px;
    border:1px solid #9a8358;
    border-radius:7px;
    color:#4d4737;
    background:#dfd3b4;
    font-size:11px;
    font-weight:800;
}

.characterSheetAddItemBtn:hover,
.characterSheetConfirmAddItem:hover{
    background:linear-gradient(#65896f,#365942);
}

.characterSheetCurrency{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:8px;
    margin-bottom:16px;
    padding:10px;
    border:1px solid #a98b58;
    border-radius:9px;
    background:#d8c49a;
}

.characterSheetCurrency label{
    display:grid;
    grid-template-columns:auto 1fr;
    gap:6px;
    align-items:center;
}

.characterSheetCurrency span{
    color:#6c4d2b;
    font-size:10px;
    font-weight:900;
}

.characterSheetCurrency input{
    width:100%;
    min-width:0;
    box-sizing:border-box;
    padding:6px;
    border:1px solid #9a7a48;
    border-radius:5px;
    background:#fff9e9;
}

.characterSheetInventoryList{
    display:grid;
    gap:10px;
}

.characterSheetInventoryItem{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto auto;
    gap:10px 14px;
    align-items:center;
    padding:13px 14px;
    border:1px solid #ad905e;
    border-left:5px solid #8c7552;
    border-radius:9px;
    background:#fff9ea;
}

.characterSheetInventoryItem.equipped{
    border-left-color:#3e7555;
    background:linear-gradient(100deg,#f8f4e5,#e4ddbf);
}

.characterSheetInventoryItem.selected{
    border-color:#7a4d2e;
    box-shadow:0 0 0 2px rgba(122,77,46,.2),0 7px 18px rgba(64,42,23,.15);
}

.characterSheetInventoryItem[data-sheet-inventory-select]{
    cursor:pointer;
}

.characterSheetInventoryIdentity>span{
    color:#856a45;
    font-size:9px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.characterSheetInventoryIdentity h3{
    margin:2px 0 4px;
    color:#342318;
    font-family:"Georgia",serif;
    font-size:17px;
}

.characterSheetInventoryIdentity p{
    margin:0;
    color:#715f47;
    font-size:11px;
}

.characterSheetInventoryBadges{
    display:flex;
    flex-wrap:wrap;
    gap:5px;
}

.characterSheetInventoryBadges span{
    padding:4px 7px;
    border-radius:999px;
    color:#f6ecd5;
    background:#3d684f;
    font-size:9px;
    font-weight:900;
    text-transform:uppercase;
}

.characterSheetQuantity{
    display:grid;
    grid-template-columns:28px 28px 28px;
    align-items:center;
}

.characterSheetQuantity button{
    height:28px;
    border:1px solid #927343;
    color:#44301f;
    background:#e3d0a7;
    font-weight:900;
    cursor:pointer;
}

.characterSheetQuantity strong{
    text-align:center;
}

.characterSheetInventoryActions{
    display:flex;
    grid-column:1/-1;
    gap:7px;
    justify-content:flex-end;
    padding-top:8px;
    border-top:1px solid rgba(103,76,41,.18);
}

.characterSheetInventoryActions button{
    min-height:32px;
    padding:6px 10px;
    border:1px solid #957642;
    border-radius:5px;
    color:#3e2d1f;
    background:#e8d6ae;
    font-size:10px;
    font-weight:900;
    cursor:pointer;
}

.characterSheetInventoryActions button:hover{
    background:#f5e6c6;
}

.characterSheetInventoryActions button.danger{
    color:#792f29;
    border-color:#9d5c54;
}

.characterInventoryWeaponRolls{
    display:flex;
    grid-column:1/-1;
    flex-wrap:wrap;
    gap:7px;
    padding:10px;
    border:1px solid #7c956e;
    border-radius:7px;
    background:#dce7d4;
}

.characterInventoryWeaponRolls button{
    min-height:34px;
    padding:7px 10px;
    border:1px solid #49654d;
    border-radius:6px;
    color:#fff1d0;
    background:#294b37;
    font-size:10px;
    font-weight:900;
    cursor:pointer;
}

.characterInventoryWeaponRolls button:disabled{
    opacity:.45;
    cursor:not-allowed;
}

.characterSheetInventoryItem details{
    grid-column:1/-1;
    color:#5f4d38;
    font-size:11px;
}

.characterSheetInventoryItem summary{
    cursor:pointer;
    font-weight:900;
}

.characterSheetEmptyState,
.characterSheetItemEmpty{
    padding:34px 20px;
    border:2px dashed #ad9368;
    border-radius:10px;
    color:#78664b;
    background:rgba(255,250,236,.45);
    text-align:center;
}

.characterSheetEmptyState p,
.characterSheetItemEmpty p{
    margin:5px 0 0;
}

.characterSheetRightRail{
    min-height:0;
    padding:14px;
    overflow-y:auto;
    border-left:1px solid #a98b59;
    background:
        linear-gradient(rgba(255,255,255,.32),rgba(255,255,255,.04)),
        #c6b17f;
}

.characterSheetVitals{
    display:grid;
    gap:11px;
}

.characterSheetHpCard,
.characterSheetDeathSaves,
.characterSheetRollHistory{
    padding:14px;
    border:1px solid #8e7042;
    border-radius:10px;
    color:#352519;
    background:#fff8e6;
    box-shadow:0 3px 9px rgba(66,43,22,.14);
}

.characterSheetHpCard>span{
    display:block;
    color:#765c3b;
    font-size:10px;
    font-weight:900;
    letter-spacing:.1em;
    text-align:center;
    text-transform:uppercase;
}

.characterSheetHpNumbers{
    display:flex;
    gap:5px;
    align-items:baseline;
    justify-content:center;
    margin:6px 0;
}

.characterSheetHpNumbers strong{
    color:#7d2e27;
    font-family:"Georgia",serif;
    font-size:39px;
}

.characterSheetHpNumbers small{
    color:#6d5c47;
    font-size:16px;
    font-weight:800;
}

.characterSheetHpBar{
    height:9px;
    overflow:hidden;
    border-radius:999px;
    background:#c7b89b;
}

.characterSheetHpBar i{
    display:block;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,#7d2e27,#b34c3d);
    transition:width .25s;
}

.characterSheetTempHp{
    display:flex;
    justify-content:space-between;
    margin:9px 0;
    color:#406070;
    font-size:11px;
    font-weight:800;
}

#characterSheetHpAmount{
    width:100%;
    box-sizing:border-box;
    height:35px;
    margin-bottom:7px;
    border:1px solid #917143;
    border-radius:5px;
    background:#fffdf6;
    text-align:center;
}

.characterSheetHpActions{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:5px;
}

.characterSheetHpActions button{
    min-height:33px;
    padding:5px;
    border:1px solid #8f6840;
    border-radius:5px;
    color:#f9edd2;
    background:#553b27;
    font-size:9px;
    font-weight:900;
    cursor:pointer;
}

.characterSheetInspiration,
.characterSheetHitDie{
    display:grid;
    grid-template-columns:auto 1fr;
    grid-template-areas:"icon title" "icon sub";
    gap:1px 10px;
    align-items:center;
    min-height:64px;
    padding:10px 13px;
    border:1px solid #917344;
    border-radius:9px;
    color:#3b2a1c;
    background:#ebdbb9;
    text-align:left;
    cursor:pointer;
}

.characterSheetInspiration>span{
    grid-area:icon;
    color:#9d772b;
    font-size:28px;
}

.characterSheetInspiration strong,
.characterSheetHitDie strong{
    grid-area:title;
}

.characterSheetInspiration small,
.characterSheetHitDie small{
    grid-area:sub;
    color:#766449;
}

.characterSheetInspiration.active{
    color:#f8ecd3;
    border-color:#be9a52;
    background:linear-gradient(#41634e,#263f31);
}

.characterSheetHitDie{
    grid-template-areas:"title title" "sub sub";
    text-align:center;
}

.characterSheetHitDie:disabled{
    cursor:not-allowed;
    opacity:.5;
}

.characterSheetDeathSaves>div{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom:9px;
    color:#6d5434;
    font-size:10px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.characterSheetDeathSaves>div button,
.characterSheetRollHistoryHeading button{
    border:0;
    color:#7c3028;
    background:transparent;
    font-size:10px;
    font-weight:900;
    cursor:pointer;
}

.characterSheetDeathSaves label{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:5px 0;
    font-size:11px;
    font-weight:800;
}

.characterSheetDeathSaves label>span{
    display:flex;
    gap:5px;
}

.characterSheetDeathSaves label button{
    width:18px;
    height:18px;
    padding:0;
    border:1px solid #72583a;
    border-radius:50%;
    background:#ead8b5;
    cursor:pointer;
}

.characterSheetDeathSaves label:first-of-type button.active{
    border-color:#35684a;
    background:#4d7b5f;
}

.characterSheetDeathSaves label:last-of-type button.active{
    border-color:#7e312b;
    background:#a84338;
}

.characterSheetRollHistoryHeading{
    display:flex;
    justify-content:space-between;
    margin-bottom:8px;
    color:#6e5435;
    font-size:10px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.characterSheetRollEntry{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:7px;
    align-items:center;
    padding:7px 0;
    border-top:1px solid rgba(111,83,45,.18);
}

.characterSheetRollEntry strong,
.characterSheetRollEntry small{
    display:block;
}

.characterSheetRollEntry strong{
    font-size:11px;
}

.characterSheetRollEntry small{
    overflow:hidden;
    color:#7e6a4d;
    font-size:9px;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.characterSheetRollEntry b{
    display:grid;
    place-items:center;
    min-width:36px;
    height:36px;
    border-radius:50%;
    color:#fff5db;
    background:#3e624e;
    font-family:"Georgia",serif;
}

.characterSheetRollEntry.critical b{
    color:#3d2a16;
    background:#d4a646;
}

.characterSheetRollEntry.fumble b{
    background:#9b3d34;
}

.characterSheetRollEmpty{
    color:#806f55;
    font-size:10px;
    line-height:1.5;
    text-align:center;
}

.partyCharacterActions .partyOpenSheetBtn{
    grid-column:1/-1;
    color:#fff3d5;
    border-color:#987440;
    background:linear-gradient(#4d735c,#2c4a38);
    font-weight:900;
}

.partyCharacterActions .partyOpenSheetBtn:hover{
    background:linear-gradient(#628a70,#395b46);
}

.partyCharacterActions .partyHomeBtn{
    color:#fff2cf;
    border-color:#9b7b43;
    background:linear-gradient(#84652f,#60481f);
    font-weight:900;
}

.partyCharacterActions .partyHomeBtn:disabled{
    color:#35503d;
    border-color:#879779;
    background:#dce6cf;
    opacity:1;
    cursor:default;
}

/* SRD item picker used by the interactive sheet */

#characterSheetItemBrowserWindow{
    z-index:79000;
    padding:calc(var(--real-header-height, 76px) + 34px) 28px 28px;
}

.characterSheetItemBrowserBox{
    display:flex;
    width:min(1280px,100%);
    height:min(790px,100%);
    margin:0 auto;
    overflow:hidden;
    flex-direction:column;
    border:1px solid #b08b4b;
    border-radius:14px;
    background:#e8dab8;
    box-shadow:0 28px 75px rgba(0,0,0,.72);
}

.characterSheetItemBrowserHeader{
    display:flex;
    gap:20px;
    align-items:center;
    justify-content:space-between;
    padding:16px 20px;
    color:#f5e8cc;
    border-bottom:2px solid #b78e49 !important;
    background:linear-gradient(#2e4437,#17261e) !important;
}

.characterSheetItemBrowserHeader span{
    color:#cdb681;
    font-size:10px;
    font-weight:900;
    letter-spacing:.1em;
    text-transform:uppercase;
}

.characterSheetItemBrowserHeader h2{
    margin:2px 0 3px;
    font-family:"Georgia",serif;
}

.characterSheetItemBrowserHeader p{
    margin:0;
    color:#d9cdb4;
    font-size:12px;
}

.characterSheetItemBrowserTabs{
    display:flex;
    gap:8px;
    padding:9px 18px;
    border-bottom:1px solid #967646;
    background:#bca574;
}

.characterSheetItemBrowserTabs button{
    min-height:34px;
    padding:7px 14px;
    border:1px solid #7e6237;
    border-radius:7px;
    color:#3c2b1e;
    background:#e9dab6;
    font-weight:900;
    cursor:pointer;
}

.characterSheetItemBrowserTabs button.active{
    color:#fff0ca;
    background:#294b37;
    box-shadow:inset 0 -3px #b79551;
}

#characterSheetOfficialItemPane{
    display:flex;
    min-height:0;
    flex:1;
    flex-direction:column;
}

#characterSheetOfficialItemPane.hidden{
    display:none!important;
}

.characterSheetManualItemPane{
    display:grid;
    gap:14px;
    padding:22px;
    overflow-y:auto;
    color:#4c3824;
}

.characterSheetManualItemPane>div:first-child span{
    color:#7b5c32;
    font-size:10px;
    font-weight:900;
    letter-spacing:.09em;
    text-transform:uppercase;
}

.characterSheetManualItemPane h3{
    margin:3px 0;
    color:#294936;
    font:700 24px Georgia,serif;
}

.characterSheetManualItemPane p{
    margin:0;
    color:#6a573e;
}

.characterSheetManualItemGrid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
}

.characterSheetManualItemPane label{
    display:grid;
    gap:5px;
    color:#5c432b;
    font-size:10px;
    font-weight:900;
    text-transform:uppercase;
}

.characterSheetManualItemPane input,
.characterSheetManualItemPane select,
.characterSheetManualItemPane textarea{
    width:100%;
    min-width:0;
    box-sizing:border-box;
    padding:10px;
    border:1px solid #967442;
    border-radius:7px;
    color:#352519;
    background:#fff9e8;
    font:inherit;
    text-transform:none;
}

.characterSheetConfirmAddItem{
    justify-self:end;
    min-height:40px;
    padding:9px 15px;
    border:1px solid #967442;
    border-radius:7px;
    color:#fff0cd;
    background:#31543d;
    font-weight:900;
    cursor:pointer;
}

#closeCharacterSheetItemBrowser{
    width:42px;
    height:42px;
    border:1px solid #b16b5e;
    border-radius:8px;
    color:#ffe5dc;
    background:#642a25;
    font-size:19px;
    cursor:pointer;
}

.characterSheetItemBrowserTools{
    display:grid;
    grid-template-columns:minmax(240px,1fr) 210px auto;
    gap:12px;
    align-items:end;
    padding:13px 18px;
    border-bottom:1px solid #a48858;
    background:#d2be91;
}

.characterSheetItemBrowserTools label{
    display:grid;
    gap:5px;
    color:#60462d;
    font-size:10px;
    font-weight:900;
    text-transform:uppercase;
}

.characterSheetItemBrowserTools input,
.characterSheetItemBrowserTools select{
    height:40px;
    box-sizing:border-box;
    padding:0 10px;
    border:1px solid #937343;
    border-radius:6px;
    color:#332318;
    background:#fff9e9;
}

.characterSheetItemStatus{
    align-self:center;
    color:#6c573c;
    font-size:11px;
    font-weight:800;
}

.characterSheetItemBrowserLayout{
    display:grid;
    grid-template-columns:minmax(320px,.82fr) minmax(390px,1.18fr);
    min-height:0;
    flex:1;
}

.characterSheetItemResults{
    display:grid;
    align-content:start;
    gap:5px;
    min-height:0;
    padding:12px;
    overflow-y:auto;
    border-right:1px solid #9e8256;
    background:#c5b080;
}

.characterSheetItemResults>button{
    display:grid;
    gap:2px;
    padding:10px 12px;
    border:1px solid #9d8050;
    border-radius:7px;
    color:#38261a;
    background:#f5ead0;
    font:inherit;
    text-align:left;
    cursor:pointer;
}

.characterSheetItemResults>button:hover,
.characterSheetItemResults>button.active{
    border-color:#7b332a;
    background:#fff8e8;
    box-shadow:inset 4px 0 #7b332a;
}

.characterSheetItemResults span{
    color:#856643;
    font-size:9px;
    font-weight:900;
    text-transform:uppercase;
}

.characterSheetItemResults strong{
    font-family:"Georgia",serif;
    font-size:15px;
}

.characterSheetItemResults small{
    color:#746048;
    font-size:10px;
}

.characterSheetItemPreview{
    min-height:0;
    padding:24px;
    overflow-y:auto;
    color:#372519;
    background:
        linear-gradient(rgba(255,255,255,.3),rgba(255,255,255,.04)),
        #eadcba;
}

.characterSheetItemPreview.empty{
    display:grid;
    place-items:center;
    color:#7c6a4f;
    text-align:center;
}

.characterSheetItemPreview header{
    display:block;
    padding-bottom:13px;
    border-bottom:2px solid #835035 !important;
    background:transparent !important;
}

.characterSheetItemPreview header span{
    color:#81603b;
    font-size:10px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.characterSheetItemPreview h3{
    margin:3px 0;
    font-family:"Georgia",serif;
    font-size:27px;
}

.characterSheetItemPreview header p{
    margin:0;
    color:#766146;
}

.characterSheetItemPreviewFacts{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:8px;
    margin:16px 0;
}

.characterSheetItemPreviewFacts>div{
    display:grid;
    gap:3px;
    padding:10px;
    border:1px solid #ae9263;
    border-radius:6px;
    background:#fff6df;
}

.characterSheetItemPreviewFacts span{
    color:#856b49;
    font-size:9px;
    font-weight:900;
    text-transform:uppercase;
}

.characterSheetItemDescription{
    color:#574532;
    font-size:13px;
    line-height:1.65;
    white-space:pre-line;
}

.characterSheetConfirmAddItem{
    width:100%;
    margin-top:15px;
}

@media(max-width:1250px){
    .characterSheetWorkspace{
        grid-template-columns:270px minmax(0,1fr) 270px;
    }
    .characterSheetHeader{
        grid-template-columns:auto minmax(220px,1fr) auto auto auto auto;
    }
    .characterSheetActionCard{
        grid-template-columns:1fr;
    }
    .characterSheetActionValues{
        justify-content:flex-start;
    }
}

@media(max-width:980px){
    #interactiveCharacterSheetWindow{
        padding:0;
    }
    .interactiveCharacterSheetBox{
        overflow-y:auto;
    }
    #interactiveCharacterSheetContent{
        height:auto;
        min-height:100%;
    }
    .characterSheetHeader{
        grid-template-columns:auto minmax(230px,1fr) auto;
    }
    .characterSheetBackBtn{
        grid-row:1/3;
    }
    .characterSheetIdentity{
        grid-column:2;
    }
    .characterSheetRollMode{
        grid-column:2;
        grid-row:2;
        grid-template-columns:auto 150px;
        align-items:center;
    }
    .characterSheetPrintBtn{
        grid-column:3;
        grid-row:2;
        justify-self:start;
        margin-right:auto;
    }
    .characterSheetEditBtn:not(.characterSheetPrintBtn){
        grid-column:3;
        grid-row:3;
    }
    .characterSheetCloseBtn{
        grid-column:3;
        grid-row:1;
        justify-self:end;
    }
    .characterSheetWorkspace{
        display:grid;
        grid-template-columns:260px minmax(0,1fr);
    }
    .characterSheetStatistics,
    .characterSheetTabContent,
    .characterSheetRightRail{
        overflow:visible;
    }
    .characterSheetMain{
        min-height:820px;
    }
    .characterSheetRightRail{
        grid-column:1/-1;
        border-top:1px solid #9f8050;
        border-left:0;
    }
    .characterSheetVitals{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
    .characterSheetRollHistory{
        grid-column:1/-1;
    }
    .characterSheetItemBrowserTools{
        grid-template-columns:1fr 180px;
    }
    .characterSheetItemStatus{
        grid-column:1/-1;
    }
}

@media(max-width:700px){
    #interactiveCharacterSheetWindow,
    #characterSheetItemBrowserWindow{
        padding:0;
    }
    .interactiveCharacterSheetBox,
    .characterSheetItemBrowserBox{
        width:100%;
        height:100%;
        border:0;
        border-radius:0;
    }
    .characterSheetHeader{
        grid-template-columns:1fr auto;
        padding:10px;
    }
    .characterSheetBackBtn{
        grid-column:1;
        grid-row:1;
        justify-self:start;
    }
    .characterSheetCloseBtn{
        grid-column:2;
        grid-row:1;
    }
    .characterSheetIdentity{
        grid-column:1/-1;
        grid-row:2;
    }
    .characterSheetRollMode{
        grid-column:1;
        grid-row:3;
    }
    .characterSheetEditBtn{
        grid-column:2;
        grid-row:3;
    }
    .characterSheetCombatSummary{
        grid-template-columns:repeat(2,1fr);
    }
    .characterSheetCombatSummary>*:last-child{
        grid-column:1/-1;
    }
    .characterSheetWorkspace{
        display:block;
    }
    .characterSheetStatistics{
        border-right:0;
        border-bottom:1px solid #a98a57;
    }
    .characterSheetAbilityGrid{
        grid-template-columns:repeat(3,1fr);
    }
    .characterSheetMain{
        min-height:0;
    }
    .characterSheetTabs{
        position:sticky;
        top:0;
        z-index:5;
    }
    .characterSheetTabContent{
        padding:14px;
    }
    .characterSheetRightRail{
        padding:12px;
    }
    .characterSheetVitals{
        grid-template-columns:1fr;
    }
    .characterSheetActionValues{
        display:grid;
        grid-template-columns:1fr 1fr;
    }
    .characterSheetInventoryItem{
        grid-template-columns:1fr auto;
    }
    .characterSheetInventoryBadges{
        grid-column:1;
    }
    .characterSheetQuantity{
        grid-column:2;
        grid-row:1/3;
    }
    .characterSheetInventoryActions{
        flex-wrap:wrap;
        justify-content:stretch;
    }
    .characterSheetInventoryActions button{
        flex:1 1 120px;
    }
    .characterSheetCurrency{
        grid-template-columns:repeat(3,1fr);
    }
    .characterSheetSpellStats{
        grid-template-columns:1fr;
    }
    .characterSheetItemBrowserHeader{
        padding:12px;
    }
    .characterSheetItemBrowserHeader p{
        display:none;
    }
    .characterSheetItemBrowserTools{
        grid-template-columns:1fr;
        padding:10px;
    }
    .characterSheetItemStatus{
        grid-column:auto;
    }
    .characterSheetItemBrowserLayout{
        display:flex;
        overflow-y:auto;
        flex-direction:column;
    }
    .characterSheetItemResults{
        flex:0 0 42%;
        min-height:260px;
        border-right:0;
        border-bottom:1px solid #9d8050;
    }
    .characterSheetItemPreview{
        flex:1 0 auto;
        overflow:visible;
    }
}

@media(max-width:440px){
    .characterSheetAbilityGrid{
        grid-template-columns:repeat(2,1fr);
    }
    .characterSheetIdentity img,
    .characterSheetPortraitFallback{
        flex-basis:52px;
        width:52px;
        height:52px;
    }
    .characterSheetIdentity h1{
        font-size:21px;
    }
    .characterSheetCombatSummary{
        grid-template-columns:1fr 1fr;
    }
    .characterSheetCurrency{
        grid-template-columns:repeat(2,1fr);
    }
    .characterSheetItemPreviewFacts{
        grid-template-columns:1fr;
    }
}
.characterCreatorSummary {
    padding: 28px 22px; text-align: center; color: #f2e5bb;
    background: radial-gradient(circle at top, rgba(113,146,94,.28), transparent 45%), linear-gradient(#243f31, #15281f);
    border-right: 3px double #9d8147;
}
.characterPortraitButton {
    width: 156px; height: 156px; margin: 0 auto 16px; padding: 0; overflow: hidden;
    display: grid; place-items: center; border-radius: 50%; cursor: pointer;
    border: 5px solid #b89950; outline: 2px solid #3a2c18; background: #d9c695;
    box-shadow: 0 12px 30px rgba(0,0,0,.38), inset 0 0 25px rgba(54,35,13,.35);
}
.characterPortraitButton img { width: 100%; height: 100%; object-fit: cover; }
#characterPortraitPlaceholder { font-size: 4rem; }
.characterCreatorSummary > strong { display: block; font-family: "Eagle Lake", Georgia, serif; font-size: 1.25rem; }
.characterCreatorSummary > span { display: block; margin-top: 6px; opacity: .78; }
.characterSummaryStats { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-top: 24px; }
.characterSummaryStats div { padding: 12px; border: 1px solid rgba(200,173,103,.45); border-radius: 10px; background: rgba(255,255,255,.06); }
.characterSummaryStats span { display: block; font-size: .68rem; text-transform: uppercase; letter-spacing: .11em; color: #cfb978; }
.characterSummaryStats b { display: block; margin-top: 3px; font-size: 1.3rem; }
.characterCreatorSteps { padding: 28px; overflow: auto; max-height: calc(100vh - 285px); }
.characterCreatorStep { max-width: 1050px; margin: 0 auto; }

.characterChoiceGrid.characterStepValidationError{
    padding:10px;
    border:2px solid #a6342d;
    border-radius:12px;
    background:rgba(166,52,45,.10);
    box-shadow:0 0 0 4px rgba(166,52,45,.10);
}
.characterStepHeading { display: flex; align-items: center; gap: 12px; border-bottom: 2px solid #9c814a; padding-bottom: 11px; margin-bottom: 22px; }
.characterStepHeading span { color: #886d34; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; font-size: .76rem; }
.characterStepHeading h3 { margin: 0; font-family: "Eagle Lake", Georgia, serif; color: #2b4f39; }
.characterStepHelp, .characterAutoCalcNote { color: #6c5a37; }
.characterFormGrid { display: grid; grid-template-columns: repeat(3, minmax(180px, 1fr)); gap: 16px; }
.characterFormGrid label,
.characterWideField,
.characterLongFields label,
.partyPdfReviewGrid label,
.partyPdfTextGrid label,
.partyPdfAbilityGrid label { display: grid; gap: 7px; font-weight: 700; color: #483b24; }
.characterFormGrid input,
.characterFormGrid select,
.characterWideField textarea,
.characterLongFields textarea,
.partyPdfReviewGrid input,
.partyPdfTextGrid textarea,
.partyPdfAbilityGrid input {
    width: 100%; border: 1px solid #a88f58; border-radius: 9px; padding: 11px 12px;
    background: rgba(255,253,240,.88); color: #261f15; font: inherit;
}
.characterAbilityGrid { display: grid; grid-template-columns: repeat(6, minmax(105px, 1fr)); gap: 14px; }
.characterAbilityGrid label {
    position: relative; display: grid; place-items: center; gap: 6px; padding: 14px 8px 12px;
    border: 2px solid #795f2f; border-radius: 46% 46% 16px 16px / 26% 26% 16px 16px;
    background: linear-gradient(#f8edc7, #d9c28d); box-shadow: inset 0 0 0 3px rgba(255,255,255,.35), 0 8px 18px rgba(74,51,17,.18);
}
.characterAbilityGrid label span { font-size: .68rem; text-transform: uppercase; color: #66522c; }
.characterAbilityGrid label b { font-family: "Eagle Lake", Georgia, serif; color: #234a35; }
.characterAbilityGrid input { width: 70px; text-align: center; font-size: 1.35rem; font-weight: 800; border: 1px solid #937942; border-radius: 9px; padding: 8px; }
.characterAbilityGrid small { font-size: 1.05rem; font-weight: 800; }
.characterChoiceGrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 9px; margin-bottom: 22px; }
.characterChoiceGrid.compact { grid-template-columns: repeat(6, 1fr); }
.characterChoiceGrid label { display: flex; align-items: center; gap: 8px; padding: 9px 11px; border-radius: 8px; background: rgba(105,81,39,.09); }
.characterChoiceGrid input { accent-color: #315a42; }
.characterLongFields { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.characterLongFields label:last-child { grid-column: 1 / -1; }
.characterReviewPanel { display: grid; gap: 16px; }
.characterReviewHero { display: grid; grid-template-columns: 100px 1fr; gap: 18px; align-items: center; padding: 18px; background: #e4d19e; border: 1px solid #a2874a; border-radius: 14px; }
.characterReviewHero img, .partyCharacterPortrait { width: 88px; height: 88px; object-fit: cover; border-radius: 50%; border: 3px solid #a48845; background: #d8c698; }
.characterReviewHero h3 { margin: 0 0 6px; color: #284d38; }
.characterReviewStatGrid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; }
.characterReviewStatGrid div { padding: 10px; text-align: center; border-radius: 9px; background: rgba(47,82,59,.1); border: 1px solid rgba(67,91,55,.24); }
.characterReviewSection { padding: 15px; border: 1px solid #ad9259; border-radius: 12px; background: rgba(255,250,228,.62); }
.characterReviewSection h4 { margin: 0 0 8px; color: #31563e; }
.characterCreatorFooter { display: flex; align-items: center; justify-content: space-between; padding: 16px 24px; background: #d2bb83; border-top: 2px solid #997b3d; }
.characterCreatorFooter > div { display: flex; gap: 10px; }
.characterCreatorFooter button,
.partyManagerToolbar button,
.partyCharacterActions button,
.partyPdfReviewActions button,
.encounterPartyHeading button { border: 1px solid #6d572d; border-radius: 9px; padding: 10px 15px; background: #315a42; color: #fff3cf; font-weight: 800; cursor: pointer; }
#characterCreatorCancelBtn, #characterCreatorBackBtn, #cancelPartyPdfReviewBtn { background: #e5d5aa; color: #493b22; }
.partyManagerToolbar { display: flex; gap: 10px; align-items: center; padding: 18px 24px; background: #ddc994; border-bottom: 1px solid #9f834a; }
.partyManagerToolbar input { min-width: 260px; flex: 1; padding: 11px 13px; border: 1px solid #a2874b; border-radius: 9px; background: #fffbea; }
.partyManagerStatus { display: flex; justify-content: space-between; padding: 10px 24px; color: #685636; background: #efe1ba; border-bottom: 1px solid #b49a62; }
.partyCharacterList { padding: 22px; display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 18px; overflow: auto; max-height: calc(100vh - 265px); }
.partyCharacterEmpty { grid-column: 1 / -1; padding: 70px 20px; text-align: center; border: 2px dashed #ab915b; border-radius: 16px; color: #6d5a37; }
.partyCharacterCard { overflow: hidden; border: 1px solid #9d8046; border-radius: 15px; background: rgba(255,249,225,.9); box-shadow: 0 12px 24px rgba(61,43,17,.18); }
.partyCharacterCardHeader { display: grid; grid-template-columns: 76px 1fr auto; gap: 13px; align-items: center; padding: 16px; background: linear-gradient(135deg, #294d39, #416a4e); color: #fff0c5; }
.partyCharacterCardHeader .partyCharacterPortrait { width: 70px; height: 70px; }
.partyCharacterCardHeader h3 { margin: 0 0 3px; }
.partyCharacterCardHeader p { margin: 0; opacity: .82; }
.partyOriginBadge { align-self: start; padding: 5px 8px; border-radius: 99px; font-size: .67rem; text-transform: uppercase; background: rgba(255,255,255,.14); }
.partyCharacterQuickStats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: #b09861; }
.partyCharacterQuickStats div { padding: 11px 6px; text-align: center; background: #f0e2ba; }
.partyCharacterQuickStats span { display: block; font-size: .65rem; text-transform: uppercase; color: #775f31; }
.partyCharacterQuickStats b { font-size: 1.1rem; color: #294d39; }
.partyCharacterMeta { padding: 12px 16px; color: #5f4c2c; min-height: 44px; }
.partyCharacterActions { display: flex; flex-wrap: wrap; gap: 7px; padding: 12px 14px 15px; border-top: 1px solid #c6af75; }
.partyCharacterActions button { padding: 8px 10px; font-size: .76rem; }
.partyCharacterActions .danger { background: #7c302b; }
.partyPdfReviewBox { min-height: auto; max-height: calc(100vh - var(--real-header-height, 76px) - 44px); overflow: auto; }
.partyPdfImportStatus { margin: 16px 22px 0; padding: 12px 14px; border-radius: 9px; background: #e7d8ac; color: #5e4b2b; }
.partyPdfImportStatus.error { background: #edc3ba; color: #7c2822; }
.partyPdfReviewGrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 13px; padding: 20px 22px 8px; }
.partyPdfAbilityGrid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; padding: 10px 22px; }
.partyPdfAbilityGrid label { text-align: center; }
.partyPdfAbilityGrid input { text-align: center; font-weight: 800; }
.partyPdfTextGrid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 13px; padding: 10px 22px 20px; }
.partyPdfReviewActions { display: flex; justify-content: space-between; padding: 16px 22px; background: #d5c18b; border-top: 1px solid #9f834b; }
.partyPdfReviewActions > div { display: flex; gap: 10px; }
.partyPdfViewerBox { height: calc(100vh - var(--real-header-height, 76px) - 44px); display: grid; grid-template-rows: auto 1fr; }
.partyPdfViewerHeader { padding: 14px 20px; }
#partyPdfViewerFrame { width: 100%; height: 100%; border: 0; background: #525659; }
.encounterPartyPicker { grid-column: 1 / -1; padding: 16px; border: 1px solid #8f7540; border-radius: 12px; background: linear-gradient(135deg, rgba(45,81,58,.12), rgba(200,174,105,.18)); }
.encounterPartyHeading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.encounterPartyHeading h3 { margin: 0; }
.encounterPartyHeading small { color: #6c5a38; }
#encounterPartyList { display: flex; gap: 10px; overflow-x: auto; padding-bottom: 5px; }
.encounterPartyCharacter { flex: 0 0 230px; display: grid; grid-template-columns: 48px 1fr auto; gap: 9px; align-items: center; padding: 10px; border-radius: 10px; background: #f3e4ba; border: 1px solid #ad9258; }
.encounterPartyCharacter img { width: 46px; height: 46px; object-fit: cover; border-radius: 50%; border: 2px solid #7f6937; background: #d3bf8a; }
.encounterPartyCharacter strong, .encounterPartyCharacter small { display: block; }
.encounterPartyCharacter small { color: #6c5936; }
.encounterPartyCharacter button { width: 32px; height: 32px; border-radius: 50%; border: 0; background: #315a42; color: white; cursor: pointer; }
.encounterDraftRow.playerEncounterDraft { border-color: #527b63; background: rgba(70,115,83,.12); }
.encounterDraftPartyBadge { display: inline-block; margin-left: 7px; padding: 2px 7px; border-radius: 99px; background: #315a42; color: #fff0c4; font-size: .65rem; text-transform: uppercase; }
#initiativeTable tr.combatantPlayer td:first-child { box-shadow: inset 4px 0 #4f9b69; }
#initiativeTable tr.combatantPlayer .combatantNameCell small { color: #397350; }
@media (max-width: 980px) {
    .characterCreatorBody { grid-template-columns: 1fr; }
    .characterCreatorSummary { display: grid; grid-template-columns: 110px 1fr; text-align: left; border-right: 0; border-bottom: 2px solid #9d8147; }
    .characterPortraitButton { width: 95px; height: 95px; grid-row: 1 / span 3; margin: 0; }
    .characterSummaryStats { grid-column: 2; grid-template-columns: repeat(4, 1fr); margin-top: 10px; }
    .characterAbilityGrid { grid-template-columns: repeat(3, 1fr); }
    .characterFormGrid, .partyPdfReviewGrid { grid-template-columns: repeat(2, 1fr); }
    .characterCreatorProgress button { font-size: 0; }
    .characterCreatorProgress button span { font-size: .8rem; margin: 0; }
}
@media (max-width: 650px) {
    #characterCreatorWindow, #partyManagerWindow, #partyPdfReviewWindow, #partyPdfViewerWindow { padding: 8px; }
    .characterCreatorBox, .partyManagerBox, .partyPdfReviewBox, .partyPdfViewerBox { width: 100%; border-radius: 12px; }
    .characterFormGrid, .characterLongFields, .partyPdfReviewGrid, .partyPdfTextGrid { grid-template-columns: 1fr; }
    .characterAbilityGrid, .partyPdfAbilityGrid { grid-template-columns: repeat(2, 1fr); }
    .characterChoiceGrid, .characterChoiceGrid.compact { grid-template-columns: repeat(2, 1fr); }
    .partyManagerToolbar { flex-wrap: wrap; }
    .partyManagerToolbar input { flex-basis: 100%; }
    .characterCreatorFooter { flex-wrap: wrap; gap: 10px; }
}

/* Interactive Character Creator v23 */
.characterPointBuyToolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 16px;padding:14px;border:1px solid #a98d50;border-radius:12px;background:linear-gradient(135deg,rgba(255,247,215,.92),rgba(218,194,137,.88))}.characterPointBudget{display:grid;grid-template-columns:auto auto;align-items:center;column-gap:12px;margin-right:auto;min-width:185px}.characterPointBudget span{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:#705b31}.characterPointBudget strong{grid-row:1/span 2;grid-column:2;font-size:2rem;color:#28533b}.characterPointBudget strong.invalid{color:#9b2f27}.characterPointBudget small{color:#725f38}.characterPointBuyToolbar button{border:1px solid #6d572d;border-radius:9px;padding:9px 12px;background:#315a42;color:#fff3cf;font-weight:800;cursor:pointer}.characterSpeciesBonusSummary{margin:0 0 12px;padding:9px 12px;border-left:4px solid #527c60;background:rgba(56,104,73,.09);color:#4f442d;font-weight:700}.characterFlexibleSpeciesBonuses{display:flex;align-items:end;gap:12px;flex-wrap:wrap;margin:0 0 16px;padding:12px;border:1px solid #a68a50;border-radius:10px;background:rgba(246,232,190,.72)}.characterFlexibleSpeciesBonuses strong{width:100%;color:#31563e}.characterFlexibleSpeciesBonuses label{display:grid;gap:5px;font-weight:700}.characterFlexibleSpeciesBonuses select{min-width:150px;padding:8px;border:1px solid #9f8246;border-radius:8px;background:#fff9e5}.characterPointBuyGrid label{border-radius:18px;padding:13px 8px}.characterAbilityAdjust{display:grid;grid-template-columns:32px 58px 32px;gap:5px;align-items:center}.characterAbilityAdjust button{width:32px;height:32px;border:1px solid #755d2d;border-radius:50%;background:#315a42;color:#fff4ca;font-size:1.15rem;font-weight:900;cursor:pointer}.characterAbilityAdjust button:disabled{opacity:.32;cursor:not-allowed}.characterPointBuyGrid .characterAbilityAdjust input{width:58px;padding:5px;font-size:1.1rem;background:#fff9e5}.characterPointBuyGrid label>strong[data-character-final-score]{font-size:1.7rem;color:#203f2e}.characterPointBuyGrid label>em{font-style:normal;font-weight:900;color:#704c20}.characterFormGrid input[readonly]{background:#e8ddbd;color:#4b422f;cursor:default}.characterCheckboxLine{display:flex;align-items:center;gap:9px;min-height:43px;padding:9px 11px;border:1px solid #a88f58;border-radius:9px;background:rgba(255,253,240,.88);font-weight:600}.characterCheckboxLine input{width:auto}.characterChoiceGrid label.backgroundSkill{background:rgba(49,90,66,.18);border:1px solid rgba(49,90,66,.35)}
#mapPinDeleteConfirmWindow{position:fixed;inset:0;z-index:2147483646;display:grid;place-items:center;padding:20px;background:rgba(8,10,9,.72);backdrop-filter:blur(4px)}#mapPinDeleteConfirmWindow.hidden{display:none!important}.mapPinDeleteConfirmBox{width:min(430px,92vw);padding:24px;border:2px solid #9c7a3f;border-radius:14px;background:linear-gradient(#f6e7bc,#d7bb7c);box-shadow:0 25px 70px rgba(0,0,0,.62);color:#352b1b}.mapPinDeleteConfirmBox h3{margin:0 0 9px;font-family:"Eagle Lake",Georgia,serif;color:#7c2823}.mapPinDeleteConfirmActions{display:flex;justify-content:flex-end;gap:10px}.mapPinDeleteConfirmActions button{border:1px solid #6c542c;border-radius:8px;padding:10px 15px;font-weight:800;cursor:pointer}.mapPinDeleteConfirmActions #confirmMapPinDeleteBtn{background:#8a3029;color:#fff}.mapPinDeleteConfirmActions #cancelMapPinDeleteBtn{background:#efe0b5;color:#40341f}


/* Character Creator reference cards and official SRD equipment browser v24 */
.characterSelectWithInfo{display:grid;grid-template-columns:minmax(0,1fr) 38px;gap:8px;align-items:center}.characterSelectWithInfo select{min-width:0;width:100%}.characterReferenceInfoBtn{height:38px;border:1px solid rgba(181,148,74,.75);border-radius:9px;background:linear-gradient(180deg,#536f59,#304a39);color:#f5deb0;font-weight:900;font-size:1.05rem;cursor:help;box-shadow:0 3px 8px rgba(0,0,0,.22)}.characterReferenceInfoBtn:hover,.characterReferenceInfoBtn:focus{filter:brightness(1.16);outline:2px solid rgba(224,190,112,.45)}
.characterOriginReferences{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:16px}.characterOriginReferenceCard{min-height:170px;padding:16px 17px;border:1px solid rgba(174,138,63,.62);border-radius:13px;background:linear-gradient(145deg,rgba(251,238,198,.96),rgba(221,198,142,.93));color:#2d2418;box-shadow:inset 0 0 0 2px rgba(91,62,25,.12),0 8px 20px rgba(0,0,0,.2)}.characterOriginReferenceCard header span,.characterReferenceTooltip header span{font-size:.72rem;letter-spacing:.11em;text-transform:uppercase;color:#75511f;font-weight:900}.characterOriginReferenceCard h4,.characterReferenceTooltip h4{font-family:"Eagle Lake",serif;margin:4px 0 8px;color:#243b2c}.characterOriginReferenceCard p,.characterReferenceTooltip p{margin:0 0 10px;line-height:1.48}.characterOriginReferenceCard ul,.characterReferenceTooltip ul{margin:0;padding-left:19px;line-height:1.48}.characterOriginReferenceCard small{display:block;margin-top:10px;color:#675b48}
.characterReferenceTooltip{position:fixed;z-index:2147483646;padding:16px 18px;border:2px solid #9d752d;border-radius:12px;background:linear-gradient(145deg,#f3e3b7,#d7bd7c);color:#281f13;box-shadow:0 18px 48px rgba(0,0,0,.48),inset 0 0 0 2px rgba(255,255,255,.23);pointer-events:auto}.characterReferenceTooltip.hidden{display:none!important}.characterReferenceTooltip small{color:#65543b}
.characterSrdEquipmentBrowser{margin-bottom:18px;padding:17px;border:1px solid rgba(187,151,69,.62);border-radius:15px;background:linear-gradient(145deg,rgba(25,46,33,.97),rgba(14,28,21,.97));box-shadow:inset 0 0 0 2px rgba(230,197,112,.06),0 12px 28px rgba(0,0,0,.26)}.characterEquipmentBrowserHeader{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:14px}.characterEquipmentBrowserHeader span:first-child{display:block;color:#d8b66b;font-size:.72rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.characterEquipmentBrowserHeader h4{margin:3px 0 5px;font-family:"Eagle Lake",serif;color:#f3dfab}.characterEquipmentBrowserHeader p{margin:0;color:#c8d2c8}.characterEquipmentStatus{max-width:300px;padding:7px 10px;border:1px solid rgba(196,161,82,.38);border-radius:999px;background:rgba(0,0,0,.2);color:#e0c988!important;font-size:.75rem!important;letter-spacing:0!important;text-transform:none!important;text-align:center}.characterEquipmentBrowserControls{display:grid;grid-template-columns:180px minmax(180px,.7fr) minmax(260px,1.3fr);gap:11px;align-items:end}.characterEquipmentBrowserControls label{display:grid;gap:5px;color:#e8d8a8;font-weight:800;font-size:.82rem}.characterEquipmentBrowserControls select,.characterEquipmentBrowserControls input{width:100%;min-width:0;padding:10px 11px;border:1px solid #8d7138;border-radius:9px;background:#f2e3ba;color:#261f15}.characterEquipmentDetail{margin-top:14px;min-height:190px;border:1px solid rgba(181,145,68,.7);border-radius:12px;background:linear-gradient(145deg,#f4e6c0,#ddc48a);color:#2b2216;overflow:hidden}.characterEquipmentDetail.empty{display:grid;place-items:center;padding:24px;text-align:center;color:#625540}.characterEquipmentDetail header{display:flex;justify-content:space-between;gap:15px;padding:15px 17px;border-bottom:1px solid rgba(96,64,27,.25);background:rgba(255,255,255,.18)}.characterEquipmentDetail header span{font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:#74531f;font-weight:900}.characterEquipmentDetail header h4{margin:3px 0 1px;font-family:"Eagle Lake",serif;color:#213b2b;font-size:1.18rem}.characterEquipmentDetail header p{margin:0}.characterEquipmentDetail header>b{align-self:flex-start;padding:5px 9px;border-radius:999px;background:#2e5940;color:#f5deb0;font-size:.75rem}.characterEquipmentMeta{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:0;border-bottom:1px solid rgba(96,64,27,.22)}.characterEquipmentMeta>div{padding:10px 13px;border-right:1px solid rgba(96,64,27,.17);border-bottom:1px solid rgba(96,64,27,.13)}.characterEquipmentMeta span{display:block;font-size:.68rem;text-transform:uppercase;letter-spacing:.08em;color:#785d32;font-weight:900}.characterEquipmentMeta strong{display:block;margin-top:2px;line-height:1.35}.characterEquipmentDescription{padding:15px 17px;line-height:1.55;max-height:220px;overflow:auto}.characterEquipmentActions{display:flex;justify-content:flex-end;gap:9px;flex-wrap:wrap;margin-top:12px}.characterEquipmentActions button{padding:9px 13px;border:1px solid #9d7a34;border-radius:9px;background:linear-gradient(180deg,#53745b,#304c3a);color:#f3dfae;font-weight:900}.characterEquipmentActions button:disabled{opacity:.4;cursor:not-allowed}.characterEquipmentActions #characterReloadEquipmentBtn{background:linear-gradient(180deg,#765c34,#49371f)}
@media(max-width:900px){.characterOriginReferences{grid-template-columns:1fr}.characterEquipmentBrowserControls{grid-template-columns:1fr}.characterEquipmentBrowserHeader{flex-direction:column}.characterEquipmentStatus{max-width:none}.characterEquipmentActions{justify-content:stretch}.characterEquipmentActions button{flex:1 1 160px}}

/* NPC interactive stat block, note sizing and encounter layout fixes v26 */
#editor.parchmentEditor{
    font-size:18px;
}

.npcCombatGrid{
    grid-template-columns:repeat(4,minmax(130px,1fr));
    align-items:start;
}

.npcCombatGrid label:first-child{
    position:relative;
}

.npcHpButtons{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:4px;
    margin-top:4px;
}

.npcHpButtons button,
.npcSectionHeading button{
    border:1px solid #68497a;
    border-radius:7px;
    background:linear-gradient(180deg,#80569a,#56366c);
    color:#fff;
    font-weight:900;
    cursor:pointer;
}

.npcHpButtons button{
    min-height:28px;
    padding:3px;
}

.npcDivider{
    height:4px;
    margin:20px 0 14px;
    border-top:1px solid #8c6ba0;
    border-bottom:1px solid #8c6ba0;
}

.npcAbilities{
    display:grid;
    grid-template-columns:repeat(6,minmax(88px,1fr));
    gap:10px;
}

.npcAbility{
    display:grid;
    grid-template-columns:1fr auto;
    grid-template-areas:"label roll" "score roll" "modifier roll";
    align-items:center;
    gap:2px 8px;
    padding:10px;
    border:2px solid #76518d;
    border-radius:11px;
    background:rgba(255,255,255,.48);
    text-align:center;
}

.npcAbility strong{grid-area:label;color:#56346f}
.npcAbilityScore{
    grid-area:score;
    width:100%;
    min-width:0;
    border:1px solid #896da0;
    border-radius:7px;
    background:#fff;
    color:#24182a;
    font-size:1.1rem;
    font-weight:900;
    text-align:center;
}
.npcAbilityModifier{grid-area:modifier;color:#56346f;font-weight:900}
.npcAbilityRollBtn{
    grid-area:roll;
    width:42px;
    height:42px;
    border:0;
    background:transparent;
    color:#fff;
    cursor:pointer;
}
.npcAbilityRollBtn .polyDie{transform:scale(.84)}

.npcDetailsGrid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:13px;
    margin-top:17px;
}

.npcSectionHeading{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px;
    border-bottom:2px solid #76518d;
}

.npcSectionHeading h2{
    flex:1;
    margin-bottom:0;
    border-bottom:0;
}

.npcSectionHeading button{
    padding:7px 11px;
}

.npcRichField{
    min-height:95px;
    padding:10px;
    white-space:pre-wrap;
}

.npcRichField.bigArea{min-height:145px}
.npcRichField:empty::before{content:attr(data-placeholder);color:#7a687f;font-style:italic;pointer-events:none}

#encounterBuilderWindow{
    top:var(--real-header-height,76px)!important;
    right:0!important;
    bottom:0!important;
    left:0!important;
    inset:var(--real-header-height,76px) 0 0!important;
    box-sizing:border-box!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:auto!important;
    padding:14px 20px 20px!important;
}

#encounterBuilderWindow.hidden{display:none!important}

.encounterBuilderBox{
    width:min(1380px,96vw)!important;
    height:min(790px,calc(100vh - var(--real-header-height,76px) - 28px))!important;
    min-height:420px!important;
    max-height:calc(100vh - var(--real-header-height,76px) - 28px)!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    margin:auto!important;
}

.encounterBuilderLayout{
    flex:1 1 auto!important;
    min-height:0!important;
    display:grid!important;
    grid-template-columns:minmax(260px,.9fr) minmax(360px,1.25fr) minmax(260px,.9fr)!important;
    grid-template-rows:auto minmax(0,1fr)!important;
    align-items:stretch!important;
    overflow:hidden!important;
}

.encounterPartyPicker{grid-column:1/-1!important}
.encounterMonsterPicker,.encounterDraftSection,.savedEncountersSection{min-height:0!important;overflow:hidden!important}
#encounterMonsterList,#encounterDraftList,#savedEncounterList{min-height:0!important;overflow-y:auto!important}

.characterReferenceHeading,
.characterReferenceTooltipHeading{
    position:static!important;
    display:block!important;
    width:auto!important;
    height:auto!important;
    min-height:0!important;
    padding:0!important;
    border:0!important;
    background:none!important;
    box-shadow:none!important;
}

.characterReferenceHeading span,
.characterReferenceTooltipHeading span{
    font-size:.72rem;
    letter-spacing:.11em;
    text-transform:uppercase;
    color:#75511f;
    font-weight:900;
}

.characterReferenceTooltip{
    max-height:min(520px,calc(100vh - 24px));
    overflow:auto;
}

@media(max-width:1100px){
    .encounterBuilderLayout{
        grid-template-columns:1fr 1fr!important;
        grid-template-rows:auto minmax(280px,1fr) minmax(240px,auto)!important;
        overflow-y:auto!important;
    }
    .savedEncountersSection{grid-column:1/-1}
}

@media(max-width:760px){
    .npcCombatGrid,.npcDetailsGrid{grid-template-columns:1fr 1fr}
    .npcAbilities{grid-template-columns:repeat(3,1fr)}
    .encounterBuilderBox{height:calc(100vh - var(--real-header-height,76px) - 14px)!important;min-height:0!important}
    .encounterBuilderLayout{grid-template-columns:1fr!important;grid-template-rows:auto!important;overflow-y:auto!important}
    .encounterPartyPicker,.savedEncountersSection{grid-column:1!important}
    .encounterMonsterPicker,.encounterDraftSection,.savedEncountersSection{min-height:300px!important}
}

@media(max-width:480px){
    .npcCombatGrid,.npcDetailsGrid{grid-template-columns:1fr}
    .npcAbilities{grid-template-columns:repeat(2,1fr)}
}

/* Character sheet, saving and spell-selection fixes v27 */
body > header{
    z-index:2147483644!important;
}

body > header .navModuleGroup,
body > header .navGroupMenu{
    z-index:2147483646!important;
}

#notification{
    z-index:2147483647!important;
}

.characterCreatorSaveStatus{
    display:block;
    margin-top:3px;
    color:#614d29;
    font-weight:800;
    font-size:.72rem;
}

.characterSpellPicker{
    margin:0 0 18px;
    padding:17px;
    border:1px solid rgba(117,90,155,.68);
    border-radius:15px;
    background:linear-gradient(145deg,rgba(35,29,53,.97),rgba(20,17,34,.97));
    color:#eee2ff;
    box-shadow:inset 0 0 0 2px rgba(224,198,255,.06),0 12px 28px rgba(0,0,0,.24);
}

.characterSpellPickerHeader{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
    margin-bottom:13px;
}

.characterSpellPickerHeader span:first-child{
    display:block;
    color:#cbb0ee;
    font-size:.72rem;
    font-weight:900;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.characterSpellPickerHeader h4{
    margin:3px 0 5px;
    color:#f1e6ff;
    font-family:"Eagle Lake",Georgia,serif;
}

.characterSpellPickerHeader p{margin:0;color:#c8bdd5}
#characterSpellStatus{padding:7px 10px;border:1px solid rgba(190,156,230,.42);border-radius:999px;background:rgba(0,0,0,.22);color:#dbc5f5;font-size:.75rem;font-weight:800}

.characterSpellPickerControls{
    display:grid;
    grid-template-columns:minmax(170px,.8fr) 150px minmax(230px,1.2fr) auto;
    gap:10px;
    align-items:end;
}

.characterSpellPickerControls label{
    display:grid;
    gap:5px;
    color:#e0d1f1;
    font-size:.82rem;
    font-weight:800;
}

.characterSpellPickerControls input,
.characterSpellPickerControls select{
    min-width:0;
    width:100%;
    padding:10px 11px;
    border:1px solid #8f72b1;
    border-radius:9px;
    background:#f4eafd;
    color:#261d32;
}

#characterAddSpellBtn{
    min-height:42px;
    padding:9px 15px;
    border:1px solid #b08ad7;
    border-radius:9px;
    background:linear-gradient(180deg,#74549a,#4c356b);
    color:#fff;
    font-weight:900;
    cursor:pointer;
    transition:transform .16s ease,filter .16s ease,box-shadow .16s ease;
}

#characterAddSpellBtn:hover:not(:disabled),
.characterEquipmentActions button:hover:not(:disabled),
.characterSheetAddItemBtn:hover,
.characterSheetConfirmAddItem:hover:not(:disabled){
    transform:translateY(-2px);
    filter:brightness(1.16);
    box-shadow:0 8px 18px rgba(0,0,0,.3);
}

#characterAddSpellBtn:disabled{opacity:.45;cursor:not-allowed}
#characterAddSpellBtn.added,
#characterAddAttackBtn.added,
#characterAddEquipmentBtn.added,
.characterSheetConfirmAddItem.added{background:linear-gradient(180deg,#4d8a60,#2e5d3e)!important}
#characterSpellDetail{margin:11px 0 0;color:#d7c9e4;font-size:.82rem}

.characterSheetPortraitButton{
    position:relative;
    width:88px;
    height:88px;
    padding:0;
    overflow:hidden;
    border:3px solid #a48845;
    border-radius:50%;
    background:#d8c698;
    color:#2f4936;
    cursor:pointer;
    flex:0 0 auto;
}

.characterSheetPortraitButton img,
.characterSheetPortraitButton .characterSheetPortraitFallback{
    width:100%;
    height:100%;
    display:grid;
    place-items:center;
    object-fit:cover;
    border:0;
    border-radius:50%;
}

.characterSheetPortraitButton small{
    position:absolute;
    inset:auto 0 0;
    padding:4px 2px 6px;
    background:rgba(18,31,23,.82);
    color:#fff0c5;
    font-size:.62rem;
    font-weight:900;
    opacity:0;
    transition:opacity .16s ease;
}

.characterSheetPortraitButton:hover small,
.characterSheetPortraitButton:focus-visible small{opacity:1}

.npcParsedRolls{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    min-height:0;
}

.npcParsedRolls button{
    padding:6px 9px;
    border:1px solid #76518d;
    border-radius:999px;
    background:linear-gradient(180deg,#815b98,#5d3e72);
    color:#fff;
    font-size:.75rem;
    font-weight:900;
    cursor:pointer;
    transition:transform .15s ease,filter .15s ease;
}

.npcParsedRolls button:hover{transform:translateY(-1px);filter:brightness(1.14)}

.npcCustomBadge{
    display:inline-flex;
    vertical-align:middle;
    margin-left:8px;
    padding:4px 8px;
    border:1px solid rgba(255,232,177,.72);
    border-radius:999px;
    background:linear-gradient(180deg,#6c4630,#3d2518);
    color:#fff0c2;
    font:900 11px/1.1 Arial,sans-serif;
    letter-spacing:.08em;
    text-transform:uppercase;
}

@media(max-width:900px){
    .characterSpellPickerHeader{flex-direction:column}
    .characterSpellPickerControls{grid-template-columns:1fr 1fr}
}

@media(max-width:560px){
    .characterSpellPickerControls{grid-template-columns:1fr}
}

/* =========================================================
   v29 — final usability and interface polish
   ========================================================= */

/* Scrollable Treasure Generator: the Generate button can never be clipped. */
#lootGeneratorWindow{
    align-items:center!important;
    overflow:hidden!important;
}

.lootGeneratorBox{
    width:min(920px,calc(100vw - 32px))!important;
    height:min(860px,calc(100vh - var(--real-header-height,76px) - 28px))!important;
    max-height:calc(100vh - var(--real-header-height,76px) - 28px)!important;
    display:flex!important;
    flex-direction:column!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain;
    scrollbar-gutter:stable;
}

.lootGeneratorHeader{
    top:0!important;
    z-index:20!important;
}

.lootOpen5eSearch{
    flex:0 0 auto;
    margin:18px 22px 0!important;
}

.lootGeneratorForm{flex:0 0 auto}

.lootGeneratorActions{
    position:sticky;
    bottom:0;
    z-index:20;
    margin-top:auto;
    padding:14px 22px 18px!important;
    border-top:1px solid rgba(189,162,103,.52);
    background:linear-gradient(180deg,rgba(22,35,27,.96),#101a14);
    box-shadow:0 -9px 22px rgba(0,0,0,.3);
}

/* Quick tools can be collapsed, while notes and Initiative reserve safe space. */
#floatingToolDock{
    align-items:flex-end;
    transition:transform .18s ease,opacity .18s ease;
}

#floatingToolDock .floatingToolDockToggle{
    width:34px!important;
    min-height:34px!important;
    height:34px;
    padding:0;
    display:grid;
    place-items:center;
    border-radius:50%!important;
    background:linear-gradient(180deg,#b78a43,#71501f)!important;
    color:#fff6d7;
    font-size:24px!important;
    line-height:1;
}

#floatingToolDock.collapsed > button:not(.floatingToolDockToggle){display:none}
#floatingToolDock.collapsed{gap:0}

#editor[data-panel-type="empty"]{
    padding-right:118px!important;
    overflow-wrap:anywhere;
    word-break:break-word;
}

#initiativeTracker .initiativeTablePane{
    width:100%!important;
    margin-right:0;
    padding-right:0;
    box-sizing:border-box;
    overflow-x:auto!important;
    overflow-y:visible!important;
}

#initiativeTable th:last-child,
#initiativeTable td:last-child{
    position:static!important;
    right:auto!important;
    z-index:auto!important;
    width:65px!important;
    min-width:65px!important;
    box-shadow:none!important;
}

#initiativeTable th:last-child{
    background:linear-gradient(180deg,#35533f,#22382a)!important;
}

#initiativeTable .removeCombatantBtn{
    width:38px!important;
    height:38px!important;
    display:grid!important;
    place-items:center!important;
    margin:auto!important;
    border:1px solid #e28c78!important;
    border-radius:9px!important;
    background:linear-gradient(180deg,#9b3b31,#651f1a)!important;
    box-shadow:0 4px 9px rgba(66,20,15,.25)!important;
}

/* Character portrait is a viewer on the finished sheet; replacement stays in Edit Character. */
.characterSheetPortraitButton{cursor:zoom-in!important}
.characterSheetPortraitButton small{opacity:.88}

/* Fullscreen map marker layers and a permanently visible close control. */
.mapPinBox{position:relative!important}

#closeMapPinWindow{
    position:absolute!important;
    top:12px!important;
    right:12px!important;
    z-index:30!important;
    display:grid!important;
    place-items:center!important;
    box-shadow:0 5px 14px rgba(0,0,0,.45)!important;
}

.mapPinHeader{padding-right:70px!important}

.dm-map-viewport:fullscreen > #mapPinWindow,
.dm-map-viewport:-webkit-full-screen > #mapPinWindow{
    position:fixed!important;
    inset:0!important;
    z-index:2147483600!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:auto!important;
    background:rgba(3,6,4,.78)!important;
}

.dm-map-viewport:fullscreen > #mapPinWindow.hidden,
.dm-map-viewport:-webkit-full-screen > #mapPinWindow.hidden{display:none!important}

.dm-map-viewport:fullscreen > #mapPinDeleteConfirmWindow,
.dm-map-viewport:-webkit-full-screen > #mapPinDeleteConfirmWindow{
    position:fixed!important;
    inset:0!important;
    z-index:2147483646!important;
    display:grid!important;
    place-items:center!important;
    overflow:auto!important;
    background:rgba(3,6,4,.86)!important;
}

.dm-map-viewport:fullscreen > #mapPinDeleteConfirmWindow.hidden,
.dm-map-viewport:-webkit-full-screen > #mapPinDeleteConfirmWindow.hidden{display:none!important}

/* Larger Encounter Builder with three genuinely usable work columns. */
#encounterBuilderWindow{
    padding:9px 12px 12px!important;
    align-items:center!important;
    overflow:hidden!important;
}

.encounterBuilderBox{
    width:min(1680px,calc(100vw - 24px))!important;
    height:calc(100vh - var(--real-header-height,76px) - 20px)!important;
    max-height:none!important;
    min-height:560px!important;
}

.encounterBuilderLayout{
    grid-template-columns:minmax(350px,1fr) minmax(430px,1.16fr) minmax(340px,.96fr)!important;
    grid-template-rows:minmax(118px,150px) minmax(0,1fr)!important;
    gap:16px!important;
    padding:16px!important;
}

.encounterPartyPicker{
    min-height:0!important;
    overflow:hidden!important;
    padding:13px 16px!important;
}

#encounterPartyList{
    display:flex!important;
    align-items:stretch!important;
    gap:9px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    padding:4px 2px 9px!important;
}

#encounterPartyList .encounterPartyCharacter{
    flex:0 0 min(290px,75vw);
}

.encounterMonsterPicker,
.encounterDraftSection,
.savedEncountersSection{
    display:flex!important;
    flex-direction:column!important;
    min-width:0!important;
    min-height:0!important;
    padding:17px!important;
}

#encounterMonsterList,
#encounterDraftList,
#savedEncounterList{
    flex:1 1 0!important;
    min-height:180px!important;
    max-height:none!important;
    overflow-y:auto!important;
    scrollbar-gutter:stable;
}

/* Compact, grouped Initiative toolbar and clearer action hierarchy. */
#initiativeTracker .trackerToolbar{
    position:relative!important;
    top:auto!important;
    display:grid!important;
    grid-template-columns:repeat(5,minmax(118px,1fr))!important;
    gap:8px!important;
    padding:10px!important;
    border:1px solid rgba(189,162,103,.72)!important;
    border-radius:10px!important;
    background:linear-gradient(180deg,#24372c,#121f18)!important;
}

#initiativeTracker #roundCounter{top:0!important}

#initiativeTracker .trackerToolbar button{
    min-width:0!important;
    min-height:43px!important;
    padding:8px 10px!important;
    border:1px solid rgba(201,177,112,.55)!important;
    border-radius:8px!important;
    background:linear-gradient(180deg,#496654,#2b4434)!important;
    color:#fff4d4!important;
    font-size:12px!important;
    font-weight:850!important;
    letter-spacing:.01em!important;
    box-shadow:inset 0 1px rgba(255,255,255,.1),0 4px 9px rgba(0,0,0,.22)!important;
}

#initiativeTracker .trackerToolbar button::before{content:none!important}
#initiativeTracker #addCombatantBtn{background:linear-gradient(180deg,#4f7d5c,#2e533a)!important}
#initiativeTracker #nextTurnBtn{background:linear-gradient(180deg,#b47b2f,#744717)!important;border-color:#e3bc76!important}
#initiativeTracker #newRoundBtn{background:linear-gradient(180deg,#456f8d,#294c65)!important}
#initiativeTracker #openCombatLogBtn,
#initiativeTracker #saveCombatStateBtn{background:linear-gradient(180deg,#6d5a3f,#41321f)!important}
#initiativeTracker #endEncounterBtn,
#initiativeTracker #resetInitiativeBtn{background:linear-gradient(180deg,#8c4137,#5d241f)!important}

#initiativeTracker .trackerToolbar button:hover{
    transform:translateY(-1px)!important;
    filter:brightness(1.14)!important;
    box-shadow:0 7px 14px rgba(0,0,0,.3)!important;
}

#initiativeTable{min-width:1560px!important}
#initiativeTable th:nth-child(5){width:238px!important}

#initiativeTable .combatStateButtons{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:6px!important;
}

#initiativeTable .combatStateButtons button{
    min-width:0!important;
    min-height:36px!important;
    padding:6px 7px!important;
    border:1px solid #8c744f!important;
    border-radius:7px!important;
    background:linear-gradient(180deg,#f5e8c8,#d8c294)!important;
    color:#382719!important;
    font-size:10px!important;
    font-weight:900!important;
    line-height:1.15!important;
    box-shadow:0 2px 5px rgba(49,32,17,.14)!important;
}

#initiativeTable .combatStateButtons .combatRollBtn{
    background:linear-gradient(180deg,#5a745f,#344d3b)!important;
    border-color:#77917a!important;
    color:#fff2d2!important;
}

#initiativeTable .combatStateButtons .combatantInitiativeRollBtn{
    background:linear-gradient(180deg,#4c7794,#2e526b)!important;
    color:#eef9ff!important;
}

#initiativeTable .combatStateButtons .combatantHpHealRollBtn{
    background:linear-gradient(180deg,#4f8a5f,#2e5f3d)!important;
    border-color:#83ad78!important;
}

#initiativeTable .combatStateButtons .combatantHpDamageRollBtn{
    background:linear-gradient(180deg,#8a5144,#603229)!important;
    border-color:#a86e60!important;
}

#initiativeTable .combatManagerHp{position:relative;}

.hpDeltaFloat{
    position:absolute;
    left:50%;
    top:-10px;
    z-index:6;
    transform:translate(-50%,0);
    pointer-events:none;
    padding:2px 8px;
    border-radius:999px;
    border:1px solid rgba(255,245,210,.75);
    color:#fff9de;
    font-size:13px;
    font-weight:950;
    text-shadow:0 1px 3px rgba(0,0,0,.7);
    box-shadow:0 5px 12px rgba(0,0,0,.32);
    animation:hpDeltaFloat 1.45s ease-out forwards;
}

.hpDeltaFloat.healing{background:linear-gradient(180deg,#4c9d5f,#27613a);}
.hpDeltaFloat.damage{background:linear-gradient(180deg,#b24d3e,#6c251d);}

@keyframes hpDeltaFloat{
    0%{opacity:0;transform:translate(-50%,4px) scale(.9)}
    15%{opacity:1;transform:translate(-50%,0) scale(1)}
    100%{opacity:0;transform:translate(-50%,32px) scale(.96)}
}

#initiativeTable .combatStateButtons .defeatedBtn{
    grid-column:1/-1;
    background:linear-gradient(180deg,#6b5b49,#493b2f)!important;
    color:#fff0d3!important;
}

#initiativeTable .combatStateButtons .defeatedBtn.active{
    background:linear-gradient(180deg,#8f3931,#63231f)!important;
    color:#fff!important;
}

#initiativeTable .combatStateButtons button:hover{filter:brightness(1.1);transform:translateY(-1px)}

/* Premium fantasy dice console. */
#quickDiceWindow{
    padding:12px!important;
    background:
        radial-gradient(circle at 50% 38%,rgba(111,73,35,.28),transparent 38%),
        linear-gradient(180deg,rgba(8,12,9,.82),rgba(3,5,4,.94))!important;
    backdrop-filter:blur(5px)!important;
}

.quickDiceBox{
    gap:9px!important;
    padding:10px!important;
    border:1px solid #c29a55!important;
    border-radius:18px!important;
    background:
        linear-gradient(135deg,rgba(255,255,255,.08),transparent 16%),
        repeating-linear-gradient(5deg,#4b2816 0 5px,#3b1e11 5px 10px,#552e19 10px 15px)!important;
    box-shadow:
        0 0 0 4px #150b07,
        0 0 0 6px rgba(196,151,77,.72),
        0 30px 90px rgba(0,0,0,.8),
        inset 0 1px rgba(255,230,183,.3),
        inset 0 0 35px rgba(0,0,0,.45)!important;
    filter:none!important;
}

.diceTrayHeader{
    position:relative!important;
    inset:auto!important;
    z-index:30!important;
    width:auto!important;
    height:auto!important;
    flex:0 0 58px;
    display:grid;
    grid-template-columns:42px minmax(0,1fr) 40px;
    align-items:center;
    gap:10px;
    padding:6px 8px 7px!important;
    border:1px solid rgba(221,180,103,.58)!important;
    border-radius:11px!important;
    background:linear-gradient(180deg,rgba(30,48,37,.97),rgba(15,28,20,.98));
    box-shadow:inset 0 1px rgba(255,255,255,.08),0 5px 12px rgba(0,0,0,.35)!important;
}

.diceTrayHeader::before,.diceTrayHeader::after{display:none!important;content:none!important}

.diceTrayHeaderEmblem{
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    border:1px solid #c9a35f;
    border-radius:50%;
    background:radial-gradient(circle,#836229,#39270f);
    color:#ffe3a0;
    font-size:20px;
    box-shadow:0 0 12px rgba(218,177,93,.28);
}

.diceTrayHeader h2{
    margin:0;
    color:#f5ddb0;
    font:700 20px Georgia,"Times New Roman",serif;
    letter-spacing:.04em;
}

.diceTrayHeader p{
    margin:2px 0 0;
    color:#bfcabf;
    font-size:11px;
}

.diceTrayHeader .diceTrayClose{
    position:static!important;
    width:36px!important;
    height:36px!important;
    justify-self:end;
    border-color:#a87c55!important;
    background:linear-gradient(180deg,#7f3b31,#4f201b)!important;
}

.diceRollTray{
    border:2px solid #bc8744!important;
    border-radius:14px!important;
    background:
        radial-gradient(circle at 50% 58%,rgba(48,91,60,.34),transparent 48%),
        linear-gradient(145deg,#172b20,#09150e)!important;
    box-shadow:
        inset 0 0 0 5px #321a0e,
        inset 0 0 0 7px rgba(207,155,78,.48),
        inset 0 0 38px rgba(0,0,0,.72),
        0 6px 15px rgba(0,0,0,.45)!important;
}

.diceFooterDock{
    width:100%!important;
    margin:0!important;
    border-radius:11px!important;
    background:linear-gradient(180deg,#352115,#1b110c)!important;
}

.diceResultActions{grid-column:1/-1!important}

@media(max-width:1280px){
    .encounterBuilderLayout{
        grid-template-columns:1fr 1fr!important;
        grid-template-rows:auto minmax(360px,1fr) minmax(280px,auto)!important;
        overflow-y:auto!important;
    }
    .encounterPartyPicker,.savedEncountersSection{grid-column:1/-1!important}
    .encounterBuilderBox{min-height:0!important}
    #initiativeTracker .trackerToolbar{grid-template-columns:repeat(3,minmax(118px,1fr))!important}
}

@media(max-width:760px){
    #editor[data-panel-type="empty"]{padding-right:74px!important}
    #initiativeTracker .trackerToolbar{grid-template-columns:1fr 1fr!important}
    .encounterBuilderLayout{grid-template-columns:1fr!important;grid-template-rows:auto!important}
    .encounterPartyPicker,.savedEncountersSection{grid-column:1!important}
    .encounterMonsterPicker,.encounterDraftSection,.savedEncountersSection{min-height:360px!important}
    .diceTrayHeader{grid-template-columns:36px minmax(0,1fr) 36px;flex-basis:54px}
    .diceTrayHeaderEmblem{width:32px;height:32px}
    .diceTrayHeader h2{font-size:17px}
    .diceTrayHeader p{display:none}
    .quickDiceBox{padding:6px!important;border-radius:12px!important}
}

/* =========================================================
   v30 — critical navigation and modal fixes
   ========================================================= */
#panelImageViewer{
    z-index:2147483647!important;
    isolation:isolate!important;
}

#initiativeTracker .initiativeTablePane{
    max-width:100%!important;
    padding-bottom:18px!important;
    scrollbar-gutter:stable;
}

#initiativeTable{margin-bottom:6px!important}

.questRelationField{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:6px;
}

.questRelationLabel{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    color:#682f1c;
    font-weight:800;
}

.questRelationLabel button{
    width:30px;
    height:30px;
    display:grid;
    place-items:center;
    padding:0;
    border:1px solid #7b5830;
    border-radius:50%;
    background:linear-gradient(180deg,#4f7659,#2e503a);
    color:#fff4d5;
    font-size:18px;
    font-weight:900;
    cursor:pointer;
}

.questRelationLabel button:hover{filter:brightness(1.14);transform:translateY(-1px)}
.questRelationField select{width:100%;min-height:145px}

/* =========================================================
   v31 — fullscreen marker deletion and standalone dice tray
   ========================================================= */
#mapPinWindow.fullscreenMapOverlay,
#mapPinDeleteConfirmWindow.fullscreenMapOverlay{
    position:fixed!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    margin:0!important;
    isolation:isolate!important;
}

#mapPinWindow.fullscreenMapOverlay{
    z-index:2147483645!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:auto!important;
    background:rgba(3,6,4,.82)!important;
}

#mapPinDeleteConfirmWindow.fullscreenMapOverlay{
    z-index:2147483647!important;
    display:grid!important;
    place-items:center!important;
    overflow:auto!important;
    background:rgba(3,5,4,.94)!important;
}

#mapPinWindow.fullscreenMapOverlay.hidden,
#mapPinDeleteConfirmWindow.fullscreenMapOverlay.hidden{
    display:none!important;
}

#mapPinDeleteConfirmWindow.fullscreenMapOverlay .mapPinDeleteConfirmBox{
    position:relative!important;
    z-index:2!important;
}

#quickDiceWindow{
    display:grid!important;
    place-items:center!important;
    padding:12px!important;
    background:rgba(3,5,4,.74)!important;
    backdrop-filter:blur(4px)!important;
}

#quickDiceWindow.hidden{display:none!important}

.quickDiceBox{
    position:relative!important;
    gap:8px!important;
    padding:9px!important;
    overflow:visible!important;
    border:1px solid #73766f!important;
    border-radius:16px!important;
    background:
        linear-gradient(145deg,rgba(255,255,255,.07),transparent 18%),
        repeating-linear-gradient(4deg,#292d2b 0 5px,#202321 5px 10px,#303431 10px 15px)!important;
    box-shadow:
        0 0 0 4px #0b0d0c,
        0 0 0 6px rgba(142,140,125,.66),
        0 30px 90px rgba(0,0,0,.82),
        inset 0 1px rgba(255,255,255,.16),
        inset 0 0 32px rgba(0,0,0,.55)!important;
}

.quickDiceBox > .diceTrayClose{
    position:absolute!important;
    top:-12px!important;
    right:-12px!important;
    z-index:60!important;
    width:38px!important;
    height:38px!important;
    display:grid!important;
    place-items:center!important;
    border:1px solid #99988e!important;
    border-radius:50%!important;
    background:linear-gradient(180deg,#414743,#1d211f)!important;
    color:#fff6dc!important;
    box-shadow:0 6px 16px rgba(0,0,0,.62)!important;
}

.quickDiceBox > .diceTrayClose:hover{
    filter:brightness(1.25)!important;
    transform:scale(1.06)!important;
}

.diceRollTray{
    flex:1 1 auto!important;
    min-height:0!important;
    border:2px solid #777a73!important;
    border-radius:12px!important;
    background:
        radial-gradient(circle at 50% 58%,rgba(126,17,43,.30),transparent 48%),
        linear-gradient(145deg,#4c0d20,#210610)!important;
    box-shadow:
        inset 0 0 0 5px #151816,
        inset 0 0 0 7px rgba(142,140,125,.55),
        inset 0 0 38px rgba(0,0,0,.75),
        0 6px 15px rgba(0,0,0,.48)!important;
}

.diceFooterDock{
    flex:0 0 auto!important;
    width:100%!important;
    margin:0!important;
    border:1px solid #696d67!important;
    border-radius:10px!important;
    background:linear-gradient(180deg,#242826,#111412)!important;
    box-shadow:inset 0 1px rgba(255,255,255,.08),0 4px 12px rgba(0,0,0,.46)!important;
}

.diceControlBar{
    border-color:rgba(154,157,147,.42)!important;
    background:linear-gradient(180deg,rgba(40,45,42,.94),rgba(18,21,19,.98))!important;
}

.diceSecondaryAction{
    border-color:#7e827a!important;
    background:linear-gradient(180deg,#484d49,#252925)!important;
}

.dicePrimaryAction{
    border-color:#d0a660!important;
    background:linear-gradient(180deg,#8b662f,#4c3518)!important;
}

@media(max-width:760px){
    #quickDiceWindow{padding:7px!important}
    .quickDiceBox{padding:6px!important;border-radius:12px!important}
    .quickDiceBox > .diceTrayClose{top:-7px!important;right:-7px!important}
}

/* =========================================================
   v32 — inline fullscreen marker confirmation
   ========================================================= */
.mapPinBox > #mapPinDeleteConfirmWindow{
    position:absolute!important;
    inset:0!important;
    z-index:2147483647!important;
    width:100%!important;
    height:100%!important;
    display:grid!important;
    place-items:center!important;
    padding:18px!important;
    overflow:auto!important;
    border-radius:inherit!important;
    background:rgba(8,10,9,.92)!important;
    backdrop-filter:blur(5px)!important;
    box-sizing:border-box!important;
    isolation:isolate!important;
}

.mapPinBox > #mapPinDeleteConfirmWindow.hidden{
    display:none!important;
}

.mapPinBox > #mapPinDeleteConfirmWindow .mapPinDeleteConfirmBox{
    position:relative!important;
    z-index:2!important;
    width:min(430px,100%)!important;
    box-sizing:border-box!important;
}

/* =========================================================
   v33 — official SRD XP and class level-up
   ========================================================= */
.characterSheetProgression{
    display:grid;
    grid-template-columns:minmax(210px,.75fr) minmax(220px,1.5fr) auto;
    align-items:center;
    gap:16px;
    padding:10px 16px;
    border-bottom:1px solid #8d733f;
    background:linear-gradient(180deg,#e8d9b5,#cfb77f);
    color:#302518;
}

.characterSheetProgression.ready{
    background:linear-gradient(180deg,#dce8c9,#b8cb94);
    box-shadow:inset 0 0 24px rgba(66,108,62,.20);
}

.characterSheetProgressionInfo{
    display:grid;
    grid-template-columns:auto auto;
    align-items:end;
    gap:1px 10px;
}

.characterSheetProgressionInfo span{
    grid-column:1/-1;
    color:#73572a;
    font-size:9px;
    font-weight:900;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.characterSheetProgressionInfo strong{
    font:700 21px Georgia,serif;
    color:#243a2c;
}

.characterSheetProgressionInfo small{
    align-self:center;
    color:#67553a;
    font-weight:700;
}

.characterSheetXpBar{
    height:14px;
    overflow:hidden;
    border:1px solid #785f35;
    border-radius:999px;
    background:#5b4a32;
    box-shadow:inset 0 2px 5px rgba(0,0,0,.34);
}

.characterSheetXpBar i{
    display:block;
    width:0;
    height:100%;
    border-radius:inherit;
    background:linear-gradient(90deg,#477451,#84a962);
    box-shadow:inset 0 1px rgba(255,255,255,.34),0 0 11px rgba(83,139,78,.45);
    transition:width .3s ease;
}

.characterSheetProgression.ready .characterSheetXpBar i{
    background:linear-gradient(90deg,#9a6a23,#e1b753);
}

.characterSheetXpControls{
    display:grid;
    grid-template-columns:112px auto auto;
    gap:7px;
    align-items:end;
}

.characterSheetXpAmountLabel{
    display:grid;
    gap:3px;
    color:#684f28;
    font-size:9px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.characterSheetXpControls input,
.characterSheetXpControls button{
    min-height:38px;
    border:1px solid #7c6034;
    border-radius:8px;
    font:inherit;
    font-weight:800;
}

.characterSheetXpControls input{
    width:100%;
    box-sizing:border-box;
    min-width:0;
    padding:0 8px;
    background:#fff8e3;
    color:#2e2418;
}

.characterSheetXpControls button{
    padding:7px 11px;
    cursor:pointer;
    background:linear-gradient(#526f57,#304b38);
    color:#fff1cc;
}

.characterSheetXpControls .characterSheetLevelUpBtn{
    border-color:#9a6b25;
    background:linear-gradient(#bd8d3d,#704819);
}

.characterSheetXpControls button:disabled{
    opacity:.42;
    cursor:not-allowed;
    filter:grayscale(.5);
}

#characterLevelUpWindow{
    position:fixed;
    inset:var(--real-header-height,76px) 0 0;
    z-index:2147483600;
    display:grid;
    place-items:center;
    padding:18px;
    overflow:auto;
    background:rgba(4,8,5,.88);
    backdrop-filter:blur(8px);
}

#characterLevelUpWindow.hidden{display:none!important}

.characterLevelUpBox{
    width:min(940px,96vw);
    max-height:calc(100vh - var(--real-header-height,76px) - 36px);
    display:flex;
    flex-direction:column;
    overflow:hidden;
    border:2px solid #b18b45;
    border-radius:18px;
    background:linear-gradient(145deg,#f4e7c3,#d9bf83);
    box-shadow:0 30px 90px rgba(0,0,0,.72),inset 0 0 0 3px rgba(83,57,24,.14);
    color:#2d2418;
}

.characterLevelUpHeader{
    position:static!important;
    inset:auto!important;
    z-index:auto!important;
    width:auto!important;
    height:auto!important;
    min-height:0!important;
    flex:0 0 auto!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 36px;
    align-items:center;
    justify-content:initial!important;
    gap:10px;
    padding:10px 14px!important;
    border-bottom:2px solid #b18b45!important;
    background:linear-gradient(135deg,#2d4936,#15271d)!important;
    box-shadow:none!important;
    color:#f8e5b5!important;
}

.characterLevelUpHeader::before,
.characterLevelUpHeader::after{
    display:none!important;
    content:none!important;
    background:none!important;
}

.characterLevelUpHeader span{
    color:#c8ad72;
    font-size:10px;
    font-weight:900;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.characterLevelUpHeader h2{
    margin:1px 0;
    color:#fff1c5;
    font:700 21px "Eagle Lake",Georgia,serif;
}

.characterLevelUpHeader p{
    margin:0;
    overflow:hidden;
    color:#cbd6c9;
    font-size:12px;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.characterLevelUpHeader button{
    width:36px;
    height:36px;
    border:1px solid #b17c5d;
    border-radius:9px;
    background:#672820;
    color:#fff0dc;
    font-size:19px;
    cursor:pointer;
}

.characterLevelUpBody{
    min-height:0;
    overflow:auto;
    padding:17px;
}

.characterLevelUpSummary{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:10px;
    margin-bottom:14px;
}

.characterLevelUpSummary>div{
    min-height:92px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:12px;
    border:1px solid #9d7b3e;
    border-radius:11px;
    background:rgba(255,249,225,.66);
    text-align:center;
}

.characterLevelUpSummary span,
.characterLevelUpSection>div>span{
    color:#795a25;
    font-size:9px;
    font-weight:900;
    letter-spacing:.12em;
    text-transform:uppercase;
}

.characterLevelUpSummary strong{margin:4px 0;color:#274432;font:700 20px Georgia,serif}
.characterLevelUpSummary small{color:#66563d;line-height:1.35}

.characterLevelUpSection{
    display:grid;
    grid-template-columns:minmax(230px,.8fr) minmax(300px,1.2fr);
    gap:18px;
    align-items:center;
    margin-top:12px;
    padding:15px;
    border:1px solid #a8894e;
    border-radius:12px;
    background:rgba(255,250,231,.52);
}

.characterLevelUpSection.hidden{display:none!important}
.characterLevelUpSection h3{margin:3px 0 5px;color:#2c4835;font-family:Georgia,serif}
.characterLevelUpSection p{margin:0;color:#66563d;line-height:1.42}

.characterLevelUpHpControls{
    display:grid;
    grid-template-columns:minmax(210px,1fr) auto;
    gap:9px;
    align-items:end;
}

.characterLevelUpHpControls label,
.characterLevelUpAsiControls label,
.characterLevelUpNotes{
    display:grid;
    gap:5px;
    color:#5c492d;
    font-size:11px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.06em;
}

.characterLevelUpHpControls select,
.characterLevelUpAsiControls select,
.characterLevelUpNotes textarea{
    width:100%;
    min-width:0;
    padding:10px;
    border:1px solid #8d6c35;
    border-radius:8px;
    background:#fff9e6;
    color:#2c2419;
    font:inherit;
    text-transform:none;
    letter-spacing:normal;
}

.characterLevelUpHpControls button{
    min-height:40px;
    padding:8px 13px;
    border:1px solid #8e6933;
    border-radius:8px;
    background:#3d6148;
    color:#fff1ca;
    font-weight:900;
    cursor:pointer;
}

.characterLevelUpHpControls button:disabled{opacity:.42;cursor:not-allowed}

.characterLevelUpHpResult{
    grid-column:1/-1;
    display:grid;
    grid-template-columns:auto auto;
    align-items:center;
    justify-content:center;
    gap:2px 12px;
    min-height:58px;
    padding:9px;
    border:1px solid #98733a;
    border-radius:9px;
    background:#2a4333;
    color:#f8e5b5;
}

.characterLevelUpHpResult span{font-size:10px;text-transform:uppercase;letter-spacing:.09em}
.characterLevelUpHpResult strong{font-size:22px}
.characterLevelUpHpResult small{grid-column:1/-1;color:#c7d2c6}

.characterLevelUpAsiControls{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
}

.characterLevelUpFooter{
    display:flex;
    justify-content:flex-end;
    gap:10px;
    padding:13px 18px;
    border-top:1px solid #9f7b40;
    background:#d1b676;
}

.characterLevelUpFooter button{
    min-height:42px;
    padding:9px 17px;
    border:1px solid #74582f;
    border-radius:8px;
    background:#eee0b9;
    color:#332719;
    font-weight:900;
    cursor:pointer;
}

.characterLevelUpFooter #confirmCharacterLevelUp{
    border-color:#b18b45;
    background:linear-gradient(#4f7659,#2d4d38);
    color:#fff2cd;
}

.characterSheetSpellSlots{
    margin-bottom:14px;
    overflow:hidden;
    border:1px solid #a4864d;
    border-radius:11px;
    background:#eadbb7;
}

.characterSheetSpellSlots header{
    display:flex!important;
    justify-content:space-between;
    padding:9px 12px!important;
    background:#2a4634!important;
    color:#f6e0aa!important;
}

.characterSheetSpellSlots>div{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(90px,1fr));
}

.characterSheetSpellSlots>div>div{
    display:grid;
    place-items:center;
    gap:3px;
    min-height:66px;
    padding:8px;
    border-right:1px solid rgba(105,78,37,.22);
}

.characterSheetSpellSlots span{color:#725a35;font-size:10px;font-weight:900;text-transform:uppercase}
.characterSheetSpellSlots strong{color:#294533;font-size:24px}
.characterSheetSpellSlots header span{color:#d3bd87}

.characterSheetClassResources{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-bottom:12px;
}

.characterSheetClassResources span{
    padding:7px 10px;
    border:1px solid #8c7242;
    border-radius:999px;
    background:#2f523b;
    color:#f6e0ad;
    font-weight:800;
}

.characterSheetOfficialFeatures{
    margin-bottom:14px;
    overflow:hidden;
    border:1px solid #a4864d;
    border-radius:11px;
    background:#eadbb7;
}

.characterSheetOfficialFeatures header{
    padding:11px 13px!important;
    background:#2a4634!important;
    color:#f6e0aa!important;
}

.characterSheetOfficialFeatures header span{font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:#cdb77e}
.characterSheetOfficialFeatures header h3{margin:2px 0 0;font-family:Georgia,serif}

.characterSheetOfficialFeatures>div{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
    gap:1px;
    background:rgba(122,93,46,.28);
}

.characterSheetOfficialFeatureCard{
    min-height:68px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:10px 12px;
    border:0;
    background:#f2e5c3;
    color:inherit;
    font:inherit;
    text-align:left;
    cursor:pointer;
}

.characterSheetOfficialFeatureCard:hover,
.characterSheetOfficialFeatureCard:focus-visible{z-index:1;outline:2px solid #87512b;background:#fff4d7}
.characterSheetOfficialFeatureCard span{color:#7b5b2b;font-size:9px;font-weight:900;text-transform:uppercase}
.characterSheetOfficialFeatureCard strong{color:#2c4635}
.characterSheetOfficialFeatureCard p{margin:4px 0 0;color:#65543b}
.characterSheetOfficialFeatureCard small{margin-top:5px;color:#8b6430;font-size:9px;font-weight:800}

.characterLevelUpProficiencyChoices{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.characterLevelUpProficiencyChoices label{display:grid;gap:5px;color:#5c492d;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.06em}
.characterLevelUpProficiencyChoices select{width:100%;min-width:0;padding:10px;border:1px solid #8d6c35;border-radius:8px;background:#fff9e6;color:#2c2419;font:inherit;text-transform:none;letter-spacing:normal}
.characterLevelUpProficiencyWarning{grid-column:1/-1;padding:9px;border-radius:7px;background:#7d2d24!important;color:#fff0d6!important;font-weight:800}

#characterFeatureInfoWindow,
#actorInventoryWindow{
    position:fixed;
    inset:0;
    z-index:2147483640;
    display:grid;
    place-items:center;
    padding:18px;
    background:rgba(5,9,6,.76);
    backdrop-filter:blur(6px);
}
#characterFeatureInfoWindow.hidden,
#actorInventoryWindow.hidden{display:none!important}

.characterFeatureInfoBox{
    width:min(560px,94vw);
    max-height:min(620px,88vh);
    overflow:auto;
    padding:18px;
    border:2px solid #b69049;
    border-radius:16px;
    background:linear-gradient(145deg,#fff7dc,#e5cea0);
    color:#302318;
    box-shadow:0 24px 70px rgba(0,0,0,.7);
}
.characterFeatureInfoTop{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:start;padding-bottom:12px;border-bottom:1px solid #a9874c}
.characterFeatureInfoTop span{color:#825b27;font-size:10px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}
.characterFeatureInfoTop h2{margin:3px 0 0;color:#264533;font:700 27px Georgia,serif}
.characterFeatureInfoTop button,
.actorInventoryHeader button{width:38px;height:38px;border:1px solid #9e654d;border-radius:9px;background:#742e25;color:#fff0d8;font-size:18px;cursor:pointer}
.characterFeatureInfoBox>p{margin:16px 0;color:#493a28;font-size:15px;line-height:1.62}
.characterFeatureInfoNotes{padding:10px;border-left:4px solid #365c43;background:rgba(255,255,255,.45);white-space:pre-wrap}
.characterFeatureInfoNotes.hidden{display:none}
.characterFeatureInfoDone{display:block;margin:16px 0 0 auto;padding:9px 18px;border:1px solid #97743b;border-radius:8px;background:#31583f;color:#fff1cb;font-weight:900;cursor:pointer}

.actorInventoryBox{
    width:min(880px,96vw);
    max-height:88vh;
    display:flex;
    flex-direction:column;
    overflow:hidden;
    border:2px solid #ad8747;
    border-radius:17px;
    background:#ead8ad;
    color:#302318;
    box-shadow:0 28px 85px rgba(0,0,0,.75);
}
.actorInventoryHeader{display:grid;grid-template-columns:1fr auto;gap:15px;align-items:start;padding:15px 17px;background:linear-gradient(135deg,#2d5139,#14271c);color:#f6e4b9}
.actorInventoryHeader span{color:#c9ae72;font-size:10px;font-weight:900;letter-spacing:.11em;text-transform:uppercase}
.actorInventoryHeader h2{margin:2px 0;font:700 26px Georgia,serif}
.actorInventoryHeader p{margin:0;color:#cad6cc}
.actorInventoryTabs{display:flex;gap:4px;padding:10px 14px 0;border-bottom:1px solid #9b793e;background:#cfb475}
.actorInventoryTabs button{padding:9px 15px;border:1px solid #8c6b36;border-bottom:0;border-radius:8px 8px 0 0;background:#bda264;color:#332619;font-weight:900;cursor:pointer}
.actorInventoryTabs button.active{background:#fff4d4;color:#274433}
.actorInventoryPane{min-height:0;overflow:auto;padding:14px}
.actorInventoryPane.hidden{display:none!important}
.actorInventorySearchRow{display:grid;grid-template-columns:1fr 210px;gap:10px}
.actorInventorySearchRow input,.actorInventorySearchRow select,.actorInventoryManualGrid input,.actorInventoryManualGrid select,#actorInventoryManualPane textarea{width:100%;box-sizing:border-box;padding:10px;border:1px solid #8c6b36;border-radius:8px;background:#fff9e7;color:#2e251a;font:inherit}
.actorInventoryStatus{margin:9px 0;color:#685333;font-size:11px;font-weight:800}
.actorInventoryResults{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.actorInventoryResults article{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:10px;border:1px solid #aa884d;border-radius:9px;background:#fff3d4}
.actorInventoryResults article div{display:grid;min-width:0;gap:3px}
.actorInventoryResults article strong{color:#294a36}
.actorInventoryResults article small{overflow:hidden;color:#6c593a;text-overflow:ellipsis;white-space:nowrap}
.actorInventoryResults article button,.actorInventoryAddManual{flex:0 0 auto;padding:8px 12px;border:1px solid #8e6c35;border-radius:7px;background:#355d43;color:#fff0ca;font-weight:900;cursor:pointer}
#actorInventoryManualPane{display:grid;gap:12px}
.actorInventoryManualGrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.actorInventoryManualGrid label,#actorInventoryManualPane>label{display:grid;gap:5px;color:#5d492c;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.05em}
.actorInventoryAddManual{justify-self:end}

.actorInventorySection{position:relative}
.actorActionSourceField{display:block!important}
.actorInventoryHeading{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important}
.actorInventoryToolbar{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.actorInventoryToolbar select{min-width:145px;padding:7px 30px 7px 9px;border:1px solid #92703a;border-radius:7px;background:#f6e8c2;color:#38291c;font:inherit;font-size:11px;font-weight:900;cursor:pointer}
.actorInventoryAddBtn{padding:6px 10px!important;border:1px solid #92703a!important;border-radius:7px!important;background:#355d43!important;color:#fff0ca!important;font-weight:900!important;cursor:pointer!important}
.actorInventoryList{display:grid;gap:8px}
.actorInventoryItem{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:10px;border:1px solid #ae8d55;border-radius:9px;background:rgba(255,249,226,.64)}
.actorInventoryItem.equipped{border-color:#3f704f;box-shadow:inset 4px 0 #3f704f}
.actorInventoryItemMain{display:grid;gap:2px;min-width:0}
.actorInventoryItemMain strong{color:#294936}
.actorInventoryItemMain small{color:#6e5a3c}
.actorInventoryItemMain p{margin:4px 0 0;color:#5c4a33;font-size:12px;line-height:1.35}
.actorInventoryItemQuantity,.actorInventoryItemControls,.actorGeneratedActionButtons{display:flex;gap:5px;align-items:center}
.actorInventoryItemQuantity button,.actorInventoryItemControls button,.actorGeneratedActionButtons button{padding:6px 8px;border:1px solid #8d6d3c;border-radius:6px;background:#e6d2a6;color:#392a1d;font-weight:800;cursor:pointer}
.actorInventoryItemControls .danger{background:#762f27;color:#fff0d8}
.actorInventoryWeaponRolls{grid-column:1/-1;justify-content:flex-end;padding-top:8px;border-top:1px solid rgba(91,67,36,.2)}
.actorInventoryWeaponRolls button{min-width:150px;background:#355d43;color:#fff0ca;border-color:#55745d}
.actorInventoryEmpty,.actorGeneratedActionsEmpty{display:grid;gap:3px;padding:13px;border:1px dashed #9a7d4d;border-radius:8px;color:#6f5a3b;text-align:center}
.actorGeneratedActions{display:grid;gap:7px;margin-bottom:9px}
.actorGeneratedActionCard{display:grid;grid-template-columns:minmax(150px,1fr) auto;gap:10px;align-items:center;padding:9px 10px;border:1px solid #a98851;border-radius:8px;background:rgba(255,247,220,.72)}
.actorGeneratedActionCard>div:first-child{display:grid;gap:2px}
.actorGeneratedActionCard strong{color:#284936}
.actorGeneratedActionCard small{color:#705b3d}
.actorGeneratedActionButtons button:disabled{opacity:.45;cursor:not-allowed}
.monsterDcRollBtn,.npcDcRollBtn{padding:5px 8px;margin-left:4px;border:1px solid rgba(107,77,31,.55);border-radius:5px;background:#eadbb5;color:#352619;font-size:12px;font-weight:900;cursor:pointer}

.characterAutomaticChoices{
    margin:14px 0;
    overflow:hidden;
    border:1px solid #a78348;
    border-radius:11px;
    background:rgba(246,232,194,.72);
}
.characterAutomaticChoices.hidden{display:none!important}
.characterAutomaticChoicesHeading{padding:12px 14px;background:#294b37;color:#f6e2af}
.characterAutomaticChoicesHeading span{color:#cdb57c;font-size:9px;font-weight:900;letter-spacing:.11em;text-transform:uppercase}
.characterAutomaticChoicesHeading h4{margin:3px 0;font:700 20px Georgia,serif}
.characterAutomaticChoicesHeading p{margin:0;color:#cad6cb;font-size:12px}
.characterAutomaticChoiceGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:10px;padding:12px}
.characterAutomaticChoiceGrid label{display:grid;align-content:start;gap:5px;padding:10px;border:1px solid #b09159;border-radius:8px;background:#fff5d9;color:#4e3a24}
.characterAutomaticChoiceGrid label strong{color:#294936}
.characterAutomaticChoiceGrid label select{width:100%;min-width:0;padding:9px;border:1px solid #8e6d39;border-radius:7px;background:#fffdf2;color:#2d2419}
.characterAutomaticChoiceGrid label small{color:#6d5738;line-height:1.4}
.characterAutomaticChoiceEmpty{margin:0;padding:14px;color:#695538}
.characterRecommendedLoadout{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:12px 14px;border-top:1px solid #aa894e;background:#dfca92}
.characterRecommendedLoadout>div{display:grid;gap:3px}
.characterRecommendedLoadout span{color:#665136;font-size:12px}
.characterRecommendedLoadout button{padding:9px 12px;border:1px solid #8e6b34;border-radius:7px;background:#355d43;color:#fff0c8;font-weight:900;cursor:pointer}
.characterEquipmentProficiency{margin:9px 0;padding:8px 10px;border-radius:7px;font-weight:900}
.characterEquipmentProficiency.proficient{background:#dcebdc;color:#23482f}
.characterEquipmentProficiency.warning{background:#f1d7b2;color:#743a21}
.characterStepValidationError{outline:2px solid #a53b2f!important;outline-offset:2px}

.characterLevelUpClassChoices,.characterLevelUpSpellChoices{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.characterLevelUpClassChoices label,.characterLevelUpSpellChoices label{display:grid;gap:5px;padding:9px;border:1px solid #a0834c;border-radius:8px;background:rgba(255,249,227,.7)}
.characterLevelUpClassChoices select,.characterLevelUpSpellChoices select{width:100%;min-width:0;padding:9px;border:1px solid #8d6c35;border-radius:7px;background:#fff9e6}
.characterLevelUpClassChoices small,.characterLevelUpSpellChoices small,.characterLevelUpProficiencyDescription{color:#6a5638;line-height:1.4;text-transform:none;letter-spacing:normal}

.characterSheetChosenOptions{margin-bottom:14px;border:1px solid #9a7b46;border-radius:10px;background:#e7d4a7}
.characterSheetChosenOptions>h3{margin:0;padding:10px 12px;background:#355741;color:#f7e1ae;font-family:Georgia,serif}
.characterSheetChosenOptions>div{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:1px;background:rgba(102,76,36,.25)}
.characterSheetChosenOptions article{padding:10px;background:#f5e8c6}
.characterSheetChosenOptions span{display:block;color:#805a29;font-size:9px;font-weight:900;text-transform:uppercase}
.characterSheetChosenOptions strong{display:block;margin:3px 0;color:#294a36}
.characterSheetChosenOptions p{margin:0;color:#655239;font-size:12px;line-height:1.4}

.characterSheetResourceTracker{overflow:hidden;border:1px solid #96784a;border-radius:10px;background:#e5d3a8}
.characterSheetResourceHeading{display:flex;gap:7px;align-items:center;justify-content:space-between;padding:8px;background:#2e513b;color:#f5e0ad}
.characterSheetResourceHeading span{font-size:10px;font-weight:900;text-transform:uppercase}
.characterSheetResourceHeading>div{display:flex;gap:4px}
.characterSheetResourceHeading button{padding:4px 6px;border:1px solid #ac925f;border-radius:5px;background:#e9d9b2;color:#33271b;font-size:9px;font-weight:900;cursor:pointer}
.characterSheetResourceTracker article{display:flex;gap:8px;align-items:center;justify-content:space-between;padding:9px 10px;border-top:1px solid rgba(102,77,39,.2)}
.characterSheetResourceTracker article>div:first-child{display:grid;gap:2px}
.characterSheetResourceTracker article strong{color:#294a36}
.characterSheetResourceTracker article small{color:#705b3d;font-size:9px}
.characterSheetResourceControls{display:flex;gap:5px;align-items:center}
.characterSheetResourceControls button{width:28px;height:28px;border:1px solid #8c6c3b;border-radius:6px;background:#f4e5bf;color:#34271b;font-weight:900;cursor:pointer}
.characterSheetResourceControls button:disabled{opacity:.4;cursor:not-allowed}
.characterSheetResourceControls b{min-width:46px;text-align:center}
.characterSheetResourceControls b small{font-size:10px}

.actorStatWarning{margin:8px 0;padding:9px 11px;border:1px solid #b67b35;border-radius:7px;background:#f0d6aa;color:#67391e;font-size:12px;font-weight:800}
.actorStatWarning[hidden]{display:none}
.actorParsedActionCard{display:grid;gap:8px;padding:10px;border:1px solid #9b7943;border-radius:9px;background:#f4e5bf}
.actorParsedActionCard.depleted{opacity:.58;background:#d9ccb0}
.actorParsedActionCard.resolving{border-color:#356646;box-shadow:inset 4px 0 #356646}
.actorParsedActionHeading{display:flex;gap:10px;align-items:center;justify-content:space-between}
.actorParsedActionHeading>div{display:grid;gap:2px}
.actorParsedActionHeading strong{color:#294936}
.actorParsedActionHeading small{color:#725b3a}
.actorParsedActionHeading button{padding:6px 8px;border:1px solid #846638;border-radius:6px;background:#355d43;color:#fff0ca;font-weight:900;cursor:pointer}
.actorParsedActionHeading .actorParsedActionControls{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:6px}
.actorParsedActionHeading .actorGeneratedActionButtons{display:flex;flex-wrap:wrap;justify-content:flex-end}
.actorParsedActionHeading .actorGeneratedActionButtons button{background:#6f2d22;color:#fff1cb;border-color:#9d5a43}
.actorActionNoRoll{display:inline-flex;align-items:center;min-height:31px;padding:5px 9px;border:1px solid rgba(92,111,91,.46);border-radius:6px;background:rgba(51,79,60,.12);color:#657461;font-size:10px;font-weight:850;letter-spacing:.035em;text-transform:uppercase}
.actorParsedActionCard>p{margin:0;color:#55442e;font-size:12px;line-height:1.45}
.actorActionRestBar{display:flex;gap:6px;align-items:center;justify-content:flex-end;padding:7px;border:1px solid #9f7d45;border-radius:8px;background:#d7bf87}
.actorActionRestBar span{margin-right:auto;color:#5c472b;font-size:10px;font-weight:900;text-transform:uppercase}
.actorActionRestBar button{padding:5px 8px;border:1px solid #836438;border-radius:5px;background:#f1e1b9;color:#35281c;font-size:10px;font-weight:900;cursor:pointer}
.actorInventorySelectRow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:9px;margin:9px 0}
.actorInventorySelectRow select{width:100%;min-width:0;padding:10px;border:1px solid #8c6b36;border-radius:8px;background:#fff9e7}
.actorInventorySelectRow button{padding:9px 12px;border:1px solid #8e6c35;border-radius:7px;background:#355d43;color:#fff0ca;font-weight:900;cursor:pointer}
.actorInventorySelectRow button:disabled{opacity:.45;cursor:not-allowed}
.actorInventorySelectedDetail{margin-bottom:10px;padding:11px;border:1px solid #a7864d;border-radius:9px;background:#fff3d4}
.actorInventorySelectedDetail h3{margin:2px 0;color:#294a36}
.actorInventorySelectedDetail span{color:#76582e;font-size:9px;font-weight:900;text-transform:uppercase}
.actorInventorySelectedDetail ul{margin:8px 0;padding-left:20px}
.actorInventorySelectedDetail>small{display:block;color:#6d5739;line-height:1.4}

.dmsRuleTooltip{position:relative}
.dmsRuleTooltip::after{
    position:absolute;
    z-index:2147483646;
    left:12px;
    bottom:calc(100% + 8px);
    width:min(360px,calc(100vw - 48px));
    padding:10px 12px;
    border:1px solid #b48b49;
    border-radius:8px;
    color:#fff4d7;
    background:#17271e;
    box-shadow:0 10px 28px rgba(0,0,0,.36);
    content:attr(data-rule-tooltip);
    font-size:11px;
    font-weight:600;
    line-height:1.45;
    letter-spacing:0;
    text-align:left;
    text-transform:none;
    white-space:normal;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(4px);
    transition:opacity .14s ease,transform .14s ease,visibility .14s;
}
.dmsRuleTooltip:hover::after,.dmsRuleTooltip:focus-visible::after{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}
.actorEquipmentWarnings p{margin:5px 0;padding:6px;border-radius:5px;background:#efd1a6;color:#74391f}
.actorEquipmentSuitable{color:#285437;font-weight:900}

.characterSheetSpellList{display:grid;gap:10px;margin:14px 0}
.characterSpellBeginnerGuide{margin:0 0 12px;padding:10px 12px;border:1px solid #82906c;border-radius:8px;color:#42503e;background:#e6ead5;font-size:11px;line-height:1.45}
.characterSpellBeginnerGuide summary{cursor:pointer;color:#294936;font-weight:900}
.characterSpellBeginnerGuide ul{margin:9px 0 0;padding-left:19px}
.characterSpellBeginnerGuide li+li{margin-top:5px}
.characterSheetSpellCard{display:grid;gap:9px;padding:12px;border:1px solid #a28350;border-left:5px solid #425f49;border-radius:9px;background:#fff7df}
.characterSheetSpellCard>header{display:flex;gap:10px;align-items:start;justify-content:space-between;padding:0;border:0!important;background:transparent!important}
.characterSheetSpellCard>header span{color:#806035;font-size:9px;font-weight:900;text-transform:uppercase}
.characterSheetSpellCard h3{margin:2px 0;color:#294936;font:700 19px Georgia,serif}
.characterSheetSpellCard>header b{padding:4px 7px;border-radius:999px;color:#f6e7c1;background:#48634d;font-size:9px;text-transform:uppercase}
.characterSheetSpellCard>p{margin:0;color:#705c40;font-size:11px}
.characterSheetSpellRolls{display:flex;flex-wrap:wrap;gap:7px}
.characterSheetSpellRolls button{min-height:34px;padding:7px 10px;border:1px solid #735b35;border-radius:6px;color:#fff1d0;background:#294b37;font-size:10px;font-weight:900;cursor:pointer}
.characterSheetSpellUtility{padding:8px 10px;border:1px solid #9a845e;border-radius:6px;color:#655335;background:#e8dab8;font-size:10px;font-weight:800}
.characterSheetSpellCard details{color:#56452f;font-size:11px;line-height:1.45}
.characterSheetSpellCard summary{cursor:pointer;color:#294936;font-weight:900}
.characterSheetSpellCard details p{margin:7px 0 0}

@media(max-width:1050px){
    .characterSheetProgression{grid-template-columns:1fr 1fr}
    .characterSheetXpControls{grid-column:1/-1;justify-content:end}
    .characterLevelUpSummary{grid-template-columns:1fr 1fr}
}

@media(max-width:700px){
    .characterSheetProgression{grid-template-columns:1fr;gap:9px}
    .characterSheetXpControls{grid-column:auto;grid-template-columns:82px 1fr 1.2fr;justify-content:stretch}
    .characterLevelUpSummary{grid-template-columns:1fr}
    .characterLevelUpSection{grid-template-columns:1fr}
    .characterLevelUpHpControls{grid-template-columns:1fr}
    .characterLevelUpHpResult{grid-column:1}
    .characterLevelUpProficiencyChoices,.actorInventoryResults,.actorInventoryManualGrid,.actorInventorySearchRow{grid-template-columns:1fr}
    .characterLevelUpClassChoices,.characterLevelUpSpellChoices,.actorInventorySelectRow{grid-template-columns:1fr}
    .characterSheetManualItemGrid{grid-template-columns:1fr}
    .actorInventoryItem,.actorGeneratedActionCard{grid-template-columns:1fr}
    .actorInventoryItemControls,.actorGeneratedActionButtons{flex-wrap:wrap}
    .characterLevelUpAsiControls{grid-template-columns:1fr}
}

/* =========================================================
   v40 — New panel launcher, clean chooser and compact combat
   ========================================================= */

.homeAddPanelTile{
    position:relative;
    min-height:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:7px;
    padding:22px;
    border:2px dashed rgba(213,184,115,.62);
    border-radius:14px;
    background:
        radial-gradient(circle at center,rgba(79,125,92,.2),transparent 64%),
        rgba(12,25,18,.62);
    color:#e8d7a9;
    cursor:pointer;
    box-shadow:inset 0 0 28px rgba(0,0,0,.22);
    transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease;
}

.homeAddPanelTile > span{
    width:64px;
    height:64px;
    display:grid;
    place-items:center;
    border:1px solid rgba(220,191,120,.72);
    border-radius:50%;
    background:linear-gradient(180deg,#4c7658,#294535);
    color:#fff0c4;
    font-size:38px;
    font-weight:300;
    line-height:1;
    box-shadow:0 9px 22px rgba(0,0,0,.35),inset 0 1px rgba(255,255,255,.12);
}

.homeAddPanelTile strong{
    font:700 22px Georgia,"Times New Roman",serif;
}

.homeAddPanelTile small{
    color:#aebbb1;
    font-size:11px;
}

.homeAddPanelTile:hover,
.homeAddPanelTile:focus-visible{
    transform:translateY(-3px);
    border-color:#e0c57f;
    background:
        radial-gradient(circle at center,rgba(96,148,111,.28),transparent 66%),
        rgba(17,35,25,.82);
    box-shadow:0 15px 30px rgba(0,0,0,.34),inset 0 0 30px rgba(214,181,105,.06);
    outline:none;
}

.characterCreatorHomePanel{
    border-color:rgba(211,181,108,.78);
    background:
        radial-gradient(circle at 50% 35%,rgba(199,168,91,.16),transparent 48%),
        linear-gradient(145deg,rgba(39,69,50,.96),rgba(15,30,21,.98));
    cursor:pointer;
}

.panelCharacterCreatorFallback{
    width:82px;
    height:82px;
    display:grid;
    place-items:center;
    border:1px solid rgba(226,198,128,.72);
    border-radius:50%;
    background:linear-gradient(180deg,#714032,#3d251f);
    color:#f5e3b2;
    font-size:52px;
    line-height:1;
    box-shadow:0 10px 25px rgba(0,0,0,.36),inset 0 1px rgba(255,255,255,.12);
}

.characterCreatorHomePanelMeta{
    margin-top:5px;
    color:#c6b98f;
    font-size:11px;
    letter-spacing:.04em;
}

@media(max-width:700px){
    .actorParsedActionHeading{align-items:flex-start;flex-direction:column}
    .actorParsedActionHeading .actorParsedActionControls,
    .actorParsedActionHeading .actorGeneratedActionButtons{width:100%;justify-content:flex-start}
}

#templateWindow{
    position:fixed!important;
    inset:var(--real-header-height,76px) 0 0!important;
    width:100%!important;
    height:calc(100vh - var(--real-header-height,76px))!important;
    max-width:none!important;
    max-height:none!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    padding:clamp(18px,4vw,58px)!important;
    overflow:auto!important;
    transform:none!important;
    border:0!important;
    border-radius:0!important;
    background:rgba(4,10,7,.78)!important;
    backdrop-filter:blur(5px);
    z-index:2147483645!important;
    text-align:left!important;
}

#templateWindow.hidden{
    display:none!important;
}

#templateWindow .templateBox{
    position:relative!important;
    width:min(910px,calc(100vw - 36px))!important;
    min-width:0!important;
    max-width:none!important;
    max-height:min(720px,calc(100vh - var(--real-header-height,76px) - 36px))!important;
    display:block!important;
    margin:0!important;
    padding:30px!important;
    overflow:auto!important;
    border:1px solid #b99a5c!important;
    border-radius:12px!important;
    background:
        linear-gradient(135deg,rgba(39,64,48,.98),rgba(16,29,22,.99))!important;
    box-shadow:0 28px 80px rgba(0,0,0,.7),inset 0 0 0 2px rgba(235,211,148,.035)!important;
}

#closeTemplate{
    position:absolute!important;
    top:18px!important;
    right:18px!important;
    z-index:3;
    width:36px!important;
    height:36px!important;
    display:grid!important;
    place-items:center;
    padding:0!important;
    border:1px solid #d09b79!important;
    border-radius:7px!important;
    background:#722b24!important;
    color:white!important;
    font-size:17px!important;
    cursor:pointer;
}

.templateHeading{
    max-width:660px;
    margin:0 50px 24px 0;
}

.templateHeading > span{
    display:block;
    margin-bottom:5px;
    color:#c5a561;
    font-size:10px;
    font-weight:900;
    letter-spacing:.16em;
    text-transform:uppercase;
}

#templateWindow .templateHeading h3{
    margin:0 0 7px!important;
    color:#f0ddb0!important;
    font:700 clamp(25px,3vw,38px)/1.12 Georgia,"Times New Roman",serif!important;
}

.templateHeading p{
    margin:0;
    color:#aebbb2;
    font-size:14px;
}

.templateChoiceGrid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:13px;
}

#templateWindow .templateBtn{
    position:relative;
    width:100%!important;
    min-height:166px!important;
    display:flex!important;
    flex-direction:column;
    align-items:flex-start;
    justify-content:flex-end;
    gap:5px;
    margin:0!important;
    padding:19px!important;
    overflow:hidden;
    border:1px solid rgba(199,170,103,.48)!important;
    border-radius:9px!important;
    background:
        linear-gradient(150deg,rgba(71,108,82,.96),rgba(32,55,41,.98))!important;
    color:#f1ead8!important;
    text-align:left!important;
    cursor:pointer;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.025),0 8px 18px rgba(0,0,0,.2)!important;
    transition:transform .17s ease,border-color .17s ease,filter .17s ease!important;
}

#templateWindow .templateBtn:nth-child(2),
#templateWindow .templateBtn:nth-child(5){
    background:linear-gradient(150deg,rgba(91,47,39,.96),rgba(49,31,25,.98))!important;
}

#templateWindow .templateBtn:hover,
#templateWindow .templateBtn:focus-visible{
    transform:translateY(-3px)!important;
    border-color:#e2c67e!important;
    filter:brightness(1.1);
    outline:none;
}

.templateChoiceIcon{
    position:absolute;
    top:17px;
    left:18px;
    width:48px;
    height:48px;
    display:grid;
    place-items:center;
    border:1px solid rgba(225,196,125,.62);
    border-radius:8px;
    background:rgba(8,18,12,.44);
    color:#ebd391;
    font:700 24px Georgia,"Times New Roman",serif;
}

#templateWindow .templateBtn strong{
    position:relative;
    z-index:1;
    font:700 19px Georgia,"Times New Roman",serif;
}

#templateWindow .templateBtn small{
    position:relative;
    z-index:1;
    color:#bbc7bf;
    font-size:10px;
}

#initiativeTracker .trackerToolbar{
    display:flex!important;
    flex-wrap:wrap!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:5px!important;
    width:100%!important;
    min-height:0!important;
    margin:0 0 9px!important;
    padding:7px!important;
    border:1px solid rgba(189,162,103,.58)!important;
    border-radius:7px!important;
    background:linear-gradient(180deg,#203128,#142219)!important;
    box-shadow:0 5px 12px rgba(0,0,0,.26)!important;
}

#initiativeTracker .trackerToolbar button{
    flex:0 0 auto!important;
    width:auto!important;
    min-width:0!important;
    min-height:31px!important;
    height:31px!important;
    margin:0!important;
    padding:4px 9px!important;
    border:1px solid rgba(211,188,127,.48)!important;
    border-radius:5px!important;
    background:#365442!important;
    color:#fff1ce!important;
    font-size:10px!important;
    font-weight:850!important;
    line-height:1!important;
    letter-spacing:.015em!important;
    box-shadow:none!important;
}

#initiativeTracker .trackerToolbar button:hover{
    transform:none!important;
    filter:brightness(1.18)!important;
    box-shadow:none!important;
}

#initiativeTracker #nextTurnBtn{
    background:#7b5422!important;
    border-color:#d2aa63!important;
}

#initiativeTracker #endEncounterBtn,
#initiativeTracker #resetInitiativeBtn{
    background:#6f302a!important;
}

#initiativeTable .combatStateButtons{
    gap:4px!important;
}

#initiativeTable .combatStateButtons button{
    min-height:30px!important;
    padding:4px 6px!important;
    border-radius:5px!important;
    font-size:9px!important;
}

#initiativeTable .hpChangeBtn,
#initiativeTable .deathSaveBtn{
    min-width:26px!important;
    min-height:26px!important;
    padding:3px 5px!important;
    font-size:10px!important;
}

@media(max-width:760px){
    #templateWindow{
        align-items:flex-start!important;
        padding:14px!important;
    }

    #templateWindow .templateBox{
        width:100%!important;
        max-height:none!important;
        padding:24px 18px!important;
    }

    .templateChoiceGrid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    #templateWindow .templateBtn{
        min-height:145px!important;
        padding:15px!important;
    }
}

@media(max-width:470px){
    .templateChoiceGrid{
        grid-template-columns:1fr;
    }
}

/* =========================================================
   v43 — mobile workspace, spell actions and dungeon gateway
   ========================================================= */

@media(max-width:760px){
    html,
    body{
        width:100%!important;
        max-width:100vw!important;
        min-width:0!important;
        overflow-x:hidden!important;
    }

    body > header{
        width:100%!important;
        min-height:0!important;
        height:auto!important;
        display:flex!important;
        flex-direction:column!important;
        align-items:stretch!important;
        gap:6px!important;
        padding:7px 8px 8px!important;
    }

    body > header::before{
        inset:0!important;
        opacity:.38!important;
    }

    #logo{
        width:100%!important;
        min-width:0!important;
        padding:3px 5px!important;
        overflow:hidden!important;
        color:#f0ddb0!important;
        font-size:clamp(14px,4.4vw,19px)!important;
        line-height:1.2!important;
        letter-spacing:1.1px!important;
        text-align:center!important;
        text-overflow:ellipsis!important;
        white-space:nowrap!important;
    }

    #logo::after{
        width:54%!important;
        margin-top:3px!important;
    }

    .mainToolbar.categorizedToolbar{
        width:100%!important;
        max-width:100%!important;
        display:flex!important;
        flex-wrap:nowrap!important;
        justify-content:flex-start!important;
        gap:6px!important;
        padding:1px 0 4px!important;
        overflow-x:auto!important;
        overflow-y:visible!important;
        overscroll-behavior-x:contain;
        scrollbar-width:thin;
        -webkit-overflow-scrolling:touch;
    }

    .mainToolbar.categorizedToolbar > button,
    .mainToolbar.categorizedToolbar .navGroupToggle{
        flex:0 0 auto!important;
        width:auto!important;
        min-width:104px!important;
        min-height:36px!important;
        height:36px!important;
        padding:6px 10px!important;
        font-size:10px!important;
        line-height:1.1!important;
        white-space:nowrap!important;
    }

    .mainToolbar.categorizedToolbar .welcomeReturnButton{
        min-width:82px!important;
    }

    .mainToolbar.categorizedToolbar .primaryNavButton{
        min-width:136px!important;
    }

    .navModuleGroup{
        position:static!important;
        flex:0 0 auto!important;
    }

    .navGroupMenu{
        position:fixed!important;
        top:calc(var(--real-header-height,104px) + 5px)!important;
        left:8px!important;
        right:8px!important;
        width:auto!important;
        min-width:0!important;
        max-height:calc(100dvh - var(--real-header-height,104px) - 13px)!important;
        overflow-y:auto!important;
    }

    #homeGrid{
        width:100%!important;
        height:calc(100dvh - var(--real-header-height,104px))!important;
        margin-top:var(--real-header-height,104px)!important;
        grid-template-columns:1fr!important;
        grid-auto-rows:minmax(150px,auto)!important;
        gap:10px!important;
        padding:10px!important;
    }

    #homeGrid .panel,
    #homeGrid .homeAddPanelTile{
        grid-column:span 1!important;
        grid-row:span 1!important;
        min-height:150px!important;
        padding:16px 14px!important;
    }

    #homeGrid .panelTitle{
        font-size:clamp(20px,7vw,28px)!important;
    }

    #editorView{
        width:100%!important;
        height:calc(100dvh - var(--real-header-height,104px))!important;
        margin-top:var(--real-header-height,104px)!important;
    }

    #sideBar{
        display:none!important;
    }

    #editorLeft{
        width:100%!important;
        min-width:0!important;
    }

    #editorToolbar{
        width:100%!important;
        min-height:52px!important;
        display:flex!important;
        flex-wrap:nowrap!important;
        gap:6px!important;
        padding:6px 8px!important;
        overflow-x:auto!important;
        overscroll-behavior-x:contain;
        -webkit-overflow-scrolling:touch;
    }

    #editorToolbar > *{
        flex:0 0 auto!important;
    }

    #editorHeader{
        width:100%!important;
        min-width:0!important;
        min-height:55px!important;
        display:flex!important;
        flex-wrap:wrap!important;
        gap:7px!important;
        padding:7px 9px!important;
    }

    #documentTitle{
        min-width:0!important;
        flex:1 1 180px!important;
        overflow:hidden!important;
        font-size:clamp(16px,5vw,21px)!important;
        text-overflow:ellipsis!important;
        white-space:nowrap!important;
    }

    #editorHeaderButtons{
        flex:0 0 auto!important;
        gap:5px!important;
    }

    #editorHeaderButtons button{
        min-height:38px!important;
        padding:6px 9px!important;
        font-size:11px!important;
    }

    #editor{
        width:100%!important;
        min-width:0!important;
        padding:14px 10px 34px!important;
        overflow-x:hidden!important;
        overflow-y:auto!important;
    }

    #editor img{
        max-width:100%!important;
        height:auto!important;
    }

    .npcSheet,
    .monsterSheet,
    .mapPanel{
        width:100%!important;
        min-width:0!important;
        max-width:100%!important;
        padding:14px!important;
    }

    .npcIdentityGrid,
    .npcCombatGrid,
    .npcDetailsGrid,
    .monsterIdentity,
    .monsterShortFields,
    .monsterDetails{
        grid-template-columns:1fr!important;
    }

    .npcAbilities,
    .monsterAbilities{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:7px!important;
    }

    .actorParsedActionHeading{
        align-items:flex-start!important;
        flex-direction:column!important;
    }

    .actorParsedActionHeading .actorParsedActionControls,
    .actorParsedActionHeading .actorGeneratedActionButtons{
        width:100%!important;
        justify-content:flex-start!important;
    }

    .actorGeneratedActionButtons button{
        min-height:40px!important;
        flex:1 1 135px!important;
    }

    .actorActionRestBar{
        align-items:stretch!important;
        flex-wrap:wrap!important;
    }

    .actorActionRestBar span{
        flex:1 0 100%!important;
    }

    .actorActionRestBar button{
        min-height:38px!important;
        flex:1 1 90px!important;
    }

    #initiativeTracker{
        width:100%!important;
        padding:10px!important;
        overflow-x:hidden!important;
        overflow-y:auto!important;
    }

    #initiativeTable{
        width:100%!important;
        min-width:0!important;
    }

    #initiativeTable .combatantRow{
        min-width:0!important;
        overflow:visible!important;
    }

    #notification{
        right:10px!important;
        bottom:10px!important;
        max-width:calc(100vw - 20px)!important;
        font-size:13px!important;
    }

    #monsterLibraryWindow,
    #npcLibraryWindow,
    #mapLibraryWindow,
    #encounterBuilderWindow,
    #panelChooserWindow,
    #partyManagerWindow,
    #quickDiceWindow,
    #sessionDashboardWindow,
    #campaignManagerWindow,
    #questManagerWindow,
    #worldDatabaseWindow,
    #spellbookWindow,
    #actorInventoryWindow{
        padding:0!important;
        align-items:stretch!important;
    }

    .monsterLibraryBox,
    .npcLibraryBox,
    .mapLibraryBox,
    .encounterBuilderBox,
    .panelChooserBox,
    .partyManagerBox,
    .quickDiceBox,
    .sessionDashboardBox,
    .campaignManagerBox,
    .questManagerBox,
    .worldDatabaseBox,
    .spellbookBox,
    .actorInventoryBox{
        width:100%!important;
        max-width:none!important;
        height:100%!important;
        max-height:none!important;
        min-height:0!important;
        margin:0!important;
        border-left:0!important;
        border-right:0!important;
        border-radius:0!important;
    }

    .monsterLibrarySearchRow,
    .monsterLibraryFilterRow,
    .actorInventorySearchRow,
    .open5eSearchControls{
        grid-template-columns:1fr!important;
    }

    .welcomeHero{
        min-height:max(680px,100svh)!important;
    }

    .welcomeHeroContent{
        width:calc(100% - 24px)!important;
        padding:104px 4px 72px!important;
    }

    .welcomeHeroContent h1{
        font-size:clamp(2.6rem,14vw,4.7rem)!important;
        line-height:.92!important;
    }

    .welcomeCampaignStatus{
        width:min(100%,390px)!important;
    }

    .welcomeFeatureCard{
        min-height:0!important;
    }
}

@media(max-width:430px){
    .welcomeBrand strong{
        display:none!important;
    }

    .welcomeNav{
        padding:10px 12px!important;
    }

    .welcomeNav > div{
        margin-left:auto!important;
    }

    .welcomePrimaryAction,
    .welcomeFinalAction{
        min-width:0!important;
        width:calc(100% - 10px)!important;
        min-height:58px!important;
        padding:12px 16px!important;
        font-size:.92rem!important;
    }

    .welcomeCampaignStatus{
        align-items:flex-start!important;
    }

    .welcomeDungeonPortal,
    .welcomeDungeonMonster{
        opacity:.3!important;
    }

    .npcAbilities,
    .monsterAbilities{
        grid-template-columns:1fr!important;
    }
}

/* v1.4.7 — SRD-aligned NPC builder and live WebGL Dice launcher. */
.npcCreationGuide{
    display:grid;
    gap:10px;
    margin:0 0 22px;
    padding:15px 17px;
    border:1px solid rgba(108,73,42,.48);
    border-left:5px solid #8b3024;
    background:rgba(255,250,231,.58);
    color:#4a3526;
    line-height:1.45;
}
.npcCreationGuide>div{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap}
.npcCreationGuide strong{color:#7a241d;font-size:17px}
.npcCreationGuide span{font-size:12px;font-style:italic}
.npcCreationGuide ol{margin:0;padding-left:20px;font-size:12px}
.npcCreationGuide li+li{margin-top:4px}

.npcBuilderGroup{margin-top:18px}
.npcBuilderHeading{
    display:flex;
    align-items:center;
    gap:10px;
    margin:0 0 11px;
    padding-bottom:7px;
    border-bottom:2px solid #8b3024;
}
.npcBuilderHeading>span{
    display:grid;
    place-items:center;
    width:28px;
    height:28px;
    flex:0 0 28px;
    border-radius:50%;
    background:#7a241d;
    color:#fff6dc;
    font:900 14px Arial,sans-serif;
}
.npcBuilderHeading h2{margin:0!important;border:0!important;font-size:20px!important}
.npcBuilderHeading p{margin:2px 0 0;color:#735542;font:italic 12px/1.35 Georgia,"Times New Roman",serif}
.npcAbilityGroup .npcBuilderHeading{margin-bottom:13px}

.npcIdentityGrid{grid-template-columns:repeat(3,minmax(150px,1fr))!important}
.npcCampaignIdentityGrid{margin-top:14px}
.npcCombatGrid{grid-template-columns:repeat(4,minmax(135px,1fr))!important}
.npcTrackingField small{color:#896d58;font:700 9px Arial,sans-serif;text-transform:uppercase;letter-spacing:.08em}
.npcHitDiceField{position:relative}
.npcFieldHelperBtn{
    align-self:flex-end;
    margin-top:1px;
    padding:5px 8px;
    border:1px solid #8b3024;
    border-radius:3px;
    background:#7a241d;
    color:#fff6df;
    font:800 10px Arial,sans-serif;
    cursor:pointer;
}
.npcFieldHelperBtn:hover{filter:brightness(1.16)}
.npcSheet input[readonly]{background:rgba(226,211,174,.75)!important;color:#604c3d!important;cursor:default}

.npcAbility{
    grid-template-areas:
        "label roll"
        "score roll"
        "modifier roll"
        "save roll"!important;
}
.npcAbilitySave{
    grid-area:save;
    display:grid!important;
    grid-template-columns:auto minmax(34px,1fr) auto;
    align-items:center;
    gap:5px!important;
    margin-top:3px;
    color:#75513d!important;
    font:800 9px Arial,sans-serif!important;
    text-transform:uppercase;
    letter-spacing:.06em;
}
.npcAbilitySave input{
    width:100%;
    min-width:0;
    padding:2px 3px;
    border:1px solid #b88b67;
    border-radius:3px;
    background:rgba(255,250,231,.86);
    color:#2e2118;
    font-weight:900;
    text-align:center;
}
.npcAbilitySaveRollBtn{
    min-height:24px;
    padding:2px 5px;
    border:1px solid #7a241d;
    border-radius:3px;
    background:#7a241d;
    color:#fff5df;
    font:900 9px Arial,sans-serif;
    cursor:pointer;
}
.npcAbilitySave.hidden,.npc2024Only.hidden,.npc2014Only.hidden{display:none!important}

.npcRulesValidation{
    display:grid;
    grid-template-columns:auto 1fr;
    gap:4px 12px;
    margin:17px 0 2px;
    padding:12px 14px;
    border:1px solid #b0814e;
    background:rgba(255,248,222,.72);
    color:#4d3a2b;
}
.npcRulesValidation strong{color:#356044}
.npcRulesValidation>span{font-size:12px}
.npcRulesValidation ul{grid-column:1/-1;margin:5px 0 0;padding-left:20px;font-size:12px;line-height:1.4}
.npcRulesValidation[data-npc-validation="ready"] ul{display:none}
.npcRulesValidation[data-npc-validation="warning"]{border-color:#a14534;background:rgba(164,67,47,.09)}
.npcRulesValidation[data-npc-validation="warning"] strong{color:#8b3024}

.npcSpellcastingEditionNote{color:#765746;font:italic 11px Georgia,"Times New Roman",serif}
.npcActionEditorLabel{display:block!important;margin:10px 0 5px;color:#7a241d!important;font:900 10px Arial,sans-serif!important;letter-spacing:.08em;text-transform:uppercase}
.actorActionSourceField{
    display:block!important;
    min-height:115px!important;
    border-style:dashed!important;
}
.npcCampaignProfile{
    margin-top:26px;
    padding:18px;
    border:1px solid rgba(105,73,42,.42);
    background:rgba(117,78,42,.07);
}
.npcCampaignProfileHeader{padding-bottom:11px;border-bottom:4px double #8b3024}
.npcCampaignProfileHeader>span{color:#8b3024;font:900 10px Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase}
.npcCampaignProfileHeader h2{margin:3px 0!important;border:0!important}
.npcCampaignProfileHeader p{margin:0;color:#735542;font-size:12px;font-style:italic}
.npcDeathSaveChoice{
    display:flex!important;
    flex-direction:row!important;
    align-items:center;
    gap:9px!important;
    margin-top:13px;
    padding:10px 12px;
    border:1px solid rgba(139,48,36,.35);
    background:rgba(255,250,231,.55);
}
.npcDeathSaveChoice input{width:18px;height:18px;accent-color:#7a241d}
.npcDeathSaveChoice small{font-weight:500;font-style:italic}

#quickDiceBtn.hasNpcWebglDie{min-height:72px}
#quickDiceBtn.hasNpcWebglDie .npcStatDieViewport{margin:-3px 0 -1px}
#quickDiceBtn.hasNpcWebglDie>span:last-child{font-size:11px;font-weight:850}

#initiativeTable tr.combatantDefeated .unconsciousLabel{display:inline-flex}

@media(max-width:820px){
    .npcIdentityGrid,.npcCombatGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
    .npcCreationGuide>div{display:grid;gap:3px}
}
@media(max-width:520px){
    .npcSheet{padding:18px!important}
    .npcIdentityGrid,.npcCombatGrid,.npcDetailsGrid{grid-template-columns:1fr!important}
    .npcCampaignProfile{padding:12px}
    .npcRulesValidation{grid-template-columns:1fr}
    .npcRulesValidation ul{grid-column:1}
}

/* v1.4.6 — official-style NPC stat block: parchment, red rule accents, and
   a clear split between combat statistics and campaign roleplay notes. */
.npcSheet{
    max-width:1040px!important;
    padding:30px!important;
    border:2px solid #8b3024!important;
    border-radius:4px!important;
    background:
        linear-gradient(90deg,rgba(115,61,27,.08),transparent 18%,transparent 82%,rgba(115,61,27,.08)),
        linear-gradient(180deg,#f7edcf 0%,#ead5a7 100%)!important;
    color:#2e2118!important;
    font-family:Georgia,"Times New Roman",serif!important;
    box-shadow:0 16px 35px rgba(36,20,10,.34),inset 0 0 0 4px rgba(130,69,29,.08)!important;
}
.npcSheetHeader{margin-bottom:20px!important;padding-bottom:13px!important;border-bottom:4px double #8b3024!important}
.npcSheetHeader h1{margin:0!important;color:#7a241d!important;font-size:36px!important;letter-spacing:.01em}
.npcSheetHeader p{margin:5px 0 0!important;color:#694b37!important;font-style:italic}
.npcCustomBadge{display:inline-block;margin-left:8px;padding:4px 8px;border:1px solid #a36f43;border-radius:99px;background:rgba(139,48,36,.1);color:#7a241d;font:700 .62em Arial,sans-serif;letter-spacing:.06em;text-transform:uppercase;vertical-align:middle}
.npcIdentityGrid{grid-template-columns:repeat(4,minmax(140px,1fr))!important;gap:11px!important}
.npcCombatGrid{grid-template-columns:repeat(4,minmax(130px,1fr))!important;gap:11px!important;margin-top:15px!important}
.npcSheet label{color:#5a3524!important;font-weight:800!important}
.npcSheet .sheetInput,.npcSheet .sheetSmall,.npcSheet .sheetArea{border:1px solid #b88b67!important;border-radius:3px!important;background:rgba(255,250,231,.82)!important;color:#2e2118!important;box-shadow:inset 0 1px 2px rgba(74,37,16,.08)!important}
.npcSheet .sheetInput:focus,.npcSheet .sheetSmall:focus,.npcSheet .sheetArea:focus{outline:2px solid rgba(139,48,36,.32)!important;border-color:#8b3024!important}
.npcDivider{height:4px!important;margin:20px 0 14px!important;border-top:1px solid #8b3024!important;border-bottom:1px solid #8b3024!important}
.npcAbilities{grid-template-columns:repeat(6,minmax(88px,1fr))!important;gap:9px!important}
.npcAbility{padding:9px!important;border:1px solid #a86e4d!important;border-radius:3px!important;background:rgba(255,250,231,.5)!important}
.npcAbility strong,.npcAbilityModifier{color:#7a241d!important}
.npcDetailsGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:11px!important;margin-top:15px!important}
.npcSection{margin-top:20px!important}
.npcSection h2{margin-bottom:8px!important;border-bottom:2px solid #8b3024!important;color:#7a241d!important;font-size:23px!important;letter-spacing:.01em}
.npcSectionHeading{border-bottom:2px solid #8b3024!important}
.npcRichField{min-height:82px!important;padding:10px!important;line-height:1.45!important}
.npcRichField.bigArea{min-height:138px!important}
.npcSection:nth-last-of-type(-n+5){border-top:1px solid rgba(139,48,36,.22);padding-top:8px}
.npcHpButtons button,.npcSectionHeading button{border:1px solid #7a241d!important;border-radius:3px!important;background:linear-gradient(180deg,#9f4034,#7a241d)!important;color:#fff5df!important}
.npcSheetActions{gap:10px!important}
.npcSheetActions .saveNpcToLibraryBtn,.npcSheetActions .addNpcToInitiativeBtn{border:2px solid #9a5c37!important;border-radius:3px!important;background:linear-gradient(180deg,#8f3429,#672018)!important;font-family:Georgia,"Times New Roman",serif!important;font-size:16px!important}
@media(max-width:760px){
    .npcIdentityGrid,.npcCombatGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
    .npcAbilities{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media(max-width:480px){
    .npcIdentityGrid,.npcCombatGrid,.npcDetailsGrid{grid-template-columns:1fr!important}
    .npcAbilities{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}

/* v1.12.5 — true WebGL d20s on NPC ability cards. */
.npcAbilityRollBtn.hasNpcWebglDie{
    position:relative;
    width:48px;
    height:48px;
    display:grid;
    place-items:center;
    padding:0;
    overflow:visible;
    isolation:isolate;
    border-radius:50%;
}

.npcAbilityRollBtn.hasNpcWebglDie .rnlD20Icon{
    display:none!important;
}

#quickDiceBtn.hasNpcWebglDie .rnlD20Icon{
    display:none!important;
}

.npcStatDieViewport{
    width:48px;
    height:48px;
    display:block;
    position:relative;
    pointer-events:none;
    filter:drop-shadow(0 7px 7px rgba(0,0,0,.58));
    transition:filter .18s ease,transform .18s ease;
}

.npcStatDieViewport canvas{
    width:48px!important;
    height:48px!important;
    display:block;
    image-rendering:auto;
}

.npcAbilityRollBtn.hasNpcWebglDie:hover .npcStatDieViewport,
.npcAbilityRollBtn.hasNpcWebglDie:focus-visible .npcStatDieViewport,
#quickDiceBtn.hasNpcWebglDie:hover .npcStatDieViewport,
#quickDiceBtn.hasNpcWebglDie:focus-visible .npcStatDieViewport{
    filter:drop-shadow(0 9px 10px rgba(0,0,0,.68)) drop-shadow(0 0 6px rgba(255,22,22,.34));
    transform:scale(1.08);
}

.npcAbilityRollBtn.hasNpcWebglDie:focus-visible{
    outline:2px solid #ff3a3a;
    outline-offset:3px;
}

@media(max-width:760px){
    .npcAbilityRollBtn.hasNpcWebglDie,
    .npcAbilityRollBtn .npcStatDieViewport,
    .npcAbilityRollBtn .npcStatDieViewport canvas,
    #quickDiceBtn.hasNpcWebglDie .npcStatDieViewport,
    #quickDiceBtn.hasNpcWebglDie .npcStatDieViewport canvas{
        width:42px!important;
        height:42px!important;
    }
}

@media(prefers-reduced-motion:reduce){
    .npcStatDieViewport{transition:none}
}


/* =========================================================
   v45 — typed damage breakdown and subtle result auras
   ========================================================= */
.diceTrayResult.hasDamageBreakdown{
    grid-template-columns:minmax(90px,auto) minmax(64px,auto)!important;
    grid-template-rows:auto auto auto!important;
    justify-content:stretch!important;
    gap:5px 12px!important;
    min-height:94px!important;
}
.diceTrayResult.hasDamageBreakdown > span{
    grid-column:1!important;
    grid-row:1!important;
    align-self:center!important;
}
.diceTrayResult.hasDamageBreakdown > .diceGrandTotal{
    grid-column:2!important;
    grid-row:1!important;
    justify-self:end!important;
    font-size:34px!important;
}
.diceDamageBreakdown{
    grid-column:1/-1;
    grid-row:2;
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:6px;
    width:100%;
}
.diceDamagePart{
    position:relative;
    isolation:isolate;
    min-width:104px;
    display:grid;
    grid-template-columns:auto minmax(30px,auto);
    grid-template-rows:auto auto;
    align-items:center;
    gap:0 7px;
    padding:5px 8px;
    border:1px solid rgba(244,216,165,.24);
    border-radius:7px;
    background:linear-gradient(180deg,rgba(20,9,12,.56),rgba(8,4,6,.42));
    overflow:hidden;
}
.diceTrayResult .diceDamageType{
    grid-column:1;
    grid-row:1;
    display:flex;
    align-items:center;
    gap:4px;
    color:#ecd7b8!important;
    font-size:9px!important;
    font-weight:900;
    letter-spacing:.06em!important;
    line-height:1;
    text-transform:uppercase;
    white-space:nowrap;
}
.diceDamageType i{
    font-style:normal;
    font-size:12px;
    line-height:1;
}
.diceTrayResult .diceDamageValue{
    position:relative;
    z-index:2;
    grid-column:2;
    grid-row:1/3;
    justify-self:end;
    color:#fff4dc!important;
    font-family:Georgia,"Times New Roman",serif;
    font-size:25px!important;
    line-height:1!important;
    text-shadow:0 2px 5px rgba(0,0,0,.72)!important;
}
.diceTrayResult .diceDamagePart > small{
    grid-column:1;
    grid-row:2;
    max-width:118px!important;
    color:#cdbb9e!important;
    font-size:9px!important;
    line-height:1.15!important;
    text-align:left!important;
    white-space:nowrap;
}
.diceTrayResult.hasDamageBreakdown > .diceResultDetails{
    grid-column:1/-1!important;
    grid-row:3!important;
    max-width:none!important;
    color:#d6bba9!important;
    font-size:9px!important;
    line-height:1.2!important;
    text-align:center!important;
}
.diceDamageValue::before,
.diceDamageValue::after{
    position:absolute;
    z-index:-1;
    pointer-events:none;
}
.damage-fire{
    border-color:rgba(255,132,52,.48);
    background:linear-gradient(180deg,rgba(91,24,11,.54),rgba(31,7,6,.46));
}
.damage-fire .diceDamageValue{
    color:#fff0a5!important;
    text-shadow:0 0 5px #ffdc63,0 0 10px #ff6a1a,0 2px 5px #190000!important;
    animation:damageFireFlicker 1.15s ease-in-out infinite alternate;
}
.damage-fire .diceDamageValue::before{
    content:"";
    inset:-9px -12px;
    border-radius:50% 50% 40% 40%;
    background:
        radial-gradient(ellipse at 50% 82%,rgba(255,220,77,.72) 0 14%,transparent 40%),
        radial-gradient(ellipse at 35% 72%,rgba(255,87,18,.66) 0 15%,transparent 44%),
        radial-gradient(ellipse at 68% 68%,rgba(255,136,28,.54) 0 12%,transparent 42%);
    filter:blur(2px);
}
.damage-acid{
    border-color:rgba(111,221,57,.48);
    background:linear-gradient(180deg,rgba(32,72,11,.55),rgba(8,28,5,.48));
}
.damage-acid .diceDamageValue{
    color:#d9ff8b!important;
    text-shadow:0 0 5px #9bff3c,0 0 10px #3ba915,0 2px 5px #061600!important;
}
.damage-acid .diceDamageValue::before{
    content:"";
    inset:-7px -10px;
    border-radius:45% 55% 48% 52%;
    background:
        radial-gradient(circle at 18% 30%,rgba(202,255,119,.8) 0 5%,transparent 7%),
        radial-gradient(circle at 82% 63%,rgba(111,255,42,.7) 0 7%,transparent 9%),
        radial-gradient(ellipse at 50% 60%,rgba(52,190,20,.52),transparent 67%);
    filter:blur(1px);
    animation:damageAcidPulse 1.8s ease-in-out infinite;
}
.damage-lightning{
    border-color:rgba(101,193,255,.55);
    background:linear-gradient(180deg,rgba(21,58,98,.57),rgba(8,19,44,.5));
}
.damage-lightning .diceDamageValue{
    color:#eaf8ff!important;
    text-shadow:0 0 4px #fff,0 0 9px #52baff,0 2px 5px #00182d!important;
}
.damage-lightning .diceDamageValue::before,
.damage-lightning .diceDamageValue::after{
    content:"ϟ";
    color:#a9e8ff;
    font-size:12px;
    text-shadow:0 0 5px #4dbdff;
    animation:damageLightningFlash 1.35s steps(2,end) infinite;
}
.damage-lightning .diceDamageValue::before{left:-10px;top:-6px;transform:rotate(-18deg)}
.damage-lightning .diceDamageValue::after{right:-9px;bottom:-6px;transform:rotate(18deg);animation-delay:.37s}
.damage-cold{
    border-color:rgba(170,225,255,.52);
    background:linear-gradient(180deg,rgba(47,87,111,.53),rgba(12,33,48,.5));
}
.damage-cold .diceDamageValue{
    color:#eaffff!important;
    text-shadow:0 0 5px #fff,0 0 11px #7fd8ff,0 2px 5px #071b28!important;
}
.damage-cold .diceDamageValue::before{
    content:"❄";
    left:-12px;
    top:-7px;
    color:#d9f7ff;
    font-size:10px;
    opacity:.9;
}
.damage-poison{
    border-color:rgba(132,199,60,.48);
    background:linear-gradient(180deg,rgba(52,72,17,.55),rgba(19,29,7,.5));
}
.damage-poison .diceDamageValue{
    color:#d4f57d!important;
    text-shadow:0 0 6px #80b72e,0 0 11px #405e13,0 2px 5px #111800!important;
}
.damage-necrotic{
    border-color:rgba(129,82,157,.5);
    background:linear-gradient(180deg,rgba(48,25,60,.6),rgba(14,8,19,.53));
}
.damage-necrotic .diceDamageValue{
    color:#d5aadf!important;
    text-shadow:0 0 6px #7e388f,0 0 12px #26102d,0 2px 5px #000!important;
}
.damage-necrotic .diceDamageValue::before{
    content:"";
    inset:-7px -10px;
    border-radius:50%;
    background:radial-gradient(ellipse,rgba(118,62,132,.52),transparent 66%);
    filter:blur(3px);
    animation:damageNecroticDrift 2.2s ease-in-out infinite alternate;
}
.damage-radiant{
    border-color:rgba(255,220,106,.56);
    background:linear-gradient(180deg,rgba(102,75,17,.5),rgba(35,23,4,.48));
}
.damage-radiant .diceDamageValue{
    color:#fffbd2!important;
    text-shadow:0 0 5px #fff,0 0 11px #ffd84e,0 2px 5px #332100!important;
    animation:damageAuraPulse 1.8s ease-in-out infinite;
}
.damage-psychic{
    border-color:rgba(208,94,255,.48);
    background:linear-gradient(180deg,rgba(72,22,94,.55),rgba(24,6,34,.5));
}
.damage-psychic .diceDamageValue{
    color:#f4c5ff!important;
    text-shadow:0 0 5px #e073ff,0 0 12px #8626a9,0 2px 5px #1c0025!important;
    animation:damageAuraPulse 1.55s ease-in-out infinite;
}
.damage-thunder{
    border-color:rgba(151,163,255,.48);
    background:linear-gradient(180deg,rgba(40,47,91,.55),rgba(13,17,40,.5));
}
.damage-thunder .diceDamageValue{
    color:#e6e9ff!important;
    text-shadow:0 0 5px #aab4ff,0 0 12px #5361bd,0 2px 5px #090d2a!important;
}
.damage-thunder .diceDamageValue::before{
    content:"";
    inset:-7px -10px;
    border:1px solid rgba(171,182,255,.62);
    border-radius:50%;
    animation:damageThunderRing 1.65s ease-out infinite;
}
.damage-force{
    border-color:rgba(91,187,231,.5);
    background:linear-gradient(180deg,rgba(21,67,87,.55),rgba(7,24,34,.5));
}
.damage-force .diceDamageValue{
    color:#c8f4ff!important;
    text-shadow:0 0 5px #6be4ff,0 0 11px #2188ad,0 2px 5px #001a25!important;
}
.damage-slashing,.damage-piercing,.damage-bludgeoning,.damage-damage{
    border-color:rgba(226,197,151,.3);
}
@keyframes damageFireFlicker{
    from{filter:brightness(.94);transform:translateY(0)}
    to{filter:brightness(1.16);transform:translateY(-1px)}
}
@keyframes damageAcidPulse{
    0%,100%{transform:scale(.94);opacity:.68}
    50%{transform:scale(1.06);opacity:1}
}
@keyframes damageLightningFlash{
    0%,68%,100%{opacity:.25}
    70%,76%{opacity:1}
}
@keyframes damageNecroticDrift{
    from{transform:translate(-2px,1px) scale(.9);opacity:.55}
    to{transform:translate(2px,-2px) scale(1.1);opacity:.9}
}
@keyframes damageAuraPulse{
    0%,100%{filter:brightness(.92)}
    50%{filter:brightness(1.2)}
}
@keyframes damageThunderRing{
    from{transform:scale(.55);opacity:.9}
    to{transform:scale(1.25);opacity:0}
}
@media(max-width:760px){
    .diceTrayResult.hasDamageBreakdown{min-height:106px!important}
    .diceDamagePart{min-width:94px;padding:4px 6px}
    .diceTrayResult .diceDamageValue{font-size:22px!important}
    .diceTrayResult.hasDamageBreakdown > .diceResultDetails{
        max-height:24px!important;
        overflow:auto;
    }
}
@media(prefers-reduced-motion:reduce){
    .diceDamageValue,
    .diceDamageValue::before,
    .diceDamageValue::after{animation:none!important}
}


/* =========================================================
   v51 — true black obsidian body with restrained bronze trim
   ========================================================= */
.welcomeStartupChoice{
    position:relative!important;
    min-height:32px;
    display:grid!important;
    grid-template-columns:20px minmax(0,auto);
    align-items:center!important;
    gap:10px!important;
    padding:5px 7px!important;
    border-radius:7px;
    cursor:pointer!important;
}
.welcomeStartupChoice input{
    position:absolute!important;
    inset:0!important;
    z-index:3!important;
    width:100%!important;
    height:100%!important;
    margin:0!important;
    opacity:0!important;
    cursor:pointer!important;
    pointer-events:auto!important;
}
.welcomeStartupCheck{
    grid-column:1;
    width:18px;
    height:18px;
    display:grid;
    place-items:center;
    border:1px solid rgba(220,189,116,.72);
    border-radius:4px;
    background:rgba(6,15,10,.82);
    box-shadow:inset 0 0 0 2px rgba(0,0,0,.38),0 0 0 rgba(198,161,79,0);
    color:#fff0b7;
    pointer-events:none;
    transition:background .16s ease,box-shadow .16s ease,transform .16s ease;
}
.welcomeStartupCheck i{
    font-style:normal;
    font-size:13px;
    line-height:1;
    opacity:0;
    transform:scale(.45);
    transition:opacity .16s ease,transform .16s ease;
}
.welcomeStartupText{grid-column:2;pointer-events:none}
.welcomeStartupChoice input:checked + .welcomeStartupCheck{
    background:linear-gradient(145deg,#96382f,#5e1715);
    box-shadow:inset 0 0 0 2px rgba(255,218,139,.13),0 0 12px rgba(207,161,74,.32);
}
.welcomeStartupChoice input:checked + .welcomeStartupCheck i{opacity:1;transform:scale(1)}
.welcomeStartupChoice input:focus-visible + .welcomeStartupCheck{
    outline:2px solid #f0ce80;
    outline-offset:3px;
}
.welcomeStartupChoice:hover .welcomeStartupCheck{transform:translateY(-1px);border-color:#f0ce80}

#quickDiceWindow{
    padding:clamp(6px,1.2vw,14px)!important;
    overflow:auto!important;
    align-items:center!important;
    background:rgba(3,8,5,.76)!important;
}
.quickDiceBox{
    display:grid!important;
    grid-template-rows:minmax(420px,1fr) 220px!important;
    gap:0!important;
    overflow:visible!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    filter:none!important;
}
.quickDiceBox::before{
    content:none!important;
    display:none!important;
}
.quickDiceBox > *{position:relative;z-index:1}
.quickDiceBox > .diceTrayClose{
    top:12px!important;
    right:calc(var(--dice-board-inline,0%) + 12px)!important;
    z-index:60!important;
}
.diceRollTray{
    width:100%!important;
    height:auto!important;
    min-height:420px!important;
    aspect-ratio:auto!important;
    overflow:hidden!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
}
.dicePickerPanel{
    left:var(--dice-picker-inline,18%)!important;
    right:var(--dice-picker-inline,18%)!important;
}
.diceFooterDock{
    width:100%!important;
    height:220px!important;
    min-height:0!important;
    margin:0!important;
    padding:10px!important;
    display:grid!important;
    grid-template-columns:minmax(260px,.9fr) minmax(330px,1.1fr)!important;
    grid-template-rows:minmax(82px,1fr) auto!important;
    gap:8px!important;
    align-items:stretch!important;
    overflow:hidden!important;
    border:0!important;
    border-top:1px solid rgba(174,135,67,.62)!important;
    border-radius:0!important;
    background:
        linear-gradient(90deg,rgba(174,135,67,.055),transparent 24%,rgba(174,135,67,.035)),
        linear-gradient(180deg,rgba(20,26,24,.99),rgba(6,9,8,.99))!important;
    box-shadow:none!important;
}
.diceTrayResult{
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    overflow:auto!important;
    align-content:center!important;
    scrollbar-width:thin;
    scrollbar-color:#936b48 #2a1118;
}
.diceControlBar{
    height:100%!important;
    min-height:0!important;
    align-self:stretch!important;
}
.diceTrayResult,
.diceControlBar{
    border-color:rgba(174,135,67,.64)!important;
    background:linear-gradient(180deg,rgba(25,31,29,.96),rgba(8,11,10,.98))!important;
}
.diceResultActions{
    grid-column:1/-1!important;
    grid-row:2!important;
    max-height:92px!important;
    overflow:auto!important;
    scrollbar-width:thin;
    scrollbar-color:#8e704d #1b1510;
}
.diceTrayResult.hasDamageBreakdown{min-height:0!important}

#combatLogWindow{
    align-items:stretch!important;
    justify-content:flex-end!important;
    padding:0!important;
    background:linear-gradient(90deg,transparent 35%,rgba(5,8,6,.72))!important;
    backdrop-filter:blur(3px)!important;
}
#combatLogWindow .combatLogPanel{
    position:relative!important;
    top:auto!important;
    width:min(430px,94vw)!important;
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    border-width:0 0 0 2px!important;
    border-radius:14px 0 0 14px!important;
    box-shadow:-18px 0 50px rgba(0,0,0,.48)!important;
}

@media(max-width:760px){
    #quickDiceWindow{align-items:flex-start!important;padding:0!important;background:#030805!important}
    .quickDiceBox{
        grid-template-rows:minmax(300px,1fr) minmax(280px,42vh)!important;
        width:100%!important;
        height:max(100svh,620px)!important;
        min-height:620px!important;
        border-radius:0!important;
        filter:none!important;
    }
    .diceRollTray{
        min-height:300px!important;
        border-width:0 0 1px!important;
        border-radius:0!important;
        box-shadow:none!important;
    }
    .diceFooterDock{
        height:100%!important;
        grid-template-columns:1fr!important;
        grid-template-rows:minmax(88px,1fr) auto auto!important;
        overflow:auto!important;
        border:0!important;
        border-radius:0!important;
        box-shadow:none!important;
    }
    .diceTrayResult{grid-column:1!important;grid-row:1!important;max-height:132px!important}
    .diceControlBar{grid-column:1!important;grid-row:2!important;height:auto!important}
    .diceResultActions{grid-column:1!important;grid-row:3!important;max-height:108px!important}
    .quickDiceBox > .diceTrayClose{
        top:8px!important;
        right:calc(var(--dice-board-inline,0%) + 8px)!important;
    }
    #combatLogWindow{
        align-items:flex-end!important;
        background:linear-gradient(180deg,transparent 18%,rgba(5,8,6,.82))!important;
    }
    #combatLogWindow .combatLogPanel{
        width:100%!important;
        height:min(72svh,620px)!important;
        border-width:2px 0 0!important;
        border-radius:16px 16px 0 0!important;
        box-shadow:0 -18px 50px rgba(0,0,0,.52)!important;
    }
}

/* =========================================================
   v52.2 — Campaigns inside Session & Campaign
   ========================================================= */
.sessionDashboardTabs{
    display:grid;
    grid-template-columns:1fr 1fr;
    flex-shrink:0;
    gap:0;
    padding:0 22px;
    border-bottom:1px solid rgba(189,162,103,.48);
    background:linear-gradient(180deg,#18271e,#101a14);
}

.sessionDashboardTabs button{
    min-height:52px;
    padding:10px 20px 8px;
    border:0;
    border-bottom:3px solid transparent;
    background:transparent;
    color:#aebbb2;
    font-weight:850;
    cursor:pointer;
}

.sessionDashboardTabs button:hover{
    background:rgba(77,117,88,.18);
    color:#fff;
}

.sessionDashboardTabs button.active{
    border-bottom-color:var(--gold-light);
    background:linear-gradient(180deg,rgba(76,114,86,.56),rgba(43,73,55,.72));
    color:#fff4d5;
}

.sessionDashboardBox{
    height:min(900px,calc(100vh - var(--real-header-height,76px) - 36px))!important;
    max-height:calc(100vh - var(--real-header-height,76px) - 36px)!important;
}

.sessionDashboardWorkspace{
    position:relative;
    flex:1 1 auto;
    min-height:0;
    overflow:hidden;
}

.sessionDashboardPane{
    width:100%;
    height:100%;
    min-height:0;
    overflow-y:auto;
    overflow-x:hidden;
}

.sessionDashboardPane.hidden{
    display:none!important;
}

.sessionCampaignVault{
    display:flex;
    flex-direction:column;
    padding:0!important;
    background:linear-gradient(180deg,#142219,#0b130f);
}

.sessionCampaignVaultHeader{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    flex:0 0 auto;
    padding:22px 24px;
    border-bottom:1px solid rgba(189,162,103,.42);
    background:radial-gradient(circle at top left,rgba(103,145,113,.2),transparent 42%),linear-gradient(145deg,#243a2c,#142219);
}

.sessionCampaignVaultHeader > div:first-child > span{
    color:var(--gold);
    font-size:10px;
    font-weight:900;
    letter-spacing:1.2px;
    text-transform:uppercase;
}

.sessionCampaignVaultHeader h3{
    margin:4px 0 3px;
    color:#f4ecd6;
    font:700 29px Georgia,"Times New Roman",serif;
}

.sessionCampaignVaultHeader p{
    color:#b9c4bc;
    font-size:13px;
}

.sessionCampaignListScroller{
    flex:1 1 auto;
    min-height:0;
    overflow-y:auto;
    overflow-x:hidden;
    padding:18px 22px 55px;
    scrollbar-gutter:stable;
}

.sessionCampaignVault #campaignProfileList{
    width:min(1040px,100%);
    max-height:none!important;
    margin:0 auto;
    padding:0!important;
    overflow:visible!important;
}

@media(max-width:650px){
    .sessionDashboardBox{
        height:100%!important;
        max-height:none!important;
    }

    .sessionDashboardTabs{
        padding:0 6px;
    }

    .sessionDashboardTabs button{
        min-width:0;
        min-height:48px;
        padding:7px 4px 6px;
        font-size:12px;
    }

    .sessionCampaignVaultHeader{
        align-items:stretch;
        flex-direction:column;
        padding:16px 13px;
    }

    .sessionCampaignVaultHeader h3{
        font-size:24px;
    }

    .sessionCampaignListScroller{
        padding:12px 9px 45px;
    }
}

/* =========================================================
   v52.5 — concise creator flow, Home Screen save and DiceBox proportions
   ========================================================= */
.characterOriginReferences{grid-template-columns:repeat(3,minmax(0,1fr))}
.characterAutomaticProficiencySummary{margin:0 0 18px;overflow:hidden;border:1px solid rgba(164,128,54,.55);border-radius:11px;background:rgba(235,216,166,.72);color:#302619}
.characterAutomaticProficiencyGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.characterAutomaticProficiencyGrid>div{min-width:0;padding:10px 13px;border-right:1px solid rgba(101,72,31,.2)}
.characterAutomaticProficiencyGrid>div:last-child{border-right:0}
.characterAutomaticProficiencyGrid span{display:block;margin-bottom:2px;color:#80612e;font-size:9px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.characterAutomaticProficiencyGrid strong{display:block;line-height:1.35;overflow-wrap:anywhere}
.characterManualProficiencyField small{display:block;margin:3px 0 7px;color:#75654a;font-weight:500}
.characterSelectedGearFields{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:16px}
.characterSelectedGearFields label{display:grid;gap:6px;color:#5e4929;font-weight:850}
.characterSelectedGearFields textarea{min-height:100px;resize:vertical;border:1px solid #a58a55;border-radius:10px;padding:11px 12px;background:#eee3c7;color:#4e4637;cursor:default}
#characterRecommendedLoadout{margin:14px 0;border:1px solid #aa894e;border-radius:11px;background:#dfca92;overflow:hidden}
.characterReviewHomeOption{display:flex;align-items:center;gap:11px;margin-top:16px;padding:14px 16px;border:1px solid #9d8149;border-radius:11px;background:linear-gradient(145deg,#ead9a9,#d7bd7e);color:#294c38;font-weight:900;cursor:pointer}
.characterReviewHomeOption input{width:20px;height:20px;margin:0;accent-color:#315c42;cursor:pointer}

@media(min-width:761px){
    #quickDiceWindow{padding:10px!important}
    .quickDiceBox{
        display:grid!important;
        width:min(1180px,calc(100vw - 28px))!important;
        height:min(820px,calc(100vh - var(--real-header-height,76px) - 26px))!important;
        min-height:0!important;
        max-height:calc(100vh - var(--real-header-height,76px) - 26px)!important;
        aspect-ratio:auto!important;
        grid-template-rows:minmax(0,1fr) 108px!important;
    }
    .diceRollTray{height:100%!important;min-height:0!important}
    .diceFooterDock{
        display:grid!important;
        height:108px!important;
        padding:5px 7px!important;
        grid-template-columns:minmax(250px,.55fr) minmax(430px,1.45fr)!important;
        grid-template-rows:47px 46px!important;
        gap:5px 7px!important;
    }
    .diceTrayResult{grid-column:1!important;grid-row:1/3!important;height:auto!important;max-height:98px!important;padding:5px 9px!important}
    .diceTrayResult strong{font-size:28px!important}
    .diceTrayResult small{font-size:9px!important}
    .diceControlBar{
        grid-column:2!important;
        grid-row:1!important;
        height:47px!important;
        min-height:0!important;
        padding:3px 5px!important;
        gap:5px!important;
        grid-template-columns:minmax(100px,120px) minmax(72px,88px) auto minmax(112px,138px)!important;
        align-items:end!important;
        justify-content:end!important;
    }
    .diceControlBar:has(.diceRollModeControl.hidden){grid-row:1/3!important;height:98px!important;grid-template-columns:minmax(72px,88px) auto minmax(112px,138px)!important}
    .diceControlBar label{gap:1px!important;font-size:8px!important}
    .diceModifierControl input,.diceRollModeControl select{height:28px!important;padding-top:2px!important;padding-bottom:2px!important}
    .diceControlBar button{height:30px!important;min-height:30px!important;padding:0 10px!important;font-size:11px!important}
    .dicePrimaryAction{min-width:112px!important}
    .diceResultActions{grid-column:2!important;grid-row:2!important;max-height:46px!important;min-height:0!important;padding:3px 5px!important;gap:4px 7px!important;grid-template-columns:minmax(170px,1fr) auto!important;overflow:auto!important}
    .diceResultActions label{display:grid!important;grid-template-columns:auto minmax(110px,1fr)!important;align-items:center!important;gap:5px!important;font-size:8px!important}
    .diceResultActions select{height:28px!important;padding:0 7px!important}
    .diceResultActionButtons{gap:4px!important;flex-wrap:nowrap!important}
    .diceResultActionButtons button{min-height:28px!important;padding:3px 8px!important;font-size:10px!important;white-space:nowrap!important}
    .diceResolutionStatus{font-size:10px!important}
}
@media(max-width:980px){.characterOriginReferences{grid-template-columns:1fr}.characterAutomaticProficiencyGrid{grid-template-columns:1fr}.characterAutomaticProficiencyGrid>div{border-right:0;border-bottom:1px solid rgba(101,72,31,.18)}.characterAutomaticProficiencyGrid>div:last-child{border-bottom:0}}
@media(max-width:760px){
    .quickDiceBox{width:100%!important;height:max(100svh,620px)!important;grid-template-rows:minmax(360px,1fr) minmax(190px,30svh)!important}
    .diceFooterDock{height:100%!important;grid-template-columns:1fr!important;grid-template-rows:minmax(70px,1fr) auto auto!important;gap:5px!important;padding:6px!important}
    .diceTrayResult{max-height:82px!important;padding:5px 8px!important}
    .diceTrayResult strong{font-size:28px!important}
    .diceControlBar{min-height:46px!important;padding:4px 5px!important;gap:5px!important}
    .diceControlBar button{height:32px!important;font-size:11px!important}
    .diceModifierControl input,.diceRollModeControl select{height:30px!important}
    .diceResultActions{max-height:58px!important;padding:4px 5px!important}
}
@media(max-width:620px){.characterSelectedGearFields{grid-template-columns:1fr}}

/* =========================================================
   v52.6 — reliable fullscreen maps and visible defaults
   ========================================================= */
.characterSheetPortraitButton .characterSheetPortraitFallback{
    color:#332719!important;
    font-family:Georgia,"Times New Roman",serif!important;
    font-size:52px!important;
    line-height:1!important;
    text-shadow:0 2px 0 rgba(255,255,255,.42),0 5px 10px rgba(42,29,14,.28)!important;
}

.dm-map-viewport:fullscreen,
.dm-map-viewport:-webkit-full-screen{
    width:100vw!important;
    height:100vh!important;
    overflow:hidden!important;
    background:
        radial-gradient(circle at center,#172219 0,#080d09 68%,#020403 100%)!important;
}

.dm-map-viewport:fullscreen .dm-map-stage,
.dm-map-viewport:-webkit-full-screen .dm-map-stage{
    z-index:1!important;
    box-shadow:0 0 0 1px rgba(218,190,121,.42),0 20px 70px rgba(0,0,0,.72)!important;
}

.mapPinBox > #mapPinDeleteConfirmWindow{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100vh!important;
    max-width:none!important;
    max-height:none!important;
    margin:0!important;
    padding:20px!important;
    border:0!important;
    box-sizing:border-box!important;
    place-items:center!important;
    overflow:auto!important;
    background:rgba(3,5,4,.90)!important;
    color:inherit!important;
    z-index:2147483647!important;
}

#mapPinDeleteConfirmWindow[open]{display:grid!important}
#mapPinDeleteConfirmWindow.hidden,
#mapPinDeleteConfirmWindow:not([open]){display:none!important}

#mapPinDeleteConfirmWindow::backdrop{
    background:rgba(3,5,4,.78)!important;
    backdrop-filter:blur(5px)!important;
}

#mapPinDeleteConfirmWindow .mapPinDeleteConfirmBox{
    position:relative!important;
    z-index:2!important;
    width:min(430px,100%)!important;
    box-sizing:border-box!important;
}

/* =========================================================
   v52.7 — registration-free saves, recovery and ad-ready UI
   ========================================================= */
.guestSaveStatus{
    position:fixed;
    left:18px;
    bottom:18px;
    z-index:42000;
    display:flex;
    align-items:center;
    gap:9px;
    min-width:176px;
    padding:9px 12px;
    border:1px solid rgba(209,176,98,.72);
    border-radius:12px;
    background:rgba(10,29,21,.94);
    color:#f2e4ba;
    box-shadow:0 9px 26px rgba(0,0,0,.36);
    text-align:left;
    cursor:pointer;
    backdrop-filter:blur(9px);
}
.guestSaveStatus:hover{transform:translateY(-1px);border-color:#e5c675;background:#173b2b}
.guestSaveStatusDot{width:9px;height:9px;flex:0 0 9px;border-radius:50%;background:#78ce8b;box-shadow:0 0 0 4px rgba(120,206,139,.14),0 0 10px rgba(120,206,139,.5)}
.guestSaveStatus>span:last-child{display:grid;gap:1px}
.guestSaveStatus strong{font-size:11px;line-height:1.15}
.guestSaveStatus small{color:#bcb79e;font-size:9px;line-height:1.15}
.guestSaveStatus[data-state="saving"] .guestSaveStatusDot{background:#e8ba61;box-shadow:0 0 0 4px rgba(232,186,97,.14)}
.guestSaveStatus[data-state="unavailable"] .guestSaveStatusDot{background:#d47a6d;box-shadow:0 0 0 4px rgba(212,122,109,.14)}

.guestBackupReminder{
    position:fixed;
    left:18px;
    bottom:76px;
    z-index:43000;
    display:flex;
    align-items:center;
    gap:12px;
    width:min(620px,calc(100vw - 36px));
    box-sizing:border-box;
    padding:12px 13px;
    border:1px solid #b48c3f;
    border-radius:13px;
    background:linear-gradient(135deg,#172d21,#0c1711);
    color:#f3e5bd;
    box-shadow:0 16px 38px rgba(0,0,0,.48);
}
.guestBackupReminder.hidden{display:none!important}
.guestBackupReminder>div{display:grid;gap:2px;min-width:0;flex:1}
.guestBackupReminder strong{font-family:Georgia,"Times New Roman",serif;font-size:15px}
.guestBackupReminder span{color:#c9c2aa;font-size:11px;line-height:1.35}
.guestBackupReminder button{min-height:34px;border:1px solid #c4a057;border-radius:8px;background:#d4b66f;color:#17271d;font-weight:900;cursor:pointer;white-space:nowrap}
#guestBackupReminderDismiss{width:34px;min-width:34px;padding:0;border-color:rgba(235,217,169,.35);background:transparent;color:#eadcae}

.guestStorageProtection{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    margin-top:16px;
    padding:16px 18px;
    border:1px solid rgba(77,117,84,.7);
    border-radius:12px;
    background:linear-gradient(145deg,rgba(32,76,52,.16),rgba(241,226,188,.62));
}
.guestStorageProtection>div{display:grid;gap:3px}
.guestStorageProtection span{color:#785c2d;font-size:9px;font-weight:900;letter-spacing:.1em}
.guestStorageProtection strong{color:#294d38;font-family:Georgia,"Times New Roman",serif;font-size:17px}
.guestStorageProtection p{max-width:760px;margin:3px 0 0;color:#665943;font-size:12px;line-height:1.45}
.guestStorageProtection button,#createRecoveryPointBtn{min-height:38px;padding:0 15px;border:1px solid #9e813f;border-radius:9px;background:#315c42;color:#fff2cf;font-weight:900;cursor:pointer;white-space:nowrap}
.guestStorageProtection button:disabled{border-color:#99a18f;background:#879180;color:#e9eadf;cursor:default}

.recoverySectionHelp{margin:0 0 14px;color:#6e604a;line-height:1.5}
.guestRecoveryPointList{display:grid;gap:9px}
.guestRecoveryPoint,.guestRecoveryEmpty{border:1px solid rgba(153,122,58,.48);border-radius:10px;background:rgba(248,238,207,.72)}
.guestRecoveryPoint{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 14px}
.guestRecoveryPoint>div{display:grid;gap:2px;min-width:0}
.guestRecoveryPoint small{color:#8d6b31;font-size:8px;font-weight:900;letter-spacing:.1em}
.guestRecoveryPoint strong{color:#31533e;font-family:Georgia,"Times New Roman",serif;font-size:15px;overflow-wrap:anywhere}
.guestRecoveryPoint span{color:#75674e;font-size:11px}
.guestRecoveryPoint button{min-height:32px;padding:0 12px;border:1px solid #9a7739;border-radius:8px;background:#eee0b8;color:#3e3321;font-weight:900;cursor:pointer}
.guestRecoveryEmpty{padding:18px;color:#786b54;text-align:center}

.dmsAdSlot.hidden{display:none!important}
.dmsAdSlot.is-active{
    display:block;
    width:min(970px,calc(100% - 36px));
    min-height:90px;
    margin:24px auto;
    overflow:hidden;
}

@media(max-width:700px){
    .guestSaveStatus{left:10px;bottom:10px;min-width:0;padding:8px 10px}
    .guestSaveStatus small{display:none}
    .guestBackupReminder{left:10px;bottom:62px;width:calc(100vw - 20px);align-items:stretch;flex-wrap:wrap}
    .guestBackupReminder>div{flex-basis:100%}
    #guestBackupReminderDownload{flex:1}
    .guestStorageProtection{align-items:stretch;flex-direction:column}
    .guestRecoveryPoint{align-items:stretch;flex-direction:column}
    .guestRecoveryPoint button{width:100%}
}

/* =========================================================
   v52.8 — original panel icons, bounded maps and quiet saves
   ========================================================= */
.panelOpenLink{
    position:absolute;
    inset:0;
    z-index:1;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:inherit;
    box-sizing:border-box;
    color:inherit;
    text-decoration:none;
}
.characterHomePanel .panelOpenLink{
    justify-content:flex-start;
    gap:18px;
    text-align:left;
}
.panel .resizeBtn{z-index:4}

.dmsPanelSvg{
    display:block;
    width:58px;
    height:58px;
    color:#ead596;
    filter:drop-shadow(0 4px 7px rgba(0,0,0,.55));
}
.panelIcon{display:grid;place-items:center;min-height:60px}
.panelIcon .dmsNoteIcon{font-size:35px}
.panelCharacterCreatorFallback .dmsPanelSvg,
.panelCharacterFallback .dmsPanelSvg{width:72px;height:72px}
.panelChooserIcon .dmsPanelSvg,
.panelChooserCharacterPortrait .dmsPanelSvg{width:38px;height:38px;color:#6e5428;filter:none}
.npcLibraryPortraitPlaceholder .dmsPanelSvg,.monsterLibraryCardIcon .dmsPanelSvg{width:42px;height:42px;color:currentColor;filter:none}
.npcLibraryEmpty .dmsPanelSvg,.monsterLibraryEmpty .dmsPanelSvg{width:64px;height:64px;margin:auto;color:#795f2f;filter:none}
.mapLibraryEmpty .dmsPanelSvg{width:68px;height:68px;margin:auto;color:#795f2f;filter:none}
.sheetProfileUpload .dmsPanelSvg{width:58px;height:58px;color:currentColor;filter:none}
.sidePanelButton{display:flex!important;align-items:center!important;gap:8px!important;text-align:left!important}
.sidePanelButtonIcon{display:grid;place-items:center;width:27px;flex:0 0 27px}
.sidePanelButtonIcon .dmsPanelSvg{width:25px;height:25px;color:currentColor;filter:none}
.sidePanelButtonIcon .dmsNoteIcon{font-size:20px}
.mapPanelEmptyState .dmsPanelSvg{width:92px;height:92px;margin:auto;color:#cfb870}

.dataManagerHeader .guestSaveStatus{
    position:static;
    inset:auto;
    z-index:auto;
    min-width:170px;
    margin-left:auto;
    padding:7px 10px;
    border-color:rgba(226,197,122,.42);
    border-radius:9px;
    background:rgba(6,22,15,.42);
    box-shadow:none;
    cursor:default;
    transform:none!important;
    backdrop-filter:none;
}
.dataManagerHeader .guestSaveStatus:hover{border-color:rgba(226,197,122,.42);background:rgba(6,22,15,.42)}

.dm-map-viewport{background:#050805!important}
.dm-map-stage{contain:layout paint style}

html.dmMapFullscreenActive,
body.dmMapFullscreenActive{
    width:100%!important;
    height:100%!important;
    overflow:hidden!important;
    overscroll-behavior:none!important;
}

.dm-map-viewport:fullscreen,
.dm-map-viewport:-webkit-full-screen{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100vh!important;
    max-width:none!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    contain:strict!important;
}

/* =========================================================
   v52.9 — fit-to-screen maps, native panel links and PDF forms
   ========================================================= */

@media(max-width:700px){
    .dataManagerHeader .guestSaveStatus{display:none}
}

@media(max-width:680px){
    .characterHomePanel .panelOpenLink{gap:10px;padding:18px 14px}
}

/* v1.4.6 — Keep the clean 3D wooden tray and provide a usable non-WebGL fallback. */
.quickDiceBox.dice3dReady .quickDiceGrid .dicePickerMini{
    display:none!important;
    width:0!important;
    height:0!important;
    margin:0!important;
    visibility:hidden!important;
    opacity:0!important;
    animation:none!important;
}

.quickDiceBox.dice3dReady .quickDiceGrid button{
    min-height:42px!important;
    gap:2px!important;
    padding:7px 4px!important;
}

.quickDiceBox.dice3dReady .quickDiceGrid .diceCountBadge{
    display:none!important;
}

.quickDiceBox.dice3dReady .quickDiceGrid button.selected .diceCountBadge{
    display:flex!important;
    right:50%!important;
    top:-7px!important;
    transform:translateX(50%);
}

.quickDiceBox.dice3dFallback{
    border:1px solid rgba(194,154,85,.84)!important;
    border-radius:16px!important;
    background:
        linear-gradient(135deg,rgba(255,255,255,.07),transparent 20%),
        linear-gradient(160deg,#4a2b19 0%,#2f190f 48%,#1b0e09 100%)!important;
    box-shadow:0 24px 70px rgba(0,0,0,.7),inset 0 0 0 4px rgba(19,9,5,.72)!important;
}

.quickDiceBox.dice3dFallback #dice3dCanvas{display:none!important}
.quickDiceBox.dice3dFallback .diceRollTray{
    margin:10px!important;
    width:calc(100% - 20px)!important;
    border:2px solid #a9793d!important;
    border-radius:12px!important;
    background:radial-gradient(circle at 50% 42%,#294a35 0%,#14291d 56%,#08130d 100%)!important;
    box-shadow:inset 0 0 0 5px #2b160d,inset 0 0 35px rgba(0,0,0,.62)!important;
}
.quickDiceBox.dice3dFallback .dicePickerPanel{
    left:4%!important;
    right:4%!important;
    top:18px!important;
    height:auto!important;
    pointer-events:auto!important;
}
.quickDiceBox.dice3dFallback .quickDiceGrid,
.quickDiceBox.dice3dFallback .quickDiceGrid button,
.quickDiceBox.dice3dFallback .quickDiceGrid button *{pointer-events:auto!important}
.quickDiceBox.dice3dFallback .quickDiceGrid button{
    min-height:78px!important;
    border-radius:9px!important;
    background:rgba(7,17,12,.28)!important;
}
.quickDiceBox.dice3dFallback .quickDiceGrid button:hover,
.quickDiceBox.dice3dFallback .quickDiceGrid button.selected{
    background:rgba(167,126,62,.18)!important;
}
.quickDiceBox.dice3dFallback .quickDiceGrid .dicePickerMini{
    display:grid!important;
    width:clamp(42px,4.8vw,59px)!important;
    height:clamp(42px,4.8vw,59px)!important;
    margin:0!important;
    visibility:visible!important;
    opacity:1!important;
}
.quickDiceBox.dice3dFallback .quickDiceGrid .diceCountBadge{display:flex!important}
.quickDiceBox.dice3dFallback .dice3dStatus{
    top:auto!important;
    bottom:16px!important;
    max-width:calc(100% - 32px);
    text-align:center;
}

.guestStorageProtection{
    background:linear-gradient(145deg,#ead9aa,#d6bb7c)!important;
}
.guestStorageProtection span{color:#664713!important;font-size:11px!important}
.guestStorageProtection p{color:#4f422f!important;font-size:13px!important}
.dataManagerHeader .guestSaveStatus strong{font-size:12px}
.dataManagerHeader .guestSaveStatus small{color:#d9cfac;font-size:11px}

.combatRollBtn.rollingHpDie{
    position:relative;
    overflow:visible;
}

.inlineHpDie{
    display:inline-grid;
    place-items:center;
    width:25px;
    height:25px;
    margin-left:6px;
    color:#fff7d7;
    font:900 10px/1 Georgia,serif;
    text-shadow:0 1px 2px rgba(0,0,0,.7);
    clip-path:polygon(50% 4%,96% 88%,4% 88%);
    background:linear-gradient(145deg,#7fc36c,#317245 58%,#173d28);
    border:1px solid rgba(255,235,179,.7);
    box-shadow:0 4px 9px rgba(0,0,0,.34),inset 0 1px rgba(255,255,255,.25);
    animation:inlineHpDieSpin .62s linear infinite;
    vertical-align:middle;
}

.inlineHpDie.damage{
    clip-path:none;
    border-radius:7px;
    background:linear-gradient(145deg,#b65d4d,#7a2f27 58%,#3d1511);
}

.inlineHpDie.settled{
    animation:none;
    transform:rotate(-6deg) scale(1.08);
}

@keyframes inlineHpDieSpin{
    0%{transform:rotate(0deg) scale(.92)}
    50%{transform:rotate(180deg) scale(1.12)}
    100%{transform:rotate(360deg) scale(.92)}
}

/* v1.12.3 — black/red d20 ability roll icons, no blue ability dice. */
.polyDie{
    color:#ff3434!important;
    background:
        radial-gradient(circle at 34% 24%,rgba(255,255,255,.22),transparent 18%),
        linear-gradient(145deg,#3a3a3d 0%,#111114 44%,#050506 100%)!important;
    border:1px solid rgba(211,28,28,.72)!important;
    box-shadow:
        inset 6px 7px 10px rgba(255,255,255,.08),
        inset -8px -9px 12px rgba(0,0,0,.68),
        0 5px 10px rgba(0,0,0,.42)!important;
    text-shadow:0 0 5px rgba(255,18,18,.55),0 1px 1px rgba(0,0,0,.9)!important;
    transform-style:preserve-3d;
}

.characterSheetAbilityCard{
    grid-template-columns:minmax(0,1fr) auto!important;
    grid-template-areas:
        "label die"
        "score die"
        "modifier die"!important;
    justify-items:start!important;
    align-items:center!important;
    min-height:104px!important;
    padding:14px 16px!important;
    gap:6px 12px!important;
}

.characterSheetAbilityCard span{grid-area:label;}
.characterSheetAbilityCard small{grid-area:score;}
.characterSheetAbilityCard strong{grid-area:modifier;}

.characterSheetAbilityCard .characterAbilityDie{
    --die-size:42px;
    grid-area:die;
    justify-self:end;
    font-style:normal;
    font-size:12px;
    transform:rotateX(18deg) rotateY(-14deg);
    transition:transform .28s ease,filter .18s ease;
}

.characterSheetAbilityCard:hover .characterAbilityDie,
.characterSheetAbilityCard:focus-visible .characterAbilityDie,
.monsterAbilityRollBtn:hover .polyDie,
.npcAbilityRollBtn:hover .polyDie{
    animation:rollAndLoreD20HoverSpin 3.8s linear infinite;
    filter:drop-shadow(0 5px 8px rgba(0,0,0,.46)) brightness(1.15)!important;
}

@keyframes rollAndLoreD20HoverSpin{
    from{transform:rotateX(18deg) rotateY(-14deg) rotateZ(0deg)}
    to{transform:rotateX(18deg) rotateY(346deg) rotateZ(360deg)}
}

@media(max-width:760px){
    .characterSheetAbilityGrid{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:7px!important;
    }

    .characterSheetAbilityCard{
        min-height:88px!important;
        padding:11px 12px!important;
        gap:4px 8px!important;
        border-radius:10px!important;
    }

    .characterSheetAbilityCard .characterAbilityDie{
        --die-size:34px;
        font-size:10px;
    }

    .characterSheetAbilityCard strong{font-size:23px!important;}
    .characterSheetAbilityCard small{width:28px;height:21px;font-size:12px!important;}
}

/* v1.12.4 - proper black/red d20 ability icons. */
.rnlD20Icon{
    --d20-size:38px;
    width:var(--d20-size);
    height:var(--d20-size);
    display:inline-grid;
    place-items:center;
    position:relative;
    flex:0 0 auto;
    isolation:isolate;
    transform-style:preserve-3d;
    transform:rotateX(14deg) rotateY(-17deg) rotateZ(-4deg);
    transform-origin:50% 56%;
    transition:filter .18s ease,transform .2s ease;
    filter:drop-shadow(0 6px 7px rgba(0,0,0,.5));
}

.rnlD20Icon::before{
    content:"";
    position:absolute;
    inset:6% 1% 0 7%;
    z-index:0;
    clip-path:polygon(50% 0,83% 16%,96% 55%,71% 92%,29% 92%,4% 55%,17% 16%);
    background:linear-gradient(145deg,#280505 0%,#080607 50%,#010101 100%);
    border:1px solid rgba(94,0,0,.65);
    transform:translate3d(4px,4px,-7px);
    opacity:.96;
}

.rnlD20Svg{
    width:100%;
    height:100%;
    position:relative;
    z-index:1;
    overflow:visible;
    transform:translateZ(6px);
}

.rnlD20Silhouette{
    fill:#050506;
    stroke:#d32323;
    stroke-width:2.25;
    vector-effect:non-scaling-stroke;
}

.rnlD20FacetLight{fill:#333338}
.rnlD20FacetMid{fill:#19191d}
.rnlD20FacetDeep{fill:#070708}
.rnlD20FacetFace{fill:#101012}
.rnlD20FacetLow{fill:#242428}

.rnlD20Ridge{
    fill:none;
    stroke:rgba(255,47,47,.58);
    stroke-width:1.45;
    stroke-linejoin:round;
    stroke-linecap:round;
    vector-effect:non-scaling-stroke;
}

.rnlD20Label{
    fill:#ff2020;
    stroke:#220000;
    stroke-width:1.65;
    paint-order:stroke fill;
    font-family:Georgia,"Times New Roman",serif;
    font-size:17px;
    font-weight:900;
    letter-spacing:.02em;
    filter:drop-shadow(0 0 3px rgba(255,20,20,.75));
    dominant-baseline:middle;
}

.monsterAbilityRollBtn .rnlD20Icon{
    --d20-size:32px;
}

.npcAbilityRollBtn .rnlD20Icon{
    --d20-size:39px;
}

.characterSheetAbilityCard .characterAbilityDie{
    --d20-size:44px;
    grid-area:die;
    justify-self:end;
    font-style:normal;
}

.characterSheetAbilityCard:hover .rnlD20Icon,
.characterSheetAbilityCard:focus-visible .rnlD20Icon,
.monsterAbilityRollBtn:hover .rnlD20Icon,
.npcAbilityRollBtn:hover .rnlD20Icon{
    animation:rnlD20SolidHoverSpin 4.8s linear infinite;
    filter:drop-shadow(0 8px 10px rgba(0,0,0,.6)) brightness(1.14);
}

@keyframes rnlD20SolidHoverSpin{
    0%{transform:rotateX(14deg) rotateY(-17deg) rotateZ(-4deg)}
    25%{transform:rotateX(18deg) rotateY(4deg) rotateZ(5deg)}
    50%{transform:rotateX(14deg) rotateY(19deg) rotateZ(0deg)}
    75%{transform:rotateX(18deg) rotateY(4deg) rotateZ(-6deg)}
    100%{transform:rotateX(14deg) rotateY(-17deg) rotateZ(-4deg)}
}

@media(max-width:760px){
    .npcAbilities,
    .monsterAbilities{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:7px!important;
    }

    .npcAbility,
    .monsterAbility{
        min-width:0!important;
        padding:9px 8px!important;
    }

    .npcAbilityRollBtn,
    .monsterAbilityRollBtn{
        width:38px!important;
        height:38px!important;
    }

    .npcAbilityRollBtn .rnlD20Icon,
    .monsterAbilityRollBtn .rnlD20Icon,
    .characterSheetAbilityCard .characterAbilityDie{
        --d20-size:34px;
    }
}

@media(max-width:430px){
    .npcAbilities,
    .monsterAbilities,
    .characterSheetAbilityGrid{
        grid-template-columns:1fr!important;
    }

    .npcAbilityRollBtn .rnlD20Icon,
    .monsterAbilityRollBtn .rnlD20Icon,
    .characterSheetAbilityCard .characterAbilityDie{
        --d20-size:36px;
    }
}

/* Keep the v1.4.7 NPC layout last in the cascade. */
.npcIdentityGrid{grid-template-columns:repeat(3,minmax(150px,1fr))!important}
@media(max-width:820px){.npcIdentityGrid,.npcCombatGrid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:520px){
    .npcSheet{padding:18px!important}
    .npcIdentityGrid,.npcCombatGrid,.npcDetailsGrid{grid-template-columns:1fr!important}
}

/* --- correction 2026.10.11 --- */
#editorHeader {
    position: sticky !important;
    top: var(--real-header-height, 76px) !important;
    z-index: 36000 !important;
}

#editorToolbar {
    position: sticky !important;
    top: calc(var(--real-header-height, 76px) + 54px) !important;
    z-index: 35000 !important;
}

/* Fix note editor vertical offset: the editor view already accounts for the site header. */
#editorHeader {
    position: sticky !important;
    top: 0 !important;
    margin-top: 0 !important;
}
#editorToolbar {
    position: sticky !important;
    top: 54px !important;
}

/* Definitive note-editor layout fix: reserve the fixed site header exactly once. */
:root{--real-header-height:88px;}
body > header{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    height:88px !important;
    min-height:88px !important;
    max-height:88px !important;
    padding-top:7px !important;
    padding-bottom:7px !important;
    z-index:20000 !important;
}
#editorView{
    margin-top:88px !important;
    padding-top:0 !important;
    height:calc(100vh - 88px) !important;
    min-height:0 !important;
    overflow:hidden !important;
}
#editorHeader{
    position:relative !important;
    top:auto !important;
    flex:0 0 54px !important;
    min-height:54px !important;
    height:54px !important;
    margin-top:0 !important;
}
#editorToolbar{
    position:relative !important;
    top:auto !important;
    flex:0 0 64px !important;
    min-height:64px !important;
}
@media(max-width:760px){
    body > header{
        height:auto !important;
        min-height:0 !important;
        max-height:none !important;
    }
    #editorView{
        margin-top:var(--real-header-height, 104px) !important;
        height:calc(100dvh - var(--real-header-height, 104px)) !important;
    }
    #editorHeader{flex-basis:58px !important;height:58px !important;min-height:58px !important;}
}

/* Initiative Enemies picker */
#initiativeEnemiesWindow{position:fixed;inset:0;z-index:100500;background:rgba(8,13,10,.78);display:flex;align-items:center;justify-content:center;padding:24px;}
#initiativeEnemiesWindow.hidden{display:none!important}
.initiativeEnemiesBox{width:min(1120px,96vw);max-height:90vh;overflow:hidden;display:flex;flex-direction:column;background:#f3e6c8;color:#282116;border:3px solid #8c6b35;box-shadow:0 18px 70px #000a;border-radius:8px;padding:18px;}
.initiativeEnemiesHeader{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;border-bottom:1px solid #b8a477;padding-bottom:12px}
.initiativeEnemiesHeader span{font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:#75613b}
.initiativeEnemiesHeader h2{margin:3px 0;font-family:Georgia,serif;font-size:28px}
.initiativeEnemiesHeader p{margin:4px 0 0;color:#625640}
.initiativeEnemiesHeader>button{font-size:22px;min-width:42px;min-height:42px;border-radius:50%;cursor:pointer}
.initiativeEnemiesSearchRow{display:flex;gap:8px;margin:14px 0 6px}
.initiativeEnemiesSearchRow input{flex:1;min-width:0;padding:11px 12px;border:1px solid #9f8a60;border-radius:4px;background:#fffaf0;color:#241e15;font-size:16px}
.initiativeEnemiesSearchRow button,.initiativeEnemyCard button{border:1px solid #8b713e;background:#244234;color:#f7ebc8;border-radius:4px;padding:9px 13px;font-weight:700;cursor:pointer}
.initiativeEnemiesStatus{font-size:13px;min-height:22px;color:#63563d;margin-bottom:8px}
.initiativeEnemiesColumns{display:grid;grid-template-columns:1fr 1fr;gap:14px;min-height:0;overflow:hidden}
.initiativeEnemiesColumns>section{display:flex;flex-direction:column;min-height:0}
.initiativeEnemiesColumns h3{font-family:Georgia,serif;margin:5px 0 8px}
.initiativeEnemiesResults{overflow:auto;min-height:100px;max-height:42vh;padding:2px 5px 2px 0;display:flex;flex-direction:column;gap:8px}
.initiativeEnemyCard{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px;background:#fff8e8;border:1px solid #c7b58b;border-radius:5px}
.initiativeEnemyCard[draggable="true"]{cursor:grab}
.initiativeEnemyCard strong{display:block;font-size:14px}
.initiativeEnemyCard small{display:block;margin-top:3px;color:#6c5c40}
.initiativeEnemiesDropTarget{margin-top:12px;border:2px dashed #8c6b35;background:#e9d9b3;border-radius:5px;text-align:center;padding:12px;color:#594729;font-weight:700}
.initiativeEnemiesDropTarget.drag-over{background:#d4e2c9;border-color:#426d43}
@media(max-width:700px){#initiativeEnemiesWindow{padding:8px}.initiativeEnemiesBox{width:100%;max-height:96vh;padding:12px}.initiativeEnemiesColumns{grid-template-columns:1fr}.initiativeEnemiesResults{max-height:24vh}.initiativeEnemiesHeader h2{font-size:23px}}


/* Initiative Tracker redesign — clean forest-green and muted-gold workspace */
#initiativeTracker{
  box-sizing:border-box; padding:clamp(12px,2vw,26px)!important; overflow:auto;
  background:radial-gradient(ellipse at 50% 0%,#15382c 0%,#0b211b 48%,#071611 100%)!important;
  color:#f0e5c9!important; gap:0;
}
#initiativeTracker.show{display:flex!important;flex-direction:column;}
#initiativeTracker .trackerToolbar{
  justify-content:flex-start!important; gap:8px!important; padding:10px 12px!important;
  margin:0 0 14px!important; border:1px solid #826b3b!important; border-radius:10px!important;
  background:rgba(5,20,15,.86)!important; box-shadow:none!important;
}
#initiativeTracker .trackerToolbar button{
  min-width:0!important; min-height:38px!important; padding:8px 13px!important;
  border:1px solid #5c795f!important; border-radius:7px!important;
  background:linear-gradient(180deg,#214b39,#143426)!important; color:#f6edda!important;
  font-size:13px!important; font-weight:650!important; letter-spacing:0!important;
  box-shadow:none!important; transition:background .15s,border-color .15s!important;
}
#initiativeTracker .trackerToolbar button:hover{transform:none!important;background:#2c5b43!important;border-color:#c1a15d!important;box-shadow:none!important;}
#initiativeTracker #resetInitiativeBtn{margin-left:auto;border-color:#765b45!important;background:#30251f!important;}
#initiativeTracker #roundCounter{
  align-self:flex-start!important; width:auto!important; min-width:0!important; margin:0 0 12px!important;
  padding:8px 14px!important; border:1px solid #8c7745!important; border-radius:8px!important;
  background:rgba(6,24,17,.7)!important; color:#e5c77f!important; font-size:16px!important;
  font-weight:700!important; letter-spacing:.2px!important; box-shadow:none!important;
}
#initiativeTracker .activeEncounterSummary{margin:0 0 12px!important;border:1px solid #536e56!important;border-radius:8px;background:rgba(13,35,26,.8);padding:12px 16px;}
#initiativeTracker .initiativeWorkspace{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;min-height:0;}
#initiativeTracker .initiativeTablePane{min-width:0;overflow:auto;border:1px solid #536e56;border-radius:10px;background:rgba(6,22,17,.78);box-shadow:0 8px 24px rgba(0,0,0,.16);}
#initiativeTracker #initiativeTable{width:100%!important;min-width:660px!important;border:0!important;border-collapse:separate!important;border-spacing:0!important;border-radius:10px!important;overflow:hidden;background:transparent!important;color:#f0e8d8!important;box-shadow:none!important;}
#initiativeTracker #initiativeTable thead{background:#17392b!important;}
#initiativeTracker #initiativeTable th{position:sticky;top:0;z-index:2;padding:13px 12px!important;background:#17392b!important;color:#d8c38e!important;border-bottom:1px solid #78683e!important;text-align:left;font-size:12px!important;text-transform:uppercase;letter-spacing:.07em;font-weight:700!important;}
#initiativeTracker #initiativeTable td{padding:12px!important;border-bottom:1px solid rgba(127,151,123,.17)!important;background:transparent!important;color:#f0e8d8!important;vertical-align:middle;}
#initiativeTracker #initiativeTable tbody tr{transition:background .14s!important;}
#initiativeTracker #initiativeTable tbody tr:hover td{background:rgba(71,111,78,.17)!important;}
#initiativeTracker #initiativeTable tbody tr:last-child td{border-bottom:0!important;}
#initiativeTracker #initiativeTable button{min-width:30px;min-height:30px;border-radius:6px;border:1px solid #4c6c53;background:#17392b;color:#f4e8c9;box-shadow:none;}
#initiativeTracker #initiativeTable button:hover{background:#28543c;border-color:#b89a57;}
#initiativeTracker #initiativeTable input,#initiativeTracker #initiativeTable select,#initiativeTracker #initiativeTable textarea{max-width:100%;background:#0d251b;color:#f5eddd;border:1px solid #4d6b50;border-radius:5px;padding:6px 8px;}
#initiativeTracker #initiativeTable input:focus,#initiativeTracker #initiativeTable select:focus,#initiativeTracker #initiativeTable textarea:focus{outline:2px solid #b79b5a;outline-offset:1px;}
#initiativeTracker .hidden{display:none!important;}
@media(max-width:760px){
 #initiativeTracker{padding:10px!important;}
 #initiativeTracker .trackerToolbar{gap:6px!important;padding:8px!important;}
 #initiativeTracker .trackerToolbar button{font-size:12px!important;padding:8px 10px!important;}
 #initiativeTracker #resetInitiativeBtn{margin-left:0;}
 #initiativeTracker #initiativeTable{min-width:600px!important;}
}


/* Initiative Tracker — ornate fantasy header, portrait chips, and readable HP bars */
#initiativeTracker{position:relative;isolation:isolate;border:1px solid rgba(190,151,69,.72)!important;border-radius:16px!important;background:radial-gradient(ellipse at 50% 0%,rgba(34,72,49,.45),transparent 54%),linear-gradient(145deg,#071b14 0%,#0b241a 56%,#06160f 100%)!important;box-shadow:0 16px 42px rgba(0,0,0,.28),inset 0 0 0 2px rgba(190,151,69,.12)!important;color:#f4ead2!important;overflow:hidden}
#initiativeTracker:before{content:none!important;display:none!important}
#initiativeTracker .trackerToolbar{border:1px solid rgba(190,151,69,.35)!important;border-radius:8px!important;background:rgba(5,22,15,.75)!important;padding:10px!important;margin:12px 12px 10px!important;gap:8px!important}
#initiativeTracker .trackerToolbar button{border:1px solid #8d733d!important;border-radius:6px!important;background:linear-gradient(#19442f,#0c291c)!important;color:#f5e8c9!important;font-weight:650!important;box-shadow:inset 0 1px rgba(255,255,255,.05)!important}
#initiativeTracker .trackerToolbar button:hover{background:linear-gradient(#2a6342,#17412c)!important;border-color:#d5b35d!important}
#initiativeTracker #roundCounter{display:inline-flex;align-items:center;justify-content:center;margin:2px 12px 12px!important;min-width:112px;min-height:52px;padding:10px 18px!important;border:1px solid #a48647!important;border-radius:10px!important;background:radial-gradient(circle at 50% 0%,#234c34,#0a2117 75%)!important;color:#f3d78e!important;font-family:Georgia,serif;font-size:22px!important;font-weight:700;box-shadow:inset 0 0 0 2px rgba(210,175,96,.08),0 4px 14px rgba(0,0,0,.18)}
#initiativeTracker .initiativeWorkspace{padding:0 12px 12px!important;display:grid;grid-template-columns:minmax(0,1fr)!important;gap:12px!important}
#initiativeTracker .initiativeTablePane{border:1px solid rgba(185,146,65,.62)!important;border-radius:9px!important;background:rgba(4,20,14,.72)!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.025)!important;overflow:auto}
#initiativeTracker #initiativeTable{width:100%!important;min-width:850px!important;border-collapse:separate!important;border-spacing:0!important;background:transparent!important;color:#f4ead5!important}
#initiativeTracker #initiativeTable thead th{position:sticky;top:0;z-index:2;background:linear-gradient(#1b422e,#102d20)!important;color:#e3c77e!important;border-bottom:1px solid #8d733d!important;padding:13px 11px!important;font-family:Georgia,serif;font-size:14px!important;letter-spacing:.045em}
#initiativeTracker #initiativeTable tbody td{padding:10px 11px!important;border-bottom:1px solid rgba(163,151,111,.17)!important;background:transparent!important;color:#f4ead5!important;vertical-align:middle!important}
#initiativeTracker #initiativeTable tbody tr:hover td{background:rgba(54,94,59,.2)!important}
#initiativeTracker #initiativeTable tbody tr.activeTurn td{background:linear-gradient(90deg,rgba(176,133,45,.16),rgba(31,77,48,.28))!important;border-top:1px solid #d9b65b!important;border-bottom:1px solid #d9b65b!important}
#initiativeTracker .combatantNameWithPortrait{display:flex;align-items:center;gap:10px;min-width:180px}
#initiativeTracker .combatantPortraitWrap{position:relative;flex:0 0 48px;width:48px;height:48px}
#initiativeTracker .combatantPortrait{width:48px;height:48px;display:flex;align-items:center;justify-content:center;border:1px solid #bd9b4e;border-radius:50%;background:radial-gradient(circle at 35% 25%,#315d3c,#0a2117 72%);background-position:center;background-size:cover;color:#e5c879;font-size:23px;box-shadow:0 0 0 2px rgba(201,163,76,.12),inset 0 0 0 2px rgba(0,0,0,.3)}
#initiativeTracker .combatantPortrait.hasPortrait{font-size:0}
#initiativeTracker .portraitUploadButton{position:absolute;right:-3px;bottom:-3px;width:19px;height:19px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#d4b15c;color:#102318;border:1px solid #f1d98e;font-size:15px;font-weight:800;cursor:pointer;line-height:1}
#initiativeTracker .portraitUploadButton input{position:absolute;width:1px;height:1px;opacity:0;overflow:hidden}
#initiativeTracker .combatantNameDetails{min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:4px}
#initiativeTracker .combatantNameDetails .nameField{width:100%;min-width:120px;font-weight:650;font-size:14px!important;background:rgba(3,17,11,.5)!important;border:1px solid rgba(153,132,78,.35)!important;color:#fff3d7!important}
#initiativeTracker .combatantNameDetails small{color:#b7b49c!important;font-size:11px!important}
#initiativeTracker .hpControl{display:flex;align-items:center;gap:5px;min-width:150px}
#initiativeTracker .hpControl .hpField{order:0;min-width:92px;width:100px;text-align:center;font-weight:750;font-variant-numeric:tabular-nums;background:rgba(3,16,11,.7)!important;border:1px solid rgba(167,142,77,.5)!important;color:#fff2d4!important}
#initiativeTracker .hpControl .hpButtons{display:flex;gap:3px}
#initiativeTracker .hpControl .hpChangeBtn{min-width:25px!important;min-height:26px!important;padding:2px 5px!important;font-size:11px!important}
#initiativeTracker .hpBarTrack{height:10px;width:min(100%,220px);margin:6px 0 2px;border-radius:99px;overflow:hidden;background:#1a2a20;border:1px solid rgba(150,170,130,.16);box-shadow:inset 0 1px 3px rgba(0,0,0,.45)}
#initiativeTracker .hpBarFill{display:block;height:100%;border-radius:99px;background:#2ecc71;transition:width .18s ease,background .18s ease,box-shadow .18s ease}
#initiativeTracker .tempHpControl{display:flex;align-items:center;gap:6px;margin-top:5px;color:#c4c0a8;font-size:11px}
#initiativeTracker .tempHpField{width:62px!important}
#initiativeTracker .combatStateButtons{display:flex;flex-wrap:wrap;gap:5px;max-width:250px}
#initiativeTracker .combatStateButtons button{font-size:11px!important;padding:6px 8px!important;border-radius:5px!important}
#initiativeTracker input:focus,#initiativeTracker select:focus,#initiativeTracker textarea:focus{outline:2px solid #d6b65f!important;outline-offset:1px}
@media(max-width:760px){#initiativeTracker:before{letter-spacing:.08em}#initiativeTracker .initiativeWorkspace{padding:0 7px 8px!important}#initiativeTracker .trackerToolbar{margin:8px!important}#initiativeTracker #initiativeTable{min-width:820px!important}#initiativeTracker .combatantPortraitWrap,#initiativeTracker .combatantPortrait{width:40px;height:40px}#initiativeTracker .combatantPortraitWrap{flex-basis:40px}}

/* Full-height campaign map panel: use the available screen area below the site header. */
.dm-map-root{
    height:calc(100vh - var(--real-header-height, 76px) - 12px) !important;
    min-height:0 !important;
    max-height:none !important;
    gap:0 !important;
    display:flex !important;
    flex-direction:column !important;
    overflow:hidden !important;
}
.dm-map-root .dm-map-toolbar,
.dm-map-root .dm-map-status{
    position:relative !important;
    top:auto !important;
    flex:0 0 auto !important;
}
.dm-map-root .dm-map-workspace{
    flex:1 1 auto !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    overflow:hidden !important;
}
.dm-map-root .dm-map-information{
    flex:0 0 auto !important;
    max-height:78px !important;
    overflow:auto !important;
    padding:7px 12px !important;
}
.dm-map-root .dm-map-information h1{
    margin:0 0 3px !important;
    font-size:15px !important;
}
.dm-map-root .dm-map-information p{
    margin:2px 0 !important;
    font-size:11px !important;
}
@media(max-width:700px){
    .dm-map-root{
        height:calc(100vh - var(--real-header-height, 76px) - 8px) !important;
    }
    .dm-map-root .dm-map-workspace{
        height:auto !important;
        min-height:0 !important;
    }
    .dm-map-root .dm-map-information{
        max-height:58px !important;
    }
}

/* v52.12 — keep the site header above the map, never over the image */
#editor:has(.mapPanel){
    box-sizing:border-box!important;
    padding-top:12px!important;
}
#editor:has(.mapPanel) .mapPanel{
    box-sizing:border-box!important;
    display:flex!important;
    flex-direction:column!important;
    height:calc(100vh - var(--real-header-height) - 24px)!important;
    min-height:420px!important;
    max-height:calc(100vh - var(--real-header-height) - 24px)!important;
    overflow:hidden!important;
}
#editor:has(.mapPanel) .mapPanelToolbar,
#editor:has(.mapPanel) .interactiveMapToolbar{
    position:relative!important;
    top:auto!important;
    flex:0 0 auto!important;
    z-index:5!important;
}
#editor:has(.mapPanel) .mapPanelStatus,
#editor:has(.mapPanel) .mapInteractionStatus,
#editor:has(.mapPanel) .mapPanelInfoBar{
    position:relative!important;
    top:auto!important;
    flex:0 0 auto!important;
    z-index:4!important;
}
#editor:has(.mapPanel) .mapViewerShell{
    display:flex!important;
    flex:1 1 auto!important;
    min-height:0!important;
    overflow:hidden!important;
}
#editor:has(.mapPanel) .mapPanelViewport,
#editor:has(.mapPanel) .mapViewerShell .mapPanelViewport{
    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    overflow:hidden!important;
}
@media(max-width:700px){
    #editor:has(.mapPanel){padding-top:8px!important}
    #editor:has(.mapPanel) .mapPanel{
        height:calc(100dvh - var(--real-header-height) - 16px)!important;
        max-height:calc(100dvh - var(--real-header-height) - 16px)!important;
        min-height:320px!important;
    }
}

/* Initiative Tracker — reference layout: banner, round badge, current/next cards */
#initiativeTracker .initiativeTrackerBanner{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    padding:14px 22px 10px;
    border-bottom:1px solid rgba(194,155,70,.45);
    background:linear-gradient(90deg,rgba(21,59,39,.55),rgba(9,29,20,.2) 55%,transparent);
}
#initiativeTracker .initiativeTrackerBanner h2{
    margin:0;
    display:flex;
    align-items:center;
    gap:10px;
    color:#e8c56a;
    font-family:Georgia,serif;
    font-size:clamp(22px,2.2vw,32px);
    font-weight:700;
    letter-spacing:.02em;
    text-shadow:0 0 18px rgba(213,168,72,.28);
}
#initiativeTracker .initiativeTrackerBanner h2 span{font-size:.9em;color:#f0d48a}
#initiativeTracker .initiativeTurnStrip{
    display:grid;
    grid-template-columns:92px minmax(0,1fr) minmax(0,1fr);
    gap:12px;
    align-items:stretch;
    margin:0 12px 12px;
}
#initiativeTracker #roundCounter{
    position:relative!important;
    top:auto!important;
    display:flex!important;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    margin:0!important;
    min-width:84px;
    min-height:84px;
    width:84px;
    height:84px;
    padding:8px!important;
    border:2px solid #c9a24e!important;
    border-radius:50%!important;
    background:radial-gradient(circle at 50% 28%,#2a5a3a,#0a2117 72%)!important;
    box-shadow:inset 0 0 0 3px rgba(12,28,20,.85),0 6px 16px rgba(0,0,0,.28)!important;
}
#initiativeTracker #roundCounter small{
    color:#d7c089;
    font-size:10px;
    font-weight:800;
    letter-spacing:.12em;
    text-transform:uppercase;
}
#initiativeTracker #roundCounter strong{
    color:#f6e3b0;
    font-family:Georgia,serif;
    font-size:28px;
    line-height:1;
    font-weight:700;
}
#initiativeTracker .initiativeFocusCard{
    display:flex;
    align-items:center;
    gap:12px;
    min-height:84px;
    padding:10px 14px;
    border:1px solid rgba(196,158,74,.45);
    border-radius:14px;
    background:linear-gradient(180deg,rgba(18,46,33,.92),rgba(8,22,16,.94));
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.04);
}
#initiativeTracker .initiativeFocusCard.isCurrent{
    border-color:#d7b45c;
    box-shadow:0 0 0 1px rgba(215,180,92,.35),inset 0 0 0 1px rgba(215,180,92,.12);
}
#initiativeTracker .initiativeFocusEyebrow{
    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    clip:rect(0 0 0 0);
}
#initiativeTracker .initiativeFocusCard{
    position:relative;
}
#initiativeTracker .initiativeFocusCard.isCurrent::before,
#initiativeTracker .initiativeFocusCard.isNext::before{
    content:"";
    position:absolute;
    left:14px;
    top:8px;
    color:#d4b56a;
    font-size:10px;
    font-weight:800;
    letter-spacing:.12em;
    text-transform:uppercase;
}
#initiativeTracker .initiativeFocusCard.isCurrent::before{content:"Current Turn"}
#initiativeTracker .initiativeFocusCard.isNext::before{content:"Next Up"}
#initiativeTracker .initiativeFocusPortrait,
#initiativeTracker .initiativeFocusCard .combatantPortrait{
    flex:0 0 52px;
    width:52px;
    height:52px;
    margin-top:12px;
}
#initiativeTracker .initiativeFocusCopy{
    min-width:0;
    display:flex;
    flex-direction:column;
    gap:2px;
    margin-top:12px;
}
#initiativeTracker .initiativeFocusCopy strong{
    color:#fff4d8;
    font-size:16px;
    font-weight:750;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
#initiativeTracker .initiativeFocusCopy small{
    color:#b7b49c;
    font-size:12px;
}
#initiativeTracker .initiativeFocusCopy em{
    color:#cfc6a4;
    font-size:11px;
    font-style:normal;
    font-variant-numeric:tabular-nums;
}
#initiativeTracker .initiativeFocusEmpty{
    margin-top:16px;
    color:#9aa18c;
    font-size:14px;
}
#initiativeTracker .initiativeFocusHp{
    width:min(100%,180px)!important;
    height:8px!important;
}
#initiativeTracker #initiativeTable th:nth-child(1),
#initiativeTracker #initiativeTable td:nth-child(1){
    width:120px!important;
    min-width:120px!important;
    overflow:visible!important;
}
#initiativeTracker .initiativeLeadCell{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:6px;
    min-width:88px;
}
#initiativeTracker .initiativeField{
    width:76px!important;
    min-width:76px!important;
    max-width:none!important;
    min-height:40px!important;
    padding:4px 6px!important;
    text-align:center!important;
    font-size:22px!important;
    font-weight:800!important;
    font-variant-numeric:tabular-nums;
    color:#f8e7b0!important;
    -webkit-text-fill-color:#f8e7b0!important;
    caret-color:#f8e7b0!important;
    background:#08160f!important;
    border:1px solid #c9a24e!important;
    appearance:textfield;
    -moz-appearance:textfield;
}
#initiativeTracker .initiativeField::-webkit-outer-spin-button,
#initiativeTracker .initiativeField::-webkit-inner-spin-button{
    -webkit-appearance:none;
    margin:0;
}
#initiativeTracker .rollModeField{
    width:76px!important;
    min-height:28px!important;
    margin-top:0!important;
    color:#f5eddd!important;
    background:#0d251b!important;
}
#initiativeTracker #initiativeTable th:nth-child(3),
#initiativeTracker #initiativeTable td:nth-child(3){
    width:92px!important;
    min-width:92px!important;
    overflow:visible!important;
}
#initiativeTracker .acField{
    width:72px!important;
    min-width:72px!important;
    max-width:none!important;
    min-height:40px!important;
    padding:4px 6px!important;
    text-align:center!important;
    font-size:20px!important;
    font-weight:800!important;
    font-variant-numeric:tabular-nums;
    color:#f8e7b0!important;
    -webkit-text-fill-color:#f8e7b0!important;
    caret-color:#f8e7b0!important;
    background:#08160f!important;
    border:1px solid #c9a24e!important;
    appearance:textfield;
    -moz-appearance:textfield;
}
#initiativeTracker .acField::-webkit-outer-spin-button,
#initiativeTracker .acField::-webkit-inner-spin-button{
    -webkit-appearance:none;
    margin:0;
}
#initiativeTracker .initIndexBadge{
    display:grid;
    place-items:center;
    width:28px;
    height:28px;
    border:1px solid #c9a24e;
    border-radius:50%;
    background:radial-gradient(circle at 50% 30%,#3a6a48,#143224);
    color:#f3e0a8;
    font-size:13px;
    font-weight:800;
}
#initiativeTracker #initiativeTable tbody tr.activeTurn .initIndexBadge{
    background:radial-gradient(circle at 50% 30%,#ffb060,#c24e12);
    color:#1a0c04;
    border-color:#ffd0a0;
}
#initiativeTracker .combatantTypeBadge{
    display:inline-flex;
    align-items:center;
    padding:1px 7px;
    border-radius:99px;
    font-size:10px;
    font-weight:800;
    letter-spacing:.04em;
    text-transform:uppercase;
}
#initiativeTracker .combatantType-pc{
    background:rgba(61,130,92,.22);
    color:#8fe0b0;
    border:1px solid rgba(110,190,140,.4);
}
#initiativeTracker .combatantType-npc{
    background:rgba(90,120,170,.22);
    color:#b8d4ff;
    border:1px solid rgba(140,170,210,.4);
}
#initiativeTracker .combatantType-monster{
    background:rgba(170,70,60,.2);
    color:#f0a090;
    border:1px solid rgba(210,120,100,.4);
}
#initiativeTracker #initiativeTable tbody tr.activeTurn td{
    background:linear-gradient(90deg,rgba(232,96,28,.46),rgba(120,36,12,.3) 58%,rgba(72,28,14,.22))!important;
    border-top:2px solid #ff8a3d!important;
    border-bottom:2px solid #ff8a3d!important;
    box-shadow:inset 6px 0 0 #ff7a2a,inset 0 0 18px rgba(255,122,42,.12)!important;
    color:#fff4e6!important;
}
#initiativeTracker #initiativeTable tbody tr.activeTurn td:first-child{
    border-left:0!important;
}
#initiativeTracker #initiativeTable tbody tr.activeTurn .initiativeLeadCell::after{
    content:"NOW";
    display:block;
    margin-top:2px;
    color:#ffd0a8;
    font-size:9px;
    font-weight:800;
    letter-spacing:.12em;
}
#initiativeTracker #initiativeTable tbody tr.activeTurn input,
#initiativeTracker #initiativeTable tbody tr.activeTurn select,
#initiativeTracker #initiativeTable tbody tr.activeTurn textarea{
    background:#1a0c08!important;
    color:#ffe7c4!important;
    -webkit-text-fill-color:#ffe7c4!important;
    border-color:#ff9a4a!important;
}
#initiativeTracker #addCombatantBtn{
    background:linear-gradient(180deg,#3f7a55,#234a34)!important;
    border-color:#8fd0a4!important;
}
#initiativeTracker #resetInitiativeBtn{
    background:linear-gradient(180deg,#3d4a55,#1e2a32)!important;
}
@media(max-width:900px){
    #initiativeTracker .initiativeTurnStrip{
        grid-template-columns:1fr 1fr;
    }
    #initiativeTracker #roundCounter{
        grid-column:1/-1;
        justify-self:center;
    }
}

#initiativeTracker .initiativeTrackerTop{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px 16px;
    flex-wrap:wrap;
    padding:4px 12px 0;
}
#initiativeTracker .initiativeTrackerBanner{
    padding:10px 8px 8px;
    border-bottom:none;
    background:none;
}
#initiativeTracker .trackerToolbar.initiativeTabBar{
    position:relative!important;
    top:auto!important;
    margin:8px 0!important;
    padding:6px!important;
    justify-content:flex-end!important;
    background:rgba(5,22,15,.55)!important;
    border:1px solid rgba(190,151,69,.28)!important;
    box-shadow:none!important;
}
#initiativeTracker .initiativeTabBar button{
    min-height:36px;
    padding:8px 14px!important;
    border-radius:8px!important;
    font-size:13px!important;
}
#initiativeTracker .initiativeTab.isActive,
#initiativeTracker #initiativeTabBtn{
    background:linear-gradient(180deg,#d7b45c,#8d6a24)!important;
    color:#1a1408!important;
    border-color:#f0d48a!important;
}
#initiativeTracker .initiativeGearBtn{
    width:38px;
    min-width:38px;
    padding:8px 0!important;
}
#initiativeTracker .initiativeMainLayout{
    display:grid;
    grid-template-columns:minmax(0,1fr) 268px;
    gap:8px;
    align-items:start;
    padding:0 6px 8px 6px;
}
#initiativeTracker .initiativeMainColumn{min-width:0}
#initiativeTracker .initiativeTurnStrip{margin:0 0 8px}
#initiativeTracker .initiativeWorkspace{
    padding:0!important;
    gap:0!important;
}
#initiativeTracker .initiativeTablePane{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    scrollbar-gutter:auto!important;
}
#initiativeTracker .initiativeSidePanel{
    display:flex;
    flex-direction:column;
    gap:12px;
    position:sticky;
    top:8px;
}
#initiativeTracker .initiativeSideCard{
    padding:12px;
    border:1px solid rgba(196,158,74,.4);
    border-radius:14px;
    background:linear-gradient(180deg,rgba(18,46,33,.94),rgba(8,22,16,.96));
}
#initiativeTracker .initiativeSideCard h3{
    margin:0 0 10px;
    color:#e8c56a;
    font-family:Georgia,serif;
    font-size:15px;
    font-weight:700;
}
#initiativeTracker .initiativeTurnControls,
#initiativeTracker .initiativeQuickActions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
}
#initiativeTracker #initiativeTabBtn{display:none!important;}
#initiativeTracker .initiativeTurnControls button,
#initiativeTracker .initiativeQuickActions button,
#initiativeTracker .trackerToolbar button{
    min-height:42px;
    padding:8px 10px!important;
    border:1px solid rgba(8,36,20,.55)!important;
    border-radius:10px!important;
    background:#1f8a4c!important;
    color:#f4fff6!important;
    font-size:12px!important;
    font-weight:700!important;
    box-shadow:none!important;
}
#initiativeTracker .trackerToolbar button:hover,
#initiativeTracker .initiativeTurnControls button:hover{
    background:#27a85c!important;
}
#initiativeTracker .trackerToolbar.initiativeTabBar{
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:wrap!important;
    grid-template-columns:none!important;
    align-items:center!important;
}
#initiativeTracker .initiativeTurnControls #nextTurnBtn,
#initiativeTracker #nextTurnBtn{
    grid-column:1/-1;
    background:#1eaf5c!important;
    color:#f4fff6!important;
    border-color:#167a40!important;
    box-shadow:0 0 10px rgba(30,175,92,.35)!important;
}
#initiativeTracker #nextTurnBtn:hover{
    background:#27c468!important;
}
#initiativeTracker #saveCombatStateBtn,
#initiativeTracker #openCombatLogBtn{
    background:#1f8a4c!important;
    color:#f4fff6!important;
    border-color:rgba(8,36,20,.55)!important;
}
#initiativeTracker #openCombatLogBtn{
    width:auto!important;
    min-width:38px!important;
}
#initiativeTracker #resetInitiativeBtn,
#initiativeTracker #resetInitiativeBtn .resetBtnLabel{
    display:inline-flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
    white-space:nowrap!important;
}
#initiativeTracker #resetInitiativeBtn{
    width:auto!important;
    min-width:max-content!important;
    background:#1f8a4c!important;
    color:#f4fff6!important;
    border-color:rgba(8,36,20,.55)!important;
}
#initiativeTracker #resetInitiativeBtn .resetBtnIcon{
    width:15px!important;
    height:15px!important;
    min-width:15px!important;
    max-width:15px!important;
    flex:0 0 15px!important;
    display:inline-block!important;
    margin:0!important;
}
#initiativeTracker #openEnemiesBtn{
    display:inline-flex!important;
    align-items:center!important;
    gap:6px!important;
}
#initiativeTracker .enemiesBtnIcon{
    width:16px;
    height:16px;
    flex:0 0 16px;
    display:block;
}
#initiativeTracker #initiativeTabBtn{display:none!important;}
#initiativeTracker .initiativeTurnControls #endEncounterBtn{
    grid-column:1/-1;
    background:linear-gradient(180deg,#5a3a28,#2c1b14)!important;
}
#initiativeTracker .initiativeOrderList{
    list-style:none;
    margin:0;
    padding:0;
    display:flex;
    flex-direction:column;
    gap:6px;
    max-height:280px;
    overflow:auto;
}
#initiativeTracker .initiativeOrderList li{
    display:flex;
    align-items:center;
    gap:8px;
    padding:6px 8px;
    border-radius:10px;
    border:1px solid transparent;
    color:#f4ead2;
    font-size:13px;
}
#initiativeTracker .initiativeOrderList li.isCurrent{
    border-color:#d7b45c;
    background:rgba(215,180,92,.12);
}
#initiativeTracker .initiativeOrderList .combatantPortrait{
    width:28px;
    height:28px;
    font-size:14px;
}
#initiativeTracker .initiativeOrderName{
    flex:1;
    min-width:0;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
#initiativeTracker .initiativeOrderList em{
    color:#d7b45c;
    font-style:normal;
    font-size:10px;
    font-weight:800;
    letter-spacing:.06em;
    text-transform:uppercase;
}
#initiativeTracker .initiativeOrderEmpty{
    color:#9aa18c;
    justify-content:center;
}
@media(max-width:1100px){
    #initiativeTracker .initiativeMainLayout{
        grid-template-columns:1fr;
    }
    #initiativeTracker .initiativeSidePanel{
        position:relative;
        top:auto;
    }
}

#initiativeTracker .combatantActionRail{
    display:flex;
    align-items:center;
    gap:6px;
    flex-wrap:nowrap;
    max-width:none;
}
#initiativeTracker .combatIconBtn{
    width:34px;
    height:34px;
    min-width:34px;
    padding:0!important;
    display:grid;
    place-items:center;
    border:1px solid #b08a45!important;
    border-radius:50%!important;
    background:radial-gradient(circle at 35% 25%,#2a5a3d,#102318 72%)!important;
    color:#f3e2b4!important;
    font-size:15px!important;
    line-height:1!important;
    cursor:pointer;
    box-shadow:inset 0 1px rgba(255,255,255,.08),0 4px 8px rgba(0,0,0,.22);
}
#initiativeTracker .combatIconBtn:hover{
    filter:brightness(1.12);
    border-color:#e2c36a!important;
}
#initiativeTracker .combatIconBtn.concentrationBtn.active{
    background:radial-gradient(circle at 35% 25%,#5b8ad4,#243a68 72%)!important;
    border-color:#9ec0ff!important;
    box-shadow:0 0 10px rgba(110,160,255,.35);
}
#initiativeTracker .combatIconBtn.reactionBtn.active{
    background:radial-gradient(circle at 35% 25%,#8a6a28,#3a2a12 72%)!important;
    color:#c9b48a!important;
    opacity:.72;
}
#initiativeTracker .combatantHpHealRollBtn{
    background:radial-gradient(circle at 35% 25%,#3f8a58,#163224 72%)!important;
    border-color:#8fd0a4!important;
}
#initiativeTracker .combatantHpDamageRollBtn{
    background:radial-gradient(circle at 35% 25%,#8a4034,#3a1612 72%)!important;
    border-color:#e08a78!important;
}
#initiativeTracker .combatantMoreWrap{
    position:relative;
}
#initiativeTracker .combatantActionMenu{
    position:absolute;
    top:calc(100% + 6px);
    right:0;
    z-index:40;
    display:flex;
    flex-direction:column;
    gap:4px;
    min-width:210px;
    padding:8px;
    border:1px solid rgba(196,158,74,.55);
    border-radius:12px;
    background:linear-gradient(180deg,#163525,#0b1c14);
    box-shadow:0 14px 28px rgba(0,0,0,.4);
}
#initiativeTracker .combatantActionMenu.hidden{display:none!important}
#initiativeTracker .combatMenuItem{
    width:100%;
    min-height:36px;
    padding:8px 10px!important;
    border:1px solid rgba(176,138,69,.35)!important;
    border-radius:8px!important;
    background:rgba(8,24,16,.72)!important;
    color:#f5ead0!important;
    font-size:12px!important;
    font-weight:700!important;
    text-align:left!important;
    cursor:pointer;
}
#initiativeTracker .combatMenuItem:hover{
    border-color:#d7b45c!important;
    background:rgba(40,72,48,.9)!important;
}
#initiativeTracker .combatMenuItem.active{
    background:linear-gradient(180deg,#3f7a55,#234a34)!important;
    border-color:#8fd0a4!important;
}
#initiativeTracker .combatMenuItem.defeatedBtn.active{
    background:linear-gradient(180deg,#8a4034,#3a1612)!important;
    border-color:#e08a78!important;
}

#initiativeTracker #initiativeTable.initiativeLegacyTable,
#initiativeTracker #initiativeTable[hidden]{
    display:none!important;
}
#initiativeTracker .initiativeCardGrid{
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(290px,1fr));
    gap:12px;
    width:100%;
    min-width:0;
    padding:2px;
}
#initiativeTracker .initiativeCardEmpty{
    grid-column:1/-1;
    margin:28px 8px;
    color:#cbb992;
    text-align:center;
    font-size:15px;
}
#initiativeTracker .combatantCard{
    position:relative;
    display:flex;
    flex-direction:column;
    gap:10px;
    min-width:0;
    padding:14px;
    border:1px solid rgba(201,162,74,.55);
    border-radius:16px;
    background:linear-gradient(180deg,rgba(18,46,33,.97),rgba(8,22,16,.98));
    box-shadow:0 10px 24px rgba(0,0,0,.24),inset 0 0 0 1px rgba(255,255,255,.04);
    color:#f4ead2;
}
#initiativeTracker .combatantCard.combatantPlayer{
    box-shadow:inset 4px 0 0 #4f9b69,0 10px 24px rgba(0,0,0,.24);
}
#initiativeTracker .combatantCard.activeTurn{
    border-color:#ff8a3d;
    background:linear-gradient(180deg,rgba(110,42,16,.62),rgba(18,22,16,.97));
    box-shadow:0 0 0 1px #ff7a2a,0 12px 28px rgba(255,122,42,.2),inset 4px 0 0 #ff7a2a;
}
#initiativeTracker .combatantCard.combatantDefeated{
    opacity:.68;
}
#initiativeTracker .combatantCard.combatantUnconscious .unconsciousLabel,
#initiativeTracker .combatantCard.combatantDefeated .unconsciousLabel{
    display:inline-block;
}
#initiativeTracker .combatantCardTop{
    display:flex;
    align-items:center;
    gap:8px;
}
#initiativeTracker .combatantNowLabel{
    color:#ffd0a8;
    font-size:11px;
    font-style:normal;
    font-weight:800;
    letter-spacing:.14em;
}
#initiativeTracker .combatantCard > .removeCombatantBtn,
#initiativeTracker .combatantCardClose{
    position:absolute!important;
    top:10px!important;
    right:10px!important;
    left:auto!important;
    bottom:auto!important;
    z-index:6!important;
    margin:0!important;
    width:34px!important;
    min-width:34px!important;
    height:34px!important;
    display:grid!important;
    place-items:center!important;
    padding:0!important;
    border:1px solid #e28c78!important;
    border-radius:50%!important;
    background:linear-gradient(180deg,#9b3b31,#651f1a)!important;
    color:#fff!important;
    font-size:16px!important;
    font-weight:800!important;
    line-height:1!important;
    cursor:pointer;
    box-shadow:0 4px 9px rgba(66,20,15,.35)!important;
}
#initiativeTracker .combatantCard .removeCombatantBtn:hover{
    background:linear-gradient(180deg,#c14a3c,#7a241c)!important;
    transform:scale(1.06);
}
#initiativeTracker .combatantCardTop{
    padding-right:42px;
}
#initiativeTracker .combatantCardStats{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
}
#initiativeTracker .combatantCardStats label{
    display:flex;
    flex-direction:column;
    gap:4px;
    color:#d7c089;
    font-size:10px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}
#initiativeTracker .combatantCard .initiativeField,
#initiativeTracker .combatantCard .acField{
    width:100%!important;
    min-width:0!important;
}
#initiativeTracker .combatantCard .rollModeField{
    grid-column:1/-1;
    width:100%!important;
}
#initiativeTracker .combatantCard .hpBarTrack{
    width:100%!important;
    height:12px;
}
#initiativeTracker .combatantCard .hpControl{
    width:100%;
    min-width:0;
    justify-content:space-between;
}
#initiativeTracker .combatantCard .hpField{
    flex:1;
    min-width:0!important;
    width:auto!important;
}
#initiativeTracker .combatantCard .notesField{
    width:100%;
    min-height:56px;
    resize:vertical;
    background:#08160f!important;
    color:#f5eddd!important;
    border:1px solid rgba(167,142,77,.45)!important;
    border-radius:8px;
    padding:8px;
}
#initiativeTracker .combatantCard .conditionSelect,
#initiativeTracker .combatantCard .tempHpField{
    color:#f5eddd!important;
    background:#08160f!important;
    border:1px solid rgba(167,142,77,.45)!important;
}
#initiativeTracker .combatantCard .combatantActionRail{
    flex-wrap:wrap;
}

/* Home panels as table cards. Accent color stays the per-panel user color. */
#homeGrid{
    background:
        radial-gradient(ellipse at 50% 0%, rgba(34,72,49,.28), transparent 52%),
        linear-gradient(180deg, #071610, #0b1c16) !important;
}
#homeGrid .panel{
    display:block !important;
    align-items:stretch !important;
    justify-content:stretch !important;
    padding:0 !important;
    border-radius:16px !important;
    clip-path:none !important;
    border:1px solid color-mix(in srgb, var(--panel-accent) 55%, #c9a24a) !important;
    background:
        linear-gradient(180deg, rgba(18,46,33,.96), rgba(8,22,16,.98)) !important;
    box-shadow:
        0 12px 26px rgba(0,0,0,.28),
        inset 0 0 0 1px rgba(255,255,255,.04) !important;
}
#homeGrid .panel::before,
#homeGrid .panel::after{
    display:none !important;
}
#homeGrid .panelOpenLink{
    position:relative !important;
    inset:auto !important;
    height:100%;
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    justify-content:flex-start !important;
    gap:10px;
    padding:16px 16px 18px !important;
    text-align:left !important;
}
#homeGrid .panelVisual{
    width:52px;
    height:52px;
    display:grid;
    place-items:center;
    border:1px solid color-mix(in srgb, var(--panel-accent) 70%, #e8c56a);
    border-radius:50%;
    background:radial-gradient(circle at 35% 25%, color-mix(in srgb, var(--panel-accent) 55%, #163224), #0a2117 72%);
    overflow:hidden;
}
#homeGrid .panelVisual .dmsPanelSvg,
#homeGrid .panelIcon .dmsPanelSvg{
    width:30px !important;
    height:30px !important;
    color:#f3e0a8;
}
#homeGrid .panelPortrait{
    width:100%;
    height:100%;
    object-fit:cover;
}
#homeGrid .panelText{
    min-width:0;
    width:100%;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:4px;
}
#homeGrid .panelKind{
    color:#e8c56a;
    font-size:10px;
    font-weight:800;
    letter-spacing:.14em;
    text-transform:uppercase;
}
#homeGrid .panelTitle{
    max-width:100% !important;
    margin:0;
    font-size:22px !important;
    line-height:1.15;
    text-align:left !important;
}
#homeGrid .panelPreview{
    margin:4px 0 0;
    color:#cbbfa4;
    font-size:13px;
    line-height:1.35;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}
#homeGrid .homeAddPanelTile{
    border-radius:16px;
    border:1px dashed rgba(201,162,74,.7);
    background:rgba(8,22,16,.55);
}
#homeGrid .homeAddPanelTile strong{
    font-size:28px;
}

#dicePop{
    position:fixed;
    left:50%;
    top:18%;
    z-index:2147483600;
    min-width:180px;
    max-width:320px;
    padding:16px 22px 14px;
    border:1px solid rgba(201,162,74,.8);
    border-radius:16px;
    background:linear-gradient(180deg,#163528,#0b1c14);
    color:#f6e3b0;
    text-align:center;
    box-shadow:0 18px 40px rgba(0,0,0,.45);
    transform:translate(-50%, -12px);
    opacity:0;
    pointer-events:none;
    transition:opacity .25s ease, transform .25s ease;
}
#dicePop.show{opacity:1;transform:translate(-50%, 0)}
#dicePop strong{display:block;font:700 54px Georgia,serif;line-height:.9;color:#f8e7b0}
#dicePop span{display:block;margin-top:6px;font-size:13px;font-weight:800;letter-spacing:.04em}
#dicePop small{display:block;margin-top:4px;color:#cbbfa4;font-size:12px}
#dicePop.critical strong{color:#ffe08a;text-shadow:0 0 16px rgba(255,210,90,.7)}
#dicePop.fumble strong{color:#c8b4a2;text-shadow:none}

.npcSheet.npcCard{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:16px!important;
    box-sizing:border-box!important;
    border:1px solid rgba(201,162,74,.8)!important;
    border-radius:18px!important;
    background:linear-gradient(180deg,#163528 0%,#0c1c14 100%)!important;
    color:#f4ead2!important;
    font-family:Georgia,"Times New Roman",serif!important;
    box-shadow:inset 0 0 0 1px rgba(201,162,74,.22),0 14px 30px rgba(0,0,0,.28)!important;
    position:relative!important;
    left:auto!important;
    transform:none!important;
}
.npcCardFrame{
    display:grid!important;
    grid-template-columns:128px minmax(0,1fr) 220px!important;
    grid-template-rows:auto auto!important;
    gap:14px 18px!important;
    align-items:start!important;
    min-width:0;
}
.npcCardName{grid-column:1 / 3;grid-row:1;margin:0!important;min-width:0}
.npcCardAbilities{grid-column:1;grid-row:2;align-self:start;min-width:0;width:128px}
.npcCardCenter{grid-column:2;grid-row:2;min-width:0;display:flex;flex-direction:column;gap:18px}
.npcCardSide{grid-column:3;grid-row:1 / span 2;min-width:0;display:flex;flex-direction:column;gap:8px}
.npcSheet.npcCard label{color:#e8c56a!important;font-weight:700!important;font-size:12px!important}
.npcSheet.npcCard .sheetInput,
.npcSheet.npcCard .sheetSmall,
.npcSheet.npcCard .sheetArea{
    width:100%;
    box-sizing:border-box;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    color:#f4ead2!important;
    box-shadow:none!important;
    font-family:Georgia,"Times New Roman",serif!important;
}
.npcSheet.npcCard .npcCardName .npcName{
    height:38px;
    padding:0 12px!important;
    border:1px solid rgba(201,162,74,.8)!important;
    border-radius:8px!important;
    background:rgba(8,22,16,.35)!important;
    font-size:22px!important;
}
.npcSheet.npcCard .npcAbilities{
    display:flex!important;
    flex-direction:column!important;
    gap:10px!important;
    grid-template-columns:none!important;
    width:128px!important;
}
.npcSheet.npcCard .npcCardAbility{
    display:grid!important;
    grid-template-columns:34px 40px!important;
    grid-template-areas:"label score"!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:0!important;
    width:128px!important;
    min-width:0!important;
    max-width:128px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    position:relative!important;
    overflow:visible!important;
}
.npcSheet.npcCard .npcCardAbility strong{
    grid-area:label;
    color:#f4ead2!important;
    font-size:13px!important;
    letter-spacing:.04em;
}
.npcSheet.npcCard .npcCardScore{
    grid-area:score;
    position:relative;
    width:40px!important;
    height:48px!important;
    min-width:40px!important;
    display:block;
}
.npcSheet.npcCard .npcCardScore .npcAbilityScore{
    width:40px!important;
    min-width:40px!important;
    max-width:40px!important;
    height:40px!important;
    padding:0!important;
    border:1.5px solid #e8c56a!important;
    border-radius:50%!important;
    text-align:center!important;
    font-size:15px!important;
    line-height:40px!important;
}
.npcSheet.npcCard .npcAbilityModifier{
    position:absolute;
    left:0;
    right:0;
    top:38px;
    color:#c9a24a!important;
    font-size:11px!important;
    font-style:normal;
    text-align:center;
    line-height:1;
}
.npcSheet.npcCard .npcAbilitySave,
.npcSheet.npcCard .npcAbilityRollBtn,
.npcSheet.npcCard .npcStatDieViewport{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    clip:rect(0 0 0 0)!important;
    border:0!important;
}
.npcCardVitals{
    display:grid!important;
    grid-template-columns:84px 76px 92px minmax(110px,160px)!important;
    gap:12px!important;
    align-items:stretch!important;
    min-width:0;
}
.npcVital{
    position:relative;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    height:88px;
    min-height:88px;
    margin:0!important;
    min-width:0!important;
}
.npcVital > span{position:absolute;top:2px;font-size:11px;letter-spacing:.06em}
.npcSheet.npcCard .npcVital input{
    width:70px!important;
    min-width:0!important;
    max-width:80px!important;
    text-align:center!important;
    padding:0!important;
    font-size:18px!important;
}
.npcVitalHp{
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 58'%3E%3Cpath d='M32 52C10 36 4 24 12 15C18 8 26 10 32 18C38 10 46 8 52 15C60 24 54 36 32 52Z' fill='none' stroke='%23e8c56a' stroke-width='1.7'/%3E%3C/svg%3E") center 8px / 62px 54px no-repeat;
}
.npcVitalHp .npcHP{margin-top:14px!important;font-size:18px!important}
.npcVitalHp .npcMaxHP{font-size:11px!important;opacity:.8}
.npcVitalHp .npcHpButtons{display:flex;gap:4px}
.npcVitalHp .npcHpButtons button{width:16px;height:16px;padding:0;border:1px solid rgba(201,162,74,.7);border-radius:50%;background:#143024;color:#f4ead2;line-height:14px;cursor:pointer}
.npcVitalAc{
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 54 62'%3E%3Cpath d='M27 3L50 12V30C50 46 39 56 27 60C15 56 4 46 4 30V12Z' fill='none' stroke='%23e8c56a' stroke-width='1.7'/%3E%3C/svg%3E") center 6px / 48px 58px no-repeat;
}
.npcVitalAc .npcAC{margin-top:10px!important}
.npcVitalSpeed{border:1.5px solid #e8c56a;border-radius:10px;background:rgba(8,22,16,.25)}
.npcVitalSpeed .npcSpeed{font-size:13px!important}
.npcCardPortrait{
    position:relative;
    height:88px;
    min-height:88px;
    max-height:88px;
    margin:0!important;
    border:1px solid rgba(201,162,74,.75);
    border-radius:8px;
    display:grid;
    place-items:center;
    overflow:hidden;
    cursor:pointer;
    background:rgba(8,22,16,.25);
}
.npcCardPortrait > span{font-size:12px}
.npcSheet.npcCard .npcCardPortraitImage{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    margin:0!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
    object-fit:cover!important;
}
.npcCardPortrait:has(.npcCardPortraitImage:not([hidden])) > span{display:none}
.npcCardPortraitFile{display:none}
.npcSheet.npcCard .noteEmbeddedImageFrame{display:contents!important;margin:0!important}
.npcSheet.npcCard .moveEmbeddedImageBtn,
.npcSheet.npcCard .removeEmbeddedImageBtn{display:none!important}
.npcCardAttacks{
    position:relative;
    flex:1;
    min-height:260px;
    margin:6px 0 0!important;
    padding:22px 12px 10px!important;
    border:1px solid rgba(201,162,74,.75)!important;
    border-radius:10px;
    background:rgba(8,22,16,.18);
    min-width:0;
}
.npcCardAttacks h2{
    position:absolute;
    top:-11px;
    left:50%;
    transform:translateX(-50%);
    margin:0!important;
    padding:0 10px!important;
    border:0!important;
    background:#123024!important;
    color:#e8c56a!important;
    font-size:14px!important;
    letter-spacing:.02em;
    white-space:nowrap;
}
.npcWeaponFinder{position:relative;margin:0 0 6px}
.npcWeaponSearchInput{
    width:100%;
    box-sizing:border-box;
    padding:6px 8px;
    border:1px solid rgba(201,162,74,.45)!important;
    border-radius:8px!important;
    background:#08160f!important;
    color:#f4ead2!important;
}
.npcWeaponSearchResults{
    display:none;
    position:absolute;
    z-index:8;
    left:0;
    right:0;
    top:calc(100% + 4px);
    max-height:190px;
    overflow:auto;
    flex-direction:column;
    gap:2px;
    padding:4px;
    border:1px solid rgba(201,162,74,.6);
    border-radius:8px;
    background:#10281c;
}
.npcWeaponFinder:focus-within .npcWeaponSearchResults{display:flex}
.npcWeaponSearchResults button{
    display:flex;
    justify-content:space-between;
    gap:8px;
    padding:6px 8px;
    border:0;
    border-radius:6px;
    background:transparent;
    color:#f4ead2;
    cursor:grab;
    text-align:left;
}
.npcWeaponSearchResults button:hover{background:#1f8a4c}
.npcWeaponSearchResults small{color:#cbbfa4}
.npcAttackList{min-height:160px}
.npcAttackList.drag-over{outline:1px dashed #e8c56a;outline-offset:3px}
.npcAttackHead,.npcAttackRow{
    display:grid!important;
    grid-template-columns:minmax(0,1.4fr) 88px minmax(0,1.5fr) 22px!important;
    gap:8px;
    align-items:center;
    min-height:32px;
    border-bottom:1px solid rgba(201,162,74,.28);
}
.npcAttackHead{color:#c9a24a;font-size:12px}
.npcAttackHead span{white-space:nowrap}
.npcAttackRow button,.npcAttackRow span{
    min-width:0;
    padding:0;
    border:0;
    background:transparent;
    color:#f4ead2;
    font:inherit;
    text-align:left;
}
.npcAttackRow button{cursor:pointer}
.npcAttackRow button:hover{color:#ffe08a}
.npcAttackRemove{text-align:center!important;color:#e8c56a!important;font-size:16px!important}
.npcCardLine{display:grid!important;grid-template-columns:78px minmax(0,1fr);align-items:center;gap:6px;margin:0!important}
.npcSheet.npcCard .npcCardLine input{border-bottom:1px solid rgba(201,162,74,.55)!important;padding:2px 0!important}
.npcCardBox{
    position:relative;
    display:flex;
    flex-direction:column;
    flex:1;
    min-height:72px;
    margin:8px 0 0!important;
    padding:10px 8px 6px!important;
    border:1px solid rgba(201,162,74,.75);
    border-radius:8px;
}
.npcCardBox > span{
    position:absolute;
    top:-8px;
    left:10px;
    padding:0 5px;
    background:#123024;
    color:#e8c56a;
    font-size:12px;
}
.npcSheet.npcCard .npcCardBox textarea{min-height:52px!important;resize:vertical;padding:0!important}
.npcCardMore{margin-top:12px}
.npcCardMore summary{color:#e8c56a;cursor:pointer;font-size:13px}
.npcCardMoreGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}
.npcSheet.npcCard .npcCardMore .sheetInput,
.npcSheet.npcCard .npcCardMore .sheetSmall,
.npcSheet.npcCard .npcCardMore .sheetArea{
    border:1px solid rgba(201,162,74,.4)!important;
    border-radius:6px!important;
    background:rgba(8,22,16,.45)!important;
    padding:4px 6px!important;
}
.npcSheet.npcCard .npcCardMore h2{margin:12px 0 6px!important;border:0!important;color:#e8c56a!important;font-size:16px!important}
.npcSheet.npcCard .actorActionRestBar,
.npcSheet.npcCard .actorGeneratedActionsEmpty,
.npcSheet.npcCard .npcRulesValidation,
.npcSheet.npcCard .npcCreationGuide{display:none!important}
.npcSheet.npcCard .npcSheetActions{display:flex!important;gap:8px!important;margin-top:12px!important}
.npcSheet.npcCard .npcSheetActions button{
    border:1px solid #e8c56a!important;
    border-radius:8px!important;
    background:#1f8a4c!important;
    color:#f6e3b0!important;
    font-family:Georgia,"Times New Roman",serif!important;
    font-size:14px!important;
}
.npcSheet.npcCard input,
.npcSheet.npcCard textarea,
.npcSheet.npcCard select,
.npcSheet.npcCard .npcCardAbility,
.npcSheet.npcCard .npcCardScore,
.npcSheet.npcCard .npcCardCenter,
.npcSheet.npcCard .npcCardSide,
.npcSheet.npcCard .npcCardBox{
    min-width:0!important;
}
.npcSheet.npcCard input[type="number"]{-moz-appearance:textfield;appearance:textfield}
.npcSheet.npcCard input[type="number"]::-webkit-outer-spin-button,
.npcSheet.npcCard input[type="number"]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
@media(max-width:980px){
    .npcCardFrame{grid-template-columns:1fr}
    .npcCardName,.npcCardAbilities,.npcCardCenter,.npcCardSide{grid-column:1;grid-row:auto}
    .npcSheet.npcCard .npcAbilities{flex-direction:column!important;flex-wrap:nowrap}
    .npcCardMoreGrid{grid-template-columns:1fr}
    .npcCardVitals{grid-template-columns:minmax(0,1.4fr) minmax(0,.8fr) minmax(0,.8fr) minmax(72px,.7fr)!important}
}

.npcSheet.npcCard{line-height:1.2!important}
.npcSheet.npcCard input,
.npcSheet.npcCard textarea,
.npcSheet.npcCard select{
    box-sizing:border-box!important;
    max-width:100%!important;
    margin:0!important;
    padding:0 4px!important;
    line-height:1.2!important;
}
.npcCardFrame{grid-template-columns:112px minmax(0,1fr) 230px!important}
.npcCardAbilities,
.npcSheet.npcCard .npcAbilities{width:100%!important;max-width:none!important}
.npcSheet.npcCard .npcCardName{
    display:block!important;
    overflow:hidden!important;
    border:2px solid #e8c56a!important;
    outline:1px solid rgba(232,197,106,.9);
    outline-offset:-5px;
    border-radius:8px!important;
    background:rgba(8,22,16,.35)!important;
}
.npcSheet.npcCard .npcCardName .npcName{
    height:42px!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    font-size:22px!important;
    line-height:42px!important;
    padding:0 12px!important;
}
.npcSheet.npcCard .npcCardAbility{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:1px!important;
    width:100%!important;
    max-width:none!important;
    min-height:92px!important;
    padding:8px 4px 6px!important;
    box-sizing:border-box!important;
    border:2px solid #e8c56a!important;
    outline:1px solid rgba(232,197,106,.85);
    outline-offset:-4px;
    border-radius:12px!important;
    background:rgba(8,22,16,.4)!important;
    overflow:hidden!important;
}
.npcSheet.npcCard .npcCardAbility strong{font-size:11px!important;letter-spacing:.08em;line-height:1}
.npcSheet.npcCard .npcCardScore{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    height:auto!important;
    min-width:0!important;
    gap:1px;
}
.npcSheet.npcCard .npcAbilityModifier{
    position:static!important;
    order:-1;
    display:block;
    width:100%;
    margin:0;
    color:#f4ead2!important;
    font-size:16px!important;
    font-style:normal;
    line-height:1!important;
    text-align:center;
}
.npcSheet.npcCard .npcCardScore .npcAbilityScore{
    width:46px!important;
    min-width:46px!important;
    max-width:46px!important;
    height:26px!important;
    margin:0!important;
    padding:0!important;
    border:1.5px solid #e8c56a!important;
    border-radius:13px!important;
    font-size:14px!important;
    line-height:26px!important;
}
.npcCardVitals{grid-template-columns:minmax(148px,1.5fr) 96px 96px minmax(96px,130px)!important;align-items:stretch!important}
.npcVital,
.npcVitalHp,
.npcVitalAc,
.npcVitalSpeed{
    height:auto!important;
    min-height:124px!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
    background-image:none!important;
    background-color:rgba(8,22,16,.4)!important;
    border:2px solid #e8c56a!important;
    outline:1px solid rgba(232,197,106,.9);
    outline-offset:-5px;
    border-radius:10px!important;
    padding:8px 6px 6px!important;
}
.npcVital > span{position:static!important;top:auto!important}
.npcSheet.npcCard .npcVital input{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    text-align:center!important;
}
.npcVitalHp{
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr)!important;
    grid-template-areas:"title title" "current current" "maxlabel max" "buttons buttons"!important;
    align-content:center!important;
    justify-items:center!important;
    row-gap:2px!important;
}
.npcVitalHp > span:first-child{grid-area:title;font-size:11px!important;letter-spacing:.08em}
.npcVitalHp .npcHP{
    grid-area:current;
    height:34px!important;
    font-size:28px!important;
    line-height:34px!important;
}
.npcVitalHp .npcHpMaxLabel{grid-area:maxlabel;justify-self:end;padding-right:6px;font-size:11px!important;color:#e8c56a}
.npcVitalHp .npcMaxHP{
    grid-area:max;
    justify-self:start;
    width:48px!important;
    max-width:48px!important;
    height:22px!important;
    font-size:14px!important;
    line-height:22px!important;
    opacity:1!important;
}
.npcVitalHp .npcHpButtons{
    grid-area:buttons;
    display:flex!important;
    justify-content:center;
    gap:4px;
    width:100%;
}
.npcVitalHp .npcHpButtons button{
    width:28px!important;
    height:22px!important;
    padding:0!important;
    border:1px solid #e8c56a!important;
    border-radius:5px!important;
    background:#1f8a4c!important;
    color:#f4ead2!important;
    line-height:20px!important;
    font-size:12px!important;
    cursor:pointer;
}
.npcVitalAc,
.npcVitalSpeed{
    display:grid!important;
    grid-template-rows:16px 1fr!important;
    align-items:center!important;
    justify-items:center!important;
}
.npcVitalAc > span,
.npcVitalSpeed > span{font-size:11px!important;letter-spacing:.08em}
.npcVitalAc .npcAC,
.npcVitalSpeed .npcSpeed{
    height:40px!important;
    margin:0!important;
    font-size:22px!important;
    line-height:40px!important;
}
.npcVitalSpeed .npcSpeed{font-size:15px!important}
.npcCardPortrait{
    height:auto!important;
    min-height:124px!important;
    max-height:none!important;
    align-self:stretch;
    box-sizing:border-box;
    border:2px solid #e8c56a!important;
    outline:1px solid rgba(232,197,106,.9);
    outline-offset:-5px;
    border-radius:10px!important;
}
.npcCardAttacks{
    overflow:hidden!important;
    box-sizing:border-box!important;
    margin:0!important;
    padding:12px!important;
    border:2px solid #e8c56a!important;
    outline:1px solid rgba(232,197,106,.9);
    outline-offset:-5px;
    border-radius:10px!important;
}
.npcCardAttacks h2{
    position:static!important;
    left:auto!important;
    top:auto!important;
    transform:none!important;
    display:block;
    margin:0 0 8px!important;
    padding:0 0 6px!important;
    background:transparent!important;
    border:0!important;
    border-bottom:1px solid rgba(232,197,106,.45)!important;
    text-align:center;
    font-size:14px!important;
    white-space:normal!important;
}
.npcCardLine{
    box-sizing:border-box!important;
    min-height:32px;
    padding:3px 8px!important;
    overflow:hidden!important;
    border:1.5px solid #e8c56a!important;
    outline:1px solid rgba(232,197,106,.75);
    outline-offset:-4px;
    border-radius:6px;
}
.npcSheet.npcCard .npcCardLine input{
    height:22px!important;
    border:0!important;
    padding:0!important;
    font-size:14px!important;
    line-height:22px!important;
}
.npcCardBox{
    overflow:hidden!important;
    box-sizing:border-box!important;
    border:2px solid #e8c56a!important;
    outline:1px solid rgba(232,197,106,.85);
    outline-offset:-5px;
    border-radius:8px!important;
    padding:16px 8px 8px!important;
}
.npcCardBox > span{background:#123024}
.npcSheet.npcCard .npcCardBox textarea{
    width:100%!important;
    min-height:68px!important;
    margin:0!important;
    padding:0!important;
    font-size:14px!important;
    line-height:1.35!important;
    overflow:auto!important;
}

.npcSheet.npcCard,
.npcSheet.npcCard .npcCardAbility,
.npcSheet.npcCard .npcVital,
.npcSheet.npcCard .npcCardPortrait,
.npcSheet.npcCard .npcCardAttacks,
.npcSheet.npcCard .npcCardBox,
.npcSheet.npcCard .npcCardLine,
.npcSheet.npcCard .npcCardName{
    outline:none!important;
    outline-offset:0!important;
    box-shadow:inset 0 0 0 1px rgba(232,197,106,.35)!important;
}
.npcCardFrame{
    width:100%!important;
    grid-template-columns:118px minmax(0,1fr) minmax(190px,230px)!important;
    gap:12px 16px!important;
    align-items:start!important;
}
.npcCardCenter{min-width:0!important;gap:14px!important}
.npcCardVitals{
    width:100%!important;
    grid-template-columns:minmax(0,1.45fr) minmax(78px,.72fr) minmax(84px,.8fr) minmax(96px,.9fr)!important;
    gap:10px!important;
    align-items:stretch!important;
}
.npcCardPortrait{
    position:relative!important;
    display:block!important;
    min-height:132px!important;
    height:100%!important;
    padding:0!important;
    overflow:hidden!important;
    cursor:pointer;
    background:
        linear-gradient(180deg,rgba(232,197,106,.08),transparent 40%),
        rgba(8,22,16,.55)!important;
}
.npcCardPortrait > span{
    position:absolute!important;
    inset:0!important;
    z-index:1;
    display:grid!important;
    place-items:center;
    margin:0!important;
    color:#e8c56a!important;
    font-size:12px!important;
    letter-spacing:.12em;
    text-transform:uppercase;
    pointer-events:none;
}
.npcSheet.npcCard .npcCardPortraitImage{
    position:absolute!important;
    inset:0!important;
    z-index:2!important;
    display:block!important;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:8px!important;
    object-fit:cover!important;
    background:transparent!important;
    box-shadow:none!important;
}
.npcSheet.npcCard .npcCardPortraitImage[hidden],
#editor .npcSheet.npcCard .npcCardPortraitImage[hidden]{display:none!important}
.npcCardPortrait:has(.npcCardPortraitImage:not([hidden])) > span{display:none!important}
.npcCardPortraitFile{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    opacity:0!important;
    pointer-events:none!important;
}
#editor .npcSheet.npcCard .npcCardPortraitImage{
    position:absolute!important;
    inset:0!important;
    z-index:2!important;
    display:block!important;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    max-height:none!important;
    margin:0!important;
    border:0!important;
    object-fit:cover!important;
}
.npcWeaponFinder{margin:0 0 10px!important}
.npcSheet.npcCard .npcWeaponSearchInput{
    height:36px!important;
    padding:0 12px 0 34px!important;
    border:1px solid rgba(232,197,106,.55)!important;
    border-radius:999px!important;
    background:
        rgba(8,22,16,.72)
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e8c56a' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='6'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E")
        10px 50% / 16px 16px no-repeat!important;
    color:#f6e3b0!important;
    font-size:13px!important;
    line-height:36px!important;
    box-shadow:none!important;
}
.npcSheet.npcCard .npcWeaponSearchInput::placeholder{color:rgba(246,227,176,.45)}
.npcWeaponFinder.is-open .npcWeaponSearchResults,
.npcWeaponFinder:focus-within .npcWeaponSearchResults{
    display:flex!important;
    position:absolute;
    z-index:40;
    left:0;
    right:0;
    top:calc(100% + 6px);
    max-height:240px;
    overflow:auto;
}
.npcWeaponSearchResults button{
    border-radius:8px!important;
    padding:8px 10px!important;
}
.npcCardAttacks{overflow:visible!important}
.npcAttackList{overflow:auto;max-height:320px}

/* Larger dice console. Same tray shape, so the picker stays on the board. */
#quickDiceWindow .quickDiceBox{
    width:min(96vw,1480px)!important;
    height:min(92vh,calc(100vh - var(--real-header-height,76px) - 16px))!important;
    max-height:none!important;
}
#quickDiceWindow .diceGrandTotal{
    font-family:Georgia,serif!important;
    font-size:clamp(48px,5.4vw,76px)!important;
    line-height:.9!important;
    color:#f6e3b0!important;
}
#quickDiceWindow .diceTrayResult.critical .diceGrandTotal{
    color:#ffe08a!important;
    text-shadow:0 0 18px rgba(255,210,90,.75);
}
#quickDiceWindow .diceTrayResult.fumble .diceGrandTotal{
    color:#c8b4a2!important;
    text-shadow:none;
}

.npcSheet.npcCard{
    background:
        radial-gradient(circle at 20% 0%, rgba(255,255,255,.35), transparent 28%),
        linear-gradient(180deg,#f8edd4 0%,#f1e0b8 100%)!important;
    color:#2c2116!important;
    border:4px solid #1f6b3a!important;
    box-shadow:inset 0 0 0 2px #c4a46a, 0 16px 30px rgba(0,0,0,.28)!important;
}
.npcSheet.npcCard label,
.npcSheet.npcCard .npcCardAbility strong,
.npcSheet.npcCard .npcAbilityModifier,
.npcSheet.npcCard .npcCardBox > span,
.npcSheet.npcCard .npcVital > span,
.npcSheet.npcCard .npcHpMaxLabel,
.npcCardAttacks h2,
.npcAttackHead{
    color:#5c3b22!important;
}
.npcSheet.npcCard input,
.npcSheet.npcCard textarea,
.npcSheet.npcCard select,
.npcSheet.npcCard .npcAttackRow button,
.npcSheet.npcCard .npcAttackRow span{
    color:#2c2116!important;
    background:transparent!important;
}
.npcSheet.npcCard .npcCardName,
.npcSheet.npcCard .npcCardAbility,
.npcSheet.npcCard .npcVital,
.npcSheet.npcCard .npcCardPortrait,
.npcSheet.npcCard .npcCardAttacks,
.npcSheet.npcCard .npcCardLine,
.npcSheet.npcCard .npcCardBox{
    background:#fbf6e8!important;
    border:1.5px solid #3d2a1c!important;
    box-shadow:inset 0 0 0 1px rgba(61,42,28,.35)!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
}
.npcSheet.npcCard .npcCardAbility{
    min-height:84px!important;
    padding:6px 4px!important;
    justify-content:space-between!important;
}
.npcSheet.npcCard .npcAbilityModifier{font-size:15px!important}
.npcSheet.npcCard .npcCardScore .npcAbilityScore{
    background:#fbf6e8!important;
    color:#2c2116!important;
    border-color:#3d2a1c!important;
}
.npcVitalHp{
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:3px!important;
    padding:8px!important;
    overflow:hidden!important;
}
.npcVitalHp > span,
.npcVitalHp .npcHpMaxLabel,
.npcVitalHp .npcHP,
.npcVitalHp .npcMaxHP,
.npcVitalHp .npcHpButtons{
    position:static!important;
    grid-area:auto!important;
    justify-self:center!important;
    width:auto!important;
    max-width:100%!important;
}
.npcVitalHp .npcHP{font-size:28px!important;height:32px!important;line-height:32px!important}
.npcVitalHp .npcMaxHP{
    width:42px!important;
    height:20px!important;
    border-bottom:1px solid #3d2a1c!important;
    font-size:13px!important;
}
.npcVitalHp .npcHpButtons{display:flex!important;gap:4px}
.npcCardPortrait{background:#efe4c8!important}
.npcCardPortrait > span{color:#5c3b22!important}
.npcSheet.npcCard .npcWeaponSearchInput{
    background:#fbf6e8 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235c3b22' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='6'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") 10px 50% / 16px 16px no-repeat!important;
    color:#2c2116!important;
    border:1px solid #3d2a1c!important;
}
.npcSheet.npcCard .npcWeaponSearchInput::placeholder{color:rgba(61,42,28,.45)}
.npcWeaponFinder.is-open .npcWeaponSearchResults{
    background:#fbf6e8!important;
    border:1px solid #3d2a1c!important;
}
.npcWeaponSearchResults button{color:#2c2116!important}
.npcWeaponSearchResults button:hover{background:#1f6b3a!important;color:#fbf6e8!important}
.npcWeaponSearchResults small{color:#6b5138!important}
.npcAttackHead,.npcAttackRow{border-bottom:1px solid rgba(61,42,28,.28)!important}
.npcAttackRemove{color:#6b3a2a!important}
.npcSheet.npcCard .npcSheetActions button{
    background:#1f6b3a!important;
    color:#fbf6e8!important;
    border-color:#3d2a1c!important;
}
.npcVitalHp .npcHpButtons button{
    background:#1f6b3a!important;
    color:#fbf6e8!important;
    border-color:#3d2a1c!important;
}

#pageDiceLayer{
    position:fixed;
    inset:0;
    z-index:2147483646;
    pointer-events:none;
}
#pageDiceLayer.pageDiceLayerActive{
    background:rgba(10,6,2,.22);
}
#pageDiceCanvas{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    z-index:1;
    pointer-events:none;
    background:transparent;
}
#pageFireCanvas{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    z-index:2;
    pointer-events:none;
}
#pageResultStack{
    position:absolute;
    top:64px;
    right:14px;
    z-index:3;
    display:flex;
    flex-direction:column;
    align-items:flex-end;
    gap:8px;
    pointer-events:none;
}
.pageScrollItem{
    position:relative;
    flex:0 0 auto;
    overflow:visible;
    transform-origin:50% 0;
    filter:drop-shadow(0 8px 12px rgba(0,0,0,.38));
    animation:pageScrollIn .55s cubic-bezier(.2,.9,.25,1) both;
}
.pageScrollItem canvas{display:block}
@keyframes pageScrollIn{
    0%{opacity:0;transform:translateX(34px) scale(.92,.06)}
    55%{opacity:1}
    100%{opacity:1;transform:none}
}

/* ===== NPC card: typed text is black ===== */
.npcSheet.npcCard input,
.npcSheet.npcCard textarea,
.npcSheet.npcCard select,
.npcSheet.npcCard .sheetInput,
.npcSheet.npcCard .sheetSmall,
.npcSheet.npcCard .sheetArea,
.npcSheet.npcCard .npcCardSpells select,
.npcSheet.npcCard .npcCardSpells input,
.npcSheet.npcCard .npcWeaponSearchInput,
.npcSheet.npcCard .npcRichField,
.npcSheet.npcCard .npcCardScore .npcAbilityScore,
.npcSheet.npcCard .npcAttackRow,
.npcSheet.npcCard .npcAttackRow *{
    color:#000!important;
    caret-color:#000;
}
.npcSheet.npcCard input::placeholder,
.npcSheet.npcCard textarea::placeholder{color:rgba(0,0,0,.38)!important}
.npcSheet.npcCard .npcCardMore h2{color:#5c3b22!important}

/* ===== NPC card: spell slots and spell search ===== */
.npcSheet.npcCard .npcCardSpells{
    position:relative;
    margin:0;
    padding:10px 12px 12px;
    box-sizing:border-box;
    border:1.5px solid #3d2a1c!important;
    border-radius:10px;
    background:#fbf6e8!important;
    box-shadow:inset 0 0 0 1px rgba(61,42,28,.35)!important;
    overflow:visible!important;
    color:#000;
}
.npcSheet.npcCard .npcCardSpells h2{
    margin:0 0 8px!important;
    padding:0 0 6px!important;
    border:0!important;
    border-bottom:1px solid rgba(61,42,28,.35)!important;
    background:transparent!important;
    color:#5c3b22!important;
    text-align:center;
    font-size:14px!important;
    letter-spacing:.04em;
}
.npcSpellControls{
    display:grid;
    grid-template-columns:minmax(0,1.4fr) minmax(70px,.7fr) minmax(70px,.7fr);
    gap:8px;
}
.npcSpellControls label{display:flex;flex-direction:column;gap:3px;color:#5c3b22!important;font-size:11px!important;text-transform:uppercase;letter-spacing:.06em}
.npcSheet.npcCard .npcCardSpells select,
.npcSheet.npcCard .npcCardSpells input.npcSpellCasterLevel{
    height:28px;
    padding:0 6px!important;
    border:1px solid #3d2a1c!important;
    border-radius:6px!important;
    background:#fffaf0!important;
    font:600 13px Georgia,serif!important;
}
.npcSpellStats{margin:8px 0 4px;text-align:center;font:700 13px Georgia,serif;color:#1f4d2c;letter-spacing:.02em}
.npcSpellSlots{display:flex;flex-direction:column}
.npcSlotRow{display:flex;align-items:center;gap:8px;padding:4px 0;border-bottom:1px solid rgba(61,42,28,.2)}
.npcSlotLabel{flex:0 0 74px;font:700 12px Georgia,serif;color:#5c3b22}
.npcSlotPips{display:flex;flex-wrap:wrap;gap:5px;flex:1}
.npcSheet.npcCard .npcSlotPip{
    width:20px;
    height:20px;
    min-width:20px;
    padding:0!important;
    border:2px solid #3d2a1c!important;
    border-radius:50%!important;
    background:#fffaf0!important;
    cursor:pointer;
    transition:transform .12s ease,box-shadow .12s ease;
}
.npcSheet.npcCard .npcSlotPip.is-ready{
    background:radial-gradient(circle at 35% 30%,#58b97a,#1f6b3a 70%)!important;
    box-shadow:0 0 0 1px #c4a46a;
}
.npcSheet.npcCard .npcSlotPip:hover{transform:scale(1.14)}
.npcSlotRow em{flex:0 0 36px;text-align:right;font:700 12px Georgia,serif;font-style:normal;color:#5c3b22}
.npcSpellRestRow{display:flex;gap:8px;margin-top:8px}
.npcSpellRestRow[hidden]{display:none}
.npcSpellRestRow button{
    flex:1;
    padding:5px 8px;
    border:1px solid #3d2a1c;
    border-radius:8px;
    background:#1f6b3a;
    color:#fbf6e8;
    font:700 12px Georgia,serif;
    cursor:pointer;
}
.npcSpellRestRow button[hidden]{display:none}
.npcSpellFinder{position:relative;display:flex;gap:6px;margin:12px 0 6px}
.npcSheet.npcCard .npcCardSpells .npcSpellSearchInput{
    flex:1;
    min-width:0;
    height:32px;
    padding:0 10px 0 32px!important;
    border:1px solid #3d2a1c!important;
    border-radius:999px!important;
    background:#fffaf0 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235c3b22' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='6'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E") 10px 50% / 16px 16px no-repeat!important;
    font:14px Georgia,serif!important;
}
.npcSheet.npcCard .npcCardSpells .npcSpellLevelFilter{flex:0 0 112px;height:32px}
.npcSpellSearchResults{
    display:none;
    position:absolute;
    left:0;
    right:0;
    top:calc(100% + 6px);
    z-index:60;
    flex-direction:column;
    max-height:270px;
    overflow:auto;
    border:1px solid #3d2a1c;
    border-radius:10px;
    background:#fbf6e8;
    box-shadow:0 14px 28px rgba(0,0,0,.3);
}
.npcSpellFinder.is-open .npcSpellSearchResults{display:flex}
.npcSheet.npcCard .npcSpellSearchResults button{
    display:flex;
    justify-content:space-between;
    align-items:baseline;
    gap:12px;
    padding:8px 12px;
    border:0;
    border-bottom:1px solid rgba(61,42,28,.15);
    background:transparent!important;
    color:#000!important;
    text-align:left;
    cursor:pointer;
}
.npcSheet.npcCard .npcSpellSearchResults button:hover{background:#1f6b3a!important;color:#fbf6e8!important}
.npcSheet.npcCard .npcSpellSearchResults button small{color:#6b5138;font-size:11px}
.npcSheet.npcCard .npcSpellSearchResults button:hover small{color:#e8dcb8}
.npcSpellSearchStatus{padding:10px 12px;color:#6b5138;font-size:12px}
.npcSpellGroup h3{
    margin:10px 0 4px;
    padding-bottom:3px;
    border-bottom:1px solid rgba(61,42,28,.35);
    font:700 11px Georgia,serif;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#5c3b22;
}
.npcSpellEntry{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto auto;
    grid-template-areas:"name cast remove" "meta cast remove" "details details details";
    column-gap:6px;
    padding:5px 0;
    border-bottom:1px dotted rgba(61,42,28,.3);
}
.npcSheet.npcCard .npcSpellName{
    grid-area:name;
    padding:0;
    border:0;
    background:none!important;
    color:#000!important;
    text-align:left;
    font:700 14px Georgia,serif;
    cursor:pointer;
}
.npcSpellMeta{grid-area:meta;font-size:11px;color:#6b5138}
.npcSheet.npcCard .npcSpellCast{
    grid-area:cast;
    align-self:center;
    padding:3px 10px;
    border:1px solid #3d2a1c;
    border-radius:7px;
    background:#1f6b3a!important;
    color:#fbf6e8!important;
    font:700 12px Georgia,serif;
    cursor:pointer;
}
.npcSheet.npcCard .npcSpellRemove{
    grid-area:remove;
    align-self:center;
    width:24px;
    height:24px;
    padding:0;
    border:1px solid rgba(61,42,28,.4);
    border-radius:50%;
    background:transparent!important;
    color:#6b3a2a!important;
    font-size:16px;
    line-height:1;
    cursor:pointer;
}
.npcSpellDetails{
    grid-area:details;
    max-height:220px;
    margin-top:6px;
    padding:6px 10px;
    overflow:auto;
    border-radius:6px;
    background:#f1e4c4;
    color:#000;
    font-size:12px;
    line-height:1.4;
}
.npcSpellDetails p{margin:0 0 6px}

.pageScrollItem.burning{filter:none!important}

/* NPC card: side box titles sit inside the frame, no dark tag */
.npcSheet.npcCard .npcCardBox{padding:8px 10px 8px!important}
.npcSheet.npcCard .npcCardBox > span{
    position:static!important;
    display:block;
    margin:0 0 4px;
    padding:0 0 3px!important;
    border-bottom:1px solid rgba(61,42,28,.3);
    background:transparent!important;
    color:#5c3b22!important;
    font:700 11px Georgia,"Times New Roman",serif;
    letter-spacing:.12em;
    text-transform:uppercase;
    line-height:1.2;
}

/* ===== Session & Campaign: simplified "Run Session" view ===== */
.sessionHeroActions>button.sessionPrimaryAction{
    min-height:46px;
    padding:10px 22px;
    border:1px solid #e8c56a;
    background:linear-gradient(180deg,#d6b25a,#9a742a);
    color:#1b1305;
    font-size:15px;
    letter-spacing:.02em;
    box-shadow:0 4px 14px rgba(0,0,0,.35);
}
.sessionHeroActions>button.sessionPrimaryAction:hover{filter:brightness(1.1)}
.sessionNowSection{display:flex;flex-direction:column;gap:12px}
.sessionNowHeading span{color:var(--gold);font-size:11px;font-weight:900;letter-spacing:1.4px;text-transform:uppercase}
.sessionNowHeading h3{margin:3px 0 0;color:#f2efe5;font:700 24px Georgia,"Times New Roman",serif}
.sessionNowGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:12px}
.sessionNowCard{
    display:flex;
    flex-direction:column;
    gap:8px;
    min-width:0;
    padding:14px;
    border:1px solid rgba(189,162,103,.48);
    background:linear-gradient(180deg,#203128,#15221b);
    color:#d9ddd8;
}
.sessionNowTop{display:flex;align-items:center;justify-content:space-between;gap:8px}
.sessionNowTop label{color:var(--gold-light);font-size:12px;font-weight:900;letter-spacing:.6px;text-transform:uppercase}
.sessionNowOpen{
    min-height:26px;
    padding:3px 12px;
    border:1px solid rgba(189,162,103,.7);
    border-radius:4px;
    background:linear-gradient(180deg,#4c7558,#294837);
    color:#fff;
    font-size:12px;
    font-weight:800;
    cursor:pointer;
}
.sessionNowOpen:hover{filter:brightness(1.18)}
.sessionNowCard select{
    width:100%;
    min-height:40px;
    padding:6px 8px;
    border:1px solid rgba(189,162,103,.65);
    border-radius:4px;
    background:#efe4c6;
    color:var(--ink);
    font-size:14px;
}
.sessionNowDetails{
    margin:0;
    min-height:4.6em;
    color:#c9d3cb;
    font-size:12.5px;
    line-height:1.45;
    display:-webkit-box;
    -webkit-line-clamp:4;
    -webkit-box-orient:vertical;
    overflow:hidden;
}
.sessionNowDetails.is-empty{color:#8fa095;font-style:italic}
.sessionWorldState{border:1px solid rgba(189,162,103,.35);background:rgba(20,34,25,.7);color:#d9ddd8}
.sessionWorldState summary{display:flex;align-items:center;gap:12px;padding:10px 14px;cursor:pointer;list-style:none}
.sessionWorldState summary::-webkit-details-marker{display:none}
.sessionWorldState summary::before{content:"▸";color:var(--gold);transition:transform .15s}
.sessionWorldState[open] summary::before{transform:rotate(90deg)}
.sessionWorldState summary span{color:var(--gold-light);font-size:12px;font-weight:900;letter-spacing:.6px;text-transform:uppercase}
.sessionWorldState summary em{font-style:normal;font-size:13px;color:#c9d3cb}
.sessionWorldFields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding:0 14px 14px}
.sessionWorldFields label{display:flex;flex-direction:column;gap:6px}
.sessionWorldFields label span{color:var(--gold-light);font-size:12px;font-weight:900;letter-spacing:.6px;text-transform:uppercase}
.sessionWorldFields input,
.sessionWorldFields select{
    width:100%;
    min-height:38px;
    padding:6px 10px;
    border:1px solid rgba(189,162,103,.65);
    border-radius:4px;
    background:#efe4c6;
    color:var(--ink);
    font-size:14px;
}
.sessionNotesActions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
#endSessionBtn{
    min-height:39px;
    padding:8px 14px;
    border:1px solid #14502a;
    background:#1f6b3a;
    color:#fff;
    font-weight:800;
    cursor:pointer;
}
#endSessionBtn:hover{filter:brightness(1.15)}
#sessionNotesInput{min-height:340px}
.campaignAdvanced summary{cursor:pointer;color:#cdb497;font-size:13px}
.campaignAdvanced[open]{display:flex;align-items:center;gap:12px}
@media(max-width:650px){.sessionWorldFields{grid-template-columns:1fr}}

/* ===== Campaign Planning: next-session prep and story tree ===== */
.campaignPrep,
.campaignStory{
    margin:0 24px 16px;
    border:1px solid rgba(201,162,74,.55);
    border-radius:10px;
    background:rgba(18,14,10,.55);
    color:#e9dcc3;
}
.campaignPrepHead,
.campaignStoryHead{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:12px 16px;
    border-bottom:1px solid rgba(201,162,74,.35);
}
.campaignPrepHead h3,
.campaignStoryHead h3{margin:0;color:#ffbd61;font:700 20px Georgia,"Times New Roman",serif}
.campaignPrepHead span,
.campaignStoryHead span{display:block;margin-top:2px;color:#cdb497;font-size:12px}
.campaignPrepProgress{flex:0 0 190px;height:10px;border-radius:6px;background:rgba(255,255,255,.12);overflow:hidden}
.campaignPrepProgress i{display:block;height:100%;width:0;border-radius:6px;background:linear-gradient(90deg,#3f8a54,#7bc88a);transition:width .25s ease}
.campaignPrepList{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 18px;padding:12px 16px 14px}
.campaignPrepRow{display:grid;grid-template-columns:22px 82px minmax(0,1fr) auto;align-items:center;gap:8px;min-width:0}
.cpMark{color:#8d7a5c;font-weight:900;text-align:center}
.campaignPrepRow.is-ready .cpMark{color:#7bc88a}
.campaignPrepRow label{color:#e8c56a;font-size:12px;font-weight:900;letter-spacing:.05em;text-transform:uppercase}
.campaignPrepRow select,
.cpNpcBox select{
    width:100%;
    min-width:0;
    min-height:34px;
    padding:4px 8px;
    border:1px solid rgba(201,162,74,.6);
    border-radius:6px;
    background:#f1e4c4;
    color:#2c2116;
    font-size:13px;
}
.campaignPrepRow>button{
    min-height:32px;
    padding:4px 10px;
    border:1px solid rgba(201,162,74,.7);
    border-radius:6px;
    background:#3a4a39;
    color:#f6e3b0;
    font-size:12px;
    font-weight:800;
    white-space:nowrap;
    cursor:pointer;
}
.campaignPrepRow>button:hover{filter:brightness(1.2)}
.cpNpcBox{display:flex;flex-wrap:wrap;align-items:center;gap:6px;min-width:0}
.cpNpcBox select{flex:1 1 140px}
.cpChip{display:inline-flex;align-items:center;gap:4px;padding:3px 4px 3px 10px;border-radius:999px;background:#2f5a3d;color:#fff;font-size:12px;font-weight:700}
.cpChip button{width:18px;height:18px;padding:0;border:0;border-radius:50%;background:rgba(0,0,0,.3);color:#fff;line-height:1;cursor:pointer}
.campaignStoryActions{display:flex;gap:8px;flex-wrap:wrap}
.campaignStoryActions button{
    min-height:34px;
    padding:6px 14px;
    border:1px solid rgba(201,162,74,.8);
    border-radius:6px;
    background:#1f6b3a;
    color:#fff;
    font-weight:800;
    cursor:pointer;
}
.campaignStoryActions button:hover{filter:brightness(1.15)}
.campaignTree{display:flex;flex-direction:column;gap:12px;padding:14px 16px 16px}
.campaignChapterGroup{
    overflow:hidden;
    border:2px solid #765435;
    border-radius:10px;
    background:#211a15;
}
.campaignChapterGroup.is-loose{border-style:dashed;opacity:.92}
.ctHead{
    display:flex;
    align-items:center;
    gap:12px;
    flex-wrap:wrap;
    padding:10px 14px;
    background:#302219;
    border-bottom:2px solid #765435;
}
.ctTitle{flex:1 1 220px;min-width:0}
.ctTitle h4{margin:0;color:#ffbd61;font:700 19px Georgia,"Times New Roman",serif}
.ctTitle small{color:#cdb497;font-size:12px}
.ctButtons{display:flex;gap:6px;flex-wrap:wrap}
.ctButtons button{
    min-height:30px;
    padding:3px 10px;
    border:1px solid rgba(201,162,74,.55);
    border-radius:6px;
    background:#493228;
    color:#f6e3b0;
    font-size:12px;
    font-weight:700;
    cursor:pointer;
}
.ctButtons button[data-tree-action="delete"]{background:#8b2d22;color:#fff}
.ctButtons button:hover{filter:brightness(1.2)}
.ctBody{display:flex;flex-direction:column;gap:6px;padding:10px 14px 12px}
.ctBody h5{margin:6px 0 2px;color:#cdb497;font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.ctEmpty{margin:4px 0;color:#bca88e;font-style:italic;font-size:13px}
.campaignTreeItem{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
    padding:8px 10px;
    border:1px solid #9a622f;
    border-radius:8px;
    background:linear-gradient(180deg,#f2e3c9,#dcc39c);
    color:#271a11;
    cursor:pointer;
}
.campaignTreeItem:hover{filter:brightness(1.04)}
.ctMain{flex:1 1 200px;min-width:0}
.ctMain strong{display:block;color:#713016;font-size:15px}
.ctMain small{color:#6a503d}
.campaignTreeItem .ctMove{
    flex:0 1 170px;
    min-height:30px;
    padding:2px 6px;
    border:1px solid #9a622f;
    border-radius:6px;
    background:#fbf3de;
    color:#271a11;
    font-size:12px;
}
.campaignTreeItem .ctButtons button{background:#493228;color:#fff}
.campaignTreeItem .ctButtons button[data-tree-action="delete"]{background:#8b2d22}
.campaignStoryStart{padding:26px 22px;text-align:left;color:#e9dcc3}
.campaignStoryStart strong{display:block;margin-bottom:8px;color:#ffbd61;font:700 20px Georgia,serif}
.campaignStoryStart ol{margin:0;padding-left:22px;line-height:1.7}
@media(max-width:900px){
    .campaignPrepList{grid-template-columns:1fr}
    .campaignPrepRow{grid-template-columns:22px 70px minmax(0,1fr)}
    .campaignPrepRow>button{grid-column:3}
}

/* Quest editor opens above the Campaign Planning window */
#questEditorWindow{z-index:50010 !important}

/* Monster Sheet: no ability dice under the stat block; rolls come from Actions and Items like on the NPC sheet */
.monsterSheet .monsterAbilityRollBtn{display:none!important}
.monsterSheet .monsterAbility{gap:6px;padding-bottom:11px}

/* ===== Campaign Hub: one window with Run Session / Plan Story / My Campaigns ===== */
.sessionDashboardTabs{grid-template-columns:repeat(3,1fr)!important}
.sessionDashboardHeader .hubEyebrow{
    display:block;
    margin-bottom:3px;
    color:#e8c56a;
    font-size:10px;
    font-weight:900;
    letter-spacing:.18em;
    text-transform:uppercase;
}
.sessionPlanPane{
    display:flex;
    flex-direction:column;
    gap:16px;
    padding:20px 0 70px!important;
    background:linear-gradient(180deg,#142219,#0b130f);
}
.sessionPlanPane.hidden{display:none!important}
.sessionPlanPane .campaignManagerTop,
.sessionPlanPane .campaignStats,
.sessionPlanPane .campaignQuickLinks,
.sessionPlanPane .campaignFooter{margin-left:24px!important;margin-right:24px!important}
.sessionPlanPane .campaignPrep,
.sessionPlanPane .campaignStory{margin-left:24px;margin-right:24px}
.sessionPlanPane .campaignManagerTop{padding:0!important}
.campaignQuickLinks{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.campaignQuickLabel{margin-right:4px;color:#cdb497;font-size:11px;font-weight:900;letter-spacing:.14em;text-transform:uppercase}
#campaignNoteWindow{z-index:50010!important}

/* Active campaign chip in the header */
.activeCampaignGroup{margin-right:6px}
.activeCampaignChip{
    display:flex!important;
    align-items:center;
    gap:9px;
    max-width:270px;
    min-height:44px;
    padding:4px 12px 4px 10px!important;
    border:1.5px solid #e8c56a!important;
    border-radius:8px!important;
    background:linear-gradient(180deg,rgba(201,162,74,.28),rgba(201,162,74,.1))!important;
    color:#fff4d5!important;
    text-align:left;
    cursor:pointer;
    box-shadow:0 0 0 1px rgba(0,0,0,.35),0 0 14px rgba(232,197,106,.22);
}
.activeCampaignChip:hover{filter:brightness(1.12)}
.activeCampaignChip .acDot{flex:0 0 10px;width:10px;height:10px;border-radius:50%;background:#7bd88f;box-shadow:0 0 8px #7bd88f}
.activeCampaignChip .acText{display:flex;flex-direction:column;min-width:0;line-height:1.1}
.activeCampaignChip .acText small{color:#e8c56a;font-size:9px;font-weight:900;letter-spacing:.16em;text-transform:uppercase}
.activeCampaignChip .acText strong{overflow:hidden;color:#fff;font-size:14px;text-overflow:ellipsis;white-space:nowrap}
.activeCampaignChip .acCaret{color:#e8c56a;font-size:12px}
#campaignSwitchMenu{
    min-width:290px;
    padding:8px;
    border:1px solid #c9a24a;
    border-radius:10px;
    background:#0e1712;
    box-shadow:0 18px 40px rgba(0,0,0,.6);
}
#campaignSwitchMenu.hidden{display:none!important}
.campaignSwitchTitle{padding:4px 8px 6px;color:#cdb497;font-size:10px;font-weight:900;letter-spacing:.16em;text-transform:uppercase}
#campaignSwitchMenu button{
    display:flex;
    align-items:center;
    gap:9px;
    width:100%;
    margin:2px 0;
    padding:9px 10px;
    border:1px solid transparent;
    border-radius:7px;
    background:transparent;
    color:#f4ead2;
    font-size:14px;
    text-align:left;
    cursor:pointer;
}
#campaignSwitchMenu button:hover{background:rgba(201,162,74,.16)}
#campaignSwitchMenu .campaignSwitchItem.active{border-color:#c9a24a;background:rgba(201,162,74,.2);color:#fff}
.campaignSwitchDot{flex:0 0 9px;width:9px;height:9px;border-radius:50%;border:1.5px solid #9aa89c}
.campaignSwitchItem.active .campaignSwitchDot{border-color:#7bd88f;background:#7bd88f;box-shadow:0 0 7px #7bd88f}
.campaignSwitchName{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.campaignSwitchItem em{color:#e8c56a;font-size:10px;font-style:normal;font-weight:900;letter-spacing:.1em;text-transform:uppercase}
.campaignSwitchFoot{display:flex;gap:6px;margin-top:6px;padding-top:8px;border-top:1px solid rgba(201,162,74,.3)}
#campaignSwitchMenu .campaignSwitchFoot button{justify-content:center;color:#e8c56a;font-size:13px;font-weight:800}

/* Campaign tabs on the main page */
#homeGrid{grid-template-rows:auto}
.campaignBanner{
    grid-column:1/-1;
    display:flex;
    align-items:center;
    gap:22px;
    flex-wrap:wrap;
    padding:12px 18px;
    border:1.5px solid rgba(232,197,106,.75);
    border-radius:14px;
    background:
        radial-gradient(circle at 0 0,rgba(232,197,106,.16),transparent 45%),
        linear-gradient(180deg,rgba(20,44,32,.96),rgba(9,22,16,.98));
    box-shadow:0 10px 24px rgba(0,0,0,.3);
}
.campaignBannerMain{display:flex;flex-direction:column;min-width:0;max-width:340px}
.campaignBannerEyebrow{color:#e8c56a;font-size:10px;font-weight:900;letter-spacing:.18em;text-transform:uppercase}
.campaignBannerMain h2{margin:2px 0;overflow:hidden;color:#fff4d5;font:700 26px Georgia,"Times New Roman",serif;text-overflow:ellipsis;white-space:nowrap}
.campaignBannerStatus{align-self:flex-start;padding:1px 9px;border-radius:999px;background:rgba(123,216,143,.16);color:#9fe3ae;font-size:11px;font-weight:800}
.campaignTabs{display:flex;flex:1 1 320px;flex-wrap:wrap;align-items:flex-end;gap:8px;min-width:0}
.campaignTab{
    display:inline-flex;
    align-items:center;
    gap:8px;
    max-width:240px;
    min-height:40px;
    padding:8px 16px;
    overflow:hidden;
    border:1px solid rgba(201,162,74,.45);
    border-radius:10px;
    background:rgba(255,255,255,.05);
    color:#cfd8cf;
    font-size:14px;
    font-weight:700;
    text-overflow:ellipsis;
    white-space:nowrap;
    cursor:pointer;
}
.campaignTab:hover{background:rgba(201,162,74,.18);color:#fff}
.campaignTab.active{
    border-color:#e8c56a;
    background:linear-gradient(180deg,#c9a24a,#8f6f2c);
    color:#1a1208;
    cursor:default;
    box-shadow:0 0 14px rgba(232,197,106,.35);
}
.campaignTabDot{flex:0 0 9px;width:9px;height:9px;border-radius:50%;border:1.5px solid currentColor}
.campaignTab.active .campaignTabDot{border-color:#14361f;background:#14361f}
.campaignTabAdd{border-style:dashed;color:#e8c56a}
.campaignBannerHub{
    min-height:40px;
    padding:8px 18px;
    border:1px solid #e8c56a;
    border-radius:10px;
    background:#1f6b3a;
    color:#fff;
    font-weight:800;
    cursor:pointer;
}
.campaignBannerHub:hover{filter:brightness(1.15)}
#homeGrid.noNotes .campaignBanner{position:absolute;top:24px;left:28px;right:28px;z-index:2}
body:has(#editorView:not(.hidden)) #campaignBanner{display:none}

/* Floating way back to the hub */
.hubReturnBar{
    position:fixed;
    bottom:22px;
    left:50%;
    z-index:2147483000;
    display:flex;
    align-items:center;
    gap:12px;
    padding:6px 8px 6px 6px;
    transform:translateX(-50%);
    border:1.5px solid #e8c56a;
    border-radius:999px;
    background:rgba(11,24,17,.96);
    box-shadow:0 12px 30px rgba(0,0,0,.55);
}
.hubReturnBar.hidden{display:none!important}
.hubReturnBar button{
    min-height:36px;
    padding:6px 18px;
    border:0;
    border-radius:999px;
    background:linear-gradient(180deg,#d8b45b,#a47d2d);
    color:#1a1208;
    font-size:14px;
    font-weight:900;
    cursor:pointer;
}
.hubReturnBar button:hover{filter:brightness(1.1)}
#hubReturnInfo{padding-right:12px;color:#e8d9b0;font-size:13px;font-weight:700}
@media(max-width:760px){
    .activeCampaignChip{max-width:170px}
    .campaignBannerMain{max-width:none;width:100%}
    #hubReturnInfo{display:none}
}
/* Campaign safety: typed delete confirmation + Recently deleted */
.campaignDeleteOverlay{position:fixed;inset:0;z-index:2147483000;display:flex;align-items:center;justify-content:center;background:rgba(5,9,7,.72);backdrop-filter:blur(3px)}
.campaignDeleteBox{width:min(500px,92vw);padding:22px;border:1px solid #b9503f;border-radius:8px;background:linear-gradient(180deg,#2a1d1a,#140e0c);color:#f3e8c9;box-shadow:0 24px 70px rgba(0,0,0,.7)}
.campaignDeleteBox h2{margin:0 0 10px;font-size:1.25rem;color:#ffd9b0}
.campaignDeleteBox p{margin:0 0 14px;line-height:1.5;color:#e4d7b5}
.campaignDeleteBox label{display:flex;flex-direction:column;gap:7px;font-weight:700;color:var(--gold-light,#e6cf8a)}
.campaignDeleteBox input{min-height:42px;padding:9px 11px;border:1px solid rgba(189,162,103,.68);border-radius:4px;background:#efe4c6;color:#1b140d}
.campaignDeleteActions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}
.campaignDeleteActions button{min-height:40px;padding:0 16px;border:1px solid rgba(189,162,103,.5);border-radius:4px;background:#2c4636;color:#f3e8c9;font-weight:800;cursor:pointer}
.campaignDeleteActions button[data-delete-confirm="delete"]{background:#8a3328;border-color:#c0604f}
.campaignDeleteActions button:disabled{opacity:.4;cursor:not-allowed}
.deletedCampaigns{margin-top:18px;padding:14px;border:1px dashed rgba(189,162,103,.45);border-radius:8px;background:rgba(0,0,0,.18)}
.deletedCampaignsHead{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:10px}
.deletedCampaignsHead h4{margin:0;color:var(--gold-light,#e6cf8a)}
.deletedCampaignsHead span{font-size:.8rem;color:#b9ad8a}
.deletedCampaignRow{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:9px 0;border-top:1px solid rgba(189,162,103,.2)}
.deletedCampaignRow strong{display:block;color:#f3e8c9}
.deletedCampaignRow small{color:#b9ad8a}
.deletedCampaignActions{display:flex;gap:8px;flex-shrink:0}
.deletedCampaignActions button{min-height:34px;padding:0 12px;border:1px solid rgba(189,162,103,.5);border-radius:4px;background:#2c4636;color:#f3e8c9;font-weight:800;cursor:pointer}
.deletedCampaignActions button[data-deleted-campaign="purge"]{background:#5b2a24}
/* ===== Hub simplification: session checklist, collapsible campaign details, unified empty states ===== */
.sessionDashboardContent .campaignPrep{margin:0}
.sessionDashboardContent .campaignPrepHead .sessionEyebrow{display:block;margin-bottom:2px}
.cpValue{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#f3e8c9;font-size:14px;font-weight:700}
.cpValue.is-empty{color:#9aa79d;font-style:italic;font-weight:500}
.campaignPrepRow:not(.is-ready) label{opacity:.85}
.sessionNowCard.is-flash{animation:sessionCardFlash 1.5s ease}
@keyframes sessionCardFlash{0%,100%{box-shadow:0 0 0 0 rgba(232,197,106,0)}25%,70%{box-shadow:0 0 0 3px rgba(232,197,106,.85)}}
.emptyNextStep{
    align-self:flex-start;
    min-height:34px;
    padding:6px 14px;
    border:1px solid #e8c56a;
    border-radius:6px;
    background:linear-gradient(180deg,#b8472f,#8a3322);
    color:#fff6dc;
    font-size:13px;
    font-weight:800;
    cursor:pointer;
}
.emptyNextStep:hover{filter:brightness(1.15)}
.sessionNowCard .emptyNextStep{width:100%;align-self:stretch}
.sessionNowDetails.is-empty:has(+ .emptyNextStep){min-height:0}
.questManagerEmpty .emptyNextStep,.mapLibraryEmpty .emptyNextStep{margin-top:12px;align-self:center}
.campaignStoryStart p{margin:0 0 14px;color:#cdb497}
.ctEmpty{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.ctEmptyActions{display:inline-flex;gap:8px;flex-wrap:wrap}
.ctEmptyActions .emptyNextStep{min-height:30px;padding:3px 12px;font-size:12px}

.campaignDetailsFold{
    margin:0 24px;
    border:1px solid rgba(201,162,74,.4);
    border-radius:8px;
    background:rgba(18,14,10,.45);
}
.campaignDetailsFold>summary{
    display:flex;
    align-items:center;
    gap:12px;
    padding:10px 14px;
    color:#e8c56a;
    font-size:12px;
    font-weight:900;
    letter-spacing:.12em;
    text-transform:uppercase;
    cursor:pointer;
    list-style:none;
}
.campaignDetailsFold>summary::-webkit-details-marker{display:none}
.campaignDetailsFold>summary::before{content:"\25B6";font-size:9px;transition:transform .15s ease}
.campaignDetailsFold[open]>summary::before{transform:rotate(90deg)}
.campaignDetailsFold>summary em{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#cdb497;font-style:normal;font-weight:600;letter-spacing:0;text-transform:none}
.campaignDetailsFold[open]>summary em{display:none}
.campaignDetailsFold .campaignManagerTop{margin:0!important;padding:4px 14px 14px!important}
.sessionPlanPane .campaignDetailsFold{margin-left:24px;margin-right:24px}
/* ===== Home page: campaign colour/icon, summaries and panel filters ===== */
.campaignBanner{
    --cc:#e8c56a;
    border-color:var(--cc);
    background:
        radial-gradient(circle at 0 0,color-mix(in srgb,var(--cc) 22%,transparent),transparent 48%),
        linear-gradient(180deg,rgba(20,44,32,.96),rgba(9,22,16,.98));
    box-shadow:0 10px 24px rgba(0,0,0,.3),inset 5px 0 0 var(--cc);
}
.campaignBannerEyebrow{color:var(--cc)}
.campaignBannerMain h2{display:flex;align-items:center;gap:10px}
.campaignBannerIcon{flex:0 0 auto;font-size:26px;line-height:1}
.campaignBannerMeta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;color:#cdd7cc;font-size:12px}
.campaignBannerMeta>span:not(.campaignBannerStatus){white-space:nowrap}
.campaignBannerMain{max-width:420px}
.campaignTab{
    --cc:#e8c56a;
    max-width:270px;
    min-height:48px;
    padding:6px 14px 6px 10px;
    border-left:4px solid var(--cc);
}
.campaignTabIcon{flex:0 0 auto;font-size:20px;line-height:1}
.campaignTabText{display:flex;flex-direction:column;min-width:0;line-height:1.2;text-align:left}
.campaignTabText strong{overflow:hidden;text-overflow:ellipsis;font-size:14px}
.campaignTabText small{overflow:hidden;text-overflow:ellipsis;color:#9fb0a3;font-size:11px;font-weight:600}
.campaignTab.active{
    border-color:var(--cc);
    border-left-width:4px;
    background:linear-gradient(180deg,var(--cc),color-mix(in srgb,var(--cc) 62%,#000));
    box-shadow:0 0 14px color-mix(in srgb,var(--cc) 45%,transparent);
}
.campaignTab.active .campaignTabText small{color:rgba(20,14,6,.78)}
.campaignTabAdd{min-height:48px;border-left-width:1px}
.homeFilters{display:flex;flex-basis:100%;flex-wrap:wrap;align-items:center;gap:8px;padding-top:10px;border-top:1px solid rgba(201,162,74,.25)}
.homeFilters.hidden{display:none}
.homeFiltersLabel{margin-right:2px;color:#cdb497;font-size:10px;font-weight:900;letter-spacing:.16em;text-transform:uppercase}
.homeFilterChip{
    display:inline-flex;
    align-items:center;
    gap:6px;
    min-height:30px;
    padding:3px 12px;
    border:1px solid rgba(201,162,74,.45);
    border-radius:999px;
    background:rgba(255,255,255,.05);
    color:#e6dfc9;
    font-size:13px;
    font-weight:700;
    cursor:pointer;
}
.homeFilterChip em{padding:0 6px;border-radius:999px;background:rgba(0,0,0,.35);color:#e8c56a;font-size:11px;font-style:normal}
.homeFilterChip:hover{background:rgba(201,162,74,.18)}
.homeFilterChip.active{border-color:var(--cc,#e8c56a);background:var(--cc,#e8c56a);color:#1a1208}
.homeFilterChip.active em{background:rgba(0,0,0,.25);color:#fff}
#homeGrid .panel.is-filtered-out{display:none!important}
.activeCampaignChip{--cc:#e8c56a;border-color:var(--cc)!important}
.activeCampaignChip .acDot{flex:0 0 auto;width:auto;height:auto;border-radius:0;background:none;box-shadow:none;font-size:18px;line-height:1}
.campaignSwitchDot{flex:0 0 auto;width:auto;height:auto;border:0;border-radius:0;font-size:16px;line-height:1}
.campaignSwitchItem.active .campaignSwitchDot{border:0;background:none;box-shadow:none}
#campaignSwitchMenu .campaignSwitchItem{border-left:3px solid var(--cc,transparent)}
.campaignProfileCard{border-left:5px solid var(--cc,#e8c56a)}
.campaignProfileIcon{font-size:26px}
.campaignAppearance{display:flex;flex-direction:column;gap:8px;padding:0 22px 18px}
.campaignAppearanceLabel{color:var(--gold-light,#e6cf8a);font-size:12px;font-weight:850;letter-spacing:.08em;text-transform:uppercase}
.campaignChoiceRow{display:flex;flex-wrap:wrap;gap:8px}
.campaignChoice{
    width:40px;
    height:40px;
    padding:0;
    border:2px solid rgba(201,162,74,.35);
    border-radius:10px;
    background:rgba(255,255,255,.06);
    font-size:20px;
    line-height:1;
    cursor:pointer;
}
.campaignChoice:hover{background:rgba(201,162,74,.2)}
.campaignChoice.active{border-color:#fff4d5;background:rgba(201,162,74,.3);box-shadow:0 0 0 2px rgba(232,197,106,.45)}
.campaignColorChoice{background:var(--cc);border-radius:50%}
.campaignColorChoice:hover{background:var(--cc);filter:brightness(1.15)}
.campaignColorChoice.active{background:var(--cc)}
@media(max-width:760px){.campaignTab{max-width:100%}.campaignBannerMain{max-width:none}}
/* ===== Menu sound toggle ===== */
.soundToggleBtn{
    min-width:40px;
    padding:0 10px!important;
    font-size:17px!important;
    line-height:1;
}
.soundToggleBtn.is-muted{opacity:.6;filter:grayscale(.6)}
/* Roomier dice tray (desktop): less padding around the board; the board is framed tighter in resize() and
   the upper picker is moved by the same amount so it stays over its dice. Header, dock and side buttons are untouched. */
@media(min-width:761px){
    #quickDiceWindow{padding:6px 8px!important}
    #quickDiceWindow .quickDiceBox{
        padding:0!important;
        height:calc(100vh - var(--real-header-height,76px) - 12px)!important;
        max-height:calc(100vh - var(--real-header-height,76px) - 12px)!important;
    }
}

/* Die names float above each shelf die. Their position comes from placeShelfDiceLabels() in the script. */
.quickDiceBox.dice3dReady .dicePickerPanel{
    left:0!important;
    right:0!important;
    top:0!important;
    height:100%!important;
    padding:0!important;
    display:block!important;
}
.quickDiceBox.dice3dReady .quickDiceGrid{
    position:absolute!important;
    inset:0!important;
    display:block!important;
    width:auto!important;
    gap:0!important;
}
.quickDiceBox.dice3dReady .quickDiceGrid button{
    position:absolute!important;
    left:var(--label-x,-999px)!important;
    top:var(--label-y,-999px)!important;
    translate:-50% -100%;
    width:auto!important;
    min-width:0!important;
    min-height:0!important;
    padding:0!important;
    display:block!important;
    white-space:nowrap;
}
.quickDiceBox.dice3dReady .quickDiceGrid button > span:nth-child(2){
    display:block!important;
    margin:0!important;
    padding:2px 7px!important;
    font-size:11px!important;
    line-height:1.2!important;
    border:1px solid rgba(232,197,145,.3);
    background:rgba(28,13,8,.78)!important;
}
.quickDiceBox.dice3dReady .quickDiceGrid button.selected .diceCountBadge{
    right:auto!important;
    left:calc(100% + 4px)!important;
    top:50%!important;
    transform:translateY(-50%)!important;
}

/* Add to Initiative window: party, NPCs, monsters, SRD side by side */
.initiativeEnemiesColumns{grid-template-columns:repeat(4,minmax(0,1fr))!important;overflow:auto}
.initiativeEnemiesResults{max-height:46vh}
@media(max-width:1000px){.initiativeEnemiesColumns{grid-template-columns:1fr 1fr!important}.initiativeEnemiesResults{max-height:24vh}}
@media(max-width:700px){.initiativeEnemiesColumns{grid-template-columns:1fr!important}}
.initiativeEnemyCard button[disabled]{opacity:.55;cursor:default}
.initiativeEnemiesBox>.initiativeEnemiesHeader{position:static!important;inset:auto!important;width:auto!important;height:auto!important;min-height:0!important;z-index:auto!important;background:none!important;border:0!important;box-shadow:none!important;padding:0 0 10px!important;display:flex!important;justify-content:space-between;align-items:flex-start;color:#282116!important;overflow:visible!important}
.initiativeEnemiesBox>.initiativeEnemiesHeader::before,.initiativeEnemiesBox>.initiativeEnemiesHeader::after{display:none!important}

/* PDF Library: large campaign documents */
#pdfLibraryWindow,#pdfLibraryViewerWindow{position:fixed;inset:0;z-index:100500;background:rgba(8,13,10,.78);display:flex;align-items:center;justify-content:center;padding:24px}
#pdfLibraryWindow.hidden,#pdfLibraryViewerWindow.hidden{display:none!important}
.pdfLibBox,.pdfLibViewerBox{box-sizing:border-box;display:flex;flex-direction:column;background:#f3e6c8;color:#282116;border:3px solid #8c6b35;border-radius:8px;box-shadow:0 18px 70px #000a;padding:18px;overflow:hidden}
.pdfLibBox{width:min(1100px,96vw);max-height:90vh}
.pdfLibViewerBox{width:min(1400px,98vw);height:94vh}
.pdfLibHeader{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:12px}
.pdfLibHeader h2{margin:2px 0 4px;font-family:Georgia,serif;font-size:28px;color:#1f3a2b}
.pdfLibHeader p{margin:0;color:#6c5c40;font-size:14px}
.pdfLibEyebrow{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#8c6b35;font-weight:700}
.pdfLibHeader>button,.pdfLibViewerActions button{cursor:pointer}
#closePdfLibrary,#closePdfLibraryViewer{width:38px;height:38px;border-radius:50%;border:0;background:#5b564b;color:#fff;font-size:18px;flex-shrink:0}
.pdfLibViewerHeader{align-items:center;margin-bottom:10px}
.pdfLibViewerHeader h2{font-size:21px;margin:0;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pdfLibViewerActions{display:flex;gap:8px;align-items:center;flex-shrink:0}
#pdfLibViewerNewTab,#pdfLibViewerDownload{padding:8px 14px;border-radius:5px;border:1px solid #1f3a2b;background:#2b5a3f;color:#f3e6c8;font-weight:700}
#pdfLibraryViewerFrame{flex:1;min-height:0;width:100%;border:1px solid #8c6b35;border-radius:4px;background:#fff}
.pdfLibBody{display:grid;grid-template-columns:minmax(260px,320px) 1fr;gap:18px;min-height:0;overflow:hidden}
.pdfLibUpload{display:flex;flex-direction:column;gap:10px;overflow:auto}
.pdfLibDropZone{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-align:center;padding:30px 14px;border:2px dashed #8c6b35;border-radius:6px;background:#e9d9b3;color:#594729;cursor:pointer;transition:background .15s,border-color .15s}
.pdfLibDropZone strong{font-size:17px}
.pdfLibDropZone span{font-size:13px}
.pdfLibDropZone:hover,.pdfLibDropZone.isOver{background:#dcc98f;border-color:#2b5a3f}
.pdfLibField{display:flex;flex-direction:column;gap:4px;font-size:12px;font-weight:700;color:#594729}
.pdfLibField select,.pdfLibTools select,.pdfLibTools input,.pdfLibItemCategory{padding:8px 10px;border:1px solid #c7b58b;border-radius:5px;background:#fff8e8;color:#282116;font:inherit;font-weight:400}
.pdfLibStatus{min-height:18px;font-size:13px;color:#594729}
.pdfLibStatus.working{color:#8c6b35;font-weight:700}
.pdfLibStatus.success{color:#2b5a3f;font-weight:700}
.pdfLibStatus.error{color:#9b2c2c;font-weight:700}
.pdfLibStorage{font-size:12px;color:#6c5c40}
.pdfLibHint{margin:0;font-size:12px;line-height:1.45;color:#6c5c40}
.pdfLibCollection{display:flex;flex-direction:column;min-height:0;min-width:0}
.pdfLibTools{display:flex;gap:10px}
.pdfLibTools input{flex:1;min-width:0}
.pdfLibCount{margin:8px 0;font-size:12px;color:#6c5c40}
.pdfLibList{display:flex;flex-direction:column;gap:8px;overflow:auto;min-height:120px;padding-right:4px}
.pdfLibEmpty{padding:30px 10px;text-align:center;color:#6c5c40}
.pdfLibItem{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:10px 12px;background:#fff8e8;border:1px solid #c7b58b;border-radius:5px}
.pdfLibItem.isMissing{border-color:#b86a6a;background:#f6e4dc}
.pdfLibIcon{width:42px;height:52px;display:grid;place-items:center;border-radius:4px;background:#9b2c2c;color:#fff;font-weight:800;font-size:12px;letter-spacing:.06em}
.pdfLibInfo{min-width:0}
.pdfLibInfo strong{display:block;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pdfLibInfo small{display:block;margin-top:3px;color:#6c5c40}
.pdfLibItemActions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.pdfLibItemActions button{padding:6px 11px;border-radius:5px;border:1px solid #1f3a2b;background:#2b5a3f;color:#f3e6c8;font-weight:700;cursor:pointer}
.pdfLibItemActions button:hover:not([disabled]){background:#356e4d}
.pdfLibItemActions button[disabled]{opacity:.45;cursor:default}
.pdfLibItemActions .pdfLibDeleteBtn{background:#8f3a34;border-color:#5d1f1b}
@media(max-width:900px){.pdfLibBody{grid-template-columns:1fr;overflow:auto}.pdfLibItem{grid-template-columns:auto minmax(0,1fr)}.pdfLibItemCategory,.pdfLibItemActions{grid-column:1/-1;justify-content:flex-start}}
@media(max-width:700px){#pdfLibraryWindow,#pdfLibraryViewerWindow{padding:8px}.pdfLibBox,.pdfLibViewerBox{padding:12px}.pdfLibViewerHeader{flex-wrap:wrap}}

/* Advertising slots: calm, in the page flow, never overlaying anything. Empty/blocked slots take no space. */
.dmsAdSlot{box-sizing:border-box}
.dmsAdSlot.hidden{display:none!important}
.dmsAdSlot.is-parked{display:block!important;position:absolute!important;left:-10000px!important;top:0!important;width:min(728px,92vw)!important;visibility:hidden!important;pointer-events:none!important;margin:0!important}
.dmsAdSlot.is-active{display:block;position:static;width:min(728px,calc(100% - 36px));min-height:0;max-height:300px;margin:18px auto;padding:6px 10px 8px;overflow:hidden;border:1px solid rgba(201,162,75,.28);border-radius:8px;background:rgba(10,24,18,.55);color:#cdbf98;text-align:center;z-index:auto}
.dmsAdSlot.is-active::before{content:"Advertisement";display:block;margin-bottom:4px;font:700 9px/1 Georgia,serif;letter-spacing:.18em;text-transform:uppercase;color:#8d7a4b}
.dmsAdSlot .dmsAdHolder{max-width:100%;overflow:hidden}
#hubAdSlot.is-active{margin:6px auto 30px}
.dmsAdConsent{position:fixed;right:14px;bottom:14px;z-index:100400;width:min(360px,calc(100vw - 28px));padding:12px 14px;border:1px solid #9a7739;border-radius:10px;background:#f3e6c8;color:#2e251b;box-shadow:0 10px 30px #0008;font-size:13px;line-height:1.45}
.dmsAdConsent p{margin:0 0 10px}
.dmsAdConsent a{color:#2b5a3f;font-weight:700}
.dmsAdConsent div{display:flex;gap:8px;justify-content:flex-end}
.dmsAdConsent button{min-height:32px;padding:0 14px;border-radius:7px;border:1px solid #1f3a2b;background:#2b5a3f;color:#f3e6c8;font-weight:800;cursor:pointer}
.dmsAdConsent button[data-ad-choice="denied"]{background:transparent;color:#2b5a3f}
.dmsSupportLink{color:#e2c57d!important;font-weight:700}
@media(max-width:700px){.dmsAdSlot.is-active{width:calc(100% - 20px)}.dmsAdConsent{left:10px;right:10px;bottom:10px;width:auto}}

/* =========================================================
   Phones and tablets
   ========================================================= */
@media(max-width:1000px){
    /* The dungeon map sits behind the welcome text: give the text a dark pool to read on. */
    .welcomeHeroContent::before{
        content:"";
        position:absolute;
        inset:70px -14px 46px;
        z-index:-1;
        border-radius:30px;
        background:radial-gradient(ellipse at center,rgba(4,10,7,.66) 0,rgba(4,10,7,.5) 58%,rgba(4,10,7,0) 100%);
        pointer-events:none;
    }
}
@media(max-width:700px){
    /* The character creator grid would not shrink below its content and ran 6px off the screen. */
    .characterCreatorBody{grid-template-columns:minmax(0,1fr)!important}
    .characterCreatorBody>*{min-width:0!important;max-width:100%!important}
}
@media(pointer:coarse){
    .homeFilterChip{min-height:40px}
    .navGroupToggle,.soundToggleBtn{min-height:42px}
}

/* =========================================================
   v1.5.0 - Rules Quick Reference + Generators (DMSrules.js / DMSgen.js)
   ========================================================= */
.dmxWindow{
    position:fixed;
    inset:var(--real-header-height,76px) 0 0;
    z-index:29000;
    display:flex;
    align-items:flex-start;
    justify-content:center;
    padding:14px 18px 20px;
    background:rgba(5,8,6,.86);
    overflow:hidden;
}
.dmxWindow.hidden{display:none!important}

.dmxBox{
    width:min(1120px,97vw);
    height:min(840px,calc(100vh - var(--real-header-height,76px) - 34px));
    display:flex;
    flex-direction:column;
    border:1px solid var(--gold);
    border-radius:10px;
    background:linear-gradient(180deg,#1b2b22,#111a15);
    box-shadow:0 24px 64px rgba(0,0,0,.62);
    color:var(--text);
    overflow:hidden;
}

.dmxHeader{
    display:flex;
    align-items:center;
    gap:16px;
    padding:14px 18px;
    border-bottom:1px solid rgba(189,162,103,.4);
    background:linear-gradient(180deg,rgba(79,125,92,.34),rgba(79,125,92,.08));
}
.dmxTitle{flex:1 1 auto;min-width:0}
.dmxTitle span{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-light);opacity:.85}
.dmxTitle h2{margin:2px 0 0;font-size:24px;color:var(--parchment-light);font-family:Georgia,"Times New Roman",serif}
.dmxSearch{
    flex:0 1 340px;
    min-width:140px;
    height:40px;
    padding:0 14px;
    border:1px solid var(--gold-muted);
    border-radius:8px;
    background:rgba(5,10,7,.6);
    color:var(--text);
    font-size:15px;
}
.dmxSearch:focus{outline:2px solid var(--gold);outline-offset:1px}
.dmxClose{
    flex:0 0 auto;
    width:40px;height:40px;
    border:1px solid var(--gold);
    border-radius:8px;
    background:linear-gradient(180deg,#395c46,#20382a);
    color:#fff;
    font-size:18px;
    cursor:pointer;
}
.dmxClose:hover{filter:brightness(1.18)}

.dmxBody{flex:1 1 auto;min-height:0;display:flex}
.dmxTabs{
    flex:0 0 190px;
    display:flex;
    flex-direction:column;
    gap:6px;
    padding:14px 12px;
    border-right:1px solid rgba(189,162,103,.28);
    background:rgba(5,10,7,.32);
    overflow-y:auto;
}
.dmxTabs button{
    display:flex;
    align-items:center;
    gap:10px;
    min-height:42px;
    padding:0 12px;
    border:1px solid transparent;
    border-radius:8px;
    background:transparent;
    color:var(--text-muted);
    font-size:14px;
    font-weight:700;
    text-align:left;
    cursor:pointer;
}
.dmxTabs button span{width:22px;text-align:center;font-size:17px}
.dmxTabs button:hover{background:rgba(79,125,92,.24);color:var(--text)}
.dmxTabs button.active{
    border-color:var(--gold);
    background:linear-gradient(180deg,#395c46,#20382a);
    color:#fff;
}

.dmxMain{flex:1 1 auto;min-width:0;display:flex;flex-direction:column}
.dmxContent{
    flex:1 1 auto;
    min-width:0;
    min-height:0;
    padding:16px 18px 22px;
    overflow-y:auto;
    overscroll-behavior:contain;
    display:grid;
    grid-template-columns:repeat(auto-fill,minmax(320px,1fr));
    gap:12px;
    align-content:start;
    align-items:start;
}
.dmxContent:focus{outline:none}

.dmxCard{
    padding:14px 16px;
    border:1px solid rgba(189,162,103,.34);
    border-radius:10px;
    background:linear-gradient(180deg,rgba(32,49,40,.92),rgba(18,28,22,.92));
    box-shadow:0 6px 18px rgba(0,0,0,.28);
    min-width:0;
}
.dmxCard h3{
    margin:0 0 8px;
    display:flex;
    flex-wrap:wrap;
    align-items:baseline;
    gap:4px 10px;
    font-size:17px;
    color:var(--gold-light);
    font-family:Georgia,"Times New Roman",serif;
}
.dmxCard h3 small{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);font-family:inherit}
.dmxCard p{margin:0 0 8px;line-height:1.55;font-size:14px;color:var(--text)}
.dmxCard ul{margin:0 0 8px;padding-left:20px;font-size:14px;line-height:1.55}
.dmxCard li{margin:3px 0}
.dmxCard strong{color:var(--parchment-light)}
.dmxResultCount,.dmxEmpty{grid-column:1/-1}
.dmxResultCount{margin:0;font-size:13px;color:var(--text-muted)}
.dmxEmpty{display:flex;flex-direction:column;gap:6px;padding:40px 10px;text-align:center;color:var(--text-muted)}
.dmxEmpty strong{font-size:18px;color:var(--parchment-light)}

.dmxTableWrap{overflow-x:auto;margin:2px 0 8px}
.dmxTable{width:100%;border-collapse:collapse;font-size:13px}
.dmxTable th,.dmxTable td{padding:6px 9px;border-bottom:1px solid rgba(189,162,103,.2);text-align:left;vertical-align:top}
.dmxTable th{color:var(--gold-light);font-size:11px;letter-spacing:.08em;text-transform:uppercase}

.dmxApply{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:8px;
    margin-top:10px;
    padding-top:10px;
    border-top:1px dashed rgba(189,162,103,.3);
    font-size:12px;
    color:var(--text-muted);
}
.dmxApply select{
    flex:1 1 130px;
    min-width:0;
    height:34px;
    border:1px solid var(--gold-muted);
    border-radius:6px;
    background:rgba(5,10,7,.6);
    color:var(--text);
}
.dmxApply button,.dmxMini,.dmxGhost,.dmxPrimary{
    min-height:34px;
    padding:0 12px;
    border:1px solid var(--gold);
    border-radius:7px;
    background:linear-gradient(180deg,#395c46,#20382a);
    color:#fff;
    font-size:13px;
    font-weight:700;
    cursor:pointer;
}
.dmxApply button:hover,.dmxMini:hover,.dmxGhost:hover,.dmxPrimary:hover{filter:brightness(1.18)}
.dmxGhost,.dmxMini{background:rgba(5,10,7,.45);color:var(--gold-light)}
.dmxPrimary{background:linear-gradient(180deg,#b78a43,#71501f);color:#fff6d7;min-height:40px;padding:0 18px;font-size:14px}

.dmxFooter{
    padding:9px 18px;
    border-top:1px solid rgba(189,162,103,.28);
    background:rgba(5,10,7,.4);
    font-size:12px;
    color:var(--text-muted);
}
.dmxFooter a{color:var(--gold-light)}

/* Generators */
.dmxOptions{
    display:flex;
    flex-wrap:wrap;
    align-items:flex-end;
    gap:10px 14px;
    padding:14px 18px;
    border-bottom:1px solid rgba(189,162,103,.22);
}
.dmxOptions label{display:flex;flex-direction:column;gap:4px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}
.dmxOptions select{
    min-width:150px;
    height:40px;
    padding:0 10px;
    border:1px solid var(--gold-muted);
    border-radius:8px;
    background:rgba(5,10,7,.6);
    color:var(--text);
    font-size:14px;
    text-transform:none;
    letter-spacing:0;
}
.dmxResultHead{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.dmxResultActions{display:flex;flex:0 0 auto;gap:6px}
.dmxMini:disabled{opacity:.6;cursor:default;filter:none}
.dmxResultHead h3{margin:0 0 8px}
.dmxResultHead h3 small{flex-basis:100%;font-size:12px;letter-spacing:0;text-transform:none;font-weight:600}
.dmxRows{margin:0;display:flex;flex-direction:column;gap:7px}
.dmxRows div{display:grid;grid-template-columns:110px minmax(0,1fr);gap:10px;font-size:14px;line-height:1.5}
.dmxRows dt{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-light);padding-top:2px}
.dmxRows dd{margin:0;color:var(--text);overflow-wrap:anywhere}
.dmxChips{display:flex;flex-wrap:wrap;gap:8px}
.dmxChip{
    padding:7px 12px;
    border:1px solid rgba(189,162,103,.45);
    border-radius:999px;
    background:rgba(5,10,7,.5);
    color:var(--parchment-light);
    font-size:14px;
    cursor:pointer;
}
.dmxChip:hover{background:rgba(79,125,92,.4);border-color:var(--gold)}
.dmxNote{margin:10px 0 0!important;font-size:12px!important;color:var(--text-muted)!important}
.dmxFooterRow{grid-column:1/-1;display:flex;justify-content:flex-end}

@media(max-width:820px){
    .dmxWindow{padding:8px}
    .dmxBox{width:100%;height:calc(100vh - var(--real-header-height,76px) - 16px)}
    .dmxHeader{flex-wrap:wrap;gap:10px;padding:12px}
    .dmxSearch{order:3;flex:1 1 100%}
    .dmxBody{flex-direction:column}
    .dmxTabs{flex:0 0 auto;flex-direction:row;overflow-x:auto;overflow-y:hidden;padding:8px;border-right:0;border-bottom:1px solid rgba(189,162,103,.28)}
    .dmxTabs button{flex:0 0 auto;min-height:40px;white-space:nowrap}
    .dmxContent{grid-template-columns:minmax(0,1fr);padding:12px}
    .dmxOptions{padding:10px 12px}
    .dmxOptions select{min-width:120px}
    .dmxRows div{grid-template-columns:minmax(0,1fr);gap:2px}
}

/* =========================================================
   v1.5.1 - Player sheet: print view, rest, carry, currency
   ========================================================= */
.characterSheetRestCard{
    padding:12px;
    border:1px solid #a9894d;
    border-radius:9px;
    background:linear-gradient(180deg,#24362c,#18241e);
}
.characterSheetRestCard small{display:block;margin-top:8px;line-height:1.45;color:#c5b89a}

.characterSheetSpellSlots small{display:block;margin:8px 4px 0;color:#6c4d2b;font-size:12px}
.characterSheetSlotRow{
    display:flex;
    align-items:center;
    gap:10px;
    padding:6px 0;
    flex-wrap:wrap;
}
.characterSheetSlotPips{display:flex;flex-wrap:wrap;gap:5px}
.characterSheetSlotPip{
    width:16px;height:16px;padding:0;
    border:1px solid #71501f;
    border-radius:50%;
    background:#fff9e9;
    cursor:pointer;
}
.characterSheetSlotPip.spent{background:#71501f;box-shadow:inset 0 0 0 3px #fff9e9}
.characterSheetSlotPip:hover{border-color:#b78a43}

.characterSheetCarry{
    margin:0 0 12px;
    padding:10px 12px;
    border:1px solid #a98b58;
    border-radius:9px;
    background:#d8c49a;
    color:#30271d;
}
.characterSheetCarry div:first-child{display:flex;justify-content:space-between;gap:10px;font-size:13px}
.characterSheetCarryBar{
    height:8px;margin:7px 0 6px;border-radius:99px;background:#b9a57a;overflow:hidden;
}
.characterSheetCarryBar i{display:block;height:100%;background:linear-gradient(90deg,#4f7d5c,#bda267)}
.characterSheetCarry.overloaded{border-color:#79362f;background:#e4c7b4}
.characterSheetCarry.overloaded .characterSheetCarryBar i{background:#79362f}

.characterSheetCurrencyTools{
    display:flex;flex-wrap:wrap;align-items:center;gap:8px;
    margin:-6px 0 16px;padding:8px 10px;
    border:1px solid #a98b58;border-top:0;border-radius:0 0 9px 9px;
    background:#cbb68a;color:#30271d;
}
.characterSheetCurrencyTools strong{font-size:16px}
.characterSheetCurrencyTools span{margin-right:auto;font-size:12px}
.characterSheetCurrencyTools button{
    min-height:32px;padding:0 10px;border:1px solid #71501f;border-radius:6px;
    background:linear-gradient(#efe0bc,#d8c49a);color:#30271d;font-size:12px;font-weight:700;cursor:pointer;
}
.characterSheetCurrencyTools button:hover{filter:brightness(1.06)}
.characterSheetCurrencyTools button:disabled{opacity:.45;cursor:not-allowed}

.playerPrintWindow{
    position:fixed;inset:0;z-index:82000;
    display:flex;align-items:flex-start;justify-content:center;
    padding:calc(var(--real-header-height,76px) + 10px) 12px 12px;
    background:rgba(8,12,10,.92);overflow:auto;
}
.playerPrintWindow.hidden{display:none!important}
.playerPrintBox{
    width:min(980px,100%);
    display:flex;flex-direction:column;gap:10px;
}
.playerPrintToolbar{
    display:flex;align-items:center;gap:12px;
    padding:12px 16px;border:1px solid var(--gold);border-radius:10px;
    background:linear-gradient(180deg,#26392f,#111c17);color:var(--parchment-light);
}
.playerPrintToolbar span{display:block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-light)}
.playerPrintToolbar h2{margin:2px 0 0;font-size:22px}
.playerPrintToolbar > div{flex:1}
.playerPrintAction,.playerPrintClose{
    min-height:40px;padding:0 14px;border:1px solid var(--gold);border-radius:8px;
    background:linear-gradient(180deg,#b78a43,#71501f);color:#fff6d7;font-weight:700;cursor:pointer;
}
.playerPrintClose{width:42px;padding:0;background:linear-gradient(#4b3926,#2c2118);color:#f6ecd4}
.playerPrintHint{margin:0;color:var(--text-muted);font-size:12px}
.playerPrintPage{background:#f4e7c8;color:#2b2218;border:1px solid #c4a66a;border-radius:8px;padding:18px 22px}
.playerPrintSheet{font-family:Georgia,"Times New Roman",serif;font-size:12.5px;line-height:1.35}
.playerPrintBanner{display:flex;gap:14px;align-items:center;margin-bottom:12px;padding-bottom:10px;border-bottom:2px solid #b58b46}
.playerPrintPortrait,.playerPrintPortraitFallback{width:72px;height:72px;border-radius:8px;object-fit:cover;border:1px solid #b58b46;background:#e6d4a8;display:grid;place-items:center;font-size:32px}
.playerPrintEyebrow{margin:0;letter-spacing:.12em;text-transform:uppercase;font-size:10px;color:#7a5a2c}
.playerPrintSheet h1{margin:2px 0 4px;font-size:28px}
.playerPrintSheet h2{margin:12px 0 4px;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#7a5a2c;border-bottom:1px solid #d2b57a}
.playerPrintSheet p{margin:0 0 4px}
.playerPrintSheet ul{margin:0;padding-left:16px}
.playerPrintCombat{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:12px}
.playerPrintCombat div{padding:7px 8px;border:1px solid #c4a66a;border-radius:6px;background:#efe0bc}
.playerPrintCombat span{display:block;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#7a5a2c}
.playerPrintCombat strong{font-size:18px}
.playerPrintCombat small{font-size:12px;font-weight:600}
.playerPrintAbilities{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin-bottom:12px}
.playerPrintAbility{text-align:center;padding:8px 4px;border:1px solid #c4a66a;border-radius:8px;background:#efe0bc}
.playerPrintAbility span{display:block;font-size:11px;font-weight:800;letter-spacing:.08em}
.playerPrintAbility strong{display:block;font-size:22px}
.playerPrintColumns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.playerPrintSkills{column-count:1}
.playerPrintInline{display:flex;flex-wrap:wrap;gap:4px 12px;padding-left:0;list-style:none}
.playerPrintSheet li.proficient{font-weight:700}
.playerPrintSheet li.expertise{font-weight:800}
.playerPrintNotes{margin-top:10px;white-space:pre-wrap}

@media(max-width:980px){
    .characterSheetHeader{grid-template-rows:auto auto auto}
}
@media(max-width:720px){
    .playerPrintCombat,.playerPrintAbilities,.playerPrintColumns{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media print{
    body.playerSheetPrinting > *:not(#playerSheetPrintWindow){display:none!important}
    #playerSheetPrintWindow{position:static;inset:auto;padding:0;background:#fff;overflow:visible}
    .playerPrintBox{width:auto}
    .playerPrintToolbar,.playerPrintHint{display:none!important}
    .playerPrintPage{border:0;padding:0;background:#fff}
    .playerPrintSheet{font-size:11px}
    .playerPrintCombat,.playerPrintAbilities,.playerPrintColumns{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}

@media(pointer:coarse){
    .characterSheetSlotPip{width:22px;height:22px}
    .characterSheetCurrencyTools button{min-height:40px}
}

/* =========================================================
   v1.5.3 - fullscreen character sheet + aligned ability dice
   ========================================================= */
#interactiveCharacterSheetWindow{
    padding:0!important;
    inset:0!important;
}
.interactiveCharacterSheetBox{
    width:100%!important;
    max-width:none!important;
    height:100%!important;
    margin:0!important;
    border-radius:0!important;
    border:0!important;
}

.characterSheetAbilityCard{
    overflow:visible;
    grid-template-columns:minmax(0,1fr) 60px!important;
    grid-template-areas:
        "label die"
        "score die"
        "modifier die"!important;
    justify-items:start!important;
    align-items:center!important;
    column-gap:8px!important;
    padding:12px 12px 12px 14px!important;
}
.characterSheetAbilityCard .characterAbilityDie{
    grid-area:die;
    justify-self:center!important;
    align-self:center!important;
    width:44px;
    height:44px;
    transform:none!important;
    filter:none;
    animation:none;
}
.characterSheetAbilityCard .characterAbilityDie.rnlD20Icon,
.characterSheetAbilityCard .rnlD20Icon{
    --d20-size:42px;
    width:var(--d20-size);
    height:var(--d20-size);
    transform:rotateX(10deg) rotateY(-12deg) rotateZ(-3deg)!important;
    transform-origin:50% 50%;
}
.characterSheetAbilityCard .rnlD20Icon::before{
    transform:translate3d(2px,3px,-6px);
    inset:8% 4% 2% 8%;
}
.characterSheetAbilityCard:hover .characterAbilityDie,
.characterSheetAbilityCard:focus-visible .characterAbilityDie{
    animation:none;
}
.characterSheetAbilityCard:hover .rnlD20Icon,
.characterSheetAbilityCard:focus-visible .rnlD20Icon{
    animation:rnlD20SolidHoverSpin 4.8s linear infinite;
}

.characterSheetAbilityCard.hasNpcWebglDie .rnlD20Icon,
.characterSheetAbilityCard.hasNpcWebglDie .characterAbilityDie{
    display:none!important;
}
.characterSheetAbilityCard.hasNpcWebglDie{
    overflow:visible;
}
.characterSheetAbilityCard .npcStatDieViewport,
.characterSheetAbilityCard .npcStatDieViewport canvas{
    grid-area:die;
    justify-self:center;
    align-self:center;
    width:56px!important;
    height:56px!important;
}
.characterSheetAbilityCard.hasNpcWebglDie:hover .npcStatDieViewport,
.characterSheetAbilityCard.hasNpcWebglDie:focus-visible .npcStatDieViewport{
    filter:drop-shadow(0 9px 10px rgba(0,0,0,.68)) drop-shadow(0 0 6px rgba(255,22,22,.34));
    transform:scale(1.08);
}
.characterSheetAbilityCard.hasNpcWebglDie:hover .rnlD20Icon,
.characterSheetAbilityCard.hasNpcWebglDie:focus-visible .rnlD20Icon{
    animation:none;
}

/* v1.5.6 — campaign search */
#globalSearchBtn{min-width:92px}
#globalSearchWindow{
    position:fixed;
    inset:0;
    z-index:1200000;
    display:flex;
    align-items:flex-start;
    justify-content:center;
    padding:12vh 16px 24px;
    background:rgba(6,10,8,.72);
}
#globalSearchWindow.hidden{display:none}
.globalSearchBox{
    width:min(640px,100%);
    max-height:min(70vh,640px);
    display:flex;
    flex-direction:column;
    border:1px solid rgba(201,162,74,.85);
    border-radius:16px;
    background:linear-gradient(180deg,#1b2b22,#101914);
    box-shadow:0 24px 60px rgba(0,0,0,.5);
    overflow:hidden;
}
.globalSearchBox > header{
    position:static!important;
    inset:auto!important;
    isolation:auto!important;
    z-index:auto!important;
    display:grid!important;
    grid-template-columns:32px minmax(0,1fr) 32px!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:stretch!important;
    gap:12px!important;
    width:auto!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:12px 14px 0!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
}
.globalSearchBox > header::before{
    content:none!important;
    display:none!important;
}
.globalSearchBox > header h2{
    margin:0!important;
    color:#f3e2bc!important;
    font-size:15px!important;
    letter-spacing:.12em!important;
    text-transform:uppercase!important;
    grid-column:2!important;
    text-align:center!important;
    text-shadow:none!important;
}
.globalSearchBox > header button{
    width:32px!important;
    height:32px!important;
    min-width:32px!important;
    min-height:32px!important;
    padding:0!important;
    border:1px solid rgba(201,162,74,.6)!important;
    border-radius:8px!important;
    background:#3d2420!important;
    color:#f6e7c8!important;
    box-shadow:none!important;
    clip-path:none!important;
    grid-column:3!important;
    justify-self:end!important;
    cursor:pointer;
}
#globalSearchInput{
    margin:12px 14px;
    padding:12px 14px;
    border:1px solid rgba(201,162,74,.55);
    border-radius:10px;
    background:#0d1712;
    color:#f6edd4;
    font:16px Georgia,serif;
}
#globalSearchInput:focus{outline:2px solid rgba(201,162,74,.45);outline-offset:1px}
#globalSearchResults{
    overflow:auto;
    padding:0 10px 12px;
}
.globalSearchHint{
    margin:4px 8px 10px;
    color:#cbb892;
    font-size:14px;
}
.globalSearchResult{
    width:100%;
    display:grid;
    grid-template-columns:92px minmax(0,1fr);
    grid-template-areas:"kind title" "kind detail";
    gap:2px 12px;
    margin:0 0 6px;
    padding:10px 12px;
    border:1px solid transparent;
    border-radius:10px;
    background:transparent;
    color:#f4e7cb;
    text-align:left;
    cursor:pointer;
}
.globalSearchResult span{
    grid-area:kind;
    align-self:center;
    color:#e7c56a;
    font-size:11px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}
.globalSearchResult strong{grid-area:title;font-size:16px}
.globalSearchResult small{
    grid-area:detail;
    color:#cbb892;
    font-size:12px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
.globalSearchResult.active,
.globalSearchResult:hover{
    border-color:rgba(201,162,74,.7);
    background:rgba(79,125,92,.28);
}