*{
    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;
    gap:8px;
    align-items:center;
}

.lootItemQuantity,
.lootItemValue{
    text-align:center;
}

.lootItemRemove{
    width:38px;
    height:38px;

    border:1px solid #8a4d39;

    background:#7a332a;
    color:white;

    font-weight:900;
    cursor:pointer;
}

.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%;
    }

    .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}
.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,.7),transparent 20%,transparent 80%,rgba(2,7,5,.72)),
        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(.34 + var(--react-glow) * .66);
    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);
}

.welcomeAdventurerCursor{
    --cursor-x:-100px;
    --cursor-y:-100px;
    position:absolute;
    left:0;
    top:0;
    z-index:100;
    width:34px;
    height:43px;
    transform:translate(calc(var(--cursor-x) - 17px),calc(var(--cursor-y) - 34px));
    opacity:0;
    pointer-events:none;
    filter:drop-shadow(0 5px 5px rgba(0,0,0,.65)) drop-shadow(0 0 8px rgba(227,193,111,.35));
}

.welcomeAdventurerCursor svg{
    width:100%;
    height:100%;
    overflow:visible;
}

.welcomeHandGlyph{
    display:none;
}

.welcomeCursorCloak{
    fill:#7e251f;
    stroke:#e0bd6f;
    stroke-width:2;
}

.welcomeCursorFace{
    fill:#d6b37a;
    stroke:#4d261b;
    stroke-width:1.5;
}

.welcomeCursorSword{
    fill:none;
    stroke:#ecdfbc;
    stroke-width:2.5;
    stroke-linecap:round;
}

.welcomeAdventurerCursor circle{
    fill:#17251d;
}

.welcomeAdventurerCursor.isControl{
    width:44px;
    height:44px;
    transform:translate(calc(var(--cursor-x) - 7px),calc(var(--cursor-y) - 7px));
    filter:drop-shadow(0 6px 5px rgba(0,0,0,.7)) drop-shadow(0 0 9px rgba(229,198,121,.42));
}

.welcomeAdventurerCursor.isControl .welcomeAdventurerGlyph{
    display:none;
}

.welcomeAdventurerCursor.isControl .welcomeHandGlyph{
    display:block;
}

.welcomeCursorHand{
    fill:#d6b47d;
    stroke:#4b291e;
    stroke-width:2.6;
    stroke-linejoin:round;
}

.welcomeCursorHandCuff{
    fill:#792b24;
    stroke:#e0bd70;
    stroke-width:2.4;
}

.welcomeCursorHandDetail{
    fill:none;
    stroke:#80583b;
    stroke-width:1.7;
    stroke-linecap:round;
}

@media(pointer:fine){
    .welcomeHero.welcomePointerActive,
    .welcomeHero.welcomePointerActive *{
        cursor:none !important;
    }

    .welcomeHero.welcomePointerActive .welcomeAdventurerCursor{
        opacity:1;
    }
}

.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 .combatantHpRollBtn{
    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:calc(var(--real-header-height, 76px) + 10px) 12px 12px;
    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:min(1760px,100%);
    height:100%;
    margin:0 auto;
    overflow:hidden;
    border:1px solid #a9894d;
    border-radius:16px;
    background:#e9ddbd;
    box-shadow:0 28px 80px rgba(0,0,0,.72),inset 0 0 0 3px rgba(44,29,17,.36);
}

#interactiveCharacterSheetContent{
    display:flex;
    flex-direction:column;
    min-width:0;
    height:100%;
}

.characterSheetHeader{
    display:grid;
    grid-template-columns:auto minmax(340px,1fr) 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(260px,1fr) auto auto auto;
    }
    .characterSheetActionCard{
        grid-template-columns:1fr;
    }
    .characterSheetActionValues{
        justify-content:flex-start;
    }
}

@media(max-width:980px){
    #interactiveCharacterSheetWindow{
        padding:calc(var(--real-header-height, 76px) + 5px) 6px 6px;
    }
    .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;
    }
    .characterSheetEditBtn{
        grid-column:3;
        grid-row:2;
    }
    .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)}

@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 .combatantHpRollBtn{
    grid-column:1/-1;
    background:linear-gradient(180deg,#8a5144,#603229)!important;
}

#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:none!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;
    }
}


/* =========================================================
   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}
}