:root{
  --bg:#100d0a;
  --bg-2:#17120d;
  --panel:#211912;
  --panel-2:#2b2117;
  --paper:#f2e4c8;
  --paper-2:#dfcda9;
  --muted:#b9ab91;
  --line:rgba(242,228,200,.17);
  --gold:#c28b2c;
  --gold-2:#e2b85a;
  --green:#6f8e45;
  --green-dark:#304329;
  --danger:#b45a3c;
  --shadow:0 22px 70px rgba(0,0,0,.35);
  --radius:22px;
  --max:1160px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:radial-gradient(circle at 18% -10%,rgba(194,139,44,.18),transparent 34%),radial-gradient(circle at 90% 0,rgba(111,142,69,.14),transparent 30%),var(--bg);
  color:var(--paper);
  font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans TC","Microsoft JhengHei",sans-serif;
  line-height:1.75;
  letter-spacing:.02em;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{width:min(var(--max),calc(100% - 36px));margin-inline:auto}
.skip-link{position:absolute;left:-999px;top:10px;background:var(--gold);color:#160f08;padding:8px 12px;border-radius:10px;z-index:999}
.skip-link:focus{left:10px}
.site-header{
  position:sticky;top:0;z-index:50;
  backdrop-filter:blur(18px);
  background:rgba(16,13,10,.82);
  border-bottom:1px solid var(--line);
}
.nav-wrap{height:76px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.brand{display:flex;align-items:center;gap:12px;min-width:0}
.brand-logo{width:46px;height:46px;object-fit:contain;border-radius:50%;background:rgba(255,255,255,.04)}
.brand-title{display:block;font-weight:800;white-space:nowrap;letter-spacing:.05em}
.brand-subtitle{display:block;font-size:12px;color:var(--muted);text-transform:lowercase;letter-spacing:.12em}
.site-nav{display:flex;align-items:center;gap:6px;font-size:14px}
.site-nav a{padding:9px 10px;border-radius:999px;color:var(--paper-2)}
.site-nav a:hover,.site-nav a[aria-current="page"]{background:rgba(226,184,90,.12);color:#fff}
.nav-cta,.btn.primary{background:linear-gradient(135deg,var(--gold-2),var(--gold));color:#1a1008!important;box-shadow:0 12px 30px rgba(194,139,44,.23)}
.nav-toggle{display:none;background:transparent;border:1px solid var(--line);border-radius:12px;width:44px;height:40px;position:relative}
.nav-toggle span,.nav-toggle:before,.nav-toggle:after{content:"";position:absolute;left:11px;right:11px;height:2px;background:var(--paper);transition:.2s}
.nav-toggle span{top:19px}.nav-toggle:before{top:12px}.nav-toggle:after{top:26px}
.nav-open .nav-toggle span{opacity:0}.nav-open .nav-toggle:before{top:19px;transform:rotate(45deg)}.nav-open .nav-toggle:after{top:19px;transform:rotate(-45deg)}
.hero{
  min-height:calc(100vh - 76px);
  display:grid;align-items:center;
  padding:54px 0 70px;
  position:relative;overflow:hidden;
  border-bottom:1px solid var(--line);
}
.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(16,13,10,.92),rgba(16,13,10,.72),rgba(16,13,10,.92)),var(--hero-img,none);background-size:cover;background-position:center;opacity:.95;z-index:-2}
.hero:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 30%,transparent,rgba(0,0,0,.45) 70%);z-index:-1}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:46px;align-items:center}
.eyebrow,.section-kicker{display:inline-block;color:var(--gold-2);font-weight:800;font-size:13px;letter-spacing:.18em;text-transform:uppercase;margin-bottom:12px}
h1,h2,h3{line-height:1.22;margin:0 0 14px;font-family:Georgia,"Noto Serif TC",serif}
h1{font-size:clamp(42px,7vw,86px);letter-spacing:.08em;text-shadow:0 8px 34px rgba(0,0,0,.55)}
.guild-title span{display:inline-block;white-space:nowrap}
.inactive-title span{display:inline-block;white-space:nowrap}
h2{font-size:clamp(30px,4vw,48px);letter-spacing:.04em}
h3{font-size:24px}.lead{font-size:clamp(17px,2.2vw,22px);color:var(--paper-2);max-width:720px}.subtle{color:var(--muted)}
.text-gold{color:var(--gold-2)}.text-green{color:#9cc86f}.text-blue{color:#9ec7ff}.text-red{color:#e56f58}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid rgba(242,228,200,.24);background:rgba(255,255,255,.05);color:var(--paper);padding:11px 18px;border-radius:999px;font-weight:800;cursor:pointer;transition:.18s;min-height:44px}
.btn-icon{display:inline-grid;place-items:center;width:28px;height:22px;border-radius:6px;color:#fff;font-size:11px;line-height:1;letter-spacing:0}
.youtube-icon{background:#d92525}.discord-icon{background:#5865f2}
.btn:hover{transform:translateY(-1px);border-color:rgba(226,184,90,.55);background:rgba(226,184,90,.12)}
.btn.small{font-size:14px;min-height:38px;padding:8px 13px}.btn.block{width:100%}
.hero-card{background:linear-gradient(180deg,rgba(43,33,23,.86),rgba(22,17,12,.88));border:1px solid var(--line);border-radius:32px;box-shadow:var(--shadow);padding:24px;position:relative;overflow:hidden}
.hero-card:before{content:"";position:absolute;inset:14px;border:1px solid rgba(226,184,90,.16);border-radius:24px;pointer-events:none}
.hero-logo{width:min(360px,72vw);margin:0 auto 18px;filter:drop-shadow(0 24px 40px rgba(0,0,0,.45))}
.motto{display:grid;grid-template-columns:1fr 1fr;gap:7px 14px;text-align:center;font-weight:900;color:#f8e6b7;font-size:18px;letter-spacing:.08em;padding:12px 8px 0}
.section{padding:76px 0;border-bottom:1px solid var(--line)}
.section.compact{padding:50px 0}.section-head{margin-bottom:28px}.section-head.center{text-align:center}.section-head.center .lead{margin-inline:auto}
.grid{display:grid;gap:20px}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.card{background:linear-gradient(180deg,rgba(43,33,23,.82),rgba(31,24,17,.82));border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:0 14px 44px rgba(0,0,0,.2)}
.card.pad{padding:24px}.card.clickable{transition:.18s}.card.clickable:hover{transform:translateY(-3px);border-color:rgba(226,184,90,.45)}
.card-img{aspect-ratio:16/9;object-fit:cover;width:100%;background:#241a11}.card-img.tall{aspect-ratio:4/3}.card-body{padding:20px}.card .meta{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:11px;color:var(--gold-2);font-size:13px;font-weight:800}.tag{display:inline-flex;border:1px solid rgba(226,184,90,.28);background:rgba(226,184,90,.10);border-radius:999px;padding:4px 9px;font-size:12px;color:var(--gold-2);font-weight:800}
.dark-band{background:linear-gradient(135deg,rgba(194,139,44,.13),rgba(111,142,69,.09));border-block:1px solid var(--line)}
.two-col{display:grid;grid-template-columns:.9fr 1.1fr;gap:34px;align-items:start}
.quote-poem{font-size:21px;font-weight:900;letter-spacing:.16em;text-align:center;line-height:2.1;color:#f8e9c7}.quote-poem span{display:block}
.music-box{border:1px dashed rgba(226,184,90,.42);border-radius:var(--radius);padding:24px;background:rgba(0,0,0,.16);text-align:center;color:var(--paper-2)}
.news-list{display:grid;gap:18px}.news-item{display:grid;grid-template-columns:180px 1fr;gap:18px;align-items:center;padding:14px;border:1px solid var(--line);border-radius:var(--radius);background:rgba(255,255,255,.035)}
.news-item img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:16px;background:#241a11}
.footer{padding:44px 0;background:#0b0907;color:var(--muted)}.footer-grid{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:start}.footer-links{display:flex;flex-wrap:wrap;gap:10px}.footer-links a{color:var(--paper-2);padding:6px 8px}.legal{font-size:13px;max-width:800px;margin-top:18px;color:#978b78}
.page-hero{padding:70px 0 42px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,rgba(194,139,44,.11),transparent)}.page-title{max-width:850px}.breadcrumb{color:var(--muted);font-size:14px;margin-bottom:10px}.breadcrumb a{color:var(--gold-2)}
.article{max-width:880px;margin:auto}.article p{font-size:18px;color:var(--paper-2)}.article .big-lines p{margin:0 0 16px}.list-check{padding-left:0;list-style:none}.list-check li{margin:10px 0;padding-left:28px;position:relative}.list-check li:before{content:"✦";position:absolute;left:0;color:var(--gold-2)}
.subpage-tabs{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}.subpage-tabs a{display:inline-flex;align-items:center;min-height:38px;padding:8px 14px;border:1px solid var(--line);border-radius:999px;color:var(--paper-2);font-weight:800}.subpage-tabs a:hover,.subpage-tabs a[aria-current="page"]{border-color:rgba(226,184,90,.55);background:rgba(226,184,90,.12);color:#fff}
.quick-link-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0 0 34px}.mini-panel{display:block;padding:18px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.035);transition:.18s}.mini-panel:hover{transform:translateY(-2px);border-color:rgba(226,184,90,.45);background:rgba(226,184,90,.08)}.mini-panel h2{font-size:22px;margin-bottom:8px}.mini-panel p{font-size:15px;margin:0;color:var(--paper-2)}
.toc-panel{display:flex;flex-wrap:wrap;gap:10px;padding:16px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.035)}.toc-panel a{display:inline-flex;align-items:center;min-height:36px;padding:7px 12px;border:1px solid rgba(242,228,200,.18);border-radius:999px;color:var(--paper-2);font-weight:800}.toc-panel a:hover{border-color:rgba(226,184,90,.55);background:rgba(226,184,90,.12);color:#fff}.info-details{display:grid;gap:14px;margin-top:26px}.span-all{grid-column:1/-1}.summary-icon{display:inline-grid;place-items:center;width:30px;height:30px;margin-right:8px;border-radius:8px;background:rgba(226,184,90,.14);font-size:17px;vertical-align:middle;overflow:hidden}.summary-icon img{width:30px;height:30px;object-fit:contain;filter:drop-shadow(0 3px 4px rgba(0,0,0,.35))}.summary-icon.multi{grid-template-columns:repeat(3,1fr);gap:0;padding:2px}.summary-icon.multi img{width:12px;height:26px;object-fit:contain}.compact-list{margin:10px 0 0;padding-left:22px;color:var(--paper-2)}.compact-list li{margin:6px 0}
.playstyle-card.card.pad{padding:18px}.playstyle-card{position:relative;min-height:100%;display:grid;grid-template-columns:132px minmax(0,1fr);gap:2px 8px;align-content:start}.playstyle-card:before{content:"";position:absolute;inset:0 0 auto;height:134px;background:linear-gradient(180deg,rgba(226,184,90,.14),transparent);pointer-events:none}.playstyle-icon{position:relative;grid-row:1/3;width:132px;height:132px;object-fit:contain;align-self:start;margin:-12px 0 0 -12px;filter:drop-shadow(0 14px 22px rgba(0,0,0,.42))}.playstyle-card .meta,.playstyle-card h3{grid-column:2}.playstyle-card .meta{font-size:14px;margin-bottom:4px}.playstyle-card h3{font-size:26px;margin-bottom:4px}.playstyle-card p{grid-column:1/-1;margin:6px 0 0;color:var(--paper-2)}
.resource-note{margin-top:-10px}.resource-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.resource-card{display:grid;grid-template-columns:62px 1fr;gap:16px;align-items:start;padding:18px}.resource-mark{display:grid;place-items:center;width:62px;height:62px;border-radius:14px;background:linear-gradient(135deg,var(--accent),rgba(255,255,255,.12));color:#120e0a;font-weight:900;letter-spacing:0;font-size:18px;box-shadow:0 12px 28px rgba(0,0,0,.22)}.resource-card h3{margin-bottom:8px}.resource-card p{margin:0 0 12px;color:var(--paper-2)}
.timeline{position:relative;display:grid;gap:20px}.timeline:before{content:"";position:absolute;left:23px;top:0;bottom:0;width:2px;background:var(--line)}.timeline-item{display:grid;grid-template-columns:48px 1fr;gap:18px}.timeline-dot{width:18px;height:18px;border-radius:50%;background:var(--gold);margin:18px 0 0 15px;box-shadow:0 0 0 8px rgba(194,139,44,.13);z-index:2}.timeline-card{display:grid;grid-template-columns:230px 1fr;gap:18px;padding:16px;border:1px solid var(--line);border-radius:var(--radius);background:rgba(255,255,255,.035)}.timeline-card img{aspect-ratio:4/3;object-fit:cover;border-radius:16px;background:#241a11}.timeline-date{color:var(--gold-2);font-weight:800;font-size:14px;margin-bottom:4px}
details.post{background:rgba(255,255,255,.035);border:1px solid var(--line);border-radius:var(--radius);padding:18px}details.post summary{cursor:pointer;font-weight:900;font-size:20px;color:var(--paper)}details.post[open] summary{margin-bottom:12px}.post-content{color:var(--paper-2)}.post-image{display:block;width:100%;max-height:520px;object-fit:cover;border-radius:16px;border:1px solid var(--line);margin:0 0 18px;background:#241a11}.post-image.poster{max-height:760px;object-fit:contain}
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.82);display:none;align-items:center;justify-content:center;padding:20px;z-index:100}.lightbox.open{display:flex}.lightbox-dialog{width:min(960px,100%);background:#120e0a;border:1px solid var(--line);border-radius:24px;padding:16px}.lightbox-top{display:flex;align-items:center;justify-content:space-between;gap:12px}.icon-btn{background:rgba(255,255,255,.08);border:1px solid var(--line);color:var(--paper);width:40px;height:40px;border-radius:50%;font-size:24px;cursor:pointer}.lightbox img{max-height:70vh;margin:auto;border-radius:16px}.lightbox-caption{color:var(--muted);margin-top:10px;text-align:center}
@media (max-width: 960px){
  .nav-toggle{display:block}.site-nav{position:absolute;left:18px;right:18px;top:76px;display:none;flex-direction:column;align-items:stretch;background:rgba(20,15,10,.96);border:1px solid var(--line);border-radius:18px;padding:12px;box-shadow:var(--shadow)}.nav-open .site-nav{display:flex}.site-nav a{padding:12px 14px}.hero{min-height:auto}.hero-grid,.two-col,.grid.two,.grid.three,.grid.four,.quick-link-grid,.resource-grid{grid-template-columns:1fr}.hero-card{order:-1}.motto{font-size:16px}.news-item{grid-template-columns:1fr}.timeline-card{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}.brand-title{font-size:15px}.brand-subtitle{font-size:11px}h1{font-size:42px}.quote-poem{font-size:18px;letter-spacing:.1em}.section{padding:56px 0}
}
@media (max-width: 520px){.container{width:min(100% - 24px,var(--max))}.nav-wrap{height:68px}.site-nav{top:68px}.brand-logo{width:40px;height:40px}.brand-title{max-width:190px;overflow:hidden;text-overflow:ellipsis}.hero-actions{display:grid}.btn{width:100%}.motto{grid-template-columns:1fr}.quote-poem{text-align:left;letter-spacing:.06em}.section{padding:44px 0}.page-hero{padding:44px 0 30px}.card-body{padding:16px}}
@media (max-width: 520px){.inactive-title span{display:block}}
@media (max-width: 520px){.playstyle-card.card.pad{padding:16px}.playstyle-card{grid-template-columns:100px minmax(0,1fr);gap:2px 6px}.playstyle-card:before{height:106px}.playstyle-icon{width:100px;height:100px;margin:-8px 0 0 -10px}.playstyle-card .meta{font-size:13px;margin-bottom:3px}.playstyle-card h3{font-size:22px;margin-bottom:3px}.playstyle-card p{margin-top:6px}}


/* v0.7 content and structure */
.local-hero{background:linear-gradient(90deg,rgba(9,11,14,.94),rgba(9,11,14,.67)),url('../images/join/troll-family.webp') center/cover no-repeat}
.split-feature{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:34px;align-items:center}.feature-image{width:100%;max-height:520px;object-fit:cover;border-radius:18px;border:1px solid var(--line)}
.center-actions{text-align:center;margin-top:30px}.btn.large{font-size:1.05rem;padding:15px 24px}.join-hero{padding:72px 0;background:radial-gradient(circle at 75% 25%,rgba(183,137,43,.19),transparent 35%),var(--bg)}.join-hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:42px;align-items:center}.join-hero-image{width:100%;border-radius:22px;border:1px solid var(--line);box-shadow:0 24px 70px rgba(0,0,0,.4)}.join-slogan{font-family:var(--serif);font-size:clamp(1.5rem,3vw,2.35rem);line-height:1.35;color:var(--gold);margin:18px 0}.join-steps{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;counter-reset:steps}.join-steps li{counter-increment:steps;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:24px;display:grid;gap:10px}.join-steps li:before{content:counter(steps);width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--gold);color:#111;font-weight:800}.join-steps strong{font-size:1.1rem}.join-steps span{color:var(--muted)}.faction-row{display:grid;grid-template-columns:100px 100px 1fr;gap:16px;align-items:center;margin-top:22px}.faction-row div{text-align:center}.faction-row img{width:76px;height:76px;object-fit:contain;display:block;margin:auto}.faction-row span{display:block;margin-top:6px}.resource-links{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0 28px}.faction-card{object-fit:contain;background:#111;padding:18px}.notice-panel{margin-top:24px;padding:24px;border:1px solid var(--line);border-left:4px solid var(--gold);background:rgba(255,255,255,.035);border-radius:14px}.timeline{position:relative;display:grid;gap:20px}.timeline:before{content:"";position:absolute;left:22px;top:0;bottom:0;width:2px;background:linear-gradient(var(--gold),rgba(183,137,43,.1))}.timeline-item{position:relative;padding-left:58px}.timeline-item:before{content:"";position:absolute;left:14px;top:28px;width:18px;height:18px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 6px rgba(183,137,43,.15)}.timeline-card{width:100%;display:grid;grid-template-columns:240px 1fr;gap:22px;text-align:left;background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:0;overflow:hidden;color:inherit;cursor:pointer}.timeline-card:hover,.timeline-card:focus-visible{border-color:var(--gold);transform:translateY(-2px)}.timeline-card img{width:100%;height:170px;object-fit:cover}.timeline-copy{padding:22px 22px 22px 0;display:grid;gap:8px;align-content:center}.timeline-copy strong{font-size:1.25rem;color:var(--text)}.timeline-copy span{color:var(--muted)}.timeline-copy em{color:var(--gold);font-style:normal;font-size:.92rem}.lightbox-count{align-self:center;color:var(--muted);min-width:70px;text-align:center}.no-scroll{overflow:hidden}
@media(max-width:900px){.split-feature,.join-hero-grid{grid-template-columns:1fr}.join-steps{grid-template-columns:1fr}.timeline-card{grid-template-columns:180px 1fr}.faction-row{grid-template-columns:80px 80px 1fr}}
@media(max-width:620px){.timeline:before{left:10px}.timeline-item{padding-left:30px}.timeline-item:before{left:2px}.timeline-card{grid-template-columns:1fr}.timeline-card img{height:190px}.timeline-copy{padding:18px}.faction-row{grid-template-columns:1fr 1fr}.faction-row p{grid-column:1/-1}.join-hero{padding:44px 0}}

/* v0.8 corrections */
.brand-logo{background:transparent;border-radius:0}
.hero-logo{background:transparent}
.company-statement{margin:30px 0 22px;padding:20px 22px;border-left:4px solid var(--gold);background:rgba(226,184,90,.07);border-radius:0 14px 14px 0}
.company-statement p{margin:0;font-size:20px;color:var(--paper)}
.company-statement strong{color:var(--gold-2)}

.event-feature{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);align-items:stretch}
.event-feature>img{width:100%;height:100%;min-height:390px;object-fit:cover}
.event-feature-copy{padding:34px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.event-feature-copy .btn{margin-top:10px}
.faction-card{object-fit:contain;background:radial-gradient(circle at 50% 45%,rgba(226,184,90,.10),rgba(0,0,0,.20) 58%,rgba(0,0,0,.42));padding:28px}
.community-card h3{font-size:28px}
.alliance-community h3{color:#9ec7ff}
.horde-community h3{color:#e56f58}

/* Alternating enterprise history timeline, based on the original Wix layout. */
.history-timeline-shell{position:relative;max-width:1040px;margin:0 auto;padding:58px 0}
.history-timeline{position:relative;display:grid;gap:12px}
.history-timeline::before{content:"";position:absolute;left:50%;top:-20px;bottom:-20px;width:4px;transform:translateX(-50%);background:linear-gradient(180deg,rgba(242,228,200,.98),rgba(242,228,200,.70));border-radius:99px}
.history-cap{position:absolute;left:50%;transform:translateX(-50%);width:46px;height:46px;display:grid;place-items:center;background:#e9e9e9;color:#262626;font-size:28px;line-height:1;z-index:4;box-shadow:0 6px 18px rgba(0,0,0,.32)}
.history-cap-top{top:0}
.history-cap-bottom{bottom:0}
.history-entry{position:relative;min-height:130px}
.history-entry-button{position:relative;width:100%;min-height:130px;padding:0;border:0;background:transparent;color:inherit;font:inherit;cursor:pointer;text-align:left}
.history-entry-has-description,.history-entry-has-description .history-entry-button{min-height:200px}
.history-entry-button:focus-visible{outline:2px solid var(--gold-2);outline-offset:6px;border-radius:16px}
.history-copy{position:absolute;top:50%;width:calc(50% - 145px);transform:translateY(-50%);display:grid;gap:3px}
.history-left .history-copy{right:calc(50% + 145px);text-align:right}
.history-right .history-copy{left:calc(50% + 145px);text-align:left}
.history-copy time{display:block;color:#fff;font-size:clamp(21px,2.3vw,29px);line-height:1.25;font-variant-numeric:tabular-nums}
.history-copy strong{display:block;color:#fff;font-size:clamp(16px,1.7vw,20px);line-height:1.5;font-family:inherit;font-weight:500}
.history-description{display:block;margin-top:7px;color:rgba(242,228,200,.76);font-size:13px;line-height:1.65;white-space:pre-line}
.history-copy em{display:block;margin-top:5px;color:var(--gold-2);font-size:12px;font-style:normal;opacity:0;transition:.18s}
.history-entry-button:hover .history-copy em,.history-entry-button:focus-visible .history-copy em{opacity:1}
.history-thumb-wrap{position:absolute;top:50%;width:92px;height:92px;transform:translate(-50%,-50%);border-radius:50%;padding:7px;background:#292929;box-shadow:0 0 0 1px rgba(255,255,255,.08),0 14px 30px rgba(0,0,0,.38);z-index:3;transition:transform .18s,box-shadow .18s}
.history-left .history-thumb-wrap{left:calc(50% - 78px)}
.history-right .history-thumb-wrap{left:calc(50% + 78px)}
.history-thumb{width:100%;height:100%;object-fit:cover;border-radius:50%;background:#111}
.history-entry-button:hover .history-thumb-wrap,.history-entry-button:focus-visible .history-thumb-wrap{transform:translate(-50%,-50%) scale(1.06);box-shadow:0 0 0 2px rgba(226,184,90,.45),0 18px 38px rgba(0,0,0,.5)}
.history-dot{position:absolute;left:50%;top:50%;width:24px;height:24px;transform:translate(-50%,-50%);border-radius:50%;background:#303030;z-index:3;box-shadow:0 0 0 4px rgba(0,0,0,.22)}
.history-entry-button::after{content:"";position:absolute;top:50%;height:2px;width:33px;background:#353535;transform:translateY(-50%);z-index:2}
.history-left .history-entry-button::after{left:calc(50% - 54px)}
.history-right .history-entry-button::after{left:calc(50% + 21px)}

.lightbox[aria-hidden="false"],.lightbox.open{display:flex}
.lightbox figure{margin:12px 0 0}
.lightbox img{max-width:100%;object-fit:contain}
.lightbox-actions{justify-content:center;margin-top:12px}

@media(max-width:900px){
  .event-feature{grid-template-columns:1fr}
  .event-feature>img{min-height:0;aspect-ratio:16/9}
  .history-timeline-shell{padding:44px 0}
  .history-timeline::before{left:48px}
  .history-cap{left:48px;width:40px;height:40px}
  .history-entry{min-height:126px}
  .history-entry-button{min-height:126px}
  .history-entry-has-description,.history-entry-has-description .history-entry-button{min-height:190px}
  .history-copy,.history-left .history-copy,.history-right .history-copy{left:130px;right:18px;width:auto;text-align:left}
  .history-thumb-wrap,.history-left .history-thumb-wrap,.history-right .history-thumb-wrap{left:86px;width:76px;height:76px;padding:6px}
  .history-dot{left:48px;width:20px;height:20px}
  .history-entry-button::after,.history-left .history-entry-button::after,.history-right .history-entry-button::after{left:58px;width:28px}
  .history-copy time{font-size:21px}
  .history-copy strong{font-size:16px}
}

@media(max-width:520px){
  .event-feature-copy{padding:22px}
  .history-timeline-shell{padding:42px 0}
  .history-timeline::before{left:24px;width:3px}
  .history-cap{left:24px;width:36px;height:36px;font-size:22px}
  .history-entry,.history-entry-button{min-height:146px}
  .history-entry-has-description,.history-entry-has-description .history-entry-button{min-height:210px}
  .history-copy,.history-left .history-copy,.history-right .history-copy{left:92px;right:2px}
  .history-thumb-wrap,.history-left .history-thumb-wrap,.history-right .history-thumb-wrap{left:58px;width:64px;height:64px;padding:5px}
  .history-dot{left:24px;width:17px;height:17px}
  .history-entry-button::after,.history-left .history-entry-button::after,.history-right .history-entry-button::after{left:33px;width:25px}
  .history-copy time{font-size:19px}
  .history-copy strong{font-size:15px;line-height:1.45}
  .history-description{font-size:12px;line-height:1.55}
  .history-copy em{opacity:.9;font-size:11px}
}

/* v0.9 JSON-driven history timeline */
.history-status{position:relative;z-index:5;margin:40px auto;max-width:560px;padding:18px 22px;border:1px solid rgba(255,255,255,.12);border-radius:14px;background:rgba(0,0,0,.28);color:rgba(255,255,255,.78);text-align:center}
.history-status-error{border-color:rgba(214,120,83,.45);color:#ffd7c8}

/* Public inactive-member roster */
.inactive-hero{background:linear-gradient(180deg,rgba(194,139,44,.14),rgba(111,142,69,.06) 58%,transparent)}
.inactive-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) 220px;gap:34px;align-items:center}
.inactive-hero p{color:var(--paper-2)}
.inactive-stamp{justify-self:end;width:190px;aspect-ratio:1;display:grid;place-items:center;border:2px solid rgba(226,184,90,.45);border-radius:50%;background:radial-gradient(circle,rgba(226,184,90,.13),rgba(33,25,18,.62));box-shadow:0 18px 52px rgba(0,0,0,.32);transform:rotate(-6deg)}
.inactive-stamp img{width:82px;grid-area:1/1;opacity:.42}
.inactive-stamp span{grid-area:1/1;margin-top:-78px;color:var(--gold-2);font-weight:900;font-size:18px;letter-spacing:.18em}
.inactive-stamp strong{grid-area:1/1;margin-top:76px;color:var(--paper);font-family:Georgia,"Noto Serif TC",serif;font-size:28px;letter-spacing:.12em}
.retention-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.retention-card span{display:inline-flex;width:max-content;max-width:100%;margin-bottom:12px;padding:5px 10px;border:1px solid rgba(226,184,90,.32);border-radius:999px;color:var(--gold-2);font-weight:900;font-size:13px}
.retention-card h3{font-size:23px}.retention-card p{margin:0;color:var(--paper-2)}
.roster-tabs{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 18px}
.roster-tabs button{min-height:40px;padding:8px 14px;border:1px solid rgba(242,228,200,.18);border-radius:999px;background:rgba(255,255,255,.035);color:var(--paper-2);font:inherit;font-weight:900;cursor:pointer}
.roster-tabs button:hover,.roster-tabs button[aria-selected="true"]{border-color:rgba(226,184,90,.55);background:rgba(226,184,90,.12);color:#fff}
.inactive-tools{display:grid;grid-template-columns:minmax(220px,1.4fr) repeat(3,minmax(150px,1fr));gap:14px;align-items:end;margin:0 0 18px}
.field-label{display:grid;gap:6px;color:var(--paper);font-weight:900}
.field-label input,.field-label select{width:100%;min-height:44px;border:1px solid rgba(242,228,200,.22);border-radius:12px;background:#16100b;color:var(--paper);padding:9px 12px;font:inherit}
.toggle-label{display:flex;align-items:center;gap:9px;min-height:44px;padding:9px 12px;border:1px solid rgba(242,228,200,.16);border-radius:12px;background:rgba(255,255,255,.035);color:var(--paper-2);font-weight:800}
.toggle-label input{width:18px;height:18px;accent-color:var(--gold)}
.inactive-result-bar{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:8px 0 18px;color:var(--muted);font-weight:800}
.inactive-result-bar p{margin:0}
.employee-list{display:block}
.roster-pagination{display:flex;justify-content:flex-end;align-items:center;gap:10px;margin:12px 0;color:var(--muted);font-weight:900}
.roster-pagination button{min-height:36px;padding:7px 12px;border:1px solid rgba(242,228,200,.18);border-radius:999px;background:rgba(255,255,255,.04);color:var(--paper);font:inherit;font-weight:900;cursor:pointer}
.roster-pagination button:disabled{cursor:not-allowed;opacity:.45}
.roster-pagination button:not(:disabled):hover{border-color:rgba(226,184,90,.55);background:rgba(226,184,90,.12)}
.roster-table-wrap{overflow:auto;border:1px solid var(--line);border-radius:16px;background:linear-gradient(180deg,rgba(43,33,23,.88),rgba(22,17,12,.86));box-shadow:0 12px 34px rgba(0,0,0,.18)}
.roster-table{width:100%;min-width:980px;border-collapse:collapse;font-size:15px}
.roster-table th,.roster-table td{padding:10px 12px;border-bottom:1px solid rgba(242,228,200,.13);text-align:left;vertical-align:top}
.roster-table th{background:#2d2217;color:#fff;font-weight:900;white-space:nowrap}
.roster-table tbody tr:nth-child(even){background:rgba(255,255,255,.025)}
.roster-table tbody tr:hover{background:rgba(226,184,90,.08)}
.roster-table tbody tr:last-child td{border-bottom:0}
.roster-index{width:64px;text-align:center;color:var(--muted);font-variant-numeric:tabular-nums}
.roster-name{min-width:150px;color:var(--paper);font-weight:900}
.roster-realm,.roster-class,.roster-race{width:112px;white-space:nowrap}
.roster-rank{min-width:176px}
.roster-note{min-width:260px;color:var(--paper-2)}
.roster-cell-unknown{color:var(--gold-2);font-weight:900}
.roster-class-color{font-weight:900}
.class-warrior{color:#c79c6e}.class-paladin{color:#f58cba}.class-hunter{color:#abd473}.class-rogue{color:#fff569}.class-priest{color:#fff}.class-death-knight{color:#c41f3b}.class-shaman{color:#0070de}.class-mage{color:#69ccf0}.class-warlock{color:#9482c9}.class-monk{color:#00ff96}.class-druid{color:#ff7d0a}.class-demon-hunter{color:#a330c9}
.employee-card{position:relative;overflow:hidden;padding:20px;border:1px solid var(--line);border-left:5px solid var(--gold);border-radius:18px;background:linear-gradient(180deg,rgba(43,33,23,.88),rgba(22,17,12,.86));box-shadow:0 12px 34px rgba(0,0,0,.18)}
.employee-card-head{display:flex;justify-content:space-between;gap:16px;align-items:start}
.employee-card h3{font-size:28px;margin-bottom:0}
.status-badge{display:inline-flex;align-items:center;min-height:32px;padding:5px 10px;border-radius:999px;background:rgba(226,184,90,.13);color:var(--paper);font-size:13px;font-weight:900;white-space:nowrap}
.employee-meta{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:16px 0}
.employee-meta-roster{grid-template-columns:1fr 1fr 1fr 1.35fr}
.employee-meta-item{padding:10px;border:1px solid rgba(242,228,200,.12);border-radius:12px;background:rgba(0,0,0,.16)}
.employee-meta-item span{display:block;color:var(--muted);font-size:12px;font-weight:800}
.employee-meta-item strong{display:block;color:var(--paper);font-size:15px;line-height:1.45}
.employee-meta-unknown strong{color:var(--gold-2)}
.employee-note{margin:0;color:var(--paper-2)}
.status-retain-two,.status-retain-one{border-left-color:#8fa8bd}.status-badge-retain-two,.status-badge-retain-one{background:rgba(143,168,189,.18);color:#cfe1ef}
.status-awaiting-selection,.status-preparing-removal{border-left-color:#c27a2c}.status-badge-awaiting-selection,.status-badge-preparing-removal{background:rgba(194,122,44,.18);color:#ffd4a6}
.status-removed-rehirable{border-left-color:#9b6b62}.status-badge-removed-rehirable{background:rgba(155,107,98,.18);color:#e9c5bf}
.status-reinstatement-review{border-left-color:#7dbdaf}.status-badge-reinstatement-review{background:rgba(125,189,175,.18);color:#c9f4ec}
.status-reinstated{border-left-color:#6f8e45}.status-badge-reinstated{background:rgba(111,142,69,.2);color:#cfe6b3}
.status-special-review{border-left-color:#c5a56a}.status-badge-special-review{background:rgba(197,165,106,.18);color:#f3ddad}
.status-forced-left{border-left-color:#b45a3c}.status-badge-forced-left{background:rgba(180,90,60,.20);color:#ffd3c4}
.status-planned-review{border-left-color:#c27a2c}.status-badge-planned-review{background:rgba(194,122,44,.18);color:#ffd4a6}
.inactive-message{padding:24px;border:1px dashed rgba(226,184,90,.42);border-radius:18px;background:rgba(0,0,0,.18);color:var(--paper-2);text-align:center}
.inactive-message p{margin:0}.inactive-message p+p{margin-top:10px}.inactive-message-error{border-color:rgba(180,90,60,.54);color:#ffd7c8}
.faq-panel{display:grid;gap:12px;align-content:start}
@media(max-width:960px){.inactive-hero-grid,.retention-grid,.inactive-tools,.employee-meta{grid-template-columns:1fr}.inactive-stamp{justify-self:start;width:150px}.employee-card-head{display:grid}.status-badge{width:max-content;max-width:100%;white-space:normal}.inactive-result-bar{display:grid}}