
/* 1.0.0-beta.5.7.2 — special encounters */
:root{--encounter-accent:#c08fe4;--encounter-rose:#d66c92;--encounter-gold:#d7b371}
.roster-switch [data-roster-view="encounters"]{position:relative;overflow:hidden}
.roster-switch [data-roster-view="encounters"]::after{content:"";position:absolute;left:22%;right:22%;bottom:3px;height:1px;background:linear-gradient(90deg,transparent,var(--encounter-accent),transparent);opacity:.25;transition:.25s ease}
.roster-switch [data-roster-view="encounters"].active::after{opacity:1;box-shadow:0 0 12px var(--encounter-accent)}
#specialEncounterPane{position:relative;isolation:isolate}
#specialEncounterPane::before{content:"";position:absolute;inset:-18px -12px auto;height:240px;z-index:-1;pointer-events:none;background:radial-gradient(circle at 75% 15%,rgba(192,143,228,.1),transparent 37%),radial-gradient(circle at 18% 10%,rgba(214,108,146,.075),transparent 34%)}
.special-encounter-intro{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:center;margin:0 0 14px;padding:18px 20px;border:1px solid rgba(192,143,228,.22);border-radius:20px;background:linear-gradient(145deg,rgba(37,27,45,.82),rgba(15,13,21,.92));box-shadow:inset 0 0 0 1px rgba(255,255,255,.018),0 14px 32px rgba(0,0,0,.19)}
.special-encounter-intro h4{margin:3px 0 6px;font:600 26px/1.05 Georgia,serif}.special-encounter-intro p{margin:0;max-width:720px;color:var(--muted);line-height:1.55}.special-encounter-intro-seal{width:74px;height:74px;display:grid;place-items:center;border:1px solid rgba(214,108,146,.44);border-radius:50%;background:radial-gradient(circle,rgba(214,108,146,.19),rgba(16,13,21,.9) 64%);color:#ffd3e2;font:34px/1 Georgia,serif;box-shadow:0 0 0 8px rgba(192,143,228,.035),0 0 30px rgba(214,108,146,.12);animation:specialSeal540 5.4s ease-in-out infinite}
@keyframes specialSeal540{0%,100%{transform:rotate(-2deg) scale(.98)}50%{transform:rotate(3deg) scale(1.035);filter:brightness(1.13)}}
.special-encounter-controls{display:grid;grid-template-columns:minmax(190px,1fr) 170px 170px auto;gap:9px;margin-bottom:14px}
.special-encounter-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:15px}
.special-encounter-card{--enc:#c08fe4;position:relative;min-height:410px;overflow:hidden;display:flex;flex-direction:column;border:1px solid color-mix(in srgb,var(--enc) 31%,var(--line));border-radius:21px;background:radial-gradient(circle at var(--mx,72%) var(--my,22%),color-mix(in srgb,var(--enc) 10%,transparent),transparent 39%),linear-gradient(180deg,rgba(35,28,42,.94),rgba(12,11,17,.98));box-shadow:0 18px 43px rgba(0,0,0,.23);transition:transform .3s cubic-bezier(.2,.8,.2,1),border-color .28s ease,box-shadow .28s ease;cursor:pointer}
.special-encounter-card:hover{transform:translateY(-5px);border-color:color-mix(in srgb,var(--enc) 62%,var(--line));box-shadow:0 22px 50px rgba(0,0,0,.3),0 0 28px color-mix(in srgb,var(--enc) 12%,transparent)}
.special-encounter-card::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 25%,rgba(255,255,255,.032) 45%,transparent 63%);transform:translateX(-130%);transition:transform .8s ease}.special-encounter-card:hover::after{transform:translateX(130%)}
.special-encounter-visual{position:relative;height:255px;display:grid;place-items:end center;overflow:hidden;background:radial-gradient(ellipse at 50% 78%,color-mix(in srgb,var(--enc) 21%,transparent),transparent 50%),linear-gradient(180deg,rgba(255,255,255,.022),transparent)}
.special-encounter-visual::before{content:"";position:absolute;inset:18px 14px 12px;border:1px solid color-mix(in srgb,var(--enc) 19%,transparent);border-radius:50% 50% 38% 38%;clip-path:polygon(0 0,100% 0,100% 70%,0 70%);opacity:.55}
.special-encounter-visual svg{position:relative;z-index:1;width:92%;height:96%;overflow:visible;filter:drop-shadow(0 18px 17px rgba(0,0,0,.7)) drop-shadow(0 0 17px color-mix(in srgb,var(--enc) 13%,transparent));transition:transform .45s cubic-bezier(.2,.8,.2,1),filter .35s ease}
.special-encounter-card:hover .special-encounter-visual svg{transform:translateY(-4px) scale(1.025);filter:drop-shadow(0 20px 18px rgba(0,0,0,.72)) drop-shadow(0 0 24px color-mix(in srgb,var(--enc) 24%,transparent))}
.special-encounter-card.is-shadow .special-encounter-visual svg{animation:specialBreath540 6.2s ease-in-out infinite}
@keyframes specialBreath540{0%,100%{transform:translateY(2px) scale(.995)}50%{transform:translateY(-5px) scale(1.012)}}
.special-encounter-number,.special-encounter-state{position:absolute;z-index:3;top:11px;padding:5px 8px;border:1px solid rgba(255,255,255,.11);border-radius:999px;background:rgba(8,7,12,.72);backdrop-filter:blur(7px);font-size:9px;text-transform:uppercase;letter-spacing:.11em;color:#cbc0d2}.special-encounter-number{left:11px}.special-encounter-state{right:11px}.special-encounter-state.met{color:#d9f1dc;border-color:rgba(113,169,123,.32)}.special-encounter-state.rumored{color:#f1d5a4;border-color:rgba(215,179,113,.3)}
.special-encounter-body{position:relative;z-index:2;display:flex;flex:1;flex-direction:column;padding:15px}.special-encounter-kicker{color:color-mix(in srgb,var(--enc) 72%,#fff);font-size:10px;text-transform:uppercase;letter-spacing:.13em}.special-encounter-body h4{margin:6px 0 7px;font:600 23px/1.08 Georgia,serif}.special-encounter-body p{margin:0;color:var(--muted);line-height:1.48;font-size:12px}.special-encounter-meta{display:flex;gap:6px;flex-wrap:wrap;margin-top:auto;padding-top:13px}.special-encounter-meta span{padding:5px 7px;border:1px solid rgba(255,255,255,.065);border-radius:999px;background:rgba(255,255,255,.025);color:#cfc5d1;font-size:9px}.special-encounter-actions{display:flex;gap:7px;margin-top:12px}.special-encounter-actions .btn{flex:1}
.special-encounter-empty{grid-column:1/-1;min-height:330px;display:grid;place-items:center;text-align:center;padding:30px;border:1px dashed rgba(192,143,228,.26);border-radius:22px;background:radial-gradient(circle,rgba(192,143,228,.075),transparent 58%);color:var(--muted)}.special-encounter-empty b{display:block;margin:0 auto 12px;color:#dcb7f2;font:54px Georgia,serif;text-shadow:0 0 24px rgba(192,143,228,.28)}.special-encounter-empty h4{margin:0 0 8px;color:var(--ink);font:600 24px Georgia,serif}.special-encounter-empty p{max-width:500px;margin:0 auto 16px;line-height:1.55}
.special-encounter-svg .special-ink{fill:#08070b;stroke:rgba(221,186,123,.38);stroke-width:1.45;vector-effect:non-scaling-stroke}.special-encounter-svg .special-ink-soft{fill:#15101b;stroke:rgba(192,143,228,.28);stroke-width:1.1;vector-effect:non-scaling-stroke}.special-encounter-svg .special-rim{fill:none;stroke:rgba(226,190,127,.19);stroke-width:2.2;vector-effect:non-scaling-stroke}.special-encounter-svg .special-rune{fill:none;stroke:currentColor;stroke-opacity:.14;stroke-width:1.2;vector-effect:non-scaling-stroke}.special-encounter-svg .special-ground{fill:none;stroke:currentColor;stroke-opacity:.2;stroke-width:1;vector-effect:non-scaling-stroke}
.special-encounter-detail{display:grid;grid-template-columns:minmax(280px,.85fr) minmax(0,1.15fr);min-height:560px}.special-encounter-detail-art{--enc:#c08fe4;position:relative;min-height:560px;display:grid;place-items:end center;overflow:hidden;background:radial-gradient(circle at 50% 62%,color-mix(in srgb,var(--enc) 18%,transparent),transparent 48%),linear-gradient(155deg,rgba(32,24,39,.96),rgba(9,8,13,.98))}.special-encounter-detail-art::after{content:"";position:absolute;inset:22px;border:1px solid color-mix(in srgb,var(--enc) 20%,transparent);border-radius:50% 50% 20px 20px;pointer-events:none}.special-encounter-detail-art svg{position:relative;z-index:1;width:94%;height:94%;filter:drop-shadow(0 28px 25px rgba(0,0,0,.72)) drop-shadow(0 0 28px color-mix(in srgb,var(--enc) 15%,transparent))}.special-encounter-detail-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.special-encounter-detail-copy{padding:28px;overflow:auto}.special-encounter-detail-copy h2{margin:7px 0 8px;font:600 clamp(34px,5vw,50px)/.98 Georgia,serif}.special-encounter-detail-copy .subtitle{font-size:14px}.special-encounter-detail-copy .special-detail-text{margin:20px 0;color:#c6bac4;line-height:1.72}.special-detail-facts{display:grid;gap:8px;margin:18px 0}.special-detail-fact{display:grid;grid-template-columns:130px minmax(0,1fr);gap:12px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.055)}.special-detail-fact span{color:var(--gold);font-size:11px;text-transform:uppercase;letter-spacing:.08em}.special-detail-fact strong{font-weight:500}.special-detail-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:22px}
#specialEncounterFormModal .modal{width:min(940px,100%);max-height:calc(100dvh - 34px);display:flex;flex-direction:column}#specialEncounterFormModal .modal-body{min-height:0;overflow:auto;overscroll-behavior:contain}#specialEncounterFormModal .modal-foot{flex:0 0 auto}.special-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.special-form-grid .full{grid-column:1/-1}.special-variant-picker{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.special-variant-option{--enc:#c08fe4;position:relative;min-height:182px;padding:0;border:1px solid color-mix(in srgb,var(--enc) 25%,var(--line));border-radius:16px;background:radial-gradient(circle at 50% 70%,color-mix(in srgb,var(--enc) 14%,transparent),transparent 48%),rgba(255,255,255,.018);overflow:hidden;color:var(--enc)}.special-variant-option svg{width:100%;height:165px;display:block;filter:drop-shadow(0 12px 12px rgba(0,0,0,.6))}.special-variant-option span{position:absolute;left:8px;right:8px;bottom:7px;padding:4px;border-radius:9px;background:rgba(8,7,12,.76);font-size:9px;text-transform:uppercase;letter-spacing:.1em;color:#d4cad6}.special-variant-option.active{border-color:color-mix(in srgb,var(--enc) 75%,#fff);box-shadow:0 0 0 2px color-mix(in srgb,var(--enc) 13%,transparent),0 0 24px color-mix(in srgb,var(--enc) 18%,transparent)}.special-form-hint{color:var(--muted);font-size:11px;line-height:1.45}.special-form-toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:8px}.special-form-toolbar .special-selected-variant{color:#e7d8eb;font-size:11px}
body.mobile-layout .roster-switch{grid-template-columns:repeat(3,minmax(0,1fr))!important;overflow:visible!important}body.mobile-layout .roster-switch button{min-width:0!important;padding-inline:6px!important;font-size:10px!important;white-space:normal!important;line-height:1.15!important}body.mobile-layout .roster-switch button span{display:block;margin:3px auto 0!important}
@media(max-width:920px){.special-encounter-controls{grid-template-columns:1fr 1fr}.special-encounter-controls .field:first-child{grid-column:1/-1}.special-encounter-detail{grid-template-columns:1fr}.special-encounter-detail-art{min-height:420px}.special-encounter-detail-copy{overflow:visible}.special-form-grid{grid-template-columns:1fr}.special-form-grid .full{grid-column:auto}}
@media(max-width:760px){.special-encounter-intro{grid-template-columns:1fr;padding:15px}.special-encounter-intro-seal{position:absolute;right:13px;top:13px;width:52px;height:52px;font-size:25px;opacity:.75}.special-encounter-intro h4{padding-right:58px;font-size:22px}.special-encounter-controls{grid-template-columns:1fr}.special-encounter-controls .field:first-child{grid-column:auto}.special-encounter-grid{grid-template-columns:1fr;gap:12px}.special-encounter-card{min-height:380px}.special-encounter-visual{height:238px}.special-encounter-card:hover{transform:none}.special-encounter-card.is-shadow .special-encounter-visual svg{animation:none}.special-encounter-detail{display:flex;flex-direction:column;min-height:0}.special-encounter-detail-art{min-height:330px;height:42vh;max-height:410px;flex:0 0 auto}.special-encounter-detail-copy{padding:20px 17px 28px}.special-detail-fact{grid-template-columns:1fr;gap:4px}.special-detail-actions{position:sticky;bottom:-1px;z-index:4;margin-inline:-7px;padding:10px 7px calc(8px + env(safe-area-inset-bottom));background:linear-gradient(180deg,transparent,rgba(18,15,23,.96) 26%)}#specialEncounterDetailModal.modal-backdrop.open,#specialEncounterFormModal.modal-backdrop.open{padding:0!important;align-items:stretch!important}#specialEncounterDetailModal .modal,#specialEncounterFormModal .modal{width:100%!important;max-width:none!important;height:100dvh!important;max-height:100dvh!important;margin:0!important;border-radius:0!important;border-left:0!important;border-right:0!important;display:flex!important;flex-direction:column!important}#specialEncounterDetailModal .modal-body,#specialEncounterFormModal .modal-body{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important;overscroll-behavior:contain!important;padding-bottom:calc(24px + env(safe-area-inset-bottom))!important}#specialEncounterDetailModal .modal-head,#specialEncounterFormModal .modal-head{flex:0 0 auto;padding-top:calc(14px + env(safe-area-inset-top))}.special-variant-picker{grid-template-columns:repeat(2,minmax(0,1fr))}.special-variant-option{min-height:174px}.special-variant-option svg{height:158px}.special-encounter-actions .btn{min-height:42px}}
@media(prefers-reduced-motion:reduce){.special-encounter-intro-seal,.special-encounter-card.is-shadow .special-encounter-visual svg{animation:none!important}.special-encounter-card,.special-encounter-visual svg{transition:none!important}}
#specialEncounterFormModal form{display:flex;flex:1 1 auto;min-height:0;flex-direction:column}#specialEncounterFormModal form>.modal-body{flex:1 1 auto;min-height:0}#specialEncounterFormModal form>.modal-foot{flex:0 0 auto}


/* beta 5.4.2 — all 24 silhouettes normalised, sharper and optically centred */
.special-encounter-visual .special-encounter-art540,
.special-encounter-detail-art .special-encounter-art540,
.special-variant-option .special-encounter-art540{
  --art-scale:1.05;--art-y:-1%;
  position:relative!important;z-index:1!important;display:block!important;
  width:100%!important;height:100%!important;object-fit:contain!important;object-position:center center!important;
  pointer-events:none!important;user-select:none!important;
  filter:brightness(1.95) contrast(1.18) saturate(.88) drop-shadow(0 20px 18px rgba(0,0,0,.78)) drop-shadow(0 0 15px color-mix(in srgb,var(--enc) 40%,transparent))!important;
  transform:translateY(var(--art-y)) scale(var(--art-scale)) translateZ(0)!important;
  transform-origin:50% 52%!important;
  transition:transform .45s cubic-bezier(.2,.8,.2,1),filter .35s ease!important;
}
/* The second approved concept sheet had much more empty canvas. These rules normalise every one of those variants. */
.special-var-4,.special-var-5,.special-var-6,.special-var-7,.special-var-8{--art-scale:1.26;--art-y:-4%}
.special-cat-couple.special-var-1,.special-cat-couple.special-var-2,.special-cat-couple.special-var-3{--art-scale:1.08;--art-y:-3%}
.special-cat-couple.special-var-4,.special-cat-couple.special-var-5,.special-cat-couple.special-var-6,.special-cat-couple.special-var-7,.special-cat-couple.special-var-8{--art-scale:1.32;--art-y:-5%}
.special-cat-female.special-var-4,.special-cat-female.special-var-5,.special-cat-female.special-var-6,.special-cat-female.special-var-7,.special-cat-female.special-var-8{--art-scale:1.28;--art-y:-4%}
.special-encounter-visual::after,.special-encounter-detail-art::before,.special-variant-option::before{
  content:"";position:absolute;z-index:0;inset:7% 8% 2%;pointer-events:none;border-radius:50%;
  background:radial-gradient(ellipse at 50% 58%,color-mix(in srgb,var(--enc) 25%,transparent),color-mix(in srgb,var(--enc) 7%,transparent) 42%,transparent 72%);
  filter:blur(6px);opacity:.86;
}
.special-encounter-card:hover .special-encounter-art540{transform:translateY(calc(var(--art-y) - 5px)) scale(calc(var(--art-scale) * 1.025))!important;filter:brightness(2.08) contrast(1.2) saturate(.9) drop-shadow(0 23px 20px rgba(0,0,0,.8)) drop-shadow(0 0 22px color-mix(in srgb,var(--enc) 48%,transparent))!important}
.special-encounter-card.is-shadow .special-encounter-art540{animation:specialArtBreath542 6.2s ease-in-out infinite}
@keyframes specialArtBreath542{0%,100%{transform:translateY(var(--art-y)) scale(calc(var(--art-scale) * .995))}50%{transform:translateY(calc(var(--art-y) - 5px)) scale(calc(var(--art-scale) * 1.012))}}
.special-encounter-detail-art .special-encounter-art540{width:96%!important;height:96%!important;max-width:720px!important}
.special-encounter-detail-art .special-var-4,.special-encounter-detail-art .special-var-5,.special-encounter-detail-art .special-var-6,.special-encounter-detail-art .special-var-7,.special-encounter-detail-art .special-var-8{--art-scale:1.18;--art-y:-4%}
.special-encounter-detail-art .special-cat-couple.special-var-4,.special-encounter-detail-art .special-cat-couple.special-var-5,.special-encounter-detail-art .special-cat-couple.special-var-6,.special-encounter-detail-art .special-cat-couple.special-var-7,.special-encounter-detail-art .special-cat-couple.special-var-8{--art-scale:1.22;--art-y:-5%}
.special-variant-option .special-encounter-art540{height:165px!important;width:100%!important;padding:5px 3px 13px!important;box-sizing:border-box!important;filter:brightness(2.08) contrast(1.2) saturate(.9) drop-shadow(0 10px 10px rgba(0,0,0,.72)) drop-shadow(0 0 11px color-mix(in srgb,var(--enc) 38%,transparent))!important}
.special-variant-option .special-var-4,.special-variant-option .special-var-5,.special-variant-option .special-var-6,.special-variant-option .special-var-7,.special-variant-option .special-var-8{--art-scale:1.20;--art-y:-4%}
.special-variant-option .special-cat-couple.special-var-4,.special-variant-option .special-cat-couple.special-var-5,.special-variant-option .special-cat-couple.special-var-6,.special-variant-option .special-cat-couple.special-var-7,.special-variant-option .special-cat-couple.special-var-8{--art-scale:1.24;--art-y:-5%}
.special-variant-option{isolation:isolate}.special-variant-option span{z-index:3}.special-variant-option::before{inset:13% 8% 12%;opacity:.7}
body.mobile-layout.mobile-tools-open .mobile-bottom-nav,
body.mobile-layout.mobile-tools-open .tabs{
  opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:translateY(calc(100% + env(safe-area-inset-bottom)))!important;transition:opacity .18s ease,transform .22s ease,visibility 0s linear .22s!important;
}
body.mobile-layout:not(.mobile-tools-open) .mobile-bottom-nav,
body.mobile-layout:not(.mobile-tools-open) .tabs{transition:opacity .18s ease,transform .22s ease!important}
@media(max-width:760px){
 .special-encounter-visual .special-encounter-art540{filter:brightness(2.08) contrast(1.2) saturate(.88) drop-shadow(0 15px 13px rgba(0,0,0,.76)) drop-shadow(0 0 17px color-mix(in srgb,var(--enc) 44%,transparent))!important}
 .special-variant-option .special-encounter-art540{height:158px!important;padding-bottom:15px!important}
 .special-encounter-detail-art .special-encounter-art540{height:98%!important;width:98%!important}
}


