/* The paper pages, PROFILE (a classified personnel file), ALLIANCE (the register of alliances, css/alliance.css) and
   HIGHSCORE (the arena's standings bulletin):
   a sheet of aged paper (assets/dossier/paper.webp, a Krea render: tools/gen_dossier.sh, tools/prep_dossier.py) on the
   hangar bay photo LOADOUT uses, typed in Courier Prime, marked top and bottom, with one worn rubber stamp. Kept plain
   so it reads: one ink, ruled rows, red only for marks. */
#pg-profil,#pg-ally,#pg-highscore,#pg-result{background:#121517 url(../assets/items/profile_bg.jpg) center/cover no-repeat}
.doc{--ink:#1c1d20;--ink2:#47433b;--rule:rgba(28,29,32,.16);--red:#a3221a;
  position:relative;max-width:860px;margin:0 auto;padding:22px 48px 26px;color:var(--ink);font:15px/1.5 'Courier Prime','Courier New',monospace;
  background:#eee8d9 url(../assets/dossier/paper.webp) center/cover;
  box-shadow:inset 0 0 40px rgba(120,100,60,.18),0 12px 28px rgba(0,0,0,.55),0 2px 4px rgba(0,0,0,.35);user-select:text;-webkit-user-select:text;container-type:inline-size}

.dMark{text-align:center;font-weight:700;font-size:13px;letter-spacing:6px;color:var(--red)}
.dMark:last-child{margin-top:26px}
.dTop{display:flex;justify-content:space-between;gap:16px;margin-top:14px;padding-bottom:10px;border-bottom:2px solid var(--ink);font-size:13px}
.dTop>div{display:flex;flex-direction:column}
.dTop b{font-weight:700;letter-spacing:1px}
.dTop span{color:var(--ink2)}
.dRef{text-align:right}.dRef b{color:var(--ink)}
.dTitle{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:18px 0 14px}
.dTitle h2{margin:0;font:700 28px/1.1 'Courier Prime','Courier New',monospace;letter-spacing:3px;text-transform:uppercase}

/* the rubber stamp: a red frame, a little rotated, the ink patchy where the stamp did not press */
.dStamp{flex:none;padding:3px 12px;transform:rotate(-7deg);font:24px/1 var(--f-head);letter-spacing:4px;color:var(--red);border:3px solid currentColor;border-radius:3px;opacity:.8;mix-blend-mode:multiply;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='60'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.6' numOctaves='3'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -2.4 1.8'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='60'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.6' numOctaves='3'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 -2.4 1.8'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

.dSec{display:flex;align-items:baseline;gap:12px;margin:24px 0 6px;font:700 15px/1.3 'Courier Prime','Courier New',monospace;letter-spacing:2px;text-transform:uppercase}
.dSec small{margin-left:auto;font-weight:400;font-size:13px;letter-spacing:0;text-transform:none;color:var(--ink2)}
.dSec em{font-style:normal;color:var(--red)}

/* ruled rows: label left, value right */
.dRow{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:4px 0;border-bottom:1px solid var(--rule)}
.dRow>span{color:var(--ink2)}
.dRow>b{font-weight:700;text-align:right;overflow-wrap:anywhere}
.dRow.hk>b{color:var(--red)}
.dRow .rkb{width:36px;height:18px;margin:0 6px 0 0;vertical-align:-4px}
.dName{font-size:18px;letter-spacing:1px}
.dRed{display:inline-block;width:12ch;height:1em;vertical-align:-2px;background:var(--ink)}

.dId{display:grid;grid-template-columns:230px minmax(0,1fr);gap:28px;align-items:start}
.dPhoto{margin:4px 0 0;padding:6px;background:#fbf9f3;box-shadow:0 1px 4px rgba(0,0,0,.3);transform:rotate(-1.5deg)}
.dPhoto .mimg{height:170px;border:0;background:#cfcabb}
.dPhoto img{filter:grayscale(1) contrast(1.15)}
.dProm{margin-top:10px}
.dProm>div{height:8px;border:1.5px solid var(--ink)}
.dProm i{display:block;height:100%;background:var(--ink)}
.dProm small{display:block;margin-top:4px;font-size:13px;color:var(--ink2)}

.dTwo,.dGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 40px}
.dLinks{display:flex;flex-wrap:wrap;gap:6px 22px;margin-top:12px}
.dLnk{padding:0;border:0;background:none;font:700 15px 'Courier Prime','Courier New',monospace;color:var(--red);cursor:pointer}
.dLnk:hover{text-decoration:underline}

.dLog{overflow-x:auto}
.dNote{margin:4px 0;color:var(--ink2)}
.dTbl{width:100%;border-collapse:collapse;font-size:14px}
.dTbl th{padding:4px 8px;text-align:left;font-weight:700;color:var(--ink2);border-bottom:2px solid var(--ink)}
.dTbl td{padding:4px 8px;white-space:nowrap;border-bottom:1px solid var(--rule)}
.dTbl th:first-child,.dTbl td:first-child{padding-left:0}.dTbl th:last-child,.dTbl td:last-child{padding-right:0}
.dTbl .n{text-align:right;font-variant-numeric:tabular-nums}
.dTbl td.dBad{color:var(--red);font-weight:700}
.dTbl tr.me td{font-weight:700;background:rgba(28,29,32,.05)}
.dTbl .rkb{width:32px;height:16px;margin:0 6px 0 0;vertical-align:-3px}
.dTbl .dLnk{color:var(--ink);font-weight:400}

.dAnnex summary{list-style:none;cursor:pointer}.dAnnex summary::-webkit-details-marker{display:none}
.dAnnex summary .dSec::after{content:' +';color:var(--ink2)}.dAnnex[open] summary .dSec::after{content:' −'}
.dForm{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;gap:12px 18px;align-items:end}
.dForm label{display:flex;flex-direction:column;gap:2px;font-size:13px;color:var(--ink2)}
.dForm input,.dForm select,.dForm textarea{padding:3px 2px;font:15px 'Courier Prime','Courier New',monospace;color:var(--ink);background:rgba(255,255,255,.35);border:0;border-bottom:1.5px solid var(--ink);border-radius:0;outline:none;user-select:text;-webkit-user-select:text}
.dForm textarea{padding:4px 6px;border:1.5px solid var(--ink);resize:vertical}
.dForm :is(input,select,textarea):focus{background:rgba(255,255,255,.7)}
.dBtn{padding:4px 14px;font:700 14px 'Courier Prime','Courier New',monospace;letter-spacing:2px;color:var(--ink);background:none;border:2px solid currentColor;cursor:pointer}
.dBtn:hover{background:rgba(28,29,32,.07)}
.dBtn.red{color:var(--red)}.dBtn.red:hover{background:rgba(163,34,26,.08)}
.dBtn.sm{padding:1px 8px;font-size:12px;letter-spacing:1px;border-width:1.5px}
.dMsg{grid-column:1/-1;color:var(--red)}
.dMsg:empty{display:none}

@media (max-width:700px){
  .doc{padding:16px 18px 20px;font-size:14px}
  .dTop{flex-direction:column;gap:6px}.dRef{text-align:left}
  .dTitle h2{font-size:21px;letter-spacing:2px}.dStamp{font-size:16px;letter-spacing:2px;padding:2px 8px}
  .dId,.dTwo,.dGrid,.dForm{grid-template-columns:1fr}
  .dPhoto{max-width:240px}
  .dTbl{font-size:13px}.dTbl th,.dTbl td{padding:4px 5px}
}
/* a narrow sheet (beside the alliance tablet): one column of rows */
@container (max-width:560px){.dGrid,.dTwo{grid-template-columns:1fr}}

/* HIGHSCORE: the arena's standings bulletin. Ink-filled buttons for the chosen order, the top three ranks inside the
   red seal (assets/dossier/seal.png), your row in bold, the sorted column underlined. */
.dBtn.on{color:#f3eee0;background:var(--ink)}
.hsCtl{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:12px 0 8px}.hsCtl .sp{flex:1}
.hsTbl th.srt{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.hsTbl td.rk{width:2.6em}
.hsTbl tr.top td.rk span{display:inline-grid;place-items:center;width:30px;height:30px;margin:-5px -4px -5px 0;background:url(../assets/dossier/seal.png) center/contain no-repeat;color:var(--red);font-weight:700;mix-blend-mode:multiply}
.hsTbl tr.gap td{text-align:center;color:var(--ink2);border-bottom:0}
.doc .aTag{cursor:pointer}.doc .aTag:hover{text-decoration:underline}
@container (max-width:560px){.hsTbl th:nth-child(3),.hsTbl td:nth-child(3),.hsTbl th:nth-child(5),.hsTbl td:nth-child(5){display:none}}

/* MISSION REPORT: the after-action report of a run, on the same paper. The outcome is the stamp (green ink when the loot
   got out, red when it was lost), the mech's photo pinned beside the spoils, then the rank it moved and the particulars. */
.doc.report{max-width:760px}
.dTitle small{display:block;margin-top:4px;font-size:13px;color:var(--ink2)}
.report .dStamp{font-size:30px;padding:4px 14px;color:#2b8a2b}
.report.bad .dStamp{color:var(--red)}
.repHead{display:grid;grid-template-columns:200px minmax(0,1fr);gap:28px;align-items:start}
.repHead:has(.dPhoto:empty){grid-template-columns:1fr}
.repHead .dPhoto:empty{display:none}
.repHead .dPhoto .mimg{height:150px}
.report.bad .dPhoto img{filter:grayscale(1) contrast(1.15) brightness(.7)}
.repTitle .sub{margin-top:4px;font-weight:700;letter-spacing:2px}
.report.bad .repTitle .sub{color:var(--red)}
.repBadges{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0 2px}.repBadges:empty{display:none}
.repBadge{padding:1px 8px;font-weight:700;font-size:12px;letter-spacing:2px;border:2px solid currentColor;transform:rotate(-2deg)}
.repBadge.bad{color:var(--red)}
.dRow em{margin-left:8px;font-style:normal;font-weight:400;font-size:12px;color:var(--ink2)}
.dRow.lost>b{color:var(--red)}
.repRk{display:flex;align-items:center;gap:10px;margin-top:10px}
.repRk .dProm{flex:1;margin:0}
.repRk .rkb{width:44px;height:22px;margin:0}
.report .rlines>div{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:4px 0;border-bottom:1px solid var(--rule)}
.report .rlines span{color:var(--ink2)}
.report .rlines b{font-weight:700;text-align:right}.report .rlines b.lost{color:var(--red)}
.report .btnrow{margin-top:22px}
.report .dBtn{padding:6px 18px}
.report .dBtn:disabled{opacity:.45;cursor:default}
@media (max-width:700px){.repHead{grid-template-columns:1fr;gap:6px}.repHead .dPhoto{max-width:200px}.report .dStamp{font-size:20px}}