/* Engraved brass, stepped frames and compass seals from the Mandate print set. */
:root{--brass:#c7ad75;--engraving:#b99a5b66}
button.primary,button.quiet,button.choice,button.role-option{position:relative;border-color:var(--engraving);transition:filter .18s,box-shadow .18s,transform .18s;box-shadow:inset 0 0 0 3px #101c2033,inset 0 0 0 4px #c6ac6d33}
button.primary{background:linear-gradient(115deg,#b49762,#dec995 48%,#b89b65);color:#172026;text-shadow:0 1px #fff3}
button.primary::before,button.quiet::before,button.choice::before,button.role-option::before{content:'';position:absolute;inset:5px;pointer-events:none;background:linear-gradient(var(--brass),var(--brass)) left top/9px 1px no-repeat,linear-gradient(var(--brass),var(--brass)) left top/1px 9px no-repeat,linear-gradient(var(--brass),var(--brass)) right bottom/9px 1px no-repeat,linear-gradient(var(--brass),var(--brass)) right bottom/1px 9px no-repeat;opacity:.7}
button.primary:hover,button.quiet:hover,button.choice:hover{filter:brightness(1.12);box-shadow:inset 0 0 0 3px #101c2033,0 0 18px #cfb37622}
button.primary:active,button.quiet:active{transform:translateY(1px)}
button:focus-visible{outline:2px solid #bfe7ec;outline-offset:4px}
dialog{border:1px solid var(--brass);padding:38px;background:radial-gradient(ellipse at 50% 0,#304345,#101d23 75%);box-shadow:0 30px 100px #000b,inset 0 0 0 6px #101c20,inset 0 0 0 7px var(--engraving);animation:ceremony-enter .4s ease-out}
dialog::after{content:'◆';position:absolute;left:50%;top:7px;transform:translateX(-50%);color:var(--brass);font-size:12px}
dialog .result{min-width:min(420px,65vw);padding:12px 20px 22px;text-align:center}
.result h1{font-size:clamp(32px,4vw,56px);margin:18px 0 10px;font-weight:400}
.result p{margin-bottom:28px;line-height:1.6;color:#b4c5c8}
.result>button{display:block;min-width:75%;margin:12px auto 0}
.mandate-seal{position:relative;display:grid;place-items:center;width:86px;height:86px;margin:0 auto 30px;border:1px solid var(--brass);border-radius:50%;font-family:Georgia,serif;font-size:46px;font-weight:400;color:#dfc991;box-shadow:inset 0 0 0 5px #14252a,inset 0 0 0 6px var(--engraving),0 0 35px #ddba7014}
.mandate-seal::before{content:'';position:absolute;inset:8px;border:1px solid var(--brass);transform:rotate(45deg)}
.mandate-seal::after{content:'◆';position:absolute;top:-19px;font-size:10px}
.campaign{margin:24px auto 48px;padding:32px 36px 38px;border:1px solid var(--engraving);background:radial-gradient(ellipse at 50% 0,#22353688,transparent 60%),#0e191ee8;box-shadow:inset 0 0 0 6px #0f1c20,inset 0 0 0 7px #b99a5b22;animation:ceremony-enter .35s ease-out}
.campaign-heading{text-align:center}.campaign-heading h1{font-weight:400;margin-bottom:24px}
.campaign-journey{display:flex;justify-content:center;margin:0 auto 26px;max-width:820px}
.campaign-journey>span{position:relative;flex:1;display:grid;justify-items:center;gap:9px;color:#809294}
.campaign-journey>span:not(:last-child)::after{content:'';height:1px;width:calc(100% - 36px);background:var(--engraving);position:absolute;left:calc(50% + 18px);top:16px}
.campaign-journey b{display:grid;place-items:center;width:32px;height:32px;border:1px solid #8e805555;font:16px Georgia,serif;transform:rotate(0deg)}
.campaign-journey small{font-size:11px}.campaign-journey .current{color:#ead6a5}.campaign-journey .current b{border-color:#dac18b;box-shadow:0 0 18px #dab56833;background:#ad8f4833}.campaign-journey .complete b{color:#c9ad70;border-color:#c9ad7077}
.campaign-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:0;background:#07141866;padding:18px 0;margin-bottom:28px}
.campaign-stats>span{display:grid;gap:6px;padding:0 20px;text-align:center}.campaign-stats>span+span{border-left:1px solid var(--engraving)}
.campaign-stats small{text-transform:uppercase;letter-spacing:.15em;font-size:10px;color:#92a8ac}.campaign-stats strong{font:19px Georgia,serif;color:#e0cfa9}.campaign-stats em{font-style:normal;font-size:11px;color:#9eafb0}
.campaign-outcome{padding:38px 24px;background:radial-gradient(ellipse,#cfad5e10,transparent 65%)}.campaign-outcome h2{font-size:34px;margin:14px 0}.campaign-outcome .primary{min-width:180px;margin-top:12px}
.campaign-ledger{border:1px solid var(--engraving);background:#12212799}.campaign-ledger summary{font:23px Georgia,serif}.campaign-ledger th{font-weight:400;color:#c0ac7a;letter-spacing:.08em;font-size:11px;text-transform:uppercase}.campaign-ledger .your-standing{background:#cfb77518;color:#f1ddb0}.rank-medal{display:grid;place-items:center;width:25px;height:25px;border:1px solid #bfa56b44;color:#d2ba83;font-family:Georgia,serif}.campaign-ledger tr:nth-child(4) td{border-bottom-color:#c7ac7566}.campaign-ledger td small{color:#bca878}
.role-option{font-family:Georgia,serif;font-size:21px;min-height:210px;text-shadow:0 2px 8px #000;transition:transform .25s,filter .25s}.role-option:hover{transform:translateY(-5px);filter:brightness(1.25)}
.draft-offer>div{position:relative;animation:offer-arrive .45s both;animation-delay:calc(var(--deal-index,0)*80ms)}
.campaign .card{transform-origin:center center;transition:transform .26s cubic-bezier(.2,.75,.2,1),filter .26s,box-shadow .26s}
@media(hover:hover){.campaign .card:hover,.campaign .card:focus-visible{position:relative;z-index:15;transform:translateY(-12px) scale(1.16);filter:brightness(1.04);box-shadow:0 18px 35px #0009}.campaign-pool .card:hover{transform:translateY(-15px) scale(1.32)}}
.match-preview{padding:22px;background:#20343755;border-block:1px solid var(--engraving)}.sticky-actions{z-index:20;box-shadow:0 -8px 25px #08141988,inset 0 0 0 4px #c7ad7511}.sticky-actions .primary{padding:16px 30px}
@keyframes ceremony-enter{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}
@keyframes offer-arrive{from{opacity:0;transform:translateY(20px) rotate(-2deg)}to{opacity:1;transform:none}}
@media(min-width:1050px){.campaign:is([data-phase=results],[data-phase=finished]){display:grid;grid-template-columns:.9fr 1.2fr;gap:0 30px}.campaign:is([data-phase=results],[data-phase=finished])>.campaign-heading,.campaign:is([data-phase=results],[data-phase=finished])>.campaign-journey,.campaign:is([data-phase=results],[data-phase=finished])>.campaign-stats{grid-column:1/-1}.campaign:is([data-phase=results],[data-phase=finished])>.campaign-journey{width:100%}.campaign:is([data-phase=results],[data-phase=finished])>.campaign-outcome{align-self:center}.campaign:is([data-phase=results],[data-phase=finished])>.campaign-ledger{margin-top:0}}
@media(max-width:700px){.campaign{margin:10px;padding:24px 16px}.campaign-stats>span{padding:0 7px}.campaign-stats strong{font-size:15px}.campaign-stats em{font-size:10px}.campaign-journey small{font-size:9px}.campaign-journey b{width:26px;height:26px}.campaign-journey>span:not(:last-child)::after{top:13px}.result>button{min-width:100%}dialog{padding:24px}.role-option{font-size:15px;min-height:155px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-delay:0ms!important;transition-duration:.01ms!important}}

.draft-offer>div:has(.card:hover),.draft-offer>div:has(.card:focus-visible),.campaign-pool>div:has(.card:hover){position:relative;z-index:16}
