/* Skeletal Hosting v58.1 — cinematic skin for the established v58 UI.
   All navigation, endpoints, form semantics and permissions remain owned by v58 and the server.
   Only bundled, compressed, same-origin artwork is used; no extra fetches or third-party scripts. */
:root {
  --v581-arcane:#ce69ff;
  --v581-gold:#ffc979;
  --v581-cyan:#70dbff;
  --v581-green:#54eab6;
}
.layout {background:
  radial-gradient(ellipse at 73% -15%,rgba(134,38,220,.12),transparent 42%),
  radial-gradient(ellipse at 7% 82%,rgba(65,25,120,.11),transparent 46%),#080b18}
.layout main {isolation:isolate}
.layout aside.v58-sidebar{
  background:
    linear-gradient(180deg,rgba(14,8,29,.91) 0%,rgba(12,8,25,.97) 42%,#0a0b17 88%),
    url('/assets/v581-sidebar.webp') center top / auto 62% no-repeat !important;
  box-shadow:inset -1px 0 rgba(225,137,255,.10),6px 0 24px rgba(0,0,0,.18);
}
.layout .brand{position:relative;text-shadow:0 0 18px rgba(199,71,255,.25)}
.layout .brand b {color:#eb9cff}
.v58-topbar{position:relative;padding:9px 0 15px;margin-bottom:20px;border-bottom-color:rgba(178,95,239,.30)}
.v58-topbar:after{position:absolute;content:"";height:1px;width:min(265px,45%);background:linear-gradient(90deg,rgba(219,120,255,.8),transparent);left:0;bottom:-1px;pointer-events:none}
button.v58-quick-search{box-shadow:inset 0 1px rgba(242,190,255,.06)}
.v58-topbar-actions>a{background:rgba(16,12,33,.55)}
/* The hero has a deliberate left-side reading zone: title / status never overlap the dinosaur. */
.v58-hero {
  min-height:251px;padding:36px clamp(24px,3vw,46px);
  border-color:rgba(230,126,255,.42);
  background:#130a28 url('/assets/v581-hero.webp') 55% 42%/cover no-repeat;
  box-shadow:0 18px 50px rgba(4,2,18,.38),inset 0 0 0 1px rgba(234,174,255,.08);
}
.v58-hero:before{
  background:linear-gradient(90deg,rgba(6,5,19,.97) 0%,rgba(8,5,27,.92) 24%,rgba(10,7,30,.72) 46%,rgba(12,7,28,.08) 84%),
    linear-gradient(0deg,rgba(9,5,24,.74),transparent 48%);
}
.v58-hero:after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(ellipse at 70% 0%,rgba(224,68,255,.11),transparent 53%);
  box-shadow:inset 0 1px rgba(246,186,255,.16)}
.v58-hero-inner{max-width:720px}
.v58-eyebrow{letter-spacing:.22em;color:#dfc4ff;text-shadow:0 1px 7px #12051c}
.v58-hero h1{font-size:clamp(28px,3.3vw,46px);max-width:630px;letter-spacing:-.045em;
  background:linear-gradient(110deg,#fff 0%,#f3daff 36%,#cf86ff 75%,#f7d3ff 100%);
  background-clip:text;-webkit-background-clip:text;color:transparent;
  text-shadow:none;filter:drop-shadow(0 2px 10px rgba(125,24,201,.25));}
.v58-hero p{font-size:12px;color:#e8d9f3;max-width:505px}
.v58-status-chip{border-color:rgba(111,237,179,.29);background:rgba(8,23,24,.82);box-shadow:0 5px 16px rgba(0,0,0,.16)}
.v58-status-chip.muted{background:rgba(22,11,42,.82)}
/* Gem-like status tiles keep information legible and do not pretend to supply new metrics. */
.v58-metric{
  position:relative;overflow:hidden;align-items:center;min-height:94px;
  border-color:rgba(137,99,207,.37);background:
    radial-gradient(circle at 97% 3%,rgba(143,69,223,.20),transparent 49%),
    linear-gradient(130deg,rgba(28,20,49,.97),rgba(12,17,37,.96));
  box-shadow:0 8px 23px rgba(0,0,0,.14),inset 0 1px rgba(222,186,255,.06);
  transition:transform .18s,border-color .18s,box-shadow .18s;
}
.v58-metric:after{content:"";position:absolute;inset:auto -10% -35% 29%;height:65%;pointer-events:none;
  background:radial-gradient(ellipse,rgba(144,47,237,.13),transparent 70%)}
.v58-metric:nth-child(2){border-color:rgba(240,102,187,.27)}
.v58-metric:nth-child(3){border-color:rgba(214,116,255,.31)}
.v58-metric:nth-child(4){border-color:rgba(75,183,250,.32)}
.v58-metric:nth-child(5){border-color:rgba(73,217,171,.27)}
.v58-metric-icon{
  width:46px;height:46px;flex-basis:46px;border:1px solid rgba(222,166,255,.20);
  background:linear-gradient(135deg,rgba(187,75,255,.25),rgba(77,34,151,.13));
  box-shadow:0 0 22px rgba(150,51,245,.17);text-shadow:0 0 12px rgba(218,107,255,.55)}
.v58-metric-value{font-size:clamp(18px,1.7vw,23px);letter-spacing:-.03em}
.v58-metric-label{color:#d5c1e1}
.v58-metric:hover{border-color:#d38fff;box-shadow:0 12px 27px rgba(56,10,90,.23);transform:translateY(-2px)}
/* Quick actions: six independent photographs, instead of one repeating image. */
.v58-section{position:relative;overflow:hidden;
  background:linear-gradient(155deg,rgba(20,17,38,.96),rgba(10,12,29,.98));
  border-color:rgba(128,97,194,.34);
  box-shadow:inset 0 1px rgba(228,175,255,.045),0 9px 35px rgba(0,0,0,.12)}
.v581-quick-panel{background:
  linear-gradient(110deg,rgba(21,12,41,.96),rgba(17,9,35,.87)),url('/assets/v581-activity.webp') center 30%/cover no-repeat;
  border-color:rgba(201,88,245,.48);
  box-shadow:inset 3px 0 rgba(217,75,255,.74),0 12px 32px rgba(75,9,109,.14)}
.v58-section-heading{position:relative;z-index:1}
.v58-section-heading h2{font-size:16px;text-shadow:0 1px 15px rgba(161,60,255,.13)}
.v58-section-heading p{color:#b7a7c9;font-size:11px}
.v58-section-heading a{border:1px solid rgba(166,100,224,.31);border-radius:7px;padding:7px 9px;background:rgba(8,7,24,.38)}
.v58-section-heading a:hover{color:white;border-color:#d18cf7}
.v58-quick-grid{position:relative;z-index:1;gap:11px}
.v58-quick-card{
  min-height:168px;padding:14px 13px;gap:7px;
  background-color:#1c1030;
  background-image:linear-gradient(180deg,rgba(10,5,25,.10) 0%,rgba(8,6,21,.56) 44%,rgba(7,7,20,.96) 100%),url('/assets/v581-tickets.webp');
  background-size:cover;background-position:48% center;
  border-color:rgba(167,122,223,.41);box-shadow:0 5px 18px rgba(0,0,0,.17),inset 0 1px rgba(255,255,255,.10);
  transition:transform .18s,box-shadow .18s,border-color .18s;
}
.v58-quick-card:nth-child(2){background-image:linear-gradient(180deg,rgba(10,5,25,.09),rgba(8,6,21,.51) 44%,rgba(7,7,20,.96)),url('/assets/v581-seasons.webp')}
.v58-quick-card:nth-child(3){background-image:linear-gradient(180deg,rgba(5,13,28,.08),rgba(6,15,25,.55) 44%,rgba(7,10,21,.97)),url('/assets/v581-cluster.webp');border-color:rgba(99,181,250,.35)}
.v58-quick-card:nth-child(4){background-image:linear-gradient(180deg,rgba(10,5,25,.08),rgba(17,8,21,.48) 44%,rgba(7,7,20,.96)),url('/assets/v581-hall.webp');border-color:rgba(236,184,92,.39)}
.v58-quick-card:nth-child(5){background-image:linear-gradient(180deg,rgba(10,5,25,.08),rgba(8,6,21,.50) 44%,rgba(7,7,20,.96)),url('/assets/v581-giveaways.webp')}
.v58-quick-card:nth-child(6){background-image:linear-gradient(180deg,rgba(10,5,25,.09),rgba(8,6,21,.54) 44%,rgba(7,7,20,.96)),url('/assets/v581-studio.webp')}
.v58-quick-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;flex:none;
  background:rgba(18,9,33,.65);border:1px solid rgba(219,135,255,.20);text-shadow:0 0 12px rgba(207,100,255,.64)}
.v58-quick-card strong{font-size:12px;font-weight:800;color:#fff;text-shadow:0 2px 8px #070614}
.v58-quick-card small{color:#e2d6eb;font-size:10px;text-shadow:0 1px 7px #070614}
.v58-quick-card:hover{border-color:#e3a0ff;transform:translateY(-3px);box-shadow:0 11px 26px rgba(70,18,104,.32)}
/* Analytics, health and recent activity feel like cohesive, restrained control panels. */
.v581-report-panel{background:
  linear-gradient(125deg,rgba(10,14,29,.97),rgba(12,12,31,.90)),url('/assets/v581-activity.webp') center/cover no-repeat;
  border-color:rgba(69,193,160,.30)}
.v581-health-panel{background:
  linear-gradient(125deg,rgba(10,15,28,.97),rgba(9,15,30,.90)),url('/assets/v581-health.webp') 60% center/cover no-repeat;
  border-color:rgba(76,169,185,.32)}
.v581-recent-panel{background:
  linear-gradient(125deg,rgba(13,12,32,.97),rgba(13,12,32,.91)),url('/assets/v581-tickets.webp') 55% center/cover no-repeat}
.v58-chart{background:linear-gradient(180deg,rgba(8,12,24,.22),rgba(8,11,22,.04));border-radius:9px}
.v58-health-line{border-color:rgba(134,114,178,.19);color:#d1c8de}
.v58-recent-list .neon-ticket-row{border-color:rgba(144,110,206,.22)}
.v58-recent-list .neon-ticket-icon{box-shadow:inset 0 0 0 1px rgba(205,137,255,.13)}
/* Directory: make existing category and module cards feel part of the same theme. */
.v58-module-section{box-shadow:inset 0 1px rgba(255,255,255,.055);border-color:rgba(155,99,225,.31)}
.v58-module-section>summary{background:
  linear-gradient(90deg,rgba(31,14,54,.93),rgba(12,13,33,.90)),url('/assets/v581-activity.webp') center 40%/cover no-repeat}
.v58-module-section .module-card{background:
  radial-gradient(ellipse at 95% -10%,rgba(142,60,217,.20),transparent 58%),
  linear-gradient(160deg,rgba(43,23,68,.86),rgba(15,17,34,.94));
  transition:transform .16s,border-color .16s}
.v58-module-section .module-card:hover{transform:translateY(-2px)}
/* Only non-navigation visual styling changes at small widths. */
@media(max-width:950px){.v58-hero{background-position:65% 44%}.v58-quick-card{min-height:143px}}
@media(max-width:800px){.v58-hero{padding:23px;min-height:226px}.v58-hero:before{background:linear-gradient(90deg,rgba(7,5,22,.96),rgba(8,5,24,.81) 62%,rgba(8,5,24,.45))}.v58-metric{min-height:85px}.v58-quick-card{min-height:142px}}
@media(max-width:525px){.v58-hero{background-position:72% center}.v58-hero h1{font-size:27px}.v58-metric-icon{width:32px;height:32px;flex-basis:32px}.v58-quick-card{min-height:134px;padding:12px 10px}.v58-quick-icon{width:31px;height:31px}.v58-quick-card strong{font-size:11px}.v58-quick-card small{font-size:9px}.v58-section-heading h2{font-size:14px}}
@media(prefers-reduced-motion:reduce){.v58-metric,.v58-quick-card,.v58-module-section .module-card{transition:none!important}}
