:root {
  --bg:#05100d;
  --bg2:#081712;
  --surface:rgba(7,22,17,.90);
  --surface2:rgba(10,29,23,.88);
  --surface3:rgba(13,37,30,.70);
  --line:rgba(92,181,164,.16);
  --line-gold:rgba(210,154,82,.28);
  --text:#f4f1e9;
  --muted:#8ea49a;
  --soft:#bac8c1;
  --teal:#31b29e;
  --teal2:#1d6d61;
  --gold:#d29a52;
  --gold2:#f0c675;
  --danger:#d86961;
  --ok:#57d792;
  --sidebar:250px;
  --radius:18px;
  --shadow:0 22px 60px rgba(0,0,0,.28);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  min-height:100vh;
  color:var(--text);
  font-family:Inter,"Segoe UI",system-ui,sans-serif;
  background:
    radial-gradient(circle at 72% 0%,rgba(24,122,108,.13),transparent 30%),
    linear-gradient(rgba(2,10,7,.79),rgba(2,10,7,.92)),
    url("/assets/branding/elyvara-scales.svg");
  background-size:auto,auto,180px 156px;
  background-attachment:fixed;
}
button,input,select,textarea{font:inherit}
a{color:inherit;text-decoration:none}
button{cursor:pointer}
.app{min-height:100vh}
.sidebar{
  width:var(--sidebar);position:fixed;inset:0 auto 0 0;z-index:50;
  display:flex;flex-direction:column;
  padding:22px 18px;
  background:linear-gradient(180deg,rgba(3,16,12,.98),rgba(3,18,14,.95));
  border-right:1px solid var(--line);
  box-shadow:16px 0 50px rgba(0,0,0,.16)
}
.brand{display:flex;align-items:center;gap:13px;padding:4px 8px 22px}
.brand img{width:72px;height:72px;object-fit:contain;filter:drop-shadow(0 10px 18px rgba(0,0,0,.28))}
.brand-copy strong{display:block;font-family:Georgia,serif;font-size:18px;letter-spacing:.11em;color:#ead8ae}
.brand-copy span{display:block;margin-top:4px;font-size:9px;letter-spacing:.18em;color:#7d988c}
.nav{display:grid;gap:5px}
.nav a{
  min-height:44px;display:flex;align-items:center;gap:12px;
  padding:10px 12px;border-radius:12px;color:#d8d2bd;
  border:1px solid transparent;transition:.16s ease
}
.nav a:hover{background:rgba(255,255,255,.025);border-color:rgba(255,255,255,.035)}
.nav a.active{
  color:#f1c66e;background:linear-gradient(90deg,rgba(210,154,82,.12),rgba(31,98,82,.13));
  border-color:rgba(210,154,82,.40);
  box-shadow:0 0 24px rgba(210,154,82,.09)
}
.nav-icon{width:22px;height:22px;display:grid;place-items:center;color:currentColor;flex:0 0 auto}
.nav-icon svg{width:20px;height:20px;stroke:currentColor}
.sidebar-bottom{margin-top:auto;display:grid;gap:10px}
.user-card,.steam-card{
  border:1px solid var(--line);border-radius:14px;background:rgba(8,28,21,.72);padding:12px
}
.user-card strong,.steam-card strong{display:block;font-size:13px}
.user-card span,.steam-card span{display:block;color:var(--muted);font-size:11px;margin-top:4px}
.status-dot{width:8px;height:8px;border-radius:50%;background:var(--ok);display:inline-block;margin-right:7px;box-shadow:0 0 12px rgba(87,215,146,.6)}
.main{margin-left:var(--sidebar);min-height:100vh;padding:18px 22px 30px}
.topbar{
  min-height:52px;display:flex;justify-content:flex-end;align-items:center;gap:10px;margin-bottom:10px
}
.top-action{
  border:1px solid var(--line);border-radius:11px;padding:10px 15px;
  background:rgba(6,24,18,.75);color:#9fe3d3;font-weight:700
}
.top-action.gold{border-color:rgba(210,154,82,.45);color:#f0c675;background:rgba(69,43,13,.20)}
.grid{display:grid;gap:12px}
.hero-grid{grid-template-columns:minmax(0,1.7fr) minmax(330px,.9fr)}
.dashboard-row{grid-template-columns:minmax(0,1.15fr) minmax(0,1.35fr)}
.dashboard-bottom{grid-template-columns:minmax(300px,.95fr) minmax(300px,1fr) minmax(300px,1fr) minmax(300px,1.05fr)}
.panel{
  background:linear-gradient(145deg,var(--surface2),var(--surface));
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  overflow:hidden
}
.hero{
  min-height:258px;position:relative;display:flex;align-items:center;padding:28px 30px;
  background:
    linear-gradient(90deg,rgba(3,18,13,.98) 0%,rgba(3,18,13,.91) 43%,rgba(3,18,13,.28) 72%,rgba(3,18,13,.72) 100%),
    radial-gradient(circle at 75% 42%,rgba(37,132,116,.22),transparent 35%),
    url("/assets/branding/elyvara-scales.svg");
  background-size:auto,auto,160px 138px
}
.hero-copy{position:relative;z-index:2;max-width:56%}
.hero-kicker{font-size:13px;color:#d6d8d0}
.hero h1{margin:2px 0 3px;font-family:Georgia,serif;font-size:54px;letter-spacing:.04em;color:#ead7ad}
.hero h2{margin:0;font-size:19px;color:#e5d4b1}
.hero p{margin:16px 0 18px;max-width:560px;color:#aabbb3;font-size:13px;line-height:1.65}
.hero-actions{display:flex;gap:10px}
.btn{
  border:1px solid var(--line);border-radius:10px;padding:10px 15px;
  background:rgba(10,40,31,.64);color:#d8ebe5;font-weight:700
}
.btn.teal{border-color:rgba(49,178,158,.52);color:#67dfc7}
.btn.gold{border-color:rgba(210,154,82,.52);color:#efc36a;background:rgba(77,49,18,.23)}
.btn:disabled{opacity:.45;cursor:not-allowed}
.hero-dino{
  position:absolute;right:2%;bottom:-3%;width:min(43%,420px);height:94%;
  object-fit:contain;object-position:right bottom;
  filter:drop-shadow(0 20px 35px rgba(0,0,0,.42))
}
.server-panel{padding:22px}
.panel-title{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:14px 16px 10px;font-family:Georgia,serif;font-weight:800;color:#e3b961;letter-spacing:.04em
}
.panel-title small{font-family:Inter,"Segoe UI",sans-serif;font-weight:600;color:#56bea7;letter-spacing:0}
.server-state{font-size:22px;color:var(--ok);font-weight:900;margin-top:8px}
.server-sub{color:var(--muted);font-size:12px;margin-top:6px}
.server-metrics{display:grid;grid-template-columns:repeat(3,1fr);margin-top:22px;padding-top:18px;border-top:1px solid rgba(255,255,255,.05)}
.metric{padding:0 13px;border-right:1px solid rgba(255,255,255,.05)}
.metric:last-child{border-right:0}
.metric span{display:block;color:#71897e;font-size:9px;letter-spacing:.10em;text-transform:uppercase}
.metric strong{display:block;margin-top:7px;font-size:17px}
.server-join{width:100%;margin-top:20px}
.parking-wrap,.shop-wrap{padding:0 12px 12px}
.parking-slots{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.parking-mini{
  min-height:145px;border:1px solid rgba(58,159,141,.22);border-radius:11px;padding:10px;
  background:rgba(4,22,16,.48);display:flex;flex-direction:column
}
.parking-mini.locked{opacity:.55}
.slot-head{display:flex;justify-content:space-between;color:#d9d5c8;font-size:10px}
.slot-head span:last-child{color:#56c9ae}
.slot-hex{
  width:55px;height:60px;margin:auto;display:grid;place-items:center;
  clip-path:polygon(25% 7%,75% 7%,100% 50%,75% 93%,25% 93%,0 50%);
  background:rgba(18,81,68,.30);border:1px solid var(--teal);color:#c8d9d2;font-size:28px
}
.slot-name{text-align:center;font-size:11px;color:#d4ddd8;margin-top:4px}
.slot-btn{margin-top:8px;border:1px solid rgba(49,178,158,.28);border-radius:7px;background:rgba(9,38,29,.5);color:#59cdb4;padding:6px;font-size:10px}
.shop-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.shop-card{border:1px solid var(--line);border-radius:11px;overflow:hidden;background:rgba(4,20,15,.50)}
.shop-card img{width:100%;height:94px;object-fit:contain;padding:8px;background:radial-gradient(circle at center,rgba(48,151,132,.12),transparent 66%)}
.shop-card .content{padding:10px}
.shop-card h4{margin:0;font-size:12px}
.shop-card .price{margin-top:7px;color:#efbf5d;font-size:18px;font-weight:900}
.empty{color:var(--muted);font-size:12px;padding:18px;text-align:center;border:1px dashed rgba(255,255,255,.07);border-radius:10px}
.quest-list,.voice-list,.status-list{padding:0 14px 14px}
.quest-row,.voice-row,.status-row{
  display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.05)
}
.quest-row:last-child,.voice-row:last-child,.status-row:last-child{border-bottom:0}
.round-icon{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(210,154,82,.32);background:rgba(90,58,18,.24);color:#f0bd58}
.row-main strong{display:block;font-size:12px}.row-main span{display:block;color:var(--muted);font-size:10px;margin-top:3px}
.progress{height:4px;border-radius:4px;background:rgba(255,255,255,.06);overflow:hidden;margin-top:6px}
.progress>span{display:block;height:100%;background:linear-gradient(90deg,var(--teal),#77d7b7)}
.map-card{padding:0 12px 12px}
.map-surface{
  min-height:217px;position:relative;border-radius:11px;overflow:hidden;
  border:1px solid rgba(54,166,162,.18);
  background:
    radial-gradient(circle at 35% 36%,rgba(36,119,88,.22),transparent 17%),
    radial-gradient(circle at 67% 56%,rgba(38,114,91,.20),transparent 22%),
    repeating-radial-gradient(ellipse at center,rgba(114,156,109,.08) 0 1px,transparent 1px 17px),
    linear-gradient(145deg,#12271c,#0a1c16 55%,#102b23)
}
.map-surface.has-map{background-size:cover;background-position:center}
.map-center{
  position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:20px;color:#9db0a6
}
.map-center strong{display:block;color:#dbc17d;margin-bottom:5px}
.map-legend{display:flex;gap:12px;flex-wrap:wrap;margin-top:8px;color:#849b90;font-size:9px}
.legend-dot{width:7px;height:7px;border-radius:50%;display:inline-block;margin-right:4px;background:var(--teal)}
.voice-head{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:8px 14px 12px}
.mic-orb{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:rgba(26,110,83,.24);border:1px solid rgba(87,215,146,.48);box-shadow:0 0 20px rgba(87,215,146,.12);font-size:23px}
.voice-head strong{display:block;color:#8be3b5;font-size:12px}.voice-head span{display:block;color:var(--muted);font-size:10px;margin-top:3px}
.radius{font-size:18px;font-weight:900;color:#eee}.radius small{display:block;color:#728a80;font-size:8px;text-transform:uppercase}
.voice-slider{width:70px;height:4px;background:rgba(255,255,255,.08);border-radius:4px;position:relative}.voice-slider:after{content:"";position:absolute;left:0;top:0;bottom:0;width:55%;background:var(--teal);border-radius:4px}
.footer-stats{display:grid;grid-template-columns:repeat(5,1fr);margin-top:12px;padding:13px 18px}
.footer-stat{display:flex;gap:10px;align-items:center;border-right:1px solid rgba(255,255,255,.05);padding:2px 18px}
.footer-stat:last-child{border-right:0}.footer-stat b{font-size:18px;color:#e3bb65}.footer-stat small{display:block;color:#6f887c;text-transform:uppercase;font-size:8px;letter-spacing:.08em}.footer-stat span{display:block;margin-top:3px;font-size:12px}
.page-head{margin:10px 0 14px}.page-head h1{margin:0;font-family:Georgia,serif;color:#ead7ad;font-size:34px}.page-head p{margin:7px 0 0;color:var(--muted);max-width:840px;line-height:1.6;font-size:13px}
.page-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.feature{padding:18px}.feature h3{margin:0;color:#e8c376}.feature p{color:var(--muted);font-size:12px;line-height:1.6}.feature .btn{margin-top:8px}
.big-map{min-height:650px}
.voice-page{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:12px}
.form-panel{padding:18px}
.form-grid{display:grid;gap:12px}.field{display:grid;gap:6px}.field label{color:#8ea49a;font-size:10px;text-transform:uppercase;letter-spacing:.08em}
.field input,.field select,.field textarea{width:100%;border:1px solid var(--line);border-radius:10px;background:rgba(4,18,13,.76);color:var(--text);padding:11px 12px;outline:none}.field textarea{min-height:100px;resize:vertical}
.admin-preview{display:grid;grid-template-columns:180px 1fr;gap:12px;padding:12px;border:1px solid var(--line);border-radius:12px;background:rgba(4,20,15,.48)}
.admin-preview img{width:100%;height:160px;object-fit:contain}.admin-preview h3{margin:10px 0 6px;color:#e8c376}.admin-preview p{color:var(--muted);font-size:12px;line-height:1.55}
.admin-list{display:grid;gap:8px}.admin-product{display:grid;grid-template-columns:70px 1fr auto;gap:10px;align-items:center;padding:9px;border-bottom:1px solid rgba(255,255,255,.05)}.admin-product img{width:70px;height:58px;object-fit:contain}.admin-product strong{font-size:12px}.admin-product span{display:block;color:var(--muted);font-size:10px;margin-top:4px}
.toast{margin-top:10px;color:#80cdbb;font-size:11px}
@media(max-width:1280px){.dashboard-bottom{grid-template-columns:1fr 1fr}.parking-slots{grid-template-columns:repeat(3,1fr)}.hero-copy{max-width:62%}}
@media(max-width:980px){:root{--sidebar:80px}.brand-copy,.nav a span:not(.nav-icon),.sidebar-bottom{display:none}.brand{padding:4px 0 20px;justify-content:center}.brand img{width:54px;height:54px}.nav a{justify-content:center}.hero-grid,.dashboard-row,.dashboard-bottom,.voice-page{grid-template-columns:1fr}.hero-copy{max-width:70%}.page-grid{grid-template-columns:1fr 1fr}}
@media(max-width:650px){:root{--sidebar:0px}.sidebar{display:none}.main{margin-left:0;padding:12px}.hero-copy{max-width:100%}.hero-dino{opacity:.24;width:70%}.parking-slots,.shop-grid,.page-grid{grid-template-columns:1fr 1fr}.footer-stats{grid-template-columns:1fr}.footer-stat{border-right:0;border-bottom:1px solid rgba(255,255,255,.05)}}

/* ===== ELYVARA PHASE 6 R2 ===== */
.topbar {
  position: sticky;
  top: 0;
  z-index: 40;
  padding: 8px 0 12px;
  backdrop-filter: blur(10px);
}
.top-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 39px;
  transition: transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease;
}
.top-action:hover {
  transform: translateY(-1px);
  border-color: rgba(74,198,177,.40);
  background: rgba(10,49,38,.78);
  box-shadow: 0 10px 30px rgba(0,0,0,.18);
}
.top-action.gold:hover {
  border-color: rgba(231,177,85,.60);
  background: rgba(93,58,15,.34);
  box-shadow: 0 10px 30px rgba(210,154,82,.10);
}
.panel {
  transition: border-color .18s ease,transform .18s ease,box-shadow .18s ease;
}
.panel:hover {
  border-color: rgba(76,175,157,.22);
}
.nav a { position: relative; }
.nav a.active::before {
  content: "";
  position: absolute;
  left: -1px;
  top: 11px;
  bottom: 11px;
  width: 3px;
  border-radius: 3px;
  background: linear-gradient(180deg,#e7b65e,#4dc8ad);
  box-shadow: 0 0 16px rgba(74,193,169,.30);
}
.brand img { width: 62px; height: 62px; }
.live-map-panel { padding: 12px; }
.live-map-toolbar {
  min-height: 54px;
  padding: 4px 4px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.live-map-toolbar strong {
  display: block;
  color: #e8c777;
  font-size: 14px;
  letter-spacing: .03em;
}
.live-map-toolbar span {
  display: block;
  margin-top: 4px;
  color: #7f9d90;
  font-size: 11px;
}
.map-toolbar-actions { display: flex; gap: 7px; }
.map-tool-button {
  min-width: 38px;
  height: 36px;
  padding: 0 12px;
  border: 1px solid rgba(64,170,151,.22);
  border-radius: 10px;
  color: #bbd8ce;
  background: rgba(5,29,21,.76);
}
.map-tool-button:hover {
  border-color: rgba(72,205,179,.42);
  color: #75ddc5;
}
.map-tool-button.wide { min-width: 74px; font-size: 11px; }
.live-map-viewport {
  position: relative;
  height: calc(100vh - 220px);
  min-height: 560px;
  max-height: 900px;
  overflow: hidden;
  border: 1px solid rgba(72,178,158,.18);
  border-radius: 14px;
  background: radial-gradient(circle at center,rgba(20,69,51,.34),transparent 60%),#06130e;
  cursor: grab;
  user-select: none;
  touch-action: none;
}
.live-map-viewport.dragging { cursor: grabbing; }
.live-map-canvas {
  position: absolute;
  left: 0;
  top: 0;
  transform-origin: 0 0;
  will-change: transform;
}
.live-map-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  pointer-events: none;
}
.live-markers {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.map-waiting {
  position: fixed;
  left: 50%;
  bottom: 34px;
  transform: translateX(-50%);
  width: min(470px,calc(100vw - 340px));
  padding: 11px 15px;
  border: 1px solid rgba(210,154,82,.24);
  border-radius: 12px;
  text-align: center;
  background: rgba(4,18,13,.84);
  backdrop-filter: blur(10px);
  box-shadow: 0 18px 40px rgba(0,0,0,.24);
}
.map-waiting strong {
  display: block;
  color: #e3ba68;
  font-size: 12px;
}
.map-waiting span {
  display: block;
  margin-top: 4px;
  color: #94a99f;
  font-size: 10px;
}
.live-map-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 11px 4px 2px;
}
.map-credit { color: #70897d; font-size: 10px; }
.map-credit a { color: #58cbb2; }
.legend-dot.player { background: #55b577; }
.legend-dot.group { background: #4d84b7; }
.legend-dot.nest { background: #a967aa; }
.legend-dot.territory { background: #d4a24e; }
@media(max-width:980px) {
  .live-map-viewport { height: 70vh; min-height: 480px; }
  .map-waiting { width: min(470px,calc(100vw - 130px)); }
}
@media(max-width:650px) {
  .live-map-footer { align-items: flex-start; flex-direction: column; }
  .map-waiting { width: calc(100vw - 50px); }
}
/* ===== END ELYVARA PHASE 6 R2 ===== */


/* ===== ELYVARA STEAM AUTH ===== */

.user-card,
.steam-card {
    transition:
        border-color .18s ease,
        background .18s ease,
        box-shadow .18s ease;
}

.steam-card:has(.status-dot) {
    border-color:
        rgba(61, 190, 150, .18);
}

.parking-account-slot {
    min-height: 270px;
}

.parking-account-slot.locked {
    opacity: .50;
    filter: saturate(.65);
}

.parking-account-slot.locked:hover {
    transform: none;
}

.steam-login-note {
    color: #7f998e;
    font-size: 11px;
    line-height: 1.55;
}

/* ===== END ELYVARA STEAM AUTH ===== */

/* ===== ELYVARA PHASE 8 ACCOUNT ===== */

.parking-more-card {
    align-items: center;
    justify-content: center;
    text-align: center;
    border-color: rgba(210,154,82,.24);
    background:
        linear-gradient(
            145deg,
            rgba(48,32,12,.22),
            rgba(4,22,16,.48)
        );
}

.parking-more-number {
    margin: auto auto 4px;
    color: #edc16d;
    font-family: Georgia, serif;
    font-size: 32px;
    font-weight: 800;
}

.parking-more-link {
    display: block;
    text-align: center;
}

.user-card strong {
    color: #ead6a9;
}

.steam-card strong {
    color: #e8eee9;
}

/* ===== END ELYVARA PHASE 8 ACCOUNT ===== */

/* ===== ELYVARA PHASE 9 ===== */

.steam-profile-avatar {
    position: absolute;
    left: 10px;
    top: 50%;
    width: 34px;
    height: 34px;
    transform: translateY(-50%);
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid rgba(210,154,82,.40);
    box-shadow: 0 0 18px rgba(49,178,158,.12);
}

.shop-card img,
.admin-product img,
.admin-preview img {
    image-rendering: auto;
}

.admin-preview img {
    border-radius: 12px;
    background:
        radial-gradient(
            circle at center,
            rgba(35,126,105,.16),
            transparent 68%
        );
}

.shop-card img {
    background:
        radial-gradient(
            circle at center,
            rgba(35,126,105,.14),
            transparent 66%
        );
}

/* ===== END ELYVARA PHASE 9 ===== */

/* ===== ELYVARA PHASE 10 PARKING ===== */

.parking-status-bar {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    padding:14px 16px;
    margin-bottom:12px;
}

.parking-status-bar strong {
    display:block;
    color:#e6c372;
    font-size:13px;
}

.parking-status-bar span {
    display:block;
    margin-top:4px;
    color:#8fa79c;
    font-size:11px;
}

.parking-server-pill {
    padding:8px 11px;
    border-radius:999px;
    border:1px solid rgba(49,178,158,.26);
    background:rgba(18,78,64,.20);
    color:#76d9c3;
    font-size:10px;
    font-weight:800;
}

.parking-server-pill.offline {
    border-color:rgba(216,105,97,.28);
    background:rgba(93,29,26,.20);
    color:#e28e86;
}

.parking-server-pill.working {
    border-color:rgba(210,154,82,.36);
    background:rgba(80,52,16,.22);
    color:#efc574;
}

.parking-real-panel {
    padding:12px;
}

.parking-help {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:9px;
    margin-bottom:12px;
}

.parking-help > div {
    padding:11px 12px;
    border:1px solid rgba(255,255,255,.05);
    border-radius:11px;
    background:rgba(4,20,15,.42);
}

.parking-help b {
    display:block;
    color:#dfb45f;
    font-size:9px;
    letter-spacing:.10em;
}

.parking-help span {
    display:block;
    margin-top:5px;
    color:#849b90;
    font-size:10px;
    line-height:1.45;
}

.parking-page-scroll {
    max-height:calc(100vh - 315px);
    min-height:390px;
    overflow-y:auto;
    padding:3px 5px 8px 2px;
}

.parking-page-scroll::-webkit-scrollbar {
    width:8px;
}

.parking-page-scroll::-webkit-scrollbar-thumb {
    border-radius:8px;
    background:rgba(58,159,141,.26);
}

.parking-real-grid {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
}

.parking-real-card {
    min-height:310px;
    padding:15px;
    border:1px solid rgba(58,159,141,.19);
    border-radius:14px;
    background:
        linear-gradient(
            145deg,
            rgba(8,31,24,.92),
            rgba(4,19,14,.88)
        );
}

.parking-real-card.occupied-slot {
    border-color:rgba(210,154,82,.33);
    box-shadow:inset 0 0 28px rgba(210,154,82,.035);
}

.parking-card-head {
    display:flex;
    justify-content:space-between;
    gap:8px;
    color:#8fa59b;
    font-size:9px;
    letter-spacing:.06em;
}

.parking-card-head b {
    color:#58cdb4;
}

.occupied-slot .parking-card-head b {
    color:#e8b85d;
}

.parking-empty-symbol {
    width:78px;
    height:84px;
    margin:28px auto 18px;
    display:grid;
    place-items:center;
    clip-path:polygon(25% 7%,75% 7%,100% 50%,75% 93%,25% 93%,0 50%);
    background:rgba(18,81,68,.25);
    color:#8fc9bc;
    font-size:34px;
}

.parking-real-card h3 {
    margin:0;
    color:#ead7ad;
    font-family:Georgia,serif;
    font-size:18px;
}

.parking-real-card p {
    min-height:34px;
    color:#82968d;
    font-size:10px;
    line-height:1.5;
}

.parking-real-card .btn {
    width:100%;
    margin-top:8px;
}

.parking-dino-preview {
    height:125px;
    margin:12px 0 7px;
    display:grid;
    place-items:center;
    border-radius:11px;
    background:
        radial-gradient(
            circle at center,
            rgba(44,133,111,.16),
            transparent 68%
        );
}

.parking-dino-preview img {
    width:100%;
    height:100%;
    object-fit:contain;
}

.parking-dino-meta {
    display:flex;
    flex-wrap:wrap;
    gap:5px;
    margin-top:9px;
}

.parking-dino-meta span {
    padding:5px 7px;
    border:1px solid rgba(255,255,255,.06);
    border-radius:7px;
    background:rgba(255,255,255,.025);
    color:#91a69c;
    font-size:9px;
}

.parking-dino-meta span b {
    color:#d5dfda;
}

.parking-dino-meta .prime-on {
    border-color:rgba(210,154,82,.22);
    color:#eac06c;
}

.mini-dino img {
    width:90%;
    height:90%;
    object-fit:contain;
}

.occupied-mini {
    border-color:rgba(210,154,82,.30);
}

@media(max-width:1150px) {
    .parking-real-grid {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

@media(max-width:760px) {
    .parking-help {
        grid-template-columns:1fr;
    }

    .parking-real-grid {
        grid-template-columns:1fr;
    }

    .parking-page-scroll {
        max-height:none;
    }
}

/* ===== END ELYVARA PHASE 10 PARKING ===== */



/* ===== ELYVARA SKINS R4 FINAL CANDIDATE ===== */
.skin-r4-advanced,.skin-r4-pattern-safety,.skin-r4-publish,.skin-r4-products{margin-top:14px;padding:14px;background:rgba(4,20,15,.48);border:1px solid rgba(58,159,141,.17)}
.skin-r4-advanced-head,.skin-r4-products-head,.skin-player-section-head,.skin-r4-publish-actions{display:flex;align-items:center;justify-content:space-between;gap:12px}
.skin-r4-advanced-head strong,.skin-r4-products-head strong{color:#ead7ad}.skin-r4-advanced-head small,.skin-player-section-head small{display:block;margin-top:4px;color:#82968d;font-size:10px}
.skin-r4-advanced-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px}
.skin-r4-advanced-grid label{display:flex;align-items:center;gap:8px;padding:8px;border:1px solid rgba(255,255,255,.06);border-radius:9px;color:#9eb1a8;font-size:10px}.skin-r4-advanced-grid input[type=color]{margin-left:auto;width:42px;height:28px;padding:0;border:0;background:transparent}
.skin-r4-check{display:flex;gap:10px;align-items:flex-start;color:#a7bbb1;font-size:11px}.skin-r4-check span{display:flex;flex-direction:column;gap:4px}.skin-r4-check strong{color:#e2c88f}.skin-r4-check small{color:#7f958b;line-height:1.45}.skin-r4-check.compact{margin:10px 0}
.skin-r4-publish-grid{display:grid;grid-template-columns:2fr 1fr;gap:10px}.skin-r4-publish textarea,.skin-r4-publish input{width:100%;box-sizing:border-box}.skin-r4-publish-actions{margin-top:10px}.skin-r4-publish-actions .skin-game-test-status{flex:1}
.skin-r4-product-list{display:grid;gap:8px;margin-top:10px}.skin-r4-admin-product{display:grid;grid-template-columns:72px minmax(0,1fr) auto;align-items:center;gap:10px;padding:8px;border:1px solid rgba(255,255,255,.06);border-radius:10px;background:rgba(255,255,255,.02)}.skin-r4-admin-product.disabled{opacity:.55}.skin-r4-admin-product img{width:72px;height:54px;object-fit:cover;border-radius:7px;background:#07130f}.skin-r4-admin-product div{display:flex;flex-direction:column;gap:4px}.skin-r4-admin-product strong{color:#decda5}.skin-r4-admin-product small{color:#83988e;font-size:9px}
.skin-player-head{padding:14px 16px;display:flex;justify-content:space-between;align-items:center;gap:15px}.skin-player-head>div:first-child{display:flex;align-items:baseline;gap:8px}.skin-player-head small{color:#7f988c;font-size:9px}.skin-player-head strong{color:#e7bd68;font-size:25px}.skin-player-head span{color:#9bac9f;font-size:10px}.skin-player-section{padding:16px;margin-top:12px}.skin-player-section-head{margin-bottom:2px}.skin-shop-card p{min-height:34px;color:#82968d;font-size:10px;line-height:1.45}.skin-shop-card .skin-action{width:100%;margin-top:9px}.skin-species-tag{display:inline-block;color:#58cdb4;font-size:9px;letter-spacing:.08em;text-transform:uppercase}.skin-profile-meta{margin-top:4px;color:#70877c;font-size:9px}.skin-owned-badge{margin-top:8px;padding:5px 7px;border:1px solid rgba(58,159,141,.2);border-radius:6px;color:#61cdb5;font-size:8px;letter-spacing:.05em}.skin-player-note{margin-top:12px}
@media(max-width:760px){.skin-r4-advanced-grid,.skin-r4-publish-grid{grid-template-columns:1fr}.skin-r4-admin-product{grid-template-columns:56px minmax(0,1fr)}.skin-r4-admin-product button{grid-column:1/-1}.skin-player-head{align-items:flex-start;flex-direction:column}}
.skin-r4-wallet-admin{margin-top:14px;padding:14px;background:rgba(4,20,15,.48);border:1px solid rgba(58,159,141,.17)}.skin-r4-wallet-row{display:grid;grid-template-columns:140px minmax(0,1fr) auto;gap:8px;margin:10px 0}.skin-r4-wallet-row input{width:100%;box-sizing:border-box}@media(max-width:760px){.skin-r4-wallet-row{grid-template-columns:1fr}}
/* ===== END ELYVARA SKINS R4 FINAL CANDIDATE ===== */

/* ===== ÉLYVARA HOME + QUESTS R1 • 2026-08-10 ===== */
.server-panel-clean{display:flex;flex-direction:column;justify-content:center}
.server-panel-clean .server-state{margin-top:22px}
.server-state.offline{color:#9c716b}
.server-clean-list{display:grid;gap:0;margin-top:22px;border-top:1px solid rgba(255,255,255,.055)}
.server-clean-list>div{display:flex;justify-content:space-between;align-items:center;padding:15px 2px;border-bottom:1px solid rgba(255,255,255,.055)}
.server-clean-list span{color:#8aa197;font-size:11px}.server-clean-list strong{font-size:18px;color:#e6c06f}
.home-live-map{height:220px;border:1px solid rgba(54,166,162,.22);border-radius:12px;overflow:hidden;position:relative;background:#071c15}
.home-live-map>img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.82) brightness(.78)}
.home-live-map:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(4,17,13,.05),rgba(4,17,13,.30));box-shadow:inset 0 0 32px rgba(0,0,0,.38)}
.own-map-marker{position:absolute;z-index:4;width:30px;height:30px;border-radius:50%;transform:translate(-50%,-50%);background:#1bbf9d;border:2px solid #e6f8ef;box-shadow:0 0 0 6px rgba(27,191,157,.16),0 0 24px rgba(27,191,157,.65);display:grid;place-items:center;color:#07251c}
.own-map-marker span{display:block;font-size:14px;transform:rotate(var(--yaw,0deg))}
.home-map-state{position:absolute;left:10px;right:10px;bottom:10px;z-index:5;padding:8px 10px;border-radius:8px;background:rgba(3,17,12,.84);border:1px solid rgba(64,174,148,.18);color:#a3bbb0;font-size:10px;text-align:center;backdrop-filter:blur(8px)}
.home-map-state.compact{left:auto;right:10px;width:auto;color:#8edec9}
.daily-wheel-card{overflow:hidden;min-height:355px}.wheel-wrap{position:relative;display:grid;justify-items:center;padding:4px 14px 15px}.wheel-pointer{position:absolute;z-index:5;top:-1px;font-size:30px;color:#e3b65c;text-shadow:0 2px 10px #000}
.wheel-disc{width:210px;height:210px;border-radius:50%;position:relative;margin:18px 0 12px;border:4px solid #b78334;box-shadow:inset 0 0 0 3px rgba(234,194,104,.22),0 0 28px rgba(26,139,108,.10);background:conic-gradient(#153b2c 0deg 32.72deg,#0c2a20 32.72deg 65.44deg,#174636 65.44deg 98.16deg,#0b241c 98.16deg 130.88deg,#1a4d3b 130.88deg 163.6deg,#0d2b21 163.6deg 196.32deg,#164132 196.32deg 229.04deg,#0b241c 229.04deg 261.76deg,#1b503c 261.76deg 294.48deg,#102f25 294.48deg 327.2deg,#1b5a43 327.2deg 360deg);transition:transform 2.6s cubic-bezier(.12,.62,.16,1)}
.wheel-disc:before{content:"✦";position:absolute;inset:50% auto auto 50%;width:48px;height:48px;border-radius:50%;transform:translate(-50%,-50%);display:grid;place-items:center;background:#153326;border:2px solid #d5a94f;color:#eac875;font-size:23px;z-index:3;box-shadow:0 0 18px #07100c}
.wheel-label{position:absolute;transform:translate(-50%,-50%);min-width:30px;text-align:center;color:#fff1c9;font-weight:900;font-size:10px;line-height:1;padding:3px 4px;border-radius:5px;background:rgba(3,20,15,.40);text-shadow:0 1px 4px #000;z-index:2;pointer-events:none}
.wheel-prize-text{font-weight:800;color:#71d1b7;font-size:12px}.wheel-button{width:100%;margin-top:9px}.wheel-message{min-height:28px;text-align:center;color:#789488;font-size:9px;line-height:1.45;margin-top:8px}.footer-stats-player{grid-template-columns:repeat(4,1fr)}
.quest-page-head{display:flex;flex-direction:column;align-items:flex-start}.daily-reward-banner{display:grid;grid-template-columns:80px 1fr auto;gap:18px;align-items:center;padding:20px 24px;margin-bottom:12px;background:radial-gradient(circle at 7% 50%,rgba(42,193,154,.15),transparent 20%),rgba(5,25,18,.72)}
.daily-reward-icon{width:66px;height:66px;border-radius:16px;display:grid;place-items:center;font-size:36px;color:#52d7b4;background:rgba(17,84,66,.35);border:1px solid rgba(73,207,169,.28);box-shadow:0 0 26px rgba(45,187,150,.10)}
.daily-reward-copy small{display:block;color:#d9ad59;font-size:10px;font-weight:900;letter-spacing:.11em}.daily-reward-copy strong{display:block;color:#70d0b4;font-size:30px;margin:3px 0}.daily-reward-copy span{color:#8ba298;font-size:11px}.daily-reward-action{display:grid;gap:7px;min-width:210px}.daily-reward-action span{font-size:9px;color:#80988d;text-align:center}
.quest-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:12px}.quest-main{min-width:0}.quest-tabs{display:flex;flex-wrap:wrap;gap:6px;padding:8px 0 11px}.quest-tab{border:1px solid rgba(57,151,128,.20);border-radius:9px;background:rgba(5,27,20,.64);color:#a8bbb2;padding:8px 12px;cursor:pointer;font-size:10px}.quest-tab:hover,.quest-tab.active{border-color:rgba(220,166,76,.55);background:rgba(65,45,16,.32);color:#f0c871}.quest-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.quest-card{position:relative;padding:13px;border:1px solid rgba(59,155,132,.20);border-radius:12px;background:linear-gradient(155deg,rgba(6,31,23,.90),rgba(4,20,15,.82));min-height:220px;display:flex;flex-direction:column}.quest-card.claimed{opacity:.72}.quest-card.tracking-pending{border-style:dashed}.quest-card-top{display:grid;grid-template-columns:34px 1fr auto;gap:9px;align-items:start}.quest-icon{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(213,160,78,.32);color:#e8b860;background:rgba(79,53,17,.27);font-size:17px}.quest-card h3{font-size:12px;line-height:1.25;margin:1px 0 3px;color:#eee7d8}.quest-card-top div:nth-child(2)>span{font-size:8px;color:#718e81}.difficulty{font-size:8px;padding:4px 7px;border-radius:6px;border:1px solid rgba(255,255,255,.08)}.difficulty.facile{color:#77d4a8;border-color:rgba(72,190,126,.35)}.difficulty.moyen{color:#e8bd59;border-color:rgba(225,166,55,.38)}.difficulty.difficile{color:#ef8c72;border-color:rgba(218,82,50,.40)}.quest-reward{display:flex;align-items:baseline;gap:6px;margin:13px 0 8px}.quest-reward b{color:#5ed5b2;font-size:17px}.quest-reward span{font-size:8px;color:#739185}.quest-progress>div{height:5px;border-radius:5px;background:rgba(255,255,255,.06);overflow:hidden}.quest-progress>div>span{display:block;height:100%;background:linear-gradient(90deg,#2bbd96,#73d5b2)}.quest-progress small{display:block;text-align:right;color:#9eb4aa;font-size:8px;margin-top:4px}.quest-note{color:#8f776c;font-size:8px;line-height:1.35;margin:7px 0}.quest-claim{margin-top:auto;padding:7px 9px;font-size:9px}.quest-summary{padding:8px 14px 14px;align-self:start;position:sticky;top:64px}.quest-summary-card{padding:14px 4px;border-bottom:1px solid rgba(255,255,255,.055)}.quest-summary-card small{display:block;color:#789187;text-transform:uppercase;font-size:8px;letter-spacing:.08em}.quest-summary-card strong{display:block;color:#65cbae;font-size:27px;margin:5px 0 2px}.quest-summary-card span{color:#8ca298;font-size:9px}.quest-summary-card.wallet strong{color:#e2bb65}.quest-reset{display:grid;gap:4px;padding-top:14px}.quest-reset small{color:#647e72;font-size:8px;text-transform:uppercase}.quest-reset span{color:#b9c5bf;font-size:10px;margin-bottom:8px}.quest-toast{position:fixed;right:24px;bottom:24px;z-index:999;padding:12px 15px;border-radius:10px;background:#0a3125;border:1px solid rgba(77,210,171,.35);color:#98ead2;box-shadow:0 12px 40px rgba(0,0,0,.35);font-size:11px}.quest-toast.error{background:#331914;border-color:rgba(230,103,80,.38);color:#efb0a3}
.live-markers .own-map-marker{position:absolute}.map-own-only-note{color:#779187;font-size:9px}.live-map-footer.own-only{justify-content:flex-end}
@media(max-width:1200px){.quest-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.quest-layout{grid-template-columns:minmax(0,1fr) 250px}}
@media(max-width:900px){.quest-layout{grid-template-columns:1fr}.quest-summary{position:static}.daily-reward-banner{grid-template-columns:60px 1fr}.daily-reward-action{grid-column:1/-1}.footer-stats-player{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.quest-grid{grid-template-columns:1fr}.footer-stats-player{grid-template-columns:1fr}}


/* ===== ELYVARA MAP VISUAL R2.5 ===== */


/*
 * GATEWAY
 */

.live-map-viewport {

    position:
        relative !important;

    overflow:
        hidden !important;

    background:
        #04110d !important;
}


.live-map-canvas {

    position:
        absolute !important;

    left:
        0 !important;

    top:
        0 !important;

    transform-origin:
        0 0 !important;

    opacity:
        1 !important;

    visibility:
        visible !important;

    filter:
        none !important;

    z-index:
        1 !important;
}


.live-map-image {

    position:
        absolute !important;

    left:
        0 !important;

    top:
        0 !important;

    width:
        100% !important;

    height:
        100% !important;

    display:
        block !important;

    opacity:
        1 !important;

    visibility:
        visible !important;

    filter:
        none !important;

    mix-blend-mode:
        normal !important;

    pointer-events:
        none !important;

    z-index:
        1 !important;
}


/*
 * Le calque marqueur est maintenant placé
 * directement dans le viewport.
 */

.live-markers {

    position:
        absolute !important;

    left:
        0 !important;

    top:
        0 !important;

    right:
        0 !important;

    bottom:
        0 !important;

    pointer-events:
        none !important;

    overflow:
        hidden !important;

    z-index:
        50 !important;
}


/*
 * MARQUEUR JOUEUR
 *
 * Taille constante à l'écran.
 */

.elyvara-map-player-purple {

    position:
        absolute !important;

    width:
        42px !important;

    height:
        42px !important;

    transform:
        translate(-50%, -50%) !important;

    border-radius:
        50% !important;

    pointer-events:
        none !important;

    z-index:
        100 !important;

    transition:
        left .42s linear,
        top .42s linear;
}


/*
 * Grande onde violette.
 */

.elyvara-map-player-purple::before {

    content:
        "" !important;

    position:
        absolute !important;

    left:
        50% !important;

    top:
        50% !important;

    width:
        54px !important;

    height:
        54px !important;

    transform:
        translate(-50%, -50%) scale(.50);

    border-radius:
        50% !important;

    border:
        3px solid #d946ff !important;

    box-shadow:

        0 0 10px #d946ff,

        0 0 22px #c026ff,

        0 0 38px #9333ea,

        0 0 58px rgba(126, 34, 206, .95) !important;

    animation:
        elyvaraMapPurplePulse
        1.5s
        ease-out
        infinite;
}


/*
 * Halo permanent.
 */

.elyvara-map-player-purple::after {

    content:
        "" !important;

    position:
        absolute !important;

    left:
        50% !important;

    top:
        50% !important;

    width:
        34px !important;

    height:
        34px !important;

    transform:
        translate(-50%, -50%) !important;

    border-radius:
        50% !important;

    background:
        rgba(192, 38, 255, .42) !important;

    box-shadow:

        0 0 16px #c026ff,

        0 0 30px #9333ea,

        0 0 45px rgba(126, 34, 206, .90) !important;

    filter:
        blur(3px) !important;
}


/*
 * Coeur violet.
 *
 * Aucun turquoise.
 * Aucun vert.
 */

.elyvara-map-player-purple-core {

    position:
        absolute !important;

    left:
        50% !important;

    top:
        50% !important;

    width:
        24px !important;

    height:
        24px !important;

    transform:
        translate(-50%, -50%) !important;

    border-radius:
        50% !important;

    border:
        2px solid #f0abfc !important;

    background:
        #c026ff !important;

    background-image:

        radial-gradient(
            circle at 35% 30%,

            #f5d0fe 0%,

            #e879f9 15%,

            #d946ef 30%,

            #c026ff 52%,

            #9333ea 75%,

            #6b21a8 100%
        ) !important;

    box-shadow:

        inset 0 0 6px
        rgba(255,255,255,.55),

        0 0 8px
        #e879f9,

        0 0 16px
        #c026ff,

        0 0 28px
        #9333ea,

        0 0 42px
        rgba(107, 33, 168, .95) !important;

    z-index:
        5 !important;
}


@keyframes elyvaraMapPurplePulse {

    0% {

        transform:
            translate(-50%, -50%)
            scale(.45);

        opacity:
            1;
    }


    60% {

        opacity:
            .55;
    }


    100% {

        transform:
            translate(-50%, -50%)
            scale(1.55);

        opacity:
            0;
    }
}


/*
 * Message d'attente DANS le viewport,
 * pas fixed dans toute la fenêtre.
 */

.live-markers .map-waiting {

    position:
        absolute !important;

    left:
        50% !important;

    bottom:
        24px !important;

    transform:
        translateX(-50%) !important;

    width:
        min(470px, calc(100% - 40px)) !important;

    z-index:
        200 !important;
}


/* ===== FIN ELYVARA MAP VISUAL R2.5 ===== */


/* ===== ELYVARA MARKER SIZE R2.6 ===== */

.elyvara-map-player-purple {

    width:
        34px !important;

    height:
        34px !important;
}


.elyvara-map-player-purple::before {

    width:
        44px !important;

    height:
        44px !important;

    border-width:
        2px !important;
}


.elyvara-map-player-purple::after {

    width:
        28px !important;

    height:
        28px !important;
}


.elyvara-map-player-purple-core {

    width:
        19px !important;

    height:
        19px !important;

    border-width:
        2px !important;
}


/* ===== FIN ELYVARA MARKER SIZE R2.6 ===== */


/* ===== ELYVARA HOME LIVE MAP R1 ===== */


.elyvara-home-live-map {

    position:
        relative;

    width:
        100%;

    height:
        220px;

    overflow:
        hidden;

    border:
        1px solid
        rgba(63, 179, 156, .20);

    border-radius:
        13px;

    background:
        #03110d;
}


/*
 * Toute Gateway visible.
 * Pas de faux fond / pas de mockup.
 */
.elyvara-home-live-map-image {

    position:
        absolute;

    inset:
        0;

    width:
        100%;

    height:
        100%;

    display:
        block;

    object-fit:
        contain;

    background:
        #03110d;

    pointer-events:
        none;

    user-select:
        none;
}


.elyvara-home-live-map-layer {

    position:
        absolute;

    inset:
        0;

    z-index:
        5;

    pointer-events:
        none;
}


/*
 * Petit marqueur violet pour l'aperçu.
 */
.elyvara-home-live-marker {

    position:
        absolute;

    width:
        26px;

    height:
        26px;

    transform:
        translate(-50%, -50%);

    border-radius:
        50%;

    transition:
        left .75s linear,
        top .75s linear;

    z-index:
        20;
}


.elyvara-home-live-marker::before {

    content:
        "";

    position:
        absolute;

    left:
        50%;

    top:
        50%;

    width:
        34px;

    height:
        34px;

    transform:
        translate(-50%, -50%)
        scale(.5);

    border:
        2px solid
        #d946ff;

    border-radius:
        50%;

    box-shadow:

        0 0 8px
        #d946ff,

        0 0 18px
        #c026ff,

        0 0 30px
        rgba(147, 51, 234, .90);

    animation:
        elyvaraHomeMapPulse
        1.5s
        ease-out
        infinite;
}


.elyvara-home-live-marker-core {

    position:
        absolute;

    left:
        50%;

    top:
        50%;

    width:
        15px;

    height:
        15px;

    transform:
        translate(-50%, -50%);

    border-radius:
        50%;

    border:
        2px solid
        #f0abfc;

    background:
        #c026ff;

    box-shadow:

        0 0 7px
        #e879f9,

        0 0 15px
        #c026ff,

        0 0 24px
        rgba(147, 51, 234, .95);
}


@keyframes elyvaraHomeMapPulse {

    0% {

        transform:
            translate(-50%, -50%)
            scale(.45);

        opacity:
            1;
    }


    100% {

        transform:
            translate(-50%, -50%)
            scale(1.45);

        opacity:
            0;
    }
}


.elyvara-home-live-map-status {

    position:
        absolute;

    right:
        9px;

    bottom:
        9px;

    max-width:
        calc(100% - 18px);

    padding:
        6px 9px;

    border:
        1px solid
        rgba(72, 205, 179, .18);

    border-radius:
        8px;

    color:
        #c6e9df;

    background:
        rgba(3, 19, 14, .88);

    backdrop-filter:
        blur(7px);

    font-size:
        10px;

    line-height:
        1.2;

    z-index:
        30;

    white-space:
        nowrap;

    overflow:
        hidden;

    text-overflow:
        ellipsis;
}


@media (max-width: 800px) {

    .elyvara-home-live-map {

        height:
            190px;
    }
}


/* ===== FIN ELYVARA HOME LIVE MAP R1 ===== */

/* ===== ELYVARA BANK + QUEST R1 ===== */


.quest-card.claimable-first {

    border-color:
        rgba(
            226,
            181,
            80,
            .52
        );

    box-shadow:
        0 0 0 1px
        rgba(
            226,
            181,
            80,
            .08
        ),

        0 14px 34px
        rgba(
            0,
            0,
            0,
            .16
        );
}


.quest-card.claimable-first
.quest-claim {

    box-shadow:
        0 0 18px
        rgba(
            80,
            215,
            180,
            .14
        );
}


.bank-layout {

    display:
        grid;

    grid-template-columns:
        minmax(280px, .8fr)
        minmax(420px, 1.4fr);

    gap:
        14px;

    align-items:
        start;
}


.bank-balance-card,
.bank-transfer-card {

    padding:
        22px;
}


.bank-eyebrow {

    color:
        #7fa697;

    font-size:
        10px;

    letter-spacing:
        .14em;

    font-weight:
        800;
}


.bank-balance-line {

    display:
        flex;

    align-items:
        baseline;

    gap:
        9px;

    margin-top:
        10px;
}


.bank-balance-line strong {

    color:
        #e7c46e;

    font-size:
        clamp(
            38px,
            4vw,
            60px
        );

    line-height:
        1;

    letter-spacing:
        -.04em;
}


.bank-balance-line span {

    color:
        #78cfb8;

    font-size:
        13px;

    font-weight:
        700;
}


.bank-balance-card > p {

    margin:
        12px 0 0;

    color:
        #91a9a0;

    font-size:
        11px;
}


.bank-security {

    margin-top:
        24px;

    padding:
        13px 14px;

    border:
        1px solid
        rgba(
            70,
            184,
            158,
            .16
        );

    border-radius:
        12px;

    background:
        rgba(
            4,
            31,
            23,
            .58
        );
}


.bank-security strong,
.bank-security span {

    display:
        block;
}


.bank-security strong {

    color:
        #bedbd1;

    font-size:
        11px;
}


.bank-security span {

    margin-top:
        5px;

    color:
        #779488;

    font-size:
        10px;

    line-height:
        1.5;
}


.bank-panel-title {

    padding:
        0 0 16px;
}


.bank-mini-button {

    padding:
        7px 10px;

    border:
        1px solid
        rgba(
            68,
            189,
            161,
            .22
        );

    border-radius:
        9px;

    color:
        #83d7c1;

    background:
        rgba(
            3,
            29,
            21,
            .72
        );

    font-size:
        10px;

    cursor:
        pointer;
}


.bank-field {

    margin-top:
        14px;
}


.bank-field label {

    display:
        block;

    margin-bottom:
        7px;

    color:
        #bdd3ca;

    font-size:
        11px;

    font-weight:
        700;
}


.bank-field select,
.bank-field input {

    width:
        100%;

    min-height:
        44px;

    padding:
        0 12px;

    border:
        1px solid
        rgba(
            65,
            172,
            150,
            .20
        );

    border-radius:
        10px;

    outline:
        none;

    color:
        #e1eee9;

    background:
        rgba(
            3,
            25,
            18,
            .78
        );
}


.bank-field small {

    display:
        block;

    margin-top:
        7px;

    color:
        #728e83;

    font-size:
        10px;
}


.bank-amount-wrap {

    position:
        relative;
}


.bank-amount-wrap input {

    padding-right:
        78px;
}


.bank-amount-wrap span {

    position:
        absolute;

    right:
        12px;

    top:
        50%;

    transform:
        translateY(-50%);

    color:
        #82a69a;

    font-size:
        10px;

    font-weight:
        700;
}


.bank-send-button {

    width:
        100%;

    margin-top:
        20px;

    min-height:
        46px;
}


.bank-transfer-help {

    margin:
        10px 0 0;

    color:
        #708c81;

    font-size:
        10px;

    line-height:
        1.5;
}


.bank-notice {

    margin-bottom:
        12px;

    padding:
        12px 14px;

    border-radius:
        11px;

    font-size:
        11px;
}


.bank-notice.ok {

    border:
        1px solid
        rgba(
            68,
            199,
            158,
            .28
        );

    color:
        #9ee2cd;

    background:
        rgba(
            10,
            68,
            49,
            .36
        );
}


.bank-notice.error {

    border:
        1px solid
        rgba(
            218,
            91,
            91,
            .30
        );

    color:
        #efabab;

    background:
        rgba(
            79,
            20,
            20,
            .34
        );
}


@media (
    max-width:
        900px
) {

    .bank-layout {

        grid-template-columns:
            1fr;
    }
}


/* ===== FIN ELYVARA BANK + QUEST R1 ===== */


/* ===== ELYVARA MES STATS LIVE R1 ===== */


.stats-page-head {

    display:
        flex;

    justify-content:
        space-between;

    align-items:
        center;

    gap:
        18px;
}


.stats-live-badge {

    padding:
        8px 12px;

    border-radius:
        999px;

    font-size:
        10px;

    font-weight:
        900;

    letter-spacing:
        .08em;
}


.stats-live-badge.live {

    color:
        #91e5ca;

    border:
        1px solid
        rgba(68, 199, 158, .32);

    background:
        rgba(19, 83, 63, .34);

    box-shadow:
        0 0 18px
        rgba(49, 178, 139, .09);
}


.stats-live-badge.waiting {

    color:
        #cfb977;

    border:
        1px solid
        rgba(204, 169, 83, .22);

    background:
        rgba(76, 58, 17, .25);
}


.stats-notice {

    padding:
        18px;

    border:
        1px solid
        rgba(80, 175, 153, .15);

    border-radius:
        13px;

    color:
        #8eaaa0;

    background:
        rgba(4, 24, 18, .66);
}


.stats-content {

    display:
        block;
}


.stats-hero {

    display:
        grid;

    grid-template-columns:
        minmax(0, 1fr)
        minmax(240px, 340px);

    align-items:
        center;

    gap:
        26px;

    padding:
        24px;
}


.stats-eyebrow {

    color:
        #759b8e;

    font-size:
        10px;

    font-weight:
        900;

    letter-spacing:
        .15em;
}


.stats-hero h2 {

    margin:
        7px 0 4px;

    color:
        #e4eee9;

    font-size:
        clamp(30px, 4vw, 48px);

    line-height:
        1;
}


.stats-hero > div > span:last-child {

    color:
        #718d82;

    font-size:
        10px;
}


.stats-growth-main {

    padding:
        16px;

    border:
        1px solid
        rgba(205, 170, 81, .18);

    border-radius:
        13px;

    background:
        rgba(45, 34, 10, .24);
}


.stats-growth-main small {

    display:
        block;

    color:
        #b99b58;

    font-size:
        9px;

    font-weight:
        900;

    letter-spacing:
        .13em;
}


.stats-growth-main strong {

    display:
        block;

    margin:
        6px 0 10px;

    color:
        #e7c46e;

    font-size:
        30px;
}


.stats-section-title {

    margin:
        20px 0 9px;

    color:
        #708f83;

    font-size:
        10px;

    font-weight:
        900;

    letter-spacing:
        .14em;
}


.stats-vitals-grid {

    display:
        grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap:
        12px;
}


.stats-metric {

    padding:
        17px;
}


.stats-metric-head {

    display:
        flex;

    justify-content:
        space-between;

    align-items:
        center;

    gap:
        10px;
}


.stats-metric-head span {

    color:
        #9fbab0;

    font-size:
        11px;

    font-weight:
        700;
}


.stats-metric-head strong {

    color:
        #dfece7;

    font-size:
        17px;
}


.stats-metric > small {

    display:
        block;

    margin-top:
        8px;

    color:
        #66857a;

    font-size:
        9px;
}


.stats-progress {

    position:
        relative;

    height:
        7px;

    margin-top:
        11px;

    overflow:
        hidden;

    border-radius:
        999px;

    background:
        rgba(110, 153, 139, .12);
}


.stats-progress.large {

    height:
        9px;
}


.stats-progress > span {

    display:
        block;

    width:
        0;

    height:
        100%;

    border-radius:
        inherit;

    background:
        linear-gradient(
            90deg,
            #287c67,
            #66c4aa
        );

    box-shadow:
        0 0 12px
        rgba(87, 197, 167, .22);

    transition:
        width .65s ease;
}


.stats-progress.large > span {

    background:
        linear-gradient(
            90deg,
            #9d782f,
            #e1bc61
        );

    box-shadow:
        0 0 13px
        rgba(218, 177, 80, .18);
}


.stats-progress > span.unavailable {

    width:
        0 !important;
}


.stats-state-grid {

    display:
        grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap:
        12px;
}


.stats-state-card {

    display:
        flex;

    align-items:
        center;

    gap:
        14px;

    min-height:
        104px;

    padding:
        18px;

    transition:
        border-color .2s ease,
        background .2s ease;
}


.stats-state-icon {

    display:
        grid;

    place-items:
        center;

    width:
        44px;

    height:
        44px;

    flex:
        0 0 44px;

    border-radius:
        50%;

    color:
        #83b9aa;

    border:
        1px solid
        rgba(89, 173, 151, .18);

    background:
        rgba(19, 69, 55, .25);

    font-size:
        20px;
}


.stats-state-card small,
.stats-state-card strong,
.stats-state-card div > span {

    display:
        block;
}


.stats-state-card small {

    color:
        #68887c;

    font-size:
        9px;

    font-weight:
        900;

    letter-spacing:
        .12em;
}


.stats-state-card strong {

    margin-top:
        4px;

    color:
        #d9e8e2;

    font-size:
        15px;
}


.stats-state-card div > span {

    margin-top:
        4px;

    color:
        #66847a;

    font-size:
        9px;
}


.stats-state-card.good {

    border-color:
        rgba(61, 176, 142, .22);
}


.stats-state-card.alert {

    border-color:
        rgba(203, 83, 74, .48);

    background:
        rgba(80, 24, 20, .28);
}


.stats-state-card.alert
.stats-state-icon {

    color:
        #ef9a8e;

    border-color:
        rgba(222, 92, 79, .35);

    background:
        rgba(109, 35, 29, .36);
}


.stats-state-card.unavailable {

    opacity:
        .62;
}


@media (max-width: 950px) {

    .stats-vitals-grid {

        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }
}


@media (max-width: 700px) {

    .stats-page-head {

        align-items:
            flex-start;

        flex-direction:
            column;
    }


    .stats-hero {

        grid-template-columns:
            1fr;
    }


    .stats-vitals-grid,
    .stats-state-grid {

        grid-template-columns:
            1fr;
    }
}


/* ===== FIN ELYVARA MES STATS LIVE R1 ===== */