/* Travian C – royal emerald world selector | 2026-10-27 */
.world-showcase{
  position:relative;
  isolation:isolate;
  max-width:1280px;
  margin:36px auto 56px;
  padding:52px clamp(15px,4vw,54px) 60px;
  border:1px solid #9b84533d;
  border-radius:23px;
  background:
    radial-gradient(ellipse at 50% -30%,#cfbb6b12,transparent 57%),
    radial-gradient(ellipse at 12% 90%,#1d8b6a14,transparent 50%),
    linear-gradient(165deg,#312e2c 0%,#242729 50%,#272526 100%);
  box-shadow:inset 0 0 0 2px #0b11101f,0 18px 60px #0000004b;
  overflow:hidden;
}
.world-showcase::before{
  content:'';
  position:absolute;
  inset:11px;
  z-index:-1;
  border:1px solid #b29c5e25;
  border-radius:16px;
  pointer-events:none;
}
.world-showcase::after{
  content:'';
  position:absolute;
  z-index:-1;
  inset:0;
  opacity:.045;
  pointer-events:none;
  background:repeating-linear-gradient(45deg,transparent 0,transparent 46px,#c7d6c4 47px,transparent 48px);
}
.world-section-heading{
  text-align:center;
  position:relative;
  z-index:1;
  margin:0 auto 31px;
  max-width:650px;
}
.heading-crest{
  width:58px;
  height:58px;
  margin:auto auto 11px;
  display:grid;
  place-items:center;
  border-radius:15px;
  color:#f4d99e;
  border:1px solid #d2ab5f;
  background:linear-gradient(155deg,#2e7663,#194b43 55%,#16352f);
  box-shadow:inset 0 0 0 4px #152e29,0 7px 21px #010c0b7b,0 0 0 4px #baa16817;
  transform:rotate(45deg);
}
.heading-crest span{font:34px Georgia,serif;transform:rotate(-45deg);text-shadow:0 2px 7px #0009}
.heading-eyebrow{
  display:block;
  color:#cbbb94;
  font-size:11px;
  font-weight:800;
  letter-spacing:1px;
  margin-bottom:5px;
}
.heading-title-wrap{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:15px;
}
.world-section-heading .section-title{
  color:#fff8e6;
  margin:0;
  line-height:1.5;
  font-size:clamp(31px,4.1vw,48px);
  font-weight:900;
  text-shadow:0 3px 12px #0009;
}
.world-section-heading .section-title strong{
  font-weight:900;
  background:linear-gradient(180deg,#fff3bd,#e8bd72 60%,#a86c3a);
  color:#f9db9f;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}
.heading-flourish{
  color:#cba46b;
  font-size:12px;
  text-shadow:0 0 15px #ebc98055;
}
.heading-divider{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  color:#d4b474;
  font-size:13px;
  margin:1px auto 9px;
  max-width:240px;
}
.heading-divider i{
  display:block;
  flex:1;
  height:1px;
  background:linear-gradient(90deg,transparent,#cfa669);
}
.heading-divider i:last-child{transform:rotate(180deg)}
.world-section-heading .section-lead{margin:0;color:#aebcaf;font-size:13px;font-weight:600}
.world-showcase .world-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:25px}
.world-showcase .world-card{
  --world-accent:#c9b47e;
  --world-accent-strong:#f5dfaa;
  position:relative;
  border:1px solid #97bca2;
  border-radius:21px;
  padding:18px 21px 22px;
  min-height:354px;
  background:
    radial-gradient(circle at 88% 0%,#4da27c55 0%,transparent 40%),
    radial-gradient(circle at 12% 96%,#0b91733a 0%,transparent 46%),
    linear-gradient(138deg,#20564d,#184138 49%,#102a2b 100%);
  box-shadow:inset 0 0 0 1px #e9ffdf16,inset 0 9px 18px #f1de9720,0 19px 32px #0007;
  transition:transform .23s ease,box-shadow .23s ease,border-color .23s ease;
}
.world-showcase .world-card:hover{
  border-color:#e2cd91;
  transform:translateY(-5px);
  box-shadow:inset 0 0 0 1px #e9ffdf18,inset 0 9px 18px #f1de9720,0 25px 42px #0009,0 0 30px #41977927;
}
.world-showcase .world-card::before{
  height:5px;
  background:linear-gradient(90deg,transparent 0%,#9bc4a0 16%,#e9d092 52%,#9bc4a0 87%,transparent 100%);
}
.world-showcase .world-card::after{
  font-size:185px;
  left:0;
  top:55px;
  color:#c6edd0;
  opacity:.06;
}
.world-showcase .world-card--ts1::after{font-size:180px;top:60px;left:2px}
.world-card__topbar{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:12px;
}
.world-card__badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  border:1px solid #d4b77857;
  background:linear-gradient(100deg,#caaa6940,#083d3433);
  border-radius:100px;
  padding:4px 12px;
  color:#f5db9d;
  font-size:11px;
  font-weight:800;
}
.world-card__badge::before{
  content:'';
  width:6px;
  height:6px;
  border-radius:50%;
  background:#bde3af;
  box-shadow:0 0 7px #7bc9a0;
}
.world-card__index{
  font:700 12px Georgia,serif;
  letter-spacing:2px;
  color:#d3bc8666;
}
.world-showcase .world-card .world-top{
  gap:16px;
  padding:0 0 18px;
  border-bottom:1px solid #e5dca43a;
}
.world-showcase .world-card .world-emblem{
  width:76px;
  height:76px;
  flex:0 0 76px;
  font-size:39px;
  color:#ffe1a0;
  border:2px solid #d6bb7b;
  border-radius:19px;
  background:
    radial-gradient(circle at 33% 19%,#83c49b9c,transparent 50%),
    linear-gradient(145deg,#216555,#0c3935 70%,#102724);
  box-shadow:inset 0 0 0 5px #082d2999,inset 0 0 19px #b1e4a63a,0 5px 15px #031b1788;
  text-shadow:0 2px 6px #000b;
}
.world-showcase .world-ident{min-width:0}
.world-showcase .world-card h3{
  margin:0 0 3px;
  color:#ffe5aa;
  font:700 clamp(30px,3vw,40px) Georgia,'Times New Roman',serif;
  letter-spacing:.5px;
  text-shadow:0 3px 9px #020f0b;
}
.world-showcase .world-card .subtitle{font-size:12px;color:#c7dfcc;margin:0;font-weight:800}
.world-card__gem{
  margin-inline-start:auto;
  align-self:flex-start;
  color:#c8b57663;
  text-shadow:0 0 15px #ffeba0;
  font-size:20px;
}
.world-showcase .world-card .world-metrics{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin:18px 0 17px;
}
.world-showcase .world-card .world-metric{
  border:1px solid #b3d4b641;
  border-radius:11px;
  min-height:94px;
  padding:14px 13px;
  background:linear-gradient(145deg,#071e1e7d,#16433ba8);
  box-shadow:inset 0 1px 0 #ffffff13;
  gap:6px;
  overflow:hidden;
}
.world-showcase .world-card .world-metric small{
  color:#c8dec8;
  margin:0;
  font-size:12px;
  font-weight:800;
  white-space:nowrap;
}
.world-showcase .world-card .world-metric strong{
  color:#fff8e8;
  font-size:clamp(18px,1.9vw,25px);
  text-shadow:0 2px 6px #001a11ba;
}
.world-showcase .world-card .world-metric strong.metric-date{
  text-align:right;
  direction:ltr;
}
.world-showcase .world-card .world-metric strong.metric-count{
  color:#ffe4a5;
  font-size:32px;
}
.world-showcase .world-card .world-actions{gap:12px;margin:0}
.world-showcase .world-card .action-btn{
  min-width:0;
  border-radius:10px;
  min-height:49px;
  background:linear-gradient(170deg,#3160588c,#0e2c2aac);
  color:#eaddb7;
  border:1px solid #a8ba916f;
  box-shadow:inset 0 1px 0 #ffffff18,0 4px 10px #051b1888;
  font-weight:900;
}
.world-showcase .world-card .action-btn.primary{
  color:#ffffff;
  border-color:#a4d7a1;
  background:linear-gradient(180deg,#65c486,#328f65 52%,#166449);
  box-shadow:inset 0 1px 0 #efffef4c,0 6px 15px #001c1199;
  text-shadow:0 2px 4px #0d432b;
}
.world-showcase .world-card .action-btn:hover{filter:brightness(1.15)}
.world-showcase .world-card .action-btn:active{transform:translateY(1px)}
@media(max-width:900px){
  .world-showcase{margin:22px 15px 40px;padding:39px 22px 42px}
  .world-showcase .world-grid{gap:16px}
  .world-showcase .world-card{padding:17px 15px 19px}
  .world-showcase .world-card .world-metrics{gap:8px}
  .world-showcase .world-card .world-metric{padding:12px 9px}
  .world-showcase .world-card .world-metric strong.metric-date{font-size:18px}
}
@media(max-width:700px){
  .world-showcase{margin:16px 12px 34px;padding:35px 16px 32px;border-radius:15px}
  .world-showcase::before{inset:7px}
  .world-showcase .world-grid{grid-template-columns:1fr;gap:16px}
  .world-section-heading{margin-bottom:23px}
  .heading-crest{width:51px;height:51px;margin-bottom:12px}
  .heading-crest span{font-size:30px}
  .world-section-heading .section-title{font-size:34px}
  .world-section-heading .section-lead{font-size:12px}
  .world-showcase .world-card{min-height:0;padding:16px 16px 18px}
  .world-showcase .world-card .world-top{padding-bottom:14px}
  .world-showcase .world-card .world-emblem{width:63px;height:63px;flex-basis:63px;font-size:33px}
  .world-showcase .world-card h3{font-size:32px}
  .world-showcase .world-card .world-metrics{margin:14px 0}
  .world-showcase .world-card .world-metric{min-height:82px;padding:10px}
  .world-showcase .world-card .world-metric strong.metric-count{font-size:27px}
  .world-showcase .world-card .action-btn{min-height:47px}
}
@media(max-width:350px){
  .world-showcase{margin-inline:6px;padding-inline:10px}
  .world-showcase .world-card{padding-inline:11px}
  .world-showcase .world-card .world-metrics{gap:7px}
  .world-showcase .world-card .world-metric{padding:9px 6px}
  .world-showcase .world-card .world-metric small{font-size:10px}
  .world-showcase .world-card .world-metric strong.metric-date{font-size:16px}
  .world-showcase .world-card .action-btn{font-size:12px}
}
@media(prefers-reduced-motion:reduce){.world-showcase .world-card{transition:none}}