/* Reference fidelity pass 3.
   This is the supplied Hera/Pantheon mockup translated to domain columns.
   Top level: one monumental column per functional domain.
   Sanctuary: the same stage, with the domain columns replaced by agent columns. */

/* Tighten the stage so the columns dominate it the way they do in the reference. */
.pantheon-domain-view .domain-chamber,
.sanctuary-open .council-chamber{
  height:500px;
  background:
    radial-gradient(ellipse at 50% 18%,rgba(40,52,78,.22),transparent 34%),
    radial-gradient(ellipse at 50% 76%,rgba(108,73,27,.08),transparent 43%),
    linear-gradient(180deg,#050914 0%,#050812 52%,#02040a 100%);
  border-color:rgba(191,151,76,.13);
  box-shadow:inset 0 0 120px rgba(0,0,0,.55);
}

.pantheon-domain-view .domain-chamber::before,
.sanctuary-open .council-chamber::before{
  background:
    linear-gradient(90deg,rgba(0,0,0,.55),transparent 8%,transparent 92%,rgba(0,0,0,.55)),
    linear-gradient(180deg,transparent 0 58%,rgba(0,0,0,.16) 79%,rgba(0,0,0,.48) 100%);
}

/* Full-width architectural spacing: six tall monuments, no floating mini-columns. */
.pantheon-domain-view .domain-columns{
  inset:17px 2.4% 64px;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:clamp(10px,1.8vw,34px);
  align-items:start;
}

.pantheon-domain-view .domain-column{
  max-width:176px;
  height:405px;
}

.pantheon-domain-view .domain-monument{
  height:329px;
}

/* Larger classical proportions, closer to the supplied render. */
.pantheon-domain-view .domain-capital,
.sanctuary-open .monument-capital{
  width:126px;
  height:48px;
  position:relative;
  clip-path:none;
  border-radius:8px 8px 3px 3px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.23),transparent 22%),
    linear-gradient(90deg,#2d261c 0%,#c9b78d 13%,#f5ead0 48%,#c3ae82 84%,#2b241b 100%);
  box-shadow:inset 0 -8px 12px rgba(0,0,0,.18),0 6px 9px rgba(0,0,0,.58);
}

.pantheon-domain-view .domain-capital::before,
.sanctuary-open .monument-capital::before{
  content:"";
  position:absolute;
  left:-8px;right:-8px;top:5px;height:13px;
  border-radius:8px 8px 2px 2px;
  background:
    radial-gradient(circle at 14px 7px,transparent 0 4px,rgba(88,67,35,.62) 4.5px 6px,transparent 6.5px),
    radial-gradient(circle at calc(100% - 14px) 7px,transparent 0 4px,rgba(88,67,35,.62) 4.5px 6px,transparent 6.5px),
    linear-gradient(90deg,#55452f,#ead8b3 25%,#f9edd4 50%,#e1caa2 75%,#51412d);
  box-shadow:0 3px 5px rgba(0,0,0,.35);
}

.pantheon-domain-view .domain-capital::after,
.sanctuary-open .monument-capital::after{
  content:"";
  position:absolute;
  left:6px;right:6px;bottom:4px;height:9px;
  border-top:1px solid rgba(255,245,218,.35);
  border-bottom:1px solid rgba(66,48,25,.45);
  background:repeating-linear-gradient(90deg,transparent 0 11px,rgba(79,58,30,.28) 12px 13px,transparent 14px 24px);
}

.pantheon-domain-view .domain-shaft,
.sanctuary-open .monument-shaft{
  width:86px;
  height:225px;
  clip-path:polygon(4% 0,96% 0,89% 100%,11% 100%);
  background:
    repeating-linear-gradient(90deg,rgba(57,48,34,.32) 0 5px,rgba(255,249,232,.38) 6px 10px,rgba(107,91,65,.18) 11px 14px),
    linear-gradient(90deg,#322b20 0%,#c7b691 18%,#f4e8cc 49%,#c2ae85 81%,#30281e 100%);
  box-shadow:inset 14px 0 18px rgba(0,0,0,.35),inset -14px 0 18px rgba(0,0,0,.35),0 0 16px rgba(234,216,174,.06);
}

.pantheon-domain-view .domain-base,
.sanctuary-open .monument-base{
  width:132px;
  height:50px;
  margin-top:-1px;
  clip-path:none;
  border-radius:3px 3px 7px 7px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.18),transparent 24%),
    linear-gradient(90deg,#2b251c,#c2af85 18%,#eee1c4 50%,#bca77e 82%,#282219);
  box-shadow:inset 0 8px 12px rgba(255,255,255,.04),0 9px 12px rgba(0,0,0,.62);
}

/* Inset medallions must feel embedded in stone, not like UI badges. */
.pantheon-domain-view .domain-symbol{
  top:126px;
  width:68px;
  height:68px;
  border-width:2px;
  background:
    radial-gradient(circle at 40% 34%,rgba(240,218,174,.13),transparent 27%),
    radial-gradient(circle,#17140f 0%,#090a0c 68%,#030405 100%);
  box-shadow:0 0 0 6px #06070a,0 0 0 7px rgba(184,140,66,.62),inset 0 0 0 1px rgba(246,222,174,.15),0 6px 16px rgba(0,0,0,.75);
  font-size:27px;
}

/* Category state palette follows the reference: live bronze, available ivory, unavailable black stone. */
.pantheon-domain-view .domain-column.licensed_active .domain-capital,
.pantheon-domain-view .domain-column.licensed_active .domain-shaft,
.pantheon-domain-view .domain-column.licensed_active .domain-base{
  background:
    linear-gradient(180deg,rgba(255,181,73,.24),transparent 27%),
    repeating-linear-gradient(90deg,rgba(83,29,7,.28) 0 5px,rgba(255,141,35,.36) 6px 10px,rgba(87,30,8,.24) 11px 14px),
    linear-gradient(90deg,#4b1a06 0%,#a8380b 17%,#f27219 49%,#9e3109 82%,#351204 100%);
  box-shadow:0 0 34px rgba(239,94,21,.25),inset 12px 0 16px rgba(0,0,0,.26),inset -12px 0 16px rgba(0,0,0,.26);
}

.pantheon-domain-view .domain-column.licensed_active .domain-capital::before{
  background:linear-gradient(90deg,#6f280b,#d55713 25%,#ff8a25 50%,#cf4b11 75%,#652308);
}

.pantheon-domain-view .domain-column.available_unlicensed .domain-capital,
.pantheon-domain-view .domain-column.available_unlicensed .domain-shaft,
.pantheon-domain-view .domain-column.available_unlicensed .domain-base{
  filter:none;
  opacity:1;
}

.pantheon-domain-view .domain-column.unavailable .domain-monument{
  opacity:.88;
}
.pantheon-domain-view .domain-column.unavailable .domain-capital,
.pantheon-domain-view .domain-column.unavailable .domain-shaft,
.pantheon-domain-view .domain-column.unavailable .domain-base{
  background:
    repeating-linear-gradient(90deg,rgba(255,255,255,.018) 0 5px,rgba(255,255,255,.055) 6px 9px,transparent 10px 14px),
    linear-gradient(90deg,#030405 0%,#202227 48%,#040506 100%);
  box-shadow:inset 12px 0 16px rgba(0,0,0,.55),inset -12px 0 16px rgba(0,0,0,.55),0 8px 11px rgba(0,0,0,.58);
}

/* Make even black columns readable, as in the reference, rather than disappearing into the wall. */
.pantheon-domain-view .domain-column.unavailable .domain-capital{border-top:1px solid rgba(255,255,255,.08)}
.pantheon-domain-view .domain-column.unavailable .domain-shaft{filter:brightness(1.22)}
.pantheon-domain-view .domain-column.unavailable .domain-base{filter:brightness(1.17)}

.pantheon-domain-view .domain-label{
  margin-top:8px;
}
.pantheon-domain-view .domain-label strong{
  font-size:15px;
  font-weight:600;
  color:#e5d9c0;
  text-shadow:0 2px 6px #000;
}
.pantheon-domain-view .domain-label small{
  margin-top:2px;
  font-size:7px;
  color:#9f9582;
}

/* Floor: broad perspective dais with the dense concentric/radial gold geometry from the reference. */
.pantheon-domain-view .council-floor,
.sanctuary-open .council-floor{
  left:1.1%;
  right:1.1%;
  bottom:-34px;
  height:238px;
  border:1px solid rgba(193,143,49,.62);
  border-radius:50%;
  background:
    repeating-radial-gradient(ellipse at center,transparent 0 18px,rgba(193,143,49,.17) 19px 20px,transparent 21px 40px),
    repeating-conic-gradient(from -1deg at 50% 50%,transparent 0deg 13deg,rgba(192,141,47,.17) 13.4deg 14.2deg,transparent 14.8deg 29deg),
    linear-gradient(112deg,transparent 0 22%,rgba(196,201,211,.055) 22.2%,transparent 22.55% 52%,rgba(149,156,168,.045) 52.2%,transparent 52.55% 78%,rgba(207,211,218,.045) 78.2%,transparent 78.55%),
    radial-gradient(ellipse at 50% 48%,#121722 0%,#0a0e15 47%,#04070c 77%,#020306 100%);
  box-shadow:0 42px 60px rgba(0,0,0,.85),0 0 34px rgba(193,143,49,.1),inset 0 0 100px rgba(0,0,0,.43);
  transform:perspective(900px) rotateX(64deg) scaleY(1.9);
  transform-origin:50% 100%;
}

.pantheon-domain-view .council-floor::before,
.sanctuary-open .council-floor::before{
  inset:8% 8%;
  border:1px solid rgba(198,150,57,.42);
  box-shadow:0 0 0 29px rgba(193,143,49,.018),0 0 0 30px rgba(193,143,49,.24),0 0 0 61px rgba(193,143,49,.012),0 0 0 62px rgba(193,143,49,.14);
}

.pantheon-domain-view .council-floor::after,
.sanctuary-open .council-floor::after{
  content:"\2726";
  width:88px;
  height:88px;
  border:1px solid rgba(204,157,66,.46);
  border-radius:50%;
  color:#c18d36;
  font-size:27px;
  box-shadow:0 0 0 18px rgba(193,143,49,.018),0 0 0 19px rgba(193,143,49,.19),0 0 0 38px rgba(193,143,49,.012),0 0 0 39px rgba(193,143,49,.11);
}

/* The six columns sit over the rear half of the floor, just like the reference render. */
.pantheon-domain-view .domain-columns{z-index:10}
.pantheon-domain-view .council-floor{z-index:3}

/* Sanctuary reuses the exact same monumental scale. */
.sanctuary-open .council-agents{
  inset:17px 8% 64px;
  gap:clamp(40px,5vw,92px);
}
.sanctuary-open .council-agent{
  width:184px;
  height:405px;
}
.sanctuary-open .agent-monument{height:329px}
.sanctuary-open .agent-monument .persona-medallion{
  top:126px;
  width:68px!important;
  height:68px!important;
}

@media(max-width:1320px){
  .pantheon-domain-view .domain-columns{gap:8px;left:1.5%;right:1.5%}
  .pantheon-domain-view .domain-column{max-width:154px}
  .pantheon-domain-view .domain-capital{width:110px}
  .pantheon-domain-view .domain-shaft{width:76px}
  .pantheon-domain-view .domain-base{width:116px}
}