/* parch-pages.css - parchment restyle for the Sieges, Siege Weeks, Event Heroes and Mines pages
 * (approved mockups, 2026-10-29). The page keeps its dark background, gold accents and shared menu;
 * parch-wrap.js wraps each main content card in a .dc-frame (iron frame) and gives it
 * .dc-parch.dc-tall (parchment.css). Everything below only recolours what sits ON the parchment:
 * dark ink text, wooden hero tiles like the Siege Team panel, sunken wells for groups, and a
 * parchment chest popup. */
:root{--pk-ink:#3b2611;--pk-soft:#6b4a26;--pk-deep:#5a2f0c;--pk-acc:#7a3d0a;--pk-cream:#f3e2bd;--pk-cream2:#c9b48e;
  --pk-wood:linear-gradient(180deg,#4a3824,#2e2216);--pk-woodb:#2a1606;--pk-light:rgba(255,240,200,.32);--pk-line:rgba(90,55,20,.35)}


/* frame + parchment card */
.pframe{margin:0 0 16px;padding:8px}
.pframe.now{box-shadow:0 0 0 2px #e9c46a,0 0 22px rgba(233,196,106,.45),0 10px 30px rgba(0,0,0,.65),inset 0 1px 0 var(--dc-iron-hi)}
.pframe>.card.dc-parch{margin:0;border:0;border-radius:8px;padding:18px 16px 20px;color:var(--pk-ink);
  background:var(--dc-stains),var(--dc-grain),
    radial-gradient(ellipse at 30% 20%,var(--dc-paper-hi),transparent 60%),
    radial-gradient(ellipse at 80% 85%,rgba(150,105,55,.45),transparent 55%),
    linear-gradient(180deg,var(--dc-paper),var(--dc-paper-lo));
  background-size:600px 600px,260px 260px,100% 100%,100% 100%,100% 100%}
.two>.pframe{margin:0;display:flex}
.two>.pframe>.card{flex:1;min-width:0}
.two{margin-bottom:16px}

/* headings and text on the parchment */
.pframe .kicker{color:#8a4a0a}
.pframe .ttl h2,.pframe .card>h2{font-family:"Lilita One",system-ui,sans-serif;font-weight:400;letter-spacing:.4px;color:var(--pk-deep);font-size:21px}
.pframe .ttl .ru,.pframe .ttl .dates{color:var(--pk-soft)}
.pframe .ttl .dates b{color:var(--pk-acc)}
.pframe .sub{color:var(--pk-soft)}
.pframe .note,.pframe .need,.pframe .lead{color:var(--pk-soft)}
.pframe .need b,.pframe .lead b{color:var(--pk-acc)}
.pframe .note a,.pframe .lead a,.pframe a[style*="--gold"]{color:var(--pk-acc)!important;text-decoration:underline}
.pframe .pill.next{background:var(--pk-light);color:var(--pk-ink);border-color:var(--pk-line)}
.pframe .pill.now{box-shadow:0 0 0 1px #7a5a1a}

/* hero tiles: wooden slots, like the Siege Team hero list */
.pframe .tile{background:var(--pk-wood);border:1px solid var(--pk-woodb);box-shadow:inset 0 1px 0 rgba(255,220,160,.2),0 2px 4px rgba(40,20,5,.5);color:var(--pk-cream)}
.pframe .tile .pic{background:#120d08}
.pframe .tile .nm{color:var(--pk-cream)}
.pframe .tile .tag{white-space:normal;max-width:100%}
.pframe .tile .cr{color:var(--pk-cream2)}
.pframe .tile .how{color:#d9c49a}
.pframe .tile .how b{color:#ffd77a}
.pframe .tile.owned{box-shadow:0 0 0 2px #49b35a inset,0 2px 4px rgba(40,20,5,.5)}
.pframe .tile .own{background:rgba(20,12,4,.85);border-color:#6b4a26;color:#b9a27e}
.pframe .tile .own.on{background:linear-gradient(180deg,#86e59a,#49b35a);border-color:#49b35a;color:#08210e}

/* sunken wells for grouped info */
.pframe .bonus,.pframe details.rw,.pframe .itot,.pframe .automsg,.pframe .out .o,.pframe .rsum .s,.pframe .verdict.empty{background:rgba(80,50,20,.18);border:0;
  box-shadow:inset 0 2px 8px rgba(60,30,8,.5),inset 0 0 0 1px rgba(90,55,20,.35),0 1px 0 rgba(255,240,200,.35)}
.pframe .bonus .bk{color:var(--pk-acc)}
.pframe .bonus .bn{color:var(--pk-soft)}
.pframe .bh{background:var(--pk-wood);border:1px solid var(--pk-woodb);color:var(--pk-cream)}
.pframe .ladder span,.pframe .ranks span{background:var(--pk-light);border:1px solid var(--pk-line);color:var(--pk-ink)}
.pframe .ladder span b,.pframe .ranks span b{color:var(--pk-acc)}
.pframe .stats div{background:var(--pk-light);border:1px solid var(--pk-line);color:var(--pk-soft)}
.pframe .stats b{color:var(--pk-ink)}
.pframe .ab{color:var(--pk-ink)}
.pframe .ab b{color:var(--pk-deep)}
.pframe .ab img,.pframe .mini .it img{background:#3a2a18;border:1px solid #4a2e10}
.pframe .mini .it{background:var(--pk-wood);border:1px solid var(--pk-woodb);color:var(--pk-cream2)}
.pframe .mini .it b{color:var(--pk-cream)}
.pframe .bk .art,.pframe .runeic{background:#2e2216;border-color:#5b3814}
.pframe .runebox{background:var(--pk-wood);border-color:var(--pk-woodb);color:var(--pk-cream)}
.pframe .bd{border-color:rgba(90,55,20,.5);color:var(--pk-soft)}

/* "How sieges work" folds */
.pframe .how details{background:var(--pk-light);border:1px solid var(--pk-line)}
.pframe .how summary{color:var(--pk-ink)}
.pframe .how summary .chev{color:var(--pk-acc)}
.pframe .how ul{color:var(--pk-ink)}

/* rank-by-rank reward tables (rewards.css) */
.pframe details.rw>summary{color:var(--pk-ink)}
.pframe details.rw>summary .chev{color:var(--pk-acc)}
.pframe .vtabs button{color:#fbe9b8;background:linear-gradient(180deg,#8a5a2b,#5b3814 60%,#43280c);border:1px solid #2a1606;box-shadow:inset 0 1px 0 rgba(255,215,140,.4),0 2px 0 #24150a}
.pframe .vtabs button.on{color:#2a1606;background:linear-gradient(180deg,#fbe9b8,#e9c46a 55%,#b98a2e);border-color:#7a5a1a}
.pframe .rcol{background:var(--pk-light);border:1px solid var(--pk-line)}
.pframe .rcol h4{font-family:"Lilita One",system-ui,sans-serif;font-weight:400;color:var(--pk-deep);letter-spacing:.3px}
.pframe .rmed{color:var(--pk-soft)}
.pframe .ritem{border-top-color:var(--pk-line)}
.pframe .ritem>img,.pframe .ritem>.ph{background:#3a2a18;border-color:#4a2e10}
.pframe .ritem .rn{color:var(--pk-ink)}
.pframe .ritem .rs{color:var(--pk-soft)}
.pframe .rr dt{color:var(--pk-ink)}
.pframe .rr dd{color:var(--pk-acc)}
.pframe .rcur{border-top-color:var(--pk-line)}
.pframe .rcur h5,.pframe .rcur th{color:var(--pk-soft)}
.pframe .rcur th{border-bottom-color:var(--pk-line)}
.pframe .rcur td{color:var(--pk-ink);border-bottom-color:rgba(90,55,20,.2)}
.pframe .rcur td:first-child{color:var(--pk-deep)}
.pframe .rcur .dash{color:#9a7a52}
.pframe .rest,.pframe .rhint{color:var(--pk-soft)}
.pframe .hasc{outline-color:#8a5a1a}

/* chest contents popup (chest-tip.js): a parchment sheet in an iron border */
.ctip{color:var(--pk-ink);border:3px solid #2b2620;box-shadow:0 0 0 1px #0d0b09,0 14px 34px rgba(0,0,0,.65);
  background:var(--dc-stains),var(--dc-grain),radial-gradient(ellipse at 30% 20%,var(--dc-paper-hi),transparent 60%),linear-gradient(180deg,var(--dc-paper),var(--dc-paper-lo));
  background-size:600px 600px,260px 260px,100% 100%,100% 100%}
.ctip .cth{color:#fbe9b8;border-bottom:1px solid #2a1606;background:var(--dc-marble),linear-gradient(180deg,#7a4e22,#4e2f12);background-size:300px 120px,100% 100%;
  text-shadow:0 1px 0 #2a1606}
.ctip .cth b{font-family:"Lilita One",system-ui,sans-serif;font-weight:400;letter-spacing:.3px;font-size:15px}
.ctip .cth img{background:#2e2216}
.ctip .ctk{color:#e9d3a0}
.ctip .ctx{color:#fff;background:radial-gradient(circle at 50% 32%,#e86a52,#9a2314);border:2px solid #f2b0a2;font-weight:900}
.ctip .ctb h6{color:var(--pk-soft)}
.ctip .ctr b{color:var(--pk-acc)}
.ctip .ctg{border-top-color:var(--pk-line)}
.ctip .ctg em{color:var(--pk-soft)}
.ctip .ctd>summary{color:var(--pk-acc)}

/* jump bar: wooden buttons on the dark page, gold for the current one */
.jump a{color:#fbe9b8;background:linear-gradient(180deg,#8a5a2b,#5b3814 60%,#43280c);border:1px solid #2a1606;box-shadow:inset 0 1px 0 rgba(255,215,140,.4)}
.jump a.cur{color:#2a1606;background:linear-gradient(180deg,#fbe9b8,#e9c46a 55%,#b98a2e);border-color:#7a5a1a}

/* ===== Mines page ===== */
.pframe .card>h2{display:flex;align-items:center;gap:9px;margin:0 0 6px}
.pframe .card>h2 .pin{font-family:"Segoe UI",system-ui,sans-serif;letter-spacing:0}
.pframe .field label,.pframe .safetog,.pframe .crow .cn,.pframe .sgrp h3,.pframe .hidden-h{color:var(--pk-soft)}
.pframe .field select,.pframe .field input,.pframe .crow select,.pframe .crow input,.pframe .asghead .msel{background:#f6e7c4;color:#2a1606;border:1px solid #8a6436}
.pframe .psearch{background:#f6e7c4;border:1px solid #8a6436}
.pframe .psearch input{color:#2a1606}
.pframe .psearch input::placeholder{color:#8a6a46}
.pframe .out .o .k{color:var(--pk-soft)}
.pframe .out .o .v{color:var(--pk-ink)}
.pframe .out .o .v small{color:var(--pk-soft)}
.pframe .out .o.em .v{color:#1f7a2a}
.pframe .out .o.cost .v{color:#8a5a0a}
.pframe .tblwrap{border:1px solid rgba(90,55,20,.45);background:rgba(255,240,200,.2)}
.pframe .tbl th{background:#cdb07a;color:var(--pk-deep)}
.pframe .tbl td{color:var(--pk-ink);border-bottom-color:rgba(90,55,20,.22)}
.pframe .tbl tr:hover td{background:rgba(255,240,200,.4)}
.pframe .tbl .great td{background:rgba(60,140,60,.18)}
.pframe .tbl .great td:first-child,.pframe .rate.hi,.pframe .asghead .asgy,.pframe .itnone{color:#1f6b14}
.pframe .ul li{color:var(--pk-ink)}
.pframe .ul li b{color:var(--pk-acc)}
.pframe .slot{background:rgba(60,35,12,.22);border-color:#8a6436;color:var(--pk-soft)}
.pframe .slot .ph{color:#8a6436}
.pframe .slot.filled{background:#2e2216}
.pframe .verdict.good{background:rgba(50,120,50,.16);border:1px solid #3a7a3a;color:#1f4a1a}
.pframe .verdict.warn{background:rgba(180,120,30,.18);border:1px solid #8a6420;color:#4a2e08}
.pframe .verdict.empty{color:var(--pk-soft)}
.pframe .verdict b{color:var(--pk-ink)}
.pframe .pickmode{border-color:#2a1606}
.pframe .pickmode button{color:#fbe9b8;background:linear-gradient(180deg,#8a5a2b,#5b3814 60%,#43280c);border-left-color:#2a1606}
.pframe .pickmode button:hover{color:#fff}
.pframe .pickmode button.on{color:#2a1606;background:linear-gradient(180deg,#fbe9b8,#e9c46a 55%,#b98a2e)}
.pframe .herolist{border-radius:10px;padding:6px;background:rgba(80,50,20,.18);box-shadow:inset 0 2px 8px rgba(60,30,8,.5),inset 0 0 0 1px rgba(90,55,20,.35)}
.pframe .hcard,.pframe .schip{background:var(--pk-wood);border:1px solid var(--pk-woodb);color:var(--pk-cream)}
.pframe .hcard:hover,.pframe .schip:hover{background:linear-gradient(180deg,#5a4430,#36281a);border-color:#b98a2e}
.pframe .hcard .hn{color:var(--pk-cream)}
.pframe .addmine{color:#fbe9b8;background:linear-gradient(180deg,#8a5a2b,#5b3814 60%,#43280c);border:1px solid #2a1606;box-shadow:inset 0 1px 0 rgba(255,215,140,.4),0 2px 0 #24150a}
.pframe .addmine:hover{color:#fff;filter:brightness(1.1)}
.pframe .addmine.auto{color:#2a1606;background:linear-gradient(180deg,#fbe9b8,#e9c46a 55%,#b98a2e);border-color:#7a5a1a}
.pframe .addmine.save{color:#ffd0dd;background:linear-gradient(180deg,#7a3048,#4a1830 60%,#34101f);border-color:#2a0a14}
.pframe .addmine.save.dirty{color:#fff;box-shadow:0 0 12px rgba(255,107,154,.55),inset 0 1px 0 rgba(255,200,220,.4)}
.pframe .planstate{color:var(--pk-soft)}
.pframe .planstate b{color:#8a1f45}
.pframe .planstate button{color:var(--pk-acc)}
.pframe .ith{color:#8a4a0a}
.pframe .ith span{color:var(--pk-soft)}
.pframe .itbl th{color:var(--pk-soft);border-bottom-color:var(--pk-line)}
.pframe .itbl td{color:var(--pk-ink);border-bottom-color:rgba(90,55,20,.2)}
.pframe .itbl td.num:nth-child(2){color:#a8321c}
.pframe .automsg{color:var(--pk-ink)}
.pframe .asg{background:var(--pk-light);border:1px solid var(--pk-line)}
.pframe .asg.active{border-color:#b98a2e;box-shadow:0 0 0 1px #b98a2e inset,0 0 10px rgba(185,138,46,.35)}
.pframe .rtbl th{color:var(--pk-soft)}
.pframe .rtbl th,.pframe .rtbl td{border-bottom-color:rgba(90,55,20,.22)}
.pframe .rtbl td{color:var(--pk-ink)}
.pframe .imp{color:var(--pk-ink)}
.pframe .imp.red{color:#a8321c}
.pframe .imp.yellow{color:#7a5a0a}
.pframe .imp b{color:var(--pk-acc)}
.pframe .rsum .s .k{color:var(--pk-soft)}
.pframe .rsum .s .v{color:var(--pk-ink)}
.pframe .oppo{border-color:#2a1606}

@media(max-width:560px){
  .pframe{padding:6px;margin-bottom:12px}
  .pframe>.card.dc-parch{padding:16px 11px 18px}
  .pframe .ttl h2,.pframe .card>h2{font-size:19px}
}